mirror of
https://github.com/GuySandler/CanvasRefined.git
synced 2026-06-21 01:49:54 +02:00
progress
This commit is contained in:
Guy Sandler
parent
c53d84b3b0
commit
59b7523d48
@ -1339,12 +1339,15 @@ function setupBetterSidebar(mode = "dash") {
|
||||
else if (mode == "course") {
|
||||
document.getElementById("header").style.display = "none";
|
||||
document.querySelector(".ic-Layout-wrapper")?.style.setProperty("margin-left", "0");
|
||||
document.querySelector("#main")?.style.setProperty("margin-left", "0");
|
||||
// document.getElementById("not_right_side").style.display = "flex";
|
||||
mainWrapper.style.display = "flex";
|
||||
document.querySelector(".ic-Layout-contentMain").style.flex = "1";
|
||||
document.querySelector(".ic-Layout-contentMain").style.minWidth = "0";
|
||||
courseLinks = getCourseLinks();
|
||||
document.querySelector(".ic-app-nav-toggle-and-crumbs").style.display = "none";
|
||||
const leftSide = document.getElementById("left-side");
|
||||
if (leftSide) leftSide.style.display = "none";
|
||||
expanded = true;
|
||||
}
|
||||
|
||||
@ -1358,27 +1361,35 @@ function setupBetterSidebar(mode = "dash") {
|
||||
populateSidebarFromNav(sidebarContent);
|
||||
|
||||
if (mode == "course") {
|
||||
makeElement("h1", sidebarContent, {
|
||||
const courseLinksContainer = makeElement("div", sidebarContent, {
|
||||
id: "better-course-links",
|
||||
style: "display:flex;flex-direction:column;gap:15px;width:100%;align-items:center;min-height:auto;padding:10px 0;border-top:1px solid var(--bcborder-0);"
|
||||
});
|
||||
|
||||
if (courseLinks && courseLinks.length > 0) {
|
||||
makeElement("h1", courseLinksContainer, {
|
||||
id: "better-course-links-title",
|
||||
textContent: "Course Links:",
|
||||
style: "font-size: 20px;color:var(--bctext-0);margin-top:5px;margin-bottom:5px;"
|
||||
style: "font-size:12px;color:var(--bctext-0);margin:0;font-weight:bold;white-space:nowrap;text-align:center;display:block;"
|
||||
})
|
||||
courseLinks.forEach((link) => {
|
||||
createSidebarButton(
|
||||
link.name,
|
||||
domain + link.url,
|
||||
sidebarContent,
|
||||
`<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg0" style="width:20px;height:20px;">
|
||||
courseLinksContainer,
|
||||
`<svg viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" style="width:20px;height:20px;">
|
||||
<g id="SVGRepo_bgCarrier" stroke-width="0"></g>
|
||||
<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g>
|
||||
<g id="SVGRepo_iconCarrier">
|
||||
<path d="M7.05025 1.53553C8.03344 0.552348 9.36692 0 10.7574 0C13.6528 0 16 2.34721 16 5.24264C16 6.63308 15.4477 7.96656 14.4645 8.94975L12.4142 11L11 9.58579L13.0503 7.53553C13.6584 6.92742 14 6.10264 14 5.24264C14 3.45178 12.5482 2 10.7574 2C9.89736 2 9.07258 2.34163 8.46447 2.94975L6.41421 5L5 3.58579L7.05025 1.53553Z" fill="var(--bctext-0)"></path>
|
||||
<path d="M7.53553 13.0503L9.58579 11L11 12.4142L8.94975 14.4645C7.96656 15.4477 6.63308 16 5.24264 16C2.34721 16 0 13.6528 0 10.7574C0 9.36693 0.552347 8.03344 1.53553 7.05025L3.58579 5L5 6.41421L2.94975 8.46447C2.34163 9.07258 2 9.89736 2 10.7574C2 12.5482 3.45178 14 5.24264 14C6.10264 14 6.92742 13.6584 7.53553 13.0503Z" fill="var(--bctext-0)"></path>
|
||||
<path d="M5.70711 11.7071L11.7071 5.70711L10.2929 4.29289L4.29289 10.2929L5.70711 11.707１Z" fill="var(--bctext-0)"></path>
|
||||
<path d="M7.05025 1.53553C8.03344 0.552348 9.36692 0 10.7574 0C13.6528 0 16 2.34721 16 5.24264C16 6.63308 15.4477 7.96656 14.4645 8.94975L12.4142 11L11 9.58579L13.0503 7.53553C13.6584 6.92742 14 6.10264 14 5.24264C14 3.45178 12.5482 2 10.7574 2C9.89736 2 9.07258 2.34163 8.46447 2.94975L6.41421 5L5 3.58579L7.05025 1.53553Z" fill="white"></path>
|
||||
<path d="M7.53553 13.0503L9.58579 11L11 12.4142L8.94975 14.4645C7.96656 15.4477 6.63308 16 5.24264 16C2.34721 16 0 13.6528 0 10.7574C0 9.36693 0.552347 8.03344 1.53553 7.05025L3.58579 5L5 6.41421L2.94975 8.46447C2.34163 9.07258 2 9.89736 2 10.7574C2 12.5482 3.45178 14 5.24264 14C6.10264 14 6.92742 13.6584 7.53553 13.0503Z" fill="white"></path>
|
||||
<path d="M5.70711 11.7071L11.7071 5.70711L10.2929 4.29289L4.29289 10.2929L5.70711 11.7071Z" fill="white"></path>
|
||||
</g>
|
||||
</svg>`
|
||||
);
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
let expander = makeElement("div", sidebarList, {
|
||||
@ -1427,14 +1438,21 @@ function populateSidebarFromNav(sidebarContent) {
|
||||
const navMenu = document.getElementById("menu");
|
||||
if (!navMenu) return;
|
||||
|
||||
const menuItems = navMenu.querySelectorAll(".menu-item a[id^='global_nav'], .globalNavExternalTool a");
|
||||
const menuItems = navMenu.querySelectorAll("a[id^='global_nav'], .globalNavExternalTool a");
|
||||
menuItems.forEach(item => {
|
||||
const itemId = item.id || item.closest(".menu-item")?.id;
|
||||
const itemId = item.id;
|
||||
if (excludeIds.includes(itemId)) return;
|
||||
|
||||
const href = item.getAttribute("href");
|
||||
const textEl = item.querySelector(".menu-item__text");
|
||||
const text = textEl?.textContent?.trim();
|
||||
let textEl = item.querySelector(".menu-item__text");
|
||||
let text = textEl?.textContent?.trim();
|
||||
|
||||
// If text not found, try other sources
|
||||
if (!text) {
|
||||
text = item.getAttribute("aria-label")?.trim() ||
|
||||
item.getAttribute("title")?.trim() ||
|
||||
item.textContent?.trim();
|
||||
}
|
||||
|
||||
if (!text || !href) return;
|
||||
|
||||
@ -1443,10 +1461,41 @@ function populateSidebarFromNav(sidebarContent) {
|
||||
const svg = item.querySelector("svg");
|
||||
if (svg) {
|
||||
icon = svg.outerHTML;
|
||||
// Make SVG white by adding style
|
||||
// Detect and scale down large viewBox SVGs
|
||||
const viewBoxMatch = icon.match(/viewBox="([^"]+)"/);
|
||||
if (viewBoxMatch) {
|
||||
const [, viewBox] = viewBoxMatch;
|
||||
const parts = viewBox.split(/\s+/);
|
||||
const width = parseFloat(parts[2]);
|
||||
const height = parseFloat(parts[3]);
|
||||
// If viewBox is large, add fixed size to scale it down
|
||||
if (width > 32 || height > 32) {
|
||||
// Check if svg already has a style attribute
|
||||
if (icon.includes('style="')) {
|
||||
// Append to existing style
|
||||
icon = icon.replace(/style="([^"]*)"/, `style="$1 width:20px;height:20px;flex-shrink:0;fill:white;stroke:white;"`);
|
||||
} else {
|
||||
// Add new style attribute
|
||||
icon = icon.replace("<svg", '<svg style="width:20px;height:20px;flex-shrink:0;fill:white;stroke:white;"');
|
||||
}
|
||||
} else {
|
||||
// Smaller SVG - just add colors
|
||||
if (icon.includes('style="')) {
|
||||
icon = icon.replace(/style="([^"]*)"/, `style="$1 fill:white;stroke:white;flex-shrink:0;"`);
|
||||
} else {
|
||||
icon = icon.replace("<svg", '<svg style="fill:white;stroke:white;flex-shrink:0;"');
|
||||
}
|
||||
}
|
||||
} else {
|
||||
// No viewBox - just add colors
|
||||
if (icon.includes('style="')) {
|
||||
icon = icon.replace(/style="([^"]*)"/, `style="$1 fill:white;stroke:white;"`);
|
||||
} else {
|
||||
icon = icon.replace("<svg", '<svg style="fill:white;stroke:white;"');
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
createSidebarButton(text, href, sidebarContent, icon);
|
||||
});
|
||||
@ -1458,9 +1507,20 @@ function updateSidebar(expanded, sidebarList, expander) {
|
||||
labels.forEach(label => label.style.display = expanded ? "block" : "none");
|
||||
const buttons = document.querySelectorAll(".better-sidebar-btn");
|
||||
buttons.forEach(label => label.style.width = expanded ? "80%" : "40%");
|
||||
const courseLinksTitle = document.getElementById("better-course-links-title");
|
||||
if (courseLinksTitle) {
|
||||
courseLinksTitle.style.display = expanded ? "block" : "none";
|
||||
const container = document.getElementById("better-course-links");
|
||||
if (container) {
|
||||
container.style.borderTop = expanded ? "1px solid var(--bcborder-0)" : "none";
|
||||
container.style.paddingTop = expanded ? "10px" : "5px";
|
||||
container.style.paddingBottom = expanded ? "0" : "5px";
|
||||
}
|
||||
}
|
||||
}
|
||||
function getCourseLinks() {
|
||||
const linkList = document.getElementById("section-tabs");
|
||||
if (!linkList) return [];
|
||||
const links = linkList.querySelectorAll("a");
|
||||
const courseLinks = [];
|
||||
links.forEach(link => {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user