This is the HTML template that I use for calendar entries in Brightspace.
I have copied an example entry for one course and annotated it lightly
background-color is #fff (white)color is #000 (black)font-family to include a space characteroptional content uses style="display:none" so it can be easily made visible with minimal keystrokes
secondary content is smaller and paler. Pale version of blue links is #8fb5e3
label links such as [survey], [PDF], [PNG] etc. using double smaller size
examples:
<span style="font-size: smaller;"><span style="font-size: smaller;">[survey]</span></span>
<span style="font-size:smaller;color:#666">[<abbr title="portable document format" style="text-transform:lowercase; font-variant:small-caps">PDF</abbr>]</span>
<span style="font-size:smaller;color:#666">[<abbr title="portable network graphic" style="text-transform:lowercase; font-variant:small-caps">PNG</abbr>]</span>%
🎶smaller size, breadcrumbs with a link at the end, using … and → with
My lectures are in the P – Professor's lectures subsection of Content
example:
<span style="font-size: smaller;"
>(see <span style="font-family: Lato,sans-serif;"
>Content →
P –… →
2 – <abbr title="Technology" >Tech</abbr>… →
2A – <abbr title="World Wide Web">WWW</abbr>& … →
<a rel="noopener"
href="/d2l/common/dialogs/quickLink/quickLink.d2l?ou={orgUnitId}&type=content&rcode=dalhousie-1863285"
target="_blank"
>2A1 – Fundamental technologies of social computing applications</a></span>)
</span>
For times when there are multiple high-level objectives then nested lists (upper-alpha with decimal nested within)
Optional section with files to share such as notes taken during class.
<div style="quotes: 'โ' 'โ' 'โ' 'โ';">
<h1 style="margin-top: 0;"
>Week #2
<abbr title="continued" style="display:none;
font-weight:normal;color:#999;">cont.</abbr>
<span style="font-weight: normal; font-size: medium;">(in Rowe 1009)</span></h1>
<h2 style="margin-bottom: 0.25ex;">Everyday Events <a rel="noopener" href="https://tidal.com/browse/track/7900624/u"
title="pre-class interlude: Don't Bring Me Down by Electric Light Orchestra" target="_blank"
><span style="font-size: x-small; font-weight: 100; vertical-align: text-top;">๐ถ</span></a></h2>
<!-- ** EVERYDAY ** (4 items) -->
<ol style="margin-top: 0;">
<!-- *Everyday 1: Announcements and Reminders* -->
<li>Announcements & Reminders
<ul style="margin-top: 0;">
<li style="display: display;
color: #999; list-style-type: none;">(none yet)</li>
</ul>
</li>
<!-- *Everyday 2: News* -->
<li style="margin-top: 1.2ex; margin-bottom: 0;">Relevant news items? <span style="font-size: smaller;">(see also <a rel="noopener" style="text-decoration: underline;" href="/d2l/common/dialogs/quickLink/quickLink.d2l?ou={orgUnitId}&type=discuss&rcode=dalhousie-1344973" target="_blank">discussion forum</a>)</span>
<ul style="margin-top: 0;">
<li style="display: none;
color: #999;">(skipped but see <a rel="noopener" style="color: #999; text-decoration: underline;" href="/d2l/common/dialogs/quickLink/quickLink.d2l?ou={orgUnitId}&type=discuss&rcode=dalhousie-1344973" target="_blank">discussion forum</a>)</li>
<li style="display: none;
color: #999;">(none yet but can be updated after class)</li>
<li>Nepal bans several <abbr title="social computing application">SCA</abbr>s for not registering with government <span style="font-size: smaller;"><a rel="noopener" style="font-size: smaller; color: #8fb5e3;" href="https://ground.news/article/nepal-blocks-facebook-x-youtube-and-others-for-failing-to-register-with-the-government?utm_source=mobile-app&utm_medium=newsroom-share" target="_blank">[link to report in <cite>Ground News</cite>]</a></span></li>
</ul>
</li>
<!-- *Everyday 3: Teaching Feedback* -->
<li style="margin-top: 1.2ex; margin-bottom: 0;">Teaching feedback <span style="font-size: smaller; color: #666;">from <a rel="noopener" href="/d2l/common/dialogs/quickLink/quickLink.d2l?ou={orgUnitId}&type=survey&rCode=dalhousie-167078" target="_blank">feedback on teaching</a> survey, course representative, <a rel="noopener" href="mailto:prof1107@cs.dal.ca?Subject=Feedback%20via%20calendar"> <abbr title="electronic">e-</abbr>mail to professor</a>, <abbr title="and so on">etc.</abbr></span>
<ul style="margin-top: 0;">
<li style="display: display;
color: #999;">(none yet)</li>
</ul>
</li>
<!-- *Everyday 4: Q&A* -->
<li style="margin-top: 1.2ex; margin-bottom: 0.125ex;"><abbr title="Questions and Answers">Q&A</abbr>?
<ul style="margin-top: 0; color: #999;">
<li style="display: display;">(none yet but will be updated after class if there were questions)</li>
</ul>
<dl style="margin-top: 0; display: none;">
<dt style="margin-top: 0;"><abbr title="Question">Q</abbr>: ?</dt>
<dd><abbr title="Answer">A</abbr>: .</dd>
<dt style="margin-top: 1.75ex; display: none;"><abbr>Q</abbr>: ?</dt>
<dd style="display: none;"><abbr>A: .</abbr></dd>
</dl>
</li>
</ol>
<!-- ** start of MAIN Content ** -->
<!-- *Pre-class* -->
<h2 title="What students should do before joining class (synchronously) or reviewing the recording asynchronously" style="margin-top: 2.4ex; margin-bottom: 0;">Pre-meeting preparation</h2>
<p style="margin-top: 0; margin-bottom: 0; font-size: smaller; color: #666; font-style: italic;">What students should do before class <a rel="noopener" href="/d2l/common/dialogs/quickLink/quickLink.d2l?ou={orgUnitId}&type=content&rcode=dalhousie-1937561" target="_self"></a></p>
<ol style="margin-top: 0;">
<li>If you missed the first class then review its reminders and agenda</li>
<li>Review <a rel="noopener" href="/d2l/common/dialogs/quickLink/quickLink.d2l?ou={orgUnitId}&type=content&rcode=dalhousie-2395081" target="_blank">ยง1 โ Introduction</a></li>
<li>Prepare for ยง2 – Fundamental Technologies of social computing applications <br>
<span style="font-size: smaller;"
>(see <span style="font-family: Lato,sans-serif;"
>Content →
P –… →
2 – <abbr title="Technology">Tech</abbr>… →
2A – <abbr title="World Wide Web">WWW</abbr> &hellip; →
<a rel="noopener"
href="/d2l/common/dialogs/quickLink/quickLink.d2l?ou={orgUnitId}&type=content&rcode=dalhousie-1863285"
target="_blank"
>2A1 โ Fundamental technologies of social computing applications</a></span>)</span>
<ul style="margin-top: 0;">
<li><a rel="noopener"
href="/d2l/common/dialogs/quickLink/quickLink.d2l?ou={orgUnitId}&type=content&rcode=dalhousie-3222029"
target="_blank"
>2A1 (main lecture)</a></li>
<li><a rel="noopener"
href="/d2l/common/dialogs/quickLink/quickLink.d2l?ou={orgUnitId}&type=content&rcode=dalhousie-1863291"
target="_blank"
>2A1(a) โ Vocabulary review โฆ</a></li>
</ul>
</li>
</ol>
<!-- **TODAY's LECTURE** -->
<h2 style="margin-bottom: 0.125ex; margin-top: 2.5ex;">Today's Activities</h2>
<ol style="margin-top: 0;">
<li>Review of hardest concept from last lecture (see <a rel="noopener" href="/d2l/common/dialogs/quickLink/quickLink.d2l?ou={orgUnitId}&type=survey&rCode=dalhousie-2931356" target="_blank">For review next class</a> <span style="font-size: smaller;"><span style="font-size: smaller;">[survey]</span></span>)</li>
<li>Begin to identify common characteristics of some social computing applications
<ul style="margin-top: 0;">
<li>understand the distinction between designer's intention and application by users</li>
</ul>
</li>
<li>Begin to discuss topics for the group presentation (<a rel="noopener" href="/d2l/common/dialogs/quickLink/quickLink.d2l?ou={orgUnitId}&type=content&rcode=dalhousie-3607715" target="_blank">assignment G1</a>)</li>
<li>If there is time we will begin reviewing ยง2 (Fundamental technologies of social computing)</li>
</ol>
<!-- ** end of MAIN Content ** -->
<!-- **WHY** -->
<h2 style="margin-top: 2.4ex; margin-bottom: 0.125ex;">Objectives</h2>
<ol style="margin-top: 0; list-style-type: upper-alpha;">
<li>
<ol style="margin-top: 0; list-style-type: decimal;">
<li>Students to begin to work together</li>
</ol>
</li>
<li>
<ol style="margin-top: 1.2ex; list-style-type: decimal;">
<li>Know the definition of social computing that we use in this course</li>
<li>Distinguish social communication from other forms</li>
<li>Be familiar with the <q>3 essential components of usability</q>: <em>who</em> (what distinguishes the users), <em>why</em> (the reason for using the thing that's usability is being assessed), and <em>what</em> (the thing)</li>
<li>Be somewhat familiar with categories of social computing applications and be able to apply them</li>
</ol>
</li>
</ol>
<!-- *EXTRAs* -->
<div style="display: none; margin-top: 2.4ex;">
<hr>
<h3 style="margin-bottom: 0.125ex;">Resources</h3>
<ul style="margin-top: 0;">
<li>Content → →</li>
</ul>
</div>
</div> <!-- end of style for quotations -->