diff --git a/en/imprint.html b/en/imprint.html
index 18a83d3..550761f 100644
--- a/en/imprint.html
+++ b/en/imprint.html
@@ -8,7 +8,7 @@
-
+
5th Tübingen Digital Freedom Days
diff --git a/en/index.html b/en/index.html
index e7c48f9..66a7d92 100644
--- a/en/index.html
+++ b/en/index.html
@@ -8,7 +8,7 @@
-
+
5th Tübingen Digital Freedom Days
diff --git a/en/join.html b/en/join.html
index fc20c0c..ae0dbf2 100644
--- a/en/join.html
+++ b/en/join.html
@@ -8,7 +8,7 @@
-
+
5th Tübingen Digital Freedom Days
diff --git a/en/program.html b/en/program.html
index 71b3715..158b595 100644
--- a/en/program.html
+++ b/en/program.html
@@ -8,7 +8,7 @@
-
+
5th Tübingen Digital Freedom Days
diff --git a/en/recap.html b/en/recap.html
index 34cdd5d..7ecd6c4 100644
--- a/en/recap.html
+++ b/en/recap.html
@@ -8,7 +8,7 @@
-
+
5th Tübingen Digital Freedom Days
diff --git a/en/venue.html b/en/venue.html
index 817112e..40d85aa 100644
--- a/en/venue.html
+++ b/en/venue.html
@@ -8,7 +8,7 @@
-
+
5th Tübingen Digital Freedom Days
diff --git a/imprint.html b/imprint.html
index 2a80f84..be5e1f0 100644
--- a/imprint.html
+++ b/imprint.html
@@ -8,7 +8,7 @@
-
+
5. Tübinger Tage der digitalen Freiheit
diff --git a/index.html b/index.html
index 1fff3a9..c0e5ce2 100644
--- a/index.html
+++ b/index.html
@@ -8,7 +8,7 @@
-
+
5. Tübinger Tage der digitalen Freiheit
diff --git a/program.html b/program.html
index dbabd1b..2677140 100644
--- a/program.html
+++ b/program.html
@@ -8,7 +8,7 @@
-
+
5. Tübinger Tage der digitalen Freiheit
diff --git a/recap.html b/recap.html
index d28e0fb..de8319e 100644
--- a/recap.html
+++ b/recap.html
@@ -8,7 +8,7 @@
-
+
5. Tübinger Tage der digitalen Freiheit
diff --git a/styles-5.2.css b/styles-5.3.css
similarity index 91%
rename from styles-5.2.css
rename to styles-5.3.css
index 476d6be..9a05fce 100644
--- a/styles-5.2.css
+++ b/styles-5.3.css
@@ -3,6 +3,36 @@
* Handcrafted with ♥ by x~alotl
*/
+
+/**
+ * Variables
+ **/
+
+:root {
+
+ /* Colors */
+ --plum: #26175e;
+ --sage: #f0fff1;
+
+ --box: #f0fff1;
+ --text: #26175e;
+ --button: #52ffdc;
+ --active: #2b8b8d;
+ --link: #3203dd;
+ --shadowRgb: 125, 112, 122;
+ --boxShadow: 0 0 12px rgba(var(--shadowRgb), 0.3);
+
+ /* Animated Title */
+ --weightMin: 200;
+ --weightMax: 900;
+ --duration: 2200ms;
+ --step: 70ms;
+
+ /* Box Clipping */
+ --boxEdge: 40px;
+}
+
+
/**
* Font Faces
*/
@@ -36,29 +66,6 @@
-/**
- * Global Variables
- **/
-
-:root {
- --plum: #26175e;
- --sage: #f0fff1;
-
- --box: #f0fff1;
- --text: #26175e;
- --button: #52ffdc;
- --active: #2b8b8d ;
- --link: #3203dd;
- --shadow-rgb: 125, 112, 122;
- --box-shadow: 0 0 12px rgba(var(--shadow-rgb), 0.3);
-
- /* Animated Title Variables */
- --wght-min: 200;
- --wght-max: 900;
- --dur: 2200ms;
- --step: 70ms;
-}
-
/**
* Base
@@ -217,7 +224,13 @@ b {
margin-bottom: 2em;
padding: 0.5em 2em 1.4em 2em;
border: none;
- box-shadow: var(--box-shadow);
+ box-shadow: var(--boxShadow);
+ clip-path: polygon(var(--boxEdge) 0%,
+ 100% 0%,
+ 100% calc(100% - var(--boxEdge)),
+ calc(100% - var(--boxEdge)) 100%,
+ 0% 100%,
+ 0% var(--boxEdge));
}
.box-grid {
@@ -278,7 +291,7 @@ b {
transition: background-color 0.3s ease;
border-radius: 0;
margin: 0 auto;
- box-shadow: var(--box-shadow);
+ box-shadow: var(--boxShadow);
}
.button:hover {
@@ -374,12 +387,12 @@ b {
transition: background-color 0.3s ease, color 0.3s ease;
text-align: center;
margin: 0 5px;
- box-shadow: var(--box-shadow);
+ box-shadow: var(--boxShadow);
}
.navigationbar a:hover {
transform: scale(1.1);
- box-shadow: 0 0 16px rgba(var(--shadow-rgb), 0.5);
+ box-shadow: 0 0 16px rgba(var(--shadowRgb), 0.5);
}
.navigationbar a.active {
@@ -427,8 +440,8 @@ b {
.title .ch {
display: inline-block;
will-change: font-variation-settings;
- font-variation-settings: "wght" var(--wght-min);
- animation: wghtWave var(--dur) cubic-bezier(.45, 0, .1, 1) infinite alternate;
+ font-variation-settings: "wght" var(--weightMin);
+ animation: wghtWave var(--duration) cubic-bezier(.45, 0, .1, 1) infinite alternate;
animation-delay: calc(var(--i) * var(--step));
}
@@ -439,11 +452,11 @@ b {
@keyframes wghtWave {
from {
- font-variation-settings: "wght" var(--wght-min);
+ font-variation-settings: "wght" var(--weightMin);
}
to {
- font-variation-settings: "wght" var(--wght-max);
+ font-variation-settings: "wght" var(--weightMax);
}
}
diff --git a/venue.html b/venue.html
index aa531a9..0670b0c 100644
--- a/venue.html
+++ b/venue.html
@@ -8,7 +8,7 @@
-
+
5. Tübinger Tage der digitalen Freiheit