From b2e68cec12b433452ea9b110d7d0cdbc84c87d24 Mon Sep 17 00:00:00 2001 From: Leif Niemczik Date: Tue, 29 Nov 2022 00:33:43 +0100 Subject: [PATCH] first blockout integration of key visual --- src/layouts/Layout.astro | 28 +++-- src/pages/index.astro | 26 +++-- src/pages/resources/index.astro | 7 +- src/scripts/visual.ts | 185 ++++++++++++++++++++++++++++++++ 4 files changed, 225 insertions(+), 21 deletions(-) create mode 100644 src/scripts/visual.ts diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index ce52ebb..c2f2b2a 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -18,7 +18,7 @@ const permaTitle = 'Hacking in Parallel 2022 //// Berlin'
- + @@ -115,6 +115,7 @@ const permaTitle = 'Hacking in Parallel 2022 //// Berlin' height: 100%; margin: auto; margin-left: 0.75rem; + margin-right: 5rem; } nav { // mobile menu styles @@ -132,10 +133,10 @@ const permaTitle = 'Hacking in Parallel 2022 //// Berlin' transform: translateX(100vw); transition: transform 0.25s ease-in-out; z-index: 10; - + @supports (height: 100dvh) { - height:100dvh; - padding:2rem; + height: 100dvh; + padding: 2rem; } label { @@ -156,7 +157,7 @@ const permaTitle = 'Hacking in Parallel 2022 //// Berlin' } // desktop menu styles - @media screen and (min-width: 768px) { + @media screen and (min-width: 1024px) { flex-direction: row; padding: 0; position: relative; @@ -205,7 +206,7 @@ const permaTitle = 'Hacking in Parallel 2022 //// Berlin' &.desktop-only { height: 4.5rem; width: auto; - gap: 1.5rem; + gap: 0.75rem; ul { flex-direction: row; } @@ -243,6 +244,17 @@ const permaTitle = 'Hacking in Parallel 2022 //// Berlin' font-weight: 500; cursor: pointer; } + #hero { + position: relative; + svg { + position: absolute; + top: 0; + left: 0; + bottom: 0; + right: 0; + z-index: -1; + } + } .gradient-bg { background: var(--gradient); padding: 1.5rem; @@ -276,12 +288,12 @@ const permaTitle = 'Hacking in Parallel 2022 //// Berlin' padding: 1.5rem 0; } - @media screen and (max-width: 768px) { + @media screen and (max-width: 1024px) { .desktop-only { display: none; } } - @media screen and (min-width: 768px) { + @media screen and (min-width: 1024px) { .mobile-only { display: none; } diff --git a/src/pages/index.astro b/src/pages/index.astro index 90d88fe..33592d0 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -4,8 +4,8 @@ import Layout from '../layouts/Layout.astro'
-
-
+
+

Hacking in Parallel ////

@@ -54,10 +54,10 @@ import Layout from '../layouts/Layout.astro' >.

- We also need and welcome support during HiP. For our ACC - "Angel Coordination Center" we have on the 5th floor, on the roof, a - nice big room with terrace and view over Berlin available as Heaven. - Just register in our Angel Coordination Center.

@@ -84,19 +84,27 @@ import Layout from '../layouts/Layout.astro'
+ +