Asymmetrik/ngx-starter

View on GitHub
src/styles.scss

Summary

Maintainability
Test Coverage
@import 'styles/shared';

@import '@angular/cdk/overlay-prebuilt.css';

/* You can add global styles to this file, and also import other style files */

// Import the main bootstrap style file
@import 'styles/bootstrap';

// Import the main cdk style file
@import "styles/cdk";

// Import the main ng-select style file
@import 'styles/ng-select';

:root {
    --bs-body-font-family: 'Roboto', 'Arial';
}

body {
    overflow: hidden;
}

@if $form-required == before {
    .form-required:before {
        content: '*';
        color: var(--bs-danger);
        padding-right: 3px;
    }
} @else if $form-required == after {
    .form-required:after {
        content: '*';
        color: var(--bs-danger);
        padding-left: 3px;
    }
}

// Adds ellipsis to any DOM element that is too long
.hide-overflow {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    .dropdown-menu {
        bottom: inherit;
        left: inherit;
        position: inherit;
        right: inherit;
        top: inherit;
    }
}

// when the .skip-to class is applied to non-interactive
// elements it should not have a style when focused
div,
span,
h1,
h2,
h3,
h4,
h5,
h6 {
    &.skip-to:focus {
        outline: 0;
    }
}

.page-body {
    display: flex;
    flex-direction: column;
    &.anchored-page-body {
        min-height: $anchored-table-min-height;
    }
}