diff options
| author | Chip Senkbeil <chip.senkbeil@gmail.com> | 2015-08-23 22:19:18 +0300 |
|---|---|---|
| committer | Chip Senkbeil <chip.senkbeil@gmail.com> | 2015-08-23 22:19:18 +0300 |
| commit | 163f623c2496c1306463fb77b36fe6e701a000a7 (patch) | |
| tree | 34fa5db72e32ad757df85116f9ca52a3a2bf839d | |
| parent | 898c26736b912c78bf49449b5b03cf237bd12c9b (diff) | |
Updated the single page to use a better appearance for articles, updated main page to use more CSS classes over manual stylings
| -rw-r--r-- | layouts/_default/single.html | 42 | ||||
| -rw-r--r-- | layouts/index.html | 18 | ||||
| -rw-r--r-- | static/css/main.css | 44 |
3 files changed, 74 insertions, 30 deletions
diff --git a/layouts/_default/single.html b/layouts/_default/single.html index ea4418f..778d51f 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -2,30 +2,32 @@ {{ partial "head.html" . }} -<body> +<body class="page-colors"> {{ partial "main-menu.html" . }} <div class="main-content"> - {{ with .Params.image }} - <img src="{{ . }}" style="width: 100%; height: auto;"></img> - {{ end }} - <div class="center-space"> - <article> - <header> - <h2>{{ .Title }}</h2> - </header> - - <hr> - - <section> - {{ .Content }} - </section> - - <footer> - {{ .Date.Format "Mon Jan 2, 2006" }} - </footer> - </article> + <div class="article-colors"> + {{ with .Params.image }} + <img src="{{ . }}" class="fill-container-width"></img> + {{ end }} + <article> + <header> + <h2 class="article-title">{{ .Title }}</h2> + <time>{{ .Date.Format "Mon Jan 2, 2006" }}</time> + </header> + + <hr> + + <section> + {{ .Content }} + </section> + + <footer class="right-align"> + <p><small>{{ .Site.Copyright | markdownify }}</small></p> + </footer> + </article> + </div> </div> </div> diff --git a/layouts/index.html b/layouts/index.html index 65b1273..d23993d 100644 --- a/layouts/index.html +++ b/layouts/index.html @@ -2,15 +2,15 @@ {{ partial "head.html" . }} -<body class="blue-grey darken-2"> +<body class="page-colors"> <div class="row" style="margin-bottom: 0px;"> {{ with .Site.Params.Header }} {{ partial "header-scrolling.html" . }} {{ end }} - <div class="col s12 blue-grey darken-2 white-text center-align"> + <div class="col s12 row-colors center-align"> <h2> - <ul class="horizontal no-bullets" style="margin: 0 auto;"> + <ul class="horizontal no-bullets no-margin"> <li>{{ partial "svg-face.html" . }}</li> <li>About Me</li> </ul> @@ -22,17 +22,17 @@ {{ end }} {{ with .Site.Params.Footer }} - <div class="col s12 blue-grey darken-2 white-text right-align"> - <ul class="horizontal no-bullets"> + <div class="col s12 row-colors right-align"> + <ul class="main-page-footer horizontal no-bullets"> {{ range .List }} <li> - <a href="{{ .icon_link }}" class="white-text"> - <i class="fa fa-{{ .icon_class }} fa-2x"></i> + <a href="{{ .icon_link }}"> + <i class="fa fa-{{ .icon_class }}"></i> </a> </li> - <li><span style="font-size: 2em;">|</span></li> + <li>|</li> {{ end }} - <li><span style="font-size: 2em;">Copyright © by {{ .name }}</span></li> + <li>{{ $.Site.Copyright | markdownify }}</li> </ul> </div> {{ end }} diff --git a/static/css/main.css b/static/css/main.css index 4749392..f18fc57 100644 --- a/static/css/main.css +++ b/static/css/main.css @@ -37,7 +37,7 @@ ul.menu { span.drop-right { display: block; - box-shadow:inset 2px 0px 0px #FF9; + box-shadow:inset 2px 0px 0px #90a4ae; position: absolute; left: 0px; width:100%; @@ -77,12 +77,28 @@ ul.menu li { /* = MISC */ /* ========================================================================= */ +.row-colors { + background-color: #455A64; + color: #FFFFFF; +} + +.page-colors { + background-color: #90a4ae; + color: rgba(0, 0, 0, 0.87); +} + +.article-colors { + background-color: #FFFFFF; + color: rgba(0, 0, 0, 0.87); +} + .main-content { padding-left: 70px; width: 100%; } .main-content article { + height: 100%; padding-left: 30px; padding-right: 30px; } @@ -92,6 +108,11 @@ ul.menu li { height: 100%; } +.fill-container-width { + width: 100%; + height: auto; +} + .no-display { display: none; } @@ -127,6 +148,18 @@ ul.menu li { zoom: 1; } /* IE < 8 */ +.no-padding: { + padding: 0px; +} + +.no-margin { + margin: 0px; +} + +.article-title { + margin-top: 0px; +} + /* ========================================================================= */ /* = SPACING */ /* ========================================================================= */ @@ -177,6 +210,15 @@ ul.menu li { /* = LISTS */ /* ========================================================================= */ +ul.main-page-footer li { + color: #FFFFFF; + font-size: 2em; +} + +ul.main-page-footer li a { + color: #FFFFFF; +} + ul.no-list-float li { float: none; } |