alice.pds.demo.boltless.dev
Commits
dev: warning (orange)
next: info (blue)
prod: classic (black)
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: eti <eti@eti.tf>
The vertical variant now looks like the old SettingsNav and slides the
same plate the horizontal tabs do, so the current section animates as you
move between pages. SettingsNav keeps only the phone picker, which is now
a Select.
This also restores the tv refactor in Tabs.svelte, which c54416b2 undid by
accident.
Signed-off-by: eti <eti@eti.tf>
Adds the pipelines tab at /[handle]/[repo]/pipelines. The cards follow the
issue cards: what set the run off on top, then a status tag, a dropdown
listing the workflows, when it ran and how long it took. While a run is
still going the dropdown counts the finished ones, so 1/3.
The data is fake for now. It sits in components/repo/pipelines/mock.ts and
the page load filters it, so pointing this at bobbin later should only mean
rewriting +page.ts.
The search box and the push/pull-request tabs keep each other's state, so
searching inside a tab does not throw the tab away.
Along for the ride: Tag gained a danger colour for failed runs, DropdownItem
takes a class and now renders Button, and Button exposes a bindable ref.
The links to workflow logs point at a route that does not exist yet.
Signed-off-by: eti <eti@eti.tf>
Puts a glyph on the field's leading edge, mirroring the chevron on the
other side. Wired into both renderings, so flipping `rich` still doesn't
change how the field looks.
Signed-off-by: eti <eti@eti.tf>
Move the layout classes into a tv slots recipe with marketing/app and
pending variants, replacing the inline ternary and the divider snippet.
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: eti <eti@eti.tf>
Input only ever drew one height. It now takes size="sm", "md" or "lg"
just like Button, and both land on the same heights: 32, 36 and 40
pixels. So an input and a button sitting next to each other line up.
The text and the icons grow with the box as well. The only thing that
does not copy Button is the side padding, which stays a little tighter,
because a button centres its label and needs the room while an input's
text starts against the left edge. That also keeps "md" looking exactly
the way it looked before, so none of the inputs already in the app move.
Two small fixes along the way. The inner field can now shrink, so in a
narrow input the suffix and the loading spinner stay inside the border
instead of spilling out over whatever is beside them. And the new size
prop takes the place of the native size attribute, which sets a width in
characters and was not used anywhere.
Figma has no size variant for Button or Input, so Button's own code was
the only thing to match here.
Signed-off-by: eti <eti@eti.tf>
the appview draws those little shiny dots for languages and labels from
one template. the web app had no such thing, so BlobHeader kept its own
copy of the gradient and LanguageBar drew a flat circle instead. now
there is one component for it, in three sizes, and both use it.
Signed-off-by: eti <eti@eti.tf>
Four steps in one card — profile, follow & star, ssh keys, finish — with
the same content as the appview's /welcome templates. The step rail sits
at the top and the body slides left or right as you move between steps.
Data is mocked, nothing talks to an api yet.
Field and Textarea gained the variants the steps needed: sentence-case
labels, and a shorter box for the ssh key.
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: dawn <dawn@tangled.org>
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: dawn <dawn@tangled.org>
The worker only understood one size, `size=tiny`, which meant 32px. It now takes
26, 34, 42 or 52 — double each size on the web app's avatar scale, so avatars
stay sharp on retina screens. Anything it doesn't recognise gets the original
image, untouched.
`tiny` still works and still means 32px. This worker ships separately from the
web app, so cached urls and a deploy that hasn't caught up yet keep asking
for it.
Signed-off-by: eti <eti@eti.tf>
Avatar used to take a tailwind class for its size, and a separate `tiny` flag
that picked which image size to download. Nothing kept those two in agreement,
and they drifted apart: comment avatars draw at 32px but downloaded a 32px
image, so they looked blurry on retina screens, while the small 16px avatars in
settings downloaded a full-size one.
Now there's one prop. Pick mini, small, regular or large — the names the design
system already uses — and Avatar works out the image size itself, always asking
for twice what it draws so it stays sharp. `full` is for the cases where the
surrounding layout sets the size instead; it fills whatever box you put it in
and uses the original image.
The sizes go through tv() so you can still pass your own size class and have it
win. Two size classes in one string is a coin flip otherwise, because tailwind
decides by where the rules land in the stylesheet, not the order you wrote them.
A few avatars shift slightly to land on the scale: comments 32 to 26, settings
lists 16 to 17, access and last commit 20 to 21, repo header and commit rows 24
to 26.
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: dawn <dawn@tangled.org>
Renders each settings tab's structure immediately and swaps same-size skeleton
placeholders for the real controls while data loads, so a hard refresh doesn't
flash a spinner or shift the bounding box. Adds a shared Skeleton component.
Signed-off-by: dawn <dawn@tangled.org>
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: eti <eti@eti.tf>
Signed-off-by: dawn <dawn@tangled.org>
Signed-off-by: dawn <dawn@tangled.org>
Signed-off-by: dawn <dawn@tangled.org>
Signed-off-by: dawn <dawn@tangled.org>
Signed-off-by: dawn <dawn@tangled.org>
Signed-off-by: dawn <dawn@tangled.org>
Signed-off-by: dawn <dawn@tangled.org>
The vertical variant now looks like the old SettingsNav and slides the
same plate the horizontal tabs do, so the current section animates as you
move between pages. SettingsNav keeps only the phone picker, which is now
a Select.
This also restores the tv refactor in Tabs.svelte, which c54416b2 undid by
accident.
Signed-off-by: eti <eti@eti.tf>
Adds the pipelines tab at /[handle]/[repo]/pipelines. The cards follow the
issue cards: what set the run off on top, then a status tag, a dropdown
listing the workflows, when it ran and how long it took. While a run is
still going the dropdown counts the finished ones, so 1/3.
The data is fake for now. It sits in components/repo/pipelines/mock.ts and
the page load filters it, so pointing this at bobbin later should only mean
rewriting +page.ts.
The search box and the push/pull-request tabs keep each other's state, so
searching inside a tab does not throw the tab away.
Along for the ride: Tag gained a danger colour for failed runs, DropdownItem
takes a class and now renders Button, and Button exposes a bindable ref.
The links to workflow logs point at a route that does not exist yet.
Signed-off-by: eti <eti@eti.tf>
Input only ever drew one height. It now takes size="sm", "md" or "lg"
just like Button, and both land on the same heights: 32, 36 and 40
pixels. So an input and a button sitting next to each other line up.
The text and the icons grow with the box as well. The only thing that
does not copy Button is the side padding, which stays a little tighter,
because a button centres its label and needs the room while an input's
text starts against the left edge. That also keeps "md" looking exactly
the way it looked before, so none of the inputs already in the app move.
Two small fixes along the way. The inner field can now shrink, so in a
narrow input the suffix and the loading spinner stay inside the border
instead of spilling out over whatever is beside them. And the new size
prop takes the place of the native size attribute, which sets a width in
characters and was not used anywhere.
Figma has no size variant for Button or Input, so Button's own code was
the only thing to match here.
Signed-off-by: eti <eti@eti.tf>
the appview draws those little shiny dots for languages and labels from
one template. the web app had no such thing, so BlobHeader kept its own
copy of the gradient and LanguageBar drew a flat circle instead. now
there is one component for it, in three sizes, and both use it.
Signed-off-by: eti <eti@eti.tf>
Four steps in one card — profile, follow & star, ssh keys, finish — with
the same content as the appview's /welcome templates. The step rail sits
at the top and the body slides left or right as you move between steps.
Data is mocked, nothing talks to an api yet.
Field and Textarea gained the variants the steps needed: sentence-case
labels, and a shorter box for the ssh key.
Signed-off-by: eti <eti@eti.tf>
The worker only understood one size, `size=tiny`, which meant 32px. It now takes
26, 34, 42 or 52 — double each size on the web app's avatar scale, so avatars
stay sharp on retina screens. Anything it doesn't recognise gets the original
image, untouched.
`tiny` still works and still means 32px. This worker ships separately from the
web app, so cached urls and a deploy that hasn't caught up yet keep asking
for it.
Signed-off-by: eti <eti@eti.tf>
Avatar used to take a tailwind class for its size, and a separate `tiny` flag
that picked which image size to download. Nothing kept those two in agreement,
and they drifted apart: comment avatars draw at 32px but downloaded a 32px
image, so they looked blurry on retina screens, while the small 16px avatars in
settings downloaded a full-size one.
Now there's one prop. Pick mini, small, regular or large — the names the design
system already uses — and Avatar works out the image size itself, always asking
for twice what it draws so it stays sharp. `full` is for the cases where the
surrounding layout sets the size instead; it fills whatever box you put it in
and uses the original image.
The sizes go through tv() so you can still pass your own size class and have it
win. Two size classes in one string is a coin flip otherwise, because tailwind
decides by where the rules land in the stylesheet, not the order you wrote them.
A few avatars shift slightly to land on the scale: comments 32 to 26, settings
lists 16 to 17, access and last commit 20 to 21, repo header and commit rows 24
to 26.
Signed-off-by: eti <eti@eti.tf>