cc-by-sa.test.tsx « icons « atoms « components « src - www.armandphilippot.com - The frontend of my personal website.

about summary refs log tree commit diff stats

path: root/src/components/atoms/icons/cc-by-sa.test.tsx

blob: adb03e4d133654988b6ca38a0dc9d3812c59a482 (plain)

import { render, screen } from '@test-utils';
import CCBySA from './cc-by-sa';

describe('CCBySA', () => {
  it('renders a CC BY SA icon', () => {
    render(<CCBySA />);
    expect(screen.getByTitle('CC BY SA')).toBeInTheDocument();
  });
});

333bb } /* Name.Variable.Instance */ .highlight .vm { color: #336699 } /* Name.Variable.Magic */ .highlight .il { color: #0000DD; font-weight: bold } /* Literal.Number.Integer.Long */

/// Draw borders around an element.
%draw-borders {
  background-image: linear-gradient(
      to right,
      var(--draw-border-color2),
      var(--draw-border-color1)
    ),
    linear-gradient(
      to bottom,
      var(--draw-border-color1),
      var(--draw-border-color2)
    ),
    linear-gradient(
      to left,
      var(--draw-border-color2),
      var(--draw-border-color1)
    ),
    linear-gradient(
      to top,
      var(--draw-border-color1),
      var(--draw-border-color2)
    );
  background-position: top left, top right, bottom right, bottom left;
  background-repeat: no-repeat;
  background-size: 100% var(--draw-border-thickness),
    var(--draw-border-thickness) 100%, 100% var(--draw-border-thickness),
    var(--draw-border-thickness) 100%;
  color: var(--draw-border-color1);

  :global {
    animation: draw-borders 0.8s linear 1 0s;
  }
}