prime8dev

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

projects.css (1377B)

      1 #projects {
      2   display: flex;
      3   width: 100%;
      4 }
      5 
      6 aside.list-view {
      7   width: 300px;
      8   flex-shrink: 0;
      9   border-right: 1px solid var(--border);
     10   overflow-y: auto;
     11 }
     12 
     13 article.detail-view {
     14   flex: 1;
     15   min-width: 0;
     16   padding: 24px 32px;
     17   overflow-x: hidden;
     18   overflow-y: auto;
     19   display: flex;
     20   flex-direction: column;
     21 }
     22 
     23 #project-detail {
     24   flex: 1;
     25   min-height: 0;
     26   display: flex;
     27   flex-direction: column;
     28 }
     29 
     30 .list-item {
     31   padding: 12px 16px;
     32   border-bottom: 1px solid var(--border);
     33   cursor: pointer;
     34   transition: background 0.1s;
     35 }
     36 
     37 .list-item:hover {
     38   background: var(--bg-alt);
     39 }
     40 
     41 .list-item.selected {
     42   background: var(--selection);
     43   border-left: 3px solid var(--accent);
     44 }
     45 
     46 .list-header {
     47   display: flex;
     48   justify-content: space-between;
     49   align-items: center;
     50   margin-bottom: 2px;
     51 }
     52 
     53 .list-title {
     54   font-weight: 600;
     55   color: var(--fg);
     56 }
     57 
     58 .list-meta {
     59   font-size: var(--fs-11);
     60   color: var(--fg-dim);
     61 }
     62 
     63 .list-subtitle {
     64   font-size: var(--fs-12);
     65   color: var(--fg-dim);
     66 }
     67 
     68 .detail-content {
     69   display: flex;
     70   flex-direction: column;
     71   height: 100%;
     72   min-height: 0;
     73 }
     74 
     75 @media (max-width: 768px) {
     76   #projects {
     77     flex-direction: column;
     78   }
     79 
     80   aside.list-view {
     81     width: 100%;
     82     border-right: none;
     83     border-bottom: 1px solid var(--border);
     84     max-height: 200px;
     85   }
     86 
     87   article.detail-view {
     88     padding: 16px;
     89     overflow-y: auto;
     90   }
     91 }