// these styles are only used by angular components/pages // once angular is disabled, this file can be deleted @use 'sass:map'; @use 'sass:color'; // Gradients @mixin gradient-vertical($startColor: #555, $endColor: #333) { background-color: color.mix($startColor, $endColor, 60%); background-image: linear-gradient(to bottom, $startColor, $endColor); // Standard, IE10 background-repeat: repeat-x; } @mixin font-family-monospace() { font-family: $font-family-monospace; } .edit-tab-content { flex-grow: 1; min-width: 0; } .view-mode--inactive { .react-resizable-handle, .add-row-panel-hint, .dash-row-menu-container, .panel-info-corner--info, .panel-info-corner--links { display: none; } } .login-form { margin-bottom: $space-md; width: 100%; } [ng\:cloak], [ng-cloak], .ng-cloak { display: none !important; } // <3: https://medium.com/@brunn/detecting-autofilled-fields-in-javascript-aed598d25da7 @keyframes onAutoFillStart { from { /**/ } to { /**/ } } @keyframes onAutoFillCancel { from { /**/ } to { /**/ } } input:-webkit-autofill { animation-name: onAutoFillStart; transition: transform 1ms; } input:not(:-webkit-autofill) { animation-name: onAutoFillCancel; } input.validation-error, input.ng-dirty.ng-invalid { box-shadow: inset 0 0px 5px $red; } input.invalid { box-shadow: inset 0 0px 5px $red; } .gf-code-editor { min-height: 36px; min-width: 280px; flex-grow: 1; margin-right: $space-xs; &.ace_editor { @include font-family-monospace(); font-size: $font-size-md; min-height: 50px; // Include space for horizontal scrollbar border-radius: $input-border-radius; border: $border-width solid $input-border-color; } .ace_content { z-index: 0; } } .ace_editor.ace_autocomplete { @include font-family-monospace(); font-size: $font-size-md; // Ace editor adds