From de2be3c213bd6510dc654da237fdbcab99b4bf04 Mon Sep 17 00:00:00 2001
From: Raphix <picot.raphael@gmail.com>
Date: Fri, 29 Aug 2025 23:35:32 +0200
Subject: [PATCH] Version 1.0.1-rc2 - Modification Responsive

---
 src/components/UI/Metric.vue                        | 3 ++-
 src/components/UI/ModalTree.vue                     | 3 ++-
 src/components/Widget/Guild/Settings/GuildUsers.vue | 3 ++-
 src/views/Interface.vue                             | 2 +-
 4 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/components/UI/Metric.vue b/src/components/UI/Metric.vue
index dbc2948..8551fd1 100644
--- a/src/components/UI/Metric.vue
+++ b/src/components/UI/Metric.vue
@@ -52,7 +52,8 @@ function getIcons(name) {
     margin: 0;
 }
 
-@media screen and (max-width: 768px) {
+@media screen and (max-width: 768px),
+       screen and (max-height: 607px)  {
 
     .metric {
         flex-direction: column;
diff --git a/src/components/UI/ModalTree.vue b/src/components/UI/ModalTree.vue
index a68d0b1..074fd68 100644
--- a/src/components/UI/ModalTree.vue
+++ b/src/components/UI/ModalTree.vue
@@ -21,7 +21,8 @@ defineProps({
 </script>
 <style scoped>
 
-@media screen and (max-width: 768px) {
+@media screen and (max-width: 768px),
+       screen and (max-height: 607px) {
     .settings-icon {
         display: none;
     }
diff --git a/src/components/Widget/Guild/Settings/GuildUsers.vue b/src/components/Widget/Guild/Settings/GuildUsers.vue
index 039787c..4c03f8a 100644
--- a/src/components/Widget/Guild/Settings/GuildUsers.vue
+++ b/src/components/Widget/Guild/Settings/GuildUsers.vue
@@ -73,7 +73,8 @@ function banUser(member) {
 </script>
 <style scoped>
 
-@media screen and (max-width: 768px) {
+@media screen and (max-width: 768px),
+       screen and (max-height: 607px) {
    
     .group {
         flex-direction: column;
diff --git a/src/views/Interface.vue b/src/views/Interface.vue
index f37f326..6e01600 100644
--- a/src/views/Interface.vue
+++ b/src/views/Interface.vue
@@ -166,7 +166,7 @@ function checkGuildAvailability() {
 
 }
 
-@media screen and (min-width: 769px) and (max-width: 1280px) and (min-height: 607px) {
+@media screen and (min-width: 769px), screen and (max-width: 1280px), screen and (min-height: 607px) {
     .queue {
         display: none
     }