resume_page

Log | Files | Refs | README

style.css (2720B)


      1 :root {
      2   color-scheme: light;
      3   --accent-blue: #007acc;
      4   --light-highlight: #d4d4d4;
      5   --primary-text: #333333;
      6   --dark-highlight: #252525;
      7   --dark-background: #1e1e1e;
      8   --paper: #ffffff;
      9   --font-body: Georgia, "Times New Roman", serif;
     10   --font-heading: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
     11 }
     12 
     13 * { box-sizing: border-box; }
     14 
     15 html { background: var(--paper); }
     16 
     17 body {
     18   max-width: 50rem;
     19   margin: 0 auto;
     20   padding: 3rem 1.5rem 2rem;
     21   color: var(--primary-text);
     22   font-family: var(--font-body);
     23   font-size: 1.0625rem;
     24   line-height: 1.65;
     25   overflow-wrap: anywhere;
     26 }
     27 
     28 header { border-bottom: 2px solid var(--dark-background); padding-bottom: 1.5rem; }
     29 
     30 h1, h2, h3, nav, .document-label, .entry-meta, dt {
     31   font-family: var(--font-heading);
     32 }
     33 
     34 h1, h2, h3 { color: var(--dark-highlight); line-height: 1.35; }
     35 h1 { margin: 0.25rem 0; font-size: 2.25rem; font-weight: 650; }
     36 h2 { margin: 0 0 1rem; font-size: 1.25rem; }
     37 h3 { margin: 0 0 0.25rem; font-size: 1rem; font-weight: 650; }
     38 p { margin: 0 0 0.8rem; }
     39 .document-label { margin: 0; font-size: 0.8rem; letter-spacing: 0.08em; text-transform: uppercase; }
     40 .subtitle { margin-bottom: 1.25rem; }
     41 nav { display: flex; flex-wrap: wrap; gap: 0.5rem 1.4rem; font-size: 0.9rem; }
     42 a { color: var(--accent-blue); text-underline-offset: 0.18em; }
     43 a:hover { color: var(--dark-highlight); }
     44 a:focus-visible { outline: 2px solid var(--dark-highlight); outline-offset: 4px; }
     45 section { padding: 1.75rem 0; }
     46 section:not(:last-of-type) { border-bottom: 1px solid var(--light-highlight); }
     47 section > :last-child, article > :last-child { margin-bottom: 0; }
     48 article + article { margin-top: 1.5rem; }
     49 .entry-meta { margin-bottom: 0.65rem; font-size: 0.85rem; }
     50 ul { margin: 0.5rem 0 0; padding-left: 1.35rem; }
     51 li + li { margin-top: 0.35rem; }
     52 dl { margin: 0; }
     53 dt { font-size: 0.9rem; font-weight: 650; }
     54 dd { margin: 0 0 0.75rem; }
     55 dd:last-child { margin-bottom: 0; }
     56 address { font-style: normal; }
     57 .skip-link { position: absolute; top: -5rem; padding: 0.5rem; background: var(--paper); }
     58 .skip-link:focus { top: 0.5rem; }
     59 
     60 @media screen and (max-width: 36rem) {
     61   body { padding: 1.5rem 1rem; }
     62   h1 { font-size: 1.8rem; }
     63   section { padding: 1.5rem 0; }
     64 }
     65 
     66 @media print {
     67   @page { margin: 15mm; }
     68   body { max-width: none; padding: 0; font-size: 11pt; line-height: 1.4; }
     69   header { padding-bottom: 0.75rem; }
     70   section { padding: 1rem 0; }
     71   nav, .skip-link { display: none; }
     72   a { color: var(--primary-text); }
     73   a[href^="https://"]::after { content: " (" attr(href) ")"; font-size: 0.85em; }
     74   h1, h2, h3, dt, .entry-meta { break-after: avoid; }
     75   article, address { break-inside: avoid; }
     76   p, li, dd { orphans: 3; widows: 3; }
     77 }