OOKNET                             [ /  search the index  ]  
──────────────────────────────────────────────────────────────────────────────────────
[ KB ]    [ GIT ]    [ PROJECTS ]    [ ABOUT ]                                      EN
══════════════════════════════════════════════════════════════════════════════════════
OOKNET   [ /  search  ]  
────────────────────────────────────────────────
[ KB ] [ GIT ] [ PROJECTS ] [ ABOUT ]
════════════════════════════════════════════════
 
 
master @ 90 LINES
 
[ HISTORY ]  [ UP ]
 

.masthead {
  position: relative;
}

.masthead-home {
  color: var(--ink);
  text-decoration: none;
  font-weight: 600;

  &:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  &:focus-visible {
    outline: 1px dashed var(--ink);
    outline-offset: 1px;
  }
}

// Inline search input occupies exactly N monospace cells (data-cells)
// so the surrounding ASCII row keeps its alignment. Background and
// border are stripped so the underscore placeholder stands in for the
// usual ──── seat - when the user types, the placeholder is replaced by
// real characters at the same width.
.masthead-search-input {
  font: inherit;
  color: inherit;
  background: transparent;
  border: 0;
  outline: 0;
  padding: 0;
  margin: 0;
  caret-color: currentColor;
  // cell units, not ch - ch resolves against the input's own font
  // metrics and drifts a fraction of a pixel per cell, which is enough
  // to overflow the masthead row by a full cell at 20 cells.
  width: calc(var(--cell-w) * 20);

  &::placeholder {
    color: inherit;
    opacity: 1;
  }

  &:focus-visible {
    outline: 1px dashed currentColor;
    outline-offset: 2px;
  }
}
.frame-narrow .masthead-search-input { width: calc(var(--cell-w) * 18); }

// Results dropdown - positioned beneath the masthead row, aligned with
// the page's content gutter. Hidden until the input has matches.
.masthead-search-results {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--paper);
  border: 1px solid var(--ink);
  z-index: 10;
  max-height: 60vh;
  overflow-y: auto;
  font-family: var(--mono);
  font-size: var(--fs);
  line-height: var(--lh);

  &[hidden] { display: none; }

  li {
    padding: 0.35em 0.8em;
    cursor: pointer;

    &.active,
    &:hover {
      background: var(--ink);
      color: var(--paper);
    }
  }

  a {
    color: inherit;
    text-decoration: none;
    display: block;
  }
}


.masthead {
  position: relative;
}

.masthead-home {
  color: var(--ink);
  text-decoration: none;
  font-weight: 600;

  &:hover {
    text-decoration: underline;
    text-underline-offset: 3px;
  }

  &:focus-visible {
    outline: 1px dashed var(--ink);
    outline-offset: 1px;
  }
}

// Inline search input occupies exactly N mo
nospace cells (data-cells)
// so the surrounding ASCII row keeps its al
ignment. Background and
// border are stripped so the underscore pla
ceholder stands in for the
// usual ──── seat - when the user types, th
e placeholder is replaced by
// real characters at the same width.
.masthead-search-input {
  font: inherit;
  color: inherit;
  background: transparent;
  border: 0;
  outline: 0;
  padding: 0;
  margin: 0;
  caret-color: currentColor;
  // cell units, not ch - ch resolves agains
t the input's own font
  // metrics and drifts a fraction of a pixe
l per cell, which is enough
  // to overflow the masthead row by a full 
cell at 20 cells.
  width: calc(var(--cell-w) * 20);

  &::placeholder {
    color: inherit;
    opacity: 1;
  }

  &:focus-visible {
    outline: 1px dashed currentColor;
    outline-offset: 2px;
  }
}
.frame-narrow .masthead-search-input { width
: calc(var(--cell-w) * 18); }

// Results dropdown - positioned beneath the
 masthead row, aligned with
// the page's content gutter. Hidden until t
he input has matches.
.masthead-search-results {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  background: var(--paper);
  border: 1px solid var(--ink);
  z-index: 10;
  max-height: 60vh;
  overflow-y: auto;
  font-family: var(--mono);
  font-size: var(--fs);
  line-height: var(--lh);

  &[hidden] { display: none; }

  li {
    padding: 0.35em 0.8em;
    cursor: pointer;

    &.active,
    &:hover {
      background: var(--ink);
      color: var(--paper);
    }
  }

  a {
    color: inherit;
    text-decoration: none;
    display: block;
  }
}

 
──────────────────────────────────────────────────────────────────────────────────────
OOKNET
────────────────────────────────────────────────
OOKNET