diff --git a/src/PartyPage.css b/src/PartyPage.css index 39b3e29..5c59264 100644 --- a/src/PartyPage.css +++ b/src/PartyPage.css @@ -6,6 +6,7 @@ .App { font-size: calc(10px + 2vmin); + font-weight: bolder; } .page { @@ -15,17 +16,19 @@ display: flex; flex-direction: column; align-items: center; + text-shadow: 0 0 0.5em white } .page-content { flex-grow: 1; max-width: 1224px; + padding: 0 1.5em; } .info-button { display: flex; flex-direction: column; - padding-bottom: 2em; + padding-bottom: 4em; cursor: pointer; } @@ -43,10 +46,15 @@ input[type="radio"]+label { cursor: pointer; display: inline-block; width: 5em; + text-shadow: none; + background-color: rgba(255, 255, 255, 0.5); + border-radius: 1em; + margin: 0.4em; + padding: 0.2em; } input[type="radio"]+label:hover { - text-shadow: 0 0 1em; + background-color: var(--selected-bg); } input[type="radio"]+label:last-of-type { @@ -60,22 +68,25 @@ input[type="radio"]:checked+label { #coming-yes+label { --selected-color: #16a34a; + --selected-bg: #14532d; } #coming-maybe+label { --selected-color: #ca8a04; + --selected-bg: #713f12; } #coming-no+label { --selected-color: #dc2626; + --selected-bg: #7f1d1d; } .bg { - background-image: url("https://www.inshape.de/fileadmin/user_upload/user_upload/Fotolia_216856994_Subscription_Monthly_M.jpg"); + background-image: url("assets/background.jpg"); width: 100vw; height: 100vh; position: absolute; - filter: blur(7px); + filter: blur(7px) contrast(70%); background-size: cover; } @@ -83,8 +94,4 @@ input[type="radio"]:checked+label { position: sticky; top: 0px; z-index: -1; -} - -.page :is(p, label, h1, h2, h3, h4, h5, h6) { - filter: drop-shadow(1px 1px 3px white); } \ No newline at end of file diff --git a/src/assets/background.jpg b/src/assets/background.jpg new file mode 100644 index 0000000..c10d60c Binary files /dev/null and b/src/assets/background.jpg differ