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

refactor: sort windi class names

Browse Source
This commit is contained in:
liyasthomas
2021-11-23 08:47:09 +05:30
parent 4c5ca1b31d
commit fdf12a24ed
89 changed files with 1025 additions and 860 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

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

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

@@ -4,16 +4,16 @@
:exact="exact"
:blank="blank"
class="
rounded
transition
flex-shrink-0
py-2
px-4
inline-flex
items-center
hover:bg-primaryDark hover:text-secondaryDark
focus:outline-none
focus-visible:bg-primaryDark focus-visible:text-secondaryDark
inline-flex
items-center
flex-shrink-0
px-4
py-2
transition
rounded
"
:class="[
{ 'opacity-75 cursor-not-allowed': disabled },
@@ -55,10 +55,10 @@
</span>
<SmartSpinner v-else class="mr-4 text-secondaryDark" />
<div
class="flex-1 inline-flex truncate items-start"
class="inline-flex items-start flex-1 truncate"
:class="{ 'flex-col': description }"
>
<div class="truncate font-semibold">
<div class="font-semibold truncate">
{{ label }}
</div>
<p
@@ -70,7 +70,7 @@
</div>
<i
v-if="infoIcon"
class="ml-6 self-center material-icons items-center"
class="items-center self-center ml-6 material-icons"
:class="{ 'text-accent': activeInfoIcon }"
>
{{ infoIcon }}

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>

36
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 hide-scrollbar overflow-y-auto"
class="fixed inset-0 z-10 z-50 overflow-y-auto hide-scrollbar transition"
>
<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 bg-primaryLight opacity-90 transition"
@touchstart="!dialog ? close() : null"
@touchend="!dialog ? close() : null"
@mouseup="!dialog ? close() : null"
@@ -25,24 +25,24 @@
<transition
appear
enter-active-class="transition"
enter-class="translate-y-4 scale-95"
enter-to-class="translate-y-0 scale-100"
enter-class="scale-95 translate-y-4"
enter-to-class="scale-100 translate-y-0"
leave-active-class="transition"
leave-class="translate-y-0 scale-100"
leave-to-class="translate-y-4 scale-95"
leave-class="scale-100 translate-y-0"
leave-to-class="scale-95 translate-y-4"
>
<div
class="
bg-primary
shadow-lg
text-left
w-full
transform
transition-all
inline-block
align-bottom
overflow-hidden
sm:align-middle sm:rounded-xl
inline-block
w-full
overflow-hidden
text-left
align-bottom
transition-all
transform
shadow-lg
"
:class="[
{ 'mt-24 md:mb-8': placement === 'top' },
@@ -52,7 +52,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">
@@ -66,14 +66,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>

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

@@ -1,15 +1,15 @@
<template>
<div
class="flex flex-nowrap flex-1 h-full"
class="flex flex-1 h-full flex-nowrap"
:class="{ 'flex-col h-auto': !vertical }"
>
<div
class="tabs hide-scrollbar relative"
class="relative tabs hide-scrollbar"
:class="[{ 'border-r border-dividerLight': vertical }, styles]"
>
<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,18 +35,18 @@
</span>
<span
v-if="tab.indicator"
class="bg-accentLight h-1 w-1 ml-2 rounded-full"
class="w-1 h-1 ml-2 rounded-full bg-accentLight"
></span>
</button>
</div>
<div class="flex justify-center items-center">
<div class="flex items-center justify-center">
<slot name="actions"></slot>
</div>
</div>
</div>
</div>
<div
class="contents h-full w-full"
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 inline-flex items-center justify-center"
class="inline-flex items-center justify-center cursor-pointer flex-nowrap"
@click="$emit('change')"
>
<label ref="toggle" class="toggle" :class="{ on: on }">
<span class="handle"></span>
</label>
<label class="cursor-pointer pl-0 align-middle font-semibold">
<label class="pl-0 font-semibold align-middle cursor-pointer">
<slot></slot>
</label>
</div>