You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
256 lines
4.8 KiB
256 lines
4.8 KiB
//@format; |
|
%diy-card { |
|
background: white url(../images/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; |
|
} |
|
} |
|
.layout__region--first { |
|
padding-right: calc($global-padding/2); |
|
} |
|
.layout__region--second { |
|
border-left: 1px solid #ccc; |
|
padding-left: calc($global-padding/2); |
|
.field--name-field-guide-body { |
|
margin-left: $global-margin; |
|
} |
|
} |
|
.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; |
|
} |
|
} |
|
.page-node-type-diy_guide { |
|
.layout__region--first h1 { |
|
margin-top: $global-margin; |
|
//border-bottom: 1px solid #ccc; |
|
} |
|
} |
|
.page-node-type-diy_guide, |
|
.page-node-type-guide_categories { |
|
.layout__region--first h2 { |
|
@extend h1; |
|
margin-top: $global-margin; |
|
border-bottom: 1px solid #ccc; |
|
} |
|
} |
|
|
|
.page-node-type-guide_categories, |
|
.page-node-type-front_page { |
|
nav.tabs, |
|
h1.page-title { |
|
display: none; |
|
} |
|
} |
|
.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'); |
|
} |
|
} |
|
} |
|
.field--name-field-guide-page-title { |
|
@extend h1; |
|
margin-top: $global-margin; |
|
} |
|
.diy-sidebar-title { |
|
//text-align: center; |
|
} |
|
.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; |
|
} |
|
} |
|
.field--name-field-guide-title, |
|
.page-node-type-guide_categories .field--name-field-list-title { |
|
@extend h2; |
|
text-align: center; |
|
border-bottom: 1px solid #ccc; |
|
text-transform: capitalize; |
|
//padding-bottom: $global-padding; |
|
line-height: 1.6; |
|
margin-top: $global-margin; |
|
} |
|
.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: '> '; |
|
}
|
|
|