Browser extension to show the latest Astronomy Picture of the Day.
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

46 lines
2.3 KiB

<!DOCTYPE html>
<meta charset="utf-8">
<link href="css/csspin.css" rel="stylesheet" />
<link href="css/style.css" rel="stylesheet" />
<link href="css/forkawesome/css/fork-awesome.min.css" rel="stylesheet" />
<link href="css/hint.min.css" rel="stylesheet"/>
<title>APOD Popup</title>
<div id="controls">
<span class="button" id="backButton"><i class="fa fa-arrow-left"></i></span>
<span class="button" id="nextButton"><i class="fa fa-arrow-right"></i></span>
<input type="text" id="date" value="2018-02-12" />
<span class="hint--bottom" aria-label="Type in a date in the form YYYY-MM-DD"><i class="fa fa-question-circle"></i></span>
<span class="button" id="sendButton">Load</span>
<span class="button hint--right" id="back" aria-label="Back to last picture viewed"><i class="fa fa-backward"></i></span>
<div id="sharing">
<span class="button hint--left" id="share" aria-label="Share this picture"><i class="fa fa-share-alt"></i></span>
<div id="shareOptions">
<a href="#" id="facebookImage"><i class="fa fa-facebook-official" aria-hidden="true"></i> Facebook</a>
<a href="#" id="tweetImage"><i class="fa fa-twitter"></i> Twitter</a>
<a href="#" id="diasporaImage"><i class="fa fa-diaspora"></i> Diaspora</a>
<a href="#" id="mastodonImage"><i class="fa fa-mastodon"></i> Mastodon</a>
<a href="#" id="mailImage"><i class="fa fa-envelope"></i> Email</a>
<br />
<div id="loadingbox">
<div id="loader" class="cp-spinner cp-round"></div>
<span id="internet">Check your internet connection</span>
<div id="apod">
<h3 id="apod_title"></h3>
<a id="apod_img_link" href=""><img id="apod_img_id" width="250px"/></a>
<iframe id="apod_vid_id" type="text/html" width="384" height="231" frameborder="0"></iframe>
<small id="copyright"></small>
<p id="apod_explaination">If this is showing there is something wrong with the program.</p>
<hr />
<small id="foot">Images from <a href="" id="more">NASA APOD</a> | <a href="">APOD Twitter</a> | <br /> Made by <a href="">Josias</a> | Find this project on <a href="">Codeberg</a> <i class="fa fa-code"></i>.</small>
<script src="js/popup.js"></script>