bulma-extensions
Version:
Set of extensions for Bulma.io CSS Framework
1 lines • 14.9 kB
CSS
@-webkit-keyframes spinAround{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes spinAround{from{-webkit-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}.timeline{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column}.timeline .timeline-header{width:4em;min-width:4em;max-width:8em;word-wrap:normal;text-align:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.timeline .timeline-item{display:-webkit-box;display:flex;display:-ms-flexbox;display:-webkit-flex;position:relative;margin-left:2em;padding-bottom:2em}.timeline .timeline-item::before{content:"";background-color:#dbdbdb;display:block;width:.1em;height:100%;position:absolute;left:0;top:0}.timeline .timeline-item .timeline-marker{position:absolute;background:#dbdbdb;border:.1em solid #dbdbdb;border-radius:100%;content:"";display:block;height:.8em;left:-.35em;top:1.2rem;width:.8em}.timeline .timeline-item .timeline-marker.is-image{background:#dbdbdb;border:.1em solid #dbdbdb;border-radius:100%;display:block;overflow:hidden}.timeline .timeline-item .timeline-marker.is-image.is-16x16{height:16px;width:16px;left:-8px}.timeline .timeline-item .timeline-marker.is-image.is-24x24{height:24px;width:24px;left:-12px}.timeline .timeline-item .timeline-marker.is-image.is-32x32{height:32px;width:32px;left:-16px}.timeline .timeline-item .timeline-marker.is-image.is-48x48{height:48px;width:48px;left:-24px}.timeline .timeline-item .timeline-marker.is-image.is-64x64{height:64px;width:64px;left:-32px}.timeline .timeline-item .timeline-marker.is-image.is-96x96{height:96px;width:96px;left:-48px}.timeline .timeline-item .timeline-marker.is-image.is-128x128{height:128px;width:128px;left:-64px}.timeline .timeline-item .timeline-marker.is-icon{height:1.5em;width:1.5em;left:-.7em;line-height:.75rem;padding:.25rem;background:#dbdbdb;border:.1em solid #dbdbdb;border-radius:100%}.timeline .timeline-item .timeline-marker.is-icon>i{color:#fff;font-size:.75rem}.timeline .timeline-item .timeline-marker.is-outlined .image{background:#fff}.timeline .timeline-item .timeline-marker.is-outlined.is-icon{background:#fff}.timeline .timeline-item .timeline-marker.is-outlined.is-icon>i{color:#dbdbdb}.timeline .timeline-item .timeline-marker.is-white{background-color:#fff;border-color:#fff}.timeline .timeline-item .timeline-marker.is-white .image{border-color:#fff}.timeline .timeline-item .timeline-marker.is-white.is-icon{background-color:#fff;border-color:#fff}.timeline .timeline-item .timeline-marker.is-white.is-icon>i{color:#0a0a0a}.timeline .timeline-item .timeline-marker.is-white.is-outlined{background-color:#fff;border-color:#fff}.timeline .timeline-item .timeline-marker.is-white.is-outlined .image{background-color:#fff}.timeline .timeline-item .timeline-marker.is-white.is-outlined.is-icon{background-color:#fff}.timeline .timeline-item .timeline-marker.is-white.is-outlined.is-icon>i{color:#fff}.timeline .timeline-item .timeline-marker.is-black{background-color:#0a0a0a;border-color:#0a0a0a}.timeline .timeline-item .timeline-marker.is-black .image{border-color:#0a0a0a}.timeline .timeline-item .timeline-marker.is-black.is-icon{background-color:#0a0a0a;border-color:#0a0a0a}.timeline .timeline-item .timeline-marker.is-black.is-icon>i{color:#fff}.timeline .timeline-item .timeline-marker.is-black.is-outlined{background-color:#fff;border-color:#0a0a0a}.timeline .timeline-item .timeline-marker.is-black.is-outlined .image{background-color:#fff}.timeline .timeline-item .timeline-marker.is-black.is-outlined.is-icon{background-color:#fff}.timeline .timeline-item .timeline-marker.is-black.is-outlined.is-icon>i{color:#0a0a0a}.timeline .timeline-item .timeline-marker.is-light{background-color:#f5f5f5;border-color:#f5f5f5}.timeline .timeline-item .timeline-marker.is-light .image{border-color:#f5f5f5}.timeline .timeline-item .timeline-marker.is-light.is-icon{background-color:#f5f5f5;border-color:#f5f5f5}.timeline .timeline-item .timeline-marker.is-light.is-icon>i{color:#363636}.timeline .timeline-item .timeline-marker.is-light.is-outlined{background-color:#fff;border-color:#f5f5f5}.timeline .timeline-item .timeline-marker.is-light.is-outlined .image{background-color:#fff}.timeline .timeline-item .timeline-marker.is-light.is-outlined.is-icon{background-color:#fff}.timeline .timeline-item .timeline-marker.is-light.is-outlined.is-icon>i{color:#f5f5f5}.timeline .timeline-item .timeline-marker.is-dark{background-color:#363636;border-color:#363636}.timeline .timeline-item .timeline-marker.is-dark .image{border-color:#363636}.timeline .timeline-item .timeline-marker.is-dark.is-icon{background-color:#363636;border-color:#363636}.timeline .timeline-item .timeline-marker.is-dark.is-icon>i{color:#f5f5f5}.timeline .timeline-item .timeline-marker.is-dark.is-outlined{background-color:#fff;border-color:#363636}.timeline .timeline-item .timeline-marker.is-dark.is-outlined .image{background-color:#fff}.timeline .timeline-item .timeline-marker.is-dark.is-outlined.is-icon{background-color:#fff}.timeline .timeline-item .timeline-marker.is-dark.is-outlined.is-icon>i{color:#363636}.timeline .timeline-item .timeline-marker.is-primary{background-color:#00d1b2;border-color:#00d1b2}.timeline .timeline-item .timeline-marker.is-primary .image{border-color:#00d1b2}.timeline .timeline-item .timeline-marker.is-primary.is-icon{background-color:#00d1b2;border-color:#00d1b2}.timeline .timeline-item .timeline-marker.is-primary.is-icon>i{color:#fff}.timeline .timeline-item .timeline-marker.is-primary.is-outlined{background-color:#fff;border-color:#00d1b2}.timeline .timeline-item .timeline-marker.is-primary.is-outlined .image{background-color:#fff}.timeline .timeline-item .timeline-marker.is-primary.is-outlined.is-icon{background-color:#fff}.timeline .timeline-item .timeline-marker.is-primary.is-outlined.is-icon>i{color:#00d1b2}.timeline .timeline-item .timeline-marker.is-link{background-color:#3273dc;border-color:#3273dc}.timeline .timeline-item .timeline-marker.is-link .image{border-color:#3273dc}.timeline .timeline-item .timeline-marker.is-link.is-icon{background-color:#3273dc;border-color:#3273dc}.timeline .timeline-item .timeline-marker.is-link.is-icon>i{color:#fff}.timeline .timeline-item .timeline-marker.is-link.is-outlined{background-color:#fff;border-color:#3273dc}.timeline .timeline-item .timeline-marker.is-link.is-outlined .image{background-color:#fff}.timeline .timeline-item .timeline-marker.is-link.is-outlined.is-icon{background-color:#fff}.timeline .timeline-item .timeline-marker.is-link.is-outlined.is-icon>i{color:#3273dc}.timeline .timeline-item .timeline-marker.is-info{background-color:#209cee;border-color:#209cee}.timeline .timeline-item .timeline-marker.is-info .image{border-color:#209cee}.timeline .timeline-item .timeline-marker.is-info.is-icon{background-color:#209cee;border-color:#209cee}.timeline .timeline-item .timeline-marker.is-info.is-icon>i{color:#fff}.timeline .timeline-item .timeline-marker.is-info.is-outlined{background-color:#fff;border-color:#209cee}.timeline .timeline-item .timeline-marker.is-info.is-outlined .image{background-color:#fff}.timeline .timeline-item .timeline-marker.is-info.is-outlined.is-icon{background-color:#fff}.timeline .timeline-item .timeline-marker.is-info.is-outlined.is-icon>i{color:#209cee}.timeline .timeline-item .timeline-marker.is-success{background-color:#23d160;border-color:#23d160}.timeline .timeline-item .timeline-marker.is-success .image{border-color:#23d160}.timeline .timeline-item .timeline-marker.is-success.is-icon{background-color:#23d160;border-color:#23d160}.timeline .timeline-item .timeline-marker.is-success.is-icon>i{color:#fff}.timeline .timeline-item .timeline-marker.is-success.is-outlined{background-color:#fff;border-color:#23d160}.timeline .timeline-item .timeline-marker.is-success.is-outlined .image{background-color:#fff}.timeline .timeline-item .timeline-marker.is-success.is-outlined.is-icon{background-color:#fff}.timeline .timeline-item .timeline-marker.is-success.is-outlined.is-icon>i{color:#23d160}.timeline .timeline-item .timeline-marker.is-warning{background-color:#ffdd57;border-color:#ffdd57}.timeline .timeline-item .timeline-marker.is-warning .image{border-color:#ffdd57}.timeline .timeline-item .timeline-marker.is-warning.is-icon{background-color:#ffdd57;border-color:#ffdd57}.timeline .timeline-item .timeline-marker.is-warning.is-icon>i{color:rgba(0,0,0,.7)}.timeline .timeline-item .timeline-marker.is-warning.is-outlined{background-color:#fff;border-color:#ffdd57}.timeline .timeline-item .timeline-marker.is-warning.is-outlined .image{background-color:#fff}.timeline .timeline-item .timeline-marker.is-warning.is-outlined.is-icon{background-color:#fff}.timeline .timeline-item .timeline-marker.is-warning.is-outlined.is-icon>i{color:#ffdd57}.timeline .timeline-item .timeline-marker.is-danger{background-color:#ff3860;border-color:#ff3860}.timeline .timeline-item .timeline-marker.is-danger .image{border-color:#ff3860}.timeline .timeline-item .timeline-marker.is-danger.is-icon{background-color:#ff3860;border-color:#ff3860}.timeline .timeline-item .timeline-marker.is-danger.is-icon>i{color:#fff}.timeline .timeline-item .timeline-marker.is-danger.is-outlined{background-color:#fff;border-color:#ff3860}.timeline .timeline-item .timeline-marker.is-danger.is-outlined .image{background-color:#fff}.timeline .timeline-item .timeline-marker.is-danger.is-outlined.is-icon{background-color:#fff}.timeline .timeline-item .timeline-marker.is-danger.is-outlined.is-icon>i{color:#ff3860}.timeline .timeline-item .timeline-content{padding:1em 0 0 .5em;padding:1em 0 0 2em}.timeline .timeline-item .timeline-content .heading{font-weight:600}.timeline .timeline-item.is-white::before{background-color:#fff}.timeline .timeline-item.is-black::before{background-color:#0a0a0a}.timeline .timeline-item.is-light::before{background-color:#f5f5f5}.timeline .timeline-item.is-dark::before{background-color:#363636}.timeline .timeline-item.is-primary::before{background-color:#00d1b2}.timeline .timeline-item.is-link::before{background-color:#3273dc}.timeline .timeline-item.is-info::before{background-color:#209cee}.timeline .timeline-item.is-success::before{background-color:#23d160}.timeline .timeline-item.is-warning::before{background-color:#ffdd57}.timeline .timeline-item.is-danger::before{background-color:#ff3860}.timeline.is-centered .timeline-header{display:-webkit-box;display:-ms-flexbox;display:flex;width:100%;-ms-flex-item-align:center;align-self:center}.timeline.is-centered .timeline-item{width:50%;-ms-flex-item-align:end;align-self:flex-end}.timeline.is-centered .timeline-item:nth-of-type(2n){-ms-flex-item-align:start;align-self:flex-start;margin-left:0;margin-right:2em}.timeline.is-centered .timeline-item:nth-of-type(2n)::before{right:-.1em;left:auto}.timeline.is-centered .timeline-item:nth-of-type(2n) .timeline-marker{left:auto;right:-.45em}.timeline.is-centered .timeline-item:nth-of-type(2n) .timeline-marker.is-image.is-16x16{left:auto;right:-8px}.timeline.is-centered .timeline-item:nth-of-type(2n) .timeline-marker.is-image.is-24x24{left:auto;right:-12px}.timeline.is-centered .timeline-item:nth-of-type(2n) .timeline-marker.is-image.is-32x32{left:auto;right:-16px}.timeline.is-centered .timeline-item:nth-of-type(2n) .timeline-marker.is-image.is-48x48{left:auto;right:-24px}.timeline.is-centered .timeline-item:nth-of-type(2n) .timeline-marker.is-image.is-64x64{left:auto;right:-32px}.timeline.is-centered .timeline-item:nth-of-type(2n) .timeline-marker.is-image.is-96x96{left:auto;right:-48px}.timeline.is-centered .timeline-item:nth-of-type(2n) .timeline-marker.is-image.is-128x128{left:auto;right:-64px}.timeline.is-centered .timeline-item:nth-of-type(2n) .timeline-marker.is-icon{left:auto;right:-.8em}.timeline.is-centered .timeline-item:nth-of-type(2n) .timeline-content{padding:1em 2em 0 0;text-align:right;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;-ms-flex-preferred-size:100%;flex-basis:100%}.timeline.is-centered .timeline-item:nth-of-type(2n+1)::before{content:"";background-color:#dbdbdb;display:block;width:.1em;height:100%;position:absolute;top:0}.timeline.is-rtl{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end}.timeline.is-rtl .timeline-item{-webkit-box-pack:end;-ms-flex-pack:end;justify-content:flex-end;border-left:none;margin-left:0;margin-right:2em}.timeline.is-rtl .timeline-item::before{right:0;left:auto}.timeline.is-rtl .timeline-item .timeline-marker{left:auto;right:-.35em}.timeline.is-rtl .timeline-item .timeline-marker.is-image.is-16x16{left:auto;right:-8px}.timeline.is-rtl .timeline-item .timeline-marker.is-image.is-24x24{left:auto;right:-12px}.timeline.is-rtl .timeline-item .timeline-marker.is-image.is-32x32{left:auto;right:-16px}.timeline.is-rtl .timeline-item .timeline-marker.is-image.is-48x48{left:auto;right:-24px}.timeline.is-rtl .timeline-item .timeline-marker.is-image.is-64x64{left:auto;right:-32px}.timeline.is-rtl .timeline-item .timeline-marker.is-image.is-96x96{left:auto;right:-48px}.timeline.is-rtl .timeline-item .timeline-marker.is-image.is-128x128{left:auto;right:-64px}.timeline.is-rtl .timeline-item .timeline-marker.is-icon{left:auto;right:-.7em}.timeline.is-rtl .timeline-item .timeline-content{padding:1em 2em 0 0;text-align:right}