diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/css/dumbymap.css | 41 |
1 files changed, 14 insertions, 27 deletions
diff --git a/src/css/dumbymap.css b/src/css/dumbymap.css index 6c68548..252fe84 100644 --- a/src/css/dumbymap.css +++ b/src/css/dumbymap.css | |||
@@ -81,14 +81,13 @@ | |||
81 | 81 | ||
82 | .DumbyMap { | 82 | .DumbyMap { |
83 | display: flex; | 83 | display: flex; |
84 | width: 100%; | ||
85 | height: 100%; | ||
84 | margin: 0 auto; | 86 | margin: 0 auto; |
85 | padding: 0; | 87 | padding: 0; |
86 | 88 | ||
87 | position: relative; | 89 | position: relative; |
88 | overflow-x: auto; | 90 | overflow-x: auto; |
89 | max-width: 60em; | ||
90 | |||
91 | /* height: 100vh; */ | ||
92 | 91 | ||
93 | .Showcase { | 92 | .Showcase { |
94 | display: none; | 93 | display: none; |
@@ -142,6 +141,8 @@ | |||
142 | } | 141 | } |
143 | 142 | ||
144 | [data-placeholder] { | 143 | [data-placeholder] { |
144 | margin: 2px; | ||
145 | |||
145 | border: 3px solid gray; | 146 | border: 3px solid gray; |
146 | 147 | ||
147 | opacity: 0.3; | 148 | opacity: 0.3; |
@@ -150,34 +151,19 @@ | |||
150 | } | 151 | } |
151 | } | 152 | } |
152 | 153 | ||
153 | width: 100%; | 154 | .DumbyMap[data-layout="normal"] { |
154 | height: 100vh; | 155 | max-width: 60em; |
155 | margin: 0 auto; | ||
156 | |||
157 | border: none; | ||
158 | max-width: none; | ||
159 | |||
160 | & ~ :not(.leader-line) { | ||
161 | display: none; | ||
162 | pointer-events: none; | ||
163 | } | ||
164 | .DumbyMap[data-layout]:not([data-layout="normal"]) { | ||
165 | } | 156 | } |
166 | 157 | ||
167 | .DumbyMap[data-layout="side-by-side"] { | 158 | .DumbyMap[data-layout="side-by-side"] { |
168 | .SemanticHtml { | 159 | display: flex; |
169 | flex: 50%; | ||
170 | overflow-y: auto; | ||
171 | |||
172 | height: 100vh; | ||
173 | } | ||
174 | 160 | ||
161 | .SemanticHtml, | ||
175 | .Showcase { | 162 | .Showcase { |
176 | display: block; | ||
177 | height: 100vh; | ||
178 | |||
179 | z-index: -1; | ||
180 | flex: 50%; | 163 | flex: 50%; |
164 | |||
165 | display: block; | ||
166 | height: 100%; | ||
181 | } | 167 | } |
182 | } | 168 | } |
183 | 169 | ||
@@ -270,7 +256,6 @@ | |||
270 | top: 0; | 256 | top: 0; |
271 | left: 0; | 257 | left: 0; |
272 | z-index: 1; | 258 | z-index: 1; |
273 | outline: red 3px; | ||
274 | border-top-left-radius: 0.3rem; | 259 | border-top-left-radius: 0.3rem; |
275 | border-top-right-radius: 0.3rem; | 260 | border-top-right-radius: 0.3rem; |
276 | 261 | ||
@@ -323,11 +308,13 @@ | |||
323 | 308 | ||
324 | background: white; | 309 | background: white; |
325 | 310 | ||
326 | transition: all 1s ease-in-out; | 311 | transition: opacity 1s linear; |
312 | user-select: none; | ||
327 | } | 313 | } |
328 | 314 | ||
329 | #plus-font-size { | 315 | #plus-font-size { |
330 | cursor: zoom-in; | 316 | cursor: zoom-in; |
317 | user-select: none; | ||
331 | } | 318 | } |
332 | 319 | ||
333 | #minus-font-size { | 320 | #minus-font-size { |