From 8538d835208b149d05c53c2d44ccd699a50de770 Mon Sep 17 00:00:00 2001
From: buxxi <buxxi@omfilm.net>
Date: Sat, 16 Jan 2021 11:52:55 +0100
Subject: [PATCH] Moving newsfeed styling from js to a new css file

---
 modules/default/newsfeed/newsfeed.css | 14 ++++++++++++++
 modules/default/newsfeed/newsfeed.js  | 21 ++++++++-------------
 2 files changed, 22 insertions(+), 13 deletions(-)
 create mode 100644 modules/default/newsfeed/newsfeed.css

diff --git a/modules/default/newsfeed/newsfeed.css b/modules/default/newsfeed/newsfeed.css
new file mode 100644
index 00000000..6f32b2e5
--- /dev/null
+++ b/modules/default/newsfeed/newsfeed.css
@@ -0,0 +1,14 @@
+iframe.newsfeed-fullarticle {
+  width: 100vw;
+  /* very large height value to allow scrolling */
+  height: 3000px;
+  top: 0;
+  left: 0;
+  border: none;
+  z-index: 1;
+}
+
+.region.bottom.bar.newsfeed-fullarticle {
+  bottom: inherit;
+  top: -90px;
+}
diff --git a/modules/default/newsfeed/newsfeed.js b/modules/default/newsfeed/newsfeed.js
index bbb7523f..0659876b 100644
--- a/modules/default/newsfeed/newsfeed.js
+++ b/modules/default/newsfeed/newsfeed.js
@@ -44,6 +44,11 @@ Module.register("newsfeed", {
 		return ["moment.js"];
 	},
 
+	//Define required styles.
+	getStyles: function () {
+		return ["newsfeed.css"];
+	},
+
 	// Define required translations.
 	getTranslations: function () {
 		// The translations for the default modules are defined in the core translation files.
@@ -135,16 +140,8 @@ Module.register("newsfeed", {
 
 			if (this.config.showFullArticle) {
 				const fullArticle = document.createElement("iframe");
-				fullArticle.className = "";
-				fullArticle.style.width = "100vw";
-				// very large height value to allow scrolling
-				fullArticle.height = "3000";
-				fullArticle.style.height = "3000";
-				fullArticle.style.top = "0";
-				fullArticle.style.left = "0";
-				fullArticle.style.border = "none";
+				fullArticle.className = "newsfeed-fullarticle";
 				fullArticle.src = this.getActiveItemURL();
-				fullArticle.style.zIndex = 1;
 				wrapper.appendChild(fullArticle);
 			}
 
@@ -335,8 +332,7 @@ Module.register("newsfeed", {
 		this.config.showFullArticle = false;
 		this.scrollPosition = 0;
 		// reset bottom bar alignment
-		document.getElementsByClassName("region bottom bar")[0].style.bottom = "0";
-		document.getElementsByClassName("region bottom bar")[0].style.top = "inherit";
+		document.getElementsByClassName("region bottom bar")[0].classList.remove("newsfeed-fullarticle");
 		if (!this.timer) {
 			this.scheduleUpdateInterval();
 		}
@@ -406,8 +402,7 @@ Module.register("newsfeed", {
 		this.config.showFullArticle = !this.isShowingDescription;
 		// make bottom bar align to top to allow scrolling
 		if (this.config.showFullArticle === true) {
-			document.getElementsByClassName("region bottom bar")[0].style.bottom = "inherit";
-			document.getElementsByClassName("region bottom bar")[0].style.top = "-90px";
+			document.getElementsByClassName("region bottom bar")[0].classList.add("newsfeed-fullarticle");
 		}
 		clearInterval(this.timer);
 		this.timer = null;