@enact/sandstone/ActionGuide/ActionGuide.module.css

Large-screen/TV support library for Enact, containing a variety of UI components.

.actionGuide {
  text-align: center;
  max-width: 31.25rem;
  margin: 0 auto;
  line-height: 0;
}
.actionGuide .label {
  font-family: "Sandstone";
  font-size: 1rem;
  height: 1.25rem;
  line-height: 1.25rem;
}
:global(.enact-locale-non-latin) .actionGuide .label {
  font-family: "Sandstone";
  font-size: 1rem;
}
.actionGuide .icon {
  margin: -0.5rem 0 -0.375rem 0;
}
.actionGuide:global(.neutral) .icon {
  color: var(--sand-text-sub-color, #abaeb3);
}
.actionGuide:global(.neutral) .label {
  color: var(--sand-text-sub-color, #abaeb3);
}
:global(.enact-a11y-high-contrast) .actionGuide:global(.neutral):global(.highContrast) .icon {
  color: var(--sand-text-sub-color, #abaeb3);
}
:global(.enact-a11y-high-contrast) .actionGuide:global(.neutral):global(.highContrast) .label {
  color: var(--sand-text-sub-color, #abaeb3);
}
.actionGuide:global(.light) .icon {
  color: var(--sand-text-sub-color, #2e3239);
}
.actionGuide:global(.light) .label {
  color: var(--sand-text-sub-color, #2e3239);
}
.actionGuide:global(.game) .icon {
  color: var(--sand-text-sub-color, #abaeb3);
}
.actionGuide:global(.game) .label {
  color: var(--sand-text-sub-color, #abaeb3);
}
:global(.green) .actionGuide:global(.game) .icon {
  color: var(--sand-text-sub-color, #abaeb3);
}
:global(.green) .actionGuide:global(.game) .label {
  color: var(--sand-text-sub-color, #abaeb3);
}
:global(.orange) .actionGuide:global(.game) .icon {
  color: var(--sand-text-sub-color, #abaeb3);
}
:global(.orange) .actionGuide:global(.game) .label {
  color: var(--sand-text-sub-color, #abaeb3);
}