p5.js-web-editor/client/styles/components/_keyboard-shortcuts.scss

49 lines
1.0 KiB
SCSS

.keyboard-shortcuts {
padding: #{20 / $base-font-size}rem;
padding-bottom: #{40 / $base-font-size}rem;
width: #{450 / $base-font-size}rem;
}
.keyboard-shortcuts-note {
text-align: center;
margin-bottom: 24px;
}
.keyboard-shortcut-item {
display: flex;
& + & {
margin-top: #{10 / $base-font-size}rem;
}
align-items: baseline;
}
.keyboard-shortcut__command {
font-weight: bold;
text-align: right;
margin-right: #{10 / $base-font-size}rem;
padding: #{3 / $base-font-size}rem;
@include themify {
border: 1px solid getThemifyVariable("button-border-color");
border-radius: 3px;
}
}
.keyboard-shortcuts__title {
padding-bottom: #{10 / $base-font-size}rem;
}
.keyboard-shortcuts__description {
padding-bottom: #{10 / $base-font-size}rem;
}
.keyboard-shortcuts__list:not(:last-of-type) {
padding-bottom: #{10 / $base-font-size}rem;
}
.keyboard-shortcuts__title:not(:first-of-type) {
@include themify() {
border-top: 1px dashed getThemifyVariable("button-border-color");
padding-top: #{10 / $base-font-size}rem;
}
}