aboutsummaryrefslogtreecommitdiff
path: root/viewer/src/views
diff options
context:
space:
mode:
Diffstat (limited to 'viewer/src/views')
-rw-r--r--viewer/src/views/MainLayout.vue8
-rw-r--r--viewer/src/views/item_handlers/PictureViewer.vue2
-rw-r--r--viewer/src/views/item_handlers/PlainTextViewer.vue29
3 files changed, 17 insertions, 22 deletions
diff --git a/viewer/src/views/MainLayout.vue b/viewer/src/views/MainLayout.vue
index 30bfe97..5cac863 100644
--- a/viewer/src/views/MainLayout.vue
+++ b/viewer/src/views/MainLayout.vue
@@ -128,6 +128,14 @@ function validateSpashScreen() {
128 left: var(--layout-left); 128 left: var(--layout-left);
129 z-index: 3; 129 z-index: 3;
130 overflow-x: hidden; 130 overflow-x: hidden;
131
132 // Forbid overflow when resizing.
133 // Necessary for the resize handle to be selectable on qutebrowser.
134 max-width: calc(100% - var(--layout-left) - $scrollbar-width);
135 margin: 0 auto; // Center
136 resize: horizontal;
137 // ---
138
131 &:focus { 139 &:focus {
132 outline: none; 140 outline: none;
133 } 141 }
diff --git a/viewer/src/views/item_handlers/PictureViewer.vue b/viewer/src/views/item_handlers/PictureViewer.vue
index 74b978f..d091f19 100644
--- a/viewer/src/views/item_handlers/PictureViewer.vue
+++ b/viewer/src/views/item_handlers/PictureViewer.vue
@@ -18,12 +18,14 @@
18--> 18-->
19 19
20<template> 20<template>
21 <!-- @dragstart.prevent stops Drag 'n Drop of pictures on FireFox -->
21 <div 22 <div
22 ref="containerElement" 23 ref="containerElement"
23 v-dragscroll 24 v-dragscroll
24 class="scrollbar" 25 class="scrollbar"
25 :class="$style.pictureContainer" 26 :class="$style.pictureContainer"
26 @dblclick="uiStore.toggleFullscreen()" 27 @dblclick="uiStore.toggleFullscreen()"
28 @dragstart.prevent="false"
27 > 29 >
28 <img 30 <img
29 v-if="!error" 31 v-if="!error"
diff --git a/viewer/src/views/item_handlers/PlainTextViewer.vue b/viewer/src/views/item_handlers/PlainTextViewer.vue
index 2ab429a..96c4d4c 100644
--- a/viewer/src/views/item_handlers/PlainTextViewer.vue
+++ b/viewer/src/views/item_handlers/PlainTextViewer.vue
@@ -19,17 +19,12 @@
19--> 19-->
20 20
21<template> 21<template>
22 <!-- Outer div necessary for the resize handle to appear on Firefox. --> 22 <pre
23 <div 23 v-if="isFinished"
24 :class="$style.content" 24 :class="$style.content"
25 class="fill" 25 v-text="data"
26 > 26 />
27 <pre 27 <LdLoading v-else />
28 v-if="isFinished"
29 v-text="data"
30 />
31 <LdLoading v-else />
32 </div>
33</template> 28</template>
34 29
35<script setup lang="ts"> 30<script setup lang="ts">
@@ -51,19 +46,9 @@ const { isFinished, data } = useFetch(itemResourceUrl).text();
51@import "~@/assets/scss/theme"; 46@import "~@/assets/scss/theme";
52 47
53.content { 48.content {
54 display: flex; 49 margin: 1em;
55 justify-content: center;
56 background: $viewer-text-background; 50 background: $viewer-text-background;
57 color: $viewer-text; 51 color: $viewer-text;
58 52 white-space: pre-wrap;
59 > pre {
60 width: 100%;
61 max-width: 100%; // Forbid overflow when resizing.
62 margin: 1em; // Necessary for the resize handle to be selectable on qutebrowser.
63 border: none;
64 white-space: pre-wrap;
65 resize: horizontal; // Allow the user to adjust the width of the text view for easier column reading.
66 overflow: hidden; // Necessary for the resize handle to be shown in Chromium.
67 }
68} 53}
69</style> 54</style>