Skip to content

Commit 0fbcbf2

Browse files
georgiastuartgeorgiastuart
authored
Add dark mode (#24)
Adds a dark mode option. Enable with `--dark-mode`. ![image](https://user-images.githubusercontent.com/8276147/215351169-d29dc7e0-ebdb-4e56-b897-02acb151d367.png) --------- Signed-off-by: Georgia Stuart <[email protected]>
1 parent 16ffd16 commit 0fbcbf2

19 files changed

+68
-50
lines changed

‎.github/workflows/release.yml‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,7 @@ jobs:
2929
- {arg: "--journals-per-page=1", suffix: "-full-pg-journal"}
3030
- {arg: "--journals-per-page=2", suffix: "-half-pg-journal"}
3131
- {arg: "--journals-per-page=4", suffix: "-quarter-pg-journal"}
32+
dark-mode: [{arg: "--dark-mode", suffix: "-dark-mode"}, {arg: "--no-dark-mode", suffix: ""}]
3233
steps:
3334
- name: Checkout
3435
uses: actions/checkout@v3
@@ -47,12 +48,12 @@ jobs:
4748
- name: Install playwright browsers
4849
run: playwright install
4950
- name: Build planner pages
50-
run: npm run build -- ${{ matrix.date-ranges.arg }} ${{ matrix.personal-goals.arg }} ${{ matrix.work-goals.arg }} ${{ matrix.daily-pages.arg }} ${{ matrix.weekly-pages.arg }} ${{ matrix.journal-pages.arg }} --file-suffix="-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}"
51+
run: npm run build -- ${{ matrix.date-ranges.arg }} ${{ matrix.personal-goals.arg }} ${{ matrix.work-goals.arg }} ${{ matrix.daily-pages.arg }} ${{ matrix.weekly-pages.arg }} ${{ matrix.journal-pages.arg }} ${{ matrix.dark-mode.arg }} --file-suffix="-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}${{ matrix.dark-mode.suffix }}"
5152
- name: Upload planner pdf to artifacts
5253
uses: actions/upload-artifact@v3
5354
with:
54-
name: planner-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}.pdf
55-
path: dest/planner-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}.pdf
55+
name: planner-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}${{ matrix.dark-mode.suffix }}.pdf
56+
path: dest/planner-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}${{ matrix.dark-mode.suffix }}.pdf
5657
deploy:
5758
needs: build
5859
runs-on: ubuntu-latest

‎.github/workflows/test.yml‎

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@ jobs:
1111
fail-fast: false
1212
matrix:
1313
python-version: ["3.10"]
14-
date-ranges: [{arg: "2022-11-01 2022-12-31", suffix: "2022-nov-dec"}]
14+
date-ranges: [{arg: "2023-02-01 2023-02-28", suffix: "2023-feb"}]
1515
personal-goals: [{arg: "--personal-goals", suffix: ""}, {arg: "--no-personal-goals", suffix: "-no-personal-goals"}]
1616
work-goals: [{arg: "--work-goals", suffix: ""}, {arg: "--no-work-goals", suffix: "-no-work-goals"}]
1717
daily-pages: [{arg: "--daily-pages", suffix: ""}, {arg: "--no-daily-pages", suffix: "-no-daily"}]
@@ -21,6 +21,7 @@ jobs:
2121
- {arg: "--journals-per-page=1", suffix: "-full-pg-journal"}
2222
- {arg: "--journals-per-page=2", suffix: "-half-pg-journal"}
2323
- {arg: "--journals-per-page=4", suffix: "-quarter-pg-journal"}
24+
dark-mode: [{arg: "--dark-mode", suffix: "-dark-mode"}, {arg: "--no-dark-mode", suffix: ""}]
2425
steps:
2526
- name: Checkout
2627
uses: actions/checkout@v3
@@ -39,9 +40,9 @@ jobs:
3940
- name: Install playwright browsers
4041
run: playwright install
4142
- name: Build planner pages
42-
run: npm run build -- ${{ matrix.date-ranges.arg }} ${{ matrix.personal-goals.arg }} ${{ matrix.work-goals.arg }} ${{ matrix.daily-pages.arg }} ${{ matrix.weekly-pages.arg }} ${{ matrix.journal-pages.arg }} --file-suffix="-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}"
43+
run: npm run build -- ${{ matrix.date-ranges.arg }} ${{ matrix.personal-goals.arg }} ${{ matrix.work-goals.arg }} ${{ matrix.daily-pages.arg }} ${{ matrix.weekly-pages.arg }} ${{ matrix.journal-pages.arg }} ${{ matrix.dark-mode.arg }} --file-suffix="-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}${{ matrix.dark-mode.suffix }}"
4344
- name: Upload planner pdf to artifacts
4445
uses: actions/upload-artifact@v3
4546
with:
46-
name: planner-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}.pdf
47-
path: dest/planner-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}.pdf
47+
name: planner-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}${{ matrix.dark-mode.suffix }}.pdf
48+
path: dest/planner-${{ matrix.date-ranges.suffix }}${{ matrix.daily-pages.suffix }}${{ matrix.weekly-pages.suffix }}${{ matrix.personal-goals.suffix }}${{ matrix.work-goals.suffix }}${{ matrix.journal-pages.suffix }}${{ matrix.dark-mode.suffix }}.pdf

‎README.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -90,7 +90,7 @@ technique, set margins to none and enable background images.
9090

9191
```
9292
usage: Python Planner Generator [-h] [--start-time START_TIME] [--end-time END_TIME] [--file-suffix FILE_SUFFIX] [--work-goals | --no-work-goals] [--personal-goals | --no-personal-goals]
93-
[--daily-pages | --no-daily-pages] [--weekly-pages | --no-weekly-pages] [--journals-per-page {0,1,2,4}]
93+
[--daily-pages | --no-daily-pages] [--weekly-pages | --no-weekly-pages] [--journals-per-page {0,1,2,4}] [--dark-mode | --no-dark-mode]
9494
start end
9595
9696
GoodNotes 5 Optimized PDF Planner
@@ -111,4 +111,5 @@ options:
111111
--daily-pages, --no-daily-pages
112112
--weekly-pages, --no-weekly-pages
113113
--journals-per-page {0,1,2,4}
114+
--dark-mode, --no-dark-mode
114115
```

‎src/generator.py‎

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -16,10 +16,13 @@ def generate_html(planner_html, out_file):
1616
with open(out_file, 'w') as fp:
1717
fp.write(planner_html)
1818

19-
def generate_pdf(html_file, css_file, out_file):
19+
def generate_pdf(html_file, css_file, out_file, dark_mode: bool):
2020
with sync_playwright() as p:
2121
browser = p.chromium.launch()
22-
page = browser.new_page()
22+
if dark_mode:
23+
page = browser.new_page(color_scheme='dark')
24+
else:
25+
page = browser.new_page(color_scheme='light')
2326
page.goto(f"file://{abspath(html_file)}")
2427
page.add_style_tag(path=abspath(css_file))
2528
page.pdf(path=abspath(out_file), width='18.83in', height='11.77in', print_background=True)
@@ -319,6 +322,7 @@ def build_journal_page(inp_date, j2_template: j2.Template):
319322
parser.add_argument('--daily-pages', action=BooleanOptionalAction, default=True)
320323
parser.add_argument('--weekly-pages', action=BooleanOptionalAction, default=True)
321324
parser.add_argument('--journals-per-page', default=0, type=int, choices=[0, 1, 2, 4])
325+
parser.add_argument('--dark-mode', action=BooleanOptionalAction, default=False)
322326

323327
args = parser.parse_args()
324328

@@ -371,4 +375,4 @@ def build_journal_page(inp_date, j2_template: j2.Template):
371375
planner = build_planner(pages, env)
372376

373377
generate_html(planner, f'./dest/index{args.file_suffix}.html')
374-
generate_pdf(f'dest/index{args.file_suffix}.html', f'dest/main.css', f'dest/planner{args.file_suffix}.pdf')
378+
generate_pdf(f'dest/index{args.file_suffix}.html', f'dest/main.css', f'dest/planner{args.file_suffix}.pdf', args.dark_mode)

‎src/input.css‎

Lines changed: 9 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,12 +26,16 @@
2626
@apply font-playfair text-2xl h-5mm items-center text-center;
2727
}
2828

29+
.mini-cal-date-outside {
30+
@apply mini-cal-date text-slate-300 dark:text-zinc-600;
31+
}
32+
2933
.monthly-cal-day {
3034
@apply flex-grow flex font-bold font-playfair text-2xl h-10mm items-end justify-center text-center pb-2;
3135
}
3236

3337
.monthly-cal-date {
34-
@apply font-bold font-playfair text-2xl border-t border-l border-slate-800 pl-2 pb-2;
38+
@apply font-bold font-playfair text-2xl border-t border-l border-slate-800 dark:border-zinc-400 pl-2 pb-2;
3539
}
3640

3741
.monthly-cal .monthly-cal-date:nth-child(7n) {
@@ -69,3 +73,7 @@
6973
.reflection-header {
7074
@apply font-bold font-playfair text-4xl flex h-5mm items-center;
7175
}
76+
77+
.lines {
78+
@apply border-b border-slate-800 dark:border-zinc-400;
79+
}

‎src/templates/annual_goals.html.j2‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<div class="flex flex-col">
66
<div class="area-header flex items-center"><div class="align-middle"><i class="{{ area[1] }} pr-2 text-2xl"></div></i><div>{{ area[0].lower() }}</div></div>
77
{% for i in range(10) %}
8-
<div class="border-b border-slate-800 h-5mm"></div>
8+
<div class="lines h-5mm"></div>
99
{% endfor %}
1010
</div>
1111
{% endfor %}

‎src/templates/annual_overview.html.j2‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<div class="flex flex-col">
33
<div class="annual-title"><div class="mx-auto">{{ year }}</div></div>
44
{% for i in range(25) %}
5-
<div class="border-b border-slate-800 h-5mm"></div>
5+
<div class="lines h-5mm"></div>
66
{% endfor %}
77
</div>
88
<div class="col-span-4">
@@ -24,7 +24,7 @@
2424
{% if cal_date[2] %}
2525
<div class="mini-cal-date"><a href="#{{ cal_date[1] }}">{{ cal_date[0] }}</a></div>
2626
{% else %}
27-
<div class="mini-cal-date text-slate-300"><a href="#{{ cal_date[1] }}">{{ cal_date[0] }}</a></div>
27+
<div class="mini-cal-date-outside"><a href="#{{ cal_date[1] }}">{{ cal_date[0] }}</a></div>
2828
{% endif %}
2929
{% endfor %}
3030
</div>

‎src/templates/daily.html.j2‎

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<div class="px-4 pb-4 border-b border-slate-800 text-6xl flex font-playfair font-bold">
1+
<div class="px-4 pb-4 lines text-6xl flex font-playfair font-bold">
22
<a class="pr-2" href="#{{ date.strftime('%Y-%m') }}">{{ date.strftime('%-d %B ').lower() }}</a>
33
<a href="#{{ date.strftime('%Y') }}">{{ date.strftime('%Y').lower() }}</a>
44
<span class="flex-grow inline-block"></span>
@@ -10,9 +10,9 @@
1010
<div class="mx-auto">agenda</div>
1111
</div>
1212
{% for time in times %}
13-
<div class="h-5mm border-b border-slate-800 pb-1 font-playfair text-base font-bold flex items-center"><div>{{ time }}</div></div>
13+
<div class="h-5mm lines pb-1 font-playfair text-base font-bold flex items-center"><div>{{ time }}</div></div>
1414
{% if not loop.last %}
15-
<div class="h-5mm border-b border-slate-800"></div>
15+
<div class="h-5mm lines"></div>
1616
{% endif %}
1717
{% endfor %}
1818
</div>
@@ -22,7 +22,7 @@
2222
<div class="mx-auto">highlight</div>
2323
</div>
2424
{% for i in range(2) %}
25-
<div class="h-5mm border-b border-slate-800"></div>
25+
<div class="h-5mm lines"></div>
2626
{% endfor %}
2727
<div class="daily-heading">
2828
<div class="mx-auto">to do</div>
@@ -31,8 +31,8 @@
3131
{% for i in range(2) %}
3232
<div>
3333
{% for j in range(10) %}
34-
<div class="h-5mm border-b border-slate-800 flex items-center">
35-
<div class="h-4 w-4 rounded-full border border-slate-800"></div>
34+
<div class="h-5mm lines flex items-center">
35+
<div class="h-4 w-4 rounded-full border border-slate-800 dark:border-white"></div>
3636
</div>
3737
{% endfor %}
3838
</div>
@@ -43,14 +43,14 @@
4343
<div class="flex flex-col">
4444
<div class="daily-heading"><div class="mx-auto">food</div></div>
4545
{% for i in range(7) %}
46-
<div class="h-5mm border-b border-slate-800"></div>
46+
<div class="h-5mm lines"></div>
4747
{% endfor %}
4848
</div>
4949

5050
<div class="flex flex-col">
5151
<div class="daily-heading"><div class="mx-auto">learned today</div></div>
5252
{% for i in range(7) %}
53-
<div class="h-5mm border-b border-slate-800"></div>
53+
<div class="h-5mm lines"></div>
5454
{% endfor %}
5555
</div>
5656
</div>
@@ -59,7 +59,7 @@
5959
<div class="flex flex-col">
6060
<div class="daily-heading"><div class="mx-auto">notes</div></div>
6161
{% for i in range(14 - ((mini_cal|length) // 7 % 5)) %}
62-
<div class="h-5mm border-b border-slate-800"></div>
62+
<div class="h-5mm lines"></div>
6363
{% endfor %}
6464
<div class="daily-heading"><div class="mx-auto">
6565
<a href="#{{ date.strftime('%Y-%m') }}">{{ date.strftime('%B').lower() }}</a>
@@ -75,12 +75,12 @@
7575
{% for cal_date in mini_cal %}
7676
{% if cal_date[2] %}
7777
{% if cal_date[1] == date.strftime('%Y-%m-%d') %}
78-
<div class="mini-cal-date"><div class="bg-slate-200 aspect-square h-full rounded-full mx-auto"><a href="#{{ cal_date[1] }}">{{ cal_date[0] }}</a></div></div>
78+
<div class="mini-cal-date"><div class="bg-slate-200 dark:bg-zinc-700 aspect-square h-full rounded-full mx-auto"><a href="#{{ cal_date[1] }}">{{ cal_date[0] }}</a></div></div>
7979
{% else %}
8080
<div class="mini-cal-date"><a href="#{{ cal_date[1] }}">{{ cal_date[0] }}</a></div>
8181
{% endif %}
8282
{% else %}
83-
<div class="mini-cal-date text-slate-300"><a href="#{{ cal_date[1] }}">{{ cal_date[0] }}</a></div>
83+
<div class="mini-cal-date text-slate-300 dark:text-zinc-600"><a href="#{{ cal_date[1] }}">{{ cal_date[0] }}</a></div>
8484
{% endif %}
8585
{% endfor %}
8686
</div>

‎src/templates/frame.html.j2‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
<div class="m-6">
33
{{ content|safe }}
44
</div>
5-
<div class="absolute bottom-0 right-0 text-slate-300 text-2xl pr-6">
5+
<div class="absolute bottom-0 right-0 text-slate-300 dark:text-zinc-600 text-2xl pr-6">
66
{% if journal_link %}
77
<a href="#{{ journal_link }}"><i class="fa-solid fa-book pl-2"></i></a>
88
{% endif %}

‎src/templates/full_planner.html.j2‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
<link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
1212
<script src="https://kit.fontawesome.com/dc644d3ad5.js" crossorigin="anonymous"></script>
1313
</head>
14-
<body class="text-slate-800">
14+
<body class="text-slate-800 dark:text-white dark:bg-zinc-800">
1515
{% for page in pages %}
1616
{{ page|safe }}
1717
{% endfor %}

0 commit comments

Comments
 (0)