code.gitea.io/gitea@v1.21.7/web_src/css/modules/card.css (about)

     1  /* Below styles are a subset of the full fomantic card styles which are */
     2  /* needed to get all current uses of fomantic cards working. */
     3  /* TODO: remove all these styles and use custom styling instead  */
     4  
     5  .ui.card:last-child {
     6    margin-bottom: 0;
     7  }
     8  .ui.card:first-child {
     9    margin-top: 0;
    10  }
    11  
    12  .ui.cards > .card,
    13  .ui.card {
    14    display: flex;
    15    flex-direction: column;
    16    max-width: 100%;
    17    width: 290px;
    18    min-height: 0;
    19    padding: 0;
    20    background: var(--color-card);
    21    border: 1px solid var(--color-secondary);
    22    box-shadow: none;
    23    word-wrap: break-word;
    24  }
    25  
    26  .ui.card {
    27    margin: 1em 0;
    28  }
    29  
    30  .ui.cards {
    31    display: flex;
    32    margin: -0.875em -0.5em;
    33    flex-wrap: wrap;
    34  }
    35  
    36  .ui.cards > .card {
    37    display: flex;
    38    margin: 0.875em 0.5em;
    39    float: none;
    40  }
    41  
    42  .ui.cards > .card > .content,
    43  .ui.card > .content {
    44    border-top: 1px solid var(--color-secondary);
    45    max-width: 100%;
    46    padding: 1em;
    47    font-size: 1em;
    48  }
    49  
    50  .ui.cards > .card > .content > .meta + .description,
    51  .ui.cards > .card > .content > .header + .description,
    52  .ui.card > .content > .meta + .description,
    53  .ui.card > .content > .header + .description {
    54    margin-top: .5em;
    55  }
    56  
    57  .ui.cards > .card > .content > .header:not(.ui),
    58  .ui.card > .content > .header:not(.ui) {
    59    font-weight: var(--font-weight-medium);
    60    font-size: 1.28571429em;
    61    margin-top: -.21425em;
    62    line-height: 1.28571429;
    63  }
    64  
    65  .ui.cards > .card > .content:first-child,
    66  .ui.card > .content:first-child {
    67    border-top: none;
    68    border-radius: var(--border-radius) var(--border-radius) 0 0;
    69  }
    70  
    71  .ui.cards > .card > :last-child,
    72  .ui.card > :last-child {
    73    border-radius: 0 0 var(--border-radius) var(--border-radius);
    74  }
    75  
    76  .ui.cards > .card > :only-child,
    77  .ui.card > :only-child {
    78    border-radius: var(--border-radius) !important;
    79  }
    80  
    81  .ui.cards > .card > .extra,
    82  .ui.card > .extra,
    83  .ui.cards > .card > .extra a:not(.ui),
    84  .ui.card > .extra a:not(.ui) {
    85    color: var(--color-text);
    86  }
    87  
    88  .ui.cards > .card > .extra a:not(.ui):hover,
    89  .ui.card > .extra a:not(.ui):hover {
    90    color: var(--color-primary);
    91  }
    92  
    93  .ui.cards > .card > .content > .header,
    94  .ui.card > .content > .header {
    95    color: var(--color-text);
    96  }
    97  
    98  .ui.cards > .card > .content > .description,
    99  .ui.card > .content > .description {
   100    color: var(--color-text);
   101  }
   102  
   103  .ui.cards > .card .meta > a:not(.ui),
   104  .ui.card .meta > a:not(.ui) {
   105    color: var(--color-text-light-2);
   106  }
   107  
   108  .ui.cards > .card .meta > a:not(.ui):hover,
   109  .ui.card .meta > a:not(.ui):hover {
   110    color: var(--color-text);
   111  }
   112  
   113  .ui.cards a.card:hover,
   114  a.ui.card:hover {
   115    border: 1px solid var(--color-secondary);
   116    background: var(--color-card);
   117  }
   118  
   119  .ui.cards > .card > .extra,
   120  .ui.card > .extra {
   121    color: var(--color-text);
   122    border-top-color: var(--color-secondary-light-1) !important;
   123  }
   124  
   125  .ui.three.cards {
   126    margin-left: -1em;
   127    margin-right: -1em;
   128  }
   129  
   130  .ui.three.cards > .card {
   131    width: calc(33.33333333333333% - 2em);
   132    margin-left: 1em;
   133    margin-right: 1em;
   134  }