diff options
Diffstat (limited to 'viewer/src/views/item_handlers/PlainTextViewer.vue')
-rw-r--r-- | viewer/src/views/item_handlers/PlainTextViewer.vue | 31 |
1 files changed, 8 insertions, 23 deletions
diff --git a/viewer/src/views/item_handlers/PlainTextViewer.vue b/viewer/src/views/item_handlers/PlainTextViewer.vue index 986e0ae..71b5d15 100644 --- a/viewer/src/views/item_handlers/PlainTextViewer.vue +++ b/viewer/src/views/item_handlers/PlainTextViewer.vue | |||
@@ -19,18 +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 | class="scrollbar" | ||
30 | v-text="data" | ||
31 | /> | ||
32 | <LdLoading v-else /> | ||
33 | </div> | ||
34 | </template> | 28 | </template> |
35 | 29 | ||
36 | <script setup lang="ts"> | 30 | <script setup lang="ts"> |
@@ -52,19 +46,10 @@ const { isFinished, data } = useFetch(itemResourceUrl).text(); | |||
52 | @import "~@/assets/scss/theme"; | 46 | @import "~@/assets/scss/theme"; |
53 | 47 | ||
54 | .content { | 48 | .content { |
55 | display: flex; | 49 | margin: 1em; |
56 | justify-content: center; | ||
57 | background: $viewer-text-background; | 50 | background: $viewer-text-background; |
58 | color: $viewer-text; | 51 | color: $viewer-text; |
59 | 52 | white-space: pre-wrap; | |
60 | > pre { | 53 | font-size: 1.5em; |
61 | width: 100%; | ||
62 | max-width: 100%; // Forbid overflow when resizing. | ||
63 | margin: 1em; // Necessary for the resize handle to be selectable on qutebrowser. | ||
64 | border: none; | ||
65 | white-space: pre-wrap; | ||
66 | resize: horizontal; // Allow the user to adjust the width of the text view for easier column reading. | ||
67 | overflow-x: hidden !important; // Necessary for the resize handle to be shown in Chromium. | ||
68 | } | ||
69 | } | 54 | } |
70 | </style> | 55 | </style> |