diff --git a/Atividade_casa_alunas/danielle_bena/Conteudo_aula/css/style.css b/Atividade_casa_alunas/danielle_bena/Conteudo_aula/css/style.css new file mode 100644 index 0000000..fd40910 --- /dev/null +++ b/Atividade_casa_alunas/danielle_bena/Conteudo_aula/css/style.css @@ -0,0 +1,4 @@ + + + + diff --git a/Atividade_casa_alunas/danielle_bena/Conteudo_aula/img/Maldivas.jpg b/Atividade_casa_alunas/danielle_bena/Conteudo_aula/img/Maldivas.jpg new file mode 100644 index 0000000..9e71755 Binary files /dev/null and b/Atividade_casa_alunas/danielle_bena/Conteudo_aula/img/Maldivas.jpg differ diff --git a/Atividade_casa_alunas/danielle_bena/Conteudo_aula/img/Paris.jpg b/Atividade_casa_alunas/danielle_bena/Conteudo_aula/img/Paris.jpg new file mode 100644 index 0000000..fbf333c Binary files /dev/null and b/Atividade_casa_alunas/danielle_bena/Conteudo_aula/img/Paris.jpg differ diff --git a/Atividade_casa_alunas/danielle_bena/Conteudo_aula/img/viagem.png b/Atividade_casa_alunas/danielle_bena/Conteudo_aula/img/viagem.png new file mode 100644 index 0000000..738a3f4 Binary files /dev/null and b/Atividade_casa_alunas/danielle_bena/Conteudo_aula/img/viagem.png differ diff --git a/Atividade_casa_alunas/danielle_bena/Conteudo_aula/index.html b/Atividade_casa_alunas/danielle_bena/Conteudo_aula/index.html new file mode 100644 index 0000000..e6f4aed --- /dev/null +++ b/Atividade_casa_alunas/danielle_bena/Conteudo_aula/index.html @@ -0,0 +1,55 @@ + + + + + + + Meus Sonhos + + +
+ Imagem do globo terra +

Meus próximos destinos

+
+
+ + +
+

Lugares que eu ainda vou conhecer

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis ipsum reprehenderit fugit ipsa veritatis dolores quaerat? Saepe veniam perferendis quasi nemo magnam deleniti laboriosam porro autem, officiis voluptate. Omnis, officiis. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Iure consequuntur omnis vero, pariatur deserunt adipisci. Veritatis quos id perferendis ipsa dolores vel quam molestiae neque sit, earum, temporibus distinctio quas!

+

Lorem um dolor sit amet consectetur adipisicing elit. Omnis adipisci aspernatur cupiditate dolor nesciunt accusantium, fugiat sit laboriosam, sed error quae ipsam! Culpa ipsa sunt quod suscipit laboriosam distinctio placeat. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Iusto dolorum beatae dignissimos minus culpa consectetur quae eum, temporibus ea ab asperiores rem, illo distinctio fugit amet itaque eaque. Minima, illum.

+
+ + + +
+
+
+

Paris

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Nobis neque, vero porro natus nihil rerum vel aperiam alias, cupiditate sint nemo enim nostrum. Omnis, aliquam quas quis neque sint eum.

+
+ Paris +
+
+
+

Maldivas

+

Lorem ipsum dolor sit amet consectetur adipisicing elit. Nobis neque, vero porro natus nihil rerum vel aperiam alias, cupiditate sint nemo enim nostrum. Omnis, aliquam quas quis neque sint eum.

+
+ Maldivas +
+
+ + + + + + +
+ + + \ No newline at end of file diff --git a/Atividade_casa_alunas/danielle_bena/css/style.css b/Atividade_casa_alunas/danielle_bena/css/style.css new file mode 100644 index 0000000..049f12e --- /dev/null +++ b/Atividade_casa_alunas/danielle_bena/css/style.css @@ -0,0 +1,209 @@ +@import url('https://fonts.googleapis.com/css2?family=Inter:wght@200;300;400;500&family=Open+Sans:wght@300;400;500;600&display=swap'); +* { + padding: 0; + margin: 0; + box-sizing: border-box; + font-family: 'Inter', sans-serif; +} + +body { + width: 100%; + height: 100vh; + display: flex; + justify-content: center; + align-items: center; + background: #b382ba; +} + +.container { + width: 80%; + height: 80vh; + display: flex; + box-shadow: 5px 5px 10px rgba(0, 0, 0, 0.212); +} + +.form-image { + width: 50%; + display: flex; + justify-content: center; + align-items: center; + background-color: #cbcbcb; + padding: 1rem; +} + +.form-image img { + width: 31rem; +} + +.form { + width: 50%; + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + background-color: #fff; + padding: 3rem; +} + +.form-header { + margin-bottom: 3rem; + display: flex; + justify-content: space-between; +} + +.login-button { + display: flex; + align-items: center; +} + +.login-button button { + border: none; + background-color: #7D4695; + padding: 0.4rem 1rem; + border-radius: 5px; + cursor: pointer; +} + +.login-button button:hover { + background-color: #7D4695; +} + +.login-button button a { + text-decoration: none; + font-weight: 500; + color: #fff; +} + +.form-header h1::after { + content: ''; + display: block; + width: 5rem; + height: 0.3rem; + background-color: #7D4695; + margin: 0 auto; + position: absolute; + border-radius: 10px; +} + +.input-group { + display: flex; + flex-wrap: wrap; + justify-content: space-between; + padding: 1rem 0; +} + +.input-box { + display: flex; + flex-direction: column; + margin-bottom: 1.1rem; +} + +.input-box input { + margin: 0.6rem 0; + padding: 0.8rem 1.2rem; + border: none; + border-radius: 10px; + box-shadow: 1px 1px 6px #0000001c; + font-size: 0.8rem; +} + +.input-box input:hover { + background-color: #eeeeee75; +} + +.input-box input:focus-visible { + outline: 1px solid #7D4695; +} + +.input-box label, +.gender-title h6 { + font-size: 0.75rem; + font-weight: 600; + color: #000000c0; +} + +.input-box input::placeholder { + color: #000000be; +} + +.gender-group { + display: flex; + justify-content: space-between; + margin-top: 0.62rem; + padding: 0 .5rem; +} + +.gender-input { + display: flex; + align-items: center; +} + +.gender-input input { + margin-right: 0.35rem; +} + +.gender-input label { + font-size: 0.81rem; + font-weight: 600; + color: #000000c0; +} + +.continue-button button { + width: 100%; + margin-top: 2.5rem; + border: none; + background-color: #7D4695; + padding: 0.62rem; + border-radius: 5px; + cursor: pointer; +} + +.continue-button button:hover { + background-color: #7D4695; +} + +.continue-button button a { + text-decoration: none; + font-size: 0.93rem; + font-weight: 500; + color: #fff; +} + +@media screen and (max-width: 1330px) { + .form-image { + display: none; + } + .container { + width: 50%; + } + .form { + width: 100%; + } +} + +@media screen and (max-width: 1064px) { + .container { + width: 90%; + height: auto; + } + .input-group { + flex-direction: column; + z-index: 5; + padding-right: 5rem; + max-height: 10rem; + overflow-y: scroll; + flex-wrap: nowrap; + } + .indication-inputs { + margin-top: 2rem; + } + .gender-group { + flex-direction: column; + } + .gender-title h6 { + margin: 0; + } + .gender-input { + margin-top: 0.5rem; + } +} \ No newline at end of file diff --git a/Atividade_casa_alunas/danielle_bena/img/undraw_services_re_hu5n.svg b/Atividade_casa_alunas/danielle_bena/img/undraw_services_re_hu5n.svg new file mode 100644 index 0000000..4f71ce4 --- /dev/null +++ b/Atividade_casa_alunas/danielle_bena/img/undraw_services_re_hu5n.svg @@ -0,0 +1,64 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/Atividade_casa_alunas/danielle_bena/index.html b/Atividade_casa_alunas/danielle_bena/index.html new file mode 100644 index 0000000..4cb05d8 --- /dev/null +++ b/Atividade_casa_alunas/danielle_bena/index.html @@ -0,0 +1,96 @@ + + + + + + + + Atividade S4 - Danielle Bená + + + +
+
+ +
+
+
+
+
+

Cadastre-se

+
+ +
+ +
+
+ + +
+ +
+ + +
+
+ + +
+ +
+ + +
+ +
+ + +
+ + +
+ + +
+ +
+ +
+
+
Conheci a {reprograma} através de:
+
+ +
+
+ + +
+ +
+ + +
+ +
+ + +
+ +
+ + +
+
+
+ +
+ +
+
+
+
+ + +