[docs] new example frame! #2489
Conversation
| @@ -53,79 +53,6 @@ $dark-example-background-color: $dark-content-background-color; | |||
| } | |||
| } | |||
|
|
|||
| .view-example-source { | |||
There was a problem hiding this comment.
all this moved to _examples.scss below
| } | ||
|
|
||
|
|
||
| [data-modifier] > code { |
There was a problem hiding this comment.
i think these styles aren't used now?
There was a problem hiding this comment.
I think you're right, the ones from the code snippets are handled elsewhere
enable use of Set and Map in typescript (missing lib)Preview: documentation | landing | table |
remove nearly all overrides in docs-app!
|
@llorca time to review all examples carefully! i pushed fixes for most everything but I'm sure there are still loose ends. |
small changes to Label, Navbar, NIS styles to support new usagePreview: documentation | landing | table |
| padding-left: $pt-grid-size * 4; | ||
| padding-top: $pt-grid-size * 4; | ||
| padding-right: $pt-grid-size * 2; | ||
| padding-bottom: $pt-grid-size * 2; |
There was a problem hiding this comment.
yo i added this for a reason... see comment above.
| @@ -42,6 +42,42 @@ | |||
| } | |||
| } | |||
|
|
|||
| #{example("HotkeyTester")} { | |||
| .docs-hotkey-tester { | |||
There was a problem hiding this comment.
either class or example(), def don't need both (redundant)
| @@ -42,6 +42,23 @@ | |||
| } | |||
| } | |||
|
|
|||
| #{example("HotkeyPiano")} { | |||
| .docs-hotkey-piano-example { | |||
There was a problem hiding this comment.
there's already code for this in another file. please merge.
| @@ -33,7 +33,7 @@ example, `[2, 0]` represents the first child (`0`) of the third top-level node ( | |||
|
|
|||
| @### Instance methods | |||
|
|
|||
| <div class="docs-interface-name">Tree</div> | |||
| <div class="@ns-monospace-text">Tree</div> | |||
There was a problem hiding this comment.
use backticks. Tree. should be a code element.
There was a problem hiding this comment.
I don't want a code tho. I want a large text monospace element, without the border. Also <code> always enforces 12px so can't be combined with .pt-text-large :(
| "table": $forest5, | ||
| "timezone": $vermilion5, | ||
| "labs": $indigo5, | ||
| "resources": $orange5, |
There was a problem hiding this comment.
would prefer merging with the other map so it's "table": (bg, fg)
move custom example styles to _examplesPreview: documentation | landing | table |
refactor package color variables in navPreview: documentation | landing | table |
css examples: checkbox instead of switch, ignore modifier descriptionPreview: documentation | landing | table |
fix docs-example sizing (see overflow-ellipsis in typography)Preview: documentation | landing | table |
lintPreview: documentation | landing | table |
|
re:
right, but it's still ugly and it'd like to give it an appropriate size. should just modify that specific select with custom example styles? |
|
@llorca no this is a general problem with any example that puts its options underneath (see all Tables and DRP). i think we should not worry about it just yet and address in follow ups. |
hide props marked `@internal`Preview: documentation | landing | table |
bring pack CSS modifier descriptionPreview: documentation | landing | table |
unwrap control group examples (cuz they have no internal margin)
bring back padding around examples unwrap control group examples (cuz they have no internal margin)Preview: documentation | landing | table |
slick container for examples puts options in a column on the right:
completely revamp CSS example renderer so it works like the React examples, with switches for every modifier:
next steps:
to do
Large buttons with icon only are broken--46px wide instead of 40pxseparate PR pleaseDialogprop tablehasBackdropthrowsUnknown @tag: internal“Loading column” select in Table example too widethat's just flexDatePickerexample is oversizedensureElementdoesn't work with fragments (seen in NIS example)Move Usage with popovers markup to example framenot in this pr