1 files changed, 45 insertions, 36 deletions
diff --git a/viewer/src/assets/scss/global.scss b/viewer/src/assets/scss/global.scss
index 9444548..0a2f8f0 100644
--- a/viewer/src/assets/scss/global.scss
+++ b/viewer/src/assets/scss/global.scss
@@ -1,7 +1,7 @@
 /* ldgallery - A static generator which turns a collection of tagged
 --             pictures into a searchable web gallery.
 --
-- Copyright (C) 2019-2020  Guillaume FOUET
+-- Copyright (C) 2019-2022  Guillaume FOUET
 --
 -- This program is free software: you can redistribute it and/or modify
 -- it under the terms of the GNU Affero General Public License as
@@ -18,23 +18,39 @@
 */
 // Global CSS
-@import "~@/assets/scss/theme.scss";
+@import "theme";
-// === Forms
+h1 {
+  font-size: $size-5;
-.required label::after {
+  font-weight: $weight-semibold;
-  content: "*";
+  line-height: 1.125;
-  color: red;
+}
+h2 {
+  font-size: $size-6;
+  font-weight: $weight-normal;
 }
-button svg + span {
+// === Forms
-  margin-left: 7px;
+button {
+  cursor: pointer;
+  color: $button-color;
+  background-color: $button-background-color;
+  border: 1px solid $button-border-color;
+  padding: calc(0.375em - 1px) 0.75em;
+  font-family: inherit;
+  line-height: 1.5;
+  font-size: $size-6;
+  &:hover,&:focus {
+    border-color: $button-active-color;
+    outline: none;
+  }
 }
 // === Tools
-.nowrap {
+.no-scroll {
-  white-space: nowrap;
+  overflow: hidden;
 }
 .no-scroll-x {
  overflow-x: hidden;
@@ -50,18 +66,28 @@ button svg + span {
 .flex-center {
  align-items: center;
 }
+.flex-grow-1 {
+  flex-grow: 1;
+}
-// === Links
+.fill {
+  width: 100%;
+  height: 100%;
+}
-.link {
+/**
-  color: $link;
+ * Class for containers that centers its content vertically and horizontally,
-  cursor: pointer;
+ * preferably sticking to the container start if the container is smaller than the content.
-  text-decoration: none;
+ */
-  &:hover {
+.container-vh-centering {
-    color: $link-hover;
+  min-height: 100%;
-  }
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
+// === Links
 .disabled {
  color: $disabled-color !important;
  cursor: initial;
@@ -79,23 +105,6 @@ button svg + span {
  }
 }
-// === Scrollbar styling
-.scrollbar {
-  overflow: auto;
-}
-.scrollbar::-webkit-scrollbar {
-  width: $scrollbar-width;
-  height: $scrollbar-width;
-}
-.scrollbar::-webkit-scrollbar-corner {
-  background-color: transparent;
-}
-.scrollbar::-webkit-scrollbar-thumb {
-  box-shadow: inset 0 0 1px black;
-  background-color: $scrollbar-color;
-}
 // === Effect to apply on lazy-image loading
 img {

diff --git a/viewer/src/assets/scss/global.scss b/viewer/src/assets/scss/global.scss index 9444548..0a2f8f0 100644 --- a/viewer/src/assets/scss/global.scss +++ b/viewer/src/assets/scss/global.scss
@@ -1,7 +1,7 @@
1	/* ldgallery - A static generator which turns a collection of tagged	1	/* ldgallery - A static generator which turns a collection of tagged
2	-- pictures into a searchable web gallery.	2	-- pictures into a searchable web gallery.
3	--	3	--
4	-- Copyright (C) 2019-2020 Guillaume FOUET	4	-- Copyright (C) 2019-2022 Guillaume FOUET
5	--	5	--
6	-- This program is free software: you can redistribute it and/or modify	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	7	-- it under the terms of the GNU Affero General Public License as
@@ -18,23 +18,39 @@
18	*/	18	*/
19		19
20	// Global CSS	20	// Global CSS
21	@import "~@/assets/scss/theme.scss";	21	@import "theme";
22		22
23	// === Forms	23	h1 {
24		24	font-size: $size-5;
25	.required label::after {	25	font-weight: $weight-semibold;
26	content: "*";	26	line-height: 1.125;
27	color: red;	27	}
		28	h2 {
		29	font-size: $size-6;
		30	font-weight: $weight-normal;
28	}	31	}
29		32
30	button svg + span {	33	// === Forms
31	margin-left: 7px;	34
		35	button {
		36	cursor: pointer;
		37	color: $button-color;
		38	background-color: $button-background-color;
		39	border: 1px solid $button-border-color;
		40	padding: calc(0.375em - 1px) 0.75em;
		41	font-family: inherit;
		42	line-height: 1.5;
		43	font-size: $size-6;
		44	&:hover,&:focus {
		45	border-color: $button-active-color;
		46	outline: none;
		47	}
32	}	48	}
33		49
34	// === Tools	50	// === Tools
35		51
36	.nowrap {	52	.no-scroll {
37	white-space: nowrap;	53	overflow: hidden;
38	}	54	}
39	.no-scroll-x {	55	.no-scroll-x {
40	overflow-x: hidden;	56	overflow-x: hidden;
@@ -50,18 +66,28 @@ button svg + span {
50	.flex-center {	66	.flex-center {
51	align-items: center;	67	align-items: center;
52	}	68	}
		69	.flex-grow-1 {
		70	flex-grow: 1;
		71	}
53		72
54	// === Links	73	.fill {
		74	width: 100%;
		75	height: 100%;
		76	}
55		77
56	.link {	78	/**
57	color: $link;	79	* Class for containers that centers its content vertically and horizontally,
58	cursor: pointer;	80	* preferably sticking to the container start if the container is smaller than the content.
59	text-decoration: none;	81	*/
60	&:hover {	82	.container-vh-centering {
61	color: $link-hover;	83	min-height: 100%;
62	}	84	display: flex;
		85	align-items: center;
		86	justify-content: center;
63	}	87	}
64		88
		89	// === Links
		90
65	.disabled {	91	.disabled {
66	color: $disabled-color !important;	92	color: $disabled-color !important;
67	cursor: initial;	93	cursor: initial;
@@ -79,23 +105,6 @@ button svg + span {
79	}	105	}
80	}	106	}
81		107
82	// === Scrollbar styling
83
84	.scrollbar {
85	overflow: auto;
86	}
87	.scrollbar::-webkit-scrollbar {
88	width: $scrollbar-width;
89	height: $scrollbar-width;
90	}
91	.scrollbar::-webkit-scrollbar-corner {
92	background-color: transparent;
93	}
94	.scrollbar::-webkit-scrollbar-thumb {
95	box-shadow: inset 0 0 1px black;
96	background-color: $scrollbar-color;
97	}
98
99	// === Effect to apply on lazy-image loading	108	// === Effect to apply on lazy-image loading
100		109
101	img {	110	img {