feat: svg icons

This commit is contained in:
liyasthomas
2021-08-28 05:47:33 +05:30
parent e397e3fb6f
commit 476bfbaef0
149 changed files with 476 additions and 392 deletions

View File

@@ -81,12 +81,12 @@
to="https://docs.hoppscotch.io/features/authorization"
blank
:title="$t('app.wiki')"
icon="help_outline"
svg="help-circle"
/>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.clear')"
icon="clear_all"
svg="trash-2"
@click.native="clearContent"
/>
</div>
@@ -103,7 +103,7 @@
:label="$t('action.learn_more')"
to="https://docs.hoppscotch.io"
blank
icon="open_in_new"
svg="external-link"
reverse
/>
</div>
@@ -147,9 +147,7 @@
/>
<span>
<ButtonSecondary
:icon="
passwordFieldType === 'text' ? 'visibility' : 'visibility_off'
"
:svg="passwordFieldType === 'text' ? 'eye' : 'eye-off'"
@click.native="switchVisibility"
/>
</span>

View File

@@ -22,18 +22,18 @@
to="https://docs.hoppscotch.io/features/body"
blank
:title="$t('app.wiki')"
icon="help_outline"
svg="help-circle"
/>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.clear_all')"
icon="clear_all"
svg="trash-2"
@click.native="clearContent"
/>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('add.new')"
icon="add"
svg="plus"
@click.native="addBodyParam"
/>
</div>
@@ -131,7 +131,7 @@
<label for="attachment" class="p-0">
<ButtonSecondary
class="w-full"
icon="attach_file"
svg="paperclip"
@click.native="$refs.attachment[index].click()"
/>
</label>
@@ -154,12 +154,12 @@
: $t('action.turn_on')
: $t('action.turn_off')
"
:icon="
:svg="
param.hasOwnProperty('active')
? param.active
? 'check_circle_outline'
: 'radio_button_unchecked'
: 'check_circle_outline'
? 'check-circle'
: 'circle'
: 'check-circle'
"
color="green"
@click.native="
@@ -176,7 +176,7 @@
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.remove')"
icon="remove_circle_outline"
svg="trash"
color="red"
@click.native="deleteBodyParam(index)"
/>
@@ -192,7 +192,7 @@
<ButtonSecondary
:label="$t('add.new')"
filled
icon="add"
svg="plus"
@click.native="addBodyParam"
/>
</div>

View File

@@ -59,7 +59,7 @@
<ButtonPrimary
ref="copyRequestCode"
:label="t('action.copy')"
:icon="copyIcon"
:svg="copyIcon"
@click.native="copyRequestCode"
/>
<ButtonSecondary :label="t('action.dismiss')" @click.native="hideModal" />
@@ -93,7 +93,7 @@ const options = ref<any | null>(null)
const request = ref(getRESTRequest())
const codegenType = ref("curl")
const copyIcon = ref("content_copy")
const copyIcon = ref("copy")
const requestCode = computed(() => {
const effectiveRequest = getEffectiveRESTRequest(
@@ -119,10 +119,10 @@ const hideModal = () => emit("hide-modal")
const copyRequestCode = () => {
copyToClipboard(requestCode.value)
copyIcon.value = "done"
copyIcon.value = "check"
$toast.success(t("state.copied_to_clipboard").toString(), {
icon: "content_paste",
})
setTimeout(() => (copyIcon.value = "content_copy"), 1000)
setTimeout(() => (copyIcon.value = "copy"), 1000)
}
</script>

View File

@@ -22,18 +22,18 @@
to="https://docs.hoppscotch.io/features/headers"
blank
:title="$t('app.wiki')"
icon="help_outline"
svg="help-circle"
/>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.clear_all')"
icon="clear_all"
svg="trash-2"
@click.native="clearContent"
/>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('add.new')"
icon="add"
svg="plus"
@click.native="addHeader"
/>
</div>
@@ -109,12 +109,12 @@
: $t('action.turn_on')
: $t('action.turn_off')
"
:icon="
:svg="
header.hasOwnProperty('active')
? header.active
? 'check_circle_outline'
: 'radio_button_unchecked'
: 'check_circle_outline'
? 'check-circle'
: 'circle'
: 'check-circle'
"
color="green"
@click.native="
@@ -130,7 +130,7 @@
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.remove')"
icon="remove_circle_outline"
svg="trash"
color="red"
@click.native="deleteHeader(index)"
/>
@@ -146,7 +146,7 @@
<ButtonSecondary
filled
:label="$t('add.new')"
icon="add"
svg="plus"
@click.native="addHeader"
/>
</div>

View File

@@ -22,18 +22,18 @@
to="https://docs.hoppscotch.io/features/parameters"
blank
:title="$t('app.wiki')"
icon="help_outline"
svg="help-circle"
/>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.clear_all')"
icon="clear_all"
svg="trash-2"
@click.native="clearContent"
/>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('add.new')"
icon="add"
svg="plus"
@click.native="addParam"
/>
</div>
@@ -120,12 +120,12 @@
: $t('action.turn_on')
: $t('action.turn_off')
"
:icon="
:svg="
param.hasOwnProperty('active')
? param.active
? 'check_circle_outline'
: 'radio_button_unchecked'
: 'check_circle_outline'
? 'check-circle'
: 'circle'
: 'check-circle'
"
color="green"
@click.native="
@@ -141,7 +141,7 @@
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.remove')"
icon="remove_circle_outline"
svg="trash"
color="red"
@click.native="deleteParam(index)"
/>
@@ -156,7 +156,7 @@
</span>
<ButtonSecondary
:label="$t('add.new')"
icon="add"
svg="plus"
filled
@click.native="addParam"
/>

View File

@@ -22,12 +22,12 @@
to="https://docs.hoppscotch.io/features/pre-request-script"
blank
:title="$t('app.wiki')"
icon="help_outline"
svg="help-circle"
/>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.clear')"
icon="clear_all"
svg="trash-2"
@click.native="clearContent"
/>
</div>

View File

@@ -22,12 +22,12 @@
to="https://docs.hoppscotch.io/features/body"
blank
:title="$t('app.wiki')"
icon="help_outline"
svg="help-circle"
/>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.clear')"
icon="clear_all"
svg="trash-2"
@click.native="clearContent('rawParams', $event)"
/>
<ButtonSecondary
@@ -35,14 +35,14 @@
ref="prettifyRequest"
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.prettify')"
:icon="prettifyIcon"
:svg="prettifyIcon"
@click.native="prettifyRequestBody"
/>
<label for="payload">
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('import.json')"
icon="post_add"
svg="file-plus"
@click.native="$refs.payload.click()"
/>
</label>
@@ -88,7 +88,7 @@ export default defineComponent({
setup() {
return {
rawParamsBody: pluckRef(useRESTRequestBody(), "body"),
prettifyIcon: "photo_filter",
prettifyIcon: "sparkles",
}
},
computed: {
@@ -122,8 +122,8 @@ export default defineComponent({
try {
const jsonObj = JSON.parse(this.rawParamsBody)
this.rawParamsBody = JSON.stringify(jsonObj, null, 2)
this.prettifyIcon = "done"
setTimeout(() => (this.prettifyIcon = "photo_filter"), 1000)
this.prettifyIcon = "check"
setTimeout(() => (this.prettifyIcon = "sparkles"), 1000)
} catch (e) {
console.error(e)
this.$toast.error(`${this.$t("error.json_prettify_invalid_body")}`, {

View File

@@ -107,15 +107,11 @@
arrow
>
<template #trigger>
<ButtonPrimary
class="rounded-l-none"
filled
icon="keyboard_arrow_down"
/>
<ButtonPrimary class="rounded-l-none" filled svg="chevron-down" />
</template>
<SmartItem
:label="$t('import.curl')"
icon="import_export"
svg="terminal"
@click.native="
() => {
showCurlImportModal = !showCurlImportModal
@@ -125,7 +121,7 @@
/>
<SmartItem
:label="$t('show.code')"
icon="code"
svg="code"
@click.native="
() => {
showCodegenModal = !showCodegenModal
@@ -136,7 +132,7 @@
<SmartItem
ref="clearAll"
:label="$t('action.clear_all')"
icon="clear_all"
svg="rotate-ccw"
@click.native="
() => {
clearContent()
@@ -150,7 +146,7 @@
class="rounded-r-none ml-2"
:label="$t('request.save')"
filled
icon="save"
svg="save"
@click.native="saveRequest()"
/>
<span class="flex">
@@ -162,11 +158,7 @@
arrow
>
<template #trigger>
<ButtonSecondary
icon="keyboard_arrow_down"
filled
class="rounded-r"
/>
<ButtonSecondary svg="chevron-down" filled class="rounded-r" />
</template>
<input
id="request-name"
@@ -180,7 +172,7 @@
<SmartItem
ref="copyRequest"
:label="$t('request.copy_link')"
:icon="hasNavigatorShare ? 'share' : 'content_copy'"
:svg="hasNavigatorShare ? 'share-2' : 'copy'"
@click.native="
() => {
copyRequest()
@@ -191,7 +183,7 @@
<SmartItem
ref="saveRequest"
:label="$t('request.save_as')"
icon="create_new_folder"
svg="folder-plus"
@click.native="
() => {
showSaveRequestModal = true

View File

@@ -44,7 +44,7 @@
<ButtonSecondary
:label="$t('app.documentation')"
to="https://docs.hoppscotch.io"
icon="open_in_new"
svg="external-link"
blank
outline
reverse
@@ -76,7 +76,7 @@
:label="$t('action.learn_more')"
to="https://docs.hoppscotch.io"
blank
icon="open_in_new"
svg="external-link"
reverse
/>
</div>

View File

@@ -25,7 +25,7 @@
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.clear')"
icon="clear_all"
svg="trash-2"
@click.native="clearContent()"
/>
</div>
@@ -87,7 +87,7 @@
:label="$t('action.learn_more')"
to="https://docs.hoppscotch.io"
blank
icon="open_in_new"
svg="external-link"
reverse
/>
</div>

View File

@@ -22,12 +22,12 @@
to="https://docs.hoppscotch.io/features/tests"
blank
:title="$t('app.wiki')"
icon="help_outline"
svg="help-circle"
/>
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.clear')"
icon="clear_all"
svg="trash-2"
@click.native="clearContent"
/>
</div>