Repository: FolhaSP/teste-para-frontend Branch: master Commit: b9e20a267348 Files: 4 Total size: 4.1 KB Directory structure: gitextract_tcxa6r5w/ ├── .gitignore ├── README.md ├── index.html └── instrucoes-leia_me.txt ================================================ FILE CONTENTS ================================================ ================================================ FILE: .gitignore ================================================ *Thumbs.db ================================================ FILE: README.md ================================================ ``` _ _ _ _ _ __ | |_ ___ | | | | ___ | | (_) \ \ | ' \ / -_) | | | | / _ \ |_| _ | | |_||_| \___| |_| |_| \___/ (_) ( ) | | |/ /_/ ``` # Teste para candidatos à vaga de desenvolvedor Front-end ### Instruções 1. Criar o HTML/CSS responsivo com base no layout navegável. 2. Nós queremos avaliar o seu nível de conhecimento em design responsivo (Responsive Web Design) usando HTML5, CSS3 e grids. Caso queira, utilize pré-processadores (Less, SASS ou Stylus, esse último é o nosso favorito :D). 3. O grid do layout é baseado no Grid System do Bootstrap 3, mas não copie todo o bootstrap 3 para o projeto. Nós queremos ver você fazendo os breakpoints e as modificações dependendo do device. 4. Não tenha pressa! Iremos avaliar a qualidade do seu código, mesmo incompleto e principalmente a sua semântica. ### Material * Desktop: https://invis.io/N83OWYCZ5 * Mobile: https://invis.io/ZA3PCIES4 * Tablet e monitores menores: https://invis.io/9Y3PCJ06B * *OBS*: estas mesmas imagens ficam na pasta "layouts". ### Atenção * Os recortes das imagens estão na pasta "slices", mas você é livre para usar um http://lorempixel.com da vida no lugar. * Hospede o CSS dentro da pasta "css". * Não é necessário fazer o carrossel/rotate funcionar. * Não é necessário que a fonte seja exatamente a mesma usada na arte. Se quiser mantê-la, é a "Helvetica". ;) * É permitido usar qualquer editor de código e consultar a internet. * Suporte de Browsers: IE9+, Chrome, Safari, Firefox. ### Links úteis * Grid: http://getbootstrap.com/css/#grid * Paleta de cores usadas no layout: https://color.adobe.com/pt/teste-folha-web-color-theme-6584765/ * Mussum Ipsum (gerador de lorem ipsum do Mussum): http://mussumipsum.com/ Ao terminar o teste, solicite um pull request. Em caso de dúvidas, envie e-mail para l-tec-recrutamento-frontend@grupofolha.com.br. **Boa sorte!** ================================================ FILE: index.html ================================================ Folha de S.Paulo ================================================ FILE: instrucoes-leia_me.txt ================================================ _ _ _ _ _ __ | |_ ___ | | | | ___ | | (_) \ \ | ' \ / -_) | | | | / _ \ |_| _ | | |_||_| \___| |_| |_| \___/ (_) ( ) | | |/ /_/ Teste para candidatos à vaga de desenvolvedor Front-end na Folha de S.Paulo Instruções: - Criar o HTML/CSS responsivo com base no layout navegável. Nós queremos avaliar o seu nível de conhecimento em design responsivo (Responsive Web Design) usando HTML5, CSS3 e grids. Caso queira, utilize pré-processadores (Less, SASS ou Stylus, esse último é o nosso favorito :D). O grid do layout é baseado no Grid System do Bootstrap 3, mas não copie todo o bootstrap 3 para o projeto. Nós queremos ver você fazendo os breakpoints e as modificações dependendo do device. Não tenha pressa! Iremos avaliar a qualidade do seu código, mesmo incompleto e principalmente a sua semântica. Desktop: https://invis.io/N83OWYCZ5 Mobile: https://invis.io/ZA3PCIES4 Tablet e monitores menores: https://invis.io/9Y3PCJ06B Se precisar, essas mesmas imagens ficam na pasta "layouts". Atenção: - Os recortes das imagens estão na pasta "slices", mas você é livre para usar um http://lorempixel.com da vida no lugar. - Hospede o CSS dentro da pasta "css". - Não é necessário fazer o carrossel/rotate funcionar. - Não é necessário que a fonte seja exatamente a mesma usada na arte. Se quiser mantê-la, é a "Helvetica". ;) - É permitido usar qualquer editor de código e consultar a internet. Suporte de Browsers: IE9+, Chrome, Safari, Firefox. Úteis: Grid: http://getbootstrap.com/css/#grid Paleta de cores usadas no layout: https://color.adobe.com/pt/teste-folha-web-color-theme-6584765/ Mussum Ipsum (gerador de lorem ipsum do Mussum): http://mussumipsum.com/ Boa sorte!