diff options
-rw-r--r-- | viewer/src/assets/scss/theme.scss | 3 | ||||
-rw-r--r-- | viewer/src/components/LdThumbnail.vue | 9 |
2 files changed, 9 insertions, 3 deletions
diff --git a/viewer/src/assets/scss/theme.scss b/viewer/src/assets/scss/theme.scss index bbf4843..0028688 100644 --- a/viewer/src/assets/scss/theme.scss +++ b/viewer/src/assets/scss/theme.scss | |||
@@ -51,6 +51,7 @@ $button-border-color: $palette-500; | |||
51 | $button-focus-color: $button-color; | 51 | $button-focus-color: $button-color; |
52 | $button-focus-border-color: $link; | 52 | $button-focus-border-color: $link; |
53 | $button-focus-box-shadow-size: 0; | 53 | $button-focus-box-shadow-size: 0; |
54 | $body-line-height: 1.5; | ||
54 | 55 | ||
55 | // Custom components | 56 | // Custom components |
56 | 57 | ||
@@ -65,7 +66,7 @@ $loader-color: $palette-800; | |||
65 | $input-tag-delete-background-color: $palette-700; | 66 | $input-tag-delete-background-color: $palette-700; |
66 | $breadcrumb-margins: 12px; | 67 | $breadcrumb-margins: 12px; |
67 | $breadcrumb-overflow-mask-size: $breadcrumb-margins + 60px; | 68 | $breadcrumb-overflow-mask-size: $breadcrumb-margins + 60px; |
68 | $thumbnail-other-size: 10em; | 69 | $thumbnail-other-size: $body-line-height * 9em; |
69 | 70 | ||
70 | // Layout | 71 | // Layout |
71 | 72 | ||
diff --git a/viewer/src/components/LdThumbnail.vue b/viewer/src/components/LdThumbnail.vue index 9805873..f8343eb 100644 --- a/viewer/src/components/LdThumbnail.vue +++ b/viewer/src/components/LdThumbnail.vue | |||
@@ -28,7 +28,9 @@ | |||
28 | @load="loading=false" | 28 | @load="loading=false" |
29 | /> | 29 | /> |
30 | <div v-else class="thumbnail-other flex-column flex-center"> | 30 | <div v-else class="thumbnail-other flex-column flex-center"> |
31 | <fa-icon :icon="getIcon()" size="4x" /> | 31 | <div> |
32 | <fa-icon :icon="getIcon()" size="4x" /> | ||
33 | </div> | ||
32 | {{item.title}} | 34 | {{item.title}} |
33 | </div> | 35 | </div> |
34 | </div> | 36 | </div> |
@@ -65,10 +67,13 @@ export default class LdThumbnail extends Vue { | |||
65 | .thumbnail-other { | 67 | .thumbnail-other { |
66 | width: $thumbnail-other-size; | 68 | width: $thumbnail-other-size; |
67 | height: $thumbnail-other-size; | 69 | height: $thumbnail-other-size; |
68 | padding-top: 1em; | 70 | padding-top: $body-line-height * 2em; |
69 | text-align: center; | 71 | text-align: center; |
70 | word-break: break-word; | 72 | word-break: break-word; |
71 | overflow: hidden; | 73 | overflow: hidden; |
74 | > div { | ||
75 | min-height: $body-line-height * 3em; | ||
76 | } | ||
72 | } | 77 | } |
73 | 78 | ||
74 | .preload { | 79 | .preload { |