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

Jump to bottom

Desafío Semana 1 #11

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

Desafío Semana 1 #11

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
dcc83f3
Agrego archivos de para el desafío de la semana 1.
DanielG07 May 30, 2021
ce1e53d
Revert "Agrego archivos de para el desafío de la semana 1."
DanielG07 May 30, 2021
59d30a4
Agrego archivos de para el desafío de la semana 1.
DanielG07 May 30, 2021
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
145 changes: 145 additions & 0 deletions challenges/week1/DanielGonzalez/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,145 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Discord | Imagina un lugar</title>

<link rel="stylesheet" href="main.css">
</head>
<body>
<header class="main-header">
<nav>
<a href="">
<svg data-logo-old="true" width="124" height="34" viewBox="0 0 124 34" class="logo-3LF899"><g fill="currentColor"><path d="M18.1558 14.297C17.1868 14.297 16.4218 15.13 16.4218 16.167C16.4218 17.204 17.2038 18.037 18.1558 18.037C19.1248 18.037 19.8898 17.204 19.8898 16.167C19.8898 15.13 19.1078 14.297 18.1558 14.297ZM11.9508 14.297C10.9818 14.297 10.2168 15.13 10.2168 16.167C10.2168 17.204 10.9988 18.037 11.9508 18.037C12.9198 18.037 13.6848 17.204 13.6848 16.167C13.7018 15.13 12.9198 14.297 11.9508 14.297Z"></path><path d="M26.4178 0.152954H3.63783C1.71683 0.152954 0.152832 1.71695 0.152832 3.63795V26.418C0.152832 28.339 1.71683 29.903 3.63783 29.903H22.9158L22.0148 26.792L24.1908 28.798L26.2478 30.685L29.9198 33.864V3.63795C29.9028 1.71695 28.3388 0.152954 26.4178 0.152954ZM19.8558 22.168C19.8558 22.168 19.2438 21.437 18.7338 20.808C20.9608 20.179 21.8108 18.802 21.8108 18.802C21.1138 19.261 20.4508 19.584 19.8558 19.805C19.0058 20.162 18.1898 20.383 17.3908 20.536C15.7588 20.842 14.2628 20.757 12.9878 20.519C12.0188 20.332 11.1858 20.077 10.4888 19.788C10.0978 19.635 9.67283 19.448 9.24783 19.21C9.19683 19.176 9.14583 19.159 9.09483 19.125C9.06083 19.108 9.04383 19.091 9.02683 19.091C8.72083 18.921 8.55083 18.802 8.55083 18.802C8.55083 18.802 9.36683 20.145 11.5258 20.791C11.0158 21.437 10.3868 22.185 10.3868 22.185C6.62983 22.066 5.20183 19.618 5.20183 19.618C5.20183 14.195 7.64983 9.79195 7.64983 9.79195C10.0978 7.97295 12.4098 8.02395 12.4098 8.02395L12.5798 8.22795C9.51983 9.09495 8.12583 10.438 8.12583 10.438C8.12583 10.438 8.49983 10.234 9.12883 9.96195C10.9478 9.16295 12.3928 8.95895 12.9878 8.89095C13.0898 8.87395 13.1748 8.85695 13.2768 8.85695C14.3138 8.72095 15.4868 8.68695 16.7108 8.82295C18.3258 9.00995 20.0598 9.48595 21.8278 10.438C21.8278 10.438 20.4848 9.16295 17.5948 8.29595L17.8328 8.02395C17.8328 8.02395 20.1618 7.97295 22.5928 9.79195C22.5928 9.79195 25.0408 14.195 25.0408 19.618C25.0408 19.601 23.6128 22.049 19.8558 22.168ZM45.5258 7.42895H39.8818V13.77L43.6388 17.153V10.999H45.6448C46.9198 10.999 47.5488 11.611 47.5488 12.597V17.306C47.5488 18.292 46.9538 18.955 45.6448 18.955H39.8648V22.542H45.5088C48.5348 22.559 51.3738 21.046 51.3738 17.578V12.512C51.3908 8.97595 48.5518 7.42895 45.5258 7.42895ZM75.1058 17.578V12.376C75.1058 10.506 78.4718 10.081 79.4918 11.951L82.6028 10.693C81.3788 8.00695 79.1518 7.22495 77.2988 7.22495C74.2728 7.22495 71.2808 8.97595 71.2808 12.376V17.578C71.2808 21.012 74.2728 22.729 77.2308 22.729C79.1348 22.729 81.4128 21.794 82.6708 19.346L79.3388 17.816C78.5228 19.907 75.1058 19.397 75.1058 17.578ZM64.8208 13.09C63.6478 12.835 62.8658 12.41 62.8148 11.679C62.8828 9.92795 65.5858 9.85995 67.1668 11.543L69.6658 9.62195C68.1018 7.71795 66.3338 7.20795 64.5148 7.20795C61.7438 7.20795 59.0578 8.77195 59.0578 11.73C59.0578 14.603 61.2678 16.15 63.6988 16.524C64.9398 16.694 66.3168 17.187 66.2828 18.037C66.1808 19.652 62.8488 19.567 61.3358 17.731L58.9218 19.992C60.3328 21.811 62.2538 22.729 64.0558 22.729C66.8268 22.729 69.9038 21.131 70.0228 18.207C70.1928 14.518 67.5068 13.583 64.8208 13.09ZM53.4308 22.525H57.2388V7.42895H53.4308V22.525ZM117.64 7.42895H111.996V13.77L115.753 17.153V10.999H117.759C119.034 10.999 119.663 11.611 119.663 12.597V17.306C119.663 18.292 119.068 18.955 117.759 18.955H111.979V22.542H117.64C120.666 22.559 123.505 21.046 123.505 17.578V12.512C123.505 8.97595 120.666 7.42895 117.64 7.42895ZM89.9468 7.22495C86.8188 7.22495 83.7078 8.92495 83.7078 12.41V17.561C83.7078 21.012 86.8358 22.746 89.9808 22.746C93.1088 22.746 96.2198 21.012 96.2198 17.561V12.41C96.2198 8.94195 93.0748 7.22495 89.9468 7.22495ZM92.3948 17.561C92.3948 18.649 91.1708 19.21 89.9638 19.21C88.7398 19.21 87.5158 18.683 87.5158 17.561V12.41C87.5158 11.305 88.7058 10.71 89.8958 10.71C91.1368 10.71 92.3948 11.237 92.3948 12.41V17.561ZM109.888 12.41C109.803 8.87395 107.389 7.44595 104.278 7.44595H98.2428V22.542H102.102V17.748H102.782L106.284 22.542H111.044L106.93 17.357C108.749 16.779 109.888 15.198 109.888 12.41ZM104.346 14.45H102.102V10.999H104.346C106.743 10.999 106.743 14.45 104.346 14.45Z"></path></g></svg>
</a>
<ul class="main-">
<a href=""><li>Descargar</li></a>
<a href=""><li>¿Por qué Discord?</li></a>
<a href=""><li>Nitro</li></a>
<a href=""><li>Seguridad</li></a>
<a href=""><li>Soporte Técnico</li></a>
</ul>
<button class="btn-header">Iniciar Sesión</button>
</nav>
<section class="container-flex header-description column">
<h1>Imagina un lugar...</h2>
<p>
en el que puedas formar parte de un club escolar, un grupo de jugadores o una comunidad mundial de arte. En el que puedas pasar tiempo con unos cuantos amigos. Un lugar que haga que hablar a diario y divertirte más a menudo sea fácil.
</p>
<div>
<button class="btn">Descargar para Windows</button>
<button class="btn btn-black">Abrir Discord en tu navegador</button>
</div>
</section>
</header>

<div class="container column">
<div>
<section class="container-flex row">
<img src="https://discord.com/assets/c01c644bc9fa2a28678ae2f44969d248.svg" alt="">
<div class="description">
<h2>Crea un lugar solo para miembros en el que encajes</h2>
<p>Los servidores de Discord se organizan en canales ordenados por temas donde puedes colaborar, compartir o simplemente hablar de tu día sin monopolizar un chat de grupo.</p>
</div>
</section>
</div>

<div class="gray">
<section class="container-flex row">
<div class="description">
<h2>Donde es fácil pasar el rato</h2>
<p>Entra en un canal de voz cuando estés libre. Los amigos que tengas en tu servidor podrán ver que estás conectado y unirse al instante para hablar sin necesidad de llamar.</p>
</div>
<img src="https://discord.com/assets/98c9edf635a98377ec579aaa19ed47be.svg" alt="">
</section>
</div>

<div>
<section class="container-flex row">
<img src="https://discord.com/assets/9184fcadc2e3c84650dd4b075850d3d6.svg" alt="">
<div class="description">
<h2>De unos pocos fans a un montón</h2>
<p>Establece una comunidad de cualquier tamaño con las herramientas de moderación y el acceso personalizado de miembros. Concédeles poderes especiales, crea canales privados y mucho más.</p>
</div>
</section>
</div>

<div class="gray">
<section class="container-flex column ">
<div class="description-last">
<h2>Una tecnología fiable para mantenerse en contacto</h2>
<p>Gracias a la voz y el vídeo de baja latencia, parece que estáis en la misma habitación. Saluda a la cámara, accede a las transmisiones de los juegos de tus amigos o reuníos y disfrutad de una sesión de dibujo compartiendo la pantalla.
</p>
</div>
<img src="https://discord.com/assets/f61264d792fd2556a618c95d97b5de07.svg" alt="">
</section>

<section class="container-last column">
<h2>¿Todo listo para comenzar tu viaje?</h2>
<button class="btn btn-blue">Descargar para Windows</button>
</section>
</div>



</div>

<footer class="container-flex footer-flex">
<div>
<h4>Tu sitio para hablar</h4>
<ul>
<li><a href="">Twitter</a></li>
<li><a href="">Facebook</a></li>
</ul>
</div>
<div>
<h6>Producto</h6>
<ul>
<li><a href="">Descargar</a></li>
<li><a href="">Por qué Discord</a></li>
<li><a href="">Inspiración</a></li>
<li><a href="">Universidad</a></li>
<li><a href="">Nitro</a></li>
<li><a href="">Estado</a></li>
</ul>
</div>
<div>
<h6>Compañia</h6>
<ul>
<li><a href="">Sobre nosotros</a></li>
<li><a href="">Trabajos</a></li>
<li><a href="">Marca</a></li>
<li><a href="">Noticias</a></li>
<li><a href="">Tienda</a></li>
</ul>
</div>
<div>
<h6>Recursos</h6>
<ul>
<li><a href="">Soporte técnico</a></li>
<li><a href="">Seguridad</a></li>
<li><a href="">Blog</a></li>
<li><a href="">Opiniones</a></li>
<li><a href="">Socios</a></li>
<li><a href="">Verificación</a></li>
<li><a href="">Desarrolladores</a></li>
<li><a href="">StreamKit</a></li>
<li><a href="">Código abierto</a></li>
<li><a href="">Seguridad</a></li>
<li><a href="">Moderación</a></li>
</ul>
</div>
<div>
<h6>Políticas</h6>
<ul>
<li><a href="">Condiciones</a></li>
<li><a href="">Privacidad</a></li>
<li><a href="">Directivas</a></li>
<li><a href="">Agradecimientos</a></li>
<li><a href="">Licencias</a></li>
</ul>
</div>
</footer>

</body>
</html>
164 changes: 164 additions & 0 deletions challenges/week1/DanielGonzalez/main.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,164 @@
body {
margin: 0px;
font-size: 16px;
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

}

ul{
padding: 0px;
}

li{
list-style: none;
}

a{
text-decoration: none;
color:#FFFFFF;
}

a:hover{
text-decoration: underline;
color:#FFFFFF;
}

h2{
font-size: 48px;
line-height: 120%;
}

h6{
margin: 10px 0px;
font-size: 16px;
line-height: 24px;
}

img{
width: auto;
max-width: 100%;
}

button:hover{
opacity: 0.8;
}

.main-header{
height: 60vh;
background: #734ae6;
padding: 15px;
}

.main-header nav{
display: flex;
justify-content: space-evenly;
padding: 10px 0px;
}

.main-header a{
margin: auto 20px;
}

.main-header nav li{
display: inline;
padding: 0px 0px;
margin: 0px 5px;
}

.header-description{
color: white;
display: flex;
align-items: center;
}

.header-description h1{
font-weight: 700;
line-height: 120%;
font-size: 56px;
}

.header-description p{
font-size: 20px;
line-height: 32px;
text-align: center;
max-width: 720px;
width: auto;
}

.container-flex{
display: flex;
align-items: center;
flex-wrap: wrap;
max-width: 1260px;
margin:10px auto 0px;
padding: 0px 30px;
}

.gray{
background: #F6F6F6;
}

.row{
flex-direction: row;
}

.column{
flex-direction: column;
}

.description{
max-width: 380px;
margin:5px auto;
font-size: 20px;
line-height: 32px;
}

.description-last{
max-width: 1260px;
}

.footer-flex{
margin: 0px;
width: 100%;
height: 100%;
color:#7289da;
background:#23272a;
align-items: flex-start;
justify-content: space-evenly;
max-width: 100%;
}

.container-last{
display: flex;
align-items: center;
}


.btn-header{
border-width: 0px;
border-radius: 28px;
padding: 16px 32px;
margin: 0px 5px 20px;
}

.btn{
border-width: 0px;
border-radius: 28px;
font-size: 20px;
padding: 16px 32px;
margin: 0px 5px 20px;
}

.btn-blue{
background: #7289da;
color: white;
}

.btn-black{
background: black;
color: white;
}