Skip to content

Commit

Permalink
Add contact
Browse files Browse the repository at this point in the history
  • Loading branch information
@andreumagu
andreumagu committed Nov 26, 2023
1 parent b67840f commit b9dcc14
Show file tree
Hide file tree
Showing 4 changed files with 72 additions and 34 deletions.
19 changes: 10 additions & 9 deletions contact.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,22 +23,23 @@
<div class="container">
<div class="d-flex align-items-center justify-content-center" style="min-height: 100vh;">
<div class="container border-col form-container p-5">
<h3 class="text-center">Contacteme</h3>
<form action="">
<h3 class="text-center">Contácteme</h3>
<form action="mailto:andreumagu@gmail.com" enctype="text/plain" method="post">
<div class="form-group">
<label for="exampleInputEmail1">Nombre</label>
<input type="text" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Introduce tu nombre">
<label for="exampleInputEmail1">Nombre:</label>
<input type="text" class="form-control" id="nombre" name="Nombre" aria-describedby="emailHelp" placeholder="Introduce tu nombre">
</div>
<div class="form-group">
<label for="exampleInputEmail1">Correo electrónico</label>
<input type="email" class="form-control" id="exampleInputEmail1" aria-describedby="emailHelp" placeholder="Introduce el correo">
<label for="exampleInputEmail1">Correo electrónico:</label>
<input type="email" class="form-control" id="email" name="Email" aria-describedby="emailHelp" placeholder="Introduce el correo">
</div>
<div class="form-group">
<label for="exampleInputEmail1">Mensaje</label>
<textarea class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
<label for="exampleInputEmail1">Mensaje:</label>
<textarea class="form-control" id="texto" name="Texto" rows="5" placeholder="..."></textarea>
</div>
<button type="submit" class="btn button-color">Submit</button>
<button type="submit" class="btn button-color">Enviar</button>
</form>
<p id="p-number" class="m-0 mt-3"><a href="tel:+34603504062"><i class="bi bi-telephone-fill"></i>+34 603 504 062</a></p>
</div>
</div>
</div>
Expand Down
36 changes: 24 additions & 12 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,9 +40,9 @@ <h1 class="title-writer" aria-label="Hi! I'm a developer">
</p>
</div>

<div class="container text-center pb-4">
<div class="container text-center pb-5">
<div class="row">
<div class="col-sm columna mx-2 border-col py-4 mb-4">
<div class="col-sm columna mx-2 border-col py-4">
<div data-toggle="collapse" data-target="#demo1">
<i class="bi bi-bookmark i-dark"></i>
<h4>Estudios</h4>
Expand All @@ -55,38 +55,50 @@ <h4>Estudios</h4>
</ul>
</div>
</div>
<div class="col-sm columna mx-2 border-col py-4 mb-4">
<div class="col-sm columna mx-2 border-col py-4">
<div data-toggle="collapse" data-target="#demo2">
<i class="bi bi-code-slash i-dark"></i>
<h4>Progamación</h4>
<h4>Código</h4>
</div>
<div id="demo2" class="pt-3">
<p class="title-dest font-weight-bold">Leguajes de Programación</p>
<p class="title-dest font-weight-bold">Leguajes de Programación / Marcado</p>
<ul class="list-group list-group-flush">
<li class="list-group-item">JavaScript</li>
<li class="list-group-item">PHP</li>
<li class="list-group-item">Python</li>
<li class="list-group-item">Java</li>
<li class="list-group-item" data-toggle="collapse" data-target="#demo4"><i class="bi bi-arrow-down-short"></i></li>
<div id="demo4" class="collapse">
<ul class="list-group list-group-flush">
<li class="list-group-item">HTML</li>
<li class="list-group-item">CSS</li>
<li class="list-group-item">MySql</li>
</ul>
</div>

</ul>
</div>
</div>
<div class="col-sm columna mx-2 border-col py-4 mb-4">
<div class="col-sm columna mx-2 border-col py-4">
<div data-toggle="collapse" data-target="#demo3">
<i class="bi bi-braces i-dark"></i>
<h4>Lenguajes</h4>
<i class="bi bi-hourglass i-dark"></i>
<h4>Experiéncia</h4>
</div>
<div id="demo3" class="pt-3">
<p class="title-dest font-weight-bold">Leguajes de Marcado</p>
<p class="title-dest font-weight-bold">Laboral</p>
<ul class="list-group list-group-flush">
<li class="list-group-item">HTML</li>
<li class="list-group-item">CSS</li>
<li class="list-group-item">MySql</li>
<li class="list-group-item">Juniper Travel Technology - Prácticas</li>
<li class="list-group-item">Urbaser - Estudios de Campo</li>
</ul>
</div>
</div>
</div>
</div>

<div class="container d-flex justify-content-center pb-5">
<button class="contact-button" onclick="location.href='contact.html'">Contáctame</button>
</div>

<footer class="page-footer font-small blue py-4 footer-color">
<div class="container-fluid text-center text-md-left">
<div class="container text-center">
Expand Down
2 changes: 1 addition & 1 deletion script.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,7 +19,7 @@ function collapseOn() {
var demo2 = document.getElementById("demo2");
var demo3 = document.getElementById("demo3");

if (anchoPantalla < 992) {
if (anchoPantalla < 768) {
demo1.classList.add("collapse");
demo2.classList.add("collapse");
demo3.classList.add("collapse");
Expand Down
49 changes: 37 additions & 12 deletions style.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ body{

.title-writer {
font-size: 6vmin;
color: #333333;
color: #1d1d1d;
text-align: left;
font-family: Lato, sans-serif;
font-weight: 700;
Expand Down Expand Up @@ -142,6 +142,12 @@ p{
font-family: Lato, sans-serif;
font-weight: 700;
margin: 1rem 0 1rem 0;

}


.container-description{
padding: 10vmin 20px 10vmin 20px;
}
}

Expand All @@ -154,10 +160,15 @@ p{
font-weight: 700;
margin: 1rem 0 1rem 0;
}

.container-description{
padding: 10vmin 20px 10vmin 20px;
}

}

.container-description{
padding: 10vmin 3vmin 10vmin 3vmin;
padding: 10vmin 20px 10vmin 20px;
}

.container-description p{
Expand All @@ -170,15 +181,6 @@ p{
box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

/* .fa-timeline{
height: 50px;
height: 50px;
background-color: #007bff;
border-radius: 50%;
padding: 5px;
} */


.icon-container {
display: flex;
flex-direction: column;
Expand All @@ -194,6 +196,21 @@ p{
color: #6E07F3;
}

.contact-button{
height: 50px;
width: 150px;
border: solid 2px;
border-radius: 50px;
background-color: #FFF;
color: #6E07F3;
}

.contact-button:hover{
background-color: #6E07F3;
color: #fff;
transition: 0.3s;
}

.footer-color{
background-color: #6E07F3;
}
Expand All @@ -205,7 +222,7 @@ p{
.icon-footer:hover{
font-size: 40px;
color: #ebebeb;
animation: 0.2ms;
transition: 0.3s;
}

li{
Expand All @@ -223,4 +240,12 @@ li{
.button-color{
background-color: #6E07F3;
color: #FFF;
}

#p-number{
color: #333333;
}

#p-number a{
color: #333333;
}

0 comments on commit b9dcc14

Please sign in to comment.