php, css - secondary page updates

assets/scss/_bootscore-custom.scss

@@ -135,6 +135,33 @@
     @extend .btn-lg;
 }
 
+
+.is-style-styled-list {
+    padding-left: 60px;
+    counter-reset: item;
+    list-style-position: outside;
+    li { 
+        margin-bottom: 40px;
+        padding-left: 50px;
+        position: relative;
+        display: block; 
+        line-height: 1.1;
+    }
+    li:before {
+        position: absolute;
+        // padding-top: 40px;
+        margin-left: -90px;
+        padding-left: 30px;
+        margin-right: 30px;
+        font-size: 50px;
+        font-weight: bold;
+        content: counter(item);
+        counter-increment: item;
+        color: red;
+    }
+}
+
+
 /* Page */
 .featured-full-width-img {
     height: 400px;
@@ -144,12 +171,27 @@
     height: 100%;
 }
 
+#secondary {
+    display: none;
+}
 #sidebar {
+    padding-left: 8rem;
+    padding-right: 2rem;
+    font-size: 24px;
     position: sticky;
     a:not(.active) {
         color: black;
     }
     li {
-        padding: 0.25rem 0;
+        padding: 0.5rem 0;
     }
 }
+
+
+/* CUSTOM BLOCK MOBILE SUPPORT */
+@include media-breakpoint-up(lg) {
+    #secondary {
+        display: block;
+	}
+
+}

assets/scss/_bootscore-variables.scss

@@ -4,6 +4,8 @@ $primary: #e30613;
 $secondary: #cccccc;
 $tertiary: #f5f5f5;
 
+$font-size-base: 1.3rem;
+
 
 $navbar-light-color: white;
 $navbar-light-hover-color: darken(white, 10%);

functions.php

@@ -164,12 +164,31 @@ endif;
 add_action( 'init', 'register_button_block_button' );
 
 
+
+
+if ( ! function_exists( 'bootscore_block_styles' ) ) :
+  /**
+   * Register custom block styles
+   */
+ function register_list_block_popout() {
+   register_block_style(
+       'core/list', // name of your block
+       array(
+           'name'  => 'styled-list', // part of the class that gets added to the block.
+           'label' => __( 'Popout List', 'popout-list' ),
+       )
+   );
+ }
+endif;
+
+add_action( 'init', 'register_list_block_popout' );
+
 /* TEMPLATE PAGE */
 
 /**
  * Change one or more classes into my-custom-class
  */
 function my_fancy_filter_function() {
-  return "featured-full-width-img bg-dark text-light mb-4";
+  return "featured-full-width-img bg-dark text-light mb-5";
 }
 add_filter('bootscore/class/featured-full-width-img', 'my_fancy_filter_function', 10, 2);