2.1.28, initiation update to PXT v5.28.24 (#54)
This commit is contained in:
Amerlander
committed by
Peli de Halleux
Peli de Halleux
parent
38a964516e
commit
5c114a0c57
47
theme/blockly-toolbox.less
Normal file
47
theme/blockly-toolbox.less
Normal file
@ -0,0 +1,47 @@
|
||||
|
||||
/*******************************
|
||||
Blockly toolbox
|
||||
*******************************/
|
||||
|
||||
div.blocklyTreeRow {
|
||||
box-shadow: inset 0 -1px 0 0 #ecf0f1;
|
||||
|
||||
margin-bottom: 0px !important;
|
||||
|
||||
-webkit-transition-property: background-color; /* Safari */
|
||||
-webkit-transition-duration: 1s; /* Safari */
|
||||
transition-property: background-color;
|
||||
transition-duration: 1s;
|
||||
}
|
||||
|
||||
/* Blockly toolbox font size same as the page font */
|
||||
span.blocklyTreeLabel {
|
||||
font-family: @pageFont !important;
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
.blocklyToolboxDiv, .monacoToolboxDiv {
|
||||
background-color: white !important;
|
||||
border-left: 1px solid #ecf0f1 !important;
|
||||
box-shadow: 4px 0px 2px -4px rgba(0,0,0,0.12), 4px 0px 2px -4px rgba(0,0,0,0.24);
|
||||
}
|
||||
|
||||
/* Mobile */
|
||||
@media only screen and (max-width: @largestMobileScreen) {
|
||||
.blocklyToolboxDiv, .monacoToolboxDiv {
|
||||
border-left: 0 !important;
|
||||
}
|
||||
div.blocklyTreeRoot {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Tablet */
|
||||
@media only screen and (min-width: @tabletBreakpoint) and (max-width: @largestTabletScreen) {
|
||||
.blocklyToolboxDiv, .monacoToolboxDiv {
|
||||
border-left: 0 !important;
|
||||
}
|
||||
div.blocklyTreeRoot {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
@ -4,41 +4,19 @@
|
||||
|
||||
@import 'blockly-core';
|
||||
|
||||
/*******************************
|
||||
Blockly CSS
|
||||
*******************************/
|
||||
|
||||
/* Reference import */
|
||||
@import (reference) "semantic.less";
|
||||
|
||||
/*******************************
|
||||
Blockly
|
||||
*******************************/
|
||||
|
||||
.blocklyToolboxDiv {
|
||||
padding:7px;
|
||||
}
|
||||
|
||||
div.blocklyTreeRow {
|
||||
border-radius:8px;
|
||||
box-shadow: inset 0 -1px 0 0 #ecf0f1;
|
||||
|
||||
-webkit-transition-property: background-color; /* Safari */
|
||||
-webkit-transition-duration: 1s; /* Safari */
|
||||
transition-property: background-color;
|
||||
transition-duration: 1s;
|
||||
}
|
||||
|
||||
/* Blockly toolbox font size same as the page font */
|
||||
span.blocklyTreeLabel {
|
||||
font-family: @pageFont !important;
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
.blocklyToolboxDiv, .monacoToolboxDiv {
|
||||
border-left: 1px solid #ecf0f1 !important;
|
||||
box-shadow: 4px 0px 2px -4px rgba(0,0,0,0.12), 4px 0px 2px -4px rgba(0,0,0,0.24);
|
||||
}
|
||||
|
||||
/* Remove shadow around blockly blocks */
|
||||
.blocklyPathDark, .blocklyPathLight {
|
||||
display: none;
|
||||
text.blocklyText {
|
||||
font-weight: 600;
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: subpixel-antialiased;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
/* Blockly Field: Grid picker */
|
||||
@ -50,26 +28,8 @@ span.blocklyTreeLabel {
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.blocklyFlyoutBackground {
|
||||
fill: #42495F !important;
|
||||
}
|
||||
|
||||
/* Mobile */
|
||||
@media only screen and (max-width: @largestMobileScreen) {
|
||||
.blocklyToolboxDiv, .monacoToolboxDiv {
|
||||
border-left: 0 !important;
|
||||
}
|
||||
div.blocklyTreeRoot {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/* Tablet */
|
||||
@media only screen and (min-width: @tabletBreakpoint) and (max-width: @largestTabletScreen) {
|
||||
.blocklyToolboxDiv, .monacoToolboxDiv {
|
||||
border-left: 0 !important;
|
||||
}
|
||||
div.blocklyTreeRoot {
|
||||
padding: 0;
|
||||
}
|
||||
/* Led field editor */
|
||||
.blocklyLedOn {
|
||||
stroke: white;
|
||||
stroke-width: 1px;
|
||||
}
|
||||
@ -1,6 +1,3 @@
|
||||
/*******************************
|
||||
User Variable Overrides
|
||||
*******************************/
|
||||
|
||||
@invertedBackground: #525A67;
|
||||
@dropdownMenuDistance: 0px;
|
||||
|
||||
@ -1,15 +1,3 @@
|
||||
/*******************************
|
||||
Site Overrides
|
||||
*******************************/
|
||||
|
||||
.ui.inverted.input input {
|
||||
background:#424852;
|
||||
border-radius: 20px;
|
||||
border: 0px !important;
|
||||
padding: 0.2em !important;
|
||||
padding-left: 0.6em !important;
|
||||
}
|
||||
|
||||
.rtl .ui.inverted.input input {
|
||||
padding-right: 0.6em !important;
|
||||
}
|
||||
|
||||
@ -6,9 +6,8 @@
|
||||
|
||||
@fontName : 'Roboto Mono';
|
||||
|
||||
/*-------------------
|
||||
Site Colors
|
||||
--------------------*/
|
||||
@headerFont : 'Roboto Mono';
|
||||
@pageFont : 'Roboto Mono';
|
||||
|
||||
@primaryColor: #3CB5B5;
|
||||
@secondaryColor: #43C9C9;
|
||||
@ -27,7 +26,6 @@
|
||||
|
||||
@pageBackground : #FDFDFA;
|
||||
|
||||
|
||||
/*******************************
|
||||
PXT Overrides
|
||||
*******************************/
|
||||
@ -35,3 +33,69 @@
|
||||
@blocklyToolboxColor: #F6F4E6;
|
||||
|
||||
@blocklyFlyoutColor: #42495F;
|
||||
|
||||
/*-------------------
|
||||
Menu
|
||||
--------------------
|
||||
|
||||
@mainMenuInvertedBackground: @blue;
|
||||
@mainMenuTutorialBackground: @orange;
|
||||
|
||||
@mainMenuBlocksJsToggleColor: @primaryColor;
|
||||
|
||||
@tutorialSelectedMenuColor: @blue;
|
||||
*/
|
||||
|
||||
/*-------------------
|
||||
Layout
|
||||
--------------------
|
||||
|
||||
@sideBarWidth: 22rem;
|
||||
@simulatorWidth: 27rem;
|
||||
@simulatorWidthSmall: 20rem;
|
||||
*/
|
||||
|
||||
/*-------------------
|
||||
Background
|
||||
--------------------
|
||||
|
||||
@simulatorBackground: #FDFDFF;
|
||||
@editorToolsBackground: @simulatorBackground;
|
||||
@blocklySvgColor: #ecf0f1;
|
||||
*/
|
||||
|
||||
/*-------------------
|
||||
Side Docs
|
||||
--------------------
|
||||
|
||||
@sidedocsButtonsTop: (@mainMenuHeight + 1rem);
|
||||
@sidedocsButtonsRight: 4.25rem;
|
||||
*/
|
||||
|
||||
/*-------------------
|
||||
Editor
|
||||
--------------------
|
||||
|
||||
@blocklyToolboxColor: rgba(0, 0, 0, 0.05);
|
||||
@trashIconColor: @primaryColor;
|
||||
*/
|
||||
|
||||
|
||||
/*-------------------
|
||||
Flyout
|
||||
--------------------
|
||||
|
||||
@flyoutLabelColor: white;
|
||||
@blocklyFlyoutColor: #4b4949;
|
||||
@blocklyFlyoutColorOpacity: 1.0;
|
||||
@monacoFlyoutColor: @blocklyFlyoutColor;
|
||||
@blocklyFlyoutButtonColor: @secondaryColor;
|
||||
*/
|
||||
|
||||
/*-------------------
|
||||
Serial
|
||||
--------------------
|
||||
|
||||
@serialTextColor: black;
|
||||
@serialGraphBackground: #d9d9d9;
|
||||
*/
|
||||
@ -1,3 +1,5 @@
|
||||
/*******************************
|
||||
User Variable Overrides
|
||||
*******************************/
|
||||
|
||||
@backgroundColor: fade(@grey, 40%);
|
||||
@ -1,175 +1,3 @@
|
||||
/*******************************
|
||||
Site Overrides
|
||||
*******************************/
|
||||
|
||||
|
||||
/*--------------
|
||||
Rotate In
|
||||
---------------*/
|
||||
|
||||
/* Inward */
|
||||
.transition.rotate {
|
||||
animation-duration: 0.6s;
|
||||
transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000);
|
||||
}
|
||||
.transition.rotate.in {
|
||||
animation-name: rotateIn;
|
||||
}
|
||||
.transition[class*="rotate down left"].in {
|
||||
animation-name: rotateInDownLeft;
|
||||
}
|
||||
.transition[class*="rotate down right"].in {
|
||||
animation-name: rotateInDownRight;
|
||||
}
|
||||
.transition[class*="rotate up left"].in {
|
||||
animation-name: rotateInUpLeft;
|
||||
}
|
||||
.transition[class*="rotate up right"].in {
|
||||
animation-name: rotateInUpRight;
|
||||
}
|
||||
|
||||
/* Outward */
|
||||
.transition.rotate.out {
|
||||
animation-name: rotateOut;
|
||||
}
|
||||
.transition[class*="rotate down left"].out {
|
||||
animation-name: rotateOutDownLeft;
|
||||
}
|
||||
.transition[class*="rotate down right"].out {
|
||||
animation-name: rotateOutDownRight;
|
||||
}
|
||||
.transition[class*="rotate up left"].out {
|
||||
animation-name: rotateOutUpLeft;
|
||||
}
|
||||
.transition[class*="rotate up right"].out {
|
||||
animation-name: rotateOutUpRight;
|
||||
}
|
||||
|
||||
/* In */
|
||||
@keyframes rotateIn {
|
||||
from {
|
||||
transform-origin: center;
|
||||
transform: rotate3d(0, 0, 1, -200deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
to {
|
||||
transform-origin: center;
|
||||
transform: none;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes rotateInDownLeft {
|
||||
from {
|
||||
transform-origin: left bottom;
|
||||
transform: rotate3d(0, 0, 1, -45deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
to {
|
||||
transform-origin: left bottom;
|
||||
transform: none;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes rotateInDownRight {
|
||||
from {
|
||||
transform-origin: right bottom;
|
||||
transform: rotate3d(0, 0, 1, 45deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
to {
|
||||
transform-origin: right bottom;
|
||||
transform: none;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes rotateInUpLeft {
|
||||
from {
|
||||
transform-origin: left bottom;
|
||||
transform: rotate3d(0, 0, 1, 45deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
to {
|
||||
transform-origin: left bottom;
|
||||
transform: none;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes rotateInUpRight {
|
||||
from {
|
||||
transform-origin: right bottom;
|
||||
transform: rotate3d(0, 0, 1, -90deg);
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
to {
|
||||
transform-origin: right bottom;
|
||||
transform: none;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
/* Out */
|
||||
@keyframes rotateOut {
|
||||
from {
|
||||
transform-origin: center;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
to {
|
||||
transform-origin: center;
|
||||
transform: rotate3d(0, 0, 1, 200deg);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rotateOutDownLeft {
|
||||
from {
|
||||
transform-origin: left bottom;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
to {
|
||||
transform-origin: left bottom;
|
||||
transform: rotate3d(0, 0, 1, 45deg);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rotateOutDownRight {
|
||||
from {
|
||||
transform-origin: right bottom;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
to {
|
||||
transform-origin: right bottom;
|
||||
transform: rotate3d(0, 0, 1, -45deg);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rotateOutUpLeft {
|
||||
from {
|
||||
transform-origin: left bottom;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
to {
|
||||
transform-origin: left bottom;
|
||||
transform: rotate3d(0, 0, 1, -45deg);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes rotateOutUpRight {
|
||||
from {
|
||||
transform-origin: right bottom;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
to {
|
||||
transform-origin: right bottom;
|
||||
transform: rotate3d(0, 0, 1, 90deg);
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@ -1,3 +0,0 @@
|
||||
/*******************************
|
||||
Site Overrides
|
||||
*******************************/
|
||||
100
theme/style.less
100
theme/style.less
@ -1,10 +1,10 @@
|
||||
/* Import all components */
|
||||
@import 'semantic';
|
||||
@import 'pxtsemantic';
|
||||
@import 'pxt';
|
||||
@import 'blockly-toolbox';
|
||||
@import 'themes/default/globals/site.variables';
|
||||
@import 'themes/pxt/globals/site.variables';
|
||||
@import 'site/globals/site.variables';
|
||||
@import 'themes/default/collections/menu.variables';
|
||||
|
||||
/* Reference import */
|
||||
@import (reference) "semantic.less";
|
||||
@ -12,62 +12,66 @@
|
||||
/*******************************
|
||||
Add your custom CSS here
|
||||
*******************************/
|
||||
/* not relevant in new UI
|
||||
.openproject {
|
||||
background: #4ECC60 !important;
|
||||
} */
|
||||
|
||||
.blocks-menuitem.active, .javascript-menuitem.active {
|
||||
background: #738791 !important;
|
||||
/* Roboto font */
|
||||
@RobotoFont: data-uri("../docs/static/fonts/Roboto_400_normal.woff");
|
||||
|
||||
@font-face {
|
||||
font-family: 'Roboto';
|
||||
src: @RobotoFont format("woff");
|
||||
}
|
||||
|
||||
/* not relevant in new UI
|
||||
.help-dropdown-menuitem, .more-dropdown-menuitem {
|
||||
background: #424955 !important;
|
||||
margin-right:0px !important;
|
||||
} */
|
||||
|
||||
.huge.download-button i {
|
||||
display:none !important; // otherwise spans 2 lines
|
||||
.ui.button.download-button {
|
||||
&:extend(.ui.purple.button all);
|
||||
}
|
||||
|
||||
.play-button {
|
||||
&:extend(.ui all);
|
||||
&:extend(.button all);
|
||||
&:extend(.blue all);
|
||||
.ui.button.download-button:hover {
|
||||
background-color: #30a7a7;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.download-button {
|
||||
&:extend(.ui all);
|
||||
&:extend(.button all);
|
||||
&:extend(.yellow all);
|
||||
.docs.inlinebutton.ui.button.download-button:hover {
|
||||
&:extend(.ui.purple.button all);
|
||||
}
|
||||
|
||||
#filelist .menu {
|
||||
width: 100%;
|
||||
.ui.button.play-button.play-button-full {
|
||||
&:extend(.ui.inverted.button all);
|
||||
}
|
||||
|
||||
.ui.button.getting-started-btn {
|
||||
&:extend(.ui.orange.button all);
|
||||
}
|
||||
|
||||
.ui.button.editortools-btn {
|
||||
&:extend(.ui.blue.button all);
|
||||
}
|
||||
|
||||
.ui.button.exit-tutorial-btn {
|
||||
&:extend(.ui.blue.button all);
|
||||
}
|
||||
|
||||
#filelist, #editortools {
|
||||
background: #fff data-uri("../docs/static/logo_texture.png") 0 0 repeat !important;
|
||||
}
|
||||
|
||||
#downloadArea {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
.organization {
|
||||
top: 1.6em;
|
||||
}
|
||||
|
||||
/* Mobile */
|
||||
@media only screen and (max-width: @largestMobileScreen) {
|
||||
.blocklyTreeLabel {
|
||||
font-size: 0.5rem !important;
|
||||
.ui.home {
|
||||
.getting-started-segment {
|
||||
background-position: 50% 25%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/* Mobile */
|
||||
@media only screen and (max-width: @largestMobileScreen) {
|
||||
#filelist {
|
||||
background: transparent !important;
|
||||
}
|
||||
#blocklySearchArea {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Tablet */
|
||||
@ -84,3 +88,29 @@
|
||||
/* Large Monitor */
|
||||
@media only screen and (min-width: @largeMonitorBreakpoint) {
|
||||
}
|
||||
|
||||
|
||||
/* Download dialog */
|
||||
.ui.downloaddialog.modal>.content {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.ui.webusbpair, .ui.upload {
|
||||
.firmware {
|
||||
background-color: #FFFFCE;
|
||||
div.image {
|
||||
justify-content: center;
|
||||
display: flex;
|
||||
padding: 1rem;
|
||||
|
||||
img {
|
||||
height:100px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.instructions {
|
||||
img {
|
||||
margin-bottom:1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -39,38 +39,38 @@
|
||||
@step : 'pxt';
|
||||
|
||||
/* Collections */
|
||||
@breadcrumb : 'default';
|
||||
@form : 'default';
|
||||
@breadcrumb : 'pxt';
|
||||
@form : 'pxt';
|
||||
@grid : 'pxt';
|
||||
@menu : 'pxt';
|
||||
@message : 'pxt';
|
||||
@table : 'default';
|
||||
@table : 'pxt';
|
||||
|
||||
/* Modules */
|
||||
@accordion : 'default';
|
||||
@checkbox : 'default';
|
||||
@accordion : 'pxt';
|
||||
@checkbox : 'pxt';
|
||||
@dimmer : 'pxt';
|
||||
@dropdown : 'default';
|
||||
@embed : 'default';
|
||||
@dropdown : 'pxt';
|
||||
@embed : 'pxt';
|
||||
@modal : 'pxt';
|
||||
@nag : 'default';
|
||||
@popup : 'default';
|
||||
@progress : 'default';
|
||||
@rating : 'default';
|
||||
@search : 'default';
|
||||
@shape : 'default';
|
||||
@sidebar : 'default';
|
||||
@sticky : 'default';
|
||||
@tab : 'default';
|
||||
@nag : 'pxt';
|
||||
@popup : 'pxt';
|
||||
@progress : 'pxt';
|
||||
@rating : 'pxt';
|
||||
@search : 'pxt';
|
||||
@shape : 'pxt';
|
||||
@sidebar : 'pxt';
|
||||
@sticky : 'pxt';
|
||||
@tab : 'pxt';
|
||||
@transition : 'default';
|
||||
|
||||
/* Views */
|
||||
@ad : 'default';
|
||||
@ad : 'pxt';
|
||||
@card : 'pxt';
|
||||
@comment : 'default';
|
||||
@feed : 'default';
|
||||
@item : 'default';
|
||||
@statistic : 'default';
|
||||
@comment : 'pxt';
|
||||
@feed : 'pxt';
|
||||
@item : 'pxt';
|
||||
@statistic : 'pxt';
|
||||
|
||||
/*******************************
|
||||
Folders
|
||||
@ -91,9 +91,4 @@
|
||||
|
||||
@fontPath : 'fonts';
|
||||
|
||||
/*
|
||||
@headerFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
||||
@pageFont : 'Segoe UI', 'Helvetica Neue', Arial, Helvetica, sans-serif;
|
||||
*/
|
||||
|
||||
/* End Config */
|
||||
/* End Config */
|
||||
Reference in New Issue
Block a user