diff options
| author | Joseph Hutchinson <hutch7995@gmail.com> | 2018-03-28 20:33:33 +0300 |
|---|---|---|
| committer | Joseph Hutchinson <hutch7995@gmail.com> | 2018-03-28 20:33:33 +0300 |
| commit | 1fdf88ba0dedd8894998bbfb0435101f0ac7d1e7 (patch) | |
| tree | b072ad29c4f3038a0ae33e28bfa3d9c6089b6c34 | |
| parent | 4d0f0ff0d0628984ac2ee813569d237c130b330c (diff) | |
| parent | f1706f27f240cf9cd99a75d774636a5e6d784ffa (diff) | |
Add list header
| -rw-r--r-- | layouts/_default/list.html | 4 | ||||
| -rw-r--r-- | layouts/partials/footer.html | 2 | ||||
| -rw-r--r-- | static/css/style.css | 35 |
3 files changed, 31 insertions, 10 deletions
diff --git a/layouts/_default/list.html b/layouts/_default/list.html index 9205cad..d44aadb 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -4,6 +4,10 @@ <body style="background-color: #f3f3f3;"> {{ partial "header.html" . }} <div class="card-content-container"> + <header class="list-header"> + <h1 class="list-header-title">Sensors + Smarts</h1> + <h2 class="list-header-subtext">There is so much actionable data that goes to waste. Let's put your data to work.</h2> + </header> <main class="card-container"> {{.Content}} <section class="card-columns"> diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index aad942d..d9ce604 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -1,3 +1,3 @@ <footer> - <hr /> + </footer>
\ No newline at end of file diff --git a/static/css/style.css b/static/css/style.css index 8c5b839..d2be064 100644 --- a/static/css/style.css +++ b/static/css/style.css @@ -3,7 +3,7 @@ body { color: #3A3B3C; font-size: 1.1em; margin: 0; - padding: 4em 0 0 0; + padding: 3em 0 0 0; } p { margin: 1em 0; @@ -16,17 +16,16 @@ strong { .nav-bar { position: fixed; top: 0; - z-index: 3; + z-index: 999; width: 100%; padding: 0.45em 0; text-align: center; background-color: rgba(255, 255, 255, 0.97); -webkit-backdrop-filter: blur(0.5em); - box-shadow: 0 0 0.35em 0 rgba(0, 0, 0, 0.07); + box-shadow: 0 0.3em 1.5em 0 rgba(0, 0, 0, 0.1); } .nav-header { margin: 0 0; - font-family: 'LatoLatinWebHeavyItalic'; } .post { line-height: 1.5; @@ -67,13 +66,29 @@ img { } .card-content-container { display: flex; - justify-content: center; - padding: 0 0.5em; + flex-direction: column; + align-items: center; + padding: 0 0.7em; } .content { max-width: 700px; width: 100%; } +.list-header { + margin: 2.5em 0; + text-align: center; +} +.list-header-title { + margin: 0 0 0.2em 0; +} +.list-header-subtext { + color: #7A7B7C; + font-size: 1.2em; + line-height: 1.6; + font-weight: normal; + margin: 0.5em auto 0 auto; + width: 12em; +} .card-container { width: 100%; } @@ -91,11 +106,11 @@ img { text-decoration: none; -webkit-tap-highlight-color: rgba(0, 0, 0, 0); transition: transform 0.3s, box-shadow 0.3s; - box-shadow: 0 0.3em 0.6em 0 rgba(0, 0, 0, 0.1), 0 0 0.2em 0 rgba(0, 0, 0, 0.05); + box-shadow: 0 0.2em 0.5em 0 rgba(0, 0, 0, 0.1), 0 0 0.1em 0 rgba(0, 0, 0, 0.05); } .card-link-wrapper-active { transform: scale(0.95); - box-shadow: 0 0.20em 0.5em 0 rgba(0, 0, 0, 0.15); + box-shadow: 0 0.15em 0.5em 0 rgba(0, 0, 0, 0.15); } .card { padding: 1em; @@ -174,7 +189,9 @@ tr:nth-child(even) td { background: #f3f3f3; } footer { - margin: 2em 0; + padding: 2em 0; + margin: 2em 0 0 0; + background-color: white; } /* Medium devices (tablets, ~641px and up) */ |