Objetivo: Cumprir as user stories abaixo e fazer todos os testes passarem para completar o laboratório. Histórias de Usuário: 1. Você deve ter uma tabela com pelo menos três colunas e cinco linhas, incluindo os cabeçalhos. 1. As células na primeira linha devem ser cabeçalhos de tabela contendo dias da semana. 1. As células na primeira coluna devem ser cabeçalhos de tabela com uma class de time e devem conter valores de tempo como seu texto. 1. Todas as células de dados devem ter a class de available-#, onde # é um número de 0 a 5 que especifica o número de pessoas disponíveis naquele momento. 1. No seu seletor :root, você deve definir seis variáveis CSS nomeadas --color#, onde # é um número de 0 a 5, e atribuir a cada uma um valor de cor. Use essas variáveis para definir a cor de fundo dos elementos correspondentes .available-#. 1. No seu seletor :root, você deve definir variáveis CSS chamadas --solid-border e --dashed-border. Use essas variáveis para estilizar as bordas inferiores das suas células de dados, alternando entre bordas sólidas e tracejadas dependendo da linha. Dê às linhas a classe sharp ou half para estilizar elas. 1. Você deve ter um elemento div com o id legend. Ele deve conter um elemento span com o texto Disponibilidade e um elemento div com o id legend-gradient. 1. Você deve dar ao elemento #legend-gradient um gradiente linear que transita entre todas as cores de --color0 a --color5 com linhas duras. Nota: Certifique-se de vincular sua folha de estilos no seu HTML para aplicar seu CSS.

Testes:

• Você deve ter um elemento `table`.
• Você deve ter apenas um elemento `table`.
• A tabela deve ter pelo menos `5` linhas.
• A tabela deve ter pelo menos `3` colunas.
• A primeira linha da tabela deve conter pelo menos três elementos `th`.
• A primeira linha da tabela não deve conter elementos `td`.
• Você deve ter pelo menos duas linhas com a classe `sharp`.
• Você deve ter pelo menos duas linhas com a classe `half`.
• Elementos `th` na primeira coluna devem ter a `class` `time` e conter valores de tempo.
• Você deve ter pelo menos quatro elementos `th` com a classe `time` que contenham valores de tempo.
• Todos os elementos `td` devem ter a `class` de `available-#`, onde `#` é um número de `0` a `5`.
• Você deve ter pelo menos oito elementos `.available-#`, onde `#` é um número entre `0` e `5`.
• Você deve definir uma variável `--color0` no seletor raiz.
• Você deve definir uma variável `--color1` no seletor raiz.
• Você deve definir uma variável `--color2` no seletor raiz.
• Você deve definir uma variável `--color3` no seletor raiz.
• Você deve definir uma variável `--color4` no seletor raiz.
• Você deve definir uma variável `--color5` no seletor raiz.
• Você deve usar `--color0` para definir a cor de fundo dos elementos `.available-0`.
• Você deve usar `--color1` para definir a cor de fundo dos elementos `.available-1`.
• Você deve usar `--color2` para definir a cor de fundo dos elementos `.available-2`.
• Você deve usar `--color3` para definir a cor de fundo dos elementos `.available-3`.
• Você deve usar `--color4` para definir a cor de fundo dos elementos `.available-4`.
• Você deve usar `--color5` para definir a cor de fundo dos elementos `.available-5`.
• Você deve definir uma variável `--solid-border` no seletor raiz.
• Você deve definir uma variável `--dashed-border` no seletor raiz.
• Você deve selecionar elementos `td` que sejam filhos de elementos `.sharp`.
• Você deve usar `--solid-border` para definir o `bottom-border` dos elementos `td` que sejam filhos de elementos `.sharp`.
• Você deve selecionar elementos `td` que sejam filhos de elementos `.half`.
• Você deve usar `--dashed-border` para definir o `bottom-border` dos elementos `td` dos elementos `.half`.
• Você deve ter um elemento `div` com o `id` de `legend`.
• Você deve ter um elemento `span` com o texto `Availability` dentro de `#legend`.
• Você deve ter um elemento `div` com o `id` de `legend-gradient` dentro de `#legend`.
• Você deve definir a imagem de fundo de `#legend-gradient` como um gradiente linear.
• Você deve ter as transições de uma cor para a cor seguinte como uma linha dura para o seu `#legend-gradient`. Certifique-se de que suas porcentagens sejam números inteiros.