Student Notes UI

This work is for [TNL-932] (https://openedx.atlassian.net/browse/TNL-932)

@polesye Ping me with any questions, please.

CC'ing @talbs @explorerleslie 
What if the section has more than 1 subsection?
Is it a separate `note-group`?
Should I duplicate section name each time?

```html
<section class="note-group">
<h3>
  <span class="course-title">EXAMPLE WEEK 3: BE SOCIAL</span>
  <span class="course-subtitle">HOMEWORK - FIND YOUR STUDY BUDDY</span>
</h3>
...
</section>
<section class="note-group">
<h3>
  <span class="course-title">EXAMPLE WEEK 3: BE SOCIAL</span>
  <span class="course-subtitle">MORE WAYS TO CONNECT</span>
</h3>
</section>
...
```