... | ... |
@@ -22,6 +22,7 @@ $color-bg-senary: #EDEBE8; |
22 | 22 |
$color-bg-lightergrey: #f3f3f3; |
23 | 23 |
$color-bg-lightgrey: #eaeaea; |
24 | 24 |
$color-bg-lightplatin: mix($color-bg-secondary,#fff,20%); |
25 |
+$color-bg-lightplatin: rgb(244,244,241); |
|
25 | 26 |
$color-bg-lightbrown: mix($color-bg-primary,#fff,70%); |
26 | 27 |
$color-bg-footer: #c7c1b8; |
27 | 28 |
$color-bg-footer2: #f4f4f1; |
... | ... |
@@ -481,14 +481,16 @@ ol { |
481 | 481 |
} |
482 | 482 |
|
483 | 483 |
.ce_text, |
484 |
-.hero-wrapper { |
|
484 |
+.hero-wrapper, |
|
485 |
+.ce_hyperlink { |
|
485 | 486 |
ul,ol { |
486 | 487 |
@extend .list; |
487 | 488 |
} |
488 | 489 |
|
489 | 490 |
a:not(.button) { |
490 | 491 |
&[target="_blank"]:not(.-ico-dl), |
491 |
- &.-emphasised-block:not(.-ico-dl) { |
|
492 |
+ &.-emphasised-block:not(.-ico-dl), |
|
493 |
+ .-emphasised-block& { |
|
492 | 494 |
&:before { |
493 | 495 |
content: ''; |
494 | 496 |
width: .5em; |
... | ... |
@@ -513,8 +515,9 @@ ol { |
513 | 515 |
} |
514 | 516 |
} |
515 | 517 |
} |
516 |
- &.-emphasised-block { |
|
517 |
- font-size: 1.25em; |
|
518 |
+ &.-emphasised-block, |
|
519 |
+ .-emphasised-block& { |
|
520 |
+ font-size: font-size(25px); |
|
518 | 521 |
text-transform: uppercase; |
519 | 522 |
font-weight: 700; |
520 | 523 |
font-family: $font-family-alternate; |
... | ... |
@@ -927,7 +927,8 @@ $shadow-color: #fff; |
927 | 927 |
} |
928 | 928 |
} |
929 | 929 |
|
930 |
- .hero-content { |
|
930 |
+ .hero-content, |
|
931 |
+ .hero-html { |
|
931 | 932 |
height: 100%; |
932 | 933 |
position: absolute; |
933 | 934 |
left: 0; |
... | ... |
@@ -940,6 +941,7 @@ $shadow-color: #fff; |
940 | 941 |
} |
941 | 942 |
|
942 | 943 |
.hero-text { |
944 |
+ z-index: 1; |
|
943 | 945 |
display: inline-block; |
944 | 946 |
max-width: 100%; |
945 | 947 |
text-align: left; |
... | ... |
@@ -740,7 +740,7 @@ |
740 | 740 |
} |
741 | 741 |
|
742 | 742 |
.hero-wrapper, |
743 |
-.swiper-slide { |
|
743 |
+.swiper-slide{ |
|
744 | 744 |
|
745 | 745 |
.hero-text { |
746 | 746 |
a { |
... | ... |
@@ -825,6 +825,7 @@ |
825 | 825 |
} |
826 | 826 |
} |
827 | 827 |
@supports not (-moz-appearance:none) { |
828 |
+ display: inline; |
|
828 | 829 |
&:after { |
829 | 830 |
position: absolute; |
830 | 831 |
left: 0; |
... | ... |
@@ -896,7 +897,7 @@ |
896 | 897 |
|
897 | 898 |
&.-text-pos-left-top { |
898 | 899 |
.hero-content, |
899 |
- .slide-content { |
|
900 |
+ .slide-content{ |
|
900 | 901 |
@include text-position-wrapper(left,top); |
901 | 902 |
} |
902 | 903 |
} |
... | ... |
@@ -1103,3 +1104,90 @@ |
1103 | 1104 |
} |
1104 | 1105 |
} |
1105 | 1106 |
} |
1107 |
+ |
|
1108 |
+.positional-text { |
|
1109 |
+ height: 100%; |
|
1110 |
+ position: absolute; |
|
1111 |
+ left: 0; |
|
1112 |
+ top: 0; |
|
1113 |
+ bottom: 0; |
|
1114 |
+ right: 0; |
|
1115 |
+ display: flex; |
|
1116 |
+ align-items: center; |
|
1117 |
+ justify-content: center; |
|
1118 |
+ |
|
1119 |
+ .positional-text-content { |
|
1120 |
+ z-index: 1; |
|
1121 |
+ margin-top: 150px; |
|
1122 |
+ margin-bottom: 150px; |
|
1123 |
+ display: inline-block; |
|
1124 |
+ max-width: 100%; |
|
1125 |
+ text-align: left; |
|
1126 |
+ line-height: 1.3; |
|
1127 |
+ font-family: $font-family-alternate; |
|
1128 |
+ font-size: font-size(40px); |
|
1129 |
+ //text-shadow: $text-shadow-image; |
|
1130 |
+ letter-spacing: 0.15em; |
|
1131 |
+ font-weight: 700; |
|
1132 |
+ text-transform: uppercase; |
|
1133 |
+ color: $color-text-invert; |
|
1134 |
+ |
|
1135 |
+ &.-fs-medium { |
|
1136 |
+ font-size: font-size(32px); |
|
1137 |
+ |
|
1138 |
+ } |
|
1139 |
+ |
|
1140 |
+ &.-fs-small { |
|
1141 |
+ font-size: font-size(27px); |
|
1142 |
+ |
|
1143 |
+ } |
|
1144 |
+ } |
|
1145 |
+ |
|
1146 |
+ &.-text-pos-left-top { |
|
1147 |
+ @include text-position-wrapper(left,top); |
|
1148 |
+ } |
|
1149 |
+ &.-text-pos-left-topmiddle { |
|
1150 |
+ @include text-position-wrapper(left,topmiddle); |
|
1151 |
+ } |
|
1152 |
+ &.-text-pos-left-middle { |
|
1153 |
+ @include text-position-wrapper(left,middle); |
|
1154 |
+ } |
|
1155 |
+ &.-text-pos-left-bottommiddle { |
|
1156 |
+ @include text-position-wrapper(left,bottommiddle); |
|
1157 |
+ } |
|
1158 |
+ &.-text-pos-left-bottom { |
|
1159 |
+ @include text-position-wrapper(left,bottom); |
|
1160 |
+ } |
|
1161 |
+ |
|
1162 |
+ &.-text-pos-center-top { |
|
1163 |
+ @include text-position-wrapper(center,top); |
|
1164 |
+ } |
|
1165 |
+ &.-text-pos-center-topmiddle { |
|
1166 |
+ @include text-position-wrapper(center,topmiddle); |
|
1167 |
+ } |
|
1168 |
+ &.-text-pos-center-middle { |
|
1169 |
+ @include text-position-wrapper(center,middle); |
|
1170 |
+ } |
|
1171 |
+ &.-text-pos-center-bottommiddle { |
|
1172 |
+ @include text-position-wrapper(center,bottommiddle); |
|
1173 |
+ } |
|
1174 |
+ &.-text-pos-center-bottom { |
|
1175 |
+ @include text-position-wrapper(center,bottom); |
|
1176 |
+ } |
|
1177 |
+ |
|
1178 |
+ &.-text-pos-right-top { |
|
1179 |
+ @include text-position-wrapper(right,top); |
|
1180 |
+ } |
|
1181 |
+ &.-text-pos-right-topmiddle { |
|
1182 |
+ @include text-position-wrapper(right,topmiddle); |
|
1183 |
+ } |
|
1184 |
+ &.-text-pos-right-middle { |
|
1185 |
+ @include text-position-wrapper(right,middle); |
|
1186 |
+ } |
|
1187 |
+ &.-text-pos-right-bottommiddle { |
|
1188 |
+ @include text-position-wrapper(right,bottommiddle); |
|
1189 |
+ } |
|
1190 |
+ &.-text-pos-right-bottom { |
|
1191 |
+ @include text-position-wrapper(right,bottom); |
|
1192 |
+ } |
|
1193 |
+} |
... | ... |
@@ -80,6 +80,11 @@ if ((count($imageFiles) || count($videoFiles)) && $this->backgroundPosition) { |
80 | 80 |
</div> |
81 | 81 |
<?php endif; ?> |
82 | 82 |
</div> |
83 |
+ <?php if ($this->useHtml && $this->html): ?> |
|
84 |
+ <div class="content-wrapper hero-html"> |
|
85 |
+ <?= $this->html ?> |
|
86 |
+ </div> |
|
87 |
+ <?php endif; ?> |
|
83 | 88 |
|
84 | 89 |
<?php if ($this->showArrow): ?> |
85 | 90 |
<svg class="arrow" xmlns='http://www.w3.org/2000/svg' width='100%' height='100%' viewBox='0 0 100 5' preserveAspectRatio='viewPort' ><polygon points="0,0 0,5 50,5 100,5 100,0 50,5" /></svg> |
... | ... |
@@ -20,6 +20,20 @@ return array( |
20 | 20 |
'eval' => array('rte'=>'tinyMCE', 'helpwizard'=>true), |
21 | 21 |
'explanation' => 'insertTags', |
22 | 22 |
), |
23 |
+ 'useHtml' => array( |
|
24 |
+ 'label' => array('Zusätzliches HTML', 'Ermöglicht zusätzlichen HTML-Code im Hero.'), |
|
25 |
+ 'inputType' => 'checkbox', |
|
26 |
+ 'eval' => array( |
|
27 |
+ 'tl_class' => 'clr', |
|
28 |
+ ), |
|
29 |
+ ), |
|
30 |
+ 'html' => array ( |
|
31 |
+ 'label' => array('Text'), |
|
32 |
+ 'inputType' => 'textarea', |
|
33 |
+ 'eval' => array('allowHtml'=>true, 'class'=>'clr monospace', 'rte'=>'ace|html', 'helpwizard'=>true), |
|
34 |
+ 'explanation' => 'insertTags', |
|
35 |
+ 'dependsOn' => array('field'=>'useHtml') |
|
36 |
+ ), |
|
23 | 37 |
'background_set' => array( |
24 | 38 |
'label' => array('Hintergrundbild'), |
25 | 39 |
'inputType' => 'group', |