@odx/ui 2.9.8 → 2.10.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@odx/ui",
3
- "version": "2.9.8",
3
+ "version": "2.10.0",
4
4
  "author": "Drägerwerk AG & Co.KGaA",
5
5
  "license": "SEE LICENSE IN LICENSE",
6
6
  "peerDependencies": {
@@ -14,6 +14,7 @@
14
14
  "scss"
15
15
  ],
16
16
  "publishConfig": {
17
- "access": "public"
17
+ "access": "public",
18
+ "directory": "../../dist/libs/ui"
18
19
  }
19
20
  }
@@ -5,6 +5,16 @@
5
5
  @use '../abstract/typography';
6
6
  @use '../abstract/utils';
7
7
 
8
+ body {
9
+ --odx-card-avatar-size: 64px;
10
+ --odx-card-content-vertical-alignment: center;
11
+
12
+ @include breakpoints.up(phone) {
13
+ --odx-card-avatar-size: 128px;
14
+ --odx-card-content-vertical-alignment: top;
15
+ }
16
+ }
17
+
8
18
  .odx-card {
9
19
  $root: &;
10
20
  $main-padding: dimensions.get-size(math.div(12, 24));
@@ -73,19 +83,6 @@
73
83
  }
74
84
  }
75
85
 
76
- .odx-avatar {
77
- @include dimensions.container(math.div(64, 24));
78
- @include dimensions.margin-y(math.div(4, 24));
79
-
80
- flex: 0 0 auto;
81
-
82
- @include breakpoints.up(phone) {
83
- @include dimensions.container(math.div(128, 24));
84
-
85
- margin: dimensions.get-size(math.div(4, 24)) auto 0;
86
- }
87
- }
88
-
89
86
  #{$root}__title {
90
87
  @include typography.font-weight(medium);
91
88
 
@@ -108,11 +105,7 @@
108
105
  display: flex;
109
106
  flex: 1;
110
107
  flex-direction: column;
111
- justify-content: center;
112
-
113
- @include breakpoints.up(phone) {
114
- display: block;
115
- }
108
+ justify-content: var(--odx-card-content-vertical-alignment);
116
109
  }
117
110
  }
118
111
 
@@ -141,6 +134,18 @@
141
134
  }
142
135
  }
143
136
 
137
+ .odx-avatar {
138
+ flex: 0 0 auto;
139
+ height: var(--odx-card-avatar-size);
140
+ width: var(--odx-card-avatar-size);
141
+
142
+ @include dimensions.margin-y(math.div(4, 24));
143
+
144
+ @include breakpoints.up(phone) {
145
+ margin: dimensions.get-size(math.div(4, 24)) auto 0;
146
+ }
147
+ }
148
+
144
149
  &__footer {
145
150
  @include dimensions.padding-x(0.5);
146
151
 
@@ -166,7 +171,7 @@
166
171
  }
167
172
  }
168
173
 
169
- .odx-card-menu {
174
+ > .odx-action-group {
170
175
  margin: 0;
171
176
  position: absolute;
172
177
  right: $main-padding;
@@ -1,23 +0,0 @@
1
- @font-face {
2
- font-display: block;
3
- font-family: "{{ name }}";
4
- src: {{{ fontSrc }}};
5
- }
6
-
7
- .{{prefix}}::before,
8
- [class^="{{prefix}}-"]::before,
9
- [class*=" {{prefix}}-"]::before {
10
- font-family: {{ name }} !important;
11
- font-style: normal;
12
- font-weight: normal !important;
13
- font-variant: normal;
14
- text-transform: none;
15
- line-height: 1;
16
- vertical-align: top;
17
- -webkit-font-smoothing: antialiased;
18
- -moz-osx-font-smoothing: grayscale;
19
- }
20
-
21
- {{# each codepoints }}
22
- .{{ ../prefix }}-{{ @key }}::before { content: "\\{{ codepoint this }}"; }
23
- {{/ each }}