| Current Path : /home/eolienneia/www/templates/yootheme/vendor/assets/uikit-themes/master/base/ |
| Current File : /home/eolienneia/www/templates/yootheme/vendor/assets/uikit-themes/master/base/notification.less |
//
// Component: Notification
//
// ========================================================================
// Variables
// ========================================================================
@notification-position: 15px;
@notification-width: 420px;
@notification-message-padding: @global-gutter;
@notification-message-font-size: @global-font-size;
@notification-message-line-height: 1.5;
@notification-close-top: (@notification-message-padding / 2);
@notification-close-right: (@notification-message-padding / 2);
@notification-message-primary-color: @global-inverse-color;
@notification-message-success-color: @global-inverse-color;
@notification-message-warning-color: @global-inverse-color;
@notification-message-danger-color: @global-inverse-color;
//
// New
//
@notification-message-primary-background: @global-primary-background;
@notification-message-success-background: @global-success-background;
@notification-message-warning-background: @global-warning-background;
@notification-message-danger-background: @global-danger-background;
@notification-message-primary-color-mode: light;
@notification-message-success-color-mode: light;
@notification-message-warning-color-mode: light;
@notification-message-danger-color-mode: light;
// Component
// ========================================================================
.hook-notification() {}
// Message
// ========================================================================
.hook-notification-message() {}
// Close
// ========================================================================
.hook-notification-close() {}
// Style modifiers
// ========================================================================
.hook-notification-message-primary() { background-color: @notification-message-primary-background; }
.hook-notification-message-success() { background-color: @notification-message-success-background; }
.hook-notification-message-warning() { background-color: @notification-message-warning-background; }
.hook-notification-message-danger() { background-color: @notification-message-danger-background; }
// Miscellaneous
// ========================================================================
.hook-notification-misc() {
.uk-notification-message-primary .uk-close:extend(.uk-light .uk-close all) when (@notification-message-primary-color-mode = light) {}
.uk-notification-message-primary .uk-close:extend(.uk-dark .uk-close all) when (@notification-message-primary-color-mode = dark) {}
.uk-notification-message-primary .uk-button-default:extend(.uk-light .uk-button-default all) when (@notification-message-primary-color-mode = light) {}
.uk-notification-message-primary .uk-button-default:extend(.uk-dark .uk-button-default all) when (@notification-message-primary-color-mode = dark) {}
.uk-notification-message-primary .uk-button-primary:extend(.uk-light .uk-button-primary all) when (@notification-message-primary-color-mode = light) {}
.uk-notification-message-primary .uk-button-primary:extend(.uk-dark .uk-button-primary all) when (@notification-message-primary-color-mode = dark) {}
.uk-notification-message-primary .uk-button-secondary:extend(.uk-light .uk-button-secondary all) when (@notification-message-primary-color-mode = light) {}
.uk-notification-message-primary .uk-button-secondary:extend(.uk-dark .uk-button-secondary all) when (@notification-message-primary-color-mode = dark) {}
.uk-notification-message-primary .uk-button-text:extend(.uk-light .uk-button-text all) when (@notification-message-primary-color-mode = light) {}
.uk-notification-message-primary .uk-button-text:extend(.uk-dark .uk-button-text all) when (@notification-message-primary-color-mode = dark) {}
.uk-notification-message-success .uk-close:extend(.uk-light .uk-close all) when (@notification-message-success-color-mode = light) {}
.uk-notification-message-success .uk-close:extend(.uk-dark .uk-close all) when (@notification-message-success-color-mode = dark) {}
.uk-notification-message-success .uk-button-default:extend(.uk-light .uk-button-default all) when (@notification-message-success-color-mode = light) {}
.uk-notification-message-success .uk-button-default:extend(.uk-dark .uk-button-default all) when (@notification-message-success-color-mode = dark) {}
.uk-notification-message-success .uk-button-primary:extend(.uk-light .uk-button-primary all) when (@notification-message-success-color-mode = light) {}
.uk-notification-message-success .uk-button-primary:extend(.uk-dark .uk-button-primary all) when (@notification-message-success-color-mode = dark) {}
.uk-notification-message-success .uk-button-secondary:extend(.uk-light .uk-button-secondary all) when (@notification-message-success-color-mode = light) {}
.uk-notification-message-success .uk-button-secondary:extend(.uk-dark .uk-button-secondary all) when (@notification-message-success-color-mode = dark) {}
.uk-notification-message-success .uk-button-text:extend(.uk-light .uk-button-text all) when (@notification-message-success-color-mode = light) {}
.uk-notification-message-success .uk-button-text:extend(.uk-dark .uk-button-text all) when (@notification-message-success-color-mode = dark) {}
.uk-notification-message-warning .uk-close:extend(.uk-light .uk-close all) when (@notification-message-warning-color-mode = light) {}
.uk-notification-message-warning .uk-close:extend(.uk-dark .uk-close all) when (@notification-message-warning-color-mode = dark) {}
.uk-notification-message-warning .uk-button-default:extend(.uk-light .uk-button-default all) when (@notification-message-warning-color-mode = light) {}
.uk-notification-message-warning .uk-button-default:extend(.uk-dark .uk-button-default all) when (@notification-message-warning-color-mode = dark) {}
.uk-notification-message-warning .uk-button-primary:extend(.uk-light .uk-button-primary all) when (@notification-message-warning-color-mode = light) {}
.uk-notification-message-warning .uk-button-primary:extend(.uk-dark .uk-button-primary all) when (@notification-message-warning-color-mode = dark) {}
.uk-notification-message-warning .uk-button-secondary:extend(.uk-light .uk-button-secondary all) when (@notification-message-warning-color-mode = light) {}
.uk-notification-message-warning .uk-button-secondary:extend(.uk-dark .uk-button-secondary all) when (@notification-message-warning-color-mode = dark) {}
.uk-notification-message-warning .uk-button-text:extend(.uk-light .uk-button-text all) when (@notification-message-warning-color-mode = light) {}
.uk-notification-message-warning .uk-button-text:extend(.uk-dark .uk-button-text all) when (@notification-message-warning-color-mode = dark) {}
.uk-notification-message-danger .uk-close:extend(.uk-light .uk-close all) when (@notification-message-danger-color-mode = light) {}
.uk-notification-message-danger .uk-close:extend(.uk-dark .uk-close all) when (@notification-message-danger-color-mode = dark) {}
.uk-notification-message-danger .uk-button-default:extend(.uk-light .uk-button-default all) when (@notification-message-danger-color-mode = light) {}
.uk-notification-message-danger .uk-button-default:extend(.uk-dark .uk-button-default all) when (@notification-message-danger-color-mode = dark) {}
.uk-notification-message-danger .uk-button-primary:extend(.uk-light .uk-button-primary all) when (@notification-message-danger-color-mode = light) {}
.uk-notification-message-danger .uk-button-primary:extend(.uk-dark .uk-button-primary all) when (@notification-message-danger-color-mode = dark) {}
.uk-notification-message-danger .uk-button-secondary:extend(.uk-light .uk-button-secondary all) when (@notification-message-danger-color-mode = light) {}
.uk-notification-message-danger .uk-button-secondary:extend(.uk-dark .uk-button-secondary all) when (@notification-message-danger-color-mode = dark) {}
.uk-notification-message-danger .uk-button-text:extend(.uk-light .uk-button-text all) when (@notification-message-danger-color-mode = light) {}
.uk-notification-message-danger .uk-button-text:extend(.uk-dark .uk-button-text all) when (@notification-message-danger-color-mode = dark) {}
}