npm - @pimaonline/pimaonline-themepack - Versions diffs - 2.1.5 - Mend

@pimaonline/pimaonline-themepack 2.1.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (117) hide show

package/dist/plugins/preview-banner/preview-banner.css ADDED Viewed

@@ -0,0 +1,126 @@
+@charset "UTF-8";
+/* CSS Document */
+.header img {
+	border-bottom: 3px solid rgba(4,85,148,1);
+	width: 100%;
+}
+@media screen and (min-width:730px) {
+	.header img {
+		width: 100%;
+	}
+}
+.header{
+  position: relative;
+}
+.header .text-container {
+	background: rgba(4,85,148,.7);
+	padding: 1% 0;;
+	width: 100%;
+	z-index: 2;
+	background-image: url("data:image/svg+xml,%3Csvg width='6' height='6' viewBox='0 0 6 6' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='rgba(4,85,148,1)' fill-opacity='0.4' fill-rule='evenodd'%3E%3Cpath d='M5 0h1L0 6V5zM6 5v1H5z'/%3E%3C/g%3E%3C/svg%3E");
+}
+@media screen and (min-width: 730px) {
+	.header .text-container {
+		width: 100%;
+	}
+}
+@media screen and (min-width: 1048px) {
+	.header .text-container {
+		position: absolute;
+		left: 50%;
+  	top: 70%;
+		padding: 1% 0;
+		transform: translate(-50%, -50%)
+	}
+}
+.header .text-container h1,
+.header .text-container h2,
+.header .text-container h3,
+.header .text-container h4,
+.header .text-container p {
+	color: rgba(255,255,255,1);
+	padding-left: 1%;
+}
+@media screen and (min-width:730px) {
+	.header .text-container h1,
+	.header .text-container h2,
+	.header .text-container h3,
+	.header .text-container h4,
+	.header .text-container p {
+		padding: 0 1% 0 3%;
+	}
+}
+@media screen and (min-width:998px) {
+	.header .text-container h1,
+	.header .text-container h2,
+	.header .text-container h3,
+	.header .text-container h4,
+	.header .text-container p {
+		padding: 0 5% 0 10%;
+	}
+}
+/*/// FONT STYLLES ///*/
+.header .text-container h1,
+.header .text-container h2,
+.header .text-container h3,
+.header .text-container h4 {
+	font-size: 2em;
+	margin: 0 0 5px 0;
+}
+@media screen and (min-width:730px) {
+	.header .text-container h1,
+	.header .text-container h2,
+	.header .text-container h3,
+	.header .text-container h4 {
+		line-height: 1.1;
+	}
+}
+@media screen and (min-width:998px) {
+	.header .text-container h1,
+	.header .text-container h2,
+	.header .text-container h3,
+	.header .text-container h4 {
+		line-height: 1.155;
+	}
+}
+.header .text-container p {
+	margin: 0 0 5px 0;
+	font-size: 1.1em;
+}
+@media screen and (min-width:730px) {
+	.header .text-container p {
+		line-height: 1.155;
+		min-height: 44px;
+	}
+}
+/*Video Container*/
+.video-container {
+  height: 0;
+  margin: 30px 0;
+  overflow: hidden;
+  padding-bottom: 56.25%;
+  padding-top: 35px;
+  position: relative;
+}
+.video-container iframe {
+  height: 100%;
+  left: 0;
+  position: absolute;
+  top: 0;
+  width: 100%;
+}

package/dist/plugins/preview-banner/preview-banner.html ADDED Viewed

@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <script>
+      let parentDoc = window.parent.document;
+      let scriptIsLoaded = parentDoc.head.querySelectorAll("script[src='https://d2l.pima.edu/shared/webdev/course-files/plugins/preview-banner/preview-banner.js']").length > 0;
+      if (!scriptIsLoaded) {
+        let script = parentDoc.createElement("script");
+        script.type = "text/javascript";
+        script.src = "https://d2l.pima.edu/shared/webdev/course-files/plugins/preview-banner/preview-banner.js";
+        parentDoc.head.appendChild(script);
+      }
+    </script>
+  </head>
+  <body></body>
+</html>

package/dist/plugins/preview-banner/preview-banner.js ADDED Viewed

@@ -0,0 +1,57 @@
+// This script uses a forEach loop to place a custom stylesheet into every shadow dom (#shadow-root) component
+window.parent.addEventListener("load", function () {
+  // Find all shadow-dom components and create an array
+  let sRoots = document.querySelectorAll("d2l-html-block");
+  // Loop through the array
+  sRoots.forEach((each) => {
+    // Set the root-element of each shadow-component to a variable
+    let sRoot = each.shadowRoot.querySelector(".d2l-html-block-rendered");
+    // Create link element
+    let link = document.createElement("link");
+    link.type = "text/css";
+    link.rel = "stylesheet";
+    link.href = "https://d2l.pima.edu/shared/webdev/course-files/plugins/preview-banner/preview-banner.css";
+    // Append link element to root element
+    sRoot.append(link);
+  });
+});
+// Click any of the left navigation links to rerun script above.
+// This is done to refresh the CSS inserted into the shadow component
+let refresh = document.querySelectorAll(".d2l-le-TreeAccordionItem-anchor");
+refresh.forEach((each_) => {
+  each_.addEventListener("click", () => {
+    setTimeout(() => {
+      let d2lBlock = document.querySelectorAll("d2l-html-block");
+      // Loop through the array
+      d2lBlock.forEach((_each) => {
+        // Set the root-element of each shadow-component to a variable
+        let innerD2lBlock = _each.shadowRoot.querySelector(".d2l-html-block-rendered");
+        // Create link element
+        let _link = document.createElement("link");
+        _link.type = "text/css";
+        _link.rel = "stylesheet";
+        _link.href = "https://d2l.pima.edu/shared/webdev/course-files/plugins/preview-banner/preview-banner.css";
+        // Append link element to root element
+        innerD2lBlock.append(_link);
+      });
+    }, 1000);
+  })
+});

package/package.json ADDED Viewed

@@ -0,0 +1,44 @@
+{
+  "name": "@pimaonline/pimaonline-themepack",
+  "version": "2.1.5",
+  "description": "A cloud based, course theme-pack for building courses efficiently within the D2L learning environment.",
+  "main": "index.js",
+  "files": [
+    "README.md",
+    "package.json",
+    "/dist/img",
+    "/dist/js",
+    "/dist/plugins",
+    "/dist/css/plugins",
+    "/dist/css/main.css",
+    "/dist/css/routes.css"
+  ],
+  "scripts": {
+    "gulp": "gulp",
+    "copy-assets": "gulp copy-js && gulp copy-imgs && gulp copy-plugins",
+    "sass-main": "gulp sass-main",
+    "sass-main-themes": "gulp sass-main-themes",
+    "pug-main-themes": "gulp pug-main-themes",
+    "pug-docs": "gulp pug-docs",
+    "sass-docs": "gulp sass-docs",
+    "js-docs": "gulp js-docs",
+    "img-docs": "gulp imgs-docs"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/frankiejrey/pimaonline-themepack"
+  },
+  "author": "Center for Learning Technology at Pima Community College",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/frankiejrey/pimaonline-themepack/issues"
+  },
+  "homepage": "https://github.com/frankiejrey/pimaonline-themepack",
+  "devDependencies": {
+    "gulp": "^4.0.2",
+    "gulp-connect": "^5.7.0",
+    "gulp-pug": "^5.0.0",
+    "gulp-sass": "^5.1.0",
+    "sass": "^1.49.9"
+  }
+}