From 7449b0480c2ce820aa59716c4e6d5241e045ca62 Mon Sep 17 00:00:00 2001
From: pacien
Date: Fri, 17 Apr 2020 22:05:39 +0200
Subject: viewer: ldcommandsearch: clarify flex shrink fix

The bug only affects old version of webkit and seem to have been fixed in the
latest releases of Chromium.

GitHub: #183
---
 viewer/src/components/LdCommandSearch.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

(limited to 'viewer/src/components/LdCommandSearch.vue')

diff --git a/viewer/src/components/LdCommandSearch.vue b/viewer/src/components/LdCommandSearch.vue
index b185a51..ef158ff 100644
--- a/viewer/src/components/LdCommandSearch.vue
+++ b/viewer/src/components/LdCommandSearch.vue
@@ -18,7 +18,7 @@
 -->
 
 <template>
-  <div class="command-search-btn-row">
+  <div class="flex webkit-flex-shrink-fix">
     <b-button @click="clear">
       <fa-icon icon="eraser" />
       <span>{{$t('command.search.clear')}}</span>
@@ -48,8 +48,9 @@ export default class LdCommandSearch extends Vue {
 </script>
 
 <style lang="scss">
-.command-search-btn-row {
-  display: flex;
+// fix flexbox shrinking and overlap in old webkit versions
+// https://github.com/pacien/ldgallery/issues/183
+.webkit-flex-shrink-fix {
   flex: none;
 }
 </style>
-- 
cgit v1.2.3

