Blocks to code

src/css/hole.css

@@ -8,6 +8,8 @@
     transition-duration: 0.2s;
 
     border-radius: 5px;
+    background-color: white;
+    z-index: -998;
 }
 
 .editableHole {
@@ -29,7 +31,7 @@
 
 .text-editable-expr-hole {
     border-radius: 15px !important;
-    border-style: dashed !important;
+    border-style: dashed !important;  
 }
 
 .empty-operator-hole {

src/css/index.css

@@ -33,7 +33,7 @@ body {
 }
 
 .button {
-    color: #0d0c22;
+    color: white;
     cursor: pointer;
     border-radius: 4px;
     display: flex;
@@ -49,7 +49,7 @@ body {
     width: -webkit-fit-content;
     width: -moz-fit-content;
     width: fit-content;
-    border: solid 2px #fff;
+    border: none;
 }
 
 .button.button-invalid {

src/css/messages.css

@@ -115,7 +115,8 @@
     margin: 7px 7px 0 0;
     font-size: 13px;
     box-shadow: 0 0 3px 1px #aaa;
-
+
+    color:black;
     background-color: #ffffff;
     height: 17px;
     padding: 3px 8px 3px 8px;

src/css/toolbox.css

@@ -51,6 +51,7 @@ hole1 {
     box-shadow: 0px 0px 1px 1px #0000005e inset;
     margin: 0px 3px;
     display: inline-block;
+    background-color:white;
 }
 
 hole2 {
@@ -60,6 +61,7 @@ hole2 {
     border: dashed 1px #c7c7c7;
     min-width: 12px;
     height: 16px;
+    background-color: white;
 }
 
 #user-variables {
@@ -628,4 +630,4 @@ hole2 {
 
 .cascaded-menu-extra-item .inline-var {
     color: #aa5bc8;
-}
+}

src/docs/add-var.json

@@ -25,5 +25,8 @@
             ]
         }
     ],
-    "search-queries": ["create new variable", "variable", "var"]
+    "search-queries": ["create new variable", "variable", "var"],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/add.json

@@ -16,5 +16,8 @@
             "example": "a = \"hello\"\nb = \"world\"\nprint((a + \" \" + b))"
         }
     ],
-    "search-queries": ["add", "sum"]
+    "search-queries": ["add", "sum"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/and.json

@@ -16,5 +16,8 @@
             "example": "a = 5\nb = 7\nc=2\n\nif ((a > c) and (b > c)):\n\tprint(\"Both expressions are true.\")"
         }
     ],
-    "search-queries": ["and", "both", "and operator"]
+    "search-queries": ["and", "both", "and operator"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/assign-add.json

@@ -11,5 +11,8 @@
             "example": "a = 2\na += 2\nprint(a)"
         }
     ],
-    "search-queries": ["add to variable"]
+    "search-queries": ["add to variable"],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/assign-div.json

@@ -11,5 +11,8 @@
             "example": "a = 10\na /= 2\nprint(a)"
         }
     ],
-    "search-queries": ["divide variable"]
+    "search-queries": ["divide variable"],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/assign-mult.json

@@ -11,5 +11,8 @@
             "example": "a = 5\na *= 2\nprint(a)"
         }
     ],
-    "search-queries": ["multiply variable"]
+    "search-queries": ["multiply variable"],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/assign-sub.json

@@ -11,5 +11,8 @@
             "example": "a = 5\na -= 2\nprint(a)"
         }
     ],
-    "search-queries": ["subtract from variable", "deduct from variable"]
+    "search-queries": ["subtract from variable", "deduct from variable"],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/assign.json

@@ -11,5 +11,8 @@
             "example": "a = 123\nprint(a)\na=321\nprint(a)"
         }
     ],
-    "search-queries": ["set", "assign", "assign variable", "set variable", "update value variable"]
+    "search-queries": ["set", "assign", "assign variable", "set variable", "update value variable"],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/break.json

@@ -40,5 +40,8 @@
             ]
         }
     ],
-    "search-queries": ["exit", "loop", "break"]
+    "search-queries": ["exit", "loop", "break"],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/choice.json

@@ -11,5 +11,8 @@
             "example": "from random import choice\n\nif choice([1, 2, 3, 4, 5, 6]) == 6:\n\tprint(\"Rolled Six!\")"
         }
     ],
-    "search-queries": ["choice", "random choice", "choose randomly from list", "select randomly from array"]
+    "search-queries": ["choice", "random choice", "choose randomly from list", "select randomly from array"],
+    "styles":{
+        "backgroundColor": "#a4e6a1"
+    }
 }

src/docs/comp-eq.json

@@ -16,5 +16,8 @@
             "example": "a = 5\nb = 5\nwhile a == b:\n\ta += 1\nprint(a)\nprint(a)"
         }
     ],
-    "search-queries": ["compare equal", "check equal", "are equal"]
+    "search-queries": ["compare equal", "check equal", "are equal"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/comp-gt.json

@@ -16,5 +16,8 @@
             "example": "a = 1\nb = 5\nwhile b > a:\n\ta += 1\nprint(a)\nprint(a)"
         }
     ],
-    "search-queries": ["compare greater than", "compare", "check greater than"]
+    "search-queries": ["compare greater than", "compare", "check greater than"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/comp-gte.json

@@ -16,5 +16,8 @@
             "example": "a = 1\nb = 5\nwhile b >= a:\n\ta += 1\nprint(a)\nprint(a)"
         }
     ],
-    "search-queries": ["compare greater than or equal", "compare", "check greater than or equal"]
+    "search-queries": ["compare greater than or equal", "compare", "check greater than or equal"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/comp-lt.json

@@ -16,5 +16,8 @@
             "example": "a = 1\nb = 5\nwhile a < b:\n\ta += 1\nprint(a)\nprint(a)"
         }
     ],
-    "search-queries": ["compare", "compare less than", "check less than"]
+    "search-queries": ["compare", "compare less than", "check less than"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/comp-lte.json

@@ -16,5 +16,8 @@
             "example": "a = 1\nb = 5\nwhile a <= b:\n\ta += 1\nprint(a)\nprint(a)"
         }
     ],
-    "search-queries": ["less than or equal", "compare", "compare less than or equal", "check"]
+    "search-queries": ["less than or equal", "compare", "compare less than or equal", "check"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/comp-ne.json

@@ -16,5 +16,8 @@
             "example": "a = 1\nb = 5\nwhile a != b:\n\ta += 1\nprint(a)\nprint(a)"
         }
     ],
-    "search-queries": ["not equal", "compare not equal", "not equal to", "are not equal"]
+    "search-queries": ["not equal", "compare not equal", "not equal to", "are not equal"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/div.json

@@ -11,5 +11,8 @@
             "example": "a = 2\nb = 10\nprint((b / a))"
         }
     ],
-    "search-queries": ["divide", "division", "divide numbers"]
+    "search-queries": ["divide", "division", "divide numbers"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/elif.json

@@ -34,5 +34,8 @@
             "id": "elif-after-elif"
         }
     ],
-    "search-queries": ["else if", "else", "else condition", "choose", "path", "elif"]
+    "search-queries": ["else if", "else", "else condition", "choose", "path", "elif"],
+    "styles":{
+        "backgroundColor": "#FFAB19"
+    }
 }

src/docs/else.json

@@ -11,5 +11,8 @@
             "example": "a = 2\nif a > 3:\n\tprint(3)\nelif a > 4:\n\tprint(4)\nelif a == 5:\n\tprint(5)\nelif a > 6:\n\tprint(6)\nelse:\n\tprint(\"None of the above are true.\")"
         }
     ],
-    "search-queries": ["else", "otherwise", "if"]
+    "search-queries": ["else", "otherwise", "if"],
+    "styles":{
+        "backgroundColor": "#FFAB19"
+    }
 }

src/docs/f-str-item.json

@@ -11,5 +11,8 @@
             "example": "age = 16\nname = \"Alex\"\nprint(f'My name is {name} and I am {age} years old')"
         }
     ],
-    "search-queries": ["formatted string item", "formatted text item"]
+    "search-queries": ["formatted string item", "formatted text item"],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/f-str.json

@@ -11,5 +11,8 @@
             "example": "age = 16\nname = \"Alex\"\nprint(f'My name is {name} and I am {age} years old')"
         }
     ],
-    "search-queries": ["formatted string", "formatted text"]
+    "search-queries": ["formatted string", "formatted text"],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/false.json

@@ -11,5 +11,8 @@
             "example": "if False :\n\tprint(\"will not print\")\n\nif True :\n\tprint(\"will print\")"
         }
     ],
-    "search-queries": ["false", "boolean"]
+    "search-queries": ["false", "boolean"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/find.json

@@ -11,5 +11,8 @@
             "example": "name = \"Zimmer\"\nindexOfE = name.find(\"e\")\nprint(indexOfE)"
         }
     ],
-    "search-queries": ["search text", "find text", "find string"]
+    "search-queries": ["search text", "find text", "find string"],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/floor-div.json

@@ -11,5 +11,8 @@
             "example": "a = 2\nb = 7\nprint((b / a))"
         }
     ],
-    "search-queries": ["divide numbers", "divide integer", "divide floor"]
+    "search-queries": ["divide numbers", "divide integer", "divide floor"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/for.json

@@ -58,5 +58,8 @@
             "id": "loop-chars-of-str"
         }
     ],
-    "search-queries": ["for", "loop", "repeat", "go through", "iterate", "list"]
+    "search-queries": ["for", "loop", "repeat", "go through", "iterate", "list"],
+    "styles":{
+        "backgroundColor": "#411b8c"
+    }
 }

src/docs/if.json

@@ -25,5 +25,8 @@
             "id": "check-val-variable"
         }
     ],
-    "search-queries": ["if", "condition", "conditional", "choose", "path"]
+    "search-queries": ["if", "condition", "conditional", "choose", "path"],
+    "styles":{
+        "backgroundColor": "#FFAB19"
+    }
 }

src/docs/import.json

@@ -16,5 +16,8 @@
             "example": "from random import randint\nprint(randint(1, 6))"
         }
     ],
-    "search-queries": ["import module", "import random"]
+    "search-queries": ["import module", "import random"],
+    "styles":{
+        "backgroundColor": "#e897aa"
+    }
 }

src/docs/in.json

@@ -11,5 +11,8 @@
             "example": "from random import randint\na = randint(1, 10)\nb = [1, 2, 3, 4, 5]\nif a in b:\n\tprint(\"a is inside b\")\n\nif a not in b:\n\tprint(\"a is not inside b\")"
         }
     ],
-    "search-queries": ["in list", "inside list", "is inside list", "check inside list", "check list includes"]
+    "search-queries": ["in list", "inside list", "is inside list", "check inside list", "check list includes"],
+    "styles":{
+        "backgroundColor": "#59C059"
+    }
 }

src/docs/input.json

@@ -11,5 +11,8 @@
             "example": "name = input(\"Hi! What’s your name?\")\nprint(name)"
         }
     ],
-    "search-queries": ["input", "prompt", "text", "user", "ask input", "ask user"]
+    "search-queries": ["input", "prompt", "text", "user", "ask input", "ask user"],
+    "styles":{
+        "backgroundColor": "#5CB1D6"
+    }
 }

src/docs/join.json

@@ -11,5 +11,8 @@
             "example": "names = [\"Anna\", \"John\", \"Peter\"]\njoinedNames = \"-\".join(names)\nprint(joinedNames)"
         }
     ],
-    "search-queries": ["join string", "join text"]
+    "search-queries": ["join string", "join text"],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/len.json

@@ -16,5 +16,8 @@
             "example": "items = [1, 2, 3]\na = len(items)\nprint(a)"
         }
     ],
-    "search-queries": ["length of list", "length of string", "length of text"]
+    "search-queries": ["length of list", "length of string", "length of text"],
+    "styles":{
+        "backgroundColor": "#5CB1D6"
+    }
 }

src/docs/list-append.json

@@ -23,5 +23,8 @@
         "add to end list",
         "append to end list",
         "insert end list"
-    ]
+    ],
+    "styles":{
+        "backgroundColor": "#ebba8a"
+    }
 }

src/docs/list-element-assign.json

@@ -21,5 +21,8 @@
         "change value list index",
         "update item at index",
         "set value list index"
-    ]
+    ],
+    "styles":{
+        "backgroundColor": "#7c8ee6"
+    }
 }