
diff --git a/src/sass/404/404.css b/src/sass/404/404.css
index 7f4e467..2c3e329 100644
--- a/src/sass/404/404.css
+++ b/src/sass/404/404.css
@@ -8,7 +8,8 @@
}
html, body {
- height: 100%;
+ height: -moz-fit-content;
+ height: fit-content;
width: 100%;
}
@@ -73,48 +74,78 @@ hr {
}
}
.desktop-navbar {
+ position: fixed;
+ width: 100%;
display: flex;
flex-direction: row;
- justify-content: space-between;
+ justify-content: center;
align-items: center;
- position: fixed;
- padding: 0 30px 0 30px;
z-index: 3;
top: 0;
- width: 100%;
- overflow: hidden;
+}
+.desktop-navbar > .navbar {
+ padding: 0 0 0 20px;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ align-items: center;
+ background-color: rgba(0, 0, 0, 0.3);
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
- height: 100px;
+ border-radius: 0 0 20px 20px;
+ height: 65px;
+ overflow: hidden;
+ width: -moz-fit-content;
+ width: fit-content;
+}
+.desktop-navbar > .navbar > .navbar-icon {
+ width: 48px;
+ height: 48px;
+}
+@media screen and (max-width: 720px) {
+ .desktop-navbar > .navbar {
+ width: 80%;
+ }
+}
+.desktop-navbar > .navbar > .navbar-divider {
+ margin: 0 10px 0 20px;
+ width: 3px;
+ border-radius: 20px;
+ height: 35px;
+ background-color: #FFF;
+}
+@media screen and (max-width: 720px) {
+ .desktop-navbar > .navbar > .navbar-divider {
+ display: none;
+ }
}
-.desktop-navbar > .navbar-links {
+.desktop-navbar > .navbar > .navbar-links {
display: flex;
flex-direction: row;
- justify-content: center;
+ justify-content: flex-start;
align-items: center;
- gap: 40px;
-}
-.desktop-navbar > .navbar-links > .navbar-link {
- font-size: clamp(1rem, 2vw, 1.4rem);
- z-index: 1;
- background-size: 1rem 1rem;
- background: none;
- border: none;
- text-decoration: none;
- border-radius: 4px;
- cursor: pointer;
- text-shadow: 0px 4px 3px rgba(0, 0, 0, 0.3);
+ height: 100%;
+ width: 100%;
+ font-size: clamp(1.2rem, 2vw, 1.4rem);
}
-@media screen and (max-width: 1138px) {
- .desktop-navbar > .navbar-links > .navbar-link {
+@media screen and (max-width: 720px) {
+ .desktop-navbar > .navbar > .navbar-links {
display: none;
}
}
-.desktop-navbar > #navbar-icon {
- height: 80px;
- width: 73.33px;
- -o-object-fit: contain;
- object-fit: contain;
+.desktop-navbar > .navbar > .navbar-links > .navbar-link {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ height: 100%;
+ padding: 10px;
+ cursor: pointer;
+ text-shadow: 0px 4px 3px rgba(0, 0, 0, 0.3);
+ border-radius: 4px;
+}
+.desktop-navbar > .navbar > .navbar-links > .navbar-link:hover {
+ background-color: rgba(0, 0, 0, 0.4);
}
/* */
@@ -122,17 +153,15 @@ hr {
/* */
.mobile-hamburger {
display: none;
+ margin: 0 20px 0 20px;
padding: 0;
- position: absolute;
- right: 30px;
- width: 32px;
height: 32px;
+ width: 32px;
flex-direction: column;
justify-content: space-between;
- opacity: 0;
animation: appear 2.2s ease;
}
-@media screen and (max-width: 1139px) {
+@media screen and (max-width: 720px) {
.mobile-hamburger {
opacity: 1;
display: flex;
@@ -236,8 +265,8 @@ hr {
}
html, body {
- background: radial-gradient(100% 100% at 50% 0%, rgb(173, 20, 9) 0%, #181818 100%);
- background-color: #181818;
+ background: radial-gradient(100% 100% at 50% 0%, rgb(173, 20, 9) 0%, #040A10 100%);
+ background-color: #040A10;
animation: show-radial-background 5s forwards ease-in-out;
background-repeat: no-repeat;
}
diff --git a/src/sass/404/404.css.map b/src/sass/404/404.css.map
index 9d32beb..6ec7570 100644
--- a/src/sass/404/404.css.map
+++ b/src/sass/404/404.css.map
@@ -1 +1 @@
-{"version":3,"sources":["../_config.sass","404.css","../_navbar.sass","404.sass","../_background.sass"],"names":[],"mappings":"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","file":"404.css"}
\ No newline at end of file
+{"version":3,"sources":["../modules/_config.sass","404.css","../modules/_navbar.sass","404.sass","../modules/_background.sass"],"names":[],"mappings":"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","file":"404.css"}
\ No newline at end of file
diff --git a/src/sass/404/404.sass b/src/sass/404/404.sass
index 3b5b477..f1ee9c3 100644
--- a/src/sass/404/404.sass
+++ b/src/sass/404/404.sass
@@ -1,6 +1,6 @@
-@import '../config'
-@import '../background'
-@import '../navbar'
+@import '../modules/config'
+@import '../modules/background'
+@import '../modules/navbar'
html, body
@include background(red, normal)
@@ -47,7 +47,7 @@ html, body
position: relative
z-index: 1
top: 5px
- background-color: $primary-text-color
+ background-color: $text
height: clamp(1rem, 2vw, 2rem)
width: 3px
diff --git a/src/sass/_blog-button.sass b/src/sass/_blog-button.sass
deleted file mode 100644
index 2c7de96..0000000
--- a/src/sass/_blog-button.sass
+++ /dev/null
@@ -1,19 +0,0 @@
-#exit-button-container
- padding: 10px
- @include flex(row, center, center)
-
- & > #exit-button
- cursor: pointer
- padding: 10px
- @include flex(row, center, center)
- background-color: $primary-background-color
- border-radius: 100px
- gap: 10px
- width: 200px
-
- &:hover, &:focus
- transform: scale(1.1)
-
- & > #exit-image
- width: 32px
- height: 32px
\ No newline at end of file
diff --git a/src/sass/_blog-cards.sass b/src/sass/_blog-cards.sass
deleted file mode 100644
index 12d9008..0000000
--- a/src/sass/_blog-cards.sass
+++ /dev/null
@@ -1,104 +0,0 @@
-#blog-cards-container
- @include flex(row, center, baseline)
- padding: 3px 25px 25px 25px
- width: 100%
- gap: 50px
- overflow-x: auto
-
- @media screen and (max-width: 1040px)
- justify-content: flex-start
-
-
- & > .blog-card
- @include flex(column, space-between, center)
- background-color: $secondary-background-color
- border-radius: 12px
- min-width: 500px
- max-width: 500px
- max-height: fit-content
- position: relative
- overflow: hidden
-
- @media screen and (max-width: 540px)
- min-width: 400px
-
- @media screen and (max-width: 420px)
- min-width: 300px
-
- @media screen and (max-width: 310px)
- min-width: 250px
-
- & > .blog-card-content
- & > .blog-card-image
- width: 100%
- border-radius: 12px 12px 0 0
-
- & > .blog-card-text
- @include flex(column, center, flex-start)
- gap: 10px
- padding: 5px 10px 10px 10px
-
- & > .blog-card-preview-title
- font-weight: 600
- font-size: clamp(1rem, 7vw, 1.8rem)
-
- & > .card-tags
- @include flex(row, flex-start, center)
- padding: 5px 0 5px 0
- font-size: clamp(0.7rem, 3.8vw, 1rem)
- gap: 10px
- font-weight: 600
-
- & > .card-tag
- padding: 5px
- border-radius: 10px
-
- & > .personal-tag
- background: $tag-personal-background-color
- background: $tag-personal-background-gradient
-
- & > .school-tag
- background: $tag-school-background-color
- background: $tag-school-background-gradient
-
- & > .website-tag
- background: $tag-website-background-color
- background: $tag-website-background-gradient
-
- & > .fullstack-tag
- background: $tag-fullstack-background-color
- background: $tag-fullstack-background-gradient
-
- & > .blog-card-description
- font-size: clamp(0.8rem, 7vw, 1.2rem)
-
- & > .blog-card-footer, .blog-card-redirect-container
- text-align: center
- width: 100%
- padding: 10px
- border-radius: 0 0 12px 12px
-
- & > .blog-card-redirect-container:not(:focus)
- display: none
- cursor: pointer
-
- &:focus, &:hover
- & > .blog-card-footer
- display: none
-
- & > .blog-card-redirect-container:not(:focus)
- display: inline
- background-color: $primary-link-button-color
- font-weight: 600
-
- &:hover
- background-color: $secondary-link-button-color
-
- &:focus-within
- & > .blog-card-footer
- display: none
-
- & > .blog-card-redirect-container
- display: inline
- background-color: $secondary-link-button-color
- font-weight: 600
\ No newline at end of file
diff --git a/src/sass/_config.sass b/src/sass/_config.sass
deleted file mode 100644
index decebca..0000000
--- a/src/sass/_config.sass
+++ /dev/null
@@ -1,137 +0,0 @@
-//
-// Fonts
-//
-
-@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;600&display=swap')
-
-//
-// Background Colors
-//
-
-$primary-background-color: #181818
-$secondary-background-color: #252525
-
-$orange-background-radial: radial-gradient(100% 100% at 50% 0%, rgb(254, 153, 0) 0%, $primary-background-color 100%)
-$red-background-radial: radial-gradient(100% 100% at 50% 0%, rgb(173, 20, 9) 0%, $primary-background-color 100%)
-$blue-background-radial: radial-gradient(100% 100% at 50% 0%, rgb(67, 94, 183) 0%, $primary-background-color 100%)
-
-$scroll-bar-background-color: rgba(200, 200, 200, 0.5)
-
-$project-card-title-background-color: rgba(0, 0, 0, 0.3 )
-$project-card-content-background-color: rgba(0, 0, 0, 0.6)
-
-$tooltip-background-color: #292A2D
-$tooltip-border-color: #CFD1D4
-
-$blog-warning-background-color: rgb(254, 153, 0, 0.5)
-
-//
-// Text Colors / Fonts / Link Colors
-//
-
-$primary-text-color: #FFFFFF
-$secondary-text-color: #B9B9B9
-
-$font: 'Rubik', sans-serif
-
-$primary-link-color: #0093FF
-$secondary-link-color: #0073FF
-
-$primary-link-filter: invert(39%) sepia(87%) saturate(2316%) hue-rotate(185deg) brightness(101%) contrast(109%)
-$secondary-link-filter: invert(28%) sepia(80%) saturate(3766%) hue-rotate(205deg) brightness(104%) contrast(104%)
-
-$primary-link-button-color: #de7301
-$secondary-link-button-color: #c26700
-
-//
-// Tags
-//
-
-$tag-personal-background-color: #BA7000
-$tag-personal-background-gradient: linear-gradient(90deg, rgb(186, 112, 0) 0%, rgb(111, 67, 0) 100%)
-
-$tag-school-background-color: #5E2885
-$tag-school-background-gradient: linear-gradient(270deg, rgba(94,40,133,1) 0%, rgba(0,129,201,1) 100%)
-
-$tag-website-background-color: #CD2F2F
-$tag-website-background-gradient: linear-gradient(270deg, rgba(205,47,47,1) 0%, rgba(32,143,9,1) 100%)
-
-$tag-fullstack-background-color: #1947CE
-$tag-fullstack-background-gradient: linear-gradient(270deg, rgba(25,71,206,1) 0%, rgba(35,98,0,1) 100%)
-
-//
-// Mixins
-//
-
-@mixin flex($direction, $justify, $align)
- display: flex
- flex-direction: $direction
- justify-content: $justify
- align-items: $align
-
-//
-// Elements
-//
-
-*
- box-sizing: border-box
- margin: 0
- padding: 0
- font-family: $font
- color: $primary-text-color
-
-html, body
- height: 100%
- width: 100%
-
-a
- text-decoration: none
-
-hr
- width: 100%
-
-.hidden
- opacity: 0
- transition: opacity 2s
-
-.show
- opacity: 1
-
-*:focus-visible
- outline: 2px solid #FFFFFF
- border-radius: 8px
-
-#link, #gmail-link
- @include flex(row, space-around, center)
- font-size: clamp(1rem, 3vw, 1.8rem)
- cursor: pointer
-
- &:hover #link-text, &:focus #link-text
- color: $secondary-link-color
-
- &:hover #link-image, &:focus #link-image
- filter: $secondary-link-filter
-
- & > #link-image
- width: clamp(24px, 2vw, 35px)
- height: auto
- margin-right: 5px
- filter: $primary-link-filter
-
- & > #link-text
- color: $primary-link-color
-
-.inline
- background-color: #141414
- padding: 5px
- border-radius: 8px
-
-//
-// Animations
-//
-
-@keyframes fadeIn
- 0%
- opacity: 0
- 100%
- opacity: 1
\ No newline at end of file
diff --git a/src/sass/_project-cards.sass b/src/sass/_project-cards.sass
deleted file mode 100644
index 046f84f..0000000
--- a/src/sass/_project-cards.sass
+++ /dev/null
@@ -1,142 +0,0 @@
-@import 'config'
-
-#project-container
- background-color: $primary-background-color
-
-#project-cards-container
- @include flex(row, center, center)
- padding: 3px 25px 25px 25px
- width: 100%
- gap: 20px
- //overflow-x: auto
-
- //@media screen and (max-width: 860px)
- // justify-content: flex-start
-
- & > .card
- position: relative
- @include flex(column, flex-end, center)
- border-radius: 8px
- min-width: 400px
- min-height: 450px
- overflow: hidden
-
- @media screen and (max-width: 430px)
- min-width: 350px
- min-height: 400px
-
- @media screen and (max-width: 375px)
- min-width: 300px
- min-height: 350px
-
- @media screen and (max-width: 325px)
- min-width: 250px
- min-height: 300px
-
- &:nth-child(1)
- transition-delay: 100ms
- &:nth-child(2)
- transition-delay: 200ms
-
- &:hover, &:focus, &:focus-within
- & > .card-preview-title
- opacity: 0
- transition: opacity 200ms ease-in-out
-
- & > .card-content
- max-height: 100%
- transition: all 900ms ease-in-out
- opacity: 1
-
- & > .card-image
- height: 100%
- width: 100%
- border-radius: 8px
-
- & > .card-preview-title
- position: absolute
- text-align: center
- background: $project-card-title-background-color
- border-radius: 8px
- backdrop-filter: blur(5px)
- -webkit-backdrop-filter: blur(5px)
- width: 100%
- left: 50%
- padding: 5px
- transform: translate(-50%)
- font-size: clamp(1.5rem, 7vw, 2rem)
- transition: opacity 400ms 850ms ease-in-out
- opacity: 1
-
- & > .card-content
- position: absolute
- text-align: center
- width: 100%
- z-index: 2
- border-radius: 8px
- opacity: 0
- max-height: 1px // Mobile blur bug
- padding: 0 12px 0 12px
- transition: all 900ms ease-in-out
- background: $project-card-content-background-color
- backdrop-filter: blur(10px)
- overflow: hidden
- -webkit-backdrop-filter: blur(10px)
-
- & > *
- margin-bottom: 10px
-
- & > .card-title
- margin-top: 10px
- font-size: clamp(1.5rem, 7vw, 2rem)
-
- & > .card-tags
- @include flex(row, center, center)
- font-size: clamp(0.7rem, 3.8vw, 1rem)
- gap: 10px
- font-weight: 600
-
- & > .card-tag
- padding: 5px
- border-radius: 10px
-
- & > .personal-tag
- background: $tag-personal-background-color
- background: $tag-personal-background-gradient
-
- & > .school-tag
- background: $tag-school-background-color
- background: $tag-school-background-gradient
-
- & > .website-tag
- background: $tag-website-background-color
- background: $tag-website-background-gradient
-
- & > .fullstack-tag
- background: $tag-fullstack-background-color
- background: $tag-fullstack-background-gradient
-
- & > .card-desc
- font-size: clamp(0.8rem, 1vw, 1rem)
-
- & > .card-link
- @include flex(row, center, center)
-
- & > .card-link-button
- @include flex(row, center, center)
- gap: 10px
- background-color: $primary-link-button-color
- border: none
- padding: 10px
- font-weight: 400
- width: 70%
- font-size: clamp(0.7rem, 4vw, 1rem)
- border-radius: 8px
- cursor: pointer
-
- &:hover, &:focus
- background-color: $secondary-link-button-color
-
- & > .card-link-image
- width: 32px
- height: 32px
\ No newline at end of file
diff --git a/src/sass/all-blogs/all-blogs.css b/src/sass/all-blogs/all-blogs.css
deleted file mode 100644
index 926f3f7..0000000
--- a/src/sass/all-blogs/all-blogs.css
+++ /dev/null
@@ -1,501 +0,0 @@
-@import url("https://fonts.googleapis.com/css2?family=Rubik:wght@400;600&display=swap");
-* {
- box-sizing: border-box;
- margin: 0;
- padding: 0;
- font-family: "Rubik", sans-serif;
- color: #FFFFFF;
-}
-
-html, body {
- height: 100%;
- width: 100%;
-}
-
-a {
- text-decoration: none;
-}
-
-hr {
- width: 100%;
-}
-
-.hidden {
- opacity: 0;
- transition: opacity 2s;
-}
-
-.show {
- opacity: 1;
-}
-
-*:focus-visible {
- outline: 2px solid #FFFFFF;
- border-radius: 8px;
-}
-
-#link, #gmail-link {
- display: flex;
- flex-direction: row;
- justify-content: space-around;
- align-items: center;
- font-size: clamp(1rem, 3vw, 1.8rem);
- cursor: pointer;
-}
-#link:hover #link-text, #link:focus #link-text, #gmail-link:hover #link-text, #gmail-link:focus #link-text {
- color: #0073FF;
-}
-#link:hover #link-image, #link:focus #link-image, #gmail-link:hover #link-image, #gmail-link:focus #link-image {
- filter: invert(28%) sepia(80%) saturate(3766%) hue-rotate(205deg) brightness(104%) contrast(104%);
-}
-#link > #link-image, #gmail-link > #link-image {
- width: clamp(24px, 2vw, 35px);
- height: auto;
- margin-right: 5px;
- filter: invert(39%) sepia(87%) saturate(2316%) hue-rotate(185deg) brightness(101%) contrast(109%);
-}
-#link > #link-text, #gmail-link > #link-text {
- color: #0093FF;
-}
-
-.inline {
- background-color: #141414;
- padding: 5px;
- border-radius: 8px;
-}
-
-@keyframes fadeIn {
- 0% {
- opacity: 0;
- }
- 100% {
- opacity: 1;
- }
-}
-.desktop-navbar {
- padding: 0.5rem 0 0.5rem 0.5rem;
- z-index: 3;
- top: 0;
- position: fixed;
- width: 100%;
- overflow: hidden;
- backdrop-filter: blur(15px);
- -webkit-backdrop-filter: blur(15px);
- height: 100px;
- display: flex;
- align-items: center;
- justify-content: center;
- gap: 20px;
-}
-.desktop-navbar > #navbar-icon {
- height: 80px;
- width: 73.33px;
- -o-object-fit: contain;
- object-fit: contain;
- cursor: pointer;
-}
-.desktop-navbar > #navbar-page-id {
- font-size: clamp(2.5rem, 16vw, 4rem);
- font-weight: 400;
- cursor: pointer;
-}
-
-body::-webkit-scrollbar {
- width: 16px;
- background-color: transparent;
-}
-body::-webkit-scrollbar-thumb {
- background-color: rgba(200, 200, 200, 0.5);
- border-radius: 10px;
- width: 16px;
-}
-body::-webkit-scrollbar-thumb:hover {
- background-color: rgba(200, 200, 200, 0.5);
-}
-
-#exit-button-container {
- padding: 10px;
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: center;
-}
-#exit-button-container > #exit-button {
- cursor: pointer;
- padding: 10px;
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: center;
- background-color: #181818;
- border-radius: 100px;
- gap: 10px;
- width: 200px;
-}
-#exit-button-container > #exit-button:hover, #exit-button-container > #exit-button:focus {
- transform: scale(1.1);
-}
-#exit-button-container > #exit-button > #exit-image {
- width: 32px;
- height: 32px;
-}
-
-.page-header {
- font-size: clamp(1.6rem, 7vw, 4rem);
- text-align: center;
- margin-top: 1px;
- padding: 25px 0 25px 0;
- color: #47DA44;
-}
-.page-header .comment-indicator-start, .page-header .comment-indicator-end {
- display: none;
-}
-.page-header[animate]::before {
- content: "//";
- animation: comments-start 8s, comments-fadeInOut 1.56s linear -1s 6;
-}
-.page-header[animate]::after {
- content: "";
- animation: comments-end 8s, comments-fadeInOut 1.56s linear -1s 6;
-}
-
-@keyframes comments-start {
- 0% {
- content: "//";
- }
- 20% {
- content: "#";
- }
- 40% {
- content: "";
- }
- 60% {
- content: "*/";
- }
- 80% {
- content: "";
- }
- 100% {
- content: "";
- }
-}
-@keyframes comments-fadeInOut {
- 0% {
- opacity: 0;
- }
- 50% {
- opacity: 1;
- }
- 100% {
- opacity: 0;
- }
-}
-.disclaimer {
- width: 100%;
- text-align: center;
- font-weight: 200;
- padding: 20px;
- font-size: 1.17rem;
-}
-
-#blog-cards-container {
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: baseline;
- padding: 3px 25px 25px 25px;
- width: 100%;
- gap: 50px;
- overflow-x: auto;
-}
-@media screen and (max-width: 1040px) {
- #blog-cards-container {
- justify-content: flex-start;
- }
-}
-#blog-cards-container > .blog-card {
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- align-items: center;
- background-color: #252525;
- border-radius: 12px;
- min-width: 500px;
- max-width: 500px;
- max-height: -moz-fit-content;
- max-height: fit-content;
- position: relative;
- overflow: hidden;
-}
-@media screen and (max-width: 540px) {
- #blog-cards-container > .blog-card {
- min-width: 400px;
- }
-}
-@media screen and (max-width: 420px) {
- #blog-cards-container > .blog-card {
- min-width: 300px;
- }
-}
-@media screen and (max-width: 310px) {
- #blog-cards-container > .blog-card {
- min-width: 250px;
- }
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-image {
- width: 100%;
- border-radius: 12px 12px 0 0;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: flex-start;
- gap: 10px;
- padding: 5px 10px 10px 10px;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .blog-card-preview-title {
- font-weight: 600;
- font-size: clamp(1rem, 7vw, 1.8rem);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags {
- display: flex;
- flex-direction: row;
- justify-content: flex-start;
- align-items: center;
- padding: 5px 0 5px 0;
- font-size: clamp(0.7rem, 3.8vw, 1rem);
- gap: 10px;
- font-weight: 600;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .card-tag {
- padding: 5px;
- border-radius: 10px;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .personal-tag {
- background: #BA7000;
- background: linear-gradient(90deg, rgb(186, 112, 0) 0%, rgb(111, 67, 0) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .school-tag {
- background: #5E2885;
- background: linear-gradient(270deg, rgb(94, 40, 133) 0%, rgb(0, 129, 201) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .website-tag {
- background: #CD2F2F;
- background: linear-gradient(270deg, rgb(205, 47, 47) 0%, rgb(32, 143, 9) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .fullstack-tag {
- background: #1947CE;
- background: linear-gradient(270deg, rgb(25, 71, 206) 0%, rgb(35, 98, 0) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .blog-card-description {
- font-size: clamp(0.8rem, 7vw, 1.2rem);
-}
-#blog-cards-container > .blog-card > .blog-card-footer, #blog-cards-container > .blog-card .blog-card-redirect-container {
- text-align: center;
- width: 100%;
- padding: 10px;
- border-radius: 0 0 12px 12px;
-}
-#blog-cards-container > .blog-card > .blog-card-redirect-container:not(:focus) {
- display: none;
- cursor: pointer;
-}
-#blog-cards-container > .blog-card:focus > .blog-card-footer, #blog-cards-container > .blog-card:hover > .blog-card-footer {
- display: none;
-}
-#blog-cards-container > .blog-card:focus > .blog-card-redirect-container:not(:focus), #blog-cards-container > .blog-card:hover > .blog-card-redirect-container:not(:focus) {
- display: inline;
- background-color: #de7301;
- font-weight: 600;
-}
-#blog-cards-container > .blog-card:focus > .blog-card-redirect-container:not(:focus):hover, #blog-cards-container > .blog-card:hover > .blog-card-redirect-container:not(:focus):hover {
- background-color: #c26700;
-}
-#blog-cards-container > .blog-card:focus-within > .blog-card-footer {
- display: none;
-}
-#blog-cards-container > .blog-card:focus-within > .blog-card-redirect-container {
- display: inline;
- background-color: #c26700;
- font-weight: 600;
-}
-
-#footer {
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: center;
- padding: 10px;
-}
-#footer > #footer-container {
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- align-items: center;
- backdrop-filter: blur(15px);
- -webkit-backdrop-filter: blur(15px);
- background-color: #252525;
- border-radius: 10px;
- width: 50%;
- padding: 10px;
- gap: 15px;
-}
-@media screen and (max-width: 1140px) {
- #footer > #footer-container {
- width: 80%;
- }
-}
-@media screen and (max-width: 370px) {
- #footer > #footer-container {
- width: 100%;
- }
-}
-#footer > #footer-container > #footer-content {
- display: flex;
- flex-direction: row;
- justify-content: space-between;
- align-items: center;
- border-radius: 10px;
- width: 100%;
- gap: 15px;
-}
-@media screen and (max-width: 595px) {
- #footer > #footer-container > #footer-content {
- flex-direction: column;
- }
-}
-#footer > #footer-container > #footer-content > #footer-logo > #footer-icon {
- width: 270.56px;
- height: 77.68px;
-}
-@media screen and (max-width: 300px) {
- #footer > #footer-container > #footer-content > #footer-logo > #footer-icon {
- content: url("/images/branding/ncp-icon.png");
- width: 90px;
- height: 98.18px;
- }
-}
-#footer > #footer-container > #footer-content > #footer-socials > #contact-container {
- display: flex;
- flex-direction: row;
- justify-content: flex-start;
- align-items: center;
- gap: 10px;
-}
-#footer > #footer-container > #footer-content > #footer-socials > #contact-container > .contact-image-container {
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: center;
- width: -moz-fit-content;
- width: fit-content;
- cursor: pointer;
-}
-#footer > #footer-container > #footer-content > #footer-socials > #contact-container > .contact-image-container > .contact-image {
- width: 32px;
- height: 32px;
-}
-#footer > #footer-container > #footer-content > #footer-socials > #contact-container > .contact-image-container > .contact-image:hover, #footer > #footer-container > #footer-content > #footer-socials > #contact-container > .contact-image-container > .contact-image:focus {
- transform: scale(1.4);
-}
-#footer > #footer-container > #footer-documents {
- text-align: center;
-}
-#footer > #footer-container > #footer-documents > *:hover {
- cursor: pointer;
- text-decoration: underline;
-}
-#footer > #footer-container > #footer-copyright {
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- align-items: center;
- text-align: center;
- gap: 5px;
-}
-
-#footer-modal {
- background-color: #252525;
- position: fixed;
- padding: 40px;
- border: none;
- border-radius: 16px;
- top: 50%;
- left: 50%;
- transform: translate(-50%, -50%);
- box-shadow: 0 5px 20px 0 rgb(0, 0, 0);
-}
-#footer-modal::backdrop {
- background: rgba(0, 0, 0, 0.7);
-}
-#footer-modal > #footer-modal-container {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- gap: 20px;
-}
-#footer-modal > #footer-modal-container > #footer-modal-content {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
- gap: 15px;
-}
-#footer-modal > #footer-modal-container > #footer-modal-content > * {
- font-size: clamp(1rem, 3vw, 1.6rem);
-}
-#footer-modal > #footer-modal-container > #footer-modal-button > #footer-modal-close {
- cursor: pointer;
- padding: 10px;
- border: none;
- background-color: #de7301;
- border-radius: 100px;
- gap: 10px;
- font-size: clamp(1rem, 3vw, 1.6rem);
- width: 200px;
-}
-#footer-modal > #footer-modal-container > #footer-modal-button > #footer-modal-close:hover, #footer-modal > #footer-modal-container > #footer-modal-button > #footer-modal-close:focus {
- transform: scale(1.1);
- background-color: #c26700;
-}
-
-body {
- background: radial-gradient(100% 100% at 50% 0%, rgb(67, 94, 183) 0%, #181818 100%);
- background-color: #181818;
- animation: show-radial-background 5s forwards ease-in-out;
- background-repeat: no-repeat;
-}
-@keyframes show-radial-background {
- 0% {
- background-size: 100vw 0vh;
- }
- 100% {
- background-size: 100vw 100vh;
- }
-}
-
-.page {
- padding-top: 100px;
-}/*# sourceMappingURL=all-blogs.css.map */
\ No newline at end of file
diff --git a/src/sass/all-blogs/all-blogs.css.map b/src/sass/all-blogs/all-blogs.css.map
deleted file mode 100644
index 962ffc0..0000000
--- a/src/sass/all-blogs/all-blogs.css.map
+++ /dev/null
@@ -1 +0,0 @@
-{"version":3,"sources":["../_config.sass","all-blogs.css","../_blog-navbar.sass","../_scrollbars.sass","../_blog-button.sass","../_headers.sass","../_blog-cards.sass","../_footer.sass","all-blogs.sass","../_background.sass"],"names":[],"mappings":"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","file":"all-blogs.css"}
\ No newline at end of file
diff --git a/src/sass/all-blogs/all-blogs.sass b/src/sass/all-blogs/all-blogs.sass
deleted file mode 100644
index cf90b8e..0000000
--- a/src/sass/all-blogs/all-blogs.sass
+++ /dev/null
@@ -1,14 +0,0 @@
-@import '../config'
-@import '../background'
-@import '../blog-navbar'
-@import '../scrollbars'
-@import '../blog-button'
-@import '../headers'
-@import '../blog-cards'
-@import '../footer'
-
-body
- @include background(blue, normal)
-
-.page
- padding-top: 100px
\ No newline at end of file
diff --git a/src/sass/blog/blog.css b/src/sass/blog/blog.css
index 3180664..2996c64 100644
--- a/src/sass/blog/blog.css
+++ b/src/sass/blog/blog.css
@@ -8,7 +8,8 @@
}
html, body {
- height: 100%;
+ height: -moz-fit-content;
+ height: fit-content;
width: 100%;
}
@@ -113,38 +114,10 @@ body::-webkit-scrollbar-thumb:hover {
background-color: rgba(200, 200, 200, 0.5);
}
-#exit-button-container {
- padding: 10px;
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: center;
-}
-#exit-button-container > #exit-button {
- cursor: pointer;
- padding: 10px;
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: center;
- background-color: #181818;
- border-radius: 100px;
- gap: 10px;
- width: 200px;
-}
-#exit-button-container > #exit-button:hover, #exit-button-container > #exit-button:focus {
- transform: scale(1.1);
-}
-#exit-button-container > #exit-button > #exit-image {
- width: 32px;
- height: 32px;
-}
-
.page-header {
- font-size: clamp(1.6rem, 7vw, 4rem);
- text-align: center;
+ font-size: clamp(1.6rem, 7vw, 2rem);
margin-top: 1px;
- padding: 25px 0 25px 0;
+ padding: 25px 0 10px 0;
color: #47DA44;
}
.page-header .comment-indicator-start, .page-header .comment-indicator-end {
@@ -211,141 +184,15 @@ body::-webkit-scrollbar-thumb:hover {
}
}
.disclaimer {
- width: 100%;
- text-align: center;
- font-weight: 200;
- padding: 20px;
font-size: 1.17rem;
}
-#blog-cards-container {
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: baseline;
- padding: 3px 25px 25px 25px;
- width: 100%;
- gap: 50px;
- overflow-x: auto;
-}
-@media screen and (max-width: 1040px) {
- #blog-cards-container {
- justify-content: flex-start;
- }
-}
-#blog-cards-container > .blog-card {
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- align-items: center;
- background-color: #252525;
- border-radius: 12px;
- min-width: 500px;
- max-width: 500px;
- max-height: -moz-fit-content;
- max-height: fit-content;
- position: relative;
- overflow: hidden;
-}
-@media screen and (max-width: 540px) {
- #blog-cards-container > .blog-card {
- min-width: 400px;
- }
-}
-@media screen and (max-width: 420px) {
- #blog-cards-container > .blog-card {
- min-width: 300px;
- }
-}
-@media screen and (max-width: 310px) {
- #blog-cards-container > .blog-card {
- min-width: 250px;
- }
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-image {
- width: 100%;
- border-radius: 12px 12px 0 0;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: flex-start;
- gap: 10px;
- padding: 5px 10px 10px 10px;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .blog-card-preview-title {
- font-weight: 600;
- font-size: clamp(1rem, 7vw, 1.8rem);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags {
- display: flex;
- flex-direction: row;
- justify-content: flex-start;
- align-items: center;
- padding: 5px 0 5px 0;
- font-size: clamp(0.7rem, 3.8vw, 1rem);
- gap: 10px;
- font-weight: 600;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .card-tag {
- padding: 5px;
- border-radius: 10px;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .personal-tag {
- background: #BA7000;
- background: linear-gradient(90deg, rgb(186, 112, 0) 0%, rgb(111, 67, 0) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .school-tag {
- background: #5E2885;
- background: linear-gradient(270deg, rgb(94, 40, 133) 0%, rgb(0, 129, 201) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .website-tag {
- background: #CD2F2F;
- background: linear-gradient(270deg, rgb(205, 47, 47) 0%, rgb(32, 143, 9) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .fullstack-tag {
- background: #1947CE;
- background: linear-gradient(270deg, rgb(25, 71, 206) 0%, rgb(35, 98, 0) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .blog-card-description {
- font-size: clamp(0.8rem, 7vw, 1.2rem);
-}
-#blog-cards-container > .blog-card > .blog-card-footer, #blog-cards-container > .blog-card .blog-card-redirect-container {
- text-align: center;
- width: 100%;
- padding: 10px;
- border-radius: 0 0 12px 12px;
-}
-#blog-cards-container > .blog-card > .blog-card-redirect-container:not(:focus) {
- display: none;
- cursor: pointer;
-}
-#blog-cards-container > .blog-card:focus > .blog-card-footer, #blog-cards-container > .blog-card:hover > .blog-card-footer {
- display: none;
-}
-#blog-cards-container > .blog-card:focus > .blog-card-redirect-container:not(:focus), #blog-cards-container > .blog-card:hover > .blog-card-redirect-container:not(:focus) {
- display: inline;
- background-color: #de7301;
- font-weight: 600;
-}
-#blog-cards-container > .blog-card:focus > .blog-card-redirect-container:not(:focus):hover, #blog-cards-container > .blog-card:hover > .blog-card-redirect-container:not(:focus):hover {
- background-color: #c26700;
-}
-#blog-cards-container > .blog-card:focus-within > .blog-card-footer {
- display: none;
-}
-#blog-cards-container > .blog-card:focus-within > .blog-card-redirect-container {
- display: inline;
- background-color: #c26700;
- font-weight: 600;
-}
-
#footer {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
+ margin-top: 50px;
padding: 10px;
}
#footer > #footer-container {
@@ -355,7 +202,7 @@ body::-webkit-scrollbar-thumb:hover {
align-items: center;
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
- background-color: #252525;
+ background-color: #131c24;
border-radius: 10px;
width: 50%;
padding: 10px;
@@ -436,7 +283,7 @@ body::-webkit-scrollbar-thumb:hover {
}
#footer-modal {
- background-color: #252525;
+ background-color: #131c24;
position: fixed;
padding: 40px;
border: none;
@@ -470,22 +317,22 @@ body::-webkit-scrollbar-thumb:hover {
cursor: pointer;
padding: 10px;
border: none;
- background-color: #de7301;
- border-radius: 100px;
+ background-color: #0750aa;
+ border-radius: 10px;
gap: 10px;
font-size: clamp(1rem, 3vw, 1.6rem);
width: 200px;
}
#footer-modal > #footer-modal-container > #footer-modal-button > #footer-modal-close:hover, #footer-modal > #footer-modal-container > #footer-modal-button > #footer-modal-close:focus {
transform: scale(1.1);
- background-color: #c26700;
+ background-color: #003c6e;
}
html, body {
height: -moz-fit-content;
height: fit-content;
- background: radial-gradient(100% 100% at 50% 0%, rgb(67, 94, 183) 0%, #181818 100%);
- background-color: #181818;
+ background: radial-gradient(100% 100% at 50% 0%, #3E8EE1 0%, #040A10 100%);
+ background-color: #040A10;
animation: show-radial-background 5s forwards ease-in-out;
background-repeat: no-repeat;
}
@@ -531,35 +378,6 @@ html, body {
font-size: clamp(1.8rem, 5vw, 2rem);
font-weight: 600;
}
-#blog-main > .card-tags {
- display: flex;
- flex-direction: row;
- justify-content: flex-start;
- align-items: center;
- font-size: clamp(0.7rem, 3.8vw, 1.5rem);
- gap: 10px;
- font-weight: 600;
-}
-#blog-main > .card-tags > .card-tag {
- padding: 5px;
- border-radius: 10px;
-}
-#blog-main > .card-tags > .personal-tag {
- background: #BA7000;
- background: linear-gradient(90deg, rgb(186, 112, 0) 0%, rgb(111, 67, 0) 100%);
-}
-#blog-main > .card-tags > .school-tag {
- background: #5E2885;
- background: linear-gradient(270deg, rgb(94, 40, 133) 0%, rgb(0, 129, 201) 100%);
-}
-#blog-main > .card-tags > .website-tag {
- background: #CD2F2F;
- background: linear-gradient(270deg, rgb(205, 47, 47) 0%, rgb(32, 143, 9) 100%);
-}
-#blog-main > .card-tags > .fullstack-tag {
- background: #1947CE;
- background: linear-gradient(270deg, rgb(25, 71, 206) 0%, rgb(35, 98, 0) 100%);
-}
#blog-main > #blog-publish-info {
font-size: clamp(0.4rem, 5vw, 1.4rem);
font-weight: 400;
diff --git a/src/sass/blog/blog.css.map b/src/sass/blog/blog.css.map
index 7a6c58b..c2fb960 100644
--- a/src/sass/blog/blog.css.map
+++ b/src/sass/blog/blog.css.map
@@ -1 +1 @@
-{"version":3,"sources":["../_config.sass","blog.css","../_blog-navbar.sass","../_scrollbars.sass","../_blog-button.sass","../_headers.sass","../_blog-cards.sass","../_footer.sass","blog.sass","../_background.sass"],"names":[],"mappings":"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","file":"blog.css"}
\ No newline at end of file
+{"version":3,"sources":["../modules/_config.sass","blog.css","../modules/_blog-navbar.sass","../modules/_scrollbars.sass","../modules/_headers.sass","../modules/_footer.sass","blog.sass","../modules/_background.sass"],"names":[],"mappings":"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","file":"blog.css"}
\ No newline at end of file
diff --git a/src/sass/blog/blog.sass b/src/sass/blog/blog.sass
index cea6919..57d2405 100644
--- a/src/sass/blog/blog.sass
+++ b/src/sass/blog/blog.sass
@@ -1,11 +1,9 @@
-@import '../config'
-@import '../background'
-@import '../blog-navbar'
-@import '../scrollbars'
-@import '../blog-button'
-@import '../headers'
-@import '../blog-cards'
-@import '../footer'
+@import '../modules/config'
+@import '../modules/background'
+@import '../modules/blog-navbar'
+@import '../modules/scrollbars'
+@import '../modules/headers'
+@import '../modules/footer'
html, body
height: fit-content
@@ -35,32 +33,6 @@ html, body
font-size: clamp(1.8rem, 5vw, 2rem)
font-weight: 600
- & > .card-tags
- @include flex(row, flex-start, center)
- font-size: clamp(0.7rem, 3.8vw, 1.5rem)
- gap: 10px
- font-weight: 600
-
- & > .card-tag
- padding: 5px
- border-radius: 10px
-
- & > .personal-tag
- background: $tag-personal-background-color
- background: $tag-personal-background-gradient
-
- & > .school-tag
- background: $tag-school-background-color
- background: $tag-school-background-gradient
-
- & > .website-tag
- background: $tag-website-background-color
- background: $tag-website-background-gradient
-
- & > .fullstack-tag
- background: $tag-fullstack-background-color
- background: $tag-fullstack-background-gradient
-
& > #blog-publish-info
font-size: clamp(0.4rem, 5vw, 1.4rem)
font-weight: 400
@@ -118,7 +90,7 @@ ul
.link
cursor: pointer
text-decoration: underline
- text-decoration-color: $primary-text-color
+ text-decoration-color: $text
.blog-inline-image-container
padding: 20px 0 0 0
diff --git a/src/sass/index/index.css b/src/sass/index/index.css
index 9b2f089..fc89477 100644
--- a/src/sass/index/index.css
+++ b/src/sass/index/index.css
@@ -9,7 +9,8 @@
}
html, body {
- height: 100%;
+ height: -moz-fit-content;
+ height: fit-content;
width: 100%;
}
@@ -74,48 +75,78 @@ hr {
}
}
.desktop-navbar {
+ position: fixed;
+ width: 100%;
display: flex;
flex-direction: row;
- justify-content: space-between;
+ justify-content: center;
align-items: center;
- position: fixed;
- padding: 0 30px 0 30px;
z-index: 3;
top: 0;
- width: 100%;
- overflow: hidden;
+}
+.desktop-navbar > .navbar {
+ padding: 0 0 0 20px;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ align-items: center;
+ background-color: rgba(0, 0, 0, 0.3);
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
- height: 100px;
+ border-radius: 0 0 20px 20px;
+ height: 65px;
+ overflow: hidden;
+ width: -moz-fit-content;
+ width: fit-content;
+}
+.desktop-navbar > .navbar > .navbar-icon {
+ width: 48px;
+ height: 48px;
}
-.desktop-navbar > .navbar-links {
+@media screen and (max-width: 720px) {
+ .desktop-navbar > .navbar {
+ width: 80%;
+ }
+}
+.desktop-navbar > .navbar > .navbar-divider {
+ margin: 0 10px 0 20px;
+ width: 3px;
+ border-radius: 20px;
+ height: 35px;
+ background-color: #FFF;
+}
+@media screen and (max-width: 720px) {
+ .desktop-navbar > .navbar > .navbar-divider {
+ display: none;
+ }
+}
+.desktop-navbar > .navbar > .navbar-links {
display: flex;
flex-direction: row;
- justify-content: center;
+ justify-content: flex-start;
align-items: center;
- gap: 40px;
-}
-.desktop-navbar > .navbar-links > .navbar-link {
- font-size: clamp(1rem, 2vw, 1.4rem);
- z-index: 1;
- background-size: 1rem 1rem;
- background: none;
- border: none;
- text-decoration: none;
- border-radius: 4px;
- cursor: pointer;
- text-shadow: 0px 4px 3px rgba(0, 0, 0, 0.3);
+ height: 100%;
+ width: 100%;
+ font-size: clamp(1.2rem, 2vw, 1.4rem);
}
-@media screen and (max-width: 1138px) {
- .desktop-navbar > .navbar-links > .navbar-link {
+@media screen and (max-width: 720px) {
+ .desktop-navbar > .navbar > .navbar-links {
display: none;
}
}
-.desktop-navbar > #navbar-icon {
- height: 80px;
- width: 73.33px;
- -o-object-fit: contain;
- object-fit: contain;
+.desktop-navbar > .navbar > .navbar-links > .navbar-link {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ height: 100%;
+ padding: 10px;
+ cursor: pointer;
+ text-shadow: 0px 4px 3px rgba(0, 0, 0, 0.3);
+ border-radius: 4px;
+}
+.desktop-navbar > .navbar > .navbar-links > .navbar-link:hover {
+ background-color: rgba(0, 0, 0, 0.4);
}
/* */
@@ -123,17 +154,15 @@ hr {
/* */
.mobile-hamburger {
display: none;
+ margin: 0 20px 0 20px;
padding: 0;
- position: absolute;
- right: 30px;
- width: 32px;
height: 32px;
+ width: 32px;
flex-direction: column;
justify-content: space-between;
- opacity: 0;
animation: appear 2.2s ease;
}
-@media screen and (max-width: 1139px) {
+@media screen and (max-width: 720px) {
.mobile-hamburger {
opacity: 1;
display: flex;
@@ -250,10 +279,9 @@ body::-webkit-scrollbar-thumb:hover {
}
.page-header {
- font-size: clamp(1.6rem, 7vw, 4rem);
- text-align: center;
+ font-size: clamp(1.6rem, 7vw, 2rem);
margin-top: 1px;
- padding: 25px 0 25px 0;
+ padding: 25px 0 10px 0;
color: #47DA44;
}
.page-header .comment-indicator-start, .page-header .comment-indicator-end {
@@ -320,10 +348,6 @@ body::-webkit-scrollbar-thumb:hover {
}
}
.disclaimer {
- width: 100%;
- text-align: center;
- font-weight: 200;
- padding: 20px;
font-size: 1.17rem;
}
@@ -346,129 +370,6 @@ body::-webkit-scrollbar-thumb:hover {
opacity: 20%;
}
}
-#blog-cards-container {
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: baseline;
- padding: 3px 25px 25px 25px;
- width: 100%;
- gap: 50px;
- overflow-x: auto;
-}
-@media screen and (max-width: 1040px) {
- #blog-cards-container {
- justify-content: flex-start;
- }
-}
-#blog-cards-container > .blog-card {
- display: flex;
- flex-direction: column;
- justify-content: space-between;
- align-items: center;
- background-color: #252525;
- border-radius: 12px;
- min-width: 500px;
- max-width: 500px;
- max-height: -moz-fit-content;
- max-height: fit-content;
- position: relative;
- overflow: hidden;
-}
-@media screen and (max-width: 540px) {
- #blog-cards-container > .blog-card {
- min-width: 400px;
- }
-}
-@media screen and (max-width: 420px) {
- #blog-cards-container > .blog-card {
- min-width: 300px;
- }
-}
-@media screen and (max-width: 310px) {
- #blog-cards-container > .blog-card {
- min-width: 250px;
- }
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-image {
- width: 100%;
- border-radius: 12px 12px 0 0;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: flex-start;
- gap: 10px;
- padding: 5px 10px 10px 10px;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .blog-card-preview-title {
- font-weight: 600;
- font-size: clamp(1rem, 7vw, 1.8rem);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags {
- display: flex;
- flex-direction: row;
- justify-content: flex-start;
- align-items: center;
- padding: 5px 0 5px 0;
- font-size: clamp(0.7rem, 3.8vw, 1rem);
- gap: 10px;
- font-weight: 600;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .card-tag {
- padding: 5px;
- border-radius: 10px;
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .personal-tag {
- background: #BA7000;
- background: linear-gradient(90deg, rgb(186, 112, 0) 0%, rgb(111, 67, 0) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .school-tag {
- background: #5E2885;
- background: linear-gradient(270deg, rgb(94, 40, 133) 0%, rgb(0, 129, 201) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .website-tag {
- background: #CD2F2F;
- background: linear-gradient(270deg, rgb(205, 47, 47) 0%, rgb(32, 143, 9) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .card-tags > .fullstack-tag {
- background: #1947CE;
- background: linear-gradient(270deg, rgb(25, 71, 206) 0%, rgb(35, 98, 0) 100%);
-}
-#blog-cards-container > .blog-card > .blog-card-content > .blog-card-text > .blog-card-description {
- font-size: clamp(0.8rem, 7vw, 1.2rem);
-}
-#blog-cards-container > .blog-card > .blog-card-footer, #blog-cards-container > .blog-card .blog-card-redirect-container {
- text-align: center;
- width: 100%;
- padding: 10px;
- border-radius: 0 0 12px 12px;
-}
-#blog-cards-container > .blog-card > .blog-card-redirect-container:not(:focus) {
- display: none;
- cursor: pointer;
-}
-#blog-cards-container > .blog-card:focus > .blog-card-footer, #blog-cards-container > .blog-card:hover > .blog-card-footer {
- display: none;
-}
-#blog-cards-container > .blog-card:focus > .blog-card-redirect-container:not(:focus), #blog-cards-container > .blog-card:hover > .blog-card-redirect-container:not(:focus) {
- display: inline;
- background-color: #de7301;
- font-weight: 600;
-}
-#blog-cards-container > .blog-card:focus > .blog-card-redirect-container:not(:focus):hover, #blog-cards-container > .blog-card:hover > .blog-card-redirect-container:not(:focus):hover {
- background-color: #c26700;
-}
-#blog-cards-container > .blog-card:focus-within > .blog-card-footer {
- display: none;
-}
-#blog-cards-container > .blog-card:focus-within > .blog-card-redirect-container {
- display: inline;
- background-color: #c26700;
- font-weight: 600;
-}
-
* {
box-sizing: border-box;
margin: 0;
@@ -478,7 +379,8 @@ body::-webkit-scrollbar-thumb:hover {
}
html, body {
- height: 100%;
+ height: -moz-fit-content;
+ height: fit-content;
width: 100%;
}
@@ -542,164 +444,106 @@ hr {
opacity: 1;
}
}
-#project-container {
- background-color: #181818;
-}
-
-#project-cards-container {
+#cards {
display: flex;
flex-direction: row;
- justify-content: center;
- align-items: center;
- padding: 3px 25px 25px 25px;
- width: 100%;
- gap: 20px;
-}
-#project-cards-container > .card {
- position: relative;
- display: flex;
- flex-direction: column;
- justify-content: flex-end;
+ justify-content: flex-start;
align-items: center;
- border-radius: 8px;
- min-width: 400px;
- min-height: 450px;
- overflow: hidden;
-}
-@media screen and (max-width: 430px) {
- #project-cards-container > .card {
- min-width: 350px;
- min-height: 400px;
- }
-}
-@media screen and (max-width: 375px) {
- #project-cards-container > .card {
- min-width: 300px;
- min-height: 350px;
- }
+ padding-top: 25px;
+ gap: 25px;
+ flex-wrap: wrap;
}
-@media screen and (max-width: 325px) {
- #project-cards-container > .card {
- min-width: 250px;
- min-height: 300px;
+@media screen and (max-width: 925px) {
+ #cards {
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
}
}
-#project-cards-container > .card:nth-child(1) {
- transition-delay: 100ms;
-}
-#project-cards-container > .card:nth-child(2) {
- transition-delay: 200ms;
-}
-#project-cards-container > .card:hover > .card-preview-title, #project-cards-container > .card:focus > .card-preview-title, #project-cards-container > .card:focus-within > .card-preview-title {
- opacity: 0;
- transition: opacity 200ms ease-in-out;
-}
-#project-cards-container > .card:hover > .card-content, #project-cards-container > .card:focus > .card-content, #project-cards-container > .card:focus-within > .card-content {
- max-height: 100%;
- transition: all 900ms ease-in-out;
- opacity: 1;
-}
-#project-cards-container > .card > .card-image {
- height: 100%;
- width: 100%;
- border-radius: 8px;
-}
-#project-cards-container > .card > .card-preview-title {
- position: absolute;
- text-align: center;
- background: rgba(0, 0, 0, 0.3);
- border-radius: 8px;
- backdrop-filter: blur(5px);
- -webkit-backdrop-filter: blur(5px);
- width: 100%;
- left: 50%;
- padding: 5px;
- transform: translate(-50%);
- font-size: clamp(1.5rem, 7vw, 2rem);
- transition: opacity 400ms 850ms ease-in-out;
- opacity: 1;
+#cards > .card {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: flex-start;
+ gap: 10px;
+ width: 400px;
+ height: -moz-fit-content;
+ height: fit-content;
+ border: 1px solid #131c24;
+ padding: 25px;
+ border-radius: 10px;
}
-#project-cards-container > .card > .card-content {
- position: absolute;
- text-align: center;
+#cards > .card > .card-header {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-between;
+ align-items: center;
+ gap: 20px;
width: 100%;
- z-index: 2;
- border-radius: 8px;
- opacity: 0;
- max-height: 1px;
- padding: 0 12px 0 12px;
- transition: all 900ms ease-in-out;
- background: rgba(0, 0, 0, 0.6);
- backdrop-filter: blur(10px);
- overflow: hidden;
- -webkit-backdrop-filter: blur(10px);
-}
-#project-cards-container > .card > .card-content > * {
- margin-bottom: 10px;
}
-#project-cards-container > .card > .card-content > .card-title {
- margin-top: 10px;
- font-size: clamp(1.5rem, 7vw, 2rem);
-}
-#project-cards-container > .card > .card-content > .card-tags {
+#cards > .card > .card-header > .card-header-info {
display: flex;
flex-direction: row;
- justify-content: center;
+ justify-content: flex-start;
align-items: center;
- font-size: clamp(0.7rem, 3.8vw, 1rem);
gap: 10px;
- font-weight: 600;
-}
-#project-cards-container > .card > .card-content > .card-tags > .card-tag {
- padding: 5px;
- border-radius: 10px;
-}
-#project-cards-container > .card > .card-content > .card-tags > .personal-tag {
- background: #BA7000;
- background: linear-gradient(90deg, rgb(186, 112, 0) 0%, rgb(111, 67, 0) 100%);
-}
-#project-cards-container > .card > .card-content > .card-tags > .school-tag {
- background: #5E2885;
- background: linear-gradient(270deg, rgb(94, 40, 133) 0%, rgb(0, 129, 201) 100%);
}
-#project-cards-container > .card > .card-content > .card-tags > .website-tag {
- background: #CD2F2F;
- background: linear-gradient(270deg, rgb(205, 47, 47) 0%, rgb(32, 143, 9) 100%);
-}
-#project-cards-container > .card > .card-content > .card-tags > .fullstack-tag {
- background: #1947CE;
- background: linear-gradient(270deg, rgb(25, 71, 206) 0%, rgb(35, 98, 0) 100%);
+#cards > .card > .card-header > .card-header-info > .card-icon {
+ width: 32px;
+ height: 32px;
}
-#project-cards-container > .card > .card-content > .card-desc {
- font-size: clamp(0.8rem, 1vw, 1rem);
+#cards > .card > .card-header > .card-header-info > .card-title {
+ font-size: clamp(1rem, 2vw, 1.4rem);
+ font-weight: 800;
}
-#project-cards-container > .card > .card-content > .card-link {
+#cards > .card > .card-header > .card-header-redirect > .card-redirect-icon {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
+ filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(70deg) brightness(112%) contrast(101%);
}
-#project-cards-container > .card > .card-content > .card-link > .card-link-button {
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: center;
+@media screen and (max-width: 405px) {
+ #cards > .card > .card-header > .card-header-redirect {
+ display: none;
+ }
+}
+@media screen and (max-width: 405px) {
+ #cards > .card > .card-header > .release-date {
+ display: none;
+ }
+}
+#cards > .card > .card-desc {
+ font-size: clamp(0.9rem, 2vw, 1rem);
+}
+#cards > .card > .card-button {
+ display: none;
gap: 10px;
- background-color: #de7301;
- border: none;
+ font-size: 16px;
padding: 10px;
- font-weight: 400;
- width: 70%;
- font-size: clamp(0.7rem, 4vw, 1rem);
- border-radius: 8px;
- cursor: pointer;
+ height: 44px;
+ width: 100%;
+ border-radius: 5px;
+ border: none;
+ background-color: #0750aa;
}
-#project-cards-container > .card > .card-content > .card-link > .card-link-button:hover, #project-cards-container > .card > .card-content > .card-link > .card-link-button:focus {
- background-color: #c26700;
+#cards > .card > .card-button[disabled] {
+ background-color: #131c24;
+ color: white;
}
-#project-cards-container > .card > .card-content > .card-link > .card-link-button > .card-link-image {
- width: 32px;
- height: 32px;
+@media screen and (max-width: 405px) {
+ #cards > .card > .card-button {
+ display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
+ }
+}
+#cards > .card > .card-button > .card-button-image {
+ width: 24px;
+ height: 24px;
+ filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(70deg) brightness(112%) contrast(101%);
}
#footer {
@@ -707,6 +551,7 @@ hr {
flex-direction: row;
justify-content: center;
align-items: center;
+ margin-top: 50px;
padding: 10px;
}
#footer > #footer-container {
@@ -716,7 +561,7 @@ hr {
align-items: center;
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
- background-color: #252525;
+ background-color: #131c24;
border-radius: 10px;
width: 50%;
padding: 10px;
@@ -797,7 +642,7 @@ hr {
}
#footer-modal {
- background-color: #252525;
+ background-color: #131c24;
position: fixed;
padding: 40px;
border: none;
@@ -831,19 +676,19 @@ hr {
cursor: pointer;
padding: 10px;
border: none;
- background-color: #de7301;
- border-radius: 100px;
+ background-color: #0750aa;
+ border-radius: 10px;
gap: 10px;
font-size: clamp(1rem, 3vw, 1.6rem);
width: 200px;
}
#footer-modal > #footer-modal-container > #footer-modal-button > #footer-modal-close:hover, #footer-modal > #footer-modal-container > #footer-modal-button > #footer-modal-close:focus {
transform: scale(1.1);
- background-color: #c26700;
+ background-color: #003c6e;
}
body {
- background-color: #181818;
+ background-color: #040A10;
}
body[disabled] {
overflow: hidden;
@@ -863,14 +708,31 @@ body[disabled] {
}
}
+.section {
+ margin: 0 auto 25px auto;
+ padding: 0 100px 0 100px;
+ max-width: 1480px;
+}
+@media screen and (max-width: 1140px) {
+ .section {
+ padding: 0 50px 0 50px;
+ }
+}
+@media screen and (max-width: 720px) {
+ .section {
+ padding: 0 25px 0 25px;
+ }
+}
+
#intro-container {
- padding: 0 60px 0 60px;
+ min-height: 100vh;
+ text-align: center;
display: flex;
flex-direction: row;
- justify-content: space-between;
+ justify-content: center;
align-items: center;
- background: radial-gradient(100% 100% at 50% 0%, rgb(254, 153, 0) 0%, #181818 100%);
- background-color: #181818;
+ background: radial-gradient(100% 100% at 50% 0%, #3E8EE1 0%, #040A10 100%);
+ background-color: #040A10;
animation: show-radial-background 5s forwards ease-in-out;
background-repeat: no-repeat;
}
@@ -882,12 +744,6 @@ body[disabled] {
background-size: 100vw 100vh;
}
}
-@media screen and (max-width: 1224px) {
- #intro-container {
- flex-direction: column-reverse;
- justify-content: center;
- }
-}
@media screen and (max-height: 640px) {
#intro-container {
padding-top: 100px;
@@ -903,10 +759,9 @@ body[disabled] {
flex-direction: column;
width: 45%;
}
-@media screen and (max-width: 1224px) {
+@media screen and (max-width: 900px) {
#intro-container > #intro-content {
- text-align: center;
- width: 100%;
+ width: 80%;
gap: 10px;
}
}
@@ -919,7 +774,7 @@ body[disabled] {
height: clamp(1.3rem, 4vw, 4rem);
}
#intro-container > #intro-content > #intro-detail {
- color: #B9B9B9;
+ color: #FFFFFF;
opacity: 0;
font-size: clamp(1.3rem, 2vw, 2.5rem);
animation: fadeIn 4s 2s forwards;
@@ -930,127 +785,78 @@ body[disabled] {
}
#intro-container > #intro-content > #intro-link {
display: flex;
+ flex-direction: row;
+ justify-content: center;
+ align-items: center;
margin-top: 10px;
opacity: 0;
animation: fadeIn 4s 3s forwards;
}
-@media screen and (max-width: 1224px) {
- #intro-container > #intro-content > #intro-link {
- justify-content: center;
- }
-}
-#intro-container > #intro-image {
- height: auto;
- width: auto;
- max-height: 50vh;
- max-width: 50vw;
- border-radius: 50%;
- -o-object-fit: contain;
- object-fit: contain;
- opacity: 0;
- margin: 25px;
- animation: intro-image-fadeIn 3s forwards, fadeIn 4s forwards;
-}
-#blogs-all-container {
+.view-all {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
- padding: 25px;
+ padding: 25px 0 25px 0;
}
-#blogs-all-container > #blogs-all-redirect {
- cursor: pointer;
- padding: 15px;
- border-radius: 8px;
- background-color: #de7301;
+.view-all > hr {
+ border: 2px solid #131c24;
+ border-radius: 10px;
}
-#blogs-all-container > #blogs-all-redirect:hover, #blogs-all-container > #blogs-all-redirect:focus {
- transform: scale(1.1);
- background-color: #c26700;
+.view-all > .view-all-button {
+ margin: 0 10px 0 10px;
+ padding: 10px;
+ width: 300px;
+ background-color: #0750aa;
+ border: none;
+ border-radius: 10px;
+ cursor: pointer;
}
-#languages-container {
- padding: 25px;
-}
-#languages-container > #languages-content {
- display: flex;
- flex-direction: row;
- justify-content: center;
- align-items: center;
-}
-#languages-container > #languages-content > #languages-widgets-container {
+#technology-widgets {
display: grid;
- justify-items: center;
- grid-template-columns: 1fr 1fr 1fr;
- width: -moz-fit-content;
- width: fit-content;
- gap: 25px;
-}
-@media screen and (max-width: 965px) {
- #languages-container > #languages-content > #languages-widgets-container {
- grid-template-columns: 1fr 1fr;
- }
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
+ grid-gap: 25px;
+ padding-top: 25px;
+ width: 100%;
}
-@media screen and (max-width: 640px) {
- #languages-container > #languages-content > #languages-widgets-container {
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center;
+@media screen and (max-width: 675px) {
+ #technology-widgets {
+ grid-template-columns: 1fr;
}
}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget {
- background-color: #252525;
- border-radius: 12px;
- padding: 12px;
- width: 300px;
+#technology-widgets > .technology-widget {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
+ padding: 12px;
+ border: 1px solid #131c24;
+ border-radius: 10px;
+ width: 100%;
+ gap: 10px;
}
-@media screen and (max-width: 640px) {
- #languages-container > #languages-content > #languages-widgets-container > .language-widget {
- width: 250px;
+@media screen and (max-width: 675px) {
+ #technology-widgets > .technology-widget {
+ width: 100%;
}
}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget:nth-child(1) {
- transition-delay: 100ms;
-}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget:nth-child(2) {
- transition-delay: 200ms;
-}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget:nth-child(3) {
- transition-delay: 300ms;
-}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget:nth-child(4) {
- transition-delay: 400ms;
-}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget:nth-child(5) {
- transition-delay: 500ms;
-}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget:nth-child(6) {
- transition-delay: 600ms;
-}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget:hover {
- transform: scale(1.04);
-}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget > .language-information-wrapper {
+#technology-widgets > .technology-widget > .technology-information-wrapper {
display: flex;
flex-direction: row;
justify-content: center;
align-items: center;
- gap: 12px;
+ gap: 10px;
}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget > .language-information-wrapper > .language-widget-logo {
+#technology-widgets > .technology-widget > .technology-information-wrapper > .technology-widget-logo {
width: 48px;
height: 48px;
}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget > .language-information-wrapper > .language-information > .language-name {
- font-size: clamp(1.3rem, 6vw, 1.5rem);
+#technology-widgets > .technology-widget > .technology-information-wrapper > .technology-information > .technology-name {
+ font-size: clamp(1.2rem, 6vw, 1.5rem);
}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget > .language-information-wrapper > .language-information > .language-duration {
+#technology-widgets > .technology-widget > .technology-information-wrapper > .technology-information > .technology-duration {
text-decoration: underline;
position: relative;
color: #B9B9B9;
@@ -1058,10 +864,10 @@ body[disabled] {
width: -moz-fit-content;
width: fit-content;
}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget > .language-information-wrapper > .language-information > .language-duration:hover ~ .tooltip, #languages-container > #languages-content > #languages-widgets-container > .language-widget > .language-information-wrapper > .language-information > .language-duration:focus ~ .tooltip {
+#technology-widgets > .technology-widget > .technology-information-wrapper > .technology-information > .technology-duration:hover ~ .tooltip, #technology-widgets > .technology-widget > .technology-information-wrapper > .technology-information > .technology-duration:focus ~ .tooltip {
visibility: visible;
}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget > .language-information-wrapper > .language-information > .tooltip {
+#technology-widgets > .technology-widget > .technology-information-wrapper > .technology-information > .tooltip {
visibility: hidden;
background-color: #292A2D;
padding: 5px;
@@ -1070,19 +876,7 @@ body[disabled] {
position: absolute;
z-index: 2;
}
-#languages-container > #languages-content > #languages-widgets-container > .language-widget > .language-level {
+#technology-widgets > .technology-widget > .technology-level {
width: 32px;
height: 32px;
-}
-
-@keyframes intro-image-fadeIn {
- 0% {
- box-shadow: 0px 0px 11px 0px rgba(254, 153, 0, 0);
- }
- 50% {
- box-shadow: 0px 0px 24px 0px rgba(254, 153, 0, 0.5);
- }
- 100% {
- box-shadow: 0px 0px 35px 0px rgb(254, 153, 0);
- }
}/*# sourceMappingURL=index.css.map */
\ No newline at end of file
diff --git a/src/sass/index/index.css.map b/src/sass/index/index.css.map
index 4fdf550..5a66ca0 100644
--- a/src/sass/index/index.css.map
+++ b/src/sass/index/index.css.map
@@ -1 +1 @@
-{"version":3,"sources":["../_config.sass","index.css","../_navbar.sass","../_scrollbars.sass","../_headers.sass","../_cursor.sass","../_blog-cards.sass","../_project-cards.sass","../_footer.sass","index.sass","../_background.sass"],"names":[],"mappings":"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","file":"index.css"}
\ No newline at end of file
+{"version":3,"sources":["../modules/_config.sass","index.css","../modules/_navbar.sass","../modules/_scrollbars.sass","../modules/_headers.sass","../modules/_cursor.sass","../modules/_card.sass","../modules/_footer.sass","index.sass","../modules/_background.sass"],"names":[],"mappings":"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","file":"index.css"}
\ No newline at end of file
diff --git a/src/sass/index/index.sass b/src/sass/index/index.sass
index 2ffbb3d..0a1bd9d 100644
--- a/src/sass/index/index.sass
+++ b/src/sass/index/index.sass
@@ -1,15 +1,14 @@
-@import '../config'
-@import '../background'
-@import '../navbar'
-@import '../scrollbars'
-@import '../headers'
-@import '../cursor'
-@import '../blog-cards'
-@import '../project-cards'
-@import '../footer'
+@import '../modules/config'
+@import '../modules/background'
+@import '../modules/navbar'
+@import '../modules/scrollbars'
+@import '../modules/headers'
+@import '../modules/cursor'
+@import '../modules/card'
+@import '../modules/footer'
body
- background-color: $primary-background-color
+ background-color: $background
&[disabled]
overflow: hidden
@@ -23,14 +22,22 @@ body
@media screen and (max-height: 640px)
min-height: 100%
-#intro-container
- padding: 0 60px 0 60px
- @include flex(row, space-between, center)
- @include background(orange, normal)
+.section
+ margin: 0 auto 25px auto
+ padding: 0 100px 0 100px
+ max-width: 1480px
+
+ @media screen and (max-width: 1140px)
+ padding: 0 50px 0 50px
- @media screen and (max-width: 1224px)
- flex-direction: column-reverse
- justify-content: center
+ @media screen and (max-width: 720px)
+ padding: 0 25px 0 25px
+
+#intro-container
+ min-height: 100vh
+ text-align: center
+ @include flex(row, center, center)
+ @include background(blue, normal)
@media screen and (max-height: 640px)
padding-top: 100px
@@ -43,9 +50,8 @@ body
flex-direction: column
width: 45%
- @media screen and (max-width: 1224px)
- text-align: center
- width: 100%
+ @media screen and (max-width: 900px)
+ width: 80%
gap: 10px
& > .intro-header
@@ -57,133 +63,90 @@ body
height: clamp(1.3rem, 4vw, 4rem)
& > #intro-detail
- color: $secondary-text-color
+ color: $text
opacity: 0
font-size: clamp(1.3rem, 2vw, 2.5rem)
animation: fadeIn 4s 2s forwards
& > #intro-detail-bold
- color: $secondary-text-color
+ color: $text-light
font-weight: 800
& > #intro-link
- display: flex
+ @include flex(row, center, center)
margin-top: 10px
opacity: 0
- animation: fadeIn 4s 3s forwards
-
- @media screen and (max-width: 1224px)
- justify-content: center
-
- & > #intro-image
- height: auto
- width: auto
- max-height: 50vh
- max-width: 50vw
- border-radius: 50%
- object-fit: contain
- opacity: 0
- margin: 25px
- animation: intro-image-fadeIn 3s forwards, fadeIn 4s forwards
-
-#blogs-all-container
- @include flex(row, center, center)
- padding: 25px
-
- & > #blogs-all-redirect
+ animation: fadeIn 4s 3s forwards
+
+.view-all
+ @include flex(row, center, center)
+ padding: 25px 0 25px 0
+
+ & > hr
+ border: 2px solid $background-light
+ border-radius: 10px
+
+ & > .view-all-button
+ margin: 0 10px 0 10px
+ padding: 10px
+ width: 300px
+ background-color: $primary
+ border: none
+ border-radius: 10px
cursor: pointer
- padding: 15px
- border-radius: 8px
- background-color: $primary-link-button-color
-
- &:hover, &:focus
- transform: scale(1.1)
- background-color: $secondary-link-button-color
-
-#languages-container
- padding: 25px
-
- & > #languages-content
- @include flex(row, center, center)
-
- & > #languages-widgets-container
- display: grid
- justify-items: center
- grid-template-columns: 1fr 1fr 1fr
- width: fit-content
- gap: 25px
-
- @media screen and (max-width: 965px)
- grid-template-columns: 1fr 1fr
-
- @media screen and (max-width: 640px)
- @include flex(column, center, center)
-
- & > .language-widget
- background-color: $secondary-background-color
- border-radius: 12px
- padding: 12px
- width: 300px
- @include flex(row, space-between, center)
-
- @media screen and (max-width: 640px)
- width: 250px
-
- &:nth-child(1)
- transition-delay: 100ms
- &:nth-child(2)
- transition-delay: 200ms
- &:nth-child(3)
- transition-delay: 300ms
- &:nth-child(4)
- transition-delay: 400ms
- &:nth-child(5)
- transition-delay: 500ms
- &:nth-child(6)
- transition-delay: 600ms
-
- &:hover
- transform: scale(1.04)
-
- & > .language-information-wrapper
- @include flex(row, center, center)
- gap: 12px
-
- & > .language-widget-logo
- width: 48px
- height: 48px
-
- & > .language-information
- & > .language-name
- font-size: clamp(1.3rem, 6vw, 1.5rem)
-
- & > .language-duration
- text-decoration: underline
- position: relative
- color: $secondary-text-color
- font-size: clamp(0.8rem, 5vw, 1rem)
- width: fit-content
-
- &:hover ~ .tooltip, &:focus ~ .tooltip
- visibility: visible
-
- & > .tooltip
- visibility: hidden
- background-color: $tooltip-background-color
- padding: 5px
- border: 1px solid $tooltip-border-color
- border-radius: 8px
- position: absolute
- z-index: 2
-
- & > .language-level
- width: 32px
- height: 32px
-
-@keyframes intro-image-fadeIn
- 0%
- box-shadow: 0px 0px 11px 0px rgba(254, 153, 0, 0)
- 50%
- box-shadow: 0px 0px 24px 0px rgba(254, 153, 0, 0.5)
- 100%
- box-shadow: 0px 0px 35px 0px rgba(254, 153, 0, 1)
\ No newline at end of file
+
+#technology-widgets
+ display: grid
+ grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))
+ grid-gap: 25px
+ padding-top: 25px
+ width: 100%
+
+ @media screen and (max-width: 675px)
+ grid-template-columns: 1fr
+
+ & > .technology-widget
+ @include flex(row, space-between, center)
+ padding: 12px
+ border: 1px solid $background-light
+ border-radius: 10px
+ width: 100%
+ gap: 10px
+
+ @media screen and (max-width: 675px)
+ width: 100%
+
+ & > .technology-information-wrapper
+ @include flex(row, center, center)
+ gap: 10px
+
+ & > .technology-widget-logo
+ width: 48px
+ height: 48px
+
+ & > .technology-information
+ & > .technology-name
+ font-size: clamp(1.2rem, 6vw, 1.5rem)
+
+ & > .technology-duration
+ text-decoration: underline
+ position: relative
+ color: $text-light
+ font-size: clamp(0.8rem, 5vw, 1rem)
+ width: fit-content
+
+ &:hover ~ .tooltip, &:focus ~ .tooltip
+ visibility: visible
+
+ & > .tooltip
+ visibility: hidden
+ background-color: $tooltip
+ padding: 5px
+ border: 1px solid $tooltip-border
+ border-radius: 8px
+ position: absolute
+ z-index: 2
+
+ & > .technology-level
+ width: 32px
+ height: 32px
\ No newline at end of file
diff --git a/src/sass/_background.sass b/src/sass/modules/_background.sass
similarity index 50%
rename from src/sass/_background.sass
rename to src/sass/modules/_background.sass
index b1693e1..65d4b9c 100644
--- a/src/sass/_background.sass
+++ b/src/sass/modules/_background.sass
@@ -1,11 +1,9 @@
@mixin background($color, $type)
- @if $color == orange
- background: radial-gradient(100% 100% at 50% 0%, rgb(254, 153, 0) 0%, $primary-background-color 100%)
- @else if $color == red
- background: radial-gradient(100% 100% at 50% 0%, rgb(173, 20, 9) 0%, $primary-background-color 100%)
+ @if $color == red
+ background: $red-background-radial
@else if $color == blue
- background: radial-gradient(100% 100% at 50% 0%, rgb(67, 94, 183) 0%, $primary-background-color 100%)
- background-color: #181818
+ background: $blue-background-radial
+ background-color: $background
animation: show-radial-background 5s forwards ease-in-out
background-repeat: no-repeat
diff --git a/src/sass/_blog-navbar.sass b/src/sass/modules/_blog-navbar.sass
similarity index 100%
rename from src/sass/_blog-navbar.sass
rename to src/sass/modules/_blog-navbar.sass
diff --git a/src/sass/modules/_card.sass b/src/sass/modules/_card.sass
new file mode 100644
index 0000000..2c23e28
--- /dev/null
+++ b/src/sass/modules/_card.sass
@@ -0,0 +1,75 @@
+@import '../modules/config'
+
+#cards
+ @include flex(row, flex-start, center)
+ padding-top: 25px
+ gap: 25px
+ flex-wrap: wrap
+
+ @media screen and (max-width: 925px)
+ @include flex(row, center, center)
+
+ & > .card
+ @include flex(column, center, flex-start)
+ gap: 10px
+ width: 400px
+ height: fit-content
+ border: 1px solid $background-light
+ padding: 25px
+ border-radius: 10px
+
+ & > .card-header
+ @include flex(row, space-between, center)
+ gap: 20px
+ width: 100%
+
+ & > .card-header-info
+ @include flex(row, flex-start, center)
+ gap: 10px
+
+ & > .card-icon
+ width: 32px
+ height: 32px
+
+ & > .card-title
+ font-size: clamp(1rem, 2vw, 1.4rem)
+ font-weight: 800
+
+ & > .card-header-redirect
+ & > .card-redirect-icon
+ @include flex(row, center, center)
+ filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(70deg) brightness(112%) contrast(101%)
+
+ @media screen and (max-width: 405px)
+ display: none
+
+ & > .release-date
+ @media screen and (max-width: 405px)
+ display: none
+
+
+ & > .card-desc
+ font-size: clamp(0.9rem, 2vw, 1rem)
+
+ & > .card-button
+ display: none
+ gap: 10px
+ font-size: 16px
+ padding: 10px
+ height: 44px
+ width: 100%
+ border-radius: 5px
+ border: none
+ background-color: $primary
+
+ &[disabled]
+ background-color: $background-light
+ color: white
+
+ @media screen and (max-width: 405px)
+ @include flex(row, center, center)
+
+ & > .card-button-image
+ width: 24px
+ height: 24px
+ filter: invert(100%) sepia(100%) saturate(0%) hue-rotate(70deg) brightness(112%) contrast(101%)
\ No newline at end of file
diff --git a/src/sass/modules/_config.sass b/src/sass/modules/_config.sass
new file mode 100644
index 0000000..b6526ad
--- /dev/null
+++ b/src/sass/modules/_config.sass
@@ -0,0 +1,131 @@
+//
+// Fonts
+//
+
+@import url('https://fonts.googleapis.com/css2?family=Rubik:wght@400;600&display=swap')
+
+//
+// Color Palette
+//
+
+// Action/Main Colors
+$primary: #0750aa
+$primary-dark: #003c6e
+
+$secondary: #070e18
+$secondary-dark: #040a10
+
+$accent: #3E8EE1
+$accent-dark: #2b6cc4
+
+// Backgrounds
+$background: #040A10
+$background-light: #131c24
+
+$blue-background-radial: radial-gradient(100% 100% at 50% 0%, $accent 0%, $background 100%)
+$red-background-radial: radial-gradient(100% 100% at 50% 0%, rgb(173, 20, 9) 0%, $background 100%)
+
+// Text
+$text: #FFFFFF
+$text-light: #B9B9B9
+
+$link: #0093FF
+$link-dark: #0073FF
+$link-filter: invert(39%) sepia(87%) saturate(2316%) hue-rotate(185deg) brightness(101%) contrast(109%)
+$link-filter-dark: invert(28%) sepia(80%) saturate(3766%) hue-rotate(205deg) brightness(104%) contrast(104%)
+
+// Scrollbar
+$scroll-bar: rgba(200, 200, 200, 0.5)
+
+// Tooltips
+$tooltip: #292A2D
+$tooltip-border: #CFD1D4
+
+//
+// Background Colors
+//
+
+$blog-warning-background-color: rgb(254, 153, 0, 0.5)
+
+//
+// Text Colors / Fonts / Link Colors
+//
+
+$font: 'Rubik', sans-serif
+
+//
+// Mixins
+//
+
+@mixin flex($direction, $justify, $align)
+ display: flex
+ flex-direction: $direction
+ justify-content: $justify
+ align-items: $align
+
+//
+// Elements
+//
+
+*
+ box-sizing: border-box
+ margin: 0
+ padding: 0
+ font-family: $font
+ color: $text
+
+html, body
+ height: fit-content
+ width: 100%
+
+a
+ text-decoration: none
+
+hr
+ width: 100%
+
+.hidden
+ opacity: 0
+ transition: opacity 2s
+
+.show
+ opacity: 1
+
+*:focus-visible
+ outline: 2px solid #FFFFFF
+ border-radius: 8px
+
+#link, #gmail-link
+ @include flex(row, space-around, center)
+ font-size: clamp(1rem, 3vw, 1.8rem)
+ cursor: pointer
+
+ &:hover #link-text, &:focus #link-text
+ color: $link-dark
+
+ &:hover #link-image, &:focus #link-image
+ filter: $link-filter-dark
+
+ & > #link-image
+ width: clamp(24px, 2vw, 35px)
+ height: auto
+ margin-right: 5px
+ filter: $link-filter
+
+ & > #link-text
+ color: $link
+
+.inline
+ background-color: #141414
+ padding: 5px
+ border-radius: 8px
+
+//
+// Animations
+//
+
+@keyframes fadeIn
+ 0%
+ opacity: 0
+ 100%
+ opacity: 1
\ No newline at end of file
diff --git a/src/sass/_cursor.sass b/src/sass/modules/_cursor.sass
similarity index 82%
rename from src/sass/_cursor.sass
rename to src/sass/modules/_cursor.sass
index a627e83..cc7a1d1 100644
--- a/src/sass/_cursor.sass
+++ b/src/sass/modules/_cursor.sass
@@ -1,7 +1,7 @@
#cursor
display: inline-block
position: relative
- background-color: $primary-text-color
+ background-color: $text
top: 1px
width: 4px
diff --git a/src/sass/_footer.sass b/src/sass/modules/_footer.sass
similarity index 90%
rename from src/sass/_footer.sass
rename to src/sass/modules/_footer.sass
index 877ab55..fb0c2e0 100644
--- a/src/sass/_footer.sass
+++ b/src/sass/modules/_footer.sass
@@ -1,12 +1,13 @@
#footer
@include flex(row, center, center)
+ margin-top: 50px
padding: 10px
& > #footer-container
@include flex(column, space-between, center)
backdrop-filter: blur(15px)
-webkit-backdrop-filter: blur(15px)
- background-color: $secondary-background-color
+ background-color: $background-light
border-radius: 10px
width: 50%
padding: 10px
@@ -68,7 +69,7 @@
gap: 5px
#footer-modal
- background-color: $secondary-background-color
+ background-color: $background-light
position: fixed
padding: 40px
border: none
@@ -97,12 +98,12 @@
cursor: pointer
padding: 10px
border: none
- background-color: $primary-link-button-color
- border-radius: 100px
+ background-color: $primary
+ border-radius: 10px
gap: 10px
font-size: clamp(1rem, 3vw, 1.6rem)
width: 200px
&:hover, &:focus
transform: scale(1.1)
- background-color: $secondary-link-button-color
\ No newline at end of file
+ background-color: $primary-dark
\ No newline at end of file
diff --git a/src/sass/_headers.sass b/src/sass/modules/_headers.sass
similarity index 83%
rename from src/sass/_headers.sass
rename to src/sass/modules/_headers.sass
index 52b99ee..fb8ad14 100644
--- a/src/sass/_headers.sass
+++ b/src/sass/modules/_headers.sass
@@ -1,8 +1,7 @@
.page-header
- font-size: clamp(1.6rem, 7vw, 4rem)
- text-align: center
+ font-size: clamp(1.6rem, 7vw, 2rem)
margin-top: 1px
- padding: 25px 0 25px 0
+ padding: 25px 0 10px 0
color: #47DA44
.comment-indicator-start, .comment-indicator-end
@@ -54,8 +53,4 @@
opacity: 0
.disclaimer
- width: 100%
- text-align: center
- font-weight: 200
- padding: 20px
font-size: 1.17rem
diff --git a/src/sass/_navbar.sass b/src/sass/modules/_navbar.sass
similarity index 63%
rename from src/sass/_navbar.sass
rename to src/sass/modules/_navbar.sass
index 24a8158..6869864 100644
--- a/src/sass/_navbar.sass
+++ b/src/sass/modules/_navbar.sass
@@ -1,37 +1,58 @@
.desktop-navbar
- @include flex(row, space-between, center)
- position: fixed
- padding: 0 30px 0 30px
+ position: fixed
+ width: 100%
+ @include flex(row, center, center)
z-index: 3
top: 0
- width: 100%
- overflow: hidden
- backdrop-filter: blur(15px)
- -webkit-backdrop-filter: blur(15px)
- height: 100px
-
- & > .navbar-links
- @include flex(row, center, center)
- gap: 40px
-
- & > .navbar-link
- font-size: clamp(1rem, 2vw, 1.4rem)
- z-index: 1
- background-size: 1rem 1rem
- background: none
- border: none
- text-decoration: none
- border-radius: 4px
- cursor: pointer
- text-shadow: 0px 4px 3px rgba(0, 0, 0, 0.3)
-
- @media screen and (max-width: 1138px)
- display: none
- & > #navbar-icon
- height: 80px
- width: 73.33px
- object-fit: contain
+ & > .navbar
+ padding: 0 0 0 20px
+ @include flex(row, space-between, center)
+ background-color: rgba(0, 0, 0, 0.3)
+ backdrop-filter: blur(15px)
+ -webkit-backdrop-filter: blur(15px)
+ border-radius: 0 0 20px 20px
+ height: 65px
+ overflow: hidden
+ width: fit-content
+
+ & > .navbar-icon
+ width: 48px
+ height: 48px
+
+ @media screen and (max-width: 720px)
+ width: 80%
+
+ & > .navbar-divider
+ margin: 0 10px 0 20px
+ width: 3px
+ border-radius: 20px
+ height: 35px
+ background-color: #FFF
+
+ @media screen and (max-width: 720px)
+ display: none
+
+ & > .navbar-links
+ @include flex(row, flex-start, center)
+ height: 100%
+ width: 100%
+ font-size: clamp(1.2rem, 2vw, 1.4rem)
+
+ @media screen and (max-width: 720px)
+ display: none
+
+ & > .navbar-link
+ @include flex(column, center, center)
+ height: 100%
+ padding: 10px
+ cursor: pointer
+ text-shadow: 0px 4px 3px rgba(0, 0, 0, 0.3)
+ border-radius: 4px
+
+ &:hover
+ background-color: rgba(0, 0, 0, 0.4)
+
/* */
/* Mobile Navigation Hamburger */
@@ -39,17 +60,15 @@
.mobile-hamburger
display: none
+ margin: 0 20px 0 20px
padding: 0
- position: absolute
- right: 30px
- width: 32px
height: 32px
+ width: 32px
flex-direction: column
justify-content: space-between
- opacity: 0
animation: appear 2.2s ease
- @media screen and (max-width: 1139px)
+ @media screen and (max-width: 720px)
opacity: 1
display: flex
diff --git a/src/sass/_scrollbars.sass b/src/sass/modules/_scrollbars.sass
similarity index 63%
rename from src/sass/_scrollbars.sass
rename to src/sass/modules/_scrollbars.sass
index 5083fbe..106d08b 100644
--- a/src/sass/_scrollbars.sass
+++ b/src/sass/modules/_scrollbars.sass
@@ -3,8 +3,8 @@ body
width: 16px
background-color: transparent
&::-webkit-scrollbar-thumb
- background-color: $scroll-bar-background-color
+ background-color: $scroll-bar
border-radius: 10px
width: 16px
&::-webkit-scrollbar-thumb:hover
- background-color: $scroll-bar-background-color
+ background-color: $scroll-bar