prime8dev

prime8dev
git clone https://git.prime8.dev/prime8dev.git
Log | Files | Refs | README | LICENSE

header.css (1535B)

      1 #tabs {
      2   display: flex;
      3   align-items: center;
      4   gap: 4px;
      5   background: var(--bg-alt);
      6   border-bottom: 1px solid var(--border);
      7   padding: 0 12px;
      8   height: 36px;
      9   position: sticky;
     10   top: 0;
     11   z-index: 100;
     12   user-select: none;
     13 }
     14 
     15 #tabs * {
     16   user-select: none;
     17 }
     18 
     19 .tab-nav {
     20   display: flex;
     21   align-items: center;
     22   gap: 4px;
     23 }
     24 
     25 .tab {
     26   padding: 6px 12px;
     27   color: var(--fg-dim);
     28   cursor: pointer;
     29   border-bottom: 2px solid transparent;
     30   transition: color 0.15s, border-color 0.15s;
     31 }
     32 
     33 .tab:hover {
     34   color: var(--fg);
     35 }
     36 
     37 .tab.active {
     38   color: var(--accent);
     39   border-bottom-color: var(--accent);
     40 }
     41 
     42 .tab-spacer {
     43   flex: 1;
     44 }
     45 
     46 .status {
     47   display: flex;
     48   align-items: center;
     49   gap: 8px;
     50   color: var(--fg-dim);
     51   font-size: var(--fs-11);
     52   margin-right: 8px;
     53 }
     54 
     55 .dpad {
     56   display: inline-flex;
     57   flex-direction: column;
     58   align-items: center;
     59   gap: 1px;
     60   font-size: var(--fs-8);
     61   line-height: 1;
     62 }
     63 
     64 .dpad-row {
     65   display: flex;
     66   gap: 1px;
     67 }
     68 
     69 .dpad-key {
     70   width: 12px;
     71   height: 10px;
     72   display: flex;
     73   align-items: center;
     74   justify-content: center;
     75   background: var(--border);
     76   border-radius: 2px;
     77   color: var(--fg);
     78 }
     79 
     80 @media (max-width: 768px) {
     81   #tabs {
     82     flex-wrap: wrap;
     83     height: auto;
     84     min-height: 36px;
     85     padding: 8px 12px;
     86     gap: 8px;
     87   }
     88 
     89   .tab-nav {
     90     width: 100%;
     91     justify-content: space-between;
     92     gap: 0;
     93   }
     94 
     95   .tab {
     96     padding: 6px 8px;
     97     font-size: var(--fs-12);
     98     flex: 1;
     99     text-align: center;
    100   }
    101 
    102   .tab-spacer,
    103   .status,
    104   .tab-num {
    105     display: none;
    106   }
    107 }