mfbs

CSS microframework
git clone https://git.ce9e.org/mfbs.git

commit
54b6c466064ceb4e9310035e3adc80642e17f0aa
parent
bddb0e7ac0af59b6f6ae3b7b3faa2ad0612ea28f
Author
Tobias Bengfort <tobias.bengfort@posteo.de>
Date
2023-02-26 10:11
use flow-relative attributes in styleguide css

Diffstat

M examples/styleguide.css 33 +++++++++++++++++----------------

1 files changed, 17 insertions, 16 deletions


diff --git a/examples/styleguide.css b/examples/styleguide.css

@@ -1,41 +1,42 @@
    1     1 body {
    2    -1   max-width: 60em;
    3    -1   margin: 0 auto;
   -1     2   max-inline-size: 60em;
   -1     3   margin-block: 0;
   -1     4   margin-inline: auto;
    4     5   padding: 0.5em;
    5     6 }
    6     7 main {
    7    -1   width: 66%;
   -1     8   inline-size: 66%;
    8     9 }
    9    10 .page-nav {
   10    -1   width: 30%;
   -1    11   inline-size: 30%;
   11    12   float: right;
   12    13 }
   13    14 .page-nav ul {
   14    15   list-style: none;
   15    -1   text-align: right;
   -1    16   text-align: end;
   16    17   position: fixed;
   17    18   top: 0;
   18    19   padding: 1em;
   19    -1   padding-left: 0;
   20    -1   max-height: 100vh;
   21    -1   overflow-y: auto;
   -1    20   padding-inline-start: 0;
   -1    21   max-block-size: 100vb;
   -1    22   overflow-block: auto;
   22    23 }
   23    24 .example {
   24    25   border: 2px solid silver;
   25    26   padding: 0.5em;
   26    -1   margin-bottom: 2em;
   -1    27   margin-block-end: 2em;
   27    28   border-radius: 0.5em;
   28    29 }
   29    30 .example--code {
   30    -1   border-bottom-right-radius: 0;
   31    -1   border-bottom-left-radius: 0;
   32    -1   margin-bottom: 0;
   -1    31   border-end-start-radius: 0;
   -1    32   border-end-end-radius: 0;
   -1    33   margin-block-end: 0;
   33    34 }
   34    35 pre.example-code {
   35    36   border: 2px solid silver;
   36    -1   border-top: 0;
   37    -1   border-bottom-right-radius: 1em;
   38    -1   border-bottom-left-radius: 1em;
   39    -1   margin: 0 0 2em;
   -1    37   border-block-start: 0;
   -1    38   border-end-start-radius: 1em;
   -1    39   border-end-end-radius: 1em;
   -1    40   margin-block: 0 2em;
   40    41   padding: 0.5em;
   41    42 }