Commit Graph

13 Commits

Author SHA1 Message Date
Henrik Giesel
ab6a68ec49
Introduce our own Container, Row, and Col components (#1495)
* Refactor out Placeholder from CardInfo.svelte

* Add breakpoint parameter for Container

- Use `Container` component inside `TitledContainer`

* Build Item into Row

- Use Row in DeckOptionsPage instead of just Item

* Reengineer Container/Row/Col CSS

* Inline Badges next to Labels when Lable spans multiple rows

* Adjust margins for mobile

* Implement Col component breakpoints

* Move card-info to use new Container and Row components

* Join StickyHeader and StickyFooter to StickyContainer

* Remove default middle vertical-alignment for Badges again

* Satisfy tests

* Restore inline gutters in change-notetype Mapper

* Add some comment to Col and Container

* Fix breaking behavior in DeckOptionsPage when multi-column

* Add back toolbar left padding to counter-act buttongroup right margins

* Make Label in SwitchRow take more of available space
2021-11-17 13:49:52 +10:00
RumovZ
9b1d53e359 Use null for missing stats 2021-10-18 09:36:31 +02:00
RumovZ
0b3b3a5f33 sentCardId -> requestedCardId 2021-10-18 09:12:10 +02:00
RumovZ
8eed005db6 Use null for unset cardId 2021-10-18 09:11:00 +02:00
RumovZ
dc4f5adc44 Default to includeRevlog = true 2021-10-18 09:04:49 +02:00
RumovZ
2a93868922 Center placeholder 2021-10-18 09:01:25 +02:00
RumovZ
bbba21126f Improve clarity in card info code a tiny little bit 2021-10-18 09:01:25 +02:00
RumovZ
3c5e149176 Move update logic into CardInfo.svelte
Also use a simpler and faster way to avoid race conditions.
2021-10-18 09:01:24 +02:00
RumovZ
5062024974 Move update logic into CardInfo.svelte 2021-10-18 09:01:24 +02:00
RumovZ
4b5ea6c110 Make CardStats a separate component 2021-10-18 09:01:23 +02:00
RumovZ
a47453d5f3 Implement reactively updating Card Info 2021-10-18 09:01:22 +02:00
Damien Elmes
abad6c3844 layout tweaks to card info
- negative margins result in truncated text when the window size
is reduced, so avoid them
- having a 100% table inside a flexbox is not responsive - the table
does not adjust its size as the width is increased or decreased
- in order to look decent on narrow screens (eg phones), we allow
margin collapsing
- in order to look decent on wide screens, we limit the maximum
width to something that is readable
- hide some columns in portrait mode on narrow screens

I tried preserving the centering with margin-left/right: auto, but
could not get it looking right, so have had to move things back to
left alignment.
2021-10-14 19:28:33 +10:00
RumovZ
3672b0fe73
Switch CardInfoDialog to ts page (#1414)
* Only collect card stats on the backend ...

... instead of rendering an HTML string using askama.

* Add ts page Card Info

* Update test for new `col.card_stats()`

* Remove obsolete CardStats code

* Use new ts page in `CardInfoDialog`

* Align start and end instead of left and right

Curiously, `text-align: start` does not work for `th` tags if assigned
via classes.

* Adopt ts refactorings after rebase

#1405 and #1409

* Clean up `ts/card-info/BUILD.bazel`

* Port card info logic from Rust to TS

* Move repeated field to the top

https://github.com/ankitects/anki/pull/1414#discussion_r725402730

* Convert pseudo classes to interfaces

* CardInfoPage -> CardInfo

* Make revlog in card info optional

* Add legacy support for old card stats

* Check for undefined instead of falsy

* Make Revlog separate component

* drop askama dependency (dae)

* Fix nightmode for legacy card stats
2021-10-14 19:22:47 +10:00