Skip to content

Commit e14fec0

Browse files
AnXh3L0AnXh3L0
authored
Merge pull request #43 from AnySoftKeyboard/refactor/modernize-codebase-tailwind-v4
2 parents baedd56 + 2c91387 commit e14fec0

File tree

12 files changed

+263
-132
lines changed

12 files changed

+263
-132
lines changed

‎404.html‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
sitemap: false
55
permalink: /404.html
66
---
7-
<section class="py-24 md:py-32 bg-white">
7+
<section class="py-20 md:py-28 bg-white">
88
<div class="max-w-xl mx-auto px-4 text-center">
99
<figure class="mb-8">
1010
<img src="/images/phone_404.png" alt="Oops!" loading="lazy" class="max-w-xs mx-auto" width="320" height="auto">
@@ -15,7 +15,7 @@ <h1 class="text-4xl md:text-5xl font-bold text-gray-900 mb-4">
1515
<p class="text-xl text-gray-600 mb-8">The page you're looking for doesn't exist or has been moved.</p>
1616
<div class="flex flex-wrap gap-4 justify-center">
1717
<a href="/" class="btn btn-primary">Go Home</a>
18-
<a href="https://github.com/AnySoftKeyboard/AnySoftKeyboard/discussions" class="btn border-2 border-primary-700 text-primary-700 hover:bg-primary-700 hover:text-white" target="_blank" rel="noopener noreferrer">Get Help</a>
18+
<a href="https://github.com/AnySoftKeyboard/AnySoftKeyboard/discussions" class="btn btn-outline" target="_blank" rel="noopener noreferrer">Get Help</a>
1919
</div>
2020
</div>
2121
</section>

‎_layouts/archive.html‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
---
22
layout: default
33
---
4-
<section class="section-gradient text-white text-center py-12 md:py-16">
4+
<section class="hero-bg text-white text-center py-10 md:py-14">
55
<div class="max-w-4xl mx-auto px-4">
6-
<h1 class="text-3xl md:text-4xl font-bold text-white">{{ page.title }}</h1>
6+
<h1 class="text-3xl md:text-4xl font-bold">{{ page.title }}</h1>
77
</div>
88
</section>
99

@@ -14,7 +14,7 @@ <h1 class="text-3xl md:text-4xl font-bold text-white">{{ page.title }}</h1>
1414
{% for post in page.posts %}
1515
<li class="blog-post">
1616
<h2 class="text-2xl font-bold mb-2">
17-
<a href="{{ post.url | relative_url }}" class="text-gray-900 hover:text-primary-700">{{ post.title }}</a>
17+
<a href="{{ post.url | relative_url }}" class="text-gray-900 hover:text-purple-700">{{ post.title }}</a>
1818
</h2>
1919
<p class="text-gray-500 text-sm mb-4">
2020
<time datetime="{{ post.date | date_to_xmlschema }}">{{ post.date | date: "%B %-d, %Y" }}</time>
@@ -26,7 +26,7 @@ <h2 class="text-2xl font-bold mb-2">
2626
{% endfor %}
2727
</ul>
2828
{% else %}
29-
<p class="text-center text-gray-500">No posts in this archive.</p>
29+
<p class="text-center text-gray-500 py-12">No posts in this archive.</p>
3030
{% endif %}
3131
</div>
3232
</section>

‎_layouts/default.html‎

Lines changed: 13 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,7 @@
33
<head>
44
<meta charset="utf-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1">
6-
<meta name="theme-color" content="#6b21a8">
7-
<meta name="color-scheme" content="light dark">
6+
<meta name="theme-color" content="#7c3aed">
87

98
{% seo %}
109
{% feed_meta %}
@@ -14,27 +13,27 @@
1413
<link rel="icon" type="image/png" href="{{ site.baseurl }}/favicon.png">
1514
<link rel="apple-touch-icon" href="{{ site.baseurl }}/apple-touch-icon.png">
1615
</head>
17-
<body class="min-h-screen bg-white">
16+
<body class="min-h-screen bg-white font-sans text-gray-700 antialiased">
1817
<a href="#main-content" class="skip-link">Skip to main content</a>
1918

20-
<header class="section-gradient" role="banner">
21-
<div class="max-w-6xl mx-auto px-4 py-4">
19+
<header class="header-bg" role="banner">
20+
<div class="max-w-6xl mx-auto px-4 py-3">
2221
<div class="flex items-center justify-between">
23-
<a href="{{ site.baseurl }}/" class="z-10" aria-label="AnySoftKeyboard Home">
24-
<img src="{{ site.baseurl }}/images/logo.svg" alt="AnySoftKeyboard" class="h-11 w-auto" width="76" height="44">
22+
<a href="{{ site.baseurl }}/" class="flex items-center" aria-label="AnySoftKeyboard Home">
23+
<img src="{{ site.baseurl }}/images/logo.svg" alt="AnySoftKeyboard" class="h-10 w-auto" width="76" height="40">
2524
</a>
2625

2726
<!-- Mobile menu toggle -->
2827
<input type="checkbox" id="nav-toggle" class="hidden peer" aria-hidden="true">
29-
<label for="nav-toggle" class="lg:hidden flex items-center justify-center w-11 h-11 rounded-lg text-white hover:bg-white/10 cursor-pointer z-10" aria-label="Toggle menu">
30-
<svg class="w-6 h-6 peer-checked:hidden" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 12h18M3 6h18M3 18h18"/></svg>
28+
<label for="nav-toggle" class="lg:hidden flex items-center justify-center w-10 h-10 rounded-lg text-white hover:bg-white/10 cursor-pointer z-20" aria-label="Toggle menu">
29+
<svg class="w-6 h-6 block peer-checked:hidden" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M3 12h18M3 6h18M3 18h18"/></svg>
3130
<svg class="w-6 h-6 hidden peer-checked:block" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M6 18L18 6M6 6l12 12"/></svg>
3231
</label>
3332

3433
<!-- Navigation -->
35-
<nav class="fixed lg:relative inset-0 lg:inset-auto section-gradient lg:bg-transparent flex flex-col lg:flex-row items-center justify-center lg:justify-end gap-2 transform translate-x-full lg:translate-x-0 peer-checked:translate-x-0 transition-transform z-5" role="navigation" aria-label="Main navigation">
34+
<nav class="fixed lg:static inset-0 lg:inset-auto header-bg lg:bg-transparent flex flex-col lg:flex-row items-center justify-center lg:justify-end gap-1 transform translate-x-full lg:translate-x-0 peer-checked:translate-x-0 transition-transform duration-200 z-10" role="navigation" aria-label="Main navigation">
3635
{% for link in site.data.navigation %}
37-
<a href="{{ link.link }}" class="nav-link text-xl lg:text-sm"{% if page.url == link.link %} aria-current="page"{% endif %}{% if link.new_window %} target="_blank" rel="noopener noreferrer"{% endif %}>
36+
<a href="{{ link.link }}" class="nav-link text-lg lg:text-sm"{% if page.url == link.link %} aria-current="page"{% endif %}{% if link.new_window %} target="_blank" rel="noopener noreferrer"{% endif %}>
3837
{{ link.name }}
3938
</a>
4039
{% endfor %}
@@ -47,7 +46,7 @@
4746
{{ content }}
4847
</main>
4948

50-
<footer class="bg-gradient-to-b from-indigo-950 to-slate-950 text-white py-16" role="contentinfo">
49+
<footer class="bg-gray-900 text-white py-12" role="contentinfo">
5150
<div class="max-w-6xl mx-auto px-4">
5251
<div class="grid grid-cols-1 sm:grid-cols-3 gap-8 mb-8">
5352
{% for column in site.data.footer %}
@@ -68,9 +67,9 @@
6867
{% endfor %}
6968
</div>
7069
<div class="border-t border-white/10 pt-6 text-center">
71-
<p class="text-white/60 text-sm">
70+
<p class="text-white/50 text-sm">
7271
&copy; {{ site.time | date: '%Y' }} AnySoftKeyboard &bull;
73-
<a href="{{ site.baseurl }}/privacy-policy/" class="text-purple-400 hover:text-purple-300">Privacy Policy</a>
72+
<a href="{{ site.baseurl }}/privacy-policy/" class="text-white/70 hover:text-white">Privacy Policy</a>
7473
</p>
7574
</div>
7675
</div>

‎_layouts/page.html‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
---
22
layout: default
33
---
4-
<section class="section-gradient text-white text-center py-12 md:py-16">
4+
<section class="hero-bg text-white text-center py-10 md:py-14">
55
<div class="max-w-4xl mx-auto px-4">
6-
<h1 class="text-3xl md:text-4xl font-bold text-white">{{ page.title }}</h1>
6+
<h1 class="text-3xl md:text-4xl font-bold">{{ page.title }}</h1>
77
{% if page.subtitle %}
8-
<p class="text-lg text-white/90 mt-2">{{ page.subtitle }}</p>
8+
<p class="text-lg text-white/80 mt-2">{{ page.subtitle }}</p>
99
{% endif %}
1010
</div>
1111
</section>
1212

13-
<section class="py-12 md:py-16 bg-white">
14-
<div class="max-w-3xl mx-auto px-4 prose prose-lg prose-purple">
13+
<section class="py-10 md:py-14 bg-white">
14+
<div class="max-w-3xl mx-auto px-4 prose">
1515
{{ content }}
1616
</div>
1717
</section>

‎_layouts/post.html‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,30 +1,30 @@
11
---
22
layout: default
33
---
4-
<section class="section-gradient text-white text-center py-12 md:py-16">
4+
<section class="hero-bg text-white text-center py-10 md:py-14">
55
<div class="max-w-4xl mx-auto px-4">
6-
<h1 class="text-3xl md:text-4xl font-bold text-white">{{ page.title }}</h1>
7-
<p class="text-white/80 mt-3">
6+
<h1 class="text-3xl md:text-4xl font-bold">{{ page.title }}</h1>
7+
<p class="text-white/70 mt-3">
88
<time datetime="{{ page.date | date_to_xmlschema }}">{{ page.date | date: "%B %-d, %Y" }}</time>
99
{% if page.author %} • {{ page.author }}{% endif %}
1010
</p>
1111
</div>
1212
</section>
1313

14-
<article class="py-12 md:py-16 bg-white">
15-
<div class="max-w-3xl mx-auto px-4 prose prose-lg prose-purple">
14+
<article class="py-10 md:py-14 bg-white">
15+
<div class="max-w-3xl mx-auto px-4 prose">
1616
{{ content }}
1717

1818
{% if page.author %}
1919
{% assign author = site.staff_members | where: "name", page.author | first %}
20-
<aside class="not-prose mt-12 flex items-center gap-4 p-6 bg-purple-50 rounded-2xl">
20+
<aside class="mt-12 flex items-center gap-4 p-5 bg-gray-50 rounded-xl border border-gray-200">
2121
{% if author.image_path %}
22-
<img src="{{ author.image_path }}" alt="{{ author.name }}" loading="lazy" class="w-16 h-16 rounded-full" width="64" height="64">
22+
<img src="{{ author.image_path }}" alt="{{ author.name }}" loading="lazy" class="w-14 h-14 rounded-full" width="56" height="56">
2323
{% endif %}
2424
<div>
25-
<strong class="text-gray-900">{{ page.author }}</strong>
25+
<strong class="text-gray-900 block">{{ page.author }}</strong>
2626
{% if author.position %}
27-
<p class="text-gray-600 text-sm">{{ author.position }}</p>
27+
<span class="text-gray-500 text-sm">{{ author.position }}</span>
2828
{% endif %}
2929
</div>
3030
</aside>

‎about.html‎

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@
33
title: About AnySoftKeyboard
44
description: Meet the team behind AnySoftKeyboard. Open source keyboard for Android.
55
---
6-
<section class="section-gradient text-white text-center py-12 md:py-16">
6+
<section class="hero-bg text-white text-center py-10 md:py-14">
77
<div class="max-w-4xl mx-auto px-4">
8-
<h1 class="text-3xl md:text-4xl font-bold text-white">Our <span class="text-purple-200">Team</span></h1>
9-
<p class="text-lg text-white/90 mt-2">The people behind AnySoftKeyboard</p>
8+
<h1 class="text-3xl md:text-4xl font-bold">Our <span class="text-purple-200">Team</span></h1>
9+
<p class="text-lg text-white/80 mt-2">The people behind AnySoftKeyboard</p>
1010
</div>
1111
</section>
1212

@@ -16,26 +16,26 @@ <h1 class="text-3xl md:text-4xl font-bold text-white">Our <span class="text-purp
1616
{% for member in site.staff_members %}
1717
{% unless member.name == "_defaults" %}
1818
<li class="staff-card">
19-
<figure class="w-32 h-32 mx-auto mb-4 rounded-full overflow-hidden shadow-lg ring-4 ring-white">
20-
<img src="{{ member.image_path }}" alt="{{ member.name }}" loading="lazy" class="w-full h-full object-cover" width="128" height="128">
19+
<figure class="w-28 h-28 mx-auto mb-4 rounded-full overflow-hidden shadow-lg ring-4 ring-white">
20+
<img src="{{ member.image_path }}" alt="{{ member.name }}" loading="lazy" class="w-full h-full object-cover" width="112" height="112">
2121
</figure>
2222
<h3 class="text-xl font-bold text-gray-900 mb-1">
2323
{% if member.link %}
24-
<a href="{{ member.link }}" target="_blank" rel="noopener noreferrer" class="hover:text-primary-700">{{ member.name }}</a>
24+
<a href="{{ member.link }}" target="_blank" rel="noopener noreferrer" class="hover:text-purple-700">{{ member.name }}</a>
2525
{% else %}
2626
{{ member.name }}
2727
{% endif %}
2828
</h3>
29-
<p class="text-gray-600 text-sm">{{ member.position }}</p>
29+
<p class="text-gray-500 text-sm">{{ member.position }}</p>
3030
</li>
3131
{% endunless %}
3232
{% endfor %}
3333
</ul>
3434

35-
<div class="mt-16 bg-purple-50 rounded-2xl p-8">
35+
<div class="mt-16 bg-gray-50 border border-gray-200 rounded-2xl p-8">
3636
<h2 class="text-2xl font-bold text-gray-900 mb-4">License</h2>
3737
<p class="text-gray-600 mb-4">AnySoftKeyboard is licensed under the Apache License, Version 2.0</p>
38-
<pre class="bg-white p-4 rounded-lg text-sm overflow-x-auto text-gray-700">Copyright 2018 Menny Even-Danan
38+
<pre class="bg-gray-900 text-gray-300 p-4 rounded-lg text-sm overflow-x-auto">Copyright 2018 Menny Even-Danan
3939

4040
Licensed under the Apache License, Version 2.0 (the "License");
4141
you may not use this file except in compliance with the License.

‎blog/index.html‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,10 +3,10 @@
33
title: Blog
44
description: News and updates from the AnySoftKeyboard team
55
---
6-
<section class="section-gradient text-white text-center py-12 md:py-16">
6+
<section class="hero-bg text-white text-center py-10 md:py-14">
77
<div class="max-w-4xl mx-auto px-4">
8-
<h1 class="text-3xl md:text-4xl font-bold text-white">Blog</h1>
9-
<p class="text-lg text-white/90 mt-2">News and updates from the team</p>
8+
<h1 class="text-3xl md:text-4xl font-bold">Blog</h1>
9+
<p class="text-lg text-white/80 mt-2">News and updates from the team</p>
1010
</div>
1111
</section>
1212

@@ -17,7 +17,7 @@ <h1 class="text-3xl md:text-4xl font-bold text-white">Blog</h1>
1717
{% for post in site.posts %}
1818
<li class="blog-post">
1919
<h2 class="text-2xl font-bold mb-2">
20-
<a href="{{ post.url | relative_url }}" class="text-gray-900 hover:text-primary-700">{{ post.title }}</a>
20+
<a href="{{ post.url | relative_url }}" class="text-gray-900 hover:text-purple-700">{{ post.title }}</a>
2121
</h2>
2222
<p class="text-gray-500 text-sm mb-4">
2323
<time datetime="{{ post.date | date_to_xmlschema }}">{{ post.date | date: "%B %-d, %Y" }}</time>
@@ -36,10 +36,10 @@ <h2 class="text-2xl font-bold mb-2">
3636
{% if paginator.total_pages > 1 %}
3737
<nav class="flex justify-center gap-4 mt-12" aria-label="Blog navigation">
3838
{% if paginator.previous_page %}
39-
<a href="{{ paginator.previous_page_path | relative_url }}" class="px-4 py-2 bg-purple-50 rounded-lg text-gray-700 hover:bg-primary-700 hover:text-white transition-colors" aria-label="Previous page">&laquo; Newer</a>
39+
<a href="{{ paginator.previous_page_path | relative_url }}" class="px-4 py-2 bg-gray-100 rounded-lg text-gray-700 hover:bg-purple-700 hover:text-white transition-colors" aria-label="Previous page">&laquo; Newer</a>
4040
{% endif %}
4141
{% if paginator.next_page %}
42-
<a href="{{ paginator.next_page_path | relative_url }}" class="px-4 py-2 bg-purple-50 rounded-lg text-gray-700 hover:bg-primary-700 hover:text-white transition-colors" aria-label="Next page">Older &raquo;</a>
42+
<a href="{{ paginator.next_page_path | relative_url }}" class="px-4 py-2 bg-gray-100 rounded-lg text-gray-700 hover:bg-purple-700 hover:text-white transition-colors" aria-label="Next page">Older &raquo;</a>
4343
{% endif %}
4444
</nav>
4545
{% endif %}

0 commit comments

Comments
 (0)