// https://wren.io/ Prism.languages.wren = { // Multiline comments in Wren can have nested multiline comments // Comments: // and /* */ comment: [ { // support 3 levels of nesting // regex: \/\*(?:[^*/]|\*(?!\/)|\/(?!\*)|)*\*\/ pattern: /\/\*(?:[^*/]|\*(?!\/)|\/(?!\*)|\/\*(?:[^*/]|\*(?!\/)|\/(?!\*)|\/\*(?:[^*/]|\*(?!\/)|\/(?!\*))*\*\/)*\*\/)*\*\//, greedy: true, }, { pattern: /(^|[^\\:])\/\/.*/, lookbehind: true, greedy: true, }, ], // Triple quoted strings are multiline but cannot have interpolation (raw strings) // Based on prism-python.js 'triple-quoted-string': { pattern: /"""[\s\S]*?"""/, greedy: true, alias: 'string', }, // see below 'string-literal': null, // #!/usr/bin/env wren on the first line hashbang: { pattern: /^#!\/.+/, greedy: true, alias: 'comment', }, // Attributes are special keywords to add meta data to classes attribute: { // #! attributes are stored in class properties // #!myvar = true // #attributes are not stored and dismissed at compilation pattern: /#!?[ \t\u3000]*\w+/, alias: 'keyword', }, 'class-name': [ { // class definition // class Meta {} pattern: /(\bclass\s+)\w+/, lookbehind: true, }, // A class must always start with an uppercase. // File.read /\b[A-Z][a-z\d_]*\b/, ], // A constant can be a variable, class, property or method. Just named in all uppercase letters constant: /\b[A-Z][A-Z\d_]*\b/, null: { pattern: /\bnull\b/, alias: 'keyword', }, keyword: /\b(?:as|break|class|construct|continue|else|for|foreign|if|import|in|is|return|static|super|this|var|while)\b/, boolean: /\b(?:false|true)\b/, number: /\b(?:0x[\da-f]+|\d+(?:\.\d+)?(?:e[+-]?\d+)?)\b/i, // Functions can be Class.method() function: /\b[a-z_]\w*(?=\s*[({])/i, operator: /<<|>>|[=!<>]=?|&&|\|\||[-+*/%~^&|?:]|\.{2,3}/, punctuation: /[\[\](){}.,;]/, }; Prism.languages.wren['string-literal'] = { // A single quote string is multiline and can have interpolation (similar to JS backticks ``) pattern: /(^|[^\\"])"(?:[^\\"%]|\\[\s\S]|%(?!\()|%\((?:[^()]|\((?:[^()]|\([^)]*\))*\))*\))*"/, lookbehind: true, greedy: true, inside: { interpolation: { // "%(interpolation)" pattern: /((?:^|[^\\])(?:\\{2})*)%\((?:[^()]|\((?:[^()]|\([^)]*\))*\))*\)/, lookbehind: true, inside: { expression: { pattern: /^(%\()[\s\S]+(?=\)$)/, lookbehind: true, inside: Prism.languages.wren, }, 'interpolation-punctuation': { pattern: /^%\(|\)$/, alias: 'punctuation', }, }, }, string: /[\s\S]+/, }, }; th'>path: root/src/components/atoms/forms/fields/fields.module.scss
blob: 363c7eef3d55cee2204f6b5863c75feb3c579e11 (plain) 
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

@use "../../../../styles/abstracts/functions" as fun;
@use "../../../../styles/abstracts/mixins" as mix;

.field {
  padding: var(--spacing-2xs) var(--spacing-xs);
  background: var(--color-bg-tertiary);
  border: fun.convert-px(2) solid var(--color-border);
  box-shadow: fun.convert-px(3) fun.convert-px(3) 0 0 var(--color-shadow);
  transition: all 0.25s linear 0s;

  &--select {
    cursor: pointer;

    @include mix.pointer("fine") {
      padding: fun.convert-px(3) var(--spacing-xs);
    }
  }

  &--textarea {
    min-height: fun.convert-px(200);
  }

  &:disabled {
    background: var(--color-bg-secondary);
    border: fun.convert-px(2) solid var(--color-border-light);
    box-shadow: fun.convert-px(3) fun.convert-px(3) 0 0
      var(--color-shadow-light);
    cursor: not-allowed;
  }

  &:not(:disabled) {
    &:hover {
      box-shadow: fun.convert-px(5) fun.convert-px(5) 0 fun.convert-px(1)
        var(--color-shadow);
      transform: translate(#{fun.convert-px(-3)}, #{fun.convert-px(-3)});
    }

    &:focus {
      background: var(--color-bg);
      border-color: var(--color-primary);
      box-shadow: 0 0 0 0 var(--color-shadow);
      transform: translate(#{fun.convert-px(3)}, #{fun.convert-px(3)});
      outline: none;
      transition:
        all 0.2s ease-in-out 0s,
        transform 0.3s ease-out 0s;
    }
  }
}