mejora menu
This commit is contained in:
parent
06f167d231
commit
7d86224644
3 changed files with 62 additions and 49 deletions
|
@ -1 +1 @@
|
|||
p{font-size:12px}.cd-horizontal-timeline .events-content{position:relative}.cd-horizontal-timeline .events-content li{position:absolute;z-index:1;width:100%;left:0;top:0;transform:translateX(-100%);opacity:0;animation-duration:.4s;animation-timing-function:ease-in-out}.cd-horizontal-timeline .events-content li.selected{position:relative;z-index:2;opacity:1;transform:translateX(0)}div.section-container{background-color:white}#timeline{z-index:10;position:absolute;bottom:0;left:0;height:100px;width:100%}#timeline li{display:inline}#timeline a{background-color:white}#timeline a.active{background-color:orange}#timeline img{width:14%;opacity:.2;transition:all 1s}#timeline a.active img.img-menu{opacity:1}div.menu-content{height:100vh;background-color:white}div.extra-btn-container{position:absolute;left:700px;bottom:200px}a.btn-circle{border-radius:40px}.map-popover{display:none}
|
||||
p{font-size:12px}.cd-horizontal-timeline .events-content{position:relative}.cd-horizontal-timeline .events-content li{position:absolute;z-index:1;width:100%;left:0;top:0;transform:translateX(-100%);opacity:0;animation-duration:.4s;animation-timing-function:ease-in-out}.cd-horizontal-timeline .events-content li.selected{position:relative;z-index:2;opacity:1;transform:translateX(0)}div.section-container{background-color:white}.cd-timeline-navigation{padding:0;margin:0;text-align:left;align:left}#timeline{z-index:10;position:absolute;bottom:0;left:0;height:100px;width:100%;text-align:left}#timeline li{display:inline-block;width:13.9%;margin:0;padding:0;text-align:left;line-height:auto}#timeline a{background-color:white;text-align:left;line-height:auto}#timeline img{width:103%;opacity:.2;transition:all 1s}#timeline a.active img.img-menu{opacity:1}div.menu-content{height:100vh;background-color:white}div.extra-btn-container{position:absolute;left:700px;bottom:200px}a.btn-circle{border-radius:40px}.map-popover{display:none}
|
|
@ -1 +1 @@
|
|||
{"version":3,"sources":["home.less"],"names":[],"mappings":"AAAA,EACI,eAIJ,uBAAwB,iBACtB,kBAEF,uBAAwB,gBAAgB,IACtC,iBAAA,CACA,SAAA,CACA,UAAA,CACA,MAAA,CACA,KAAA,CACA,UAAW,iBAAX,CACA,SAAA,CACA,sBAAA,CACA,sCAEF,uBAAwB,gBAAgB,GAAE,UAExC,iBAAA,CACA,SAAA,CACA,SAAA,CACA,UAAW,cAEb,GAAG,mBAEC,uBAGJ,UACI,UAAA,CACA,iBAAA,CACA,QAAA,CACA,MAAA,CACA,YAAA,CACA,WANJ,SAOI,IACI,eARR,SAUI,GACI,uBAXR,SAaI,EAAC,QACG,wBAdR,SAgBI,KACI,SAAA,CACA,UAAA,CACA,kBAnBR,SAqBI,EAAC,OAAQ,IAAG,UACR,UAIR,GAAG,cACC,YAAA,CACA,uBAGJ,GAAG,qBACC,iBAAA,CACA,UAAA,CACA,aAGJ,CAAC,YACG,mBAGJ,aACI"}
|
||||
{"version":3,"sources":["home.less"],"names":[],"mappings":"AACA,EACI,eAGJ,uBAAwB,iBACpB,kBAGJ,uBAAwB,gBAAgB,IACpC,iBAAA,CACA,SAAA,CACA,UAAA,CACA,MAAA,CACA,KAAA,CACA,UAAW,iBAAX,CACA,SAAA,CACA,sBAAA,CACA,sCAGJ,uBAAwB,gBAAgB,GAAE,UAEtC,iBAAA,CACA,SAAA,CACA,SAAA,CACA,UAAW,cAGf,GAAG,mBACC,uBAEJ,wBACI,SAAA,CACA,QAAA,CACA,eAAA,CACA,WAEJ,UACI,UAAA,CACA,iBAAA,CACA,QAAA,CACA,MAAA,CACA,YAAA,CACA,UAAA,CACA,gBAPJ,SASI,IACI,oBAAA,CACA,WAAA,CACA,QAAA,CACA,SAAA,CACA,eAAA,CACA,iBAfR,SAkBI,GACI,sBAAA,CACA,eAAA,CACA,iBArBR,SA0BI,KACI,UAAA,CACA,UAAA,CACA,kBA7BR,SAgCI,EAAC,OAAQ,IAAG,UACR,UAIR,GAAG,cACC,YAAA,CACA,uBAGJ,GAAG,qBACC,iBAAA,CACA,UAAA,CACA,aAGJ,CAAC,YACG,mBAGJ,aACI"}
|
107
css/home.less
107
css/home.less
|
@ -1,87 +1,100 @@
|
|||
// out: css/home.css, sourcemap: true, compress: true
|
||||
p{
|
||||
|
||||
p {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
|
||||
.cd-horizontal-timeline .events-content {
|
||||
position: relative;
|
||||
position: relative;
|
||||
}
|
||||
.cd-horizontal-timeline .events-content li {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
transform: translateX(-100%);
|
||||
opacity: 0;
|
||||
animation-duration: 0.4s;
|
||||
animation-timing-function: ease-in-out;
|
||||
}
|
||||
.cd-horizontal-timeline .events-content li.selected {
|
||||
/* visible event content */
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
div.section-container{
|
||||
|
||||
.cd-horizontal-timeline .events-content li {
|
||||
position: absolute;
|
||||
z-index: 1;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
top: 0;
|
||||
transform: translateX(-100%);
|
||||
opacity: 0;
|
||||
animation-duration: 0.4s;
|
||||
animation-timing-function: ease-in-out;
|
||||
}
|
||||
|
||||
.cd-horizontal-timeline .events-content li.selected {
|
||||
/* visible event content */
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
opacity: 1;
|
||||
transform: translateX(0);
|
||||
}
|
||||
|
||||
div.section-container {
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
#timeline{
|
||||
.cd-timeline-navigation{
|
||||
padding:0px;
|
||||
margin:0px;
|
||||
text-align: left;
|
||||
align:left;
|
||||
}
|
||||
#timeline {
|
||||
z-index: 10;
|
||||
position: absolute;
|
||||
bottom:0px;
|
||||
left:0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
height: 100px;
|
||||
width:100%;
|
||||
li{
|
||||
display: inline;
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
width: 13.9%;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
text-align: left;
|
||||
line-height: auto;
|
||||
}
|
||||
a{
|
||||
|
||||
a {
|
||||
background-color: white;
|
||||
text-align: left;
|
||||
line-height: auto;
|
||||
}
|
||||
a.active{
|
||||
/*a.active{
|
||||
background-color:orange;
|
||||
}
|
||||
img{
|
||||
width:14%;
|
||||
}*/
|
||||
img {
|
||||
width:103%;
|
||||
opacity: 0.2;
|
||||
transition: all 1s;
|
||||
}
|
||||
a.active img.img-menu{
|
||||
|
||||
a.active img.img-menu {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
div.menu-content{
|
||||
div.menu-content {
|
||||
height: 100vh;
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
div.extra-btn-container{
|
||||
div.extra-btn-container {
|
||||
position: absolute;
|
||||
left: 700px;
|
||||
bottom: 200px;
|
||||
}
|
||||
|
||||
a.btn-circle{
|
||||
a.btn-circle {
|
||||
border-radius: 40px;
|
||||
}
|
||||
|
||||
.map-popover{
|
||||
.map-popover {
|
||||
display: none;
|
||||
}
|
||||
|
||||
div.section-inner-content{
|
||||
div.story-content{
|
||||
|
||||
}
|
||||
div.data-content{
|
||||
|
||||
|
||||
}
|
||||
div.section-inner-content {
|
||||
div.story-content {}
|
||||
|
||||
div.data-content {}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue