code.gitea.io/gitea@v1.22.3/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    border-radius: var(--border-radius);
    25  }
    26  
    27  .ui.card {
    28    margin: 1em 0;
    29  }
    30  
    31  .ui.cards {
    32    display: flex;
    33    margin: -0.875em -0.5em;
    34    flex-wrap: wrap;
    35  }
    36  
    37  .ui.cards > .card {
    38    display: flex;
    39    margin: 0.875em 0.5em;
    40    float: none;
    41  }
    42  
    43  .ui.cards > .card > .content,
    44  .ui.card > .content {
    45    border-top: 1px solid var(--color-secondary);
    46    max-width: 100%;
    47    padding: 1em;
    48    font-size: 1em;
    49  }
    50  
    51  .ui.cards > .card > .content > .meta + .description,
    52  .ui.cards > .card > .content > .header + .description,
    53  .ui.card > .content > .meta + .description,
    54  .ui.card > .content > .header + .description {
    55    margin-top: .5em;
    56  }
    57  
    58  .ui.cards > .card > .content > .header:not(.ui),
    59  .ui.card > .content > .header:not(.ui) {
    60    font-weight: var(--font-weight-medium);
    61    font-size: 1.28571429em;
    62    margin-top: -.21425em;
    63    line-height: 1.28571429;
    64  }
    65  
    66  .ui.cards > .card > .content:first-child,
    67  .ui.card > .content:first-child {
    68    border-top: none;
    69    border-radius: var(--border-radius) var(--border-radius) 0 0;
    70  }
    71  
    72  .ui.cards > .card > :last-child,
    73  .ui.card > :last-child {
    74    border-radius: 0 0 var(--border-radius) var(--border-radius);
    75  }
    76  
    77  .ui.cards > .card > :only-child,
    78  .ui.card > :only-child {
    79    border-radius: var(--border-radius) !important;
    80  }
    81  
    82  .ui.cards > .card > .extra,
    83  .ui.card > .extra,
    84  .ui.cards > .card > .extra a:not(.ui),
    85  .ui.card > .extra a:not(.ui) {
    86    color: var(--color-text);
    87  }
    88  
    89  .ui.cards > .card > .extra a:not(.ui):hover,
    90  .ui.card > .extra a:not(.ui):hover {
    91    color: var(--color-primary);
    92  }
    93  
    94  .ui.cards > .card > .content > .header,
    95  .ui.card > .content > .header {
    96    color: var(--color-text);
    97  }
    98  
    99  .ui.cards > .card > .content > .description,
   100  .ui.card > .content > .description {
   101    color: var(--color-text);
   102  }
   103  
   104  .ui.cards > .card .meta > a:not(.ui),
   105  .ui.card .meta > a:not(.ui) {
   106    color: var(--color-text-light-2);
   107  }
   108  
   109  .ui.cards > .card .meta > a:not(.ui):hover,
   110  .ui.card .meta > a:not(.ui):hover {
   111    color: var(--color-text);
   112  }
   113  
   114  .ui.cards a.card:hover,
   115  a.ui.card:hover {
   116    border: 1px solid var(--color-secondary);
   117    background: var(--color-card);
   118  }
   119  
   120  .ui.cards > .card > .extra,
   121  .ui.card > .extra {
   122    color: var(--color-text);
   123    border-top-color: var(--color-secondary-light-1) !important;
   124  }
   125  
   126  .ui.three.cards {
   127    margin-left: -1em;
   128    margin-right: -1em;
   129  }
   130  
   131  .ui.three.cards > .card {
   132    width: calc(33.33333333333333% - 2em);
   133    margin-left: 1em;
   134    margin-right: 1em;
   135  }