Merge pull request #5018 from consul/simplify_main_colors

Remove redundant color definitions
2022-10-27 15:34:33 +02:00
parent 4e7b0dad99 0be0f459ab
commit 0f7637f7e2
11 changed files with 38 additions and 75 deletions
--- a/app/assets/stylesheets/admin.scss
+++ b/app/assets/stylesheets/admin.scss
@@ -135,7 +135,7 @@ $table-header:   #ecf1f6;
  }

  .title-bar {
-    color: #000;
+    color: inherit;
    position: absolute;
    right: 12px;
  }
@@ -204,10 +204,6 @@ $table-header:   #ecf1f6;
      color: $admin-text;
      padding: $line-height / 2;

-      label {
-        color: $white;
-      }
-
      a {
        color: inherit;
        white-space: nowrap;
@@ -844,6 +840,7 @@ table {
 .fullscreen {

  .fullscreen-container {
+    color: $white;

    a {
      line-height: 3rem;
@@ -856,7 +853,6 @@ table {
    .markdown-editor-header {
      vertical-align: top;
      display: inline-block;
-      color: $white;

      @include breakpoint(medium) {
        line-height: 3rem;
@@ -895,7 +891,7 @@ table {
    }

    a {
-      color: $white;
+      color: inherit;
    }
  }
 }
--- a/app/assets/stylesheets/admin/budgets/links.scss
+++ b/app/assets/stylesheets/admin/budgets/links.scss
@@ -28,7 +28,6 @@

  .ballots-link {
    @include has-fa-icon(archive, solid);
-    color: $link;
  }

  .results-link {
--- a/app/assets/stylesheets/dashboard.scss
+++ b/app/assets/stylesheets/dashboard.scss
@@ -306,7 +306,6 @@
  border-right: 1px solid $border;

  [class^="icon-"] {
-    color: $text;
    display: inline-block;
    font-size: rem-calc(24);
    line-height: $line-height;
@@ -358,7 +357,6 @@

  .has-tip {
    border-bottom: 0;
-    color: $text;
    cursor: auto;
    font-weight: normal;
  }
@@ -519,7 +517,6 @@
    color: #fff;

    h1 {
-      color: #fff;
      text-align: left;
    }
  }
@@ -680,7 +677,6 @@
    }

    p {
-      color: #fff;
      font-size: rem-calc(80);
      line-height: rem-calc(100);

--- a/app/assets/stylesheets/datepicker_overrides.scss
+++ b/app/assets/stylesheets/datepicker_overrides.scss
@@ -14,7 +14,6 @@

    .ui-state-default:not(&) {
      background: $highlight;
-      color: $text;
    }
  }

--- a/app/assets/stylesheets/in_favor_against.scss
+++ b/app/assets/stylesheets/in_favor_against.scss
@@ -64,7 +64,6 @@
  }

  .percentage {
-    color: $text;
    display: inline-block;
    font-size: $small-font-size;
    line-height: $line-height * 2;
--- a/app/assets/stylesheets/layout.scss
+++ b/app/assets/stylesheets/layout.scss
@@ -135,11 +135,6 @@ button,
  @include inverted-selection;
  background: $brand;

-  &.warning,
-  &.warning:hover {
-    color: #000;
-  }
-
  &.medium {
    font-size: $small-font-size;
  }
@@ -259,15 +254,11 @@ button,
    }

    a {
-      color: inherit;
+      @include text-colored-link;
      display: inline-block;
      font-weight: bold;
      position: relative;
      text-align: left;
-
-      &:hover {
-        color: $link;
-      }
    }

    + li {
@@ -642,8 +633,7 @@ body > header,
    }

    &.is-dropdown-submenu {
-      background: $body-background;
-      color: $text;
+      @extend %body-colors;
      margin: 0;
      margin-top: rem-calc(-12);
      padding: 0;
@@ -751,8 +741,6 @@ body > header,
  flex-direction: column;

  @include breakpoint(medium) {
-    background: $body-background;
-    color: $text;
    flex-direction: row;
    padding-bottom: 0;

@@ -790,21 +778,17 @@ body > header,
      &:hover {
        color: $link;
      }
-    }

-    &:focus {
-      z-index: 1;
-    }
-
-    &.is-active {
-      color: #fff;
-
-      @include breakpoint(medium) {
+      &.is-active {
        @include brand-text;
        border-bottom: 2px solid;
        margin-bottom: 1px;
      }
    }
+
+    &:focus {
+      z-index: 1;
+    }
  }

  .input-group {
@@ -856,7 +840,7 @@ body > header,
  margin-bottom: $line-height / 2;

  a {
-    color: inherit;
+    @include text-colored-link;
    display: inline-block;
    font-weight: bold;
    margin-right: $line-height / 2;
@@ -866,10 +850,6 @@ body > header,
    @include breakpoint(medium) {
      margin-right: $line-height;
    }
-
-    &:hover {
-      color: $link;
-    }
  }

  .is-active {
@@ -1196,10 +1176,6 @@ form {
    background-color: $info-bg;
    border-color: $info-border;
    color: $color-info;
-
-    a {
-      color: $link !important;
-    }
  }

  &.warning {
@@ -1375,11 +1351,7 @@ form {
  }

  .notification-link {
-    color: inherit;
-
-    &:hover {
-      color: $link;
-    }
+    @include text-colored-link;
  }

  &:hover {
@@ -1505,7 +1477,7 @@ table {
 .button.button-facebook,
 .button.button-google,
 .button.button-wordpress {
-  color: $text;
+  color: inherit;
  font-weight: bold;

  &::before {
@@ -1775,8 +1747,6 @@ table {
 // ------------

 .comments {
-  background: $body-background;
-  background-repeat: repeat-x;
  padding-bottom: $line-height * 4;

  h2 {
@@ -1874,11 +1844,9 @@ table {

  .delete-comment {
    @include has-fa-icon(trash-alt, regular);
-    color: $delete;

-    &:hover,
-    &:active {
-      color: $link-hover;
+    &:not(:hover):not(:active) {
+      color: $delete;
    }

    &::before {
@@ -1941,13 +1909,11 @@ table {
 }

 .comment-info {
-  color: $text-medium;
  display: inline-block;
  font-size: $small-font-size;
  line-height: rem-calc(32); // Same as avatar height

  .user-name {
-    color: $text;
    font-weight: bold;
  }
 }
@@ -2635,9 +2601,8 @@ table {
    }

    span {
-      background: $body-background;
+      @extend %body-colors;
      border-radius: rem-calc(4);
-      color: $text;
      display: inline-block;
      font-size: $small-font-size;
      font-weight: bold;
--- a/app/assets/stylesheets/layout/locale_switcher.scss
+++ b/app/assets/stylesheets/layout/locale_switcher.scss
@@ -20,7 +20,7 @@
    }

    label {
-      color: #fff;
+      color: inherit;
      font-size: $tiny-font-size;
      font-weight: normal;
    }
@@ -44,8 +44,7 @@
      }

      option {
-        background: $body-background;
-        color: $text;
+        @extend %body-colors;
        border: 0;
        outline: none;
      }
--- a/app/assets/stylesheets/mixins/buttons.scss
+++ b/app/assets/stylesheets/mixins/buttons.scss
@@ -41,6 +41,14 @@
  }
 }

+@mixin text-colored-link {
+  color: inherit;
+
+  &:hover {
+    color: $link;
+  }
+}
+
@mixin switch {
  @include regular-button;
  border-radius: $line-height;
--- a/app/assets/stylesheets/mixins/colors.scss
+++ b/app/assets/stylesheets/mixins/colors.scss
@@ -12,6 +12,11 @@
  color: $brand;
 }

+@mixin body-colors {
+  background-color: $body-background;
+  color: $text;
+}
+
@mixin normal-selection {

  &::selection,
@@ -36,3 +41,7 @@
 %brand-text {
  @include brand-text;
 }
+
+%body-colors {
+  @include body-colors;
+}
--- a/app/assets/stylesheets/mixins/icons.scss
+++ b/app/assets/stylesheets/mixins/icons.scss
@@ -1620,7 +1620,6 @@ $font-awesome-icons: (

  .manage-link {
    @include has-fa-icon(archive, solid);
-    color: $link;
  }

  .cards-link {
--- a/app/assets/stylesheets/participation.scss
+++ b/app/assets/stylesheets/participation.scss
@@ -81,7 +81,7 @@
  }

  .supported {
-    color: $text;
+    color: inherit;
    margin-top: rem-calc(12);
  }
 }
@@ -438,7 +438,6 @@
 }

 %panel {
-  background: $body-background;
  border: 1px solid;
  border-color: #e5e6e9 #dfe0e4 #d0d1d5;
  border-radius: 0;
@@ -665,7 +664,6 @@

      &:hover {
        background: $budget-hover;
-        color: #fff;
        cursor: pointer;
      }

@@ -934,8 +932,7 @@
      margin-top: 0;

      &:hover {
-        background: $body-background;
-        color: $text;
+        @extend %body-colors;
      }
    }

@@ -1041,7 +1038,6 @@

 .jumbo-budget {
  @include full-width-border(bottom, 2px solid $border);
-  background: $body-background;

  &.budget-heading {
    min-height: $line-height * 10;
@@ -1476,9 +1472,8 @@
 }

 .zoom-link {
-  background: $body-background;
+  @extend %body-colors;
  border-radius: rem-calc(48);
-  color: $text;
  font-size: rem-calc(24);
  font-weight: bold;
  height: rem-calc(48);
@@ -1616,7 +1611,6 @@

 .section-title-divider {
  border-bottom: 1px solid #eee;
-  color: #000;
  margin: $line-height 0;

  span {