danielmochdotcom

Nikola site for www.danielmoch.com
git clone git://git.danielmoch.com/danielmochdotcom.git
Log | Files | Refs

commit 31d9a3470168a74d70ba0e5caedf171d39270db5
parent fa0f25a23a81b93bcb6599dd63428e5d52b48943
Author: Daniel Moch <daniel@danielmoch.com>
Date:   Sun,  7 Jul 2019 17:49:59 -0400

Website redesign

Diffstat:
Mconf.py | 51+++++++++++++++++++++++++++++++++++----------------
Mfiles/assets/avatar.jpg | 0
Afiles/assets/initials-blue.png | 0
Afiles/assets/initials-plus-blue.png | 0
Dpages/index.rst | 36------------------------------------
Mthemes/djmoch/assets/site.css | 54+++++++++++++++++++++++++++++++++++++++---------------
Mthemes/djmoch/templates/base.tmpl | 15++++++---------
Mthemes/djmoch/templates/index.tmpl | 2+-
Athemes/djmoch/templates/sidebar.tmpl | 21+++++++++++++++++++++
9 files changed, 102 insertions(+), 77 deletions(-)

diff --git a/conf.py b/conf.py @@ -17,7 +17,7 @@ # Data about this site BLOG_AUTHOR = "Daniel Moch" # (translatable) -BLOG_TITLE = BLOG_AUTHOR # (translatable) +BLOG_TITLE = "Daniel Moch's Weblog" # (translatable) # This is the main URL for your site. It will be used # in a prominent link. Don't forget the protocol (http/https)! SITE_URL = "https://danielmoch.com/" @@ -25,7 +25,7 @@ # If not set, defaults to SITE_URL # BASE_URL = "https://danielmoch.com/" BLOG_EMAIL = "daniel@danielmoch.com" -BLOG_DESCRIPTION = "The homepage of Daniel Moch" # (translatable) +BLOG_DESCRIPTION = BLOG_TITLE # (translatable) # Nikola is multilingual! # @@ -137,13 +137,20 @@ NAVIGATION_LINKS = { DEFAULT_LANG: ( ("/", "Home"), - ("/projects", "Projects"), + ("/pages/projects", "Projects"), ("https://git.danielmoch.com", "Git"), - ("/blog", "Blog"), ("/rss.xml", "RSS"), ), } +SIDEBAR_LINKS = { + ("Email", "email", "mailto:" + BLOG_EMAIL, BLOG_EMAIL), + ("Twitter", "url", "https://twitter.com/_djmoch", "@_djmoch"), + ("Mastodon", "url", "https://mastodon.danielmoch.com/@djmoch", "@djmoch@mastodon.danielmoch.com"), + ("Github", "url", "https://github.com/djmoch", "djmoch"), + ("PGP", "url", "/static/gpg.asc", "84BDDD43"), +} + # Alternative navigation links. Works the same way NAVIGATION_LINKS does, # although themes may not always support them. (translatable) # (Bootstrap 4: right-side of navbar, Bootblog 4: right side of title) @@ -216,16 +223,16 @@ # ) POSTS = ( - ("posts/*.rst", "blog", "post.tmpl"), - ("posts/*.md", "blog", "post.tmpl"), - ("posts/*.txt", "blog", "post.tmpl"), - ("posts/*.html", "blog", "post.tmpl"), + ("posts/*.rst", "posts", "post.tmpl"), + ("posts/*.md", "posts", "post.tmpl"), + ("posts/*.txt", "posts", "post.tmpl"), + ("posts/*.html", "posts", "post.tmpl"), ) PAGES = ( - ("pages/*.rst", "", "page.tmpl"), - ("pages/*.md", "", "page.tmpl"), - ("pages/*.txt", "", "page.tmpl"), - ("pages/*.html", "", "page.tmpl"), + ("pages/*.rst", "pages", "page.tmpl"), + ("pages/*.md", "pages", "page.tmpl"), + ("pages/*.txt", "pages", "page.tmpl"), + ("pages/*.html", "pages", "page.tmpl"), ) @@ -334,7 +341,8 @@ # Nikola supports logo display. If you have one, you can put the URL here. # Final output is <img src="LOGO_URL" id="logo" alt="BLOG_TITLE">. # The URL may be relative to the site root. -LOGO_URL = '/assets/banner-white-transparent.png' +LOGO_URL = '/assets/initials-blue.png' +AVATAR_URL = '/assets/avatar.jpg' # If you want to hide the title of your website (for example, if your logo # already contains the text), set this to False. @@ -533,7 +541,7 @@ # Final location for the main blog page and sibling paginated pages is # output / TRANSLATION[lang] / INDEX_PATH / index-*.html # (translatable) -INDEX_PATH = "blog" +INDEX_PATH = "" # Optional HTML that displayed on “main” blog index.html files. # May be used for a greeting. (translatable) @@ -624,7 +632,7 @@ # in a `nikola deploy` command as you like. DEPLOY_COMMANDS = { 'default': [ - "rsync -aP -e ssh output/* danielmoch.com:/srv/http/www/dotcom", + "rsync -aP --del -e ssh output/* danielmoch.com:/srv/http/www/dotcom", ] } @@ -925,6 +933,13 @@ # style="border-width:0; margin-bottom:12px;" # src="https://i.creativecommons.org/l/by-nc-sa/4.0/88x31.png"></a>""" +BIOGRAPHY = """ +I am a <span class="p-job-title">Software Engineer</span> currently living in +Orlando, Florida. My interests range from technology to entrepreneurship. I +am also interested in writing, movies, and astronomy. I'm also passionate +about seeing people take control of their own data. +""" + # A small copyright notice for the page footer (in HTML). # (translatable) CONTENT_FOOTER = 'Contents &copy; {date} <a href="mailto:{email}">{author}</a> - Powered by <a href="https://getnikola.com" rel="nofollow">Nikola</a> {license}' @@ -1340,7 +1355,11 @@ # Put in global_context things you want available on all your templates. # It can be anything, data, functions, modules, etc. -GLOBAL_CONTEXT = {} +GLOBAL_CONTEXT = { + "sidebar_links": SIDEBAR_LINKS, + "biography": BIOGRAPHY, + "avatar_url": AVATAR_URL, +} # Add functions here and they will be called with template # GLOBAL_CONTEXT as parameter when the template is about to be diff --git a/files/assets/avatar.jpg b/files/assets/avatar.jpg Binary files differ. diff --git a/files/assets/initials-blue.png b/files/assets/initials-blue.png Binary files differ. diff --git a/files/assets/initials-plus-blue.png b/files/assets/initials-plus-blue.png Binary files differ. diff --git a/pages/index.rst b/pages/index.rst @@ -1,36 +0,0 @@ -.. title: Home -.. slug: index -.. date: 1970-01-01 00:00:00 UTC -.. type: text - -Greetings! -========== - -.. raw:: html - - <div class="h-card"> - <div class="p-note"> - <p> - I'm <span class="p-name fn">Daniel Moch</span>. Welcome to my little corner - of the Internet. - <p> - I am a <span class="p-job-title">Software Engineer</span> currently living in - Orlando, Florida. My interests range from technology to entrepreneurship. I - am also interested in writing, movies, and astronomy. I'm also passionate - about seeing people take control of their own data. - <p> - You can navigate through the site by clicking the links above. If you’d - like to get in touch, feel free to say hello through any of the social - links below. I can also be contacted securely via my <a class="reference - external" href="/static/gpg.asc">PGP key<a>. - </div> - <div class="social-links"> - <a class="social-link u-email" rel="me" href="mailto:daniel@danielmoch.com"><i class="fas fa-envelope-square" title="Email"></i></a> - <a class="social-link u-url" rel="me" href="https://twitter.com/_djmoch"><i class="fab fa-twitter-square" title="Twitter"></i></a> - <a class="social-link u-url" rel="me" href="https://mastodon.danielmoch.com/@djmoch"><i class="fab fa-mastodon" title="Mastodon"></i></a> - <a class="social-link u-url" rel="me" href="https://github.com/djmoch"><i class="fab fa-github-square" title="Github"></i></a> - <a class="social-link u-url" rel="me" href="https://keybase.io/djmoch"><i class="fab fa-keybase" title="Keybase"></i></a> - <a class="social-link u-url" rel="me" href="https://dev.to/djmoch"><i class="fab fa-dev" title="The Practical Dev"></i></a> - <a class="social-link u-url" href="https://linkedin.com/in/danielmoch"><i class="fab fa-linkedin" title="LinkedIn"></i></a> - </div> - </div> diff --git a/themes/djmoch/assets/site.css b/themes/djmoch/assets/site.css @@ -30,11 +30,7 @@ header a, header a:hover, header a:focus { - color: #fff; -} -header a:hover -{ - color: #fff; + color: #000; } .subtle-link { @@ -42,17 +38,18 @@ header a:hover } .banner { - background-color: #155799; - color: #fff; + background-color: #fff; + color: #000; padding: 1rem 2rem; } header img { - height: 60px; + height: 25px; + padding-right: 10px; } body { - background-color: #aaa; + background-color: #fff; } .banner-title { @@ -71,15 +68,17 @@ body } @media (min-width: 992px) { - .content + .content, .sidebar { - border-color: #000; - border-style: solid; - border-width: 1px; margin: 1rem 2rem; padding: 0 1rem; padding-bottom: 1em; } + .banner-subtitle + { + margin: 0 2rem; + padding: 0 1rem; + } } .page-title { @@ -118,9 +117,34 @@ body margin-bottom: .33em; } .social-links { - text-align: center; + margin: 1em 0; +} +.social-heading { + font-family: "Playfair Display"; + top: -0.9em; + position: absolute; + font-size: 0.8em; + margin: 0 0; +} +.sidebar p { + position: relative; + margin-bottom: 1.3em; } .social-link { - font-size: 2em; + font-family: "Open Sans"; + font-size: 1.0em; color: #000; + margin: 0 0; + font-weight: lighter; +} +.sidebar-section { + margin-bottom: 3.5em; +} +.sidebar-image { + width: 60%; + display: block; + margin-left: auto; + margin-right: auto; + margin-bottom: 1.0em; + border-radius: 15px; } diff --git a/themes/djmoch/templates/base.tmpl b/themes/djmoch/templates/base.tmpl @@ -1,6 +1,7 @@ {# -*- coding: utf-8 -*- #} {% import 'base_helper.tmpl' as base with context %} {% import 'base_header.tmpl' as header with context %} +{% import 'sidebar.tmpl' as sidebar with context %} {{ set_locale(lang) }} {# <html> tag is included by base.html_headstart #} {{ base.html_headstart() }} @@ -12,17 +13,10 @@ <body> <header class="banner"> <div class="container no-padding"> - {% if logo_url or show_blog_title -%} - <span class="col-xs-12 banner-title"> - {% if logo_url -%} + <nav class="col-xs-12 banner-subtitle postpromonav" style="display: flex;"> + {% if logo_url or show_blog_title -%} <img src="{{ logo_url }}" alt="{{ blog_title|e }}"> {% endif -%} - {% if show_blog_title -%} - <span>{{ blog_title|e }}</span> - {% endif -%} - </span> - {% endif -%} - <nav class="col-xs-12 banner-subtitle postpromonav" style="display: flex;"> <ul class="no-margin no-padding tags" style="margin-right: auto;"> {{ header.html_navigation_links_entries(navigation_links) }} {{ header.html_navigation_links_entries(navigation_alt_links) }} @@ -40,6 +34,9 @@ {% block footer %}{% endblock %} </em> </div> + <div class="sidebar col-xs-12 col-md-4"> + {{ sidebar.build_sidebar() }} + </div> </div> </div> </body> diff --git a/themes/djmoch/templates/index.tmpl b/themes/djmoch/templates/index.tmpl @@ -14,7 +14,7 @@ {% if page_links %} {{ pagination.page_navigation(current_page, page_links, prevlink, nextlink, prev_next_links_reversed) }} {% endif %} -<h1>Recent Posts</h1> +<h1>{{ blog_title }}</h1> {% for post in posts %} <h2><a class="subtle-link" href="{{post.permalink()}}">{{post.title()}}</a></h2> {% if index_teasers %} diff --git a/themes/djmoch/templates/sidebar.tmpl b/themes/djmoch/templates/sidebar.tmpl @@ -0,0 +1,21 @@ +{# -*- coding: utf-8 -*- #} + +{% macro build_sidebar(sidebar_links) %} + <div class="h-card"> + <img class="sidebar-image" src="{{ avatar_url }}" id="logo" alt="{{ blog_author }}"> + <div class="bio sidebar-section"> + {{ biography }} + </div> + <div class="social-links sidebar-section"> + {{ build_sidebar_links() }} + </div> + </div> +{% endmacro %} + +{% macro build_sidebar_links() %} + {% for heading, utype, href, text in sidebar_links %} + <p> + <span class="social-heading">{{ heading }}</span> + <a class="social-link u-{{ utype }}" rel="me" href="{{ href }}">{{ text }}</a> + {% endfor %} +{% endmacro %}