diff --git a/css/general.css b/css/general.css
index 8c3758a..e94ed8d 100644
--- a/css/general.css
+++ b/css/general.css
@@ -280,6 +280,7 @@ nav * {
display: flex;
flex-flow: row wrap;
max-width: 420px;
+ padding: 0 10px;
min-width: none;
justify-content: center;
}
@@ -674,7 +675,7 @@ nav * {
}
}
-#header-subtitle-date {
+.header-subtitle {
padding: 5px 7px;
margin-top: 5px;
border-radius: 10px;
@@ -683,7 +684,23 @@ nav * {
place-items: center;
border: 1px solid rgb(73, 73, 73);
background-color: rgb(22, 22, 22);
- animation: slidein ease 1.5s;
+}
+
+.header-subtitle.donate {
+ background: rgb(98,0,255);
+ background: linear-gradient(90deg, rgba(98,0,255,1) 0%, rgba(199,82,35,1) 75%, rgba(209,117,47,1) 100%);
+}
+
+.header-link.left {
+ animation: slideinleft ease 1.5s;
+ animation-delay: calc(var(--i));
+ animation-fill-mode: both;
+}
+
+.header-link.right {
+ animation: slideinright ease 1.5s;
+ animation-delay: calc(var(--i));
+ animation-fill-mode: both;
}
.header-link {
@@ -700,14 +717,30 @@ nav * {
color: rgb(252, 188, 93);
}
-#spots-tooltip::after {
- content: '← Sign up here';
+#map-tooltip::after {
+ content: '← Open map';
top: 12px;
- right: -150px;
+ right: -120px;
transform-origin: left;
color: rgb(252, 188, 93);
}
+#donate-tooltip::after {
+ content: '← Donate Page 💝';
+ top: 12px;
+ right: -160px;
+ transform-origin: left;
+ color: rgb(252, 188, 93);
+}
+
+#spots-tooltip::after {
+ content: 'Sign up here →';
+ top: 12px;
+ right: 205px;
+ transform-origin: right;
+ color: rgb(252, 188, 93);
+}
+
.header-info-container {
display: flex;
flex-flow: column nowrap;
@@ -734,14 +767,16 @@ nav * {
width: fit-content;
border: 1px solid rgb(73, 73, 73);
background-color: rgb(22, 22, 22);
- animation: slidein-2 ease 3s;
+ animation: slideinleft ease 1.5s;
+ background: rgb(20,48,10);
+ background: linear-gradient(90deg, rgba(20,48,10,1) 0%, rgba(43,52,44,1) 100%);
}
#header-subtitle-spots {
padding: 5px;
}
-#spots-container:hover, #header-subtitle-date:hover {
+#spots-container:hover, .header-subtitle:hover {
transform: translateY(-2px);
transition: 0.5s;
}
@@ -792,32 +827,48 @@ nav * {
opacity: 1;
}
}
-@keyframes slidein {
+@keyframes slideinleft {
0% {
- transform: translateY(250px);
+ transform: translateX(-20px);
opacity: 0;
}
60% {
opacity: 0;
+ transform: translateX(-20px);
}
100% {
- transform: translateY(0px);
+ transform: translateX(0px);
opacity: 1;
}
}
-@keyframes slidein-2 {
+@keyframes slideinright {
0% {
- transform: translateY(1000px);
+ transform: translateX(20px);
+ opacity: 0;
+ }
+ 60% {
+ transform: translateX(20px);
+ opacity: 0;
+ }
+ 100% {
+ transform: translateX(0px);
+ opacity: 1;
+ }
+}
+/* @keyframes slidein-2 {
+ 0% {
+ transform: translateY(20px);
opacity: 0;
}
80% {
+ transform: translateY(20px);
opacity: 0;
}
100% {
transform: translateY(0px);
opacity: 1;
}
-}
+} */
@keyframes slidein-side {
0% {
transform: translateX(-100px);
@@ -2618,7 +2669,7 @@ li .splide__pagination__page.is-active {
/* Utilities */
#line-header {
width: 200px;
- margin: 0 auto 5px;
+ margin: 10px 0;
animation: grow-wide ease 2s;
}
@@ -2689,6 +2740,11 @@ li .splide__pagination__page.is-active {
margin-left: 5px;
}
+.new-tab-icon.sub-icon {
+ height: 15px;
+ margin-left: 8px;
+}
+
.discord-icon {
width: 16px;
height: 16px;
diff --git a/img/WolframHackathonLogo2023.png b/img/WolframHackathonLogo2023.png
new file mode 100644
index 0000000..4fb9bb2
Binary files /dev/null and b/img/WolframHackathonLogo2023.png differ
diff --git a/index.html b/index.html
index 54e563a..c406a6c 100644
--- a/index.html
+++ b/index.html
@@ -121,13 +121,16 @@
-
-
+