Add layout and styling for black weeks 2025 campaign

- Introduced new PNG image for the campaign layout.
- Created CSS styles for various sections including hero, boxes, and typography.
- Added SCSS file for better maintainability and organization of styles.
- Included source map for CSS to facilitate debugging.
This commit is contained in:
2025-11-23 22:05:08 +01:00
parent d858b22642
commit b9ddc6160a
11 changed files with 716 additions and 459 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 184 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 576 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 382 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 58 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 626 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 9.1 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.9 KiB

View File

@@ -0,0 +1 @@
.black_weeks_2025 ._hero img{width:100%}.black_weeks_2025 ._box_01{padding-top:80px;font-family:"URW Form"}.black_weeks_2025 ._box_01 h1{font-weight:700;font-style:Bold;font-size:40px;line-height:130%;letter-spacing:10%;text-align:center;text-transform:uppercase}.black_weeks_2025 ._box_01 h2{font-weight:400;font-style:Regular;font-size:35px;line-height:130%;letter-spacing:10%;text-align:center;text-transform:uppercase}.black_weeks_2025 ._box_01 p{font-weight:300;font-style:Light;font-size:20px;line-height:153%;letter-spacing:0%;text-align:center}.black_weeks_2025 ._box_02{padding-top:20px}.black_weeks_2025 ._box_02 img{width:100%}.black_weeks_2025 ._box_03{padding-top:30px}.black_weeks_2025 ._box_03 p{font-weight:300;font-style:Light;font-size:20px;line-height:30px;letter-spacing:0%;text-align:center;padding-right:20%}.black_weeks_2025 ._box_03 p._big{font-weight:700;font-style:Bold;font-size:32px;line-height:30px;letter-spacing:0%;text-align:center;padding-right:20%}.black_weeks_2025 ._box_03 img{width:100%;max-width:1149px;margin-top:-50px}.black_weeks_2025 ._box_03 ._regulamin{display:inline-block;width:276px;height:48px;float:right;margin-top:-20px;margin-right:20%;z-index:2;position:relative}.black_weeks_2025 ._box_03 ._regulamin img{max-width:276px;margin:0}.black_weeks_2025 ._box_05{height:1px;background:#000;margin-top:50px;margin-bottom:50px}.black_weeks_2025 ._box_06 h2{font-weight:400;font-size:35px;line-height:130%;letter-spacing:10%;text-align:center;text-transform:uppercase}.black_weeks_2025 ._box_06 h2 strong{font-weight:700;font-style:Bold}.black_weeks_2025 ._box_06 p{font-weight:300;font-style:Light;font-size:20px;line-height:153%;letter-spacing:0%;text-align:center}.black_weeks_2025 ._box_07 ._left_column{margin-top:-110px;padding-left:4%}.black_weeks_2025 ._box_07 ._left_column p{font-weight:400;font-size:20px;line-height:35px;letter-spacing:0px}.black_weeks_2025 ._box_07 ._left_column h3{font-weight:700;font-style:Bold;font-size:40px;line-height:40px;letter-spacing:0px}.black_weeks_2025 ._box_07 img._image_03{width:100%;max-width:843px;position:relative;z-index:2}.black_weeks_2025 ._box_07 img._image_04{width:100%;margin-top:-180px}.black_weeks_2025 ._box_07 ._regulamin{margin-right:34%;margin-top:-50px;position:relative;z-index:2;float:right}.black_weeks_2025 ._box_08{padding-bottom:100px;padding-left:3%}.black_weeks_2025 ._box_08 ol{margin-top:20px;list-style-type:square}.black_weeks_2025 ._box_08 ol li{font-weight:300;font-style:Light;font-size:25px;line-height:40px;letter-spacing:0%}/*# sourceMappingURL=black_weeks_2025.css.map */

File diff suppressed because one or more lines are too long

View File

@@ -0,0 +1,189 @@
.black_weeks_2025 {
._hero {
img {
width: 100%;
}
}
._box_01 {
padding-top: 80px;
font-family: 'URW Form';
h1 {
font-weight: 700;
font-style: Bold;
font-size: 40px;
line-height: 130%;
letter-spacing: 10%;
text-align: center;
text-transform: uppercase;
}
h2 {
font-weight: 400;
font-style: Regular;
font-size: 35px;
line-height: 130%;
letter-spacing: 10%;
text-align: center;
text-transform: uppercase;
}
p {
font-weight: 300;
font-style: Light;
font-size: 20px;
line-height: 153%;
letter-spacing: 0%;
text-align: center;
}
}
._box_02 {
padding-top: 20px;
img {
width: 100%;
}
}
._box_03 {
padding-top: 30px;
p {
font-weight: 300;
font-style: Light;
font-size: 20px;
line-height: 30px;
letter-spacing: 0%;
text-align: center;
padding-right: 20%;
&._big {
font-weight: 700;
font-style: Bold;
font-size: 32px;
line-height: 30px;
letter-spacing: 0%;
text-align: center;
padding-right: 20%;
}
}
img {
width: 100%;
max-width: 1149px;
margin-top: -50px;
}
._regulamin {
display: inline-block;
width: 276px;
height: 48px;
float: right;
margin-top: -20px;
margin-right: 20%;
z-index: 2;
position: relative;
img {
max-width: 276px;
margin: 0;
}
}
}
._box_05 {
height: 1px;
background: #000000;
margin-top: 50px;
margin-bottom: 50px;
}
._box_06 {
h2 {
font-weight: 400;
font-size: 35px;
line-height: 130%;
letter-spacing: 10%;
text-align: center;
text-transform: uppercase;
strong {
font-weight: 700;
font-style: Bold;
}
}
p {
font-weight: 300;
font-style: Light;
font-size: 20px;
line-height: 153%;
letter-spacing: 0%;
text-align: center;
}
}
._box_07 {
._left_column {
margin-top: -110px;
padding-left: 4%;
p {
font-weight: 400;
font-size: 20px;
line-height: 35px;
letter-spacing: 0px;
}
h3 {
font-weight: 700;
font-style: Bold;
font-size: 40px;
line-height: 40px;
letter-spacing: 0px;
}
}
img._image_03 {
width: 100%;
max-width: 843px;
position: relative;
z-index: 2;
}
img._image_04 {
width: 100%;
margin-top: -180px;
}
._regulamin {
margin-right: 34%;
margin-top: -50px;
position: relative;
z-index: 2;
float: right;
}
}
._box_08 {
padding-bottom: 100px;
padding-left: 3%;
ol {
margin-top: 20px;
list-style-type: square;
li {
font-weight: 300;
font-style: Light;
font-size: 25px;
line-height: 40px;
letter-spacing: 0%;
}
}
}
}

File diff suppressed because it is too large Load Diff