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

refactor(ui): better font weight, icon hover states, etc

Browse Source
This commit is contained in:
liyasthomas
2021-08-13 16:44:02 +05:30
parent 08e3cffff8
commit 11816111ea
94 changed files with 547 additions and 514 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
components/realtime/Log.vue
View File

@@ -13,7 +13,9 @@
justify-between
"
>
<label for="log" class="font-semibold py-2">{{ title }}</label>
<label for="log" class="font-semibold text-secondaryLight py-2">
{{ title }}
</label>
</div>
<div ref="log" name="log" class="realtime-log">
<span v-if="log" class="space-y-2">
@@ -65,7 +67,6 @@ export default {
&,
span {
@apply font-mono font-semibold;
@apply select-text;
}

7
components/realtime/Mqtt.vue
View File

@@ -16,7 +16,6 @@
bg-primaryLight
border border-divider
rounded-l
font-semibold font-mono
text-secondaryDark
w-full
py-2
@@ -56,7 +55,7 @@
>
<AppSection label="messages">
<div class="flex flex-col flex-1 p-4 inline-flex">
<label for="pub_topic" class="font-semibold">
<label for="pub_topic" class="font-semibold text-secondaryLight">
{{ $t("mqtt.topic") }}
</label>
</div>
@@ -71,7 +70,7 @@
/>
</div>
<div class="flex flex-1 p-4 items-center justify-between">
<label for="mqtt-message" class="font-semibold">{{
<label for="mqtt-message" class="font-semibold text-secondaryLight">{{
$t("communication")
}}</label>
</div>
@@ -102,7 +101,7 @@
inline-flex
"
>
<label for="sub_topic" class="font-semibold">{{
<label for="sub_topic" class="font-semibold text-secondaryLight">{{
$t("mqtt.topic")
}}</label>
</div>

14
components/realtime/Socketio.vue
View File

@@ -17,9 +17,7 @@
bg-primaryLight
border border-divider
rounded-l
flex
font-semibold font-mono
flex-1
flex flex-1
text-secondaryDark
w-full
py-2
@@ -38,9 +36,7 @@
class="
bg-primaryLight
border border-divider
flex
font-semibold font-mono
flex-1
flex flex-1
text-secondaryDark
w-full
py-2
@@ -81,7 +77,7 @@
>
<AppSection label="messages">
<div class="flex flex-col flex-1 p-4 inline-flex">
<label for="events" class="font-semibold">
<label for="events" class="font-semibold text-secondaryLight">
{{ $t("events") }}
</label>
</div>
@@ -97,7 +93,9 @@
/>
</div>
<div class="flex flex-1 p-4 items-center justify-between">
<label class="font-semibold">{{ $t("communication") }}</label>
<label class="font-semibold text-secondaryLight">{{
$t("communication")
}}</label>
<div class="flex">
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"

18
components/realtime/Sse.vue
View File

@@ -13,9 +13,7 @@
bg-primaryLight
border border-divider
rounded-l
flex
font-semibold font-mono
flex-1
flex flex-1
text-secondaryDark
w-full
py-2
@@ -30,7 +28,15 @@
/>
<label
for="url"
class="bg-primaryLight border border-divider py-2 px-4 truncate"
class="
bg-primaryLight
border-t border-b border-divider
font-semibold
text-secondaryLight
py-2
px-4
truncate
"
>
{{ $t("event_type") }}
</label>
@@ -40,9 +46,7 @@
class="
bg-primaryLight
border border-divider
flex
font-semibold font-mono
flex-1
flex flex-1
text-secondaryDark
w-full
py-2

12
components/realtime/Websocket.vue
View File

@@ -14,7 +14,6 @@
bg-primaryLight
border border-divider
rounded-l
font-semibold font-mono
text-secondaryDark
w-full
py-2
@@ -54,7 +53,7 @@
justify-between
"
>
<label class="font-semibold">
<label class="font-semibold text-secondaryLight">
{{ $t("websocket.protocols") }}
</label>
<div class="flex">
@@ -86,9 +85,7 @@
v-model="protocol.value"
class="
bg-primaryLight
flex
font-semibold font-mono
flex-1
flex flex-1
py-2
px-4
truncate
@@ -166,7 +163,10 @@
>
<AppSection label="messages">
<div class="flex flex-col flex-1 p-4 inline-flex">
<label for="websocket-message" class="font-semibold">
<label
for="websocket-message"
class="font-semibold text-secondaryLight"
>
{{ $t("communication") }}
</label>
</div>