From dd4497b2e3756f987a1635d272b95677302d693d Mon Sep 17 00:00:00 2001 From: Derek Severin Date: Fri, 3 Sep 2021 18:21:10 +0700 Subject: projects subtitle2 + home css fixes --- layouts/partials/limage.html | 5 ++ layouts/partials/pages/title.html | 3 ++ layouts/partials/sections/home.html | 16 +++---- static/css/default.css | 1 + static/css/theme.css | 94 +++++++++++++++++-------------------- 5 files changed, 59 insertions(+), 60 deletions(-) diff --git a/layouts/partials/limage.html b/layouts/partials/limage.html index 77624dc..9995503 100644 --- a/layouts/partials/limage.html +++ b/layouts/partials/limage.html @@ -39,6 +39,11 @@ {{ . }} {{ end }} + {{ with .context.Params.subtitle2 }} +
+ {{ . }} +
+ {{ end }} {{ if .context.Params.startDate }}
{{ partial "time-period.html" (dict "startDate" .context.Params.startDate "endDate" .context.Params.endDate) }} diff --git a/layouts/partials/pages/title.html b/layouts/partials/pages/title.html index d2b96e5..76e9b13 100644 --- a/layouts/partials/pages/title.html +++ b/layouts/partials/pages/title.html @@ -6,6 +6,9 @@ {{ with .Params.subtitle }}

{{ . }}

{{ end }} + {{ with .Params.subtitle2 }} +

{{ . }}

+ {{ end }} {{/* Period */}} {{ if .Params.startDate }} diff --git a/layouts/partials/sections/home.html b/layouts/partials/sections/home.html index b073591..d9f8a72 100644 --- a/layouts/partials/sections/home.html +++ b/layouts/partials/sections/home.html @@ -10,20 +10,20 @@ {{- with $params.width -}} --home-width: {{ . }}%; {{- end -}} - {{- with $params.offset_h -}} - --home-offset-h: {{ . }}%; + {{- if isset $params "offset_h" -}} + --home-offset-h: {{ $params.offset_h }}%; {{- end -}} - {{- with $params.offset_v -}} - --home-offset-v: {{ . }}%; + {{- if isset $params "offset_v" -}} + --home-offset-v: {{ $params.offset_v }}%; + {{- end -}} + {{- with $params.text_align -}} + --home-text-align: {{ . }}; {{- end -}} " >
{{ with .title }} -{{/* HOME_LAYOUT -

{{ . | markdownify }}

-*/}} -{{/* TODO: use specific class for title? */}} + {{/* TODO: use specific class for title? */}}

{{ . | markdownify }}

{{ end }} {{ with .subtitle }} diff --git a/static/css/default.css b/static/css/default.css index 90229c2..e20114d 100644 --- a/static/css/default.css +++ b/static/css/default.css @@ -45,6 +45,7 @@ --home-width: 50%; --home-offset-h: 50%; --home-offset-v: 50%; + --home-text-align: center; } /* ABOUT */ diff --git a/static/css/theme.css b/static/css/theme.css index 0880b7c..eb2ce7b 100644 --- a/static/css/theme.css +++ b/static/css/theme.css @@ -656,9 +656,6 @@ main { /* HOME */ -/* TODO: rewrite+check all subcases (inner, etc) + ADD VARIABLES! (align, sizes?) */ -/* TODO: check required/desired variables and add to "default css" */ - #home { position: relative; min-height: 100%; @@ -668,22 +665,14 @@ main { -moz-background-size: cover; background-size: cover; -o-background-size: cover; - -/* HOME_LAYOUT - BEGIN */ - //text-align: center; -/* HOME_LAYOUT - MID */ } #home .header-content { position: relative; width: 100%; padding: 100px 15px; -/* HOME_LAYOUT - BEGIN */ -// text-align: center; -/* HOME_LAYOUT - MID */ -/* TODO: use variables for 'top' and 'left' (0-100%) */ -text-align: center; -/* HOME_LAYOUT - END */ + + text-align: var(--home-text-align); color: var(--HOME-TITLE-COLOR, var(--GENERAL-FONT-COLOR-3)); } @@ -700,64 +689,51 @@ text-align: center; #home .header-content .header-content-inner hr { margin: 30px auto; -/* HOME_LAYOUT - MID */ -/* TODO: use variables for 'bar-width' (0-100%) (find better name) */ -width: 100%; -/* HOME_LAYOUT - END */ + + /* TODO: use variables for 'bar-width' (0-100%) (find better name) (?) */ + width: 100%; } #home .header-content .header-content-inner p { - margin-bottom: 50px; + margin-bottom: 25px; font-size: 16px; font-weight: 300; color: var(--HOME-TEXT-COLOR, var(--GENERAL-FONT-COLOR-3)); } -/* TODO: move this to "default" case, and use "@media(max-width: 768px)" instead */ @media(min-width: 768px) { #home .header-content { position: absolute; -/* HOME_LAYOUT - BEGIN */ -/* - top: 50%; - padding: 0 50px; - - -webkit-transform: translateY(-50%); - -ms-transform: translateY(-50%); - transform: translateY(-50%); -*/ -/* HOME_LAYOUT - MID */ -padding: 0; -width: var(--home-width); -left: var(--home-offset-h); -top: var(--home-offset-v); - --webkit-transform: translate( - calc(-1 * var(--home-offset-h)), - calc(-1 * var(--home-offset-v)) -); --ms-transform: translate( - calc(-1 * var(--home-offset-h)), - calc(-1 * var(--home-offset-v)) -); -transform: translate( - calc(-1 * var(--home-offset-h, 0%)), - calc(-1 * var(--home-offset-v, 0%)) -); -/* HOME_LAYOUT - END */ + padding: 0; + width: var(--home-width); + left: var(--home-offset-h); + top: var(--home-offset-v); + + -webkit-transform: translate( + calc(-1 * var(--home-offset-h)), + calc(-1 * var(--home-offset-v)) + ); + -ms-transform: translate( + calc(-1 * var(--home-offset-h)), + calc(-1 * var(--home-offset-v)) + ); + transform: translate( + calc(-1 * var(--home-offset-h)), + calc(-1 * var(--home-offset-v)) + ); } #home .header-content .header-content-inner { margin-right: auto; margin-left: auto; - max-width: 1000px; +// max-width: 1000px; } #home .header-content .header-content-inner p { - margin-right: auto; - margin-left: auto; - max-width: 80%; +// margin-right: auto; +// margin-left: auto; +// max-width: 80%; font-size: 18px; } } @@ -1121,12 +1097,22 @@ min-height: 300px; } .project-box .project-box-caption .project-box-caption-content .project-category { - padding: 10px; + /*padding: 10px;*/ + padding: 0 10px; font-size: 16px; font-family: var(--PROJECTBOX-CATEGORY-FONT, var(--GENERAL-FONT-2)); } +.project-box .project-box-caption .project-box-caption-content .project-category2 { + /*padding: 10px;*/ + padding: 0 10px; + font-size: 12px; + + font-family: var(--PROJECTBOX-CATEGORY-FONT, var(--GENERAL-FONT-2)); +} + + .project-box .project-box-caption .project-box-caption-content .project-date { padding: 10px; font-size: 12px; @@ -1143,6 +1129,10 @@ min-height: 300px; font-size: 18px; } + .project-box .project-box-caption .project-box-caption-content .project-category2 { + font-size: 14px; + } + .project-box .project-box-caption .project-box-caption-content .project-date { font-size: 14px; } -- cgit v1.2.3