Michel2/pybricks-api
1
0
Fork 0
mirror of https://github.com/pybricks/pybricks-api.git synced 2026-07-28 04:07:46 +00:00
Code Issues Releases Activity

blocks: Experiment with block documentation.

Browse Source
This commit is contained in:
Laurens Valk
2023-11-28 15:06:35 +01:00
parent 68e5dbd6d2
commit 4d864737ae
12 changed files with 5921 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
doc/common/_static/css/blocks.css
+3
View File
@@ -0,0 +1,3 @@
.block-image {
margin-top: 10px;
}
doc/common/conf.py
+1
View File
@@ -57,6 +57,7 @@ extensions = [
"sphinx.ext.todo",
"sphinx.ext.mathjax",
# Custom Pybricks extensions
"blockimg",
"color",
"classlink",
"requirements",
doc/common/extensions/blockimg.py
+55
View File
@@ -0,0 +1,55 @@
import os
import xml.etree.ElementTree as ET
from docutils.parsers.rst import directives
from docutils.parsers.rst.directives.images import Image
from docutils.nodes import image, paragraph
from pathlib import Path
SPHINX_DOC = "main"
SPHINX_IMAGE_PATH = "blockimg"
SVG_SCALE = 0.9
def get_svg_size(file_path):
tree = ET.parse(file_path)
root = tree.getroot()
width = root.attrib.get("width")
height = root.attrib.get("height")
return float(width), float(height)
class BlockImageDirective(Image):
option_spec = Image.option_spec.copy()
option_spec["stack"] = directives.flag
def run(self):
# Adjust the image path
file_name = self.arguments[0] + ".svg"
self.arguments[0] = "/" + SPHINX_IMAGE_PATH + "/" + file_name
path = Path(os.getcwd()) / SPHINX_DOC / SPHINX_IMAGE_PATH / file_name
# Set it to the scaled SVG size unless width explicitly set.
if self.options.get("width") is None:
width, height = get_svg_size(path)
self.options["width"] = str(round(width * SVG_SCALE)) + "px"
self.options["height"] = str(round(height * SVG_SCALE)) + "px"
# Call the parent class's run method
nodes = super().run()
# Wrap each image node in a paragraph node
for i, node in enumerate(nodes):
if isinstance(node, image):
if "stack" not in self.options:
node["classes"].append("block-image")
nodes[i] = paragraph("", "", node)
return nodes
def setup(app):
app.add_directive("blockimg", BlockImageDirective)
doc/main/blockimg/LICENSE
+1
View File
@@ -0,0 +1 @@
Copyright (c) 2023 The Pybricks Authors - All rights reserved
doc/main/blockimg/pybricks_blockLightOnColor_primehub_off.svg
+974
View File
File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 25 KiB

doc/main/blockimg/pybricks_blockLightOnColor_primehub_on.svg
+974
View File
File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 27 KiB

doc/main/blockimg/pybricks_variables_set_inventor_hub_option0.svg
+974
View File
@@ -0,0 +1,974 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 197.6828125 52" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="197.6828125" height="52" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
fill: #fff;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
fill: #fff;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
fill: #575E75;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
fill: #575E75;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
fill: #575E75;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
.blocklyEditableText:not(.editing):hover&gt;rect,
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
.blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
stroke: #fff;
stroke-width: 2;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
font-weight: bold;
color: #575E75;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
fill: #fff !important;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
color: #fff;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
stroke: #ffffff;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
fill: url(#blocklyDisabledPattern748770991415654)
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
fill-opacity: 0.2;
stroke: none;
}
.blocklySvg {
background-color: #fff;
outline: none;
overflow: hidden; /* IE overflows by default. */
position: absolute;
display: block;
}
.blocklyWidgetDiv {
display: none;
position: absolute;
z-index: 99999; /* big value for bootstrap3 compatibility */
}
.injectionDiv {
height: 100%;
position: relative;
overflow: hidden; /* So blocks in drag surface disappear at edges */
touch-action: none;
}
.blocklyNonSelectable {
user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
}
.blocklyBlockCanvas.blocklyCanvasTransitioning,
.blocklyBubbleCanvas.blocklyCanvasTransitioning {
transition: transform .5s;
}
.blocklyTooltipDiv {
background-color: #ffffc7;
border: 1px solid #ddc;
box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
color: #000;
display: none;
font: 9pt sans-serif;
opacity: .9;
padding: 2px;
position: absolute;
z-index: 100000; /* big value for bootstrap3 compatibility */
}
.blocklyDropDownDiv {
position: absolute;
left: 0;
top: 0;
z-index: 1000;
display: none;
border: 1px solid;
border-color: #dadce0;
background-color: #fff;
border-radius: 2px;
padding: 4px;
box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
}
.blocklyDropDownDiv.blocklyFocused {
box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
}
.blocklyDropDownContent {
max-height: 300px; /* @todo: spec for maximum height. */
overflow: auto;
overflow-x: hidden;
position: relative;
}
.blocklyDropDownArrow {
position: absolute;
left: 0;
top: 0;
width: 16px;
height: 16px;
z-index: -1;
background-color: inherit;
border-color: inherit;
}
.blocklyDropDownButton {
display: inline-block;
float: left;
padding: 0;
margin: 4px;
border-radius: 4px;
outline: none;
border: 1px solid;
transition: box-shadow .1s;
cursor: pointer;
}
.blocklyArrowTop {
border-top: 1px solid;
border-left: 1px solid;
border-top-left-radius: 4px;
border-color: inherit;
}
.blocklyArrowBottom {
border-bottom: 1px solid;
border-right: 1px solid;
border-bottom-right-radius: 4px;
border-color: inherit;
}
.blocklyResizeSE {
cursor: se-resize;
fill: #aaa;
}
.blocklyResizeSW {
cursor: sw-resize;
fill: #aaa;
}
.blocklyResizeLine {
stroke: #515A5A;
stroke-width: 1;
}
.blocklyHighlightedConnectionPath {
fill: none;
stroke: #fc3;
stroke-width: 4px;
}
.blocklyPathLight {
fill: none;
stroke-linecap: round;
stroke-width: 1;
}
.blocklySelected&gt;.blocklyPathLight {
display: none;
}
.blocklyDraggable {
cursor: grab;
cursor: -webkit-grab;
}
.blocklyDragging {
cursor: grabbing;
cursor: -webkit-grabbing;
}
/* Changes cursor on mouse down. Not effective in Firefox because of
https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
.blocklyDraggable:active {
cursor: grabbing;
cursor: -webkit-grabbing;
}
.blocklyDragging.blocklyDraggingDelete {
cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
}
.blocklyDragging&gt;.blocklyPath,
.blocklyDragging&gt;.blocklyPathLight {
fill-opacity: .8;
stroke-opacity: .8;
}
.blocklyDragging&gt;.blocklyPathDark {
display: none;
}
.blocklyDisabled&gt;.blocklyPath {
fill-opacity: .5;
stroke-opacity: .5;
}
.blocklyDisabled&gt;.blocklyPathLight,
.blocklyDisabled&gt;.blocklyPathDark {
display: none;
}
.blocklyInsertionMarker&gt;.blocklyPath,
.blocklyInsertionMarker&gt;.blocklyPathLight,
.blocklyInsertionMarker&gt;.blocklyPathDark {
fill-opacity: .2;
stroke: none;
}
.blocklyMultilineText {
font-family: monospace;
}
.blocklyNonEditableText&gt;text {
pointer-events: none;
}
.blocklyFlyout {
position: absolute;
z-index: 20;
}
.blocklyText text {
cursor: default;
}
/*
Don't allow users to select text. It gets annoying when trying to
drag a block and selected text moves instead.
*/
.blocklySvg text {
user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
cursor: inherit;
}
.blocklyHidden {
display: none;
}
.blocklyFieldDropdown:not(.blocklyHidden) {
display: block;
}
.blocklyIconGroup {
cursor: default;
}
.blocklyIconGroup:not(:hover),
.blocklyIconGroupReadonly {
opacity: .6;
}
.blocklyIconShape {
fill: #00f;
stroke: #fff;
stroke-width: 1px;
}
.blocklyIconSymbol {
fill: #fff;
}
.blocklyMinimalBody {
margin: 0;
padding: 0;
}
.blocklyHtmlInput {
border: none;
border-radius: 4px;
height: 100%;
margin: 0;
outline: none;
padding: 0;
width: 100%;
text-align: center;
display: block;
box-sizing: border-box;
}
/* Remove the increase and decrease arrows on the field number editor */
input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
input[type=number] {
-moz-appearance: textfield;
}
.blocklyMainBackground {
stroke-width: 1;
stroke: #c6c6c6; /* Equates to #ddd due to border being off-pixel. */
}
.blocklyMutatorBackground {
fill: #fff;
stroke: #ddd;
stroke-width: 1;
}
.blocklyFlyoutBackground {
fill: #ddd;
fill-opacity: .8;
}
.blocklyMainWorkspaceScrollbar {
z-index: 20;
}
.blocklyFlyoutScrollbar {
z-index: 30;
}
.blocklyScrollbarHorizontal,
.blocklyScrollbarVertical {
position: absolute;
outline: none;
}
.blocklyScrollbarBackground {
opacity: 0;
}
.blocklyScrollbarHandle {
fill: #ccc;
}
.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
.blocklyScrollbarHandle:hover {
fill: #bbb;
}
/* Darken flyout scrollbars due to being on a grey background. */
/* By contrast, workspace scrollbars are on a white background. */
.blocklyFlyout .blocklyScrollbarHandle {
fill: #bbb;
}
.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
.blocklyFlyout .blocklyScrollbarHandle:hover {
fill: #aaa;
}
.blocklyInvalidInput {
background: #faa;
}
.blocklyVerticalMarker {
stroke-width: 3px;
fill: rgba(255,255,255,.5);
pointer-events: none;
}
.blocklyComputeCanvas {
position: absolute;
width: 0;
height: 0;
}
.blocklyNoPointerEvents {
pointer-events: none;
}
.blocklyContextMenu {
border-radius: 4px;
max-height: 100%;
}
.blocklyDropdownMenu {
border-radius: 2px;
padding: 0 !important;
}
.blocklyDropdownMenu .blocklyMenuItem {
/* 28px on the left for icon or checkbox. */
padding-left: 28px;
}
/* BiDi override for the resting state. */
.blocklyDropdownMenu .blocklyMenuItemRtl {
/* Flip left/right padding for BiDi. */
padding-left: 5px;
padding-right: 28px;
}
.blocklyWidgetDiv .blocklyMenu {
background: #fff;
border: 1px solid transparent;
box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
font: normal 13px Arial, sans-serif;
margin: 0;
outline: none;
padding: 4px 0;
position: absolute;
overflow-y: auto;
overflow-x: hidden;
max-height: 100%;
z-index: 20000; /* Arbitrary, but some apps depend on it... */
}
.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
}
.blocklyDropDownDiv .blocklyMenu {
background: inherit; /* Compatibility with gapi, reset from goog-menu */
border: inherit; /* Compatibility with gapi, reset from goog-menu */
font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
outline: none;
position: relative; /* Compatibility with gapi, reset from goog-menu */
z-index: 20000; /* Arbitrary, but some apps depend on it... */
}
/* State: resting. */
.blocklyMenuItem {
border: none;
color: #000;
cursor: pointer;
list-style: none;
margin: 0;
/* 7em on the right for shortcut. */
min-width: 7em;
padding: 6px 15px;
white-space: nowrap;
}
/* State: disabled. */
.blocklyMenuItemDisabled {
color: #ccc;
cursor: inherit;
}
/* State: hover. */
.blocklyMenuItemHighlight {
background-color: rgba(0,0,0,.1);
}
/* State: selected/checked. */
.blocklyMenuItemCheckbox {
height: 16px;
position: absolute;
width: 16px;
}
.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
float: left;
margin-left: -24px;
position: static; /* Scroll with the menu. */
}
.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
float: right;
margin-right: -24px;
}
.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
opacity: .4;
}
.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
opacity: .6;
}
.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
opacity: .8;
}
.blocklyCommentForeignObject {
position: relative;
z-index: 0;
}
.blocklyCommentRect {
fill: #E7DE8E;
stroke: #bcA903;
stroke-width: 1px;
}
.blocklyCommentTarget {
fill: transparent;
stroke: #bcA903;
}
.blocklyCommentTargetFocused {
fill: none;
}
.blocklyCommentHandleTarget {
fill: none;
}
.blocklyCommentHandleTargetFocused {
fill: transparent;
}
.blocklyFocused&gt;.blocklyCommentRect {
fill: #B9B272;
stroke: #B9B272;
}
.blocklySelected&gt;.blocklyCommentTarget {
stroke: #fc3;
stroke-width: 3px;
}
.blocklyCommentDeleteIcon {
cursor: pointer;
fill: #000;
display: none;
}
.blocklySelected &gt; .blocklyCommentDeleteIcon {
display: block;
}
.blocklyDeleteIconShape {
fill: #000;
stroke: #000;
stroke-width: 1px;
}
.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
stroke: #fc3;
}
.blocklyCommentTextarea {
background-color: #fef49c;
border: 0;
display: block;
margin: 0;
outline: 0;
padding: 3px;
resize: none;
text-overflow: hidden;
}
.blocklyAngleCircle {
stroke: #444;
stroke-width: 1;
fill: #ddd;
fill-opacity: 0.8;
}
.blocklyAngleMarks {
stroke: #444;
stroke-width: 1;
}
.blocklyAngleGauge {
fill: #f88;
fill-opacity: 0.8;
pointer-events: none;
}
.blocklyAngleLine {
stroke: #f00;
stroke-width: 2;
stroke-linecap: round;
pointer-events: none;
}
.blocklyColourTable {
border-collapse: collapse;
display: block;
outline: none;
padding: 1px;
}
.blocklyColourTable&gt;tr&gt;td {
border: 0.5px solid #888;
box-sizing: border-box;
cursor: pointer;
display: inline-block;
height: 20px;
padding: 0;
width: 20px;
}
.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
border-color: #eee;
box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
position: relative;
}
.blocklyColourSelected, .blocklyColourSelected:hover {
border-color: #eee !important;
outline: 1px solid #333;
position: relative;
}
.blocklyHtmlTextAreaInput {
font-family: monospace;
resize: none;
overflow: hidden;
height: 100%;
text-align: left;
}
.blocklyHtmlTextAreaInputOverflowedY {
overflow-y: scroll;
}
.blocklyFlyoutButton {
fill: #888;
cursor: default;
}
.blocklyFlyoutButtonShadow {
fill: #666;
}
.blocklyFlyoutButton:hover {
fill: #aaa;
}
.blocklyFlyoutLabel {
cursor: default;
}
.blocklyFlyoutLabelBackground {
opacity: 0;
}
.blocklyTreeRow:not(.blocklyTreeSelected):hover {
background-color: rgba(255, 255, 255, .2);
}
.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
margin: 1px 5px 1px 0;
}
.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
margin: 1px 0 1px 5px;
}
.blocklyTreeRow {
height: 22px;
line-height: 22px;
margin-bottom: 3px;
padding-right: 8px;
white-space: nowrap;
}
.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
margin-left: 8px;
padding-right: 0;
}
.blocklyTreeIcon {
background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
height: 16px;
vertical-align: middle;
visibility: hidden;
width: 16px;
}
.blocklyTreeIconClosed {
background-position: -32px -1px;
}
.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
background-position: 0 -1px;
}
.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
background-position: -32px -17px;
}
.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
background-position: 0 -17px;
}
.blocklyTreeIconOpen {
background-position: -16px -1px;
}
.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
background-position: -16px -17px;
}
.blocklyTreeLabel {
cursor: default;
font: 16px sans-serif;
padding: 0 3px;
vertical-align: middle;
}
.blocklyToolboxDelete .blocklyTreeLabel {
cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
}
.blocklyTreeSelected .blocklyTreeLabel {
color: #fff;
}
.blocklyTreeSeparator {
border-bottom: solid #e5e5e5 1px;
height: 0;
margin: 5px 0;
}
.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
border-right: solid #e5e5e5 1px;
border-bottom: none;
height: auto;
margin: 0 5px 0 5px;
padding: 5px 0;
width: 0;
}
.blocklyToolboxDelete {
cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
}
.blocklyToolboxGrab {
cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
cursor: grabbing;
cursor: -webkit-grabbing;
}
/* Category tree in Toolbox. */
.blocklyToolboxDiv {
background-color: #ddd;
overflow-x: visible;
overflow-y: auto;
padding: 4px 0 4px 0;
position: absolute;
z-index: 70; /* so blocks go under toolbox when dragging */
-webkit-tap-highlight-color: transparent; /* issue #1345 */
}
.blocklyToolboxContents {
display: flex;
flex-wrap: wrap;
flex-direction: column;
}
.blocklyToolboxContents:focus {
outline: none;
}
.blocklyColourTable {
border-collapse: collapse;
display: block;
outline: none;
padding: 1px;
}
.blocklyColourTable&gt;tr&gt;td {
border: 0.5px solid #888;
box-sizing: border-box;
cursor: pointer;
display: inline-block;
height: 20px;
padding: 0;
width: 20px;
}
.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
border-color: #eee;
box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
position: relative;
}
.blocklyColourSelected, .blocklyColourSelected:hover {
border-color: #eee !important;
outline: 1px solid #333;
position: relative;
}
.fieldColourSliderContainer {
padding: 4px;
}
.fieldColourSliderContainer hr {
border: none;
border-top: 1px solid #bbb;
}
.fieldColourSliderLabel {
display: flex;
justify-content: space-between;
font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
}
.fieldColourEyedropper {
appearance: none;
position: relative;
border: none;
border-radius: 4px;
background: transparent;
font: inherit;
color: inherit;
cursor: pointer;
width: 100%;
margin: 0;
display: flex;
justify-content: center;
align-items: center;
}
.fieldColourEyedropper:hover {
background: rgba(0,0,0,0.1)
}
.fieldColourEyedropper input {
opacity: 0;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.fieldColourEyedropper::before {
content: "Eyedropper";
}
.fieldColourEyedropper::after {
content: "";
margin-left: 8px;
width: 24px;
height: 24px;
background: currentColor;
pointer-events: none;
-webkit-mask-image: var(--customize-dial-symbol);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
mask-image: var(--customize-dial-symbol);
mask-repeat: no-repeat;
mask-position: center;
--customize-dial-symbol: url('data:image/svg+xml, &lt;svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24"&gt; &lt;path stroke="black" strokewidth="1.414" fill="none" d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22 Q 6 21 9 18 L 16 11"/&gt; &lt;path fill="black" d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt; &lt;/svg&gt;');
}
.fieldColourSlider {
-webkit-appearance: none;
width: 150px;
height: 24px;
margin: 4px 8px 24px 8px;
padding: 0;
}
.fieldColourSlider:last-child {
margin-bottom: 4px;
}
.fieldColourSlider:focus {
outline: none;
}
/* Webkit */
.fieldColourSlider::-webkit-slider-runnable-track {
background: var(--slider-track-background);
border-radius: 8px;
height: 16px;
}
.fieldColourSlider::-webkit-slider-thumb {
-webkit-appearance: none;
background: #fff;
border-radius: 50%;
box-shadow: 0 0 0 4px rgba(0,0,0,.15);
cursor: pointer;
width: 24px;
height: 24px;
margin-top: -4px;
}
/* Firefox */
.fieldColourSlider::-moz-range-track {
background: var(--slider-track-background);
border-radius: 8px;
height: 16px;
}
.fieldColourSlider::-moz-range-thumb {
background: #fff;
border: none;
border-radius: 50%;
box-shadow: 0 0 0 4px rgba(0,0,0,.15);
cursor: pointer;
width: 24px;
height: 24px;
}
.fieldColourSlider::-moz-focus-outer {
/* override the focus border style */
border: 0;
}
/* IE */
.fieldColourSlider::-ms-track {
background: var(--slider-track-background);
border-radius: 12px;
width: 100%;
height: 24px;
/* remove default tick marks */
color: transparent;
}
.fieldColourSlider::-ms-fill-lower {
background: transparent;
}
.fieldColourSlider::-ms-fill-upper {
background: transparent;
}
.fieldColourSlider::-ms-thumb {
background: #fff;
border: none;
border-radius: 50%;
box-shadow: 0 0 0 4px rgba(0,0,0,.15);
cursor: pointer;
width: 24px;
height: 24px;
}
.controlsIconStyle {
opacity: 0.2;
}
.controlsIconStyle:hover {
opacity: 0.4;
}
.controlsIconStyle:active {
opacity: 0.6;
}
.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
opacity: .2;
}
.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
opacity: .4;
}
.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
opacity: .6;
}
</style><g transform="translate(1, 5)"><g data-id="]$aII2HX{(#Y(/DZ#MX?" class="blocklyDraggable"><path class="blocklyPath" stroke="#3971bf" fill="#4c97ff" d=" m 0,0 m 0,4 a 4 4 0 0,1 4,-4 h 5 l 0,-4 10,0 0,4 10,0 0,-4 10,0 0,4 h 152.6828125 a 4 4 0 0,1 4,4 v 6 V 38 V 40 V 40 a 4 4 0 0,1 -4,4 h -152.6828125 l 0,-4 -10,0 0,4 -10,0 0,-4 -10,0 0,4 h -5 a 4 4 0 0,1 -4,-4 z&#10;"/><g transform="translate(8,6.5)"><image height="30px" width="28.8px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8Zz4KPHJlY3QgeD0iMy41ODM0IiB5PSIuMDgzNDQ5IiB3aWR0aD0iMTcuOCIgaGVpZ2h0PSIyNC44IiByeD0iMS45NzY0IiByeT0iMS45NzY0IiBmaWxsPSIjZjRmNGY0IiBzdHJva2U9IiMxYjI5MzMiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiIHN0cm9rZS13aWR0aD0iLjIiLz4KPGNpcmNsZSBjeD0iMTIuNSIgY3k9IjIwLjUzMyIgcj0iMi40NSIgZmlsbD0iIzgzOWJmZiIgc3Ryb2tlPSIjMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iLjEiLz4KPGcgdHJhbnNmb3JtPSJtYXRyaXgoMS4xOTk5IDAgMCAxLjE5OTkgLTIuNDk5NiAtMS40MDkpIiBmaWxsPSIjZmZkZTAwIiBzdHJva2Utd2lkdGg9Ii44MzMzNyI+CjxyZWN0IHg9IjcuNSIgeT0iNC4wMDA1IiB3aWR0aD0iMyIgaGVpZ2h0PSIzIi8+CjxyZWN0IHg9IjExIiB5PSI0IiB3aWR0aD0iMyIgaGVpZ2h0PSIzIi8+CjxyZWN0IHg9IjE0LjUiIHk9IjQuMDAwNSIgd2lkdGg9IjMiIGhlaWdodD0iMyIvPgo8cmVjdCB4PSI3LjUiIHk9IjcuNTAwNSIgd2lkdGg9IjMiIGhlaWdodD0iMyIvPgo8cmVjdCB4PSIxMSIgeT0iNy41IiB3aWR0aD0iMyIgaGVpZ2h0PSIzIi8+CjxyZWN0IHg9IjE0LjUiIHk9IjcuNTAwNSIgd2lkdGg9IjMiIGhlaWdodD0iMyIvPgo8cmVjdCB4PSI3LjUiIHk9IjExIiB3aWR0aD0iMyIgaGVpZ2h0PSIzIi8+CjxyZWN0IHg9IjExIiB5PSIxMSIgd2lkdGg9IjMiIGhlaWdodD0iMyIvPgo8cmVjdCB4PSIxNC41IiB5PSIxMSIgd2lkdGg9IjMiIGhlaWdodD0iMyIvPgo8L2c+CjwvZz4KICA8L2c+Cjwvc3ZnPg=="/></g><g transform="translate(44.8,6.5)"><image height="30px" width="2px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0wLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g class="blocklyEditableText" transform="translate(54.8,7.4)" style="cursor: text;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="112.8828125" class="blocklyFieldRect" stroke="#3971bf" style="display: block; fill: rgb(65, 128, 217);"/><text class="blocklyText" dominant-baseline="central" style="fill: rgb(255, 255, 255);" x="8" y="14.6">inventor hub</text></g><g transform="translate(175.6828125,6.5)"><image height="30px" width="12px" alt="" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxMiAzMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCBkPSJtMi40NzM4IDUuNzk2OCA3LjUwOTYgOS40MDI3LTcuNTA5NiA5LjQwMjciIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjQiLz4KICA8L2c+Cjwvc3ZnPg==" style="cursor: pointer;"/></g></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 23 KiB

doc/main/blockimg/pybricks_variables_set_inventor_hub_option3.svg
+974
View File
File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

doc/main/blockimg/pybricks_variables_set_prime_hub_option0.svg
+974
View File
@@ -0,0 +1,974 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 178.1359375 52" class="blocklySvg pybricks_renderer-renderer pybricks-zelos-light-theme" width="178.1359375" height="52" style="background-color: transparent"><style xmlns="http://www.w3.org/1999/xhtml">.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText,
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
font: bold 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText {
fill: #fff;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;rect:not(.blocklyDropdownRect),
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;rect:not(.blocklyDropdownRect) {
fill: #fff;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;text,
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;text,
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyNonEditableText&gt;g&gt;text,
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyEditableText&gt;g&gt;text {
fill: #575E75;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyFlyoutLabelText {
fill: #575E75;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyText.blocklyBubbleText {
fill: #575E75;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
.blocklyEditableText:not(.editing):hover&gt;rect,
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDraggable:not(.blocklyDisabled)
.blocklyEditableText:not(.editing):hover&gt;.blocklyPath {
stroke: #fff;
stroke-width: 2;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHtmlInput {
font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
font-weight: bold;
color: #575E75;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDropdownText {
fill: #fff !important;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyWidgetDiv .goog-menuitem,
.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem {
font-family: "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme.blocklyDropDownDiv .goog-menuitem-content {
color: #fff;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyHighlightedConnectionPath {
stroke: #ffffff;
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyDisabled &gt; .blocklyOutlinePath {
fill: url(#blocklyDisabledPattern748770991415654)
}
.pybricks_renderer-renderer.pybricks-zelos-light-theme .blocklyInsertionMarker&gt;.blocklyPath {
fill-opacity: 0.2;
stroke: none;
}
.blocklySvg {
background-color: #fff;
outline: none;
overflow: hidden; /* IE overflows by default. */
position: absolute;
display: block;
}
.blocklyWidgetDiv {
display: none;
position: absolute;
z-index: 99999; /* big value for bootstrap3 compatibility */
}
.injectionDiv {
height: 100%;
position: relative;
overflow: hidden; /* So blocks in drag surface disappear at edges */
touch-action: none;
}
.blocklyNonSelectable {
user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
}
.blocklyBlockCanvas.blocklyCanvasTransitioning,
.blocklyBubbleCanvas.blocklyCanvasTransitioning {
transition: transform .5s;
}
.blocklyTooltipDiv {
background-color: #ffffc7;
border: 1px solid #ddc;
box-shadow: 4px 4px 20px 1px rgba(0,0,0,.15);
color: #000;
display: none;
font: 9pt sans-serif;
opacity: .9;
padding: 2px;
position: absolute;
z-index: 100000; /* big value for bootstrap3 compatibility */
}
.blocklyDropDownDiv {
position: absolute;
left: 0;
top: 0;
z-index: 1000;
display: none;
border: 1px solid;
border-color: #dadce0;
background-color: #fff;
border-radius: 2px;
padding: 4px;
box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
}
.blocklyDropDownDiv.blocklyFocused {
box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
}
.blocklyDropDownContent {
max-height: 300px; /* @todo: spec for maximum height. */
overflow: auto;
overflow-x: hidden;
position: relative;
}
.blocklyDropDownArrow {
position: absolute;
left: 0;
top: 0;
width: 16px;
height: 16px;
z-index: -1;
background-color: inherit;
border-color: inherit;
}
.blocklyDropDownButton {
display: inline-block;
float: left;
padding: 0;
margin: 4px;
border-radius: 4px;
outline: none;
border: 1px solid;
transition: box-shadow .1s;
cursor: pointer;
}
.blocklyArrowTop {
border-top: 1px solid;
border-left: 1px solid;
border-top-left-radius: 4px;
border-color: inherit;
}
.blocklyArrowBottom {
border-bottom: 1px solid;
border-right: 1px solid;
border-bottom-right-radius: 4px;
border-color: inherit;
}
.blocklyResizeSE {
cursor: se-resize;
fill: #aaa;
}
.blocklyResizeSW {
cursor: sw-resize;
fill: #aaa;
}
.blocklyResizeLine {
stroke: #515A5A;
stroke-width: 1;
}
.blocklyHighlightedConnectionPath {
fill: none;
stroke: #fc3;
stroke-width: 4px;
}
.blocklyPathLight {
fill: none;
stroke-linecap: round;
stroke-width: 1;
}
.blocklySelected&gt;.blocklyPathLight {
display: none;
}
.blocklyDraggable {
cursor: grab;
cursor: -webkit-grab;
}
.blocklyDragging {
cursor: grabbing;
cursor: -webkit-grabbing;
}
/* Changes cursor on mouse down. Not effective in Firefox because of
https://bugzilla.mozilla.org/show_bug.cgi?id=771241 */
.blocklyDraggable:active {
cursor: grabbing;
cursor: -webkit-grabbing;
}
.blocklyDragging.blocklyDraggingDelete {
cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
}
.blocklyDragging&gt;.blocklyPath,
.blocklyDragging&gt;.blocklyPathLight {
fill-opacity: .8;
stroke-opacity: .8;
}
.blocklyDragging&gt;.blocklyPathDark {
display: none;
}
.blocklyDisabled&gt;.blocklyPath {
fill-opacity: .5;
stroke-opacity: .5;
}
.blocklyDisabled&gt;.blocklyPathLight,
.blocklyDisabled&gt;.blocklyPathDark {
display: none;
}
.blocklyInsertionMarker&gt;.blocklyPath,
.blocklyInsertionMarker&gt;.blocklyPathLight,
.blocklyInsertionMarker&gt;.blocklyPathDark {
fill-opacity: .2;
stroke: none;
}
.blocklyMultilineText {
font-family: monospace;
}
.blocklyNonEditableText&gt;text {
pointer-events: none;
}
.blocklyFlyout {
position: absolute;
z-index: 20;
}
.blocklyText text {
cursor: default;
}
/*
Don't allow users to select text. It gets annoying when trying to
drag a block and selected text moves instead.
*/
.blocklySvg text {
user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
cursor: inherit;
}
.blocklyHidden {
display: none;
}
.blocklyFieldDropdown:not(.blocklyHidden) {
display: block;
}
.blocklyIconGroup {
cursor: default;
}
.blocklyIconGroup:not(:hover),
.blocklyIconGroupReadonly {
opacity: .6;
}
.blocklyIconShape {
fill: #00f;
stroke: #fff;
stroke-width: 1px;
}
.blocklyIconSymbol {
fill: #fff;
}
.blocklyMinimalBody {
margin: 0;
padding: 0;
}
.blocklyHtmlInput {
border: none;
border-radius: 4px;
height: 100%;
margin: 0;
outline: none;
padding: 0;
width: 100%;
text-align: center;
display: block;
box-sizing: border-box;
}
/* Remove the increase and decrease arrows on the field number editor */
input.blocklyHtmlInput[type=number]::-webkit-inner-spin-button,
input.blocklyHtmlInput[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none;
margin: 0;
}
input[type=number] {
-moz-appearance: textfield;
}
.blocklyMainBackground {
stroke-width: 1;
stroke: #c6c6c6; /* Equates to #ddd due to border being off-pixel. */
}
.blocklyMutatorBackground {
fill: #fff;
stroke: #ddd;
stroke-width: 1;
}
.blocklyFlyoutBackground {
fill: #ddd;
fill-opacity: .8;
}
.blocklyMainWorkspaceScrollbar {
z-index: 20;
}
.blocklyFlyoutScrollbar {
z-index: 30;
}
.blocklyScrollbarHorizontal,
.blocklyScrollbarVertical {
position: absolute;
outline: none;
}
.blocklyScrollbarBackground {
opacity: 0;
}
.blocklyScrollbarHandle {
fill: #ccc;
}
.blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
.blocklyScrollbarHandle:hover {
fill: #bbb;
}
/* Darken flyout scrollbars due to being on a grey background. */
/* By contrast, workspace scrollbars are on a white background. */
.blocklyFlyout .blocklyScrollbarHandle {
fill: #bbb;
}
.blocklyFlyout .blocklyScrollbarBackground:hover+.blocklyScrollbarHandle,
.blocklyFlyout .blocklyScrollbarHandle:hover {
fill: #aaa;
}
.blocklyInvalidInput {
background: #faa;
}
.blocklyVerticalMarker {
stroke-width: 3px;
fill: rgba(255,255,255,.5);
pointer-events: none;
}
.blocklyComputeCanvas {
position: absolute;
width: 0;
height: 0;
}
.blocklyNoPointerEvents {
pointer-events: none;
}
.blocklyContextMenu {
border-radius: 4px;
max-height: 100%;
}
.blocklyDropdownMenu {
border-radius: 2px;
padding: 0 !important;
}
.blocklyDropdownMenu .blocklyMenuItem {
/* 28px on the left for icon or checkbox. */
padding-left: 28px;
}
/* BiDi override for the resting state. */
.blocklyDropdownMenu .blocklyMenuItemRtl {
/* Flip left/right padding for BiDi. */
padding-left: 5px;
padding-right: 28px;
}
.blocklyWidgetDiv .blocklyMenu {
background: #fff;
border: 1px solid transparent;
box-shadow: 0 0 3px 1px rgba(0,0,0,.3);
font: normal 13px Arial, sans-serif;
margin: 0;
outline: none;
padding: 4px 0;
position: absolute;
overflow-y: auto;
overflow-x: hidden;
max-height: 100%;
z-index: 20000; /* Arbitrary, but some apps depend on it... */
}
.blocklyWidgetDiv .blocklyMenu.blocklyFocused {
box-shadow: 0 0 6px 1px rgba(0,0,0,.3);
}
.blocklyDropDownDiv .blocklyMenu {
background: inherit; /* Compatibility with gapi, reset from goog-menu */
border: inherit; /* Compatibility with gapi, reset from goog-menu */
font: normal 13px "Helvetica Neue", Helvetica, sans-serif;
outline: none;
position: relative; /* Compatibility with gapi, reset from goog-menu */
z-index: 20000; /* Arbitrary, but some apps depend on it... */
}
/* State: resting. */
.blocklyMenuItem {
border: none;
color: #000;
cursor: pointer;
list-style: none;
margin: 0;
/* 7em on the right for shortcut. */
min-width: 7em;
padding: 6px 15px;
white-space: nowrap;
}
/* State: disabled. */
.blocklyMenuItemDisabled {
color: #ccc;
cursor: inherit;
}
/* State: hover. */
.blocklyMenuItemHighlight {
background-color: rgba(0,0,0,.1);
}
/* State: selected/checked. */
.blocklyMenuItemCheckbox {
height: 16px;
position: absolute;
width: 16px;
}
.blocklyMenuItemSelected .blocklyMenuItemCheckbox {
background: url(https://blockly-demo.appspot.com/static/media/sprites.png) no-repeat -48px -16px;
float: left;
margin-left: -24px;
position: static; /* Scroll with the menu. */
}
.blocklyMenuItemRtl .blocklyMenuItemCheckbox {
float: right;
margin-right: -24px;
}
.blocklyZoom&gt;image, .blocklyZoom&gt;svg&gt;image {
opacity: .4;
}
.blocklyZoom&gt;image:hover, .blocklyZoom&gt;svg&gt;image:hover {
opacity: .6;
}
.blocklyZoom&gt;image:active, .blocklyZoom&gt;svg&gt;image:active {
opacity: .8;
}
.blocklyCommentForeignObject {
position: relative;
z-index: 0;
}
.blocklyCommentRect {
fill: #E7DE8E;
stroke: #bcA903;
stroke-width: 1px;
}
.blocklyCommentTarget {
fill: transparent;
stroke: #bcA903;
}
.blocklyCommentTargetFocused {
fill: none;
}
.blocklyCommentHandleTarget {
fill: none;
}
.blocklyCommentHandleTargetFocused {
fill: transparent;
}
.blocklyFocused&gt;.blocklyCommentRect {
fill: #B9B272;
stroke: #B9B272;
}
.blocklySelected&gt;.blocklyCommentTarget {
stroke: #fc3;
stroke-width: 3px;
}
.blocklyCommentDeleteIcon {
cursor: pointer;
fill: #000;
display: none;
}
.blocklySelected &gt; .blocklyCommentDeleteIcon {
display: block;
}
.blocklyDeleteIconShape {
fill: #000;
stroke: #000;
stroke-width: 1px;
}
.blocklyDeleteIconShape.blocklyDeleteIconHighlighted {
stroke: #fc3;
}
.blocklyCommentTextarea {
background-color: #fef49c;
border: 0;
display: block;
margin: 0;
outline: 0;
padding: 3px;
resize: none;
text-overflow: hidden;
}
.blocklyAngleCircle {
stroke: #444;
stroke-width: 1;
fill: #ddd;
fill-opacity: 0.8;
}
.blocklyAngleMarks {
stroke: #444;
stroke-width: 1;
}
.blocklyAngleGauge {
fill: #f88;
fill-opacity: 0.8;
pointer-events: none;
}
.blocklyAngleLine {
stroke: #f00;
stroke-width: 2;
stroke-linecap: round;
pointer-events: none;
}
.blocklyColourTable {
border-collapse: collapse;
display: block;
outline: none;
padding: 1px;
}
.blocklyColourTable&gt;tr&gt;td {
border: 0.5px solid #888;
box-sizing: border-box;
cursor: pointer;
display: inline-block;
height: 20px;
padding: 0;
width: 20px;
}
.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
border-color: #eee;
box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
position: relative;
}
.blocklyColourSelected, .blocklyColourSelected:hover {
border-color: #eee !important;
outline: 1px solid #333;
position: relative;
}
.blocklyHtmlTextAreaInput {
font-family: monospace;
resize: none;
overflow: hidden;
height: 100%;
text-align: left;
}
.blocklyHtmlTextAreaInputOverflowedY {
overflow-y: scroll;
}
.blocklyFlyoutButton {
fill: #888;
cursor: default;
}
.blocklyFlyoutButtonShadow {
fill: #666;
}
.blocklyFlyoutButton:hover {
fill: #aaa;
}
.blocklyFlyoutLabel {
cursor: default;
}
.blocklyFlyoutLabelBackground {
opacity: 0;
}
.blocklyTreeRow:not(.blocklyTreeSelected):hover {
background-color: rgba(255, 255, 255, .2);
}
.blocklyToolboxDiv[layout="h"] .blocklyToolboxCategory {
margin: 1px 5px 1px 0;
}
.blocklyToolboxDiv[dir="RTL"][layout="h"] .blocklyToolboxCategory {
margin: 1px 0 1px 5px;
}
.blocklyTreeRow {
height: 22px;
line-height: 22px;
margin-bottom: 3px;
padding-right: 8px;
white-space: nowrap;
}
.blocklyToolboxDiv[dir="RTL"] .blocklyTreeRow {
margin-left: 8px;
padding-right: 0;
}
.blocklyTreeIcon {
background-image: url(https://blockly-demo.appspot.com/static/media/sprites.png);
height: 16px;
vertical-align: middle;
visibility: hidden;
width: 16px;
}
.blocklyTreeIconClosed {
background-position: -32px -1px;
}
.blocklyToolboxDiv[dir="RTL"] .blocklyTreeIconClosed {
background-position: 0 -1px;
}
.blocklyTreeSelected&gt;.blocklyTreeIconClosed {
background-position: -32px -17px;
}
.blocklyToolboxDiv[dir="RTL"] .blocklyTreeSelected&gt;.blocklyTreeIconClosed {
background-position: 0 -17px;
}
.blocklyTreeIconOpen {
background-position: -16px -1px;
}
.blocklyTreeSelected&gt;.blocklyTreeIconOpen {
background-position: -16px -17px;
}
.blocklyTreeLabel {
cursor: default;
font: 16px sans-serif;
padding: 0 3px;
vertical-align: middle;
}
.blocklyToolboxDelete .blocklyTreeLabel {
cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
}
.blocklyTreeSelected .blocklyTreeLabel {
color: #fff;
}
.blocklyTreeSeparator {
border-bottom: solid #e5e5e5 1px;
height: 0;
margin: 5px 0;
}
.blocklyToolboxDiv[layout="h"] .blocklyTreeSeparator {
border-right: solid #e5e5e5 1px;
border-bottom: none;
height: auto;
margin: 0 5px 0 5px;
padding: 5px 0;
width: 0;
}
.blocklyToolboxDelete {
cursor: url("https://blockly-demo.appspot.com/static/media/handdelete.cur"), auto;
}
.blocklyToolboxGrab {
cursor: url("https://blockly-demo.appspot.com/static/media/handclosed.cur"), auto;
cursor: grabbing;
cursor: -webkit-grabbing;
}
/* Category tree in Toolbox. */
.blocklyToolboxDiv {
background-color: #ddd;
overflow-x: visible;
overflow-y: auto;
padding: 4px 0 4px 0;
position: absolute;
z-index: 70; /* so blocks go under toolbox when dragging */
-webkit-tap-highlight-color: transparent; /* issue #1345 */
}
.blocklyToolboxContents {
display: flex;
flex-wrap: wrap;
flex-direction: column;
}
.blocklyToolboxContents:focus {
outline: none;
}
.blocklyColourTable {
border-collapse: collapse;
display: block;
outline: none;
padding: 1px;
}
.blocklyColourTable&gt;tr&gt;td {
border: 0.5px solid #888;
box-sizing: border-box;
cursor: pointer;
display: inline-block;
height: 20px;
padding: 0;
width: 20px;
}
.blocklyColourTable&gt;tr&gt;td.blocklyColourHighlighted {
border-color: #eee;
box-shadow: 2px 2px 7px 2px rgba(0, 0, 0, 0.3);
position: relative;
}
.blocklyColourSelected, .blocklyColourSelected:hover {
border-color: #eee !important;
outline: 1px solid #333;
position: relative;
}
.fieldColourSliderContainer {
padding: 4px;
}
.fieldColourSliderContainer hr {
border: none;
border-top: 1px solid #bbb;
}
.fieldColourSliderLabel {
display: flex;
justify-content: space-between;
font: 12pt "Helvetica Neue", "Segoe UI", Helvetica, sans-serif;
}
.fieldColourEyedropper {
appearance: none;
position: relative;
border: none;
border-radius: 4px;
background: transparent;
font: inherit;
color: inherit;
cursor: pointer;
width: 100%;
margin: 0;
display: flex;
justify-content: center;
align-items: center;
}
.fieldColourEyedropper:hover {
background: rgba(0,0,0,0.1)
}
.fieldColourEyedropper input {
opacity: 0;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
}
.fieldColourEyedropper::before {
content: "Eyedropper";
}
.fieldColourEyedropper::after {
content: "";
margin-left: 8px;
width: 24px;
height: 24px;
background: currentColor;
pointer-events: none;
-webkit-mask-image: var(--customize-dial-symbol);
-webkit-mask-repeat: no-repeat;
-webkit-mask-position: center;
mask-image: var(--customize-dial-symbol);
mask-repeat: no-repeat;
mask-position: center;
--customize-dial-symbol: url('data:image/svg+xml, &lt;svg xmlns="http://www.w3.org/2000/svg" width="24px" height="24px" viewBox="0 0 24 24"&gt; &lt;path stroke="black" strokewidth="1.414" fill="none" d="m 13 8 L 6 15 Q 3 18 2 21 Q 0 23 .5 23.5 Q 1 24 3 22 Q 6 21 9 18 L 16 11"/&gt; &lt;path fill="black" d="m 12 7 Q 11 6 12 5 Q 13 4 14 5 Q 15 6 16 5 Q 20 -1 22.5 1.5 Q 25 4 19 8 Q 18 9 19 10 Q 20 11 19 12 Q 18 13 17 12"/&gt; &lt;/svg&gt;');
}
.fieldColourSlider {
-webkit-appearance: none;
width: 150px;
height: 24px;
margin: 4px 8px 24px 8px;
padding: 0;
}
.fieldColourSlider:last-child {
margin-bottom: 4px;
}
.fieldColourSlider:focus {
outline: none;
}
/* Webkit */
.fieldColourSlider::-webkit-slider-runnable-track {
background: var(--slider-track-background);
border-radius: 8px;
height: 16px;
}
.fieldColourSlider::-webkit-slider-thumb {
-webkit-appearance: none;
background: #fff;
border-radius: 50%;
box-shadow: 0 0 0 4px rgba(0,0,0,.15);
cursor: pointer;
width: 24px;
height: 24px;
margin-top: -4px;
}
/* Firefox */
.fieldColourSlider::-moz-range-track {
background: var(--slider-track-background);
border-radius: 8px;
height: 16px;
}
.fieldColourSlider::-moz-range-thumb {
background: #fff;
border: none;
border-radius: 50%;
box-shadow: 0 0 0 4px rgba(0,0,0,.15);
cursor: pointer;
width: 24px;
height: 24px;
}
.fieldColourSlider::-moz-focus-outer {
/* override the focus border style */
border: 0;
}
/* IE */
.fieldColourSlider::-ms-track {
background: var(--slider-track-background);
border-radius: 12px;
width: 100%;
height: 24px;
/* remove default tick marks */
color: transparent;
}
.fieldColourSlider::-ms-fill-lower {
background: transparent;
}
.fieldColourSlider::-ms-fill-upper {
background: transparent;
}
.fieldColourSlider::-ms-thumb {
background: #fff;
border: none;
border-radius: 50%;
box-shadow: 0 0 0 4px rgba(0,0,0,.15);
cursor: pointer;
width: 24px;
height: 24px;
}
.controlsIconStyle {
opacity: 0.2;
}
.controlsIconStyle:hover {
opacity: 0.4;
}
.controlsIconStyle:active {
opacity: 0.6;
}
.blocklyMultiselect&gt;image, .blocklyMultiselect&gt;svg&gt;image {
opacity: .2;
}
.blocklyMultiselect&gt;image:hover, .blocklyMultiselect&gt;svg&gt;image:hover {
opacity: .4;
}
.blocklyMultiselect&gt;image:active, .blocklyMultiselect&gt;svg&gt;image:active {
opacity: .6;
}
</style><g transform="translate(1, 5)"><g data-id="*E}fi/Fy{/92/VJV-2R$" class="blocklyDraggable"><path class="blocklyPath" stroke="#3971bf" fill="#4c97ff" d=" m 0,0 m 0,4 a 4 4 0 0,1 4,-4 h 5 l 0,-4 10,0 0,4 10,0 0,-4 10,0 0,4 h 133.1359375 a 4 4 0 0,1 4,4 v 6 V 38 V 40 V 40 a 4 4 0 0,1 -4,4 h -133.1359375 l 0,-4 -10,0 0,4 -10,0 0,-4 -10,0 0,4 h -5 a 4 4 0 0,1 -4,-4 z&#10;"/><g transform="translate(8,6.5)"><image height="30px" width="28.8px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyNSAyNiIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8Zz4KPHJlY3QgeD0iMy41ODM0IiB5PSIuMDgzNDQ5IiB3aWR0aD0iMTcuOCIgaGVpZ2h0PSIyNC44IiByeD0iMS45NzY0IiByeT0iMS45NzY0IiBmaWxsPSIjZjRmNGY0IiBzdHJva2U9IiMxYjI5MzMiIHN0cm9rZS1saW5lY2FwPSJzcXVhcmUiIHN0cm9rZS13aWR0aD0iLjIiLz4KPGNpcmNsZSBjeD0iMTIuNSIgY3k9IjIwLjUzMyIgcj0iMi40NSIgZmlsbD0iIzgzOWJmZiIgc3Ryb2tlPSIjMDAwIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS13aWR0aD0iLjEiLz4KPGcgdHJhbnNmb3JtPSJtYXRyaXgoMS4xOTk5IDAgMCAxLjE5OTkgLTIuNDk5NiAtMS40MDkpIiBmaWxsPSIjZmZkZTAwIiBzdHJva2Utd2lkdGg9Ii44MzMzNyI+CjxyZWN0IHg9IjcuNSIgeT0iNC4wMDA1IiB3aWR0aD0iMyIgaGVpZ2h0PSIzIi8+CjxyZWN0IHg9IjExIiB5PSI0IiB3aWR0aD0iMyIgaGVpZ2h0PSIzIi8+CjxyZWN0IHg9IjE0LjUiIHk9IjQuMDAwNSIgd2lkdGg9IjMiIGhlaWdodD0iMyIvPgo8cmVjdCB4PSI3LjUiIHk9IjcuNTAwNSIgd2lkdGg9IjMiIGhlaWdodD0iMyIvPgo8cmVjdCB4PSIxMSIgeT0iNy41IiB3aWR0aD0iMyIgaGVpZ2h0PSIzIi8+CjxyZWN0IHg9IjE0LjUiIHk9IjcuNTAwNSIgd2lkdGg9IjMiIGhlaWdodD0iMyIvPgo8cmVjdCB4PSI3LjUiIHk9IjExIiB3aWR0aD0iMyIgaGVpZ2h0PSIzIi8+CjxyZWN0IHg9IjExIiB5PSIxMSIgd2lkdGg9IjMiIGhlaWdodD0iMyIvPgo8cmVjdCB4PSIxNC41IiB5PSIxMSIgd2lkdGg9IjMiIGhlaWdodD0iMyIvPgo8L2c+CjwvZz4KICA8L2c+Cjwvc3ZnPg=="/></g><g transform="translate(44.8,6.5)"><image height="30px" width="2px" alt="*" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAyIDMwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPgogIDxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsIDApIj4KICAgIDxwYXRoIGQ9Im0wLjUgMC41djI5IiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLW9wYWNpdHk9Ii4yNjI1Ii8+CiAgPC9nPgo8L3N2Zz4="/></g><g class="blocklyEditableText" transform="translate(54.8,7.4)" style="cursor: text;"><rect rx="4" ry="4" x="0" y="0" height="29.2" width="93.3359375" class="blocklyFieldRect" stroke="#3971bf" style="display: block; fill: rgb(65, 128, 217);"/><text class="blocklyText" dominant-baseline="central" style="fill: rgb(255, 255, 255);" x="8" y="14.6">prime hub</text></g><g transform="translate(156.1359375,6.5)"><image height="30px" width="12px" alt="" xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4KPHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxMiAzMCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KICA8ZyB0cmFuc2Zvcm09InRyYW5zbGF0ZSgwLCAwKSI+CiAgICA8cGF0aCBkPSJtMi40NzM4IDUuNzk2OCA3LjUwOTYgOS40MDI3LTcuNTA5NiA5LjQwMjciIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjQiLz4KICA8L2c+Cjwvc3ZnPg==" style="cursor: pointer;"/></g></g></g></svg>
Side by Side

After

Width:  |  Height:  |  Size: 23 KiB

doc/main/blockimg/pybricks_variables_set_prime_hub_option3.svg
+974
View File
File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 30 KiB

doc/main/conf.py
+3 -2
View File
@@ -29,12 +29,14 @@ if os.environ.get("READTHEDOCS", None) == "True":
# HACK: this allows Number type alias to be imported by Sphinx
os.environ["SPHINX_BUILD"] = "True"
html_css_files = ["css/blocks.css"]
# Additional configuration of the IDE docs
if "ide" in tags.tags: # noqa F821
_DISCLAIMER = ""
html_show_copyright = False
html_show_sphinx = False
html_css_files = ["css/ide.css"]
html_css_files.append("css/ide.css")
html_js_files = ["js/ide.js"]
imgmath_image_format = "svg"
@@ -47,7 +49,6 @@ exec(open(os.path.abspath("../common/conf.py")).read())
# Additional configuration of the IDE docs
if "ide" in tags.tags: # noqa F821
extensions.remove("sphinx.ext.mathjax") # noqa F821
extensions.append("sphinx.ext.imgmath") # noqa F821
html_theme_options["prev_next_buttons_location"] = None # noqa F821
doc/main/hubs/primehub.rst
+14
View File
@@ -6,6 +6,11 @@ Prime Hub / Inventor Hub
.. figure:: ../../main/cad/output/hub-spike-inventor.png
:width: 80%
.. blockimg:: pybricks_variables_set_inventor_hub_option0
.. blockimg:: pybricks_variables_set_inventor_hub_option3
:stack:
.. class:: InventorHub
This class is the same as the ``PrimeHub`` class, shown below. Both classes
@@ -13,6 +18,11 @@ Prime Hub / Inventor Hub
These hubs are completely identical. They use the same Pybricks firmware.
.. blockimg:: pybricks_variables_set_prime_hub_option0
.. blockimg:: pybricks_variables_set_prime_hub_option3
:stack:
.. autoclass:: pybricks.hubs.PrimeHub
:no-members:
@@ -21,8 +31,12 @@ Prime Hub / Inventor Hub
.. figure:: ../../main/diagrams/primehub_light.png
:width: 22 em
.. blockimg:: pybricks_blockLightOnColor_primehub_on
.. automethod:: pybricks.hubs::PrimeHub.light.on
.. blockimg:: pybricks_blockLightOnColor_primehub_off
.. automethod:: pybricks.hubs::PrimeHub.light.off
.. automethod:: pybricks.hubs::PrimeHub.light.blink