Skip to content

Commit e8bbed8

Browse files
kyteinskykyteinsky
committed
feat: use outline icons instead of solid ones
Signed-off-by: Anupam Kumar <[email protected]>
1 parent 4ed1b11 commit e8bbed8

File tree

2 files changed

+50
-36
lines changed

2 files changed

+50
-36
lines changed

‎src/components/AdminSettings.vue

Lines changed: 37 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -38,12 +38,14 @@
3838
:show-trailing-button="!!state.url"
3939
@update:model-value="onSensitiveInput(true)"
4040
@trailing-button-click="state.url = '' ; onSensitiveInput(true)">
41-
<EarthIcon />
41+
<template #icon>
42+
<EarthIcon :size="20" />
43+
</template>
4244
</NcTextField>
4345
<NcButton variant="tertiary"
4446
:title="t('integration_openai', 'Leave empty to use {openaiApiUrl}', { openaiApiUrl: 'https://api.openai.com/v1' })">
4547
<template #icon>
46-
<HelpCircleIcon />
48+
<HelpCircleOutlineIcon />
4749
</template>
4850
</NcButton>
4951
</div>
@@ -70,7 +72,7 @@
7072
<NcButton variant="tertiary"
7173
:title="t('integration_openai', 'This name will be displayed as provider name in the AI admin settings')">
7274
<template #icon>
73-
<HelpCircleIcon />
75+
<HelpCircleOutlineIcon />
7476
</template>
7577
</NcButton>
7678
</div>
@@ -85,15 +87,17 @@
8587
:show-trailing-button="!!state.request_timeout"
8688
@update:model-value="onInput()"
8789
@trailing-button-click="state.request_timeout = '' ; onInput()">
88-
<TimerAlertOutlineIcon />
90+
<template #icon>
91+
<TimerAlertOutlineIcon :size="20" />
92+
</template>
8993
<template #trailing-button-icon>
9094
<CloseIcon :size="20" />
9195
</template>
9296
</NcInputField>
9397
<NcButton variant="tertiary"
9498
:title="t('integration_openai', 'Timeout for the request to the external API')">
9599
<template #icon>
96-
<HelpCircleIcon />
100+
<HelpCircleOutlineIcon />
97101
</template>
98102
</NcButton>
99103
</div>
@@ -139,7 +143,9 @@
139143
@update:model-value="onSensitiveInput(true)"
140144
@trailing-button-click="state.api_key = '' ; onSensitiveInput(true)"
141145
@focus="readonly = false">
142-
<KeyIcon />
146+
<template #icon>
147+
<KeyOutlineIcon :size="20" />
148+
</template>
143149
</NcTextField>
144150
</div>
145151
<NcNoteCard v-show="state.url === ''" type="info">
@@ -161,7 +167,9 @@
161167
@update:model-value="onSensitiveInput(true)"
162168
@trailing-button-click="state.basic_user = '' ; onSensitiveInput(true)"
163169
@focus="readonly = false">
164-
<AccountIcon />
170+
<template #icon>
171+
<AccountOutlineIcon :size="20" />
172+
</template>
165173
</NcTextField>
166174
</div>
167175
<div class="line">
@@ -176,7 +184,9 @@
176184
@update:model-value="onSensitiveInput(true)"
177185
@trailing-button-click="state.basic_password = '' ; onSensitiveInput(true)"
178186
@focus="readonly = false">
179-
<KeyIcon />
187+
<template #icon>
188+
<KeyOutlineIcon :size="20" />
189+
</template>
180190
</NcTextField>
181191
</div>
182192
</div>
@@ -233,7 +243,7 @@
233243
target="_blank">
234244
<NcButton variant="tertiary" aria-label="openai-info">
235245
<template #icon>
236-
<HelpCircleIcon />
246+
<HelpCircleOutlineIcon />
237247
</template>
238248
</NcButton>
239249
</a>
@@ -243,7 +253,7 @@
243253
target="_blank">
244254
<NcButton variant="tertiary" aria-label="localai-info">
245255
<template #icon>
246-
<HelpCircleIcon />
256+
<HelpCircleOutlineIcon />
247257
</template>
248258
</NcButton>
249259
</a>
@@ -260,7 +270,7 @@
260270
<NcButton variant="tertiary"
261271
:title="llmExtraParamHint">
262272
<template #icon>
263-
<HelpCircleIcon />
273+
<HelpCircleOutlineIcon />
264274
</template>
265275
</NcButton>
266276
</div>
@@ -282,7 +292,7 @@
282292
<NcButton variant="tertiary"
283293
:title="t('integration_openai', 'Split the prompt into chunks with each chunk being no more than the specified number of tokens (0 disables chunking)')">
284294
<template #icon>
285-
<HelpCircleIcon />
295+
<HelpCircleOutlineIcon />
286296
</template>
287297
</NcButton>
288298
</div>
@@ -308,7 +318,7 @@
308318
target="_blank">
309319
<NcButton variant="tertiary" aria-label="openai-info">
310320
<template #icon>
311-
<HelpCircleIcon />
321+
<HelpCircleOutlineIcon />
312322
</template>
313323
</NcButton>
314324
</a>
@@ -318,7 +328,7 @@
318328
target="_blank">
319329
<NcButton variant="tertiary" aria-label="localai-info">
320330
<template #icon>
321-
<HelpCircleIcon />
331+
<HelpCircleOutlineIcon />
322332
</template>
323333
</NcButton>
324334
</a>
@@ -338,7 +348,7 @@
338348
<NcButton variant="tertiary"
339349
:title="defaultImageSizeParamHint">
340350
<template #icon>
341-
<HelpCircleIcon />
351+
<HelpCircleOutlineIcon />
342352
</template>
343353
</NcButton>
344354
</div>
@@ -369,7 +379,7 @@
369379
target="_blank">
370380
<NcButton variant="tertiary" aria-label="openai-info">
371381
<template #icon>
372-
<HelpCircleIcon />
382+
<HelpCircleOutlineIcon />
373383
</template>
374384
</NcButton>
375385
</a>
@@ -379,7 +389,7 @@
379389
target="_blank">
380390
<NcButton variant="tertiary" aria-label="localai-info">
381391
<template #icon>
382-
<HelpCircleIcon />
392+
<HelpCircleOutlineIcon />
383393
</template>
384394
</NcButton>
385395
</a>
@@ -408,7 +418,7 @@
408418
target="_blank">
409419
<NcButton variant="tertiary" aria-label="openai-info">
410420
<template #icon>
411-
<HelpCircleIcon />
421+
<HelpCircleOutlineIcon />
412422
</template>
413423
</NcButton>
414424
</a>
@@ -418,7 +428,7 @@
418428
target="_blank">
419429
<NcButton variant="tertiary" aria-label="localai-info">
420430
<template #icon>
421-
<HelpCircleIcon />
431+
<HelpCircleOutlineIcon />
422432
</template>
423433
</NcButton>
424434
</a>
@@ -433,7 +443,7 @@
433443
variant="tertiary"
434444
aria-label="voices-info">
435445
<template #icon>
436-
<HelpCircleIcon />
446+
<HelpCircleOutlineIcon />
437447
</template>
438448
</NcButton>
439449
</label>
@@ -529,7 +539,7 @@
529539
<NcButton variant="tertiary"
530540
:title="t('integration_openai', 'Maximum number of new tokens generated for a single text generation prompt')">
531541
<template #icon>
532-
<HelpCircleIcon />
542+
<HelpCircleOutlineIcon />
533543
</template>
534544
</NcButton>
535545
</div>
@@ -574,11 +584,11 @@
574584
</template>
575585

576586
<script>
577-
import AccountIcon from 'vue-material-design-icons/Account.vue'
587+
import AccountOutlineIcon from 'vue-material-design-icons/AccountOutline.vue'
578588
import CloseIcon from 'vue-material-design-icons/Close.vue'
579589
import EarthIcon from 'vue-material-design-icons/Earth.vue'
580-
import HelpCircleIcon from 'vue-material-design-icons/HelpCircle.vue'
581-
import KeyIcon from 'vue-material-design-icons/Key.vue'
590+
import HelpCircleOutlineIcon from 'vue-material-design-icons/HelpCircleOutline.vue'
591+
import KeyOutlineIcon from 'vue-material-design-icons/KeyOutline.vue'
582592
import TimerAlertOutlineIcon from 'vue-material-design-icons/TimerAlertOutline.vue'
583593
584594
import OpenAiIcon from './icons/OpenAiIcon.vue'
@@ -604,12 +614,12 @@ export default {
604614
605615
components: {
606616
OpenAiIcon,
607-
KeyIcon,
617+
KeyOutlineIcon,
608618
CloseIcon,
609-
AccountIcon,
619+
AccountOutlineIcon,
610620
EarthIcon,
611621
TimerAlertOutlineIcon,
612-
HelpCircleIcon,
622+
HelpCircleOutlineIcon,
613623
NcButton,
614624
NcSelect,
615625
NcCheckboxRadioSwitch,

‎src/components/PersonalSettings.vue

Lines changed: 13 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -29,7 +29,9 @@
2929
@update:model-value="onSensitiveInput"
3030
@trailing-button-click="state.api_key = '' ; onSensitiveInput()"
3131
@focus="readonly = false">
32-
<KeyIcon />
32+
<template #icon>
33+
<KeyOutlineIcon :size="20" />
34+
</template>
3335
</NcTextField>
3436
</div>
3537
<div v-if="!state.is_custom_service">
@@ -48,7 +50,7 @@
4850
</NcNoteCard>
4951
<div class="line">
5052
<label for="basic-user">
51-
<KeyIcon :size="20" class="icon" />
53+
<KeyOutlineIcon :size="20" class="icon" />
5254
{{ t('integration_openai', 'Username') }}
5355
</label>
5456
<input id="openai-basic-user"
@@ -61,7 +63,7 @@
6163
</div>
6264
<div class="line">
6365
<label for="basic-password">
64-
<KeyIcon :size="20" class="icon" />
66+
<KeyOutlineIcon :size="20" class="icon" />
6567
{{ t('integration_openai', 'Password') }}
6668
</label>
6769
<input id="openai-basic-password"
@@ -112,26 +114,26 @@
112114

113115
<script>
114116
import InformationOutlineIcon from 'vue-material-design-icons/InformationOutline.vue'
115-
import KeyIcon from 'vue-material-design-icons/Key.vue'
117+
import KeyOutlineIcon from 'vue-material-design-icons/KeyOutline.vue'
116118
117119
import OpenAiIcon from './icons/OpenAiIcon.vue'
118120
119-
import NcTextField from '@nextcloud/vue/components/NcTextField'
120121
import NcNoteCard from '@nextcloud/vue/components/NcNoteCard'
122+
import NcTextField from '@nextcloud/vue/components/NcTextField'
121123
122-
import { loadState } from '@nextcloud/initial-state'
123-
import { generateUrl } from '@nextcloud/router'
124124
import axios from '@nextcloud/axios'
125-
import { showSuccess, showError } from '@nextcloud/dialogs'
125+
import { showError, showSuccess } from '@nextcloud/dialogs'
126+
import { loadState } from '@nextcloud/initial-state'
126127
import { confirmPassword } from '@nextcloud/password-confirmation'
128+
import { generateUrl } from '@nextcloud/router'
127129
import debounce from 'debounce'
128130
129131
export default {
130132
name: 'PersonalSettings',
131133
132134
components: {
133135
OpenAiIcon,
134-
KeyIcon,
136+
KeyOutlineIcon,
135137
InformationOutlineIcon,
136138
NcNoteCard,
137139
NcTextField,
@@ -226,10 +228,12 @@ export default {
226228
#openai-content {
227229
margin-left: 40px;
228230
}
231+
229232
h2,
230233
.line,
231234
.settings-hint {
232235
display: flex;
236+
justify-content: start;
233237
align-items: center;
234238
margin-top: 12px;
235239
.icon {

0 commit comments

Comments
 (0)