Skip to content

Commit

Permalink
feat: html terminado, por hora
Browse files Browse the repository at this point in the history
  • Loading branch information
zolppy committed May 12, 2024
1 parent b4f6aa1 commit f6bfe03
Showing 1 changed file with 211 additions and 21 deletions.
232 changes: 211 additions & 21 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -52,28 +52,218 @@ <h1 class="app__title">Formulário de Cadastro de Magos</h1>
<p class="app__question">
02 - De onde você extrai seu poder místico?
<span class="app__required-symbol">*</span>
<div class="app__radio-wrapper">
<input type="radio" name="question-02" id="1" class="app__radio">
<label for="1" class="app__radio-label">Dos ventos ancestrais</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-02" id="2" class="app__radio">
<label for="2" class="app__radio-label">Das profundezas da terra</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-02" id="3" class="app__radio">
<label for="3" class="app__radio-label">Das estrelas acima</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-02" id="4" class="app__radio">
<label for="4" class="app__radio-label">Das águas primordiais</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-02" id="5" class="app__radio">
<label for="5" class="app__radio-label">Outro:</label>
<input type="text" class="app__input" />
</div>
</p>
<div class="app__radio-wrapper">
<input type="radio" name="question-02" id="1" class="app__radio" />
<label for="1" class="app__radio-label"
>Dos ventos ancestrais</label
>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-02" id="2" class="app__radio" />
<label for="2" class="app__radio-label"
>Das profundezas da terra</label
>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-02" id="3" class="app__radio" />
<label for="3" class="app__radio-label">Das estrelas acima</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-02" id="4" class="app__radio" />
<label for="4" class="app__radio-label"
>Das águas primordiais</label
>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-02" id="5" class="app__radio" />
<label for="5" class="app__radio-label">Outro:</label>
<input type="text" class="app__input" placeholder="Sua resposta" />
</div>
</div>
<div class="app__form-container">
<p class="app__question">
03 - Qual entidade mística ou ser mágico guia seus passos?
<span class="app__required-symbol">*</span>
</p>
<div class="app__radio-wrapper">
<input type="radio" name="question-03" id="6" class="app__radio" />
<label for="6" class="app__radio-label">Fênix Flamejante</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-03" id="7" class="app__radio" />
<label for="7" class="app__radio-label">Dragão Ancestral</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-03" id="8" class="app__radio" />
<label for="8" class="app__radio-label">Sábio da Floresta</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-03" id="9" class="app__radio" />
<label for="9" class="app__radio-label">Espírito dos Antigos</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-03" id="10" class="app__radio" />
<label for="10" class="app__radio-label">Outro:</label>
<input type="text" class="app__input" placeholder="Sua resposta" />
</div>
</div>
<div class="app__form-container">
<p class="app__question">
04 - Como descreveria a essência de sua magia?
<span class="app__required-symbol">*</span>
</p>
<div class="app__radio-wrapper">
<input type="radio" name="question-04" id="11" class="app__radio" />
<label for="11" class="app__radio-label">Luminosa como o sol</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-04" id="12" class="app__radio" />
<label for="12" class="app__radio-label"
>Profunda como a noite</label
>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-04" id="13" class="app__radio" />
<label for="13" class="app__radio-label">Fluida como o rio</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-04" id="14" class="app__radio" />
<label for="14" class="app__radio-label"
>Selvagem como a tempestade</label
>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-04" id="15" class="app__radio" />
<label for="15" class="app__radio-label">Outro:</label>
<input type="text" class="app__input" placeholder="Sua resposta" />
</div>
</div>
<div class="app__form-container">
<p class="app__question">
05 - Qual elemento você sente mais afinidade?
<span class="app__required-symbol">*</span>
</p>
<div class="app__radio-wrapper">
<input type="radio" name="question-05" id="16" class="app__radio" />
<label for="16" class="app__radio-label">Fogo</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-05" id="17" class="app__radio" />
<label for="17" class="app__radio-label">Terra</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-05" id="18" class="app__radio" />
<label for="18" class="app__radio-label">Ar</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-05" id="19" class="app__radio" />
<label for="19" class="app__radio-label">Água</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-05" id="20" class="app__radio" />
<label for="20" class="app__radio-label">Espírito</label>
</div>
</div>
<div class="app__form-container">
<p class="app__question">
06 - Qual elemento você sente mais afinidade?
<span class="app__required-symbol">*</span>
</p>
<div class="app__radio-wrapper">
<input type="radio" name="question-06" id="21" class="app__radio" />
<label for="21" class="app__radio-label">Magia de ilusão</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-06" id="22" class="app__radio" />
<label for="22" class="app__radio-label">Magia Elemental</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-06" id="23" class="app__radio" />
<label for="23" class="app__radio-label"
>Magia de Transformação</label
>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-06" id="24" class="app__radio" />
<label for="24" class="app__radio-label">Magia de invocação</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-06" id="25" class="app__radio" />
<label for="25" class="app__radio-label">Magia Cósmica</label>
</div>
</div>
<div class="app__form-container">
<p class="app__question">
07 - Descreva um desafio mágico que superou com sua habilidade e
sabedoria
</p>
<textarea
class="app__textarea"
placeholder="Sua resposta"
maxlength="100"
></textarea>
</div>
<div class="app__form-container">
<p class="app__question">
08 - Você já fez algum pacto ou juramento com entidades místicas?
<span class="app__required-symbol">*</span>
</p>
<div class="app__radio-wrapper">
<input type="radio" name="question-08" id="27" class="app__radio" />
<label for="27" class="app__radio-label">Sim</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-08" id="28" class="app__radio" />
<label for="28" class="app__radio-label">Não</label>
</div>
</div>
<div class="app__form-container">
<p class="app__question">
09 - Caso sua resposta à pergunta anterior seja "sim", descreva
brevemente
</p>
<textarea
class="app__textarea"
placeholder="Sua resposta"
maxlength="100"
></textarea>
</div>
<div class="app__form-container">
<p class="app__question">
10 - Já teve visões proféticas ou sonhos místicos?
<span class="app__required-symbol">*</span>
</p>
<div class="app__radio-wrapper">
<input type="radio" name="question-10" id="29" class="app__radio" />
<label for="29" class="app__radio-label">Sim</label>
</div>
<div class="app__radio-wrapper">
<input type="radio" name="question-10" id="30" class="app__radio" />
<label for="30" class="app__radio-label">Não</label>
</div>
</div>
<div class="app__form-container">
<p class="app__question">
11 - Caso sua resposta à pergunta anterior seja "sim", descreva
brevemente
</p>
<textarea
class="app__textarea"
placeholder="Sua resposta"
maxlength="100"
></textarea>
</div>
<div class="app__form-container">
<p class="app__question">
12 - Qual é o seu objetivo final como mago neste vasto universo de
mistérios?
</p>
<textarea
class="app__textarea"
placeholder="Sua resposta"
maxlength="100"
></textarea>
</div>
<button type="submit" class="app__button">Enviar</button>
</form>
Expand Down

0 comments on commit f6bfe03

Please sign in to comment.