game-client

Play TicTacToe and Reversi
Log | Files | Refs

style.css (1803B)


      1 @import url(./modules/typography.module.css);
      2 @import url(./modules/colors.module.css);
      3 @import url(./tokens.css);
      4 
      5 .transparent {
      6   -fx-background-color: transparent;
      7   -fx-control-inner-background: transparent;
      8   -fx-text-fill: transparent;
      9   -fx-fill: transparent;
     10 }
     11 
     12 .scroll-pane > .viewport {
     13     -fx-background-color: transparent;
     14 }
     15 
     16 .rounded {
     17   -fx-border-radius: 10px;
     18   -fx-background-radius: 10px;
     19 }
     20 
     21 .nav-button {
     22   -fx-fill: -primary-text;
     23 
     24   -fx-border-color: -primary;
     25   -fx-border-width: 0 0 0 0.4em;
     26 
     27   -fx-text-fill: -primary;
     28 }
     29 
     30 .nav-button .icon {
     31   -fx-fill: -primary;
     32   -glyph-size: 24;
     33 }
     34 
     35 .nav-button.active {
     36   -fx-background-color: -primary;
     37   -fx-fill: -primary-text;
     38 
     39   -fx-border-color: -primary-text;
     40   -fx-border-width: 0 0 0 0.4em;
     41 
     42   -fx-text-fill: -primary-text;
     43 }
     44 
     45 .nav-button.active .icon {
     46   -fx-fill: -primary-text;
     47   -glyph-size: 24;
     48 }
     49 
     50 .search-bar {
     51   -fx-background-color: -surface;
     52   -fx-background-radius: 10px;
     53 }
     54 
     55 .search-bar .icon {
     56   -fx-fill: -surface-text;
     57 }
     58 
     59 .search-textfield {
     60   -fx-text-fill: -primary;
     61 
     62   -fx-highlight-fill: -primary;
     63 
     64   -jfx-focus-color: -primary;
     65   -jfx-unfocus-color: -surface;
     66 }
     67 
     68 .search-loop,
     69 .search-close,
     70 .search-options {
     71   -fx-background-color: -surface;
     72   -fx-background-radius: 10px;
     73 }
     74 
     75 .search-loop .icon,
     76 .search-close .icon,
     77 .search-options .icon {
     78   -fx-fill: -primary;
     79   -glyph-size: 24;
     80 }
     81 
     82 .user-account {
     83   -fx-text-fill: -on-surface-text;
     84 }
     85 
     86 .user-account .icon {
     87   -fx-fill: -primary;
     88 }
     89 
     90 .settings {}
     91 
     92 .play-arrow {
     93 
     94 }
     95 
     96 .play-arrow .icon {
     97   -fx-fill: -positive;
     98 }
     99 
    100 .othello-button {
    101     -fx-background-color: #388E3C;
    102 }
    103 
    104 .ttt-grid {
    105     -fx-border-color: -on-surface;
    106     -fx-border-width: 5;
    107     -fx-border-radius: 2;
    108   }
    109 
    110 .ttt-button {
    111   -fx-background-color: -on-surface;
    112   -fx-text-fill: -on-surface-text;
    113 }