Mercurial > gemma

comparison client/src/components/Search.vue @ 5450:62caee603217 uiimprovements

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
Make BN-Overview smaller.
author Thomas Junk <thomas.junk@intevation.de>
date Wed, 14 Jul 2021 12:07:31 +0200
parents 19715261750e
children 1cf9b043dca1
comparison
equal deleted inserted replaced
5449:d01c098562d9 5450:62caee603217
7 </div> 7 </div>
8 <div 8 <div
9 :class="[ 9 :class="[
10 'searchgroup', 10 'searchgroup',
11 { 11 {
12 searchgroupwidthbottlenecks:
13 this.showSearchbar && this.contextBoxContent === 'bottlenecks',
14 sgnobottlenecks:
15 this.showSearchbar && this.contextBoxContent !== 'bottlenecks',
12 'searchgroup-collapsed': !showSearchbar, 16 'searchgroup-collapsed': !showSearchbar,
13 big: 17 big:
14 showContextBox && 18 showContextBox &&
15 ['bottlenecks', 'staging', 'stretches'].indexOf( 19 ['bottlenecks', 'staging', 'stretches'].indexOf(
16 contextBoxContent 20 contextBoxContent
83 </template> 87 </template>
84 88
85 <style lang="scss" scoped> 89 <style lang="scss" scoped>
86 .searchcontainer { 90 .searchcontainer {
87 opacity: 0.96; 91 opacity: 0.96;
92 }
93
94 .searchcontainerwitdh {
88 width: 860px; 95 width: 860px;
96 transition: 0.1s;
97 transition-timing-function: ease;
98 }
99
100 .searchcontainerwitdhbottlenecks {
101 width: 650px;
102 transition: 0.1s;
103 transition-timing-function: ease;
104 }
105
106 .searchgroupwidth {
107 max-width: 860px;
108 transition: 0.1s;
109 transition-timing-function: ease;
110 }
111
112 .sgnobottlenecks {
113 width: 817px;
114 transition: 0.1s;
115 transition-timing-function: ease;
116 }
117
118 .searchgroupwidthbottlenecks {
119 width: 617px;
120 transition: 0.1s;
121 transition-timing-function: ease;
89 } 122 }
90 123
91 .searchcontainer .searchbar { 124 .searchcontainer .searchbar {
92 border-top-left-radius: 0 !important; 125 border-top-left-radius: 0 !important;
93 border-bottom-left-radius: 0 !important; 126 border-bottom-left-radius: 0 !important;
94 } 127 }
95 128
96 .searchgroup { 129 .searchgroup {
97 width: 827px;
98 overflow: hidden; 130 overflow: hidden;
99 } 131 }
100 132
101 .searchgroup-collapsed { 133 .searchgroup-collapsed {
102 width: 0; 134 width: 0;
216 return [ 248 return [
217 "input-group searchcontainer shadow-xs rounded", 249 "input-group searchcontainer shadow-xs rounded",
218 { 250 {
219 "d-flex": this.contextBoxContent !== "imports", 251 "d-flex": this.contextBoxContent !== "imports",
220 "d-none": this.contextBoxContent === "imports" && this.showContextBox, 252 "d-none": this.contextBoxContent === "imports" && this.showContextBox,
221 smallbox: !this.showSearchbar 253 smallbox: !this.showSearchbar,
254 searchcontainerwidth:
255 this.showSearchbar && this.contextBoxContent !== "bottlenecks",
256 searchgroupwidth:
257 this.showSearchbar && this.contextBoxContent !== "bottlenecks",
258 searchcontainerwidthbottlenecks:
259 this.showSearchbar && this.contextBoxContent === "bottlenecks",
260 searchgroupwidthbottleneks:
261 this.showSearchbar && this.contextBoxContent === "bottlenecks"
222 } 262 }
223 ]; 263 ];
224 }, 264 },
225 searchInputStyle() { 265 searchInputStyle() {
226 return [ 266 return [