eSales Media Git repositories
Browse code

Initial commit

Benjamin Roth authored on16/03/2023 20:22:35
Showing1 changed files
files/base/layout/css/elements/news.scss
History View file @c584c6c
1 1 
new file mode 100644
... ... 
@@ -0,0 +1,174 @@
1 
+.mod_newslist {
2 
+  &.grid {
3 
+    position: relative;
4 
+
5 
+    @include media-breakpoint-up(lg) {
6 
+      column-gap: 5rem;
7 
+      &:after {
8 
+        content: "";
9 
+        width: 10px;
10 
+        background-color: $body-bg;
11 
+        position: absolute;
12 
+        left: 50%;
13 
+        margin-left: -5px;
14 
+        top: -$basic-gutter;
15 
+        height: calc(100% + #{$basic-gutter} * 2);
16 
+      }
17 
+    }
18 
+
19 
+    > *:first-child:not(div) {
20 
+      grid-column: auto/span 12;
21 
+      width: 100%;
22 
+      margin-bottom: 0px !important;
23 
+    }
24 
+
25 
+    > div {
26 
+      margin: 0 0 1rem 0 !important;
27 
+      grid-column: auto/span 12;
28 
+      @include media-breakpoint-up(lg) {
29 
+        grid-column: auto/span 6;
30 
+      }
31 
+    }
32 
+  }
33 
+}
34 
+
35 
+.mod_newslist {
36 
+  .layout_latest {
37 
+    @include content-box();
38 
+
39 
+    &:not(.last) {
40 
+      margin-bottom: 2rem;
41 
+    }
42 
+
43 
+    p.info {
44 
+      @include font-size(14px);
45 
+      color: var(--bs-primary);
46 
+      margin-bottom: 0.25rem;
47 
+    }
48 
+
49 
+    h2 {
50 
+      color: var(--bs-primary);
51 
+      padding-bottom: 0.5rem;
52 
+      border-bottom: 1px solid var(--bs-primary);
53 
+      font-weight: $font-weight-normal;
54 
+      margin-bottom: 2.5rem;
55 
+      margin-top: 0px;
56 
+
57 
+      &.with-url {
58 
+        &:hover {
59 
+          color: var(--bs-primary);
60 
+          border-bottom-color: var(--bs-primary);
61 
+        }
62 
+      }
63 
+
64 
+      a {
65 
+        text-decoration: none;
66 
+      }
67 
+    }
68 
+  }
69 
+
70 
+  .layout_short {
71 
+    h2 {
72 
+      @include font-size(18px);
73 
+      font-weight: $font-weight-bold;
74 
+
75 
+      a {
76 
+        color: var(--bs-body-color);
77 
+        text-decoration: none;
78 
+      }
79 
+    }
80 
+
81 
+    .ce_text {
82 
+      font-weight: $font-weight-light;
83 
+      @include font-size(16px);
84 
+    }
85 
+
86 
+    .right-col-wrapper {
87 
+      display: flex;
88 
+      flex-flow: column wrap;
89 
+      height: 100%;
90 
+
91 
+      p.info {
92 
+        color: var(--bs-primary);
93 
+      }
94 
+
95 
+      p.more {
96 
+        margin: auto 0 0 0;
97 
+      }
98 
+    }
99 
+  }
100 
+
101 
+  .layout_simple {
102 
+    padding: 1.5rem;
103 
+    position: relative;
104 
+
105 
+    &:not(:last-child) {
106 
+      margin-bottom: 2rem;
107 
+    }
108 
+
109 
+    &:nth-child(even) {
110 
+      background-color: $gray-100;
111 
+    }
112 
+
113 
+    &:nth-child(odd) {
114 
+      background-color: var(--bs-gray-200);
115 
+    }
116 
+
117 
+    .news--image-wrapper {
118 
+      min-height: rfs-value(40px);
119 
+
120 
+      a,
121 
+      img {
122 
+        & + span.date {
123 
+          top: 3rem;
124 
+        }
125 
+      }
126 
+
127 
+      span.date {
128 
+        position: absolute;
129 
+        background-color: var(--bs-primary);
130 
+        padding: 0.5rem 1rem 0.5rem 1.5rem;
131 
+        color: var(--bs-body-color-inverse);
132 
+        font-weight: $font-weight-light;
133 
+        top: 1.5rem;
134 
+        left: 0;
135 
+      }
136 
+    }
137 
+
138 
+    .news--content-wrapper {
139 
+      display: flex;
140 
+      flex-flow: column wrap;
141 
+
142 
+      h2 {
143 
+        color: var(--bs-primary);
144 
+        margin-bottom: 0px;
145 
+        padding-bottom: 0.5rem;
146 
+      }
147 
+
148 
+      a {
149 
+        text-decoration: none;
150 
+      }
151 
+
152 
+      .news--button {
153 
+        margin: auto 0 0 0;
154 
+      }
155 
+    }
156 
+  }
157 
+}
158 
+
159 
+.mod_newsreader {
160 
+  .layout_full {
161 
+    h1 {
162 
+      margin-bottom: 0px;
163 
+    }
164 
+
165 
+    .ce--subline {
166 
+    }
167 
+
168 
+    & + p.back {
169 
+      a {
170 
+        //@extend .btn, .btn-primary;
171 
+      }
172 
+    }
173 
+  }
174 
+}