addscss
This commit is contained in:
@ -1,113 +1,68 @@
|
||||
/** Extra columns spacing **/
|
||||
.extra-spacing:not(.col-12), :not(.col12) > .e-content {
|
||||
padding-right: 1rem;
|
||||
|
||||
@include breakpoint(md) {
|
||||
padding-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
/** Breadcrumbs styling **/
|
||||
#breadcrumbs {
|
||||
padding-left: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-top: -1rem;
|
||||
margin-bottom: 1rem;
|
||||
|
||||
|
||||
i {
|
||||
display: none;
|
||||
}
|
||||
|
||||
span, a {
|
||||
padding: 0 0.5rem;
|
||||
&:first-child {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
span, a {
|
||||
&:not(:first-child)::before {
|
||||
color: #e7e9ed;
|
||||
content: "/";
|
||||
padding-right: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/** Blog Listing **/
|
||||
.blog-listing {
|
||||
|
||||
.bricklayer-column {
|
||||
padding-left: 0px;
|
||||
padding-right: 25px;
|
||||
|
||||
}
|
||||
.card {
|
||||
margin-bottom: 25px;
|
||||
border: 0;
|
||||
box-shadow: 0 10px 45px -9px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.card-footer {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.blog-date {
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.label {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
/** Blog Item **/
|
||||
.content-title {
|
||||
margin-bottom: 2rem;
|
||||
|
||||
h2 {
|
||||
margin-bottom: 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.label {
|
||||
font-size: 12px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
/** Pagination **/
|
||||
ul.pagination {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.prev-next {
|
||||
margin-top: 4rem;
|
||||
}
|
||||
|
||||
/** Sidebar specific tweaks **/
|
||||
#sidebar {
|
||||
|
||||
ul.related-pages {
|
||||
box-shadow: none;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
border-bottom: 1px solid $border-color;
|
||||
&:last-child {
|
||||
border-bottom: 0;
|
||||
#item{
|
||||
@include inlineflex();
|
||||
.card{
|
||||
width: calc( (100% / 4) - 45px);
|
||||
margin: 0 15px 30px 15px;
|
||||
position: relative;
|
||||
border: 1px solid black;
|
||||
.card-header{
|
||||
width: auto;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
text-align: right;
|
||||
.publics{
|
||||
padding: 10px;
|
||||
background: grey;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
ul.archives {
|
||||
list-style: none;
|
||||
margin-left: 0;
|
||||
|
||||
.label {
|
||||
vertical-align: text-top;
|
||||
.card-body{
|
||||
padding: 15px;
|
||||
.card-title{
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content{
|
||||
width: 40%;
|
||||
p{
|
||||
margin: 10px 0;
|
||||
}
|
||||
}
|
||||
|
||||
// items
|
||||
.bandeau{
|
||||
width: 100%;
|
||||
height: 300px;
|
||||
overflow: hidden;
|
||||
margin-bottom: 35px;
|
||||
img{
|
||||
transform: translateY(-20%);
|
||||
}
|
||||
}
|
||||
|
||||
.sidebar{
|
||||
margin-left: 50px;
|
||||
.side-agenda{
|
||||
border-top: 1px solid black;
|
||||
padding: 10px 0;
|
||||
&:nth-of-type(3){
|
||||
border-bottom: 1px solid black;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
.side-all-agenda{
|
||||
width: auto;
|
||||
padding: 5px;
|
||||
margin-bottom: 10px;
|
||||
float: right;
|
||||
border: 1px solid black;
|
||||
}
|
||||
.side-newsletter{
|
||||
margin-top: 60px;
|
||||
padding: 20px;
|
||||
background: lightgrey;
|
||||
}
|
||||
}
|
||||
|
@ -1,17 +1,4 @@
|
||||
// Sticky Footer solution
|
||||
body.sticky-footer {
|
||||
height: 100%;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
#page-wrapper {
|
||||
flex: 1 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
#footer {
|
||||
color: #acb3c2;
|
||||
padding: 1rem $horiz-padding 0;
|
||||
text-align: center;
|
||||
#footer{
|
||||
width: 100%;
|
||||
background: grey;
|
||||
}
|
||||
|
@ -1,101 +1,15 @@
|
||||
#header {
|
||||
width: 100%;
|
||||
height: $header-height-large;
|
||||
border-bottom: 1px solid rgba($gray-color, 0.2);
|
||||
@extend .default-animation;
|
||||
|
||||
font-size: 0.7rem;
|
||||
font-weight: 700;
|
||||
|
||||
background: $light-color;
|
||||
color: $dark-color;
|
||||
|
||||
a {
|
||||
color: $dark-color;
|
||||
}
|
||||
|
||||
.logo svg path {
|
||||
fill: $header-color-dark;
|
||||
}
|
||||
|
||||
.header-dark &:not(.scrolled) {
|
||||
background: $header-color-dark;
|
||||
color: $light-color;
|
||||
a {
|
||||
color: rgba($light-color, 0.7) !important;
|
||||
}
|
||||
a.active {
|
||||
color: $light-color !important;
|
||||
}
|
||||
.dropmenu ul ul a {
|
||||
color: $dark-color !important;
|
||||
}
|
||||
.logo svg path {
|
||||
fill: $light-color;
|
||||
}
|
||||
}
|
||||
|
||||
.header-dark.header-transparent &:not(.scrolled) {
|
||||
background: rgba(#000, 0.05);
|
||||
}
|
||||
|
||||
.header-transparent &:not(.scrolled) {
|
||||
background: rgba(#fff, 0.05);
|
||||
//border-bottom: 0 !important;
|
||||
}
|
||||
|
||||
.navbar-section {
|
||||
height: $header-height-large;
|
||||
@extend .default-animation;
|
||||
|
||||
@include breakpoint(md) {
|
||||
margin-right: 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.navbar-section.desktop-menu {
|
||||
@include breakpoint(md) {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.logo {
|
||||
svg, img {
|
||||
height: 42px;
|
||||
display: inherit;
|
||||
@extend .default-animation;
|
||||
}
|
||||
}
|
||||
|
||||
// Fixed Header solution
|
||||
.header-fixed & {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
z-index: 2;
|
||||
}
|
||||
}
|
||||
|
||||
// Animate Fixed Header
|
||||
body.header-fixed.header-animated {
|
||||
#header.scrolled {
|
||||
height: $header-height-small;
|
||||
|
||||
.navbar-section {
|
||||
height: $header-height-small;
|
||||
}
|
||||
|
||||
.logo {
|
||||
svg, img {
|
||||
height: 28px;
|
||||
#header{
|
||||
nav{
|
||||
@include inlineflex();
|
||||
height: 100px;
|
||||
& > ul{
|
||||
@include inlineflex();
|
||||
li{
|
||||
margin-left: 10px;
|
||||
& > ul{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
~ .mobile-menu .button_container {
|
||||
top: 0.5rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.login-status-wrapper {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
@ -1,94 +0,0 @@
|
||||
.dropmenu {
|
||||
|
||||
@include breakpoint(md) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
ul {
|
||||
white-space: nowrap;
|
||||
margin: 0;
|
||||
display: flex;
|
||||
|
||||
li {
|
||||
position: relative;
|
||||
margin: 0;
|
||||
|
||||
a {
|
||||
text-decoration: none;
|
||||
padding: $dropmenu-vert-padding ($dropmenu-horiz-padding + $dropmenu-child-padding) $dropmenu-vert-padding $dropmenu-horiz-padding;
|
||||
display: block;
|
||||
|
||||
&:hover, &:focus, &.active {
|
||||
color: $dropmenu-hover-text !important;
|
||||
}
|
||||
|
||||
&:before {
|
||||
content: '\f107';
|
||||
font-family: 'FontAwesome';
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
float: right;
|
||||
margin-right: - (2 *$dropmenu-child-padding);
|
||||
}
|
||||
|
||||
&:only-child {
|
||||
//background: none;
|
||||
padding-right: $dropmenu-horiz-padding;
|
||||
|
||||
&:before {
|
||||
content: '';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&:hover {
|
||||
& > ul {
|
||||
display: block;
|
||||
visibility: visible;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ul li a:before {
|
||||
content: '\f105';
|
||||
}
|
||||
|
||||
ul {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
list-style: none;
|
||||
background: $dropmenu-bg;
|
||||
box-shadow: $dropmenu-shadow;
|
||||
visibility: hidden;
|
||||
|
||||
ul {
|
||||
position: absolute;
|
||||
left: 100%;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
& > ul > li {
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
// Animation options
|
||||
&.animated {
|
||||
ul li {
|
||||
transition: background .7s, color 0.5s;
|
||||
}
|
||||
|
||||
ul li:hover > ul {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
ul ul {
|
||||
transition: transform .3s, opacity .5s;
|
||||
opacity: 0;
|
||||
transform: translateY(-10px);
|
||||
}
|
||||
}
|
||||
}
|
@ -1,162 +1,44 @@
|
||||
html {
|
||||
@include fluid-type($size-xs, $size-xl, $min-responsive-font-size, $html-font-size);
|
||||
html, body{
|
||||
font-family: $Regular;
|
||||
}
|
||||
|
||||
// Header Overrides
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
margin-top: 2rem;
|
||||
font-family: $title-font-family;
|
||||
color: darken($body-font-color, 10%);
|
||||
h1{
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
h1, .h1 {
|
||||
font-size: 3rem;
|
||||
h2{
|
||||
font-size: 2rem;
|
||||
}
|
||||
|
||||
h2, .h2 {
|
||||
font-size: 1.8rem;
|
||||
h5{
|
||||
font-weight: normal;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
h6, .h6 {
|
||||
font-weight: 400;
|
||||
.card-title{
|
||||
font-family: $Bold;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
|
||||
.title-center {
|
||||
h1, h2 {
|
||||
text-align: center;
|
||||
p{
|
||||
strong{
|
||||
font-family: $Bold;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
|
||||
.title-h1h2 {
|
||||
h1 {
|
||||
font-weight: 100;
|
||||
margin-bottom: 0;
|
||||
line-height: 1.1;
|
||||
|
||||
strong, bold {
|
||||
font-weight: 400;
|
||||
.content{
|
||||
p:nth-of-type(1){
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
h1 + h2 {
|
||||
line-height: 1.1;
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// Typography Hints
|
||||
.title-h1h2, .title-center {
|
||||
h1 + h2 {
|
||||
margin-bottom: 50px;
|
||||
font-weight: 700;
|
||||
}
|
||||
}
|
||||
|
||||
a:focus {
|
||||
outline: none !important;
|
||||
box-shadow: none !important;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
|
||||
// Codeblocks
|
||||
pre code, pre.xdebug-var-dump{
|
||||
background: #fafafa;
|
||||
display: block;
|
||||
padding: 1rem !important;
|
||||
line-height: 1.5;
|
||||
color: inherit;
|
||||
border-radius: 2px;
|
||||
overflow-x: auto;
|
||||
}
|
||||
|
||||
pre {
|
||||
code:not(.hljs) {
|
||||
background: #f8f8f8;
|
||||
}
|
||||
}
|
||||
|
||||
// Icon Tweaks
|
||||
i.fa {
|
||||
|
||||
|
||||
&.fa-heart, &.fa-heart-o {
|
||||
&.pulse {
|
||||
color: #920
|
||||
.sidebar{
|
||||
.side-newsletter{
|
||||
label{
|
||||
font-size: 1.5rem;
|
||||
font-weight: normal;
|
||||
font-family: $Bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Font Weights
|
||||
b,
|
||||
strong {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.heavy {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.light {
|
||||
font-weight: 200;
|
||||
}
|
||||
|
||||
// Colors
|
||||
.text-light {
|
||||
color: rgba($light-color, 0.8);
|
||||
|
||||
h1, h2, h3, h4, h5, h6 {
|
||||
color: rgba($light-color, 0.9);
|
||||
}
|
||||
}
|
||||
|
||||
// Error configuration
|
||||
#error {
|
||||
text-align: center;
|
||||
position: relative;
|
||||
margin-top: 5rem;
|
||||
|
||||
.icon {
|
||||
font-size: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
// Messages
|
||||
#messages {
|
||||
margin-bottom: 1rem;
|
||||
|
||||
.icon {
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
// Lists
|
||||
ul,
|
||||
ol {
|
||||
margin-left: $unit-8;
|
||||
|
||||
ul,
|
||||
ol {
|
||||
margin-left: $unit-8;
|
||||
}
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style: disc outside;
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style: decimal outside;
|
||||
}
|
||||
|
||||
// Notices
|
||||
.notices {
|
||||
margin: 1.5rem 0;
|
||||
p {
|
||||
margin: 1rem 0;
|
||||
}
|
||||
}
|
||||
|
||||
|
Reference in New Issue
Block a user