Commit Graph

22 Commits

Author SHA1 Message Date
Damien Elmes
7fcb8cbb62 fix position showing as date in card stats
Fixes #1519
2021-12-02 16:10:29 +10:00
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
Damien Elmes
d668ac8f7f fix card info layout & test code
Closes #1479

Related: #1470
2021-11-12 16:24:08 +10:00
Damien Elmes
fd013f68d2 ensure revlog headers match alignment of columns
+ right-align interval; it looks bad centered
2021-11-02 16:32:09 +10:00
Henrik Giesel
09c29219b4
Several CSS fixes - Editor Cleanup (#1470)
* Refactor editor css, fix editor button highlight

- Avoid using webview.css
- Move more buttons css into button_mixins

* Fix DropdownItem appearance

* Fix the visuals of tags

* Make dropdown font slightly smaller

* Give SelectOption a background color

* Move some css from deck-options-base to CardStateCustomizer

* Avoid using core.scss for CardStats

* Avoid using sass/core in congrats package

* Inline core.scss into webview.scss

* Include fusion-vars for base.scss

* need to keep core.scss around for now (dae)
2021-10-31 08:29:22 +10:00
RumovZ
1c9b5a2e83
Card info cleanup (#1446)
* Cast proto interface to type ...

... instead of using non-null assertions in Revlog.svelte.

* Remove OptionalInt32 and OptionalUInt32
2021-10-23 11:00:43 +10:00
Henrik Giesel
0dff5ea3a3
Use trailingComma: all setting in .prettierrc (#1435) 2021-10-19 09:06:00 +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
bb5053990b pass ts deps into most Svelte packages; remove redundant deps
Henrik, I've left editable/editor alone to avoid causing a conflict;
please add them in your PR instead when you get a chance.
2021-10-18 12:44:31 +10:00
Damien Elmes
e8c5802a96 pass sole arg to cardStats as a dictionary
Easier to extend in the future, or (de)serialize in a strongly-typed
language.
2021-10-14 19:28:51 +10: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
Damien Elmes
53ce7d2759 support #test in card-info.html
allows us to use scripts/ts-run and ts-watch to test the page
in Chrome by surfing to http://127.0.0.1:40000/_anki/pages/card-info.html#testXXX
2021-10-14 19:23: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