https://github.com/raizacirne/controle-lampada

Simulação do controle de uma lâmpada que pode ser acesa, apagada ou configurada para piscar.
https://github.com/raizacirne/controle-lampada

css3 html5 javascript sass

Last synced: 11 days ago
JSON representation

Simulação do controle de uma lâmpada que pode ser acesa, apagada ou configurada para piscar.

• Host: GitHub
• URL: https://github.com/raizacirne/controle-lampada
• Owner: RaizaCirne
• Created: 2022-08-02T20:56:35.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2024-03-15T15:01:20.000Z (8 months ago)
• Last Synced: 2024-03-16T17:02:51.465Z (8 months ago)
• Topics: css3, html5, javascript, sass
• Language: SCSS
• Homepage: https://65f317609af916ef8ccd10c2--astonishing-llama-db8d68.netlify.app/
• Size: 5.38 MB
• Stars: 4
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# 📋 Indíce

- [Bem-vindo](#id01)

- [Proposta](#id02)

- [Desafio](#id03)

- [Aprendizado](#id04)

- [Prosseguimento](id05)

- [Screenshots](#id06)

- [Links](#id07)

- [Tecnologias utilizadas](#id08)

- [Pré-requisitos](#id09)

- [Procedimentos de instalação](#id010)

- [Informações](#id011)

# Bem-vindo! 👋 

**Controle de Lâmpada**




## 🚀 Proposta 

Este projeto consiste na simulação do controle de uma lâmpada. A lâmpada pode ser acesa, apagada ou configurada para piscar.




## :trophy: Desafio 

- Acender: Ao clicar no botão "ON", a imagem da lâmpada é trocada pela versão acesa.

- Apagar: Ao clicar no botão "OFF", a imagem da lâmpada é trocada pela versão apagada.

- Piscar: Ao clicar no botão "BLINK", a lâmpada entra em modo de piscar, alternando rapidamente entre ligado e desligado por um período de tempo.

## :trophy: Aprendizado 

#### Construído com:




- JavaScript

- Eventos de sincronização no JS

- Estruturas de controle

- Document Object Model (DOM)

- Media queries

- Responsividade

- SASS

- Mixins

## :trophy: Prosseguimento 

- Realizar outros projetos utilizando o React.js




# :camera_flash: Screenshots 

## :video_camera: Video

https://github.com/RaizaCirne/controle-lampada/assets/109912543/59c40d46-e07a-4651-84d6-15728d9a7a1b

## :desktop_computer: Desktop design

![Design preview desktop](./assets/images/lampada-desktop.png)

## :iphone: Mobile design

![Design preview desktop](./assets/images/lampada-mobile.png)




# :heavy_check_mark: Links 




- Para acessar o site [Clique aqui](https://65f317609af916ef8ccd10c2--astonishing-llama-db8d68.netlify.app/)




# 🛠 Tecnologias utilizadas 




- JavaScript

- Git

- SASS

- CSS3

- HTML5




# ☑️ Pré-requisitos 




- [x] Editor de código de sua preferência (recomendado VS code)

- [x] Git




# 📝 Procedimentos de instalação 




Clone este repositório usando o comando:

```bash

git clone https://github.com/RaizaCirne/controle-lampada.git

```

Baixar arquivo zip

Extrir arquivos

Abrir pasta no editor de código.




# :sunglasses: Informações 




- Personal Page - [Raíza Cirne Braz](https://65f317609af916ef8ccd10c2--astonishing-llama-db8d68.netlify.app/)

- Frontend Mentor - [@RaizaCirne](https://www.frontendmentor.io/profile/RaizaCirne)

- GitHub - [RaizaCirne](https://github.com/RaizaCirne)

- LinkedIn - [Raíza Cirne Braz](https://www.linkedin.com/in/ra%C3%ADzacirne/)

**JavaScript - GIT - SASS - CSS3 - HTML5** 🚀