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

chore: hoppscotch-ui improvements (#3497)

Browse Source 
Co-authored-by: Liyas Thomas <liyascthomas@gmail.com>
Co-authored-by: Andrew Bastin <andrewbastin.k@gmail.com>
This commit is contained in:
Anwarul Islam
2023-12-06 00:38:44 +06:00
committed by GitHub
parent 18864bfecf
commit 6fa722df7b
69 changed files with 726 additions and 640 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
packages/hoppscotch-common/src/components/environments/Add.vue
View File

@@ -7,7 +7,7 @@
<template #body>
<div class="flex flex-1 flex-col space-y-4">
<div class="ml-2 flex items-center space-x-8">
<label for="name" class="min-w-10 font-semibold">{{
<label for="name" class="min-w-[2.5rem] font-semibold">{{
t("environment.name")
}}</label>
<input
@@ -18,7 +18,7 @@
/>
</div>
<div class="ml-2 flex items-center space-x-8">
<label for="value" class="min-w-10 font-semibold">{{
<label for="value" class="min-w-[2.5rem] font-semibold">{{
t("environment.value")
}}</label>
<input
@@ -29,7 +29,7 @@
/>
</div>
<div class="ml-2 flex items-center space-x-8">
<label for="scope" class="min-w-10 font-semibold">
<label for="scope" class="min-w-[2.5rem] font-semibold">
{{ t("environment.scope") }}
</label>
<div
@@ -39,7 +39,7 @@
</div>
</div>
<div v-if="replaceWithVariable" class="mt-3 flex space-x-2">
<div class="min-w-18" />
<div class="min-w-[4rem]" />
<HoppSmartCheckbox
:on="replaceWithVariable"
:title="t('environment.replace_with_variable')"

29
packages/hoppscotch-common/src/components/environments/Selector.vue
View File

@@ -6,10 +6,9 @@
theme="popover"
:on-shown="() => envSelectorActions!.focus()"
>
<span
<HoppSmartSelectWrapper
v-tippy="{ theme: 'tooltip' }"
:title="`${t('environment.select')}`"
class="select-wrapper"
>
<HoppButtonSecondary
:icon="IconLayers"
@@ -22,7 +21,7 @@
"
class="flex-1 !justify-start rounded-none pr-8"
/>
</span>
</HoppSmartSelectWrapper>
<template #content="{ hide }">
<div
ref="envSelectorActions"
@@ -207,10 +206,14 @@
</div>
<div class="my-2 flex flex-1 flex-col space-y-2 pl-4 pr-2">
<div class="flex flex-1 space-x-4">
<span class="min-w-32 w-1/4 truncate text-tiny font-semibold">
<span
class="min-w-[9rem] w-1/4 truncate text-tiny font-semibold"
>
{{ t("environment.name") }}
</span>
<span class="min-w-32 w-full truncate text-tiny font-semibold">
<span
class="min-w-[9rem] w-full truncate text-tiny font-semibold"
>
{{ t("environment.value") }}
</span>
</div>
@@ -219,10 +222,10 @@
:key="index"
class="flex flex-1 space-x-4"
>
<span class="min-w-32 w-1/4 truncate text-secondaryLight">
<span class="min-w-[9rem] w-1/4 truncate text-secondaryLight">
{{ variable.key }}
</span>
<span class="min-w-32 w-full truncate text-secondaryLight">
<span class="min-w-[9rem] w-full truncate text-secondaryLight">
{{ variable.value }}
</span>
</div>
@@ -258,10 +261,14 @@
</div>
<div v-else class="my-2 flex flex-1 flex-col space-y-2 pl-4 pr-2">
<div class="flex flex-1 space-x-4">
<span class="min-w-32 w-1/4 truncate text-tiny font-semibold">
<span
class="min-w-[9rem] w-1/4 truncate text-tiny font-semibold"
>
{{ t("environment.name") }}
</span>
<span class="min-w-32 w-full truncate text-tiny font-semibold">
<span
class="min-w-[9rem] w-full truncate text-tiny font-semibold"
>
{{ t("environment.value") }}
</span>
</div>
@@ -270,10 +277,10 @@
:key="index"
class="flex flex-1 space-x-4"
>
<span class="min-w-32 w-1/4 truncate text-secondaryLight">
<span class="min-w-[9rem] w-1/4 truncate text-secondaryLight">
{{ variable.key }}
</span>
<span class="min-w-32 w-full truncate text-secondaryLight">
<span class="min-w-[9rem] w-full truncate text-secondaryLight">
{{ variable.value }}
</span>
</div>