base html layout of index.html

This commit is contained in:
janis
2022-12-12 21:20:42 +01:00
parent fa0431f913
commit 3c3bc09ed2

View File

@@ -1,16 +1,63 @@
<!DOCTYPE html>
<html>
<head>
<title>impress.js - the javascript presentation framework</title>
<title>impress.js - the stunning javascript presentation framework</title>
<meta name="description" content="impress.js, a javascript presentation framework that uses the power of CSS 3 to create stunning presentations in your browser! It is inspired by the idea behind prezi.com">
<!--I am using jquery for the fancy typing animation and button animations (plus loading of the navbar and footer)-->
<!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>-->
</head>
<body>
<!--Here, the navbar is inserted by jquery-->
<div id="navbar"></div>
<div class="title">
<h1 class="type-animation">impress.js</h1>
<a class="button" id="demobutton" href="./demo/index.html">Watch the demo</a>
</div>
<div class="content">
<div class="create">
<div class="unstyled-html">
<h3>Use HTML</h3>
<!--TODO: Add HTML demo-code-->
</div>
<div class="crazy-styled">
<h3>And CSS</h3>
<p>To create stunning presentations</p>
<!--TODO: Add CSS demo-code-->
</div>
</div>
<!--FEATURE OVERVIEW-->
<div class="features">
<div class="feature-item">
<h3>FULL power of CSS.</h3>
<p>Use the powerful styling tools CSS offers with only minimal restrictions</p>
</div>
<div class="feature-item">
<h3>Familiar.</h3>
<p>impress.js presentations can be written in HTML with only a few simple to understand element attributes.</p>
</div>
<div class="feature-item">
<h3>Minimalist.</h3>
<p>The framework only delivers what is essential, without compromising on functionality</p>
</div>
<div class="feature-item">
<h3>Plugins.</h3>
<p>It features extensive plugin-support to expand on its core functionality. Want a speaker console? Blank the screen? There's a plugin for it. If not, you may add your own!</p>
</div>
</div>
<!--GETTING STARTED with link to docs (that have been translated to html)-->
<div class="getting-started">
<h2>Impressed?</h2>
<h3>Then you should try impress.js</h3>
<p>*no rhyme intended</p>
<a class="button" id="go-impress" href="./docs/home.html">Get started!</a>
<!--TODO: Add a direct download link for the file-->
<a class="button" id="download-base" href="https://github.com/impress/impress.js/"></a>
</div>
</div>
<div class=""></div>
<div id="footer"></div>
</body>
</html>