Skip to content

Commit f40215c

Browse files
graphierosgraphieros
committed
UserOptions - Fix button labels color not applied
1 parent f26935b commit f40215c

File tree

1 file changed

+10
-10
lines changed

1 file changed

+10
-10
lines changed

‎src/atoms/UserOptions.vue‎

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -208,7 +208,7 @@ const isInfo = ref({
208208

209209
<template>
210210
<div v-click-outside="closeIfOpen" data-html2canvas-ignore class="vue-ui-user-options" :style="`height: 34px; position: ${isFullscreen ? 'fixed' : 'absolute'}; top: 0; right:${isFullscreen ? '12px': '0'}; padding: 4px; background:transparent; z-index: 1`">
211-
<div tabindex="0" :title="isOpen ? titles.close || '' : titles.open || ''" data-cy="user-options-summary" :style="`width:32px; position: absolute; top: 0; right:4px; padding: 0 0px; display: flex; align-items:center;justify-content:center;height: 36px; cursor:pointer; background:${backgroundColor};`" @click.stop="toggle" @keypress.enter="toggle">
211+
<div tabindex="0" :title="isOpen ? titles.close || '' : titles.open || ''" data-cy="user-options-summary" :style="`width:32px; position: absolute; top: 0; right:4px; padding: 0 0px; display: flex; align-items:center;justify-content:center;height: 36px; cursor:pointer; background:${backgroundColor}`" @click.stop="toggle" @keypress.enter="toggle">
212212
<BaseIcon :name="isOpen ? 'close' : 'menu'" stroke="#CCCCCC" :stroke-width="2" />
213213
</div>
214214
<div data-cy="user-options-drawer" :data-open="isOpen" :class="{'vue-ui-user-options-drawer': true}" :style="`background:${backgroundColor};`">
@@ -221,7 +221,7 @@ const isInfo = ref({
221221
<BaseIcon v-if="isItTooltip" name="tooltip" :stroke="color" style="pointer-events: none;"/>
222222
<BaseIcon v-else name="tooltipDisabled" :stroke="color" style="pointer-events: none"/>
223223
</template>
224-
<div v-if="isDesktop && titles.tooltip && !$slots.optionTooltip" :class="{'button-info' : true, 'button-info-visible': isInfo.tooltip }" :style="{ background: backgroundColor }">
224+
<div v-if="isDesktop && titles.tooltip && !$slots.optionTooltip" :class="{'button-info' : true, 'button-info-visible': isInfo.tooltip }" :style="{ background: backgroundColor, color: color }">
225225
{{ titles.tooltip }}
226226
</div>
227227
</button>
@@ -234,7 +234,7 @@ const isInfo = ref({
234234
<BaseIcon v-if="isPrinting" name="spin" isSpin :stroke="color" style="pointer-events: none;" />
235235
<BaseIcon v-else name="pdf" :stroke="color" style="pointer-events: none;" />
236236
</template>
237-
<div v-if="isDesktop && titles.pdf && !$slots.optionPdf" :class="{'button-info' : true, 'button-info-visible': isInfo.pdf }" :style="{ background: backgroundColor }">
237+
<div v-if="isDesktop && titles.pdf && !$slots.optionPdf" :class="{'button-info' : true, 'button-info-visible': isInfo.pdf }" :style="{ background: backgroundColor, color: color }">
238238
{{ titles.pdf }}
239239
</div>
240240
</button>
@@ -246,7 +246,7 @@ const isInfo = ref({
246246
<template v-else>
247247
<BaseIcon name="excel" :stroke="color" style="pointer-events: none"/>
248248
</template>
249-
<div v-if="isDesktop && titles.csv && !$slots.optionCsv" :class="{'button-info' : true, 'button-info-visible': isInfo.csv }" :style="{ background: backgroundColor }">
249+
<div v-if="isDesktop && titles.csv && !$slots.optionCsv" :class="{'button-info' : true, 'button-info-visible': isInfo.csv }" :style="{ background: backgroundColor, color: color }">
250250
{{ titles.csv }}
251251
</div>
252252
</button>
@@ -259,7 +259,7 @@ const isInfo = ref({
259259
<BaseIcon v-if="isImaging" name="spin" isSpin :stroke="color" style="pointer-events: none;" />
260260
<BaseIcon v-else name="image" :stroke="color" style="pointer-events: none;" />
261261
</template>
262-
<div v-if="isDesktop && titles.img && !$slots.optionImg" :class="{'button-info' : true, 'button-info-visible': isInfo.img }" :style="{ background: backgroundColor }">
262+
<div v-if="isDesktop && titles.img && !$slots.optionImg" :class="{'button-info' : true, 'button-info-visible': isInfo.img }" :style="{ background: backgroundColor, color: color }">
263263
{{ titles.img }}
264264
</div>
265265
</button>
@@ -271,7 +271,7 @@ const isInfo = ref({
271271
<template v-else>
272272
<BaseIcon :name="isTableOpen ? 'tableClose' : 'tableOpen'" :stroke="color" style="pointer-events: none;" />
273273
</template>
274-
<div v-if="isDesktop && titles.table && !$slots.optionTable" :class="{'button-info' : true, 'button-info-visible': isInfo.table }" :style="{ background: backgroundColor }">
274+
<div v-if="isDesktop && titles.table && !$slots.optionTable" :class="{'button-info' : true, 'button-info-visible': isInfo.table }" :style="{ background: backgroundColor, color: color }">
275275
{{ titles.table }}
276276
</div>
277277
</button>
@@ -283,7 +283,7 @@ const isInfo = ref({
283283
<template v-else>
284284
<BaseIcon :name="isLabel ? 'labelClose' : 'labelOpen'" :stroke="color" style="pointer-events: none;"/>
285285
</template>
286-
<div v-if="isDesktop && titles.labels && !$slots.optionLabels" :class="{'button-info' : true, 'button-info-visible': isInfo.labels }" :style="{ background: backgroundColor }">
286+
<div v-if="isDesktop && titles.labels && !$slots.optionLabels" :class="{'button-info' : true, 'button-info-visible': isInfo.labels }" :style="{ background: backgroundColor, color: color }">
287287
{{ titles.labels }}
288288
</div>
289289
</button>
@@ -295,7 +295,7 @@ const isInfo = ref({
295295
<template v-else>
296296
<BaseIcon name="sort" :stroke="color" style="pointer-events: none;"/>
297297
</template>
298-
<div v-if="isDesktop && titles.sort && !$slots.optionSort" :class="{'button-info' : true, 'button-info-visible': isInfo.sort }" :style="{ background: backgroundColor }">
298+
<div v-if="isDesktop && titles.sort && !$slots.optionSort" :class="{'button-info' : true, 'button-info-visible': isInfo.sort }" :style="{ background: backgroundColor, color: color }">
299299
{{ titles.sort }}
300300
</div>
301301
</button>
@@ -308,7 +308,7 @@ const isInfo = ref({
308308
<BaseIcon v-if="isItStacked" name="unstack" :stroke="color" style="pointer-events: none;"/>
309309
<BaseIcon v-else name="stack" :stroke="color" style="pointer-events: none;"/>
310310
</template>
311-
<div v-if="isDesktop && titles.stack && !$slots.optionStack" :class="{'button-info' : true, 'button-info-visible': isInfo.stack }" :style="{ background: backgroundColor }">
311+
<div v-if="isDesktop && titles.stack && !$slots.optionStack" :class="{'button-info' : true, 'button-info-visible': isInfo.stack }" :style="{ background: backgroundColor, color: color }">
312312
{{ titles.stack }}
313313
</div>
314314
</button>
@@ -321,7 +321,7 @@ const isInfo = ref({
321321
<BaseIcon v-if="isFullscreen" name="exitFullscreen" :stroke="color" style="pointer-events: none;"/>
322322
<BaseIcon v-if="!isFullscreen" name="fullscreen" :stroke="color" style="pointer-events: none;"/>
323323
</template>
324-
<div v-if="isDesktop && titles.fullscreen && !$slots.optionFullscreen" :class="{'button-info' : true, 'button-info-visible': isInfo.fullscreen }" :style="{ background: backgroundColor }">
324+
<div v-if="isDesktop && titles.fullscreen && !$slots.optionFullscreen" :class="{'button-info' : true, 'button-info-visible': isInfo.fullscreen }" :style="{ background: backgroundColor, color: color }">
325325
{{ titles.fullscreen }}
326326
</div>
327327
</button>

0 commit comments

Comments
 (0)