added linked materials in modalCard
This commit is contained in:
@@ -1839,7 +1839,43 @@ article.card {
|
||||
width: 423px;
|
||||
height: 295px; }
|
||||
article.card.minicard {
|
||||
height: 100px; }
|
||||
height: 100px;
|
||||
width: 170px;
|
||||
height: 100px;
|
||||
margin: auto; }
|
||||
article.card.minicard > header {
|
||||
padding: 0.3em 0.3em 0.1em; }
|
||||
article.card.minicard > header h1 {
|
||||
margin: 0; }
|
||||
article.card.minicard > nav.tools {
|
||||
top: auto;
|
||||
bottom: 0;
|
||||
padding: 0 0.2em;
|
||||
background: transparent; }
|
||||
article.card.minicard > nav.tools .mdi.unflag {
|
||||
cursor: pointer; }
|
||||
article.card.linkedmaterialcard {
|
||||
width: 200px;
|
||||
height: 110px; }
|
||||
article.card.linkedmaterialcard > header {
|
||||
padding: 0.3em 0.3em 0.1em;
|
||||
cursor: pointer; }
|
||||
article.card.linkedmaterialcard > header h1 {
|
||||
margin: 0;
|
||||
font-size: 1em; }
|
||||
article.card.linkedmaterialcard > header h4 {
|
||||
margin: 0;
|
||||
line-height: 1.1;
|
||||
margin-bottom: -0.4em; }
|
||||
article.card.linkedmaterialcard > header span.ref {
|
||||
line-height: 0.5; }
|
||||
article.card.linkedmaterialcard > nav.tools {
|
||||
top: auto;
|
||||
bottom: 0;
|
||||
padding: 0 0.2em;
|
||||
background: transparent; }
|
||||
article.card.linkedmaterialcard > nav.tools .mdi.unflag {
|
||||
cursor: pointer; }
|
||||
article.card header {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
@@ -1860,7 +1896,8 @@ article.card {
|
||||
article.card header h4 {
|
||||
font-size: 0.882em;
|
||||
font-weight: 300;
|
||||
line-height: 1; }
|
||||
line-height: 1.1;
|
||||
margin-bottom: -0.2em; }
|
||||
article.card header span.ref {
|
||||
font-size: 0.693em;
|
||||
font-weight: 300;
|
||||
@@ -1952,24 +1989,22 @@ article.card {
|
||||
flex-basis: 50%; }
|
||||
article.card.modal-card section.col-right > *:not(nav.tools) {
|
||||
position: relative;
|
||||
padding: 0.5em;
|
||||
padding: 0.5em 0.5em 0;
|
||||
box-sizing: border-box;
|
||||
width: 100%; }
|
||||
article.card.modal-card section.col-right header {
|
||||
article.card.modal-card section.col-right > header {
|
||||
bottom: auto; }
|
||||
article.card.modal-card section.col-right section.samples ul {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
font-size: 0.882em;
|
||||
font-weight: 300; }
|
||||
article.card.modal-card section.col-right section.samples ul li {
|
||||
padding-right: 0.5em; }
|
||||
article.card.modal-card section.col-right section.samples ul li span.showroom {
|
||||
font-weight: 500; }
|
||||
article.card.modal-card section.col-right section.body p {
|
||||
font-size: 0.882em;
|
||||
font-weight: 300;
|
||||
line-height: 1.35; }
|
||||
line-height: 1.35;
|
||||
margin: 0 0 0.5em; }
|
||||
article.card.modal-card section.col-right section.linked-materials {
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
justify-content: space-between; }
|
||||
article.card.modal-card section.col-right section.linked-materials > article.linkedmaterialcard {
|
||||
flex-basis: 0 0 50%; }
|
||||
article.card.modal-card section.col-right nav.tools {
|
||||
opacity: 1; }
|
||||
article.card.modal-card section.col-right nav.tools section.close span.btn.mdi-close {
|
||||
|
File diff suppressed because one or more lines are too long
@@ -13,5 +13,8 @@ $card_height: 295px;
|
||||
$minicard_width: 170px;
|
||||
$minicard_height: 100px;
|
||||
|
||||
$linkedmaterialcard_width: 200px;
|
||||
$linkedmaterialcard_height: 110px;
|
||||
|
||||
$modalcard_width: 850px;
|
||||
$modalcard_height: 610px;
|
||||
|
@@ -947,6 +947,53 @@ article.card{
|
||||
}
|
||||
&.minicard{
|
||||
height:100px;
|
||||
width:$minicard_width;
|
||||
height:$minicard_height;
|
||||
margin:auto;
|
||||
>header{
|
||||
padding: 0.3em 0.3em 0.1em;
|
||||
h1{
|
||||
margin:0;
|
||||
}
|
||||
}
|
||||
>nav.tools{
|
||||
top: auto;
|
||||
bottom: 0;
|
||||
padding:0 0.2em;
|
||||
background:transparent;
|
||||
.mdi.unflag{
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.linkedmaterialcard{
|
||||
width:$linkedmaterialcard_width;
|
||||
height:$linkedmaterialcard_height;
|
||||
>header{
|
||||
padding: 0.3em 0.3em 0.1em;
|
||||
cursor: pointer;
|
||||
h1{
|
||||
margin:0;
|
||||
font-size: 1em;
|
||||
}
|
||||
h4{
|
||||
margin:0;
|
||||
line-height: 1.1;
|
||||
margin-bottom: -0.4em;
|
||||
}
|
||||
span.ref{
|
||||
line-height: 0.5;
|
||||
}
|
||||
}
|
||||
>nav.tools{
|
||||
top: auto;
|
||||
bottom: 0;
|
||||
padding:0 0.2em;
|
||||
background:transparent;
|
||||
.mdi.unflag{
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
// &.card-small{
|
||||
// width:100px; height:140px;
|
||||
@@ -976,8 +1023,8 @@ article.card{
|
||||
h4{
|
||||
font-size: 0.882em;
|
||||
font-weight: 300;
|
||||
line-height: 1;
|
||||
// margin-bottom: 0.1em;
|
||||
line-height: 1.1;
|
||||
margin-bottom: -0.2em;
|
||||
}
|
||||
span.ref{
|
||||
font-size: 0.693em;
|
||||
@@ -1101,34 +1148,43 @@ article.card{
|
||||
section.col-right{
|
||||
>*:not(nav.tools){
|
||||
position: relative;
|
||||
padding: 0.5em;
|
||||
padding: 0.5em 0.5em 0;
|
||||
box-sizing: border-box;
|
||||
width: 100%;
|
||||
}
|
||||
header{
|
||||
>header{
|
||||
bottom: auto;
|
||||
}
|
||||
section.samples{
|
||||
ul{
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
font-size: 0.882em;
|
||||
font-weight: 300;
|
||||
// line-height: 1.35;
|
||||
li{
|
||||
padding-right: 0.5em;
|
||||
span.showroom{ font-weight: 500; }
|
||||
}
|
||||
}
|
||||
}
|
||||
// section.samples{
|
||||
// ul{
|
||||
// display: flex;
|
||||
// flex-flow: row wrap;
|
||||
// font-size: 0.882em;
|
||||
// font-weight: 300;
|
||||
// // line-height: 1.35;
|
||||
// li{
|
||||
// padding-right: 0.5em;
|
||||
// span.showroom{ font-weight: 500; }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
section.body{
|
||||
p{
|
||||
font-size: 0.882em;
|
||||
font-weight: 300;
|
||||
line-height: 1.35;
|
||||
margin:0 0 0.5em;
|
||||
}
|
||||
|
||||
}
|
||||
section.linked-materials{
|
||||
display: flex;
|
||||
flex-flow: row;
|
||||
justify-content: space-between;
|
||||
>article.linkedmaterialcard{
|
||||
flex-basis: 0 0 50%;
|
||||
}
|
||||
}
|
||||
nav.tools{
|
||||
opacity: 1;
|
||||
section.close{
|
||||
|
Reference in New Issue
Block a user