2626
2727/* A panel is a box embedded into the page, useful for visually isolating content. */
2828.panel {
29- border-radius : var (--radius_xs );
29+ border-radius : var (--border_radius_xs );
3030 background-color : var (--panel_bg , var (--fg_1 ));
3131}
3232
3535 padding-left : var (--space_xs );
3636 padding-right : var (--space_xs );
3737 background-color : var (--fg_1 );
38- border-radius : var (--radius_xs );
38+ border-radius : var (--border_radius_xs );
3939}
4040a .chip {
4141 font-weight : 700 ;
4242}
4343
4444.pre {
45- font-family : var (--font_mono );
45+ font-family : var (--font_family_mono );
4646 color : var (--text_color , var (--text_color_3 ));
4747 overflow : auto;
4848 max-width : 100% ;
4949}
5050.pre > code {
51- font-size : var (--size_sm ); /* TODO @many use a var? maybe computed from generic `--size`? */
51+ font-size : var (
52+ --font_size_sm
53+ ); /* TODO @many use a var? maybe computed from generic `--font_size`? */
5254 font-weight : 500 ;
5355}
5456.pre : not (.inline ) > code {
5557 display : block;
5658}
5759
58- .inline {
59- display : inline ;
60+ .relative {
61+ position : relative ;
6062}
61- .flex {
63+ /** Same as `display: inline flow-root`. */
64+ .display_inline_block {
65+ display : inline-block;
66+ }
67+ /** Same as `display: block flex`. */
68+ .display_flex {
6269 display : flex;
6370}
6471.flex_1 {
@@ -70,18 +77,18 @@ a.chip {
7077.justify_content_space_around {
7178 justify-content : space-around;
7279}
73- .size_xl2 {
74- font-size : var (--size_xl2 );
75- --size : var (--size_xl2 );
80+ .font_size_xl2 {
81+ font-size : var (--font_size_xl2 );
82+ --font_size : var (--font_size_xl2 );
7683}
7784.text_align_center {
7885 text-align : center;
7986}
8087.bg {
8188 background-color : var (--bg );
8289}
83- .radius_xs {
84- border-radius : var (--radius_xs );
90+ .border_radius_xs {
91+ border-radius : var (--border_radius_xs );
8592}
8693.shadow_sm {
8794 box-shadow : var (--shadow_sm )
0 commit comments