🎨 Updated status color codes

This commit is contained in:
Liyas Thomas
2019-08-26 14:37:02 +05:30
parent 997c095f35
commit e1889c1db0
2 changed files with 11 additions and 18 deletions

View File

@@ -262,21 +262,21 @@ ol li {
}
.info-response {
background-color: #ffeb3b;
background-color: #FFEB3B;
}
.success-response {
background-color: #66BB6A;
background-color: #4BB543;
}
.redir-response {
background-color: #ff5722;
background-color: #FF5722;
}
.cl-error-response {
background-color: #ef5350;
background-color: #A63232;
}
.sv-error-response {
background-color: #b71c1c;
background-color: #B71C1C;
}

View File

@@ -7,9 +7,9 @@
<label for="url">URL</label>
<input id="url" type="url" :class="{ error: !urlValid }" v-model="url" @keyup.enter="toggleConnection">
</li>
<li class="no-grow">
<li>
<label>&nbsp;</label>
<button class="action" :class="{ disabled: !urlValid }" name="action" @click="toggleConnection">{{ toggleConnectionVerb }}</button>
<button :class="{ disabled: !urlValid }" name="action" @click="toggleConnection">{{ toggleConnectionVerb }}</button>
</li>
</ul>
</pw-section>
@@ -18,7 +18,7 @@
<ul>
<li>
<label for="log">Log</label>
<div id="log" name="log" class="log" readonly>
<div id="log" name="log" class="log">
<span v-if="communication.log">
<span v-for="logEntry in communication.log" :style="{ color: logEntry.color }">{{ getSourcePrefix(logEntry.source) }} {{ logEntry.payload }}</span>
</span>
@@ -33,9 +33,9 @@
<input id="message" name="message" type="text" v-model="communication.input" :readonly="!connectionState" @keyup.enter="sendMessage">
</li>
<li class="no-grow">
<li>
<label>&nbsp;</label>
<button class="action" name="send" :class="{ disabled: !connectionState }" @click="sendMessage">Send</button>
<button name="send" :class="{ disabled: !connectionState }" @click="sendMessage">Send</button>
</li>
</ul>
</pw-section>
@@ -44,13 +44,6 @@
</template>
<style lang="scss">
.no-grow { flex-grow: 0; }
.action {
padding-left: 30px;
padding-right: 30px;
width: 150px;
}
div.log {
margin: 4px;
padding: 8px 16px;
@@ -58,7 +51,7 @@
border-radius: 4px;
background-color: var(--bg-dark-color);
color: var(--fg-color);
height: 300px;
height: 256px;
overflow: auto;
&, span {