post.scss

/* stylelint-disable declaration-no-important */
/* stylelint-disable max-line-length */

/*------------------------------------
  Page
  -------------------------------------*/

/* Change the breakpoint if setting 'breakpoint' is active. */
@if variable-exists(breakpoint) {
    @if $breakpoint == 'yes' {
        #region-main-settings-menu.has-blocks,
        #region-main.has-blocks {
            display: inline-block;
            width: calc(100% - #{$blocks-plus-gutter});
            @include media-breakpoint-down(md) {
                width: 100%;
                /* MDL-63102 - Remove extra space at bottom.
                If modifying make sure block-region is horizontally stacked when in full screen */
                display: block;
            }
        }
    }
}
[data-region="blocks-column"] {
    width: $blocks-column-width;
    @include media-breakpoint-down(md) {
        width: 100%;
    }
}

/* Change the block column width if setting 'blockcolumnwidthdashboard' is different from setting 'blockcolumnwidth'. */
@if variable-exists(blockcolumnwidthdashboard) and variable-exists(blockcolumnwidth) {
    @if $blockcolumnwidthdashboard != $blockcolumnwidth {
        #page-my-index [data-region="blocks-column"] {
            width: $blocks-column-width-dashboard;
        }
        #page-my-index #region-main-settings-menu.has-blocks,
        #page-my-index #region-main.has-blocks {
            width: calc(100% - #{$blocks-plus-gutter-dashboard});
        }
    }
}


/*------------------------------------
  Login page
  -------------------------------------*/

body.loginbackgroundimage #page {
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
}

/* Add media breakpoint to only load images on screens with a medium size and up.
 * Check if variable exists to only add code to images that were uploaded.
 * Note: Building this code with a @for loop did not work. */
@include media-breakpoint-up(md) {
    @if variable-exists(loginbackgroundimage1) {
        body.loginbackgroundimage1 #page {
            background-image: url($loginbackgroundimage1);
        }
    }
    @if variable-exists(loginbackgroundimage2) {
        body.loginbackgroundimage2 #page {
            background-image: url($loginbackgroundimage2);
        }
    }
    @if variable-exists(loginbackgroundimage3) {
        body.loginbackgroundimage3 #page {