Align button icons
- Fixes button icon and text alignment
- App header buttons to be addressed separately
- Button documentation will be addressed in separate commit
- Aligns form input buttons: datepicker, clear search, and password toggle
- Moves title from icon to button for icon only buttons
- Aligns validation icon with form input buttons
Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: Ie28d7d7dd7303ab6bf1897d1fa569e1580cc2f9d
diff --git a/src/views/Control/Kvm/Kvm.vue b/src/views/Control/Kvm/Kvm.vue
index 10322bd..1a41baa 100644
--- a/src/views/Control/Kvm/Kvm.vue
+++ b/src/views/Control/Kvm/Kvm.vue
@@ -18,13 +18,6 @@
</script>
<style scoped>
-.button-launch > svg {
- height: 25px;
-}
-.button-launch {
- padding-left: 0px;
-}
-
.terminal-container {
width: 100%;
}
diff --git a/src/views/Control/Kvm/KvmConsole.vue b/src/views/Control/Kvm/KvmConsole.vue
index 43dc727..0c545d0 100644
--- a/src/views/Control/Kvm/KvmConsole.vue
+++ b/src/views/Control/Kvm/KvmConsole.vue
@@ -14,28 +14,24 @@
</dl>
</b-col>
- <b-col class="d-flex justify-content-end">
+ <b-col class="d-flex justify-content-end pr-1">
<b-button
v-if="isConnected"
variant="link"
type="button"
- class="pr-0 button-launch"
@click="sendCtrlAltDel"
>
- <icon-arrow-down aria-hidden="true" />
+ <icon-arrow-down />
{{ $t('pageKvm.buttonCtrlAltDelete') }}
</b-button>
<b-button
v-if="!isFullWindow"
variant="link"
type="button"
- class="pr-0 button-launch"
@click="openConsoleWindow()"
>
- <icon-launch aria-hidden="true" />
- <span class="d-none d-md-inline">
- {{ $t('pageKvm.openNewTab') }}
- </span>
+ <icon-launch />
+ {{ $t('pageKvm.openNewTab') }}
</b-button>
</b-col>
</b-row>
diff --git a/src/views/Control/SerialOverLan/SerialOverLanConsole.vue b/src/views/Control/SerialOverLan/SerialOverLanConsole.vue
index 2b49562..a0e4787 100644
--- a/src/views/Control/SerialOverLan/SerialOverLanConsole.vue
+++ b/src/views/Control/SerialOverLan/SerialOverLanConsole.vue
@@ -13,14 +13,8 @@
</b-col>
<b-col v-if="!isFullWindow" class="d-flex justify-content-end">
- <b-button
- variant="link"
- type="button"
- class="pr-0 button-launch"
- @click="openConsoleWindow()"
- >
- <icon-launch aria-hidden="true" />
-
+ <b-button variant="link" type="button" @click="openConsoleWindow()">
+ <icon-launch />
{{ $t('pageSerialOverLan.openNewTab') }}
</b-button>
</b-col>