forked from blivesta/psg-theme-minimal
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathtemplate.ejs
78 lines (76 loc) · 2.54 KB
/
template.ejs
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
<!doctype html>
<html class="psg-theme" lang="en">
<head>
<meta charset="UTF-8">
<title><%= projectName %></title>
<style><%- codeStyle %><%- tmplStyle %><%- processedCSS %></style>
</head>
<body>
<div class="psg-wrapper">
<nav class="psg-menu">
<h1 class="psg-projectName">
<a href="/">
<%= projectName %>
</a>
</h1>
<ul class="psg-componentList">
<% if (Array.isArray(colorPalette) && colorPalette.length !== 0) { %>
<a href="#color-palette" class="psg-componentList-item">
<li>Color Palette</li>
</a>
<% } %>
<% maps.forEach(function (map) { %>
<% if (map.link.title !== null) { %>
<a href="#<%= map.link.id %>" class="psg-componentList-item">
<li>
<%= map.link.title %>
</li>
</a>
<% } %>
<% }) %>
</ul>
</nav>
<div class="psg-main">
<div class="psg-container">
<% if (Array.isArray(colorPalette) && colorPalette.length !== 0) { %>
<section class="psg-component">
<h2 id="color-palette" class="psg-componentTitle">Color Palette</h2>
<div class="psg-contents">
<div class="psg-colorPalette">
<% colorPalette.forEach(function (palette) { %>
<div class="psg-colorBox">
<div class="psg-colorBox-sample" style="background-color: <%= palette.color %>">
</div>
<div class="psg-colorBox-color">
Color: <strong><%= palette.color %></strong>
</div>
<div class="psg-colorBox-name">
Name: <strong><%= palette.name %></strong>
</div>
</div>
<% }) %>
</div>
</div>
</section>
<hr class="psg-separator">
<% } %>
<% maps.forEach(function (map) { %>
<section class="psg-component">
<h2 id="<%= map.link.id %>" class="psg-componentTitle"><%= map.link.title %></h2>
<div class="psg-contents">
<div class="psg-contents-html">
<%- map.html %>
</div>
</div>
</section>
<hr class="psg-separator">
<% }) %>
<div class="psg-footer">
<p>Generated by <a href="https://github.com/morishitter/postcss-style-guide" target="_blank">postcss-style-guide</a> |
Theme: <strong>dscout</strong></p>
</div>
</div>
</div>
</div>
</body>
</html>