lib/devist/export/html/_default.html.erb
<!DOCTYPE html>
<html>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
<meta content="<%= @project.author %>/<%= @project.name %>" name="description" />
<meta content="width=device-width, initial-scale=1, user-scalable=no" name="viewport" />
<!-- Stylesheets -->
<link href='https://cdnjs.cloudflare.com/ajax/libs/normalize/6.0.0/normalize.min.css' rel="stylesheet" type="text/css" />
<link href='https://fonts.googleapis.com/css?family=Abel|Roboto:400|Roboto+Condensed:400|Roboto+Mono:400' rel='stylesheet' type='text/css'>
<!-- Title -->
<title><%= @project.author.strip! + '/' + @project.name %> - devist notes</title>
<body>
<header><h2>Release Notes - <%= @project.name %></h2></header>
<nav class="side-nav">
<ul style="background: none; color: #555; padding: 0; margin: 0;">
<li><a class="side-nav-item" href="<%= @project.homepage %>"><%= @project.author.gsub(/\<.*?\>/,"").strip! + '/' + @project.name %></a> </li>
<li><a style="font-size:12px;" class="side-nav-item " href="https://github.com/stacklog/devist">Created with devist</a></li>
</ul>
</nav>
<section class="container">
<% @changelog.each do |version| %>
<div id="<%= version.version %>">
<a href="#<%= version.version %>"><h3>Version <%= version.version %></h3></a>
<p><%= version.date.to_s %></p>
<ul>
<% version.tags.get[0].each do |added| %>
<li><span class="label label--add">added</span> <%= added.chomp %></li>
<% end %>
<% version.tags.get[1].each do |fixed| %>
<li><span class="label label--fixed">fixed</span> <%= fixed.chomp %></li>
<% end %>
<% version.tags.get[2].each do |removed| %>
<li><span class="label label--removed">removed</span> <%= removed.chomp %></li>
<% end %>
<% version.tags.get[3].each do |improved| %>
<li><span class="label label--improve">improved</span> <%= improved.chomp %></li>
<% end %>
</ul>
</div>
<% end %>
</section>
</body>
<!-- Custom style -->
<style>
:root {
background: #292929;
color: #bbb;
}
.label {
background: rgba(41, 41, 41, 0.27);
padding: 3px;
border-radius: 5px;
}
code {
border-color: rgba(255,255,255,0);;
}
h2 {
color: #555;
}
header {
padding-top: 4.5rem;
}
kbd {
background: rgba(255,255,255,.1);
border-color: rgba(0,0,0,.35);;
}
nav {
position: fixed;
left: 1.8rem;
top: 1.8rem;
}
section.container {
margin-bottom: 7.2rem;
max-width: 30rem;
}
section.container li {
text-align: left;
text-transform: capitalize;
}
section.container ul {
background: rgba(255,255,255,.05);
border-radius: .225rem;
margin: .9rem 0 2.7rem;
padding: 1rem 1.5rem;
}
.side-nav-item.current:after {
content: ' -';
}
nav {
font-family: "Roboto Condensed", sans-serif;
font-size: 1.2rem;
text-align: left;
}
.label--add {
color: #da139a;
text-transform: capitalize;
}
.label--improve {
color: #79b;
text-transform: capitalize;
}
.label--removed {
color: #9e6565;
text-transform: capitalize;
}
.label--fixed {
color: #7b9;
text-transform: capitalize;
}
p {
color: #555;
}
/* grid
------------------------------ */
.container {
margin: 0 auto;
max-width: 60rem;
position: relative;
width: 100%;
}
.row {
display: flex;
flex-direction: row;
margin: 0 -1.0rem;
}
.row .column {
margin-bottom: 2.7rem;
padding: 0 1.0rem;
width: 100%;
}
:root {
font-family: 'Roboto', sans-serif;
font-size: 15px;
height: 100%;
text-align: center;
}
::selection,
::-moz-selection {
background: rgba(0,0,0,.1);
}
a {
color: inherit;
text-decoration: none;
}
body {
line-height: 1.8rem;
height: 100%;
width: 100%;
}
code {
border: 1px solid #fff;
border-bottom: 2px solid #fff;
border-radius: 3px;
color: #ba9;
font-family: "Roboto Mono", monospace;
font-size: .85rem;
line-height: 0;
padding: .2rem .3rem .1rem;
white-space: nowrap;
}
h1, h2, h3 {
line-height: inherit;
font-size: inherit;
font-weight: normal;
margin: 0;
}
h1 {
font-family: "Abel", sans-serif;
}
h2 {
font-family: "Abel", sans-serif;
font-size: 1.8rem;
font-weight: 300;
margin-bottom: 4.5rem;
}
h3 {
font-family: "Roboto Condensed", sans-serif;
font-size: 1.2rem;
}
hr {
border: none;
border-bottom: 1px solid #444;
}
kbd {
background: #fff;
border: 1px solid #ddd;
border-bottom: 2px solid #ddd;
border-radius: 3px;
font-family: "Roboto Mono", monospace;
font-size: .85rem;
line-height: 0;
padding: .2rem .3rem .1rem;
text-transform: capitalize;
white-space: nowrap;
}
p {
margin: 0;
}
p a {
text-decoration: underline;
}
ul {
list-style: none;
margin: 0;
padding: 0;
}
/* navigation
------------------------------ */
.nav-item {
display: inline-block;
}
.nav-item:before {
content: '\00a0 | \00a0';
}
.nav-item:first-child:before {
content: '';
}
</style>
</html>