Added Nord based theme (#4400)

* added new theme

* removed old picture

* modified color of summary and author

* fixed input elements being hard to distinguish

* make fix-all

* markdown lint

* cleaned up css, still incomplete afaik

* removed duplicate, highlight current article

* removed more duplicates, reordered some things

* make fix-all

* removed last few css duplicates

* removed empty css blocks

* make fix-all

* Cleaned CSS - deleted styles that are maintained in template.css

* RTL CSS

* color changed from template

* icons deleted that did not change to the default icons

* Fix CSS (tabs instead of spaces) + RTL

* Delete import.svg

* use CSS filter instead of coloured theme icons

* active buttons are noticeable, more colored icons

* removed unnecesary line

* added background to favicons

* make fix-all

* RTL

* removed background color change since its not present in other menus

* make fix-all

* fixed alerts, code sections

* fixed some css being inconsistent

* renamed to Nord

* removed important from css

* Reorder CSS, fix duplicate, update RTL CSS

* ran npm fix and test. Removed duplicates

* fixed link color in warnings

* changed alert-warn colors

* color of icons can be changed with css

* make fix-all

* oops, fixed spaces instead of tabs

* border color fix

* border color fix

* Global view: dark background

Co-authored-by: Alexandre Alapetite <alexandre@alapetite.fr>
Co-authored-by: mathContao <math-home@web.de>

p/themes/Nord/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2022 Joel Garcia
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

p/themes/Nord/README.md

@@ -0,0 +1,15 @@
+# FreshRSS-Nord-Theme
+
+A simple theme based on Nord's color scheme for [FreshRSS](https://freshrss.org)
+
+You can see how it looks here. It features a compact layout and some custom icons.
+![Example](./thumbs/original.png)
+
+## WIP
+
+- Complete icon set, some are still using default colors
+- Better mobile UI, some stuff looks janky
+- Other fixes for small problems
+
+
+Overall, this is just a base anyone can work on, if you find something feel free to contribute and make a pull request with your changes!

p/themes/Nord/icons/help.svg

@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16">
+<g transform="translate(-182,-490)" fill="#8fbcbb">
+<path style="block-progression:tb;color:#bebebe;direction:ltr;text-indent:0;text-align:start;enable-background:accumulate;text-transform:none;" d="m190,490c-4.4147,0-8,3.5853-8,8s3.5853,8,8,8,8-3.5853,8-8-3.5853-8-8-8zm0,2c3.3413,0,6,2.6587,6,6s-2.6587,6-6,6-6-2.6587-6-6,2.6587-6,6-6z"/>
+<path style="block-progression:tb;color:#bebebe;direction:ltr;text-indent:0;text-align:start;enable-background:accumulate;text-transform:none;" d="M189.34,495c-1.28,0-2.34,1.06-2.34,2.34v1.3125c0,1.2861,1.0576,2.3438,2.3438,2.3438h1.3125c1.29,0.01,2.35-1.05,2.35-2.33v-1.3125c0-1.29-1.06-2.35-2.34-2.35h-1.3125zm0,1,1.3125,0c0.74942,0,1.3438,0.59433,1.3438,1.3438v1.3125c0.01,0.76-0.58,1.35-1.33,1.35h-1.3125c-0.76,0-1.35-0.59-1.35-1.34v-1.3125c0-0.76,0.59-1.35,1.34-1.35z"/>
+<path d="m186.72,491.44c-1.5103,0.6073-2.6811,1.7985-3.2812,3.3125l3.75,1.875c0.25196-0.64029,0.74249-1.1706,1.375-1.4375l-1.8438-3.75zm6.5625,0-1.8438,3.75c0.63251,0.26694,1.123,0.79721,1.375,1.4375l3.75-1.875c-0.60015-1.514-1.7709-2.7052-3.2812-3.3125zm-6.0938,8-3.75,1.875c0.60709,1.4886,1.789,2.65,3.2812,3.25l1.875-3.75c-0.62682-0.25556-1.1433-0.75203-1.4062-1.375zm5.625,0c-0.26291,0.62297-0.77943,1.1194-1.4062,1.375l1.875,3.75c1.4923-0.60005,2.6742-1.7614,3.2812-3.25l-3.75-1.875z"/>
+</g>
+</svg>

p/themes/Nord/icons/link.svg

@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="17" height="17" viewBox="0 0 17 17" version="1.1">
+<g id="surface2">
+<path style=" stroke:none;fill-rule:nonzero;fill:rgb(32.54902%,32.54902%,32.54902%);fill-opacity:1;" d="M 8.5 0 C 3.816406 0 0 3.816406 0 8.5 C 0 13.183594 3.816406 17 8.5 17 C 13.183594 17 17 13.183594 17 8.5 C 17 3.816406 13.183594 0 8.5 0 Z M 5.480469 2.742188 C 4.609375 3.957031 3.78125 5.570312 3.558594 7.5 L 2.082031 7.5 C 2.402344 5.421875 3.691406 3.679688 5.480469 2.742188 Z M 11.515625 2.742188 C 13.308594 3.679688 14.597656 5.421875 14.914062 7.5 L 13.4375 7.5 C 13.21875 5.570312 12.390625 3.957031 11.515625 2.742188 Z M 7.5 3.4375 L 7.5 7.5 L 5.578125 7.5 C 5.839844 5.835938 6.695312 4.4375 7.5 3.4375 Z M 9.5 3.4375 C 10.304688 4.4375 11.160156 5.835938 11.421875 7.5 L 9.5 7.5 Z M 2.082031 9.5 L 3.554688 9.5 C 3.742188 11.328125 4.417969 12.871094 5.144531 14.066406 C 3.53125 13.09375 2.382812 11.441406 2.082031 9.5 Z M 5.570312 9.5 L 7.5 9.5 L 7.5 13.960938 C 6.734375 12.957031 5.820312 11.40625 5.570312 9.5 Z M 9.5 9.5 L 11.417969 9.5 C 11.160156 11.171875 10.304688 12.570312 9.5 13.5625 Z M 13.4375 9.5 L 14.914062 9.5 C 14.597656 11.578125 13.308594 13.324219 11.515625 14.257812 C 12.390625 13.042969 13.21875 11.429688 13.4375 9.5 Z M 13.4375 9.5 "/>
+</g>
+</svg>

p/themes/Nord/icons/read.svg

@@ -0,0 +1,33 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   width="16"
+   height="16.001"
+   version="1.1"
+   id="svg4431"
+   sodipodi:docname="read.svg"
+   inkscape:version="1.2 (dc2aedaf03, 2022-05-15)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs4435" />
+  <sodipodi:namedview
+     id="namedview4433"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     showgrid="false"
+     inkscape:current-layer="svg4431" />
+  <path
+     fill="#666"
+     d="M68.875 297a1 1 0 0 0-.5.25l-4.906 4a1 1 0 0 0-.063.031s-.326.297-.656.75c-.223.306-.353.832-.5 1.313a1 1 0 0 0-.031.03 1 1 0 0 0-.219.563v.032a1 1 0 0 0 0 .03 1 1 0 0 0 0 .157V312a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1v-7.844a1 1 0 0 0 0-.156 1 1 0 0 0-.219-.656 1 1 0 0 0-.031-.032 5.087 5.087 0 0 0-1.125-2 1 1 0 0 0-.031-.03l-4.97-4.02a1 1 0 0 0-.655-.25 1 1 0 0 0-.094 0zm.125 2.281 4.313 3.531.03.032c.022.025.181.25.344.5L69 306.874l-4.687-3.53c.025-.04.034-.088.062-.125.19-.262.319-.415.344-.438l.031-.031 4.25-3.47zm-5 5.094 4.688 3.531.312.219.313-.219L74 304.375V311H64v-6.625z"
+     color="#000"
+     style="block-progression:tb;text-indent:0;text-align:start;text-transform:none;fill:#ffffff"
+     transform="translate(-61 -296.999)"
+     id="path4429" />
+</svg>

p/themes/Nord/icons/share.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="16" width="16">
+<g fill="#8fbcbb" transform="translate(-581.0002,-196)">
+<path style="enable-background:new;color:#000000;" d="m291,178.03c0,1.0873-0.88144,1.9688-1.9688,1.9688-1.0873,0-1.9688-0.88144-1.9688-1.9688,0-1.0873,0.88144-1.9688,1.9688-1.9688,1.0873,0,1.9688,0.88144,1.9688,1.9688z" fill-rule="nonzero" transform="matrix(1.5079365,0,0,1.5079365,148.15963,-64.49107)"/>
+<path style="enable-background:new;color:#000000;" d="m291,178.03c0,1.0873-0.88144,1.9688-1.9688,1.9688-1.0873,0-1.9688-0.88144-1.9688-1.9688,0-1.0873,0.88144-1.9688,1.9688-1.9688,1.0873,0,1.9688,0.88144,1.9688,1.9688z" fill-rule="nonzero" transform="matrix(1.5079365,0,0,1.5079365,158.12818,-59.49107)"/>
+<path style="enable-background:new;color:#000000;" d="m291,178.03c0,1.0873-0.88144,1.9688-1.9688,1.9688-1.0873,0-1.9688-0.88144-1.9688-1.9688,0-1.0873,0.88144-1.9688,1.9688-1.9688,1.0873,0,1.9688,0.88144,1.9688,1.9688z" fill-rule="nonzero" transform="matrix(1.5079365,0,0,1.5079365,158.12818,-69.49107)"/>
+<path style="baseline-shift:baseline;block-progression:tb;color:#000000;direction:ltr;text-indent:0;text-align:start;enable-background:accumulate;text-transform:none;" d="m593.62,198.16-10.062,4.875-1.8125,0.90625,1.8125,0.90625,10.031,5.0625,0.90625-1.8125-8.2188-4.1562,8.2188-4-0.875-1.7812z"/>
+</g>
+</svg>

p/themes/Nord/icons/starred.svg

@@ -0,0 +1,37 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   height="16"
+   width="16"
+   version="1.1"
+   id="svg14"
+   sodipodi:docname="starred.svg"
+   inkscape:version="1.2 (dc2aedaf03, 2022-05-15)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs18" />
+  <sodipodi:namedview
+     id="namedview16"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     showgrid="false"
+     inkscape:current-layer="svg14" />
+  <g
+     transform="translate(-41.000202,-397)"
+     id="g12">
+    <path
+       style="enable-background:accumulate;color:#000000;fill:#666666;fill-opacity:1"
+       d="m530.95,186.71c-0.77941,0.55189-3.1576-1.906-4.1125-1.9179-0.95532-0.0119-3.3949,2.3858-4.161,1.8149-0.76573-0.57072,0.83698-3.592,0.55319-4.5039-0.2839-0.91223-3.3182-2.4915-3.0119-3.3965,0.30617-0.90461,3.6749-0.31399,4.4544-0.86567,0.77986-0.5519,1.3442-3.9257,2.2995-3.914,0.95494,0.0116,1.4342,3.398,2.1998,3.9689,0.76588,0.57114,4.1489,0.0653,4.4331,0.97746,0.28402,0.9118-2.7885,2.414-3.0949,3.3186-0.30652,0.90489,1.22,3.966,0.44027,4.5182z"
+       fill-rule="nonzero"
+       transform="matrix(1.0472113,-0.00871584,0.00871584,1.0472113,-504.35434,220.15425)"
+       fill="#f1c40f"
+       id="path10" />
+  </g>
+</svg>

p/themes/Nord/icons/unread.svg

@@ -0,0 +1,40 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   height="16"
+   width="16"
+   version="1.1"
+   id="svg26"
+   sodipodi:docname="unread.svg"
+   inkscape:version="1.2 (dc2aedaf03, 2022-05-15)"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <defs
+     id="defs30" />
+  <sodipodi:namedview
+     id="namedview28"
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1.0"
+     inkscape:showpageshadow="2"
+     inkscape:pageopacity="0.0"
+     inkscape:pagecheckerboard="0"
+     inkscape:deskcolor="#d1d1d1"
+     showgrid="false"
+     inkscape:current-layer="svg26" />
+  <g
+     transform="translate(-40.99995,-297)"
+     fill="#e74c3c"
+     id="g24"
+     style="fill:#666666;fill-opacity:1">
+    <path
+       style="block-progression:tb;color:#000000;direction:ltr;text-indent:0;text-align:start;enable-background:accumulate;text-transform:none;fill:#666666;fill-opacity:1"
+       d="m43.781,301a1.0001,1.0001,0,0,0,-0.40625,1.7812l5,4,0.625,0.5,0.625-0.5,5-4a1.0005,1.0005,0,1,0,-1.25,-1.5625l-4.375,3.5-4.375-3.5a1.0001,1.0001,0,0,0,-0.844,-0.22z"
+       id="path20" />
+    <path
+       style="block-progression:tb;color:#000000;direction:ltr;text-indent:0;text-align:start;enable-background:accumulate;text-transform:none;fill:#666666;fill-opacity:1"
+       d="M42.906,300a1.0001,1.0001,0,0,0,-0.906,1v9a1.0001,1.0001,0,0,0,1,1h12a1.0001,1.0001,0,0,0,1,-1v-9a1.0001,1.0001,0,0,0,-1,-1h-12a1.0001,1.0001,0,0,0,-0.09375,0zm1.094,2h10v7h-10v-7z"
+       id="path22" />
+  </g>
+</svg>

p/themes/Nord/metadata.json

@@ -0,0 +1,7 @@
+{
+  "name": "Nord theme",
+  "author": "joelchrono12",
+  "description": "A simple theme based on Nord's color scheme",
+  "version": 0.1,
+  "files": ["_template.css","nord.css"]
+}

p/themes/Nord/nord.css

@@ -0,0 +1,1253 @@
+@charset "UTF-8";
+
+:root {
+	/* Set sans-serif & mono fonts */
+	--sans-font: Inter, Lato,Helvetica,"IBM Plex Sans","Roboto",-apple-system,BlinkMacSystemFont,"Nimbus Sans L",Avenir,"Noto Sans", "Segoe UI",Arial,Helvetica,"Helvetica Neue",sans-serif;
+	--mono-font: "mononoki Nerd Font","IBM Plex Mono","Roboto Mono","Ubuntu Mono","Fira Code","Overpass Mono", Monaco,"Droid Sans Mono",monospace;
+	/*This is my dark themed color scheme*/
+	--bg: #242933;
+	--accent-bg: rgb(46, 52, 64);
+	--text: #eceff4;
+	--text-light: #d8dee9;
+	--border: #88c0d0;
+	--accent: #81a1c1;
+	--accent-light: #bf616a;
+	--code: #ebcb8b;
+	--alert: #a3be8c;
+	--alert-bg: #8fbcbb;
+	--code-bg: #2e3440;
+}
+
+
+/*=== GENERAL */
+/*============*/
+
+@font-face {
+	/*	src: local('Open Sans'), local('OpenSans'),
+		url('../fonts/OpenSans.woff2') format('woff2'),
+		url('../fonts/OpenSans.woff') format('woff');*/
+}
+
+html, body {
+	background: var(--bg);
+	color: var(--text);
+	font-family: var(--sans-font);
+}
+
+/*=== Links */
+a {
+	color: var(--accent);
+}
+
+a:hover {
+	color: var(--accent);
+}
+
+
+kbd {
+	color: var(--code);
+	background-color: var(--accent-bg);
+}
+
+legend {
+	margin: 20px 0 5px;
+	padding: 5px 0;
+	font-size: 1.4em;
+}
+
+label {
+	min-height: 25px;
+	padding: 5px 0;
+	cursor: pointer;
+}
+
+input, select, textarea {
+	margin: 5px;
+	padding: 5px;
+	color: var(--text);
+	border: 1px solid var(--border);
+	border-radius: 6px;
+	border-color: var(--border);
+	background-color: var(--bg);
+	min-height: 25px;
+	line-height: 25px;
+	vertical-align: middle;
+}
+
+button {
+	font-family: var(--sans-font);
+}
+
+button.as-link,
+button.as-link:hover,
+button.as-link:active {
+	background: transparent;
+	/*	background-color: var(--bg);A*/
+}
+
+button.as-link[disabled] {
+	color: #ddd !important;
+}
+
+/*=== Tables */
+tr, th, td {
+	padding: 0.5em;
+}
+
+form td,
+form th {
+	font-weight: normal;
+}
+
+.table-wrapper {
+	overflow-x: auto;
+}
+
+table {
+	max-width: 100%;
+
+	border-collapse: collapse;
+
+}
+
+table tr {
+	border-bottom: 1px solid
+}
+
+table th, table td {
+	padding: 10px 20px;
+}
+
+table td span {
+	padding: 5px;
+	color: dimgrey;
+	/*display: none;*/
+	font-size: 10px;
+	font-weight: bold;
+	/*position: absolute;*/
+}
+
+.form-group.form-actions {
+	padding: 5px 0;
+}
+
+.form-group .group-name {
+	padding: 10px 0;
+	text-align: right;
+}
+
+.form-group .group-controls {
+	padding: 5px 0;
+	min-height: 25px;
+}
+
+/*=== Buttons */
+.stick {
+	font-size: 0;
+	vertical-align: middle;
+}
+
+.btn,
+a.btn {
+	margin: .3rem .3rem;
+	background: var(--accent-bg);
+	color: var(--accent);
+	border: none;
+	border-radius: 5px;
+
+	text-decoration: none;
+	transition: .4s;
+}
+
+a.btn.active {
+	background-color: var(--accent-bg);
+	border: 1px solid var(--border);
+}
+
+.btn {
+	padding: 5px 10px;
+	min-height: 37px;
+	min-width: 15px;
+	font-size: 0.9rem;
+	vertical-align: middle;
+}
+
+a.btn {
+	min-height: 25px;
+	line-height: 25px;
+}
+
+.btn-important, .read_all, #actualize {
+	font-weight: bold !important;
+	background-color: var(--accent) !important;
+	color: var(--bg) !important;
+}
+
+#btn-add.btn-important .icon, #actualize .icon {
+	filter: brightness(0);
+}
+
+.btn:hover, svg:hover {
+	opacity: .8;
+	cursor: pointer;
+}
+/*=== Navigation */
+.nav-list .nav-header,
+.nav-list .item {
+	height: 2.5em;
+	font-size: 0.9rem;
+	line-height: 2.5em;
+}
+
+.nav-head {
+	margin: 0;
+	text-align: right;
+}
+
+.nav-head .item {
+	padding: 5px 10px;
+	font-size: 0.9rem;
+	line-height: 1.5rem;
+}
+
+/*=== Horizontal-list */
+.horizontal-list {
+	margin: 0;
+	padding: 0;
+}
+
+.dropdown-menu {
+	margin: 5px 0 0;
+	padding: 5px 0;
+	background: var(--accent-bg);
+	font-size: 0.8rem;
+	border: 1px solid var(--border);
+	border-radius: 6px;
+	text-align: left;
+}
+
+.dropdown-header {
+	padding: 0 5px 5px;
+	font-weight: bold;
+	text-align: left;
+}
+
+.dropdown-menu > .item > a,
+.dropdown-menu > .item > span,
+.dropdown-menu > .item > .as-link {
+	padding: 0 22px;
+	color: var(--text);
+	line-height: 2.5em;
+	min-width: 200px;
+}
+
+.dropdown-menu > .item[aria-checked="true"] > a::before {
+	font-weight: bold;
+	margin: 0 0 0 -14px;
+}
+
+.dropdown-menu .input select,
+.dropdown-menu .input input {
+	margin: 0 auto 5px;
+	padding: 2px 5px;
+}
+
+.dropdown-menu > .item:hover > a {
+	text-decoration: none;
+}
+
+.dropdown-close {
+	display: inline;
+}
+
+.dropdown-close a {
+	background: none;
+	display: block;
+	font-size: 0;
+	position: fixed;
+	top: 0; bottom: 0;
+	left: 0; right: 0;
+	z-index: -11;
+	cursor: default;
+}
+
+.dropdown-close a:hover {
+	background: none;
+}
+
+.dropdown div.dropdown-close {
+	display: none;
+}
+
+.dropdown-target:target ~ div.dropdown-close {
+	display: block;
+	z-index: 999;
+	position: relative;
+}
+
+.dropdown-target:target ~ .dropdown-toggle::after {
+	background-color: var(--accent-bg);
+	border-top: 1px solid var(--border);
+	border-left: 1px solid var(--border);
+}
+
+.dropdown-menu-scrollable .dropdown-close {
+	display: none;
+}
+
+.separator {
+	margin: 5px 0;
+	border-bottom: 1px solid var(--border);
+}
+
+/*=== Alerts */
+.alert {
+	margin: 15px auto;
+	padding: 10px 15px;
+	font-size: 0.9em;
+	border-radius: 6px;
+}
+
+.alert-success {
+	color: var(--bg);
+	background-color: var(--alert-bg)
+}
+
+.alert-head {
+	font-size: 1.15em;
+}
+
+.alert > a {
+	text-decoration: underline;
+}
+
+.alert-warn {
+	border-radius: 6px;
+	background-color: var(--code-bg);
+}
+
+.alert-error {
+	background-color: var(--accent-light);
+	color: var(--bg);
+}
+
+/*=== Icons */
+.icon {
+	filter: invert(74%) sepia(29%) saturate(411%) hue-rotate(171deg) brightness(130%) contrast(85%);
+}
+
+img.favicon {
+	background: var(--text-light);
+	border-radius: 4px;
+}
+
+/*=== Pagination */
+.pagination {
+	width: 100%;
+	font-size: 0.8em;
+	text-align: center;
+}
+
+.pagination .pager-first,
+.pagination .pager-previous,
+.pagination .pager-next,
+.pagination .pager-last {
+	width: 100px;
+}
+
+/*=== Boxes */
+.box {
+	background-color: var(--accent-bg);
+	border: 1px solid var(--border);
+	border-radius: 6px;
+}
+
+.box .box-title {
+	margin: 0;
+	padding: 5px 10px;
+}
+
+.box .box-content {
+	max-height: 260px;
+}
+
+.box .box-content .item {
+	padding: 0 10px;
+	font-size: 0.9rem;
+	line-height: 2.5em;
+}
+
+/*=== Draggable */
+.drag-hover {
+	margin: 0 0 5px;
+	border-bottom: 2px solid var(--border);
+}
+
+[draggable=true] {
+	cursor: grab;
+}
+
+/*=== Tree */
+.tree {
+	margin: 10px 0;
+}
+
+.tree-folder-title .title {
+	background: inherit;
+	color: var(--text);
+}
+
+.tree-folder.category {
+	border-bottom: 1px solid var(--bg);
+}
+
+.tree-folder-items > .item {
+	padding: 0 10px;
+	color: var(--text);
+	font-size: 0.8rem;
+	line-height: 2.5rem;
+}
+
+.tree-folder-items > .item > a {
+	text-decoration: none;
+}
+
+.tree-folder-title {
+	position: relative;
+	padding: 0 10px;
+	font-size: 1rem;
+	line-height: 2.1rem;
+}
+
+.tree-folder-title .title:hover {
+	text-decoration: none;
+}
+
+.tree-folder.active .tree-folder-title {
+	font-weight: bold;
+}
+
+
+/*=== STRUCTURE */
+/*===============*/
+/*=== Header */
+.header {
+	height: 85px;
+}
+
+.header > .item {
+	padding: 10px;
+	vertical-align: middle;
+	text-align: center;
+}
+
+
+.header > .item.title {
+	width: 230px;
+}
+
+.header > .item.title h1 {
+	margin: 0.5em 0;
+}
+
+.header > .item.title h1 a {
+	text-decoration: none;
+}
+
+.header > .item.search input {
+	width: 230px;
+}
+
+.header .item.search input:focus {
+	width: 350px;
+}
+
+.header > .item.title .logo {
+	filter: grayscale(100%) brightness(2.5);
+}
+
+/*=== Body */
+#global {
+	height: calc(100% - 85px);
+}
+
+.aside {
+	background-color: var(--accent-bg);
+	border-radius: 12px;
+}
+
+/*=== Aside main page */
+.aside.aside_feed {
+	padding: 10px 0;
+	text-align: center;
+}
+
+.aside.aside_feed .tree {
+	margin: 10px 0 50px;
+}
+
+.aside_feed .category .title:not([data-unread="0"]) {
+	width: calc(100% - 35px - 20px);
+}
+
+.aside_feed .tree-folder-items.active {
+	background-color: var(--bg);
+}
+
+.aside.aside_feed .nav-form input,
+.aside.aside_feed .nav-form select {
+	width: 140px;
+}
+
+.aside.aside_feed .nav-form .dropdown .dropdown-menu {
+	right: -20px;
+}
+
+.aside.aside_feed .nav-form .dropdown .dropdown-menu::after {
+	right: 33px;
+}
+
+.aside_feed .tree-folder-items .item .dropdown-target:target ~ .dropdown-toggle > .icon,
+.aside_feed .tree-folder-items .item:hover .dropdown-toggle > .icon,
+.aside_feed .tree-folder-items .item.active .dropdown-toggle > .icon {
+	border-radius: 3px;
+}
+
+.item.feed.error > .item-title {
+	color: var(--accent-light);
+}
+
+.item.feed.active {
+	background-color: var(--accent-bg);
+	font-weight: bold;
+
+}
+
+.category .title:not([data-unread="0"])::after {
+	content: attr(data-unread);
+}
+
+li.item.active {
+	background-color: var(--bg);
+	font-weight: bold;
+}
+
+.item.feed:hover {
+	background-color: var(--accent-bg);
+	transition: .4s;
+}
+
+/*=== New article notification */
+#new-article {
+	font-size: 0.9em;
+	text-align: center;
+}
+
+#new-article > a {
+	line-height: 3em;
+	font-weight: bold;
+}
+
+#new-article > a:hover {
+	text-decoration: none;
+}
+
+/*=== Day indication */
+.day {
+	padding: 0 10px;
+	font-weight: bold;
+	line-height: 3em;
+}
+
+.day .name {
+	padding: 0 10px 0 0;
+	font-size: 1.8em;
+	opacity: 0.3;
+	font-style: italic;
+	text-align: right;
+}
+
+.name {
+	display: none;
+}
+
+
+/*=== Feed article header and footer */
+.flux_header {
+	position: relative;
+	font-size: 0.8rem;
+	cursor: pointer;
+}
+
+.flux_header .title {
+	font-size: 0.8rem;
+}
+
+.flux .website .favicon {
+	padding: 3px;
+}
+
+.flux .item.date {
+	width: 155px;
+	text-align: right;
+	overflow: hidden;
+	font-size: 0.7rem;
+}
+
+.flux .bottom {
+	font-size: 0.8rem;
+	text-align: center;
+}
+
+
+.flux_header:hover {
+	background-color: var(--accent-bg);
+	transition: .4s;
+
+}
+
+.flux .item {
+	line-height: 30px;
+}
+
+.flux.current {
+	background: var(--accent-bg);
+}
+
+.flux:not(.current):hover .item.title {
+	background: var(--accent-bg);
+	transition: .4s;
+}
+
+.flux .item.title a {
+	color: var(--text);
+}
+
+.flux .item.title .summary {
+	color: var(--text-light);
+	opacity: 0.8;
+}
+
+.flux .item.title .author {
+	color: var(--text-light);
+	opacity: 0.8;
+}
+
+
+/*=== Feed article content */
+.content {
+	margin: auto;
+	padding: 20px 10px;
+	min-height: 20em;
+	line-height: 1.7em;
+	word-wrap: break-word;
+}
+
+.hide_posts > .flux:not(.active) > .flux_content {
+	display: none;
+}
+
+.content hr {
+	margin: 30px 10px;
+	height: 1px;
+}
+
+.content pre {
+	margin: 10px auto;
+	padding: 10px 20px;
+	overflow: auto;
+	font-size: 0.9rem;
+	border: 1px solid var(--accent);
+	border-radius: 6px;
+
+}
+
+.content code {
+	padding: 2px 5px;
+}
+
+.content blockquote {
+	margin: 0;
+	padding: 5px 20px;
+	display: block;
+}
+
+.content blockquote p {
+	margin: 0;
+}
+
+/*=== Notification and actualize notification */
+.notification {
+	padding: 0 0 0 5px;
+	background: var(--bg);
+	color: var(--text);
+	font-size: 0.9em;
+	/*border: 1px solid #aaa;*/
+	border-radius: 6px;
+	z-index: 10;
+	text-align: center;
+	font-weight: bold;
+	line-height: 3em;
+	vertical-align: middle;
+}
+
+
+.notification a.close {
+	padding: 0 15px;
+	line-height: 3em;
+}
+
+.notification#actualizeProgress {
+	line-height: 2em;
+}
+
+.notification.closed {
+	opacity: 0;
+	visibility: hidden;
+}
+
+/*=== Popup */
+#popup {
+	background-color: rgb(0,0,0,.4);
+}
+
+#popup-content {
+	background-color: var(--accent-bg);
+	box-shadow: 0 0 1px #d8dee9, 1px 2px 3px var(--bg);
+}
+
+#popup-close:hover,
+#popup-close:focus {
+	color: #d8dee9;
+}
+
+#popup-txt {
+	display: none;
+	height: 100%;
+}
+
+/*=== Navigation menu (for articles) */
+#nav_entries {
+	margin: 0;
+	background: var(--accent-bg);
+	text-align: center;
+	line-height: 3em;
+}
+
+#bigMarkAsRead {
+	text-decoration: none;
+}
+
+.bigTick {
+	font-size: 4em;
+}
+
+/*=== Statistiques */
+.stat > table td,
+.stat > table th {
+	text-align: center;
+}
+
+.stat > .horizontal-list {
+	margin: 0 0 5px;
+}
+
+.stat > .horizontal-list .item {
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}
+
+.stat > .horizontal-list .item:first-child {
+	width: 250px;
+}
+
+
+.stat {
+	margin: 10px 0 20px;
+}
+
+/*=== Slider */
+#slider {
+	background: var(--accent-bg);
+	border-left: 1px solid var(--border);
+}
+
+/*=== DIVERS */
+/*===========*/
+.category .title.error::before {
+	color: var(--accent-light);
+	content: "⚠ ";
+}
+
+
+.nav_menu {
+	padding: 5px 0;
+	text-align: center;
+}
+
+/*=== MOBILE */
+/*===========*/
+
+@media (max-width: 840px) {
+	.aside:target + .close-aside {
+		background: rgba(0, 0, 0, 0.2);
+		display: block;
+		font-size: 0;
+		position: fixed;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		cursor: pointer;
+		z-index: 99;
+	}
+
+	.nav_mobile {
+		display: block;
+	}
+
+	.aside {
+		position: fixed;
+		top: 0; bottom: 0;
+		left: 0;
+		width: 0;
+		overflow: hidden;
+		z-index: 100;
+	}
+
+	.aside:target,
+	.reader .aside:target {
+		width: 90%;
+		height: 100vh;
+	}
+
+	.aside_feed .configure-feeds {
+		margin-top: 10px;
+	}
+
+	.flux_header .item.website {
+		width: 40px;
+	}
+
+	.flux:not(.current):hover .item.title {
+		position: relative;
+		width: auto;
+		white-space: nowrap;
+	}
+
+	.notification {
+		top: 0;
+		left: 0;
+		right: 0;
+	}
+
+	#nav_entries {
+		width: 100%;
+	}
+
+	#panel {
+		top: 25px; bottom: 30px;
+		left: 0; right: 0;
+	}
+
+	#panel .close {
+		top: 0; right: 0;
+		left: auto; bottom: auto;
+		display: inline-block;
+		width: 30px;
+		height: 30px;
+	}
+
+	#slider.active {
+		left: 0;
+		top: 50px;
+		background-color: var(--bg);
+	}
+
+	#close-slider img {
+		display: initial;
+	}
+
+	#close-slider.active {
+		background: var(--bg);
+		display: block;
+		width: 100%;
+		height: 50px;
+		z-index: 10;
+		text-align: center;
+		line-height: 50px;
+		border-bottom: 1px solid #ddd;
+	}
+
+	.stat.half {
+		grid-column: 1 / span 2;
+	}
+}
+
+/*=== PRINTER */
+/*============*/
+
+@media print {
+	.header, .aside,
+	.nav_menu, .day,
+	.flux_header,
+	.flux_content .bottom,
+	.pagination,
+	#nav_entries {
+		display: none;
+	}
+
+	html, body {
+		background: #fff;
+		color: #000;
+		font-family: Serif;
+	}
+
+	#global,
+	.flux_content {
+		display: block !important;
+	}
+
+	.flux_content .content {
+		width: 100% !important;
+	}
+
+	.flux_content .content a {
+		color: #000;
+	}
+
+	.flux_content .content a::after {
+		content: " [" attr(href) "] ";
+		font-style: italic;
+	}
+}
+
+/*=== PREVIEW */
+/*===========*/
+.preview_controls {
+	margin-left: auto;
+	margin-right: auto;
+	padding: 1rem;
+	max-width: 1000px;
+	text-align: center;
+	background-color: #eee;
+	border: 1px solid #e0e0e0;
+	border-radius: .25rem;
+}
+
+.preview_controls label {
+	display: inline;
+}
+
+.preview_controls label input[type="radio"] {
+	margin-top: -4px;
+}
+
+.preview_controls label + label {
+	margin-left: 1rem;
+}
+
+.preview_background {
+	background-color: transparent;
+}
+
+.drag-drop-marker {
+	margin: -1px;
+}
+
+.feed .item-title:not([data-unread="0"])::before {
+	content: "(" attr(data-unread) ") ";
+	display: none
+}
+
+.feed .item-title:not([data-unread="0"])::after {
+	content: " (" attr(data-unread) ")";
+}
+
+
+/*BEGINS BASE.CSS*/
+
+/*=== GENERAL */
+/*============*/
+
+/*=== Links */
+a, button.as-link {
+	outline: none;
+}
+
+/*=== Forms */
+textarea {
+	width: 360px;
+	height: 100px;
+}
+
+
+option {
+	padding: 0 .5em;
+}
+
+
+input.extend {
+	transition: width 200ms linear;
+}
+
+
+/*=== COMPONENTS */
+/*===============*/
+/*=== Forms */
+.form-group.form-actions .btn {
+	margin: 0 10px;
+}
+
+/*=== Navigation */
+.nav-list .disable {
+	text-align: center;
+}
+
+.nav-list .item > a {
+	padding: 0 10px;
+}
+
+.nav-list a:hover {
+	text-decoration: none;
+}
+
+.nav-list .nav-header {
+	padding: 0 10px;
+	font-weight: bold;
+}
+
+.nav-list .nav-form {
+	padding: 3px;
+	text-align: center;
+}
+
+/*=== Dropdown */
+.dropdown-menu::after {
+	content: "";
+	position: absolute;
+	top: -6px;
+	right: 13px;
+	width: 10px;
+	height: 10px;
+	z-index: -10;
+	transform: rotate(45deg);
+	border-color: var(--border);
+}
+
+
+
+.dropdown-menu > .item > a:hover,
+.dropdown-menu > .item > span:hover,
+.dropdown-menu > .item > .as-link:hover {
+	color: var(--accent);
+	transition: .4s;
+}
+
+/*=== Pagination */
+.content .pagination {
+	margin: 0;
+	padding: 0;
+}
+
+.pagination .item.pager-current {
+	font-weight: bold;
+	font-size: 1.5em;
+}
+
+.pagination .item a {
+	display: block;
+	font-style: italic;
+	line-height: 3em;
+	text-decoration: none;
+}
+
+.pagination .loading,
+.pagination a:hover.loading {
+	font-size: 0;
+}
+
+
+
+/*=== STRUCTURE */
+/*===============*/
+/*=== Header */
+
+/*=== Body */
+/*=== Aside main page (categories) */
+.aside_feed .tree-folder-title > .title:not([data-unread="0"])::after {
+	position: absolute;
+	right: 0;
+	margin: 10px 0;
+	padding: 0 10px;
+	font-size: 0.9rem;
+	line-height: 1.5rem;
+}
+
+/*=== Aside main page (feeds) */
+.aside_feed .tree-folder-items .dropdown-menu::after {
+	left: 2px;
+}
+
+
+/*=== Configuration pages */
+.post {
+	padding: 10px 50px;
+	font-size: 0.9em;
+}
+
+.post form {
+	margin: 10px 0;
+}
+
+.post.content {
+	max-width: 550px;
+}
+
+/*=== Prompt (centered) */
+.prompt {
+	text-align: center;
+}
+
+.prompt label {
+	text-align: left;
+}
+
+.prompt form {
+	margin: 10px auto 20px auto;
+	width: 180px;
+}
+
+.prompt input {
+	margin: 5px auto;
+	width: 100%;
+}
+
+.prompt p {
+	margin: 20px 0;
+}
+
+/*=== Navigation menu (for articles) */
+/*=== READER VIEW */
+/*================*/
+#stream.reader .flux {
+	padding: 0 0 50px;
+}
+
+#stream.reader .flux .author {
+	margin: 0 0 10px;
+	font-size: 90%;
+}
+
+/*=== GLOBAL VIEW */
+/*================*/
+.box.category .box-title .title {
+	font-weight: normal;
+	text-decoration: none;
+	text-align: left;
+}
+
+.box.category .title:not([data-unread="0"])::after {
+	background: none;
+	border: 0;
+	position: absolute;
+	top: 5px; right: 10px;
+	font-weight: bold;
+	box-shadow: none;
+	text-shadow: none;
+}
+
+.box.category .item.feed {
+	padding: 2px 10px;
+	font-size: 0.8rem;
+}
+
+#panel {
+	background-color: var(--bg);
+}
+
+/*=== LOGS */
+/*=========*/
+.loglist {
+	overflow: hidden;
+}
+
+.log {
+	padding: 5px 10px;
+	font-size: 0.8rem;
+}
+
+.log .date {
+	display: block;
+	font-weight: bold;
+}
+
+/*=== MOBILE */
+/*===========*/
+
+@media (max-width: 840px) {
+	.aside {
+		transition: width 200ms linear;
+	}
+
+	.aside .toggle_aside,
+	#panel .close {
+		display: block;
+		width: 100%;
+		height: 50px;
+		line-height: 50px;
+		text-align: center;
+	}
+
+	.aside.aside_feed {
+		padding: 0;
+	}
+
+	.nav_menu .btn {
+		margin: 5px 10px;
+	}
+
+	.nav_menu .stick {
+		margin: 0 10px;
+	}
+
+	.nav_menu .stick .btn {
+		margin: 5px 0;
+	}
+
+	.nav_menu .search {
+		display: inline-block;
+		max-width: 97%;
+	}
+
+	.nav_menu .search input {
+		max-width: 97%;
+		width: 90px;
+	}
+
+	.nav_menu .search input:focus {
+		width: 400px;
+	}
+
+	.day .name {
+		font-size: 1.1rem;
+	}
+
+	.pagination {
+		margin: 0 0 3.5em;
+	}
+
+	.notification a.close {
+		display: block;
+		left: 0;
+	}
+
+	.notification a.close:hover {
+		opacity: 0.5;
+	}
+
+	.notification a.close .icon {
+		display: none;
+	}
+}

p/themes/Nord/nord.rtl.css

@@ -0,0 +1,1253 @@
+@charset "UTF-8";
+
+:root {
+	/* Set sans-serif & mono fonts */
+	--sans-font: Inter, Lato,Helvetica,"IBM Plex Sans","Roboto",-apple-system,BlinkMacSystemFont,"Nimbus Sans L",Avenir,"Noto Sans", "Segoe UI",Arial,Helvetica,"Helvetica Neue",sans-serif;
+	--mono-font: "mononoki Nerd Font","IBM Plex Mono","Roboto Mono","Ubuntu Mono","Fira Code","Overpass Mono", Monaco,"Droid Sans Mono",monospace;
+	/*This is my dark themed color scheme*/
+	--bg: #242933;
+	--accent-bg: rgb(46, 52, 64);
+	--text: #eceff4;
+	--text-light: #d8dee9;
+	--border: #88c0d0;
+	--accent: #81a1c1;
+	--accent-light: #bf616a;
+	--code: #ebcb8b;
+	--alert: #a3be8c;
+	--alert-bg: #8fbcbb;
+	--code-bg: #2e3440;
+}
+
+
+/*=== GENERAL */
+/*============*/
+
+@font-face {
+	/*	src: local('Open Sans'), local('OpenSans'),
+		url('../fonts/OpenSans.woff2') format('woff2'),
+		url('../fonts/OpenSans.woff') format('woff');*/
+}
+
+html, body {
+	background: var(--bg);
+	color: var(--text);
+	font-family: var(--sans-font);
+}
+
+/*=== Links */
+a {
+	color: var(--accent);
+}
+
+a:hover {
+	color: var(--accent);
+}
+
+
+kbd {
+	color: var(--code);
+	background-color: var(--accent-bg);
+}
+
+legend {
+	margin: 20px 0 5px;
+	padding: 5px 0;
+	font-size: 1.4em;
+}
+
+label {
+	min-height: 25px;
+	padding: 5px 0;
+	cursor: pointer;
+}
+
+input, select, textarea {
+	margin: 5px;
+	padding: 5px;
+	color: var(--text);
+	border: 1px solid var(--border);
+	border-radius: 6px;
+	border-color: var(--border);
+	background-color: var(--bg);
+	min-height: 25px;
+	line-height: 25px;
+	vertical-align: middle;
+}
+
+button {
+	font-family: var(--sans-font);
+}
+
+button.as-link,
+button.as-link:hover,
+button.as-link:active {
+	background: transparent;
+	/*	background-color: var(--bg);A*/
+}
+
+button.as-link[disabled] {
+	color: #ddd !important;
+}
+
+/*=== Tables */
+tr, th, td {
+	padding: 0.5em;
+}
+
+form td,
+form th {
+	font-weight: normal;
+}
+
+.table-wrapper {
+	overflow-x: auto;
+}
+
+table {
+	max-width: 100%;
+
+	border-collapse: collapse;
+
+}
+
+table tr {
+	border-bottom: 1px solid
+}
+
+table th, table td {
+	padding: 10px 20px;
+}
+
+table td span {
+	padding: 5px;
+	color: dimgrey;
+	/*display: none;*/
+	font-size: 10px;
+	font-weight: bold;
+	/*position: absolute;*/
+}
+
+.form-group.form-actions {
+	padding: 5px 0;
+}
+
+.form-group .group-name {
+	padding: 10px 0;
+	text-align: left;
+}
+
+.form-group .group-controls {
+	padding: 5px 0;
+	min-height: 25px;
+}
+
+/*=== Buttons */
+.stick {
+	font-size: 0;
+	vertical-align: middle;
+}
+
+.btn,
+a.btn {
+	margin: .3rem .3rem;
+	background: var(--accent-bg);
+	color: var(--accent);
+	border: none;
+	border-radius: 5px;
+
+	text-decoration: none;
+	transition: .4s;
+}
+
+a.btn.active {
+	background-color: var(--accent-bg);
+	border: 1px solid var(--border);
+}
+
+.btn {
+	padding: 5px 10px;
+	min-height: 37px;
+	min-width: 15px;
+	font-size: 0.9rem;
+	vertical-align: middle;
+}
+
+a.btn {
+	min-height: 25px;
+	line-height: 25px;
+}
+
+.btn-important, .read_all, #actualize {
+	font-weight: bold !important;
+	background-color: var(--accent) !important;
+	color: var(--bg) !important;
+}
+
+#btn-add.btn-important .icon, #actualize .icon {
+	filter: brightness(0);
+}
+
+.btn:hover, svg:hover {
+	opacity: .8;
+	cursor: pointer;
+}
+/*=== Navigation */
+.nav-list .nav-header,
+.nav-list .item {
+	height: 2.5em;
+	font-size: 0.9rem;
+	line-height: 2.5em;
+}
+
+.nav-head {
+	margin: 0;
+	text-align: left;
+}
+
+.nav-head .item {
+	padding: 5px 10px;
+	font-size: 0.9rem;
+	line-height: 1.5rem;
+}
+
+/*=== Horizontal-list */
+.horizontal-list {
+	margin: 0;
+	padding: 0;
+}
+
+.dropdown-menu {
+	margin: 5px 0 0;
+	padding: 5px 0;
+	background: var(--accent-bg);
+	font-size: 0.8rem;
+	border: 1px solid var(--border);
+	border-radius: 6px;
+	text-align: right;
+}
+
+.dropdown-header {
+	padding: 0 5px 5px;
+	font-weight: bold;
+	text-align: right;
+}
+
+.dropdown-menu > .item > a,
+.dropdown-menu > .item > span,
+.dropdown-menu > .item > .as-link {
+	padding: 0 22px;
+	color: var(--text);
+	line-height: 2.5em;
+	min-width: 200px;
+}
+
+.dropdown-menu > .item[aria-checked="true"] > a::before {
+	font-weight: bold;
+	margin: 0 -14px 0 0;
+}
+
+.dropdown-menu .input select,
+.dropdown-menu .input input {
+	margin: 0 auto 5px;
+	padding: 2px 5px;
+}
+
+.dropdown-menu > .item:hover > a {
+	text-decoration: none;
+}
+
+.dropdown-close {
+	display: inline;
+}
+
+.dropdown-close a {
+	background: none;
+	display: block;
+	font-size: 0;
+	position: fixed;
+	top: 0; bottom: 0;
+	right: 0; left: 0;
+	z-index: -11;
+	cursor: default;
+}
+
+.dropdown-close a:hover {
+	background: none;
+}
+
+.dropdown div.dropdown-close {
+	display: none;
+}
+
+.dropdown-target:target ~ div.dropdown-close {
+	display: block;
+	z-index: 999;
+	position: relative;
+}
+
+.dropdown-target:target ~ .dropdown-toggle::after {
+	background-color: var(--accent-bg);
+	border-top: 1px solid var(--border);
+	border-right: 1px solid var(--border);
+}
+
+.dropdown-menu-scrollable .dropdown-close {
+	display: none;
+}
+
+.separator {
+	margin: 5px 0;
+	border-bottom: 1px solid var(--border);
+}
+
+/*=== Alerts */
+.alert {
+	margin: 15px auto;
+	padding: 10px 15px;
+	font-size: 0.9em;
+	border-radius: 6px;
+}
+
+.alert-success {
+	color: var(--bg);
+	background-color: var(--alert-bg)
+}
+
+.alert-head {
+	font-size: 1.15em;
+}
+
+.alert > a {
+	text-decoration: underline;
+}
+
+.alert-warn {
+	border-radius: 6px;
+	background-color: var(--code-bg);
+}
+
+.alert-error {
+	background-color: var(--accent-light);
+	color: var(--bg);
+}
+
+/*=== Icons */
+.icon {
+	filter: invert(74%) sepia(29%) saturate(411%) hue-rotate(171deg) brightness(130%) contrast(85%);
+}
+
+img.favicon {
+	background: var(--text-light);
+	border-radius: 4px;
+}
+
+/*=== Pagination */
+.pagination {
+	width: 100%;
+	font-size: 0.8em;
+	text-align: center;
+}
+
+.pagination .pager-first,
+.pagination .pager-previous,
+.pagination .pager-next,
+.pagination .pager-last {
+	width: 100px;
+}
+
+/*=== Boxes */
+.box {
+	background-color: var(--accent-bg);
+	border: 1px solid var(--border);
+	border-radius: 6px;
+}
+
+.box .box-title {
+	margin: 0;
+	padding: 5px 10px;
+}
+
+.box .box-content {
+	max-height: 260px;
+}
+
+.box .box-content .item {
+	padding: 0 10px;
+	font-size: 0.9rem;
+	line-height: 2.5em;
+}
+
+/*=== Draggable */
+.drag-hover {
+	margin: 0 0 5px;
+	border-bottom: 2px solid var(--border);
+}
+
+[draggable=true] {
+	cursor: grab;
+}
+
+/*=== Tree */
+.tree {
+	margin: 10px 0;
+}
+
+.tree-folder-title .title {
+	background: inherit;
+	color: var(--text);
+}
+
+.tree-folder.category {
+	border-bottom: 1px solid var(--bg);
+}
+
+.tree-folder-items > .item {
+	padding: 0 10px;
+	color: var(--text);
+	font-size: 0.8rem;
+	line-height: 2.5rem;
+}
+
+.tree-folder-items > .item > a {
+	text-decoration: none;
+}
+
+.tree-folder-title {
+	position: relative;
+	padding: 0 10px;
+	font-size: 1rem;
+	line-height: 2.1rem;
+}
+
+.tree-folder-title .title:hover {
+	text-decoration: none;
+}
+
+.tree-folder.active .tree-folder-title {
+	font-weight: bold;
+}
+
+
+/*=== STRUCTURE */
+/*===============*/
+/*=== Header */
+.header {
+	height: 85px;
+}
+
+.header > .item {
+	padding: 10px;
+	vertical-align: middle;
+	text-align: center;
+}
+
+
+.header > .item.title {
+	width: 230px;
+}
+
+.header > .item.title h1 {
+	margin: 0.5em 0;
+}
+
+.header > .item.title h1 a {
+	text-decoration: none;
+}
+
+.header > .item.search input {
+	width: 230px;
+}
+
+.header .item.search input:focus {
+	width: 350px;
+}
+
+.header > .item.title .logo {
+	filter: grayscale(100%) brightness(2.5);
+}
+
+/*=== Body */
+#global {
+	height: calc(100% - 85px);
+}
+
+.aside {
+	background-color: var(--accent-bg);
+	border-radius: 12px;
+}
+
+/*=== Aside main page */
+.aside.aside_feed {
+	padding: 10px 0;
+	text-align: center;
+}
+
+.aside.aside_feed .tree {
+	margin: 10px 0 50px;
+}
+
+.aside_feed .category .title:not([data-unread="0"]) {
+	width: calc(100% - 35px - 20px);
+}
+
+.aside_feed .tree-folder-items.active {
+	background-color: var(--bg);
+}
+
+.aside.aside_feed .nav-form input,
+.aside.aside_feed .nav-form select {
+	width: 140px;
+}
+
+.aside.aside_feed .nav-form .dropdown .dropdown-menu {
+	left: -20px;
+}
+
+.aside.aside_feed .nav-form .dropdown .dropdown-menu::after {
+	left: 33px;
+}
+
+.aside_feed .tree-folder-items .item .dropdown-target:target ~ .dropdown-toggle > .icon,
+.aside_feed .tree-folder-items .item:hover .dropdown-toggle > .icon,
+.aside_feed .tree-folder-items .item.active .dropdown-toggle > .icon {
+	border-radius: 3px;
+}
+
+.item.feed.error > .item-title {
+	color: var(--accent-light);
+}
+
+.item.feed.active {
+	background-color: var(--accent-bg);
+	font-weight: bold;
+
+}
+
+.category .title:not([data-unread="0"])::after {
+	content: attr(data-unread);
+}
+
+li.item.active {
+	background-color: var(--bg);
+	font-weight: bold;
+}
+
+.item.feed:hover {
+	background-color: var(--accent-bg);
+	transition: .4s;
+}
+
+/*=== New article notification */
+#new-article {
+	font-size: 0.9em;
+	text-align: center;
+}
+
+#new-article > a {
+	line-height: 3em;
+	font-weight: bold;
+}
+
+#new-article > a:hover {
+	text-decoration: none;
+}
+
+/*=== Day indication */
+.day {
+	padding: 0 10px;
+	font-weight: bold;
+	line-height: 3em;
+}
+
+.day .name {
+	padding: 0 0 0 10px;
+	font-size: 1.8em;
+	opacity: 0.3;
+	font-style: italic;
+	text-align: left;
+}
+
+.name {
+	display: none;
+}
+
+
+/*=== Feed article header and footer */
+.flux_header {
+	position: relative;
+	font-size: 0.8rem;
+	cursor: pointer;
+}
+
+.flux_header .title {
+	font-size: 0.8rem;
+}
+
+.flux .website .favicon {
+	padding: 3px;
+}
+
+.flux .item.date {
+	width: 155px;
+	text-align: left;
+	overflow: hidden;
+	font-size: 0.7rem;
+}
+
+.flux .bottom {
+	font-size: 0.8rem;
+	text-align: center;
+}
+
+
+.flux_header:hover {
+	background-color: var(--accent-bg);
+	transition: .4s;
+
+}
+
+.flux .item {
+	line-height: 30px;
+}
+
+.flux.current {
+	background: var(--accent-bg);
+}
+
+.flux:not(.current):hover .item.title {
+	background: var(--accent-bg);
+	transition: .4s;
+}
+
+.flux .item.title a {
+	color: var(--text);
+}
+
+.flux .item.title .summary {
+	color: var(--text-light);
+	opacity: 0.8;
+}
+
+.flux .item.title .author {
+	color: var(--text-light);
+	opacity: 0.8;
+}
+
+
+/*=== Feed article content */
+.content {
+	margin: auto;
+	padding: 20px 10px;
+	min-height: 20em;
+	line-height: 1.7em;
+	word-wrap: break-word;
+}
+
+.hide_posts > .flux:not(.active) > .flux_content {
+	display: none;
+}
+
+.content hr {
+	margin: 30px 10px;
+	height: 1px;
+}
+
+.content pre {
+	margin: 10px auto;
+	padding: 10px 20px;
+	overflow: auto;
+	font-size: 0.9rem;
+	border: 1px solid var(--accent);
+	border-radius: 6px;
+
+}
+
+.content code {
+	padding: 2px 5px;
+}
+
+.content blockquote {
+	margin: 0;
+	padding: 5px 20px;
+	display: block;
+}
+
+.content blockquote p {
+	margin: 0;
+}
+
+/*=== Notification and actualize notification */
+.notification {
+	padding: 0 5px 0 0;
+	background: var(--bg);
+	color: var(--text);
+	font-size: 0.9em;
+	/*border: 1px solid #aaa;*/
+	border-radius: 6px;
+	z-index: 10;
+	text-align: center;
+	font-weight: bold;
+	line-height: 3em;
+	vertical-align: middle;
+}
+
+
+.notification a.close {
+	padding: 0 15px;
+	line-height: 3em;
+}
+
+.notification#actualizeProgress {
+	line-height: 2em;
+}
+
+.notification.closed {
+	opacity: 0;
+	visibility: hidden;
+}
+
+/*=== Popup */
+#popup {
+	background-color: rgb(0,0,0,.4);
+}
+
+#popup-content {
+	background-color: var(--accent-bg);
+	box-shadow: 0 0 1px #d8dee9, -1px 2px 3px var(--bg);
+}
+
+#popup-close:hover,
+#popup-close:focus {
+	color: #d8dee9;
+}
+
+#popup-txt {
+	display: none;
+	height: 100%;
+}
+
+/*=== Navigation menu (for articles) */
+#nav_entries {
+	margin: 0;
+	background: var(--accent-bg);
+	text-align: center;
+	line-height: 3em;
+}
+
+#bigMarkAsRead {
+	text-decoration: none;
+}
+
+.bigTick {
+	font-size: 4em;
+}
+
+/*=== Statistiques */
+.stat > table td,
+.stat > table th {
+	text-align: center;
+}
+
+.stat > .horizontal-list {
+	margin: 0 0 5px;
+}
+
+.stat > .horizontal-list .item {
+	overflow: hidden;
+	white-space: nowrap;
+	text-overflow: ellipsis;
+}
+
+.stat > .horizontal-list .item:first-child {
+	width: 250px;
+}
+
+
+.stat {
+	margin: 10px 0 20px;
+}
+
+/*=== Slider */
+#slider {
+	background: var(--accent-bg);
+	border-right: 1px solid var(--border);
+}
+
+/*=== DIVERS */
+/*===========*/
+.category .title.error::before {
+	color: var(--accent-light);
+	content: "⚠ ";
+}
+
+
+.nav_menu {
+	padding: 5px 0;
+	text-align: center;
+}
+
+/*=== MOBILE */
+/*===========*/
+
+@media (max-width: 840px) {
+	.aside:target + .close-aside {
+		background: rgba(0, 0, 0, 0.2);
+		display: block;
+		font-size: 0;
+		position: fixed;
+		top: 0;
+		bottom: 0;
+		right: 0;
+		left: 0;
+		cursor: pointer;
+		z-index: 99;
+	}
+
+	.nav_mobile {
+		display: block;
+	}
+
+	.aside {
+		position: fixed;
+		top: 0; bottom: 0;
+		right: 0;
+		width: 0;
+		overflow: hidden;
+		z-index: 100;
+	}
+
+	.aside:target,
+	.reader .aside:target {
+		width: 90%;
+		height: 100vh;
+	}
+
+	.aside_feed .configure-feeds {
+		margin-top: 10px;
+	}
+
+	.flux_header .item.website {
+		width: 40px;
+	}
+
+	.flux:not(.current):hover .item.title {
+		position: relative;
+		width: auto;
+		white-space: nowrap;
+	}
+
+	.notification {
+		top: 0;
+		right: 0;
+		left: 0;
+	}
+
+	#nav_entries {
+		width: 100%;
+	}
+
+	#panel {
+		top: 25px; bottom: 30px;
+		right: 0; left: 0;
+	}
+
+	#panel .close {
+		top: 0; left: 0;
+		right: auto; bottom: auto;
+		display: inline-block;
+		width: 30px;
+		height: 30px;
+	}
+
+	#slider.active {
+		right: 0;
+		top: 50px;
+		background-color: var(--bg);
+	}
+
+	#close-slider img {
+		display: initial;
+	}
+
+	#close-slider.active {
+		background: var(--bg);
+		display: block;
+		width: 100%;
+		height: 50px;
+		z-index: 10;
+		text-align: center;
+		line-height: 50px;
+		border-bottom: 1px solid #ddd;
+	}
+
+	.stat.half {
+		grid-column: 1 / span 2;
+	}
+}
+
+/*=== PRINTER */
+/*============*/
+
+@media print {
+	.header, .aside,
+	.nav_menu, .day,
+	.flux_header,
+	.flux_content .bottom,
+	.pagination,
+	#nav_entries {
+		display: none;
+	}
+
+	html, body {
+		background: #fff;
+		color: #000;
+		font-family: Serif;
+	}
+
+	#global,
+	.flux_content {
+		display: block !important;
+	}
+
+	.flux_content .content {
+		width: 100% !important;
+	}
+
+	.flux_content .content a {
+		color: #000;
+	}
+
+	.flux_content .content a::after {
+		content: " [" attr(href) "] ";
+		font-style: italic;
+	}
+}
+
+/*=== PREVIEW */
+/*===========*/
+.preview_controls {
+	margin-right: auto;
+	margin-left: auto;
+	padding: 1rem;
+	max-width: 1000px;
+	text-align: center;
+	background-color: #eee;
+	border: 1px solid #e0e0e0;
+	border-radius: .25rem;
+}
+
+.preview_controls label {
+	display: inline;
+}
+
+.preview_controls label input[type="radio"] {
+	margin-top: -4px;
+}
+
+.preview_controls label + label {
+	margin-right: 1rem;
+}
+
+.preview_background {
+	background-color: transparent;
+}
+
+.drag-drop-marker {
+	margin: -1px;
+}
+
+.feed .item-title:not([data-unread="0"])::before {
+	content: "(" attr(data-unread) ") ";
+	display: none
+}
+
+.feed .item-title:not([data-unread="0"])::after {
+	content: " (" attr(data-unread) ")";
+}
+
+
+/*BEGINS BASE.CSS*/
+
+/*=== GENERAL */
+/*============*/
+
+/*=== Links */
+a, button.as-link {
+	outline: none;
+}
+
+/*=== Forms */
+textarea {
+	width: 360px;
+	height: 100px;
+}
+
+
+option {
+	padding: 0 .5em;
+}
+
+
+input.extend {
+	transition: width 200ms linear;
+}
+
+
+/*=== COMPONENTS */
+/*===============*/
+/*=== Forms */
+.form-group.form-actions .btn {
+	margin: 0 10px;
+}
+
+/*=== Navigation */
+.nav-list .disable {
+	text-align: center;
+}
+
+.nav-list .item > a {
+	padding: 0 10px;
+}
+
+.nav-list a:hover {
+	text-decoration: none;
+}
+
+.nav-list .nav-header {
+	padding: 0 10px;
+	font-weight: bold;
+}
+
+.nav-list .nav-form {
+	padding: 3px;
+	text-align: center;
+}
+
+/*=== Dropdown */
+.dropdown-menu::after {
+	content: "";
+	position: absolute;
+	top: -6px;
+	left: 13px;
+	width: 10px;
+	height: 10px;
+	z-index: -10;
+	transform: rotate(-45deg);
+	border-color: var(--border);
+}
+
+
+
+.dropdown-menu > .item > a:hover,
+.dropdown-menu > .item > span:hover,
+.dropdown-menu > .item > .as-link:hover {
+	color: var(--accent);
+	transition: .4s;
+}
+
+/*=== Pagination */
+.content .pagination {
+	margin: 0;
+	padding: 0;
+}
+
+.pagination .item.pager-current {
+	font-weight: bold;
+	font-size: 1.5em;
+}
+
+.pagination .item a {
+	display: block;
+	font-style: italic;
+	line-height: 3em;
+	text-decoration: none;
+}
+
+.pagination .loading,
+.pagination a:hover.loading {
+	font-size: 0;
+}
+
+
+
+/*=== STRUCTURE */
+/*===============*/
+/*=== Header */
+
+/*=== Body */
+/*=== Aside main page (categories) */
+.aside_feed .tree-folder-title > .title:not([data-unread="0"])::after {
+	position: absolute;
+	left: 0;
+	margin: 10px 0;
+	padding: 0 10px;
+	font-size: 0.9rem;
+	line-height: 1.5rem;
+}
+
+/*=== Aside main page (feeds) */
+.aside_feed .tree-folder-items .dropdown-menu::after {
+	right: 2px;
+}
+
+
+/*=== Configuration pages */
+.post {
+	padding: 10px 50px;
+	font-size: 0.9em;
+}
+
+.post form {
+	margin: 10px 0;
+}
+
+.post.content {
+	max-width: 550px;
+}
+
+/*=== Prompt (centered) */
+.prompt {
+	text-align: center;
+}
+
+.prompt label {
+	text-align: right;
+}
+
+.prompt form {
+	margin: 10px auto 20px auto;
+	width: 180px;
+}
+
+.prompt input {
+	margin: 5px auto;
+	width: 100%;
+}
+
+.prompt p {
+	margin: 20px 0;
+}
+
+/*=== Navigation menu (for articles) */
+/*=== READER VIEW */
+/*================*/
+#stream.reader .flux {
+	padding: 0 0 50px;
+}
+
+#stream.reader .flux .author {
+	margin: 0 0 10px;
+	font-size: 90%;
+}
+
+/*=== GLOBAL VIEW */
+/*================*/
+.box.category .box-title .title {
+	font-weight: normal;
+	text-decoration: none;
+	text-align: right;
+}
+
+.box.category .title:not([data-unread="0"])::after {
+	background: none;
+	border: 0;
+	position: absolute;
+	top: 5px; left: 10px;
+	font-weight: bold;
+	box-shadow: none;
+	text-shadow: none;
+}
+
+.box.category .item.feed {
+	padding: 2px 10px;
+	font-size: 0.8rem;
+}
+
+#panel {
+	background-color: var(--bg);
+}
+
+/*=== LOGS */
+/*=========*/
+.loglist {
+	overflow: hidden;
+}
+
+.log {
+	padding: 5px 10px;
+	font-size: 0.8rem;
+}
+
+.log .date {
+	display: block;
+	font-weight: bold;
+}
+
+/*=== MOBILE */
+/*===========*/
+
+@media (max-width: 840px) {
+	.aside {
+		transition: width 200ms linear;
+	}
+
+	.aside .toggle_aside,
+	#panel .close {
+		display: block;
+		width: 100%;
+		height: 50px;
+		line-height: 50px;
+		text-align: center;
+	}
+
+	.aside.aside_feed {
+		padding: 0;
+	}
+
+	.nav_menu .btn {
+		margin: 5px 10px;
+	}
+
+	.nav_menu .stick {
+		margin: 0 10px;
+	}
+
+	.nav_menu .stick .btn {
+		margin: 5px 0;
+	}
+
+	.nav_menu .search {
+		display: inline-block;
+		max-width: 97%;
+	}
+
+	.nav_menu .search input {
+		max-width: 97%;
+		width: 90px;
+	}
+
+	.nav_menu .search input:focus {
+		width: 400px;
+	}
+
+	.day .name {
+		font-size: 1.1rem;
+	}
+
+	.pagination {
+		margin: 0 0 3.5em;
+	}
+
+	.notification a.close {
+		display: block;
+		right: 0;
+	}
+
+	.notification a.close:hover {
+		opacity: 0.5;
+	}
+
+	.notification a.close .icon {
+		display: none;
+	}
+}