@schalkneethling/miyagi-core 4.4.2 → 4.4.3

package/frontend/assets/css/iframe/styleguide/colors.css

@@ -1,61 +1,61 @@
 .Colors {
-	display: grid;
-	grid-template-columns: repeat(auto-fill, minmax(14em, 1fr));
-	gap: 3em;
+  display: grid;
+  grid-template-columns: repeat(auto-fill, minmax(14em, 1fr));
+  gap: 3em;
 }
 
 .Colors-button {
-	--size: 3em;
+  --size: 3em;
 
-	display: flex;
-	flex-wrap: wrap;
+  display: flex;
+  flex-wrap: wrap;
 }
 
 .Colors-button::before,
 .Colors-button::after {
-	display: block;
+  display: block;
 }
 
 .Colors--all .Colors-button::before {
-	margin-inline-end: 10px;
-	width: var(--size);
+  margin-inline-end: 10px;
+  width: var(--size);
 }
 
 .Colors--all .Colors-button::before,
 .Colors--decoration .Colors-button::before {
-	height: var(--size);
-	background: var(--color);
-	border: 1px solid var(--backdrop, transparent);
-	content: "";
-	order: -1;
+  height: var(--size);
+  background: var(--color);
+  border: 1px solid var(--backdrop, transparent);
+  content: "";
+  order: -1;
 }
 
 .Colors--decoration .Colors-button::before {
-	width: 100%;
+  width: 100%;
 }
 
 .Colors--all .Colors-button::after,
 .Colors--typo .Colors-button::after {
-	font-size: var(--size);
-	color: var(--color);
-	font-weight: bold;
-	order: -1;
-	/* stylelint-disable */
-	-webkit-text-stroke: 1px var(--backdrop, transparent);
-	text-stroke: 1px var(--backdrop, transparent);
-	/* stylelint-enable */
+  font-size: var(--size);
+  color: var(--color);
+  font-weight: bold;
+  order: -1;
+  /* stylelint-disable */
+  -webkit-text-stroke: 1px var(--backdrop, transparent);
+  text-stroke: 1px var(--backdrop, transparent);
+  /* stylelint-enable */
 }
 
 .Colors--all .Colors-button::after {
-	content: "Aa";
+  content: "Aa";
 }
 
 .Colors--typo .Colors-button::after {
-	content: "AaBbCc";
+  content: "AaBbCc";
 }
 
 .Colors-prop,
 .Colors-value {
-	flex: 1 0 100%;
-	margin: 10px 0 0;
+  flex: 1 0 100%;
+  margin: 10px 0 0;
 }

package/frontend/assets/css/iframe/styleguide/fonts.css

@@ -1,37 +1,37 @@
 .Fonts-item:not(:first-child) {
-	margin-top: 3em;
+  margin-top: 3em;
 }
 
 .Fonts-button {
-	color: inherit;
+  color: inherit;
 }
 
 .Fonts-button::before {
-	content: "The quick brown fox jumps over the lazy dog";
-	font-family: var(--font-family);
-	font-feature-settings: var(--font-feature-settings);
-	font-kerning: var(--font-kerning);
-	font-size-adjust: var(--font-size-adjust);
-	font-size: var(--font-size);
-	font-stretch: var(--font-stretch);
-	font-style: var(--font-style);
-	font-variant: var(--font-variant);
-	font-variant-caps: var(--font-variant-caps);
-	font-weight: var(--font-weight);
-	letter-spacing: var(--letter-spacing);
-	line-height: var(--line-height);
-	text-shadow: var(--text-shadow);
-	text-transform: var(--text-transform);
+  content: "The quick brown fox jumps over the lazy dog";
+  font-family: var(--font-family);
+  font-feature-settings: var(--font-feature-settings);
+  font-kerning: var(--font-kerning);
+  font-size-adjust: var(--font-size-adjust);
+  font-size: var(--font-size);
+  font-stretch: var(--font-stretch);
+  font-style: var(--font-style);
+  font-variant: var(--font-variant);
+  font-variant-caps: var(--font-variant-caps);
+  font-weight: var(--font-weight);
+  letter-spacing: var(--letter-spacing);
+  line-height: var(--line-height);
+  text-shadow: var(--text-shadow);
+  text-transform: var(--text-transform);
 }
 
 .Fonts-details {
-	display: flex;
-	padding: 0;
-	list-style: none;
+  display: flex;
+  padding: 0;
+  list-style: none;
 }
 
 .Fonts-details > li:not(:last-child) {
-	margin-inline-end: 0.5em;
-	padding-inline-end: 0.5em;
-	border-inline-end: 0.0625rem solid currentcolor;
+  margin-inline-end: 0.5em;
+  padding-inline-end: 0.5em;
+  border-inline-end: 0.0625rem solid currentcolor;
 }

package/frontend/assets/css/iframe/styleguide/index.css

@@ -3,107 +3,107 @@
 @import url("./spacings.css");
 
 .CustomPropsGroup {
-	list-style: none;
-	margin: 3em 0;
-	padding: 0;
+  list-style: none;
+  margin: 3em 0;
+  padding: 0;
 }
 
 .CustomProp {
-	position: relative;
-	border: 0.0625rem solid transparent;
+  position: relative;
+  border: 0.0625rem solid transparent;
 }
 
 .CustomProp[aria-selected="true"] {
-	position: relative;
+  position: relative;
 }
 
 .CustomProp-prop {
-	display: block;
-	margin: 10px 0 0;
-	word-break: break-all;
+  display: block;
+  margin: 10px 0 0;
+  word-break: break-all;
 }
 
 .CustomProp-button {
-	background: none;
-	border: none;
-	appearance: none;
-	font: inherit;
-	width: fit-content;
-	padding: 0;
-	text-align: start;
+  background: none;
+  border: none;
+  appearance: none;
+  font: inherit;
+  width: fit-content;
+  padding: 0;
+  text-align: start;
 }
 
 .CustomProp-button:focus {
-	outline: none;
+  outline: none;
 }
 
 .CustomProp-button:not([aria-expanded="true"]):hover .CustomProp-prop,
 .CustomProp-button:not([aria-expanded="true"]):focus .CustomProp-prop {
-	text-decoration: underline;
+  text-decoration: underline;
 }
 
 .CustomProp-details {
-	position: absolute;
-	bottom: calc(100% + 15px);
-	inset-inline-start: 0;
-	padding: 15px;
-	margin: 0;
-	z-index: 1;
-	background: var(--color-Tooltip-background);
-	box-shadow: 0 4px 10px rgb(0 0 0 / 10%);
-	outline: 0.0625rem solid var(--color-Tooltip-outline);
-	box-sizing: border-box;
-	font-size: 14px;
-	display: none;
-	grid-template-columns: fit-content(50%) 1fr;
-	gap: 0.5rem 1rem;
-	line-height: 1.5;
-	white-space: nowrap;
+  position: absolute;
+  bottom: calc(100% + 15px);
+  inset-inline-start: 0;
+  padding: 15px;
+  margin: 0;
+  z-index: 1;
+  background: var(--color-Tooltip-background);
+  box-shadow: 0 4px 10px rgb(0 0 0 / 10%);
+  outline: 0.0625rem solid var(--color-Tooltip-outline);
+  box-sizing: border-box;
+  font-size: 14px;
+  display: none;
+  grid-template-columns: fit-content(50%) 1fr;
+  gap: 0.5rem 1rem;
+  line-height: 1.5;
+  white-space: nowrap;
 }
 
 @keyframes fadeIn {
-	from {
-		opacity: 0;
-		transform: translateY(10px);
-	}
-
-	to {
-		opacity: 1;
-		transform: translateY(0);
-	}
+  from {
+    opacity: 0;
+    transform: translateY(10px);
+  }
+
+  to {
+    opacity: 1;
+    transform: translateY(0);
+  }
 }
 
 .CustomProp-details:not([hidden]),
 .CustomProp-button:hover + .CustomProp-details {
-	display: grid;
-	animation: fadeIn 0.15s ease;
+  display: grid;
+  animation: fadeIn 0.15s ease;
 }
 
 .CustomProp-details::before,
 .CustomProp-details::after {
-	content: "";
-	display: block;
-	position: absolute;
-	inset-inline-start: 15px;
-	width: 0;
-	height: 0;
-	border: 10px solid transparent;
+  content: "";
+  display: block;
+  position: absolute;
+  inset-inline-start: 15px;
+  width: 0;
+  height: 0;
+  border: 10px solid transparent;
 }
 
 .CustomProp-details::before {
-	border-top-color: var(--color-Tooltip-outline);
-	top: 100%;
+  border-top-color: var(--color-Tooltip-outline);
+  top: 100%;
 }
 
 .CustomProp-details::after {
-	border-top-color: var(--color-Tooltip-background);
-	top: calc(100% - 2px);
+  border-top-color: var(--color-Tooltip-background);
+  top: calc(100% - 2px);
 }
 
 .CustomProp-detailsProperty {
-	font-weight: 600;
+  font-weight: 600;
 }
 
 .CustomProp-detailsValue {
-	margin: 0;
+  margin: 0;
 }

package/frontend/assets/css/iframe/styleguide/spacings.css

@@ -1,21 +1,21 @@
 .Spacings {
-	display: flex;
-	flex-direction: column;
-	align-items: flex-start;
+  display: flex;
+  flex-direction: column;
+  align-items: flex-start;
 }
 
 .Spacings-item:not(:first-child) {
-	margin-top: 3em;
+  margin-top: 3em;
 }
 
 .Spacings-button {
-	color: inherit;
+  color: inherit;
 }
 
 .Spacings-button::before {
-	height: var(--spacing);
-	width: var(--spacing);
-	background: currentcolor;
-	content: "";
-	display: block;
+  height: var(--spacing);
+  width: var(--spacing);
+  background: currentcolor;
+  content: "";
+  display: block;
 }