₊⁺✿˚

14-Bloodlust

@@ -5,10 +5,10 @@ Made by glenthemes
 Initial release: 2015/12/13
 Revamp v1 date: 2020/03/20
        v2 date: 2021/11/18
-Last updated: 2023/09/04
+Last updated: 2024/03/
  
 What's new:
-✱ NPF audio post support
+✱ added support for long sidebars
 
 ------------------------------------------------------
 
@@ -82,6 +82,16 @@ CREDITS:
 <script src="//glen-themes.gitlab.io/thms/14/lactose-intolerance.js"></script>
 <script src="//glen-themes.gitlab.io/thms/14/milk-tea.js"></script>
 
+<script src="//smart-sticky.gitlab.io/i/init.js"></script>
+<script>
+document.addEventListener("DOMContentLoaded", () => {
+    smartSticky({
+        scroll_container: ".ensoot",
+        stick: ".left-sidebar, .right-sidebar"
+    })
+})
+</script>
+
 <!-- unblue polls -->
 <!-- glenthemes.tumblr.com/post/708014819571302400 -->
 <link href="//static.tumblr.com/gtjt4bo/mXBrpdj0n/unblue-polls.css" rel="stylesheet">
@@ -633,6 +643,7 @@ ul li:before {
 :root {
     /*--- GENERAL SETTINGS ---*/
     --Page-FadeIn-Speed:0.5s;
+    --Main-Content-Width-Total:calc(var(--Post-Width-Total) + (var(--Center-Aisle-Gaps) * 2) + (var(--Sidebar-Width) * 2));
     
     /*--- TOP BAR SETTINGS ---*/
     --Top-Bar-BG:{color:top bar background};
@@ -679,11 +690,7 @@ ul li:before {
     
     --Center-Aisle-Gaps:{select:center gaps};
     
-    
     /*--- POST SETTINGS ---*/
-    --ugh:calc(var(--Post-Width) + (var(--Post-Padding) * 2));
-    
-    
     --Paragraph-Margins:1em;
     --Heading-Margins:1em;
     
@@ -702,6 +709,7 @@ ul li:before {
     
     --Post-Width:{select:post width};
     --Post-Padding:{select:post padding};
+    --Post-Width-Total:calc(var(--Post-Width) + (var(--Post-Padding) * 2));
     --Post-Spacing:calc({select:post spacing} * 2);
     
     --Reblogger-Avatar-Size:22px;
@@ -1015,6 +1023,7 @@ ul li:before {
 .le-header {
     margin-top:var(--Top-Bar-Height);
     width:100%;
+    min-width:calc(var(--Main-Content-Width-Total) + (2rem * 2));
     height:var(--Header-Height);
     background-color:{color:header background};
     background-image:url('{image:header image}');
@@ -1051,14 +1060,23 @@ ul li:before {
 .ensoot {
     display:flex;
     flex-wrap:nowrap;
+    align-items:flex-start;
 }
 
 /*---- SIDEBARS ----*/
 .left-sidebar, .right-sidebar {
     position:sticky;
-    top:calc(var(--Sidebar-Top-Sticky-Gap) + var(--Top-Bar-Height));
     width:var(--Sidebar-Width);
-    height:0;
+}
+
+.left-sidebar.short-stick,
+.right-sidebar.short-stick {
+	top:calc(var(--Sidebar-Top-Sticky-Gap) + var(--Top-Bar-Height));
+}
+
+.left-sidebar.stick,
+.right-sidebar.stick {
+	top:calc(100vh - var(--Target-Height) - var(--Sidebar-Sections-Spacing));
 }
 
 .left-sidebar > * + *,
@@ -1245,7 +1263,7 @@ ul li:before {
 
 .posts {
     position:relative;
-    width:calc(var(--Post-Width) + (var(--Post-Padding) * 2) + 2px);
+    width:var(--Post-Width-Total);
 }
 
 /*---- POST BORDERS ----*/
@@ -2139,7 +2157,7 @@ iframe[src*='open.spotify.com'][src*='track'], figure[data-npf*='open.spotify.co
     display:flex;
     align-items:center;
     justify-content:space-between;
-    width:calc(var(--Post-Width) + (var(--Post-Padding) * 2) + 2px);
+    width:var(--Post-Width-Total);
     margin-bottom:calc(var(--Post-Spacing) / 2);
     font-family:var(--SmallCaps-Font-Family);
     font-size:calc(var(--SmallCaps-Font-Size) - 1px);