10 changed files with 639 additions and 2 deletions
File diff suppressed because one or more lines are too long
@ -0,0 +1,213 @@ |
|||||||
|
//@format; |
||||||
|
%diy-card { |
||||||
|
background: white url(../img/nav-arrow.png) no-repeat 95% 92%; |
||||||
|
color: #333; |
||||||
|
//font-size: 120%; |
||||||
|
width: 200px; |
||||||
|
padding: 20px; |
||||||
|
margin: 15px 5px; |
||||||
|
max-height: 120px; |
||||||
|
min-height: 120px; |
||||||
|
display: block; |
||||||
|
border-top: 4px solid $red; |
||||||
|
border-collapse: separate; |
||||||
|
box-shadow: 4px 4px 6px grey; |
||||||
|
border-bottom-right-radius: 15px; |
||||||
|
text-decoration: none; |
||||||
|
line-height: 1.3; |
||||||
|
} |
||||||
|
/* |
||||||
|
*page layout |
||||||
|
*/ |
||||||
|
$diy-layout-bp: rem-calc(636); |
||||||
|
.diy-layout { |
||||||
|
display: flex; |
||||||
|
flex-direction: column; |
||||||
|
@include breakpoint($diy-layout-bp) { |
||||||
|
flex-direction: row; |
||||||
|
|
||||||
|
.diy_side { |
||||||
|
flex: 0 0 300px; |
||||||
|
} |
||||||
|
} |
||||||
|
.diy_side { |
||||||
|
//flex: 0 0 300px; |
||||||
|
} |
||||||
|
.diy_content { |
||||||
|
} |
||||||
|
} |
||||||
|
|
||||||
|
//$diy-header-height: rem-calc(110); |
||||||
|
$diy-header-height: initial; |
||||||
|
.diy-main-title { |
||||||
|
border-bottom: 1px solid #ccc !important; |
||||||
|
@include breakpoint($diy-layout-bp) { |
||||||
|
height: $diy-header-height; |
||||||
|
} |
||||||
|
h1 { |
||||||
|
font-size: 2rem; |
||||||
|
border-bottom: none; |
||||||
|
margin-bottom: 0.5rem; |
||||||
|
} |
||||||
|
} |
||||||
|
.home-link { |
||||||
|
margin: $global-margin; |
||||||
|
a { |
||||||
|
@include button(); |
||||||
|
@include button( |
||||||
|
false, |
||||||
|
$button-background, |
||||||
|
$button-background-hover, |
||||||
|
$button-color, |
||||||
|
hollow |
||||||
|
); |
||||||
|
} |
||||||
|
} |
||||||
|
.related-diys { |
||||||
|
//background: #ccc; |
||||||
|
h2 { |
||||||
|
text-align: center; |
||||||
|
} |
||||||
|
//ul { |
||||||
|
//list-style: none; |
||||||
|
//margin: 0; |
||||||
|
//} |
||||||
|
.item-list a { |
||||||
|
font-family: 'Roboto Condensed', sans-serif; |
||||||
|
text-decoration: none; |
||||||
|
} |
||||||
|
.field-content { |
||||||
|
//display: flex; |
||||||
|
//justify-content: space-around; |
||||||
|
} |
||||||
|
} |
||||||
|
.diy_content { |
||||||
|
@include breakpoint($diy-layout-bp) { |
||||||
|
padding-left: 1rem; |
||||||
|
border-left: 1px solid #ccc; |
||||||
|
} |
||||||
|
} |
||||||
|
.diy-guide-title { |
||||||
|
//font-size: 2.4rem; |
||||||
|
@include breakpoint($diy-layout-bp) { |
||||||
|
height: $diy-header-height; |
||||||
|
} |
||||||
|
} |
||||||
|
.related-diys { |
||||||
|
display: none; |
||||||
|
@include breakpoint($diy-layout-bp) { |
||||||
|
display: block; |
||||||
|
} |
||||||
|
} |
||||||
|
.related-diys .diy-grid--block a { |
||||||
|
@extend %diy-card; |
||||||
|
} |
||||||
|
|
||||||
|
.add-new .views-row { |
||||||
|
//@include button-group($child-selector, $spacing); |
||||||
|
@include button-group(); |
||||||
|
display: flex; |
||||||
|
justify-content: flex-end; |
||||||
|
} |
||||||
|
.add-new a { |
||||||
|
@include button( |
||||||
|
false, |
||||||
|
$button-background, |
||||||
|
$button-background-hover, |
||||||
|
$button-color, |
||||||
|
hollow |
||||||
|
); |
||||||
|
margin-left: 10px; |
||||||
|
} |
||||||
|
.related-diys .attachment .diy-grid--block a { |
||||||
|
@extend %diy-card; |
||||||
|
@include button( |
||||||
|
false, |
||||||
|
$button-background, |
||||||
|
$button-background-hover, |
||||||
|
$button-color, |
||||||
|
hollow |
||||||
|
); |
||||||
|
} |
||||||
|
.diy-grid .diy-grid--block { |
||||||
|
display: flex; |
||||||
|
justify-content: space-around; |
||||||
|
a { |
||||||
|
@extend %diy-card; |
||||||
|
} |
||||||
|
} |
||||||
|
.diy-grid { |
||||||
|
//&--block { |
||||||
|
//a { |
||||||
|
//@extend %diy-card; |
||||||
|
////padding: 1em; |
||||||
|
////@include card-container; |
||||||
|
////border-top: 4px solid #8c2004; |
||||||
|
////height: 5rem; |
||||||
|
//} |
||||||
|
//} |
||||||
|
.view-content { |
||||||
|
//@include flex-grid-row(null, $grid-row-width, 4, true, 2em); |
||||||
|
@include xy-grid; |
||||||
|
@include xy-grid-layout(1, '.diy-grid--block'); |
||||||
|
@include breakpoint(836px) { |
||||||
|
@include xy-grid-layout(2, '.diy-grid--block'); |
||||||
|
} |
||||||
|
@include breakpoint(1074px) { |
||||||
|
@include xy-grid-layout(3, '.diy-grid--block'); |
||||||
|
} |
||||||
|
} |
||||||
|
} |
||||||
|
.diy-sidebar-title { |
||||||
|
//text-align: center; |
||||||
|
} |
||||||
|
.bryant-content.bryant-content-region { |
||||||
|
border-left: 1px solid #ccc; |
||||||
|
} |
||||||
|
.add-new-diy-guide { |
||||||
|
text-align: right; |
||||||
|
line-height: 1; |
||||||
|
a { |
||||||
|
font-size: 0.8rem; |
||||||
|
text-decoration: none; |
||||||
|
} |
||||||
|
} |
||||||
|
.diy-guide-title .field__items { |
||||||
|
//height: 10rem; |
||||||
|
//display: flex; |
||||||
|
.field__item { |
||||||
|
//align-self: flex-end; |
||||||
|
} |
||||||
|
} |
||||||
|
.diy-category-wrapper { |
||||||
|
//height: 106px; |
||||||
|
.diy-category-title { |
||||||
|
text-align: center; |
||||||
|
margin-bottom: 0; |
||||||
|
width: 100%; |
||||||
|
} |
||||||
|
} |
||||||
|
.diy-home-title h1 { |
||||||
|
line-height: 1.1; |
||||||
|
//height: 106px; |
||||||
|
} |
||||||
|
.section-lib-diy .content .page_title { |
||||||
|
//display: none; |
||||||
|
} |
||||||
|
.diy-admin-links { |
||||||
|
float: right; |
||||||
|
a { |
||||||
|
margin-left: 1rem; |
||||||
|
} |
||||||
|
} |
||||||
|
.panel-pane { |
||||||
|
border: none; |
||||||
|
} |
||||||
|
.related-diys ul { |
||||||
|
list-style-type: none; |
||||||
|
text-align: center; |
||||||
|
margin: 0; |
||||||
|
} |
||||||
|
.related-diys ul li a:before { |
||||||
|
content: '> '; |
||||||
|
} |
||||||
@ -0,0 +1,23 @@ |
|||||||
|
<?php |
||||||
|
/** |
||||||
|
* @file |
||||||
|
* Template for a 1 column panel layout. |
||||||
|
* |
||||||
|
* This template provides a very simple "one column" panel display layout. |
||||||
|
* |
||||||
|
* Variables: |
||||||
|
* - $css_id: An optional CSS ID. |
||||||
|
* - $id_attribute: The whole id="$css_id" string. |
||||||
|
* - $content: An array of content, each item in the array is keyed to one |
||||||
|
* panel of the layout. This layout supports the following sections: |
||||||
|
* $content['middle']: The only panel in the layout. |
||||||
|
*/ |
||||||
|
?> |
||||||
|
<section class="grid-x <?php print $panel_classes; ?>"<?php print $panel_id; ?>>
|
||||||
|
<div class="cell medium-4 diy_side"> |
||||||
|
<?php print $content['side']; ?> |
||||||
|
</div> |
||||||
|
<div class="cell medium-8 diy_content"> |
||||||
|
<?php print $content['content']; ?> |
||||||
|
</div> |
||||||
|
</section> |
||||||
@ -0,0 +1,39 @@ |
|||||||
|
<?php |
||||||
|
/** |
||||||
|
* @file |
||||||
|
* Define the a single-column style plugin. |
||||||
|
*/ |
||||||
|
|
||||||
|
// Plugin definition. |
||||||
|
$plugin = array( |
||||||
|
'title' => t('DIY layout'), |
||||||
|
'category' => t('Rob Custom'), |
||||||
|
'icon' => 'onecol_clean.png', |
||||||
|
'theme' => 'diy_layout', |
||||||
|
'regions' => array( |
||||||
|
'side' => t('Side'), |
||||||
|
'content' => t('Content') |
||||||
|
|
||||||
|
)); |
||||||
|
|
||||||
|
/** |
||||||
|
* Prepares variables for panels_onecol_clean templates. |
||||||
|
* |
||||||
|
* Default template: panels-onecol-clean.tpl.php. |
||||||
|
* |
||||||
|
* @param array $variables |
||||||
|
* An associative array containing: |
||||||
|
* - $content: An array of content, each item in the array is keyed to one |
||||||
|
* panel of the layout. |
||||||
|
*/ |
||||||
|
function template_preprocess_diy_layout(&$variables) { |
||||||
|
// Construct an ID/Class attributes. |
||||||
|
$variables['panel_classes'] = 'panel-display diy-layout clearfix'; |
||||||
|
if ($variables['css_id']) { |
||||||
|
$variables['panel_id'] = ' id="' . $variables['css_id'] . '"'; |
||||||
|
$variables['panel_classes'] .= ' ' . $variables['css_id']; |
||||||
|
} |
||||||
|
else { |
||||||
|
$variables['panel_id'] = ''; |
||||||
|
} |
||||||
|
} |
||||||
|
After Width: | Height: | Size: 122 B |
@ -0,0 +1,23 @@ |
|||||||
|
<?php |
||||||
|
/** |
||||||
|
* @file |
||||||
|
* Template for a 1 column panel layout. |
||||||
|
* |
||||||
|
* This template provides a very simple "one column" panel display layout. |
||||||
|
* |
||||||
|
* Variables: |
||||||
|
* - $css_id: An optional CSS ID. |
||||||
|
* - $id_attribute: The whole id="$css_id" string. |
||||||
|
* - $content: An array of content, each item in the array is keyed to one |
||||||
|
* panel of the layout. This layout supports the following sections: |
||||||
|
* $content['middle']: The only panel in the layout. |
||||||
|
*/ |
||||||
|
?> |
||||||
|
<section class="grid-x <?php print $panel_classes; ?>"<?php print $panel_id; ?>>
|
||||||
|
<div class="cell medium-4 diy_side"> |
||||||
|
<?php print $content['side']; ?> |
||||||
|
</div> |
||||||
|
<div class="cell medium-8 diy_content"> |
||||||
|
<?php print $content['content']; ?> |
||||||
|
</div> |
||||||
|
</section> |
||||||
@ -0,0 +1,39 @@ |
|||||||
|
<?php |
||||||
|
/** |
||||||
|
* @file |
||||||
|
* Define the a single-column style plugin. |
||||||
|
*/ |
||||||
|
|
||||||
|
// Plugin definition. |
||||||
|
$plugin = array( |
||||||
|
'title' => t('DIY layout'), |
||||||
|
'category' => t('Rob Custom'), |
||||||
|
'icon' => 'onecol_clean.png', |
||||||
|
'theme' => 'diy_layout', |
||||||
|
'regions' => array( |
||||||
|
'side' => t('Side'), |
||||||
|
'content' => t('Content') |
||||||
|
|
||||||
|
)); |
||||||
|
|
||||||
|
/** |
||||||
|
* Prepares variables for panels_onecol_clean templates. |
||||||
|
* |
||||||
|
* Default template: panels-onecol-clean.tpl.php. |
||||||
|
* |
||||||
|
* @param array $variables |
||||||
|
* An associative array containing: |
||||||
|
* - $content: An array of content, each item in the array is keyed to one |
||||||
|
* panel of the layout. |
||||||
|
*/ |
||||||
|
function template_preprocess_diy_layout(&$variables) { |
||||||
|
// Construct an ID/Class attributes. |
||||||
|
$variables['panel_classes'] = 'panel-display diy-layout clearfix'; |
||||||
|
if ($variables['css_id']) { |
||||||
|
$variables['panel_id'] = ' id="' . $variables['css_id'] . '"'; |
||||||
|
$variables['panel_classes'] .= ' ' . $variables['css_id']; |
||||||
|
} |
||||||
|
else { |
||||||
|
$variables['panel_id'] = ''; |
||||||
|
} |
||||||
|
} |
||||||
|
After Width: | Height: | Size: 122 B |
Loading…
Reference in new issue