shoelace-rails-ui 0.1.0

data/remote-src/2.0.0.beta64/shoelace-next/docs/assets/styles/docs.css

@@ -0,0 +1,642 @@
+html {
+  box-sizing: border-box;
+}
+
+*,
+*:before,
+*:after {
+  box-sizing: inherit;
+}
+
+body {
+  font-family: var(--sl-font-sans);
+  font-size: var(--sl-font-size-medium);
+  font-weight: var(--sl-font-weight-normal);
+  letter-spacing: var(--sl-letter-spacing-normal);
+  background-color: var(--sl-color-neutral-0);
+  color: var(--sl-color-neutral-900);
+  line-height: var(--sl-line-height-normal);
+}
+
+a {
+  color: var(--sl-color-primary-600);
+}
+
+a:hover {
+  color: var(--sl-color-primary-700);
+}
+
+strong {
+  font-weight: var(--sl-font-weight-bold);
+}
+
+/* Sidebar */
+.sidebar {
+  background-color: var(--sl-color-neutral-0);
+  border-right: solid 1px var(--sl-color-neutral-200);
+}
+
+.sidebar .app-name {
+  padding: 0 1.5rem;
+}
+
+.sidebar-version {
+  font-size: var(--sl-font-size-x-small);
+  font-weight: var(--sl-font-weight-normal);
+  color: var(--sl-color-neutral-500);
+  text-align: right;
+  padding: 0 var(--sl-spacing-small);
+  margin: -1.25rem 0 0.6rem 0;
+}
+
+.sidebar-buttons {
+  text-align: center;
+  margin-top: 0;
+}
+
+/* Sidebar toggle */
+.sidebar-toggle {
+  top: 0.25rem;
+  left: 0.25rem;
+  width: 2rem;
+  height: 2rem;
+  border-radius: var(--sl-border-radius-medium);
+  background-color: var(--sl-color-neutral-0);
+  padding: 0.5rem;
+}
+
+.sidebar-toggle:hover .sidebar-toggle-button {
+  opacity: 1;
+}
+
+.sidebar-toggle:active .sidebar-toggle-button span {
+  background-color: var(--sl-color-primary-600);
+}
+
+.sidebar-toggle:focus {
+  outline: none;
+  box-shadow: var(--sl-focus-ring);
+}
+
+.sidebar-toggle span:last-child {
+  margin-bottom: 0;
+}
+
+@media screen and (max-width: 768px) {
+  body.close .sidebar-toggle {
+    width: 2rem;
+    background: none;
+    padding: 0.5rem;
+  }
+}
+
+/* Sidebar nav */
+.sidebar-nav {
+  padding: 0 1rem;
+}
+
+.sidebar-nav li {
+  line-height: 1;
+  padding: 0;
+}
+
+.sidebar-nav a {
+  color: inherit;
+  text-decoration: none;
+  line-height: 1.5em;
+  padding-top: 0.25em;
+  padding-bottom: 0.25em;
+}
+
+.sidebar-nav li.collapse > a,
+.sidebar-nav li.active > a {
+  color: var(--sl-color-primary-600);
+}
+
+.sidebar li > p {
+  font-weight: var(--sl-font-weight-bold);
+  border-bottom: solid 1px var(--sl-color-neutral-200);
+  margin: 0 0.75rem 0.5rem 0;
+}
+
+.sidebar ul li ul {
+  padding-left: 0.5rem;
+  margin: 0 0.75rem 1.5rem 0;
+}
+
+.sidebar ul ul ul {
+  padding: 0;
+  margin: 0 0 0 0.5rem;
+}
+
+.sidebar ul ul ul li {
+  list-style: disc;
+  margin-left: 1.5rem;
+}
+
+/* Splash */
+.splash {
+  display: flex;
+  padding-top: 2rem;
+}
+
+.splash-start {
+  min-width: 420px;
+}
+
+.splash-end {
+  display: flex;
+  align-items: flex-end;
+  width: auto;
+  padding-left: 1rem;
+}
+
+.splash-image {
+  width: 100%;
+  height: auto;
+}
+
+.splash-logo {
+  max-width: 22rem;
+}
+
+.markdown-section .splash-start h1:first-of-type {
+  font-size: var(--sl-font-size-large);
+  margin: 0 0 0.5rem 0;
+}
+
+@media screen and (max-width: 1040px) {
+  .splash {
+    display: block;
+  }
+
+  .splash-start {
+    min-width: 0;
+    padding-bottom: 1rem;
+  }
+
+  .splash-end {
+    padding: 0;
+  }
+
+  .splash-image {
+    display: block;
+    max-width: 400px;
+  }
+
+  /* Shields */
+  .splash + p {
+    margin-top: 2rem;
+  }
+}
+
+/* Content */
+.content {
+  padding-top: 0;
+}
+
+.markdown-section {
+  max-width: 860px;
+}
+
+.anchor span {
+  color: var(--sl-color-neutral-1000);
+}
+
+.markdown-section blockquote {
+  position: relative;
+  border-left: solid 4px var(--sl-color-neutral-200);
+  font-style: italic;
+  padding: 1rem 1.5rem;
+  margin: 0 0 1rem 0;
+}
+
+.markdown-section blockquote p:first-child {
+  margin-top: 0;
+}
+
+.markdown-section blockquote p:last-child {
+  margin-bottom: 0;
+}
+
+.markdown-section ul {
+  padding: 0 0 0 1.5rem;
+  margin: 0 0 1rem 0;
+}
+
+.markdown-section ul ul {
+  margin-bottom: 0;
+}
+
+.docsify-pagination-container {
+  border-top-color: var(--sl-color-neutral-200) !important;
+}
+
+.pagination-item-label,
+.pagination-item-subtitle,
+.pagination-item-title {
+  opacity: 1 !important;
+}
+
+.markdown-section h1,
+.markdown-section h2,
+.markdown-section h3,
+.markdown-section h4,
+.markdown-section h5,
+.markdown-section h6 {
+  font-weight: var(--sl-font-weight-normal);
+  margin: 0 0 1em 0;
+}
+
+.markdown-section h1 {
+  font-size: var(--sl-font-size-2x-large);
+}
+
+.markdown-section h2 {
+  font-size: var(--sl-font-size-x-large);
+  border-bottom: solid 1px var(--sl-color-neutral-200);
+  margin-top: 2rem;
+}
+
+.markdown-section h3 {
+  font-size: var(--sl-font-size-large);
+}
+
+.markdown-section h4 {
+  font-size: var(--sl-font-size-medium);
+}
+
+.markdown-section h5 {
+  font-size: var(--sl-font-size-small);
+}
+
+.markdown-section h6 {
+  font-size: var(--sl-font-size-x-small);
+}
+
+.markdown-section pre {
+  font-family: var(--sl-font-mono);
+}
+
+.markdown-section h1:first-of-type {
+  margin-bottom: 0;
+}
+
+.markdown-section code {
+  font-family: var(--sl-font-mono);
+  font-size: 87.5%;
+  background-color: var(--sl-color-neutral-50);
+  border-radius: var(--sl-border-radius-small);
+  padding: 2px 4px;
+}
+
+.markdown-section tr:nth-child(2n) code {
+  background-color: var(--sl-color-neutral-100);
+}
+
+kbd,
+.markdown-section kbd {
+  font-family: var(--sl-font-mono);
+  font-size: 87.5%;
+  background-color: var(--sl-color-neutral-50);
+  border-radius: var(--sl-border-radius-small);
+  border: solid 1px var(--sl-color-neutral-200);
+  box-shadow: inset 0 1px 0 var(--sl-color-neutral-0);
+  padding: 2px 5px;
+}
+
+/* Code blocks */
+.markdown-section pre {
+  position: relative;
+  background-color: var(--sl-color-neutral-50);
+  border-radius: var(--sl-border-radius-medium);
+}
+
+.markdown-section pre > code {
+  display: block;
+  background: none;
+  border-radius: 0;
+  color: var(--sl-color-neutral-800);
+  padding: var(--sl-spacing-medium);
+  overflow: auto;
+  hyphens: none;
+  tab-size: 2;
+}
+
+.markdown-section pre .token.comment {
+  color: var(--sl-color-neutral-500);
+}
+
+.markdown-section pre .token.prolog,
+.markdown-section pre .token.doctype,
+.markdown-section pre .token.cdata,
+.markdown-section pre .token.operator {
+  color: var(--sl-color-neutral-600);
+}
+
+.markdown-section pre .token.punctuation {
+  color: var(--sl-color-neutral-600);
+}
+
+.namespace {
+  opacity: 0.7;
+}
+
+.markdown-section pre .token.property,
+.markdown-section pre .token.keyword,
+.markdown-section pre .token.tag,
+.markdown-section pre .token.url {
+  color: var(--sl-color-blue-600);
+}
+
+.markdown-section pre .token.symbol,
+.markdown-section pre .token.deleted {
+  color: var(--sl-color-pink-600);
+}
+
+.markdown-section pre .token.boolean,
+.markdown-section pre .token.constant,
+.markdown-section pre .token.selector,
+.markdown-section pre .token.attr-name,
+.markdown-section pre .token.string,
+.markdown-section pre .token.char,
+.markdown-section pre .token.builtin,
+.markdown-section pre .token.inserted {
+  color: var(--sl-color-emerald-600);
+}
+
+.markdown-section pre .token.atrule,
+.markdown-section pre .token.attr-value,
+.markdown-section pre .token.number,
+.markdown-section pre .token.variable {
+  color: var(--sl-color-violet-700);
+}
+
+.markdown-section pre .token.function,
+.markdown-section pre .token.class-name,
+.markdown-section pre .token.regex {
+  color: var(--sl-color-orange-600);
+}
+
+.markdown-section pre .token.important {
+  color: var(--sl-color-red-600);
+}
+
+.markdown-section pre .token.important,
+.markdown-section pre .token.bold {
+  font-weight: bold;
+}
+
+.markdown-section pre .token.italic {
+  font-style: italic;
+}
+
+/* Tables */
+.table-wrapper {
+  overflow-x: auto;
+}
+
+@media screen and (max-width: 1200px) {
+  .table-wrapper table {
+    min-width: 800px;
+  }
+}
+
+.markdown-section table {
+  display: table;
+  margin-bottom: 1.5rem;
+}
+
+.markdown-section tr {
+  border: none;
+}
+
+.markdown-section tr:nth-child(2n) {
+  background: var(--sl-color-neutral-50);
+}
+
+.markdown-section th {
+  border: none;
+  font-weight: var(--sl-font-weight-semibold);
+  text-align: left;
+}
+
+.markdown-section td {
+  border-top: solid 1px var(--sl-color-neutral-200);
+  border-bottom: solid 1px var(--sl-color-neutral-200);
+  border-left: none;
+  border-right: none;
+}
+
+.markdown-section table .nowrap {
+  white-space: nowrap;
+}
+
+.markdown-section table sl-tooltip code {
+  border-bottom: dashed 1px var(--sl-color-neutral-300);
+  cursor: help;
+}
+
+/* Iframes */
+.markdown-section iframe {
+  border: none;
+}
+
+/* Tips & Warnings */
+.markdown-section p.tip,
+.markdown-section p.warn {
+  position: relative;
+  background-color: var(--sl-color-neutral-50);
+  border-left: solid 4px transparent;
+  border-radius: var(--sl-border-radius-medium);
+  padding-left: 1.5rem;
+}
+
+.markdown-section p.tip:before,
+.markdown-section p.warn:before {
+  content: '!';
+  border-radius: 100%;
+  color: var(--sl-color-neutral-0);
+  font-size: 14px;
+  font-weight: bold;
+  left: -12px;
+  line-height: 20px;
+  position: absolute;
+  height: 20px;
+  width: 20px;
+  text-align: center;
+  top: calc(50% - 10px);
+}
+
+.markdown-section p.warn {
+  border-left-color: var(--sl-color-primary-600);
+}
+
+.markdown-section p.warn:before {
+  background-color: var(--sl-color-primary-600);
+}
+
+.markdown-section p.tip {
+  border-left-color: var(--sl-color-danger-600);
+}
+
+.markdown-section p.tip:before {
+  background-color: var(--sl-color-danger-600);
+}
+
+.markdown-section p.tip code,
+.markdown-section p.warn code {
+  background-color: var(--sl-color-neutral-100);
+}
+
+/* Component headers */
+.component-header {
+  border-bottom: solid 1px var(--sl-color-neutral-200);
+  padding-bottom: 2rem;
+  margin-top: -1rem;
+  margin-bottom: 2rem;
+}
+
+.component-header__tag {
+  border-bottom: none;
+  padding: 0;
+  margin: 0.75rem 0 0.25rem 0;
+}
+
+.markdown-section .component-header__tag code {
+  background: none;
+  color: var(--sl-color-neutral-600);
+  font-size: var(--sl-font-size-large);
+  padding: 0;
+  margin: 0;
+}
+
+.component-header__info {
+  margin-bottom: 0.5rem;
+}
+
+/* Lead sentences that occur immediately after the header */
+.component-header + p {
+  font-size: var(--sl-font-size-large);
+  line-height: 1.6;
+}
+
+/* Repo buttons */
+.repo-button--sponsor sl-icon {
+  color: var(--sl-color-pink-600);
+}
+
+.repo-button--github sl-icon {
+  color: var(--sl-color-neutral-700);
+}
+
+.repo-button--twitter sl-icon {
+  color: var(--sl-color-sky-500);
+}
+
+@media screen and (max-width: 400px) {
+  :not(.sidebar-buttons) > .repo-button {
+    width: 100%;
+    margin-bottom: 1rem;
+  }
+}
+
+body[data-page^='/tokens/'] .table-wrapper td:first-child,
+body[data-page^='/tokens/'] .table-wrapper td:first-child code {
+  white-space: nowrap;
+}
+
+/* Border radius demo */
+.border-radius-demo {
+  width: 3rem;
+  height: 3rem;
+  background: var(--sl-color-primary-600);
+}
+
+/* Transition demo */
+.transition-demo {
+  position: relative;
+  background: var(--sl-color-neutral-200);
+  width: 8rem;
+  height: 2rem;
+}
+
+.transition-demo:after {
+  content: '';
+  position: absolute;
+  background-color: var(--sl-color-primary-600);
+  top: 0;
+  left: 0;
+  width: 0;
+  height: 100%;
+  transition-duration: inherit;
+  transition-property: width;
+}
+
+.transition-demo:hover:after {
+  width: 100%;
+}
+
+/* Spacing demo */
+.spacing-demo {
+  width: 100px;
+  background: var(--sl-color-primary-600);
+}
+
+/* Elevation demo */
+.elevation-demo {
+  background: transparent;
+  border-radius: 3px;
+  width: 4rem;
+  height: 4rem;
+  margin: 1rem;
+}
+
+/* Color palettes */
+.color-palette {
+  display: grid;
+  grid-template-columns: 200px repeat(11, 1fr);
+  gap: 1rem var(--sl-spacing-2x-small);
+  margin: 2rem 0;
+}
+
+.color-palette__name {
+  font-size: var(--sl-font-size-medium);
+  font-weight: var(--sl-font-weight-semibold);
+  grid-template-columns: repeat(11, 1fr);
+}
+
+.color-palette__name code {
+  background: none;
+  font-size: var(--sl-font-size-x-small);
+}
+
+.color-palette__example {
+  font-size: var(--sl-font-size-x-small);
+  text-align: center;
+}
+
+.color-palette__swatch {
+  height: 3rem;
+  border-radius: var(--sl-border-radius-small);
+}
+
+.color-palette__swatch--border {
+  box-shadow: inset 0 0 0 1px var(--sl-color-neutral-300);
+}
+
+@media screen and (max-width: 1200px) {
+  .color-palette {
+    grid-template-columns: repeat(6, 1fr);
+  }
+
+  .color-palette__name {
+    grid-column-start: span 6;
+  }
+}
+
+.not-found-image {
+  display: block;
+  max-width: 460px;
+  margin: 2rem 0;
+}