diff --git a/public/images/laudiolin-mobile.png b/public/images/laudiolin-mobile.png new file mode 100644 index 0000000..67d90c4 Binary files /dev/null and b/public/images/laudiolin-mobile.png differ diff --git a/src/css/pages/LandingPage.scss b/src/css/pages/LandingPage.scss index 7ebc27c..bff0842 100644 --- a/src/css/pages/LandingPage.scss +++ b/src/css/pages/LandingPage.scss @@ -54,6 +54,35 @@ } } +@media screen and (max-width: 1200px) { + .LandingPage_Segment { + background-size: cover !important; + background-repeat: no-repeat !important; + } + + .LandingPage_TextContainer { + align-items: center !important; + text-align: center !important; + justify-content: center; + + width: 80%; + margin-left: 0 !important; + margin-right: 0 !important; + } + + .LandingPage_Laudiolin { + background-image: + linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), + url("/images/laudiolin-mobile.png") !important; + } +} + +@media screen and (max-width: 450px) { + .LandingPage_Buttons { + @apply flex-col; + } +} + .LandingPage_Laudiolin { background-image: url("/images/laudiolin.png"); } diff --git a/src/ui/pages/LandingPage.tsx b/src/ui/pages/LandingPage.tsx index 9f66434..1d8d965 100644 --- a/src/ui/pages/LandingPage.tsx +++ b/src/ui/pages/LandingPage.tsx @@ -34,12 +34,14 @@ function Laudiolin() {

-
window.open("https://laudiolin.seikimo.moe")} - > - +
+
window.open("https://laudiolin.seikimo.moe")} + > + -

Open

+

Open

+