diff --git a/assets/components/ContainerTitle.vue b/assets/components/ContainerTitle.vue index 31f94dc7..51f13828 100644 --- a/assets/components/ContainerTitle.vue +++ b/assets/components/ContainerTitle.vue @@ -32,7 +32,7 @@ export default { opacity: 0.6; &:after, &:before { - background-color: var(--body-color); + background-color: var(--text-color); } &:hover { diff --git a/assets/components/Search.vue b/assets/components/Search.vue index 7490b090..1a189769 100644 --- a/assets/components/Search.vue +++ b/assets/components/Search.vue @@ -82,8 +82,18 @@ export default { z-index: 10; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24); - .delete { + button.delete { margin-left: 1em; + background-color: var(--scheme-main-ter); + opacity: 0.6; + &:after, + &:before { + background-color: var(--text-color); + } + + &:hover { + opacity: 1; + } } .icon { diff --git a/assets/pages/Container.vue b/assets/pages/Container.vue index 9cf734f5..cde165bd 100644 --- a/assets/pages/Container.vue +++ b/assets/pages/Container.vue @@ -58,7 +58,11 @@ export default { } }, beforeRouteUpdate(to, from, next) { - this.beforeRouteEnter(to, from, next); + if (store.getters.allContainersById[to.params.id]) { + next(); + } else { + next({ name: "container-not-found" }); + } }, }; diff --git a/assets/pages/ContainerNotFound.vue b/assets/pages/ContainerNotFound.vue index b23ff550..497dfe44 100644 --- a/assets/pages/ContainerNotFound.vue +++ b/assets/pages/ContainerNotFound.vue @@ -2,7 +2,10 @@
-

This container no longer exists or has been removed

+

+ Container not found. + It may have been removed. +

@@ -10,7 +13,6 @@ diff --git a/assets/pages/Index.vue b/assets/pages/Index.vue index 51dc3aa0..78aacbb7 100644 --- a/assets/pages/Index.vue +++ b/assets/pages/Index.vue @@ -2,7 +2,10 @@
-

Please choose a container from the list to view the logs

+

+ Hello, + friend. I am here for you logging needs. +

diff --git a/assets/pages/PageNotFound.vue b/assets/pages/PageNotFound.vue index 9f6be3f4..60da90a1 100644 --- a/assets/pages/PageNotFound.vue +++ b/assets/pages/PageNotFound.vue @@ -2,7 +2,10 @@
-

This page does not exist

+

+ Oops, + this page doesn't exist +

@@ -10,7 +13,6 @@ diff --git a/assets/styles.scss b/assets/styles.scss index 6077378f..5d53ccf7 100644 --- a/assets/styles.scss +++ b/assets/styles.scss @@ -3,7 +3,6 @@ $body-family: "Roboto", sans-serif; $body-background-color: var(--body-background-color); -$body-color: var(--body-color); $scheme-main: var(--scheme-main); $scheme-main-bis: var(--scheme-main-bis); @@ -15,8 +14,12 @@ $border-hover: var(--border-hover-color); $menu-item-active-background-color: var(--menu-item-active-background-color); $menu-item-color: var(--menu-item-color); $menu-item-hover-background-color: var(--menu-item-hover-background-color); +$menu-item-hover-color: var(--menu-item-hover-color); + +$text-strong: var(--text-strong-color); +$text: var(--text-color); + -$title-color: var(--title-color); @import "~bulma"; @import "../node_modules/splitpanes/dist/splitpanes.css"; @@ -37,13 +40,14 @@ html { --secondary-color: #{$yellow}; --body-background-color: #{$black-bis}; - --body-color: #{$grey-lighter}; --menu-item-active-background-color: var(--primary-color); --menu-item-color: hsl(0, 6%, 87%); --menu-item-hover-background-color: #{$white-ter}; + --menu-item-hover-color: #{$black-ter}; - --title-color: #{$grey-lightest}; + --text-strong-color: #{$grey-lightest}; + --text-color: #{$grey-lighter}; } [data-theme="light"] { @@ -63,8 +67,10 @@ html { --menu-item-color: #{$grey-dark}; --menu-item-hover-background-color: #eee8e7; + --menu-item-hover-color: #{black-ter}; - --title-color: #{$grey-dark}; + --text-strong-color: #{$grey-dark}; + --text-color: #{$grey-darker}; } html {