@sp-days-framework/create-sp-days 1.0.0

package/templates/page-course/package.json

@@ -0,0 +1,51 @@
+{
+  "name": "<%= projectName %>",
+  "version": "0.0.0",
+  "private": true,
+  "scripts": {
+    "docusaurus": "docusaurus",
+    "start": "docusaurus start",
+    "build": "docusaurus build",
+    "swizzle": "docusaurus swizzle",
+    "deploy": "docusaurus deploy",
+    "clear": "docusaurus clear",
+    "serve": "docusaurus serve",
+    "write-translations": "docusaurus write-translations",
+    "write-heading-ids": "docusaurus write-heading-ids",
+    "typecheck": "tsc"
+  },
+  "dependencies": {
+    "@docusaurus/core": "^3.9.2",
+    "@docusaurus/preset-classic": "^3.9.2",
+    "@docusaurus/theme-mermaid": "^3.9.2",
+    "@mdx-js/react": "^3.0.0",
+    "@sp-days-framework/docusaurus-frontpage-collection": "^1.0.0",
+    "@sp-days-framework/docusaurus-plugin-interactive-tasks": "^1.0.1",
+    "clsx": "^2.0.0",
+    "docusaurus-plugin-sass": "^0.2.6",
+    "prism-react-renderer": "^2.3.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  },
+  "devDependencies": {
+    "@docusaurus/module-type-aliases": "^3.9.2",
+    "@docusaurus/tsconfig": "^3.9.2",
+    "@docusaurus/types": "^3.9.2",
+    "typescript": "~5.6.2"
+  },
+  "browserslist": {
+    "production": [
+      ">0.5%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 3 chrome version",
+      "last 3 firefox version",
+      "last 5 safari version"
+    ]
+  },
+  "engines": {
+    "node": ">=20.0"
+  }
+}

package/templates/page-course/src/css/sp-days-theme.scss

@@ -0,0 +1,297 @@
+/**
+ * Any CSS included here will be global. The classic template
+ * bundles Infima by default. Infima is a CSS framework designed to
+ * work well for content-centric websites.
+ */
+// Import Sass color module
+@use "sass:color";
+
+// Functions to calculate color variations using the modern color.scale approach
+@function lighten-percentage($color, $percentage) {
+    @return color.scale($color, $lightness: $percentage * 1%);
+}
+
+@function darken-percentage($color, $percentage) {
+    @return color.scale($color, $lightness: -$percentage * 1%);
+}
+
+// Define base colors for light and dark themes
+// Light theme colors
+$primary-color-light-theme: #1d63ed;
+$success-color-light-theme: #00a400;
+$info-color-light-theme: #54c7ec;
+$warning-color-light-theme: #ffba00;
+$danger-color-light-theme: #fa383e;
+$secondary-color-light-theme: #ebedf0;
+
+// Dark theme colors
+$primary-color-dark-theme: #6CACE4;
+$success-color-dark-theme: #88e36b;
+$info-color-dark-theme: #5dccf0;
+$warning-color-dark-theme: #ffc93d;
+$danger-color-dark-theme: #ff6369;
+$secondary-color-dark-theme: #afafaf;
+
+// Code syntax highlighting theme
+:root {
+    --docusaurus-highlighted-code-line-bg: rgb(143 142 69 / 11%);
+    // --ifm-code-font-size: 95%;
+}
+
+/* You can override the default Infima variables here. */
+:root {
+    // Primary color and its variations
+    --ifm-color-primary: #{$primary-color-light-theme};
+    --ifm-color-primary-dark: #{darken-percentage($primary-color-light-theme, 5)};
+    --ifm-color-primary-darker: #{darken-percentage($primary-color-light-theme, 10)};
+    --ifm-color-primary-darkest: #{darken-percentage($primary-color-light-theme, 15)};
+    --ifm-color-primary-light: #{lighten-percentage($primary-color-light-theme, 5)};
+    --ifm-color-primary-lighter: #{lighten-percentage($primary-color-light-theme, 10)};
+    --ifm-color-primary-lightest: #{lighten-percentage($primary-color-light-theme, 30)};
+    --ifm-color-primary-contrast-background: #{lighten-percentage($primary-color-light-theme, 95)};
+    --ifm-color-primary-contrast-foreground: #{darken-percentage($primary-color-light-theme, 95)};
+
+    // // Secondary color and its variations
+    // --ifm-color-secondary: #{$secondary-color-light-theme};
+    // --ifm-color-secondary-dark: #{darken-percentage($secondary-color-light-theme, 5)};
+    // --ifm-color-secondary-darker: #{darken-percentage($secondary-color-light-theme, 10)};
+    // --ifm-color-secondary-darkest: #{darken-percentage($secondary-color-light-theme, 15)};
+    // --ifm-color-secondary-light: #{lighten-percentage($secondary-color-light-theme, 5)};
+    // --ifm-color-secondary-lighter: #{lighten-percentage($secondary-color-light-theme, 10)};
+    // --ifm-color-secondary-lightest: #{lighten-percentage($secondary-color-light-theme, 15)};
+    // --ifm-color-secondary-contrast-background: #{lighten-percentage($secondary-color-light-theme, 95)};
+    // --ifm-color-secondary-contrast-foreground: #{darken-percentage($secondary-color-light-theme, 95)};
+
+    // Success color and its variations
+    --ifm-color-success: #{$success-color-light-theme};
+    --ifm-color-success-dark: #{darken-percentage($success-color-light-theme, 5)};
+    --ifm-color-success-darker: #{darken-percentage($success-color-light-theme, 10)};
+    --ifm-color-success-darkest: #{darken-percentage($success-color-light-theme, 15)};
+    --ifm-color-success-light: #{lighten-percentage($success-color-light-theme, 10)};
+    --ifm-color-success-lighter: #{lighten-percentage($success-color-light-theme, 20)};
+    --ifm-color-success-lightest: #{lighten-percentage($success-color-light-theme, 30)};
+    --ifm-color-success-contrast-background: #{lighten-percentage($success-color-light-theme, 95)};
+    --ifm-color-success-contrast-foreground: #{darken-percentage($success-color-light-theme, 95)};
+    
+    // Info color and its variations
+    --ifm-color-info: #{$info-color-light-theme};
+    --ifm-color-info-dark: #{darken-percentage($info-color-light-theme, 5)};
+    --ifm-color-info-darker: #{darken-percentage($info-color-light-theme, 10)};
+    --ifm-color-info-darkest: #{darken-percentage($info-color-light-theme, 15)};
+    --ifm-color-info-light: #{lighten-percentage($info-color-light-theme, 5)};
+    --ifm-color-info-lighter: #{lighten-percentage($info-color-light-theme, 10)};
+    --ifm-color-info-lightest: #{lighten-percentage($info-color-light-theme, 20)};
+    --ifm-color-info-contrast-background: #{lighten-percentage($info-color-light-theme, 95)};
+    --ifm-color-info-contrast-foreground: #{darken-percentage($info-color-light-theme, 95)};
+    
+    // Warning color and its variations
+    --ifm-color-warning: #{$warning-color-light-theme};
+    --ifm-color-warning-dark: #{darken-percentage($warning-color-light-theme, 5)};
+    --ifm-color-warning-darker: #{darken-percentage($warning-color-light-theme, 10)};
+    --ifm-color-warning-darkest: #{darken-percentage($warning-color-light-theme, 15)};
+    --ifm-color-warning-light: #{lighten-percentage($warning-color-light-theme, 5)};
+    --ifm-color-warning-lighter: #{lighten-percentage($warning-color-light-theme, 10)};
+    --ifm-color-warning-lightest: #{lighten-percentage($warning-color-light-theme, 20)};
+    --ifm-color-warning-contrast-background: #{lighten-percentage($warning-color-light-theme, 95)};
+    --ifm-color-warning-contrast-foreground: #{darken-percentage($warning-color-light-theme, 95)};
+    
+    // Danger color and its variations
+    --ifm-color-danger: #{$danger-color-light-theme};
+    --ifm-color-danger-dark: #{darken-percentage($danger-color-light-theme, 5)};
+    --ifm-color-danger-darker: #{darken-percentage($danger-color-light-theme, 10)};
+    --ifm-color-danger-darkest: #{darken-percentage($danger-color-light-theme, 15)};
+    --ifm-color-danger-light: #{lighten-percentage($danger-color-light-theme, 5)};
+    --ifm-color-danger-lighter: #{lighten-percentage($danger-color-light-theme, 10)};
+    --ifm-color-danger-lightest: #{lighten-percentage($danger-color-light-theme, 20)};
+    --ifm-color-danger-contrast-background: #{lighten-percentage($danger-color-light-theme, 95)};
+    --ifm-color-danger-contrast-foreground: #{darken-percentage($danger-color-light-theme, 95)};
+}
+
+/* For readability concerns, you should choose a lighter palette in dark mode. */
+[data-theme='dark'] {
+    // Primary color and its variations for dark mode
+    --ifm-color-primary: #{$primary-color-dark-theme};
+    --ifm-color-primary-dark: #{darken-percentage($primary-color-dark-theme, 10)};
+    --ifm-color-primary-darker: #{darken-percentage($primary-color-dark-theme, 15)};
+    --ifm-color-primary-darkest: #{darken-percentage($primary-color-dark-theme, 30)};
+    --ifm-color-primary-light: #{lighten-percentage($primary-color-dark-theme, 10)};
+    --ifm-color-primary-lighter: #{lighten-percentage($primary-color-dark-theme, 15)};
+    --ifm-color-primary-lightest: #{lighten-percentage($primary-color-dark-theme, 30)};
+    --ifm-color-primary-contrast-background: #{darken-percentage($primary-color-dark-theme, 90)};
+    --ifm-color-primary-contrast-foreground: #{lighten-percentage($primary-color-dark-theme, 90)};
+
+    // Secondary color and its variations
+    --ifm-color-secondary: #{$secondary-color-dark-theme};
+    --ifm-color-secondary-dark: #{darken-percentage($secondary-color-dark-theme, 5)};
+    --ifm-color-secondary-darker: #{darken-percentage($secondary-color-dark-theme, 10)};
+    --ifm-color-secondary-darkest: #{darken-percentage($secondary-color-dark-theme, 15)};
+    --ifm-color-secondary-light: #{lighten-percentage($secondary-color-dark-theme, 5)};
+    --ifm-color-secondary-lighter: #{lighten-percentage($secondary-color-dark-theme, 10)};
+    --ifm-color-secondary-lightest: #{lighten-percentage($secondary-color-dark-theme, 15)};
+    --ifm-color-secondary-contrast-background: #{darken-percentage($secondary-color-dark-theme, 90)};
+    --ifm-color-secondary-contrast-foreground: #{lighten-percentage($secondary-color-dark-theme, 90)};
+
+    // Success color for dark mode
+    --ifm-color-success: #{$success-color-dark-theme};
+    --ifm-color-success-dark: #{darken-percentage($success-color-dark-theme, 10)};
+    --ifm-color-success-darker: #{darken-percentage($success-color-dark-theme, 15)};
+    --ifm-color-success-darkest: #{darken-percentage($success-color-dark-theme, 35)};
+    --ifm-color-success-light: #{lighten-percentage($success-color-dark-theme, 10)};
+    --ifm-color-success-lighter: #{lighten-percentage($success-color-dark-theme, 15)};
+    --ifm-color-success-lightest: #{lighten-percentage($success-color-dark-theme, 30)};
+    --ifm-color-success-contrast-background: #{darken-percentage($success-color-dark-theme, 90)};
+    --ifm-color-success-contrast-foreground: #{lighten-percentage($success-color-dark-theme, 90)};
+    
+    // Info color and its variations
+    --ifm-color-info: #{$info-color-dark-theme};
+    --ifm-color-info-dark: #{darken-percentage($info-color-dark-theme, 10)};
+    --ifm-color-info-darker: #{darken-percentage($info-color-dark-theme, 15)};
+    --ifm-color-info-darkest: #{darken-percentage($info-color-dark-theme, 30)};
+    --ifm-color-info-light: #{lighten-percentage($info-color-dark-theme, 10)};
+    --ifm-color-info-lighter: #{lighten-percentage($info-color-dark-theme, 15)};
+    --ifm-color-info-lightest: #{lighten-percentage($info-color-dark-theme, 30)};
+    --ifm-color-info-contrast-background: #{darken-percentage($info-color-dark-theme, 90)};
+    --ifm-color-info-contrast-foreground: #{lighten-percentage($info-color-dark-theme, 90)};
+    
+    // Warning color and its variations
+    --ifm-color-warning: #{$warning-color-dark-theme};
+    --ifm-color-warning-dark: #{darken-percentage($warning-color-dark-theme, 10)};
+    --ifm-color-warning-darker: #{darken-percentage($warning-color-dark-theme, 15)};
+    --ifm-color-warning-darkest: #{darken-percentage($warning-color-dark-theme, 30)};
+    --ifm-color-warning-light: #{lighten-percentage($warning-color-dark-theme, 10)};
+    --ifm-color-warning-lighter: #{lighten-percentage($warning-color-dark-theme, 15)};
+    --ifm-color-warning-lightest: #{lighten-percentage($warning-color-dark-theme, 30)};
+    --ifm-color-warning-contrast-background: #{darken-percentage($warning-color-dark-theme, 90)};
+    --ifm-color-warning-contrast-foreground: #{lighten-percentage($warning-color-dark-theme, 90)};
+    
+    // Danger color and its variations
+    --ifm-color-danger: #{$danger-color-dark-theme};
+    --ifm-color-danger-dark: #{darken-percentage($danger-color-dark-theme, 10)};
+    --ifm-color-danger-darker: #{darken-percentage($danger-color-dark-theme, 15)};
+    --ifm-color-danger-darkest: #{darken-percentage($danger-color-dark-theme, 30)};
+    --ifm-color-danger-light: #{lighten-percentage($danger-color-dark-theme, 10)};
+    --ifm-color-danger-lighter: #{lighten-percentage($danger-color-dark-theme, 15)};
+    --ifm-color-danger-lightest: #{lighten-percentage($danger-color-dark-theme, 30)};
+    --ifm-color-danger-contrast-background: #{darken-percentage($danger-color-dark-theme, 90)};
+    --ifm-color-danger-contrast-foreground: #{lighten-percentage($danger-color-dark-theme, 90)};
+}
+
+.navbar-github-link::before {
+  content: '';
+  width: 24px;
+  height: 24px;
+  display: flex;
+  background-color: var(--ifm-navbar-link-color);
+  mask-image: url(../../static/img/favicon-navbar/github.svg);
+}
+
+// Custom styles for resource landing page
+.resourceLandingPage {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    margin: 0 80px;
+    width: min-content;
+}
+
+// Styles for preview components
+.preview {
+    position: relative;
+    margin-top: 2rem;
+    // margin-bottom: 2rem;
+    display: flex;
+    justify-content: center;
+
+    &::before {
+        content: 'Preview';
+        position: absolute;
+        top: -0.75rem;
+        left: 50%;
+        transform: translateX(-50%);
+        padding: 0 0.5rem; 
+        background-color: var(--ifm-background-surface-color);
+        font-size: 0.875rem;
+        font-weight: 500;
+        color: var(--ifm-color-emphasis-700);
+        z-index: 1;
+    }
+
+    .container {
+        border: 1px solid var(--ifm-color-emphasis-300);
+        border-radius: 8px;
+        // padding-bottom: 1.5rem;
+        padding-top: 1.5rem;
+        width: fit-content;
+        position: relative;
+    }
+}
+
+[data-theme='dark'] {
+    .preview {
+        &::before {
+            background-color: var(--ifm-background-color);
+        }
+    }
+}
+
+// Sidebar logo styles
+$sidebar-logo-icon-size: 20px;
+
+@mixin sidebar-logo-link {
+    display: flex;
+    align-items: center;
+    gap: 8px;
+    width: 100%;
+    min-width: 0;
+
+    &::before {
+        content: '';
+        display: inline-block;
+        width: $sidebar-logo-icon-size;
+        height: $sidebar-logo-icon-size;
+        background-image: var(--sidebar-logo-image, none);
+        background-size: contain;
+        background-repeat: no-repeat;
+        background-position: center;
+        flex-shrink: 0;
+    }
+}
+
+.sidebar-logo,
+[class*='sidebar-logo-'] {
+    // Only target the immediate menu link for the matching item, not its children
+    > .menu__link,
+    > .menu__list-item-collapsible > .menu__link,
+    > .menu__list-item-collapsible > a,
+    > div > a {
+        @include sidebar-logo-link;
+    }
+}
+
+.sidebar-logo-slidev {
+    --sidebar-logo-image: url(../../static/img/sidebar/slidev.svg);
+}
+
+.sidebar-logo-docusaurus {
+    --sidebar-logo-image: url(../../static/img/sidebar/docusaurus.svg);
+}
+
+.sidebar-logo-sp-days {
+    --sidebar-logo-image: url(../../static/img/sp-days-logo-color-light.svg);
+}
+
+[data-theme='dark'] {
+    .sidebar-logo-sp-days {
+        --sidebar-logo-image: url(../../static/img/sp-days-logo-color-dark.svg);
+    }
+}
+
+.sidebar-logo-sp-days-plugin {
+    --sidebar-logo-image: url(../../static/img/sp-days-plugin-color-light.svg);
+}
+
+[data-theme='dark'] {
+    .sidebar-logo-sp-days-plugin {
+        --sidebar-logo-image: url(../../static/img/sp-days-plugin-color-dark.svg);
+    }
+}

package/templates/page-course/src/pages/index.mdx

@@ -0,0 +1,165 @@
+---
+title: Course Home
+description: Learn with our interactive course
+hide_table_of_contents: true
+---
+
+import TaskPlaceholder from '@theme/TaskPlaceholder';
+import Text from '@theme/Task/Text';
+import Hint from '@theme/Task/Hint';
+import Solution from '@theme/Task/Solution';
+import {
+  HeroBanner,
+  FancyHeader,
+  CourseFeature,
+  Included,
+  NotIncluded,
+  IconContainersSection,
+  IconContainerBlock,
+  GetStarted,
+  Explore,
+  ExploreItem,
+  Columns,
+  Left,
+  Right,
+  Block,
+} from "@sp-days-framework/docusaurus-frontpage-collection";
+
+<HeroBanner
+  bannerText="Your Course Title Here"
+  customSvg={{
+    light: "img/sp-days-logo-color-light.svg",
+    dark: "img/sp-days-logo-color-dark.svg",
+  }}
+/>
+
+<FancyHeader>What You'll Learn</FancyHeader>
+
+<CourseFeature>
+  <Included>
+    - **First Topic**: Brief description of the first main learning outcome
+    - **Second Topic**: Brief description of the second main learning outcome
+    - **Third Topic**: Brief description of the third main learning outcome
+  </Included>
+  <NotIncluded>
+    - **Out of Scope Topic 1**: Explain why this isn't covered
+    - **Out of Scope Topic 2**: Explain why this isn't covered
+    - **Out of Scope Topic 3**: Explain why this isn't covered
+  </NotIncluded>
+</CourseFeature>
+
+<FancyHeader as="h2">Prerequisites</FancyHeader>
+
+<IconContainersSection>
+  <IconContainerBlock
+    title="Prerequisite 1"
+    iconify="mdi:laptop"
+    link="/course"
+  />
+  <IconContainerBlock
+    title="Prerequisite 2"
+    iconify="mdi:code-tags"
+    link="/course"
+  />
+  <IconContainerBlock
+    title="Prerequisite 3"
+    iconify="mdi:database"
+    link="/course"
+  />
+  <IconContainerBlock
+    title="Prerequisite 4"
+    iconify="mdi:cloud"
+    link="/course"
+  />
+</IconContainersSection>
+
+<FancyHeader as="h2">Course Structure</FancyHeader>
+
+<Columns leftRatio="40">
+  <Left>
+    <Block>
+      ## Self-Study
+      
+      - **Duration**: X hours
+      - **Modules**: Y modules
+      - **Hands-on Labs**: Z exercises
+    </Block>
+    <Block>
+      ## With Instructor
+
+      - **Duration**: X days
+      - **Schedule**: Day by day breakdown
+      - **Format**: In-person/Virtual/Hybrid
+    </Block>
+  </Left>
+  <Right>
+    <TaskPlaceholder title="Sample Task Title">
+      <Text>
+        Replace this text with your task description.
+
+        **Task Objective:**
+        Explain what the learner should accomplish.
+
+        **Steps:**
+        1. First step description
+        2. Second step description
+        3. Third step description
+
+        **Expected Outcome:**
+        Describe what success looks like.
+      </Text>
+      <Hint>
+        Provide helpful hints here to guide learners without giving away the solution.
+        
+        - Hint 1: Point them in the right direction
+        - Hint 2: Reference relevant documentation or concepts
+        - Hint 3: Suggest tools or approaches to try
+      </Hint>
+      <Solution>
+        Provide the complete solution here.
+        
+        ```language
+        // Include code examples with proper syntax highlighting
+        // Explain each important part
+        ```
+        
+        **Explanation:**
+        Walk through the solution step by step.
+      </Solution>
+    </TaskPlaceholder>
+  </Right>
+</Columns>
+
+<GetStarted buttonText="Get Started" buttonLink="/course">
+  ## Ready to Begin?
+  
+  Start your learning journey today with our comprehensive course materials.
+  
+  <Explore>
+    <ExploreItem
+      title="Interactive Tasks"
+      iconify="ci:window-check"
+      link="/course"
+    >
+      Access all course modules and lessons
+    </ExploreItem>
+    // CONDITIONAL: addon-resources (START)
+    <ExploreItem
+      title="Resources"
+      iconify="mdi:book-open-variant"
+      link="/resources"
+    >
+      Additional learning materials and references
+    </ExploreItem>
+    // CONDITIONAL: addon-resources (END)
+    // CONDITIONAL: addon-slidev (START)
+    <ExploreItem
+      title="Presentations"
+      iconify="mdi:television-play"
+      link="/slidev"
+    >
+      View presentation slides and notes
+    </ExploreItem>
+    // CONDITIONAL: addon-slidev (END)
+  </Explore>
+</GetStarted>

package/templates/page-course/static/img/favicon-navbar/github.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
+	<path fill="currentColor" fill-rule="evenodd" d="M12.026 2c-5.509 0-9.974 4.465-9.974 9.974c0 4.406 2.857 8.145 6.821 9.465c.499.09.679-.217.679-.481c0-.237-.008-.865-.011-1.696c-2.775.602-3.361-1.338-3.361-1.338c-.452-1.152-1.107-1.459-1.107-1.459c-.905-.619.069-.605.069-.605c1.002.07 1.527 1.028 1.527 1.028c.89 1.524 2.336 1.084 2.902.829c.091-.645.351-1.085.635-1.334c-2.214-.251-4.542-1.107-4.542-4.93c0-1.087.389-1.979 1.024-2.675c-.101-.253-.446-1.268.099-2.64c0 0 .837-.269 2.742 1.021a9.6 9.6 0 0 1 2.496-.336a9.6 9.6 0 0 1 2.496.336c1.906-1.291 2.742-1.021 2.742-1.021c.545 1.372.203 2.387.099 2.64c.64.696 1.024 1.587 1.024 2.675c0 3.833-2.33 4.675-4.552 4.922c.355.308.675.916.675 1.846c0 1.334-.012 2.41-.012 2.737c0 .267.178.577.687.479C19.146 20.115 22 16.379 22 11.974C22 6.465 17.535 2 12.026 2" clip-rule="evenodd" />
+</svg>

package/templates/page-course/static/img/favicon-navbar/sorost-logo-dark.svg

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 27.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 73.5 73.5" style="enable-background:new 0 0 73.5 73.5;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#6AB1E2;}
+	.st1{fill:#FFFFFF;}
+</style>
+<g transform="translate(34.37 48.337)">
+	<path class="st0" d="M11.5-39.3c0,5-4.1,9.1-9.1,9.1s-9.1-4.1-9.1-9.1c0-5,4.1-9.1,9.1-9.1S11.5-44.3,11.5-39.3"/>
+</g>
+<g transform="translate(34.37 27.588)">
+	<path class="st0" d="M11.5,9.1c0,5-4.1,9.1-9.1,9.1s-9.1-4.1-9.1-9.1c0-5,4.1-9.1,9.1-9.1S11.5,4.1,11.5,9.1"/>
+</g>
+<g transform="translate(13.602 27.588)">
+	<path class="st0" d="M4.5,9.1c0,5-4.1,9.1-9.1,9.1c-5,0-9.1-4.1-9.1-9.1c0-5,4.1-9.1,9.1-9.1C0.5,0.1,4.5,4.1,4.5,9.1"/>
+</g>
+<g transform="translate(55.147 27.588)">
+	<path class="st1" d="M18.4,9.1c0,5-4.1,9.1-9.1,9.1s-9.1-4.1-9.1-9.1c0-5,4.1-9.1,9.1-9.1S18.4,4.1,18.4,9.1"/>
+</g>
+<g transform="translate(34.37 6.8015)">
+	<path class="st1" d="M11.5,57.6c0,5-4.1,9.1-9.1,9.1s-9.1-4.1-9.1-9.1c0-5,4.1-9.1,9.1-9.1S11.5,52.6,11.5,57.6"/>
+</g>
+</svg>

package/templates/page-course/static/img/favicon-navbar/sorost-logo-light.svg

@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 27.0.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 73.5 73.5" style="enable-background:new 0 0 73.5 73.5;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#6CACE4;}
+	.st1{fill:#003087;}
+</style>
+<g transform="translate(34.37 48.337)">
+	<path class="st0" d="M11.5-39.3c0,5-4.1,9.1-9.1,9.1s-9.1-4.1-9.1-9.1c0-5,4.1-9.1,9.1-9.1S11.5-44.3,11.5-39.3"/>
+</g>
+<g transform="translate(34.37 27.588)">
+	<path class="st0" d="M11.5,9.1c0,5-4.1,9.1-9.1,9.1s-9.1-4.1-9.1-9.1c0-5,4.1-9.1,9.1-9.1S11.5,4.1,11.5,9.1"/>
+</g>
+<g transform="translate(13.602 27.588)">
+	<path class="st0" d="M4.5,9.1c0,5-4.1,9.1-9.1,9.1c-5,0-9.1-4.1-9.1-9.1c0-5,4.1-9.1,9.1-9.1C0.5,0.1,4.5,4.1,4.5,9.1"/>
+</g>
+<g transform="translate(55.147 27.588)">
+	<path class="st1" d="M18.4,9.1c0,5-4.1,9.1-9.1,9.1s-9.1-4.1-9.1-9.1c0-5,4.1-9.1,9.1-9.1S18.4,4.1,18.4,9.1"/>
+</g>
+<g transform="translate(34.37 6.8015)">
+	<path class="st1" d="M11.5,57.6c0,5-4.1,9.1-9.1,9.1s-9.1-4.1-9.1-9.1c0-5,4.1-9.1,9.1-9.1S11.5,52.6,11.5,57.6"/>
+</g>
+</svg>

package/templates/page-course/static/img/footer/sykehuspartner-dark.svg

@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 314.2 58">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #ffffffff;
+      }
+
+      .cls-1, .cls-2 {
+        stroke-width: 0px;
+      }
+
+      .cls-2 {
+        fill: #6cace4;
+      }
+    </style>
+  </defs>
+  <path class="cls-2" d="M36.2,7.2c0,4-3.2,7.2-7.2,7.2s-7.2-3.2-7.2-7.2S25,0,29,0s7.2,3.2,7.2,7.2Z"/>
+  <path class="cls-2" d="M36.2,29c0,3.9-3.2,7.2-7.2,7.2s-7.2-3.2-7.2-7.2,3.2-7.2,7.2-7.2,7.2,3.2,7.2,7.2Z"/>
+  <path class="cls-2" d="M14.3,29c0,3.9-3.2,7.2-7.2,7.2s-7.2-3.2-7.2-7.2,3.2-7.2,7.2-7.2,7.2,3.2,7.2,7.2Z"/>
+  <path class="cls-1" d="M58,29c0,3.9-3.2,7.2-7.2,7.2s-7.2-3.2-7.2-7.2,3.2-7.2,7.2-7.2,7.2,3.2,7.2,7.2Z"/>
+  <path class="cls-1" d="M36.2,50.8c0,3.9-3.2,7.2-7.2,7.2s-7.2-3.2-7.2-7.2,3.2-7.2,7.2-7.2,7.2,3.2,7.2,7.2Z"/>
+  <path class="cls-1" d="M83.7,21.4c-2.1-.9-3.7-1.4-5-1.4s-2.8.7-2.8,1.8.5,1.3,1.8,2.1c3,1.6,4.9,2.8,5.8,3.7.8.8,1.3,2.1,1.3,3.5,0,3.5-2.5,5.5-6.8,5.5s-1.2,0-1.7-.1c-1.4-.2-2-.4-4-1.3l-1.3-.6,1.6-3.4c1.4.8,2,1.1,2.8,1.3,1,.4,2,.6,2.8.6,1.7,0,2.8-.8,2.8-1.9s-.4-1.4-1.7-2.1l-3-1.7c-3.4-2-4.5-3.3-4.5-5.4s.3-2,.8-2.7c.3-.5.8-1,1.4-1.4,1.4-1,2.6-1.3,4.9-1.3s2.4.1,3.6.5c.9.3,1.5.5,2.8,1.1l-1.5,3.3Z"/>
+  <path class="cls-1" d="M95.7,27.8v8.3h-3.7v-8.3l-5.9-11.1h4l3.9,7.6,4.1-7.6h4l-6.5,11.1Z"/>
+  <path class="cls-1" d="M114.8,36.1l-6.5-9.2v9.2h-3.7v-19.4h3.7v9l6.1-9h4.3l-6.7,9.4,7,9.9h-4.2Z"/>
+  <path class="cls-1" d="M121.6,36.1v-19.4h11.8v3.1h-8.1v4.8h6.6v3.1h-6.6v5.2h8.5v3.1h-12.2Z"/>
+  <path class="cls-1" d="M151,36.1v-8.3h-9.9v8.3h-3.7v-19.4h3.7v7.7h9.9v-7.7h3.7v19.4h-3.7Z"/>
+  <path class="cls-1" d="M173.1,35.1c-1.4,1-3.1,1.4-5.5,1.4s-4-.4-5.5-1.4c-2-1.4-2.6-3-2.6-6.5v-11.8h3.7v12c0,2.9,1.5,4.3,4.6,4.3s4.3-1.5,4.3-4.3v-12h3.7v11.8c0,3.6-.6,5.1-2.7,6.5Z"/>
+  <path class="cls-1" d="M191.3,21.4c-2.1-.9-3.7-1.4-5-1.4s-2.8.7-2.8,1.8.5,1.3,1.8,2.1c3,1.6,4.9,2.8,5.8,3.7.8.8,1.3,2.1,1.3,3.5,0,3.5-2.5,5.5-6.8,5.5s-1.2,0-1.7-.1c-1.4-.2-2-.4-4-1.3l-1.3-.6,1.6-3.4c1.4.8,2,1.1,2.8,1.3,1,.4,2,.6,2.8.6,1.7,0,2.8-.8,2.8-1.9s-.4-1.4-1.7-2.1l-3-1.7c-3.4-2-4.5-3.3-4.5-5.4s.3-2,.8-2.7c.3-.5.8-1,1.4-1.4,1.4-1,2.6-1.3,4.9-1.3s2.4.1,3.6.5c.9.3,1.5.5,2.8,1.1l-1.5,3.3Z"/>
+  <path class="cls-1" d="M202.5,19.9h-2.6v6.5h.9c.4,0,.7,0,.8,0,2.9,0,4.1-1.1,4.1-3.4s-1-3.1-3.3-3.1ZM207.4,27.9c-1.4,1.2-3.1,1.7-5.7,1.7s-1.1,0-1.8,0v6.6h-3.7v-19.4h6.6c2.5,0,3.9.4,5.1,1.6,1.1,1.1,1.6,2.6,1.6,4.3s-.8,4-2.2,5.2Z"/>
+  <path class="cls-1" d="M218.3,21.2l-2.2,7h4.5l-2.3-7ZM223.1,36.1l-1.5-4.8h-6.5l-1.6,4.8h-3.9l7-19.4h3.3l7,19.4h-3.9Z"/>
+  <path class="cls-1" d="M235.8,19.9h-2.4v5.3h2.4c2.3,0,3.4-.8,3.4-2.8s-1-2.6-3.4-2.6ZM239.7,36.1l-4.4-7.7h-1.8v7.7h-3.7v-19.4h6.5c2.8,0,4.1.4,5.3,1.4,1.1,1,1.6,2.4,1.6,4.2s-.4,2.7-1.1,3.6c-.7.9-1.4,1.3-3,1.8l4.8,8.3h-4Z"/>
+  <path class="cls-1" d="M253.3,19.9v16.2h-3.7v-16.2h-5.8v-3.1h15.3v3.1h-5.8Z"/>
+  <path class="cls-1" d="M275,36.3l-8.3-12.5-.6-1.2c-.1-.2-.2-.4-.3-.7v14.2h-3.5v-19.4h4.3l7.8,12.3c.6.9.8,1.5,1,2.1v-14.4h3.5v19.5h-3.9Z"/>
+  <path class="cls-1" d="M284.3,36.1v-19.4h11.8v3.1h-8.1v4.8h6.6v3.1h-6.6v5.2h8.5v3.1h-12.2Z"/>
+  <path class="cls-1" d="M306.2,19.9h-2.4v5.3h2.4c2.3,0,3.4-.8,3.4-2.8s-1-2.6-3.4-2.6ZM310.1,36.1l-4.4-7.7h-1.8v7.7h-3.7v-19.4h6.5c2.8,0,4.1.4,5.3,1.4,1.1,1,1.6,2.4,1.6,4.2s-.4,2.7-1.1,3.6c-.7.9-1.4,1.3-3,1.8l4.8,8.3h-4Z"/>
+</svg>

package/templates/page-course/static/img/footer/sykehuspartner-light.svg

@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 314.2 58">
+  <defs>
+    <style>
+      .cls-1 {
+        fill: #003087;
+      }
+
+      .cls-1, .cls-2 {
+        stroke-width: 0px;
+      }
+
+      .cls-2 {
+        fill: #6cace4;
+      }
+    </style>
+  </defs>
+  <path class="cls-2" d="M36.2,7.2c0,4-3.2,7.2-7.2,7.2s-7.2-3.2-7.2-7.2S25,0,29,0s7.2,3.2,7.2,7.2Z"/>
+  <path class="cls-2" d="M36.2,29c0,3.9-3.2,7.2-7.2,7.2s-7.2-3.2-7.2-7.2,3.2-7.2,7.2-7.2,7.2,3.2,7.2,7.2Z"/>
+  <path class="cls-2" d="M14.3,29c0,3.9-3.2,7.2-7.2,7.2s-7.2-3.2-7.2-7.2,3.2-7.2,7.2-7.2,7.2,3.2,7.2,7.2Z"/>
+  <path class="cls-1" d="M58,29c0,3.9-3.2,7.2-7.2,7.2s-7.2-3.2-7.2-7.2,3.2-7.2,7.2-7.2,7.2,3.2,7.2,7.2Z"/>
+  <path class="cls-1" d="M36.2,50.8c0,3.9-3.2,7.2-7.2,7.2s-7.2-3.2-7.2-7.2,3.2-7.2,7.2-7.2,7.2,3.2,7.2,7.2Z"/>
+  <path class="cls-1" d="M83.7,21.4c-2.1-.9-3.7-1.4-5-1.4s-2.8.7-2.8,1.8.5,1.3,1.8,2.1c3,1.6,4.9,2.8,5.8,3.7.8.8,1.3,2.1,1.3,3.5,0,3.5-2.5,5.5-6.8,5.5s-1.2,0-1.7-.1c-1.4-.2-2-.4-4-1.3l-1.3-.6,1.6-3.4c1.4.8,2,1.1,2.8,1.3,1,.4,2,.6,2.8.6,1.7,0,2.8-.8,2.8-1.9s-.4-1.4-1.7-2.1l-3-1.7c-3.4-2-4.5-3.3-4.5-5.4s.3-2,.8-2.7c.3-.5.8-1,1.4-1.4,1.4-1,2.6-1.3,4.9-1.3s2.4.1,3.6.5c.9.3,1.5.5,2.8,1.1l-1.5,3.3Z"/>
+  <path class="cls-1" d="M95.7,27.8v8.3h-3.7v-8.3l-5.9-11.1h4l3.9,7.6,4.1-7.6h4l-6.5,11.1Z"/>
+  <path class="cls-1" d="M114.8,36.1l-6.5-9.2v9.2h-3.7v-19.4h3.7v9l6.1-9h4.3l-6.7,9.4,7,9.9h-4.2Z"/>
+  <path class="cls-1" d="M121.6,36.1v-19.4h11.8v3.1h-8.1v4.8h6.6v3.1h-6.6v5.2h8.5v3.1h-12.2Z"/>
+  <path class="cls-1" d="M151,36.1v-8.3h-9.9v8.3h-3.7v-19.4h3.7v7.7h9.9v-7.7h3.7v19.4h-3.7Z"/>
+  <path class="cls-1" d="M173.1,35.1c-1.4,1-3.1,1.4-5.5,1.4s-4-.4-5.5-1.4c-2-1.4-2.6-3-2.6-6.5v-11.8h3.7v12c0,2.9,1.5,4.3,4.6,4.3s4.3-1.5,4.3-4.3v-12h3.7v11.8c0,3.6-.6,5.1-2.7,6.5Z"/>
+  <path class="cls-1" d="M191.3,21.4c-2.1-.9-3.7-1.4-5-1.4s-2.8.7-2.8,1.8.5,1.3,1.8,2.1c3,1.6,4.9,2.8,5.8,3.7.8.8,1.3,2.1,1.3,3.5,0,3.5-2.5,5.5-6.8,5.5s-1.2,0-1.7-.1c-1.4-.2-2-.4-4-1.3l-1.3-.6,1.6-3.4c1.4.8,2,1.1,2.8,1.3,1,.4,2,.6,2.8.6,1.7,0,2.8-.8,2.8-1.9s-.4-1.4-1.7-2.1l-3-1.7c-3.4-2-4.5-3.3-4.5-5.4s.3-2,.8-2.7c.3-.5.8-1,1.4-1.4,1.4-1,2.6-1.3,4.9-1.3s2.4.1,3.6.5c.9.3,1.5.5,2.8,1.1l-1.5,3.3Z"/>
+  <path class="cls-1" d="M202.5,19.9h-2.6v6.5h.9c.4,0,.7,0,.8,0,2.9,0,4.1-1.1,4.1-3.4s-1-3.1-3.3-3.1ZM207.4,27.9c-1.4,1.2-3.1,1.7-5.7,1.7s-1.1,0-1.8,0v6.6h-3.7v-19.4h6.6c2.5,0,3.9.4,5.1,1.6,1.1,1.1,1.6,2.6,1.6,4.3s-.8,4-2.2,5.2Z"/>
+  <path class="cls-1" d="M218.3,21.2l-2.2,7h4.5l-2.3-7ZM223.1,36.1l-1.5-4.8h-6.5l-1.6,4.8h-3.9l7-19.4h3.3l7,19.4h-3.9Z"/>
+  <path class="cls-1" d="M235.8,19.9h-2.4v5.3h2.4c2.3,0,3.4-.8,3.4-2.8s-1-2.6-3.4-2.6ZM239.7,36.1l-4.4-7.7h-1.8v7.7h-3.7v-19.4h6.5c2.8,0,4.1.4,5.3,1.4,1.1,1,1.6,2.4,1.6,4.2s-.4,2.7-1.1,3.6c-.7.9-1.4,1.3-3,1.8l4.8,8.3h-4Z"/>
+  <path class="cls-1" d="M253.3,19.9v16.2h-3.7v-16.2h-5.8v-3.1h15.3v3.1h-5.8Z"/>
+  <path class="cls-1" d="M275,36.3l-8.3-12.5-.6-1.2c-.1-.2-.2-.4-.3-.7v14.2h-3.5v-19.4h4.3l7.8,12.3c.6.9.8,1.5,1,2.1v-14.4h3.5v19.5h-3.9Z"/>
+  <path class="cls-1" d="M284.3,36.1v-19.4h11.8v3.1h-8.1v4.8h6.6v3.1h-6.6v5.2h8.5v3.1h-12.2Z"/>
+  <path class="cls-1" d="M306.2,19.9h-2.4v5.3h2.4c2.3,0,3.4-.8,3.4-2.8s-1-2.6-3.4-2.6ZM310.1,36.1l-4.4-7.7h-1.8v7.7h-3.7v-19.4h6.5c2.8,0,4.1.4,5.3,1.4,1.1,1,1.6,2.4,1.6,4.2s-.4,2.7-1.1,3.6c-.7.9-1.4,1.3-3,1.8l4.8,8.3h-4Z"/>
+</svg>