Skip to content

Instantly share code, notes, and snippets.

mkrummel

Block or report user

Report or block mkrummel

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View sample_lesson.html
<h2 style="background-color: #053958; color: #fff; text-align: center;">Unit 1: Differentiation and Integration</h2>
<div style="padding: 2px 0px 16px 0px;">
<div style="padding: 12px 16px; background-color: #f5f5f5; border: 1px solid #C7CDD1;">
<h4><strong>Today's Agenda:</strong></h4>
<ol>
<li>Warm Up: XXX</li>
<li>XXX: Notes | Presentation</li>
<li>Extra Practice: Khan Academy</li>
</ol>
</div>
View link_blocks.html
View sample_introduction.html
<div style="line-height: 1em; float: right; width: 35%; margin: 0px 0px 12px 12px;">
<p><img style="width: 95%;" src="https://cms.instructure.com/courses/335982/files/23649449/preview" alt="Michelle Krummel" data-api-endpoint="https://cms.instructure.com/api/v1/courses/335982/files/23649449" data-api-returntype="File" /> <br /><span style="font-size: x-small;">Michelle Krummel. Copyright @ 2016 Mad Matrix Photography.</span></p>
</div>
<div>
<h2>Canvas Course Design: Beyond the Basics!</h2>
<p>The main goal of this course is to increase your comfort level&nbsp; using the HTML editor to enhance your course design.</p>
<p>After completing this course, you should be able to:</p>
<ul>
<li>Create content that is user-friendly and accessible for students using screen readers, mobile devices, tablets, and laptops</li>
View sample_unit_overview.html
<div class="content-box;">
<div style="height: 110px; background-color: #053958; text-align: center;">
<div style="display: flex;">
<div style="width: 100%; position: relative; margin: 15px; border-bottom: 1px solid #ffffff;"></div>
<div style="position: relative; top: 3px; color: #ffffff;"><a class="icon-instructure" style="color: #ffffff;"></a></div>
<div style="width: 100%; position: relative; margin: 15px; border-bottom: 1px solid #ffffff;"></div>
</div>
<p><span style="color: #ffffff; font-size: 24px;"> UNIT OVERVIEW</span></p>
</div>
View sample_gridrow.html
<h4 style="text-align: left;">Some introductory text here...</h4>
<div style="text-align: center;">
<div style="background-color: #a2aaad; width: 100%; height: 6px; margin: 10px 0px;">&nbsp;</div>
<div class="content-box">
<div class="grid-row">
<div class="col-xs" style="display: inline-block;">
View sample_clickable_blocks.html
<div style="max-width: 922px;">
<div style="margin: 0px 0px;">
<div style="height: 60px; background-color: #053958; text-align: left;">
<p style="padding: 12px;"><span style="color: #ffffff; font-size: 24px;"> Canvas Course Design: Beyond the Basics</span></p>
</div>
<p>Click the links below to navigate to each of the units in this course.</p>
<div style="margin-bottom: 6px; overflow: hidden;"><a style="display: block; border: solid 1px; border-color: #053958; padding: 10px; text-decoration: none; margin-bottom: 10px; font-size: 1.25em; background-color: #f5f5f5;" href="https://cms.instructure.com/courses/335982/modules/354283" data-api-endpoint="https://cms.instructure.com/api/v1/courses/335982/modules/354283" data-api-returntype="Module"> Unit 1: Design Structure <span style="display: block; font-size: 0.6em;"> In this unit, we will consider various ways of structuring our design, as well as ways of making our courses more mobile-friendly. </span></a></div>
<div style="margin-
@mkrummel
mkrummel / sample_icons.html
Last active Aug 13, 2019
A sample Canvas front page using icons to link to course content
View sample_icons.html
<div style="text-align: center;">
<div style="max-width: 700px; display: inline-block;">
<div style="padding: 10px; display: inline-block; text-align: center;"><a href="LINK"><img src="http://mrskrummel.com/canvas/icons/blue/clipboard.png" width="110" height="110" /></a><br /><a href="LINK">Course Overview</a></div>
<div style="padding: 10px; display: inline-block; text-align: center;"><a href="LINK"><img src="http://mrskrummel.com/canvas/icons/blue/pencil_ruler" width="110" height="110" /></a><br /><a href="LINK">Modules</a></div>
<div style="padding: 10px; display: inline-block; text-align: center;"><a href="LINK"><img src="http://mrskrummel.com/canvas/icons/blue/resources.png" width="110" height="110" /></a><br /><a href="LINK">Resources</a></div>
<div style="padding: 10px; display: inline-block; text-align: center;"><a href="LINK"><img src="http://mrskrummel.com/canvas/icons/blue/gear" width="110" height="110" /></a><br /><a href="LINK">LaTeX</a></div>
<div style="padding: 10px; display: inline-block
View sample_blocks.html
<div style="text-align: center;">
<div style="max-width: 700px; display: inline-block;">
<h2 style="text-align: center;">Your Page Title Goes Here</h2>
<p style="text-align: left;">Some introductory text here...</p>
<div style="background-color: #a2aaad; width: 100%; height: 6px; margin: 10px 0px;">&nbsp;</div>
<div style="background-color: #00afd7; width: 120px; height: 180px; display: inline-block; margin: 6px; vertical-align: top; text-align: center;">
<div style="padding: 0 0;">
<div style="padding: 50% 0;"><a style="text-decoration: none;" title="Design Structure" href="https://cms.instructure.com/courses/335982/modules/354283" data-api-endpoint="https://cms.instructure.com/api/v1/courses/335982/modules/354283" data-api-returntype="Module"><span style="color: #ffffff; text-decoration: none;"><strong>DESIGN</strong><br /><strong>STRUCTURE</strong></span></a></div>
</div>
</div>
You can’t perform that action at this time.