◊(Local Yarn Code "Check-in [f0afc42f]")

Overview
Comment:Fiddle with columnar lists again
Timelines: family | ancestors | descendants | both | trunk
Files: files | file ages | folders
SHA3-256: f0afc42f49d3f5655113f42d9a84b62cf0f5917846a00165783679fca1f422a3
User & Date: joel on 2020-03-08 15:35:07
Other Links: manifest | tags
Context
2020-03-10
18:18
Add attrib, mono, and xref tags. Tweak styles for titles, code. check-in: 58810a67 user: joel tags: trunk
2020-03-08
15:35
Fiddle with columnar lists again check-in: f0afc42f user: joel tags: trunk
15:34
Edit design doc check-in: 95623f22 user: joel tags: trunk
Changes

Modified web-extra/martin.css.pp from [2e1ac04c] to [8e15245c].

659
660
661
662
663
664
665
666
667

668

669
670
671
672

673

674
675
676
677
678
679
680
...
734
735
736
737
738
739
740
741

742
743
744
745
746
747
748
    font-weight: normal;
}

/* ******* (Mobile first) Columnar series list styling *******
 */

.column-list {
    max-width: 17rem;
    margin: 0;

    columns: 8rem auto;

}

@media (min-width: 667px) {
  .column-list {

    margin: 0 auto;

  }
}

.column-list div {
    padding-left: 0.25em; /* Keeps some italic descenders inside the box */
    text-align: left;
    break-inside: avoid;
................................................................................
  margin: 0 auto;
  flex-shrink: 0;
}

@media (min-width: 667px) {
  footer#main {
    text-align: center;
    width: 100%;

    background: linear-gradient(◊color-background 5%, #dedede 100%);
  }
}

footer#main p.title {
  font-size: 1rem;
  font-feature-settings: "smcp" on;







<

>
|
>




>

>







 







|
>







659
660
661
662
663
664
665

666
667
668
669
670
671
672
673
674
675
676
677
678
679
680
681
682
683
...
737
738
739
740
741
742
743
744
745
746
747
748
749
750
751
752
    font-weight: normal;
}

/* ******* (Mobile first) Columnar series list styling *******
 */

.column-list {

    margin: 0;
    column-count: 2;
    column-width: 16ch;
    column-gap: 1ch;
}

@media (min-width: 667px) {
  .column-list {
    column-count: auto;
    margin: 0 auto;
    max-width: 70ch;
  }
}

.column-list div {
    padding-left: 0.25em; /* Keeps some italic descenders inside the box */
    text-align: left;
    break-inside: avoid;
................................................................................
  margin: 0 auto;
  flex-shrink: 0;
}

@media (min-width: 667px) {
  footer#main {
    text-align: center;
    width: calc(100% - 4vw);
    padding: 0 2vw 1rem 2vw;
    background: linear-gradient(◊color-background 5%, #dedede 100%);
  }
}

footer#main p.title {
  font-size: 1rem;
  font-feature-settings: "smcp" on;