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

fix: button icons

Browse Source
This commit is contained in:
Liyas Thomas
2021-07-05 12:56:00 +00:00
committed by GitHub
parent dc5a09bebc
commit 256d4b3e07
52 changed files with 463 additions and 759 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
components/realtime/Mqtt.vue
View File

@@ -15,19 +15,15 @@
</li>
<div>
<li>
<label for="connect" class="hide-on-small-screen">&nbsp;</label>
<ButtonSecondary
id="connect"
:disabled="!validUrl"
class="button rounded-b-lg md:rounded-bl-none md:rounded-br-lg"
:icon="!connectionState ? 'sync' : 'sync_disabled'"
:label="connectionState ? $t('disconnect') : $t('connect')"
reverse
@click.native="toggleConnection"
/>
{{ connectionState ? $t("disconnect") : $t("connect") }}
<span>
<i class="material-icons">{{
!connectionState ? "sync" : "sync_disabled"
}}</i>
</span>
</li>
</div>
</ul>
@@ -62,18 +58,15 @@
</li>
<div>
<li>
<label for="publish" class="hide-on-small-screen">&nbsp;</label>
<ButtonSecondary
id="publish"
class="button"
name="get"
:disabled="!canpublish"
icon="send"
:label="$t('mqtt_publish')"
@click.native="publish"
/>
{{ $t("mqtt_publish") }}
<span>
<i class="material-icons">send</i>
</span>
</li>
</div>
</ul>
@@ -90,22 +83,20 @@
</li>
<div>
<li>
<label for="subscribe" class="hide-on-small-screen">&nbsp;</label>
<ButtonSecondary
id="subscribe"
name="get"
:disabled="!cansubscribe"
class="button rounded-b-lg md:rounded-bl-none md:rounded-br-lg"
:icon="subscriptionState ? 'sync_disabled' : 'sync'"
:label="
subscriptionState
? $t('mqtt_unsubscribe')
: $t('mqtt_subscribe')
"
reverse
@click.native="toggleSubscription"
/>
{{
subscriptionState ? $t("mqtt_unsubscribe") : $t("mqtt_subscribe")
}}
<span>
<i class="material-icons">{{
subscriptionState ? "sync_disabled" : "sync"
}}</i>
</span>
</li>
</div>
</ul>

26
components/realtime/Socketio.vue
View File

@@ -28,20 +28,16 @@
</div>
<div>
<li>
<label for="connect" class="hide-on-small-screen">&nbsp;</label>
<ButtonSecondary
id="connect"
:disabled="!urlValid"
name="connect"
class="button rounded-b-lg md:rounded-bl-none md:rounded-br-lg"
:icon="!connectionState ? 'sync' : 'sync_disabled'"
:label="!connectionState ? $t('connect') : $t('disconnect')"
reverse
@click.native="toggleConnection"
/>
{{ !connectionState ? $t("connect") : $t("disconnect") }}
<span>
<i class="material-icons">
{{ !connectionState ? "sync" : "sync_disabled" }}
</i>
</span>
</li>
</div>
</ul>
@@ -101,9 +97,9 @@
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('delete')"
icon="delete"
@click.native="removeCommunicationInput({ index })"
/>
<i class="material-icons">delete</i>
</li>
</div>
<div v-if="index + 1 === communication.inputs.length">
@@ -113,20 +109,20 @@
class="button"
name="send"
:disabled="!connectionState"
icon="send"
:label="$t('send')"
@click.native="sendMessage"
/>
{{ $t("send") }}
<span>
<i class="material-icons">send</i>
</span>
</li>
</div>
</ul>
<ul>
<li>
<ButtonSecondary @click.native="addCommunicationInput" />
<i class="material-icons">add</i>
<span>{{ $t("add_new") }}</span>
<ButtonSecondary
icon="add"
:label="$t('add_new')"
@click.native="addCommunicationInput"
/>
</li>
</ul>
</AppSection>

10
components/realtime/Sse.vue
View File

@@ -16,20 +16,16 @@
</li>
<div>
<li>
<label for="start" class="hide-on-small-screen">&nbsp;</label>
<ButtonSecondary
id="start"
:disabled="!serverValid"
name="start"
class="button rounded-b-lg md:rounded-bl-none md:rounded-br-lg"
:icon="!connectionSSEState ? $t('start') : $t('stop')"
:label="!connectionSSEState ? 'sync' : 'sync_disabled'"
reverse
@click.native="toggleSSEConnection"
/>
{{ !connectionSSEState ? $t("start") : $t("stop") }}
<span>
<i class="material-icons">
{{ !connectionSSEState ? "sync" : "sync_disabled" }}
</i>
</span>
</li>
</div>
</ul>

27
components/realtime/Websocket.vue
View File

@@ -17,20 +17,16 @@
</li>
<div>
<li>
<label for="connect" class="hide-on-small-screen">&nbsp;</label>
<ButtonSecondary
id="connect"
:disabled="!urlValid"
class="button"
name="connect"
:icon="!connectionState ? 'sync' : 'sync_disabled'"
:label="!connectionState ? $t('connect') : $t('disconnect')"
reverse
@click.native="toggleConnection"
/>
{{ !connectionState ? $t("connect") : $t("disconnect") }}
<span>
<i class="material-icons">
{{ !connectionState ? "sync" : "sync_disabled" }}
</i>
</span>
</li>
</div>
</ul>
@@ -96,17 +92,19 @@
<ButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="$t('delete')"
icon="delete"
@click.native="deleteProtocol({ index })"
/>
<i class="material-icons">delete</i>
</li>
</div>
</ul>
<ul>
<li>
<ButtonSecondary @click.native="addProtocol" />
<i class="material-icons">add</i>
<span>{{ $t("add_new") }}</span>
<ButtonSecondary
icon="add"
:label="$t('add_new')"
@click.native="addProtocol"
/>
</li>
</ul>
</AppSection>
@@ -134,18 +132,15 @@
</li>
<div>
<li>
<label for="send" class="hide-on-small-screen">&nbsp;</label>
<ButtonSecondary
id="send"
name="send"
:disabled="!connectionState"
class="button rounded-b-lg md:rounded-bl-none md:rounded-br-lg"
icon="send"
:label="$t('send')"
@click.native="sendMessage"
/>
{{ $t("send") }}
<span>
<i class="material-icons">send</i>
</span>
</li>
</div>
</ul>