Skip to content

v2.8.0

Choose a tag to compare

@ulsklyc ulsklyc released this 14 Aug 05:30
· 19 commits to main since this release

Added

  • The dashboard can show a row of module tiles. Everything outside the tab bar is reachable only through "More", so the modules a household uses weekly were two taps away with no sign of what was waiting in them. Up to four tiles carry a number and a jump target in one row: measured at 1440x900, 753x105px for the whole row, and the same 105px on a 390px phone. The tiles show what is not already on the screen - a module the "Heute" panel already summarises is left out, and so is one whose own widget is visible, so the row follows the layout rather than keeping its own idea of it. What it leads with, therefore, are the modules a standard dashboard shows no widget for at all: rewards, health and the housekeeping log. Where a household does not use those, they have no number and no tile appears. It is a widget like every other one, not a fixed block at the top: it moves, hides and resizes in "Anpassen", an admin can lock it for a household member like any other widget, and switching a module off does not leave a hole in the layout. Each tile checks its own module, so a member who cannot see the budget never sees a budget tile.

Changed

  • The lists have one beat. A row was as tall as its longest line of metadata, and that line wrapped: on tasks eight possible elements produced two to three lines, so neighbouring rows stood at different heights and the eye had nothing to follow down the page. Nine modules now share one row grammar - the title on its line, the metadata on exactly one line below it, and what does not fit moves to the detail surface rather than being clipped. Measured at 390x844: tasks 71.1 to 61.1px, birthdays 121.6 to 62.6, housekeeping 130.9 to 64.8, budget 143.5 to 64.9, pantry 89.5 to 64.9, shopping 69.2 to 64.9, recipes 68.9 to 64.0, contacts 67.7 to 64.0, and the calendar agenda 67.3 to 61.4. 64px is the floor, not a miss of it: a row with a permanently visible 48px action zone cannot go below 48 plus twice its 8px padding. Those are medians, and one list keeps a deliberate exception: in the pantry a row carrying a status mark grows by one line, because the article name wraps rather than being cut - a shortened name is the loss of the row's only purpose in a supermarket aisle, and that decision outranks the beat. The two marks now move together instead of one at a time, so such a row costs one extra line rather than two. German is the constraint here, not English - "Dringend" and "Heute fällig" already fill the text column of a 390px phone, so the third element appears from the carrier width where it fits, rather than pushing the row onto a second line.
  • On a desktop the primary action of a module is a labelled button in its header. A circle floating over the content is a phone answer; on a pointer device it covered the last row of the list while the module header stood half empty beside it. The mechanism existed and was switched off - five modules had been carrying that button in their markup all along. It shows again above 1024px, and the floating button steps aside wherever one appears. That made a split visible the circles had hidden: three spellings for the same act stood in the same slot, from "Neue Aufgabe" through the button that read out its whole aria-label as a caption to two modules that said nothing at all. The rule is now the noun - the header reads "+ Termin" and the plus sign carries the verb, while a screen reader still hears "Termin hinzufügen". The long forms did not fit: "Neuer Eintrag" broke the budget header onto a second row at 1440px. Where a module offers its create path some other way, the second one goes: on the shopping list, whose quick-add row stands open on a pointer device, the floating button no longer stands 700px below it as a second door into the same room.
  • The bulk action of a list is a pill above the tab bar, not a block above the list. Checking off a single shopping item cost 103 of 552px of list area, because a static bar took the full width and wrapped its own contents onto two lines. It is one line of 48px now, in the material of the undo toast and in the same bottom layer, and the list starts where it started before anything was checked. Pill and toast share one stack, so they dodge each other rather than overlap: the one with the five-second deadline stays where toasts always are, and the pill moves. At the scroll end neither covers a row. On a very narrow phone the pill drops its sentence rather than truncating it, and the number moves to the button beside it - to the delete button on the shopping list, where a missing object is expensive, and to "Alles auf die Einkaufsliste" in the pantry, where "Alles" without its sentence can be read as the whole pantry instead of the ten items the filter is showing. It is a mark for the eye only; a screen reader still hears the pill's sentence, which never goes away for it.
  • Deleting a whole subset asks first, and the dangerous button no longer looks like the harmless one. "Löschen" and "In den Vorrat" stood side by side as two identical capsules 40px apart, and 8px below them the undo toast offered "Verwerfen" in the same shape again: three buttons, three very different consequences, one appearance. The undo was the reason given for leaving it that way, and it only ever answers a mistake you notice. The pill now turns into its own question - the sentence becomes "9 Artikel löschen?", the other actions step aside, and what remains is cancel and confirm. Escape takes it back, the keyboard lands on cancel rather than on the confirmation, and a screen reader hears the question because the focus moves into the group that the question names. The destructive capsule carries its own ink on the shell material, measured against the composited glass rather than the declared token: 5.13:1 in light, 5.47:1 in dark. Two things the rendering had to say rather than the plan: the question does not fit at every width in every language - Dutch needs 153 of 149px at 390px where German is comfortable with 115 - so the pair of buttons drops below the question whenever it has to, at no fixed breakpoint. And the confirmation sits exactly where the button that opened it sat, to the pixel at 390 and 414px, so a second tap from the same motion as the first would have gone straight through the question. It is held for 400ms, below the double-tap threshold and above the time it takes to read a question.
  • The "More" sheet is grouped the way the desktop sidebar is. Ten modules sat in one ungrouped grid, while the groups that sort them - Plan, Household, People, Finance - already hang on every navigation item and label the sidebar. The same set of modules that is sorted on a desktop was a wall on a phone. Each tile carries a box now, which makes the whole cell the target instead of just its icon and label, and gives its count badge a corner.
  • The calendar's day view is a carrier with flat bars. It was the week grid with one column: 56px per hour, bordered blocks, and a now-line that painted over whatever it crossed. Events are flat tint bars with a colour spine at 40px per hour, and below one hour a bar drops its time-and-place line rather than clipping it. The now-line runs below the events and its dot above everything, in the hour gutter where no event stands - so "now" stays findable and no title is ever struck through.
  • A module's colour appears once as a surface and once as ink. On tasks four green treatments stood in one screen at once - a filled view switcher, a filled group segment, a tinted filter chip and a chip with a raw accent border. The tone said the same thing four ways, and two of them were saturated blocks next to the violet primary button. The active filter chip is the tinted surface, the active segment is a raised pill in a well with the tone as ink, and nothing else takes the colour. The measurement that once justified the fill had expired: it was made before the family tones of 2.1.0, and today the raw tone holds 5.04:1 light and 4.82:1 dark on its own.
  • The folder browser in Documents unfolds instead of scrolling sideways. Below tablet width it was a strip of fixed 160px chips: measured at 390px it offered 356px of window onto 1488px of content, so two of nine folders were readable and one at 320px, and the name inside each chip had 53px, which showed six of the fourteen characters of "Versicherungen". It also sat directly under the filter row, which scrolls sideways too, so two different things answered the same gesture one above the other. Collapsed, the browser is now a single row that also names the folder you are in; opened, it is the full list in the shared row grammar, where no name is cut. The rows themselves joined that grammar in the same pass - Documents was the only route in the app with no shared row at all, and its folder entry had rebuilt the grammar and missed it (44px instead of 48, gap 8 instead of 12, an ellipsis where the shared rule wraps). The section heading moved out of the carrier and onto the page, where headings belong.
  • A budget category row stacks on a phone. As one line with a fixed name column the arithmetic did not work out: at 320px the row split 288px into 104 for the name, 58 for the bar and 78 for the amount, the name was cut in five of nine rows and seven of nine bars were under 3px. Name and amount now share the first line and the bar takes the second across the full width, which gives it about four times the length on which a comparison can happen at all. Nothing is cut at any width.
  • The pending requests in Rewards are a card like any other, and the standings row lost its rank digit. The card was the only fully tinted content surface of its kind, which put a violet primary button on a green ground; the count of open requests now sits in the heading, where it is a number rather than a colour field. Its tint also mixed against white while the card actually sits on the page ground, where it measured 1.11:1 in light and 1.64:1 in dark - loud as a vocabulary and weak as a signal, and a different thing in each theme. Mixed against the ground it really has, it is now the same step in both. The rank digit in front of each name was the first thing in the row and the only part of it that no action follows from; in a household with two children a "2" permanently reads as "last", and how close the next reward is stands in the same row and can be acted on.
  • The "More" sheet fits on the screen and ends above the tab bar. It was anchored to the bottom of the window with no ceiling and no scroller, so on a 568px-tall phone it grew upwards out of the picture: its top edge measured -142.6px and the search field sat entirely above the screen, reachable by keyboard and by nothing else. It now stops below the full height, scrolls in its body while the handle and the search stay put, and ends above the tab bar it used to cover - which also means the pixel that opens it now closes it instead of landing on "Log out". Logging out has its own full row at the foot, the same shape the sidebar already gave it.
  • The action discs on a note take their fill from the note, not from the modal scrim. They were the only controls in the app with a filled resting surface, and the value they used was the overlay that dims a page behind a dialog - which on a dark card made the disc darker than the card it sits on. Derived from the card's own ink they now separate in both themes.

Fixed

  • The agenda says which calendar an appointment belongs to again. The row cut had dropped the calendar name with the reasoning that the colour spine on the left says the same thing. It says it only to someone who knows the assignment by heart: a household with a family, a work, a school and a public-holiday calendar has four colours, and two of them are blue. For anyone with a colour vision deficiency the information was not retrievable at all. The name is back on the metadata line, but with the rank of a place rather than of a title - it is the first thing to go when the row gets narrow, the same mechanism the pantry and the budget already use for best-before dates, tags and accounts. It costs nothing where it appears: measured across seven widths, the agenda row stays at 60.7px with no wrapped metadata line either way. The threshold is measured rather than rounded - with the name shown, 16 of 37 rows wrapped at 24.8rem of carrier width, seven at 29.8rem, one at 32.3rem and none from 34.8rem. A screen reader hears the calendar at every width, because the name is in the row's label rather than only on screen.
  • A task no longer shows its urgency twice. A reminder synced over CalDAV carries its priority as a property and again as a category, so the priority chip "Dringend" stood directly beside the mirrored label "dringend" - two shapes, one word, on a line that has been single since the row cut and pays for every element. A label that reads exactly like the task's own priority is left out now. Only that one: a task marked "high" that carries a "dringend" label keeps it, because that is a contradiction rather than a duplicate, and it should be visible.
  • A saved dashboard layout no longer counts as rearranged just because a widget was added later. A layout stored before a widget existed had that widget appended at the end, and the board compares its order against the author's default to decide whether someone arranged it deliberately. Appended at the end, it did not match, so the grid quietly switched from dense packing to preserving an order nobody had set - and the gaps that packing exists to close came back. A widget that is new to a stored layout is now sorted to the place it holds in the default, right behind the neighbour it belongs after. In a layout the household really did rearrange there is no default position left, only neighbours, so it follows the one it belongs behind even where that one was moved.
  • The scroll end no longer keeps room for a button that is not there. Where the primary action docks into the module header, the floating button is hidden but its reserved run-out was not: five routes kept 96px of empty space below their last row on a desktop, and the shopping list 156px instead of 60. The reservation asks whether a button is hidden by the page, which was the wrong question once the answer came from a stylesheet. Each of the four places that hides the button now takes its run-out with it.
  • A long item name breaks with a hyphen instead of in the middle of a word. The shared row grammar wraps a name rather than truncating it, because a shortened name is the loss of the row's only purpose in a supermarket aisle. That was right, and how it wrapped was never checked: on the narrowest phone 11 of 26 shopping rows stood as "Kirschtoma / ten" and "Räucher / lachs", every ordinary German compound broken at no particular place and with nothing to mark it. The rows hyphenate now, in the language the interface is actually set to. It costs one line on one row of the whole list, and only at that width.
  • A budget bar carries its value again instead of only proving there is one. Every category below roughly six per cent of the largest one drew the same bar, so at 1440px four categories that differ by a factor of 9.4 rendered identically at 25.9px each: -234.98 €, -157.50 €, -153.49 € and -25.00 €. The floor was itself once a fix, against a tiny category looking empty, and it traded a cosmetic problem for a false statement in a money module. The share is now the share, and the smallest category stays visible through a minimum length rather than a minimum share.
  • Both actions of a medication dose stay on the screen. On a 390px phone "Überspringen" sat at 92 of its 122px outside the picture, clipped and with no way to scroll to it - in the module that carries medication, the most expensive place for an unreachable action. A fix for this existed but never reached that row: two renderers build the same row and only one of them carried the class the rule looks for. Both now shorten in two steps, dropping the labels and keeping the icons, the target size and the spoken name. Measured at 1440, 1024, 768, 430, 390 and 320px, nothing leaves the screen.
  • Blocks on one page end at one right edge. The reading measure had moved from the row carriers to the page, but as a list of names, so anything not on the list ran to the full rail: at 1440px the pending requests in Rewards ended 436px to the right of the carrier directly below them, the contact group heading 436px to the right of its own list, and the budget chart the same distance from the bookings under it. Four blocks joined the measure; the metric band stays deliberately wide.