diff --git a/css/general.css b/css/general.css index 0e49d08..7ccecd9 100644 --- a/css/general.css +++ b/css/general.css @@ -661,7 +661,7 @@ section { padding: 10px; width: 100%; text-align: center; - margin-bottom: 50px; + margin-bottom: 30px; } #timeline-heading { @@ -1013,6 +1013,57 @@ section { } } +.timeline-links { + display: flex; + flex-flow: row wrap; + justify-content: center; + text-align: center; + text-decoration: none !important; + margin-top: 15px; +} + +.timeline-icon { + height: 23px; + float: left; +} + +.timeline-button { + color: rgb(233, 203, 104); + text-decoration: none; + border-radius: 5px; + font-size: 18px; + border: 1px solid rgb(192, 168, 88); + padding: 5px; + display: inline-block; + margin: 0 10px; +} + +#zoom-link { + border: 1px solid rgb(45, 140, 255); +} + +.timeline-button#zoom-link:hover { + background-color: rgb(45, 140, 255); +} + +.timeline-button#zoom-link:hover > .timeline-icon{ + filter:hue-rotate(90deg); +} + +.timeline-button:hover { + color: white; + background-color: rgb(192, 168, 88); + transition: 0.5s; +} + +#zoom-tooltip::after { + content: 'Unavailable'; + font-size: 16px; + top: 40px; + right: 5px; + color: rgb(230, 96, 96); +} + /* Signup Container */ #signup-container { margin: 20px auto; @@ -1514,6 +1565,18 @@ section { .flex-container { display: flex; flex-flow: row wrap; + margin-top: 20px; + justify-content: center; +} + +.workshop-entry { + margin: 20px; + min-width: 500px; + background-color: rgb(19, 29, 41); + border-radius: 10px; + padding: 10px 30px; + box-shadow: 5px 5px 10px rgb(0 0 0 / 20%); + text-align: left; } #rules-description { diff --git a/img/zoom.png b/img/zoom.png new file mode 100644 index 0000000..72d4bbb Binary files /dev/null and b/img/zoom.png differ diff --git a/index.html b/index.html index 3d24232..55807a2 100644 --- a/index.html +++ b/index.html @@ -189,6 +189,9 @@
Now's your time to shine! Start working with your team to build your project. No strings attached!