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

refactor: lint + minor ui fixes

Browse Source
This commit is contained in:
liyasthomas
2021-11-27 19:59:28 +05:30
parent da8c446ad7
commit 0bf856291c
68 changed files with 363 additions and 1691 deletions
Download Patch File Download Diff File Expand all files Collapse all files

70
packages/hoppscotch-app/pages/documentation.vue
View File

@@ -9,37 +9,23 @@
>
<Pane size="75" min-size="65" class="hide-scrollbar !overflow-auto">
<Splitpanes class="smart-splitter" :horizontal="COLUMN_LAYOUT">
<Pane class="hide-scrollbar !overflow-auto">
<Pane
:size="COLUMN_LAYOUT ? 45 : 50"
class="hide-scrollbar !overflow-auto"
>
<AppSection label="import">
<div class="flex items-start justify-between p-4">
<label>
{{ $t("documentation.generate_message") }}
</label>
<span
class="
bg-accentDark
text-accentContrast
inline-flex
px-2
py-1
rounded
"
class="bg-accentDark text-accentContrast inline-flex px-2 py-1 rounded"
>
BETA
</span>
</div>
<div
class="
bg-primary
border-dividerLight
sticky
top-0
z-10
flex
items-start
justify-between
border-b
"
class="bg-primary border-dividerLight sticky top-0 z-10 flex items-start justify-between border-b"
>
<label for="collectionUpload">
<ButtonSecondary
@@ -68,24 +54,12 @@
<textarea-autosize
id="import-curl"
v-model="collectionJSON"
class="p-4 font-mono bg-primary"
class="bg-primary p-4 font-mono"
autofocus
rows="8"
/>
<div
class="
border-t
bg-primary
border-dividerLight
sticky
bottom-0
z-10
flex
items-start
justify-between
p-4
border-b
"
class="bg-primary border-dividerLight sticky bottom-0 z-10 flex items-start justify-between p-4 border-t border-b"
>
<ButtonPrimary
:label="$t('documentation.generate')"
@@ -94,38 +68,24 @@
</div>
</AppSection>
</Pane>
<Pane class="hide-scrollbar !overflow-auto">
<Pane
:size="COLUMN_LAYOUT ? 65 : 50"
class="hide-scrollbar !overflow-auto"
>
<AppSection label="documentation">
<div class="flex flex-col">
<div
v-if="items.length === 0"
class="
flex
text-secondaryLight
flex-col
items-center
justify-center
p-4
"
class="text-secondaryLight flex flex-col items-center justify-center p-4"
>
<i class="pb-2 opacity-75 material-icons">topic</i>
<i class="material-icons pb-2 opacity-75">topic</i>
<span class="text-center">
{{ $t("helpers.generate_documentation_first") }}
</span>
</div>
<div
v-else
class="
flex
bg-primary
border-dividerLight
sticky
top-0
z-10
flex-1
p-4
border-b
"
class="bg-primary border-dividerLight sticky top-0 z-10 flex flex-1 p-4 border-b"
>
<span
v-tippy="{ theme: 'tooltip' }"

10
packages/hoppscotch-app/pages/graphql.vue
View File

@@ -9,11 +9,17 @@
>
<Pane size="75" min-size="65" class="hide-scrollbar !overflow-auto">
<Splitpanes class="smart-splitter" :horizontal="COLUMN_LAYOUT">
<Pane class="hide-scrollbar !overflow-auto">
<Pane
:size="COLUMN_LAYOUT ? 45 : 50"
class="hide-scrollbar !overflow-auto"
>
<GraphqlRequest :conn="gqlConn" />
<GraphqlRequestOptions :conn="gqlConn" />
</Pane>
<Pane class="hide-scrollbar !overflow-auto">
<Pane
:size="COLUMN_LAYOUT ? 65 : 50"
class="hide-scrollbar !overflow-auto"
>
<GraphqlResponse :conn="gqlConn" />
</Pane>
</Splitpanes>

10
packages/hoppscotch-app/pages/index.vue
View File

@@ -9,7 +9,10 @@
>
<Pane size="75" min-size="65" class="hide-scrollbar !overflow-auto">
<Splitpanes class="smart-splitter" :horizontal="COLUMN_LAYOUT">
<Pane class="hide-scrollbar !overflow-auto">
<Pane
:size="COLUMN_LAYOUT ? 45 : 50"
class="hide-scrollbar !overflow-auto"
>
<HttpRequest />
<SmartTabs styles="sticky bg-primary top-upperPrimaryStickyFold z-10">
<SmartTab
@@ -52,7 +55,10 @@
</SmartTab>
</SmartTabs>
</Pane>
<Pane class="hide-scrollbar !overflow-auto flex flex-col">
<Pane
:size="COLUMN_LAYOUT ? 65 : 50"
class="hide-scrollbar !overflow-auto flex flex-col"
>
<HttpResponse ref="response" />
</Pane>
</Splitpanes>

21
packages/hoppscotch-app/pages/join-team.vue
View File

@@ -4,8 +4,8 @@
v-if="invalidLink"
class="flex flex-col items-center justify-center flex-1"
>
<i class="pb-2 opacity-75 material-icons">error_outline</i>
<h1 class="text-center heading">
<i class="material-icons pb-2 opacity-75">error_outline</i>
<h1 class="heading text-center">
{{ $t("team.invalid_invite_link") }}
</h1>
<p class="mt-2 text-center">
@@ -42,21 +42,12 @@
v-if="!inviteDetails.loading && E.isLeft(inviteDetails.data)"
class="flex flex-col items-center p-4"
>
<i class="mb-4 material-icons">error_outline</i>
<i class="material-icons mb-4">error_outline</i>
<p>
{{ getErrorMessage(inviteDetails.data.left) }}
</p>
<p
class="
flex
border-dividerLight
flex-col
items-center
p-4
mt-8
border
rounded
"
class="border-dividerLight flex flex-col items-center p-4 mt-8 border rounded"
>
<span class="mb-4">
{{ $t("team.logout_and_try_again") }}
@@ -84,7 +75,7 @@
})
}}
</h1>
<p class="mt-2 text-secondaryLight">
<p class="text-secondaryLight mt-2">
{{
$t("team.invited_to_team", {
owner:
@@ -121,7 +112,7 @@
})
}}
</h1>
<p class="mt-2 text-secondaryLight">
<p class="text-secondaryLight mt-2">
{{
$t("team.joined_team_description", {
team: inviteDetails.data.right.teamInvitation.team.name,

34
packages/hoppscotch-app/pages/profile.vue
View File

@@ -9,18 +9,10 @@
<img
:src="`/images/states/${$colorMode.value}/login.svg`"
loading="lazy"
class="
object-contain
inline-flex
flex-col
object-center
w-24
h-24
my-4
"
class="inline-flex flex-col object-contain object-center w-24 h-24 my-4"
:alt="`${t('empty.parameters')}`"
/>
<p class="pb-4 text-center text-secondaryLight">
<p class="text-secondaryLight pb-4 text-center">
{{ t("empty.profile") }}
</p>
<ButtonPrimary
@@ -31,15 +23,15 @@
</div>
<div v-else class="space-y-8">
<div
class="h-24 rounded bg-primaryLight md:h-32 -mb-11"
class="bg-primaryLight md:h-32 -mb-11 h-24 rounded"
style="background-image: url('/images/cover.svg')"
></div>
<div class="flex flex-col justify-between px-4 md:flex-row space-y-8">
<div class="md:flex-row flex flex-col justify-between px-4 space-y-8">
<div class="flex items-end">
<img
v-if="currentUser.photoURL"
:src="currentUser.photoURL"
class="w-16 h-16 rounded-lg ring-4 ring-primary"
class="ring-4 ring-primary w-16 h-16 rounded-lg"
:alt="currentUser.displayName"
/>
<SmartIcon v-else name="user" class="svg-icons" />
@@ -47,12 +39,12 @@
<label class="heading">
{{ currentUser.displayName || t("state.nothing_found") }}
</label>
<p class="flex items-center text-secondaryLight">
<p class="text-secondaryLight flex items-center">
{{ currentUser.email }}
<SmartIcon
v-if="currentUser.emailVerified"
name="verified"
class="ml-2 text-green-500 svg-icons"
class="svg-icons ml-2 text-green-500"
/>
</p>
</div>
@@ -76,10 +68,10 @@
:selected="true"
>
<section class="p-4">
<h4 class="font-semibold text-secondaryDark">
<h4 class="text-secondaryDark font-semibold">
{{ t("settings.profile") }}
</h4>
<div class="mt-1 text-secondaryLight">
<div class="text-secondaryLight mt-1">
{{ t("settings.profile_description") }}
</div>
<div class="py-4">
@@ -87,7 +79,7 @@
{{ t("settings.profile_name") }}
</label>
<form
class="flex mt-2 md:max-w-sm"
class="md:max-w-sm flex mt-2"
@submit.prevent="updateDisplayName"
>
<input
@@ -101,7 +93,7 @@
/>
<ButtonPrimary
:label="t('action.save')"
class="ml-2 min-w-16"
class="min-w-16 ml-2"
type="submit"
:loading="updatingDisplayName"
/>
@@ -109,10 +101,10 @@
</div>
</section>
<section class="p-4">
<h4 class="font-semibold text-secondaryDark">
<h4 class="text-secondaryDark font-semibold">
{{ t("settings.sync") }}
</h4>
<div class="mt-1 text-secondaryLight">
<div class="text-secondaryLight mt-1">
{{ t("settings.sync_description") }}
</div>
<div class="py-4 space-y-4">