-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
126 lines (116 loc) · 6.28 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Astronomy Picture Of The Day</title>
<!--STYLES CSS-->
<link rel="stylesheet" href="./css/styles.css">
<!--Bootstrap-->
<link rel="stylesheet" href="./css/bootstrap.min.css">
<!--Fuentes-->
<link href="https://fonts.googleapis.com/css?family=Poppins:400,400i,700,700i" rel="stylesheet">
<!--Animate On Scroll - Library-->
<link rel="stylesheet" href="./css/aos.css">
</head>
<body style="background-color: #0b132b;">
<div class="visual" id="pageHome">
<div class="div__container">
<nav class="navbar navbar-expand-lg">
<div class="container-fluid">
<a class="navbar-brand" href="#">APOD</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse nav__all-links" id="navbarNavAltMarkup">
<div class="navbar-nav">
<a class="nav-link" id="myhome" href="#">HOME</a>
<a class="nav-link" id="myabout" href="#">ABOUT</a>
<a class="nav-link" href="https://github.com/TheJonaCode/NASA_API" target="_blank">GITHUB</a>
</div>
</div>
</div>
</nav>
</div>
<div class="title_APOD" data-aos="fade-down-left">
<h1>NASA</h1>
<h1><span class="text__highligth">ASTRONOMY</span></h1>
<h2>PICTURE OF THE <span class="text__highligth">DAY</span></h2>
</div>
<div class="intro">
<div class="text">
<h3>What is APOD?</h3>
<h4>APOD <span class="text__highligth">(Astronomy Picture of the Day)</span> is a NASA service where each day a different image or photo of our universe is shown, with a short explanation written by a professional astronomer.</h4>
</div>
</div>
<div class="logo" data-aos="fade-down-left">
<img src="media/nasa_logo.png">
</div>
</div>
<!--APOD CONTENT-->
<div class="apod__content">
<div class="cont_articles">
<!--APOD INFO-->
<div class="apot">
<h1 class="date__title">Today's picture:</h1>
<h2 class="title__apod text__highligth">Image title</h2>
<div class="apot__focus">
<div class="picture">
<div class="pic__container">
<img src="media/no_image.jpg" class="apod__img" alt="Astronomy Picture of the Day">
</div>
</div>
<div class="description">
<p class="desc__container">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sapiente corrupti explicabo recusandae ad. Culpa laborum error dolorum id quos illum, blanditiis at. Sed totam at voluptatibus iure debitis magni eos. Lorem ipsum dolor sit amet consectetur adipisicing
elit. Sapiente corrupti explicabo recusandae ad. Culpa laborum error dolorum id quos illum, blanditiis at. Sed totam at voluptatibus iure debitis magni eos.
</p>
</div>
</div>
</div>
<!--APOD SEARCH-->
<div class="apot__query">
<p>Search</p>
<div class="form__search">
<input class="date__search" type="date" class="form-control">
<button type="submit" class="btn btn-primary" onclick="searchAPOD()">Search</button>
</div>
</div>
</div>
</div>
<!--ABOUT-->
<div class="about" id="pageAbout">
<div class="about__text">
<h1>ABOUT</h1>
<p>
Astronomy Picture of the Day (APOD) is originated, written, coordinated, and edited since 1995 by Robert Nemiroff and Jerry Bonnell. The APOD archive contains the largest collection of annotated astronomical images on the internet. APOD in general and
the APOD site served from NASA specifically places links solely on information content and does not endorse any commercial product nor guarantee claims or sales made on any linked pages. APOD occasionally repeats images, in part to inform
new readers the best of the older images. APOD occasionally reuses APOD text, in part to avoid restating a point that has been well-stated on APOD before. In real life, Bob and Jerry are two professional astronomers who spend most of their
time researching the universe. Bob is a professor at Michigan Technological University in Houghton, Michigan, USA, while Jerry is a scientist at NASA's Goddard Space Flight Center in Greenbelt, Maryland USA. They are two married, mild
and lazy guys who might appear relatively normal to an unsuspecting guest. Together, they have found new and unusual ways of annoying people such as staging astronomical debates. Most people are surprised to learn that they have developed
the perfect random number generator.
</p>
<p class="apod__redirect">Original site: <span class="link__apod"> http://apod.nasa.gov/ </span></p>
</div>
</div>
<!--FOOTER-->
<div class="footer">
<p class="footer__description">
National Aeronautics and Space Administration, Houston TX, 77058
</p>
<p class="footer__description">
All Rights Reserved
</p>
</div>
<!--SCRIPTS JS-->
<!--JQuery-->
<script src="./js/jquery-3.5.1.slim.min.js"></script>
<!--Bootstrap-->
<script src="./js/bootstrap.bundle.js"></script>
<!--Mis Scripts-->
<script language="JavaScript" type="text/javascript" src="./js/script.js"></script>
<!--Animate On Scroll - Library-->
<script src="./js/aos.js"></script>
</body>
</html>