diff --git a/open-isle-cli/src/components/MenuComponent.vue b/open-isle-cli/src/components/MenuComponent.vue
index 8ed51753f..a6921ae2a 100644
--- a/open-isle-cli/src/components/MenuComponent.vue
+++ b/open-isle-cli/src/components/MenuComponent.vue
@@ -221,15 +221,15 @@ export default {
.menu {
width: 200px;
background-color: var(--menu-background-color);
- height: calc(100vh - var(--header-height));
+ height: calc(100vh - var(--header-height) - 20px);
border-right: 1px solid var(--menu-border-color);
display: flex;
flex-direction: column;
+ padding: 10px;
overflow-y: auto;
}
.menu-item-container {
- padding: 10px;
}
.menu-item {
@@ -296,7 +296,7 @@ export default {
}
.menu-section {
- padding: 10px;
+ margin-top: 10px;
}
.section-header {
@@ -358,7 +358,7 @@ export default {
@media (max-width: 768px) {
.menu {
position: fixed;
- width: 100%;
+ width: calc(100% - 20px);
z-index: 1000;
}
diff --git a/open-isle-cli/src/views/HomePageView.vue b/open-isle-cli/src/views/HomePageView.vue
index fb12d82cf..1d5f31a05 100644
--- a/open-isle-cli/src/views/HomePageView.vue
+++ b/open-isle-cli/src/views/HomePageView.vue
@@ -18,8 +18,10 @@
>
{{ topic }}
-
-
+
+
+
+
@@ -396,6 +398,15 @@ export default {
flex-direction: row;
align-items: center;
gap: 10px;
+ font-size: 16px;
+ flex-wrap: wrap;
+}
+
+.topic-select-container {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ gap: 10px;
}
.topic-item {
@@ -440,6 +451,20 @@ export default {
padding-left: 20px;
}
+/* .article-member-avatars-container,
+.header-item.avatars, */
+.article-comments,
+.header-item.comments,
+.article-views,
+.header-item.views,
+.article-time,
+.header-item.activity {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
+}
+
.article-member-avatars-container,
.header-item.avatars {
width: 20%;
@@ -581,7 +606,7 @@ export default {
@container home-page (max-width: 768px) {
.article-main-container,
.header-item.main-item {
- width: calc(80% - 20px);
+ width: calc(70% - 20px);
padding-left: 20px;
}
@@ -603,12 +628,35 @@ export default {
.article-time,
.header-item.activity {
width: 10%;
+ margin-right: 3%;
}
+ .header-container {
+ display: none;
+ }
.article-member-avatar-item:nth-child(n+2) {
display: none;
}
+
+ .header-item-text {
+ font-size: 12px;
+ }
+
+ .article-item-title {
+ font-size: 16px;
+ font-weight: bold;
+ }
+
+ .article-item-description {
+ margin-top: 2px;
+ font-size: 10px;
+ }
+
+ .main-info-text {
+ font-size: 10px;
+ opacity: 0.5;
+ }
}
diff --git a/open-isle-cli/src/views/LoginPageView.vue b/open-isle-cli/src/views/LoginPageView.vue
index bd30e0735..7e4761b3e 100644
--- a/open-isle-cli/src/views/LoginPageView.vue
+++ b/open-isle-cli/src/views/LoginPageView.vue
@@ -267,4 +267,37 @@ export default {
.login-page-button-secondary-link {
color: var(--primary-color);
}
+
+@media (max-width: 768px) {
+ .login-page {
+ flex-direction: column;
+ }
+
+ .login-page-content {
+ width: calc(100% - 40px);
+ border-right: none;
+ padding-left: 20px;
+ padding-right: 20px;
+ }
+
+ .login-page-button-primary {
+ margin-top: 0px;
+ }
+
+ .login-page-button-secondary {
+ margin-top: 0px;
+ font-size: 13px;
+ }
+
+ .other-login-page-content {
+ margin-top: 20px;
+ margin-left: 0px;
+ width: calc(100% - 40px);
+ gap: 10px;
+ }
+
+ .login-page-button {
+ width: calc(100% - 40px);
+ }
+}
\ No newline at end of file
diff --git a/open-isle-cli/src/views/SignupPageView.vue b/open-isle-cli/src/views/SignupPageView.vue
index f7dd4fca4..17366a6d1 100644
--- a/open-isle-cli/src/views/SignupPageView.vue
+++ b/open-isle-cli/src/views/SignupPageView.vue
@@ -374,4 +374,42 @@ export default {
margin-top: -10px;
margin-bottom: 10px;
}
+
+@media (max-width: 768px) {
+ .signup-page {
+ flex-direction: column;
+ }
+
+ .email-signup-page-content {
+ margin-top: 20px;
+ gap: 15px;
+ }
+
+ .signup-page-content {
+ width: calc(100% - 40px);
+ border-right: none;
+ padding-left: 20px;
+ padding-right: 20px;
+ }
+
+ .signup-page-button-primary {
+ margin-top: 0px;
+ }
+
+ .signup-page-button-secondary {
+ margin-top: 0px;
+ font-size: 13px;
+ }
+
+ .other-signup-page-content {
+ margin-top: 20px;
+ margin-left: 0px;
+ width: calc(100% - 40px);
+ gap: 10px;
+ }
+
+ .signup-page-button {
+ width: calc(100% - 40px);
+ }
+}
\ No newline at end of file