bachir/materio-d9
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

folders beta 1

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2020-12-01 20:40:37 +01:00
parent 93c4707c45
commit 564a1638fc
12 changed files with 234 additions and 139 deletions
Download Patch File Download Diff File Expand all files Collapse all files

54
web/themes/custom/materiotheme/assets/dist/main.css vendored
View File

@@ -1182,10 +1182,12 @@ main[role="main"] {
display: flex;
flex-direction: row-reverse; }
main[role="main"] > .scroller > .wrapper #content-left {
flex-basis: 218px;
flex-basis: 205px;
flex-shrink: 0; }
main[role="main"] > .scroller > .wrapper #content-left > * {
width: 100%; }
width: 100%;
box-sizing: border-box;
padding: 0.5em 13px; }
main[role="main"] > .scroller > .wrapper #content-center {
flex-basis: 110%; }
@@ -1303,10 +1305,11 @@ header[role="banner"] {
position: absolute;
right: 0;
top: 1.7em;
box-sizing: content-box; }
box-sizing: content-box;
z-index: 30; }
header[role="banner"] #user-flags:hover ul {
transition-delay: 0s;
max-height: 12em;
max-height: 50em;
padding: 1em 1em;
box-shadow: 0 0 10px #ccc; }
header[role="banner"] #user-flags li {
@@ -1460,7 +1463,8 @@ aside.messages {
#content-left .flag-collection > header {
display: flex;
flex-direction: row;
justify-content: space-between; }
justify-content: space-between;
padding-bottom: 13px; }
#content-left .flag-collection > header .mdi-close {
cursor: pointer;
align-self: flex-end; }
@@ -1468,13 +1472,20 @@ aside.messages {
margin: 0 0 13px 0;
padding: 0; }
#content-left .flag-collection > ul > li article.card.minicard {
width: 100%; }
width: 170px;
height: 100px;
margin: auto; }
#content-left .flag-collection > ul > li article.card.minicard > header {
padding: 0.3em 0.3em 0.1em; }
#content-left .flag-collection > ul > li article.card.minicard > header h1 {
margin: 0; }
#content-left .flag-collection > ul > li article.card.minicard > nav.tools {
padding: 0 0.2em; }
top: auto;
bottom: 0;
padding: 0 0.2em;
background: transparent; }
#content-left .flag-collection > ul > li article.card.minicard > nav.tools .mdi.unflag {
cursor: pointer; }
article.node--type-frontpage .node__content > section.home-intro > div:nth-child(1) .field__label, article.node--type-frontpage .node__content > section.home-pricing > div:nth-child(1) .field__label, article.node--type-frontpage .node__content > section.home-database > div:nth-child(1) .field__label, article.node--type-frontpage .node__content > section.home-showrooms > div:nth-child(1) .field__label, article.node--type-frontpage .node__content > section.home-blabla > div:nth-child(1) .field__label {
font-size: 3.5em;
@@ -1681,10 +1692,12 @@ article.card {
top: 0;
right: 0;
z-index: 21;
width: 1em;
width: 15px;
background-color: #fff;
box-sizing: content-box;
padding: 0.3em 0.1em; }
padding: 0.3em 0.1em;
opacity: 0;
transition: opacity 0.2s ease-in-out; }
article.card nav.tools > * {
overflow: visible;
position: relative; }
@@ -1695,11 +1708,26 @@ article.card {
position: absolute;
top: 0px;
right: 100%;
width: 5em;
box-sizing: content-box;
width: 180px;
box-sizing: border-box;
padding: 0.3em;
background-color: #fff;
box-shadow: -2px 3px 4px rgba(0, 0, 0, 0.2); }
box-shadow: -2px 3px 4px rgba(0, 0, 0, 0.2);
opacity: 0;
max-height: 0;
max-width: 0;
overflow: hidden;
transition: all 0.2s ease-in-out; }
article.card nav.tools > *:hover .tool-content {
transition: all 0.3s ease-in-out;
opacity: 1;
max-height: 195px;
max-width: 200px; }
article.card nav.tools .tool.flags .tool-content ul {
display: flex;
flex-flow: row wrap; }
article.card nav.tools .tool.flags .tool-content ul li {
padding: 0 0.5em 0 0; }
article.card nav.tools .tool.flags span.flag {
cursor: pointer;
font-size: 0.756em;
@@ -1707,6 +1735,8 @@ article.card {
transition: color 0.3s ease-in-out; }
article.card nav.tools .tool.flags span.flag:hover, article.card nav.tools .tool.flags span.flag.isActive {
color: #1a1a1a; }
article.card:hover nav.tools {
opacity: 1; }
article.card section.images {
position: relative; }
article.card section.images, article.card section.images * {

18
web/themes/custom/materiotheme/assets/dist/main.js vendored
View File

File diff suppressed because one or more lines are too long

4
web/themes/custom/materiotheme/assets/styles/base/_layout.scss
View File

@@ -102,11 +102,13 @@ main[role="main"]{
display: flex;
flex-direction: row-reverse;
#content-left{
flex-basis: $column_width+$column_goutiere;
flex-basis: $column_width;
flex-shrink: 0;
// width:$column_width*2+$column_goutiere;
>*{
width:100%;
box-sizing: border-box;
padding:0.5em $column_goutiere;
}
}
#content-center{

3
web/themes/custom/materiotheme/assets/styles/base/_variables.scss
View File

@@ -9,3 +9,6 @@ $column_width: 205px;
$column_goutiere: 13px;
$card_height: 295px;
$minicard_width: 170px;
$minicard_height: 100px;

51
web/themes/custom/materiotheme/assets/styles/main.scss
View File

@@ -164,11 +164,12 @@ header[role="banner"]{
right:0;
top:1.7em;
box-sizing: content-box;
z-index: 30;
}
&:hover{
ul{
transition-delay: 0s;
max-height:12em;
max-height:50em;
padding:1em 1em;
box-shadow: 0 0 10px #ccc;
}
@@ -415,6 +416,7 @@ aside.messages{
display: flex;
flex-direction: row;
justify-content: space-between;
padding-bottom: $column_goutiere;
h3{
// flex-basis: calc(100% - 1em);
}
@@ -430,8 +432,9 @@ aside.messages{
margin:0 0 $column_goutiere 0;
padding:0;
article.card.minicard{
width:100%;
width:$minicard_width;
height:$minicard_height;
margin:auto;
>header{
padding: 0.3em 0.3em 0.1em;
h1{
@@ -439,7 +442,13 @@ aside.messages{
}
}
>nav.tools{
top: auto;
bottom: 0;
padding:0 0.2em;
background:transparent;
.mdi.unflag{
cursor: pointer;
}
}
}
}
@@ -752,7 +761,8 @@ article.card{
top: 0;
right: 0;
z-index: 21;
width: 1em;
$toolbar_width: 15px;
width: $toolbar_width;
background-color: #fff;
box-sizing: content-box;
padding: 0.3em 0.1em;
@@ -767,14 +777,36 @@ article.card{
position: absolute;
top: 0px;
right: 100%;
width: 5em;
box-sizing: content-box;
// width: 5em;
width: $column_width - $toolbar_width - 10px;
box-sizing: border-box;
padding: 0.3em;
background-color: #fff;
box-shadow: -2px 3px 4px rgba(0, 0, 0, 0.2);
opacity: 0;
max-height: 0; max-width:0;
overflow: hidden;
transition: all 0.2s ease-in-out;
}
&:hover{
.tool-content{
transition: all 0.3s ease-in-out;
opacity: 1;
max-height: 195px;
max-width:200px;
}
}
}
.tool.flags{
.tool-content{
ul{
display: flex;
flex-flow: row wrap;
li{
padding:0 0.5em 0 0;
}
}
}
span.flag{
cursor: pointer;
font-size: 0.756em;
@@ -785,6 +817,13 @@ article.card{
}
}
}
opacity: 0;
transition: opacity 0.2s ease-in-out;
}
&:hover{
nav.tools{
opacity:1;
}
}
section.images{
position: relative;