Closed Calinou closed 9 months ago
Looks nice! I tried it out quickly but it is covering some of the nav buttons:
Not sure if it can start under the nav so it never covers it?
Could hide it behind the header.
Edit: Though maybe there is no winning :)
Here's the diff just in case
diff --git a/_includes/footer.html b/_includes/footer.html
index 6b54eb62..95a48251 100644
--- a/_includes/footer.html
+++ b/_includes/footer.html
@@ -1,5 +1,9 @@
</main>
+<a href="https://conference.godotengine.org/" class="current-event-banner">
+ GodotCon 2023!
+</a>
+
<footer>
<div class="container flex footer-container">
<div id="copyright">
diff --git a/_includes/header.html b/_includes/header.html
index 4c3fdc4d..eaed4868 100644
--- a/_includes/header.html
+++ b/_includes/header.html
@@ -1,20 +1,5 @@
<input type="checkbox" id="nav_toggle_cb">
<header>
- <a href="https://conference.godotengine.org/" style="
- position: absolute;
- top: 2.65rem;
- right: -3.65rem;
- transform: rotateZ(45deg);
- z-index: 9999;
- padding: 0.5rem 3.5rem;
- background-color: #f36a7f;
- box-shadow: 0 2px 2px hsla(0, 0%, 0%, 0.3);
- color: black;
- text-decoration: none;
- font-weight: 700;
- ">
- GodotCon 2023!
- </a>
<div class="container flex align-center">
<div id="nav_head">
<a href="/" id="logo-link">
diff --git a/_layouts/default.html b/_layouts/default.html
index 68c38b70..31b482d7 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -21,7 +21,7 @@
<link rel="alternate" type="application/rss+xml" title="Godot News" href="/rss.xml">
<link rel="icon" href="/assets/favicon.png" sizes="any">
<link rel="icon" href="/assets/favicon.svg" type="image/svg+xml">
- <link rel="stylesheet" href="/assets/css/main.css?109">
+ <link rel="stylesheet" href="/assets/css/main.css?110">
<link rel="stylesheet" href="/assets/css/tobii.min.css">
<link rel="preload" as="font" href="/assets/fonts/Montserrat-Bold.woff2" crossorigin>
<link rel="preload" as="font" href="/assets/fonts/Montserrat-ExtraBold.woff2" crossorigin>
diff --git a/assets/css/main.css b/assets/css/main.css
index 44fa7a7b..e430a55a 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -1468,3 +1468,17 @@ section.sponsors .grid {
.sponsor-empty:hover {
background-color: #8484841c;
}
+
+.current-event-banner {
+ position: absolute;
+ top: 4.75rem;
+ right: -4rem;
+ transform: rotateZ(45deg);
+ padding: 0.5rem 3.5rem 0.5rem 8.5rem;
+ z-index: 1;
+ background-color: var(--fund-color);
+ box-shadow: 0 2px 2px hsla(0, 0%, 0%, 0.3);
+ color: black;
+ text-decoration: none;
+ font-weight: 700;
+}
I think we can close this at this point :)
Yes, but we would need to find a place where to add this sort of banners for future events. Probably a bar under the current nav.
This reuses the design from https://github.com/godotengine/godot-website/pull/316.
Preview
In the future, we should investigate a design that's more easily seen on wide displays (example on a 4K display at 100% scale):