web-components-design-system/design-system.css at main · markconroy/web-components-design-system · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
.mc-ds-container + .mc-ds-container {
  margin-block-start: var(--mc-spacing-largest);
  border-top: var(--mc-border);
}

.mc-ds-tile {
  height: 100px;
  aspect-ratio: 1 / 1;
  outline: var(--mc-border);
  outline-offset: var(--mc-spacing-smallest);
  position: relative;
  left: var(--mc-spacing-smallest);
}

.mc-ds-tile strong {
  font-family: var(--mc-font-secondary);
}

.mc-ds-container-demo {
  border: var(--mc-border);
  margin-block-start: var(--mc-spacing-largest);
}

.mc-ds-font-container + .mc-ds-font-container,
.mc-ds-grid-container + .mc-ds-grid-container {
  border-top: var(--mc-border);
  padding-bottom: var(--mc-spacing);
}

.mc-ds-grid-container + .mc-ds-grid-container,
.mc-ds-card-container + .mc-ds-card-container {
  margin-block-start: var(--mc-spacing-largest);
}

.mc-ds-grid-container mc-grid-item,
.mc-ds-grid-container .mc-ds-grid-item {
  height: 100px;
  border: var(--mc-border);
  background-color: var(--mc-color-grey-lightest);
}

.mc-ds-card-container {
  max-width: 600px;
}