simplefiles

A lightweight C CGI web application for managing files.
git clone https://scm.kuandu.systems/git-raw/simplefiles.git
Log | Files | Refs | README | LICENSE

style.css (1964B)

      1 :root {
      2   --bg: #f7f7f9;
      3   --fg: #222;
      4   --muted: #666;
      5   --accent: #2563eb;
      6   --accent-hover: #1d4ed8;
      7   --border: #ddd;
      8   --danger: #b91c1c;
      9   --danger-hover: #991b1b;
     10 }
     11 
     12 * {
     13   box-sizing: border-box;
     14 }
     15 
     16 body {
     17   margin: 0;
     18   padding: 1.25rem;
     19   font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
     20   color: var(--fg);
     21   background: var(--bg);
     22   line-height: 1.5;
     23 }
     24 
     25 h1 {
     26   margin: 0 0 1rem 0;
     27   font-size: 1.5rem;
     28 }
     29 
     30 a {
     31   color: var(--accent);
     32   text-decoration: none;
     33 }
     34 
     35 a:hover {
     36   text-decoration: underline;
     37 }
     38 
     39 nav {
     40   margin-bottom: 1rem;
     41 }
     42 
     43 nav a {
     44   margin-right: 0.75rem;
     45 }
     46 
     47 /* Forms */
     48 form {
     49   margin: 1rem 0;
     50 }
     51 
     52 input[type="file"],
     53 input[type="text"],
     54 input[type="password"] {
     55   padding: 0.4rem 0.5rem;
     56   border: 1px solid var(--border);
     57   border-radius: 4px;
     58   background: #fff;
     59   color: var(--fg);
     60 }
     61 
     62 input[type="submit"],
     63 button {
     64   padding: 0.4rem 0.8rem;
     65   border: none;
     66   border-radius: 4px;
     67   background: var(--accent);
     68   color: #fff;
     69   cursor: pointer;
     70 }
     71 
     72 input[type="submit"]:hover,
     73 button:hover {
     74   background: var(--accent-hover);
     75 }
     76 
     77 /* Upload progress */
     78 #progressContainer {
     79   margin-top: 1em;
     80   display: none;
     81 }
     82 
     83 #progressBar {
     84   width: 100%;
     85   height: 20px;
     86 }
     87 
     88 #status {
     89   margin-top: 0.25em;
     90   font-size: 0.9em;
     91   color: var(--muted);
     92 }
     93 
     94 /* File table */
     95 table {
     96   width: 100%;
     97   border-collapse: collapse;
     98   margin-top: 1rem;
     99   background: #fff;
    100   border: 1px solid var(--border);
    101 }
    102 
    103 th, td {
    104   padding: 0.5rem 0.6rem;
    105   border-bottom: 1px solid var(--border);
    106   text-align: left;
    107   vertical-align: middle;
    108 }
    109 
    110 th {
    111   background: #f3f4f6;
    112   font-weight: 600;
    113 }
    114 
    115 tr:last-child td {
    116   border-bottom: none;
    117 }
    118 
    119 /* Actions column (Delete etc.) */
    120 td.actions a {
    121   padding-right: 0.5rem;
    122   color: var(--danger);
    123 }
    124 
    125 td.actions a:hover {
    126   color: var(--danger-hover);
    127   text-decoration: underline;
    128 }
    129 
    130 /* Small helpers */
    131 .muted {
    132   color: var(--muted);
    133 }
    134 
    135 .error {
    136   color: var(--danger);
    137   margin: 0.5rem 0;
    138 }