ionic-framework/core/src/components/card/card.ionic.scss at 01ff52ef5d4d33ed173615ec144040ddd49a0ec0 · ionic-team/ionic-framework · 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
@use "../../themes/ionic/ionic.globals.scss" as globals;
@use "./card.common";

// Ionic Card
// --------------------------------------------------

:host {
  --background: #{globals.$ion-bg-surface-default};
  --border-width: #{globals.$ion-border-size-025};
  --border-color: #{globals.$ion-border-default};
  --border-style: #{globals.$ion-border-style-solid};
  --border-radius: #{globals.$ion-round-xl};
  --color: #{globals.$ion-text-default};
  min-width: globals.$ion-scale-2400;

  border: var(--border-width) var(--border-style) var(--border-color);
}

::slotted(img) {
  display: block;
}

// Card Shapes
// ---------------------------------------------

:host(.card-soft) {
  --border-radius: #{globals.$ion-soft-xl};
}

:host(.card-round) {
  --border-radius: #{globals.$ion-round-xl};
}

:host(.card-rectangular) {
  --border-radius: #{globals.$ion-rectangular-xl};
}