Skip to content

Commit

Permalink
Update styling to blue
Browse files Browse the repository at this point in the history
  • Loading branch information
@rmuri
rmuri committed Dec 16, 2024
1 parent 5c921b9 commit 773977d
Showing 1 changed file with 67 additions and 67 deletions.
134 changes: 67 additions & 67 deletions css/styles.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -34,15 +34,15 @@
--bs-gray-700: #495057;
--bs-gray-800: #343a40;
--bs-gray-900: #212529;
--bs-primary: #f4623a;
--bs-primary: #4da8da;
--bs-secondary: #6c757d;
--bs-success: #198754;
--bs-info: #0dcaf0;
--bs-warning: #ffc107;
--bs-danger: #dc3545;
--bs-light: #f8f9fa;
--bs-dark: #212529;
--bs-primary-rgb: 244, 98, 58;
--bs-primary-rgb: 77, 168, 218;
--bs-secondary-rgb: 108, 117, 125;
--bs-success-rgb: 25, 135, 84;
--bs-info-rgb: 13, 202, 240;
Expand Down Expand Up @@ -73,7 +73,7 @@
--bs-border-radius-xl: 1rem;
--bs-border-radius-2xl: 2rem;
--bs-border-radius-pill: 50rem;
--bs-link-color: #f4623a;
--bs-link-color: #4da8da;
--bs-link-hover-color: #c34e2e;
--bs-code-color: #d63384;
--bs-highlight-bg: #fff3cd;
Expand Down Expand Up @@ -2024,7 +2024,7 @@ progress {
background-color: #fff;
border-color: #fab19d;
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(244, 98, 58, 0.25);
box-shadow: 0 0 0 0.25rem rgba(77, 168, 218, 0.25);
}
.form-control::-webkit-date-and-time-value {
height: 1.5em;
Expand Down Expand Up @@ -2171,7 +2171,7 @@ textarea.form-control-lg {
.form-select:focus {
border-color: #fab19d;
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(244, 98, 58, 0.25);
box-shadow: 0 0 0 0.25rem rgba(77, 168, 218, 0.25);
}
.form-select[multiple], .form-select[size]:not([size="1"]) {
padding-right: 0.75rem;
Expand Down Expand Up @@ -2251,11 +2251,11 @@ textarea.form-control-lg {
.form-check-input:focus {
border-color: #fab19d;
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(244, 98, 58, 0.25);
box-shadow: 0 0 0 0.25rem rgba(77, 168, 218, 0.25);
}
.form-check-input:checked {
background-color: #f4623a;
border-color: #f4623a;
background-color: #4da8da;
border-color: #4da8da;
}
.form-check-input:checked[type=checkbox] {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
Expand All @@ -2264,8 +2264,8 @@ textarea.form-control-lg {
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
}
.form-check-input[type=checkbox]:indeterminate {
background-color: #f4623a;
border-color: #f4623a;
background-color: #4da8da;
border-color: #4da8da;
background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
}
.form-check-input:disabled {
Expand Down Expand Up @@ -2339,10 +2339,10 @@ textarea.form-control-lg {
outline: 0;
}
.form-range:focus::-webkit-slider-thumb {
box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(244, 98, 58, 0.25);
box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(77, 168, 218, 0.25);
}
.form-range:focus::-moz-range-thumb {
box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(244, 98, 58, 0.25);
box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(77, 168, 218, 0.25);
}
.form-range::-moz-focus-outer {
border: 0;
Expand All @@ -2351,7 +2351,7 @@ textarea.form-control-lg {
width: 1rem;
height: 1rem;
margin-top: -0.25rem;
background-color: #f4623a;
background-color: #4da8da;
border: 0;
border-radius: 1rem;
-webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
Expand Down Expand Up @@ -2380,7 +2380,7 @@ textarea.form-control-lg {
.form-range::-moz-range-thumb {
width: 1rem;
height: 1rem;
background-color: #f4623a;
background-color: #4da8da;
border: 0;
border-radius: 1rem;
-moz-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
Expand Down Expand Up @@ -2845,20 +2845,20 @@ textarea.form-control-lg {
}

.btn-primary {
--bs-btn-color: #fff;
--bs-btn-bg: #f4623a;
--bs-btn-border-color: #f4623a;
--bs-btn-hover-color: #fff;
--bs-btn-hover-bg: #cf5331;
--bs-btn-hover-border-color: #c34e2e;
--bs-btn-focus-shadow-rgb: 246, 122, 88;
--bs-btn-active-color: #fff;
--bs-btn-active-bg: #c34e2e;
--bs-btn-active-border-color: #b74a2c;
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
--bs-btn-disabled-color: #fff;
--bs-btn-disabled-bg: #f4623a;
--bs-btn-disabled-border-color: #f4623a;
--bs-btn-color: #fff; /* Keep white for text for good contrast */
--bs-btn-bg: #4da8da; /* Primary button background */
--bs-btn-border-color: #4da8da; /* Match border with button background */
--bs-btn-hover-color: #fff; /* Keep hover text white */
--bs-btn-hover-bg: #3b8cb2; /* Darker shade for hover effect */
--bs-btn-hover-border-color: #3b8cb2; /* Match border to hover background */
--bs-btn-focus-shadow-rgb: 59, 140, 178; /* RGB of hover background for focus shadow */
--bs-btn-active-color: #fff; /* Keep active text white */
--bs-btn-active-bg: #337496; /* Even darker shade for active state */
--bs-btn-active-border-color: #316a8a; /* Match border with active background */
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); /* Keep the same subtle inset shadow */
--bs-btn-disabled-color: #fff; /* Keep disabled text white */
--bs-btn-disabled-bg: #4da8da; /* Match disabled background with primary button */
--bs-btn-disabled-border-color: #4da8da; /* Match border with disabled background */
}

.btn-secondary {
Expand Down Expand Up @@ -2981,20 +2981,20 @@ textarea.form-control-lg {
}

.btn-outline-primary {
--bs-btn-color: #f4623a;
--bs-btn-border-color: #f4623a;
--bs-btn-hover-color: #fff;
--bs-btn-hover-bg: #f4623a;
--bs-btn-hover-border-color: #f4623a;
--bs-btn-focus-shadow-rgb: 244, 98, 58;
--bs-btn-active-color: #fff;
--bs-btn-active-bg: #f4623a;
--bs-btn-active-border-color: #f4623a;
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
--bs-btn-disabled-color: #f4623a;
--bs-btn-disabled-bg: transparent;
--bs-btn-disabled-border-color: #f4623a;
--bs-gradient: none;
--bs-btn-color: #4da8da; /* Primary text color for outlined buttons */
--bs-btn-border-color: #4da8da; /* Match border color with the primary blue */
--bs-btn-hover-color: #fff; /* White text on hover for contrast */
--bs-btn-hover-bg: #4da8da; /* Use the primary blue for the hover background */
--bs-btn-hover-border-color: #4da8da; /* Keep border consistent with hover background */
--bs-btn-focus-shadow-rgb: 77, 168, 218; /* RGB value of primary blue for focus shadow */
--bs-btn-active-color: #fff; /* Keep text white on active state */
--bs-btn-active-bg: #4da8da; /* Active background matches primary blue */
--bs-btn-active-border-color: #4da8da; /* Keep border consistent in active state */
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125); /* Keep the same subtle inset shadow */
--bs-btn-disabled-color: #4da8da; /* Light blue text for disabled state */
--bs-btn-disabled-bg: transparent; /* Transparent background for disabled buttons */
--bs-btn-disabled-border-color: #4da8da; /* Border matches the primary blue */
--bs-gradient: none; /* Maintain a flat design with no gradient */
}

.btn-outline-secondary {
Expand Down Expand Up @@ -3235,7 +3235,7 @@ textarea.form-control-lg {
--bs-dropdown-link-hover-color: #1e2125;
--bs-dropdown-link-hover-bg: #e9ecef;
--bs-dropdown-link-active-color: #fff;
--bs-dropdown-link-active-bg: #f4623a;
--bs-dropdown-link-active-bg: #4da8da;
--bs-dropdown-link-disabled-color: #adb5bd;
--bs-dropdown-item-padding-x: 1rem;
--bs-dropdown-item-padding-y: 0.25rem;
Expand Down Expand Up @@ -3500,7 +3500,7 @@ textarea.form-control-lg {
--bs-dropdown-divider-bg: var(--bs-border-color-translucent);
--bs-dropdown-link-hover-bg: rgba(255, 255, 255, 0.15);
--bs-dropdown-link-active-color: #fff;
--bs-dropdown-link-active-bg: #f4623a;
--bs-dropdown-link-active-bg: #4da8da;
--bs-dropdown-link-disabled-color: #adb5bd;
--bs-dropdown-header-color: #adb5bd;
}
Expand Down Expand Up @@ -3683,7 +3683,7 @@ textarea.form-control-lg {
.nav-pills {
--bs-nav-pills-border-radius: 0.375rem;
--bs-nav-pills-link-active-color: #fff;
--bs-nav-pills-link-active-bg: #f4623a;
--bs-nav-pills-link-active-bg: #4da8da;
}
.nav-pills .nav-link {
background: none;
Expand Down Expand Up @@ -4349,7 +4349,7 @@ textarea.form-control-lg {
--bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
--bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23dc5834'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
--bs-accordion-btn-focus-border-color: #fab19d;
--bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(244, 98, 58, 0.25);
--bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(77, 168, 218, 0.25);
--bs-accordion-body-padding-x: 1.25rem;
--bs-accordion-body-padding-y: 1rem;
--bs-accordion-active-color: #dc5834;
Expand Down Expand Up @@ -4512,10 +4512,10 @@ textarea.form-control-lg {
--bs-pagination-hover-border-color: #dee2e6;
--bs-pagination-focus-color: var(--bs-link-hover-color);
--bs-pagination-focus-bg: #e9ecef;
--bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(244, 98, 58, 0.25);
--bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(77, 168, 218, 0.25);
--bs-pagination-active-color: #fff;
--bs-pagination-active-bg: #f4623a;
--bs-pagination-active-border-color: #f4623a;
--bs-pagination-active-bg: #4da8da;
--bs-pagination-active-border-color: #4da8da;
--bs-pagination-disabled-color: #6c757d;
--bs-pagination-disabled-bg: #fff;
--bs-pagination-disabled-border-color: #dee2e6;
Expand Down Expand Up @@ -4740,7 +4740,7 @@ textarea.form-control-lg {
--bs-progress-border-radius: 0.375rem;
--bs-progress-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
--bs-progress-bar-color: #fff;
--bs-progress-bar-bg: #f4623a;
--bs-progress-bar-bg: #4da8da;
--bs-progress-bar-transition: width 0.6s ease;
display: flex;
height: var(--bs-progress-height);
Expand Down Expand Up @@ -4797,8 +4797,8 @@ textarea.form-control-lg {
--bs-list-group-disabled-color: #6c757d;
--bs-list-group-disabled-bg: #fff;
--bs-list-group-active-color: #fff;
--bs-list-group-active-bg: #f4623a;
--bs-list-group-active-border-color: #f4623a;
--bs-list-group-active-bg: #4da8da;
--bs-list-group-active-border-color: #4da8da;
display: flex;
flex-direction: column;
padding-left: 0;
Expand Down Expand Up @@ -5150,7 +5150,7 @@ textarea.form-control-lg {
}
.btn-close:focus {
outline: 0;
box-shadow: 0 0 0 0.25rem rgba(244, 98, 58, 0.25);
box-shadow: 0 0 0 0.25rem rgba(77, 168, 218, 0.25);
opacity: 1;
}
.btn-close:disabled, .btn-close.disabled {
Expand Down Expand Up @@ -6662,7 +6662,7 @@ textarea.form-control-lg {

.text-bg-primary {
color: #fff !important;
background-color: RGBA(244, 98, 58, var(--bs-bg-opacity, 1)) !important;
background-color: RGBA(77, 168, 218, var(--bs-bg-opacity, 1)) !important;
}

.text-bg-secondary {
Expand Down Expand Up @@ -6701,7 +6701,7 @@ textarea.form-control-lg {
}

.link-primary {
color: #f4623a !important;
color: #4da8da !important;
}
.link-primary:hover, .link-primary:focus {
color: #c34e2e !important;
Expand Down Expand Up @@ -10861,7 +10861,7 @@ hr.divider {
height: 0.2rem;
max-width: 3.25rem;
margin: 1.5rem auto;
background-color: #f4623a;
background-color: #4da8da;
opacity: 1;
}

Expand All @@ -10887,10 +10887,10 @@ hr.divider-light {
padding: 0.75rem 0;
}
#mainNav .navbar-nav .nav-item .nav-link:hover, #mainNav .navbar-nav .nav-item .nav-link:active {
color: #f4623a;
color: #4da8da;
}
#mainNav .navbar-nav .nav-item .nav-link.active {
color: #f4623a !important;
color: #4da8da !important;
}
@media (min-width: 992px) {
#mainNav {
Expand Down Expand Up @@ -10918,16 +10918,16 @@ hr.divider-light {
background-color: #fff;
}
#mainNav.navbar-shrink .navbar-brand {
color: #212529;
color: #212529; /* Keep the default text color for a clean and professional look */
}
#mainNav.navbar-shrink .navbar-brand:hover {
color: #f4623a;
color: #4da8da; /* Use the primary blue for hover effect */
}
#mainNav.navbar-shrink .navbar-nav .nav-item .nav-link {
color: #212529;
color: #212529; /* Keep the default text color for navigation links */
}
#mainNav.navbar-shrink .navbar-nav .nav-item .nav-link:hover {
color: #f4623a;
color: #4da8da; /* Apply the primary blue on hover for consistency */
}
}

Expand Down Expand Up @@ -10982,7 +10982,7 @@ header.masthead h1, header.masthead .h1 {
text-align: center;
opacity: 0;
color: #fff;
background: rgba(244, 98, 58, 0.9);
background: rgba(77, 168, 218, 0.9);
transition: opacity 0.25s ease;
text-align: center;
}
Expand Down Expand Up @@ -11010,9 +11010,9 @@ header.masthead h1, header.masthead .h1 {
width: 100%;
max-width: 7rem;
height: 0.25rem;
background-color: #f4623a;
background-color: #4da8da;
border-radius: 1rem;
border-color: #f4623a;
border-color: #4da8da;
}
.divider-custom .divider-custom-line:first-child {
margin-right: 1rem;
Expand All @@ -11021,7 +11021,7 @@ header.masthead h1, header.masthead .h1 {
margin-left: 1rem;
}
.divider-custom .divider-custom-icon {
color: #f4623a;
color: #4da8da;
font-size: 2rem;
}
.divider-custom.divider-light .divider-custom-line {
Expand All @@ -11045,7 +11045,7 @@ header.masthead h1, header.masthead .h1 {
left: 0;
transition: all 0.2s ease-in-out;
opacity: 0;
background: rgba(244, 98, 58, 0.9);
background: rgba(77, 168, 218, 0.9);
}
.service .service-item .service-item-caption:hover {
opacity: 1;
Expand Down

0 comments on commit 773977d

Please sign in to comment.