askclass-course-theme 0.5.1 → 0.6.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 514905a300536f3d6b73949c54dcc1fdc181aea33c93887c3f8dcc055b8e37d0
-  data.tar.gz: c58f8934c0a99269473f7b5a99d39a3ebb64ae55c025d8737a92c2e51220cb11
+  metadata.gz: aafc1e9d45a313b35dda95263c6056b6a5dbcdce114afe55c5f10bd3fbee28e7
+  data.tar.gz: ddce588ee85b9ff572bc25bf01d1fd97d1b417f6bf9595a5cb91a5128564b191
 SHA512:
-  metadata.gz: 73208823dff0cd482574dc8456826e57c0dc1e18a3617338c61b35577a1999ded9bb82c351fd2ed7d5fc712125f8dc7a754c4d163fa41b41cd54e5dad2499a31
-  data.tar.gz: fc9dbb0d4c4ffc48f6275ea6ec77eccd4254c7ee57971d946998b7d44e3f4ee9d49dd076cf3241885dc37a5ff6daac0b7129f28814cb6b06277974983403c16f
+  metadata.gz: c5d8f4e9f1cb99e737051a652647da6145d33d58da498578670ced451cfdd5f89906e8ad3640b1472f880208d0ae253ef0bcecc5509da704fc1a9a43d6d48a30
+  data.tar.gz: cf79699e5bf8348347b83b4e1b89b2c7c5e4c4a7727582799b3ca6ea2215e464681f21117eb038564efe8003dcdec07c523561cf6a07960774a9f1efc4e8950b

data/_config.yml

@@ -22,6 +22,10 @@ acc:
     alt_image: "logo.svg"
     alt_size: 200
     sizes: [ 48, 96, 144, 192, 300, 512 ]
+  shortcut:
+    name: Syllabus
+    url: https://acc.askclass.com/session/session-01
+    desc: Class syllabus and contact information
   meta:
     apple_icon: "logo-300.png"
     og_image: "logo-square-512.png"
@@ -65,7 +69,7 @@ collections:
 
 defaults:
   - scope:
-      path: ""
+      path: "*.html"
     values:
       layout: "default"
   - scope:

data/_includes/foot/pwaupdate.html

@@ -1,5 +1,6 @@
-{% assign file = site.static_files | where: "path", "/pwabuilder-sw.js" %}
-{% if file.size != 0 %}
+{% assign pwafile = site.static_files | where: "path", "/pwabuilder-sw.js" %}
+{% assign offlinefile = site.static_files | where: "path", "/offline.html" %}
+{% if file.size != 0 && offlinefile.size != 0 %}
   <script defer type="module">
     import 'https://cdn.jsdelivr.net/npm/@pwabuilder/pwaupdate';
     const el = document.createElement('pwa-update');

data/_includes/head/common.html

@@ -1,7 +1,8 @@
 {% assign acc = site.acc %}
 {% assign desc = page.excerpt | default: site.description | strip_html | strip_newlines %}
+{% assign assets = '/assets/' | prepend: site.url %}
 {% assign families = acc.font_families | join: "&family=" %}
-{% assign og_image = acc.meta.og_image | prepend: '/assets/' | prepend: site.url %}
+{% assign og_image = acc.meta.og_image | prepend: assets %}
 
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width,initial-scale=1.0" />
@@ -26,7 +27,7 @@
   <meta name="twitter:card" content="summary_large_image">
   {% endif % %}
 
-  <link rel="manifest" href="/assets/site.webmanifest" />
+  <link rel="manifest" href="{{ assets }}site.webmanifest" />
   <link rel="preconnect" href="https://cdn.jsdelivr.net" />
   <link rel="preconnect" href="https://cdn.jsdelivr.net" crossorigin />
   <link rel="preconnect" href="https://fonts.googleapis.com" />
@@ -34,11 +35,11 @@
   <link rel="preload" as="style"
         href="https://fonts.googleapis.com/css2?family={{ families }}&display=swap"
         onload='this.onload=null;this.rel="stylesheet"' />
-  <link rel="shortcut icon" href="/assets/{{ acc.meta.shortcut.favicon }}" />
-  <link rel="icon" type="{{ acc.meta.shotcut.type }}" href="/assets/{{ acc.meta.shortcut.image }}" />
-  <link rel="icon" type="image/svg+xml" href="/assets/{{ acc.logo.image }}" />
+  <link rel="shortcut icon" href="{{ assets }}{{ acc.meta.shortcut.favicon }}" />
+  <link rel="icon" type="{{ acc.meta.shotcut.type }}" href="{{ assets}}{{ acc.meta.shortcut.image }}" />
+  <link rel="icon" type="image/svg+xml" href="{{ assets}}{{ acc.logo.image }}" />
 
-  <link rel="apple-touch-icon" href="/assets/{{ acc.meta.apple_icon }}" />
+  <link rel="apple-touch-icon" href="{{ assets}}{{ acc.meta.apple_icon }}" />
   {% for size in acc.logo.sizes %}
-  <link rel="apple-touch-icon" sizes="{{size}}x{{size}}" href="/assets/logo-{{size}}.png" />
+  <link rel="apple-touch-icon" sizes="{{size}}x{{size}}" href="{{ assets }}logo-square-{{size}}.png" />
   {% endfor %}

data/_includes/logo.html

@@ -3,13 +3,13 @@
     <img src="/assets/{{ include.image | default: site.acc.logo.image }}"
       width="{{ include.size | default: site.acc.logo.size }}"
       height="{{ include.height | default: site.acc.logo.height | default: site.acc.logo.size }}"
-      title="{{ site.title }}"/>
+      title="{{ site.title }}" />
   </a>
   {%- if include.href %}
   <h4 class="special"><a href="{{ include.href }}">{{ include.title | default: site.title }}</a></h4>
   {% elsif include.title %}
   <h4 class="special" style="color: var(--color-theme); margin: 0 0 1em 0">{{ include.title }}</h4>
   {% else %}
-  <h4 class="special">{{ include.title | default: site.title }}</h4>
+  <h3 class="special" style="color: var(--color-theme)">{{ include.title | default: site.title }}</h3>
   {% endif -%}
 </section>

data/_includes/logo_static.html

@@ -0,0 +1,25 @@
+<section class="course-id">
+  <a href="/">
+    <img src="/assets/{{ include.image | default: site.acc.logo.image }}"
+      width="{{ include.size | default: site.acc.logo.size }}"
+      height="{{ include.height | default: site.acc.logo.height | default: site.acc.logo.size }}"
+      title="{{ site.title }}" />
+  </a>
+  <a href="/segment/{{ session_data.segment }}">{{ site.acc.short_name }}</a>
+</section>
+
+<script defer>
+  const e = document.querySelector('section.course-id');
+  window.onscroll = () => {
+    const top = window.pageYOffset;
+    if (window.innerHeight + top >= document.body.offsetHeight - 2) {
+      e.style.opacity = 1;
+      e.style.top = 'unset';
+      e.style.bottom = '70px';
+    } else {
+      e.style.top = '5px';
+      e.style.bottom = 'unset';
+      e.style.opacity = top > 100 ? 0.5 : 1;
+    }
+  }
+</script>

data/_includes/session/header.html

@@ -1,4 +1,4 @@
-<section class="center-align special">
+<section class="center-align special spacer">
   {%- if session_data.header -%}
     <div>{{ session_data.header }}</div>
   {%- endif -%}

data/_layouts/default.html

@@ -5,8 +5,10 @@
     {% include logo.html %}
     {% if page.url == '/' %}
       {% include course.html %}
-    {% elsif page.url == '/404' %}
+    {% elsif page.url == '/404.html' %}
       <h2 class="center-align">Page not found!</h2>
+    {% elsif page.url == '/offline.html' %}
+      <h2 class="center-align">You're Currently Offline</h2>
     {% else %}
       {{ content }}
     {% endif %}

data/_layouts/segment.html

@@ -5,7 +5,7 @@
 <html lang="en">
   {% include header.html %}
   <body>
-    {% include logo.html size=50 %}
+    {% include logo.html size=50 title=site.title %}
     {% include segment/header.html info=info %}
 
     {% include segment/index.html info=info %}

data/_layouts/session.html

@@ -6,7 +6,7 @@
 <html lang="en">
   {% include header.html %}
   <body>
-    {% include logo.html size=50 title=site.acc.short_name %}
+    {% include logo_static.html size=30 height=30 %}
     {% include session/header.html %}
 
     <section class="center-align spacer content">

data/_sass/_base.scss

@@ -148,6 +148,23 @@ sub {
   margin-top: 100px;
 }
 
+.course-id {
+  @include align-middle();
+  font-family: var(--font-special);
+  flex-direction: row-reverse;
+  position: fixed;
+  top: 5px;
+  right: 5px;
+  a {
+    color: var(--color-theme);
+    display: flex;
+    margin-left: 5px;
+  }
+  & a:nth-child(2) {
+    margin-top: 3px;
+  }
+}
+
 footer {
   @include margin-top();
   @include align-center();

data/_sass/_post.scss

@@ -47,7 +47,7 @@ article {
     margin: 1em 0 0 0;
     sub {
       font-family: var(--font-special);
-      color: var(--color-dark);
+      color: var(--color-tertiary);
       font-size: 0.9rem;
     }
     & + h1, & + h2, & + h3, & + h4 {
@@ -103,7 +103,7 @@ samp {
   cursor: pointer;
   &.on {
     filter: none;
-    color: var(--color-secondary);
+    color: var(--color-tertiary);
   }
 }
 

data/assets/site.webmanifest

@@ -50,8 +50,21 @@
     },
     {
       "src": "logo-icon.svg",
-      "type": "image/png",
-      "sizes": "any"
+      "type": "image/svg+xml",
+      "sizes": "any",
+      "purpose": "any"
+    }
+  ],
+  "lang": "en",
+  "display_override": [
+    "standalone",
+    "fullscreen"
+  ],
+  "shortcuts": [
+    {
+      "name": "{{ site.acc.shortcut.name }}",
+      "url": "{{ site.acc.shortcut.url }}",
+      "description": "{{ site.acc.shortcut.desc }}"
     }
   ]
 }

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: askclass-course-theme
 version: !ruby/object:Gem::Version
-  version: 0.5.1
+  version: 0.6.0
 platform: ruby
 authors:
 - AskClass
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2022-10-08 00:00:00.000000000 Z
+date: 2022-10-09 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: jekyll
@@ -43,6 +43,7 @@ files:
 - _includes/head/meta.html
 - _includes/header.html
 - _includes/logo.html
+- _includes/logo_static.html
 - _includes/segment/header.html
 - _includes/segment/index.html
 - _includes/segment/nav.html