From 1f4a78b1ccd8bf056eed8e40df74ccc3d7d20dfc Mon Sep 17 00:00:00 2001 From: Junbo Koh Date: Thu, 25 Jun 2026 07:58:48 +0900 Subject: [PATCH] Match blog pages to academic homepage tone --- _config.yml | 28 +-- _includes/head/custom.html | 1 + _layouts/homepage.html | 1 - _sass/site/_academic-tone.scss | 397 +++++++++++++++++++++++++++++++++ assets/css/main.scss | 4 +- 5 files changed, 413 insertions(+), 18 deletions(-) create mode 100644 _sass/site/_academic-tone.scss diff --git a/_config.yml b/_config.yml index d509c4c8232e..6f4ae94a470f 100644 --- a/_config.yml +++ b/_config.yml @@ -95,7 +95,9 @@ social: name : "Junbo Koh" # If the user or organization name differs from the site's name links: # An array of links to social media profiles - "https://github.com/Ridealist/" - - "https://twitter.com/Junbo_Koh" + - "https://www.linkedin.com/in/junbokoh92/" + - "https://scholar.google.com/citations?user=2hDR1lgAAAAJ&hl=en" + - "https://docs.google.com/document/d/1PGgfaXFf4T5BaNPduZi3TPmRhdUfYt5ULsStewoAdBs/edit?usp=sharing" # Analytics analytics: @@ -113,24 +115,18 @@ author: location : "Seoul, South Korea" email : "gtkobo92@snu.ac.kr" links: - - label: "Email" - icon: "fas fa-fw fa-envelope-square" - url: "mailto:gtkobo92@snu.ac.kr" - - label: "Website" - icon: "fas fa-fw fa-link" - # url: "https://your-website.com" - - label: "Twitter" - icon: "fab fa-fw fa-twitter-square" - url: "https://twitter.com/Junbo_Koh" - - label: "Facebook" - icon: "fab fa-fw fa-facebook-square" - # url: "https://facebook.com/" + - label: "Google Scholar" + icon: "ai ai-google-scholar" + url: "https://scholar.google.com/citations?user=2hDR1lgAAAAJ&hl=en" + - label: "CV" + icon: "ai ai-cv" + url: "https://docs.google.com/document/d/1PGgfaXFf4T5BaNPduZi3TPmRhdUfYt5ULsStewoAdBs/edit?usp=sharing" - label: "GitHub" icon: "fab fa-fw fa-github" url: "https://github.com/Ridealist/" - - label: "Instagram" - icon: "fab fa-fw fa-instagram" - # url: "https://instagram.com/" + - label: "LinkedIn" + icon: "fab fa-fw fa-linkedin" + url: "https://www.linkedin.com/in/junbokoh92/" # Site Footer footer: diff --git a/_includes/head/custom.html b/_includes/head/custom.html index c4ba380d6bc0..af18865cb554 100644 --- a/_includes/head/custom.html +++ b/_includes/head/custom.html @@ -8,5 +8,6 @@ + diff --git a/_layouts/homepage.html b/_layouts/homepage.html index 11dc766883de..6d3e5987d444 100644 --- a/_layouts/homepage.html +++ b/_layouts/homepage.html @@ -18,7 +18,6 @@ {% include head.html locale=locale %} {% include head/custom.html %} - diff --git a/_sass/site/_academic-tone.scss b/_sass/site/_academic-tone.scss new file mode 100644 index 000000000000..bd0343fe87fb --- /dev/null +++ b/_sass/site/_academic-tone.scss @@ -0,0 +1,397 @@ +/* ========================================================================== + Academic blog tone overrides + ========================================================================== */ + +:root { + --academic-bg: #fff; + --academic-text: #30363b; + --academic-muted: #667985; + --academic-heading: #043361; + --academic-link: #2476a8; + --academic-link-hover: #006699; + --academic-border: #dde5ea; + --academic-soft-bg: #f7fbfd; + --academic-code-bg: #f4f7f9; + --academic-warning: #b65b00; +} + +body:not(.layout--homepage) { + background: var(--academic-bg); + color: var(--academic-text); + line-height: 1.6; +} + +body:not(.layout--homepage) #main { + max-width: 1200px; + animation: none; + opacity: 1; +} + +body:not(.layout--homepage) a:not(.btn) { + color: var(--academic-link); + text-decoration: none; +} + +body:not(.layout--homepage) a:not(.btn):visited { + color: var(--academic-link); +} + +body:not(.layout--homepage) a:not(.btn):hover { + color: var(--academic-link-hover); + text-decoration: underline; +} + +body:not(.layout--homepage) .masthead { + border-bottom: 1px solid var(--academic-border); + background: var(--academic-bg); +} + +body:not(.layout--homepage) .greedy-nav { + background: var(--academic-bg); +} + +body:not(.layout--homepage) .site-title, +body:not(.layout--homepage) .masthead__menu-item a { + color: var(--academic-heading); + font-weight: 500; +} + +body:not(.layout--homepage) .site-title:hover, +body:not(.layout--homepage) .masthead__menu-item a:hover { + color: var(--academic-link-hover); + text-decoration: none; +} + +body:not(.layout--homepage) .breadcrumbs { + color: var(--academic-muted); + font-size: 13px; +} + +body:not(.layout--homepage) .breadcrumbs a { + color: var(--academic-muted); +} + +body:not(.layout--homepage) .archive, +body:not(.layout--homepage) .page { + color: var(--academic-text); + font-size: 16px; + line-height: 1.62; +} + +body:not(.layout--homepage) .page__title, +body:not(.layout--homepage) .page__title a { + color: var(--academic-heading); + font-weight: 500; + line-height: 1.18; +} + +body:not(.layout--homepage) .page__title { + margin-bottom: 0.8rem; + font-size: 1.75rem; +} + +body:not(.layout--homepage) .page__meta, +body:not(.layout--homepage) .page__date, +body:not(.layout--homepage) .archive__item-excerpt { + color: var(--academic-muted); +} + +body:not(.layout--homepage) .page__content h1, +body:not(.layout--homepage) .page__content h2, +body:not(.layout--homepage) .page__content h3, +body:not(.layout--homepage) .page__content h4, +body:not(.layout--homepage) .page__content h5, +body:not(.layout--homepage) .page__content h6, +body.layout--posts:not(.layout--homepage) .archive h1, +body.layout--posts:not(.layout--homepage) .archive h2:not(.archive__item-title), +body.layout--posts:not(.layout--homepage) .archive h3, +body.layout--posts:not(.layout--homepage) .archive h4, +body.layout--posts:not(.layout--homepage) .archive h5, +body.layout--posts:not(.layout--homepage) .archive h6 { + color: var(--academic-heading); + letter-spacing: 0; +} + +body:not(.layout--homepage) .page__content h2, +body.layout--posts:not(.layout--homepage) .archive h2:not(.archive__item-title) { + padding-bottom: 0.35rem; + border-bottom: 1px solid var(--academic-border); + font-weight: 500; +} + +body:not(.layout--homepage) .page__content p, +body:not(.layout--homepage) .page__content li, +body.layout--posts:not(.layout--homepage) .archive p, +body.layout--posts:not(.layout--homepage) .archive li { + line-height: 1.68; +} + +body:not(.layout--homepage) .archive__item { + padding: 1rem 0; + border-bottom: 1px solid var(--academic-border); +} + +body:not(.layout--homepage) .archive__item-title { + margin: 0 0 0.45rem; + color: var(--academic-heading); + font-family: inherit; + font-size: 1rem; + font-weight: 600; + line-height: 1.35; +} + +body:not(.layout--homepage) .archive__item-title a { + color: var(--academic-heading); +} + +body:not(.layout--homepage) .archive__item-title a:hover { + color: var(--academic-link-hover); +} + +body:not(.layout--homepage) .archive__item-excerpt { + margin-bottom: 0; + font-size: 0.86rem; + line-height: 1.55; +} + +body:not(.layout--homepage) .archive__subtitle, +body:not(.layout--homepage) .taxonomy__title { + color: var(--academic-muted); + border-bottom-color: var(--academic-border); +} + +body:not(.layout--homepage) .sidebar { + opacity: 1; +} + +body:not(.layout--homepage) .sidebar, +body:not(.layout--homepage) .author__bio, +body:not(.layout--homepage) .author__urls, +body:not(.layout--homepage) .nav__list { + color: var(--academic-muted); +} + +body:not(.layout--homepage) .sidebar .author__name, +body:not(.layout--homepage) .nav__sub-title { + color: var(--academic-heading); + font-family: inherit; + letter-spacing: 0; +} + +body:not(.layout--homepage) .nav__sub-title { + border-bottom-color: var(--academic-border); + font-size: 0.78rem; +} + +body:not(.layout--homepage) .nav__list .nav__items { + font-size: 1rem; +} + +body:not(.layout--homepage) .nav__list .nav__items a { + color: var(--academic-muted); +} + +body:not(.layout--homepage) .nav__list .nav__items a:hover { + color: var(--academic-link-hover); +} + +body:not(.layout--homepage) .author__urls-wrapper button { + min-width: 4.5rem; + padding-inline: 0.7rem; + white-space: nowrap; +} + +body:not(.layout--homepage) .author__urls .ai { + width: 1.25em; + text-align: center; +} + +body:not(.layout--homepage) .author__urls a i, +body:not(.layout--homepage) .author__urls a .ai { + color: var(--academic-link); +} + +body:not(.layout--homepage) .page__taxonomy { + color: var(--academic-muted); +} + +body:not(.layout--homepage) .page__taxonomy-item { + border-color: var(--academic-border); + border-radius: 2px; + color: var(--academic-link); +} + +body:not(.layout--homepage) .page__taxonomy-item:hover { + border-color: var(--academic-link-hover); + color: var(--academic-link-hover); +} + +body:not(.layout--homepage) .taxonomy__index a { + color: var(--academic-heading); + border-bottom-color: var(--academic-border); +} + +body:not(.layout--homepage) .taxonomy__count, +body:not(.layout--homepage) .back-to-top { + color: var(--academic-muted); +} + +body.layout--posts:not(.layout--homepage) .list-group { + margin: 0 0 1.5rem; + padding: 0.75rem 1rem; + border: 1px solid var(--academic-border); + border-radius: 4px; + background: var(--academic-soft-bg); +} + +body.layout--posts:not(.layout--homepage) .list-group-item.active { + display: block; + margin: -0.75rem -1rem 0.75rem; + padding: 0.55rem 1rem; + border-radius: 4px 4px 0 0; + background: var(--academic-heading); + color: #fff; + font-weight: 600; + text-decoration: none; +} + +body.layout--posts:not(.layout--homepage) .list-group ul, +body.layout--posts:not(.layout--homepage) .list-group ol { + margin: 0; + padding-left: 1.1rem; + font-size: 0.92rem; +} + +body:not(.layout--homepage) blockquote { + border-inline-start-color: var(--academic-link); + color: var(--academic-muted); +} + +body:not(.layout--homepage) table, +body:not(.layout--homepage) th, +body:not(.layout--homepage) td { + border-color: var(--academic-border); +} + +body:not(.layout--homepage) thead { + color: var(--academic-heading); + background: var(--academic-soft-bg); +} + +body:not(.layout--homepage) code, +body:not(.layout--homepage) .page__content :not(pre) > code, +body.layout--posts:not(.layout--homepage) .archive :not(pre) > code { + border: 1px solid var(--academic-border); + background: var(--academic-code-bg); + color: var(--academic-text); +} + +body:not(.layout--homepage) div.highlighter-rouge, +body:not(.layout--homepage) figure.highlight, +body:not(.layout--homepage) .highlight { + border-color: var(--academic-border); + background: var(--academic-code-bg); +} + +body:not(.layout--homepage) .toc { + border-color: var(--academic-border); + background: var(--academic-bg); + box-shadow: none; +} + +body:not(.layout--homepage) .toc .nav__title { + background: var(--academic-heading); +} + +body:not(.layout--homepage) .toc__menu a { + color: var(--academic-muted); + border-bottom-color: var(--academic-border); +} + +body:not(.layout--homepage) .toc__menu a:hover { + color: var(--academic-link-hover); +} + +body:not(.layout--homepage) .page__share, +body:not(.layout--homepage) .page__comments-title, +body:not(.layout--homepage) .page__related, +body.layout--posts:not(.layout--homepage) .col-lg-8 { + border-top-color: var(--academic-border); +} + +body.layout--posts:not(.layout--homepage) .col-lg-8 { + margin-top: 2rem; + padding-top: 1rem; +} + +body.layout--posts:not(.layout--homepage) .col-lg-8 hr { + display: none; +} + +body:not(.layout--homepage) .page__footer { + color: var(--academic-muted); + background: var(--academic-soft-bg); +} + +body:not(.layout--homepage) .page__footer a { + color: var(--academic-link); +} + +@media (prefers-color-scheme: dark) { + :root { + --academic-bg: #20212b; + --academic-text: #dadbdf; + --academic-muted: #aebac3; + --academic-heading: #dce9ef; + --academic-link: #64c5f2; + --academic-link-hover: #93d8f7; + --academic-border: #3b4650; + --academic-soft-bg: #272936; + --academic-code-bg: #2f3341; + --academic-warning: #ffbc70; + } + + body:not(.layout--homepage) .masthead, + body:not(.layout--homepage) .greedy-nav { + background: var(--academic-bg); + } + + body:not(.layout--homepage) .greedy-nav .visible-links a::before { + background: var(--academic-link); + } + + body:not(.layout--homepage) img { + border-color: var(--academic-border); + } + + body:not(.layout--homepage) div.highlighter-rouge, + body:not(.layout--homepage) figure.highlight, + body:not(.layout--homepage) .highlight, + body:not(.layout--homepage) pre { + color: var(--academic-text); + background: var(--academic-code-bg); + } + + body:not(.layout--homepage) .author__urls { + background: var(--academic-bg); + } +} + +@media screen and (max-width: 960px) { + body:not(.layout--homepage) #main { + padding-inline: 1rem; + } + + body:not(.layout--homepage) .archive, + body:not(.layout--homepage) .page { + margin-top: 0.5rem; + } + + body:not(.layout--homepage) .archive__item { + padding: 0.85rem 0; + } + + body.layout--posts:not(.layout--homepage) .list-group { + margin-bottom: 1.25rem; + } +} diff --git a/assets/css/main.scss b/assets/css/main.scss index df4cf0251bff..f952cac94499 100644 --- a/assets/css/main.scss +++ b/assets/css/main.scss @@ -30,4 +30,6 @@ code { border: 1px solid #C1C1C1; border-radius: 1px; padding: 1px; -} \ No newline at end of file +} + +@import "site/academic-tone";