Mercurial > gemma
comparison client/src/components/Main.vue @ 5629:84d01a536bec 729-node-js-newer-version
Transformed scss and sass styles into css
author | Luisa Beerboom <lbeerboom@intevation.de> |
---|---|
date | Thu, 11 May 2023 13:23:52 +0200 |
parents | fa7dc3f31ef3 |
children |
comparison
equal
deleted
inserted
replaced
5628:a985f8c46cf3 | 5629:84d01a536bec |
---|---|
20 v-if="panes.length === 4" | 20 v-if="panes.length === 4" |
21 /> | 21 /> |
22 </div> | 22 </div> |
23 </template> | 23 </template> |
24 | 24 |
25 <style lang="sass"> | 25 <style> |
26 #panes | 26 #panes { |
27 top: -1px | 27 top: -1px; |
28 right: -1px | 28 right: -1px; |
29 bottom: -1px | 29 bottom: -1px; |
30 left: -1px | 30 left: -1px; |
31 z-index: 1 | 31 z-index: 1; |
32 &.rotate1 | 32 } |
33 flex-wrap: wrap | 33 #panes.rotate1 { |
34 flex-direction: row | 34 flex-wrap: wrap; |
35 &.rotate2 | 35 flex-direction: row; |
36 flex-wrap: wrap-reverse | 36 } |
37 flex-direction: column | 37 #panes.rotate2 { |
38 &.rotate3 | 38 flex-wrap: wrap-reverse; |
39 flex-wrap: wrap-reverse | 39 flex-direction: column; |
40 flex-direction: row-reverse | 40 } |
41 &.rotate4 | 41 #panes.rotate3 { |
42 flex-wrap: wrap | 42 flex-wrap: wrap-reverse; |
43 flex-direction: column-reverse | 43 flex-direction: row-reverse; |
44 .pane | 44 } |
45 border: solid 1px #dee2e6 | 45 #panes.rotate4 { |
46 background: #fff | 46 flex-wrap: wrap; |
47 flex-direction: column-reverse; | |
48 } | |
49 #panes .pane { | |
50 border: solid 1px #dee2e6; | |
51 background: #fff; | |
52 } | |
47 </style> | 53 </style> |
48 | 54 |
49 <script> | 55 <script> |
50 /* This is Free Software under GNU Affero General Public License v >= 3.0 | 56 /* This is Free Software under GNU Affero General Public License v >= 3.0 |
51 * without warranty, see README.md and license for details. | 57 * without warranty, see README.md and license for details. |