schoolbox web extension :)
42willow.github.io
1/*
2 Be specific as possible with your selectors, try and use the verbose Schoolbox component class names
3 For example:
4 .Schoolbox_Learning_Component_Dashboard_UpcomingWorkController <your selectors>
5*/
6
7/* ----- global ----- */
8
9/* div#calendar-15403, TODO)) not sure if I need this
10.scrollable,
11section.content, */
12.tile,
13.button:not(.icon-search):not(.mark-all-read) {
14 border-radius: 10px !important;
15 overflow: clip;
16}
17
18/* advanced search button */
19.icon-search.button {
20 border-radius: 0px 0px 10px 10px !important;
21}
22.c-header-search__results {
23 border: none !important;
24}
25
26.small-12.island > section {
27 border-radius: 0px 0px 10px 10px;
28 overflow: clip;
29}
30
31/* timetable on homepage */
32div[data-timetable-container] > section:has(.timetable) {
33 border-radius: 10px !important;
34 overflow: clip;
35}
36
37/* account and action dropdown */
38#account-content,
39.f-dropdown {
40 border-radius: 0px 0px 10px 10px !important;
41}
42/* see all notifications button */
43#message-list > li > a.button:not(.mark-all-read) {
44 border-radius: 0px 0px 10px 10px !important;
45}
46
47/* round action buttons */
48.actions-small-3 > nav a[class*="icon-"]:hover,
49.actions-small-3 > nav a[class^="icon-"]:hover,
50.island .row.actions-small-3 > nav a[class*="icon-"]:hover,
51.island .row.actions-small-3 > nav a[class^="icon-"]:hover,
52.left-off-canvas-menu .left-menu-dock:hover {
53 border-radius: 10px;
54}
55
56/* ----- notifications page ----- */
57/* url:/notifications */
58
59.notification-list .information-list > li:first-child > div,
60.notification-list .information-list > li:first-child {
61 border-radius: 10px 10px 0px 0px;
62}
63.notification-list .information-list > li:last-child > div,
64.notification-list .information-list > li:last-child {
65 border-radius: 0px 0px 10px 10px;
66}
67.notification-list .information-list,
68.notification-list .information-list > li:only-child > div {
69 border-radius: 10px;
70}
71
72/* news component */
73#news-component {
74 /* round tabs at the bottom */
75 & .tabs {
76 border-radius: 10px 10px 0px 0px;
77 }
78
79 /* round the news cards */
80 & ul.information-list {
81 background: none !important;
82 & > li {
83 background-color: hsl(var(--ctp-surface0)) !important;
84 /* round the bottom of the last card */
85 &:last-child {
86 border-radius: 0px 0px 10px 10px !important;
87 }
88 }
89 }
90}
91
92/* empty component */
93.Schoolbox_Calendar_Component_Dashboard_Controller.component-container .empty-state {
94 border-radius: 10px;
95}
96
97/* upcoming work component */
98.Schoolbox_Learning_Component_Dashboard_UpcomingWorkController .information-list,
99.Schoolbox_Learning_Component_Dashboard_UpcomingWorkController .information-list .card {
100 border-radius: 10px !important;
101}
102
103/* calendar */
104.calendar-15403,
105.fc {
106 border-radius: 10px;
107}
108
109/* slideshow */
110.Component_Dashboard_SlideshowController.component-container .swiper {
111 border-radius: 10px !important;
112}
113
114/* ----- calendar page ----- */
115/* url:/calendar */
116
117/* buttons */
118.fc-button-group > button:first-child {
119 border-radius: 10px 0px 0px 10px;
120}
121.fc-button-group > button:last-child {
122 border-radius: 0px 10px 10px 0px;
123}
124
125/* ----- classes page ----- */
126/* url:/learning/classes */
127
128.v-card {
129 border-radius: 10px;
130}
131.card-class-image {
132 border-radius: 10px 10px 0px 0px;
133}
134
135/* ----- homepage (class pages) ----- */
136/* url:/homepage/code/:id */
137
138div.columns .component-titlebar {
139 border-radius: 10px;
140}
141
142/* social stream */
143.Component_Homepage_SocialStreamController section,
144.Component_Homepage_SocialStreamController .information-list {
145 border-radius: 10px;
146}
147
148/* news */
149.component-action > section {
150 background-color: var(--left-bg-primary) !important;
151 border-radius: 10px !important;
152 border: none !important;
153}
154.component-action {
155 background: var(--left-bg-primary) !important;
156 border-radius: 0px 0px 10px 10px;
157}
158.Schoolbox_Comms_News_Component_Homepage_Controller.component-container .island > section,
159.Component_Homepage_ImageController.component-container .island > section,
160.Component_Homepage_ClassListController.component-container .island > section {
161 background: none !important;
162}
163
164.Component_Homepage_CountdownController.component-container,
165.Schoolbox_Resource_Textbox_Component_Homepage_Controller.component-container,
166.Component_Homepage_SocialStreamController.component-container,
167.Component_Homepage_SlideshowController.component-container,
168.Component_Homepage_AudioController.component-container,
169.Component_Homepage_TeachersController.component-container,
170.Component_Homepage_ClassListController.component-container,
171.Schoolbox_Comms_News_Component_Homepage_Controller.component-container,
172.Component_Homepage_LinkListController.component-container,
173.Component_Homepage_FileListController.component-container,
174.Schoolbox_Learning_Assessment_Component_Homepage_Outline_Controller.component-container,
175.Schoolbox_Learning_Assessment_DueWork_Component_Homepage_Controller.component-container,
176.Schoolbox_Learning_Assessment_Task_Component_Homepage_Controller.component-container,
177.Schoolbox_Learning_Assessment_Quiz_Component_Homepage_Controller.component-container,
178.Component_Homepage_ImageController.component-container,
179.Schoolbox_Tile_Component_HomepageTileController {
180 background: hsl(var(--ctp-accent));
181 border-radius: 10px;
182}
183
184.Component_Homepage_ImageController.component-container img {
185 border-radius: 0px 0px 10px 10px !important;
186}
187
188/* round some other components and clip overflow */
189
190.Schoolbox_Fixtures_Component_Dashboard_Controller section,
191.Component_Dashboard_TextboxController section {
192 border-radius: 10px !important;
193 overflow: clip !important;
194}