Skip to content

Commit 52490f4

Browse files
RoboroadsRoboroads
committed
feat: Full rebrand to Sopra Steria colors
1 parent a44b543 commit 52490f4

15 files changed

+74
-76
lines changed

‎src/lib/components/Poster.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
const SPEED = [50, 70];
1010
1111
export let animated: boolean = false;
12-
export let colors: string[] = ['#1A1D1F', '#61BFC3', '#61BFC3', '#E6E2DB', '#FF8133', '#FF8133'];
12+
export let colors: string[] = ['#1A1D1F', '#4C1F82', '#4C1F82', '#E6E2DB', '#CF022B', '#CF022B'];
1313
let width: number;
1414
let height: number;
1515
type PosterBallProps = ComponentProps<PosterBall> & { id: number };

‎src/lib/components/TagBlock.svelte

+12-16
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,11 @@
11
<script lang="ts">
2-
export let backgroundColor: 'shark' | 'fountain' | 'ordina' = 'ordina';
2+
export let backgroundColor: 'shark' | 'honey-flower' | 'soprasteria' = 'soprasteria';
33
export let direction: 'left' | 'right' | 'both' = 'both';
44
export let extend: boolean = false;
55
export let small: boolean = false;
66
</script>
77

8-
<div
9-
class="relative inline-flex {$$props.class} {backgroundColor === 'ordina'
10-
? 'text-shark'
11-
: 'text-white'}"
12-
>
8+
<div class="relative inline-flex {$$props.class} text-white">
139
{#if ['left', 'both'].indexOf(direction) > -1}
1410
<svg
1511
class="absolute ml-[1px] h-full -translate-x-full self-stretch"
@@ -20,18 +16,18 @@
2016
<g transform="matrix(3.7761 0 0 3.7761 -8.9107 .10595)">
2117
<path
2218
d="m21.162 26.454c-0.52053-0.0026-0.95771-0.03192-1.278-0.08895v1e-6c-1.1306-0.2013-2.0481-0.56897-2.9909-1.1985-0.24707-0.16498-1.8467-1.4021-3.5548-2.7492s-3.4603-2.7247-3.8939-3.0613c-1.2783-0.9926-6.6053-5.2037-6.753-5.3385-0.4013-0.36609-0.44538-1.0491-0.094261-1.4605 0.047677-0.05586 1.9142-1.5427 4.1478-3.304s5.3979-4.26 7.0318-5.5526c3.1588-2.499 3.5686-2.7866 4.5013-3.1586 1.0008-0.39926 1.7501-0.5685 2.8839-0.56991"
23-
class:fill-ordina={backgroundColor === 'ordina'}
19+
class:fill-soprasteria={backgroundColor === 'soprasteria'}
2420
class:fill-shark={backgroundColor === 'shark'}
25-
class:fill-fountain={backgroundColor === 'fountain'}
21+
class:fill-honey-flower={backgroundColor === 'honey-flower'}
2622
/>
2723
</g>
2824
</svg>
2925
{:else if extend}
3026
<div
3127
class="absolute ml-[1px] h-full w-screen -translate-x-full self-stretch"
32-
class:bg-ordina={backgroundColor === 'ordina'}
28+
class:bg-soprasteria={backgroundColor === 'soprasteria'}
3329
class:bg-shark={backgroundColor === 'shark'}
34-
class:bg-fountain={backgroundColor === 'fountain'}
30+
class:bg-honey-flower={backgroundColor === 'honey-flower'}
3531
/>
3632
{/if}
3733
<div
@@ -42,9 +38,9 @@
4238
class:py-1={small}
4339
class:pl-1={small}
4440
class:pr-1={small}
45-
class:bg-ordina={backgroundColor === 'ordina'}
41+
class:bg-soprasteria={backgroundColor === 'soprasteria'}
4642
class:bg-shark={backgroundColor === 'shark'}
47-
class:bg-fountain={backgroundColor === 'fountain'}
43+
class:bg-honey-flower={backgroundColor === 'honey-flower'}
4844
class:md:pl-4={direction === 'right' && !small}
4945
class:md:pl-1={direction === 'right' && small}
5046
class:md:pr-0={direction === 'right'}
@@ -64,18 +60,18 @@
6460
<g transform="matrix(-3.7761 0 0 3.7761 79.911 .10595)">
6561
<path
6662
d="m21.162 26.454c-0.52053-0.0026-0.95771-0.03192-1.278-0.08895v1e-6c-1.1306-0.2013-2.0481-0.56897-2.9909-1.1985-0.24707-0.16498-1.8467-1.4021-3.5548-2.7492s-3.4603-2.7247-3.8939-3.0613c-1.2783-0.9926-6.6053-5.2037-6.753-5.3385-0.4013-0.36609-0.44538-1.0491-0.094261-1.4605 0.047677-0.05586 1.9142-1.5427 4.1478-3.304s5.3979-4.26 7.0318-5.5526c3.1588-2.499 3.5686-2.7866 4.5013-3.1586 1.0008-0.39926 1.7501-0.5685 2.8839-0.56991"
67-
class:fill-ordina={backgroundColor === 'ordina'}
63+
class:fill-soprasteria={backgroundColor === 'soprasteria'}
6864
class:fill-shark={backgroundColor === 'shark'}
69-
class:fill-fountain={backgroundColor === 'fountain'}
65+
class:fill-honey-flower={backgroundColor === 'honey-flower'}
7066
/>
7167
</g>
7268
</svg>
7369
{:else if extend}
7470
<div
7571
class="absolute right-0 mr-[1px] h-full w-screen translate-x-full self-stretch"
76-
class:bg-ordina={backgroundColor === 'ordina'}
72+
class:bg-soprasteria={backgroundColor === 'soprasteria'}
7773
class:bg-shark={backgroundColor === 'shark'}
78-
class:bg-fountain={backgroundColor === 'fountain'}
74+
class:bg-honey-flower={backgroundColor === 'honey-flower'}
7975
/>
8076
{/if}
8177
</div>

‎src/routes/+page.svelte

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script>
22
import HeaderSection from './HeaderSection.svelte';
33
import InfoSection from './InfoSection.svelte';
4-
import PhotoSliderSection from './PhotoSliderSection.svelte';
4+
import PastEventsSection from './PastEventsSection.svelte';
55
import PracticalInformationSection from './PracticalInformationSection.svelte';
66
import Spacer from './Spacer.svelte';
77
import SpeakerScheduleSection from './SpeakerScheduleSection.svelte';
@@ -33,5 +33,5 @@
3333
<SpeakerScheduleSection />
3434
<Spacer /><!--<WorkshopScheduleSection />-->
3535
<SpeakerSection />
36-
<PhotoSliderSection />
36+
<PastEventsSection />
3737
<PracticalInformationSection />

‎src/routes/HeaderSection.svelte

+2-2
Original file line numberDiff line numberDiff line change
@@ -19,12 +19,12 @@
1919
rel="noreferrer"
2020
href="https://www.eventbrite.nl/e/frontend-festival-tickets-927209848617"
2121
>
22-
<TagBlock class="text-lg" backgroundColor="fountain">
22+
<TagBlock class="text-lg" backgroundColor="honey-flower">
2323
tickets.getYours<span class="font-bold">Now</span>();
2424
</TagBlock>
2525
</a>
2626
<div class="mt-10 inline">
27-
<TagBlock class="text-lg" backgroundColor="ordina">
27+
<TagBlock class="text-lg" backgroundColor="soprasteria">
2828
CFP is now <span class="font-bold">closed</span>
2929
</TagBlock>
3030
</div>

‎src/routes/PhotoSliderSection.svelte ‎src/routes/PastEventsSection.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -99,7 +99,7 @@
9999

100100
<svelte:window on:resize={() => recalculateSizes(imageContainer)} />
101101
<div
102-
class="flex-center relative w-full flex-col bg-fountain px-5 py-16 text-white"
102+
class="flex-center relative w-full flex-col bg-soprasteria px-5 py-16 text-white"
103103
id="past-events"
104104
>
105105
<div class="text-4xl">Past Events</div>

‎src/routes/PracticalInformationSection.svelte

+7-7
Original file line numberDiff line numberDiff line change
@@ -8,26 +8,26 @@
88
>
99
<div class="text-4xl">Practical information</div>
1010

11-
<TagBlock class="mt-5" direction="right" extend backgroundColor="ordina">
11+
<TagBlock class="mt-5" direction="right" extend backgroundColor="soprasteria">
1212
<div class="flex w-screen max-w-xl gap-5">
1313
<div class="pl-5 text-2xl sm:pl-0">When:</div>
1414
<div class="grow text-2xl">September 5th 2024, 17:00 - 22:00</div>
1515
</div>
1616
</TagBlock>
1717

18-
<TagBlock class="mt-2" direction="left" extend backgroundColor="fountain">
18+
<TagBlock class="mt-2" direction="left" extend backgroundColor="honey-flower">
1919
<div class="flex w-screen max-w-xl items-center gap-5">
2020
<div class="pl-5 text-2xl" />
2121
<div class="flex flex-col items-center gap-2 md:flex-row">
2222
<a target="_blank" rel="noreferrer" href="https://goo.gl/maps/xumZR7ZQR53VJTQk7"
2323
><img
24-
class="h-48 w-48 rounded-full p-1 ring-2 ring-fountain-300"
24+
class="h-48 w-48 rounded-full p-1 ring-2 ring-honey-flower-300"
2525
src="/map.png"
26-
alt="A map showing where Ordina is located, on the line between Nieuwegein and Utrecht"
26+
alt="A map showing where Sopra Steria Netherlands Headquarters is located, on the line between Nieuwegein and Utrecht"
2727
/></a
2828
>
2929
<div class="flex flex-col">
30-
<div class="text-2xl">Where: Ordina HQ</div>
30+
<div class="text-2xl">Where: Sopra Steria NL HQ</div>
3131
<div class="text-xl">Ringwade 1</div>
3232
<div class="text-xl">3439 LM Nieuwegein</div>
3333
<div class="text-xl">The Netherlands</div>
@@ -51,7 +51,7 @@
5151

5252
<div class="mt-10 flex gap-6">
5353
<a class="inline" target="_blank" href="/code-of-conduct">
54-
<TagBlock backgroundColor="fountain" small>Code of Conduct</TagBlock>
54+
<TagBlock backgroundColor="honey-flower" small>Code of Conduct</TagBlock>
5555
</a>
5656

5757
<a
@@ -60,7 +60,7 @@
6060
rel="noreferrer"
6161
href="https://github.com/Ordina-Group/frontendfestival.nl"
6262
>
63-
<TagBlock backgroundColor="fountain" small>Source on GitHub</TagBlock>
63+
<TagBlock backgroundColor="honey-flower" small>Source on GitHub</TagBlock>
6464
</a>
6565
</div>
6666
</div>

‎src/routes/Spacer.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -3,5 +3,5 @@
33
</script>
44

55
<header class="flex-center relative h-10 w-full bg-shark md:h-48">
6-
<Poster colors={['#232728', '#232728', '#FF8133']} />
6+
<Poster colors={['#232728', '#232728', '#CF022B']} />
77
</header>

‎src/routes/SpeakerScheduleSection.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,7 @@
5252
class="mt-5"
5353
direction={item.speaker ? 'left' : 'right'}
5454
extend
55-
backgroundColor={item.speaker ? 'ordina' : 'fountain'}
55+
backgroundColor={item.speaker ? 'soprasteria' : 'honey-flower'}
5656
>
5757
<div class="flex w-screen max-w-xl gap-5">
5858
<div class="pl-5 text-2xl sm:pl-0">{item.time}</div>

‎src/routes/SpeakerSection.svelte

+13-13
Original file line numberDiff line numberDiff line change
@@ -32,15 +32,15 @@
3232
name: 'Jorrik Klijnsma',
3333
letters: 'JK',
3434
title: 'Frontend Developer',
35-
employer: 'Ordina',
35+
employer: 'Sopra Steria',
3636
image: '/speakers/jk.webp',
3737
bio: 'Jorrik is a creative front-end developer at Sopra Steria with a passion for getting and sharing information. He focuses on new and inspiring topics. The moment AI ‘entered the chat’, it won his digital heart. His 8+ years of frontend experience is coming in at a close second.'
3838
},
3939
{
4040
name: 'Bjorn Schijff',
4141
letters: 'BS',
4242
title: 'Sr. Front-end Engineer / Architect',
43-
employer: 'Ordina',
43+
employer: 'Sopra Steria',
4444
image: '/speakers/bs.webp',
4545
bio: 'Bjorn is an experienced software developer with lots of experience using Angular, RxJS and TypeScript. He has a passion for anything tech related and is happy to share that passion with people.'
4646
}
@@ -49,8 +49,8 @@
4949
let focussedSpeaker: number | null = null;
5050
</script>
5151

52-
<div class="relative w-full bg-gray-300 px-2 py-10 text-black" id="speakers">
53-
<div class="mb-24 w-full text-center text-4xl">Speakers</div>
52+
<div class="relative w-full bg-gray-300 px-2 py-10 text-white" id="speakers">
53+
<div class="mb-24 w-full text-center text-4xl text-black">Speakers</div>
5454

5555
{#if focussedSpeaker === null}
5656
<div
@@ -61,7 +61,7 @@
6161
{#each speakers as speaker, index}
6262
<div class="mb-16 h-56 w-full">
6363
<div
64-
class="flex w-full flex-col items-center rounded-2xl bg-fountain p-5 text-center shadow-xl"
64+
class="flex w-full flex-col items-center rounded-2xl bg-honey-flower p-5 text-center shadow-xl"
6565
>
6666
{#if speaker.image}
6767
<img
@@ -71,9 +71,9 @@
7171
/>
7272
{:else}
7373
<div
74-
class="relative -mt-16 inline-flex h-32 w-32 items-center justify-center overflow-hidden rounded-full bg-fountain-600"
74+
class="relative -mt-16 inline-flex h-32 w-32 items-center justify-center overflow-hidden rounded-full bg-honey-flower-600"
7575
>
76-
<span class="text-6xl font-medium text-fountain-800">{speaker.letters}</span>
76+
<span class="text-6xl font-medium text-honey-flower-800">{speaker.letters}</span>
7777
</div>
7878
{/if}
7979
<div class="text-xl md:text-2xl font-bold">{speaker.name}</div>
@@ -91,10 +91,10 @@
9191
on:click={() => (focussedSpeaker = index)}
9292
class="mt-2 cursor-pointer select-none"
9393
>
94-
<TagBlock small backgroundColor="ordina">Read more</TagBlock>
94+
<TagBlock small backgroundColor="soprasteria">Read more</TagBlock>
9595
</button>
9696
{:else}
97-
<TagBlock class="mt-2 opacity-75" small backgroundColor="ordina"
97+
<TagBlock class="mt-2 opacity-75" small backgroundColor="soprasteria"
9898
>Bio coming soon..</TagBlock
9999
>
100100
{/if}
@@ -106,7 +106,7 @@
106106
<div
107107
in:fade={{ duration: 250, delay: 250 }}
108108
out:fade={{ duration: 250 }}
109-
class="mx-auto flex w-full flex-col items-center rounded-2xl bg-fountain p-5 text-center shadow-xl md:w-2/3 xl:w-1/3"
109+
class="mx-auto flex w-full flex-col items-center rounded-2xl bg-honey-flower p-5 text-center shadow-xl md:w-2/3 xl:w-1/3"
110110
>
111111
{#if speakers[focussedSpeaker].image}
112112
<img
@@ -116,9 +116,9 @@
116116
/>
117117
{:else}
118118
<div
119-
class="relative -mt-16 inline-flex h-32 w-32 items-center justify-center overflow-hidden rounded-full bg-fountain-600"
119+
class="relative -mt-16 inline-flex h-32 w-32 items-center justify-center overflow-hidden rounded-full bg-honey-flower-600"
120120
>
121-
<span class="text-6xl font-medium text-fountain-800"
121+
<span class="text-6xl font-medium text-honey-flower-800"
122122
>{speakers[focussedSpeaker].letters}</span
123123
>
124124
</div>
@@ -134,7 +134,7 @@
134134
{/if}
135135
</div>
136136
<button on:click={() => (focussedSpeaker = null)} class="mt-2 cursor-pointer select-none">
137-
<TagBlock small backgroundColor="ordina">Back</TagBlock>
137+
<TagBlock small backgroundColor="soprasteria">Back</TagBlock>
138138
</button>
139139
</div>
140140
{/if}

‎src/routes/WorkshopScheduleSection.svelte

+4-4
Original file line numberDiff line numberDiff line change
@@ -13,7 +13,7 @@
1313
<div class="grow text-2xl">Welcome</div>
1414
</div>
1515
</TagBlock>
16-
<TagBlock class="mt-2" direction="left" extend backgroundColor="fountain">
16+
<TagBlock class="mt-2" direction="left" extend backgroundColor="honey-flower">
1717
<div class="flex w-screen max-w-xl gap-5">
1818
<div class="pl-5 text-2xl">16:30</div>
1919
<div class="inline-flex grow flex-col">
@@ -22,7 +22,7 @@
2222
</div>
2323
</div>
2424
</TagBlock>
25-
<TagBlock class="mt-2" direction="left" extend backgroundColor="fountain">
25+
<TagBlock class="mt-2" direction="left" extend backgroundColor="honey-flower">
2626
<div class="flex w-screen max-w-xl gap-5">
2727
<div class="pl-5 text-2xl">17:30</div>
2828
<div class="inline-flex grow flex-col">
@@ -35,7 +35,7 @@
3535
</div>
3636
<div class="flex grow flex-col">
3737
<div class="text-xl">- Flutter</div>
38-
<div class="text-lg">Remi Appels (Ordina)</div>
38+
<div class="text-lg">Remi Appels (Sopra Steria)</div>
3939
<div>Creating a review app in 90 minutes using Flutter 3.</div>
4040
</div>
4141
</div>
@@ -48,7 +48,7 @@
4848
<div class="grow text-2xl">Drinks & Dinner</div>
4949
</div>
5050
</TagBlock>
51-
<TagBlock class="mt-2" direction="left" extend backgroundColor="fountain">
51+
<TagBlock class="mt-2" direction="left" extend backgroundColor="honey-flower">
5252
<div class="flex w-screen max-w-xl gap-5">
5353
<div class="pl-5 text-2xl">19:15</div>
5454
<div class="inline-flex grow flex-col">

‎static/angle-bracket-close.svg

+1-1
Loading

‎static/angle-bracket-open.svg

+1-1
Loading

‎static/logo.svg

+2-2
Loading

‎static/marketing/socials.png

-1.25 KB
Loading

0 commit comments

Comments
 (0)