diff --git a/configs/mozilla.ini b/configs/mozilla.ini index b5eb10a..53c9663 100644 --- a/configs/mozilla.ini +++ b/configs/mozilla.ini @@ -34,9 +34,9 @@ activity_threshold = 90 filters = minhead.py stripAd/feedburner.sed stripAd/google_ad_map.sed stripAd/yahoo.sed [index.html.xslt] -filters: +#filters: # mememe.plugin - addsearch.xslt +# addsearch.xslt # Any other section defines a feed to subscribe to. The section title # (in the []s) is the URI of the feed itself. A section can also be @@ -456,7 +456,7 @@ name = Nick Alexander name = Cameron Kaiser [https://h4writer.com/?cat=2&feed=rss2] -name = Hannes Verschore +name = Hannes Verschore [https://muffinresearch.co.uk/tag/mozilla/rss/] name = Stuart Colville @@ -680,7 +680,7 @@ name = Mozilla Attack & Defense name = Martin Thompson [https://addons.mozilla.org/blog/feed.xml] -name = Firefox Add-on Reviews +name = Firefox Add-on Reviews [https://dev.to/feed/lzoog] name = Lauren Zugai diff --git a/themes/mozilla/assets/css/planet.css b/themes/mozilla/assets/css/planet.css index 6a6620c..46eb298 100644 --- a/themes/mozilla/assets/css/planet.css +++ b/themes/mozilla/assets/css/planet.css @@ -1,3 +1,21 @@ +:root { + color-scheme: light dark; + + --body-background-color: light-dark(#fafafa, #161616); + --body-color: light-dark(#000000, #ffffff); + --footer-border-color: light-dark(#eeeeee, #353535); + --heading-link-color: light-dark(#000000, #ffffff); + --input-background-color: light-dark(#ffffff, #0c0c0d); + --input-border-color: light-dark(#dddddd, #353535); + --link-color: light-dark(#148cb5, #148cb5); + --post-background-color: light-dark(#ffffff, #242424); + --post-border-color: light-dark(#dddddd, #353535); + --post-box-shadow-color: light-dark(#dddddd, #0c0c0d); + --post-metadata-color: light-dark(#555555, #aaaaaa); + --post-source-background-color: light-dark(#eeeeee, #353535); + --post-source-color: light-dark(#000000, #ffffff); +} + * { line-height: 1.5; padding: 0; @@ -12,41 +30,40 @@ body { margin: 0; padding: 0; font-family: "MozillaText", sans-serif; - background: #fff url('../img/background.jpg') no-repeat scroll -95px top; - color: #000; + background-color: var(--body-background-color); + color: var(--body-color); } h1,h2,h3,h4,h5,h6 { font-family: "MozillaHeadline", sans-serif; line-height: 1.1; -} - -h2 { - font-size: 1.75em; - color: #b72822; - margin-bottom: 0; -} -h4 { - margin: 0 0 0 15px; - border-bottom: 1px solid #ccc; -} + & a { + color: var(--heading-link-color); + text-decoration: none; -h4 a { - color: black; + &:hover { + text-decoration: underline; + } + } } +h1, .h1 { font-size: 2rem; } +h2, .h2 { font-size: 1.75rem; } +h3, .h3 { font-size: 1.5rem; } +h4, .h4 { font-size: 1.25rem; } +h5, .h5 { font-size: 1.15rem; } +h6, .h6 { font-size: 1rem; } a { - color: #148cb5; - text-decoration: none; + color: var(--link-color); } a:hover { - color: #148cb5; - text-decoration: underline; + color: var(--link-color); } +/* Menu */ .menu { display: flex; gap: 8px; @@ -62,71 +79,55 @@ a:hover { align-items: center; display: flex; gap: 8px; -} -#header { - background: url('../img/header-bg.jpg'); - height: 100px; - - & h1 { - display: flex; - margin: 0 16px; - align-items: center; - height: 100%; + & a:hover { + text-decoration: none; } - - & a { - color: #ffffff; - - &:hover { - text-decoration: none; - } - } -} - -#dino { - background: url('../img/header-dino.jpg') no-repeat; - height: 100px; - width: 300px; -} - -#utility { - font-size: 62.5%; - margin: 0.8em 0 0.7em 30px; - text-align: right; - text-transform: uppercase; - letter-spacing: 0.1em; - padding: 3px 30px 0 0; } -#utility * { - display: inline; -} +/* Button */ +.button { + border: 2px solid var(--body-color); + color: var(--body-color); + padding-inline: 16px; + padding-block: 4px; + font-family: inherit; + font-size: inherit; + font-weight: bold; + text-decoration: none; -#utility p { - margin-right: -20px; + &:hover { + background-color: var(--body-color); + color: var(--body-background-color); + } } -#utility strong { - color: #000; - font-size: 11px; +/* Navbar */ +.navbar-container { + margin: 0 auto; + max-width: 1200px; } -#utility ul { - margin-left: 10px; +.navbar { + align-items: center; + display: flex; + padding-block: 16px; } -#utility li { - background: transparent url('../img/bullet_utility.png') no-repeat 4px center; - padding-left: 16px; - font-size: 11px; -} +.navbar-title { + color: var(--heading-link-color); + flex-grow: 1; + font-family: "MozillaHeadline", serif; + font-size: 2rem; + font-weight: bold; + text-decoration: none; -#utility li:first-child { - background: none; - padding: 0; + &:hover { + color: var(--heading-link-color); + } } +/* Main Area */ .main-container { display: flex; gap: 16px; @@ -139,11 +140,24 @@ a:hover { max-width: 900px; } +/* Card */ +/* TODO: Move post to this generic component */ +.card { + background-color: var(--post-background-color); + border: 1px solid var(--post-border-color); + border-radius: 8px; + box-shadow: var(--post-box-shadow-color) 0 0 8px 0; + margin-block: 2px; + padding-block: 8px; + padding-inline: 16px; +} + /* Post */ .post { - border: 1px solid #eeeeee; + background-color: var(--post-background-color); + border: 1px solid var(--post-border-color); border-radius: 8px; - box-shadow: #dddddd 0 0 8px 0; + box-shadow: var(--post-box-shadow-color) 0 0 8px 0; margin-block: 16px; padding-block: 8px; padding-inline: 16px; @@ -155,105 +169,75 @@ a:hover { } .post-title a { - color: #000000; + color: var(--heading-link-color); font-size: 1.5rem; } .post-metadata { - color: #555555; + color: var(--post-metadata-color); font-size: 0.85rem; margin-block-start: -1.15rem; } /* Label */ -.label { - background-color: #eeeeee; +.post-source { + background-color: var(--post-source-background-color); border-radius: 4px; + color: var(--post-source-color); font-size: 0.85rem; padding-block: 4px; padding-inline: 8px; } /* Footer */ -#footer { - background-image: url('../img/footer.jpg'); - background-position: center; - background-repeat: no-repeat; -} - #footer-content { - padding-top: 100px; -} - -#footer-content p { - text-align: center; - padding: 5px; - background-color: #2a2a2a; - color: #999999; - font-size: 0.9em; + border-top: 1px solid var(--footer-border-color); } +/* Sidebar */ .sidebar-content { max-width: 300px; - font-size: 70%; + font-size: 0.85rem; } -.sidebar-content .feeds, -.sidebar-content .disclaimer { - padding-left: 15px; -} +.sidebar-content ul { + padding-inline-start: 8px; -.sidebar-content .feeds p { - padding: 0; - margin: 5px 0 0 0; -} - -.sidebar-content .main { - background: transparent url('../img/sidebar-back.png') no-repeat left top; - background-size: 100%; - padding: 15px 0 0 15px; -} - -.sidebar-content .feeds ul, -.sidebar-content .main ul.planets { - padding-left: 10px; -} - -.sidebar-content .main ul.planets li { - font-size: 1.3em; -} - -.sidebar-content .subscriptions { - list-style-type: none; - padding-left: 10px; -} - -.sidebar-content .main .bottom { - height: 28px; - width: 100%; - background: transparent url('../img/sidebar-bottom.png') no-repeat 50% bottom; - padding-bottom: 30px; -} - -.sidebar-content .message { - cursor: help; - border-bottom: 1px dashed red; + & ul { + padding-inline-start: 24px; + } } -.sidebar-content a.message:hover { - cursor: help; - background-color: #ffD0D0; - border: 1px dashed red !important; - text-decoration: none !important; +/* Input */ +input[type="text"] { + background-color: var(--input-background-color); + border: 1px solid var(--input-border-color); + border-radius: 4px; + font: inherit; + height: 32px; + padding-block: 4px; + padding-inline: 8px; + min-width: 350px; } -/* Unstyled video tags can break the site layout as they take the whole viewport width */ +/* Unstyled video tags can break the site layout as they take the whole viewport + * width */ video { max-width: 80%; border: 1px solid lightgray; border-radius: 10px; } +/* Utils */ +.u-text-bold { + font-weight: bold; +} + +.u-flex-grow { + flex-grow: 1; +} + +/* Small screen */ @media (width < 900px) { .main-container { flex-direction: column; diff --git a/themes/mozilla/assets/img/background.jpg b/themes/mozilla/assets/img/background.jpg deleted file mode 100644 index e5e52b2..0000000 Binary files a/themes/mozilla/assets/img/background.jpg and /dev/null differ diff --git a/themes/mozilla/assets/img/bullet_utility.png b/themes/mozilla/assets/img/bullet_utility.png deleted file mode 100644 index 46c2723..0000000 Binary files a/themes/mozilla/assets/img/bullet_utility.png and /dev/null differ diff --git a/themes/mozilla/assets/img/dino-white.svg b/themes/mozilla/assets/img/dino-white.svg new file mode 100644 index 0000000..cbfb9e9 --- /dev/null +++ b/themes/mozilla/assets/img/dino-white.svg @@ -0,0 +1,47 @@ + + + + + + + + + + diff --git a/themes/mozilla/assets/img/dino.svg b/themes/mozilla/assets/img/dino.svg new file mode 100644 index 0000000..7ab09fa --- /dev/null +++ b/themes/mozilla/assets/img/dino.svg @@ -0,0 +1,46 @@ + + + + + + + + + + diff --git a/themes/mozilla/assets/img/footer.jpg b/themes/mozilla/assets/img/footer.jpg deleted file mode 100644 index 60891d0..0000000 Binary files a/themes/mozilla/assets/img/footer.jpg and /dev/null differ diff --git a/themes/mozilla/assets/img/header-bg.jpg b/themes/mozilla/assets/img/header-bg.jpg deleted file mode 100644 index becd8c5..0000000 Binary files a/themes/mozilla/assets/img/header-bg.jpg and /dev/null differ diff --git a/themes/mozilla/assets/img/header-dino.jpg b/themes/mozilla/assets/img/header-dino.jpg deleted file mode 100644 index 9872373..0000000 Binary files a/themes/mozilla/assets/img/header-dino.jpg and /dev/null differ diff --git a/themes/mozilla/assets/img/planet_banner.png b/themes/mozilla/assets/img/planet_banner.png deleted file mode 100644 index f351992..0000000 Binary files a/themes/mozilla/assets/img/planet_banner.png and /dev/null differ diff --git a/themes/mozilla/assets/img/sidebar-back.png b/themes/mozilla/assets/img/sidebar-back.png deleted file mode 100644 index 88d8d4d..0000000 Binary files a/themes/mozilla/assets/img/sidebar-back.png and /dev/null differ diff --git a/themes/mozilla/assets/img/sidebar-bottom.png b/themes/mozilla/assets/img/sidebar-bottom.png deleted file mode 100644 index cd2623a..0000000 Binary files a/themes/mozilla/assets/img/sidebar-bottom.png and /dev/null differ diff --git a/themes/mozilla/assets/img/tcosm11.gif b/themes/mozilla/assets/img/tcosm11.gif deleted file mode 100644 index 548c998..0000000 Binary files a/themes/mozilla/assets/img/tcosm11.gif and /dev/null differ diff --git a/themes/mozilla/assets/js/app.js b/themes/mozilla/assets/js/app.js new file mode 100644 index 0000000..6c2fc04 --- /dev/null +++ b/themes/mozilla/assets/js/app.js @@ -0,0 +1,22 @@ +function filterSubscriptionList() { + const pattern = /^\s+|\s+$/g; + const list = Array.from(document.querySelectorAll("#subscription-list li")); + const search = document + .querySelector("#filter-subscription-list") + .value.replace(pattern, "") + .toLowerCase(); + + for (const i in list) { + const text = list[i].querySelector("span"); + + if (text.innerText.replace(pattern, "").toLowerCase().includes(search) || + !search) { + list[i].style.display = "flex"; + } else { + list[i].style.display = "none"; + } + } +} + +const filterSubscriptionInput = document.querySelector("#filter-subscription-list"); +filterSubscriptionInput.addEventListener("input", filterSubscriptionList); diff --git a/themes/mozilla/assets/js/personalize.js b/themes/mozilla/assets/js/personalize.js deleted file mode 100644 index f7792fb..0000000 --- a/themes/mozilla/assets/js/personalize.js +++ /dev/null @@ -1,301 +0,0 @@ -var entries = []; // list of news items - -var days = ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", - "Friday", "Saturday"]; -var months = ["January", "February", "March", "April", "May", "June", "July", - "August", "September", "October", "November", "December"]; - -// event complete: stop propagation of the event -function stopPropagation(event) { - if (event.preventDefault) { - event.preventDefault(); - event.stopPropagation(); - } else { - event.returnValue = false; - } -} - -// scroll back to the previous article -function prevArticle(event) { - var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; - for (var i=entries.length; --i>=0;) { - if (!entries[i].anchor) continue; - if (entries[i].anchor.offsetTop+20 < scrollTop) { - window.location.hash=entries[i].anchor.id; - stopPropagation(event); - break; - } - } -} - -// advance to the next article -function nextArticle(event) { - var scrollTop = document.documentElement.scrollTop || document.body.scrollTop; - for (var i=1; iscrollTop) { - window.location.hash=entries[i].anchor.id; - stopPropagation(event); - break; - } - } -} - -// process keypresses -function navkey(event) { - var checkbox = document.getElementById('navkeys'); - if (!checkbox || !checkbox.checked) return; - - if (!event) event=window.event; - if (event.originalTarget && - event.originalTarget.nodeName.toLowerCase() == 'input' && - event.originalTarget.id != 'navkeys') return; - - if (!document.documentElement) return; - if (!entries[0].anchor || !entries[0].anchor.offsetTop) return; - - key=event.keyCode; - if (key == 'N'.charCodeAt(0)) nextArticle(event); - if (key == 'P'.charCodeAt(0)) prevArticle(event); -} - -// create (or reset) a cookie -function createCookie(name,value,days) { - if (days) { - var date = new Date(); - date.setTime(date.getTime()+(days*24*60*60*1000)); - var expires = "; expires="+date.toGMTString(); - } - else expires = ""; - document.cookie = name+"="+value+expires+"; path=/"; -} - -// read a cookie -function readCookie(name) { - var nameEQ = name + "="; - if (!document.cookie) return; - var ca = document.cookie.split(';'); - for(var i=0;i < ca.length;i++) { - var c = ca[i]; - while (c.charAt(0)==' ') c = c.substring(1,c.length); - if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length,c.length); - } - return null; -} - -// each time the value of the option changes, update the cookie -function selectOption() { - var checkbox = document.getElementById('navkeys'); - if (!checkbox) return; - createCookie("navkeys", checkbox.checked?'true':'false', 365); -} - -// add navkeys option to sidebar -function addOption(event) { - var sidebar = document.getElementById('sidebar'); - if (!sidebar) return; - - var h2 = null; - for (var i=entries.length; --i>=0;) { - if (document.getElementById("news-" + i)) break; - if (entries[i].parent.offsetTop > 0) { - var a = entries[i].anchor = document.createElement('a'); - a.id = "news-" + i; - entries[i].parent.insertBefore(a, entries[i].parent.firstChild); - if (h2 == null) h2 = document.createElement('h2'); - } - } - - if (h2 != null && !document.getElementById("navkeys")) { - h2.appendChild(document.createTextNode('Options')); - sidebar.appendChild(h2); - - var form = document.createElement('form'); - var p = document.createElement('p'); - var input = document.createElement('input'); - input.type = "checkbox"; - input.id = "navkeys"; - p.appendChild(input); - var a = document.createElement('a'); - a.title = "Navigate entries"; - a.appendChild(document.createTextNode('Enable ')); - var code = document.createElement('code'); - code.appendChild(document.createTextNode('N')); - a.appendChild(code); - a.appendChild(document.createTextNode(' and ')); - code = document.createElement('code'); - code.appendChild(document.createTextNode('P')); - a.appendChild(code); - a.appendChild(document.createTextNode(' keys')); - p.appendChild(a); - form.appendChild(p); - sidebar.appendChild(form); - - var cookie = readCookie("navkeys"); - if (cookie && cookie == 'true') input.checked = true; - input.onclick = selectOption; - document.onkeydown = navkey; - } -} - -// Parse an HTML5-liberalized version of RFC 3339 datetime values -Date.parseRFC3339 = function (string) { - var date=new Date(); - date.setTime(0); - var match = string.match(/(\d{4})-(\d\d)-(\d\d)\s*(?:[\sT]\s*(\d\d):(\d\d)(?::(\d\d))?(\.\d*)?\s*(Z|([-+])(\d\d):(\d\d))?)?/); - if (!match) return; - if (match[2]) match[2]--; - if (match[7]) match[7] = (match[7]+'000').substring(1,4); - var field = [null,'FullYear','Month','Date','Hours','Minutes','Seconds','Milliseconds']; - for (var i=1; i<=7; i++) if (match[i]) date['setUTC'+field[i]](match[i]); - if (match[9]) date.setTime(date.getTime()+ - (match[9]=='-'?1:-1)*(match[10]*3600000+match[11]*60000) ); - return date.getTime(); -} - -// convert datetime to local date -var localere = /^(\w+) (\d+) (\w+) \d+ 0?(\d\d?:\d\d):\d\d ([AP]M) (EST|EDT|CST|CDT|MST|MDT|PST|PDT)/; -function localizeDate(element) { - var date = new Date(); - date.setTime(Date.parseRFC3339(element.getAttribute('datetime'))); - if (!date.getTime()) return; - - var local = date.toLocaleString(); - if (element.parentNode.nodeName == 'a') local = date.toLocaleTimeString(); - var match = local.match(localere); - if (match) { /* Firefox */ - element.innerHTML = match[4] + ' ' + match[5].toLowerCase(); - element.title = match[6] + " \u2014 " + - match[1] + ', ' + match[3] + ' ' + match[2]; - return days[date.getDay()] + ', ' + months[date.getMonth()] + ' ' + - date.getDate() + ', ' + date.getFullYear(); - } else { - local = local.replace(/ GMT(-\d\d\d\d) \(.*\)$/, ''); /* Webkit */ - element.title = element.innerHTML + ' GMT'; - element.innerHTML = local; - return days[date.getDay()] + ', ' + date.getDate() + ' ' + - months[date.getMonth()] + ' ' + date.getFullYear(); - } - -} - -// find entries (and localizeDates) -function findEntries() { - - var times = document.getElementsByTagName('time'); - - for (var i=0; i name && - (prev == null || subs[prev][0] > subs[i][0])) { - prev = i; - } - } - if (!node) { - var li = document.createElement('li'); - var a = document.createElement('a'); - a.title = "subscribe"; - var feed = xpath1(source, 'atom:link[@rel="self"]'); - if (feed) a.href = feed.getAttribute('href'); - var img = document.createElement('img'); - img.src="images/feed-icon-10x10.png"; - img.title="(feed)"; - a.appendChild(img); - li.appendChild(a); - li.appendChild(document.createTextNode(' ')); - var a = document.createElement('a'); - if (link) a.href=link.getAttribute('href'); - a.appendChild(document.createTextNode(name)); - li.appendChild(a); - if (prev == null) { - footer.appendChild(li); - } else { - footer.insertBefore(li, subs[prev][1]); - } - li.appendChild(document.createElement('ul')); - subs[subs.length] = new Array(name, node=li); - } - var ul = node.childNodes[node.childNodes.length-1]; - var li = document.createElement('li'); - var a = document.createElement('a'); - if (title) copyChildren(title,a); - var link = xpath1(entry, 'atom:link[@rel="alternate"]'); - if (link) a.href=link.getAttribute('href'); - li.appendChild(a); - ul.appendChild(li); - } - } - } - - var bookmark = xpath1(xhr.responseXML.documentElement, 'planet:bookmark'); - query = ''; - if (bookmark) { - for (var i=0; i - + + + + + + <!DOCTYPE html> - - - - <xsl:value-of select='atom:title'/> - - - - - - - - - - - - - - - - - - - - - - - - + + + - -
-

Looking For

- -
- - - -
-
- - -
- - - - - - - - -
-

- - - - - - - - - - - -

- - -

- - - - - - - - -

- - -

- - - - By - - - on - - - - By - - - on - - - -

-
- - -
- - - - - - - - -
-
- - -
- -
-
-

-

Collected here are the most recent blog posts from all over the Mozilla community. - The content here is unfiltered and uncensored, and represents the views of individual community members. - Individual posts are owned by their authors -- see original source for licensing information.

-
-
-

Subscribe to Planet

-

Feeds:

- -

-

Subscription list:

- - -

Last update:

-
- -
-

Other Planets

- - - - -

Subscriptions

- -
-
-
- - -
- - diff --git a/themes/mozilla/partials/head.html.xslt b/themes/mozilla/partials/head.html.xslt new file mode 100644 index 0000000..574b082 --- /dev/null +++ b/themes/mozilla/partials/head.html.xslt @@ -0,0 +1,44 @@ + + + + + + <xsl:choose> + <xsl:when test="$page-title"> + <xsl:value-of select="$page-title"/> | + </xsl:when> + </xsl:choose> + <xsl:value-of select='atom:title'/> + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/themes/mozilla/partials/navbar.html.xslt b/themes/mozilla/partials/navbar.html.xslt new file mode 100644 index 0000000..d356325 --- /dev/null +++ b/themes/mozilla/partials/navbar.html.xslt @@ -0,0 +1,25 @@ + + +
+ +
+ + diff --git a/themes/mozilla/partials/sidebar.html.xslt b/themes/mozilla/partials/sidebar.html.xslt new file mode 100644 index 0000000..29b3991 --- /dev/null +++ b/themes/mozilla/partials/sidebar.html.xslt @@ -0,0 +1,74 @@ + + +
+
+

About

+

+ Collected here are the most recent blog posts from all over the + Mozilla community. The content here is unfiltered and uncensored, + and represents the views of individual community members. + Individual posts are owned by their authors. See original source + for licensing information. +

+
+
+

Subscribe

+ +
+ +
+

Other Planets

+ +
+ +
+ + diff --git a/themes/mozilla/subscriptions.html.xslt b/themes/mozilla/subscriptions.html.xslt new file mode 100644 index 0000000..57b297c --- /dev/null +++ b/themes/mozilla/subscriptions.html.xslt @@ -0,0 +1,71 @@ + + + + + + + + + + + <!DOCTYPE html> + + + + + + +
+
+

Subscriptions

+

+ To request ..., visit our documentation page on + Mozilla Wiki. +

+ + + +
+ +
+ + + +