Skip to content

Commit 36adeaa

Browse files
TimUxTimUx
authored
Merge pull request #46 from TimUx/codex/update-design-based-on-provided-images-vqzcxd
Center garland inside cards
2 parents 91d9947 + 723ebd3 commit 36adeaa

File tree

4 files changed

+39
-40
lines changed

4 files changed

+39
-40
lines changed

‎donation.html‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -7,17 +7,6 @@
77
<link rel="stylesheet" href="styles.css">
88
</head>
99
<body class="festive subpage">
10-
<div class="garland garland-top" aria-hidden="true">
11-
<span class="bulb amber"></span>
12-
<span class="bulb teal"></span>
13-
<span class="bulb red"></span>
14-
<span class="bulb green"></span>
15-
<span class="bulb amber"></span>
16-
<span class="bulb teal"></span>
17-
<span class="bulb red"></span>
18-
<span class="bulb green"></span>
19-
<span class="bulb amber"></span>
20-
</div>
2110
<div class="scene-decor" aria-hidden="true">
2211
<div class="tree"></div>
2312
<div class="ornament ornament-star star-bright"></div>
@@ -29,6 +18,17 @@
2918
</div>
3019

3120
<div class="card">
21+
<div class="garland" aria-hidden="true">
22+
<span class="bulb amber"></span>
23+
<span class="bulb teal"></span>
24+
<span class="bulb red"></span>
25+
<span class="bulb green"></span>
26+
<span class="bulb amber"></span>
27+
<span class="bulb teal"></span>
28+
<span class="bulb red"></span>
29+
<span class="bulb green"></span>
30+
<span class="bulb amber"></span>
31+
</div>
3232
<header>
3333
<h1 id="headline"></h1>
3434
<p class="subtitle" id="subtitle">Unterstütze die Lichtershow</p>

‎index.html‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -7,17 +7,6 @@
77
<link rel="stylesheet" href="styles.css">
88
</head>
99
<body class="festive">
10-
<div class="garland garland-top" aria-hidden="true">
11-
<span class="bulb amber"></span>
12-
<span class="bulb teal"></span>
13-
<span class="bulb red"></span>
14-
<span class="bulb green"></span>
15-
<span class="bulb amber"></span>
16-
<span class="bulb teal"></span>
17-
<span class="bulb red"></span>
18-
<span class="bulb green"></span>
19-
<span class="bulb amber"></span>
20-
</div>
2110
<div class="scene-decor" aria-hidden="true">
2211
<div class="tree"></div>
2312
<div class="ornament ornament-star star-bright"></div>
@@ -29,6 +18,17 @@
2918
</div>
3019

3120
<div class="card">
21+
<div class="garland" aria-hidden="true">
22+
<span class="bulb amber"></span>
23+
<span class="bulb teal"></span>
24+
<span class="bulb red"></span>
25+
<span class="bulb green"></span>
26+
<span class="bulb amber"></span>
27+
<span class="bulb teal"></span>
28+
<span class="bulb red"></span>
29+
<span class="bulb green"></span>
30+
<span class="bulb amber"></span>
31+
</div>
3232
<header>
3333
<h1 id="headline"></h1>
3434
<p class="subtitle" id="subtitle"></p>

‎requests.html‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -7,17 +7,6 @@
77
<link rel="stylesheet" href="styles.css">
88
</head>
99
<body class="festive subpage">
10-
<div class="garland garland-top" aria-hidden="true">
11-
<span class="bulb amber"></span>
12-
<span class="bulb teal"></span>
13-
<span class="bulb red"></span>
14-
<span class="bulb green"></span>
15-
<span class="bulb amber"></span>
16-
<span class="bulb teal"></span>
17-
<span class="bulb red"></span>
18-
<span class="bulb green"></span>
19-
<span class="bulb amber"></span>
20-
</div>
2110
<div class="scene-decor" aria-hidden="true">
2211
<div class="tree"></div>
2312
<div class="ornament ornament-star star-bright"></div>
@@ -29,6 +18,17 @@
2918
</div>
3019

3120
<div class="card">
21+
<div class="garland" aria-hidden="true">
22+
<span class="bulb amber"></span>
23+
<span class="bulb teal"></span>
24+
<span class="bulb red"></span>
25+
<span class="bulb green"></span>
26+
<span class="bulb amber"></span>
27+
<span class="bulb teal"></span>
28+
<span class="bulb red"></span>
29+
<span class="bulb green"></span>
30+
<span class="bulb amber"></span>
31+
</div>
3232
<header>
3333
<h1 id="headline"></h1>
3434
<p class="subtitle">Wunschliste</p>

‎styles.css‎

Lines changed: 6 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -93,18 +93,17 @@ body.festive > :not(.scene-decor) {
9393
}
9494

9595
.garland {
96-
position: fixed;
97-
left: 50%;
98-
transform: translateX(-50%);
9996
display: flex;
10097
gap: 12px;
101-
z-index: 2;
98+
justify-content: center;
99+
align-items: center;
100+
margin: 0 auto 10px;
101+
width: min(320px, 100%);
102102
pointer-events: none;
103-
width: max-content;
103+
position: relative;
104+
z-index: 2;
104105
}
105106

106-
.garland-top { top: 6px; }
107-
108107
.bulb {
109108
width: 28px;
110109
height: 42px;

0 commit comments

Comments
 (0)