Background Color of an Anchor

[gramian]

Dear All,

I would like to use an Anchor block with a success/warning/error background-color, like the Alert block. As this seems not possible directly (?), I am trying to emulate this by custom styling of an Anchor (style/background-color property). However, I seem to be unable to use the LESS color variable @warning-color nor a (potentially) related CSS variable like --ant-color-warning (Ant Design > 5).

Can I access the success/warning/error colors somehow in a style property? The only idea I have would be defining a CSS variable myself using the respective LESS variable value, ie --warning-color: @warning-color.

Thank you for your input

[Gervwyk]

Hi @gramian

Due to css specificity, and how we apply styles, this get over written by the antd a tag base style.
However, the following works:

lowdefy: local
pages:
  - id: card
    type: Box
    blocks:
      - id: error-link
        type: Anchor
        properties:
          url: aaa
      - id: warning-link
        type: Anchor
        properties:
          url: bbb
      - id: link
        type: Anchor
        properties:
          url: ccc

And public/styles.less

#warning-link {
  color: @warning-color;
}

#error-link {
  color: @error-color;
}

It makes use of id css selectors to modify the specific block-id, since there is nomore resetriction on duplicate block ids, this could be applied as a work around.