From eb270b9f424fe26672335ac33104246351723ac3 Mon Sep 17 00:00:00 2001
From: Adam Bem <adam.bem@zoho.eu>
Date: Tue, 14 Nov 2023 14:42:29 +0100
Subject: [PATCH] Corrections

---
 Frontend/src/components/mock/HeadersDetailComponent.vue | 6 +++---
 Frontend/src/components/mock/HistoryComponent.vue       | 4 ++--
 Frontend/src/style.css                                  | 2 +-
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/Frontend/src/components/mock/HeadersDetailComponent.vue b/Frontend/src/components/mock/HeadersDetailComponent.vue
index ce1ad41..e894979 100644
--- a/Frontend/src/components/mock/HeadersDetailComponent.vue
+++ b/Frontend/src/components/mock/HeadersDetailComponent.vue
@@ -10,14 +10,14 @@ const props = defineProps(
 </script>
 
 <template>
-    <div class="w-full text-center text-white mt-2 flex flex-col gap-4 ">
+    <div class="w-full text-center dark:text-white mt-2 flex flex-col gap-4 ">
         <div class="flex flex-row gap-4"> 
             <div class="w-full font-bold">Name</div> 
             <div class="w-full font-bold">Value</div> 
         </div >
         <div class="flex flex-row gap-4" v-for="(value,name) in JSON.parse(data)" :key="name">
-            <div class="w-full overflow-hidden">{{ name }}</div>
-            <div class="w-full overflow-hidden">{{ value }}</div>
+            <div class="w-1/2 break-words">{{ name }}</div>
+            <div class="w-1/2 break-words">{{ value }}</div>
         </div>
     </div>
 </template>
\ No newline at end of file
diff --git a/Frontend/src/components/mock/HistoryComponent.vue b/Frontend/src/components/mock/HistoryComponent.vue
index 126e4cf..6edca0f 100644
--- a/Frontend/src/components/mock/HistoryComponent.vue
+++ b/Frontend/src/components/mock/HistoryComponent.vue
@@ -34,8 +34,8 @@ function showHeaders(headers: object, index: number){
 
 
 <template>
-    <div class="flex flex-1 flex-col justify-items-stretch gap-y-4">
-        <label class="dark:text-white text-center"><span class="font-bold">Attention: </span>History doesn't refresh automatically! Use refresh button (⟳) on the right!</label>
+    <div class="flex flex-1 flex-col xl:w-3/12 justify-items-stretch gap-y-4">
+        <label class="dark:text-white text-center"><span class="font-bold">Attention! </span>History doesn't refresh automatically! Use refresh button (⟳) on the right!</label>
         <HistoryRecords class="xl:h-1/3 overflow-y-auto" @click:show-headers="showHeaders" @click:show-body="showBody"></HistoryRecords>
         <BodyDetailComponent :content-type="currentContentType" :data="currentShownData" v-if="shownDetail == 'body' "></BodyDetailComponent>
         <HeadersDetailComponent :data="currentShownData"  v-if="shownDetail == 'headers' "></HeadersDetailComponent>
diff --git a/Frontend/src/style.css b/Frontend/src/style.css
index e9a2af9..1468860 100644
--- a/Frontend/src/style.css
+++ b/Frontend/src/style.css
@@ -29,5 +29,5 @@
 }
 
 .text-field-error {
-    @apply shadow-[0px_0px_20px_0px_rgba(255,0,0,1)];
+    @apply shadow-[0px_0px_10px_0px_rgba(255,0,0,1)];
 }
\ No newline at end of file