UI changes: fixing mobile view.

This commit is contained in:
Sam El-Husseini 2016-10-27 18:43:09 -07:00
parent 6fd18b4f4c
commit bbe93ae9a2

View File

@ -32,9 +32,8 @@
&:extend(.yellow all); &:extend(.yellow all);
} }
/* This removes the margin between the blockly categories to form connected pills */
.blocklyTreeRow { .blocklyTreeRow {
width: 230px;
border-radius:5px; border-radius:5px;
} }
@ -53,7 +52,7 @@
} }
.blocklyFlyoutBackground { .blocklyFlyoutBackground {
fill: #FDFDE2; fill: @grey;
} }
.blocklyToolboxDiv { .blocklyToolboxDiv {
@ -61,12 +60,32 @@
padding:7px; padding:7px;
} }
/* Mobile */
@media only screen and (max-width: @largestMobileScreen) { @media only screen and (max-width: @largestMobileScreen) {
.blocklyTreeLabel { .blocklyTreeLabel {
font-size: 0.5rem !important; font-size: 0.5rem !important;
} }
} }
/* 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) {
.blocklyTreeRow {
width: 230px;
}
}
/* Large Monitor */
@media only screen and (min-width: @largeMonitorBreakpoint) {
.blocklyTreeRow {
width: 230px;
}
}
/******************************* /*******************************
Menu Bar Menu Bar