Include Open Sans font and some UI tweaks reducing white space in the editor. (#312)

This commit is contained in:
Sam El-Husseini
2018-02-08 09:35:27 -08:00
committed by Peli de Halleux
parent c9f6d873b1
commit f53dbf4d83
12 changed files with 313 additions and 325 deletions

View File

@ -5,4 +5,9 @@
.ui.menu.inverted .item {
text-transform: uppercase;
}
#mainmenu {
background: #f4f7f9;
border-bottom: 5px solid #00a5c8;
}

View File

@ -2,7 +2,7 @@
User Global Variables
*******************************/
@importGoogleFonts: true;
@fontName : 'Open Sans';
@headerFont : "Open Sans","Arial Narrow","Helvetica Neue",Helvetica,Arial,sans-serif;
@pageFont : "Open Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
@ -27,6 +27,9 @@
@orange: #fa7f2a;
@green: @brightYellowishGreen;
@legoGreyLight: #eaeeef;
@legoGreyDark: #f4f7f9;
/* Lego official colors */
/* Solid */
@ -122,9 +125,9 @@
Background
--------------------*/
@simulatorBackground: #fff; /*#fcfbfa; */
@editorToolsBackground: #fff; /*#fcfbfa; */
@blocklySvgColor: #ecf6fe;
@simulatorBackground: #D6EDFF; /* #FFF */ /* #fcfbfa; */
@editorToolsBackground: #fff; /* #fcfbfa; */
@blocklySvgColor: #f9f9f9; /*#f2f6f8;*/ /*ecf6fe;*/
@homeScreenBackground: #EAEEEF;
@ -159,10 +162,10 @@
@blocklyRowWidthTablet: 100px;
@blocklyRowWidthMobile: 50px;
@blocklyRowHeightWide: 50px;
@blocklyRowHeightComputer: 50px;
@blocklyRowHeightTablet: 50px;
@blocklyRowHeightMobile: 50px;
@blocklyRowHeightWide: 45px;
@blocklyRowHeightComputer: 45px;
@blocklyRowHeightTablet: 45px;
@blocklyRowHeightMobile: 45px;
/*-------------------

View File

@ -15,12 +15,14 @@
Add your custom CSS here
*******************************/
/* Roboto font */
@RobotoFont: data-uri("../docs/static/fonts/Roboto_400_normal.woff");
/* Open Sans font */
@font-face {
font-family: 'Roboto';
src: @RobotoFont format("woff");
font-family: 'Open Sans';
font-style: normal;
font-weight: 400;
src: local('Open Sans Regular'), local('OpenSans-Regular'),
data-uri('../docs/static/fonts/Open_Sans/OpenSans-Regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
data-uri('../docs/static/fonts/Open_Sans/OpenSans-Regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
.ui.button.download-button {
@ -72,6 +74,10 @@
color: @blue;
}
.menubar .ui.item.editor-menuitem .item.toggle {
height: 45px;
}
.sandboxfooter a:not(.thin) {
color:white !important;
}
@ -82,6 +88,14 @@
text-transform: lowercase;
}
#filelist {
background: @simulatorBackground data-uri("../docs/static/backgrounds/simulator.png") 0 0 repeat !important;
}
#downloadArea {
background: white;
}
/* Mobile */
@media only screen and (max-width: @largestMobileScreen) {
#filelist {
@ -95,15 +109,15 @@
/* Small Monitor */
@media only screen and (min-width: @computerBreakpoint) and (max-width: @largestSmallMonitor) {
#filelist, #downloadArea {
border-top: 2px solid #ECF6FF;
#editortools, #downloadArea {
background: #828A95;
}
}
/* Large Monitor */
@media only screen and (min-width: @largeMonitorBreakpoint) {
#filelist, #downloadArea {
border-top: 2px solid #ECF6FF;
#editortools, #downloadArea {
background: #828A95;
}
}
/* Mobile, Tablet AND thin screen */