Skip to content
Snippets Groups Projects
dbp-toolkit-showcase.html.ejs 5.53 KiB
Newer Older
<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="theme-color" content="white"/>

    <!-- Favicons -->
    <link rel="shortcut icon" type="image/x-icon" href="<%= getPrivateUrl('favicon.ico') %>">
    <link rel="icon" type="image/svg+xml" href="<%= getPrivateUrl('favicon.svg') %>" sizes="any">

Bekerle, Patrizio's avatar
Bekerle, Patrizio committed
    <!-- PWA manifest file -->
    <link rel="manifest" href="<%= getUrl(name + '.manifest.json') %>">
    
    <!-- PWA iphone -->
    <link rel="apple-touch-icon" sizes="180x180" href="<%= getPrivateUrl('apple-touch-icon.png') %>">
    <link rel="icon" type="image/png" sizes="32x32" href="<%= getPrivateUrl('icon-32x32.png') %>">
    <link rel="icon" type="image/png" sizes="16x16" href="<%= getPrivateUrl('icon-16x16.png') %>">
    <link rel="mask-icon" href="<%= getPrivateUrl('safari-pinned-tab.svg') %>" color="#e4154b">
    <meta name="apple-mobile-web-app-status-bar-style" content="white">

    <!-- Loading spinner -->
    <script type="module">
        import {Spinner} from '<%= getPrivateUrl('spinner.js') %>';
        customElements.define('dbp-loading-spinner', Spinner);
    </script>

    <!-- App bundles-->
    <script type="module" src="<%= getUrl(name + '.js') %>"></script>

    <!-- Prevent Chrome/Edge from suggesting to translate the page -->
    <meta name="google" content="notranslate">

    <!-- Font related CSS -->
    <style>
        @import "<%= getPrivateUrl('fonts/source-sans-pro/300.css') %>";
        @import "<%= getPrivateUrl('fonts/source-sans-pro/400.css') %>";
        @import "<%= getPrivateUrl('fonts/source-sans-pro/600.css') %>";

        body {
            font-family: 'Source Sans Pro', 'Calibri', 'Arial', 'sans-serif';
            font-weight: 300;
            margin: 0;
        }

        /* TU-Graz style override */
        html {
            --dbp-override-primary-bg-color: #245b78;
            --dbp-override-primary-button-border: solid 1px #245b78;
            --dbp-override-info-bg-color: #245b78;
            --dbp-override-danger-bg-color: #e4154b;
            --dbp-override-warning-bg-color: #ffe183;
            --dbp-override-warning-text-color: black;
            --dbp-override-success-bg-color: #259207;
        }

        .light-theme{
            --dbp-override-base: white;
            --dbp-override-base-inverted: black;
            --dbp-override-text: black;
            --dbp-override-text-inverted: white;
            --dbp-override-text-muted: #767676;
            --dbp-override-accent: #c24f68;
            --dbp-override-primary-base: #2a4491;
            --dbp-override-primary-text: white;
            --dbp-override-primary-border: 1px solid #2a4491;
            --dbp-override-secondary-base: white;
            --dbp-override-secondary-text: black;
            --dbp-override-secondary-border: 1px solid black;
            --dbp-override-info: #2a4491;
            --dbp-override-success: #188018;
            --dbp-override-warning-as-text: #c15500;
            --dbp-override-warning: #f99a41;
            --dbp-override-danger: #de3535;
            --dbp-override-border: 1px solid black;
            --dbp-override-border-radius: 0px;
            --dbp-override-hover-base: black;
            --dbp-override-hover-text: white;

        }

        .dark-theme{
            --dbp-override-base: #151515;
            --dbp-override-base-inverted: white;
            --dbp-override-text: white;
            --dbp-override-text-inverted: #151515;
            --dbp-override-text-muted: #666666;
            --dbp-override-accent: #c24f68;
            --dbp-override-primary-base: #8ca4eb;
            --dbp-override-primary-text: #151515;
            --dbp-override-primary-border: 1px solid #8ca4eb;
            --dbp-override-secondary-base: #151515;
            --dbp-override-secondary-text: white;
            --dbp-override-secondary-border: 1px solid white;
            --dbp-override-info: #8ca4eb;
            --dbp-override-success: #7acc79;
            --dbp-override-warning-as-text: #f99a41;
            --dbp-override-warning: #f99a41;
            --dbp-override-danger: #de3535;
            --dbp-override-border: 1px solid white;
            --dbp-override-border-radius: 0px;
            --dbp-override-hover-base: white;
            --dbp-override-hover-text: #151515;

        }
    </style>

    <!-- Preloading/Preconnecting -->
    <link rel="preconnect" href="<%= entryPointURL %>">
    <link rel="preconnect" href="<%= keyCloakBaseURL %>">
</head>

<body>
<<%= name %>
    lang="de"
    entry-point-url="<%= entryPointURL %>"
    nextcloud-auth-url="<%= nextcloudWebAppPasswordURL %>"
    nextcloud-web-dav-url="<%= nextcloudWebDavURL %>"
    nextcloud-name="<%= nextcloudName %>"
    nextcloud-file-url="<%= nextcloudFileURL %>"
    src="<%= getUrl(name + '.topic.metadata.json') %>"
    lang="en"
    base-path="<%= getUrl('') %>"
    keycloak-config='{"url": "<%= keyCloakBaseURL %>", "realm": "<%= keyCloakRealm %>", "clientId": "<%= keyCloakClientId %>", "silentCheckSsoRedirectUri": "<%= getUrl('silent-check-sso.html') %>"}'
    matomo-url="<%= matomoUrl %>" matomo-site-id="<%= matomoSiteId %>"
    git-info='<%= buildInfo.info %>'
    build-url='<%= buildInfo.url %>'
    build-time='<%= buildInfo.time %>'
    env='<%= buildInfo.env %>'
><dbp-loading-spinner></dbp-loading-spinner></<%= name %>>

<!-- Error handling for too old browsers -->
<script src="<%= getPrivateUrl('browser-check.js') %>" defer></script>
<noscript>Diese Applikation benötigt Javascript / This application requires Javascript</noscript>
</body>