CanadianBacon/CanvasRefined
1
0
Fork 0
mirror of https://github.com/GuySandler/CanvasRefined.git synced 2026-11-10 17:07:17 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

list mode compatibility done

Browse Source
This commit is contained in:
Guy Sandler 2026-08-30 17:21:49 -07:00
parent b859108ac8
commit d715feb410
2 changed files with 44 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
css/darkmodecss.js
View File

@ -1217,6 +1217,39 @@ hr {
.PlannerHeader-styles__root svg {
fill: var(--bctext-0) !important;
}
/* The "Today" button's label span carries Canvas's dark ink color from its
emotion class, which beats the inherited root color above — dark text on
the dark header bar. Force the whole button chain to the theme text color. */
.PlannerHeader-styles__root button,
.PlannerHeader-styles__root button span {
color: var(--bctext-0) !important;
}
/* Solid themed surfaces for the header buttons. Canvas leaves the icon
buttons (Add To Do / Show My Grades / opportunities) fully transparent
and paints the Today button an unthemed color — on the dark header bar
they need solid backgrounds to read as buttons. #planner-today-btn:hover
is listed separately because the ID selector on the base background rule
above would otherwise out-specify the class-only :hover rule. */
.PlannerHeader-styles__root button {
background: var(--bcbackground-1) !important;
border: 1px solid var(--bcborders) !important;
border-radius: 4px !important;
}
.PlannerHeader-styles__root button:hover,
#planner-today-btn:hover {
background: var(--bcbackground-2) !important;
}
/* Instructure's Button variant paints its inner content span white (and a
light gray on hover / white + inset shadow on active). That span covers
the themed button background painted above, so the "Today" button still
rendered as a white box. Flatten the content span in every state so the
button's own surface shows through. */
.PlannerHeader-styles__root button [class$="-baseButton__content"],
.PlannerHeader-styles__root button:hover [class$="-baseButton__content"],
.PlannerHeader-styles__root button:active [class$="-baseButton__content"] {
background: transparent !important;
box-shadow: none !important;
}
/* Flash alert toasts (.flashalert-message, e.g. "Nothing planned today.
Selecting next item."): Canvas renders them as white cards with dark
text, unthemed in dark mode. Paint them with the theme background and

16
js/content.js
View File

@ -1104,16 +1104,22 @@ async function applyCustomBackground() {
padding: 8px 12px !important;
box-sizing: border-box !important;
}
/* Inner surfaces Canvas keeps opaque (course-grouping title strip,
"Show N completed item" facade, "Nothing Planned" filler, and the
Today/Add To Do header cluster that sits on the glass dashboard
header bar): flatten them so the glass behind shows through. */
#dashboard-planner .Grouping-styles__title,
/* Inner surfaces Canvas keeps opaque (the "Show N completed
item" facade, "Nothing Planned" filler, and the Today/Add To Do
header cluster that sits on the glass dashboard header bar):
flatten them so the glass behind shows through. The course-
grouping label instead gets a subtle chip behind the course name —
it sits over the course hero image, so without a backdrop the
text can be hard to read on busy images. */
#dashboard-planner .CompletedItemsFacade-styles__root,
#dashboard-planner .EmptyDays-styles__nothingPlanned,
#dashboard-planner-header .PlannerHeader-styles__root {
background: transparent !important;
}
#dashboard-planner .Grouping-styles__title {
background: var(--bcbackground-1) !important;
border-radius: 6px !important;
}
/* Item-row hover: subtle tint on the glass instead of Canvas's flat
gray, so rows feel alive on the translucent day cards. */
#dashboard-planner .planner-item:hover,