diff --git a/styleguide/assets/style/merch.css b/styleguide/assets/style/merch.css index 596f1a4..13d81f3 100644 --- a/styleguide/assets/style/merch.css +++ b/styleguide/assets/style/merch.css @@ -4,6 +4,10 @@ main { overflow: auto; padding: 0 1rem; } +main > div#intro { + position: sticky; + left: 0; +} .table-container { overflow-x: auto; diff --git a/styleguide/assets/style/merch.css.map b/styleguide/assets/style/merch.css.map index 2ef7aaa..64a5f99 100644 --- a/styleguide/assets/style/merch.css.map +++ b/styleguide/assets/style/merch.css.map @@ -1 +1 @@ -{"version":3,"sourceRoot":"","sources":["merch.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;;AAGF;EAKE;;AAJA;EACE;;AAKF;EACE;;AAKN;EACE;;AAEA;EACE;;AAGF;EACE;;AAIJ;AAAA;AAAA;EAGE;;AAGF;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;EACE;;AAKF;EACE;;AAEA;EACE;;AAGF;EACE;;AAEA;EACE;;AAGF;EACE;;AAKF;EACE;;AAGF;EACE;;AAGF;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;;AAGF;EACE;AACA;EACA;EACA;EACA;EACA;EACA;;;AAMR;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE","file":"merch.css"} \ No newline at end of file +{"version":3,"sourceRoot":"","sources":["merch.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;;AAIJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;;AAIJ;EACE;EACA;;AAGF;EAKE;;AAJA;EACE;;AAKF;EACE;;AAKN;EACE;;AAEA;EACE;;AAGF;EACE;;AAIJ;AAAA;AAAA;EAGE;;AAGF;AAAA;EAEE;EACA;EACA;;AAEA;AAAA;EACE;;AAKF;EACE;;AAEA;EACE;;AAGF;EACE;;AAEA;EACE;;AAGF;EACE;;AAKF;EACE;;AAGF;EACE;;AAGF;EACE;;AAIJ;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAKF;EACE;;AAGF;EACE;AACA;EACA;EACA;EACA;EACA;EACA;;;AAMR;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE","file":"merch.css"} \ No newline at end of file diff --git a/styleguide/assets/style/merch.scss b/styleguide/assets/style/merch.scss index 4443422..cac7816 100644 --- a/styleguide/assets/style/merch.scss +++ b/styleguide/assets/style/merch.scss @@ -3,6 +3,11 @@ main { height: 100vh; overflow: auto; padding: 0 1rem; + + > div#intro { + position: sticky; + left: 0; + } } .table-container { diff --git a/styleguide/merch/de/index.html b/styleguide/merch/de/index.html index 68a3adb..d8e7cff 100644 --- a/styleguide/merch/de/index.html +++ b/styleguide/merch/de/index.html @@ -11,81 +11,89 @@ -
-

Merch Grössenvergleich

-
-
-

Unten findest du eine Größen-Tabelle mit Größen und Maßen an Merchandise-Kleidung von diesem und - vergangenen Chaos Veranstaltungen. Die Tabelle soll dabei helfen, passende Kleidungsstücke zu - wählen, basierend auf sich bereits im Besitz befindender Kleidung vergangener Veranstaltungen. Dabei - basieren alle Angaben auf den Spezifikationen der jeweiligen Kleidungshersteller. Stücke haben - außerdem verschiedene Stoffe mit unterschiedlicher Elastizität (sprich Dehnbarkeit). D. h. es kann - zu Unstimmigkeiten kommen im Bezug auf die reale Passform.

-

Für jedes Kleidungsstück sind zwei oder drei Arten an Maße angegeben. Die Bedeutung ist einerseits in - der schematischen Darstellung ablesbar, oder im Folgenden erklärt:

-
    -
  • A – Brust: gemessen ca. 2.5 cm unter den Achseln, über die Breite des (flachen) - Torsos.
    • -
  • B – Länge: Distanz von der Oberseite der Schultern bis ganz nach unten.
    • -
  • C – Ärmel: Bei der Naht zwischen Ärmel und Torso, vom obersten Punkt bis zum Ende - des Armes gemessen.
    • -
-

Du kannst jede Zelle, die einen Wert enthält, anklicken, um zu sehen, wie stark die Maße (A, B und C) - der verschiedenen Größen jedes Kleidungsstückes von dem ausgewählten abweichen. Du kannst außerdem - bei Bedarf nur die Differenzen für ein bestimmtes Maß (z. B. nur A) anzeigen lassen, indem du bei - einer Größe ein zweites Mal klickst, diesmal in der jeweiligen Zeile des Maßes.

+
+

Merch Grössenvergleich

+
+
+

Unten findest du eine Größen-Tabelle mit Größen und Maßen an Merchandise-Kleidung von diesem und + vergangenen Chaos Veranstaltungen. Die Tabelle soll dabei helfen, passende Kleidungsstücke zu + wählen, basierend auf sich bereits im Besitz befindender Kleidung vergangener Veranstaltungen. + Dabei basieren alle Angaben auf den Spezifikationen der jeweiligen Kleidungshersteller. Stücke + haben außerdem verschiedene Stoffe mit unterschiedlicher Elastizität (sprich Dehnbarkeit). D. h. + es kann zu Unstimmigkeiten kommen im Bezug auf die reale Passform.

+

Für jedes Kleidungsstück sind zwei oder drei Arten an Maße angegeben. Die Bedeutung ist + einerseits in + der schematischen Darstellung ablesbar, oder im Folgenden erklärt:

+
    +
  • + A – Brust: gemessen ca. 2.5 cm unter den Achseln, über die Breite des (flachen) + Torsos. +
    • +
  • + B – Länge: Distanz von der Oberseite der Schultern bis ganz nach unten. +
    • +
  • + C – Ärmel: Bei der Naht zwischen Ärmel und Torso, vom obersten Punkt bis zum + Ende des Armes gemessen. +
    • +
+

Du kannst jede Zelle, die einen Wert enthält, anklicken, um zu sehen, wie stark die Maße (A, B + und C) der verschiedenen Größen jedes Kleidungsstückes von dem ausgewählten abweichen. Du kannst + außerdem bei Bedarf nur die Differenzen für ein bestimmtes Maß (z. B. nur A) anzeigen lassen, + indem du bei einer Größe ein zweites Mal klickst, diesmal in der jeweiligen Zeile des Maßes.

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
- - - - - - - - - - - - - - - - - - - - - - - - - - -
-
-
-
diff --git a/styleguide/merch/en/index.html b/styleguide/merch/en/index.html index 2024ff5..ec2e507 100644 --- a/styleguide/merch/en/index.html +++ b/styleguide/merch/en/index.html @@ -11,80 +11,88 @@ -
-

Merch Size Comparison

-
-
-

Below you will find a table of sizes and measurements of merchandise clothing from this and past - chaos events. It is meant to guide in choosing a fitting piece of clothing based on owned pieces - from previous events. All values are based on the respective manufacturer's specifications and - different fabrics vary in elasticity (i. e. how stretchy they are), so there might be some - discrepancies regarding the actual fit.

-

For each piece of clothing there are two or three types of measurements. You can use the schematic or - read below to determine what each of them means:

-
    -
  • A – chest: measured roughly 2.5 cm below the armpits over the breadth of the - (flattend) torso.
    • -
  • B – length: distance from the top of the shoulders all the way down.
    • -
  • C – sleeve: starting at the seam connecting the sleeve and torso, measured from the - top-most point down to the end of the arm.
    • -
-

You can click on any cell holding a value to see how much the other pieces of clothing's sizes - deviate from the selected one's size in each measurement (A, B and C). You can also opt to only show - the deviation for a specific measurement by clicking again on the respective measurement's value. -

+
+

Merch Size Comparison

+
+
+

Below you will find a table of sizes and measurements of merchandise clothing from this and past + chaos events. It is meant to guide in choosing a fitting piece of clothing based on owned pieces + from previous events. All values are based on the respective manufacturer's specifications and + different fabrics vary in elasticity (i. e. how stretchy they are), so there might be some + discrepancies regarding the actual fit.

+

For each piece of clothing there are two or three types of measurements. You can use the + schematic or read below to determine what each of them means:

+
    +
  • + A – chest: measured roughly 2.5 cm below the armpits over the breadth of the + (flattend) torso. +
    • +
  • + B – length: distance from the top of the shoulders all the way down. +
    • +
  • + C – sleeve: starting at the seam connecting the sleeve and torso, measured from + the top-most point down to the end of the arm. +
    • +
+

You can click on any cell holding a value to see how much the other pieces of clothing's sizes + deviate from the selected one's size in each measurement (A, B and C). You can also opt to only + show the deviation for a specific measurement by clicking again on the respective measurement's + value. +

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+
- - - - - - - - - - - - - - - - - - - - - - - - - - -
-
-
-