//
// Component: HTML editor
//
// ========================================================================


// Variables
// ========================================================================

@htmleditor-navbar-background:                @global-muted-background;
@htmleditor-navbar-nav-color:                 @global-color;

@htmleditor-navbar-nav-hover-background:      darken(@htmleditor-navbar-background, 3%);
@htmleditor-navbar-nav-hover-color:           @global-color;
@htmleditor-navbar-nav-onclick-background:    darken(@htmleditor-navbar-background, 8%);
@htmleditor-navbar-nav-onclick-color:         @global-color;
@htmleditor-navbar-nav-active-background:     darken(@htmleditor-navbar-background, 5%);
@htmleditor-navbar-nav-active-color:          @global-color;

@htmleditor-content-border:                   @global-border;
@htmleditor-content-background:               @global-background;
@htmleditor-content-split-border:             @global-border;

@htmleditor-fullscreen-z-index:               @global-z-index - 10;


// Component
// ========================================================================

.hook-htmleditor() {}

.hook-htmleditor-navbar() {}

.hook-htmleditor-navbar-nav() {}

.hook-htmleditor-navbar-nav-hover() {}

.hook-htmleditor-navbar-nav-onclick() {}

.hook-htmleditor-navbar-nav-active() {}

.hook-htmleditor-content() {}


// Miscellaneous
// ========================================================================

.hook-htmleditor-misc() {

    .uk-htmleditor .CodeMirror {
        background-color: @global-background;
        color: @global-color;
    }

}