marketplace.module.css

  1.marketplace {
  2    padding: 2rem 0;
  3    max-width: 1200px;
  4    margin: 0 auto;
  5}
  6
  7.header {
  8    text-align: center;
  9    margin-bottom: 2rem;
 10}
 11
 12.header h1 {
 13    font-size: 2.5rem;
 14    margin-bottom: 0.5rem;
 15}
 16
 17.header p {
 18    color: var(--ifm-color-emphasis-600);
 19    font-size: 1.1rem;
 20}
 21
 22.grid {
 23    display: grid;
 24    grid-template-columns: repeat(auto-fill, minmax(400px, 1fr));
 25    gap: 1.5rem;
 26    padding: 0 1rem;
 27}
 28
 29.card {
 30    border: 1px solid var(--ifm-color-emphasis-200);
 31    border-radius: 8px;
 32    padding: 1.5rem;
 33    transition:
 34        border-color 0.2s,
 35        box-shadow 0.2s;
 36}
 37
 38.card:hover {
 39    border-color: var(--ifm-color-primary);
 40    box-shadow: 0 2px 12px rgba(74, 222, 128, 0.15);
 41}
 42
 43.cardTitle {
 44    font-size: 1.15rem;
 45    font-weight: 600;
 46    color: var(--ifm-color-primary);
 47    margin: 0 0 0.5rem 0;
 48}
 49
 50.cardDescription {
 51    color: var(--ifm-color-emphasis-700);
 52    font-size: 0.9rem;
 53    margin-bottom: 1rem;
 54    line-height: 1.5;
 55}
 56
 57.installRow {
 58    display: flex;
 59    align-items: center;
 60    gap: 0.5rem;
 61}
 62
 63.installCommand {
 64    background: var(--ifm-color-emphasis-100);
 65    border-radius: 4px;
 66    padding: 0.5rem 0.75rem;
 67    font-family: var(--ifm-font-family-monospace);
 68    font-size: 0.75rem;
 69    overflow-x: auto;
 70    white-space: nowrap;
 71    color: var(--ifm-color-emphasis-800);
 72    flex: 1;
 73    min-width: 0;
 74}
 75
 76.copyButton {
 77    background: transparent;
 78    color: var(--ifm-color-emphasis-600);
 79    border: 1px solid var(--ifm-color-emphasis-300);
 80    border-radius: 4px;
 81    padding: 0.4rem 0.75rem;
 82    font-size: 0.7rem;
 83    cursor: pointer;
 84    white-space: nowrap;
 85    flex-shrink: 0;
 86    transition:
 87        color 0.2s,
 88        border-color 0.2s,
 89        background 0.2s;
 90}
 91
 92.copyButton:hover {
 93    color: var(--ifm-color-primary);
 94    border-color: var(--ifm-color-primary);
 95    background: var(--ifm-color-emphasis-100);
 96}
 97
 98.installLabel {
 99    font-size: 0.75rem;
100    color: var(--ifm-color-emphasis-500);
101    margin-bottom: 0.25rem;
102}
103
104.count {
105    text-align: center;
106    color: var(--ifm-color-emphasis-500);
107    margin-bottom: 1.5rem;
108}
109
110.error {
111    text-align: center;
112    color: var(--ifm-color-danger);
113    margin-bottom: 1.5rem;
114}