diff options
Diffstat (limited to 'test.html')
| -rw-r--r-- | test.html | 175 |
1 files changed, 175 insertions, 0 deletions
diff --git a/test.html b/test.html new file mode 100644 index 0000000..909832b --- /dev/null +++ b/test.html @@ -0,0 +1,175 @@ +<!DOCTYPE html> + +<!-- +vim: shiftwidth=4 tabstop=4 noexpandtab + +libweb - reusable code for websites + + Copyright (C) 2021 xengineering + + This program is free software: you can redistribute it and/or modify + it under the terms of the GNU Affero General Public License as published by + the Free Software Foundation, either version 3 of the License, or + (at your option) any later version. + + This program is distributed in the hope that it will be useful, + but WITHOUT ANY WARRANTY; without even the implied warranty of + MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + GNU Affero General Public License for more details. + + You should have received a copy of the GNU Affero General Public License + along with this program. If not, see <https://www.gnu.org/licenses/>. + +contact via mail: me@xengineering.eu +--> + +<html> + + <head> + + <title>libweb</title> + + <meta charset="utf-8"/> + <meta name="viewport" content="width=device-width, initial-scale=1.0"> + <link rel="stylesheet" href="./libweb.css" type="text/css"> + + </head> + + <body> + + <nav> + <button id="menu-button" onclick=toggleMenu()>MENU</button> + <a class="menu-anchor" href="https://xengineering.eu">xengineering.eu</a> + <a class="menu-anchor" href="https://xengineering.eu">xengineering.eu</a> + <a class="menu-anchor" href="https://xengineering.eu">xengineering.eu</a> + </nav> + + <main> + + <!-- h1 h2 h3 h4 h5 h6 --> + <h1>A simple Test Page</h1> + <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed + diam nonumy eirmod tempor invidunt ut labore et dolore magna + aliquyam erat, sed diam voluptua.</p> + <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed + diam nonumy eirmod tempor invidunt ut labore et dolore magna + aliquyam erat, sed diam voluptua.</p> + <h2>A simple Test Page</h2> + <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed + diam nonumy eirmod tempor invidunt ut labore et dolore magna + aliquyam erat, sed diam voluptua.</p> + <h3>A simple Test Page</h3> + <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed + diam nonumy eirmod tempor invidunt ut labore et dolore magna + aliquyam erat, sed diam voluptua.</p> + <h4>A simple Test Page</h4> + <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed + diam nonumy eirmod tempor invidunt ut labore et dolore magna + aliquyam erat, sed diam voluptua.</p> + <h5>A simple Test Page</h5> + <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed + diam nonumy eirmod tempor invidunt ut labore et dolore magna + aliquyam erat, sed diam voluptua.</p> + <h6>A simple Test Page</h6> + <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed + diam nonumy eirmod tempor invidunt ut labore et dolore magna + aliquyam erat, sed diam voluptua.</p> + + <!-- p --> + <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed + diam nonumy eirmod tempor invidunt ut labore et dolore magna + aliquyam erat, sed diam voluptua. At vero eos et accusam et justo + duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata + sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, + consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt + ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero + eos et accusam et justo duo dolores et ea rebum. Stet clita kasd + gubergren, no sea takimata sanctus est Lorem ipsum dolor sit + amet.</p> + + <!-- a --> + <a href="https://example.com">Example Link</a> + + <!-- img --> + <img src="./demo.png" alt="An example image"> + <img src="null.jpg" alt="Not existing image"> + + <!-- ol ul li --> + <ol> + <li>First item</li> + <li>Second item</li> + <li>Third item</li> + <li>Long item: Lorem ipsum dolor sit amet, consetetur sadipscing + elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore + magna aliquyam erat, sed diam voluptua. At vero eos et accusam et + justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea + takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor + sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam + voluptua. At vero eos et accusam et justo duo dolores et ea rebum. + Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum + dolor sit amet.</li> + </ol> + <p>Just some Lorem ipsum dolor sit amet, consetetur sadipscing elitr, + sed diam nonumy eirmod tempor invidunt ut labore et dolore magna + aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo + dolores et ea rebum.</p> + <ul> + <li>An item</li> + <li>Another item</li> + <li>Just another item</li> + <li>Long item: Lorem ipsum dolor sit amet, consetetur sadipscing + elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore + magna aliquyam erat, sed diam voluptua. At vero eos et accusam et + justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea + takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor + sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod + tempor invidunt ut labore et dolore magna aliquyam erat, sed diam + voluptua. At vero eos et accusam et justo duo dolores et ea rebum. + Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum + dolor sit amet.</li> + </ul> + + <!-- pre --> + <pre>#!/bin/sh + +# This is a cool shell script. +echo "I am $(whoami)" +</pre> + + <!-- .card --> + <div class="card"> + <h3 class="card-first-item">This is a Card</h3> + <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed + diam nonumy eirmod tempor invidunt ut labore et dolore magna + aliquyam erat, sed diam voluptua. At vero eos et accusam et + justo duo dolores et ea rebum. Stet clita kasd gubergren, no + sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem + ipsum dolor sit amet, consetetur sadipscing elitr, sed diam + nonumy eirmod tempor invidunt ut labore et dolore magna + aliquyam erat, sed diam voluptua. At vero eos et accusam et + justo duo dolores et ea rebum. Stet clita kasd gubergren, no + sea takimata sanctus est Lorem ipsum dolor sit amet.</p> + <h3>This is a Card</h3> + <p class="card-last-item">Lorem ipsum dolor sit amet, + consetetur sadipscing elitr, sed diam nonumy eirmod tempor + invidunt ut labore et dolore magna aliquyam erat, sed diam + voluptua. At vero eos et accusam et justo duo dolores et ea + rebum. Stet clita kasd gubergren, no sea takimata sanctus est + Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, + consetetur sadipscing elitr, sed diam nonumy eirmod tempor + invidunt ut labore et dolore magna aliquyam erat, sed diam + voluptua. At vero eos et accusam et justo duo dolores et ea + rebum. Stet clita kasd gubergren, no sea takimata sanctus est + Lorem ipsum dolor sit amet.</p> + </div> + + <footer></footer> + + </main> + + <script src="./libweb.js"></script> + + </body> + +</html> |