j1-template 2023.1.0 → 2023.2.0

data/assets/themes/j1/modules/masonry/css/theme/uno.css

@@ -31,5 +31,5 @@
 .masonry-title {
     font-style: italic;
     font-weight: 500;
-/* margin-left: 5px; */
+    margin-left: 4px;
 }

data/assets/themes/j1/modules/masonry/css/theme/uno.min.css

@@ -12,4 +12,4 @@
  # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE.md
  # -----------------------------------------------------------------------------
 */
-@charset 'UTF-8';.grid-sizer,.grid-item{float:left;width:33%}.masonry-title{font-style:italic;font-weight:500}
+@charset 'UTF-8';.grid-sizer,.grid-item{float:left;width:33%}.masonry-title{font-style:italic;font-weight:500;margin-left:4px}

data/assets/themes/j1/modules/slick/lightbox/README.md

@@ -62,6 +62,11 @@ Make sure you include CSS for both slick and slick-lightbox. Example HTML:
 </html>
 ```
 
+## Codepen
+
+Find an [example lightbox](https://codepen.io/mreq/pen/KgQrQa) on Codepen.
+
+
 ## Options
 
 Option               | Type     |  Default         | Description
@@ -81,7 +86,7 @@ useHistoryApi        | boolean  | `false`          | When `true`, opening the li
 layouts              | object   |                  | See [Layouts](#layouts)
 shouldOpen           | function | `null`           | Given a function, checks the return value before opening. If the function returns a falsy value, the lightbox is not opened upon clicking on the items. Accepts three arguments - the slick lightbox instance as the first, the clicked element as the second and the click event as the last.
 imageMaxHeight       | number   | `0.9`            | Maximum height of the lightbox images. Relative to the window height.
-lazy                 | boolean  | `false`          | Should the images be lazyloaded? 
+lazy                 | boolean  | `false`          | Should the images be lazyloaded?
 lazyPlaceholder      | string   | `null`           | Path to lazyloading placeholder. Defaults to a blank gif.
 
 ## Events

data/assets/themes/j1/modules/slick/lightbox/css/theme/uno.css

@@ -0,0 +1,36 @@
+/*
+ # -----------------------------------------------------------------------------
+ # ~/assets/themes/j1/modules/slick/lightbox/css/theme/uno.css
+ # Provides Slicks styles for J1 Theme Uno
+ #
+ # Product/Info:
+ # https://jekyll.one
+ #
+ # Copyright (C) 2023 Juergen Adams
+ #
+ # J1 Theme is licensed under the MIT License.
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE.md
+ # -----------------------------------------------------------------------------
+*/
+@charset 'UTF-8';
+
+
+/* Close Button
+-------------------------------------------------------------------------------- */
+
+.slick-lightbox-close {
+	right: 15px;
+	width: 50px;
+	cursor: pointer;
+	background: transparent;
+	color: transparent;
+}
+
+.slick-lightbox-close:before {
+	font-size: 70px;
+	line-height: .5 !important;
+	color: white;
+	opacity: 0.85;
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+}

data/assets/themes/j1/modules/slick/lightbox/css/theme/uno.min.css

@@ -0,0 +1,15 @@
+/*
+ # -----------------------------------------------------------------------------
+ # ~/assets/themes/j1/modules/slick/lightbox/css/theme/uno.min.css
+ # Provides Slicks styles for J1 Theme Uno
+ #
+ # Product/Info:
+ # https://jekyll.one
+ #
+ # Copyright (C) 2023 Juergen Adams
+ #
+ # J1 Theme is licensed under the MIT License.
+ # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE.md
+ # -----------------------------------------------------------------------------
+*/
+@charset 'UTF-8';.slick-lightbox-close{right:15px;width:50px;cursor:pointer;background:transparent;color:transparent}.slick-lightbox-close:before{font-size:70px;line-height:.5 !important;color:white;opacity:.85;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}

data/assets/themes/j1/modules/slick/lightbox/js/slick-lightbox.js

@@ -350,4 +350,4 @@
             return this.slickLightbox = null;
         });
     };
-}(jQuery));
+}(jQuery));

data/assets/themes/j1/modules/slick/slider/css/theme/uno.css

@@ -14,8 +14,35 @@
 */
 @charset 'UTF-8';
 
+
+/* Article link (collections)
+-------------------------------------------------------------------------------- */
+a.article-link {
+  font-weight: 500 !important;
+  text-decoration: none;
+  border-bottom: unset;
+  color: #FAFAFA;
+}
+
+a.article-link:hover {
+  color: #BDBDBD;
+}
+
 /* Example slider
 -------------------------------------------------------------------------------- */
+h2.slide-item, h3.slide-item {
+    background: var(--bs-gray-400);
+    color: var(--bs-gray-800);
+    /* font-size: 36px !important; */
+    line-height: 150px;
+    margin-right: 1%;
+    margin-top:  0px;
+    margin-bottom:  0px;
+    padding-bottom: 0px;
+    text-align: center;
+}
+
+/*
 h2.slide-item, h3.slide-item {
     background: var(--bs-gray-400);
     color: var(--bs-gray-800);
@@ -24,21 +51,26 @@ h2.slide-item, h3.slide-item {
     margin: 1%;
     text-align: center;
 }
+*/
 
-/* All slider
+/* All carousels
 -------------------------------------------------------------------------------- */
 .slick-loading .slick-list {
 	background: #fff url('../../images/ajax-loader.gif') center center no-repeat;
 }
 
 .slider-title {
-    font-style: italic;
-    font-weight: 500;
-    margin-left: 5px;
+  font-style: italic;
+  font-weight: 500;
+  margin-left: 1px;
 }
 
 /* Cards
 -------------------------------------------------------------------------------- */
+.card {
+  border: none !important;
+}
+
 .card [class*="header-"], .card [class*="content-"] {
   color: var(--bs-gray-400) !important;
 }
@@ -59,55 +91,29 @@ a.link-no-decoration:hover {
   color: rgba(255, 255, 255, 0.4) !important;
 }
 
-/* Images
--------------------------------------------------------------------------------- */
-/*
-.slick-slide img {
-  width: 150px;
-  height: 200px;
-}
-*/
-
-/* Arrows
--------------------------------------------------------------------------------- */
-.slick-arrows {
-    /* padding-top: 3.25rem; */
-}
-
-.slick-arrow {
-    position: absolute;                                                         /* position of the arrow */
-    margin-left: 20px;
-    margin-right: 20px;
-    /* padding-top: 1.75rem; */
-    z-index: 10;                                                                /* show on top of a slide */
-}
-
 /* Dots
 -------------------------------------------------------------------------------- */
-/*
-.slick-dotted.slick-slider {
-	margin-bottom: 30px;
-}
-*/
-
 .slick-dots {
-	position: absolute;
-	bottom: -25px;
 	display: block;
 	width: 100%;
 	padding: 0;
 	margin: 0;
+  /* margin-top: 5px; */
 	list-style: none;
 	text-align: center;
 }
 
 .slick-dots li {
-	position: relative;
 	display: inline-block;
-	width: 20px;
-	height: 20px;
-	margin: 0 5px;
-	padding: 0;
+  width: 1.25rem;
+  height: 1.25rem;
+  margin: 5px 7px;
+  filter: Alpha(Opacity=50);
+  opacity: 0.5;
+  -webkit-border-radius: 20px;
+  -moz-border-radius: 20px;
+  border-radius: 20px;
+  background: var(--bs-primary);
 	cursor: pointer;
 }
 
@@ -130,7 +136,14 @@ a.link-no-decoration:hover {
 	outline: none;
 }
 
-.slick-dots li button:hover:before,
+.slick-dots li:hover {
+  opacity: 1;
+}
+
+.slick-dots li.slick-active {
+  opacity: 1;
+}
+
 .slick-dots li button:focus:before {
 	opacity: 1;
 }
@@ -139,118 +152,141 @@ a.link-no-decoration:hover {
 	font-family: 'slick';
 	font-size: 12px;
 	line-height: 20px;
-	position: absolute;
-	top: 0;
-	left: 0;
+	position: relative;
+	top: -4px;
+	left: -1px;
 	width: 20px;
 	height: 20px;
 	content: '•';
 	text-align: center;
-	opacity: .25;
+	opacity: 0;
 	color: black;
 	-webkit-font-smoothing: antialiased;
 	-moz-osx-font-smoothing: grayscale;
 }
 
 .slick-dots li.slick-active button:before {
-	opacity: .75;
+	opacity: 1;
 	color: black;
 }
 
 /* Arrows
 -------------------------------------------------------------------------------- */
+.slick-arrow {
+  top: 45%;                                                                     /* center arrows in slide (default) */
+  z-index: 10;                                                                  /* show on top of a slide */
+}
 
+.slick-prev,
+.slick-next {
+  position: absolute;                                                           /* position of the arrow */
+  display: block;                                                               /* shown by default */
+	font-size: 0;                                                                 /* disable button text */
+	border: none;                                                                 /* disable button decoration */
+	outline: none;                                                                /* disable button decoration */
+	background: transparent;                                                      /* disable button background */
+}
 
-/* Media breakpoints, all screens
--------------------------------------------------------------------------------- */
-@media all {
-
-  .slick-prev,
-  .slick-next {
-    display: block;                                                             /* shown by default */
-    top: 50%;                                                                   /* center button in slide */
-  	font-size: 0;                                                               /* disable button text */
-  	border: none;                                                               /* disable button decoration */
-  	outline: none;                                                              /* disable button decoration */
-  	background: transparent;                                                    /* disable button background */
-    -webkit-transform: translate(0, -50%);                                      /* move upwards by 50% */
-    -moz-transform: translate(0, -50%);
-  	-ms-transform: translate(0, -50%);
-    -o-transform: translate(0, -50%);
-  	transform: translate(0, -50%);
-  }
-
-  .slick-prev:hover,
-  .slick-prev:focus,
-  .slick-next:hover,
-  .slick-next:focus {
-  	color: transparent;
-  	outline: none;
-  	background: transparent;
-  }
-
-  .slick-prev:hover:before,
-  .slick-prev:focus:before,
-  .slick-next:hover:before,
-  .slick-next:focus:before {
-  	opacity: 1;
-  }
-
-  .slick-prev.slick-disabled:before,
-  .slick-next.slick-disabled:before {
-  	opacity: .25;
-  }
-
-  .slick-prev:before,
-  .slick-next:before {
-  	font-family: 'slick';
-  	font-size: 40px;
-  	line-height: 1;
-  	opacity: .75;
-  	/* color: var(--bs-primary); */
-    color: var(--bs-white);
-  	-webkit-font-smoothing: antialiased;
-  	-moz-osx-font-smoothing: grayscale;
-  }
-
-  .slick-prev {
-  	left: 0%;
-  }
-
-  .slick-prev:before {
-  	content: '←';
-  }
-
-  [dir='rtl'] .slick-prev:before {
-  	content: '→';
-  }
-
-  .slick-next {
-  	right: 0%;
-  }
-
-  .slick-next:before {
-  	content: '→';
-  }
-
-  [dir='rtl'] .slick-next:before {
-  	content: '←';
-  }
-}
-
-/* Media breakpoints, tablet|mobile
+.slick-prev:hover,
+.slick-prev:focus,
+.slick-next:hover,
+.slick-next:focus {
+  outline: none;
+	color: transparent;
+	background: transparent;
+}
+
+.slick-prev:hover:before,
+.slick-prev:focus:before,
+.slick-next:hover:before,
+.slick-next:focus:before {
+	opacity: 1;
+}
+
+.slick-prev.slick-disabled:before,
+.slick-next.slick-disabled:before {
+	opacity: .25;
+}
+
+.slick-prev:before,
+.slick-next:before {
+	font-family: 'slick';
+	font-size: 40px;
+	opacity: .75;
+  color: var(--bs-white);
+	-webkit-font-smoothing: antialiased;
+	-moz-osx-font-smoothing: grayscale;
+}
+
+.slick-prev {
+	left: 3%;
+}
+
+.slick-prev:before {
+	content: '←';
+}
+
+[dir='rtl'] .slick-prev:before {
+	content: '→';
+}
+
+.slick-next {
+	right: 3%;
+}
+
+.slick-next:before {
+	content: '→';
+}
+
+[dir='rtl'] .slick-next:before {
+	content: '←';
+}
+
+
+/* Slider controls, captions and pagination
+See: https://codepen.io/Svarnoy85/pen/NzQPpe
 -------------------------------------------------------------------------------- */
-/*
-@media screen and (max-width: 992px) {
-  .siick-arrow,
-  .siick-arrows {
-  	margin-top: 0 !important;
-  }
-  .slick-prev {
-  	display: none !important;
-  }
-  .slick-next {
-  	display: none !important;
-  }
+.controls {
+  display: flex;
+  width: 100%;
+}
+
+.captions {
+  flex: 1;
+  width: 100px;
+  padding: 10px;
+  color: #212121;
+  background: rgba(0,0,0,.1);
+}
+
+.caption {
+  outline: 0 !important;
+  font-size: 14px;
+  font-weight: 500;
+}
+
+.pagination {
+  display: flex;
+  margin-top: 2px;
+}
+
+.pagination__button {
+  cursor: pointer;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #ccc;
+  background: #fff;
+  width: 40px;
+  height: 40px;
+  margin-left: 2px;
+}
+.pagination__button:hover {
+  color: #fff;
+  background: #2aa1c0;
+}
+.pagination__button.slick-disabled {
+  cursor: not-allowed;
+  background: #ccc;
+  color: #fff;
 }
-*/

data/assets/themes/j1/modules/slick/slider/css/theme/uno.min.css

@@ -12,4 +12,4 @@
  # See: https://github.com/jekyll-one-org/j1-template/blob/main/LICENSE.md
  # -----------------------------------------------------------------------------
 */
-h2.slide-item,h3.slide-item{background:var(--bs-gray-400);color:var(--bs-gray-800);font-size:36px;line-height:150px;margin:1%;text-align:center}.slick-loading .slick-list{background:#fff url('../../images/ajax-loader.gif') center center no-repeat}.slider-title{font-style:italic;font-weight:500;margin-left:5px}.card [class*="header-"],.card [class*="content-"]{color:var(--bs-gray-400) !important}.card .card-title a{color:var(--bs-gray-400) !important}.card .card-title>a:focus,.card .card-title>a:hover{color:rgba(255,255,255,0.4) !important}a.link-no-decoration:hover{color:rgba(255,255,255,0.4) !important}.slick-arrow{position:absolute;margin-left:20px;margin-right:20px;z-index:10}.slick-dots{position:absolute;bottom:-25px;display:block;width:100%;padding:0;margin:0;list-style:none;text-align:center}.slick-dots li{position:relative;display:inline-block;width:20px;height:20px;margin:0 5px;padding:0;cursor:pointer}.slick-dots li button{font-size:0;line-height:0;display:block;width:20px;height:20px;padding:5px;cursor:pointer;color:transparent;border:0;outline:0;background:transparent}.slick-dots li button:hover,.slick-dots li button:focus{outline:0}.slick-dots li button:hover:before,.slick-dots li button:focus:before{opacity:1}.slick-dots li button:before{font-family:'slick';font-size:12px;line-height:20px;position:absolute;top:0;left:0;width:20px;height:20px;content:'•';text-align:center;opacity:.25;color:black;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.slick-dots li.slick-active button:before{opacity:.75;color:black}@media all{.slick-prev,.slick-next{display:block;top:50%;font-size:0;border:0;outline:0;background:transparent;-webkit-transform:translate(0,-50%);-moz-transform:translate(0,-50%);-ms-transform:translate(0,-50%);-o-transform:translate(0,-50%);transform:translate(0,-50%)}.slick-prev:hover,.slick-prev:focus,.slick-next:hover,.slick-next:focus{color:transparent;outline:0;background:transparent}.slick-prev:hover:before,.slick-prev:focus:before,.slick-next:hover:before,.slick-next:focus:before{opacity:1}.slick-prev.slick-disabled:before,.slick-next.slick-disabled:before{opacity:.25}.slick-prev:before,.slick-next:before{font-family:'slick';font-size:40px;line-height:1;opacity:.75;color:var(--bs-white);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.slick-prev{left:0}.slick-prev:before{content:'←'}[dir='rtl'] .slick-prev:before{content:'→'}.slick-next{right:0}.slick-next:before{content:'→'}[dir='rtl'] .slick-next:before{content:'←'}}
+@charset 'UTF-8';a.article-link{font-weight:500 !important;text-decoration:none;border-bottom:unset;color:#fafafa}a.article-link:hover{color:#bdbdbd}h2.slide-item,h3.slide-item{background:var(--bs-gray-400);color:var(--bs-gray-800);line-height:150px;margin-right:1%;margin-top:0;margin-bottom:0;padding-bottom:0;text-align:center}.slick-loading .slick-list{background:#fff url('../../images/ajax-loader.gif') center center no-repeat}.slider-title{font-style:italic;font-weight:500;margin-left:1px}.card{border:none !important}.card [class*="header-"],.card [class*="content-"]{color:var(--bs-gray-400) !important}.card .card-title a{color:var(--bs-gray-400) !important}.card .card-title>a:focus,.card .card-title>a:hover{color:rgba(255,255,255,0.4) !important}a.link-no-decoration:hover{color:rgba(255,255,255,0.4) !important}.slick-dots{display:block;width:100%;padding:0;margin:0;list-style:none;text-align:center}.slick-dots li{display:inline-block;width:1.25rem;height:1.25rem;margin:5px 7px;filter:Alpha(Opacity=50);opacity:.5;-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;background:var(--bs-primary);cursor:pointer}.slick-dots li button{font-size:0;line-height:0;display:block;width:20px;height:20px;padding:5px;cursor:pointer;color:transparent;border:0;outline:0;background:transparent}.slick-dots li button:hover,.slick-dots li button:focus{outline:0}.slick-dots li:hover{opacity:1}.slick-dots li.slick-active{opacity:1}.slick-dots li button:focus:before{opacity:1}.slick-dots li button:before{font-family:'slick';font-size:12px;line-height:20px;position:relative;top:-4px;left:-1px;width:20px;height:20px;content:'•';text-align:center;opacity:0;color:black;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.slick-dots li.slick-active button:before{opacity:1;color:black}.slick-arrow{top:45%;z-index:10}.slick-prev,.slick-next{position:absolute;display:block;font-size:0;border:0;outline:0;background:transparent}.slick-prev:hover,.slick-prev:focus,.slick-next:hover,.slick-next:focus{outline:0;color:transparent;background:transparent}.slick-prev:hover:before,.slick-prev:focus:before,.slick-next:hover:before,.slick-next:focus:before{opacity:1}.slick-prev.slick-disabled:before,.slick-next.slick-disabled:before{opacity:.25}.slick-prev:before,.slick-next:before{font-family:'slick';font-size:40px;opacity:.75;color:var(--bs-white);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.slick-prev{left:3%}.slick-prev:before{content:'←'}[dir='rtl'] .slick-prev:before{content:'→'}.slick-next{right:3%}.slick-next:before{content:'→'}[dir='rtl'] .slick-next:before{content:'←'}.controls{display:flex;width:100%}.captions{flex:1;width:100px;padding:10px;color:#212121;background:rgba(0,0,0,.1)}.caption{outline:0 !important;font-size:14px;font-weight:500}.pagination{display:flex;margin-top:2px}.pagination__button{cursor:pointer;display:flex;justify-content:center;align-items:center;color:#ccc;background:#fff;width:40px;height:40px;margin-left:2px}.pagination__button:hover{color:#fff;background:#2aa1c0}.pagination__button.slick-disabled{cursor:not-allowed;background:#ccc;color:#fff}