Browse code

Update

Benjamin Roth authored on17/03/2023 09:52:56
Showing1 changed files
1 1
new file mode 100644
... ...
@@ -0,0 +1,130 @@
1
+@import "../../variables-layout";
2
+
3
+@import "../../../_vendor/node_modules/bootstrap/scss/functions";
4
+@import "../../../_vendor/node_modules/bootstrap/scss/variables";
5
+@import "../../../_vendor/node_modules/bootstrap/scss/mixins";
6
+
7
+@import "../../scss-variables";
8
+@import "../../_theme/variables-layout";
9
+
10
+html body {
11
+  .ce_rsce_equalboxesrows {
12
+    .row-container:not(:last-child) {
13
+      margin-bottom: 1rem;
14
+    }
15
+
16
+    .row {
17
+      .left-col--inner {
18
+        height: 100%;
19
+        min-height: rfs-fluid-value(500px);
20
+
21
+        @include media-breakpoint-up(xxl) {
22
+          min-height: rfs-value(500px);
23
+        }
24
+
25
+        .equal--box {
26
+          height: 100%;
27
+        }
28
+      }
29
+
30
+      .right--col {
31
+        //margin-top: -$grid-gutter-width/2;
32
+        //margin-bottom: -$grid-gutter-width/2;
33
+        @include media-breakpoint-up(md) {
34
+          //margin: rfs-value(-15px 0px);
35
+        }
36
+
37
+        .right-col--inner {
38
+          @include media-breakpoint-up(md) {
39
+            height: 100%;
40
+            display: flex;
41
+            flex-flow: column nowrap;
42
+            align-items: center;
43
+            gap: var(--bs-gutter-x);
44
+          }
45
+
46
+          .equal--box {
47
+            //padding: $grid-gutter-width/2 0px;
48
+            @include media-breakpoint-up(md) {
49
+              flex: 1;
50
+              width: 100%;
51
+            }
52
+
53
+            .box--inner {
54
+            }
55
+          }
56
+        }
57
+      }
58
+
59
+      .equal--box {
60
+        position: relative;
61
+
62
+        > a {
63
+          display: block;
64
+          height: 100%;
65
+          width: 100%;
66
+          position: absolute;
67
+          left: 0;
68
+          top: 0;
69
+        }
70
+
71
+        .box--inner {
72
+          height: 100%;
73
+          position: relative;
74
+          display: flex;
75
+          flex-flow: column nowrap;
76
+          justify-content: flex-end;
77
+          min-height: rfs-fluid-value(450px);
78
+
79
+          @include media-breakpoint-up(md) {
80
+            margin-top: 0px;
81
+            min-height: 0px;
82
+          }
83
+
84
+          &:hover {
85
+            .box--content {
86
+              .box--text {
87
+                height: auto;
88
+                max-height: 800px;
89
+                opacity: 1;
90
+              }
91
+            }
92
+          }
93
+
94
+          .box--content {
95
+            padding: 1.5rem;
96
+            color: var(--bs-white);
97
+            background-color: rgba(0, 0, 0, 0.4);
98
+            z-index: 10;
99
+
100
+            .box--headline {
101
+              > * {
102
+                display: block;
103
+
104
+                &:not(.ce--subline) {
105
+                  color: var(--bs-body-color-inverse);
106
+                }
107
+              }
108
+            }
109
+
110
+            .box--subline.ce--subline {
111
+              margin-bottom: 0px;
112
+            }
113
+
114
+            .box--text {
115
+              transition: max-height 0.75s ease-in-out, opacity 0.35s ease;
116
+              max-height: 0px;
117
+              opacity: 0;
118
+              overflow: hidden;
119
+              text-align: justify;
120
+
121
+              > *:first-child {
122
+                padding-top: 1rem;
123
+              }
124
+            }
125
+          }
126
+        }
127
+      }
128
+    }
129
+  }
130
+}
0 131
\ No newline at end of file