2024-10-28 11:08:40 +00:00
|
|
|
// Login page ///////////////////////////////////////
|
|
|
|
|
|
|
|
|
|
// Page
|
2024-10-24 18:41:01 +00:00
|
|
|
$login-page-background-color: linear-gradient(135deg, #5b727a, #355347);
|
|
|
|
|
$login-page-appname-color: #ffffff;
|
|
|
|
|
$login-page-description-color: rgba(207, 217, 215, 0.9);
|
2024-10-24 19:56:53 +00:00
|
|
|
//$login-page-logo-shadow-color: rgba(0, 0, 0, 0.2);
|
2024-10-28 11:08:40 +00:00
|
|
|
// Log in form
|
2024-10-24 18:41:01 +00:00
|
|
|
$login-form-background: rgba(255, 255, 255, 0.9);
|
|
|
|
|
$login-form-shadow-color: rgba(0, 0, 0, 0.2);
|
|
|
|
|
$login-form-title-color: #5f5f5f;
|
2024-10-28 11:08:40 +00:00
|
|
|
// Input fields
|
2024-10-24 18:41:01 +00:00
|
|
|
$login-form-input-background: rgba(255, 255, 255, 0.95);
|
2024-10-24 19:07:52 +00:00
|
|
|
$login-form-input-focused-background: #fff;
|
2024-10-24 18:41:01 +00:00
|
|
|
$login-form-input-border-color: rgba(232, 232, 232, 0.7);
|
|
|
|
|
$login-form-input-hover-border-color: #005f73;
|
|
|
|
|
$login-form-input-focus-border-color: #005f73;
|
2024-10-28 11:08:40 +00:00
|
|
|
// Submit button
|
2024-10-24 18:41:01 +00:00
|
|
|
$login-button-color: #003f5c;
|
|
|
|
|
$login-button-hover-color: #2f798a;
|
|
|
|
|
$login-button-shadow: rgba(0, 95, 115, 0.3);
|
|
|
|
|
$login-button-active-shadow: rgba(70, 70, 70, 0.2);
|
2024-10-24 19:07:52 +00:00
|
|
|
$login-button-text-color: #fff;
|
2024-10-24 21:31:16 +00:00
|
|
|
|
2024-10-28 11:08:40 +00:00
|
|
|
// Add New User Page ////////////////////////////////
|
|
|
|
|
|
|
|
|
|
// Page
|
|
|
|
|
$add-user-background-color: linear-gradient(135deg, #283e4a, #1c2e38); // Background gradient
|
|
|
|
|
|
|
|
|
|
// Form
|
|
|
|
|
//$add-user-header-color: #ffffff; // Header text color (white for contrast)
|
2024-10-24 21:31:16 +00:00
|
|
|
$add-user-form-background: rgba(255, 255, 255, 0.92); // Form background color
|
|
|
|
|
$add-user-form-shadow-color: rgba(0, 0, 0, 0.25); // Form shadow color
|
|
|
|
|
$add-user-form-title-color: #4e4e4e; // Form title color
|
2024-10-25 16:04:03 +00:00
|
|
|
|
2024-10-28 11:08:40 +00:00
|
|
|
// Input fileds
|
2024-10-24 21:31:16 +00:00
|
|
|
$add-user-input-background: rgba(245, 245, 245, 0.9); // Input field background color
|
2024-10-28 11:08:40 +00:00
|
|
|
$add-user-input-border-color: rgba(220, 220, 220, 0.8);
|
|
|
|
|
$add-user-input-focus-border-color: #007b8a;
|
2024-10-25 16:04:03 +00:00
|
|
|
|
2024-10-28 11:08:40 +00:00
|
|
|
// Submit button
|
|
|
|
|
$add-user-button-color: #007b8a; // Normal button color
|
2024-10-24 21:31:16 +00:00
|
|
|
$add-user-button-hover-color: #006b7a; // Button hover color
|
|
|
|
|
$add-user-button-text-color: #ffffff; // Button text color
|
|
|
|
|
$add-user-button-shadow: rgba(0, 123, 138, 0.3); // Button shadow color
|
2024-10-25 16:04:03 +00:00
|
|
|
|
2024-10-28 11:08:40 +00:00
|
|
|
// Reset button
|
2024-10-25 16:04:03 +00:00
|
|
|
$add-user-clear-button-color: #c4c4c4;;
|
|
|
|
|
$add-user-clear-button-hover-color: #8f9091;
|
|
|
|
|
$add-user-clear-button-text-color: #ffffff;
|
|
|
|
|
|
2024-10-28 11:08:40 +00:00
|
|
|
// Check-box buttons
|
|
|
|
|
// Unchecked
|
2024-10-25 11:13:15 +00:00
|
|
|
$user-form-checkbox-button-color: #007b8a;
|
|
|
|
|
$user-form-checkbox-button-text-color: #007b8a;
|
|
|
|
|
$user-form-checkbox-button-border-color: rgba(220, 220, 220, 0.8);
|
2024-10-28 11:08:40 +00:00
|
|
|
// Hover
|
|
|
|
|
$user-form-checkbox-button-hover-color: rgba(232, 232, 232, 0.9);
|
|
|
|
|
$user-form-checkbox-button-hover-text-color: #007b8a;
|
2024-10-25 11:13:15 +00:00
|
|
|
$user-form-checkbox-button-hover-border-color: #007b8a;
|
2024-10-28 11:08:40 +00:00
|
|
|
// Checked
|
|
|
|
|
$user-form-checkbox-button-active-color: #009299;
|
|
|
|
|
$user-form-checkbox-button-active-text-color: #ffffff;
|
2024-10-25 11:13:15 +00:00
|
|
|
$user-form-checkbox-button-active-border-color: rgba(0, 170, 179, 0.8);
|
2024-10-25 16:04:03 +00:00
|
|
|
|
2024-10-28 11:08:40 +00:00
|
|
|
// Radio buttons
|
|
|
|
|
// Unselected
|
|
|
|
|
$user-form-radio-button-color: $user-form-checkbox-button-color;
|
|
|
|
|
$user-form-radio-button-text-color: $user-form-checkbox-button-text-color;
|
|
|
|
|
$user-form-radio-button-border-color: $user-form-checkbox-button-border-color;
|
|
|
|
|
// Hover
|
|
|
|
|
$user-form-radio-button-hover-color: $user-form-checkbox-button-hover-color;
|
|
|
|
|
$user-form-radio-button-hover-text-color: $user-form-checkbox-button-hover-text-color;
|
|
|
|
|
$user-form-radio-button-hover-border-color: $user-form-checkbox-button-hover-border-color;
|
|
|
|
|
// Selected
|
|
|
|
|
$user-form-radio-button-active-color: $user-form-checkbox-button-active-color;
|
|
|
|
|
$user-form-radio-button-active-text-color: $user-form-checkbox-button-active-text-color;
|
|
|
|
|
$user-form-radio-button-active-border-color: $user-form-checkbox-button-active-border-color;
|
|
|
|
|
|
|
|
|
|
//Range slider
|
|
|
|
|
$user-form-range-slider-background: $add-user-input-background;
|
2024-10-28 15:10:15 +00:00
|
|
|
$user-form-range-slider-filled: $user-form-checkbox-button-active-color;
|
|
|
|
|
//$form-range-slider-background-gradient: linear-gradient(to right, $user-form-range-slider-filled 0%, $user-form-range-slider-filled var(--value), $user-form-range-slider-background var(--value));
|
|
|
|
|
$form-range-slider-background-gradient:
|
|
|
|
|
linear-gradient(
|
|
|
|
|
to right,
|
|
|
|
|
$user-form-range-slider-filled 0%,
|
|
|
|
|
$user-form-range-slider-filled var(--value),
|
|
|
|
|
$user-form-range-slider-background 0%
|
|
|
|
|
);
|
