Merge pull request #4088 from Gnuk/landscape-light

Put landscape in light

src/main/style/organism/side-menu/_side-menu.scss

@@ -6,7 +6,6 @@ $jhlite-side-menu-gap: 1rem;
   display: flex;
   flex-direction: column;
   gap: $jhlite-side-menu-gap;
-  border-top: 1px solid $jhlite-global-color-light;
   padding: $jhlite-side-menu-padding;
   min-height: 100%;
 
@@ -17,10 +16,3 @@ $jhlite-side-menu-gap: 1rem;
     }
   }
 }
-
-@media screen and (min-width: $jhlite-global-breakpoint-small-medium) {
-  .jhlite-side-menu {
-    border-top: 0;
-    border-left: 1px solid $jhlite-global-color-light;
-  }
-}

src/main/style/template/menu-content-template/_menu-content-template.scss

@@ -1,4 +1,5 @@
 $jhlite-menu-content-template-menu-medium-width: 300px;
+$jhlite-menu-content-template-color-divider: $jhlite-global-color-fill-secondary;
 
 .jhlite-menu-content-template {
   box-sizing: border-box;
@@ -15,9 +16,14 @@ $jhlite-menu-content-template-menu-medium-width: 300px;
     box-sizing: border-box;
     flex-basis: 0;
     flex-grow: 1;
+    border-bottom: 1px solid $jhlite-menu-content-template-color-divider;
     padding: 0;
     min-height: 0;
     overflow: auto;
+
+    &:last-child {
+      border-bottom: 0;
+    }
   }
 }
 
@@ -30,5 +36,14 @@ $jhlite-menu-content-template-menu-medium-width: 300px;
       flex-grow: 0;
       width: $jhlite-menu-content-template-menu-medium-width;
     }
+
+    &--content, &--menu {
+      border-right: 1px solid $jhlite-menu-content-template-color-divider;
+      border-bottom: 0;
+
+      &:last-child {
+        border-right: 0;
+      }
+    }
   }
 }

src/main/webapp/app/assets/global.scss

@@ -1,18 +1,21 @@
 $jhipster-lite-primary-color: #0f5b90;
 $jhipster-lite-primary-alternative-color: #3e8abf;
 $jhipster-lite-secondary-color: #0f172a;
-$jhipster-lite-line-color: #ddeffc;
+$jhipster-lite-line-color: #475569;
 $jhipster-lite-primary-text-color: #ddeffc;
 $jhipster-lite-disabled-color: #6d6d6d;
 $jhipster-lite-primary-input-color: #fff;
 $jhipster-lite-applied-module-color: #2f7b17;
-$jhipster-lite-font-family: Inter serif;
 $jhipster-lite-box-radius: 6px;
 $jhipster-lite-selectable-highlight-animation: validHighlightAnimation 2s infinite;
-
 $jhipster-lite-valid-highlight-start-color: #3ebf5a;
 $jhipster-lite-valid-highlight-end-color: #0f9020;
 
+// Waiting migration colors
+$jhipster-lite-color-text-light: #fff;
+$jhipster-lite-color-text-dark: #0f172a;
+$jhipster-lite-color-fill-light: #fff;
+
 @keyframes validHighlightAnimation {
   0% {
     background-color: $jhipster-lite-valid-highlight-start-color;
@@ -31,7 +34,6 @@ $jhipster-lite-valid-highlight-end-color: #0f9020;
 }
 
 $jhipster-lite-not-selectable-highlight-animation: invalidHighlightAnimation 2s infinite;
-
 $jhipster-lite-invalid-highlight-start-color: #bf3e3e;
 $jhipster-lite-invalid-highlight-end-color: #900f0f;
 

src/main/webapp/app/module/primary/landscape-module/LandscapeModule.vue

@@ -5,7 +5,8 @@
 <style lang="scss">
 .jhipster-landscape-module {
   border-radius: $jhipster-lite-box-radius;
-  background: rgba($color: $jhipster-lite-secondary-color, $alpha: 0.7);
+  background: rgba($color: $jhipster-lite-color-fill-light, $alpha: 0.7);
+  color: $jhipster-lite-color-text-dark;
   border: 1px solid $jhipster-lite-line-color;
 
   &--slug {
@@ -41,11 +42,13 @@
 
   &.-selectable-highlighted {
     animation: $jhipster-lite-selectable-highlight-animation;
+    color: $jhipster-lite-color-text-light;
   }
 
   &.-not-selectable-highlighted,
   &.-highlighted-unselection {
     animation: $jhipster-lite-not-selectable-highlight-animation;
+    color: $jhipster-lite-color-text-light;
   }
 
   &.-selectable {
@@ -61,6 +64,7 @@
   &.-selected {
     cursor: pointer;
     background-color: $jhipster-lite-primary-color;
+    color: $jhipster-lite-color-text-light;
   }
 
   &.-applied::before {

src/main/webapp/app/module/primary/landscape/Landscape.vue

@@ -7,9 +7,6 @@ $jhipster-landscape-padding: 20px;
 
 .jhipster-landscape {
   position: relative;
-  font-family: $jhipster-lite-font-family;
-  color: $jhipster-lite-primary-text-color;
-  background-color: $jhipster-lite-secondary-color;
 }
 
 .jhipster-landscape-map {
@@ -22,7 +19,7 @@ $jhipster-landscape-padding: 20px;
   left: $jhipster-landscape-padding;
   position: absolute;
   z-index: 3;
-  background: rgba($color: $jhipster-lite-secondary-color, $alpha: 0.7);
+  background: rgba($color: $jhipster-lite-color-fill-light, $alpha: 0.7);
   padding: 10px;
   border: 1px dotted $jhipster-lite-line-color;
   border-radius: $jhipster-lite-box-radius;
@@ -36,12 +33,13 @@ $jhipster-landscape-padding: 20px;
     background-color: transparent;
     border: 0;
     border-radius: 1.5em;
-    color: $jhipster-lite-primary-input-color;
+    color: $jhipster-lite-color-text-dark;
     padding: 7px 15px;
     cursor: pointer;
 
     &.-selected {
       background-color: $jhipster-lite-primary-color;
+      color: $jhipster-lite-color-text-light;
     }
   }
 }
@@ -142,11 +140,13 @@ $jhipster-landscape-padding: 20px;
 
   &.-selectable-highlighted {
     animation: $jhipster-lite-selectable-highlight-animation;
+    color: $jhipster-lite-color-text-light;
   }
 
   &.-not-selectable-highlighted,
   &.-highlighted-unselection {
     animation: $jhipster-lite-not-selectable-highlight-animation;
+    color: $jhipster-lite-color-text-light;
   }
 }
 
@@ -161,18 +161,4 @@ $jhipster-landscape-padding: 20px;
     margin-bottom: 15px;
   }
 }
-
-.modules-application-button {
-  margin-bottom: 15px;
-  width: 100%;
-  background-color: $jhipster-lite-primary-alternative-color;
-  border: 1px solid $jhipster-lite-line-color;
-  color: $jhipster-lite-primary-input-color;
-  border-radius: 6px;
-  padding: 9px 17px;
-
-  &:disabled {
-    background-color: $jhipster-lite-disabled-color;
-  }
-}
 </style>

src/main/webapp/app/module/primary/modules-patch/ModulesPatch.vue

@@ -4,7 +4,6 @@
 
 <style lang="scss">
 .jhipster-modules {
-  font-family: $jhipster-lite-font-family;
   background-color: $jhipster-lite-secondary-color;
   color: $jhipster-lite-primary-text-color;
 }