diff --git a/resources/js/components/SMCarousel.vue b/resources/js/components/SMCarousel.vue
index 574ef3f..e7a857f 100644
--- a/resources/js/components/SMCarousel.vue
+++ b/resources/js/components/SMCarousel.vue
@@ -130,7 +130,7 @@ const disconnectMutationObserver = () => {
diff --git a/resources/js/components/SMEditor.vue b/resources/js/components/SMEditor.vue
index dfe2e04..adaeaae 100644
--- a/resources/js/components/SMEditor.vue
+++ b/resources/js/components/SMEditor.vue
@@ -601,7 +601,7 @@ centered {
}
}
-@media (max-width: 768px) {
+@media only screen and (max-width: 768px) {
trix-toolbar .trix-button--icon {
height: 1.6rem;
}
diff --git a/resources/js/components/SMFooter.vue b/resources/js/components/SMFooter.vue
index 26bf89c..82c912e 100644
--- a/resources/js/components/SMFooter.vue
+++ b/resources/js/components/SMFooter.vue
@@ -129,6 +129,7 @@
ul {
display: flex;
+ flex-direction: row;
margin: 0 -1rem;
padding: 0;
list-style-type: none;
@@ -137,6 +138,8 @@
padding: 0;
margin-left: 1rem;
margin-right: 1rem;
+ margin-bottom: 0;
+ text-align: center;
}
}
@@ -165,4 +168,20 @@
}
}
}
+
+@media only screen and (max-width: 640px) {
+ .footer {
+ .footer-acknowledgement {
+ padding: 0 1rem;
+ }
+ .footer-links ul {
+ flex-direction: column;
+
+ li {
+ text-align: center;
+ margin-bottom: 0.5rem;
+ }
+ }
+ }
+}
diff --git a/resources/js/views/Home.vue b/resources/js/views/Home.vue
index cfcdb56..3c7d49a 100644
--- a/resources/js/views/Home.vue
+++ b/resources/js/views/Home.vue
@@ -84,12 +84,12 @@
Minecraft server, participate in weekly challenges and
mini-games.
-
+
+ class="minecraft-image" />
We even have
-
+
@@ -267,10 +270,13 @@ handleLoad();
.about {
margin-top: 5rem;
+ margin-left: 2rem;
+ margin-right: 2rem;
background-color: #3d4e5d;
color: rgb(230, 245, 235);
border-radius: 24px;
padding: 4rem 8rem;
+ width: auto;
h2 {
font-size: 400%;
@@ -301,7 +307,6 @@ handleLoad();
border-radius: 50rem;
height: 20rem;
width: 20rem;
- // transform: rotateZ(-10deg);
}
}
@@ -310,6 +315,9 @@ handleLoad();
color: rgb(56, 79, 95);
border-radius: 24px;
padding: 4rem 6rem;
+ margin-left: 2rem;
+ margin-right: 2rem;
+ width: auto;
img {
border-radius: 24px;
@@ -372,6 +380,21 @@ handleLoad();
max-width: 44rem;
margin: 1rem auto;
}
+
+ .minecraft-education {
+ text-align: left;
+
+ .minecraft-image {
+ float: left;
+ margin-top: 1rem;
+ margin-right: 2rem;
+ }
+ }
+
+ .minecraft-address {
+ width: 100%;
+ height: 100%;
+ }
}
.subscribe {
@@ -400,4 +423,76 @@ handleLoad();
}
}
}
+
+@media only screen and (max-width: 768px) {
+ .home {
+ .about {
+ margin-top: 2rem;
+ margin-left: 0;
+ margin-right: 0;
+ padding: 4rem;
+ border-radius: 0;
+ }
+
+ .workshops {
+ margin-top: 4rem;
+ margin-bottom: 4rem;
+ }
+
+ .support {
+ margin-left: 0;
+ margin-right: 0;
+ padding: 4rem;
+ border-radius: 0;
+ }
+
+ .minecraft {
+ margin-top: 0;
+ padding-left: 1rem;
+ padding-right: 1rem;
+
+ .minecraft-education {
+ text-align: center;
+
+ .minecraft-image {
+ float: none;
+ display: block;
+ margin: 0 auto 1rem auto;
+ }
+ }
+ }
+ }
+}
+
+@media only screen and (max-width: 640px) {
+ .home {
+ .about {
+ padding: 2rem;
+
+ h2 {
+ font-size: 300%;
+ }
+
+ p {
+ font-size: 100%;
+ line-height: 150%;
+ }
+ }
+
+ .workshops,
+ .support,
+ .minecraft,
+ .subscribe {
+ padding: 2rem;
+
+ h2 {
+ font-size: 200%;
+ }
+
+ p {
+ font-size: 100%;
+ }
+ }
+ }
+}