modified style of user-bar when loged in

This commit is contained in:
jorge-vitrubio 2021-07-05 13:17:28 +02:00
parent ca8263ed84
commit 89bff62c56
2 changed files with 309 additions and 305 deletions

File diff suppressed because one or more lines are too long

View File

@ -1,200 +1,199 @@
//content {
// general styles // general styles
//---------------- //----------------
// //
// mods on fonts and typography // mods on fonts and typography
// not in foundation variables // not in foundation variables
// ----------------------------- // -----------------------------
h1,h2,h3,h4,h5,h6, h1,h2,h3,h4,h5,h6,
.h1,.h2,.h3,.h4,.h5,.h6, .h1,.h2,.h3,.h4,.h5,.h6,
button,.button, button,.button,
header nav { header nav {
font-variant:all-small-caps; font-variant:all-small-caps;
a { a {
color: $body-font-color; color: $body-font-color;
}
}
.excerpt,.post-excerpt{
a {
color: $body-font-color;
&:hover {
p {
color: $anchor-color;
} }
} }
.excerpt,.post-excerpt{ }
a { }
color: $body-font-color;
&:hover { //
p { // main block
color: $anchor-color; //--------------
}
}
main {
article {
@include xy-grid;
header {
@include xy-cell(12);
.entry-title {
width: 100%;
text-align: center;
} }
} }
.entry-content {
// @include breakpoint(small){
// main block
//--------------
main {
article {
@include xy-grid;
header {
@include xy-cell(12);
.entry-title {
width: 100%;
text-align: center;
}
}
.entry-content {
@include breakpoint(small){
@include xy-cell(12);
padding: $global-padding*2 ;
margin:0 auto;
}
@include breakpoint(medium){
@include xy-cell(12);
padding: $global-padding*2 $global-padding*3;
max-width: 50rem;
margin:0 auto;
}
@include breakpoint(xlarge){
@include xy-cell(12);
max-width: 50rem;
padding: $global-padding*2 $global-padding*3;
font-size: $global-font-size*1.2;
margin: 0 auto;
}
}
}
}
//
// news category
//--------------
.news,.news-category {
@include xy-grid;
header,main,aside {
@include breakpoint(small){
padding-top: 0;
@include xy-cell(12);
@include flex;
@include flex-align(center,top);
padding-top: $global-padding*3;
h3 {
line-height: $global-lineheight/1.5;
}
}
}
main {
//@include xy-cell(12);
@include xy-grid;
article{
text-align:center;
@include card-container();
@include breakpoint(small){
@include xy-cell(12);
}
@include breakpoint(medium){
@include xy-cell(6);
}
@include breakpoint(large){
@include xy-cell(4);
}
figure {
@include breakpoint(small){
@include xy-cell(12);
height: 58vw;
max-width: 100%;
overflow: hidden;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
@include breakpoint(medium){
height: 28vw;
}
@include breakpoint(large){
height: 20vw;
}
}
.date {
// height: 1rem;
padding-top: $global-padding*2;
}
.entry-title {
padding-top: $global-padding*2;
line-height: 0.7;
font-size: $global-font-size*1.5;
}
}
}
aside {
@include breakpoint(small){
padding-top:0;
padding-bottom: $global-padding*3;
}
@include breakpoint(medium){
padding-top:$global-padding*3;
padding-bottom: 0;
}
}
}
// end news category
//
// collections category
//--------------
.collections-list {
@include xy-grid;
header,main{
@include xy-cell(12); @include xy-cell(12);
@include flex; padding: $global-padding*2 ;
@include flex-align(center,top); margin:0 auto;
padding: $global-padding*2 0;
} }
header { @include breakpoint(medium){
margin-top: 2*$global-margin; @include xy-cell(12);
border-top: 1px solid $body-font-color; padding: $global-padding*2 $global-padding*3;
padding: $global-padding*2 0; max-width: 50rem;
margin:0 auto;
} }
main { @include breakpoint(xlarge){
@include xy-grid; @include xy-cell(12);
article{ max-width: 50rem;
// text-align:center; padding: $global-padding*2 $global-padding*3;
@include card-container(); font-size: $global-font-size*1.2;
@include breakpoint(small){ margin: 0 auto;
@include xy-cell();
}
@include breakpoint(medium){
}
@include breakpoint(large){
}
margin-bottom:0;
}
table {
thead,tbody,tfoot {
margin: $global-padding*2;
}
}
}
.accordion-content {
@include xy-grid(12);
figure {
@include xy-cell(4);
}
p {
@include xy-cell(6);
}
} }
} }
// end collections category }
}
// partners
// for big announcemnts //
//--------------------- // news category
//--------------
.news,.news-category {
@include xy-grid;
header,main,aside {
@include breakpoint(small){
padding-top: 0;
@include xy-cell(12);
@include flex;
@include flex-align(center,top);
padding-top: $global-padding*3;
h3 {
line-height: $global-lineheight/1.5;
}
}
}
main {
//@include xy-cell(12);
@include xy-grid;
article{
text-align:center;
@include card-container();
@include breakpoint(small){
@include xy-cell(12);
}
@include breakpoint(medium){
@include xy-cell(6);
}
@include breakpoint(large){
@include xy-cell(4);
}
figure {
@include breakpoint(small){
@include xy-cell(12);
height: 58vw;
max-width: 100%;
overflow: hidden;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
}
@include breakpoint(medium){
height: 28vw;
}
@include breakpoint(large){
height: 20vw;
}
}
.date {
// height: 1rem;
padding-top: $global-padding*2;
}
.entry-title {
padding-top: $global-padding*2;
line-height: 0.7;
font-size: $global-font-size*1.5;
}
}
}
aside {
@include breakpoint(small){
padding-top:0;
padding-bottom: $global-padding*3;
}
@include breakpoint(medium){
padding-top:$global-padding*3;
padding-bottom: 0;
}
}
}
// end news category
//
// collections category
//--------------
.collections-list {
@include xy-grid;
header,main{
@include xy-cell(12);
@include flex;
@include flex-align(center,top);
padding: $global-padding*2 0;
}
header {
margin-top: 2*$global-margin;
border-top: 1px solid $body-font-color;
padding: $global-padding*2 0;
}
main {
@include xy-grid;
article{
// text-align:center;
@include card-container();
@include breakpoint(small){
@include xy-cell();
}
@include breakpoint(medium){
}
@include breakpoint(large){
}
margin-bottom:0;
}
table {
thead,tbody,tfoot {
margin: $global-padding*2;
}
}
}
.accordion-content {
@include xy-grid(12);
figure {
@include xy-cell(4);
}
p {
@include xy-cell(6);
}
}
}
// end collections category
// partners
// for big announcemnts
//---------------------
.partners { .partners {
.entry-content { .entry-content {
@ -220,142 +219,147 @@
.wp-block-image { .wp-block-image {
margin: 0; margin: 0;
} }
} }
} }
// //
// hero // hero
// for big announcemnts // for big announcemnts
//--------------------- //---------------------
.hero { .hero {
border-top: 2px solid $primary-color; border-top: 2px solid $primary-color;
.slides { .slides {
@include xy-grid(); @include xy-grid();
.slide { .slide {
@include xy-grid; @include xy-grid;
@include breakpoint(small){ @include breakpoint(small){
width: 100vw; width: 100vw;
margin: 0; margin: 0;
.textwidget { .textwidget {
padding: $global-padding * 3; padding: $global-padding * 3;
}
} }
@include breakpoint(medium){ }
.textwidget { @include breakpoint(medium){
max-width: 50rem; .textwidget {
margin:auto; max-width: 50rem;
padding: $global-padding * 2; margin:auto;
font-size: $global-font-size*1.3; padding: $global-padding * 2;
} font-size: $global-font-size*1.3;
} }
@include breakpoint(large){ }
width: 50%; @include breakpoint(large){
height: calc((50vw*9)/16); width: 50%;
padding: 0; height: calc((50vw*9)/16);
margin: 0; padding: 0;
overflow:hidden; margin: 0;
a { overflow:hidden;
@include flex; a {
@include flex-align (center,middle); @include flex;
} @include flex-align (center,middle);
img { }
img {
// max-width: unset !important; // max-width: unset !important;
height: 100% !important; height: 100% !important;
}
.textwidget {
font-size: $global-font-size*1.2;
padding: $global-padding * 2;
}
} }
@include breakpoint(xlarge){ .textwidget {
.textwidget { font-size: $global-font-size*1.2;
font-size: $global-font-size*1.3; padding: $global-padding * 2;
padding: $global-padding*3;
}
} }
@include breakpoint(xxlarge){ }
.textwidget { @include breakpoint(xlarge){
font-size: $global-font-size*1.6; .textwidget {
padding: $global-padding*3; font-size: $global-font-size*1.3;
} padding: $global-padding*3;
} }
&:first-child { }
background-color: $primary-color; @include breakpoint(xxlarge){
font-variant:all-small-caps; .textwidget {
font-size: $global-font-size*1.6;
padding: $global-padding*3;
} }
color: $white; }
&:first-child {
background-color: $primary-color;
font-variant:all-small-caps;
}
color: $white;
.logo { .logo {
@include breakpoint(medium){ @include breakpoint(medium){
max-width: 80%; max-width: 80%;
}
}
}
}
aside {
@include xy-grid();
background-color: $secondary-color;
nav {
@include xy-cell(auto);
@include flex;
@include flex-align(spaced,middle);
min-height: 6rem;
padding: $global-padding 0 ;
a {
color: $body-font-color;
}
.button {
justify-content:center;
}
}
}
//hero secondary
&.secondary {
border-top: none;
background-color: $secondary-color;
.slide{
figure {
background-color: unset;
}
}
}
&.omeka {
border-top: none;
max-height: unset;
@include breakpoint(small){
.slides {
background-color: $secondary-color;
.slide {
flex-direction: column;
align-content: center;
align-self: center;
margin: $global-margin auto;
&:first-child {
color: unset;
background-color: unset;
font-variant:all-small-caps;
}
figure {
margin: 0 auto;
display:flex;
justify-content: center;
} }
} }
} }
} }
aside { aside {
@include xy-grid(); background-color: $white;
background-color: $secondary-color; flex-direction: column;
nav { align-content: center;
@include xy-cell(auto); h2 {
@include flex; margin: $global-margin;
@include flex-align(spaced,middle);
min-height: 6rem;
padding: $global-padding 0 ;
a {
color: $body-font-color;
}
.button {
justify-content:center;
}
}
}
//hero secondary
&.secondary {
border-top: none;
background-color: $secondary-color;
.slide{
figure {
background-color: unset;
}
}
}
&.omeka {
border-top: none;
max-height: unset;
@include breakpoint(small){
.slides {
background-color: $secondary-color;
.slide {
flex-direction: column;
align-content: center;
align-self: center;
margin: $global-margin auto;
&:first-child {
color: unset;
background-color: unset;
font-variant:all-small-caps;
}
figure {
margin: 0 auto;
display:flex;
justify-content: center;
}
}
}
}
aside {
background-color: $white;
flex-direction: column;
align-content: center;
h2 {
margin: $global-margin;
}
} }
} }
} }
//end hero }
//end hero
//} // omeka specific styles
// end content #user-bar {
width: 100%;
}
//end omeka specific styles