mirror of
https://github.com/samsonjs/retrogit.git
synced 2026-04-27 15:07:43 +00:00
Add basic card styling to commits.
This commit is contained in:
parent
bb8c898f97
commit
be01a8623f
5 changed files with 62 additions and 24 deletions
|
|
@ -8,7 +8,7 @@
|
||||||
},
|
},
|
||||||
"link": {
|
"link": {
|
||||||
"text-decoration": "none",
|
"text-decoration": "none",
|
||||||
"color": "#4183c4"
|
"color": "#e73b31"
|
||||||
},
|
},
|
||||||
"intro-paragraph": {
|
"intro-paragraph": {
|
||||||
"font-size": "12pt",
|
"font-size": "12pt",
|
||||||
|
|
@ -33,22 +33,46 @@
|
||||||
"margin": ".5em 0"
|
"margin": ".5em 0"
|
||||||
},
|
},
|
||||||
"commit": {
|
"commit": {
|
||||||
"background": "#fafafa",
|
"background": "#fffbe8",
|
||||||
"border": "solid 1px #ccc",
|
"border": "solid 1px #dddac8",
|
||||||
"margin": "1em 0",
|
"box-shadow": "1px 1px 2px rgba(0, 0, 0, 0.11)",
|
||||||
|
"container": {
|
||||||
|
"margin": "1em 0"
|
||||||
|
},
|
||||||
|
"corner": {
|
||||||
|
"width": "0",
|
||||||
|
"max-height": "0",
|
||||||
|
"float": "left",
|
||||||
|
"cover": {
|
||||||
|
"width": "0",
|
||||||
|
"height": "0",
|
||||||
|
"border": "solid",
|
||||||
|
"border-width": "0 0 20px 10px",
|
||||||
|
"border-color": "transparent transparent #dddac8 white"
|
||||||
|
},
|
||||||
|
"border": {
|
||||||
|
"margin": "1px 0 0 1px",
|
||||||
|
"width": "0",
|
||||||
|
"height": "0",
|
||||||
|
"border": "solid",
|
||||||
|
"border-width": "0 0 20px 10px",
|
||||||
|
"border-color": "transparent transparent #fdf9e5 transparent"
|
||||||
|
}
|
||||||
|
},
|
||||||
"title": {
|
"title": {
|
||||||
"padding": "8px",
|
"padding": "10px",
|
||||||
"margin": "0"
|
"margin": "0",
|
||||||
|
"z-index": "2"
|
||||||
},
|
},
|
||||||
"message": {
|
"message": {
|
||||||
"margin": "0",
|
"margin": "0",
|
||||||
"padding": "0 8px 8px",
|
"padding": "0 10px 10px",
|
||||||
"white-space": "pre-wrap"
|
"white-space": "pre-wrap"
|
||||||
},
|
},
|
||||||
"footer": {
|
"footer": {
|
||||||
"background": "#fff",
|
"border-top": "dashed 1px #cac7b7",
|
||||||
"border-top": "solid 1px #ddd",
|
"margin": "0 10px",
|
||||||
"padding": "8px",
|
"padding": "10px 0",
|
||||||
"date": {
|
"date": {
|
||||||
"color": "#666"
|
"color": "#666"
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -3,6 +3,7 @@ body {
|
||||||
font-size: 10pt;
|
font-size: 10pt;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
padding: 0;
|
padding: 0;
|
||||||
|
background: #eee;
|
||||||
}
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
|
|
@ -11,7 +12,6 @@ a {
|
||||||
}
|
}
|
||||||
|
|
||||||
.header {
|
.header {
|
||||||
background: #eee;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
height: 164px;
|
height: 164px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
@ -36,6 +36,10 @@ a {
|
||||||
margin-left: -557px;
|
margin-left: -557px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.body-background {
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
.body {
|
.body {
|
||||||
padding: 10px;
|
padding: 10px;
|
||||||
max-width: 1104px;
|
max-width: 1104px;
|
||||||
|
|
|
||||||
|
|
@ -12,10 +12,12 @@
|
||||||
<img src="/static/images/header.png" srcset="/static/images/header.png 1x, /static/images/header@2x.png 2x" width="1114" height="154" alt="GitHop">
|
<img src="/static/images/header.png" srcset="/static/images/header.png 1x, /static/images/header@2x.png 2x" width="1114" height="154" alt="GitHop">
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="body">
|
<div class="body-background">
|
||||||
<h1>{{template "title" .}}</h1>
|
<div class="body">
|
||||||
|
<h1>{{template "title" .}}</h1>
|
||||||
|
|
||||||
{{template "body" .}}
|
{{template "body" .}}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -28,16 +28,24 @@
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
{{range .Commits }}
|
{{range .Commits }}
|
||||||
<div style="{{style "commit"}}">
|
<div style="{{style "commit.container"}}">
|
||||||
<h3 style="{{style "commit.title"}}">{{.Title}}</h3>
|
<div style="{{style "commit.corner"}}">
|
||||||
{{if .Message}}
|
<div style="{{style "commit.corner.cover"}}"></div>
|
||||||
<pre style="{{style "commit.message"}}">{{.Message}}</pre>
|
</div>
|
||||||
{{end}}
|
<div style="{{style "commit.corner"}}">
|
||||||
<div style="{{style "commit.footer"}}">
|
<div style="{{style "commit.corner.border"}}"></div>
|
||||||
<a href="{{.URL}}"
|
</div>
|
||||||
style="{{style "link" "commit.footer.link"}}">{{.DisplaySHA}}</a>
|
<div style="{{style "commit"}}">
|
||||||
<i title={{.DisplayDateTooltip}}
|
<h3 style="{{style "commit.title"}}">{{.Title}}</h3>
|
||||||
style="{{style "commit.footer.date"}}">{{if $interval.Weekly}}{{.WeeklyDisplayDate}}{{else}}{{.DisplayDate}}{{end}}</i>
|
{{if .Message}}
|
||||||
|
<pre style="{{style "commit.message"}}">{{.Message}}</pre>
|
||||||
|
{{end}}
|
||||||
|
<div style="{{style "commit.footer"}}">
|
||||||
|
<a href="{{.URL}}"
|
||||||
|
style="{{style "link" "commit.footer.link"}}">{{.DisplaySHA}}</a>
|
||||||
|
<i title={{.DisplayDateTooltip}}
|
||||||
|
style="{{style "commit.footer.date"}}">{{if $interval.Weekly}}{{.WeeklyDisplayDate}}{{else}}{{.DisplayDate}}{{end}}</i>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{{end}}
|
{{end}}
|
||||||
|
|
|
||||||
BIN
assets/punch card commit corner.psd
Normal file
BIN
assets/punch card commit corner.psd
Normal file
Binary file not shown.
Loading…
Reference in a new issue