diff options
Diffstat (limited to 'viewer/src/assets/scss')
-rw-r--r-- | viewer/src/assets/scss/_buefy_variables.scss | 171 | ||||
-rw-r--r-- | viewer/src/assets/scss/buefy.scss | 47 | ||||
-rw-r--r-- | viewer/src/assets/scss/constants.scss (renamed from viewer/src/assets/scss/palette.scss) | 24 | ||||
-rw-r--r-- | viewer/src/assets/scss/global.scss | 53 | ||||
-rw-r--r-- | viewer/src/assets/scss/scrollbar.scss | 6 | ||||
-rw-r--r-- | viewer/src/assets/scss/theme.scss | 42 | ||||
-rw-r--r-- | viewer/src/assets/scss/transition.scss | 40 |
7 files changed, 102 insertions, 281 deletions
diff --git a/viewer/src/assets/scss/_buefy_variables.scss b/viewer/src/assets/scss/_buefy_variables.scss deleted file mode 100644 index e008269..0000000 --- a/viewer/src/assets/scss/_buefy_variables.scss +++ /dev/null | |||
@@ -1,171 +0,0 @@ | |||
1 | /* ldgallery - A static generator which turns a collection of tagged | ||
2 | -- pictures into a searchable web gallery. | ||
3 | -- | ||
4 | -- Copyright (C) 2019-2020 Guillaume FOUET | ||
5 | -- | ||
6 | -- This program is free software: you can redistribute it and/or modify | ||
7 | -- it under the terms of the GNU Affero General Public License as | ||
8 | -- published by the Free Software Foundation, either version 3 of the | ||
9 | -- License, or (at your option) any later version. | ||
10 | -- | ||
11 | -- This program is distributed in the hope that it will be useful, | ||
12 | -- but WITHOUT ANY WARRANTY; without even the implied warranty of | ||
13 | -- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the | ||
14 | -- GNU Affero General Public License for more details. | ||
15 | -- | ||
16 | -- You should have received a copy of the GNU Affero General Public License | ||
17 | -- along with this program. If not, see <https://www.gnu.org/licenses/>. | ||
18 | */ | ||
19 | |||
20 | // Included below are all the defined variables from Bulma | ||
21 | // Modify as needed, removing the !default attribute. | ||
22 | |||
23 | // Colors | ||
24 | |||
25 | $black: hsl(0, 0%, 4%) !default; | ||
26 | $black-bis: hsl(0, 0%, 7%) !default; | ||
27 | $black-ter: hsl(0, 0%, 14%) !default; | ||
28 | |||
29 | $grey-darker: hsl(0, 0%, 21%) !default; | ||
30 | $grey-dark: hsl(0, 0%, 29%) !default; | ||
31 | $grey: hsl(0, 0%, 48%) !default; | ||
32 | $grey-light: hsl(0, 0%, 71%) !default; | ||
33 | $grey-lighter: hsl(0, 0%, 86%) !default; | ||
34 | |||
35 | $white-ter: hsl(0, 0%, 96%) !default; | ||
36 | $white-bis: hsl(0, 0%, 98%) !default; | ||
37 | $white: hsl(0, 0%, 100%) !default; | ||
38 | |||
39 | $orange: hsl(14, 100%, 53%) !default; | ||
40 | $yellow: hsl(48, 100%, 67%) !default; | ||
41 | $green: hsl(141, 71%, 48%) !default; | ||
42 | $turquoise: hsl(171, 100%, 41%) !default; | ||
43 | $cyan: hsl(204, 86%, 53%) !default; | ||
44 | $blue: hsl(217, 71%, 53%) !default; | ||
45 | $purple: hsl(271, 100%, 71%) !default; | ||
46 | $red: hsl(348, 100%, 61%) !default; | ||
47 | |||
48 | // Typography | ||
49 | |||
50 | $family-sans-serif: BlinkMacSystemFont, -apple-system, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", | ||
51 | "Fira Sans", "Droid Sans", "Helvetica Neue", "Helvetica", "Arial", sans-serif !default; | ||
52 | $family-monospace: monospace !default; | ||
53 | $render-mode: optimizeLegibility !default; | ||
54 | |||
55 | $size-1: 3rem !default; | ||
56 | $size-2: 2.5rem !default; | ||
57 | $size-3: 2rem !default; | ||
58 | $size-4: 1.5rem !default; | ||
59 | $size-5: 1.25rem !default; | ||
60 | $size-6: 1rem !default; | ||
61 | $size-7: 0.75rem !default; | ||
62 | |||
63 | $weight-light: 300 !default; | ||
64 | $weight-normal: 400 !default; | ||
65 | $weight-medium: 500 !default; | ||
66 | $weight-semibold: 600 !default; | ||
67 | $weight-bold: 700 !default; | ||
68 | |||
69 | // Responsiveness | ||
70 | |||
71 | // The container horizontal gap, which acts as the offset for breakpoints | ||
72 | $gap: 32px !default; | ||
73 | // 960, 1152, and 1344 have been chosen because they are divisible by both 12 and 16 | ||
74 | $tablet: 769px !default; | ||
75 | // 960px container + 4rem | ||
76 | $desktop: 960px + (2 * $gap) !default; | ||
77 | // 1152px container + 4rem | ||
78 | $widescreen: 1152px + (2 * $gap) !default; | ||
79 | // 1344px container + 4rem; | ||
80 | $fullhd: 1344px + (2 * $gap) !default; | ||
81 | |||
82 | // Miscellaneous | ||
83 | |||
84 | $easing: ease-out !default; | ||
85 | $radius-small: 2px !default; | ||
86 | $radius: 3px !default; | ||
87 | $radius-large: 5px !default; | ||
88 | $radius-rounded: 290486px !default; | ||
89 | $speed: 86ms !default; | ||
90 | |||
91 | // Flags | ||
92 | |||
93 | $variable-columns: true !default; | ||
94 | |||
95 | // The default Bulma derived variables are declared below | ||
96 | |||
97 | $primary: $turquoise !default; | ||
98 | |||
99 | $info: $cyan !default; | ||
100 | $success: $green !default; | ||
101 | $warning: $yellow !default; | ||
102 | $danger: $red !default; | ||
103 | |||
104 | $light: $white-ter !default; | ||
105 | $dark: $grey-darker !default; | ||
106 | |||
107 | // Invert colors | ||
108 | |||
109 | $orange-invert: findColorInvert($orange) !default; | ||
110 | $yellow-invert: findColorInvert($yellow) !default; | ||
111 | $green-invert: findColorInvert($green) !default; | ||
112 | $turquoise-invert: findColorInvert($turquoise) !default; | ||
113 | $cyan-invert: findColorInvert($cyan) !default; | ||
114 | $blue-invert: findColorInvert($blue) !default; | ||
115 | $purple-invert: findColorInvert($purple) !default; | ||
116 | $red-invert: findColorInvert($red) !default; | ||
117 | |||
118 | $primary-invert: $turquoise-invert !default; | ||
119 | $info-invert: $cyan-invert !default; | ||
120 | $success-invert: $green-invert !default; | ||
121 | $warning-invert: $yellow-invert !default; | ||
122 | $danger-invert: $red-invert !default; | ||
123 | $light-invert: $dark !default; | ||
124 | $dark-invert: $light !default; | ||
125 | |||
126 | // General colors | ||
127 | |||
128 | $background: $white-ter !default; | ||
129 | |||
130 | $border: $grey-lighter !default; | ||
131 | $border-hover: $grey-light !default; | ||
132 | |||
133 | // Text colors | ||
134 | |||
135 | $text: $grey-dark !default; | ||
136 | $text-invert: findColorInvert($text) !default; | ||
137 | $text-light: $grey !default; | ||
138 | $text-strong: $grey-darker !default; | ||
139 | |||
140 | // Code colors | ||
141 | |||
142 | $code: $red !default; | ||
143 | $code-background: $background !default; | ||
144 | |||
145 | $pre: $text !default; | ||
146 | $pre-background: $background !default; | ||
147 | |||
148 | // Link colors | ||
149 | |||
150 | $link: $blue !default; | ||
151 | $link-invert: $blue-invert !default; | ||
152 | $link-visited: $purple !default; | ||
153 | |||
154 | $link-hover: $grey-darker !default; | ||
155 | $link-hover-border: $grey-light !default; | ||
156 | |||
157 | $link-focus: $grey-darker !default; | ||
158 | $link-focus-border: $blue !default; | ||
159 | |||
160 | $link-active: $grey-darker !default; | ||
161 | $link-active-border: $grey-dark !default; | ||
162 | |||
163 | // Typography | ||
164 | |||
165 | $family-primary: $family-sans-serif !default; | ||
166 | $family-code: $family-monospace !default; | ||
167 | |||
168 | $size-small: $size-7 !default; | ||
169 | $size-normal: $size-6 !default; | ||
170 | $size-medium: $size-5 !default; | ||
171 | $size-large: $size-4 !default; | ||
diff --git a/viewer/src/assets/scss/buefy.scss b/viewer/src/assets/scss/buefy.scss deleted file mode 100644 index 2bc4985..0000000 --- a/viewer/src/assets/scss/buefy.scss +++ /dev/null | |||
@@ -1,47 +0,0 @@ | |||
1 | /* ldgallery - A static generator which turns a collection of tagged | ||
2 | -- pictures into a searchable web gallery. | ||
3 | -- | ||
4 | -- Copyright (C) 2019-2020 Guillaume FOUET | ||
5 | -- | ||
6 | -- This program is free software: you can redistribute it and/or modify | ||
7 | -- it under the terms of the GNU Affero General Public License as | ||
8 | -- published by the Free Software Foundation, either version 3 of the | ||
9 | -- License, or (at your option) any later version. | ||
10 | -- | ||
11 | -- This program is distributed in the hope that it will be useful, | ||
12 | -- but WITHOUT ANY WARRANTY; without even the implied warranty of | ||
13 | -- MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the | ||
14 | -- GNU Affero General Public License for more details. | ||
15 | -- | ||
16 | -- You should have received a copy of the GNU Affero General Public License | ||
17 | -- along with this program. If not, see <https://www.gnu.org/licenses/>. | ||
18 | */ | ||
19 | |||
20 | @import "~bulma/sass/utilities/initial-variables"; | ||
21 | @import "~bulma/sass/utilities/functions"; | ||
22 | // 1. Set your own initial variables and derived | ||
23 | // variables in _variables.scss | ||
24 | @import "buefy_variables"; | ||
25 | |||
26 | // 2. Setup your Custom Colors | ||
27 | @import "@/assets/scss/theme.scss"; | ||
28 | |||
29 | @import "~bulma/sass/utilities/derived-variables"; | ||
30 | |||
31 | // 3. Add new color variables to the color map. | ||
32 | $addColors: ( | ||
33 | "green": ( | ||
34 | $green, | ||
35 | $green-invert, | ||
36 | ), | ||
37 | "purple": ( | ||
38 | $purple, | ||
39 | $purple-invert, | ||
40 | ), | ||
41 | ); | ||
42 | $colors: map-merge($colors, $addColors); | ||
43 | |||
44 | @import "~bulma"; | ||
45 | @import "~buefy/src/scss/buefy"; | ||
46 | |||
47 | // 4. Provide custom buefy overrides and site styles here | ||