index.html

<!DOCTYPE html>
<html lang="de">

<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />

    <title>Dark theme TUB</title>

    <!-- Meta Tags -->
    <meta name="author" content="B4rtware, Re-Krass">
    <meta name="publisher" content="B4rtware, Re-Krass">
    <meta name="copyright" content="B4rtware, Re-Krass">
    <meta name="description" content="Dark theme styles for websites.">
    <meta name="keywords" content="dark, dark theme">
    <meta name="page-topic" content="Dienstleistung">
    <meta name="page-type" content="Software Download">
    <meta name="audience" content="Alle">
    <meta http-equiv="content-language" content="en">
    <meta name="robots" content="index, follow">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Links -->
    <link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">
    <link href="styles/css/main.css" rel="stylesheet">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />

    <!-- Load an icon library to show a hamburger menu (bars) on small screens -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
    <!-- <script> src="scripts/vendor/moment.js"</script> -->

    <!-- Favicons -->
    <link rel="shortcut icon" href="/favicon.ico">
    <link rel="apple-touch-icon" sizes="180x180" href="/images/favicon/apple-touch-icon.png">
    <link rel="icon" type="image/png" sizes="32x32" href="/images/favicon/favicon-32x32.png">
    <link rel="icon" type="image/png" sizes="16x16" href="/images/favicon/favicon-16x16.png">
    <link rel="manifest" href="/images/favicon/site.webmanifest">
    <link rel="mask-icon" href="/images/favicon/safari-pinned-tab.svg" color="#272727">
    <meta name="msapplication-TileColor" content="#2b5797">
    <meta name="theme-color" content="#ffffff">
</head>

<body id="bottom_site">
    <!-- FIXME: website test -->
    <header>
        <div class="topnav" id="myTopnav">
            <a href="index.html" class="active">Home</a>
            <a href="javascript:void(0);" class="icon" onclick="topnavResponsive()">
                <i class="fa fa-bars"></i>
            </a>
        </div>
        <script>
            function topnavResponsive() {
                var x = document.getElementById("myTopnav");
                if (x.className === "topnav") {
                    x.className += " responsive";
                } else {
                    x.className = "topnav";
                }
            }
        </script>
    </header>

    <main>
        <section class="info">
            <div class="window shake-animation">
                <div class="window__header">$: Dark Theme Styles
                    <span class="window__header__icon">
                        <i id="icon_clicked" class="material-icons">close</i>
                </div>
                <div class="window__sub-header">
                    <span class="window__file__icon">
                        <i class="material-icons">extension</i>
                    </span>
                    Info
                </div>
                <div class="window__item-container">
                    <div class="window__content">
                        <span class="window__content__text">
                            On this website you can find all current projects.
                    </div>
                </div>
                <div class="window__file">
                    <span class="window__file__icon">
                        <i class="material-icons">code</i>
                    </span>
                    Repositories
                </div>

                <ul>
                    <li>Dark themes</li>
                    <ul>
                        <li>TUB ISIS / MOSES <br>
                            <a href="https://dark-theme-styles.github.io/Dark-Theme-TUB/">
                                <i class="material-icons">
                                    work_outline
                                </i>go to project page
                            </a>
                        </li>
                    </ul>
                </ul>

                <div class="window__file">
                    <span class="window__file__icon">
                        <i class="material-icons">link</i>
                    </span>
                    Links
                </div>
                <div class="window__item-container">
                    <div class="window__content">
                        <ul>
                            <li>
                                <p> <img id="icons"
                                        src="https://camo.githubusercontent.com/338c94ae4c561c07911004dffb4455bf39f10155/68747470733a2f2f6769746875622e6769746875626173736574732e636f6d2f696d616765732f6d6f64756c65732f6c6f676f735f706167652f4769744875622d4d61726b2e706e67"
                                        alt="github logo">
                                    <a href="https://github.com/dark-theme-styles">Dark Theme Styles on GitHub</a>
                                </p>
                            </li>
                        </ul>
                    </div>
                </div>

                <div class="window__file">
                    <span class="window__file__icon">
                        <i class="material-icons">account_box</i>
                    </span>
                    Authors
                </div>
                <div class="window__item-container">
                    <div class="window__content">
                        <ul>
                            <li>
                                <p>
                                    <img id="icons"
                                        src="https://avatars1.githubusercontent.com/u/34386047?s=460&amp;v=4"
                                        alt="B4rtware profile picture">
                                    <a href="https://github.com/B4rtware">B4rtware</a>
                                </p>
                            </li>
                            <li>
                                <p> <img id="icons" src="https://avatars0.githubusercontent.com/u/38668040?s=460&v=4"
                                        alt="Re-Krass profile picture">
                                    <a href="https://github.com/Re-Krass">Re-Krass</a>
                                </p>
                            </li>
                        </ul>
                    </div>
                </div>

                <div class="window__footer">
                    <div class="window__footer__icon">
                    </div>
                    <div class="window__meta">
                        <div id="index-meta-last-modified" class="window__meta__last-modified">
                            <!-- this date gets set by javascript -->
                        </div>
                    </div>
                </div>

            </div>
        </section>
    </main>

    <footer>
    </footer>
</body>

<script src="scripts/index.js" language="javascript" type="module"></script>
<script src="scripts/shake-animation.js" language="javascript" type="text/javascript"></script>

</html>