Skip to content

Reto 1: Mejora el CSS del sitio [Peronalizalo a tu gusto] #2

New issue

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

#

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

Already on GitHub? # to your account

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open

Reto 1: Mejora el CSS del sitio [Peronalizalo a tu gusto] #2

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
96af0c8
Primera opcion, con el boton de return fuera del grid
Max23Esau Jun 3, 2020
bbaa526
Opcion con el boton de return dentro del grid
Max23Esau Jun 3, 2020
07fa83f
reacomodamos los archivos
Max23Esau Jun 12, 2020
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
3 changes: 3 additions & 0 deletions .vscode/settings.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"liveServer.settings.port": 5501
}
16 changes: 8 additions & 8 deletions src/index.html → index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="styles/main.css">
<title>Error 404</title>
<link rel="stylesheet" href="./styles/main.css">
</head>

<body>
Expand All @@ -24,12 +24,12 @@ <h3>Mi Site</h3>
</div>
</div>
<div class="Hero-content">
<div class="Hero-title">
<h1>404</h1>
<h2>Lost in Space</h2>
<h3>It seems you are lost in space</h3>
<a href="#" class="btn">Back to home</a>
</div>
<div class="Hero-title">
<h1>404</h1>
<h2>Lost in Space</h2>
<h3>It seems you are lost in space</h3>
<a href="#" class="btn">Back to home</a>
</div>
<div class="Hero-image">
<figure>
<img src="https://arepa.s3.amazonaws.com/astro1.png" alt="404">
Expand Down
30 changes: 15 additions & 15 deletions src/styles/main.css → styles/main.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,52 +65,52 @@ body {

.Hero-content {
display: flex;
justify-content: space-between;
justify-content: space-evenly;
align-items: center;
}

.Hero-title {
padding: 1em;
text-align: center;
margin-top: -40px;
padding: 0;
}

.Hero-title h1 {
font-size: 400px;
color: rgba(255,255,255,0.2);
font-size: 350px;
color: white;
margin: 0;
padding: 0;
text-shadow: 0 0 50px #31d6dd;
}

.Hero-title h2 {
font-size: 45px;
margin: -130px 0 0 0;
margin: 0;
}

.Hero-title h3 {
font-weight: 200;
margin: 1em 0 1.5em 0;
}

.Hero-title a {
text-decoration: none;
}

.Hero-title .btn {
background-color: #002f4b;
cursor: pointer;
margin: 30px 0px;
padding: 12px;
padding: 15px;
border: 1px solid #002f4b;
color: white;
font-weight: 200;
text-transform: uppercase;
font-size: 15px;
font-size: 20px;
border-radius: 5px;
letter-spacing: 1.5px;
box-shadow: 0 1px 2px 0 rgba(0,0,0,.3);
}

.Hero-title a {
text-decoration: none;
}

.Hero-image figure {
margin: 0;
padding: 0;
text-align: right;
}
}