From f3cdad9f71a5332b4a764b8eb46d2e5ed60d788a Mon Sep 17 00:00:00 2001
From: Adam Bem <adam.bem@zoho.eu>
Date: Fri, 3 Nov 2023 08:36:45 +0100
Subject: [PATCH] Updated RWD in XPath

---
 Frontend/src/components/xml/XmlOutputFieldComponent.vue   | 2 +-
 Frontend/src/components/xml/tooltips/TooltipComponent.vue | 2 +-
 Frontend/src/views/XPathView.vue                          | 6 +++---
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/Frontend/src/components/xml/XmlOutputFieldComponent.vue b/Frontend/src/components/xml/XmlOutputFieldComponent.vue
index 988ed4b..b4c96e4 100644
--- a/Frontend/src/components/xml/XmlOutputFieldComponent.vue
+++ b/Frontend/src/components/xml/XmlOutputFieldComponent.vue
@@ -134,7 +134,7 @@ function isVersionSelectionAvailable() {
 </script>
 
 <template>
-    <div class="flex flex-col flex-none w-full lg:w-1/2 h-1/3 lg:h-full items-center pb-2 pr-2">
+    <div class="flex flex-col flex-none w-full 2xl:w-1/2 h-1/3 2xl:h-full items-center pb-2 pr-2">
         <div class="flex place-content-between w-full items-center pb-2">
             <span class="dark:text-white">Result:</span>
             <div class="flex space-x-2">
diff --git a/Frontend/src/components/xml/tooltips/TooltipComponent.vue b/Frontend/src/components/xml/tooltips/TooltipComponent.vue
index d25760f..4b43f20 100644
--- a/Frontend/src/components/xml/tooltips/TooltipComponent.vue
+++ b/Frontend/src/components/xml/tooltips/TooltipComponent.vue
@@ -58,7 +58,7 @@ function toggleTooltips() {
 </script>
 
 <template>
-    <div :class="areTooltipsHidden ? 'w-fit' : 'w-4/12'" class="hidden 2xl:flex shrink-0 items-stretch p-2 flex-row rounded-xl shadow-lg bg-gradient-to-r from-blue-400 to-blue-300 dark:from-sky-600 dark:to-sky-800 ">
+    <div :class="areTooltipsHidden ? 'w-fit' : 'w-[26rem]'" class="hidden xl:flex shrink-0 items-stretch p-2 flex-row rounded-xl shadow-lg bg-gradient-to-r from-blue-400 to-blue-300 dark:from-sky-600 dark:to-sky-800 ">
         <button :class="{'mr-2' : !areTooltipsHidden }" class="text-xl w-6 dark:text-slate-100" @click="toggleTooltips()">
             T<br/>o<br/>o<br/>l<br/>t<br/>i<br/>p<br/>s
         </button>
diff --git a/Frontend/src/views/XPathView.vue b/Frontend/src/views/XPathView.vue
index 6b23999..bdf181e 100644
--- a/Frontend/src/views/XPathView.vue
+++ b/Frontend/src/views/XPathView.vue
@@ -16,9 +16,9 @@ function updateVersion(newVersion: string) {
 </script>
 
 <template>
-    <div id="layout" class="flex flex-col lg:flex-row w-full h-full">
-        <div class="flex flex-col lg:flex-row w-full lg:w-7/12 grow overflow-hide pr-2">
-            <div class="flex flex-col w-full lg:w-1/2 h-2/3 lg:h-full flex-none items-center">
+    <div id="layout" class="flex flex-row w-full h-full">
+        <div class="flex flex-col 2xl:flex-row w-full 2xl:w-7/12 grow overflow-hide pr-2">
+            <div class="flex flex-col w-full 2xl:w-1/2 h-2/3 2xl:h-full flex-none items-center">
                 <xmlInputFieldComponent stylized-name="XML" :data="xml" @update="(data) => {xml = data}"></xmlInputFieldComponent>
                 <xmlInputFieldComponent stylized-name="XPath" :data="query" @update="(data) => {query = data}"></xmlInputFieldComponent>
             </div>