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

@@ -13,9 +13,11 @@
class="cursor-pointer flex px-4 justify-center items-center"
@click="toggleShowChildren()"
>
<i class="material-icons" :class="{ 'text-green-500': isSelected }">
{{ getCollectionIcon }}
</i>
<SmartIcon
class="svg-icons"
:class="{ 'text-green-500': isSelected }"
:name="getCollectionIcon"
/>
</span>
<span
class="
@@ -36,7 +38,7 @@
v-if="doc && !selected"
v-tippy="{ theme: 'tooltip' }"
:title="$t('import.title')"
icon="radio_button_unchecked"
svg="circle"
color="green"
@click.native="$emit('select-collection')"
/>
@@ -44,14 +46,14 @@
v-if="doc && selected"
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.remove')"
icon="check_circle_outline"
svg="check-circle"
color="green"
@click.native="$emit('unselect-collection')"
/>
<ButtonSecondary
v-if="!doc"
v-tippy="{ theme: 'tooltip' }"
icon="create_new_folder"
svg="folder-plus"
:title="$t('folder.new')"
class="hidden group-hover:inline-flex"
@click.native="
@@ -73,11 +75,11 @@
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.more')"
icon="more_vert"
svg="more-vertical"
/>
</template>
<SmartItem
icon="create_new_folder"
svg="folder-plus"
:label="$t('folder.new')"
@click.native="
$emit('add-folder', {
@@ -88,7 +90,7 @@
"
/>
<SmartItem
icon="create"
svg="edit"
:label="$t('action.edit')"
@click.native="
$emit('edit-collection')
@@ -96,7 +98,7 @@
"
/>
<SmartItem
icon="delete"
svg="trash-2"
color="red"
:label="$t('action.delete')"
@click.native="
@@ -212,9 +214,9 @@ export default defineComponent({
)
},
getCollectionIcon() {
if (this.isSelected) return "check_circle_outline"
if (this.isSelected) return "check-circle"
else if (!this.showChildren && !this.isFiltered) return "folder"
else if (this.showChildren || this.isFiltered) return "folder_open"
else if (this.showChildren || this.isFiltered) return "folder-minus"
else return "folder"
},
},

View File

@@ -13,9 +13,11 @@
class="cursor-pointer flex px-4 justify-center items-center"
@click="toggleShowChildren()"
>
<i class="material-icons" :class="{ 'text-green-500': isSelected }">
{{ getCollectionIcon }}
</i>
<SmartIcon
class="svg-icons"
:class="{ 'text-green-500': isSelected }"
:name="getCollectionIcon"
/>
</span>
<span
class="
@@ -36,7 +38,7 @@
<div class="flex">
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
icon="create_new_folder"
svg="folder-plus"
:title="$t('folder.new')"
class="hidden group-hover:inline-flex"
@click.native="$emit('add-folder', { folder, path: folderPath })"
@@ -53,11 +55,11 @@
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.more')"
icon="more_vert"
svg="more-vertical"
/>
</template>
<SmartItem
icon="create_new_folder"
svg="folder-plus"
:label="$t('folder.new')"
@click.native="
$emit('add-folder', { folder, path: folderPath })
@@ -65,7 +67,7 @@
"
/>
<SmartItem
icon="edit"
svg="edit"
:label="$t('action.edit')"
@click.native="
$emit('edit-folder', {
@@ -78,7 +80,7 @@
"
/>
<SmartItem
icon="delete"
svg="trash-2"
color="red"
:label="$t('action.delete')"
@click.native="
@@ -199,9 +201,9 @@ export default defineComponent({
)
},
getCollectionIcon() {
if (this.isSelected) return "check_circle_outline"
if (this.isSelected) return "check-circle"
else if (!this.showChildren && !this.isFiltered) return "folder"
else if (this.showChildren || this.isFiltered) return "folder_open"
else if (this.showChildren || this.isFiltered) return "folder-minus"
else return "folder"
},
},

View File

@@ -21,13 +21,12 @@
:class="getRequestLabelColor(request.method)"
@click="!doc ? selectRequest() : {}"
>
<i
<SmartIcon
v-if="isSelected"
class="material-icons"
class="svg-icons"
:class="{ 'text-green-500': isSelected }"
>
check_circle_outline
</i>
name="check-circle"
/>
<span v-else class="truncate">
{{ request.method }}
</span>
@@ -60,7 +59,7 @@
<ButtonSecondary
v-if="!saveRequest && !doc"
v-tippy="{ theme: 'tooltip' }"
icon="replay"
svg="rotate-ccw"
:title="$t('action.restore')"
class="hidden group-hover:inline-flex"
@click.native="!doc ? selectRequest() : {}"
@@ -77,11 +76,11 @@
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.more')"
icon="more_vert"
svg="more-vertical"
/>
</template>
<SmartItem
icon="edit"
svg="edit"
:label="$t('action.edit')"
@click.native="
$emit('edit-request', {
@@ -96,7 +95,7 @@
"
/>
<SmartItem
icon="delete"
svg="trash-2"
color="red"
:label="$t('action.delete')"
@click.native="