change blue color on all the app
This commit is contained in:
parent
99cfd4f42c
commit
1f2935719c
21 changed files with 47 additions and 47 deletions
|
@ -1,4 +1,3 @@
|
|||
$blue: #0069CC;
|
||||
$light-blue: #1C7EC9;
|
||||
$lighter-blue: #C3D9FF;
|
||||
$black: #333333;
|
||||
|
|
|
@ -22,6 +22,6 @@
|
|||
%outline {
|
||||
&:active:not(:disabled),
|
||||
&:focus {
|
||||
outline: 3px solid $blue;
|
||||
outline: 3px solid $blue-france-500;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -20,26 +20,26 @@
|
|||
|
||||
&.active {
|
||||
background-color: #FFFFFF;
|
||||
border-top: 2px solid $blue;
|
||||
border-top: 2px solid $blue-france-500;
|
||||
border-left: 1px solid $border-grey;
|
||||
border-right: 1px solid $border-grey;
|
||||
|
||||
a {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
|
||||
.badge {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
a {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
|
||||
.badge {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -19,7 +19,7 @@
|
|||
}
|
||||
|
||||
&:last-child {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
|
||||
&::after {
|
||||
content: none;
|
||||
|
|
|
@ -160,7 +160,7 @@
|
|||
&.icon-only {
|
||||
&::after {
|
||||
margin-left: 2px;
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -223,7 +223,7 @@
|
|||
cursor: default;
|
||||
|
||||
h4 {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -309,5 +309,5 @@
|
|||
}
|
||||
|
||||
.link {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
|
|
|
@ -21,10 +21,10 @@
|
|||
}
|
||||
|
||||
&.featured {
|
||||
border-top: 8px solid $blue;
|
||||
border-top: 8px solid $blue-france-500;
|
||||
|
||||
.card-title {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -20,7 +20,7 @@
|
|||
}
|
||||
|
||||
.card-admin-status-todo {
|
||||
color: #246AC5;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
|
||||
.card-admin-title {
|
||||
|
@ -42,10 +42,10 @@
|
|||
}
|
||||
|
||||
&:hover {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
|
||||
.button {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -46,7 +46,7 @@ strong {
|
|||
}
|
||||
|
||||
a {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
|
||||
a[target="_blank"]::after {
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
}
|
||||
|
||||
.text-info {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
|
||||
.text-warning {
|
||||
|
|
|
@ -215,8 +215,8 @@
|
|||
}
|
||||
|
||||
&:focus {
|
||||
border: 1px solid $blue;
|
||||
box-shadow: 0px 0px 2px 1px $blue;
|
||||
border: 1px solid $blue-france-500;
|
||||
box-shadow: 0px 0px 2px 1px $blue-france-500;
|
||||
}
|
||||
|
||||
// Hide the browser default invalidity indicator until the field is touched
|
||||
|
@ -306,7 +306,7 @@
|
|||
}
|
||||
|
||||
[data-reach-combobox-input]:focus {
|
||||
border-color: $blue;
|
||||
border-color: $blue-france-500;
|
||||
}
|
||||
|
||||
[data-reach-combobox-token-list] {
|
||||
|
@ -379,15 +379,15 @@
|
|||
|
||||
.header-section {
|
||||
display: inline-block;
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
font-size: 30px;
|
||||
margin-bottom: 3 * $default-padding;
|
||||
border-bottom: 3px solid $blue;
|
||||
border-bottom: 3px solid $blue-france-500;
|
||||
}
|
||||
|
||||
.header-subsection {
|
||||
font-size: 22px;
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
margin-bottom: $default-padding;
|
||||
}
|
||||
|
||||
|
|
|
@ -13,7 +13,7 @@
|
|||
|
||||
.help-dropdown-title {
|
||||
font-size: 16px;
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
|
||||
.dropdown-items li.help-dropdown-service {
|
||||
|
@ -25,7 +25,7 @@
|
|||
|
||||
a {
|
||||
display: inline;
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -13,8 +13,8 @@
|
|||
|
||||
&.instruction {
|
||||
background-color: #FFFFFF;
|
||||
color: $blue;
|
||||
border: 1px solid $blue;
|
||||
color: $blue-france-500;
|
||||
border: 1px solid $blue-france-500;
|
||||
}
|
||||
|
||||
&.en-instruction {
|
||||
|
|
|
@ -66,7 +66,7 @@ $landing-breakpoint: 1040px;
|
|||
}
|
||||
|
||||
.features-panel {
|
||||
background-color: $blue;
|
||||
background-color: $blue-france-500;
|
||||
}
|
||||
|
||||
.features-panel-title {
|
||||
|
|
|
@ -66,8 +66,8 @@ $header-mobile-breakpoint: 550px;
|
|||
|
||||
&.active,
|
||||
&:hover {
|
||||
color: $blue;
|
||||
border-bottom: 2px solid $blue;
|
||||
color: $blue-france-500;
|
||||
border-bottom: 2px solid $blue-france-500;
|
||||
|
||||
&.contact-link {
|
||||
position: relative;
|
||||
|
@ -86,7 +86,7 @@ $header-mobile-breakpoint: 550px;
|
|||
position: absolute;
|
||||
left: -165px;
|
||||
background: #FFFFFF;
|
||||
border: 2px solid $blue;
|
||||
border: 2px solid $blue-france-500;
|
||||
border-radius: 5px;
|
||||
padding: 15px;
|
||||
width: 400px;
|
||||
|
@ -116,7 +116,7 @@ $header-mobile-breakpoint: 550px;
|
|||
|
||||
&::before {
|
||||
border-color: rgba(255, 255, 255, 0);
|
||||
border-bottom-color: $blue;
|
||||
border-bottom-color: $blue-france-500;
|
||||
border-width: 18px;
|
||||
margin-left: -18px;
|
||||
}
|
||||
|
|
|
@ -6,7 +6,7 @@
|
|||
}
|
||||
|
||||
.icon.download-white {
|
||||
background-color: $blue;
|
||||
box-shadow: 0px 0px 1px 2px $blue;
|
||||
background-color: $blue-france-500;
|
||||
box-shadow: 0px 0px 1px 2px $blue-france-500;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -53,7 +53,7 @@
|
|||
&.type-header-section {
|
||||
&,
|
||||
.head {
|
||||
background-color: $blue;
|
||||
background-color: $blue-france-500;
|
||||
}
|
||||
|
||||
.head .icon {
|
||||
|
|
|
@ -18,7 +18,7 @@ $procedure-description-line-height: 22px;
|
|||
|
||||
.simple {
|
||||
font-size: 24px;
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
@ -61,7 +61,7 @@ $procedure-description-line-height: 22px;
|
|||
}
|
||||
|
||||
.procedure-auto-archive-title {
|
||||
border-bottom: 1px dotted $blue;
|
||||
border-bottom: 1px dotted $blue-france-500;
|
||||
}
|
||||
|
||||
.procedure-description {
|
||||
|
|
|
@ -105,7 +105,7 @@
|
|||
}
|
||||
|
||||
[data-reach-combobox-input]:focus {
|
||||
border-color: $blue;
|
||||
border-color: $blue-france-500;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -1,3 +1,4 @@
|
|||
@import "colors";
|
||||
$dark-grey: #333333;
|
||||
$light-grey: #999999;
|
||||
$blue: rgba(61, 149, 236, 1);
|
||||
|
@ -86,11 +87,11 @@ $segmented-control-item-border-radius: 2 * $default-space;
|
|||
.segmented-control-item {
|
||||
display: inline-block;
|
||||
font-size: 15px;
|
||||
border: 2px solid $blue;
|
||||
border: 2px solid $blue-france-500;
|
||||
margin-right: -2px;
|
||||
padding-left: $segmented-control-item-horizontal-padding;
|
||||
padding-right: $segmented-control-item-horizontal-padding;
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
|
||||
&:first-of-type {
|
||||
border-radius: $segmented-control-item-border-radius 0px 0px $segmented-control-item-border-radius;
|
||||
|
@ -109,7 +110,7 @@ $segmented-control-item-border-radius: 2 * $default-space;
|
|||
}
|
||||
|
||||
.segmented-control-item-active {
|
||||
background-color: $blue;
|
||||
background-color: $blue-france-500;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
|
@ -146,11 +147,11 @@ $big-number-card-padding: 2 * $segmented-control-item-border-radius;
|
|||
font-size: 90px;
|
||||
line-height: 90px;
|
||||
font-weight: bold;
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
|
||||
.big-number-card-detail {
|
||||
display: block;
|
||||
text-align: center;
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
}
|
||||
|
|
|
@ -42,7 +42,7 @@
|
|||
@include vertical-padding($default-spacer);
|
||||
|
||||
&.header-section {
|
||||
color: $blue;
|
||||
color: $blue-france-500;
|
||||
font-size: 20px;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -49,8 +49,8 @@ input:checked + .toggle-switch-control {
|
|||
}
|
||||
|
||||
input:focus + .toggle-switch-control {
|
||||
border-color: $blue;
|
||||
box-shadow: 0px 0px 2px 1px $blue;
|
||||
border-color: $blue-france-500;
|
||||
box-shadow: 0px 0px 2px 1px $blue-france-500;
|
||||
}
|
||||
|
||||
input:checked + .toggle-switch-control::before {
|
||||
|
|
Loading…
Reference in a new issue