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 }