From 57604ba6111199c1e6d6f43cadb9ebb3a00adb39 Mon Sep 17 00:00:00 2001 From: Daria Lutchenko <102282963+dustgalactic@users.noreply.github.com> Date: Mon, 7 Sep 2026 14:15:24 +0200 Subject: [PATCH 1/3] Update config --- .github/dependabot.yml | 21 +++++ .github/workflows/dependency-review.yml | 17 ++++ .github/workflows/validate.yml | 32 +++++++ 404.html | 4 + _config.yml | 1 + _includes/custom-head.html | 22 ++--- _includes/footer.html | 9 +- _includes/header.html | 30 +++++-- _includes/linkedin-button.html | 48 ++--------- _includes/nav-items.html | 2 +- _includes/post-links.html | 7 +- _includes/social.html | 25 ++++-- _layouts/base.html | 4 +- _layouts/home.html | 12 +-- _layouts/post.html | 15 ++-- _sass/minima/_layout.scss | 108 +++++++++++------------- _sass/minima/custom-styles.scss | 86 +++++++++++++++++-- _sass/minima/custom-variables.scss | 4 + about.md | 2 +- assets/images/site.webmanifest | 8 +- robots.txt | 7 ++ 21 files changed, 294 insertions(+), 170 deletions(-) create mode 100644 .github/dependabot.yml create mode 100644 .github/workflows/dependency-review.yml create mode 100644 .github/workflows/validate.yml create mode 100644 robots.txt diff --git a/.github/dependabot.yml b/.github/dependabot.yml new file mode 100644 index 0000000..03444b5 --- /dev/null +++ b/.github/dependabot.yml @@ -0,0 +1,21 @@ +version: 2 +updates: + - package-ecosystem: bundler + directory: / + schedule: + interval: monthly + open-pull-requests-limit: 1 + groups: + ruby-dependencies: + patterns: + - "*" + + - package-ecosystem: github-actions + directory: / + schedule: + interval: monthly + open-pull-requests-limit: 1 + groups: + github-actions: + patterns: + - "*" diff --git a/.github/workflows/dependency-review.yml b/.github/workflows/dependency-review.yml new file mode 100644 index 0000000..2b080e1 --- /dev/null +++ b/.github/workflows/dependency-review.yml @@ -0,0 +1,17 @@ +name: Dependency review + +on: + pull_request: + +permissions: + contents: read + +jobs: + dependency-review: + runs-on: ubuntu-latest + steps: + - name: Check out repository + uses: actions/checkout@v4 + + - name: Review dependency changes + uses: actions/dependency-review-action@v4 diff --git a/.github/workflows/validate.yml b/.github/workflows/validate.yml new file mode 100644 index 0000000..1a68c2e --- /dev/null +++ b/.github/workflows/validate.yml @@ -0,0 +1,32 @@ +name: Validate site + +on: + pull_request: + push: + branches: + - main + +permissions: + contents: read + +jobs: + build: + runs-on: ubuntu-latest + steps: + - name: Check out repository + uses: actions/checkout@v4 + + - name: Set up Ruby + uses: ruby/setup-ruby@v1 + with: + ruby-version: "3.3" + + - name: Install dependencies + run: | + bundle lock --add-platform x86_64-linux + bundle install --jobs 4 --retry 3 + + - name: Build site + run: bundle exec jekyll build + env: + JEKYLL_ENV: production diff --git a/404.html b/404.html index 402968c..86ddf9e 100644 --- a/404.html +++ b/404.html @@ -1,5 +1,9 @@ --- layout: base +title: Unfortunately, 404 +permalink: /404.html +noindex: true +sitemap: false ---
diff --git a/_config.yml b/_config.yml index 3a1aace..57508b6 100644 --- a/_config.yml +++ b/_config.yml @@ -16,6 +16,7 @@ plugins: - jekyll-seo-tag - jekyll-remote-theme - jekyll-paginate + - jekyll-sitemap paginate: 5 paginate_path: "/page:num/" diff --git a/_includes/custom-head.html b/_includes/custom-head.html index f57f636..417f004 100644 --- a/_includes/custom-head.html +++ b/_includes/custom-head.html @@ -1,22 +1,12 @@ - - - - - - - - - - - - - - + - - + + +{% if page.noindex %} + +{% endif %} diff --git a/_includes/footer.html b/_includes/footer.html index e710926..e301cc1 100644 --- a/_includes/footer.html +++ b/_includes/footer.html @@ -1,5 +1,3 @@ - -
diff --git a/_includes/linkedin-button.html b/_includes/linkedin-button.html index 9244cc9..bb6942d 100644 --- a/_includes/linkedin-button.html +++ b/_includes/linkedin-button.html @@ -1,47 +1,11 @@ {% if include.url %} - - - - -
- - Comment + + + Comment +
{% endif %} diff --git a/_includes/nav-items.html b/_includes/nav-items.html index fecc600..a0fa52e 100644 --- a/_includes/nav-items.html +++ b/_includes/nav-items.html @@ -2,7 +2,7 @@ {%- for path in include.paths -%} {%- assign hyperpage = site.pages | where: "path", path | first -%} {%- if hyperpage.title %} - {{ hyperpage.title | escape }} + {{ hyperpage.title | escape }} {%- endif -%} {%- endfor %} diff --git a/_includes/post-links.html b/_includes/post-links.html index 36d4590..60178a4 100644 --- a/_includes/post-links.html +++ b/_includes/post-links.html @@ -3,10 +3,9 @@ const postContent = document.querySelector('.post-content'); if (postContent) { const links = postContent.getElementsByTagName('a'); - for (let link of links) { - if (!link.target) { - link.target = '_blank'; - } + for (const link of links) { + link.target = '_blank'; + link.relList.add('noopener', 'noreferrer'); } } }); diff --git a/_includes/social.html b/_includes/social.html index fb5b3bc..e2a30eb 100644 --- a/_includes/social.html +++ b/_includes/social.html @@ -1,20 +1,27 @@ {% if paginator.total_pages > 1 %} -
+
+ {% endif %} {%- endif -%} diff --git a/_layouts/post.html b/_layouts/post.html index 1e613b6..c8e8986 100644 --- a/_layouts/post.html +++ b/_layouts/post.html @@ -1,31 +1,30 @@ --- layout: base --- -
+
Back to Posts
-

{{ page.title | escape }}

+

{{ page.title | escape }}

{%- assign date_format = site.minima.date_format | default: "%b %-d, %Y" -%} {%- if page.modified_date %}Published:{% endif %} -
-
+
{{ content }} {% if page.linkedin %} diff --git a/_sass/minima/_layout.scss b/_sass/minima/_layout.scss index 60678d0..3d5655f 100644 --- a/_sass/minima/_layout.scss +++ b/_sass/minima/_layout.scss @@ -23,7 +23,6 @@ padding-right: 45px; } - // Prevent any hover/focus/active effects &:hover, &:focus, &:active, &:visited { text-decoration: none !important; color: $text-color !important; @@ -32,88 +31,83 @@ .site-nav { float: right; - border: none; - background-color: inherit; - label[for="nav-trigger"], #nav-trigger { + .nav-trigger { display: none; } + .nav-items { + display: flex; + align-items: center; + gap: $spacing-unit * 0.5; + } + .nav-item { color: $text-color; - &:not(:last-child) { - margin-right: $spacing-unit * 0.5; + text-decoration: none; + + &:hover, + &.is-active { + color: $accent-color; + text-decoration: underline; + text-underline-offset: 4px; } } @include media-query($on-medium) { position: absolute; - top: 9px; + top: 5px; right: $spacing-unit * 0.6; + z-index: 20; + min-width: 44px; background-color: $background-color; border: 1px solid $border-color-01; border-radius: 5px; text-align: right; - label[for="nav-trigger"] { - display: block; - float: right; - width: 36px; - height: 36px; + .nav-trigger { + display: flex; + align-items: center; + justify-content: center; + width: 44px; + height: 44px; + box-sizing: border-box; + margin: 0 0 0 auto; + padding: 0; + line-height: 1; cursor: pointer; - } - - .menu-icon { - float: right; - width: 36px; - height: 26px; - line-height: 0; - padding-top: 18px; - text-align: center; + list-style: none; - &::before { - font-family: "Font Awesome 7 Free"; - font-weight: 900; + &::marker { + content: ""; } - > svg path { - fill: $border-color-03; + &::-webkit-details-marker { + display: none; } } - #nav-trigger { - ~ label[for=nav-trigger] .menu-icon { - &::before { - content: "\f0c9"; - font-size: 1.25em; - } - } - ~ .nav-items { - clear: both; - display: none - } - &:checked { - ~ label[for=nav-trigger] .menu-icon { - &::before { - content: "\f00d"; - font-size: 1.5em; - } - } - ~ .nav-items { - display: block; - padding-bottom: 5px; - .nav-item { - margin-left: 20px; - padding: 5px 10px; - } - } - } + .menu-icon { + width: 24px; + height: 24px; + display: block; + margin: auto; + fill: none; + stroke: currentColor; + stroke-linecap: round; + stroke-width: 2; + } + + .nav-items { + display: block; + clear: both; + padding-bottom: 5px; } .nav-item { display: block; - margin-right: $spacing-unit * 0.5; - padding: 5px 0; + margin: 0 5px; + padding: 8px 10px; color: $text-color; line-height: $base-line-height; } @@ -353,13 +347,13 @@ border: 1px solid $border-color-01; &:hover { border-color: $border-color-02 } } - a, div { + a, div, span { min-width: 41px; padding: 10px 12px; text-align: center; box-sizing: border-box; } - div { + div, span { border: 1px solid transparent; &.pager-edge { color: $border-color-01; diff --git a/_sass/minima/custom-styles.scss b/_sass/minima/custom-styles.scss index 4dfc5f4..91b915a 100644 --- a/_sass/minima/custom-styles.scss +++ b/_sass/minima/custom-styles.scss @@ -20,8 +20,36 @@ .align-items-center { align-items: center !important; } .justify-content-center { justify-content: center !important; } +.visually-hidden { + position: absolute !important; + width: 1px !important; + height: 1px !important; + padding: 0 !important; + margin: -1px !important; + overflow: hidden !important; + clip: rect(0, 0, 0, 0) !important; + white-space: nowrap !important; + border: 0 !important; +} + +.skip-link { + position: fixed; + top: 0.5rem; + left: 0.5rem; + z-index: 1000; + padding: 0.75rem 1rem; + color: $background-color; + background: $text-color; + border-radius: 4px; + transform: translateY(-150%); + + &:focus { + transform: translateY(0); + } +} + // Focus state mixin for consistent focus styles -@mixin focus-state($color: $accent-color) { +@mixin focus-state($color: $focus-color) { &:focus-visible { outline: 2px solid $color; outline-offset: 2px; @@ -98,7 +126,7 @@ padding: 1rem 0; &:not(:last-child) { - border-bottom: 1px solid #d4d0cc; + border-bottom: 1px solid $border-color; } .post-title { @@ -111,7 +139,7 @@ color: $accent-color; text-decoration: none; transition: color 0.2s ease; - + &:hover { color: darken($accent-color, 10%); text-decoration: underline; @@ -187,7 +215,7 @@ table { td { border: none; - border-bottom: 1px solid #d4d0cc; + border-bottom: 1px solid $border-color; padding: 1rem 1.25rem; color: $text-color; vertical-align: top; @@ -242,8 +270,36 @@ table { } } -// Blog post links -.post-content a[target="_blank"] { +.linkedin-button-container { + width: 100%; + margin: 2rem 0; +} + +.linkedin-button { + display: inline-flex; + align-items: center; + gap: 8px; + box-sizing: border-box; + padding: 8px 15px; + color: white !important; + background-color: #0077b5; + border: 1px solid #0077b5; + border-radius: 4px; + font-size: 14px; + font-weight: 500; + line-height: 1.5; + text-decoration: none; + transition: all 0.2s ease; + + &:hover { + color: white !important; + background-color: #006097; + border-color: #006097; + text-decoration: none; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); + } + + @include focus-state(); } // Footer and social media @@ -256,11 +312,11 @@ table { @include button-style($text-muted, transparent, $background-color, $text-muted); min-width: 40px; min-height: 40px; - + .grey { @extend .text-muted; } - + &:hover .grey { color: $background-color !important; } @@ -273,6 +329,18 @@ input, select, textarea, .nav-item, -.site-title { +.site-title, +.nav-trigger { @include focus-state(); +} + +@media (prefers-reduced-motion: reduce) { + *, + *::before, + *::after { + scroll-behavior: auto !important; + transition-duration: 0.01ms !important; + animation-duration: 0.01ms !important; + animation-iteration-count: 1 !important; + } } \ No newline at end of file diff --git a/_sass/minima/custom-variables.scss b/_sass/minima/custom-variables.scss index 1ca966f..f9fbd2a 100644 --- a/_sass/minima/custom-variables.scss +++ b/_sass/minima/custom-variables.scss @@ -9,3 +9,7 @@ $text-secondary: #3a3a3a; // Secondary text (medium gray) // Accent color $accent-color: #0d7377; // Teal for interactive elements + +// Shared component colors +$border-color: #d4d0cc; +$focus-color: $accent-color; diff --git a/about.md b/about.md index 3424488..7b44f8d 100644 --- a/about.md +++ b/about.md @@ -6,7 +6,7 @@ permalink: /about ## Welcome! -Hi, I’m Daria. A technical writer turned team lead. +Hi, I’m Daria. A technical writer turned product lead. Profile picture diff --git a/assets/images/site.webmanifest b/assets/images/site.webmanifest index 39e0866..6046995 100644 --- a/assets/images/site.webmanifest +++ b/assets/images/site.webmanifest @@ -1,6 +1,6 @@ { - "name": "TechDaria", - "short_name": "TechDaria", + "name": "Technically, Daria", + "short_name": "Technically, Daria", "icons": [ { "src": "/assets/images/web-app-manifest-192x192.png", @@ -15,7 +15,7 @@ "purpose": "maskable" } ], - "theme_color": "#ffffff", - "background_color": "#ffffff", + "theme_color": "#f5f3f0", + "background_color": "#f5f3f0", "display": "standalone" } \ No newline at end of file diff --git a/robots.txt b/robots.txt new file mode 100644 index 0000000..2208eb0 --- /dev/null +++ b/robots.txt @@ -0,0 +1,7 @@ +--- +layout: null +--- +User-agent: * +Allow: / + +Sitemap: {{ '/sitemap.xml' | absolute_url }} From 4f85f77d12931526ab345f8f22698c22f86ea0c1 Mon Sep 17 00:00:00 2001 From: Daria Lutchenko <102282963+dustgalactic@users.noreply.github.com> Date: Mon, 7 Sep 2026 14:21:37 +0200 Subject: [PATCH 2/3] more changes --- .github/workflows/dependency-review.yml | 17 ------------- .github/workflows/validate.yml | 32 ------------------------- .gitignore | 1 + _config.yml | 6 +++++ _includes/post-links.html | 7 ++++++ _layouts/home.html | 2 +- _layouts/post.html | 1 + _sass/minima/_layout.scss | 4 ++-- 8 files changed, 18 insertions(+), 52 deletions(-) delete mode 100644 .github/workflows/dependency-review.yml delete mode 100644 .github/workflows/validate.yml diff --git a/.github/workflows/dependency-review.yml b/.github/workflows/dependency-review.yml deleted file mode 100644 index 2b080e1..0000000 --- a/.github/workflows/dependency-review.yml +++ /dev/null @@ -1,17 +0,0 @@ -name: Dependency review - -on: - pull_request: - -permissions: - contents: read - -jobs: - dependency-review: - runs-on: ubuntu-latest - steps: - - name: Check out repository - uses: actions/checkout@v4 - - - name: Review dependency changes - uses: actions/dependency-review-action@v4 diff --git a/.github/workflows/validate.yml b/.github/workflows/validate.yml deleted file mode 100644 index 1a68c2e..0000000 --- a/.github/workflows/validate.yml +++ /dev/null @@ -1,32 +0,0 @@ -name: Validate site - -on: - pull_request: - push: - branches: - - main - -permissions: - contents: read - -jobs: - build: - runs-on: ubuntu-latest - steps: - - name: Check out repository - uses: actions/checkout@v4 - - - name: Set up Ruby - uses: ruby/setup-ruby@v1 - with: - ruby-version: "3.3" - - - name: Install dependencies - run: | - bundle lock --add-platform x86_64-linux - bundle install --jobs 4 --retry 3 - - - name: Build site - run: bundle exec jekyll build - env: - JEKYLL_ENV: production diff --git a/.gitignore b/.gitignore index 57510a2..0c3e5ab 100644 --- a/.gitignore +++ b/.gitignore @@ -1 +1,2 @@ _site/ +.sass-cache/ diff --git a/_config.yml b/_config.yml index 57508b6..1b85257 100644 --- a/_config.yml +++ b/_config.yml @@ -21,6 +21,12 @@ plugins: paginate: 5 paginate_path: "/page:num/" +defaults: + - scope: + path: "" + values: + image: /assets/images/social-preview.png + sass: quiet_deps: true silence_deprecations: [import] diff --git a/_includes/post-links.html b/_includes/post-links.html index 60178a4..934773b 100644 --- a/_includes/post-links.html +++ b/_includes/post-links.html @@ -6,6 +6,13 @@ for (const link of links) { link.target = '_blank'; link.relList.add('noopener', 'noreferrer'); + if (!link.getAttribute('aria-label')?.includes('opens in a new tab')) { + const describedBy = link.getAttribute('aria-describedby'); + link.setAttribute( + 'aria-describedby', + [describedBy, 'new-tab-description'].filter(Boolean).join(' ') + ); + } } } }); diff --git a/_layouts/home.html b/_layouts/home.html index 95c72f4..383ff1e 100644 --- a/_layouts/home.html +++ b/_layouts/home.html @@ -48,7 +48,7 @@

  • •
    • {% endif %} -
  • Page {{ paginator.page }} of {{ paginator.total_pages }}
    • +
  • Page {{ paginator.page }} of {{ paginator.total_pages }}
    • {% if paginator.next_page %}
  • diff --git a/_layouts/post.html b/_layouts/post.html index c8e8986..f676e74 100644 --- a/_layouts/post.html +++ b/_layouts/post.html @@ -2,6 +2,7 @@ layout: base ---
    +
    diff --git a/_sass/minima/_layout.scss b/_sass/minima/_layout.scss index 3d5655f..448cf0c 100644 --- a/_sass/minima/_layout.scss +++ b/_sass/minima/_layout.scss @@ -347,13 +347,13 @@ border: 1px solid $border-color-01; &:hover { border-color: $border-color-02 } } - a, div, span { + a, div { min-width: 41px; padding: 10px 12px; text-align: center; box-sizing: border-box; } - div, span { + div { border: 1px solid transparent; &.pager-edge { color: $border-color-01; From 98deab075195d94bc4a7825ee2ab50b84a29c014 Mon Sep 17 00:00:00 2001 From: Daria Lutchenko <102282963+dustgalactic@users.noreply.github.com> Date: Mon, 7 Sep 2026 14:26:35 +0200 Subject: [PATCH 3/3] Update _config.yml --- _config.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/_config.yml b/_config.yml index 1b85257..08bf722 100644 --- a/_config.yml +++ b/_config.yml @@ -4,7 +4,7 @@ lang: en author: name: Daria Lutchenko description: > - A blog about technical writing. + A blog on technical writing and product management. url: "https://techdaria.com" baseurl: "" logo: /assets/images/social-preview.png