pxt-ev3/theme/style.less
2018-01-18 21:03:57 -08:00

129 lines
2.9 KiB
Plaintext

/* Import all components */
@import 'semantic';
@import 'pxt';
@import 'themes/default/globals/site.variables';
@import 'themes/pxt/globals/site.variables';
@import 'site/globals/site.variables';
@import 'themes/default/collections/menu.variables';
@import 'fieldeditors';
/* Reference import */
@import (reference) "semantic.less";
/*******************************
Add your custom CSS here
*******************************/
/* Roboto font */
@RobotoFont: data-uri("../docs/static/fonts/Roboto_400_normal.woff");
@font-face {
font-family: 'Roboto';
src: @RobotoFont format("woff");
}
.ui.button.download-button {
&:extend(.ui.primary.button all);
}
.ui.button.editortools-btn {
&:extend(.ui.blue.button all);
}
.projectname-input {
}
.ui.button.getting-started-btn {
&:extend(.ui.green.button all);
}
.ui.button.exit-tutorial-btn {
&:extend(.ui.blue.button all);
}
/* Menu bar colors */
.menubar .ui.item {
color: #4A4A4A;
}
.fullscreensim .menubar .ui.menu {
box-shadow: none !important;
border-bottom: 0 !important;
}
/* logo */
#logo a.ui.image .ui.logo {
min-width: 2.0rem;
}
/* Editor menu toggle */
.menubar .ui.menu.fixed .item.editor-menuitem .ui.grid {
background: @blue !important;
border-radius: 0px !important;
border: 2px solid @blue;
}
.menubar .ui.menu.fixed .ui.item.editor-menuitem .item:not(.active) {
color: white;
}
.menubar .ui.menu.fixed .ui.item.editor-menuitem .item {
border-radius: 0px !important;
}
.menubar .ui.menu.fixed .ui.item.editor-menuitem .item.active {
color: @blue;
}
.sandboxfooter a:not(.thin) {
color:white !important;
}
/* lowercase menu items */
.menubar .ui.menu.fixed > .left.menu > .ui.item > .ui.text,
.menubar .ui.menu.fixed > .ui.item > span {
text-transform: lowercase;
}
/* Mobile */
@media only screen and (max-width: @largestMobileScreen) {
#filelist {
background: transparent;
}
}
/* Tablet */
@media only screen and (min-width: @tabletBreakpoint) and (max-width: @largestTabletScreen) {
}
/* Small Monitor */
@media only screen and (min-width: @computerBreakpoint) and (max-width: @largestSmallMonitor) {
#filelist, #downloadArea {
border-top: 2px solid #ECF6FF;
}
}
/* Large Monitor */
@media only screen and (min-width: @largeMonitorBreakpoint) {
#filelist, #downloadArea {
border-top: 2px solid #ECF6FF;
}
}
/* Mobile, Tablet AND thin screen */
@media only screen and (max-width: @largestTabletScreen) and (max-height: @thinEditorBreakpoint) {
.sandboxfooter a:not(.thin) {
color: @black !important;
}
}
/** high contrast **/
.hc {
.ui.menu, #downloadArea,
.menubar .ui.menu.fixed .ui.item.editor-menuitem .item.active {
background-color: black !important;
color: white !important;
}
.ui.red.corner.label {
border-color: #d4000d!important;
}
.menubar .ui.menu.fixed .item.editor-menuitem .ui.grid {
border-color: white !important;
}
}