diff --git a/eets-wiai.css b/eets-wiai.css index f225df8..5f65668 100644 --- a/eets-wiai.css +++ b/eets-wiai.css @@ -34,8 +34,8 @@ } .wiai-quick-link { - height: 60px; - width: 60px; + height: 40px; + width: 40px; display: flex; flex-direction: column; align-items: center; @@ -56,3 +56,29 @@ color: var(--color); text-decoration: none; } + +.wiai-quick-link .fa { + font-size: 200%; +} + +/** + * Lanugage chooser + * ================ + */ +div.wiai-language-chooser { + margin: 0; +} + +div.wiai-language-chooser .wiai-language-option { + border: none; + margin: 0; + margin-bottom: 2px; + background-color: #19adc6; + font-weight: bold; + color: rgba(255, 255, 255, .6); +} + +div.wiai-language-chooser .wiai-language-option.active { + background-color: #038399; + color: white; +} diff --git a/eets-wiai.js b/eets-wiai.js index 39c3085..09c7865 100644 --- a/eets-wiai.js +++ b/eets-wiai.js @@ -1,3 +1,5 @@ +(function module() { + const URL = "https://wiai.stuve-bamberg.de/vc-customization/" const LOGO_URL = "img/logos/" @@ -9,7 +11,7 @@ const quickLinks = [ url_english: "https://wiai.de/home", background: "#00457d", color: "white", - icon: "map-marked" + icon: "gamepad" }, { name_german: "Teams", @@ -19,7 +21,34 @@ const quickLinks = [ background: "#6731b7", color: "transparent", logo: "microsoft-teams.jpg" - } + }, + { + name_german: "Zeitplan", + name_english: "Schedule", + url_german: "#", + url_english: "#", + background: "#6731b7", + color: "white", + icon: "calendar-alt" + }, + { + name_german: "Hilfe & FAQ", + name_english: "Help & FAQ", + url_german: "https://vc.uni-bamberg.de/mod/page/view.php?id=1122808", + url_english: "#", + background: "purple", + color: "white", + icon: "question-circle" + }, + { + name_german: "Glossar", + name_english: "Glossary", + url_german: "https://vc.uni-bamberg.de/mod/glossary/view.php?id=1122803", + url_english: "https://vc.uni-bamberg.de/mod/glossary/view.php?id=1122803", + background: "#c16978", + color: "white", + icon: "book" + } ] window.addEventListener('load', init); @@ -70,17 +99,37 @@ function addQuickLinks() { const element = document.createElement('a'); element.href = quickLink.url_german element.classList.add('wiai-quick-link'); + element.classList.add('wiai-german'); element.style.setProperty('--bg-color', quickLink.background); element.style.setProperty('--color', quickLink.color); - if (quickLink.logo) { - element.style.setProperty('--bg-image', `url(${URL}${LOGO_URL}${quickLink.logo})`); - element.innerText = quickLink.name_german; - } else { - element.innerHTML = `` - } + if (quickLink.logo) { + element.style.setProperty('--bg-image', `url(${URL}${LOGO_URL}${quickLink.logo})`); + element.innerText = quickLink.name_german; + } else { + element.innerHTML = `` + } - element.title = `${quickLink.name_german} | ${quickLink.name_english}`; + element.title = quickLink.name_german; quickLinkContainer.appendChild(element); + + const elementEnglish = document.createElement('a'); + elementEnglish.href = quickLink.url_english + elementEnglish.classList.add('wiai-quick-link'); + elementEnglish.classList.add('wiai-english'); + elementEnglish.style.setProperty('--bg-color', quickLink.background); + elementEnglish.style.setProperty('--color', quickLink.color); + + if (quickLink.logo) { + elementEnglish.style.setProperty('--bg-image', `url(${URL}${LOGO_URL}${quickLink.logo})`); + elementEnglish.innerText = quickLink.name_english; + } else { + elementEnglish.innerHTML = `` + } + + elementEnglish.title = quickLink.name_english; + quickLinkContainer.appendChild(elementEnglish); }); } + +})();