Merge branch 'feat/color-coral' into 'master'

change primary color to coral

See merge request to-be-continuous/kicker!418

src/app/app.component.html

@@ -41,5 +41,6 @@
 
 <footer class="footer navbar-dark bg-dark mt-4 py-2">
   <div class="container">
+    <!-- <span class="text-muted">© copyright here</span> -->
   </div>
 </footer>

src/app/stepbar/stepbar.component.css

@@ -82,7 +82,13 @@
 .stepped-process-item:nth-child(8) {
   z-index: 1;
 }
+
 .stepped-process-item.active {
+  background-color: #f88378 !important;
+}
+.stepped-process-item.active a {
   color: #ffffff !important;
-  background-color: #4170d8 !important;
+}
+.stepped-process-item a {
+  text-decoration: none;
 }

src/app/templates-section/templates-section.component.css

@@ -18,7 +18,6 @@
 }
 .readme:hover {
   text-decoration: underline;
-  color: #4170d8;
 }
 /* extension badge */
 .extension-badge {

src/app/variable-editor/variable-editor.component.css

@@ -25,7 +25,7 @@ input:invalid {
 }
 .form-group.advanced>.col-form-label::after {
   content: "ADV.";
-  color: #4170d8;
+  color: #f88378;
   font-weight: normal;
   position: relative;
   top: -0.5em;

src/styles.css

@@ -9,9 +9,8 @@ html, body {
 :root {
   /* force no copyrighted font */
   --font-family-sans-serif: Helvetica,Arial,sans-serif;
-  --primary-color: #4170d8;
-  --text-color: #4170d8;
-  --background-color: #4170d8;
+  --primary-color: #f88378;
+  --text-color: #f88378;
 }
 
 /* use all available width up to 1320px */
@@ -47,7 +46,7 @@ markdown p {
   border-color: #000 !important;
 }
 .btn-group-toggle>.btn-secondary:hover {
-  color: #4170d8;
+  color: #f88378;
   background-color: #fff;
   border-color: #ccc;
 }
@@ -179,38 +178,38 @@ markdown p {
   display: none !important;
 }
 .nav-link:hover {
-  color: #4170d8 !important; 
+  color: #f88378 !important; 
 }
 .navbar-nav .nav-link.active {
-  color: #4170d8 !important; 
+  color: #f88378 !important; 
 }
 .btn-toggle:hover {
-  color: #4170d8 !important; 
+  color: #f88378 !important; 
 }
 .btn-toggle:active {
   color: #fff !important; 
-  background-color: #4170d8 !important; 
-  border-color: #4170d8 !important; 
+  background-color: #f88378 !important; 
+  border-color: #f88378 !important; 
 }
 .form-check-input:checked {
-  background-color: #4170d8 !important; 
-  border-color: #4170d8 !important;   
+  background-color: #f88378 !important; 
+  border-color: #f88378 !important;   
 }
 .form-check-input:active {
-  background-color: #4170d8 !important; 
-  border-color: #4170d8 !important;   
+  background-color: #f88378 !important; 
+  border-color: #f88378 !important;   
 }
 .title:hover {
-  color: #4170d8 !important;   
+  color: #f88378 !important;   
 }
 .title {
   color: #fff !important;   
 }
 a:hover {
-  color: #4170d8 !important;   
+  color: #f88378 !important;   
 }
 .btn-secondary:active {
   color: #fff !important; 
-  background-color: #4170d8 !important; 
-  border-color: #4170d8 !important; 
+  background-color: #f88378 !important; 
+  border-color: #f88378 !important; 
 }