bachir/jeunes-et-engages-d7
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

preview opening works wery well now :)

Browse Source
This commit is contained in:
Bachir Soussi Chiadmi
2015-03-08 21:36:07 +01:00
parent 10b99958e2
commit 76c7154f4e
4 changed files with 386 additions and 367 deletions
Download Patch File Download Diff File Expand all files Collapse all files
sites/all/themes/gui/jee/css/jee.scss
+102 -57
View File
@@ -140,8 +140,9 @@ $animeLogoDuration:8s;
div.messages{
position:absolute;
top:20px; right:20px;
width:250px; max-height:30%;
width:500px; max-height:60%;
overflow-y:auto;
z-index: 1000;
}
#main{
@@ -157,66 +158,82 @@ div.messages{
.node-chapitre.node-teaser{
position:absolute;
// transition:0.1s ease-out;
// transition-property:transform;
// animation-fill-mode: forwards;
// INTERACTIVITÉ - - - - - - - - - - - --
// ----- DEFAULT MODE ----
/*
_____ __________________ ___ _________________ __________________
/ _/ | / /_ __/ ____/ __ \/ | / ____/_ __/ _/ | / / _/_ __/ ____/
/ // |/ / / / / __/ / /_/ / /| |/ / / / / / | | / // / / / / __/
_/ // /| / / / / /___/ _, _/ ___ / /___ / / _/ / | |/ // / / / / /___
/___/_/ |_/ /_/ /_____/_/ |_/_/ |_\____/ /_/ /___/ |___/___/ /_/ /_____/
*/
/*
____ _____ _____ _____ _____ __ _____ _____ _____ ____ _____
| \| __| __| _ | | | ||_ _| | | | \| __|
| | | __| __| | | | |__| | | | | | | | | | __|
|____/|_____|__| |__|__|_____|_____|_| |_|_|_|_____|____/|_____|
*/
h2.node-title{
transform:none;
transform-origin:bottom center;
transition:1s ease-out;
transition-property:transform;
z-index:5;
}
.field-name-field-comprendre{
>.content{position:relative;}
.texts{
opacity:0; height:1px; overflow:hidden;
transition:1s ease-out;
transition-property:opacity height;
position:absolute;
}
.field-name-field-partie{
opacity:0;
position:absolute;
transition:1s ease-out 0.5s;
transition:1s ease-in-out 0.1s;
transition-property: opacity transform;
// just let see the field vignette of first partie
&:nth-child(3){
&:nth-child(2){
z-index:2;
opacity:1;
transition-delay:0;
// transition-delay:0;
>.field-type-text{
opacity:0;
transition:1s ease-out 0.5s;
transition:1s ease-out 0.9s;
transition-property: opacity;
}
>.field-name-field-vignette{cursor:pointer;z-index:2;}
}
}
// &.closed .field-name-field-partie{
// transform:none!important;
// }
.links{
opacity:0;>*{display:none;}
transition:1s ease-out 1s;
transition-property:opacity;
}
&:after{
opacity:0;
// display:none;
transition: 3s ease-out;
transition: 2s ease-in;
transition-property:opacity;
top:1px; left:1px; bottom:2px; right:2px;
}
.line{
// transition: 0.5s ease-out;
// transition: 0.1s ease-out;
// transition-property:height transform;
}
// ----- PREVIEW MODE ------
/*
_____ _____ _____ _____ _____ _____ _ _ _ _____ _____ ____ _____
| _ | __ | __| | | | __| | | | | | | \| __|
| __| -| __| | |- -| __| | | | | | | | | | | | __|
|__| |__|__|_____|\___/|_____|_____|_____| |_|_|_|_____|____/|_____|
*/
&.previewed{
&:after{opacity:1;}
&:after{
opacity:1;
$pad:-2em;
top:-$pad;
left:$pad*6; right:$pad*6;
bottom:$pad*15;
}
h2.node-title{transform:scale(2,2);}
.field-name-field-comprendre{opacity:1; height:6em;}
.links{opacity:1;>*{display:block;}}
.texts{opacity:1; height:8em;}
.field-name-field-partie{
opacity:1; z-index:0;
// display all fields inside each parties
@@ -224,18 +241,21 @@ div.messages{
}
}
// ------- GENERALS (non interactive) - - - - - - - - - - - - - - - - - -
/*
_____________ ____________ ___ __ _____ __ _ __ __ _ _
/ ____/ ____/ | / / ____/ __ \/ | / / / ___/ _/_/___ ____ ____ (_)___ / /____ _________ ______/ /_(_) _____ | |
/ / __/ __/ / |/ / __/ / /_/ / /| | / / \__ \ / // __ \/ __ \/ __ \ / / __ \/ __/ _ \/ ___/ __ `/ ___/ __/ / | / / _ \ / /
/ /_/ / /___/ /| / /___/ _, _/ ___ |/ /______/ / / // / / / /_/ / / / / / / / / / /_/ __/ / / /_/ / /__/ /_/ /| |/ / __// /
\____/_____/_/ |_/_____/_/ |_/_/ |_/_____/____/ / //_/ /_/\____/_/ /_/ /_/_/ /_/\__/\___/_/ \__,_/\___/\__/_/ |___/\___//_/
|_| /_/
*/
&:after{ // background
content:" ";
background-size:contain;
// background-clip: content-box;
background-repeat: no-repeat;
position:absolute;
$pad:-2em;
top:-$pad;
left:$pad*6; right:$pad*6;
bottom:$pad*15;
// border: 1px solid blue;
z-index:-1;
}
@@ -255,10 +275,31 @@ div.messages{
z-index: 5;
}
.texts{
// position:relative;
}
.field-name-field-comprendre{
h1,h2,h3,h4,h5,h6{display:none!important;}
max-width:15em;
// max-width:15em;
p{margin:0;}
min-width:16em;
}
ul.links{
display:block; margin:0; text-align:right; z-index:5; position:relative; width:100%;
li.node-readmore{
padding:0;
a{
display:inline-block;
height:25px;
font-family: "open_sans";
font-weight: 900;
color:#000!important;
width:8em; text-align: left;
background: transparent url(../assets/img/readmore-btn.svg) no-repeat right center;
}
}
}
.field-name-field-partie{clear:both; padding-top:1em;}
@@ -295,22 +336,6 @@ div.messages{
line-height:1.2;
}
ul.links{
margin:0; text-align: right; z-index:5; position:relative;
li.node-readmore{
padding:0;
a{
display:inline-block;
height:25px;
font-family: "open_sans";
font-weight: 900;
color:#000!important;
width:8em; text-align: left;
background: transparent url(../assets/img/readmore-btn.svg) no-repeat right center;
}
}
}
.line{
z-index:-1;
position:absolute;
@@ -322,7 +347,12 @@ div.messages{
} // node-chapitre
// COLORS BY NODE - - - - - - - - - - - - - - - - - - - - -
/*
_____ _____ __ _____ _____ _____ _____ __ __ _____ _____ ____ _____
| | | | | | __ | __| | __ | | | | | | | \| __|
| --| | | |__| | | -|__ | | __ -|_ _| | | | | | | | | __|
|_____|_____|_____|_____|__|__|_____| |_____| |_| |_|___|_____|____/|_____|
*/
//SOL
#node-2{
&::after{ background-image : url(../assets/img/bgd-sol.svg); }
@@ -386,6 +416,13 @@ div.messages{
}
} // main
/* __________ ____ ________________
/ ____/ __ \/ __ \/_ __/ ____/ __ \
/ /_ / / / / / / / / / / __/ / /_/ /
/ __/ / /_/ / /_/ / / / / /___/ _, _/
/_/ \____/\____/ /_/ /_____/_/ |_|
*/
#footer{
position:fixed;
bottom:0; right:0;
@@ -394,18 +431,26 @@ div.messages{
vertical-align: top;
}
}
.backdom{
display:none;
}
/*
__ ____________ ______
/ |/ / _/ ___// ____/
/ /|_/ // / \__ \/ /
/ / / // / ___/ / /___
/_/ /_/___//____/\____/
*/
#fullscreen-btn{
position:fixed;
top:20px; left:20px;
z-index: 1000;
}
// DEBUG
/* ____ __________ __ ________
/ __ \/ ____/ __ )/ / / / ____/
/ / / / __/ / __ / / / / / __
/ /_/ / /___/ /_/ / /_/ / /_/ /
/_____/_____/_____/\____/\____/
*/
#fps{
position:fixed;
top:20px; right:20px;