Initial commit: TechCare Hugo site
Hugo site scaffold with blog and hardware pages, layouts, styles, fonts, and image assets.
@@ -0,0 +1,3 @@
|
||||
/public/
|
||||
/resources/
|
||||
.hugo_build.lock
|
||||
@@ -0,0 +1,58 @@
|
||||
# techcare.coop
|
||||
|
||||
Static site for [Tech Care Co-op](https://techcare.coop/), a UK worker co-operative
|
||||
offering compassionate tech support. Built with [Hugo](https://gohugo.io/) and
|
||||
Markdown. No frameworks, no client-side JavaScript, no build-time dependencies
|
||||
beyond Hugo itself.
|
||||
|
||||
## Requirements
|
||||
|
||||
Hugo **extended** (image processing is used for the blog hero and article images).
|
||||
|
||||
## Build
|
||||
|
||||
```sh
|
||||
hugo --minify
|
||||
```
|
||||
|
||||
Output goes to `public/`. Deploy the contents of `public/` to any static host.
|
||||
|
||||
To preview locally:
|
||||
|
||||
```sh
|
||||
hugo server
|
||||
```
|
||||
|
||||
## Layout
|
||||
|
||||
```
|
||||
content/ Markdown pages and posts
|
||||
_index.md home page
|
||||
hardware.md hardware page
|
||||
privacy-policy.md
|
||||
blog/ blog section
|
||||
posts/ blog posts
|
||||
layouts/ HTML templates
|
||||
baseof.html document shell, nav, footer
|
||||
_partials/ head/CSS partial
|
||||
partials/image.html resolves a post's featured/thumb image through the pipeline
|
||||
assets/css/ stylesheet
|
||||
assets/img/ large source images, processed at build time
|
||||
static/ files copied verbatim (fonts, most images)
|
||||
```
|
||||
|
||||
## Notes
|
||||
|
||||
Fonts (Vollkorn, Fira Code) and all images are self-hosted, so the site makes no
|
||||
third-party requests.
|
||||
|
||||
Images in `assets/img/` are resized and converted to WebP during the build and
|
||||
served with fingerprinted filenames. Images under `static/img/` are already
|
||||
optimised and are copied as-is.
|
||||
|
||||
Post and page excerpts are stored in front matter and rendered on listing pages,
|
||||
so each excerpt is written explicitly rather than truncated automatically.
|
||||
|
||||
A post's lead image comes from its `featured` front-matter key. Setting `thumb` as
|
||||
well makes that image show on the blog listing. Both are paths relative to
|
||||
`assets/img/`.
|
||||
@@ -0,0 +1,251 @@
|
||||
@font-face{font-family:Vollkorn;font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/vollkorn.woff2) format('woff2')}
|
||||
@font-face{font-family:Vollkorn;font-style:italic;font-weight:400 900;font-display:swap;src:url(/fonts/vollkorn-italic.woff2) format('woff2')}
|
||||
@font-face{font-family:"Fira Code";font-style:normal;font-weight:300 700;font-display:swap;src:url(/fonts/firacode.woff2) format('woff2')}
|
||||
|
||||
:root{
|
||||
--base:#E2E2E2;
|
||||
--contrast:#3B3B3B;
|
||||
--ink:#191919;
|
||||
--amber:#ffb43c;
|
||||
--orange:#e68b14;
|
||||
/* live's #a65a00 is only 2.9:1 on the amber hero; this darker shade keeps the
|
||||
hue and clears AA for body-size text */
|
||||
--rust:#7a4200;
|
||||
--purple:#650DD4;
|
||||
--line:#3B3B3B33;
|
||||
--pad:clamp(1.25rem,5vw,3.125rem);
|
||||
}
|
||||
|
||||
*,*::before,*::after{box-sizing:border-box}
|
||||
html{-webkit-text-size-adjust:100%}
|
||||
body{
|
||||
margin:0;
|
||||
background:var(--base);
|
||||
color:var(--contrast);
|
||||
font-family:"Fira Code",monospace;
|
||||
font-size:clamp(1rem,1rem + ((1vw - .2rem) * .196),1.125rem);
|
||||
font-weight:300;
|
||||
line-height:1.5;
|
||||
letter-spacing:-.18px;
|
||||
}
|
||||
h1,h2,h3,h4,h5,h6{
|
||||
color:var(--ink);
|
||||
font-family:Vollkorn,serif;
|
||||
font-weight:400;
|
||||
line-height:1.125;
|
||||
letter-spacing:-.1px;
|
||||
margin:0 0 .5em;
|
||||
}
|
||||
h1{font-size:clamp(2.15rem,2.15rem + ((1vw - 3.2px) * 1.333),3rem);letter-spacing:-.96px}
|
||||
h2{font-size:clamp(1.75rem,1.75rem + ((1vw - 3.2px) * .392),2rem);letter-spacing:-.96px}
|
||||
h3{font-size:clamp(1.25rem,1.25rem + ((1vw - 3.2px) * 1.176),2rem);letter-spacing:-.64px}
|
||||
h4{font-size:1.25rem}
|
||||
p{margin:0 0 1.2em}
|
||||
p:last-child{margin-bottom:0}
|
||||
a{color:var(--purple);text-decoration-thickness:1px;text-underline-offset:.1em}
|
||||
a:hover{text-decoration-thickness:2px}
|
||||
:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
|
||||
img{max-width:100%;height:auto}
|
||||
figure{margin:0}
|
||||
code{font-family:"Fira Code",monospace}
|
||||
ul,ol{margin:0 0 1.2em;padding-left:1.4em}
|
||||
li{margin:.35em 0}
|
||||
hr{border:0;border-top:1px solid var(--line);margin:2.5rem 0}
|
||||
blockquote{margin:0 0 1.2em;padding-left:1em;border-left:3px solid var(--line)}
|
||||
|
||||
.wrap{max-width:1340px;margin-inline:auto;padding-inline:var(--pad)}
|
||||
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
|
||||
.skip{position:absolute;left:-9999px}
|
||||
.skip:focus{left:1rem;top:1rem;z-index:10;background:#fff;color:#000;padding:.75rem}
|
||||
|
||||
/* header */
|
||||
.site-head{background:#000}
|
||||
.site-head__inner{display:flex;flex-wrap:wrap;gap:1rem;align-items:center;justify-content:space-between;padding-block:1.5rem}
|
||||
.site-title{margin:0;font-size:inherit;line-height:inherit}
|
||||
.site-title a{
|
||||
color:#fff;
|
||||
font-family:Vollkorn,serif;
|
||||
font-size:clamp(1.75rem,1.75rem + ((1vw - 3.2px) * .392),2rem);
|
||||
font-weight:700;
|
||||
letter-spacing:-.5px;
|
||||
text-decoration:none;
|
||||
}
|
||||
.site-title a:hover{text-decoration:underline}
|
||||
.site-head nav ul{display:flex;gap:1.25rem;list-style:none;margin:0;padding:0}
|
||||
.site-head nav a{color:#fff;text-decoration:none}
|
||||
.site-head nav a:hover,.site-head nav a[aria-current]{text-decoration:underline}
|
||||
|
||||
/* hero */
|
||||
.hero{padding:clamp(2.5rem,6vw,5rem) var(--pad);margin-bottom:clamp(2rem,5vw,3.5rem)}
|
||||
.hero--amber{background:var(--amber);min-height:66vh;display:grid;align-content:center}
|
||||
.hero--orange{background:var(--orange);padding:clamp(3rem,7vw,7rem) var(--pad)}
|
||||
.hero--photo{
|
||||
background:var(--amber) var(--hero-sm,none) center 43%/cover no-repeat;
|
||||
color:#fff;
|
||||
min-height:30vh;
|
||||
display:grid;
|
||||
place-items:center;
|
||||
}
|
||||
.hero--photo::before{content:"";position:absolute;inset:0;background:rgba(0,0,0,.4)}
|
||||
.hero--photo{position:relative}
|
||||
.hero--photo>*{position:relative}
|
||||
.hero__title{
|
||||
color:var(--ink);
|
||||
font-family:Vollkorn,serif;
|
||||
font-size:clamp(3rem,3rem + ((1vw - 3.2px) * 4.766),6.125rem);
|
||||
font-weight:700;
|
||||
letter-spacing:-2px;
|
||||
line-height:.9;
|
||||
text-transform:uppercase;
|
||||
margin:0 0 .25em;
|
||||
}
|
||||
.hero--photo .hero__title{color:#fff}
|
||||
.hero__title--light{color:#fff}
|
||||
.hero__title mark{color:var(--rust);background:none}
|
||||
.hero__sub{
|
||||
color:var(--rust);
|
||||
font-size:clamp(1.5rem,1.5rem + ((1vw - 3.2px) * 1.565),2.5rem);
|
||||
font-style:italic;
|
||||
font-weight:200;
|
||||
line-height:.9;
|
||||
text-transform:uppercase;
|
||||
text-align:center;
|
||||
margin:0;
|
||||
}
|
||||
.hero--orange .hero__title{
|
||||
text-align:right;
|
||||
font-size:clamp(67.975px,4.248rem + ((1vw - 3.2px) * 7.846),148px);
|
||||
letter-spacing:-4px;
|
||||
line-height:.8;
|
||||
}
|
||||
|
||||
/* about */
|
||||
.about{
|
||||
display:grid;
|
||||
grid-template-columns:1fr 1fr;
|
||||
gap:clamp(1.5rem,4vw,3rem);
|
||||
align-items:center;
|
||||
margin-bottom:clamp(2.5rem,7vw,5rem);
|
||||
}
|
||||
.about__art{position:relative}
|
||||
.about__art img{width:100%}
|
||||
.about__art .flower-grid{position:absolute;bottom:-4rem;right:-3rem;width:202px;border:6px solid var(--base)}
|
||||
@media (max-width:781px){.about{grid-template-columns:1fr}.about__art .flower-grid{width:120px;bottom:-2rem;right:0}}
|
||||
|
||||
/* services + cards */
|
||||
.services{
|
||||
display:grid;
|
||||
grid-template-columns:repeat(3,1fr);
|
||||
gap:clamp(1.5rem,4vw,3rem);
|
||||
margin-bottom:clamp(2.5rem,5vw,3.5rem);
|
||||
}
|
||||
@media (max-width:781px){.services{grid-template-columns:1fr}}
|
||||
.services__img{aspect-ratio:4/3;object-fit:cover;width:100%;margin-bottom:1.5rem}
|
||||
|
||||
.cards{
|
||||
display:grid;
|
||||
grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));
|
||||
gap:clamp(1.25rem,3vw,2.5rem);
|
||||
margin-bottom:clamp(2.5rem,5vw,3.5rem);
|
||||
}
|
||||
.card{
|
||||
border:1px solid var(--line);
|
||||
border-radius:10px;
|
||||
padding:clamp(1.25rem,4vw,3.125rem);
|
||||
}
|
||||
.card h3{margin-top:0}
|
||||
.card p:last-child{margin-bottom:0}
|
||||
.cards ul{list-style:none;padding:0 0 .625rem;margin:0}
|
||||
.cards li{padding-inline-start:1.6ch;text-indent:-1.6ch;font-size:.875rem}
|
||||
.cards li::before{content:"✓\00a0";color:var(--purple)}
|
||||
|
||||
/* bordered card look, applied to pricing blocks */
|
||||
.split{
|
||||
display:grid;
|
||||
grid-template-columns:1fr 1fr;
|
||||
gap:clamp(1.5rem,4vw,3rem);
|
||||
align-items:center;
|
||||
margin-bottom:clamp(2.5rem,5vw,3.5rem);
|
||||
}
|
||||
@media (max-width:781px){.split{grid-template-columns:1fr}}
|
||||
.split__img{width:100%;aspect-ratio:4/3;object-fit:cover}
|
||||
|
||||
/* tables */
|
||||
/* live renders these spec tables with no cell borders and no header row */
|
||||
table{border-collapse:collapse;width:100%;margin:0 0 1.5em}
|
||||
table th,table td{padding:.4em .6em .4em 0;text-align:left;vertical-align:top}
|
||||
/* GFM needs a header row; live has none, so drop ours when it is empty */
|
||||
table thead:has(tr:only-child th:empty){display:none}
|
||||
|
||||
/* pill */
|
||||
.pill{
|
||||
display:inline-block;
|
||||
background:var(--purple);
|
||||
color:var(--base);
|
||||
border-radius:16px;
|
||||
font-size:1.125rem;
|
||||
padding:.2rem .6rem .25rem;
|
||||
}
|
||||
|
||||
/* qr */
|
||||
.qr{
|
||||
display:block;
|
||||
margin-inline:auto;
|
||||
max-width:100%;
|
||||
height:auto;
|
||||
border-radius:100px;
|
||||
}
|
||||
/* home crops the code into a rounded square, matching live */
|
||||
.qr--crop{width:min(425px,100%);aspect-ratio:1;object-fit:cover}
|
||||
/* hardware shows the full portrait code, matching live */
|
||||
.qr--full{width:min(459px,100%)}
|
||||
|
||||
/* posts */
|
||||
.posts{display:grid;gap:2.5rem;padding-bottom:clamp(2rem,5vw,3rem)}
|
||||
.post{border-bottom:1px solid var(--line);padding-bottom:2rem}
|
||||
.post:last-child{border-bottom:0}
|
||||
.post__date{color:var(--contrast);font-size:.875rem;margin:0 0 .35em}
|
||||
.post__title{margin:0 0 .5em}
|
||||
.post__title a{color:var(--ink);text-decoration:none}
|
||||
.post__title a:hover{text-decoration:underline}
|
||||
/* listing thumbnail; only the makeover post has one, matching live */
|
||||
.post__thumb{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:8px;margin:0 0 1em}
|
||||
.post__excerpt{margin:0 0 .5em}
|
||||
.post__more{display:inline-block}
|
||||
.entry{max-width:52rem;margin-inline:auto;padding-bottom:2rem}
|
||||
.entry__title{margin:0 0 .75em}
|
||||
.entry img{border-radius:8px;margin-bottom:1.5em}
|
||||
/* post sections are h2/apps h3 for a clean outline; sizes match live's
|
||||
48px section / 38px app scale rather than the shared 32px defaults */
|
||||
.entry h2{font-size:clamp(2.15rem,2.15rem + ((1vw - 3.2px) * 1.333),3rem);letter-spacing:-.96px;margin-top:2em}
|
||||
.entry h3{font-size:clamp(1.75rem,1.75rem + ((1vw - 3.2px) * .622),2.375rem);letter-spacing:-.96px;margin-top:1.6em}
|
||||
/* the makeover featured image is full-width at 3/2, matching live */
|
||||
.post__figure{width:100%;aspect-ratio:3/2;object-fit:cover}
|
||||
.app-icon{width:120px;height:auto;margin:0 0 .5em}
|
||||
.post-hero{width:223px;max-width:100%;height:auto}
|
||||
.entry-img{width:383px;max-width:100%;height:auto}
|
||||
|
||||
/* footer */
|
||||
.site-foot{background:var(--ink);color:var(--base);margin-top:clamp(2rem,5vw,3.5rem)}
|
||||
.site-foot .wrap{padding-block:1.5rem;text-align:center}
|
||||
.social{display:flex;gap:1rem;justify-content:center;list-style:none;margin:0 0 .5rem;padding:0}
|
||||
.social a{
|
||||
display:flex;
|
||||
padding:.4rem;
|
||||
border-radius:9999px;
|
||||
background:#f0f0f0;
|
||||
color:#444;
|
||||
}
|
||||
.social a:hover{transform:scale(1.1)}
|
||||
.social svg{fill:currentColor;height:1.25em;width:1.25em}
|
||||
.foot-note{margin:0;font-size:.875rem}
|
||||
.site-foot a{color:var(--base)}
|
||||
|
||||
@media (prefers-reduced-motion:no-preference){
|
||||
html{scroll-behavior:smooth}
|
||||
.social a{transition:transform .1s ease}
|
||||
}
|
||||
|
||||
@media (min-width:801px){
|
||||
.hero--photo{background-image:var(--hero-lg,none)}
|
||||
}
|
||||
|
After Width: | Height: | Size: 11 MiB |
|
After Width: | Height: | Size: 40 KiB |
|
After Width: | Height: | Size: 2.2 MiB |
@@ -0,0 +1,145 @@
|
||||
---
|
||||
title: "Tech Care Co-op"
|
||||
description: "Compassionate tech care for social good"
|
||||
---
|
||||
|
||||
<div class="hero hero--amber">
|
||||
<p class="hero__title"><mark>✴︎</mark> Compassionate Tech Care for Social Good</p>
|
||||
<p class="hero__sub">Let us help you get stuff done</p>
|
||||
</div>
|
||||
|
||||
<div class="about">
|
||||
<div class="about__art">
|
||||
<img src="/img/hibiscus.jpg" width="1079" height="783" alt="Photography close up of a red flower.">
|
||||
<img class="flower-grid" src="/img/flower-grid.webp" width="794" height="1125" alt="Black and white photography close up of a flower.">
|
||||
</div>
|
||||
<div>
|
||||
|
||||
## About Us
|
||||
|
||||
**Tech Care Co-op** exists to support good people to do great things.
|
||||
|
||||
We want to help you with compassionate and caring tech support.
|
||||
|
||||
No more feeling alone, no more getting stuck. We’ll be there for you.
|
||||
|
||||
We will strive to use simple language wherever possible and empower you to help yourself.
|
||||
|
||||
We will always advocate for technical solutions that protect your privacy and human rights.
|
||||
|
||||
We have a strong preference for using [open source commons software](https://en.wikipedia.org/wiki/Open-source_software) and encryption wherever possible.
|
||||
|
||||
We are a UK based [worker owned co-operative](https://en.wikipedia.org/wiki/Worker_cooperative). We all get paid the same and we make decisions democratically. No CEOs, no bosses, no capitalist investors. We pay our taxes.
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
## Our services
|
||||
|
||||
<div class="services">
|
||||
|
||||
### Software
|
||||
|
||||
<img class="services__img" src="/img/campanula.webp" width="577" height="577" alt="Image for service" loading="lazy">
|
||||
|
||||
- Linux
|
||||
- Android
|
||||
- MacOS
|
||||
- Windows
|
||||
- iOS
|
||||
- WordPress
|
||||
|
||||
</div>
|
||||
|
||||
<div class="services">
|
||||
|
||||
### Hardware
|
||||
|
||||
<img class="services__img" src="/img/delphinium.webp" width="577" height="577" alt="Image for service" loading="lazy">
|
||||
|
||||
We sell [Linux computers and Graphene OS phones](/hardware/), pre-configured and shipped to your door.
|
||||
|
||||
Advice regarding hardware, ergonomics, repair and re-use.
|
||||
|
||||
</div>
|
||||
|
||||
<div class="services">
|
||||
|
||||
### Visioning
|
||||
|
||||
<img class="services__img" src="/img/thistle.webp" width="577" height="577" alt="Image for service" loading="lazy">
|
||||
|
||||
We can support you to make the smartest choices about technology.
|
||||
|
||||
From choosing the best app for a specific task to optimising complex workflows.
|
||||
|
||||
</div>
|
||||
|
||||
## Pricing For Individuals
|
||||
|
||||
Cancel or pause anytime. Payment currently via bank transfer or standing order in GBP, EUR or USD.
|
||||
|
||||
<div class="cards">
|
||||
<div class="card">
|
||||
|
||||
### Pay as you go
|
||||
|
||||
- Compassionate and responsive tech support via instant message and scheduled call.
|
||||
- We are available Mondays and Fridays 11:00-18:00 (UK).
|
||||
|
||||
**£1 per minute, £60 per hour**
|
||||
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
|
||||
### Monthly retainer
|
||||
|
||||
- Up to one hour per month of tech support via instant message and scheduled call for ongoing peace of mine.
|
||||
- Additional time charged at pay as you go rate.
|
||||
- £50 per month.
|
||||
|
||||
**£50 per month**
|
||||
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
|
||||
### Yearly retainer
|
||||
|
||||
- Up to one hour per month of tech support via instant message and scheduled call for long term support.
|
||||
- Additional time charged at pay as you go rate.
|
||||
|
||||
**£600 per year**
|
||||
|
||||
</div>
|
||||
|
||||
## Pricing For Organisations
|
||||
|
||||
Organisations often have complex needs and we may need to charge higher rates and charge upfront as a retainer.
|
||||
|
||||
Contact us for a bespoke quote.
|
||||
|
||||
## Eligibility
|
||||
|
||||
We are looking to support individuals and organisations from
|
||||
|
||||
- Movements for liberation
|
||||
- Co-operative sector
|
||||
- Trade unions
|
||||
- Community organising
|
||||
- Public Sector
|
||||
- Third Sector/NGO
|
||||
- Arts Sector
|
||||
|
||||
*\*Public sector excludes Police, Military and certain other fields. If in doubt, just ask.*
|
||||
|
||||
## Contact us
|
||||
|
||||
You can email us: `support at techcare dot coop`
|
||||
|
||||
You can also reach us using [Signal Messenger](https://signal.org/) which can be installed as an [Android or iOS app](https://signal.org/download).
|
||||
|
||||
To start a chat with us either [tap this link](https://signal.me/#eu/HHCMQ620MXZP_fr8ts1LumyAD3ESQSD6lXvqrcze-AqjZseqPMpHZ5mhn8OjUKRX) or scan the QR code below.
|
||||
|
||||
<img class="qr qr--crop" src="/img/signal-qr.png" width="425" height="425" alt="">
|
||||
@@ -0,0 +1,4 @@
|
||||
---
|
||||
title: "Blog"
|
||||
description: "Posts from Tech Care Co-op"
|
||||
---
|
||||
@@ -0,0 +1,87 @@
|
||||
---
|
||||
title: "Hardware"
|
||||
description: "Privacy in your hands — Linux laptops and Graphene OS phones, pre-configured and shipped to your door"
|
||||
---
|
||||
|
||||
<div class="hero hero--orange">
|
||||
<p class="hero__title">Privacy</p>
|
||||
<p class="hero__title hero__title--light">In Your Hands</p>
|
||||
</div>
|
||||
|
||||
## Pricing
|
||||
|
||||
<div class="split">
|
||||
<div class="split__body">
|
||||
|
||||
Our prices are derived from three factors:
|
||||
|
||||
- Cost of hardware
|
||||
- Cost of shipping
|
||||
- Cost of setup labour
|
||||
|
||||
<p class="pill">Labour: £60 per hour</p>
|
||||
|
||||
Exact pricing on request.
|
||||
|
||||
</div>
|
||||
|
||||
<img class="split__img" src="/img/hardware.webp" width="1058" height="624" alt="Smartphones capturing a scenic wildflower meadow with trees" loading="lazy">
|
||||
</div>
|
||||
|
||||
## Our approach
|
||||
|
||||
We are committed to a pragmatic approach to hardware and software. Our solution are designed to be usable without advanced computer skills.
|
||||
|
||||
Our laptops and phones are designed to provide the best compromise between privacy, security and accessibility.
|
||||
|
||||
Our hardware is second hand. This allows to offer hardware that is affordable and sustainable.
|
||||
|
||||
Different grades of hardware are available from as new condition to devices with minor cosmetic wear and tear. This will naturally affect the price.
|
||||
|
||||
Our offering is that we will procure and configure software to your needs, ship it to you and then can provide [compassionate paid support](/) over the lifetime of the hardware.
|
||||
|
||||
## Laptop – Thinkpad T480s
|
||||
|
||||
| | |
|
||||
| --- | --- |
|
||||
| Operating System | [Bluefin Linux](https://projectbluefin.io/) (or another Linux distro of your choice) |
|
||||
| Display | 14 inches |
|
||||
| Processor | i5 or i7 |
|
||||
| RAM | 16GB or 24GB |
|
||||
| Storage | 1TB or 2TB |
|
||||
| Charging | USB C |
|
||||
|
||||
Read more about the hardware in the [Official Manual](https://download.lenovo.com/pccbbs/mobiles_pdf/t480s_ug_en.pdf).
|
||||
|
||||
[Thinkpad T-series Wikipedia page](https://en.wikipedia.org/wiki/ThinkPad_T_series)
|
||||
|
||||
[Bluefin Documentation](https://docs.projectbluefin.io/)
|
||||
|
||||
## Phone – Pixel 8A
|
||||
|
||||
| | |
|
||||
| --- | --- |
|
||||
| Operating System | [Graphene OS](https://grapheneos.org/) |
|
||||
| Display | 6.1 inches |
|
||||
| Storage | 128GB or 256GB |
|
||||
| Charging | USB C |
|
||||
|
||||
The Pixel 8a de-Googled or with [sandboxed Google services](https://grapheneos.org/usage#sandboxed-google-play).
|
||||
|
||||
The Pixel 8a is supported with firmware and software updates until [1st May 2031](https://endoflife.date/pixel).
|
||||
|
||||
[Graphene OS FAQ](https://grapheneos.org/faq)
|
||||
|
||||
[Graphene OS Usage guide](https://grapheneos.org/usage#sandboxed-google-play)
|
||||
|
||||
[Wikipedia page](https://en.wikipedia.org/wiki/Pixel_8a)
|
||||
|
||||
## Ordering
|
||||
|
||||
You can email us: `support at techcare dot coop`
|
||||
|
||||
You can also reach us using [Signal Messenger](https://signal.org/) which can be installed as an [Android or iOS app](https://signal.org/download).
|
||||
|
||||
To start a chat with us either [tap this link](https://signal.me/#eu/HHCMQ620MXZP_fr8ts1LumyAD3ESQSD6lXvqrcze-AqjZseqPMpHZ5mhn8OjUKRX) or scan the QR code below.
|
||||
|
||||
<img class="qr qr--full" src="/img/signal-qr.png" width="459" height="623" alt="">
|
||||
@@ -0,0 +1,7 @@
|
||||
---
|
||||
title: "Posts"
|
||||
build:
|
||||
list: never
|
||||
render: never
|
||||
publishResources: false
|
||||
---
|
||||
@@ -0,0 +1,207 @@
|
||||
---
|
||||
title: "Our favourite Android apps 2026"
|
||||
description: "Apps we tend to pre-install for our clients on Graphene OS"
|
||||
date: 2026-08-31T15:53:47Z
|
||||
featured: "img/graphene-os-homescreen.png"
|
||||
featuredAlt: "Graphene OS homescreen"
|
||||
featuredClass: "post-hero"
|
||||
excerpt: "We have begun to sell phones running Graphene OS which is a security focussed version of Android. By default, it’s very minimal and doesn’t come with many apps pre-installed. So here are some of our favourite Android apps that we tend to pre-install for our clients (if they want us to). Application management F-Droid Simply…"
|
||||
---
|
||||
|
||||
We have begun to sell phones running Graphene OS which is a security focussed version of Android.
|
||||
|
||||
By default, it’s very minimal and doesn’t come with many apps pre-installed. So here are some of our favourite Android apps that we tend to pre-install for our clients (if they want us to).
|
||||
|
||||
## Application management
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon-4.png" alt="" width="144" height="144" loading="lazy" decoding="async">
|
||||
|
||||
### F-Droid
|
||||
|
||||
Simply the coolest. This is THE open source app store that Google and the other privacy haters don’t want you to install.
|
||||
|
||||
Everything in the F-Droid store is judiciously examined for any privacy disrespecting code. The app selection is fantastic, and all the apps take up so little space on your device due to the lack of bloat and tracking crap.
|
||||
|
||||
It’s the first place you want to look to find an app to solve a specific problem.
|
||||
|
||||
All the links will point to the F-Droid page for the app, where you can find more info about them and links to their official sites.
|
||||
|
||||
<https://f-droid.org/en>
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon.png" alt="" width="192" height="192" loading="lazy" decoding="async">
|
||||
|
||||
### Aurora Store
|
||||
|
||||
If you do need to grab some apps from the Google Play store, and you opt for a de-Googled Android phone, you can do so via the Aurora store. Uses an anonymous account or you can log in with an existing Google account.
|
||||
|
||||
Note that some apps won’t work as intended without Google services installed but many such as WhatsApp, Trainline and some banking apps work well enough.
|
||||
|
||||
<https://f-droid.org/en/packages/com.aurora.store>
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon-9.png" alt="" width="512" height="512" loading="lazy" decoding="async">
|
||||
|
||||
### Shelter
|
||||
|
||||
Rad app which allows you to enable a “work profile”, which is a Android feature for business users.
|
||||
|
||||
Shelter creates a work profile space that useful to isolate some non open source apps or run two copies of the same app on your phone.
|
||||
|
||||
Can be turned on and off with a quick settings button.
|
||||
|
||||
<https://f-droid.org/en/packages/net.typeblog.shelter>
|
||||
|
||||
## Media
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon-2.png" alt="" width="512" height="512" loading="lazy" decoding="async">
|
||||
|
||||
### AntennaPod
|
||||
|
||||
Our favourite podcast app. Does everything you need.
|
||||
|
||||
Fun fact; it accepts any RSS feed, so you could pull in a few blog posts or news-feeds in a pinch.
|
||||
|
||||
<https://f-droid.org/en/packages/de.danoeh.antennapod>
|
||||
|
||||
### Vinyl
|
||||
|
||||
Simple and pretty music player. Gets the job done.
|
||||
|
||||
<https://f-droid.org/en/packages/com.poupa.vinylmusicplayer>
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon-3.png" alt="" width="192" height="192" loading="lazy" decoding="async">
|
||||
|
||||
### New Pipe/Tubular
|
||||
|
||||
NewPipe is an incredible YouTube app. It blocks ads and you can do many YouTube things without even having an account such as subscriptions, playlists and playing in the background.
|
||||
|
||||
Tubular is a fork that adds Sponsor Block which skips different types of in video advertising on YouTube. Some people argue that it takes away income from creators. The verdict is out on that one (they need a union).
|
||||
|
||||
<https://f-droid.org/en/packages/org.schabi.newpipe>
|
||||
|
||||
<https://f-droid.org/en/packages/org.polymorphicshade.tubular>
|
||||
|
||||
## Utilities
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon-5.png" alt="" width="512" height="512" loading="lazy" decoding="async">
|
||||
|
||||
### Breezy Weather
|
||||
|
||||
Beautiful weather app. This was the only weather app we could find in F-Droid that had an option for a notification when it was about to rain. So well designed.
|
||||
|
||||
It even has a live wallpaper based on the current weather. Sadly ours is mostly grey clouds.
|
||||
|
||||
<https://f-droid.org/en/packages/org.breezyweather>
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon-1.png" alt="" width="512" height="512" loading="lazy" decoding="async">
|
||||
|
||||
### Etar
|
||||
|
||||
Effective calendar app that can handle everything you throw at it.
|
||||
|
||||
<https://f-droid.org/en/packages/ws.xsoh.etar>
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon-6.png" alt="" width="512" height="512" loading="lazy" decoding="async">
|
||||
|
||||
### DAVx5
|
||||
|
||||
This app allows you to sync your calendars and contacts using CalDAV which most calendar services support (e.g. Nextcloud, Google etc).
|
||||
|
||||
<https://f-droid.org/packages/at.bitfire.davdroid>
|
||||
|
||||
<img class="app-icon" src="/img/apps/kdeconnect.png" alt="" width="512" height="512" loading="lazy" decoding="async">
|
||||
|
||||
### KDE Connect
|
||||
|
||||
If you run Linux on your other computers, this app is amazing.
|
||||
|
||||
You can do stuff like share links and files between your desktop and phone, control your desktop from your phone and pause your video on desktop when you get a call.
|
||||
|
||||
Note that you need to be on the same network for this to work. There’s pairing and a few settings to tweak to get started.
|
||||
|
||||
<https://f-droid.org/en/packages/org.kde.kdeconnect_tp>
|
||||
|
||||
<img class="app-icon" src="/img/apps/foss-wallet.png" alt="" width="512" height="512" loading="lazy" decoding="async">
|
||||
|
||||
### Foss Wallet
|
||||
|
||||
A cool app that allows you to download and use .pkpass files which are a format for tickets and passes that Apple uses and a lot of popular ticket sites offer. Much better than a PDF.
|
||||
|
||||
<https://f-droid.org/en/packages/nz.eloque.foss_wallet>
|
||||
|
||||
## Security
|
||||
|
||||
<img class="app-icon" src="/img/apps/signal-logo.svg" alt="" width="1024" height="1024" loading="lazy" decoding="async">
|
||||
|
||||
### Signal/Molly
|
||||
|
||||
Signal is still the gold standard end to end encrypted messenger and one of the most popular open source apps out there. It is close to the perfect balance between security and usability.
|
||||
|
||||
Molly is a soft fork of Signal. This means it shares the majority of the same features with a few privacy focussed tweaks. You can install it alongside Signal for a second account and it has some additional privacy features.
|
||||
|
||||
<https://signal.org>
|
||||
|
||||
<https://molly.im>
|
||||
|
||||
“Secret” link to download Signal as a self updating APK for de-Googled devices: <https://signal.org/android/apk/>
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon-8.png" alt="" width="512" height="512" loading="lazy" decoding="async">
|
||||
|
||||
### Private Lock
|
||||
|
||||
This is an app that will lock your phone when it detects lots of movement in the phone’s internal gyroscope. This defends against someone snatching your unlocked phone from your hand.
|
||||
|
||||
It requires a bit of tweaking to set the threshold correctly. It can also be used as a alternate way to lock your phone, just don’t throw your phone across the room by mistake.
|
||||
|
||||
<https://f-droid.org/en/packages/com.wesaphzt.privatelock>
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon-10.png" alt="" width="144" height="144" loading="lazy" decoding="async">
|
||||
|
||||
### Oblivion
|
||||
|
||||
Simple app that will wipe your phone remotely if it spots a special long code in your phone notifications. Could be really useful if your phone is lost or stolen.
|
||||
|
||||
There is another app called [FMD](https://f-droid.org/en/packages/de.nulide.findmydevice/) (as in “Find My Device”) which has a lot more features (e.g. replying with phone location), but it’s much more complicated to setup.
|
||||
|
||||
<https://f-droid.org/en/packages/net.oblivion.wipe>
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon-7.png" alt="" width="512" height="512" loading="lazy" decoding="async">
|
||||
|
||||
### KeePassDx
|
||||
|
||||
Offline first password manager. Database file is compatible with other KeePass apps such as KeepasXC on desktop.
|
||||
|
||||
Can be synced with other apps such as Nextcloud, Syncthing etc.
|
||||
|
||||
<https://f-droid.org/en/packages/com.kunzisoft.keepass.libre>
|
||||
|
||||
## Paid Services
|
||||
|
||||
<img class="app-icon" src="/img/apps/icon-11.png" alt="" width="512" height="512" loading="lazy" decoding="async">
|
||||
|
||||
### Ente Photos
|
||||
|
||||
Ente are a cool open source company based mostly in India. They offer an end to end encrypted photo backup and storage service that is very reasonably priced and has loads of useful features such as on device machine learning image detection, family plans and no vendor lock in.
|
||||
|
||||
<https://ente.io>
|
||||
|
||||
<https://f-droid.org/en/packages/io.ente.photos.fdroid>
|
||||
|
||||
<img class="app-icon" src="/img/apps/ente-auth.png" alt="" width="512" height="512" loading="lazy" decoding="async">
|
||||
|
||||
### Ente Auth
|
||||
|
||||
Ente also offer a decent two factor authentication app that can be easily synced across devices if you have an Ente account.
|
||||
|
||||
<https://f-droid.org/en/packages/io.ente.auth>
|
||||
|
||||
<img class="app-icon" src="/img/apps/bitwarden.png" alt="" width="1024" height="1024" loading="lazy" decoding="async">
|
||||
|
||||
### Bitwarden
|
||||
|
||||
Leading open source password manager service that syncs across your devices. Works really well even for non-techies. Not available on F-Droid.
|
||||
|
||||
Can be used with the self hosted Vaultwarden back-end to avoid vendor lock in.
|
||||
|
||||
<https://bitwarden.com>
|
||||
|
||||
*Hope that was helpful, as always you can [hire us to help you](/).*
|
||||
@@ -0,0 +1,98 @@
|
||||
---
|
||||
title: "Tech Care makeover on a budget #1"
|
||||
description: "A hypothetical client makeover, showing how £750 buys privacy-respecting, sustainably sourced tech"
|
||||
date: 2025-10-25T17:06:57Z
|
||||
thumb: "img/makeover.png"
|
||||
featured: "img/makeover.png"
|
||||
featuredAlt: "Screenshot of the Bluefin Linux desktop running GNOME 3."
|
||||
excerpt: "As we establish our co-op, we bring with us our philosophy of technology. Our approach is based upon principles of privacy and sustainability. The best way to show off our style in the early days of our co-op is to generate a hypothetical scenario (based on upon experiences with clients). In the future, we’ll hopefully…"
|
||||
---
|
||||
|
||||
As we establish our co-op, we bring with us our philosophy of technology. Our approach is based upon principles of privacy and sustainability.
|
||||
|
||||
The best way to show off our style in the early days of our co-op is to generate a hypothetical scenario (based on upon experiences with clients).
|
||||
|
||||
In the future, we’ll hopefully have permission to illustrate actual client makeovers so we can take some nice photos of their setups. Early days!
|
||||
|
||||
## Hypothetical client
|
||||
|
||||
Jamie, 57 is a unionised postie for Royal Mail who hates how our lives have become dominated by U.S. tech corporations.
|
||||
|
||||
They own an ancient Android phone that isn’t supported with security updates any more (and has a slightly cracked screen) which they mostly use to stay in touch with friends and family via [Signal messenger](https://signal.org/).
|
||||
|
||||
They also have an old slow Windows 10 (also no longer supported) laptop with a terrible keyboard and a dead battery that they use around the house for surfing the web, writing emails and internet. Jamie dreads taking the laptop to union meetings because it weighs a ton and shuts down if the power cable is accidentally unplugged.
|
||||
|
||||
Jamie also has a huge TV running Android that has a bunch of crapware and annoying ads on it. YouTube videos play with ads every few minutes and there isn’t an app for ITVX installed, which is where some international football matches are streamed. Jamie finds typing into search bars using their TV remote incredibly frustrating.
|
||||
|
||||
Jamie has saved up some money to overhaul their tech but doesn’t know where to start so reaches out to Tech Care Co-op for help and we communicated via Signal voice message to discover what Jamie’s needs were.
|
||||
|
||||
## Laptop
|
||||
|
||||
We recommend using second hand business grade laptops. They tend to be cheap, robust and easy to repair.
|
||||
|
||||
Generally our preferred brand is [Lenovo Thinkpad](https://en.wikipedia.org/wiki/ThinkPad). They can be expensive when new but rapidly drop into the sub £400 price range after new models are released and circulated into corporate usage.
|
||||
|
||||
With a laptop, it’s best to go light and small. As soon as you have to carry it via backup, you will regret getting that chunky laptop. For Jamie, we would chose a Thinkpad X1 Carbon.
|
||||
|
||||
<img class="entry-img" src="/img/thinkpad.png" alt="Lenovo ThinkPad X1 Ultrabook" width="800" height="641" loading="lazy">
|
||||
|
||||
Our preferred Operating System is [Linux](https://en.wikipedia.org/wiki/Linux) which is open source meaning it can be audited to make sure it doesn’t have any components that are harmful to our privacy. It can be installed on a wide range of hardware and often costs nothing to buy (though many open source projects invite donations).
|
||||
|
||||
Though we are happy to support any variety of Linux, we are currently enjoying [Project Bluefin](https://projectbluefin.io/) (based upon [Fedora](https://fedoraproject.org/)) as it self updating and easy to maintain.
|
||||
|
||||
We take care of sourcing the laptop for you, installing Bluefin and the applications that meet your needs and migrating your old data.
|
||||
|
||||
**Budget: £400**
|
||||
|
||||
£280 on a refurbished Thinkpad X1 Carbon
|
||||
|
||||
£120 – two hours labour
|
||||
|
||||
## Mobile phone
|
||||
|
||||
Our preferred mobile operating system is [Graphene OS](https://grapheneos.org/) which is an Android based alterative.
|
||||
|
||||
What we like about Graphene OS is that it has a ton of great privacy features that work behind the scenes to keep you safe but works just as well as normal Android.
|
||||
|
||||
For example, although Graphene OS doesn’t come with the Google Play Store (perfect for avoiding big tech), it is easily installed with one click. We also recommend the [F-Droid app store](https://f-droid.org/) for the best privacy preserving apps.
|
||||
|
||||
<img class="entry-img" src="/img/pixel.png" alt="Pixel 8 and Pixel 8 Pro smartphones." width="800" height="847" loading="lazy">
|
||||
|
||||
Graphene OS at time of writing is only available for the Pixel smartphones. The newest Pixels at time of writing are supported for security updates for 5 years which is great for a phone.
|
||||
|
||||
We would take care of sourcing a device for you and install Graphene OS.
|
||||
|
||||
**Budget: £300**
|
||||
|
||||
£240 on a refurbished Pixel 8
|
||||
|
||||
£60 – one hour labour
|
||||
|
||||
## TV
|
||||
|
||||
We love to re-use old hardware. It’s exponentially more sustainable that buying new electronics. We also hate invasive ads and tracking.
|
||||
|
||||
We recommend replacing the hard drive in old computers with a new [Solid State Drive (SSD)](https://en.wikipedia.org/wiki/Solid-state_drive), which in this case, we also would install Bluefin Linux onto.
|
||||
|
||||
We would then stash the old laptop behind Jamie’s large TV in their lounge, connected to the TV via HMDI.
|
||||
|
||||
We would then install the [KDEconnect](https://kdeconnect.kde.org/) app on Jamie’s phone to easily control the old laptop using it’s virtual touchpad, keyboard and media controls over WiFi.
|
||||
|
||||
We also added the [uBlockOrigin](https://ublockorigin.com/) extension to [Firefox web browser](https://www.firefox.com/en-GB/) on the laptop to block YouTube ads. Jamie can now watch iPlayer, ITV and YouTube on their TV without interferences.
|
||||
|
||||
**Budget: £40**
|
||||
|
||||
- £30 – 30 mins labour
|
||||
- <strong>£</strong>10 HMDI cable
|
||||
|
||||
## Summary
|
||||
|
||||
**Total budget: £750**
|
||||
|
||||
Our hypothetical client, Jamie is now living the hi-tech life. All their devices are fast, user friendly and sustainably sourced.
|
||||
|
||||
They are protected from tracking, ads and have a setup that will last at least five years for less than the cost of an decent new laptop.
|
||||
|
||||
Jamie is also able to ask for extra support from us as and when they need it if they get stuck with anything. The entire project cost less than a brand new laptop or phone.
|
||||
|
||||
*Has this blog post peaked your interest? Contact us via the details [on our homepage.](/)*
|
||||
@@ -0,0 +1,20 @@
|
||||
---
|
||||
title: "Privacy Policy"
|
||||
description: "How we handle your data"
|
||||
---
|
||||
|
||||
## Who we are
|
||||
|
||||
We are a UK based worker co-operative. We have yet to officially register our company. Stay tuned for more info.
|
||||
|
||||
## Cookies and tracking
|
||||
|
||||
We do not use any cookies on this site or track you in any way beyond the standard web server logging.
|
||||
|
||||
If you want to visit this website anonymously, please check out the [Tor Project.](https://www.torproject.org/)
|
||||
|
||||
## Hosting
|
||||
|
||||
Our website and other internal infrastructure is hosted by [Autonomic Co-operative](https://autonomic.zone/). Please see their [privacy policy](https://autonomic.zone/gdpr/) for more details.
|
||||
|
||||
Our email is hosted by [Web Architects co-operative](https://www.webarchitects.coop/). Their privacy policy is [here](https://www.webarchitects.coop/privacy).
|
||||
@@ -0,0 +1,35 @@
|
||||
baseURL = "https://techcare.coop/"
|
||||
locale = "en-GB"
|
||||
title = "Tech Care Co-op"
|
||||
enableRobotsTXT = true
|
||||
disableKinds = ["taxonomy", "term", "RSS", "sitemap", "404"]
|
||||
|
||||
[markup]
|
||||
[markup.goldmark.renderer]
|
||||
unsafe = true
|
||||
[markup.tableOfContents]
|
||||
startLevel = 2
|
||||
endLevel = 3
|
||||
|
||||
[params]
|
||||
description = "Compassionate tech care for social good"
|
||||
email = "support at techcare dot coop"
|
||||
signal = "https://signal.me/#eu/HHCMQ620MXZP_fr8ts1LumyAD3ESQSD6lXvqrcze-AqjZseqPMpHZ5mhn8OjUKRX"
|
||||
|
||||
[[menu.main]]
|
||||
name = "Home"
|
||||
url = "/"
|
||||
weight = 1
|
||||
[[menu.main]]
|
||||
name = "Hardware"
|
||||
url = "/hardware/"
|
||||
weight = 2
|
||||
[[menu.main]]
|
||||
name = "Blog"
|
||||
url = "/blog/"
|
||||
weight = 3
|
||||
|
||||
[outputs]
|
||||
home = ["HTML"]
|
||||
section = ["HTML"]
|
||||
page = ["HTML"]
|
||||
@@ -0,0 +1,7 @@
|
||||
{{- $css := resources.Get "css/style.css" -}}
|
||||
{{- if hugo.IsProduction -}}
|
||||
{{- $css = $css | minify | fingerprint -}}
|
||||
<link rel="stylesheet" href="{{ $css.RelPermalink }}" integrity="{{ $css.Data.Integrity }}">
|
||||
{{- else -}}
|
||||
<link rel="stylesheet" href="{{ $css.RelPermalink }}">
|
||||
{{- end }}
|
||||
@@ -0,0 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en-GB">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="robots" content="max-image-preview:large">
|
||||
<link rel="icon" href="/img/tech-care-logo.png" sizes="192x192">
|
||||
<link rel="apple-touch-icon" href="/img/tech-care-logo.png">
|
||||
<title>{{ if .IsHome }}{{ site.Title }} – {{ site.Params.description }}{{ else }}{{ .Title }} – {{ site.Title }}{{ end }}</title>
|
||||
{{ with .Description | default site.Params.description }}<meta name="description" content="{{ . }}">{{ end }}
|
||||
{{ partial "head-css.html" . }}
|
||||
</head>
|
||||
<body>
|
||||
<a class="skip" href="#main">Skip to content</a>
|
||||
|
||||
<header class="site-head">
|
||||
<div class="wrap site-head__inner">
|
||||
{{/* On post pages the article title is the h1; elsewhere, as on the live site,
|
||||
the site title is. */}}
|
||||
{{ $isPost := and .IsPage (eq .Section "posts") }}
|
||||
{{ if $isPost }}<p class="site-title"><a href="/">{{ site.Title }}</a></p>{{ else }}<h1 class="site-title"><a href="/">{{ site.Title }}</a></h1>{{ end }}
|
||||
<nav aria-label="Navigation">
|
||||
<ul>
|
||||
{{ $cur := . }}
|
||||
{{ range site.Menus.main }}
|
||||
<li><a href="{{ .URL }}"{{ if eq .URL $cur.RelPermalink }} aria-current="page"{{ end }}>{{ .Name }}</a></li>
|
||||
{{ end }}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main id="main" class="wrap">
|
||||
{{ block "main" . }}{{ end }}
|
||||
</main>
|
||||
|
||||
<footer class="site-foot">
|
||||
<div class="wrap">
|
||||
<ul class="social">
|
||||
<li><a href="https://social.coop/@techcare"><svg width="24" height="24" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M23.193 7.879c0-5.206-3.411-6.732-3.411-6.732C18.062.357 15.108.025 12.041 0h-.076c-3.068.025-6.02.357-7.74 1.147 0 0-3.411 1.526-3.411 6.732 0 1.192-.023 2.618.015 4.129.124 5.092.934 10.109 5.641 11.355 2.17.574 4.034.695 5.535.612 2.722-.15 4.25-.972 4.25-.972l-.09-1.975s-1.945.613-4.129.539c-2.165-.074-4.449-.233-4.799-2.891a5.499 5.499 0 0 1-.048-.745s2.125.52 4.817.643c1.646.075 3.19-.097 4.758-.283 3.007-.359 5.625-2.212 5.954-3.905.517-2.665.475-6.507.475-6.507zm-4.024 6.709h-2.497V8.469c0-1.29-.543-1.944-1.628-1.944-1.2 0-1.802.776-1.802 2.312v3.349h-2.483v-3.35c0-1.536-.602-2.312-1.802-2.312-1.085 0-1.628.655-1.628 1.944v6.119H4.832V8.284c0-1.289.328-2.313.987-3.07.68-.758 1.569-1.146 2.674-1.146 1.278 0 2.246.491 2.886 1.474L12 6.585l.622-1.043c.64-.983 1.608-1.474 2.886-1.474 1.104 0 1.994.388 2.674 1.146.658.757.986 1.781.986 3.07v6.304z"/></svg><span class="vh">Mastodon</span></a></li>
|
||||
<li><a href="https://techcare.coop/feed"><svg width="24" height="24" viewBox="0 0 24 24" aria-hidden="true" focusable="false"><path d="M2,8.667V12c5.515,0,10,4.485,10,10h3.333C15.333,14.637,9.363,8.667,2,8.667z M2,2v3.333 c9.19,0,16.667,7.477,16.667,16.667H22C22,10.955,13.045,2,2,2z M4.5,17C3.118,17,2,18.12,2,19.5S3.118,22,4.5,22S7,20.88,7,19.5 S5.882,17,4.5,17z"/></svg><span class="vh">https://techcare.coop/feed</span></a></li>
|
||||
</ul>
|
||||
<p class="foot-note">| <a href="/privacy-policy/">Privacy</a></p>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,25 @@
|
||||
{{ define "main" }}
|
||||
{{/* the live cover photo is a 3000x1500 JPEG served by pd.w.org; serve a
|
||||
resized WebP from assets instead. Position matches the live 42% 43%. */}}
|
||||
{{ $hero := resources.Get "img/blog-hero.jpg" }}
|
||||
{{ with $hero }}
|
||||
{{ $sm := .Resize "800x q80 webp" }}
|
||||
{{ $md := .Resize "1600x q80 webp" }}
|
||||
<div class="hero hero--photo" style="--hero-sm:url('{{ $sm.RelPermalink }}');--hero-lg:url('{{ $md.RelPermalink }}')">
|
||||
<p class="hero__title">Blog</p>
|
||||
</div>
|
||||
{{ end }}
|
||||
|
||||
<div class="posts">
|
||||
{{ range where site.RegularPages "Section" "posts" }}
|
||||
{{ $post := . }}
|
||||
<article class="post">
|
||||
<time class="post__date" datetime="{{ .Date.Format "2006-01-02T15:04:05Z07:00" }}">{{ .Date.Format "January 2, 2006" }}</time>
|
||||
<h2 class="post__title"><a href="{{ .RelPermalink }}">{{ .Title }}</a></h2>
|
||||
{{ with .Params.thumb }}{{ partial "image.html" (dict "path" . "max" 800 "class" "post__thumb" "alt" ($post.Params.featuredAlt | default $post.Title) "loading" "lazy") }}{{ end }}
|
||||
{{ with .Params.excerpt }}<p class="post__excerpt">{{ . }}</p>{{ end }}
|
||||
<a class="post__more" href="{{ .RelPermalink }}">Read more…</a>
|
||||
</article>
|
||||
{{ end }}
|
||||
</div>
|
||||
{{ end }}
|
||||
@@ -0,0 +1 @@
|
||||
{{ define "main" }}{{ .Content }}{{ end }}
|
||||
@@ -0,0 +1 @@
|
||||
{{ define "main" }}{{ .Content }}{{ end }}
|
||||
@@ -0,0 +1,17 @@
|
||||
{{- /* Resolves a front-matter "featured" path (relative to assets/) through
|
||||
Hugo's image pipeline. Hugo's Resize also scales up, so only convert to
|
||||
WebP and shrink when the source is wider than the given width. */ -}}
|
||||
{{- $path := .path -}}
|
||||
{{- $max := .max -}}
|
||||
{{- $class := .class -}}
|
||||
{{- $alt := .alt | default "" -}}
|
||||
{{- $loading := .loading | default "eager" -}}
|
||||
{{- with resources.Get $path -}}
|
||||
{{- $img := . -}}
|
||||
{{- if and (eq $img.ResourceType "image") (gt $img.Width $max) -}}
|
||||
{{- $img = $img.Resize (printf "%dx q82 webp" $max) -}}
|
||||
{{- end -}}
|
||||
<img class="{{ $class }}" src="{{ $img.RelPermalink }}" alt="{{ $alt }}" width="{{ $img.Width }}" height="{{ $img.Height }}" loading="{{ $loading }}" decoding="async"{{ if eq $loading "eager" }} fetchpriority="high"{{ end }}>
|
||||
{{- else -}}
|
||||
{{- warnf "featured image not found in assets: %s" $path -}}
|
||||
{{- end -}}
|
||||
@@ -0,0 +1,7 @@
|
||||
{{ define "main" }}
|
||||
<article class="entry">
|
||||
<h1 class="entry__title">{{ .Title }}</h1>
|
||||
{{ with .Params.featured }}{{ partial "image.html" (dict "path" . "max" 1200 "class" ($.Params.featuredClass | default "post__figure") "alt" $.Params.featuredAlt) }}{{ end }}
|
||||
{{ .Content }}
|
||||
</article>
|
||||
{{ end }}
|
||||
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 30 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 4.4 KiB |
|
After Width: | Height: | Size: 8.0 KiB |
|
After Width: | Height: | Size: 70 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 9.4 KiB |
|
After Width: | Height: | Size: 18 KiB |
|
After Width: | Height: | Size: 21 KiB |
|
After Width: | Height: | Size: 21 KiB |
|
After Width: | Height: | Size: 6.6 KiB |
|
After Width: | Height: | Size: 42 KiB |
|
After Width: | Height: | Size: 14 KiB |
|
After Width: | Height: | Size: 14 KiB |
@@ -0,0 +1,4 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" width="1024" height="1024" viewBox="0 0 1024 1024">
|
||||
<path fill="#3a76f0" d="M0,0v1024h1024V0H0z"/>
|
||||
<path fill="#ffffff" d="M427.5,170.3l7.9,32A319.6,319.6,0,0,0,347,238.9l-16.9-28.3A347.6,347.6,0,0,1,427.5,170.3Zm169,0-7.9,32A319.6,319.6,0,0,1,677,238.9l17.1-28.3A350.1,350.1,0,0,0,596.5,170.3ZM210.6,330a349.5,349.5,0,0,0-40.3,97.5l32,7.9A319.6,319.6,0,0,1,238.9,347ZM193,512a318.5,318.5,0,0,1,3.6-47.8l-32.6-5a352,352,0,0,0,0,105.5l32.6-4.9A319.5,319.5,0,0,1,193,512ZM693.9,813.3,677,785.1a317.8,317.8,0,0,1-88.3,36.6l7.9,32A350.3,350.3,0,0,0,693.9,813.3ZM831,512a319.5,319.5,0,0,1-3.6,47.8l32.6,4.9a352,352,0,0,0,0-105.5l-32.6,5A318.5,318.5,0,0,1,831,512Zm22.7,84.4-32-7.9A319,319,0,0,1,785.1,677l28.3,17A348.9,348.9,0,0,0,853.7,596.4Zm-293.9,231a319.1,319.1,0,0,1-95.6,0L459.3,860a351.3,351.3,0,0,0,105.4,0Zm209-126.2a318.1,318.1,0,0,1-67.6,67.5l19.6,26.6A355.1,355.1,0,0,0,795.4,721Zm-67.6-446a318.6,318.6,0,0,1,67.6,67.6L795.4,303A354.6,354.6,0,0,0,721,228.6Zm-446,67.6a318.6,318.6,0,0,1,67.6-67.6L303,228.6A354.6,354.6,0,0,0,228.6,303ZM813.4,330l-28.3,17a317.8,317.8,0,0,1,36.6,88.3l32-7.9A348.9,348.9,0,0,0,813.4,330ZM464.2,196.6a319.1,319.1,0,0,1,95.6,0l4.9-32.6a351.3,351.3,0,0,0-105.4,0ZM272.1,804.1,204,819.9l15.9-68.1-32.1-7.5-15.9,68.1a33,33,0,0,0,24.6,39.7,34.5,34.5,0,0,0,15,0l68.1-15.7Zm-77.5-89.2,32.2,7.4,11-47.2a316.2,316.2,0,0,1-35.5-86.6l-32,7.9a353.3,353.3,0,0,0,32.4,83.7Zm154,71.4-47.2,11,7.5,32.2,34.7-8.1a349,349,0,0,0,83.7,32.4l7.9-32a316.7,316.7,0,0,1-86.3-35.7ZM512,226c-158,.1-285.9,128.2-285.9,286.1a286.7,286.7,0,0,0,43.9,152L242.5,781.5,359.8,754c133.7,84.1,310.3,44,394.4-89.6S798.3,354.2,664.7,270A286.7,286.7,0,0,0,512,226s"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 81 KiB |
|
After Width: | Height: | Size: 51 KiB |
|
After Width: | Height: | Size: 56 KiB |
|
After Width: | Height: | Size: 34 KiB |
|
After Width: | Height: | Size: 41 KiB |
|
After Width: | Height: | Size: 43 KiB |
|
After Width: | Height: | Size: 450 KiB |
|
After Width: | Height: | Size: 21 KiB |