Added styles for the Separator element.

Author: ivopetkov

index.php

@@ -26,7 +26,7 @@
         $context->assets
             ->addDir('assets');
 
-        $theme->version = '1.2';
+        $theme->version = '1.3';
 
         $theme->get = function (\BearCMS\Themes\Theme\Customizations $customizations) use ($context) {
             $templateFilename = $context->dir . '/components/template.php';

styles/1.php

@@ -17,8 +17,9 @@
 $date = '"color":"#aaa","font-family":"Arial","font-size":"12px","line-height":"180%"';
 $image = '"border-top-left-radius":"2px","border-top-right-radius":"2px","border-bottom-left-radius":"2px","border-bottom-right-radius":"2px"';
 $userImage = '"width":"50px","height":"50px","margin-right":"8px",' . $image;
+$separator = '"background-color":"rgba(255,255,255,0.2)","height":"2px","margin-top":"30px","margin-bottom":"30px"';
 
-$getElementsStyles = function($prefix) use ($text, $h1, $h2, $h3, $input, $link, $button, $date, $userImage, $image) {
+$getElementsStyles = function ($prefix) use ($text, $h1, $h2, $h3, $input, $link, $button, $date, $userImage, $image, $separator) {
     return [
         $prefix . 'HeadingLargeCSS' => '{' . $h1 . '}',
         $prefix . 'HeadingMediumCSS' => '{' . $h2 . '}',
@@ -51,6 +52,9 @@
         $prefix . 'ForumPostsShowMoreButtonCSS' => '{' . $link . '}',
         $prefix . 'ForumPostsNewPostButtonCSS' => '{' . $link . '}',
         $prefix . 'ShareButtonCSS' => '{' . $button . '}',
+        $prefix . 'SeparatorLargeCSS' => '{' . $separator . ',"width":"80%"}',
+        $prefix . 'SeparatorMediumCSS' => '{' . $separator . ',"width":"60%"}',
+        $prefix . 'SeparatorSmallCSS' => '{' . $separator . ',"width":"40%"}',
     ];
 };
 

styles/2.php

@@ -18,8 +18,9 @@
 $date = '"color":"#000000","font-family":"Arial","font-size":"12px","line-height":"180%"';
 $image = '"border-top-left-radius":"2px","border-top-right-radius":"2px","border-bottom-left-radius":"2px","border-bottom-right-radius":"2px"';
 $userImage = '"width":"50px","height":"50px","margin-right":"8px",' . $image;
+$separator = '"background-color":"#333","height":"2px","margin-top":"30px","margin-bottom":"30px","margin-left":"auto","margin-right":"auto"';
 
-$getElementsStyles = function($prefix) use ($text, $h1, $h2, $h3, $input, $link, $button, $date, $userImage, $image) {
+$getElementsStyles = function ($prefix) use ($text, $h1, $h2, $h3, $input, $link, $button, $date, $userImage, $image, $separator) {
     $center = $prefix === 'homePageContentElements';
     return [
         $prefix . 'HeadingLargeCSS' => '{' . $h1 . ($center ? ',"text-align":"center"' : '') . '}',
@@ -54,6 +55,9 @@
         $prefix . 'ForumPostsShowMoreButtonCSS' => '{' . $link . '}',
         $prefix . 'ForumPostsNewPostButtonCSS' => '{' . $link . '}',
         $prefix . 'ShareButtonCSS' => '{' . $button . '}',
+        $prefix . 'SeparatorLargeCSS' => '{' . $separator . ',"width":"80%"}',
+        $prefix . 'SeparatorMediumCSS' => '{' . $separator . ',"width":"60%"}',
+        $prefix . 'SeparatorSmallCSS' => '{' . $separator . ',"width":"40%"}',
     ];
 };
 

styles/3.php

@@ -17,8 +17,9 @@
 $date = '"color":"#ffffff","font-family":"Arial","font-size":"12px","line-height":"180%"';
 $image = '"border-top-left-radius":"2px","border-top-right-radius":"2px","border-bottom-left-radius":"2px","border-bottom-right-radius":"2px"';
 $userImage = '"width":"50px","height":"50px","margin-right":"8px",' . $image;
+$separator = '"background-color":"#333333","height":"1px","margin-top":"30px","margin-bottom":"30px"';
 
-$getElementsStyles = function($prefix) use ($text, $h1, $h2, $h3, $input, $link, $button, $date, $userImage, $image) {
+$getElementsStyles = function ($prefix) use ($text, $h1, $h2, $h3, $input, $link, $button, $date, $userImage, $image, $separator) {
     if ($prefix === 'homePageContentElements') {
         $h1 .= ',"color":"#000000"';
         $h2 .= ',"color":"#000000"';
@@ -60,6 +61,9 @@
         $prefix . 'ForumPostsShowMoreButtonCSS' => '{' . $link . '}',
         $prefix . 'ForumPostsNewPostButtonCSS' => '{' . $link . '}',
         $prefix . 'ShareButtonCSS' => '{' . $button . '}',
+        $prefix . 'SeparatorLargeCSS' => '{' . $separator . ',"width":"80%"}',
+        $prefix . 'SeparatorMediumCSS' => '{' . $separator . ',"width":"60%"}',
+        $prefix . 'SeparatorSmallCSS' => '{' . $separator . ',"width":"40%"}',
     ];
 };
 

styles/4.php

@@ -17,8 +17,9 @@
 $date = '"color":"#aaa","font-family":"Arial","font-size":"12px","line-height":"180%"';
 $image = '"border-top-left-radius":"2px","border-top-right-radius":"2px","border-bottom-left-radius":"2px","border-bottom-right-radius":"2px"';
 $userImage = '"width":"50px","height":"50px","margin-right":"8px",' . $image;
+$separator = '"background-color":"rgba(255,255,255,0.2)","height":"2px","margin-top":"30px","margin-bottom":"30px"';
 
-$getElementsStyles = function($prefix) use ($text, $h1, $h2, $h3, $input, $link, $button, $date, $userImage, $image) {
+$getElementsStyles = function ($prefix) use ($text, $h1, $h2, $h3, $input, $link, $button, $date, $userImage, $image, $separator) {
     return [
         $prefix . 'HeadingLargeCSS' => '{' . $h1 . '}',
         $prefix . 'HeadingMediumCSS' => '{' . $h2 . '}',
@@ -52,6 +53,9 @@
         $prefix . 'ForumPostsShowMoreButtonCSS' => '{' . $link . '}',
         $prefix . 'ForumPostsNewPostButtonCSS' => '{' . $link . '}',
         $prefix . 'ShareButtonCSS' => '{' . $button . '}',
+        $prefix . 'SeparatorLargeCSS' => '{' . $separator . ',"width":"80%"}',
+        $prefix . 'SeparatorMediumCSS' => '{' . $separator . ',"width":"60%"}',
+        $prefix . 'SeparatorSmallCSS' => '{' . $separator . ',"width":"40%"}',
     ];
 };