@scania/tegel-lite 0.0.1-beta.6 → 0.0.1-beta.7

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.
@@ -3125,8 +3125,7 @@ body {
3125
3125
  }
3126
3126
 
3127
3127
  .tl-header {
3128
- /* Base background & text */
3129
- --header-background: var(--component-header-color-background);
3128
+ /* Base text */
3130
3129
  --header-nav-item: var(--component-header-color-foreground-strong);
3131
3130
  /* Nav-item states */
3132
3131
  --header-nav-item-background-hover: var(--color-background-surface-100);
@@ -3172,25 +3171,45 @@ body {
3172
3171
  --header-dropdown-box-shadow: var(--component-header-dropdown-box-shadow);
3173
3172
  }
3174
3173
 
3174
+ .scania {
3175
+ /* Dark mode - override with dark colors */
3176
+ }
3177
+ .scania .tds-mode-dark .tl-header {
3178
+ --header-background: var(--component-header-color-background);
3179
+ }
3180
+ .scania {
3181
+ /* Default .tl-header (works for both light mode and no mode) */
3182
+ }
3175
3183
  .scania .tl-header {
3176
3184
  /* Brand logo */
3177
3185
  --header-logotype-local: var(--tds-background-image-scania-symbol-svg-local);
3178
3186
  --header-logotype-cdn: var(--tds-background-image-scania-symbol-svg);
3179
3187
  --component-header-space-profile-padding: 16px;
3188
+ /* Background defaults to light mode */
3189
+ --header-background: var(--component-header-color-background);
3180
3190
  }
3181
3191
 
3182
3192
  .traton .tds-mode-dark .tl-header {
3183
- /* Brand logo */
3193
+ /* Brand logo - White for dark mode */
3184
3194
  --header-logotype-local: var(--traton-logotype-white-svg-local);
3185
3195
  --header-logotype-cdn: var(--traton-logotype-white-svg);
3196
+ /* Background */
3197
+ --header-background: var(--component-header-color-background);
3186
3198
  }
3187
3199
  .traton .tds-mode-light .tl-header {
3188
- /* Brand logo */
3200
+ /* Brand logo - Black for light mode */
3189
3201
  --header-logotype-local: var(--traton-logotype-black-svg-local);
3190
3202
  --header-logotype-cdn: var(--traton-logotype-black-svg);
3203
+ /* Background */
3204
+ --header-background: var(--component-header-color-background);
3191
3205
  }
3192
3206
  .traton .tl-header {
3207
+ /* Brand logo - Black as default (for no mode specified) */
3208
+ --header-logotype-local: var(--traton-logotype-black-svg-local);
3209
+ --header-logotype-cdn: var(--traton-logotype-black-svg);
3193
3210
  --component-header-space-profile-padding: 20px;
3211
+ /* Background defaults to light mode */
3212
+ --header-background: var(--component-header-color-background);
3194
3213
  }
3195
3214
 
3196
3215
  /* Header Elements */
@@ -106,8 +106,7 @@
106
106
  }
107
107
 
108
108
  .tl-header {
109
- /* Base background & text */
110
- --header-background: var(--component-header-color-background);
109
+ /* Base text */
111
110
  --header-nav-item: var(--component-header-color-foreground-strong);
112
111
  /* Nav-item states */
113
112
  --header-nav-item-background-hover: var(--color-background-surface-100);
@@ -153,25 +152,45 @@
153
152
  --header-dropdown-box-shadow: var(--component-header-dropdown-box-shadow);
154
153
  }
155
154
 
155
+ .scania {
156
+ /* Dark mode - override with dark colors */
157
+ }
158
+ .scania .tds-mode-dark .tl-header {
159
+ --header-background: var(--component-header-color-background);
160
+ }
161
+ .scania {
162
+ /* Default .tl-header (works for both light mode and no mode) */
163
+ }
156
164
  .scania .tl-header {
157
165
  /* Brand logo */
158
166
  --header-logotype-local: var(--tds-background-image-scania-symbol-svg-local);
159
167
  --header-logotype-cdn: var(--tds-background-image-scania-symbol-svg);
160
168
  --component-header-space-profile-padding: 16px;
169
+ /* Background defaults to light mode */
170
+ --header-background: var(--component-header-color-background);
161
171
  }
162
172
 
163
173
  .traton .tds-mode-dark .tl-header {
164
- /* Brand logo */
174
+ /* Brand logo - White for dark mode */
165
175
  --header-logotype-local: var(--traton-logotype-white-svg-local);
166
176
  --header-logotype-cdn: var(--traton-logotype-white-svg);
177
+ /* Background */
178
+ --header-background: var(--component-header-color-background);
167
179
  }
168
180
  .traton .tds-mode-light .tl-header {
169
- /* Brand logo */
181
+ /* Brand logo - Black for light mode */
170
182
  --header-logotype-local: var(--traton-logotype-black-svg-local);
171
183
  --header-logotype-cdn: var(--traton-logotype-black-svg);
184
+ /* Background */
185
+ --header-background: var(--component-header-color-background);
172
186
  }
173
187
  .traton .tl-header {
188
+ /* Brand logo - Black as default (for no mode specified) */
189
+ --header-logotype-local: var(--traton-logotype-black-svg-local);
190
+ --header-logotype-cdn: var(--traton-logotype-black-svg);
174
191
  --component-header-space-profile-padding: 20px;
192
+ /* Background defaults to light mode */
193
+ --header-background: var(--component-header-color-background);
175
194
  }
176
195
 
177
196
  /* Typography Usage mixins */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@scania/tegel-lite",
3
- "version": "0.0.1-beta.6",
3
+ "version": "0.0.1-beta.7",
4
4
  "description": "Styles-only library for Tegel Design System (Beta)",
5
5
  "type": "module",
6
6
  "keywords": [