added navbar and logo

This commit is contained in:
Mirjan Hoffmann 2022-03-08 12:38:11 +01:00
parent 4980b41e68
commit f816ecc02a
2 changed files with 43 additions and 11 deletions

22
logo.svg Normal file
View file

@ -0,0 +1,22 @@
<svg id="Ebene_1" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
viewBox="20 19 520 235">
<defs>
<style>
.cls-1{fill:none;}.cls-2{clip-path:url(#clip-path);}.cls-3{fill:#0d2b5a;}.cls-4{fill:#009ee3;}.cls-5{fill:#9c22aa;}.cls-6{fill:#f0801c;}.cls-7{fill:#e3000f;}.cls-8{fill:#4bb696;}
</style>
<clipPath id="clip-path">
<rect class="cls-1" x="23.21" y="20.51" width="488.12" height="232.09"/>
</clipPath>
</defs>
<g class="cls-2">
<path class="cls-3"
d="M511.33,102.41H493.82v89.14h17.51Zm-38.84,17.51V102.41H429.2a28.61,28.61,0,0,0-10.51,1.91,24.63,24.63,0,0,0-14.26,14.27,29.65,29.65,0,0,0,0,20.94,24.51,24.51,0,0,0,14.26,14.33,28.61,28.61,0,0,0,10.51,1.91h20.43c2,0,4.84.38,6.82,2.35a11,11,0,0,1,0,13.56c-2,2-4.78,2.36-6.82,2.36H402.52v17.51h47.11a28.61,28.61,0,0,0,10.51-1.91A24,24,0,0,0,468.8,184a24.7,24.7,0,0,0,5.6-8.65,29.68,29.68,0,0,0,0-20.95,25.54,25.54,0,0,0-5.6-8.72,24.9,24.9,0,0,0-8.66-5.61,28.58,28.58,0,0,0-10.51-1.84H429.2a9.58,9.58,0,0,1-6.81-2.42,9.43,9.43,0,0,1-2.36-6.75c0-2,.38-4.84,2.36-6.81a9.79,9.79,0,0,1,6.81-2.36Zm-144.95,0H354.6c4.39,0,8,1.34,10.51,3.82s3.75,6,3.75,10.44-1.27,8-3.75,10.51-6.12,3.75-10.51,3.75H327.54ZM310,102.41v89.14h17.51V166h27l12.35,25.6h19.48l-14.58-30.12a29,29,0,0,0,12.35-14.7,36.4,36.4,0,0,0,0-25.09,29.41,29.41,0,0,0-6.68-10.31,30.34,30.34,0,0,0-10.32-6.69,35.17,35.17,0,0,0-12.54-2.23ZM290.5,119.92V102.41H221.8v89.14h68.7V174H239.31V155.77H290.5V138.26H239.31V119.92Z"/>
<path class="cls-3"
d="M152.35,119.62c8.15,0,15,2.55,19.73,7.32s7.32,11.59,7.32,19.74-2.54,15-7.32,19.74-11.58,7.32-19.73,7.32-15-2.55-19.74-7.32-7.32-11.59-7.32-19.74,2.55-15,7.32-19.74,11.59-7.32,19.74-7.32m33.42-3.68,32-34.62-8.09-8.06-32.58,35.51a46.7,46.7,0,0,0-24.77-6.66,52.68,52.68,0,0,0-8.65.71L123,48.89l-10.49,4.53L132.92,106a40.89,40.89,0,0,0-23.41,27.38L55.72,122l-1.91,11.27,54,11.22c0,.73,0,1.48,0,2.23,0,14.43,5.56,26.46,14.91,34.37l-29.1,40,9.1,6.48,29.65-40.4a48.24,48.24,0,0,0,20,4.11A46.49,46.49,0,0,0,178,184.07l34.35,42,8.75-7-34.53-42.58c6.59-7.68,10.38-18,10.38-29.87,0-12.37-4.08-23-11.14-30.74"/>
<path class="cls-4" d="M217.36,97.89A26.93,26.93,0,1,0,190.44,71a26.93,26.93,0,0,0,26.92,26.93"/>
<path class="cls-5" d="M114.47,60.2A19.85,19.85,0,1,0,94.63,40.35,19.85,19.85,0,0,0,114.47,60.2"/>
<path class="cls-6" d="M43.06,145.32a19.84,19.84,0,1,0-19.85-19.84,19.84,19.84,0,0,0,19.85,19.84"/>
<path class="cls-7" d="M100.17,250.1a26.93,26.93,0,1,0-26.93-26.93,26.93,26.93,0,0,0,26.93,26.93"/>
<path class="cls-8" d="M223.36,252.61a19.85,19.85,0,1,0-19.84-19.85,19.85,19.85,0,0,0,19.84,19.85"/>
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.7 KiB

View file

@ -59,7 +59,7 @@
}
.right {
background-color: #000000;
background-color: #ffffff;
float: left;
width: 20%;
padding: 15px;
@ -75,6 +75,22 @@
</head>
<body>
<nav class="navbar navbar-light bg-light">
<div class="navbar-brand">
<img src="/logo.svg" height="50" width="116" alt="LOGO">
</div>
<ul class="navbar-nav ml-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarLanguageDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span id="selectedLanguageLabel">DE</span>
</a>
<div class="dropdown-menu position-absolute dropdown-menu-right" aria-labelledby="navbarLanguageDropdown">
<a class="dropdown-item" onclick="changeLanguage('en')">English</a>
<a class="dropdown-item" onclick="changeLanguage('de')">Deutsch</a>
</div>
</li>
</ul>
</nav>
<div style="overflow:auto">
<div class="menu"></div>
@ -82,12 +98,6 @@
<div class="main">
<div class="container">
<div>
<select id="languageSelector" name="lang">
<option value="en">English</option>
<option value="de" selected>Deutsch</option>
</select>
</div>
<h2 style="margin-bottom:40px;" data-i18n="FORM_HEADING">OER Metadaten Formular</h2>
<form class="was-validated">
<div class="form-group row">
@ -542,10 +552,10 @@
i18next.on("languageChanged", () => {
updateContent();
});
const langSelector = document.getElementById("languageSelector");
langSelector.addEventListener("change", (e) => {
i18next.changeLanguage(e.target.value);
});
}
function changeLanguage(languageCode) {
i18next.changeLanguage(languageCode);
document.getElementById("selectedLanguageLabel").textContent = languageCode.toUpperCase();
}
function updateContent() {