blockly-samples/plugins/theme-hackermode/src/index.ts at 2b8ebe7b6d5e3860c736b2ca8bebbbb3f5242fc1 · tgbhy/blockly-samples · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
/**
 * @license
 * Copyright 2023 Google LLC
 * SPDX-License-Identifier: Apache-2.0
 */

/**
 * @fileoverview Hacker Mode theme.
 * Black background and blocks with lime green text to simulate a hacker screen.
 */

import * as Blockly from 'blockly/core';

const defaultBlockStyles = {
  colour_blocks: { // eslint-disable-line camelcase
    colourPrimary: '#0c0d0d',
    colourSecondary: '#0c0d0d',
    colourTertiary: '#edf2f2',
  },
  list_blocks: {  // eslint-disable-line camelcase
    colourPrimary: '#0c0d0d',
    colourSecondary: '#0c0d0d',
    colourTertiary: '#edf2f2',
  },
  logic_blocks: {  // eslint-disable-line camelcase
    colourPrimary: '#0c0d0d',
    colourSecondary: '#0c0d0d',
    colourTertiary: '#edf2f2',
  },
  loop_blocks: {  // eslint-disable-line camelcase
    colourPrimary: '#0c0d0d',
    colourSecondary: '#0c0d0d',
    colourTertiary: '#edf2f2',
  },
  math_blocks: {  // eslint-disable-line camelcase
    colourPrimary: '#0c0d0d',
    colourSecondary: '#0c0d0d',
    colourTertiary: '#edf2f2',
  },
  procedure_blocks: {  // eslint-disable-line camelcase
    colourPrimary: '#0c0d0d',
    colourSecondary: '#0c0d0d',
    colourTertiary: '#edf2f2',
  },
  text_blocks: {  // eslint-disable-line camelcase
    colourPrimary: '#0c0d0d',
    colourSecondary: '#0c0d0d',
    colourTertiary: '#edf2f2',
  },
  variable_blocks: {  // eslint-disable-line camelcase
    colourPrimary: '#0c0d0d',
    colourSecondary: '#0c0d0d',
    colourTertiary: '#edf2f2',
  },
  variable_dynamic_blocks: {  // eslint-disable-line camelcase
    colourPrimary: '#0c0d0d',
    colourSecondary: '#0c0d0d',
    colourTertiary: '#edf2f2',
  },
};

const categoryStyles = {
  colour_category: {  // eslint-disable-line camelcase
    colour: '#0c0d0d',
  },
  list_category: {  // eslint-disable-line camelcase
    colour: '#0c0d0d',
  },
  logic_category: {  // eslint-disable-line camelcase
    colour: '#0c0d0d',
  },
  loop_category: {  // eslint-disable-line camelcase
    colour: '#0c0d0d',
  },
  math_category: {  // eslint-disable-line camelcase
    colour: '#0c0d0d',
  },
  procedure_category: {  // eslint-disable-line camelcase
    colour: '#0c0d0d',
  },
  text_category: {  // eslint-disable-line camelcase
    colour: '#0c0d0d',
  },
  variable_category: {  // eslint-disable-line camelcase
    colour: '#0c0d0d',
  },
  variable_dynamic_category: {  // eslint-disable-line camelcase
    colour: '#0c0d0d',
  },
};

export default Blockly.Theme.defineTheme('hackermode', {
  name: 'hackermode',
  base: Blockly.Themes.Classic,
  blockStyles: defaultBlockStyles,
  categoryStyles: categoryStyles,
  componentStyles: {
    workspaceBackgroundColour: '#1e1e1e',
    toolboxBackgroundColour: '#333',
    toolboxForegroundColour: '#73ed58',
    flyoutBackgroundColour: '#252526',
    flyoutForegroundColour: '#73ed58',
    flyoutOpacity: 1,
    scrollbarColour: '#797979',
    insertionMarkerColour: '#fff',
    insertionMarkerOpacity: 0.3,
    scrollbarOpacity: 0.4,
    cursorColour: '#d0d0d0',
  },
  fontStyle: {
    family: 'monospace',
    weight: undefined,
    size: undefined,
  },
  startHats: undefined,
});