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

💄 Icon buttons

Browse Source
This commit is contained in:
Liyas Thomas
2019-09-12 16:39:59 +05:30
parent a7b70cc947
commit 5960aea37a
2 changed files with 60 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
components/history.vue
View File

@@ -51,9 +51,7 @@
</ul> </ul>
<ul> <ul>
<li v-if="!isClearingHistory"> <li v-if="!isClearingHistory">
<button id="clear-history-button" :disabled="history.length === 0" @click="enableHistoryClearing"> <button id="clear-history-button" :disabled="history.length === 0" @click="enableHistoryClearing">Clear all</button>
Clear all
</button>
</li> </li>
<li v-else> <li v-else>
<div class="flex-wrap"> <div class="flex-wrap">

38
pages/index.vue
View File

@@ -61,6 +61,7 @@
<label for="path">Path</label> <label for="path">Path</label>
<input @keyup.enter="isValidURL ? sendRequest() : null" id="path" v-model="path"> <input @keyup.enter="isValidURL ? sendRequest() : null" id="path" v-model="path">
</li> </li>
<div class="show-on-small-screen">
<li> <li>
<label class="hide-on-small-screen" for="copyRequest">&nbsp;</label> <label class="hide-on-small-screen" for="copyRequest">&nbsp;</label>
<button class="icon" @click="copyRequest" id="copyRequest" ref="copyRequest" :disabled="!isValidURL"> <button class="icon" @click="copyRequest" id="copyRequest" ref="copyRequest" :disabled="!isValidURL">
@@ -82,6 +83,7 @@
<span>{{ isHidden ? 'Show Code' : 'Hide Code' }}</span> <span>{{ isHidden ? 'Show Code' : 'Hide Code' }}</span>
</button> </button>
</li> </li>
</div>
<li> <li>
<label class="hide-on-small-screen" for="action">&nbsp;</label> <label class="hide-on-small-screen" for="action">&nbsp;</label>
<button :disabled="!isValidURL" @click="sendRequest" class="show" id="action" name="action" ref="sendButton"> <button :disabled="!isValidURL" @click="sendRequest" class="show" id="action" name="action" ref="sendButton">
@@ -145,21 +147,27 @@
<label :for="'bvalue'+index">Value {{index + 1}}</label> <label :for="'bvalue'+index">Value {{index + 1}}</label>
<input :name="'bvalue'+index" v-model="param.value" @keyup.prevent="setRouteQueryState"> <input :name="'bvalue'+index" v-model="param.value" @keyup.prevent="setRouteQueryState">
</li> </li>
<div>
<li> <li>
<label class="hide-on-small-screen" for="request">&nbsp;</label> <label class="hide-on-small-screen" for="request">&nbsp;</label>
<button @click="removeRequestBodyParam(index)" name="request">Remove</button> <button class="icon" @click="removeRequestBodyParam(index)" name="request">
<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd">
<path d="M5.662 23l-5.369-5.365c-.195-.195-.293-.45-.293-.707 0-.256.098-.512.293-.707l14.929-14.928c.195-.194.451-.293.707-.293.255 0 .512.099.707.293l7.071 7.073c.196.195.293.451.293.708 0 .256-.097.511-.293.707l-11.216 11.219h5.514v2h-12.343zm3.657-2l-5.486-5.486-1.419 1.414 4.076 4.072h2.829zm6.605-17.581l-10.677 10.68 5.658 5.659 10.676-10.682-5.657-5.657z" />
</svg>
</button>
</li> </li>
</div>
</ol> </ol>
<ul> <ul>
<li> <li>
<label for="addrequest">Action</label> <label for="addrequest">Action</label>
<button @click="addRequestBodyParam" name="addrequest">Add</button> <button @click="addRequestBodyParam" name="addrequest">Add New</button>
</li> </li>
</ul> </ul>
<ul> <ul>
<li> <li>
<label for="request">Parameter List</label> <label for="request">Parameter List</label>
<textarea name="request" readonly v-textarea-auto-height="rawRequestBody" v-model="rawRequestBody" placeholder="(add at least one parameter)"></textarea> <textarea name="request" readonly v-textarea-auto-height="rawRequestBody" v-model="rawRequestBody" placeholder="(add at least one parameter)" rows="1"></textarea>
</li> </li>
</ul> </ul>
</div> </div>
@@ -249,20 +257,26 @@
<label :for="'value'+index">Value {{index + 1}}</label> <label :for="'value'+index">Value {{index + 1}}</label>
<input :name="'value'+index" v-model="header.value" @keyup.prevent="setRouteQueryState"> <input :name="'value'+index" v-model="header.value" @keyup.prevent="setRouteQueryState">
</li> </li>
<div>
<li> <li>
<label class="hide-on-small-screen" for="header">&nbsp;</label> <label class="hide-on-small-screen" for="header">&nbsp;</label>
<button @click="removeRequestHeader(index)" name="header">Remove</button> <button class="icon" @click="removeRequestHeader(index)" name="header">
<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd">
<path d="M5.662 23l-5.369-5.365c-.195-.195-.293-.45-.293-.707 0-.256.098-.512.293-.707l14.929-14.928c.195-.194.451-.293.707-.293.255 0 .512.099.707.293l7.071 7.073c.196.195.293.451.293.708 0 .256-.097.511-.293.707l-11.216 11.219h5.514v2h-12.343zm3.657-2l-5.486-5.486-1.419 1.414 4.076 4.072h2.829zm6.605-17.581l-10.677 10.68 5.658 5.659 10.676-10.682-5.657-5.657z" />
</svg>
</button>
</li> </li>
</div>
</ol> </ol>
<ul> <ul>
<li> <li>
<button @click="addRequestHeader" name="add">Add</button> <button @click="addRequestHeader" name="add">Add New</button>
</li> </li>
</ul> </ul>
<ul> <ul>
<li> <li>
<label for="request">Header List</label> <label for="request">Header List</label>
<textarea name="request" readonly v-textarea-auto-height="headerString" v-model="headerString" placeholder="(add at least one header)"></textarea> <textarea name="request" readonly v-textarea-auto-height="headerString" v-model="headerString" placeholder="(add at least one header)" rows="1"></textarea>
</li> </li>
</ul> </ul>
</pw-section> </pw-section>
@@ -276,20 +290,26 @@
<label :for="'value'+index">Value {{index + 1}}</label> <label :for="'value'+index">Value {{index + 1}}</label>
<input :name="'value'+index" v-model="param.value"> <input :name="'value'+index" v-model="param.value">
</li> </li>
<div>
<li> <li>
<label class="hide-on-small-screen" for="param">&nbsp;</label> <label class="hide-on-small-screen" for="param">&nbsp;</label>
<button @click="removeRequestParam(index)" name="param">Remove</button> <button class="icon" @click="removeRequestParam(index)" name="param">
<svg width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd">
<path d="M5.662 23l-5.369-5.365c-.195-.195-.293-.45-.293-.707 0-.256.098-.512.293-.707l14.929-14.928c.195-.194.451-.293.707-.293.255 0 .512.099.707.293l7.071 7.073c.196.195.293.451.293.708 0 .256-.097.511-.293.707l-11.216 11.219h5.514v2h-12.343zm3.657-2l-5.486-5.486-1.419 1.414 4.076 4.072h2.829zm6.605-17.581l-10.677 10.68 5.658 5.659 10.676-10.682-5.657-5.657z" />
</svg>
</button>
</li> </li>
</div>
</ol> </ol>
<ul> <ul>
<li> <li>
<button @click="addRequestParam" name="add">Add</button> <button @click="addRequestParam" name="add">Add New</button>
</li> </li>
</ul> </ul>
<ul> <ul>
<li> <li>
<label for="request">Parameter List</label> <label for="request">Parameter List</label>
<textarea name="request" readonly v-textarea-auto-height="queryString" v-model="queryString" placeholder="(add at least one parameter)"></textarea> <textarea name="request" readonly v-textarea-auto-height="queryString" v-model="queryString" placeholder="(add at least one parameter)" rows="1"></textarea>
</li> </li>
</ul> </ul>
</pw-section> </pw-section>