g4.3
This commit is contained in:
Turtle committed
1 parent
6c89037ca6
commit
a994562779
8 files changed
+323
-327
No files matched your search
Binary file not shown.
|
After Width: | Height: | Size: 167 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
@@ -65,6 +65,20 @@ button {
|
|||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mc-xp-bar {
|
||||||
|
width: 100%;
|
||||||
|
height: 20px;
|
||||||
|
background-image: url("../imgs/xp-bar-bg.png");
|
||||||
|
background-size: 100% 20px;
|
||||||
|
}
|
||||||
|
.mc-xp-bar > div {
|
||||||
|
width: 100%;
|
||||||
|
height: 20px;
|
||||||
|
background-image: url("../imgs/xp-bar-fg.png");
|
||||||
|
background-size: 100% 20px;
|
||||||
|
clip-path: inset(0 100% 0 0);
|
||||||
|
}
|
||||||
|
|
||||||
/* ----------- overlay ----------- */
|
/* ----------- overlay ----------- */
|
||||||
|
|
||||||
overlay {
|
overlay {
|
||||||
|
|||||||
+18
-2
@@ -507,14 +507,21 @@ Rolle: <label></label>
|
|||||||
function _showProfile(user) {
|
function _showProfile(user) {
|
||||||
let elm = getId("profile_overlay");
|
let elm = getId("profile_overlay");
|
||||||
|
|
||||||
const hasProfilAbility = user.enabled_abilities.includes("profile_pic");
|
const features = user.enabled_abilities ??= [];
|
||||||
|
const hasProfilAbility = features.includes("profile_pic");
|
||||||
|
|
||||||
const avatarInp = elm.querySelector(".avatar-inp");
|
const avatarInp = elm.querySelector(".avatar-inp");
|
||||||
|
const profilePic = elm.querySelector(".profile-pic");
|
||||||
if (hasProfilAbility) {
|
if (hasProfilAbility) {
|
||||||
elm.querySelector(".profile-pic").style.setProperty("background-image", `url('${user.avatar}')`);
|
profilePic.style.setProperty("background-image", `url('${user.avatar}')`);
|
||||||
elm.querySelector("input").setAttribute("value", user.avatar);
|
elm.querySelector("input").setAttribute("value", user.avatar);
|
||||||
avatarInp.style.display = "unset";
|
avatarInp.style.display = "unset";
|
||||||
} else {
|
} else {
|
||||||
|
if (features.includes("pink_mode")) {
|
||||||
|
profilePic.style.setProperty("background-image", `url("https://static.turtle-coding-gbr.de/gmci/rosa_profil.png")`);
|
||||||
|
} else {
|
||||||
|
profilePic.style.setProperty("background-image", `url("https://static.turtle-coding-gbr.de/gmci/standart_profil.png")`);
|
||||||
|
}
|
||||||
avatarInp.style.display = "none";
|
avatarInp.style.display = "none";
|
||||||
}
|
}
|
||||||
elm.querySelector("u").innerText = getUserDisplayName(user);
|
elm.querySelector("u").innerText = getUserDisplayName(user);
|
||||||
@@ -594,4 +601,13 @@ async function levelUpXP(couchDB, user = userData, xp = 1) {
|
|||||||
|
|
||||||
await updateUserData(couchDB, user);
|
await updateUserData(couchDB, user);
|
||||||
return resLevelUp;
|
return resLevelUp;
|
||||||
|
}
|
||||||
|
|
||||||
|
function setXPBarPercent(percent) {
|
||||||
|
percent = 100 - percent;
|
||||||
|
const elms = document.querySelectorAll(".mc-xp-bar");
|
||||||
|
for (var elm of elms) {
|
||||||
|
const div = elm.querySelector("div");
|
||||||
|
div.style.setProperty('clip-path', `inset(0 ${percent}% 0 0)`);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
@@ -87,6 +87,9 @@ button.navigation:hover {
|
|||||||
background-color: var(--accent_color_bg_o);
|
background-color: var(--accent_color_bg_o);
|
||||||
border-radius: var(--border-radius);
|
border-radius: var(--border-radius);
|
||||||
}
|
}
|
||||||
|
#umfrage_list {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
#umfrage_list > div {
|
#umfrage_list > div {
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
border: 2px solid var(--accent_color_bg);
|
border: 2px solid var(--accent_color_bg);
|
||||||
|
|||||||
@@ -11,6 +11,7 @@
|
|||||||
<script src="../other/skilltree.js"></script>
|
<script src="../other/skilltree.js"></script>
|
||||||
<script src="./uebersicht_overlay.js"></script>
|
<script src="./uebersicht_overlay.js"></script>
|
||||||
<script src="https://cdn.jsdelivr.net/npm/qrcodejs/qrcode.min.js"></script>
|
<script src="https://cdn.jsdelivr.net/npm/qrcodejs/qrcode.min.js"></script>
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||||
<title>Kurs Anzeige</title>
|
<title>Kurs Anzeige</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
|
|||||||
+285
-325
@@ -1,364 +1,324 @@
|
|||||||
<!doctype html>
|
<!doctype html>
|
||||||
<html>
|
<html>
|
||||||
|
|
||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=0.8">
|
<meta name="viewport" content="width=device-width, initial-scale=0.8" />
|
||||||
<link rel="stylesheet" href="../lib/basic.css">
|
<link rel="stylesheet" href="../lib/basic.css" />
|
||||||
<script src="../auth.js"></script>
|
<script src="../auth.js"></script>
|
||||||
<script src="../lib/basic.js"></script>
|
<script src="../lib/basic.js"></script>
|
||||||
<script src="./uebersicht_overlay.js"></script>
|
<script src="./uebersicht_overlay.js"></script>
|
||||||
<script src="../other/skills.js"></script>
|
<script src="../other/skills.js"></script>
|
||||||
<script src="../other/skilltree.js"></script>
|
<script src="../other/skilltree.js"></script>
|
||||||
<title>Übersicht</title>
|
<title>Übersicht</title>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
<div class="header_bar_1">
|
<style>
|
||||||
<div style="font-weight: bold;">
|
|
||||||
Meine Kurse
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
|
|
||||||
</div>
|
.holder_div {
|
||||||
<div>
|
position: fixed;
|
||||||
<button class="profile" onclick='showOverlay("miniProfile")'>
|
bottom: 2%;
|
||||||
<overlay id="miniProfile" />
|
left: 2%;
|
||||||
</button>
|
width: 96%;
|
||||||
</div>
|
background-color: var(--accent_color_bg_o);
|
||||||
</div>
|
backdrop-filter: blur(10px);
|
||||||
<div class="header_bar_1_placeholder"></div>
|
border-radius: var(--border-radius);
|
||||||
<div class="main-container">
|
padding: 10px;
|
||||||
<button class="survey" onclick="participateInSurvey()">An Umfrage teilnehmen</button>
|
box-shadow: var(--def-shadow);
|
||||||
|
border: 1px solid black;
|
||||||
|
}
|
||||||
|
.holder_div > div.action_div {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
height: min-content;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
.holder_div > div.action_div button {
|
||||||
|
font-size: 20px;
|
||||||
|
padding: 15px;
|
||||||
|
padding-left: 40px;
|
||||||
|
padding-right: 40px;
|
||||||
|
background-color: var(--accent_color_bg);
|
||||||
|
border: none;
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
cursor: pointer;
|
||||||
|
max-width: 100%;
|
||||||
|
width: 100%;
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
.holder_div > div.action_div button:focus-visible {
|
||||||
|
outline: 2px var(--accent_color_fg_o);
|
||||||
|
outline-offset: 2px;
|
||||||
|
}
|
||||||
|
.holder_div > div.action_div button:hover {
|
||||||
|
background: var(--accent_color_bg_o);
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
}
|
||||||
|
|
||||||
<div id="courses-container">
|
.level-container {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.level {
|
||||||
|
font-family: Minecraftia;
|
||||||
|
color: darkgreen;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
<div id="courses-list">
|
#courses-list {
|
||||||
|
margin-top: 30px;
|
||||||
|
padding: 0 2%;
|
||||||
|
padding-bottom: 200px;
|
||||||
|
}
|
||||||
|
.course-card {
|
||||||
|
position: relative;
|
||||||
|
margin-top: 1px;
|
||||||
|
margin-bottom: 1rem;
|
||||||
|
min-height: 300px;
|
||||||
|
padding: 16px;
|
||||||
|
background: var(--accent_color_bg_o);
|
||||||
|
border-radius: 12px;
|
||||||
|
box-shadow: var(--def-shadow);
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
gap: 10px;
|
||||||
|
}
|
||||||
|
.course-card:hover {
|
||||||
|
background: #b9d5e1;
|
||||||
|
}
|
||||||
|
|
||||||
</div>
|
.course-title {
|
||||||
|
margin: 0;
|
||||||
|
padding: 10px;
|
||||||
|
font-size: 25px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.course-description {
|
||||||
|
margin: 0;
|
||||||
|
font-size: 20px;
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
.course-actions {
|
||||||
|
display: flex;
|
||||||
|
gap: 10px;
|
||||||
|
margin-top: auto;
|
||||||
|
}
|
||||||
|
|
||||||
<button class="new" onclick="newCourse()">+</button>
|
.action {
|
||||||
</div>
|
padding: 8px;
|
||||||
|
border: none;
|
||||||
<div id="level-display" class="level-container">
|
border-radius: 8px;
|
||||||
<div class="level">Level <span id="level-number">5</span></div>
|
cursor: pointer;
|
||||||
<progress class="xp-bar" id="level-bar" value="0" max="10"></progress>
|
font-size: 20px;
|
||||||
</div>
|
}
|
||||||
</div>
|
.action.start {
|
||||||
|
position: absolute;
|
||||||
<!-- Overlays -->
|
top: 16px;
|
||||||
<overlay id="survey">
|
right: 70px;
|
||||||
<div style="text-align: center; padding: 15px; margin-right: 2rem;">
|
font-size: 20px;
|
||||||
<input id="survey-code" type="text" placeholder="Umfrage-Code">
|
border-radius: var(--border-radius);
|
||||||
<br>
|
background-color: var(--accent_color_bg);
|
||||||
<button style="margin-top: 1rem;" onclick="startSurvey()">Teilnehmen</button>
|
}
|
||||||
</div>
|
.action.start:hover {
|
||||||
</overlay>
|
background: var(--accent_color_bg_o);
|
||||||
|
border-radius: var(--border-radius);
|
||||||
<overlay id="add-course">
|
}
|
||||||
<div style="text-align: center; padding: 15px; margin-right: 2rem;">
|
.action.delete {
|
||||||
<input id="survey-code" type="text" placeholder="Kursname">
|
position: absolute;
|
||||||
<br>
|
top: 16px;
|
||||||
<button class="" style="margin-top: 1rem;" onclick="addCourse()">Hinzufügen</button>
|
right: 16px;
|
||||||
</div>
|
font-size: 20px;
|
||||||
</overlay>
|
padding-left: 12px;
|
||||||
|
padding-right: 12px;
|
||||||
|
max-height: 40px;
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
background-color: var(--accent_color_bg);
|
||||||
|
}
|
||||||
|
.action.delete:hover {
|
||||||
|
background: var(--accent_color_bg_o);
|
||||||
|
border-radius: var(--border-radius);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
<script>
|
</style>
|
||||||
|
|
||||||
const couchDB = new CouchDB();
|
<div class="header_bar_1">
|
||||||
setUserData(couchDB).then((val) => {
|
<div style="font-weight: bold">Meine Kurse</div>
|
||||||
setCourseView();
|
<div></div>
|
||||||
setLevelProgress(userData.xp);
|
<div>
|
||||||
setLevel(userData.level);
|
<button class="profile" onclick="showOverlay('miniProfile')">
|
||||||
});
|
<overlay id="miniProfile" />
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="header_bar_1_placeholder"></div>
|
||||||
|
|
||||||
async function startSurvey() {
|
<div id="courses-list"></div>
|
||||||
const code = getOverlay("survey").getElementsByTagName("INPUT")[0].value.trim();
|
|
||||||
console.log(code);
|
|
||||||
var course = await couchDB.get("course:" + code);
|
|
||||||
if (course != undefined) {
|
|
||||||
const users = await couchDB.get("users");
|
|
||||||
users[userData.name].courses ??= [];
|
|
||||||
if (!users[userData.name].courses.includes(code)) {
|
|
||||||
users[userData.name].courses.push(code);
|
|
||||||
}
|
|
||||||
await couchDB.set("users", users);
|
|
||||||
location.href = "./umfrage.html?user=" + userData.name + ",course=" + code;
|
|
||||||
} else {
|
|
||||||
alert("Umfrage nicht gefunden!");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function setCourseView() {
|
<div class="holder_div">
|
||||||
const courseList = document.getElementById("courses-list");
|
<div class="level_div">
|
||||||
courseList.innerHTML = "";
|
<div id="level-display" class="level-container">
|
||||||
|
<div class="level">Level <span id="level-number">5</span></div>
|
||||||
|
<div class="mc-xp-bar"><div></div></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<hr style="background-color: black; color: black;">
|
||||||
|
<div class="action_div">
|
||||||
|
<button class="survey" onclick="participateInSurvey()">An Umfrage teilnehmen</button>
|
||||||
|
<button onclick="newCourse()">Kurs hinzufügen</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
for (const courseId of userData.courses) {
|
<!-- Overlays -->
|
||||||
const course = await couchDB.get("course:" + courseId);
|
<overlay id="survey">
|
||||||
|
<div style="text-align: center; padding: 15px; margin-right: 2rem">
|
||||||
|
<input id="survey-code" type="text" placeholder="Umfrage-Code" />
|
||||||
|
<br />
|
||||||
|
<button style="margin-top: 1rem" onclick="startSurvey()">Teilnehmen</button>
|
||||||
|
</div>
|
||||||
|
</overlay>
|
||||||
|
|
||||||
const card = document.createElement("div");
|
<overlay id="add-course">
|
||||||
card.className = "course-card";
|
<div style="text-align: center; padding: 15px; margin-right: 2rem">
|
||||||
card.addEventListener("click", (e) => {
|
<input id="survey-code" type="text" placeholder="Kursname" />
|
||||||
if (e.target.closest("button")) return;
|
<br />
|
||||||
location.href = "./kursAnzeige.html?user=" + userData.name + ",course=" + courseId;
|
<button class="" style="margin-top: 1rem" onclick="addCourse()">Hinzufügen</button>
|
||||||
});
|
</div>
|
||||||
|
</overlay>
|
||||||
|
|
||||||
const surveyUrl =
|
<script>
|
||||||
card.innerHTML = `
|
const couchDB = new CouchDB();
|
||||||
<div class="course-title">${course.title}</div>
|
setUserData(couchDB).then((val) => {
|
||||||
|
setCourseView();
|
||||||
|
setLevelProgress(userData.xp);
|
||||||
|
setLevel(userData.level);
|
||||||
|
});
|
||||||
|
|
||||||
<div class="course-description">
|
async function startSurvey() {
|
||||||
${course.description}
|
const code = getOverlay("survey").getElementsByTagName("INPUT")[0].value.trim();
|
||||||
</div>
|
console.log(code);
|
||||||
|
var course = await couchDB.get("course:" + code);
|
||||||
|
if (course != undefined) {
|
||||||
|
const users = await couchDB.get("users");
|
||||||
|
users[userData.name].courses ??= [];
|
||||||
|
if (!users[userData.name].courses.includes(code)) {
|
||||||
|
users[userData.name].courses.push(code);
|
||||||
|
}
|
||||||
|
await couchDB.set("users", users);
|
||||||
|
location.href = "./umfrage.html?user=" + userData.name + ",course=" + code;
|
||||||
|
} else {
|
||||||
|
alert("Umfrage nicht gefunden!");
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
<button class="action start" onclick='location.href = "./umfrage.html?user=${userData.name},course=${courseId.trim()}";'>
|
async function setCourseView() {
|
||||||
Umfrage Starten
|
const courseList = document.getElementById("courses-list");
|
||||||
</button>
|
courseList.innerHTML = "";
|
||||||
|
|
||||||
<button class="action delete" onclick="deleteCourse('${courseId}')">
|
|
||||||
🗑
|
|
||||||
</button>
|
|
||||||
`;
|
|
||||||
courseList.appendChild(card);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
async function deleteCourse(courseId) {
|
for (const courseId of userData.courses) {
|
||||||
const users = await couchDB.get("users");
|
const course = await couchDB.get("course:" + courseId);
|
||||||
users[userData.name].courses = users[userData.name].courses.filter(id => id !== courseId);
|
|
||||||
await couchDB.set("users", users);
|
|
||||||
|
|
||||||
location.reload();
|
const expire_date = new Date(course.expire_date);
|
||||||
}
|
const isExpired = expire_date < new Date();
|
||||||
|
|
||||||
|
const card = document.createElement("div");
|
||||||
|
card.className = "course-card";
|
||||||
|
card.addEventListener("click", (e) => {
|
||||||
|
if (e.target.closest("button")) return;
|
||||||
|
location.href =
|
||||||
|
"./kursAnzeige.html?user=" + userData.name + ",course=" + courseId;
|
||||||
|
});
|
||||||
|
|
||||||
function participateInSurvey() {
|
const surveyUrl = (card.innerHTML = `
|
||||||
showOverlay("survey");
|
<div class="course-title">${course.title}</div>
|
||||||
}
|
|
||||||
|
|
||||||
function selectCourse(courseName) {
|
<div class="course-description">
|
||||||
console.log("Course selected:", courseName);
|
${course.description}
|
||||||
showOverlay("course");
|
</div>
|
||||||
}
|
|
||||||
|
|
||||||
function newCourse() {
|
${isExpired ? '': `
|
||||||
showOverlay("add-course");
|
<button class="action start" onclick='location.href = "./umfrage.html?user=${userData.name},course=${courseId.trim()}";'>
|
||||||
}
|
Umfrage Starten
|
||||||
|
</button>`
|
||||||
|
}
|
||||||
|
|
||||||
async function addCourse() {
|
<button class="action delete" onclick="deleteCourse('${courseId}')">
|
||||||
const courseName = getOverlay("add-course").getElementsByTagName("INPUT")[0].value.trim();
|
🗑
|
||||||
const course = await couchDB.get("course:" + courseName);
|
</button>
|
||||||
if (course == undefined) {
|
`);
|
||||||
alert("Kurs existiert nicht!");
|
courseList.appendChild(card);
|
||||||
return;
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
const users = await couchDB.get("users");
|
async function deleteCourse(courseId) {
|
||||||
users[userData.name].courses.push(courseName);
|
const users = await couchDB.get("users");
|
||||||
await couchDB.set("users", users);
|
users[userData.name].courses = users[userData.name].courses.filter(
|
||||||
setCourseView();
|
(id) => id !== courseId,
|
||||||
location.reload();
|
);
|
||||||
}
|
await couchDB.set("users", users);
|
||||||
|
|
||||||
function setLevelProgress(xp) {
|
location.reload();
|
||||||
document.getElementById('level-bar').value = xp;
|
}
|
||||||
document.getElementById('level-bar').max = userData.level + 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
function setLevel(level) {
|
function participateInSurvey() {
|
||||||
document.getElementById('level-number').textContent = level;
|
showOverlay("survey");
|
||||||
}
|
}
|
||||||
|
|
||||||
function addCourseToList(courseName) {
|
function selectCourse(courseName) {
|
||||||
const coursesList = document.getElementById('courses-list');
|
console.log("Course selected:", courseName);
|
||||||
const courseDiv = document.createElement('div');
|
showOverlay("course");
|
||||||
courseDiv.className = 'course-item';
|
}
|
||||||
courseDiv.innerHTML = `
|
|
||||||
<span>${courseName}</span>
|
|
||||||
<button onclick="editCourse('${courseName}')">Edit</button>
|
|
||||||
`;
|
|
||||||
coursesList.appendChild(courseDiv);
|
|
||||||
}
|
|
||||||
|
|
||||||
</script>
|
function newCourse() {
|
||||||
|
showOverlay("add-course");
|
||||||
|
}
|
||||||
|
|
||||||
<style>
|
async function addCourse() {
|
||||||
.xp-bar {
|
const courseName = getOverlay("add-course")
|
||||||
width: 100%;
|
.getElementsByTagName("INPUT")[0]
|
||||||
height: 20px;
|
.value.trim();
|
||||||
background-color: #dbdfdb;
|
const course = await couchDB.get("course:" + courseName);
|
||||||
border-radius: 10px;
|
if (course == undefined) {
|
||||||
overflow: hidden;
|
alert("Kurs existiert nicht!");
|
||||||
margin: 10px 0;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
.xp-bar::-moz-progress-bar {
|
const users = await couchDB.get("users");
|
||||||
background-color: #31b335;
|
users[userData.name].courses.push(courseName);
|
||||||
}
|
await couchDB.set("users", users);
|
||||||
|
setCourseView();
|
||||||
|
location.reload();
|
||||||
|
}
|
||||||
|
|
||||||
.xp-bar::-webkit-progress-value {
|
function setLevelProgress(xp) {
|
||||||
background: #31b335;
|
const max = userData.level + 1;
|
||||||
}
|
const percent = xp / max;
|
||||||
|
setXPBarPercent(percent*100);
|
||||||
|
}
|
||||||
|
|
||||||
.main-container {
|
function setLevel(level) {
|
||||||
display: flex;
|
document.getElementById("level-number").textContent = level;
|
||||||
flex-direction: column;
|
}
|
||||||
gap: 20px;
|
|
||||||
padding: 1.5rem;
|
|
||||||
align-items: center;
|
|
||||||
height: calc(100vh - 75px);
|
|
||||||
}
|
|
||||||
|
|
||||||
button.survey {
|
function addCourseToList(courseName) {
|
||||||
font-size: 20px;
|
const coursesList = document.getElementById("courses-list");
|
||||||
padding: 15px;
|
const courseDiv = document.createElement("div");
|
||||||
padding-left: 40px;
|
courseDiv.className = "course-item";
|
||||||
padding-right: 40px;
|
courseDiv.innerHTML = `
|
||||||
background-color: var(--accent_color_bg);
|
<span>${courseName}</span>
|
||||||
border: none;
|
<button onclick="editCourse('${courseName}')">Edit</button>
|
||||||
border-radius: var(--border-radius);
|
`;
|
||||||
cursor: pointer;
|
coursesList.appendChild(courseDiv);
|
||||||
max-width: 30rem;
|
}
|
||||||
width: 100%;
|
</script>
|
||||||
}
|
|
||||||
|
|
||||||
button.survey:focus-visible {
|
|
||||||
outline: 2px var(--accent_color_fg_o);
|
|
||||||
outline-offset: 2px;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.survey:hover {
|
|
||||||
background: var(--accent_color_bg_o);
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
}
|
|
||||||
|
|
||||||
.courses-container {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
.level-container {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.level {
|
|
||||||
font-family: Minecraftia;
|
|
||||||
color: #7bd67e;
|
|
||||||
}
|
|
||||||
|
|
||||||
#courses-container {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
max-height: 60vh;
|
|
||||||
}
|
|
||||||
|
|
||||||
#courses-list {
|
|
||||||
width: 100%;
|
|
||||||
overflow-y: scroll;
|
|
||||||
scrollbar-width: none;
|
|
||||||
height: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.course-card {
|
|
||||||
position: relative;
|
|
||||||
margin: 1rem;
|
|
||||||
min-height: 300px;
|
|
||||||
padding: 16px;
|
|
||||||
background: var(--accent_color_bg_o);
|
|
||||||
border-radius: 12px;
|
|
||||||
box-shadow: var(--def-shadow);
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
gap: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.course-title {
|
|
||||||
margin: 0;
|
|
||||||
padding: 10px;
|
|
||||||
font-size: 25px;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.course-description {
|
|
||||||
margin: 0;
|
|
||||||
font-size: 20px;
|
|
||||||
padding: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.course-actions {
|
|
||||||
display: flex;
|
|
||||||
gap: 10px;
|
|
||||||
margin-top: auto;
|
|
||||||
}
|
|
||||||
|
|
||||||
.action {
|
|
||||||
padding: 8px;
|
|
||||||
border: none;
|
|
||||||
border-radius: 8px;
|
|
||||||
cursor: pointer;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.action.start {
|
|
||||||
position: absolute;
|
|
||||||
top: 16px;
|
|
||||||
right: 70px;
|
|
||||||
font-size: 20px;
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
background-color: var(--accent_color_bg);
|
|
||||||
}
|
|
||||||
|
|
||||||
.action.start:hover {
|
|
||||||
background: var(--accent_color_bg_o);
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
}
|
|
||||||
|
|
||||||
.action.delete {
|
|
||||||
position: absolute;
|
|
||||||
top: 16px;
|
|
||||||
right: 16px;
|
|
||||||
font-size: 20px;
|
|
||||||
padding-left: 12px;
|
|
||||||
padding-right: 12px;
|
|
||||||
max-height: 40px;
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
background-color: var(--accent_color_bg);
|
|
||||||
}
|
|
||||||
|
|
||||||
.action.delete:hover {
|
|
||||||
background: var(--accent_color_bg_o);
|
|
||||||
border-radius: var(--border-radius);
|
|
||||||
}
|
|
||||||
|
|
||||||
.course-card:hover {
|
|
||||||
background: #b9d5e1;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.new {
|
|
||||||
display: block;
|
|
||||||
margin: 20px auto;
|
|
||||||
font-size: 30px;
|
|
||||||
font-weight: bold;
|
|
||||||
border: none;
|
|
||||||
width: 60px;
|
|
||||||
height: 60px;
|
|
||||||
background-color: var(--accent_color_bg);
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
|
|
||||||
button.new:hover {
|
|
||||||
background-color: var(--accent_color_bg_o);
|
|
||||||
}
|
|
||||||
|
|
||||||
@font-face {
|
|
||||||
font-family: Minecraftia;
|
|
||||||
src: url(data:font/truetype;base64,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gICAAQD/AAAABQAAAAACAAOAAAMABwALAA8AEwAAITUhFSU1MxUlETMZATUzFT0BIRUBAAEA/oCA/wCAgAEAgICAgICAAYD+gAGAgICAgIAABQAAAAACAAOAAAMABwALAA8AEwAAMTUhFT0BMxU1ETMRATUzFSU1IRUBAICA/wCA/oABAICAgICAgAGA/oABgICAgICAAAAABQAAAQACAAKAAAMABwALAA8AEwAAETUzFSE1MxUlNSEVJTUzFSE1MxWAAQCA/oABAP6AgAEAgAEAgICAgICAgICAgICAAAAAAQAAAIACgAMAAAsAACURITUhETMRIRUhEQEA/wABAIABAP8AgAEAgAEA/wCA/wAAAQAA/4AAgAEAAAMAABURMxGAgAGA/oAAAQAAAYACgAIAAAMAABE1IRUCgAGAgIAAAQAAAAAAgAEAAAMAADERMxGAAQD/AAAABQAAAAACgAOAAAMABwALAA8AEwAAMTUzFTURMxkBNTMVNREzGQE1MxWAgICAgICAgAEA/wABAICAgAEA/wABAICAAAAFAAAAAAKAA4AAAwAHAA8AFwAbAAAzNSEVATUzFQERMxEzFSMVIREjNTM1MxEBNSEVgAGA/wCA/oCAgIABgICAgP4AAYCAgAGAgID/AAKA/oCAgAGAgID9gAKAgIAAAAABAAAAAAKAA4AACwAAMTUhESM1MzUzESEVAQCAgIABAIACAICA/QCAAAAAAAYAAAAAAoADgAAHAAsADwATABcAGwAAMREzFSE1MxEBNTMVPQEhFQE1MxUFETMRATUhFYABgID+AIABAP4AgAGAgP4AAYABAICA/wABAICAgICAAQCAgIABAP8AAQCAgAAAAAAHAAAAAAKAA4AAAwAHAAsADwATABcAGwAAMzUhFSU1MxUhETMRATUhFQE1MxUFETMRATUhFYABgP4AgAGAgP6AAQD+AIABgID+AAGAgICAgIABAP8AAQCAgAEAgICAAQD/AAEAgIAAAAMAAAAAAoADgAADAAcAEwAAEzUzFT0BMxUTESERMxUhESM1IRGAgICA/gCAAYCAAQACAICAgICA/YABAAEAgAGAgPyAAAAAAAQAAAAAAoADgAADAAcACwATAAAzNSEVJTUzFSERMxEBESEVIRUhFYABgP4AgAGAgP2AAoD+AAGAgICAgIABgP6AAYABgICAgAAAAAAFAAAAAAKAA4AAAwAHAA8AEwAXAAAzNSEVNREzESERMxUhFSEZATUzFT0BIRWAAYCA/YCAAYD+gIABAICAgAEA/wACAICA/wACAICAgICAAAMAAAAAAoADgAADAAcADwAAIREzGQE1MxU1ESEVIxEhEQLine truncated
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
</body>
|
</body>
|
||||||
|
|
||||||
</html>
|
<style>
|
||||||
|
@font-face {
|
||||||
|
font-family: Minecraftia;
|
||||||
|
src: url(data:font/truetype;base64,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gICAAQD/AAAABQAAAAACAAOAAAMABwALAA8AEwAAITUhFSU1MxUlETMZATUzFT0BIRUBAAEA/oCA/wCAgAEAgICAgICAAYD+gAGAgICAgIAABQAAAAACAAOAAAMABwALAA8AEwAAMTUhFT0BMxU1ETMRATUzFSU1IRUBAICA/wCA/oABAICAgICAgAGA/oABgICAgICAAAAABQAAAQACAAKAAAMABwALAA8AEwAAETUzFSE1MxUlNSEVJTUzFSE1MxWAAQCA/oABAP6AgAEAgAEAgICAgICAgICAgICAAAAAAQAAAIACgAMAAAsAACURITUhETMRIRUhEQEA/wABAIABAP8AgAEAgAEA/wCA/wAAAQAA/4AAgAEAAAMAABURMxGAgAGA/oAAAQAAAYACgAIAAAMAABE1IRUCgAGAgIAAAQAAAAAAgAEAAAMAADERMxGAAQD/AAAABQAAAAACgAOAAAMABwALAA8AEwAAMTUzFTURMxkBNTMVNREzGQE1MxWAgICAgICAgAEA/wABAICAgAEA/wABAICAAAAFAAAAAAKAA4AAAwAHAA8AFwAbAAAzNSEVATUzFQERMxEzFSMVIREjNTM1MxEBNSEVgAGA/wCA/oCAgIABgICAgP4AAYCAgAGAgID/AAKA/oCAgAGAgID9gAKAgIAAAAABAAAAAAKAA4AACwAAMTUhESM1MzUzESEVAQCAgIABAIACAICA/QCAAAAAAAYAAAAAAoADgAAHAAsADwATABcAGwAAMREzFSE1MxEBNTMVPQEhFQE1MxUFETMRATUhFYABgID+AIABAP4AgAGAgP4AAYABAICA/wABAICAgICAAQCAgIABAP8AAQCAgAAAAAAHAAAAAAKAA4AAAwAHAAsADwATABcAGwAAMzUhFSU1MxUhETMRATUhFQE1MxUFETMRATUhFYABgP4AgAGAgP6AAQD+AIABgID+AAGAgICAgIABAP8AAQCAgAEAgICAAQD/AAEAgIAAAAMAAAAAAoADgAADAAcAEwAAEzUzFT0BMxUTESERMxUhESM1IRGAgICA/gCAAYCAAQACAICAgICA/YABAAEAgAGAgPyAAAAAAAQAAAAAAoADgAADAAcACwATAAAzNSEVJTUzFSERMxEBESEVIRUhFYABgP4AgAGAgP2AAoD+AAGAgICAgIABgP6AAYABgICAgAAAAAAFAAAAAAKAA4AAAwAHAA8AEwAXAAAzNSEVNREzESERMxUhFSEZATUzFT0BIRWAAYCA/YCAAYD+gIABAICAgAEA/wACAICA/wACAICAgICAAAMAAAAAAoADgAADAAcADwAAIREzGQE1MxU1ESEVIxEhEQEAgIDLine truncated
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</html>
|
||||||
@@ -133,6 +133,8 @@ border-radius: var(--border-radius);
|
|||||||
span.innerHTML = `<div style="width: 100%; height: 100%; overflow-y: auto;">
|
span.innerHTML = `<div style="width: 100%; height: 100%; overflow-y: auto;">
|
||||||
${answers}
|
${answers}
|
||||||
</div>`;
|
</div>`;
|
||||||
|
span.style.justifyContent = "top";
|
||||||
|
span.style.setProperty("justify-content", "start");
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in new issue
Block a user