diff --git a/frontend/src/lib/css/cv.css b/frontend/src/lib/css/cv.css
index 095f855..ee5fd01 100644
--- a/frontend/src/lib/css/cv.css
+++ b/frontend/src/lib/css/cv.css
@@ -50,6 +50,28 @@
color: var(--color-background);
margin: 0.5rem;
}
+
+ .subsection {
+ margin-left: 3rem;
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ }
+
+ .end {
+ padding-bottom: 5rem;
+ }
+
+ .footer {
+ position: relative;
+ display: flex;
+ height: 15rem;
+ background-color: var(--color-text);
+ z-index: 3;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ }
}
@media screen and (max-width: 1000px) {
@@ -72,6 +94,28 @@
color: var(--color-background);
margin: 0.5rem;
}
+
+ .subsection {
+ margin-left: 5vw;
+ display: flex;
+ flex-direction: row;
+ flex-wrap: wrap;
+ }
+
+ .end {
+ padding-bottom: 3rem;
+ }
+
+ .footer {
+ position: relative;
+ display: flex;
+ height: 20rem;
+ background-color: var(--color-text);
+ z-index: 3;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+ }
}
.profile-picture-container {
@@ -108,28 +152,6 @@ h2 {
font-size: 1.5rem;
}
-.subsection {
- margin-left: 3rem;
- display: flex;
- flex-direction: row;
- flex-wrap: wrap;
-}
-
-.end {
- padding-bottom: 5rem;
-}
-
-.footer {
- position: relative;
- display: flex;
- height: 30vh;
- background-color: var(--color-text);
- z-index: 3;
- justify-content: center;
- align-items: center;
- flex-direction: column;
-}
-
.footer svg {
margin: 0;
}
\ No newline at end of file
diff --git a/frontend/src/lib/css/flag.css b/frontend/src/lib/css/flag.css
index b5c7076..996e7b1 100644
--- a/frontend/src/lib/css/flag.css
+++ b/frontend/src/lib/css/flag.css
@@ -1,15 +1,38 @@
-.flag-main {
- display: flex;
- border-radius: 0.4rem;
- box-shadow: 0px 20px 50px -10px rgba(0, 0, 0, 0.2);
- background-color: var(--color-background);
- margin-left: 2.5rem;
- margin-right: 2.5rem;
- padding: 1rem;
- z-index: 1;
- transition: all .3s ease 0s;
- justify-content: center;
- align-items: center;
+@media screen and (min-width: 1000px) {
+ .flag-main {
+ display: flex;
+ border-radius: 0.4rem;
+ box-shadow: 0px 20px 50px -10px rgba(0, 0, 0, 0.2);
+ background-color: var(--color-background);
+ margin-left: 2.5rem;
+ margin-right: 2.5rem;
+ padding: 1rem;
+ z-index: 1;
+ transition: all .3s ease 0s;
+ justify-content: center;
+ align-items: center;
+ }
+}
+
+@media screen and (max-width: 1000px) {
+ .flag-main {
+ display: flex;
+ border-radius: 0.4rem;
+ box-shadow: 0px 20px 50px -10px rgba(0, 0, 0, 0.2);
+ background-color: var(--color-background);
+ margin-bottom: 1rem;
+ margin-top: 1rem;
+ padding: 1rem;
+ transition: all .3s ease 0s;
+ justify-content: center;
+ align-items: center;
+ width: 100%;
+ }
+
+ .flag-container {
+ margin-left: 10vw !important;
+ margin-right: 10vw;
+ }
}
.flag-img {
diff --git a/frontend/src/lib/css/slide.css b/frontend/src/lib/css/slide.css
index 3cb047a..e7444e4 100644
--- a/frontend/src/lib/css/slide.css
+++ b/frontend/src/lib/css/slide.css
@@ -93,7 +93,7 @@
border-radius: 0.4rem;
box-shadow: 0px 20px 50px -10px rgba(0, 0, 0, 0.2);
background-color: var(--color-background);
- height: 60dvh;
+ min-height: 35rem;
width: 90dvw;
margin-left: 5dvw;
z-index: 1;
@@ -103,7 +103,7 @@
.slide-img-mobile-container {
display: flex;
justify-content: center;
- height: 30dvh;
+ height: 17.25rem;
}
.slide-img-mobile {
@@ -124,7 +124,7 @@
color: var(--color-text);
font-family: 'Gabarito', sans-serif;
font-weight: 600;
- font-size: 3vmax;
+ font-size: 1.8rem;
margin-bottom: 0;
}
@@ -133,7 +133,7 @@
color: var(--color-text);
font-family: 'Gabarito', sans-serif;
font-weight: 500;
- font-size: 1.75vmax;
+ font-size: 1.1rem;
margin-top: 0.5rem;
margin-bottom: 0.5rem;
width: 100%;
@@ -158,7 +158,7 @@
}
.slide-text {
- font-size: 1.5vmax;
+ font-size: 1rem;
}
}
diff --git a/frontend/src/routes/+page.svelte b/frontend/src/routes/+page.svelte
index 952b3d8..935b929 100644
--- a/frontend/src/routes/+page.svelte
+++ b/frontend/src/routes/+page.svelte
@@ -143,7 +143,7 @@
{/each}