Add basic card styling to commits.

This commit is contained in:
Mihai Parparita 2014-10-20 23:22:32 -07:00
parent bb8c898f97
commit be01a8623f
5 changed files with 62 additions and 24 deletions

View file

@ -8,7 +8,7 @@
},
"link": {
"text-decoration": "none",
"color": "#4183c4"
"color": "#e73b31"
},
"intro-paragraph": {
"font-size": "12pt",
@ -33,22 +33,46 @@
"margin": ".5em 0"
},
"commit": {
"background": "#fafafa",
"border": "solid 1px #ccc",
"margin": "1em 0",
"background": "#fffbe8",
"border": "solid 1px #dddac8",
"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": {
"padding": "8px",
"margin": "0"
"padding": "10px",
"margin": "0",
"z-index": "2"
},
"message": {
"margin": "0",
"padding": "0 8px 8px",
"padding": "0 10px 10px",
"white-space": "pre-wrap"
},
"footer": {
"background": "#fff",
"border-top": "solid 1px #ddd",
"padding": "8px",
"border-top": "dashed 1px #cac7b7",
"margin": "0 10px",
"padding": "10px 0",
"date": {
"color": "#666"
},

View file

@ -3,6 +3,7 @@ body {
font-size: 10pt;
margin: 0;
padding: 0;
background: #eee;
}
a {
@ -11,7 +12,6 @@ a {
}
.header {
background: #eee;
position: relative;
height: 164px;
overflow: hidden;
@ -36,6 +36,10 @@ a {
margin-left: -557px;
}
.body-background {
background: #fff;
}
.body {
padding: 10px;
max-width: 1104px;

View file

@ -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">
</div>
<div class="body">
<h1>{{template "title" .}}</h1>
<div class="body-background">
<div class="body">
<h1>{{template "title" .}}</h1>
{{template "body" .}}
{{template "body" .}}
</div>
</div>
</body>
</html>

View file

@ -28,16 +28,24 @@
<div>
{{range .Commits }}
<div style="{{style "commit"}}">
<h3 style="{{style "commit.title"}}">{{.Title}}</h3>
{{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 style="{{style "commit.container"}}">
<div style="{{style "commit.corner"}}">
<div style="{{style "commit.corner.cover"}}"></div>
</div>
<div style="{{style "commit.corner"}}">
<div style="{{style "commit.corner.border"}}"></div>
</div>
<div style="{{style "commit"}}">
<h3 style="{{style "commit.title"}}">{{.Title}}</h3>
{{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>
{{end}}

Binary file not shown.