Merge branch 'main' of ssh://git.hofer.link:2222/philipp/aef-website
This commit is contained in:
@@ -1,6 +1,5 @@
|
||||
_version: 1
|
||||
digital_shadows: "Digitaler Schatten"
|
||||
icon_home: "🏠"
|
||||
icon_camera: "📸"
|
||||
found_camera_title: "Kamera '%{name}' gefunden"
|
||||
found_camera_body: "✨ Du bist #%{amount} der/die diese Kamera gefunden hat ✨"
|
||||
|
@@ -1,6 +1,5 @@
|
||||
_version: 1
|
||||
digital_shadows: "Digital Shadows"
|
||||
icon_home: "🏠"
|
||||
icon_camera: "📸"
|
||||
found_camera_title: "Camera '%{name}' found"
|
||||
found_camera_body: "✨ You are #%{amount} who has found this camera ✨"
|
||||
|
17
src/page.rs
17
src/page.rs
@@ -75,11 +75,6 @@ impl Page {
|
||||
}
|
||||
}
|
||||
ul {
|
||||
li {
|
||||
a href="/" {
|
||||
span role="img" aria-label="home" { (t!("icon_home")) }
|
||||
}
|
||||
}
|
||||
li {
|
||||
a href="/game" {
|
||||
span role="img" aria-label="camera" { (t!("icon_camera")) }
|
||||
@@ -100,25 +95,31 @@ impl Page {
|
||||
|
||||
main.container {
|
||||
@if let Some(found_camera) = &self.found_camera {
|
||||
article class="succ w-full" {
|
||||
div.flex {
|
||||
article class="succ msg" {
|
||||
header { (t!("found_camera_title", name = found_camera.0)) }
|
||||
(t!("found_camera_body", amount = found_camera.1))
|
||||
footer { a href="#ranking" { "See your ranking" } }
|
||||
}
|
||||
}
|
||||
}
|
||||
@if self.new_name {
|
||||
article class="name w-full" {
|
||||
div.flex {
|
||||
article class="name msg" {
|
||||
header { "New name!" }
|
||||
"Does it feel much different?"
|
||||
}
|
||||
}
|
||||
}
|
||||
@if let Some(err) = &self.err {
|
||||
article class="error w-full" {
|
||||
div.flex {
|
||||
article class="error msg" {
|
||||
header { (err.0) }
|
||||
(err.1)
|
||||
footer { (err.2) }
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
section { (content) }
|
||||
}
|
||||
|
@@ -16,6 +16,7 @@
|
||||
--pico-card-sectioning-background-color: unset;
|
||||
--pico-mark-background-color: yellow !important;
|
||||
--pico-mark-color: black !important;
|
||||
--custom-box-shadow: #015886;
|
||||
}
|
||||
|
||||
/** Headline Styles */
|
||||
@@ -29,6 +30,10 @@ h1 {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
hgroup>:not(:first-child):last-child {
|
||||
--pico-color: var(--pico-color);
|
||||
}
|
||||
|
||||
h2 {
|
||||
--pico-typography-spacing-top: 4rem;
|
||||
}
|
||||
@@ -36,34 +41,31 @@ h2 {
|
||||
/** Button Styles */
|
||||
input[type="submit"],
|
||||
button:not([class="secondary"]) {
|
||||
transition: margin-top 0.3s ease,
|
||||
margin-left 0.3s ease,
|
||||
box-shadow 0.3s ease;
|
||||
transition: box-shadow 0.3s ease;
|
||||
|
||||
background: var(--pico-primary);
|
||||
border: solid 1px var(--pico-primary-hover-background);
|
||||
background: var(--pico-primary-background);
|
||||
border: solid 1px var(--custom-box-shadow);
|
||||
|
||||
box-shadow: 1px 0px 0px var(--pico-primary-hover-background),0px 1px 0px var(--pico-primary-hover-background),
|
||||
2px 1px 0px var(--pico-primary-hover-background),1px 2px 0px var(--pico-primary-hover-background),
|
||||
3px 2px 0px var(--pico-primary-hover-background),2px 3px 0px var(--pico-primary-hover-background),
|
||||
4px 3px 0px var(--pico-primary-hover-background),3px 4px 0px var(--pico-primary-hover-background),
|
||||
5px 4px 0px var(--pico-primary-hover-background),4px 5px 0px var(--pico-primary-hover-background),
|
||||
6px 5px 0px var(--pico-primary-hover-background),5px 6px 0px var(--pico-primary-hover-background),
|
||||
7px 6px 0px var(--pico-primary-hover-background),6px 7px 0px var(--pico-primary-hover-background),
|
||||
8px 7px 0px var(--pico-primary-hover-background),7px 8px 0px var(--pico-primary-hover-background),
|
||||
9px 8px 0px var(--pico-primary-hover-background),8px 9px 0px var(--pico-primary-hover-background);
|
||||
box-shadow: 1px 0px 0px var(--custom-box-shadow),0px 1px 0px var(--custom-box-shadow),
|
||||
2px 1px 0px var(--custom-box-shadow),1px 2px 0px var(--custom-box-shadow),
|
||||
3px 2px 0px var(--custom-box-shadow),2px 3px 0px var(--custom-box-shadow),
|
||||
4px 3px 0px var(--custom-box-shadow),3px 4px 0px var(--custom-box-shadow),
|
||||
5px 4px 0px var(--custom-box-shadow),4px 5px 0px var(--custom-box-shadow),
|
||||
6px 5px 0px var(--custom-box-shadow),5px 6px 0px var(--custom-box-shadow),
|
||||
7px 6px 0px var(--custom-box-shadow),6px 7px 0px var(--custom-box-shadow),
|
||||
8px 7px 0px var(--custom-box-shadow),7px 8px 0px var(--custom-box-shadow),
|
||||
9px 8px 0px var(--custom-box-shadow),8px 9px 0px var(--custom-box-shadow);
|
||||
}
|
||||
|
||||
input[type="submit"]:focus,
|
||||
button:not([class="secondary"]):focus {
|
||||
outline: 3px solid yellow;
|
||||
}
|
||||
|
||||
/* When the button is clicked */
|
||||
button:not([class="secondary"]):active,
|
||||
input[type="submit"]:active {
|
||||
transition: margin-top 0.3s ease;
|
||||
margin-left 0.3s ease;
|
||||
box-shadow 0.3s ease;
|
||||
|
||||
margin-left:9px;
|
||||
margin-top:9px;
|
||||
|
||||
transition: box-shadow 0.3s ease;
|
||||
box-shadow: 0px 0px 0px var(--pico-primary-hover-background);
|
||||
}
|
||||
|
||||
@@ -97,10 +99,11 @@ input[type="submit"]:active {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.w-full {
|
||||
.msg {
|
||||
width: 100%;
|
||||
max-width: 40rem;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.small {
|
||||
|
Reference in New Issue
Block a user