130 lines
5.6 KiB
SCSS
130 lines
5.6 KiB
SCSS
// Login page ///////////////////////////////////////
|
|
|
|
// Page
|
|
$login-page-background-color: linear-gradient(135deg, #5b727a, #355347);
|
|
$login-page-appname-color: #ffffff;
|
|
$login-page-description-color: rgba(207, 217, 215, 0.9);
|
|
//$login-page-logo-shadow-color: rgba(0, 0, 0, 0.2);
|
|
// Log in form
|
|
$login-form-background: rgba(255, 255, 255, 0.9);
|
|
$login-form-shadow-color: rgba(0, 0, 0, 0.2);
|
|
$login-form-title-color: #5f5f5f;
|
|
// Input fields
|
|
$login-form-input-background: rgba(255, 255, 255, 0.95);
|
|
$login-form-input-focused-background: #fff;
|
|
$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;
|
|
// Submit button
|
|
$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);
|
|
$login-button-text-color: #fff;
|
|
|
|
// Entry Form 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)
|
|
$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
|
|
|
|
// Input fileds
|
|
$add-user-input-background: rgba(245, 245, 245, 0.9); // Input field background color
|
|
$add-user-input-border-color: rgba(220, 220, 220, 0.8);
|
|
$add-user-input-focus-border-color: #007b8a;
|
|
|
|
// Submit button
|
|
$add-user-button-color: #007b8a; // Normal button color
|
|
$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
|
|
|
|
// Reset button
|
|
$add-user-clear-button-color: #c4c4c4;;
|
|
$add-user-clear-button-hover-color: #8f9091;
|
|
$add-user-clear-button-text-color: #ffffff;
|
|
|
|
// Check-box buttons
|
|
// Unchecked
|
|
$user-form-checkbox-button-color: $add-user-input-background;
|
|
$user-form-checkbox-button-text-color: $add-user-form-title-color;
|
|
$user-form-checkbox-button-border-color: $add-user-input-border-color;
|
|
// Hover
|
|
$user-form-checkbox-button-hover-color: rgba(232, 232, 232, 0.9);
|
|
$user-form-checkbox-button-hover-text-color: #007b8a;
|
|
$user-form-checkbox-button-hover-border-color: #007b8a;
|
|
// Checked
|
|
$user-form-checkbox-button-active-color: #3b8084;;
|
|
$user-form-checkbox-button-active-text-color: #ffffff;
|
|
$user-form-checkbox-button-active-border-color: rgba(0, 170, 179, 0.8);
|
|
|
|
// 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;
|
|
$user-form-range-slider-filled: $user-form-checkbox-button-active-color;
|
|
|
|
// Collapsible section
|
|
$details-closed-summary-color: #b1b1b1;
|
|
$details-summary-hover-color: #636363;
|
|
$details-open-summary-color: #979797;
|
|
$details-summary-border-color: $add-user-input-border-color;
|
|
|
|
// Search page //////////////////////////////////////
|
|
|
|
// Search field
|
|
$search-page-search-field-background: $add-user-input-background;
|
|
$search-page-search-field-border-color: $add-user-input-border-color;
|
|
$search-page-search-field-hover-border-color: $add-user-input-focus-border-color;
|
|
$search-page-search-field-focus-border-color: $add-user-input-focus-border-color;
|
|
|
|
// Search button normal
|
|
$search-page-search-button-color: $user-form-checkbox-button-color;
|
|
$search-page-search-button-text-color: $user-form-checkbox-button-text-color;
|
|
$search-page-search-button-border-color: $user-form-checkbox-button-border-color;
|
|
// Search button hover
|
|
$search-page-search-button-hover-color: $add-user-button-color;
|
|
$search-page-search-button-hover-text-color: $add-user-button-text-color;
|
|
$search-page-search-button-hover-border-color: $user-form-checkbox-button-hover-border-color;
|
|
// Search button clicked
|
|
$search-page-search-button-active-color: $user-form-checkbox-button-hover-color;
|
|
$search-page-search-button-active-text-color: $user-form-checkbox-button-hover-text-color;
|
|
$search-page-search-button-active-border-color: $user-form-checkbox-button-hover-border-color;
|
|
|
|
// Search res items
|
|
// Search result normal
|
|
$search-res-item-color: #e1e1e1;
|
|
$search-res-item-hover-color: #b0b0b0;
|
|
$search-res-item-border-color: #e0e0e0;
|
|
|
|
$search-res-item-detail-primary-key-color: #166264;
|
|
$search-res-item-detail-info-row-color: #666666;
|
|
|
|
// Search res item edit button
|
|
$search-res-edit-item-button-color: $user-form-checkbox-button-color;
|
|
$search-res-edit-item-button-text-color: $user-form-checkbox-button-text-color;
|
|
$search-res-edit-item-button-hover-color: #5ca4a8;
|
|
// Search res item delete button
|
|
$search-res-delete-item-button-color: $user-form-checkbox-button-color;
|
|
$search-res-delete-item-button-text-color: $user-form-checkbox-button-text-color;
|
|
$search-res-delete-item-button-hover-color: #c96f6f;
|
|
$search-res-item-action-button-hover-text-color: #ffffff;
|
|
|