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

refactor: sort classes

Browse Source
This commit is contained in:
liyasthomas
2021-12-31 20:05:39 +05:30
parent 80956fbd27
commit b343789554
62 changed files with 349 additions and 352 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/hoppscotch-app/components/smart/Checkbox.vue
View File

@@ -1,6 +1,6 @@
<template>
<div
class="cursor-pointer flex-nowrap transition inline-flex items-center justify-center group hover:text-secondaryDark"
class="inline-flex items-center justify-center transition cursor-pointer flex-nowrap group hover:text-secondaryDark"
@click="$emit('change')"
>
<input
@@ -12,7 +12,7 @@
/>
<label
for="checkbox"
class="cursor-pointer font-semibold pl-0 align-middle"
class="pl-0 font-semibold align-middle cursor-pointer"
>
<slot></slot>
</label>

2
packages/hoppscotch-app/components/smart/DeletableChip.vue
View File

@@ -1,7 +1,7 @@
<template>
<span class="chip">
<i class="opacity-75 material-icons">attachment</i>
<span class="max-w-64 px-2 truncate"><slot></slot></span>
<span class="px-2 truncate max-w-64"><slot></slot></span>
<ButtonSecondary
class="rounded close-button"
svg="x"

8
packages/hoppscotch-app/components/smart/Item.vue
View File

@@ -3,7 +3,7 @@
:to="`${/^\/(?!\/).*$/.test(to) ? localePath(to) : to}`"
:exact="exact"
:blank="blank"
class="rounded flex-shrink-0 py-2 px-4 transition inline-flex items-center hover:bg-primaryDark hover:text-secondaryDark focus:outline-none focus-visible:bg-primaryDark focus-visible:text-secondaryDark"
class="inline-flex items-center flex-shrink-0 px-4 py-2 transition rounded hover:bg-primaryDark hover:text-secondaryDark focus:outline-none focus-visible:bg-primaryDark focus-visible:text-secondaryDark"
:class="[
{ 'opacity-75 cursor-not-allowed': disabled },
{ 'pointer-events-none': loading },
@@ -44,7 +44,7 @@
</span>
<SmartSpinner v-else class="mr-4 text-secondaryDark" />
<div
class="flex-1 inline-flex items-start truncate"
class="inline-flex items-start flex-1 truncate"
:class="{ 'flex-col': description }"
>
<div class="font-semibold truncate">
@@ -56,7 +56,7 @@
</div>
<i
v-if="infoIcon"
class="ml-6 items-center self-center material-icons"
class="items-center self-center ml-6 material-icons"
:class="{ 'text-accent': activeInfoIcon }"
>
{{ infoIcon }}
@@ -65,7 +65,7 @@
<kbd
v-for="(key, index) in shortcut"
:key="`key-${index}`"
class="shortcut-key -mr-2"
class="-mr-2 shortcut-key"
>
{{ key }}
</kbd>

2
packages/hoppscotch-app/components/smart/LoadingIndicator.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="text-sm text-secondaryLight animate-pulse">
<AppLogo class="h-8 w-8" />
<AppLogo class="w-8 h-8" />
</div>
</template>

16
packages/hoppscotch-app/components/smart/Modal.vue
View File

@@ -2,14 +2,14 @@
<transition name="fade" appear @leave="onTransitionLeaveStart">
<div
ref="modal"
class="inset-0 transition z-10 z-50 fixed overflow-y-auto hide-scrollbar"
class="fixed inset-0 z-10 z-50 overflow-y-auto transition hide-scrollbar"
>
<div
class="flex min-h-screen text-center items-end justify-center sm:block"
class="flex items-end justify-center min-h-screen text-center sm:block"
>
<transition name="fade" appear>
<div
class="bg-primaryLight opacity-90 inset-0 transition fixed"
class="fixed inset-0 transition bg-primaryLight opacity-90"
@touchstart="!dialog ? close() : null"
@touchend="!dialog ? close() : null"
@mouseup="!dialog ? close() : null"
@@ -18,7 +18,7 @@
</transition>
<span
v-if="placement === 'center'"
class="hidden sm:h-screen sm:inline-block sm:align-middle"
class="sm:h-screen <sm:hidden sm:align-middle"
aria-hidden="true"
>&#8203;</span
>
@@ -32,7 +32,7 @@
leave-to-class="scale-95 translate-y-4"
>
<div
class="bg-primary shadow-lg text-left w-full transform transition-all inline-block overflow-hidden align-bottom sm:rounded-xl sm:align-middle"
class="inline-block w-full overflow-hidden text-left align-bottom transition-all transform shadow-lg bg-primary sm:rounded-xl sm:align-middle"
:class="[
{ 'mt-24 md:mb-8': placement === 'top' },
{ 'p-4': !fullWidth },
@@ -41,7 +41,7 @@
>
<div
v-if="title"
class="flex mb-4 pl-2 items-center justify-between"
class="flex items-center justify-between pl-2 mb-4"
>
<h3 class="heading">{{ title }}</h3>
<span class="flex">
@@ -54,14 +54,14 @@
</span>
</div>
<div
class="flex flex-col max-h-md overflow-y-auto hide-scrollbar"
class="flex flex-col overflow-y-auto max-h-md hide-scrollbar"
:class="{ 'py-2': !fullWidth }"
>
<slot name="body"></slot>
</div>
<div
v-if="hasFooterSlot"
class="flex flex-1 mt-4 p-2 items-center justify-between"
class="flex items-center justify-between flex-1 p-2 mt-4"
>
<slot name="footer"></slot>
</div>

4
packages/hoppscotch-app/components/smart/Radio.vue
View File

@@ -1,6 +1,6 @@
<template>
<div
class="cursor-pointer flex flex-nowrap transition flex-1 items-center group hover:text-secondaryDark"
class="flex items-center flex-1 transition cursor-pointer flex-nowrap group hover:text-secondaryDark"
@click="$emit('change', value)"
>
<span class="inline-flex mr-4">
@@ -9,7 +9,7 @@
</i>
<i v-else class="material-icons">radio_button_unchecked</i>
</span>
<span class="font-semibold inline-flex">{{ label }}</span>
<span class="inline-flex font-semibold">{{ label }}</span>
</div>
</template>

8
packages/hoppscotch-app/components/smart/Tabs.vue
View File

@@ -1,6 +1,6 @@
<template>
<div
class="flex flex-nowrap h-full flex-1"
class="flex flex-1 h-full flex-nowrap"
:class="{ 'flex-col h-auto': !vertical }"
>
<div
@@ -9,7 +9,7 @@
>
<div class="flex flex-1">
<div
class="flex flex-1 justify-between"
class="flex justify-between flex-1"
:class="{ 'flex-col': vertical }"
>
<div class="flex" :class="{ 'flex-col space-y-2 p-2': vertical }">
@@ -35,7 +35,7 @@
</span>
<span
v-if="tab.indicator"
class="bg-accentLight rounded-full h-1 ml-2 w-1"
class="w-1 h-1 ml-2 rounded-full bg-accentLight"
></span>
</button>
</div>
@@ -46,7 +46,7 @@
</div>
</div>
<div
class="h-full w-full contents"
class="w-full h-full contents"
:class="{
'!flex flex-col flex-1 overflow-y-auto hide-scrollbar': vertical,
}"

4
packages/hoppscotch-app/components/smart/Toggle.vue
View File

@@ -1,12 +1,12 @@
<template>
<div
class="cursor-pointer flex-nowrap transition inline-flex items-center justify-center group hover:text-secondaryDark"
class="inline-flex items-center justify-center transition cursor-pointer flex-nowrap group hover:text-secondaryDark"
@click="$emit('change')"
>
<span ref="toggle" class="toggle" :class="{ on: on }">
<span class="handle"></span>
</span>
<span class="cursor-pointer font-semibold pl-0 align-middle">
<span class="pl-0 font-semibold align-middle cursor-pointer">
<slot></slot>
</span>
</div>