Ticket #268 - Styles changer.

install/sql/system.sql

@@ -172,7 +172,7 @@ CREATE TABLE `sys_options` (
   `name` varchar(64) NOT NULL default '',
   `caption` varchar(255) NOT NULL default '',
   `value` mediumtext NOT NULL,
-  `type` enum('digit','text','checkbox','select','combobox','file','list','rlist') NOT NULL default 'digit',
+  `type` enum('digit','text','checkbox','select','combobox','file','image','list','rlist','rgb','rgba') NOT NULL default 'digit',
   `extra` text NOT NULL default '',
   `check` varchar(32) NOT NULL,
   `check_params` text NOT NULL,

modules/base/text/classes/BxBaseModTextTemplate.php

@@ -105,6 +105,8 @@ class BxBaseModTextTemplate extends BxBaseModGeneralTemplate
 
     function entryAttachments ($aData)
     {
+    	$oModule = BxDolModule::getInstance($this->MODULE);
+
     	return $this->parseHtmlByName('attachments.html', array(
             'bx_repeat:attachments' => $this->getAttachments($oModule->_oConfig->CNF['OBJECT_STORAGE'], $aData),
         ));

modules/boonex/russian/data/langs/bx_uni/ru.xml

@@ -1,8 +1,35 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources name="ru" flag="ru" title="Russian">
 	<string name="_bx_uni_wgt_cpt"><![CDATA[UNI]]></string>
+
 	<string name="_bx_uni_stg_cpt_type"><![CDATA[UNI]]></string>
 	<string name="_bx_uni_stg_cpt_category_system"><![CDATA[Общие]]></string>
+	<string name="_bx_uni_stg_cpt_category_styles"><![CDATA[Стили]]></string>
 	<string name="_bx_uni_stg_cpt_option_switcher_name"><![CDATA[Название в переключателе тем]]></string>
 	<string name="_bx_uni_stg_cpt_option_page_width"><![CDATA[Ширина страницы]]></string>
+	<string name="_bx_uni_stg_cpt_option_header_bg_color"><![CDATA[Цвет фона заголовка]]></string>
+	<string name="_bx_uni_stg_cpt_option_header_bg_image"><![CDATA[Изображение фона заголовка]]></string>
+	<string name="_bx_uni_stg_cpt_option_header_border_color"><![CDATA[Цвет границы заголовка]]></string>
+	<string name="_bx_uni_stg_cpt_option_header_border_size"><![CDATA[Размер границы заголовка]]></string>
+	<string name="_bx_uni_stg_cpt_option_site_bg_color"><![CDATA[Цвет фона сайта]]></string>
+	<string name="_bx_uni_stg_cpt_option_site_bg_image"><![CDATA[Изображение фона сайта]]></string>
+	<string name="_bx_uni_stg_cpt_option_footer_bg_color"><![CDATA[Цвет фона основания]]></string>
+	<string name="_bx_uni_stg_cpt_option_footer_bg_image"><![CDATA[Изображение фона основания]]></string>
+	<string name="_bx_uni_stg_cpt_option_footer_border_color"><![CDATA[Цвет границы основания]]></string>
+	<string name="_bx_uni_stg_cpt_option_footer_border_size"><![CDATA[Размер границы основания]]></string>
+	<string name="_bx_uni_stg_cpt_option_block_bg_color"><![CDATA[Цвет фона блоков]]></string>
+	<string name="_bx_uni_stg_cpt_option_block_bg_image"><![CDATA[Изображение фона блоков]]></string>
+	<string name="_bx_uni_stg_cpt_option_block_border_color"><![CDATA[Цвет границы блоков]]></string>
+	<string name="_bx_uni_stg_cpt_option_block_border_size"><![CDATA[Размер границы блоков]]></string>
+	<string name="_bx_uni_stg_cpt_option_block_border_radius"><![CDATA[Радиус углов блоков]]></string>
+	<string name="_bx_uni_stg_cpt_option_font_family"><![CDATA[Набор шрифтов]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_default"><![CDATA[Стандартный размер шрифта]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_small"><![CDATA[Маленький размер шрифта]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_middle"><![CDATA[Средний размер шрифта]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_large"><![CDATA[Большой размер шрифта]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_h1"><![CDATA[Размер шрифта тэга H1]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_h2"><![CDATA[Размер шрифта тэга H2]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_h3"><![CDATA[Размер шрифта тэга H3]]></string>
+
+	<string name="_bx_uni_lmi_cpt_styles"><![CDATA[Стили]]></string>
 </resources>

modules/boonex/uni/classes/BxUniStudioPage.php

@@ -9,12 +9,26 @@
  * @{
  */
 
+define('BX_UNI_STUDIO_TEMPL_TYPE_STYLES', 'styles');
+
 class BxUniStudioPage extends BxTemplStudioDesign
 {
     function __construct($sModule = "", $sPage = "")
     {
     	$this->MODULE = 'bx_uni';
         parent::__construct($sModule, $sPage);
+        
+        $this->aMenuItems[BX_UNI_STUDIO_TEMPL_TYPE_STYLES] = array('caption' => '_bx_uni_lmi_cpt_styles', 'icon' => 'paint-brush');
+    }
+
+    protected function getSettings($sCategory = '')
+    {
+    	return parent::getSettings('bx_uni_system');
+    }
+
+	protected function getStyles()
+    {
+		return parent::getSettings('bx_uni_styles');
     }
 }
 

modules/boonex/uni/data/template/system/_header.html

@@ -0,0 +1,93 @@
+<!DOCTYPE html>
+<html lang="__lang__">
+<head>
+    <meta http-equiv="Content-Type" content="text/html; charset=__page_charset__" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0" />
+    <title>__page_header__</title>
+    <base href="<bx_url_root />" />
+
+    __meta_info__
+    __page_robots__
+
+    <meta http-equiv="Content-Style-Type" content="text/css" />
+
+    <bx_include_css />
+
+    __dol_images__
+    __dol_lang__
+    __dol_options__
+
+    <bx_include_js />
+    <script type="text/javascript" language="javascript">
+
+        var sUrlRoot = '<bx_url_root />';
+
+        var aSpinnerOpts = {
+            lines: 7, // The number of lines to draw
+            length: 0, // The length of each line
+            width: 8, // The line thickness
+            radius: 7, // The radius of the inner circle
+            corners: 1, // Corner roundness (0..1)
+            rotate: 0, // The rotation offset
+            direction: 1, // 1: clockwise, -1: counterclockwise
+            color: '#3a8686', // #rgb or #rrggbb or array of colors
+            speed: 1, // Rounds per second
+            trail: 60, // Afterglow percentage
+            shadow: false, // Whether to render a shadow
+            hwaccel: false, // Whether to use hardware acceleration
+            className: 'bx-sys-spinner', // The CSS class to assign to the spinner
+            zIndex: 2e9, // The z-index (defaults to 2000000000)
+            top: '50%', // Top position relative to parent in px
+            left: '50%' // Left position relative to parent in px
+        };
+
+        var aSpinnerSmallOpts = $.extend({}, aSpinnerOpts, {
+            lines: 6,
+            width: 6,
+            radius: 4,
+            color: '#333',
+            top: '50%',
+            left: 'calc(100% - 20px)'
+        });
+
+        $(document).ready(function () {
+            bx_time('__lang__');            
+
+            bx_activate_anim_icons('#3e8685');
+
+            // hide toolbar on scrolldown, show - on scroll up
+            new Headroom($('#bx-toolbar').get(0), {
+                tolerance: {
+                    down: 10,
+                    up: 20
+                },
+                offset: 200,
+                classes: {
+                    initial: "bx-toolbar-anim",
+                    pinned: "bx-toolbar-reset",
+                    unpinned: "bx-toolbar-up"
+                },
+                onUnpin: function() {
+                    bx_menu_slide_close_all_opened();
+                }
+            }).init();
+        });
+
+        (function(w) {
+            var dpr = (w.devicePixelRatio === undefined ? 1 : w.devicePixelRatio);
+            if ($.cookie('devicePixelRatio') == dpr || dpr < 2)
+                return;
+            $.cookie('devicePixelRatio', dpr, {expires: 365, path: '/'});
+            window.location.reload();
+        })(window);
+
+
+    </script>
+    __extra_js__
+
+    <bx_injection:injection_head />
+
+</head>
+
+<body class="bx-def-font bx-def-image-bg-page bx-def-color-bg-page" <bx_injection:injection_body /> >
+    <bx_injection:injection_header />    

modules/boonex/uni/data/template/system/_sub_footer.html

@@ -0,0 +1,42 @@
+		
+		                <bx_injection:injection_content_after />
+		
+		                <div class="bx-clear"></div>
+		
+		            <bx_injection:banner_bottom />
+		
+		        </div> <!-- #bx-content-main -->
+		
+		        <bx_injection:injection_between_content_footer />
+		
+		    </div> <!-- #bx-content-container -->
+		
+		</div>
+
+	</div> <!-- #bx-content-wrapper -->
+
+	<div id="bx-footer-wrapper" class="bx-def-image-bg-footer bx-def-color-bg-footer bx-def-border-footer">	
+		<div class="bx-def-centered bx-def-padding-sec-leftright bx-def-page-width bx-def-box-sizing">
+		    <div id="bx-footer" class="bx-def-padding-sec-left bx-def-padding-sec-right bx-clearfix">
+		        <bx_injection:injection_footer_before />
+	
+		        <div id="bx-menu-bottom">
+		            <bx_menu:sys_footer />
+		        </div>
+		        <div id="bx-footer-copyright">
+		        	<i title="__copyright_attr__" class="sys-icon copyright"></i>
+		        </div>
+		        <div class="bx-clear"></div>
+		        <div class="bx-menu-switch-language-inline bx-def-margin-sec-top">
+		        	<bx_menu:sys_switch_language_inline />
+		        </div>
+	
+		        <bx_injection:injection_footer_after />
+		    </div>
+		</div>
+	</div>
+
+	<bx_menu:sys_site_action />
+</div>
+
+<bx_include_auto:_footer.html />

modules/boonex/uni/data/template/system/_sub_header.html

@@ -0,0 +1,67 @@
+<bx_include_auto:_header.html />
+
+<div class="bx-main">
+
+	<bx_injection:top />
+
+	<div id="bx-toolbar" class="bx-def-image-bg-header bx-def-color-bg-header bx-def-border-header bx-def-z-index-nav">
+	
+	    <div class="bx-def-centered bx-def-padding-sec-leftright bx-def-page-width bx-def-box-sizing">
+	
+	        <div id="bx-toolbar-content" class="bx-clearfix">
+	
+	            <div id="bx-menu-toolbar-1-container">
+	                <bx_menu:sys_toolbar_site />
+	            </div>
+	
+	            <div id="bx-logo-container">
+	
+	                <bx_injection:injection_logo_before />
+	                    __main_logo__
+	                <bx_injection:injection_logo_after />
+	
+	            </div>
+	
+	            <div id="bx-menu-toolbar-2-container">
+	                <bx_menu:sys_toolbar_member />
+	            </div>
+	
+	        </div>
+	
+	    </div>
+	
+	</div>
+	
+	<bx_injection:injection_between_logo_top_menu />
+	
+	<div id="bx-menu-main-bar-wrapper">
+	
+	    <div id="bx-menu-main-bar" class="bx-def-color-bg-sec">
+	
+	        <div class="bx-def-centered bx-def-padding-sec-leftright bx-def-page-width bx-def-box-sizing">
+
+	            <bx_injection:injection_top_menu_before />
+
+        	    <bx_menu:sys_site_submenu />
+
+	            <bx_injection:injection_top_menu_after />
+
+	        </div>
+	
+	    </div>
+	
+	</div>
+	
+	<bx_injection:injection_between_content_menu />
+
+	<div id="bx-content-wrapper">
+
+		__informer__
+		
+		<div class="bx-page-wrapper bx-def-centered bx-def-padding-sec-leftright bx-def-page-width bx-def-box-sizing">
+		
+		    <div id="bx-content-container" class="bx-def-padding-sec-left bx-def-padding-sec-right">
+		
+		        <bx_injection:injection_content_before />
+		
+		        <div id="bx-content-main" class="bx-def-margin-top">

modules/boonex/uni/data/template/system/css/default.less

@@ -0,0 +1,51 @@
+@import '../../../../../../../template/css/default.less';
+
+/* background images */
+.bx-def-image-bg-page,
+.bx-def-image-bg-header,
+.bx-def-image-bg-block,
+.bx-def-image-bg-footer {
+    background-position: center center;
+    background-repeat: no-repeat;
+    background-size: cover;
+}
+
+.bx-def-image-bg-page {
+	background-image: url(@bx-image-bg-page);
+}
+
+.bx-def-image-bg-header {
+	background-image: url(@bx-image-bg-header);
+}
+
+.bx-def-image-bg-block {
+	background-image: url(@bx-image-bg-block);
+}
+
+.bx-def-image-bg-footer {
+	background-image: url(@bx-image-bg-footer);
+}
+
+
+/* background colors */
+.bx-def-color-bg-header {
+    .background-color (@bx-color-header);
+}
+
+.bx-def-color-bg-footer {
+    .background-color (@bx-color-footer);    
+}
+
+
+/* border */
+.bx-def-border-header {
+    border-bottom: @bx-border-width-header @bx-border-type @bx-border-color-header;
+}
+.bx-def-border-footer {
+    border-top: @bx-border-width-footer @bx-border-type @bx-border-color-footer;
+}
+.bx-def-border-block {
+	border: @bx-border-width-block @bx-border-type @bx-border-color-block;
+
+	.radius(@bx-border-radius-block);
+}

modules/boonex/uni/data/template/system/designbox_1.html

@@ -0,0 +1,7 @@
+<!-- Design Box 1 [start]: Content + title + background -->
+<div class="bx-db-container bx-def-image-bg-block bx-def-color-bg-block bx-def-border-block">
+    <div class="bx-db-header"><div class="bx-db-title bx-def-font-h2">__title__</div>__caption_item__<div class="bx-clear"></div></div>
+    <div class="bx-def-hr"></div>
+    <div class="bx-db-content bx-clearfix">__designbox_content__</div>
+</div>
+<!-- Design Box 1 [ end ] -->

modules/boonex/uni/data/template/system/designbox_11.html

@@ -0,0 +1,7 @@
+<!-- Design Box 11 [start]: Content + title + background + padding -->
+<div class="bx-db-container bx-def-image-bg-block bx-def-color-bg-block bx-def-border-block">
+    <div class="bx-db-header"><div class="bx-db-title bx-def-font-h2">__title__</div>__caption_item__<div class="bx-clear"></div></div>
+    <div class="bx-def-hr"></div>
+    <div class="bx-db-content bx-def-padding-top bx-clearfix">__designbox_content__</div>
+</div>
+<!-- Design Box 11 [ end ] -->

modules/boonex/uni/data/template/system/designbox_13.html

@@ -0,0 +1,7 @@
+<!-- Design Box 13 [start]: Content + background + padding -->
+<div class="bx-db-container bx-def-image-bg-block bx-def-color-bg-block bx-def-border-block">
+    <div class="bx-db-content bx-clearfix bx-def-padding-top">
+            __designbox_content__
+    </div>
+</div>
+<!-- Design Box 13 [ end ] -->

modules/boonex/uni/data/template/system/designbox_14.html

@@ -0,0 +1,7 @@
+<!-- Design Box 14 [start]: Content + title + padding -->
+<div class="bx-db-container bx-dbc-nobg bx-def-border-block">
+    <div class="bx-db-header"><div class="bx-db-title bx-def-font-h2">__title__</div>__caption_item__<div class="bx-clear"></div></div>
+    <div class="bx-def-hr"></div>
+    <div class="bx-db-content bx-def-padding-top bx-clearfix">__designbox_content__</div>
+</div>
+<!-- Design Box 14 [ end ] -->

modules/boonex/uni/data/template/system/designbox_3.html

@@ -0,0 +1,7 @@
+<!-- Design Box 3 [start]: Content + background -->
+<div class="bx-db-container bx-def-image-bg-block bx-def-color-bg-block bx-def-border-block">
+    <div class="bx-db-content bx-clearfix">
+            __designbox_content__
+    </div>
+</div>
+<!-- Design Box 3 [ end ] -->

modules/boonex/uni/data/template/system/designbox_4.html

@@ -0,0 +1,7 @@
+<!-- Design Box 4 [start]: Content + title -->
+<div class="bx-db-container bx-dbc-nobg bx-def-border-block">
+    <div class="bx-db-header"><div class="bx-db-title bx-def-font-h2">__title__</div>__caption_item__<div class="bx-clear"></div></div>
+    <div class="bx-def-hr"></div>
+    <div class="bx-db-content bx-clearfix">__designbox_content__</div>
+</div>
+<!-- Design Box 4 [ end ] -->

modules/boonex/uni/data/template/system/scripts/BxTemplConfig.php

@@ -13,6 +13,60 @@ class BxTemplConfig extends BxBaseConfig
     {
         parent::__construct();
 
+        $sPrefix = 'bx_uni';
+
+        //--- Images
+        $oStorage = BxDolStorage::getObjectInstance('sys_images_custom');
+        
+        $aImageKeys = array(
+        	'bx-image-bg-header' => $sPrefix . '_header_bg_image',
+        	'bx-image-bg-page' => $sPrefix . '_site_bg_image',
+        	'bx-image-bg-footer' => $sPrefix . '_footer_bg_image',
+        	'bx-image-bg-block' => $sPrefix . '_block_bg_image'
+        );
+        foreach($aImageKeys as $sKey => $sParam) {
+        	$this->_aConfig['aLessConfig'][$sKey] = ""; 
+
+			$iImageId = (int)getParam($sParam);
+        	if(empty($iImageId))
+        		continue;
+
+        	$sImageUrl = $oStorage->getFileUrlById($iImageId);
+        	if(empty($sImageUrl))
+        		continue;
+
+        	$this->_aConfig['aLessConfig'][$sKey] = "'" . $sImageUrl . "'";
+        }
+
+
+        //--- Colors
+        $this->_aConfig['aLessConfig']['bx-color-header'] = getParam($sPrefix . '_header_bg_color');
+        $this->_aConfig['aLessConfig']['bx-color-page'] = getParam($sPrefix . '_site_bg_color');
+        $this->_aConfig['aLessConfig']['bx-color-footer'] = getParam($sPrefix . '_footer_bg_color');
+        $this->_aConfig['aLessConfig']['bx-color-block'] = getParam($sPrefix . '_block_bg_color');
+
+
+        //--- Borders
+        $this->_aConfig['aLessConfig']['bx-border-color-header'] = getParam($sPrefix . '_header_border_color');
+        $this->_aConfig['aLessConfig']['bx-border-color-footer'] = getParam($sPrefix . '_footer_border_color');
+        $this->_aConfig['aLessConfig']['bx-border-color-block'] = getParam($sPrefix . '_block_border_color');
+
+        $this->_aConfig['aLessConfig']['bx-border-width-header'] = getParam($sPrefix . '_header_border_size');
+        $this->_aConfig['aLessConfig']['bx-border-width-footer'] = getParam($sPrefix . '_footer_border_size');
+        $this->_aConfig['aLessConfig']['bx-border-width-block'] = getParam($sPrefix . '_block_border_size');
+
+        $this->_aConfig['aLessConfig']['bx-border-radius-block'] = getParam($sPrefix . '_block_border_radius');
+
+		//--- Fonts
+        $this->_aConfig['aLessConfig']['bx-font-family'] = getParam($sPrefix . '_font_family');
+        $this->_aConfig['aLessConfig']['bx-font-size-default'] = getParam($sPrefix . '_font_size_default');
+        $this->_aConfig['aLessConfig']['bx-font-size-small'] = getParam($sPrefix . '_font_size_small');
+        $this->_aConfig['aLessConfig']['bx-font-size-middle'] = getParam($sPrefix . '_font_size_middle');
+        $this->_aConfig['aLessConfig']['bx-font-size-large'] = getParam($sPrefix . '_font_size_large');
+        $this->_aConfig['aLessConfig']['bx-font-size-h1'] = getParam($sPrefix . '_font_size_h1');
+        $this->_aConfig['aLessConfig']['bx-font-size-h2'] = getParam($sPrefix . '_font_size_h2');
+        $this->_aConfig['aLessConfig']['bx-font-size-h3'] = getParam($sPrefix . '_font_size_h3');
+
         $this->setPageWidth('bx_uni_page_width');
     }
 }

modules/boonex/uni/install/langs/en.xml

@@ -1,8 +1,35 @@
 <?xml version="1.0" encoding="utf-8"?>
 <resources name="en" flag="gb" title="English">
 	<string name="_bx_uni_wgt_cpt"><![CDATA[UNI]]></string>
+
 	<string name="_bx_uni_stg_cpt_type"><![CDATA[UNI]]></string>
 	<string name="_bx_uni_stg_cpt_category_system"><![CDATA[General]]></string>
+	<string name="_bx_uni_stg_cpt_category_styles"><![CDATA[Styles]]></string>
 	<string name="_bx_uni_stg_cpt_option_switcher_name"><![CDATA[Name In Template Switcher]]></string>
 	<string name="_bx_uni_stg_cpt_option_page_width"><![CDATA[Page Width]]></string>
+	<string name="_bx_uni_stg_cpt_option_header_bg_color"><![CDATA[Header background color]]></string>
+	<string name="_bx_uni_stg_cpt_option_header_bg_image"><![CDATA[Header background image]]></string>
+	<string name="_bx_uni_stg_cpt_option_header_border_color"><![CDATA[Header border color]]></string>
+	<string name="_bx_uni_stg_cpt_option_header_border_size"><![CDATA[Header border size]]></string>
+	<string name="_bx_uni_stg_cpt_option_site_bg_color"><![CDATA[Site background color]]></string>
+	<string name="_bx_uni_stg_cpt_option_site_bg_image"><![CDATA[Site background image]]></string>
+	<string name="_bx_uni_stg_cpt_option_footer_bg_color"><![CDATA[Footer background color]]></string>
+	<string name="_bx_uni_stg_cpt_option_footer_bg_image"><![CDATA[Footer background image]]></string>
+	<string name="_bx_uni_stg_cpt_option_footer_border_color"><![CDATA[Footer border color]]></string>
+	<string name="_bx_uni_stg_cpt_option_footer_border_size"><![CDATA[Footer border size]]></string>
+	<string name="_bx_uni_stg_cpt_option_block_bg_color"><![CDATA[Blocks background color]]></string>
+	<string name="_bx_uni_stg_cpt_option_block_bg_image"><![CDATA[Blocks background image]]></string>
+	<string name="_bx_uni_stg_cpt_option_block_border_color"><![CDATA[Blocks border color]]></string>
+	<string name="_bx_uni_stg_cpt_option_block_border_size"><![CDATA[Blocks border size]]></string>
+	<string name="_bx_uni_stg_cpt_option_block_border_radius"><![CDATA[Blocks corners radius]]></string>
+	<string name="_bx_uni_stg_cpt_option_font_family"><![CDATA[Font stack]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_default"><![CDATA[Font size default]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_small"><![CDATA[Font size small]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_middle"><![CDATA[Font size middle]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_large"><![CDATA[Font size large]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_h1"><![CDATA[Font size H1]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_h2"><![CDATA[Font size H2]]></string>
+	<string name="_bx_uni_stg_cpt_option_size_h3"><![CDATA[Font size H3]]></string>
+
+	<string name="_bx_uni_lmi_cpt_styles"><![CDATA[Styles]]></string>
 </resources>

modules/boonex/uni/install/sql/install.sql

@@ -6,6 +6,7 @@ INSERT INTO `sys_options_types`(`group`, `name`, `caption`, `icon`, `order`) VAL
 ('templates', @sName, '_bx_uni_stg_cpt_type', 'bx_uni@modules/boonex/uni/|std-mi.png', 2);
 SET @iTypeId = LAST_INSERT_ID();
 
+-- SETTINGS: UNI System
 INSERT INTO `sys_options_categories`(`type_id`, `name`, `caption`, `order`) VALUES 
 (@iTypeId, CONCAT(@sName, '_system'), '_bx_uni_stg_cpt_category_system', 1);
 SET @iCategoryId = LAST_INSERT_ID();
@@ -14,6 +15,37 @@ INSERT INTO `sys_options`(`category_id`, `name`, `caption`, `value`, `type`, `ex
 (@iCategoryId, CONCAT(@sName, '_switcher_title'), '_bx_uni_stg_cpt_option_switcher_name', 'UNI', 'digit', '', '', '', 1),
 (@iCategoryId, CONCAT(@sName, '_page_width'), '_bx_uni_stg_cpt_option_page_width', '1000', 'digit', '', '', '', 2);
 
+-- SETTINGS: UNI Styles
+INSERT INTO `sys_options_categories`(`type_id`, `name`, `caption`, `order`) VALUES 
+(@iTypeId, CONCAT(@sName, '_styles'), '_bx_uni_stg_cpt_category_styles', 1);
+SET @iCategoryId = LAST_INSERT_ID();
+
+INSERT INTO `sys_options`(`category_id`, `name`, `caption`, `value`, `type`, `extra`, `check`, `check_error`, `order`) VALUES
+(@iCategoryId, CONCAT(@sName, '_header_bg_color'), '_bx_uni_stg_cpt_option_header_bg_color', 'rgba(59, 134, 134, 1)', 'rgba', '', '', '', 1),
+	(@iCategoryId, CONCAT(@sName, '_header_bg_image'), '_bx_uni_stg_cpt_option_header_bg_image', '', 'image', '', '', '', 2),
+(@iCategoryId, CONCAT(@sName, '_header_border_color'), '_bx_uni_stg_cpt_option_header_border_color', 'rgb(208, 208, 208)', 'rgb', '', '', '', 3),
+(@iCategoryId, CONCAT(@sName, '_header_border_size'), '_bx_uni_stg_cpt_option_header_border_size', '0px', 'digit', '', '', '', 4),
+(@iCategoryId, CONCAT(@sName, '_site_bg_color'), '_bx_uni_stg_cpt_option_site_bg_color', 'rgb(255, 255, 255)', 'rgb', '', '', '', 11),
+	(@iCategoryId, CONCAT(@sName, '_site_bg_image'), '_bx_uni_stg_cpt_option_site_bg_image', '', 'image', '', '', '', 12),
+(@iCategoryId, CONCAT(@sName, '_footer_bg_color'), '_bx_uni_stg_cpt_option_footer_bg_color', 'rgb(255, 255, 255, 1)', 'rgba', '', '', '', 21),
+	(@iCategoryId, CONCAT(@sName, '_footer_bg_image'), '_bx_uni_stg_cpt_option_footer_bg_image', '', 'image', '', '', '', 22),
+(@iCategoryId, CONCAT(@sName, '_footer_border_color'), '_bx_uni_stg_cpt_option_footer_border_color', 'rgb(208, 208, 208)', 'rgb', '', '', '', 23),
+(@iCategoryId, CONCAT(@sName, '_footer_border_size'), '_bx_uni_stg_cpt_option_footer_border_size', '1px', 'digit', '', '', '', 24),
+(@iCategoryId, CONCAT(@sName, '_block_bg_color'), '_bx_uni_stg_cpt_option_block_bg_color', 'rgb(255, 255, 255, 1)', 'rgba', '', '', '', 31),
+	(@iCategoryId, CONCAT(@sName, '_block_bg_image'), '_bx_uni_stg_cpt_option_block_bg_image', '', 'image', '', '', '', 32),
+(@iCategoryId, CONCAT(@sName, '_block_border_color'), '_bx_uni_stg_cpt_option_block_border_color', 'rgb(208, 208, 208)', 'rgb', '', '', '', 33),
+(@iCategoryId, CONCAT(@sName, '_block_border_size'), '_bx_uni_stg_cpt_option_block_border_size', '0px', 'digit', '', '', '', 34),
+(@iCategoryId, CONCAT(@sName, '_block_border_radius'), '_bx_uni_stg_cpt_option_block_border_radius', '0px', 'digit', '', '', '', 35),
+(@iCategoryId, CONCAT(@sName, '_font_family'), '_bx_uni_stg_cpt_option_font_family', '"Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif', 'digit', '', '', '', 41),
+(@iCategoryId, CONCAT(@sName, '_font_size_default'), '_bx_uni_stg_cpt_option_size_default', '18px', 'digit', '', '', '', 42),
+(@iCategoryId, CONCAT(@sName, '_font_size_small'), '_bx_uni_stg_cpt_option_size_small', '14px', 'digit', '', '', '', 43),
+(@iCategoryId, CONCAT(@sName, '_font_size_middle'), '_bx_uni_stg_cpt_option_size_middle', '16px', 'digit', '', '', '', 44),
+(@iCategoryId, CONCAT(@sName, '_font_size_large'), '_bx_uni_stg_cpt_option_size_large', '22px', 'digit', '', '', '', 45),
+(@iCategoryId, CONCAT(@sName, '_font_size_h1'), '_bx_uni_stg_cpt_option_size_h1', '38px', 'digit', '', '', '', 46),
+(@iCategoryId, CONCAT(@sName, '_font_size_h2'), '_bx_uni_stg_cpt_option_size_h2', '24px', 'digit', '', '', '', 47),
+(@iCategoryId, CONCAT(@sName, '_font_size_h3'), '_bx_uni_stg_cpt_option_size_h3', '18px', 'digit', '', '', '', 48);
+
+-- SETTINGS: System
 SET @iSystemCategoryId = (SELECT IFNULL(`id`, @iCategoryId) FROM `sys_options_categories` WHERE `name`='system' LIMIT 1);
 SET @iSystemCategoryOrder = (SELECT IFNULL(MAX(`order`), 0) FROM `sys_options` WHERE `category_id`=@iSystemCategoryId LIMIT 1);
 INSERT INTO `sys_options`(`category_id`, `name`, `caption`, `value`, `type`, `extra`, `check`, `check_error`, `order`) VALUES

studio/classes/BxDolStudioDesign.php

@@ -7,7 +7,7 @@
  * @{
  */
 
-define('BX_DOL_STUDIO_TEMPL_DEFAULT', 'basic');
+define('BX_DOL_STUDIO_TEMPL_DEFAULT', 'uni');
 define('BX_DOL_STUDIO_TEMPL_TYPE_SETTINGS', 'settings');
 define('BX_DOL_STUDIO_TEMPL_TYPE_LOGO', 'logo');
 define('BX_DOL_STUDIO_TEMPL_TYPE_DEFAULT', BX_DOL_STUDIO_TEMPL_TYPE_SETTINGS);

studio/classes/BxDolStudioSettings.php

@@ -26,6 +26,11 @@ class BxDolStudioSettings extends BxTemplStudioPage
     protected $aCategories;
     protected $aCustomCategories;
 
+    protected $sStorage;
+    protected $sTranscoder;
+
+    protected $sErrorMessage;
+
     function __construct($sType = '', $sCategory = '')
     {
         parent::__construct('settings');
@@ -40,6 +45,11 @@ class BxDolStudioSettings extends BxTemplStudioPage
         if(is_string($sCategory) && !empty($sCategory))
             $this->sCategory = $sCategory;
 
+		$this->sStorage = 'sys_images_custom';
+		$this->sTranscoder = 'sys_images_custom';
+
+		$this->sErrorMessage = '';
+
         //--- Check actions ---//
         if(($sAction = bx_get('stg_action')) !== false && ($sValue = bx_get('stg_value')) !== false) {
             $sAction = bx_process_input($sAction);
@@ -70,7 +80,11 @@ class BxDolStudioSettings extends BxTemplStudioPage
 
             $aData = array();
             foreach($aOptions as $aOption) {
-                $aData[$aOption['name']] = $oForm->getCleanValue($aOption['name']);
+                $aData[$aOption['name']] = $this->getSubmittedValue($aOption, $oForm);
+                if($aData[$aOption['name']] === false && !empty($this->sErrorMessage)) {
+                	$this->sCategory = $sCategory;
+					return $this->getJsResult(_t('_adm_stg_err_save_error_message', _t($aOption['caption']), _t($this->sErrorMessage)), false);
+                }
 
                 if(!empty($aOption['check'])) {
                     $sCheckerHelper = '';
@@ -111,6 +125,36 @@ class BxDolStudioSettings extends BxTemplStudioPage
         return $this->getJsResult('_adm_stg_scs_save');
     }
 
+    protected function getSubmittedValue($aOption, &$oForm)
+    {
+    	$mixedValue = '';
+
+    	switch($aOption['type']) {
+    		case 'image':
+    			$mixedValue = (int)getParam($aOption['name']);
+
+    			$aIds = $oForm->getCleanValue($aOption['name']);
+    			if(empty($aIds))
+    				break;
+
+    			$oStorage = BxDolStorage::getObjectInstance($this->sStorage);
+		        if(!$oStorage)
+					break;
+            
+    			$iProfileId = bx_get_logged_profile_id();
+    			foreach($aIds as $iId) {
+    				$mixedValue = $iId;
+
+    				$oStorage->updateGhostsContentId($iId, $iProfileId, $aOption['id']);
+    			}
+    			break;
+
+    		default: 
+    			$mixedValue = $oForm->getCleanValue($aOption['name']);
+    	}
+
+    	return $mixedValue;
+    }
     protected function getProcessedValue($aOption, $mixedValue)
     {
         if(is_array($mixedValue))

studio/template/scripts/BxBaseStudioDesign.php

@@ -76,9 +76,9 @@ class BxBaseStudioDesign extends BxDolStudioDesign
         return $this->$sMethod();
     }
 
-    protected function getSettings()
+    protected function getSettings($sCategory = '')
     {
-        $oPage = new BxTemplStudioSettings($this->sTemplate);
+        $oPage = new BxTemplStudioSettings($this->sTemplate, $sCategory);
 
         return BxDolStudioTemplate::getInstance()->parseHtmlByName('design.html', array(
             'content' => $oPage->getPageCode()

studio/template/scripts/BxBaseStudioSettings.php

@@ -129,7 +129,7 @@ class BxBaseStudioSettings extends BxDolStudioSettings
             )
         );
 
-        $oForm = new BxTemplStudioFormView($aForm);
+        $oForm = new BxTemplStudioFormView($aForm, $oTemplate);
         $oForm->initChecker();
 
         if($oForm->isSubmittedAndValid()) {
@@ -157,6 +157,8 @@ class BxBaseStudioSettings extends BxDolStudioSettings
 
     protected function field($aItem)
     {
+    	$oTemplate = BxDolStudioTemplate::getInstance();
+
         $aField = array();
         switch($aItem['type']) {
             case 'digit':
@@ -240,6 +242,38 @@ class BxBaseStudioSettings extends BxDolStudioSettings
                         'pass' => 'Xss'
                     )
                 );
+                break;
+			case 'image':
+                $aField = array(
+                    'type' => 'files',
+                    'name' => $aItem['name'],
+					'storage_object' => $this->sStorage,
+ 					'images_transcoder' => $this->sTranscoder,
+ 					'uploaders' => array('sys_html5'),
+                	'upload_buttons_titles' => array('HTML5' => _t('_sys_uploader_button_name_single')),
+					'multiple' => false,
+ 					'content_id' => $aItem['id'],
+ 					'ghost_template' => array(
+						'inputs' => array(),
+					),
+                    'caption' => _t($aItem['caption']),
+                    'value' => $aItem['value'],
+                    'db' => array (
+                        'pass' => 'Xss'
+                    )
+                );
+                break;
+			case 'rgb':
+			case 'rgba':
+                $aField = array(
+                    'type' => $aItem['type'],
+                    'name' => $aItem['name'],
+                    'caption' => _t($aItem['caption']),
+                    'value' => $aItem['value'],
+                    'db' => array (
+                        'pass' => 'Xss',
+                    ),
+                );
                 break;
         }
         return $aField;

template/_header.html

@@ -55,8 +55,6 @@
 
             bx_activate_anim_icons('#3e8685');
 
-            $('#bx-toolbar').css({opacity: 0.9});
-
             // hide toolbar on scrolldown, show - on scroll up
             new Headroom($('#bx-toolbar').get(0), {
                 tolerance: {

template/css/general.css

@@ -34,10 +34,6 @@
     width:100%;
     height:48px;
     height:3rem;
-
-    background-color:#3B8686;
-
-    opacity:0;
 }
 
 #bx-toolbar-content {