From a02b1fb2a0e8da3d99bc54c73e3aa2a1a0100efa Mon Sep 17 00:00:00 2001
From: Patrick Crandol <patrick@crandol.com>
Date: Sun, 28 Oct 2018 23:24:15 -0400
Subject: Fix Dropdown being obscured by other elements

increased z-index of dropdown-menu to prevent it from being obscured by other page elements
---
 p/themes/base-theme/template.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'p/themes/base-theme/template.css')

diff --git a/p/themes/base-theme/template.css b/p/themes/base-theme/template.css
index b211d0516..273b3d07f 100644
--- a/p/themes/base-theme/template.css
+++ b/p/themes/base-theme/template.css
@@ -256,7 +256,7 @@ a.btn {
 }
 .dropdown-target:target ~ .dropdown-menu {
 	display: block;
-	z-index: 10;
+	z-index: 1000;
 }
 .dropdown-close {
 	display: inline;
-- 
cgit v1.2.3


From adcbfc43b866ad2654be3f96e90c650cae224141 Mon Sep 17 00:00:00 2001
From: romibi <romibi@bluewin.ch>
Date: Tue, 13 Nov 2018 22:29:03 +0100
Subject: Improve long dropdown menu lists (#2108)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Dropdown menus with lots of entries were a bit difficult to use …
Set max height to 75% of Viewport-height and enabled scrolling
---
 app/views/helpers/index/normal/entry_bottom.phtml | 2 +-
 p/themes/base-theme/template.css                  | 5 +++++
 2 files changed, 6 insertions(+), 1 deletion(-)

(limited to 'p/themes/base-theme/template.css')

diff --git a/app/views/helpers/index/normal/entry_bottom.phtml b/app/views/helpers/index/normal/entry_bottom.phtml
index 784a41e1f..1f35318e3 100644
--- a/app/views/helpers/index/normal/entry_bottom.phtml
+++ b/app/views/helpers/index/normal/entry_bottom.phtml
@@ -42,7 +42,7 @@
 			<a class="dropdown-toggle" href="#dropdown-labels-<?php echo $this->entry->id();?>"><?php
 				echo _t('index.menu.tags');
 			?></a>
-			<ul class="dropdown-menu">
+			<ul class="dropdown-menu dropdown-menu-scrollable">
 				<li class="dropdown-close"><a href="#close">❌</a></li>
 				<!-- Ajax -->
 			</ul>
diff --git a/p/themes/base-theme/template.css b/p/themes/base-theme/template.css
index 273b3d07f..f07b397f4 100644
--- a/p/themes/base-theme/template.css
+++ b/p/themes/base-theme/template.css
@@ -230,6 +230,11 @@ a.btn {
 	background: #fff;
 	border: 1px solid #aaa;
 }
+.dropdown-menu-scrollable {
+	max-height: 75vh;
+	overflow-x: hidden;
+	overflow-y: auto;
+}
 .dropdown-header {
 	display: block;
 }
-- 
cgit v1.2.3


From 05f41608005f7ca3936e54d44f8bec422e3460b3 Mon Sep 17 00:00:00 2001
From: Patrick Crandol <patrick@crandol.com>
Date: Tue, 13 Nov 2018 16:34:29 -0500
Subject: Login tweaks (#2122)

* Fix for #1620

* Swage login tweaks

https://github.com/FreshRSS/FreshRSS/pull/2069#issuecomment-435093099

* Swage tweaks for Mobile
---
 p/themes/Swage/swage.css         | 34 ++++++++++++++++++++++++++++++++++
 p/themes/Swage/swage.scss        | 34 ++++++++++++++++++++++++++++++++++
 p/themes/base-theme/template.css | 15 +++++++++++++++
 3 files changed, 83 insertions(+)

(limited to 'p/themes/base-theme/template.css')

diff --git a/p/themes/Swage/swage.css b/p/themes/Swage/swage.css
index 50b7aceb7..8f262da8c 100644
--- a/p/themes/Swage/swage.css
+++ b/p/themes/Swage/swage.css
@@ -813,6 +813,36 @@ text-overflow: ellipsis;
 width: 270px;
 }
 
+.formLogin #global {
+height: 0;
+}
+
+.formLogin .header {
+height: 55px;
+background: #22303d;
+}
+
+.formLogin .header > .item.configure {
+width: 200px;
+position: unset;
+}
+
+.formLogin a.signin {
+	color: #FCFCFC;
+	padding-left: 5px;
+}
+
+.formLogin .header > .item.title h1 {
+    display: unset;
+}
+
+.formLogin input {
+    border-left: 5px solid;
+    border-right: 1px solid #e3e3e3;
+    border-top: 1px solid #e3e3e3;
+    border-bottom: 1px solid #e3e3e3;
+}
+
 .loglist {
 overflow: hidden;
 border: 1px solid #969696;
@@ -846,6 +876,10 @@ color: #FCFCFC;
 }
 
 @media (max-width: 840px) {
+.formLogin .header {
+display: none;
+}
+
 .dropdown-header, .dropdown-menu > .item {
 padding: 12px;
 }
diff --git a/p/themes/Swage/swage.scss b/p/themes/Swage/swage.scss
index 69d863322..c0c76cf14 100644
--- a/p/themes/Swage/swage.scss
+++ b/p/themes/Swage/swage.scss
@@ -914,6 +914,37 @@ form {
 	}
 }
 
+.formLogin {
+	#global {
+		height: 0;
+	}
+	
+	.header {
+		height: 55px;
+		background: $color_aside;
+		> .item {
+			&.configure {
+				width: 200px;
+				position: unset;
+			}
+			&.title h1 {
+				display: unset;
+			}
+		}
+	}
+	a.signin {
+		color: $color_light;
+		padding-left: 5px;
+	}
+	
+	input {
+		border-left: 5px solid;
+		border-right: 1px darken( $color_light, 10%);
+		border-top: 1px darken( $color_light, 10%);
+		border-bottom: 1px darken( $color_light, 10%);
+	}
+}
+
 .loglist {
 	overflow: hidden;
 	border: 1px solid darken( $color_light, 40% );
@@ -947,6 +978,9 @@ form {
 }
 
 @media(max-width: 840px) {
+	.formLogin .header {
+		display: none;
+	}
 	.dropdown-header, .dropdown-menu > .item {
 		padding: 12px;
 	}
diff --git a/p/themes/base-theme/template.css b/p/themes/base-theme/template.css
index f07b397f4..87c32ea58 100644
--- a/p/themes/base-theme/template.css
+++ b/p/themes/base-theme/template.css
@@ -672,6 +672,21 @@ br + br + br {
 	height: 300px;
 }
 
+/*=== LOGIN VIEW */
+/*================*/
+.formLogin .header > .item {
+        padding: 10px 30px;
+}
+
+.formLogin .header > .item.title {
+        text-align: left;
+}
+
+.formLogin .header > .item.configure {
+        text-align: right;
+}
+
+
 /*=== GLOBAL VIEW */
 /*================*/
 #stream.global {
-- 
cgit v1.2.3


From 195c0b6867848f1bea0ec2eb861b7dad5bc1db60 Mon Sep 17 00:00:00 2001
From: Patrick Crandol <patrick@crandol.com>
Date: Tue, 11 Dec 2018 15:25:53 -0500
Subject: Make aria-hidden !important (#2176)

Fix for #2115.
---
 p/themes/base-theme/template.css | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'p/themes/base-theme/template.css')

diff --git a/p/themes/base-theme/template.css b/p/themes/base-theme/template.css
index 87c32ea58..fdc2f884e 100644
--- a/p/themes/base-theme/template.css
+++ b/p/themes/base-theme/template.css
@@ -143,7 +143,7 @@ td.numeric {
 /*===============*/
 
 [aria-hidden="true"] {
-	display: none;
+	display: none !important;
 }
 
 /*=== Forms */
-- 
cgit v1.2.3


From 478d3e6611e73974bd3b917c625bf0d099cbf123 Mon Sep 17 00:00:00 2001
From: Patrick Crandol <patrick@crandol.com>
Date: Wed, 12 Dec 2018 06:04:31 -0500
Subject: Decouple scrolling of feeds and articles (#2117)

* Remove Sticky Kit

Remove sticky-kit, as functionality is unsuitable for separate scrolling.

* Remove sticky-kit load in main.js

Further removing the sticky-kit kruft

* Finish removal of references to Sticky-kit

* CSS Changes to template for Independent Scrolling

* Addition of JS and supporting CSS and html

* More CSS fixes to establish expected behavior

Should be able to scroll navbar without it being in sticky mode now.

* Fix typo in main.js

sortcut.js -> shortcut.js

* Fix unexpected tree scrolling behavior

* Change name of generic JS function

* Improve sticky-aside

* CSS changes in themes to accommodate  independent Scroll

In themes where .aside's width is not the standard 300px, .tree's width must be specified to be equal to .aside

* Remove Sticky-Kit from README files

* Updates to Sticky-Aside

* Update Template to fix screwup

* Make Recalculating height actually work

* Let sidebar fill height if nav buttons aren't visible

* Make accommodating for nav buttons actually work

* update Swage theme for Independent Scroll feature

* Integrate sticky_aside into main.js

* Add Simple Scrollbar

* Patch scrollbar color for themes with dark colored asides

* Increase Visibility of scrollbar on Dark Themes

* Improve async loading, events, and performance

* CSS typo

* Fix double scrollbar on mobile

* Fix regression causing sticky to not be removed

* No $ for non-jQuery variables

* Fix strange condition + option for nice scrollbar

* Initial attempt to use css sticky

* Add stickyfill

* make the correct element sticky

* re-add incorrectly removed sidebar code

* Continue fixing mistaken deletions

* decrease frequency of recalc

* use minified version of simple-scrollbar.

* Load stickyfill instead of injecting

* put recalc back where it belongs

* re-remove script injector

* remove padding

bottom padding was causing the last item in the feed to be hidden under the nav buttons

* Manual merge of css_scrollbar

Add auto-detection of -webkit-scrollbar-thumb, otherwise fall back to
simple-scrollbar.js

* Fix Regression

Sticky recalc is still needed when using css scrollbars

* Replace method of closing dropdowns

Changed from an overlay href to a javascript solution, for better compatibility

* Remove Treepadding

Treepadding was causing dropdown menus at the bottom of the tree to be obscured.

* Undo unnecessary move of dropdown-target

* Move Dropdown Handler to a sensibleish place

* Fix light Scrollbar color not picking up on Firefox

* Minor syntax

* Minor Clarification of CSS/ patch BlueLagoon

* Change logic for native WebKit scrollbar detection

Fix
https://github.com/FreshRSS/FreshRSS/pull/2117#issuecomment-444251419
Tested with Firefox 63, Firefox 65, Chrome 71, IE11, Edge 42

* Fixes for other views

E.g. reader view

* Cleaner way of generating hash for dropdowns

* Make dropdown-toggle an actual toggle

* Prepare for CSS Scrollbars Module Level 1

* Fix regression causing my labels dropdown not to appear

* remove unneeded dropdown-close css rule

* Re-apply some lost changes

https://github.com/FreshRSS/FreshRSS/pull/2117/commits/3c509989e890b88852e52c67c1c5507d1e0bf28c

* Add standard scrollbar compatibility

E.g. Firefox 64+

* Make All dropdowns click-to-close

* Remove BlueLagoon template

* Try to fix Firefox

https://github.com/FreshRSS/FreshRSS/pull/2117#discussion_r239539984

* Add CSS rules necessary for consistent function of scrollbar in Firefox

* Use inheritance to determine width

* Use overlay scrollbar where possible

* Test Reduced Listener

* Fix Firefox 62

And show subtle scrollbar even when not hovering

* Add margin at bottom

To allow opening the menus
https://github.com/FreshRSS/FreshRSS/pull/2117#issuecomment-444571218

* Minor - tab correction

* Spaces -> tabs

* Remove unneeded inheritance

* Fix indenting

* Revert bad merge

* Messy WIP to make dropdowns work

* Style Cleanup

* Break it down

* Lets try a move-it move-it

* Update p/scripts/main.js

Co-Authored-By: pattems <patrick@crandol.com>

* Update p/themes/BlueLagoon/BlueLagoon.css

Co-Authored-By: pattems <patrick@crandol.com>

*  separate ALL THE THINGS

* erroneous commas

* and to or

* removing double condition that doesn't do what I want

* More breaking down

* fix var

* Fix variable name again

* Remove magic number

https://github.com/FreshRSS/FreshRSS/pull/2117#discussion_r240052598

* Suuuuper inelegant solution for dropdowns

* lets try that again

* Inelegant Fix For Dropdowns

Now with 100% more working dropdowns

* Make sidebar dropdowns work correctly?

* Fix reversion

* Make JS scrollbar always visible

* Remove unneeded CSS

Added early in this pull request, didn't get pulled out when it was obsolete

* Fix CSS removal I missed

* CSS comment update/consistency for dark themes

* Clean Up Duplicate code

* Make dropdowns properly hide

Downside: Can no longer click on header/nav buttons to close

* Strip unneeded if statement

* jshint -W018

https://github.com/FreshRSS/FreshRSS/pull/2117#discussion_r240392851

* Half-reversion to old dropdown

* make overlay href scale to sidebar width

* remove init of nonexistent method

* remove trailing tabs

* move #close href where it belongs in index.phtml

* Revert all changes to index.phtml

* remove whitespace

accidentally added in last commit

* Move var's in init_column categories

* Finish putting old style dropdowns back

* Make CSS changes to use support statements

* Cleanup Whitespace

* re-add missing class

* spaces -> tabs in main.js

* tabs -> spaces css

* Minor whitespace

* Cleanup per @Alkarex

* Second attempt to add bottom margin

https://github.com/FreshRSS/FreshRSS/pull/2117#discussion_r240820901

* Fix error in IE11

* Simple-scrollbar color match for dark themes
---
 README.fr.md                         |   4 +-
 README.md                            |   6 +-
 app/layout/aside_feed.phtml          |   3 +-
 p/scripts/jquery.sticky-kit.min.js   |   9 ---
 p/scripts/main.js                    | 116 +++++++++++++++++++++++------------
 p/scripts/simple-scrollbar.min.js    |   2 +
 p/themes/BlueLagoon/BlueLagoon.css   |  26 ++++++++
 p/themes/Dark/dark.css               |  25 ++++++++
 p/themes/Flat/flat.css               |  25 ++++++++
 p/themes/Screwdriver/screwdriver.css |  25 ++++++++
 p/themes/Swage/swage.css             |  26 ++++++++
 p/themes/Swage/swage.scss            |  38 ++++++++++--
 p/themes/base-theme/template.css     |  99 +++++++++++++++++++++++++++---
 13 files changed, 338 insertions(+), 66 deletions(-)
 delete mode 100644 p/scripts/jquery.sticky-kit.min.js
 create mode 100644 p/scripts/simple-scrollbar.min.js

(limited to 'p/themes/base-theme/template.css')

diff --git a/README.fr.md b/README.fr.md
index 312fbac45..a8a8f87ff 100644
--- a/README.fr.md
+++ b/README.fr.md
@@ -192,13 +192,13 @@ Tout client supportant une API de type Fever ; Sélection :
 * [php-http-304](https://alexandre.alapetite.fr/doc-alex/php-http-304/)
 * [jQuery](https://jquery.com/)
 * [lib_opml](https://github.com/marienfressinaud/lib_opml)
-* [jQuery Plugin Sticky-Kit](https://leafo.net/sticky-kit/)
 * [keyboard_shortcuts](http://www.openjs.com/scripts/events/keyboard_shortcuts/)
 * [flotr2](http://www.humblesoftware.com/flotr2)
 
-## Uniquement pour certaines options
+## Uniquement pour certaines options ou configurations
 * [bcrypt.js](https://github.com/dcodeIO/bcrypt.js)
 * [phpQuery](https://github.com/phpquery/phpquery)
+* [simple-scrollbar](https://github.com/buzinas/simple-scrollbar)
 
 ## Si les fonctions natives ne sont pas disponibles
 * [Services_JSON](https://pear.php.net/pepr/pepr-proposal-show.php?id=198)
diff --git a/README.md b/README.md
index 1e86d9f57..d6e13851e 100644
--- a/README.md
+++ b/README.md
@@ -64,7 +64,7 @@ FreshRSS comes with absolutely no warranty.
 
 More detailed information about installation and server configuration can be found in [our documentation](https://freshrss.github.io/FreshRSS/en/admins/02_Installation.html).
 
-## Automated install 
+## Automated install
 * [![Docker](https://www.docker.com/sites/default/files/horizontal.png)](./Docker/)
 * [![YunoHost](https://install-app.yunohost.org/install-with-yunohost.png)](https://install-app.yunohost.org/?app=freshrss)
 * [![Cloudron](https://cloudron.io/img/button.svg)](https://cloudron.io/button.html?app=org.freshrss.cloudronapp)
@@ -199,13 +199,13 @@ Supported clients are:
 * [php-http-304](https://alexandre.alapetite.fr/doc-alex/php-http-304/)
 * [jQuery](https://jquery.com/)
 * [lib_opml](https://github.com/marienfressinaud/lib_opml)
-* [jQuery Plugin Sticky-Kit](https://leafo.net/sticky-kit/)
 * [keyboard_shortcuts](http://www.openjs.com/scripts/events/keyboard_shortcuts/)
 * [flotr2](http://www.humblesoftware.com/flotr2)
 
-## Only for some options
+## Only for some options or configurations
 * [bcrypt.js](https://github.com/dcodeIO/bcrypt.js)
 * [phpQuery](https://github.com/phpquery/phpquery)
+* [simple-scrollbar](https://github.com/buzinas/simple-scrollbar)
 
 ## If native functions are not available
 * [Services_JSON](https://pear.php.net/pepr/pepr-proposal-show.php?id=198)
diff --git a/app/layout/aside_feed.phtml b/app/layout/aside_feed.phtml
index 7b1645ebd..73b200686 100644
--- a/app/layout/aside_feed.phtml
+++ b/app/layout/aside_feed.phtml
@@ -21,7 +21,7 @@
 
 	<form id="mark-read-aside" method="post">
 	<input type="hidden" name="_csrf" value="<?php echo FreshRSS_Auth::csrfToken(); ?>" />
-	<ul class="tree">
+	<ul id="sidebar" class="tree">
 		<li class="tree-folder category all<?php echo FreshRSS_Context::isCurrentGet('a') ? ' active' : ''; ?>">
 			<div class="tree-folder-title">
 				<?php echo _i('all'); ?> <a class="title" data-unread="<?php echo format_number(FreshRSS_Context::$total_unread); ?>" href="<?php echo _url('index', 'index'); ?>"><?php echo _t('index.menu.main_stream'); ?></a>
@@ -92,6 +92,7 @@
 				}
 			}
 		?>
+		<li class="tree-bottom"></li>
 	</ul>
 	</form>
 </div>
diff --git a/p/scripts/jquery.sticky-kit.min.js b/p/scripts/jquery.sticky-kit.min.js
deleted file mode 100644
index e2a3c6de9..000000000
--- a/p/scripts/jquery.sticky-kit.min.js
+++ /dev/null
@@ -1,9 +0,0 @@
-/*
- Sticky-kit v1.1.2 | WTFPL | Leaf Corcoran 2015 | http://leafo.net
-*/
-(function(){var b,f;b=this.jQuery||window.jQuery;f=b(window);b.fn.stick_in_parent=function(d){var A,w,J,n,B,K,p,q,k,E,t;null==d&&(d={});t=d.sticky_class;B=d.inner_scrolling;E=d.recalc_every;k=d.parent;q=d.offset_top;p=d.spacer;w=d.bottoming;null==q&&(q=0);null==k&&(k=void 0);null==B&&(B=!0);null==t&&(t="is_stuck");A=b(document);null==w&&(w=!0);J=function(a,d,n,C,F,u,r,G){var v,H,m,D,I,c,g,x,y,z,h,l;if(!a.data("sticky_kit")){a.data("sticky_kit",!0);I=A.height();g=a.parent();null!=k&&(g=g.closest(k));
-if(!g.length)throw"failed to find stick parent";v=m=!1;(h=null!=p?p&&a.closest(p):b("<div />"))&&h.css("position",a.css("position"));x=function(){var c,f,e;if(!G&&(I=A.height(),c=parseInt(g.css("border-top-width"),10),f=parseInt(g.css("padding-top"),10),d=parseInt(g.css("padding-bottom"),10),n=g.offset().top+c+f,C=g.height(),m&&(v=m=!1,null==p&&(a.insertAfter(h),h.detach()),a.css({position:"",top:"",width:"",bottom:""}).removeClass(t),e=!0),F=a.offset().top-(parseInt(a.css("margin-top"),10)||0)-q,
-u=a.outerHeight(!0),r=a.css("float"),h&&h.css({width:a.outerWidth(!0),height:u,display:a.css("display"),"vertical-align":a.css("vertical-align"),"float":r}),e))return l()};x();if(u!==C)return D=void 0,c=q,z=E,l=function(){var b,l,e,k;if(!G&&(e=!1,null!=z&&(--z,0>=z&&(z=E,x(),e=!0)),e||A.height()===I||x(),e=f.scrollTop(),null!=D&&(l=e-D),D=e,m?(w&&(k=e+u+c>C+n,v&&!k&&(v=!1,a.css({position:"fixed",bottom:"",top:c}).trigger("sticky_kit:unbottom"))),e<F&&(m=!1,c=q,null==p&&("left"!==r&&"right"!==r||a.insertAfter(h),
-h.detach()),b={position:"",width:"",top:""},a.css(b).removeClass(t).trigger("sticky_kit:unstick")),B&&(b=f.height(),u+q>b&&!v&&(c-=l,c=Math.max(b-u,c),c=Math.min(q,c),m&&a.css({top:c+"px"})))):e>F&&(m=!0,b={position:"fixed",top:c},b.width="border-box"===a.css("box-sizing")?a.outerWidth()+"px":a.width()+"px",a.css(b).addClass(t),null==p&&(a.after(h),"left"!==r&&"right"!==r||h.append(a)),a.trigger("sticky_kit:stick")),m&&w&&(null==k&&(k=e+u+c>C+n),!v&&k)))return v=!0,"static"===g.css("position")&&g.css({position:"relative"}),
-a.css({position:"absolute",bottom:d,top:"auto"}).trigger("sticky_kit:bottom")},y=function(){x();return l()},H=function(){G=!0;f.off("touchmove",l);f.off("scroll",l);f.off("resize",y);b(document.body).off("sticky_kit:recalc",y);a.off("sticky_kit:detach",H);a.removeData("sticky_kit");a.css({position:"",bottom:"",top:"",width:""});g.position("position","");if(m)return null==p&&("left"!==r&&"right"!==r||a.insertAfter(h),h.remove()),a.removeClass(t)},f.on("touchmove",l),f.on("scroll",l),f.on("resize",
-y),b(document.body).on("sticky_kit:recalc",y),a.on("sticky_kit:detach",H),setTimeout(l,0)}};n=0;for(K=this.length;n<K;n++)d=this[n],J(b(d));return this}}).call(this);
diff --git a/p/scripts/main.js b/p/scripts/main.js
index 343534826..0f05a5bf6 100644
--- a/p/scripts/main.js
+++ b/p/scripts/main.js
@@ -1,5 +1,5 @@
 "use strict";
-/* globals $, jQuery, context, i18n, shortcut, shortcuts, url */
+/* globals $, jQuery, context, i18n, shortcut, shortcuts, SimpleScrollbar, url */
 /* jshint strict:global */
 
 var $stream = null,
@@ -245,7 +245,6 @@ function toggleContent(new_active, old_active, skipping) {
 
 	if (context.does_lazyload && !skipping) {
 		new_active.find('img[data-original], iframe[data-original]').each(function () {
-			this.onload = function () { $(document.body).trigger("sticky_kit:recalc"); };
 			this.setAttribute('src', this.getAttribute('data-original'));
 			this.removeAttribute('data-original');
 		});
@@ -536,19 +535,6 @@ function inject_script(name) {
 	document.head.appendChild(script);
 }
 
-function init_sticky_column() {
-	if (!window.$ || !window.$.fn.stick_in_parent) {
-		if (window.console) {
-			console.log('FreshRSS waiting for Sticky-kit…');
-		}
-		window.setTimeout(init_sticky_column, 200);
-		return;
-	}
-	if ($('.toggle_aside').css('display') === 'none') {
-		$('#aside_feed .tree').stick_in_parent({parent:'#aside_feed'});
-	}
-}
-
 function init_column_categories() {
 	if (context.current_view !== 'normal') {
 		return;
@@ -564,38 +550,39 @@ function init_column_categories() {
 				this.alt = '▽';
 			}
 		});
-		$(this).parent().next(".tree-folder-items").slideToggle(300 , function() { $(document.body).trigger("sticky_kit:recalc"); });
+		$(this).parent().next(".tree-folder-items").slideToggle(300, function () {
+			if (useJsScrollbar && sidebar && typeof(Event) === 'function') { //Refresh JS scrollbar
+				sidebar.querySelector('.ss-content').dispatchEvent(new Event('scroll'));
+			}
+		});
 		return false;
 	});
+
 	$('#aside_feed').on('click', '.tree-folder-items .feed .dropdown-toggle', function () {
-		if ($(this).nextAll('.dropdown-menu').length === 0) {
-			var itemId = $(this).closest('.item').attr('id'),
-				templateId = itemId.substring(0, 2) === 't_' ? 'tag_config_template' : 'feed_config_template',
-				id = itemId.substr(2),
-				feed_web = $(this).data('fweb'),
-				template = $('#' + templateId)
-					.html().replace(/------/g, id).replace('http://example.net/', feed_web);
+		var itemId = $(this).closest('.item').attr('id'),
+			templateId = itemId.substring(0, 2) === 't_' ? 'tag_config_template' : 'feed_config_template',
+			id = itemId.substr(2),
+			feed_web = $(this).data('fweb'),
+			template = $('#' + templateId)
+				.html().replace(/------/g, id).replace('http://example.net/', feed_web);
+		if ($(this).next('.dropdown-menu').length === 0) {
 			$(this).attr('href', '#dropdown-' + id).prev('.dropdown-target').attr('id', 'dropdown-' + id).parent()
 				.append(template).find('button.confirm').removeAttr('disabled');
-			$('.tree-folder-items .dropdown-close a').click(function(){
-				$('.tree').removeClass('treepadding');
-				$(document.body).trigger("sticky_kit:recalc");
-			});
+		} else {
+			if ($(this).next('.dropdown-menu').css('display') === 'none') {
+				id = $(this).closest('.item').attr('id').substr(2);
+				$(this).attr('href', '#dropdown-' + id);
+			} else {
+				$(this).attr('href', "#close");
+			}
 		}
 	});
-
-	$('.tree-folder-items .dropdown-toggle').click(function(){
-		$('.tree').addClass('treepadding');
-		$(document.body).trigger("sticky_kit:recalc");
-	});
-
-	init_sticky_column();
 }
 
 function init_shortcuts() {
 	if (!(window.shortcut && window.shortcuts)) {
 		if (window.console) {
-			console.log('FreshRSS waiting for sortcut.js…');
+			console.log('FreshRSS waiting for shortcut.js…');
 		}
 		window.setTimeout(init_shortcuts, 200);
 		return;
@@ -854,8 +841,10 @@ function init_stream(divStream) {
 	}
 }
 
+var $nav_entries = null;
+
 function init_nav_entries() {
-	var $nav_entries = $('#nav_entries');
+	$nav_entries = $('#nav_entries');
 	$nav_entries.find('.previous_entry').click(function () {
 		prev_entry();
 		return false;
@@ -1193,7 +1182,6 @@ function load_more_posts() {
 		$('#load_more').removeClass('loading');
 		$('#bigMarkAsRead').removeAttr('disabled');
 		load_more = false;
-		$(document.body).trigger('sticky_kit:recalc');
 	});
 }
 
@@ -1286,7 +1274,59 @@ function init_crypto_form() {
 }
 //</crypto form (Web login)>
 
+var sidebar = document.getElementById('sidebar');
+var useJsScrollbar = true;
+try {
+	/*jshint -W018 */
+	useJsScrollbar = sidebar && !CSS.supports('scrollbar-color: auto') &&
+		!(parseInt(getComputedStyle(sidebar, '::-webkit-scrollbar').width) < sidebar.offsetWidth);
+	/*jshint +W018 */
+} catch (ex) {
+}
+if (useJsScrollbar) {
+	inject_script('simple-scrollbar.min.js');
+}
+
+function sticky_recalc() {
+	var h = 0;
+	if ($nav_entries && $nav_entries.length > 0) {
+		h = $(window).height() - sidebar.getBoundingClientRect().top - $nav_entries.height();
+	} else {
+		h = $(window).height() - sidebar.getBoundingClientRect().top;
+	}
+	if (h > 0) {
+		$(sidebar).height(h);
+	}
+}
+
+function init_simple_scrollbar() {
+	if (!window.SimpleScrollbar) {
+		if (window.console) {
+			console.log('FreshRSS waiting for simple-scrollbar…');
+		}
+		window.setTimeout(init_simple_scrollbar, 100);
+	} else {
+		SimpleScrollbar.initEl(sidebar);
+	}
+}
 
+var scrollTimeout;
+function init_sticky_sidebar(){
+	if (!sidebar) {
+		return;
+	}
+	if (useJsScrollbar) {
+		init_simple_scrollbar();
+	}
+	$(window).scroll(function () {
+		if (scrollTimeout) {
+			clearTimeout(scrollTimeout);
+			scrollTimeout = null;
+		}
+		scrollTimeout = setTimeout(sticky_recalc, 200);
+	});
+	window.onresize = sticky_recalc;
+}
 
 function init_confirm_action() {
 	$('body').on('click', '.confirm', function () {
@@ -1536,7 +1576,6 @@ function init_beforeDOM() {
 		return;
 	}
 	if (['normal', 'reader', 'global'].indexOf(context.current_view) >= 0) {
-		inject_script('jquery.sticky-kit.min.js');
 		init_normal();
 	}
 }
@@ -1554,6 +1593,7 @@ function init_afterDOM() {
 	$stream = $('#stream');
 	if ($stream.length > 0) {
 		init_load_more($stream);
+		init_sticky_sidebar();
 		init_posts();
 		init_nav_entries();
 		init_dynamic_tags();
diff --git a/p/scripts/simple-scrollbar.min.js b/p/scripts/simple-scrollbar.min.js
new file mode 100644
index 000000000..36b7df0b8
--- /dev/null
+++ b/p/scripts/simple-scrollbar.min.js
@@ -0,0 +1,2 @@
+// https://github.com/buzinas/simple-scrollbar
+!function(t,e){"object"==typeof exports?module.exports=e(window,document):t.SimpleScrollbar=e(window,document)}(this,function(t,e){function s(t){Object.prototype.hasOwnProperty.call(t,"data-simple-scrollbar")||Object.defineProperty(t,"data-simple-scrollbar",{value:new o(t)})}function i(t,s){function i(t){var e=t.pageY-a;a=t.pageY,n(function(){s.el.scrollTop+=e/s.scrollRatio})}function r(){t.classList.remove("ss-grabbed"),e.body.classList.remove("ss-grabbed"),e.removeEventListener("mousemove",i),e.removeEventListener("mouseup",r)}var a;t.addEventListener("mousedown",function(s){return a=s.pageY,t.classList.add("ss-grabbed"),e.body.classList.add("ss-grabbed"),e.addEventListener("mousemove",i),e.addEventListener("mouseup",r),!1})}function r(t){for(this.target=t,this.direction=window.getComputedStyle(this.target).direction,this.bar='<div class="ss-scroll">',this.wrapper=e.createElement("div"),this.wrapper.setAttribute("class","ss-wrapper"),this.el=e.createElement("div"),this.el.setAttribute("class","ss-content"),"rtl"===this.direction&&this.el.classList.add("rtl"),this.wrapper.appendChild(this.el);this.target.firstChild;)this.el.appendChild(this.target.firstChild);this.target.appendChild(this.wrapper),this.target.insertAdjacentHTML("beforeend",this.bar),this.bar=this.target.lastChild,i(this.bar,this),this.moveBar(),this.el.addEventListener("scroll",this.moveBar.bind(this)),this.el.addEventListener("mouseenter",this.moveBar.bind(this)),this.target.classList.add("ss-container");var s=window.getComputedStyle(t);"0px"===s.height&&"0px"!==s["max-height"]&&(t.style.height=s["max-height"])}function a(){for(var t=e.querySelectorAll("*[ss-container]"),i=0;i<t.length;i++)s(t[i])}var n=t.requestAnimationFrame||t.setImmediate||function(t){return setTimeout(t,0)};r.prototype={moveBar:function(t){var e=this.el.scrollHeight,s=this.el.clientHeight,i=this;this.scrollRatio=s/e;var r="rtl"===i.direction,a=r?i.target.clientWidth-i.bar.clientWidth+18:-1*(i.target.clientWidth-i.bar.clientWidth);n(function(){i.scrollRatio>=1?i.bar.classList.add("ss-hidden"):(i.bar.classList.remove("ss-hidden"),i.bar.style.cssText="height:"+Math.max(100*i.scrollRatio,10)+"%; top:"+i.el.scrollTop/e*100+"%;right:"+a+"px;")})}},e.addEventListener("DOMContentLoaded",a),r.initEl=s,r.initAll=a;var o=r;return o});
\ No newline at end of file
diff --git a/p/themes/BlueLagoon/BlueLagoon.css b/p/themes/BlueLagoon/BlueLagoon.css
index f167f2051..263764a9c 100644
--- a/p/themes/BlueLagoon/BlueLagoon.css
+++ b/p/themes/BlueLagoon/BlueLagoon.css
@@ -564,6 +564,32 @@ a.btn {
 	color: #0090FF
 }
 
+/*=== Scrollbar */
+
+@supports (scrollbar-width: thin) {
+	#sidebar {
+		scrollbar-color: rgba(255, 255, 255, 0.05) rgba(0, 0, 0, 0.0);
+	}
+	#sidebar:hover {
+		scrollbar-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.0);
+	}
+}
+.ss-scroll {
+	background: rgba(255, 255, 255, 0.1);
+}
+.ss-container:hover .ss-scroll,
+.ss-container:active .ss-scroll {
+	background: rgba(255, 255, 255, 0.3);
+}
+@supports not (scrollbar-width: thin) {
+	#sidebar::-webkit-scrollbar-thumb {
+		background: rgba(255, 255, 255, 0.1);
+	}
+	#sidebar:hover::-webkit-scrollbar-thumb {
+		background: rgba(255, 255, 255, 0.3);
+	}
+}
+
 /*=== STRUCTURE */
 /*===============*/
 /*=== Header */
diff --git a/p/themes/Dark/dark.css b/p/themes/Dark/dark.css
index 31ff514a2..b8366caeb 100644
--- a/p/themes/Dark/dark.css
+++ b/p/themes/Dark/dark.css
@@ -502,6 +502,31 @@ a.btn {
 	color: #888;
 }
 
+/*=== Scrollbar */
+@supports (scrollbar-width: thin) {
+	#sidebar {
+		scrollbar-color: rgba(255, 255, 255, 0.05) rgba(0, 0, 0, 0.0);
+	}
+	#sidebar:hover {
+		scrollbar-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.0);
+	}
+}
+.ss-scroll {
+	background: rgba(255, 255, 255, 0.1);
+}
+.ss-container:hover .ss-scroll,
+.ss-container:active .ss-scroll {
+	background: rgba(255, 255, 255, 0.3);
+}
+@supports not (scrollbar-width: thin) {
+	#sidebar::-webkit-scrollbar-thumb {
+		background: rgba(255, 255, 255, 0.1);
+	}
+	#sidebar:hover::-webkit-scrollbar-thumb {
+		background: rgba(255, 255, 255, 0.3);
+	}
+}
+
 /*=== STRUCTURE */
 /*===============*/
 /*=== Header */
diff --git a/p/themes/Flat/flat.css b/p/themes/Flat/flat.css
index be047a394..176a541f7 100644
--- a/p/themes/Flat/flat.css
+++ b/p/themes/Flat/flat.css
@@ -505,6 +505,31 @@ a.btn {
 	color: #fff;
 }
 
+/*=== Scrollbar */
+@supports (scrollbar-width: thin) {
+	#sidebar {
+		scrollbar-color: rgba(255, 255, 255, 0.05) rgba(0, 0, 0, 0.0);
+	}
+	#sidebar:hover {
+		scrollbar-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.0);
+	}
+}
+.ss-scroll {
+	background: rgba(255, 255, 255, 0.1);
+}
+.ss-container:hover .ss-scroll,
+.ss-container:active .ss-scroll {
+	background: rgba(255, 255, 255, 0.3);
+}
+@supports not (scrollbar-width: thin) {
+	#sidebar::-webkit-scrollbar-thumb {
+		background: rgba(255, 255, 255, 0.1);
+	}
+	#sidebar:hover::-webkit-scrollbar-thumb {
+		background: rgba(255, 255, 255, 0.3);
+	}
+}
+
 /*=== STRUCTURE */
 /*===============*/
 /*=== Header */
diff --git a/p/themes/Screwdriver/screwdriver.css b/p/themes/Screwdriver/screwdriver.css
index 1bc49c2db..b92dbac3e 100644
--- a/p/themes/Screwdriver/screwdriver.css
+++ b/p/themes/Screwdriver/screwdriver.css
@@ -559,6 +559,31 @@ a.btn {
 .tree-folder-items > .item.active > a {
 }
 
+/*=== Scrollbar */
+@supports (scrollbar-width: thin) {
+	#sidebar {
+		scrollbar-color: rgba(255, 255, 255, 0.05) rgba(0, 0, 0, 0.0);
+	}
+	#sidebar:hover {
+		scrollbar-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.0);
+	}
+}
+.ss-scroll {
+	background: rgba(255, 255, 255, 0.1);
+}
+.ss-container:hover .ss-scroll,
+.ss-container:active .ss-scroll {
+	background: rgba(255, 255, 255, 0.3);
+}
+@supports not (scrollbar-width: thin) {
+	#sidebar::-webkit-scrollbar-thumb {
+		background: rgba(255, 255, 255, 0.1);
+	}
+	#sidebar:hover::-webkit-scrollbar-thumb {
+		background: rgba(255, 255, 255, 0.3);
+	}
+}
+
 /*=== STRUCTURE */
 /*===============*/
 /*=== Header */
diff --git a/p/themes/Swage/swage.css b/p/themes/Swage/swage.css
index 8f262da8c..a8ff0bdd5 100644
--- a/p/themes/Swage/swage.css
+++ b/p/themes/Swage/swage.css
@@ -529,6 +529,32 @@ text-decoration: none;
 color: #FCFCFC;
 }
 
+@supports (scrollbar-width: thin) {
+ #sidebar {
+scrollbar-color: rgba(255, 255, 255, 0.05) rgba(0, 0, 0, 0.0);
+}
+#sidebar:hover {
+scrollbar-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.0);
+}
+}
+
+.ss-scroll {
+background: rgba(255, 255, 255, 0.1);
+}
+.ss-container:hover .ss-scroll,
+.ss-container:active .ss-scroll {
+background: rgba(255, 255, 255, 0.3);
+}
+
+@supports not (scrollbar-width: thin) {
+#sidebar::-webkit-scrollbar-thumb {
+background: rgba(255, 255, 255, 0.1);
+}
+#sidebar:hover::-webkit-scrollbar-thumb {
+background: rgba(255, 255, 255, 0.3);
+}
+}
+
 .header > .item {
 vertical-align: middle;
 }
diff --git a/p/themes/Swage/swage.scss b/p/themes/Swage/swage.scss
index c0c76cf14..8ddac14db 100644
--- a/p/themes/Swage/swage.scss
+++ b/p/themes/Swage/swage.scss
@@ -351,7 +351,7 @@ form {
 			> a {
 				min-width: initial;
 				white-space: nowrap;
-			} 
+			}
 			&:hover {
 				background: $color_nav;
 				color: $color_light;
@@ -603,6 +603,32 @@ form {
 	}
 }
 
+@supports (scrollbar-width: thin) {
+	#sidebar {
+		scrollbar-color: rgba(255, 255, 255, 0.05) rgba(0, 0, 0, 0.0);
+	}
+	#sidebar:hover {
+		scrollbar-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.0);
+	}
+}
+
+.ss-scroll {
+	background: rgba(255, 255, 255, 0.1);
+}
+.ss-container:hover .ss-scroll,
+.ss-container:active .ss-scroll {
+	background: rgba(255, 255, 255, 0.3);
+}
+
+@supports not (scrollbar-width: thin) {
+	#sidebar::-webkit-scrollbar-thumb {
+		background: rgba(255, 255, 255, 0.1);
+	}
+	#sidebar:hover::-webkit-scrollbar-thumb {
+		background: rgba(255, 255, 255, 0.3);
+	}
+}
+
 .header {
 	> .item {
 		vertical-align: middle;
@@ -918,7 +944,7 @@ form {
 	#global {
 		height: 0;
 	}
-	
+
 	.header {
 		height: 55px;
 		background: $color_aside;
@@ -936,7 +962,7 @@ form {
 		color: $color_light;
 		padding-left: 5px;
 	}
-	
+
 	input {
 		border-left: 5px solid;
 		border-right: 1px darken( $color_light, 10%);
@@ -984,7 +1010,7 @@ form {
 	.dropdown-header, .dropdown-menu > .item {
 		padding: 12px;
 	}
-	
+
 	#new-article {
 		width: 100%;
 		bottom: initial;
@@ -1207,5 +1233,5 @@ button.as-link {
 			background: inital;
 		}
 	}
-	
-}
\ No newline at end of file
+
+}
diff --git a/p/themes/base-theme/template.css b/p/themes/base-theme/template.css
index fdc2f884e..60c4822ef 100644
--- a/p/themes/base-theme/template.css
+++ b/p/themes/base-theme/template.css
@@ -109,7 +109,7 @@ input[type="checkbox"] {
 	min-height: 15px !important;
 }
 .dropdown-menu label > input[type="text"] {
-	with: 150px;
+	width: 150px;
 	width: calc(99% - 5em);
 }
 .dropdown-menu input[type="checkbox"] {
@@ -168,6 +168,13 @@ td.numeric {
 	display: block;
 }
 
+@supports (position: sticky) {
+	#mark-read-aside {
+		position: sticky;
+		top: 0;
+	}
+}
+
 /*=== Buttons */
 .stick {
 	display: inline-block;
@@ -273,6 +280,7 @@ a.btn {
 	left: 0; right: 0;
 	display: block;
 	z-index: -10;
+    cursor: default;
 }
 .separator {
 	display: block;
@@ -373,16 +381,90 @@ a.btn {
 	cursor: grab;
 }
 
+/*=== Scrollbar */
+.ss-wrapper {
+	overflow: hidden;
+	width: 100%;
+	height: 100%;
+	position: relative;
+	z-index: 1;
+	float: left;
+}
+
+.ss-content {
+	height: 100%;
+	width: calc(100% + 18px);
+	padding: 0 0 0 0;
+	position: relative;
+	overflow-y: scroll;
+	box-sizing: border-box;
+}
+
+.ss-content.rtl {
+	width: calc(100% + 18px);
+	right: auto;
+}
+
+.ss-scroll {
+	position: relative;
+	background: rgba(0, 0, 0, 0.1);
+	width: 9px;
+	border-radius: 4px;
+	top: 0;
+	z-index: 2;
+	cursor: pointer;
+	transition: opacity 0.25s linear;
+}
+
+.ss-hidden {
+	display: none;
+}
+
+.ss-container:hover .ss-scroll,
+.ss-container:active .ss-scroll {
+	background: rgba(0, 0, 0, 0.3);
+}
+
+.ss-grabbed {
+	-o-user-select: none;
+	-ms-user-select: none;
+	-moz-user-select: none;
+	-webkit-user-select: none;
+	user-select: none;
+}
+
+@supports (scrollbar-width: thin) {
+	#sidebar {
+		overflow-y: scroll;
+		scrollbar-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.05);
+		scrollbar-width: thin;
+	}
+	#sidebar:hover {
+		scrollbar-color: rgba(0, 0, 0, 0.3) rgba(0, 0, 0, 0.05);
+	}
+}
+
+@supports not (scrollbar-width: thin) {
+	#sidebar::-webkit-scrollbar {
+		background: rgba(0, 0, 0, 0.05);
+		width: 8px;
+	}
+	#sidebar::-webkit-scrollbar-thumb {
+		background: rgba(0, 0, 0, 0.1);
+		border-radius: 5px;
+		display: unset;
+	}
+	#sidebar:hover::-webkit-scrollbar-thumb {
+		background: rgba(0, 0, 0, 0.3);
+	}
+}
+
 /*=== Tree */
 .tree {
 	margin: 0;
-	padding: 0 0 2em 0;
 	list-style: none;
 	text-align: left;
-}
-
-.treepadding {
-	padding: 0 0 15em 0;
+	overflow-x: hidden;
 }
 
 .tree-folder-items {
@@ -412,6 +494,10 @@ a.btn {
 	white-space: nowrap;
 	text-overflow: ellipsis;
 }
+.tree-bottom {
+	visibility: hidden;
+	margin-bottom: 15em;
+}
 
 /*=== STRUCTURE */
 /*===============*/
@@ -914,7 +1000,6 @@ pre.enclosure-description {
 	}
 	.aside:target {
 		width: 90%;
-		overflow: auto;
 	}
 
 	.flux_header .item.website {
-- 
cgit v1.2.3


From 983aa587ee71a83d21b17de29d2a26763b18292e Mon Sep 17 00:00:00 2001
From: Patrick Crandol <patrick@crandol.com>
Date: Sat, 15 Dec 2018 04:56:38 -0500
Subject: Add aside_feed to reader view (#2180)

* Add Nav menu to reader mode

At this point, it appears to be non-functional in reader mode.

* Add aside_feed toggle to reader view

* make init_column_categories work in reader view

* Make sidebar links redirect to proper view

* CSS to support toggleable sidebar in reader view

* remove unneeded !important
---
 app/layout/aside_feed.phtml      | 15 ++++++++-------
 app/layout/nav_menu.phtml        |  2 +-
 app/views/index/reader.phtml     |  1 +
 p/scripts/main.js                |  2 +-
 p/themes/base-theme/template.css | 23 +++++++++++++++++++++++
 5 files changed, 34 insertions(+), 9 deletions(-)

(limited to 'p/themes/base-theme/template.css')

diff --git a/app/layout/aside_feed.phtml b/app/layout/aside_feed.phtml
index 73b200686..5efaa54d1 100644
--- a/app/layout/aside_feed.phtml
+++ b/app/layout/aside_feed.phtml
@@ -1,4 +1,5 @@
 <?php
+	$actual_view = Minz_Request::actionName();
 	$class = '';
 	if (FreshRSS_Context::$user_conf->hide_read_feeds &&
 			FreshRSS_Context::isStateEnabled(FreshRSS_Entry::STATE_NOT_READ) &&
@@ -24,13 +25,13 @@
 	<ul id="sidebar" class="tree">
 		<li class="tree-folder category all<?php echo FreshRSS_Context::isCurrentGet('a') ? ' active' : ''; ?>">
 			<div class="tree-folder-title">
-				<?php echo _i('all'); ?> <a class="title" data-unread="<?php echo format_number(FreshRSS_Context::$total_unread); ?>" href="<?php echo _url('index', 'index'); ?>"><?php echo _t('index.menu.main_stream'); ?></a>
+				<?php echo _i('all'); ?> <a class="title" data-unread="<?php echo format_number(FreshRSS_Context::$total_unread); ?>" href="<?php echo _url('index', $actual_view); ?>"><?php echo _t('index.menu.main_stream'); ?></a>
 			</div>
 		</li>
 
 		<li class="tree-folder category favorites<?php echo FreshRSS_Context::isCurrentGet('s') ? ' active' : ''; ?>">
 			<div class="tree-folder-title">
-				<?php echo _i('bookmark'); ?> <a class="title" data-unread="<?php echo format_number(FreshRSS_Context::$total_starred['unread']); ?>" href="<?php echo _url('index', 'index', 'get', 's'); ?>"><?php echo _t('index.menu.favorites', format_number(FreshRSS_Context::$total_starred['all'])); ?></a>
+				<?php echo _i('bookmark'); ?> <a class="title" data-unread="<?php echo format_number(FreshRSS_Context::$total_starred['unread']); ?>" href="<?php echo _url('index', $actual_view, 'get', 's'); ?>"><?php echo _t('index.menu.favorites', format_number(FreshRSS_Context::$total_starred['all'])); ?></a>
 			</div>
 		</li>
 
@@ -40,7 +41,7 @@
 		<li class="tree-folder category tags<?php echo $t_active ? ' active' : ''; ?>">
 			<div class="tree-folder-title">
 				<a class="dropdown-toggle" href="#"><?php echo _i($t_active ? 'up' : 'down'); ?></a>
-				<a class="title" data-unread="<?php echo format_number($this->nbUnreadTags); ?>" href="<?php echo _url('index', 'index', 'get', 'T'); ?>"><?php echo _t('index.menu.tags'); ?></a>
+				<a class="title" data-unread="<?php echo format_number($this->nbUnreadTags); ?>" href="<?php echo _url('index', $actual_view, 'get', 'T'); ?>"><?php echo _t('index.menu.tags'); ?></a>
 			</div>
 			<ul class="tree-folder-items<?php echo $t_active ? ' active' : ''; ?>">
 				<?php
@@ -52,7 +53,7 @@
 						<a class="dropdown-toggle"><?php echo _i('configure'); ?></a>
 						<?php /* tag_config_template */ ?>
 					</div>
-					<?php echo FreshRSS_Themes::alt('label'); ?> <a class="item-title" data-unread="<?php echo format_number($tag->nbUnread()); ?>" href="<?php echo _url('index', 'index', 'get', 't_' . $tag->id()); ?>"><?php echo $tag->name(); ?></a>
+					<?php echo FreshRSS_Themes::alt('label'); ?> <a class="item-title" data-unread="<?php echo format_number($tag->nbUnread()); ?>" href="<?php echo _url('index', $actual_view, 'get', 't_' . $tag->id()); ?>"><?php echo $tag->name(); ?></a>
 				</li>
 				<?php endforeach; ?>
 			</ul>
@@ -69,7 +70,7 @@
 		<li class="tree-folder category<?php echo $c_active ? ' active' : ''; ?>" data-unread="<?php echo $cat->nbNotRead(); ?>">
 			<div class="tree-folder-title">
 				<a class="dropdown-toggle" href="#"><?php echo _i($c_show ? 'up' : 'down'); ?></a>
-				<a class="title<?php echo $cat->hasFeedsWithError() ? ' error' : ''; ?>" data-unread="<?php echo format_number($cat->nbNotRead()); ?>" href="<?php echo _url('index', 'index', 'get', 'c_' . $cat->id()); ?>"><?php echo $cat->name(); ?></a>
+				<a class="title<?php echo $cat->hasFeedsWithError() ? ' error' : ''; ?>" data-unread="<?php echo format_number($cat->nbNotRead()); ?>" href="<?php echo _url('index', $actual_view, 'get', 'c_' . $cat->id()); ?>"><?php echo $cat->name(); ?></a>
 			</div>
 
 			<ul class="tree-folder-items<?php echo $c_show ? ' active' : ''; ?>">
@@ -83,7 +84,7 @@
 						<a class="dropdown-toggle" data-fweb="<?php echo $feed->website(); ?>"><?php echo _i('configure'); ?></a>
 						<?php /* feed_config_template */ ?>
 					</div>
-					<img class="favicon" src="<?php echo $feed->favicon(); ?>" alt="✇" /> <a class="item-title" data-unread="<?php echo format_number($feed->nbNotRead()); ?>" href="<?php echo _url('index', 'index', 'get', 'f_' . $feed->id()); ?>"><?php echo $feed->name(); ?></a>
+					<img class="favicon" src="<?php echo $feed->favicon(); ?>" alt="✇" /> <a class="item-title" data-unread="<?php echo format_number($feed->nbNotRead()); ?>" href="<?php echo _url('index', $actual_view, 'get', 'f_' . $feed->id()); ?>"><?php echo $feed->name(); ?></a>
 				</li>
 				<?php } ?>
 			</ul>
@@ -111,7 +112,7 @@
 <script id="feed_config_template" type="text/html">
 	<ul class="dropdown-menu">
 		<li class="dropdown-close"><a href="#close">❌</a></li>
-		<li class="item"><a href="<?php echo _url('index', 'index', 'get', 'f_------'); ?>"><?php echo _t('gen.action.filter'); ?></a></li>
+		<li class="item"><a href="<?php echo _url('index', $actual_view, 'get', 'f_------'); ?>"><?php echo _t('gen.action.filter'); ?></a></li>
 		<?php if (FreshRSS_Auth::hasAccess()) { ?>
 		<li class="item"><a href="<?php echo _url('stats', 'repartition', 'id', '------'); ?>"><?php echo _t('index.menu.stats'); ?></a></li>
 		<?php } ?>
diff --git a/app/layout/nav_menu.phtml b/app/layout/nav_menu.phtml
index 88f882db9..4d860a54c 100644
--- a/app/layout/nav_menu.phtml
+++ b/app/layout/nav_menu.phtml
@@ -1,7 +1,7 @@
 <?php $actual_view = Minz_Request::actionName(); ?>
 
 <div class="nav_menu">
-	<?php if ($actual_view === 'normal') { ?>
+	<?php if ($actual_view === 'normal' || $actual_view === 'reader' ) { ?>
 	<a class="btn toggle_aside" href="#aside_feed"><?php echo _i('category'); ?></a>
 	<?php } ?>
 
diff --git a/app/views/index/reader.phtml b/app/views/index/reader.phtml
index c15b936ee..2f03331b7 100644
--- a/app/views/index/reader.phtml
+++ b/app/views/index/reader.phtml
@@ -1,4 +1,5 @@
 <?php
+$this->partial('aside_feed');
 $this->partial('nav_menu');
 
 flush();
diff --git a/p/scripts/main.js b/p/scripts/main.js
index 0f05a5bf6..6331efc75 100644
--- a/p/scripts/main.js
+++ b/p/scripts/main.js
@@ -536,7 +536,7 @@ function inject_script(name) {
 }
 
 function init_column_categories() {
-	if (context.current_view !== 'normal') {
+	if (context.current_view !== 'normal' && context.current_view !== 'reader') {
 		return;
 	}
 
diff --git a/p/themes/base-theme/template.css b/p/themes/base-theme/template.css
index 60c4822ef..7ffce3530 100644
--- a/p/themes/base-theme/template.css
+++ b/p/themes/base-theme/template.css
@@ -960,6 +960,29 @@ pre.enclosure-description {
 	white-space: pre-line;
 }
 
+/*=== READER */
+/*===========*/
+.reader .nav_menu .toggle_aside {
+	display: inline-block;
+}
+
+.reader .aside .toggle_aside {
+	display: block;
+	width: 100%;
+}
+
+.reader .aside {
+	width: 0;
+}
+
+.reader .aside:target {
+	width: 300px;
+}
+
+.reader .aside .stick {
+	display: none;
+}
+
 /*=== MOBILE */
 /*===========*/
 @media(max-width: 840px) {
-- 
cgit v1.2.3


From 483c698f9a75636e472737872dcc33a4906b9ed9 Mon Sep 17 00:00:00 2001
From: Alexandre Alapetite <alexandre@alapetite.fr>
Date: Sun, 16 Dec 2018 12:49:23 +0100
Subject: JavaScript-free scrollbar (#2181)

* JavaScript-free scrollbar

Make scrollbar work without JavaScript
https://github.com/FreshRSS/FreshRSS/pull/2117#discussion_r240804225
Also implies a better support of resize scenarios.
Seems to fix at the same time the occasional glitches
https://github.com/FreshRSS/FreshRSS/pull/2117#issuecomment-447556038

* Firefox 64-66 workaround

Workaround for Gecko bug in Firefox 64-66. Avoid showing the scrollbar
all the time, at the cost of a slight reflow (therefore targetting only
Gecko).

* Improvement of Firefox workaround

* Minor comment

* Unneeded check

* Even better

* Partial Edge fix

* More margin for tree bottom
---
 p/scripts/main.js                | 16 ++++++++++------
 p/themes/base-theme/template.css |  6 +++---
 2 files changed, 13 insertions(+), 9 deletions(-)

(limited to 'p/themes/base-theme/template.css')

diff --git a/p/scripts/main.js b/p/scripts/main.js
index 6331efc75..c8d520ef7 100644
--- a/p/scripts/main.js
+++ b/p/scripts/main.js
@@ -551,7 +551,13 @@ function init_column_categories() {
 			}
 		});
 		$(this).parent().next(".tree-folder-items").slideToggle(300, function () {
-			if (useJsScrollbar && sidebar && typeof(Event) === 'function') { //Refresh JS scrollbar
+			if (!useJsScrollbar &&	//Workaround for Gecko bug in Firefox 64-65(+?):
+				sidebar.scrollHeight > sidebar.clientHeight &&	//if needs scrollbar
+				sidebar.scrollWidth >= sidebar.offsetWidth) {	//but no scrollbar
+				sidebar.style['overflow-y'] = 'scroll';	//then force scrollbar
+				setTimeout(function () { sidebar.style['overflow-y'] = ''; }, 0);
+			}
+			if (useJsScrollbar && typeof(Event) === 'function') { //Refresh JS scrollbar
 				sidebar.querySelector('.ss-content').dispatchEvent(new Event('scroll'));
 			}
 		});
@@ -1279,7 +1285,7 @@ var useJsScrollbar = true;
 try {
 	/*jshint -W018 */
 	useJsScrollbar = sidebar && !CSS.supports('scrollbar-color: auto') &&
-		!(parseInt(getComputedStyle(sidebar, '::-webkit-scrollbar').width) < sidebar.offsetWidth);
+		!(parseInt(getComputedStyle(sidebar, '::-webkit-scrollbar').width) < sidebar.scrollWidth);
 	/*jshint +W018 */
 } catch (ex) {
 }
@@ -1312,12 +1318,10 @@ function init_simple_scrollbar() {
 
 var scrollTimeout;
 function init_sticky_sidebar(){
-	if (!sidebar) {
+	if (!useJsScrollbar) {
 		return;
 	}
-	if (useJsScrollbar) {
-		init_simple_scrollbar();
-	}
+	init_simple_scrollbar();
 	$(window).scroll(function () {
 		if (scrollTimeout) {
 			clearTimeout(scrollTimeout);
diff --git a/p/themes/base-theme/template.css b/p/themes/base-theme/template.css
index 7ffce3530..86c985d0c 100644
--- a/p/themes/base-theme/template.css
+++ b/p/themes/base-theme/template.css
@@ -435,7 +435,7 @@ a.btn {
 
 @supports (scrollbar-width: thin) {
 	#sidebar {
-		overflow-y: scroll;
+		overflow-y: auto;
 		scrollbar-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.05);
 		scrollbar-width: thin;
 	}
@@ -462,6 +462,7 @@ a.btn {
 /*=== Tree */
 .tree {
 	margin: 0;
+	max-height: 99vh;
 	list-style: none;
 	text-align: left;
 	overflow-x: hidden;
@@ -496,7 +497,7 @@ a.btn {
 }
 .tree-bottom {
 	visibility: hidden;
-	margin-bottom: 15em;
+	margin-bottom: 18em;
 }
 
 /*=== STRUCTURE */
@@ -536,7 +537,6 @@ a.btn {
 }
 .aside {
 	display: table-cell;
-	height: 100%;
 	width: 300px;
 	vertical-align: top;
 }
-- 
cgit v1.2.3


From e0e96d6a13788c539be1bcce3cde0a1d614ff2c3 Mon Sep 17 00:00:00 2001
From: Alexandre Alapetite <alexandre@alapetite.fr>
Date: Sun, 16 Dec 2018 15:04:46 +0100
Subject: Remove simple-scrollbar fallback (#2182)

https://github.com/FreshRSS/FreshRSS/pull/2181#issuecomment-447636787
---
 README.fr.md                         |  1 -
 README.md                            |  1 -
 p/scripts/main.js                    | 71 ++----------------------------------
 p/scripts/simple-scrollbar.min.js    |  2 -
 p/themes/BlueLagoon/BlueLagoon.css   |  7 ----
 p/themes/Dark/dark.css               |  7 ----
 p/themes/Flat/flat.css               |  7 ----
 p/themes/Screwdriver/screwdriver.css |  7 ----
 p/themes/Swage/swage.css             |  8 ----
 p/themes/Swage/swage.scss            |  8 ----
 p/themes/base-theme/template.css     | 51 --------------------------
 11 files changed, 4 insertions(+), 166 deletions(-)
 delete mode 100644 p/scripts/simple-scrollbar.min.js

(limited to 'p/themes/base-theme/template.css')

diff --git a/README.fr.md b/README.fr.md
index 1cf1c07a0..9db5907a0 100644
--- a/README.fr.md
+++ b/README.fr.md
@@ -209,7 +209,6 @@ Tout client supportant une API de type Fever ; Sélection :
 ## Uniquement pour certaines options ou configurations
 * [bcrypt.js](https://github.com/dcodeIO/bcrypt.js)
 * [phpQuery](https://github.com/phpquery/phpquery)
-* [simple-scrollbar](https://github.com/buzinas/simple-scrollbar)
 
 ## Si les fonctions natives ne sont pas disponibles
 * [Services_JSON](https://pear.php.net/pepr/pepr-proposal-show.php?id=198)
diff --git a/README.md b/README.md
index a97edc736..1904dad2c 100644
--- a/README.md
+++ b/README.md
@@ -209,7 +209,6 @@ Supported clients are:
 ## Only for some options or configurations
 * [bcrypt.js](https://github.com/dcodeIO/bcrypt.js)
 * [phpQuery](https://github.com/phpquery/phpquery)
-* [simple-scrollbar](https://github.com/buzinas/simple-scrollbar)
 
 ## If native functions are not available
 * [Services_JSON](https://pear.php.net/pepr/pepr-proposal-show.php?id=198)
diff --git a/p/scripts/main.js b/p/scripts/main.js
index c8d520ef7..4ba329dc1 100644
--- a/p/scripts/main.js
+++ b/p/scripts/main.js
@@ -1,5 +1,5 @@
 "use strict";
-/* globals $, jQuery, context, i18n, shortcut, shortcuts, SimpleScrollbar, url */
+/* globals $, jQuery, context, i18n, shortcut, shortcuts, url */
 /* jshint strict:global */
 
 var $stream = null,
@@ -527,14 +527,6 @@ function init_posts() {
 	}
 }
 
-function inject_script(name) {
-	var script = document.createElement('script');
-	script.async = 'async';
-	script.defer = 'defer';
-	script.src = '../scripts/' + name;
-	document.head.appendChild(script);
-}
-
 function init_column_categories() {
 	if (context.current_view !== 'normal' && context.current_view !== 'reader') {
 		return;
@@ -551,15 +543,13 @@ function init_column_categories() {
 			}
 		});
 		$(this).parent().next(".tree-folder-items").slideToggle(300, function () {
-			if (!useJsScrollbar &&	//Workaround for Gecko bug in Firefox 64-65(+?):
-				sidebar.scrollHeight > sidebar.clientHeight &&	//if needs scrollbar
+			//Workaround for Gecko bug in Firefox 64-65(+?):
+			var sidebar = document.getElementById('sidebar');
+			if (sidebar && sidebar.scrollHeight > sidebar.clientHeight &&	//if needs scrollbar
 				sidebar.scrollWidth >= sidebar.offsetWidth) {	//but no scrollbar
 				sidebar.style['overflow-y'] = 'scroll';	//then force scrollbar
 				setTimeout(function () { sidebar.style['overflow-y'] = ''; }, 0);
 			}
-			if (useJsScrollbar && typeof(Event) === 'function') { //Refresh JS scrollbar
-				sidebar.querySelector('.ss-content').dispatchEvent(new Event('scroll'));
-			}
 		});
 		return false;
 	});
@@ -1280,58 +1270,6 @@ function init_crypto_form() {
 }
 //</crypto form (Web login)>
 
-var sidebar = document.getElementById('sidebar');
-var useJsScrollbar = true;
-try {
-	/*jshint -W018 */
-	useJsScrollbar = sidebar && !CSS.supports('scrollbar-color: auto') &&
-		!(parseInt(getComputedStyle(sidebar, '::-webkit-scrollbar').width) < sidebar.scrollWidth);
-	/*jshint +W018 */
-} catch (ex) {
-}
-if (useJsScrollbar) {
-	inject_script('simple-scrollbar.min.js');
-}
-
-function sticky_recalc() {
-	var h = 0;
-	if ($nav_entries && $nav_entries.length > 0) {
-		h = $(window).height() - sidebar.getBoundingClientRect().top - $nav_entries.height();
-	} else {
-		h = $(window).height() - sidebar.getBoundingClientRect().top;
-	}
-	if (h > 0) {
-		$(sidebar).height(h);
-	}
-}
-
-function init_simple_scrollbar() {
-	if (!window.SimpleScrollbar) {
-		if (window.console) {
-			console.log('FreshRSS waiting for simple-scrollbar…');
-		}
-		window.setTimeout(init_simple_scrollbar, 100);
-	} else {
-		SimpleScrollbar.initEl(sidebar);
-	}
-}
-
-var scrollTimeout;
-function init_sticky_sidebar(){
-	if (!useJsScrollbar) {
-		return;
-	}
-	init_simple_scrollbar();
-	$(window).scroll(function () {
-		if (scrollTimeout) {
-			clearTimeout(scrollTimeout);
-			scrollTimeout = null;
-		}
-		scrollTimeout = setTimeout(sticky_recalc, 200);
-	});
-	window.onresize = sticky_recalc;
-}
-
 function init_confirm_action() {
 	$('body').on('click', '.confirm', function () {
 		var str_confirmation = $(this).attr('data-str-confirm');
@@ -1597,7 +1535,6 @@ function init_afterDOM() {
 	$stream = $('#stream');
 	if ($stream.length > 0) {
 		init_load_more($stream);
-		init_sticky_sidebar();
 		init_posts();
 		init_nav_entries();
 		init_dynamic_tags();
diff --git a/p/scripts/simple-scrollbar.min.js b/p/scripts/simple-scrollbar.min.js
deleted file mode 100644
index 36b7df0b8..000000000
--- a/p/scripts/simple-scrollbar.min.js
+++ /dev/null
@@ -1,2 +0,0 @@
-// https://github.com/buzinas/simple-scrollbar
-!function(t,e){"object"==typeof exports?module.exports=e(window,document):t.SimpleScrollbar=e(window,document)}(this,function(t,e){function s(t){Object.prototype.hasOwnProperty.call(t,"data-simple-scrollbar")||Object.defineProperty(t,"data-simple-scrollbar",{value:new o(t)})}function i(t,s){function i(t){var e=t.pageY-a;a=t.pageY,n(function(){s.el.scrollTop+=e/s.scrollRatio})}function r(){t.classList.remove("ss-grabbed"),e.body.classList.remove("ss-grabbed"),e.removeEventListener("mousemove",i),e.removeEventListener("mouseup",r)}var a;t.addEventListener("mousedown",function(s){return a=s.pageY,t.classList.add("ss-grabbed"),e.body.classList.add("ss-grabbed"),e.addEventListener("mousemove",i),e.addEventListener("mouseup",r),!1})}function r(t){for(this.target=t,this.direction=window.getComputedStyle(this.target).direction,this.bar='<div class="ss-scroll">',this.wrapper=e.createElement("div"),this.wrapper.setAttribute("class","ss-wrapper"),this.el=e.createElement("div"),this.el.setAttribute("class","ss-content"),"rtl"===this.direction&&this.el.classList.add("rtl"),this.wrapper.appendChild(this.el);this.target.firstChild;)this.el.appendChild(this.target.firstChild);this.target.appendChild(this.wrapper),this.target.insertAdjacentHTML("beforeend",this.bar),this.bar=this.target.lastChild,i(this.bar,this),this.moveBar(),this.el.addEventListener("scroll",this.moveBar.bind(this)),this.el.addEventListener("mouseenter",this.moveBar.bind(this)),this.target.classList.add("ss-container");var s=window.getComputedStyle(t);"0px"===s.height&&"0px"!==s["max-height"]&&(t.style.height=s["max-height"])}function a(){for(var t=e.querySelectorAll("*[ss-container]"),i=0;i<t.length;i++)s(t[i])}var n=t.requestAnimationFrame||t.setImmediate||function(t){return setTimeout(t,0)};r.prototype={moveBar:function(t){var e=this.el.scrollHeight,s=this.el.clientHeight,i=this;this.scrollRatio=s/e;var r="rtl"===i.direction,a=r?i.target.clientWidth-i.bar.clientWidth+18:-1*(i.target.clientWidth-i.bar.clientWidth);n(function(){i.scrollRatio>=1?i.bar.classList.add("ss-hidden"):(i.bar.classList.remove("ss-hidden"),i.bar.style.cssText="height:"+Math.max(100*i.scrollRatio,10)+"%; top:"+i.el.scrollTop/e*100+"%;right:"+a+"px;")})}},e.addEventListener("DOMContentLoaded",a),r.initEl=s,r.initAll=a;var o=r;return o});
\ No newline at end of file
diff --git a/p/themes/BlueLagoon/BlueLagoon.css b/p/themes/BlueLagoon/BlueLagoon.css
index 263764a9c..94eb8e3a8 100644
--- a/p/themes/BlueLagoon/BlueLagoon.css
+++ b/p/themes/BlueLagoon/BlueLagoon.css
@@ -574,13 +574,6 @@ a.btn {
 		scrollbar-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.0);
 	}
 }
-.ss-scroll {
-	background: rgba(255, 255, 255, 0.1);
-}
-.ss-container:hover .ss-scroll,
-.ss-container:active .ss-scroll {
-	background: rgba(255, 255, 255, 0.3);
-}
 @supports not (scrollbar-width: thin) {
 	#sidebar::-webkit-scrollbar-thumb {
 		background: rgba(255, 255, 255, 0.1);
diff --git a/p/themes/Dark/dark.css b/p/themes/Dark/dark.css
index b8366caeb..28ea253ff 100644
--- a/p/themes/Dark/dark.css
+++ b/p/themes/Dark/dark.css
@@ -511,13 +511,6 @@ a.btn {
 		scrollbar-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.0);
 	}
 }
-.ss-scroll {
-	background: rgba(255, 255, 255, 0.1);
-}
-.ss-container:hover .ss-scroll,
-.ss-container:active .ss-scroll {
-	background: rgba(255, 255, 255, 0.3);
-}
 @supports not (scrollbar-width: thin) {
 	#sidebar::-webkit-scrollbar-thumb {
 		background: rgba(255, 255, 255, 0.1);
diff --git a/p/themes/Flat/flat.css b/p/themes/Flat/flat.css
index 176a541f7..1c5c3e795 100644
--- a/p/themes/Flat/flat.css
+++ b/p/themes/Flat/flat.css
@@ -514,13 +514,6 @@ a.btn {
 		scrollbar-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.0);
 	}
 }
-.ss-scroll {
-	background: rgba(255, 255, 255, 0.1);
-}
-.ss-container:hover .ss-scroll,
-.ss-container:active .ss-scroll {
-	background: rgba(255, 255, 255, 0.3);
-}
 @supports not (scrollbar-width: thin) {
 	#sidebar::-webkit-scrollbar-thumb {
 		background: rgba(255, 255, 255, 0.1);
diff --git a/p/themes/Screwdriver/screwdriver.css b/p/themes/Screwdriver/screwdriver.css
index b92dbac3e..2576c485f 100644
--- a/p/themes/Screwdriver/screwdriver.css
+++ b/p/themes/Screwdriver/screwdriver.css
@@ -568,13 +568,6 @@ a.btn {
 		scrollbar-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.0);
 	}
 }
-.ss-scroll {
-	background: rgba(255, 255, 255, 0.1);
-}
-.ss-container:hover .ss-scroll,
-.ss-container:active .ss-scroll {
-	background: rgba(255, 255, 255, 0.3);
-}
 @supports not (scrollbar-width: thin) {
 	#sidebar::-webkit-scrollbar-thumb {
 		background: rgba(255, 255, 255, 0.1);
diff --git a/p/themes/Swage/swage.css b/p/themes/Swage/swage.css
index a8ff0bdd5..24a3ccbed 100644
--- a/p/themes/Swage/swage.css
+++ b/p/themes/Swage/swage.css
@@ -538,14 +538,6 @@ scrollbar-color: rgba(255, 255, 255, 0.3) rgba(0, 0, 0, 0.0);
 }
 }
 
-.ss-scroll {
-background: rgba(255, 255, 255, 0.1);
-}
-.ss-container:hover .ss-scroll,
-.ss-container:active .ss-scroll {
-background: rgba(255, 255, 255, 0.3);
-}
-
 @supports not (scrollbar-width: thin) {
 #sidebar::-webkit-scrollbar-thumb {
 background: rgba(255, 255, 255, 0.1);
diff --git a/p/themes/Swage/swage.scss b/p/themes/Swage/swage.scss
index 8ddac14db..ecacba832 100644
--- a/p/themes/Swage/swage.scss
+++ b/p/themes/Swage/swage.scss
@@ -612,14 +612,6 @@ form {
 	}
 }
 
-.ss-scroll {
-	background: rgba(255, 255, 255, 0.1);
-}
-.ss-container:hover .ss-scroll,
-.ss-container:active .ss-scroll {
-	background: rgba(255, 255, 255, 0.3);
-}
-
 @supports not (scrollbar-width: thin) {
 	#sidebar::-webkit-scrollbar-thumb {
 		background: rgba(255, 255, 255, 0.1);
diff --git a/p/themes/base-theme/template.css b/p/themes/base-theme/template.css
index 86c985d0c..099aee916 100644
--- a/p/themes/base-theme/template.css
+++ b/p/themes/base-theme/template.css
@@ -382,57 +382,6 @@ a.btn {
 }
 
 /*=== Scrollbar */
-.ss-wrapper {
-	overflow: hidden;
-	width: 100%;
-	height: 100%;
-	position: relative;
-	z-index: 1;
-	float: left;
-}
-
-.ss-content {
-	height: 100%;
-	width: calc(100% + 18px);
-	padding: 0 0 0 0;
-	position: relative;
-	overflow-y: scroll;
-	box-sizing: border-box;
-}
-
-.ss-content.rtl {
-	width: calc(100% + 18px);
-	right: auto;
-}
-
-.ss-scroll {
-	position: relative;
-	background: rgba(0, 0, 0, 0.1);
-	width: 9px;
-	border-radius: 4px;
-	top: 0;
-	z-index: 2;
-	cursor: pointer;
-	transition: opacity 0.25s linear;
-}
-
-.ss-hidden {
-	display: none;
-}
-
-.ss-container:hover .ss-scroll,
-.ss-container:active .ss-scroll {
-	background: rgba(0, 0, 0, 0.3);
-}
-
-.ss-grabbed {
-	-o-user-select: none;
-	-ms-user-select: none;
-	-moz-user-select: none;
-	-webkit-user-select: none;
-	user-select: none;
-}
-
 @supports (scrollbar-width: thin) {
 	#sidebar {
 		overflow-y: auto;
-- 
cgit v1.2.3