infusion/src/framework/preferences/css/stylus/FullPrefsEditor.styl

Infusion is an application framework for developing flexible stuff with JavaScript

// UI Option styles for full page layouts both with and without preview

// Control section headers
.fl-prefsEditor {
    h2 {
        font-size: 1.29em;
        font-weight: bold;
        clear: both;
        color: #444444;
        padding: 14px 0px 5px 25px;
    }

    // Save, reset, cancel buttons
    .fl-prefsEditor-buttons {
        margin-top: 1em;
        float: left;
        width: 100%;

        input {
            text-transform: uppercase;
            text-decoration: underline;
            font-weight: bold;
            border: 2px solid #cecece;
            font-size: 1em;
            padding: 5px;
            height: 2.5em;
            margin-right: 3px;
            background-color: #F0F0F0;
        }
    }

    // Section header icons
    h2 {
        display: flex;
        align-items: center;
        white-space: nowrap;
        justify-content: flex-start;
        white-space: normal;

        [class*='fl-icon-'] {
            margin: 0 0.3em 0 0;
        }
    }

    // Text controls
    .fl-prefsEditor-text ul li {
        clear: left;
        height: 3.5em;
    }

    // Theme radio buttons
    .fl-choices {
        justify-content: flex-start;
    }

    // Stepper
    // Custom styling for the textfield stepper when used in the prefs framework
    .fl-textfieldStepper {
        justify-content: flex-start;;
    }

    // Switch
    // Custom styling for the switch when used in the prefs framework
    .fl-prefsEditor-onoff .fl-switchUI {
        justify-content: flex-start;
    }
}