Skip to content

Commit e7be451

Browse files
DandalymvDandalymv
committed
cambio formato
cambio formato por el propuesto en readme
1 parent 0725b10 commit e7be451

11 files changed

Lines changed: 383 additions & 109 deletions

‎basecamp_moviesPage.rar‎

489 KB
Binary file not shown.

‎basecamp_moviesPage/images/BackgroundMobile.png‎

311 KB
Loading

‎basecamp_moviesPage/images/awakelogo.png‎

82.1 KB
Loading

‎basecamp_moviesPage/images/backgroundDesktop.jpg‎

43.5 KB
Loading

‎basecamp_moviesPage/images/backgroundMobile.jpg‎

15.9 KB
Loading

‎basecamp_moviesPage/images/backgroundMobile_bkp.jpg‎

44.5 KB
Loading

‎basecamp_moviesPage/styles.css‎

Lines changed: 100 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,100 @@
1+
/** {
2+
margin: 0;
3+
padding: 0;
4+
-webkit-box-sizing: border-box;
5+
box-sizing: border-box;
6+
}*/
7+
body {
8+
background-color: #54595E;
9+
color: white;
10+
11+
}
12+
13+
h1 {
14+
font-family: 'Staatliches', cursive;
15+
color: rgb(255, 255, 255);
16+
margin: 0 auto;
17+
text-align: left;
18+
font-weight: 700;
19+
20+
}
21+
a{
22+
font-family: 'Staatliches', cursive;
23+
color: rgb(255, 255, 255);
24+
25+
}
26+
27+
.navtitle {
28+
width: 100%;
29+
margin-left: auto;
30+
margin-right: auto;
31+
-webkit-box-shadow: 4px 4px 10px rgb(0, 0, 0);
32+
border-radius: 1rem;
33+
34+
35+
}
36+
37+
.border {
38+
border-radius: 1rem;
39+
}
40+
41+
#form {
42+
width: 250px;
43+
margin: 0 auto;
44+
height: 50px;
45+
46+
}
47+
48+
#form p {
49+
text-align: center;
50+
}
51+
52+
#form label {
53+
font-size: 30px;
54+
}
55+
56+
input[type="radio"] {
57+
display: none;
58+
}
59+
60+
label {
61+
color: rgb(255, 255, 255);
62+
}
63+
64+
.clasificacion {
65+
direction: rtl;
66+
unicode-bidi: bidi-override;
67+
}
68+
69+
label:hover,
70+
label:hover ~ label {
71+
color: orange;
72+
}
73+
74+
input[type="radio"]:checked ~ label {
75+
color: orange;
76+
}
77+
78+
.btnenviar {
79+
width: 10rem;
80+
float: right;
81+
82+
}
83+
84+
.container{
85+
display: flex;
86+
flex-direction: column;
87+
margin-top: 10px;
88+
height: 480px;
89+
90+
}
91+
92+
footer div {
93+
94+
background-color: rgba(0, 0, 0, 0.2);
95+
margin-top: 10px;
96+
margin-left: auto;
97+
margin-right: auto
98+
}
99+
100+

‎basecamp_moviesPage/watch.html‎

Lines changed: 96 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,96 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
4+
<head>
5+
<meta charset="UTF-8">
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8+
<title>Página de visualización</title>
9+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css"
10+
integrity="sha384-B0vP5xmATw1+K9KRQjQERJvTumQW0nPEzvF6L/Z6nronJ3oUOFUFpCjEUQouq2+l" crossorigin="anonymous">
11+
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"
12+
integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
13+
crossorigin="anonymous"></script>
14+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"
15+
integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns"
16+
crossorigin="anonymous"></script>
17+
<link rel="preconnect" href="https://fonts.googleapis.com">
18+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
19+
<link href="https://fonts.googleapis.com/css2?family=Staatliches&display=swap" rel="stylesheet">
20+
<link rel="stylesheet" href="styles.css">
21+
</head>
22+
23+
<body>
24+
<header class="navtitle">
25+
<div>
26+
<nav class="navbar navbar-expand-lg navbar-dark bg-danger">
27+
<a class="navbar-brand" href="index.html">
28+
<img src="/images/awakelogo.png" width="30" height="30" class="d-inline-block align-left" alt="">
29+
AWAKEMOVIES
30+
</a>
31+
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarText"
32+
aria-controls="navbarText" aria-expanded="false" aria-label="Toggle navigation">
33+
<span class="navbar-toggler-icon"></span>
34+
</button>
35+
<div class="collapse navbar-collapse" id="navbarText">
36+
<ul class="navbar-nav mr-auto">
37+
<li class="nav-item">
38+
<a class="nav-link" href="./index.html">Inicio <span class="sr-only">(current)</span></a>
39+
</li>
40+
<li class="nav-item">
41+
<a class="nav-link" href="./details.html">Catálogo</a>
42+
</li>
43+
<li class="nav-item">
44+
<a class="nav-link" href="./watch.html">Ver ahora</a>
45+
</li>
46+
</ul>
47+
</div>
48+
</nav>
49+
</div>
50+
</header>
51+
<div class="row" style="width: 80%; justify-content: center; margin-left: auto; margin-right: auto;">
52+
<div class="col-lg-12">
53+
<div>
54+
<h1 style="margin-top: 10px;">Space Jam 2</h1>
55+
</div>
56+
<div class="embed-responsive embed-responsive-16by9">
57+
<iframe class="embed-responsive-item" src="https://www.youtube.com/embed/olXYZOsXw_o"
58+
allowfullscreen></iframe>
59+
</div>
60+
</div>
61+
<form class="col-lg-8">
62+
<div>
63+
<a>Puntúa esta película</a>
64+
<p class="clasificacion" style="margin-top: 10px; text-align: left">
65+
<input id="radio1" type="radio" name="estrellas" value="5">
66+
<label for="radio1">★</label>
67+
<input id="radio2" type="radio" name="estrellas" value="4">
68+
<label for="radio2">★</label>
69+
<input id="radio3" type="radio" name="estrellas" value="3">
70+
<label for="radio3">★</label>
71+
<input id="radio4" type="radio" name="estrellas" value="2">
72+
<label for="radio4">★</label>
73+
<input id="radio5" type="radio" name="estrellas" value="1">
74+
<label for="radio5">★</label>
75+
</p>
76+
<a>COMENTARIOS:</a>
77+
<textarea class="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
78+
79+
</div>
80+
81+
</form>
82+
<div class="col-lg-4">
83+
<a>Relacionadas</a>
84+
</div>
85+
</div>
86+
87+
88+
89+
<footer>
90+
<div class="text-center p-3">
91+
<a class="text-black" href="http://www.awakelab.cl">© 2021 Copyright: Awakelab IDW-GEN0308-3 Equipo 3 </a>
92+
</div>
93+
</footer>
94+
</body>
95+
96+
</html>

‎styles.css‎

Lines changed: 11 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -4,37 +4,31 @@
44
-webkit-box-sizing: border-box;
55
box-sizing: border-box;
66
}*/
7-
html {
8-
9-
}
10-
117
body {
12-
background-image: url(./images/BackgroundMobile.jpg);
13-
background-repeat: no-repeat;
14-
background-attachment: fixed;
15-
background-size: 105%;
16-
background-color: #e0e8ff;
17-
background-position: top;
8+
background-color: #54595E;
9+
color: white;
10+
1811
}
1912

2013
h1 {
2114
font-family: 'Staatliches', cursive;
22-
color: rgb(0, 0, 0);
15+
color: rgb(255, 255, 255);
2316
margin: 0 auto;
2417
text-align: left;
2518
font-weight: 700;
2619

2720
}
2821
a{
2922
font-family: 'Staatliches', cursive;
23+
color: rgb(255, 255, 255);
24+
3025
}
3126

3227
.navtitle {
33-
width: 95%;
34-
margin-top: 1rem;
28+
width: 100%;
3529
margin-left: auto;
3630
margin-right: auto;
37-
-webkit-box-shadow: 4px 4px 10px rgb(45, 103, 226);
31+
-webkit-box-shadow: 4px 4px 10px rgb(0, 0, 0);
3832
border-radius: 1rem;
3933

4034

@@ -64,7 +58,7 @@ input[type="radio"] {
6458
}
6559

6660
label {
67-
color: grey;
61+
color: rgb(255, 255, 255);
6862
}
6963

7064
.clasificacion {
@@ -88,31 +82,19 @@ input[type="radio"]:checked ~ label {
8882
}
8983

9084
.container{
91-
background-color: rgba(255, 255, 255, 0.25);
9285
display: flex;
9386
flex-direction: column;
94-
width: 95%;
9587
margin-top: 10px;
9688
height: 480px;
97-
border-radius: 1rem;
98-
-webkit-box-shadow: 4px 4px 10px rgb(45, 103, 226);
89+
9990
}
10091

10192
footer div {
102-
border-radius: 1rem;
93+
10394
background-color: rgba(0, 0, 0, 0.2);
104-
width: 95%;
10595
margin-top: 10px;
10696
margin-left: auto;
10797
margin-right: auto
10898
}
10999

110100

111-
@media (min-width: 1024px) {
112-
113-
.container {
114-
width: 100%;
115-
height: 100%;
116-
}
117-
118-
}

0 commit comments

Comments
 (0)