diff --git a/public/background.mp4 b/public/background.mp4 new file mode 100644 index 0000000..1d6d475 Binary files /dev/null and b/public/background.mp4 differ diff --git a/src/PartyPage.css b/src/PartyPage.css index 07b1f68..fa9113a 100644 --- a/src/PartyPage.css +++ b/src/PartyPage.css @@ -1,44 +1,108 @@ .loading { - height: 100vh; - width: 100vw; - background-color: black; + height: 100vh; + width: 100vw; + background-color: black; } +body{ + background-image: url('/public/background.gif'); + background-size: cover; + + height: 100vh; + padding:0; + margin:0; +} + + .App { + color: white; + font-size: calc(10px + 2vmin); + text-shadow: + -1px -1px 0.2em #000, + 1px -1px 0.2em #000, + -1px 1px 0.2em #000, + 1px 1px 0.2em #000; + text-align: center; + display: flex; + justify-content: center; +} + +.container { + max-width: 1024px; +} + +.fullheight { + min-height: 100vh; +} + +.hero { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; +} + +.hero-outer { + flex-grow: 1; + display: flex; + flex-direction: column; + justify-content: center; + padding-bottom: 0.5em; +} + +@media (min-width: 1024px) { + .hero-outer { + justify-content: flex-end; + } +} + +h1, +h2 { + margin: 1em 0 0.1em 0; +} + +p { + margin: 0.3em 0 0.3em 0; +} + +.feedback { + line-height: 3em; text-align: center; } -.App-logo { - height: 40vmin; - pointer-events: none; +input[type="radio"] { + display: none; } -@media (prefers-reduced-motion: no-preference) { - .App-logo { - animation: App-logo-spin infinite 20s linear; - } +input[type="radio"]+label { + font-size: larger; + cursor: pointer; + padding: 0 1em 0 1em; + border-right: 0.1em solid white; } -.App-header { - background-color: #282c34; - min-height: 100vh; - display: flex; - flex-direction: column; - align-items: center; - justify-content: center; - font-size: calc(10px + 2vmin); - color: white; +input[type="radio"]+label:hover { + text-shadow: 0 0 1em white; } -.App-link { - color: #61dafb; +input[type="radio"]+label:last-of-type { + border-right: none; } -@keyframes App-logo-spin { - from { - transform: rotate(0deg); - } - to { - transform: rotate(360deg); - } +input[type="radio"]:checked+label { + color: var(--selected-color); + text-shadow: 0 0 1em var(--selected-color); + text-decoration: underline; } + +#coming-yes+label { + --selected-color: #0f0; +} + +#coming-maybe+label { + --selected-color: #fc0; +} + +#coming-no+label { + --selected-color: #f00; +} \ No newline at end of file diff --git a/src/PartyPage.tsx b/src/PartyPage.tsx index 5e2d2bc..92a38b6 100644 --- a/src/PartyPage.tsx +++ b/src/PartyPage.tsx @@ -62,12 +62,10 @@ export const PartyPage: React.FC = () => {

Hallo {dear} {name},

am 16. Dezember wird die Heizung der Universität das letzte Mal angeschaltet... - Diese Chance, Energie zu schnorren, wollen wir ein letztes Mal nutzen. + Diese Chance, Energie zu schnorren, wollen wir noch einmal nutzen.

- Das wollen wir (Kai, Dominic, Jesko) uns natürlich nicht entgehen lassen. - Also veranstalten wir eine mega krasse LAN-Party. - {coming} + Daher veranstalten wir ab 18:00 eine Weihnachtsparty! Wir rechnen mit ca. 15-25 Teilnehmern.

Wir würden uns sehr freuen, wenn auch du, {dear} {name}, am Start wärst :) @@ -88,32 +86,25 @@ export const PartyPage: React.FC = () => {

Wann und Wo?

- 29. Oktober, 19:00 bis 31. Oktober irgendwann. + 16. Dezember, ab 18:00. Bitte komme nach Möglichkeit pünktlich.

- Mainzer Str. 28, 66111 Saarbrücken + Gebäude E1 1, Raum 407

+

Was ist geplant?

- Ja, der 30. ist ein Sonntag. - Am 1. 11. ist aber Allerheiligen, also bietet es sich an am 31. nen Brückentag zu machen. - So hat man dann auch genug Zeit um nach den 25+ Stunden ordentlich auszuschlafen. + Wir werden gemeinsam einen weihnachtlichen Abend verbringen. + + Dazu gibt es natürlich Glühwein, Kinderpunsch, und weitere Getränke.

-

Alter ernsthaft 25 Stunden?

+

Was gibt es zu Essen?

- Prinzipiell ja. - Wer möchte kann sich aber gerne auf eine unserer beiden Couches zurückziehen, - oder eine Luftmatratze mitbringen, oder vorher gehen, oder später dazukommen, - oder zwischendurch nach Hause fahren... + Potluck, etc. + Bitte uns schreiben was mitgebracht wird.

-

Und was wenn ich Hunger bekomme?

+

Noch Programmpunkte

- Wir werden ein Curry, Chili o.Ä. kochen. - Bring aber auch gerne Snacks, Getränke, Knoblauchdip oder Kuchen mit :) -

-

Aber wo soll ich mein Auto hinstellen?

-

- Am Waldhaus gibt es einen kostenlosen Parkplatz. - Wenn du mit dem Auto kommst sag Bescheid, wir planen uns dort zu treffen und dann mit einem Auto auf Kai's Premium-Parkplatz direkt neben der WG fahren. + Willst du etwas anbieten? Gerne!