Hid unneded scrollbars

This commit is contained in:
2023-11-14 08:29:46 +01:00
parent 378dfcf351
commit 2c03ada393
7 changed files with 8 additions and 8 deletions

View File

@@ -55,7 +55,7 @@ import {html} from '@codemirror/lang-html'
</script>
<template>
<div class="editor w-full h-full bg-[#282C34] rounded-2xl overflow-x-scroll">
<div class="editor w-full h-full bg-[#282C34] rounded-2xl overflow-x-auto">
<codemirror
style="height: 100%; width: 100%; padding:1rem ; border-radius: 1rem; font-size: large;"

View File

@@ -36,7 +36,7 @@ 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>
<HistoryRecords class="xl:h-1/3 overflow-y-scroll" @click:show-headers="showHeaders" @click:show-body="showBody"></HistoryRecords>
<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>
</div>

View File

@@ -67,7 +67,7 @@ function showUpdatedCode(newCode : string){
</div>
</div>
<div class="flex text-left flex-col overflow-scroll gap-2 h-3/4">
<div class="flex text-left flex-col overflow-auto gap-2 h-3/4">
<label class="text-center" for="messageBody text-center">Response Body</label>
<CodeEditorComponent
@update:updated-code="showUpdatedCode"

View File

@@ -58,7 +58,7 @@ function readFile(file : any) {
<div class="flex flex-col w-full h-1/2 lg:h-1/2 flex-none xl:pr-2 2xl:pr-4 pb-2">
<div class="flex place-content-between w-full items-center">
<span class="dark:text-white mr-2">{{ stylizedName }}</span>
<div class="flex space-x-2 pb-2 overflow-x-scroll">
<div class="flex space-x-2 pb-2 overflow-x-auto">
<div class="flex items-stretch w-64">
<input id="fileLoader" ref="inputFile" class="file-selector" type="file" accept=".xml,.xql,.xquery,.xslt,text/xml,text/plain" @change="readFile" />
</div>

View File

@@ -141,7 +141,7 @@ function isVersionSelectionAvailable() {
<div class="flex flex-col flex-none w-full 2xl:w-1/2 h-1/3 2xl:h-full items-center pb-2 xl: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 overflow-x-scroll">
<div class="flex space-x-2 overflow-x-auto">
<select v-model="engine" name="engine" @change="changeAvailableVersions()" class="px-3 rounded-full border border-slate-400 bg-white dark:text-slate-100 dark:bg-gray-600">
<option v-for="engine in enginesForCurrentTool" :value="engine">{{ engine }}</option>
</select>
@@ -152,7 +152,7 @@ function isVersionSelectionAvailable() {
<button class="tool-button" @click="process">Process</button>
</div>
</div>
<div class="overflow-scroll h-full w-full rounded-2xl" :class="{'text-field-error' : errorOccurred}">
<div class="overflow-auto h-full w-full rounded-2xl" :class="{'text-field-error' : errorOccurred}">
<CodeEditor :code="result" :config="{disabled:true,language:tool}"></CodeEditor>
</div>

View File

@@ -43,7 +43,7 @@ function clear(){
<div id="layoutLeft" class="flex flex-col w-full xl:w-1/2 h-1/3 xl:h-full gap-4">
<div class="w-full flex flex-row place-content-between items-center">
<label class="dark:text-white text-center">Base64 Encoder</label>
<div class="flex flex-row items-center gap-2 overflow-x-scroll">
<div class="flex flex-row items-center gap-2 overflow-x-auto">
<button class="tool-button" @click="clear()">Clear</button>
<EncoderButton @image:show="showImage" :code="data" operation-type="Show Image"></EncoderButton>
<div class="w-2"></div>

View File

@@ -6,7 +6,7 @@ import HistoryComponent from '@components/mock/HistoryComponent.vue'
<template>
<div class="flex flex-col xl:flex-row gap-6 w-full overflow-y-scroll overflow-x-hidden h-full">
<div class="flex flex-col xl:flex-row gap-6 w-full overflow-y-auto overflow-x-hidden h-full">
<RestMockMessageComponent></RestMockMessageComponent>
<HistoryComponent></HistoryComponent>
</div>