Skip to content

Commit e29fd30

Browse files
author
Joshua Stübner
committed
style: tweaks
1 parent 2e96daa commit e29fd30

22 files changed

Lines changed: 1717 additions & 66 deletions

File tree

apps/web/src/routes/danke-fuer-deine-anfrage/+page.svelte

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,3 +18,6 @@ import Meta from '$lib/modules/common/components/Meta.svelte';
1818
</div>
1919
</section>
2020
</div>
21+
22+
<style>
23+
</style>

apps/web2/astro.config.mjs

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,11 @@ import { defineConfig } from 'astro/config';
66
export default defineConfig({
77
site: 'https://nordcode.agency',
88
trailingSlash: 'never',
9-
integrations: [sitemap()],
9+
integrations: [sitemap({
10+
filter: (page) => {
11+
return !page.includes('/start') && !page.includes('danke-fuer-deine-anfrage');
12+
},
13+
})],
1014
build: {
1115
inlineStylesheets: 'never',
1216
},

apps/web2/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -15,6 +15,7 @@
1515
"@nordcode/ui": "workspace:^",
1616
"astro": "^5.16.11",
1717
"lil-gui": "^0.21.0",
18+
"sharp": "^0.34.5",
1819
"three": "^0.180.0"
1920
},
2021
"devDependencies": {

apps/web2/public/robots.txt

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,3 +6,5 @@ Disallow: /
66

77
User-agent: *
88
Allow: /
9+
10+
Sitemap: https://nordcode.agency/sitemap-index.xml

apps/web2/src/components/ActionCard.astro

Lines changed: 10 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -23,52 +23,39 @@ let { heading, subheading = undefined } = Astro.props;
2323

2424
<style>
2525
.container {
26-
/* container-type: inline-size; */
26+
container-type: inline-size;
2727
inline-size: 100%;
2828
block-size: 100%;
2929
}
3030

3131
.action-card-title {
3232
font-weight: var(--font-weight-default);
33-
font-size: var(--font-size-medium);
33+
font-size: var(--font-size-base);
34+
line-height: var(--line-height-base);
3435
}
3536

3637
.card {
3738
--card-padding-inline: 0px;
3839
--card-padding-block: 0px;
3940

40-
display: grid;
41-
grid-template:
42-
[header-start]
43-
1fr
44-
[header-end action-start]
45-
auto
46-
[action-end]
47-
/ 1fr;
4841
background: linear-gradient(
4942
45deg,
5043
color-mix(in oklch, var(--color-border-base), transparent 97%),
5144
color-mix(in oklch, var(--color-surface-base), transparent 20%)
5245
);
53-
backdrop-filter: blur(var(--spacing-base));
46+
backdrop-filter: blur(4px);
5447
box-shadow:
5548
var(--_card-shadow),
5649
inset 0px 0px var(--spacing-base) calc(var(--spacing-near) * -1)
5750
color-mix(in oklch, var(--color-border-base), transparent 20%);
5851
block-size: 100%;
59-
text-decoration: none;
60-
transition: border-color 300ms ease, box-shadow 300ms;
6152
}
6253

6354
.header {
6455
grid-area: header;
6556
padding: var(--spacing-base);
6657
}
6758

68-
h2 {
69-
line-height: var(--line-height-base);
70-
}
71-
7259
.headings {
7360
& span {
7461
color: var(--color-text-muted);
@@ -82,4 +69,10 @@ h2 {
8269
justify-content: end;
8370
line-height: var(--line-height-base);
8471
}
72+
73+
@media (min-width: 24rem) {
74+
.action-card-title {
75+
font-size: var(--font-size-medium);
76+
}
77+
}
8578
</style>

apps/web2/src/components/FinalCTA.astro

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -31,12 +31,17 @@ import { ensureTrailingSlash } from '../utils/ensureTrailingSlash.ts';
3131
}
3232

3333
.finalCTA-headline {
34-
font-size: 2.5rem;
34+
font-size: 2.25rem;
3535
font-weight: var(--font-weight-heading);
3636
}
3737

38+
@media (min-width: 600px) {
39+
.finalCTA-headline {
40+
font-size: 3rem;
41+
}
42+
}
43+
3844
.container {
39-
/* --center-measure: 140ch; */
4045
--bg-top: light-dark(var(--color-surface-subtle), var(--color-surface-subtle));
4146
--bg-bottom: light-dark(var(--color-surface-muted), var(--color-surface-muted));
4247

@@ -63,12 +68,8 @@ import { ensureTrailingSlash } from '../utils/ensureTrailingSlash.ts';
6368
align-items: center;
6469
gap: var(--spacing-base);
6570

66-
& a {
71+
@media (min-width: 24rem) {
6772
font-size: var(--font-size-medium);
68-
69-
&:not(.nc-button) {
70-
font-weight: var(--font-weight-active);
71-
}
7273
}
7374
}
7475
</style>

apps/web2/src/components/Hero.astro

Lines changed: 8 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -29,18 +29,24 @@ const {} = Astro.props;
2929
</ActionCard>
3030
</div>
3131
</div>
32-
</div>\
32+
</div>
3333

3434
<style>
3535
@custom-media --sm-n-above (width >= 480px);
3636

3737
.subtitle {
3838
font-weight: var(--font-weight-default);
3939
letter-spacing: var(--tracking-base);
40-
font-size: var(--font-size-large);
40+
font-size: var(--font-size-base);
4141
transform: translateX(0.3ch);
4242
}
4343

44+
@media (--sm-n-above) {
45+
.subtitle {
46+
font-size: var(--font-size-large);
47+
}
48+
}
49+
4450
.container {
4551
inline-size: 100%;
4652
flex-grow: 1;

apps/web2/src/components/ServicesSection.astro

Lines changed: 9 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -73,6 +73,7 @@ const services: TService[] = [
7373
<style>
7474
@custom-media --sm-n-above (width >= 480px);
7575
@custom-media --md-n-above (width >= 768px);
76+
@custom-media --lg-n-above (width >= 1024px);
7677

7778
.inner-section {
7879
display: flex;
@@ -119,8 +120,7 @@ const services: TService[] = [
119120
}
120121

121122
.item-counter {
122-
display: none;
123-
position: absolute;
123+
display: block;
124124
font-size: var(--size);
125125
block-size: var(--size);
126126
font-weight: var(--font-weight-strong);
@@ -129,6 +129,9 @@ const services: TService[] = [
129129
inset: 0;
130130
z-index: -1;
131131
line-height: 1;
132+
position: relative;
133+
inset-inline-start: calc(var(--size) * -0.1);
134+
inset-block-start: calc(var(--size) * 0.1);
132135
}
133136

134137
@media (prefers-reduced-motion: no-preference) {
@@ -141,7 +144,7 @@ const services: TService[] = [
141144
}
142145
}
143146

144-
@media (--sm-n-above) {
147+
@media (--lg-n-above) {
145148
.item {
146149
--size: 10rem;
147150

@@ -150,8 +153,9 @@ const services: TService[] = [
150153
}
151154

152155
.item-counter {
153-
display: block;
154-
transform: translateY(-10%);
156+
position: absolute;
157+
inset-inline-start: 0;
158+
inset-block-start: calc(var(--size) * -0.08);
155159
}
156160
}
157161
</style>

apps/web2/src/components/ThreeScene.astro

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,10 @@
99
grid-area: 1 / 1;
1010
z-index: -1;
1111
content: "";
12-
top: 0;
13-
right: 0;
1412
display: block;
1513
inline-size: 60%;
16-
max-block-size: 100svh;
14+
max-block-size: 100%;
15+
block-size: 100%;
1716
outline: none;
1817
background-color: var(--color-surface-base);
1918
filter: blur(2px);

apps/web2/src/components/threeScene2.ts

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -215,19 +215,21 @@ export function main() {
215215
}
216216
});
217217

218+
const container = document.getElementById('hero-wrap');
219+
218220
/**
219221
* Sizes
220222
*/
221223
const sizes = {
222-
width: window.innerWidth,
224+
width: container?.clientWidth ?? window.innerWidth,
223225
// safe height to prevent overflow
224-
height: window.screen.availHeight,
226+
height: container?.clientHeight ?? window.screen.availHeight,
225227
};
226228

227229
window.addEventListener('resize', () => {
228230
// Update sizes
229-
sizes.width = window.innerWidth;
230-
sizes.height = window.screen.availHeight;
231+
sizes.width = container?.clientWidth ?? window.innerWidth;
232+
sizes.height = container?.clientHeight ?? window.screen.availHeight;
231233

232234
// Update camera
233235
camera.aspect = sizes.width / sizes.height;

0 commit comments

Comments
 (0)