GitList

files/index.html

 <!DOCTYPE html>
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
     <title>Document</title>
     <style>
       * {
         box-sizing: border-box;
       }
       html,
       body {
         margin: 0;
         padding: 0;
       }
       ul {
           margin: 0;
       }
       #root {
         height: 100vh;
       }
       main {
         display: flex;
         height: 100%;
       }
       main > * {
         width: 50%;
         max-height: 100%;
         overflow-y: auto;
       }

d83dc2bd

       #packages {
           width: 100%;
           padding: 2em;
         list-style: none;
         display: grid;
         grid-template-columns: 1fr 1fr 1fr 1fr;
         grid-gap: 1em;
       }
       #packages > * {
           display: inline-block;
       }
       #packages button {
           height: 2.5em;
           width: 100%;
       }
       :root { --num-cols: 4; }
       table, tr { display: grid; }
       thead, tbody, th, td { display: block; margin: 0; padding: 0; }
       table, tr { display: grid; }
       thead, tbody, th, td { display: block; }
       table {
           width: 100%;
           flex-grow: 1;
       }
       tr {
           width: 100%;
           height: 1fr;
           grid-template-columns: repeat(var(--num-cols), 1fr);
       }
       td, th { padding: 0.1em 0.5em; }
       th {
           justify-content: center;
           align-items: center;
           display: flex;
       }
       thead > tr { height: 2.75em;}
       tbody { height: calc(100vh - 5.5em); overflow-y: scroll; }
       #package-section {
           display: flex;
           flex-direction: column;
           height: 100vh;
       }
       #package-section > h2 {
           height: 2.75em;
           text-align: center;
       }
       thead {
           border-bottom: thin solid black;
           overflow-y: scroll;
       }
       thead > tr > th + th, tbody > tr > td + td {
           border-left: thin solid black;
       }

a5523e32

     </style>
   </head>
   <body>
     <div id="root"></div>
     <script src="//cdn.jsdelivr.net/npm/ramda@latest/dist/ramda.min.js"></script>
     <script>
       // HACK(keanulee): The Redux package assumes `process` exists - mock it here before
       // the module is loaded.
       window.process = {
         env: {
           NODE_ENV: "production",
         },
       };
     </script>
     <script src="/public/main.js" type="module"></script>
   </body>
 </html>