Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Entrega do Desafio Front end Junior #46

Open
wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Entrega do Desafio Front end Junior #46

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions vnda/.gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
node_modules/
1 change: 1 addition & 0 deletions vnda/dist/css/style.css
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

31 changes: 31 additions & 0 deletions vnda/gulpfile.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
const {src, dest, watch} = require('gulp');
const compileSass = require('gulp-sass');
const minifyCss = require('gulp-clean-css');
const sourceMaps = require('gulp-sourcemaps');
const concat = require('gulp-concat');
const autoprefixer = require('gulp-autoprefixer');
const cssnano = require('gulp-cssnano');

compileSass.compiler = require('node-sass');

const bundleSass = () => {
return src('./src/sass/**/*.scss')
.pipe(sourceMaps.init())
.pipe(compileSass().on('error', compileSass.logError))
.pipe(sourceMaps.write())
.pipe(minifyCss())
.pipe(concat('style.css'))
.pipe(autoprefixer({
browsers: ['last 2 versions'],
cascade: false
}))
.pipe(cssnano())
.pipe(dest('./dist/css/'));
};

const devWatch = () => {
watch('./src/sass/**/*.scss', bundleSass);
}

exports.bundleSass = bundleSass;
exports.devWatch = devWatch;
181 changes: 181 additions & 0 deletions vnda/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,181 @@
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display&display=swap" rel="stylesheet">

<link
rel="stylesheet"
href="https://unpkg.com/swiper/swiper-bundle.min.css"
/>

<link rel="stylesheet" href="dist/css/style.css">

<title>Modelo Loja</title>
</head>
<body>
<header>
<div class="logo">
<img src="src/img/Logo/PAW__Fotografia.png" alt="loho do site">
</div>
<nav class="menu-nav">
<ul>
<li><a href="#">HOME</a></li>
<li><a href="#">ENSAIOS</a></li>
<li><a href="#">EQUIPE</a></li>
<li><a href="#">CONTATO</a></li>
</ul>
</nav>

<ul class="social-links">
<li><a href="#"><ion-icon name="search-circle-outline"></ion-icon></a></li>
<li><a href="#"><ion-icon name="person-circle-outline"></ion-icon></a></li>

</ul>
</header>

<section id="banner">
<div class="swiper-container mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide"><img src="src/img/canine-staying-cozy.jpg" alt=""></div>
<div class="swiper-slide"><img src="src/img/poochie-party-treats.jpg" alt=""></div>
<div class="swiper-slide"><img src="src/img/business-pug-working-on-laptop.jpg" alt=""></div>
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
</div>
</section>

<section id="secao1">
<div class="ball"><img src="src/img/1.jpg" alt=""></div>
<div class="ball"><img src="src/img/2.jpg" alt=""></div>
<div class="ball"><img src="src/img/3.jpg" alt=""></div>
<div class="ball"><img src="src/img/4.jpg" alt=""></div>
<div class="ball"><img src="src/img/5.jpg" alt=""></div>
<div class="ball"><img src="src/img/6.jpg" alt=""></div>
</section>

<main>
<section id="empresa">
<p>PAW! Fotografia</p>
<h2>Fotos do seu lindo pet</h2>
<p>A PAW! Fotografias é uma empresa especializada em tirar fotos dos seu querido bichinho.
Veja nossa galeria de fotos com esses lindos pets!</p>
</section>

<section id="galeria">
<div id="image1">
<figure><img src="src/img/main/brown-dog-looks-up-to-small-kitten-in-a-persons-hands.jpg" alt=""></figure>
<h3>Juca e Isa</h3>
<p>Momento em que Juca, a vira lata, conhece sua irmã mais nova Isa</p>
</div>

<div id="galeria2">
<div class="image2">
<figure><img src="src/img/main/brown-white-dogs.jpg" alt=""></figure>
<h3>Lana, Meg e Ruffus</h3>
<p>Paradinha para o click deste trio maravidogo</p>
</div>

<div class="image2">
<figure><img src="src/img/main/a-yawing-siamese-cat.jpg" alt=""></figure>
<h3>Horácio</h3>
<p>Friozinho + preguiça = a soninho</p>
</div>
</div>
</section>
</main>

<section id="secao2">
<div class="imgT">
<div class="imagem">
<img src="src/img/a-brussels-griffon-protects-laundry.jpg" alt="">
</div>
<div class="texto">
<p>PAW! Fotografia</p>
<h2>Venha fazer um ensaio com a gente.</h2>
<p>Aqui na PAW temos o maior cuidado para deixar seu pet sempre confortavel e tranquilo
para tirar as melhores fotos, sejam elas de um momento espontaneo ou não.
</p>
<button>Cadastre-se</button>
</div>
</div>
<div class="slider3D">
<img src="src/img/cute-cat-photo.jpg" alt="">
</div>
</section>

<section id="social">
<h2>@PAW! Fotografia</h2>
<div id="blocos">
<div class="instagram">
<ion-icon name="logo-instagram"></ion-icon>
</div>
<div class="textoInsta">
<p>Curtiu nosso trabalho? Então segue nosso instagram, lá nós sempre compartilhamos
as prévias de alguns ensaios, brincadeiras com nossos modelos e tambem temos varios
sorteios pra quem nos segue. Vem junto com a gente criar momentos lindos e guarda-los
pra sempre!
</p>
<ion-icon name="logo-instagram"></ion-icon>
</div>
<div class="instagram">
<ion-icon name="logo-instagram"></ion-icon>
</div>
</div>
</section>

<div class="logo">
<hr>
<img src="src/img/Logo/PAW__Fotografia.png" alt="">
<hr>
</div>

<footer>
<div id="footer">
<div class="menu-footer">
<h3>Links</h3>
<div class="submenu">
<a href="#">Home</a>
<a href="#">Ensaios</a>
</div>
<div class="submenu">
<a href="#">Equipe</a>
<a href="#">Contato</a>
</div>
</div>

<div class="menu-footer">
<h3>Contato</h3>
<div class="form">
<input type="email" id="email" placeholder="Email">
<input type="submit" value="Enviar >" class="botão">
</div>
<hr>
</div>

<div class="menu-footer">
<h3>Redes Sociais</h3>
<div class="redes">
<ion-icon name="logo-instagram"></ion-icon>
<a href="#">Intagram</a>
</div>
<div class="redes">
<ion-icon name="logo-facebook"></ion-icon>
<a href="#">Facebook</a>
</div>
</div>
</div>
<p>@PAW! - Ensaio fotográficos - CNPJ 00.0000.000/0001-00</p>
</footer>

<script type="module" src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.js"></script>

<script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
<script type="text/javascript" src="src/js/swiper.js"></script>
</body>
</html>
Loading