Studio · mockup · row 11h · Draft

Away

Days Earl can't shoot, and what they block.

Away on the Calendar: one kind of entry, a date range with start and end times (or All day) and a private note. Before saving, the sessions and live holds already on those dates are listed. Plus the warning Earl meets when he enters a date on away himself, and the client's view of an away day. The Calendar page itself is restyled in its own row; only the away parts are designed here.

MapAway (one type; start and end time; All day tick; booked days listed first; never cancels; Google mirror; public holidays information only); Calendar page (your sessions + your away time)
A2 specmodule 4 items 2, 3, 5, 6, 9; Flows 4.1 (booked-day list, Save anyway, overlap refused), 4.2, 4.3, 4.4 (client sees “The studio is closed that day.”), 4.5 (You're away → Book anyway with a reason)
GlossaryAway, Hold, Session name
Usesadmin-shell.html P1; §6 modal, text field, checkbox, alert, table, month calendar (client view)
Decided — Earl, 12 Oct 2026
  1. Decided (Earl, 12 Oct 2026): “Add away” (words, no + sign) at the top of the Calendar opens the pop-up. In Month view, tapping a day opens Add away with that date filled in, instead of going to Day view (Day view stays on the tab above); an away day opens to edit, a session opens the session. Handed to management: A2 spec module 4 item 9 says “+ Away”, and ECSB's Month view opens Day view on a tap (Calendar.jsx openDay); both change.
  2. Decided (Earl, 12 Oct 2026): on the admin calendar an away day is filled --n700 with “Away” and the note in --n100. Alternative: a 1px --n700 outline. Filled reads at a glance across a month.
  3. Decided (Earl, 12 Oct 2026): desktop Edit away keeps Save and “Delete away” side by side, no Cancel (closing the overlay cancels). On a phone the pop-up fills the screen, so it has Save and Cancel together and Delete away alone below a rule.

Calendar · November

away 14–16 Nov, a part-day away on the 11th, a holiday, sessions

Calendar

November 2026

Mon
Tue
Wed
Thu
Fri
Sat
Sun
26
27
28
29
30
31
1
2
3
4
5
6
7
8

[Public holiday]

9
10
11

Away 13:00–17:00

12
13
14

Away

Kuching

[Portrait] Aisha 2026/11 · 10:00

15

Away

16

Away

[Hold] [Name]

17
18
19
20
21

[Assignment] [Session name]

22
23
24
25
26
27
28
29
30
1
2
3
4
5
6

Away days filled --n700 with the private note; public holidays (national and Kuala Lumpur) as information only, never blocking. Tapping a day opens Add away with that date filled in; tapping an away day opens it to edit; tapping a session opens the session. Day view is reached from the Day tab.

Calendar · Week

a part-day away (Wed) and full-day away (Sat, Sun)

Calendar

9 – 15 November 2026

Mon9
Tue10
Wed11
Thu12
Fri13
Sat14
Sun15
All day
Away
Kuching
Away
Kuching
09:0010:0011:0012:0013:0014:0015:0016:0017:0018:0019:00
Away
13:00–17:00
Dentist
[Portrait] [Name] 2026/11
10:00–12:00
[Portrait] Aisha 2026/11
10:00–12:00

A full-day away sits in the All day row; a part-day away is a block at its hours. Both filled --n700; sessions are outlined. Day view is the same column, one day wide.

Add away · days already booked

4.1 steps 1–2

Calendar

November 2026

Mon
Tue
Wed
Thu
Fri
Sat
Sun
26
27
28
29
30
31
1
2
3
4
5
6
7
8

[Public holiday]

9
10
11

Away 13:00–17:00

12
13
14

Away

Kuching

[Portrait] Aisha 2026/11 · 10:00

15

Away

16

Away

[Hold] [Name]

17
18
19
20
21

[Assignment] [Session name]

22
23
24
25
26
27
28
29
30
1
2
3
4
5
6

Away days filled --n700 with the private note; public holidays (national and Kuala Lumpur) as information only, never blocking. Tapping a day opens Add away with that date filled in; tapping an away day opens it to edit; tapping a session opens the session. Day view is reached from the Day tab.

Add away · part of a day

All day unticked

Calendar

November 2026

Mon
Tue
Wed
Thu
Fri
Sat
Sun
26
27
28
29
30
31
1
2
3
4
5
6
7
8

[Public holiday]

9
10
11

Away 13:00–17:00

12
13
14

Away

Kuching

[Portrait] Aisha 2026/11 · 10:00

15

Away

16

Away

[Hold] [Name]

17
18
19
20
21

[Assignment] [Session name]

22
23
24
25
26
27
28
29
30
1
2
3
4
5
6

Away days filled --n700 with the private note; public holidays (national and Kuala Lumpur) as information only, never blocking. Tapping a day opens Add away with that date filled in; tapping an away day opens it to edit; tapping a session opens the session. Day view is reached from the Day tab.

Overlap refused

4.1

Calendar

November 2026

Mon
Tue
Wed
Thu
Fri
Sat
Sun
26
27
28
29
30
31
1
2
3
4
5
6
7
8

[Public holiday]

9
10
11

Away 13:00–17:00

12
13
14

Away

Kuching

[Portrait] Aisha 2026/11 · 10:00

15

Away

16

Away

[Hold] [Name]

17
18
19
20
21

[Assignment] [Session name]

22
23
24
25
26
27
28
29
30
1
2
3
4
5
6

Away days filled --n700 with the private note; public holidays (national and Kuala Lumpur) as information only, never blocking. Tapping a day opens Add away with that date filled in; tapping an away day opens it to edit; tapping a session opens the session. Day view is reached from the Day tab.

Edit away

4.2, 4.3

Calendar

November 2026

Mon
Tue
Wed
Thu
Fri
Sat
Sun
26
27
28
29
30
31
1
2
3
4
5
6
7
8

[Public holiday]

9
10
11

Away 13:00–17:00

12
13
14

Away

Kuching

[Portrait] Aisha 2026/11 · 10:00

15

Away

16

Away

[Hold] [Name]

17
18
19
20
21

[Assignment] [Session name]

22
23
24
25
26
27
28
29
30
1
2
3
4
5
6

Away days filled --n700 with the private note; public holidays (national and Kuala Lumpur) as information only, never blocking. Tapping a day opens Add away with that date filled in; tapping an away day opens it to edit; tapping a session opens the session. Day view is reached from the Day tab.

Phone

the pop-ups fill the screen
Phone · Edit away

Edit away

Start date
Sat 14 Nov 2026
End date
Mon 16 Nov 2026
All day
Private note
Kuching

Mirrored to your Google calendar as “Away”.

§6: on a phone the pop-up fills the screen, 24px gutter. Save and Cancel together; Delete away on its own line below a rule, away from Save.

Phone · Add away

Add away

Start date
Tue 24 Nov 2026
End date
Tue 24 Nov 2026
All day
Start time
13:00
End time
17:00
Private note

Only you see it.

Opened by tapping a day: the date is already filled in.

You're away

Earl enters a session date on away (4.5)
Back to [Session name]

[Session name]

Session date
Sun 15 Nov 2026
Start
10:00

Client · date pick

an away day is like any unavailable day (4.4)

November 2026

MonTueWedThuFriSatSun 123456789101112131415161718192021222324252627282930
15 November

The studio is closed that day.