diff options
author | pacien | 2020-05-02 04:11:24 +0200 |
---|---|---|
committer | pacien | 2020-05-02 04:11:24 +0200 |
commit | 8e3ac8fe44bebb38e1882ca7f06b8100078ad88d (patch) | |
tree | a748fa1e639cb3b5e1f24a8150e89dbb28c980cb /viewer/src/assets/scss/global.scss | |
parent | 7042ffc06326fa8ffe70f5a59747709250166c16 (diff) | |
parent | 0e0b5b0ae44da7c1d67983dedd8f8d8d3516236f (diff) | |
download | ldgallery-8e3ac8fe44bebb38e1882ca7f06b8100078ad88d.tar.gz |
Merge branch 'develop': release v1.0v1.0
Diffstat (limited to 'viewer/src/assets/scss/global.scss')
-rw-r--r-- | viewer/src/assets/scss/global.scss | 67 |
1 files changed, 67 insertions, 0 deletions
diff --git a/viewer/src/assets/scss/global.scss b/viewer/src/assets/scss/global.scss index 7afca8c..9444548 100644 --- a/viewer/src/assets/scss/global.scss +++ b/viewer/src/assets/scss/global.scss | |||
@@ -18,6 +18,7 @@ | |||
18 | */ | 18 | */ |
19 | 19 | ||
20 | // Global CSS | 20 | // Global CSS |
21 | @import "~@/assets/scss/theme.scss"; | ||
21 | 22 | ||
22 | // === Forms | 23 | // === Forms |
23 | 24 | ||
@@ -26,11 +27,18 @@ | |||
26 | color: red; | 27 | color: red; |
27 | } | 28 | } |
28 | 29 | ||
30 | button svg + span { | ||
31 | margin-left: 7px; | ||
32 | } | ||
33 | |||
29 | // === Tools | 34 | // === Tools |
30 | 35 | ||
31 | .nowrap { | 36 | .nowrap { |
32 | white-space: nowrap; | 37 | white-space: nowrap; |
33 | } | 38 | } |
39 | .no-scroll-x { | ||
40 | overflow-x: hidden; | ||
41 | } | ||
34 | 42 | ||
35 | .flex { | 43 | .flex { |
36 | display: flex; | 44 | display: flex; |
@@ -42,3 +50,62 @@ | |||
42 | .flex-center { | 50 | .flex-center { |
43 | align-items: center; | 51 | align-items: center; |
44 | } | 52 | } |
53 | |||
54 | // === Links | ||
55 | |||
56 | .link { | ||
57 | color: $link; | ||
58 | cursor: pointer; | ||
59 | text-decoration: none; | ||
60 | &:hover { | ||
61 | color: $link-hover; | ||
62 | } | ||
63 | } | ||
64 | |||
65 | .disabled { | ||
66 | color: $disabled-color !important; | ||
67 | cursor: initial; | ||
68 | } | ||
69 | |||
70 | // Disable sticky hover styling on touch devices, | ||
71 | // on which the virtual cursor doesn't leave the element after being tapped. | ||
72 | // The fix can be applied to `a` elements by using the .link class. | ||
73 | @media (hover: none), (hover: on-demand) { | ||
74 | .link:hover { | ||
75 | color: $link !important; | ||
76 | } | ||
77 | .disabled:hover { | ||
78 | color: $disabled-color !important; | ||
79 | } | ||
80 | } | ||
81 | |||
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 | ||
100 | |||
101 | img { | ||
102 | display: block; | ||
103 | image-orientation: from-image; | ||
104 | &.v-lazy-image { | ||
105 | opacity: 0; | ||
106 | transition: opacity 0.4s; | ||
107 | } | ||
108 | &.v-lazy-image-loaded { | ||
109 | opacity: 1; | ||
110 | } | ||
111 | } | ||