headline/view/static/main.css

/* layer: preflights */
*,::before,::after{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-ring-offset-shadow:0 0 rgba(0,0,0,0);--un-ring-shadow:0 0 rgba(0,0,0,0);--un-shadow-inset: ;--un-shadow:0 0 rgba(0,0,0,0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,0.5);}::backdrop{--un-rotate:0;--un-rotate-x:0;--un-rotate-y:0;--un-rotate-z:0;--un-scale-x:1;--un-scale-y:1;--un-scale-z:1;--un-skew-x:0;--un-skew-y:0;--un-translate-x:0;--un-translate-y:0;--un-translate-z:0;--un-ring-offset-shadow:0 0 rgba(0,0,0,0);--un-ring-shadow:0 0 rgba(0,0,0,0);--un-shadow-inset: ;--un-shadow:0 0 rgba(0,0,0,0);--un-ring-inset: ;--un-ring-offset-width:0px;--un-ring-offset-color:#fff;--un-ring-width:0px;--un-ring-color:rgba(147,197,253,0.5);}

  /* This file is dynamically generated. Do not edit this file. */

  :root {
    --color-border: hsl(0 0% 80% / 60%);
  }

  html {
    box-sizing: border-box;
    font-family: system-ui, sans-serif;
  }

  body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    line-height: 1.5;
    background-color: #f9fafb;
  }

  *,
  *::before,
  *::after {
    box-sizing: inherit;
    border-width: 0;
    border-style: solid;
    border-color: var(--color-border);
  }

  * {
    margin: 0;
  }

  body {
    line-height: 1.5;
  }

  img,
  picture,
  video,
  canvas,
  svg {
    display: block;
    max-width: 100%;
  }

  input,
  button,
  textarea,
  select {
    font: inherit;
  }

  p,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6 {
    overflow-wrap: break-word;
    font-size: inherit;
    font-weight: inherit;
  }

  table,
  th,
  tr,
  td {
    text-align: inherit;
    border-collapse: collapse;
  }

  a {
    color: #2563eb;
    font-weight: 500;
    text-decoration: none;
    transition: color 120ms;
  }

  a:hover {
    color: #1e40af;
  }

  ins {
    background-color: hsl(120 100% 95%);
    text-decoration-color: hsl(120 50% 75% / 50%);
  }

  del {
    background-color: hsl(0 100% 95%);
    text-decoration-color: hsl(0 50% 40% / 50%);
  }

  .diff-before ins {
    display: none;
  }

  .diff-after del {
    display: none;
  }

  /* Forms */

  .text-input {
    border-radius: 0.25rem;
    border: 1px solid var(--color-border);
    padding: 0.375rem 0.75rem;
    transition: border-color 120ms, box-shadow 120ms;
  }

  .text-input:focus {
    border-color: #3b82f6;
    box-shadow: 0 0 0 2px #3b82f6;
    outline: none;
  }

  .checkbox {
    font-size: 0.875rem;
    line-height: 1.25rem;
    display: flex;
    align-items: center;
    color: #6b7280;
    font-weight: 500;
    cursor: pointer;
  }

  .checkbox input {
    margin-right: 0.5rem;
  }

  .button {
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    gap: 0.5em;
    border-radius: 0.25rem;
    border: 1px solid var(--color-border);
    background: #f3f4f6;
    transition: background-color 120ms;
    color: #4b5563;
  }

  .button-md {
    font-size: 0.9em;
    line-height: 1.5rem;
    font-weight: 500;
    padding: 0.375rem 0.75rem;
  }

  .button:not(:disabled) {
    cursor: pointer;
  }

  .button:not(:disabled):hover {
    background: hsl(0 0% 90%);
  }

  /* Pagination */

  .pagination {
    list-style-type: none;
    padding: 0;
    display: flex;
  }

  .page-link {
    display: block;
    padding: 0.5em 1em;
    text-decoration: none;
    color: inherit;
  }

  .page-item {
    border: 1px solid var(--color-border);
    background: #f3f4f6;
    transition: background-color 120ms;
    color: #4b5563;
    font-weight: 500;
    font-size: 0.85em;
    line-height: 1.5rem;
  }

  .page-item a {
    color: inherit;
  }

  .page-item:not(.active):hover {
    background: #e5e7eb;
  }

  .page-item:first-of-type {
    border-radius: 0.25rem 0 0 0.25rem;
  }

  .page-item:last-of-type {
    border-radius: 0 0.25rem 0.25rem 0;
  }

  .page-item:not(:last-of-type) {
    border-right-width: 0px;
  }

  .page-item.active {
    background-color: #2563eb;
    color: white;
    border-color: transparent;
  }

  .prose p:not(:last-of-type) {
    margin-bottom: 1rem;
  }

  /* Misc components */

  .card {
    border: 1px solid var(--color-border);
    border-radius: 0.5rem;
    background-color: white;
    box-shadow: 0 2px 0 #e5e7eb;
    overflow: hidden;
  }

  .table-styled td,
  .table-styled th {
    padding: 0.5rem 0.5rem;
  }

  .table-styled tr:not(:last-child),
  .table-styled thead tr {
    border-bottom-width: 1px;
  }

/* layer: shortcuts */
.container{padding-left:1rem;padding-right:1rem;margin-left:auto;margin-right:auto;max-width:1200px;}
.action-link{font-size:0.875rem;line-height:1.25rem;font-weight:500;--un-text-opacity:1;color:rgba(107,114,128,var(--un-text-opacity));display:inline-flex;gap:0.375rem;align-items:center;}
.text-caption{font-size:0.875rem;line-height:1.25rem;font-weight:500;--un-text-opacity:1;color:rgba(107,114,128,var(--un-text-opacity));}
.text-muted{--un-text-opacity:1;color:rgba(107,114,128,var(--un-text-opacity));}
.action-link:hover{--un-text-opacity:1;color:rgba(29,78,216,var(--un-text-opacity));}
/* layer: default */
.p-0{padding:0;}
.px-4{padding-left:1rem;padding-right:1rem;}
.px-5{padding-left:1.25rem;padding-right:1.25rem;}
.py-3{padding-top:0.75rem;padding-bottom:0.75rem;}
.py-4{padding-top:1rem;padding-bottom:1rem;}
.py-6{padding-top:1.5rem;padding-bottom:1.5rem;}
.pr-2{padding-right:0.5rem;}
.my-6{margin-top:1.5rem;margin-bottom:1.5rem;}
.mb-2{margin-bottom:0.5rem;}
.mb-3{margin-bottom:0.75rem;}
.mb-4{margin-bottom:1rem;}
.mb-6{margin-bottom:1.5rem;}
.mb-8{margin-bottom:2rem;}
.mb-auto{margin-bottom:auto;}
.mt-12{margin-top:3rem;}
.block{display:block;}
.display-none,
.hidden{display:none;}
.bg-white{--un-bg-opacity:1;background-color:rgba(255,255,255,var(--un-bg-opacity));}
.fill-current{fill:currentColor;}
.border-b{border-bottom-width:1px;}
.text-2xl{font-size:1.5rem;line-height:2rem;}
.text-4xl{font-size:2.25rem;line-height:2.5rem;}
.text-lg{font-size:1.125rem;line-height:1.75rem;}
.text-sm{font-size:0.875rem;line-height:1.25rem;}
.text-xl{font-size:1.25rem;line-height:1.75rem;}
.font-bold{font-weight:700;}
.font-medium{font-weight:500;}
.text-gray-200{--un-text-opacity:1;color:rgba(229,231,235,var(--un-text-opacity));}
.text-gray-400{--un-text-opacity:1;color:rgba(156,163,175,var(--un-text-opacity));}
.text-gray-500{--un-text-opacity:1;color:rgba(107,114,128,var(--un-text-opacity));}
.hover\:text-gray-600:hover{--un-text-opacity:1;color:rgba(75,85,99,var(--un-text-opacity));}
.text-inherit{color:inherit;}
.flex{display:flex;}
.shrink-0{flex-shrink:0;}
.flex-wrap{flex-wrap:wrap;}
.gap-2{gap:0.5rem;}
.gap-x-2{column-gap:0.5rem;}
.gap-x-4{column-gap:1rem;}
.gap-x-6{column-gap:1.5rem;}
.gap-x-8{column-gap:2rem;}
.gap-y-2{row-gap:0.5rem;}
.sticky{position:sticky;}
.static{position:static;}
.max-w-20rem{max-width:20rem;}
.max-w-800px{max-width:800px;}
.w-4{width:1rem;}
.w-full{width:100%;}
.overflow-x-auto{overflow-x:auto;}
.items-center{align-items:center;}
.top-0{top:0;}
.z-10{z-index:10;}
.transition-color{transition-property:color;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms;}
@media (min-width: 768px){
.md\:hidden{display:none;}
.md\:display-table{display:table;}
}