p5.js-web-editor/client/styles/components/_console.scss
Cassie Tarakajian e87390adb9 update eslint to latest version, fix lots of linting errors (#308)
* update eslint and dependencies, fix linting errors that can be fixed with --fix

* fix lots of linting errors

* update eslintrc, fix some linting errors

* fix all server side linting errors, untested

* fix errors that fixing linting errors had caused

* fix client side eslint errors

* fix client side linting errors

* fix refs lint errors

* fix more linting errors

* update eslint and dependencies, fix linting errors that can be fixed with --fix

* fix lots of linting errors

* update eslintrc, fix some linting errors

* fix all server side linting errors, untested

* fix errors that fixing linting errors had caused

* fix client side eslint errors

* fix client side linting errors

* fix refs lint errors

* fix more linting errors

* fix some accessibility linting errors

* fix a lot of linting errors

* fix a billion more linting errors

* hopefully fix all linting errors, still need to test

* fix bugs that fixing linting had caused
2017-02-22 14:29:35 -05:00

109 lines
No EOL
2 KiB
SCSS

.preview-console {
@include themify() {
background: getThemifyVariable('console-background-color');
border-color: getThemifyVariable('ide-border-color');
}
border-left: 1px solid;
border-right: 1px solid;
width: 100%;
height: 100%;
z-index: 1000;
overflow: hidden;
display: flex;
flex-direction: column;
& > {
position:relative;
text-align:left;
}
// assign styles to different types of console messages
.preview-console__log {
@include themify(){
color: getThemifyVariable('secondary-text-color');
}
flex: 1 0 auto;
}
.preview-console__undefined {
@include themify(){
color: getThemifyVariable('inactive-text-color');
}
flex: 1 0 auto;
}
.preview-console__error {
color: $console-error-color;
flex: 1 0 auto;
}
.preview-console__warn {
color: $console-warn-color;
flex: 1 0 auto;
}
}
.preview-console__header {
@include themify() {
background-color: getThemifyVariable('console-header-background-color');
color: getThemifyVariable('console-header-color');
}
min-height: #{30 / $base-font-size}rem;
padding: #{5 / $base-font-size}rem;
display: flex;
justify-content: space-between;
align-items: center;
}
.preview-console__header-title {
font-size: #{12 / $base-font-size}rem;
font-weight: normal;
}
.preview-console__icon {
padding-right: #{20 / $base-font-size}rem;
}
.preview-console__messages {
display: flex;
flex-direction: column;
overflow-y: auto;
}
.preview-console__collapse {
padding-top: #{3 / $base-font-size}rem;
@include themify() {
@extend %icon;
}
.preview-console--collapsed & {
display: none;
}
}
.preview-console__expand {
padding-top: #{3 / $base-font-size}rem;
@include themify() {
@extend %icon;
}
display: none;
.preview-console--collapsed & {
display: inline-block;
}
}
.preview-console__header-buttons {
display: flex;
align-items: center;
}
.preview-console__clear {
@include themify() {
@extend %link;
}
background: transparent;
border: none;
padding-right: #{10 / $base-font-size}rem;
.preview-console--collapsed & {
display: none;
}
}