import styled from "styled-components";
import type { SudokuCell } from "sudoku-rust";

export const indexes = [1, 2, 3, 4, 5, 6, 7, 8, 9] as const;

export const colours = [
  "#a8194b",
  "#ff2713",
  "#fc9902",
  "#ffff32",
  "#cfe92a",
  "#65b131",
  "#0392cc",
  "#3e02a6",
  "#8601b0",
] as const;

export const Colour = styled.div<{ $idx: SudokuCell }>`
  aspect-ratio: 1;
  width: 100%;
  background-color: ${({ $idx: i }) => colours[i - 1]};
`;