From f422b72ffbd3a957ad80791ac4cd31bdc52dd826 Mon Sep 17 00:00:00 2001 From: roryjshelton <76418221+roryjshelton@users.noreply.github.com> Date: Fri, 5 May 2023 08:28:04 +0200 Subject: [PATCH] -> tailwind --- src/components/P1/CTO/CTO.astro | 12 ++++---- src/components/P1/CTO/CTOStyles.css | 33 ++++----------------- src/components/P1/Footer/FooterStyles.css | 4 +-- src/components/P1/Grid/Grid.astro | 2 -- src/components/P1/Message/MessageStyles.css | 2 +- src/components/P1/Socials/Socials.astro | 12 ++++---- src/components/P1/Socials/SocialsStyles.css | 10 +++---- 7 files changed, 27 insertions(+), 48 deletions(-) diff --git a/src/components/P1/CTO/CTO.astro b/src/components/P1/CTO/CTO.astro index 1512b3f..37a8988 100644 --- a/src/components/P1/CTO/CTO.astro +++ b/src/components/P1/CTO/CTO.astro @@ -2,11 +2,13 @@ import "./CtoStyles.css"; --- -
+
-
+
-
+

@@ -27,8 +29,8 @@ import "./CtoStyles.css";

-
Derrick Hammer
-
CTO
+
Derrick Hammer
+
CTO
diff --git a/src/components/P1/CTO/CTOStyles.css b/src/components/P1/CTO/CTOStyles.css index 142fb3d..428d079 100644 --- a/src/components/P1/CTO/CTOStyles.css +++ b/src/components/P1/CTO/CTOStyles.css @@ -1,15 +1,5 @@ -.cto-container { - width: 100%; - transition: 0.5s; -} - -.cto-bp { - padding-right: 0%; - transition: 0.5s; -} - .cto-geometric-bg { - background-image: url(../../../assets/geometric-bg.webp); + background-image: url('../../../assets/geometric-bg.webp'); background-position: 75vh -2vh; background-size: contain; background-repeat: no-repeat; @@ -19,19 +9,6 @@ transition: 0.5s; } -.cto-shadow { - border-radius: 72.5px; - width: 100%; - transition: 0.5s; -} - -.shadowdrop { - border-radius: 72.5px; - box-shadow: 0px 4px 4px #00000040; - width: 100%; - transition: 0.5s; -} - .cto-mini-bio { height: 96px; width: 100%; @@ -40,7 +17,7 @@ justify-content: center; flex-direction: column; background-repeat: no-repeat; - background-image: url(../../../assets/cto-avatar.webp); + background-image: url('../../../assets/cto-avatar.webp'); margin-top: 3vh; z-index: 999 !important; } @@ -56,7 +33,7 @@ transition: 0.5s; } -@media screen and (min-width: 0px) and (max-width: 600px) { +@media screen and (width >0px) and (width <=600px) { .cto-container { margin-left: -3em; background-position: 100px 50px; @@ -74,7 +51,7 @@ .shadowdrop { border-radius: 72.5px; - box-shadow: 0px 4px 4px #00000040; + box-shadow: 4px 4px #00000040; margin-left: 12%; transition: 0.5s; justify-content: center; @@ -88,7 +65,7 @@ } } -@media screen and (min-width: 601px) { +@media screen and (width >=601px) { .cto-container { background-position: 100px 50px; background-size: cover; diff --git a/src/components/P1/Footer/FooterStyles.css b/src/components/P1/Footer/FooterStyles.css index 70cff8e..e582807 100644 --- a/src/components/P1/Footer/FooterStyles.css +++ b/src/components/P1/Footer/FooterStyles.css @@ -1,5 +1,5 @@ .footer-logo { - background-image: url(../../../assets/lume-logo.webp); + background-image: url('../../../assets/lume-logo.webp'); background-repeat: no-repeat; background-size: contain; margin-left: 5px; @@ -13,7 +13,7 @@ } .footer-email { - background-image: url(../../../assets/email-icon.webp); + background-image: url('../../../assets/email-icon.webp'); background-repeat: no-repeat; background-size: contain; background-position: center; diff --git a/src/components/P1/Grid/Grid.astro b/src/components/P1/Grid/Grid.astro index 8d7d125..1cd516f 100644 --- a/src/components/P1/Grid/Grid.astro +++ b/src/components/P1/Grid/Grid.astro @@ -1,6 +1,4 @@ --- -import React from "react"; -import Grid from "dynamic-react-grid"; import "./GridStyles.css"; --- diff --git a/src/components/P1/Message/MessageStyles.css b/src/components/P1/Message/MessageStyles.css index acbc335..707c517 100644 --- a/src/components/P1/Message/MessageStyles.css +++ b/src/components/P1/Message/MessageStyles.css @@ -12,7 +12,7 @@ .message-header { color: var(--blue-charcoal-2); - font-family: var(--font-family-jetbrains_mono); + font-family: var(--font-family-jetbrains-mono); font-size: calc(25px + (32 - 24) * ((100vw - 300px) / (1600 - 300))); font-weight: 700; line-height: 2em; diff --git a/src/components/P1/Socials/Socials.astro b/src/components/P1/Socials/Socials.astro index 3ad1f9b..0dc9de3 100644 --- a/src/components/P1/Socials/Socials.astro +++ b/src/components/P1/Socials/Socials.astro @@ -2,12 +2,14 @@ import "./SocialsStyles.css"; --- -
+
-

get in touch

-
-
-
+

+ get in touch +

+
+
+
diff --git a/src/components/P1/Socials/SocialsStyles.css b/src/components/P1/Socials/SocialsStyles.css index 3c334bd..2cd3902 100644 --- a/src/components/P1/Socials/SocialsStyles.css +++ b/src/components/P1/Socials/SocialsStyles.css @@ -5,8 +5,8 @@ margin-bottom: 5vh; } -.gitHub { - background-image: url(../../../assets/github-logo.webp); +.github { + background-image: url('../../../assets/github-logo.webp'); background-position: 50% 50%; background-size: contain; background-repeat: no-repeat; @@ -15,7 +15,7 @@ } .discord { - background-image: url(../../../assets/discord-logo.webp); + background-image: url('../../../assets/discord-logo.webp'); background-position: 50% 50%; background-size: contain; background-repeat: no-repeat; @@ -26,7 +26,7 @@ } .twitter { - background-image: url(../../../assets/twitter-logo.webp); + background-image: url('../../../assets/twitter-logo.webp'); background-position: 50% 50%; background-size: contain; background-repeat: no-repeat; @@ -36,7 +36,7 @@ } .fb { - background-image: url(../../../assets/fb-logo.webp); + background-image: url('../../../assets/fb-logo.webp'); background-position: 50% 50%; background-size: contain; background-repeat: no-repeat;