mirror of
https://github.com/Lastorder-DC/rhymix.git
synced 2026-04-02 01:52:10 +09:00
Enable to select body content area background color.
This commit is contained in:
parent
b4c44968e6
commit
3d470e4972
3 changed files with 34 additions and 6 deletions
|
|
@ -161,5 +161,11 @@
|
|||
<description xml:lang="ko">분위기를 형성하는데 사용되는 중심 색상을 위에서 선택하지 않고 Hex 코드로 직접 입력 합니다. (기본 값: #f44336) 위 항목에서 '커스텀' 항목을 선택해야 적용됩니다.</description>
|
||||
<description xml:lang="en">Please type the mood color you want, if there is no choice before. Insert your color in hex code. (dafault value: #f44336) To use this option, you have to select 'Customized' for the options before.</description>
|
||||
</var>
|
||||
<var name="content_color" type="colorpicker">
|
||||
<title xml:lang="ko">본문 영역 색상</title>
|
||||
<title xml:lang="en">Content area color</title>
|
||||
<description xml:lang="ko">레이아웃 본문 영역 색상을 지정합니다. 기본 색상은 흰색입니다.</description>
|
||||
<description xml:lang="en">Set content area color. The default color is white.</description>
|
||||
</var>
|
||||
</extra_vars>
|
||||
</layout>
|
||||
|
|
@ -8,6 +8,8 @@
|
|||
$layout_info->primary_color = 'red';
|
||||
if(!$layout_info->customized_primary_color)
|
||||
$layout_info->customized_primary_color = '#f44336';
|
||||
if(!$layout_info->content_color)
|
||||
$layout_info->content_color = '#ffffff';
|
||||
|
||||
$material_colors = array(
|
||||
'red' => '#f44336',
|
||||
|
|
@ -46,7 +48,7 @@
|
|||
{Context::addMetaTag("theme-color", $material_colors[$layout_info->primary_color])}
|
||||
|
||||
<!--// Load styles -->
|
||||
{Context::set('layout_scss_value', array('grey' => $material_colors['grey'], 'primary_color' => $material_colors[$layout_info->primary_color], 'menu_position' => $layout_info->menu_position))}
|
||||
{Context::set('layout_scss_value', array('grey' => $material_colors['grey'], 'primary_color' => $material_colors[$layout_info->primary_color], 'menu_position' => $layout_info->menu_position, 'content_color' => $layout_info->content_color))}
|
||||
<load target="layout.scss" vars="$layout_scss_value" />
|
||||
<load target="layout.js" />
|
||||
|
||||
|
|
|
|||
|
|
@ -54,9 +54,11 @@ body {
|
|||
top: 25px
|
||||
}
|
||||
|
||||
.layout_body.layout_frame {
|
||||
background-color: $content_color;
|
||||
}
|
||||
.layout_body {
|
||||
position: relative;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.layout_header:after,
|
||||
|
|
@ -68,6 +70,7 @@ body {
|
|||
|
||||
.layout_content {
|
||||
overflow: auto;
|
||||
padding:10px 0px;
|
||||
}
|
||||
|
||||
.layout_content>*:first-child {
|
||||
|
|
@ -81,7 +84,10 @@ body {
|
|||
|
||||
/* Header */
|
||||
header.layout_frame {
|
||||
position:relative;
|
||||
background-color: lighten($primary-color, 10%);
|
||||
z-index: 1;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24);
|
||||
}
|
||||
.layout_header>h1 {
|
||||
margin:0 auto;
|
||||
|
|
@ -212,7 +218,11 @@ header.layout_frame {
|
|||
background-color: lighten($primary-color, 15%);
|
||||
color: layoutGrayContrast(lighten($primary-color, 15%), 0.710);
|
||||
}
|
||||
|
||||
header .layout_menu li:hover,
|
||||
header .layout_menu li:focus,
|
||||
header .layout_menu li:active {
|
||||
background-color: lighten($grey, 40%);
|
||||
}
|
||||
.layout_menu li a:hover,
|
||||
.layout_menu li a:focus,
|
||||
.layout_menu li a:active,
|
||||
|
|
@ -249,13 +259,22 @@ header.layout_frame {
|
|||
}
|
||||
|
||||
.
|
||||
.layout_menu .layout_dropdown-content a:hover {
|
||||
.layout_menu .layout_dropdown-content a:hover,
|
||||
.layout_menu .layout_dropdown-content a:active,
|
||||
.layout_menu .layout_dropdown-content a:focus {
|
||||
display: block;
|
||||
background-color: lighten($primary-color, 10%);
|
||||
color: layoutGrayContrast(lighten($primary-color, 10%), 0.710);
|
||||
}
|
||||
|
||||
.layout_menu .layout_dropdown:hover .layout_dropdown-content {
|
||||
.layout_menu .layout_dropdown:hover .layout_dropdown-content,
|
||||
.layout_menu .layout_dropdown:active .layout_dropdown-content,
|
||||
.layout_menu .layout_dropdown:focus .layout_dropdown-content,
|
||||
.layout_menu .layout_dropdown a:hover ~ .layout_dropdown-content,
|
||||
.layout_menu .layout_dropdown a:active ~ .layout_dropdown-content,
|
||||
.layout_menu .layout_dropdown a:focus ~ .layout_dropdown-content/* ,
|
||||
.layout_menu .layout_dropdown .layout_dropdown-content:has(> a:hover),
|
||||
.layout_menu .layout_dropdown .layout_dropdown-content:has(> a:focus) */ {
|
||||
display: block;
|
||||
}
|
||||
#layout_fnb{
|
||||
|
|
@ -511,7 +530,8 @@ header.layout_frame {
|
|||
color: layoutGrayContrast(lighten($primary-color, 15%), 0.710);
|
||||
}
|
||||
|
||||
.layout_menu li a:hover, .layout_dropdown:hover .dropbtn {
|
||||
.layout_menu li a:hover, .layout_dropdown:hover .dropbtn,
|
||||
.layout_menu li a:focus, .layout_dropdown:focus .dropbtn {
|
||||
background-color: $primary-color;
|
||||
color: layoutGrayContrast($primary-color, 10%, 0.710);
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue