change namespace for changelog to timechangelog

Signed-off-by: Toshaan Bharvani <toshaan@vantosh.com>
archetype-theme-transition
Toshaan Bharvani 3 years ago
parent c1bb5a533e
commit 01ff93ca09

@ -1,4 +1,4 @@
.timeline {
.changelogtimeline {
position: relative;
width: 660px;
margin: 0 auto;
@ -7,7 +7,7 @@
list-style-type: none;
}

.timeline:before {
.changelogtimeline:before {
position: absolute;
left: 50%;
top: 0;
@ -26,11 +26,11 @@
z-index: 5;
}

.timeline li {
.changelogtimeline li {
padding: 1em 0;
}

.timeline li:after {
.changelogtimeline li:after {
content: "";
display: block;
height: 0;
@ -51,13 +51,13 @@
float: right;
}

.flag-wrapper {
.changeflag-wrapper {
position: relative;
display: inline-block;
text-align: center;
}

.flag {
.changeflag {
position: relative;
display: inline;
background: rgb(248,248,248);
@ -67,20 +67,20 @@
text-align: left;
}

.direction-l .flag {
.direction-l .changeflag {
-webkit-box-shadow: -1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
-moz-box-shadow: -1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
box-shadow: -1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
}

.direction-r .flag {
.direction-r .changeflag {
-webkit-box-shadow: 1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
-moz-box-shadow: 1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
box-shadow: 1px 1px 1px rgba(0,0,0,0.15), 0 0 1px rgba(0,0,0,0.15);
}

.direction-l .flag:before,
.direction-r .flag:before {
.direction-l .changeflag:before,
.direction-r .changeflag:before {
position: absolute;
top: 50%;
right: -40px;
@ -95,11 +95,11 @@
z-index: 10;
}

.direction-r .flag:before {
.direction-r .changeflag:before {
left: -40px;
}

.direction-l .flag:after {
.direction-l .changeflag:after {
content: "";
position: absolute;
left: 100%;
@ -113,7 +113,7 @@
pointer-events: none;
}

.direction-r .flag:after {
.direction-r .changeflag:after {
content: "";
position: absolute;
right: 100%;
@ -127,7 +127,7 @@
pointer-events: none;
}

.time-wrapper {
.changetime-wrapper {
display: inline;
line-height: 1em;
font-size: 0.66666em;
@ -135,15 +135,15 @@
vertical-align: middle;
}

.direction-l .time-wrapper {
.direction-l .changetime-wrapper {
float: left;
}

.direction-r .time-wrapper {
.direction-r .changetime-wrapper {
float: right;
}

.time {
.changetime {
display: inline-block;
padding: 4px 6px;
background: rgb(248,248,248);
@ -160,16 +160,14 @@
margin: 1em 0 0 0.75em;
}

/* ================ Timeline Media Queries ================ */

@media screen and (max-width: 660px) {

.timeline {
.changelogtimeline {
width: 100%;
padding: 4em 0 1em 0;
}

.timeline li {
.changelogtimeline li {
padding: 2em 0;
}

@ -181,17 +179,17 @@
text-align: center;
}

.flag-wrapper {
.changeflag-wrapper {
text-align: center;
}

.flag {
.changeflag {
background: rgb(255,255,255);
z-index: 15;
}

.direction-l .flag:before,
.direction-r .flag:before {
.direction-l .changeflag:before,
.direction-r .changeflag:before {
position: absolute;
top: -30px;
left: 50%;
@ -206,8 +204,8 @@
z-index: 10;
}

.direction-l .flag:after,
.direction-r .flag:after {
.direction-l .changeflag:after,
.direction-r .changeflag:after {
content: "";
position: absolute;
left: 50%;

@ -17,7 +17,7 @@
<div class="col-lg-8">
{{ if $datafile.versions }}
{{ range last 1 $datafile.versions }}
<i class="fas fa-file-pdf mr-2"></i><a href="{{ .download }}">Download version {{.number }}</a>
<a href="{{ .download }}"><i class="far fa-file-pdf mr-2"></i>&nbsp;Download version {{.number }}</a>
{{ end }}
{{ end }}
</div>
@ -29,13 +29,13 @@
</div>
<div class="col-lg-3">
{{ if $datafile.versions }}
<ul class="timeline">
<ul class="changelogtimeline">
{{ range sort $datafile.versions "number" "desc" }}
<li>
<div class="direction-r">
<div class="flag-wrapper">
<span class="flag">version {{ .number }}</span>
<span class="time-wrapper"><span class="time">{{ .date }}</span></span>
<div class="changeflag-wrapper">
<span class="changeflag">version {{ .number }}</span>
<span class="changetime-wrapper"><span class="changetime">{{ .date }}</span></span>
</div>
<div class="desc">{{ .description }}</div>
<div class="desc"><a href="{{ .download }}">download</a></div>

Loading…
Cancel
Save