btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

feat: svg icons

Browse Source
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
Download Patch File Download Diff File Expand all files Collapse all files

22
components/collections/graphql/Collection.vue
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="
@@ -34,7 +36,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="
@@ -55,11 +57,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', {
@@ -69,7 +71,7 @@
"
/>
<SmartItem
icon="create"
svg="edit"
:label="$t('action.edit')"
@click.native="
$emit('edit-collection')
@@ -77,7 +79,7 @@
"
/>
<SmartItem
icon="delete"
svg="trash-2"
color="red"
:label="$t('action.delete')"
@click.native="
@@ -186,9 +188,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"
},
},

22
components/collections/graphql/Folder.vue
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', { folder, folderPath })
@@ -73,7 +75,7 @@
"
/>
<SmartItem
icon="delete"
svg="trash-2"
color="red"
:label="$t('action.delete')"
@click.native="
@@ -184,9 +186,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"
},
},

8
components/collections/graphql/ImportExport.vue
View File

@@ -12,7 +12,7 @@
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.more')"
class="rounded"
icon="more_vert"
svg="more-vertical"
/>
</template>
<SmartItem
@@ -57,7 +57,7 @@
<SmartItem
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.replace_current')"
icon="folder_special"
svg="file"
:label="$t('action.replace_json')"
@click.native="openDialogChooseFileToReplaceWith"
/>
@@ -71,7 +71,7 @@
<SmartItem
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.preserve_current')"
icon="create_new_folder"
svg="folder-plus"
:label="$t('import.json')"
@click.native="openDialogChooseFileToImportFrom"
/>
@@ -85,7 +85,7 @@
<SmartItem
v-tippy="{ theme: 'tooltip' }"
:title="$t('action.download_file')"
icon="drive_file_move"
svg="download"
:label="$t('export.as_json')"
@click.native="exportJSON"
/>

16
components/collections/graphql/Request.vue
View File

@@ -20,9 +20,11 @@
"
@click="!doc ? selectRequest() : {}"
>
<i class="material-icons" :class="{ 'text-green-500': isSelected }">
{{ isSelected ? "check_circle_outline" : "description" }}
</i>
<SmartIcon
class="svg-icons"
:class="{ 'text-green-500': isSelected }"
:name="isSelected ? 'check-circle' : 'file'"
/>
</span>
<span
class="
@@ -42,7 +44,7 @@
<ButtonSecondary
v-if="!savingMode"
v-tippy="{ theme: 'tooltip' }"
icon="replay"
svg="rotate-ccw"
:title="$t('action.restore')"
class="hidden group-hover:inline-flex"
@click.native="!doc ? selectRequest() : {}"
@@ -59,11 +61,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', {
@@ -75,7 +77,7 @@
"
/>
<SmartItem
icon="delete"
svg="trash-2"
color="red"
:label="$t('action.delete')"
@click.native="

8
components/collections/graphql/index.vue
View File

@@ -24,9 +24,9 @@
</div>
<div class="flex flex-1 justify-between">
<ButtonSecondary
icon="add"
svg="plus"
:label="$t('action.new')"
class="rounded-none"
class="!rounded-none"
@click.native="displayModalAdd(true)"
/>
<div class="flex">
@@ -35,13 +35,13 @@
to="https://docs.hoppscotch.io/features/collections"
blank
:title="$t('app.wiki')"
icon="help_outline"
svg="help-circle"
/>
<ButtonSecondary
v-if="showCollActions"
v-tippy="{ theme: 'tooltip' }"
:title="$t('modal.import_export')"
icon="import_export"
svg="archive"
@click.native="displayModalImportExport(true)"
/>
</div>