Sorry, but you either have no stories or none are selected somehow.
If the problem persists, check the browser console, or the terminal you've run Storybook from.
The component failed to render properly, likely due to a configuration issue in Storybook. Here are some common causes and how you can address them:
ngb-datepicker
arrows style and removed them when they are disabled. (by @leagrdv with #5100)Fixed the stepper as the progress bar was not being filled correctly on steps progress on firefox. (by @leagrdv with #4942)
Removed a mention of Frutiger Neue in the tokens file. (by @gfellerph with #4963)
Deprecated the topic teaser component. (by @leagrdv with #4352)
Added missing spinner size class. (by @myrta2302 with #4310)
Removed strikethrough style on disabled elements. (by @leagrdv with #4095)
Fixed display of stepper to break words when text is too long to fit in one line. (by @leagrdv with #4055)
textarea
focus (by @veyaromain with #3573)<dialog>
element. The dialog will replace the current modal and notification overlay components coming from ng-bootstrap. (by @leagrdv with #3713)Improved accessibility of headings with subheadings by removing the
element and added the utility class d-block. Consult https://design-system.post.ch/?path=/docs/7ecd87f1-de96-4e39-a057-ba1798eb6959--docs for updated markup. (by @oliverschuerch with #3680)
Fixed step numbering in stepper component. Moved counter-increment
to stepper-link
selector to ensure correct step numbers are displayed throughout progression. (by @schaertim with #3519)
Resolved issue where validation message icons repeated on each line of multi-line messages. Implemented flexbox layout to ensure a single, vertically centered icon regardless of message length. (by @schaertim with #3396)
Refactored icon declarations to comply with Angular 18's new build system requirements. (by @schaertim with #3482)
Realigned the checkbox and the radio button with the label. (by @oliverschuerch with #3477)
Set the max-width
constraint of the tag component to 100% for improved accessibility. Try to keep tag text as short as possible though. (by @oliverschuerch with #3477)
input
, select
, textarea
). (by @davidritter-dotcom with #3229)Added an invalid message for the card-control component and an icon in the invalid message of the checkbox and radio button (by @davidritter-dotcom with #2978)
Pre-compiled CSS files are now shipped with the package to enable projects not using Sass to selectively import component styles. (by @gfellerph with #3283)
Fixed visual issues with validated form-elements who receive focus. (by @oliverschuerch with #3166)
Updated table colors on dark backgrounds. (by @alizedebray with #2718)
Switched from light to regular font weight for most texts, excluding sub-titles. (by @oliverschuerch with #3284)
Added a small variant for the textarea with floating label. (by @davidritter-dotcom with #2857)
Updated disabled styles of form controls to have a dashed border. (by @davidritter-dotcom with #2857)
Added @angular/core as an optional peer dependency to the styles package to indicate the Angular versions that are compatible with the current version of the styles. (by @gfellerph with #3168)
Fixed an issue with icon URL declarations when building styles with esbuild. (by @alizedebray with #3123)
Fixed the misaligned calendar icon in the datepicker input field. (by @oliverschuerch with #3145)
Implemented button wrapping for overflow in button groups. (by @alizedebray with #3062)
Fixed missing chevron in valid and invalid select entries. (by @alizedebray with #3104)
Updated popover styles. - Removed popover min-width
and updated max-width
.
:focus
selector fom .text-auto
utility class (by @alizedebray with #3104)Fixed grid-area behaviour in card-control component, if used without any icon. (by @oliverschuerch with #3099)
Updated the stepper styles: changed the colors and font-weights, as well as the current step label position on smaller screens. (by @alizedebray with #3088)
Merged the card-control, checkbox-card and radio button card docs pages and updated the choice-card-control styles. (by @alizedebray with #3104)
Fixed high-contrast-mode for card-control component. (by @alizedebray with #3104)
Added missing focus ring on checkbox and radio button groups. (by @alizedebray with #3104)
Restricted badges to showcase counts exclusively and set their color to red by default.
Use tags to display states, properties, or other metadata. Opt for chips when presenting dismissible or selectable information.
Use the background utility classes to change the badge color as needed. (by @alizedebray with #2860)
Refactored brand colors. Renamed $gray-background
SCSS variable to $gray
and removed $gray-background-light
variable because it is a duplication of the already existing variable $light
.
Updated the usage of said variables in dependant packages accordingly. (by @oliverschuerch with #2861)
Synchronized the versions of the following packages:
This will help understanding the dependencies between these packages at a glance but also means that for the individual pacakges, semver is no longer being used. This enables us also to talk about and document Design System versions as a whole instead of documenting the fragmented versions in a complex lookup table. (by @gfellerph with #2856)
Added support for Angular 17 and ng-bootstrap 16. (by @alizedebray with #2760)
Updated Sass color variables: - Removed variables $success-green
, $error-red
, $warning-orange
, $success-text
, $error-text
, $danger
as well as the Sass map $contextual-colors
.
Instead use the variables $success
, $error
, $warning
and the Sass map $signal-colors
.
$signal-colors
keys and added a new Sass map $signal-background-colors
.$background-colors
and all the dependant packages accordingly.With the exception of the components notification
, toast
and tag
, there is no component providing a danger
variant anymore. Instead use the error
variant. (by @oliverschuerch with #2861)
Renamed the badge into "chip", added a disable state and updated its styles. (by @alizedebray with #2855)
Added new black and white alpha colors. Replaced hardcoded alpha colors with the new color definitions in card-control
component. (by @oliverschuerch with #2861)
Changed mobile navigation trigger to make it more accessible by default using a button element. (by @imagoiq with #2834)
Added a new tag
component. This component is available in standard HTML or as webcomponent. (by @b1aserlu with #2552)
Introduced new focus style for text input and select, and added new wrapper element .focus-control-wrapper
, .form-range-wrapper
, .form-select-wrapper
. (by @imagoiq with #2774)
Added new focus color variables. (by @oliverschuerch with #2861)
Added a pattern for error pages with an image. Currently available is a graphic for "404 not found" errors. More error types may be supported in the future. (by @gfellerph with #2676)
Adjusted focus styles with new color for button, checkbox, radio, switch, rating elements. (by @imagoiq with #2780)
Updated size of radio button to match design. (by @imagoiq with #2737)
Fixed the .form-check-input
background-color, by setting it to white on none or light backgrounds. (by @oliverschuerch with #2260)
Added a workaround to display progress bar on input range and on webkit browsers without JavaScript. (by @imagoiq with #2781)
Fixed color and border-color on hover for checkbox and radio form element. (by @imagoiq with #2961)
Added new disabled styles for radio and checkbox, fixed color contrast on this state and fixed cursor style. (by @imagoiq with #2813)
Fixed layout on post-alert with medium (md) breakpoint. (by @imagoiq with #2775)
Fixed wrongly escaped Sass variables in the form-switch hcm styles, which caused problems in the styles of the card-control component. (by @oliverschuerch with #2965)
Replaced system-ui
fallback font with a list of fallbacks to avoid rendering issues with specific writing system (chinese, arabic…). (by @imagoiq with #2735)
Fixed active button color-contrast on dark background (by @imagoiq with #2823)
Replace all parts that used the old success color with the new success-green color. (by @imagoiq with #2808)
Fixed usage of background color on checkbox which make the checkmark invisible on dark background. (by @imagoiq with #2953)
Made styling more coherent for forms elements with High contrast mode and focus/hover state. (by @imagoiq with #2774)
Refactored the new focus style to only be visible when using keyboard for form elements. (by @imagoiq with #2810)
Fixed color contrast of alert component on success background color. (by @imagoiq with #2845)
Fixed form validation feedback color and indicators in high contrast mode. (by @imagoiq with #2766)
Updated the color of success alerts from black to white for a better contrast. (by @alizedebray with #2740)
Fixed color-contrast on blockquote footer with dark background. (by @imagoiq with #2714)
Fixed close icon button which is not visible on hover with light theme and high contrast mode enabled. (by @imagoiq with #2705)
Improved display of badge and switch checked state with high contrast mode. (by @imagoiq with #2706)
Reduced the xxl
breakpoint size form 1441px to 1440ppx. (by @alizedebray with #2741)
Fixed color-contrast issue on valid form-feedback. (by @imagoiq with #2717)
Removes unwanted margin from heading within the notification overlay component. (by @b1aserlu with #2407)
Updated high contrast styles for the form switch component. (by @alizedebray with #2667)
Fixed display of icons in high-contrast mode in webkit. (by @imagoiq with #2638)
Deprecated sizes loader-sm
and loader-xs
for the spinner. They are replace respectively with loader-40
and loader-16
. (by @imagoiq with #2612)
Removed transparent background for notification in high-contrast mode. (by @imagoiq with #2653)
Fixed visibility of select arrow in icon in high-contrast mode with light theme. (by @imagoiq with #2696)
Sets the font-size of h5 on small mobile devices to 16px as defined in Figma. (by @gfellerph with #2610)
form-control
and form-select
sizes and added support for floating label small size variant. (by @imagoiq with #2396)Fixed the alignment of icons on datatable buttons. (by @imagoiq with #2500)
Updated styles for the .is-valid
class. (by @imagoiq with #2391)
Update the background color of accordion to be white on any background color other than white. The accordion background remains gray on white backgrounds. (by @alizedebray with #2379)
Fixed a visual regression on the intranet-header with a sidenav. (by @imagoiq with #2521)
Added breakpoint specific utility classes to set width to 25%
, 50%
, 75%
, 100%
, or auto
. (by @imagoiq with #2308)
Changed color of text on the success background (#2c911c) to white from black for better contrast according to WCAG 3.0 (by @b1aserlu with #2358)
Converted padding-bottom to margin after tabs-content so it doesn't impact vertical rhythm. (by @imagoiq with #2349)
Fixed close button color in high contrast mode. The button is now visible when forced colors are active. (by @gfellerph with #2109)
@swisspost/design-system-migrations
. (by @alizedebray with #2270)Updated the accordion styles. (by @alizedebray with #2310)
Fixed overflow on datepicker select variant. (by @imagoiq with #2319)
Added small variant to floating label select. (by @gfellerph with #2368)
Updated select styles to match design. (by @imagoiq with #2312)
Fixed intranet-header sticky navigation on mobile which prevent interactivity on the page within a certain viewport width. (by @imagoiq with #2320)
Fixed spacing regression on form switch label. (by @imagoiq with #2356)
Fixed active color and chevron display of the ngb-pagination component in High Contrast Mode. (by @imagoiq with #2366)
Transformed the gap between the label and the radio/checkbox/switch into a clickable area. (by @imagoiq with #2333)
Added official way to use label in a floating-label select as a placeholder. (by @imagoiq with #2200)
Fixed display of button-group input when using checkbox or radio variant. (by @imagoiq with #2133)
Fixed offset of radio button when checked and in inline layout. (by @imagoiq with #2065)
The following placeholders from the \_text.scss
file are depreacted an will be removed in a future version: %list-adjustment
, %module-container
, %default-module-spacer
, %text-container
. (by @b1aserlu with #2171)
Fixed default icon flashing when using a post-icon
on alerts. (by @imagoiq with #2244)
Changed dropdown icon for the select component and adjusted the size of the icon. (by @b1aserlu with #2164)
Added table-mono
variant for table component. (by @imagoiq with #2106)
Set a max-width
for badges and add ellipsis for overflowing text. (by @davidritter-dotcom with #1892)
Applied autoprefixer to distributed sass files. Sass files will now contain prefixes for supported browsers according to the browserslist file. (by @imagoiq with #2115)
Refactored the grid-system: adjusted container paddings, added responsive gutter-widths. Updated grid docs. (by @oliverschuerch with #2045)
Added small variants for checkbox and radio buttons. Lowered font-size of validation blocks for form elements. (by @imagoiq with #2086)
Fixed missing active tab border on HTML component. (by @imagoiq with #2037)
Fixed active switch control showing a check icon in Chrome. (by @alizedebray with #2090)
Removed bound between logo and language to allow any language to display the logo. (by @imagoiq with #2009)
Reduced the gap between the alert body and action buttons. (by @alizedebray with #1085)
Removed duplicated close button on toast when using ngx-toastr programatically. (by @imagoiq with #2011)
Updated and added the gaps between the title and the link-list in the .topic-teaser-content
class to comply with the figma design. (by @b1aserlu with #1927)
Added missing pointer-events to allow a dismissible toast to be closed interactively. (by @imagoiq with #2008)
Updated icons to display as mask images, this way their color can be set by adjusting the CSS background-color
property. (by @alizedebray with #1945)
Deprecated sizes "regular" and "medium" for text inputs, textareas and select boxes. Future major versions of the Design System will only support the sizes "small" and "large". This change will make it easier to decide what variant to use where: small for internal applications, large for customer facing external applications. (by @gfellerph with #1837)
Fixed a bug with the ngb-dropdown where the chevron was not shown on primary buttons. This use case is now documented and white chevrons are shown. (by @gfellerph with #1890)
Fixed the .pi-calendar
class not showing an icon in the datepicker. (by @alizedebray with #1806)
Fixed datepicker input value that was overlapping with the calendar button on very narrow datepickers. (by @gfellerph with #1886)
Fixed a problem where textarea and multiselect had an unexpected height when regular size (form-control-rg / form-select-rg) was used. (by @b1aserlu with #1830)
Added a new post-tabs component. (by @alizedebray with #1181)
Updated close button styles for Alerts, Toasts, Badges, and Modals. It now has the same colors as the tertiary buttons to be accessible on all our backgrounds. (by @alizedebray with #1350)
Added custom resizer for textarea elements. (by @oliverschuerch with #1765)
Update button styles: padding, gap and border-radius. (by @imagoiq with #1666)
Updated alert and toast styles.
Deprecated classes for alerts/notifications:
Stepper:
Adjusted the gap inside the badge. (by @b1aserlu with #1772)
Fixed collapsible/accordion styles that broke after Bootstrap removed several CSS custom properties. (by @alizedebray with #1324)
multiple
attribute is now supported. Also fixed padding when the state is valid or invalid. (by @imagoiq with #1614)Fix an issue with two empty CSS files in the styles package. Empty files are no longer delivered. (by @imagoiq with #1600)
Fixed default font-size and weight of the legend element (by @geekrumper with #1512)
Optimized floating-label controls to show placeholders. (by @alizedebray with #1509)
Added missing definitions for italic font faces. (by @yannikstuker with #1513)
Fixed an issue with the stepper on mobile where the name of the last step was misaligned on mobile devices. (by @gfellerph with #1317)
Updated dependency Bootstrap to 5.3.0 (by @gfellerph with #1466)
Removed unused variable $shadow-color
. It was added by mistake. (by @oliverschuerch with #1438)
Fixed an issue in Safari where the input value of a floating label input field was hidden by the floating label. (by @gfellerph with #1461)
Fixed the form-selector-button visualisation for firefox. (by @oliverschuerch with #1323)
Fixed overlapping of the search input label and the search input icon in the post-search component. (by @oliverschuerch with #1367)
Updated badge colors. (by @alizedebray with #1349)
Updated line-heights to match accessibility requirements and added new variables for them. The new values are $line-height-body: 1.5
for body copy (text) and $line-height-headings: 1.2
for headings. (by @gfellerph with #1298)
Added new font-size variables following the new naming convention of using pixel based naming. The font sizes remain defined in rem
and the new variables are $font-size-14
, $font-size-16
, $font-size-18
, $font-size-20
, $font-size-24
, $font-size-28
, $font-size-32
, $font-size-40
, $font-size-48
and $font-size-56
. (by @gfellerph with #1315)
Deprecated font-size variables $font-size-tiny
, $font-size-small
, $font-size-regular
, $font-size-bigger-regular
, $font-size-medium
, $font-size-large
, $font-size-small-big
, $font-size-big
, $font-size-bigger-big
, $font-size-small-huge
and $font-size-huge
. New variables use a pixel based naming (in accordance with https://github.com/swisspost/design-system/discussions/588). (by @gfellerph with #1298)
Updated the Angular migration schematic for ngb-buttons to work correctly whith the NgFor directive. (by @alizedebray with #1311)
Updated heading sizes according to the new Design. (by @gfellerph with #1298)
Deprecating variables $display1-size
, $display2-size
, $display3-size
, $display4-size
, $display1-weight
, $display2-weight
, $display3-weight
, $display4-weight
and $display-line-height
because they are unused. (by @gfellerph with #1298)
Deprecating the line-height-calc
function as unused. (by @gfellerph with #1298)
Deprecating validation-tooltips like .valid-tooltip
and .invalid-tooltip
. Absolutely positioned tooltips are no longer recommended for usage. Use the respective feedback classes instead. (by @gfellerph with #1298)
Deprecated line-height variables $line-height-tiny
, $line-height-small
, $line-height-regular
, $line-height-bigger-regular
, $line-height-medium
, $line-height-large
, $line-height-small-big
, $line-height-big
, $line-height-bigger-big
, $line-height-small-huge
and $line-height-huge
. They will be removed in the next major version. (by @gfellerph with #1298)
Removed the unused Sass variable $table-head-bg
. You can use it's value rgba(var(--post-contrast-color-rgb), 0.6)
directly as an alternative (by @gfellerph with #1240)
Updated the markup for the stepper component in order to improve accessibility. Completed items now require the prefix "Complete" and incomplete steps are no longer links. (by @gfellerph with #1232)
Removed deprecated ng-bootstrap Checkbox and Radio buttons and replaced them with Bootstrap button groups. (by @alizedebray with #1199)
Major dependency update. The following versions are now supported:
Deprecated the alert-error
and the alert-notification
variants of the alert component. These variants will be removed in the next major version. (by @gfellerph with #1214)
Deprecated the current sizing variables in favour of a new naming system that is more consistent with the design in Figma (by @gfellerph with #1251)
Deprecated the font-weight classes bold, regular and light. (by @gfellerph with #1216)
Changed the info color to light blue for alerts, notifications and contextual usage (by @gfellerph with #1235)
Deprecated the text-auto class. It's no longer necessary in combination with background utilities. (by @gfellerph with #1216)
Deprecated the base64 icons defined as CSS backgrounds. This technology is outdated and contributes a large amount to the CSS bloat. The current approach for using icons is the post-icon
web-component. (by @gfellerph with #1226)
Deprecated the post-specific sizing variables (e.g. $size-hair
, $size-huge
, etc.) and classes (.m-hair
, .mt-sm-micro
, etc.) for all of the following properties: margin
, padding
, line-height
, height
, max-height
, width
, max-width
and gap
. (by @oliverschuerch with #1267)
Fixed an issue with the font size of lead text that was too small due to a specificity issue with sass placeholders. (by @oliverschuerch with #1143)
Fixed an issue with floating labels on input fields that prevented the label from being truncated correctly if it was overflowing the text box (by @gfellerph with #1155)
Updated the algorithm for calculating color contrast and optimal text color based on a given background color. Texts on colored buttons now comply with the WCAG 2.1 AA guidelines. (by @gfellerph with #1154)
Fixed font-weight for all headings. The default is now bold (700). (by @gfellerph with #1122)
Fixed table styles for striped, bordered and borderless tables (default HTML table) (by @gfellerph with #1063)
Added a highlight color for validation messages in Windows High Contrast Mode so these messages are more visible (by @gfellerph with #1121)
Added bg-black
as a background utility class with automatic text color (by @gfellerph with #830)
Unwrapped complex :is selector. When integrating in another project, the not-disabled-focus-hover
mixin causes sass to silently fail and generate an empty output. (by @gfellerph with #889)
Correctly declares dependencies used in Migration Schematics for Angular projects, fixing an issue when trying to migrate projects. (by @oliverschuerch with #794)
When outside days get hidden, they collapse in their flex context and change the alignment of the first days of the month. Adding flex-grow 1 ensures the hidden days still keep their space so the day labels on top match correctly with the calendar days. (by @gfellerph with #793)
Added automatic migration for bootstrap close-button component.
by @oliverschuerch with #687
Added automatic migration for bg-opacity classes.
by @oliverschuerch with #687
Added automatic migration for button component btn-icon class.
by @oliverschuerch with #687
Added automatic migration for general rtl properties.
by @oliverschuerch with #687
Added automatic migration for bootstrap button component.
by @oliverschuerch with #687
Added automatic migration for bootstrap form-switch component.
by @oliverschuerch with #687
Added automatic migration for text-auto class.
by @oliverschuerch with #687
Added automatic migration for required form-label class.
by @oliverschuerch with #687
Added automatic migration for bootstrap blockquote component with footer.
by @oliverschuerch with #687
Added automatic migration for form-checkbox component.
by @oliverschuerch with #687
Added automatic migration for post custom-select component.
by @oliverschuerch with #687
Added automatic migration for forms elements.
by @oliverschuerch with #687
Added floating-labels migration for bootstrap form-control, form-select and textarea components.
by @oliverschuerch with #687
Added automatic migration for bootstrap badge component.
by @oliverschuerch with #687
Added automatic migration functionality which includes cheerio. This enalbes us to write migrations to mutate the html files of a project, with a simple jQuery like selector and with jQuery like update functions (e.g. $element.removeClass('test');, etc.).
by @oliverschuerch with #651
Added automatic migration for sr-only and sr-only-focusable classes.
by @oliverschuerch with #687
Added automatic migration for bootstrap blockquote component.
by @oliverschuerch with #687
Added automatic migration for post subnavigation component.
by @oliverschuerch with #687
Added automatic migration for bootstrap form-radio component.
by @oliverschuerch with #687
Added automatic migration for post topic-teaser component.
by @oliverschuerch with #687
Added automatic migration for ngbootstrap buttons component.
by @oliverschuerch with #687
Refactored the stepper component in order to facilitate its use within a project.
by @alizedebray with #308
Refactored colors. Bootstrap overrides are now clearly separated from Design System colors and only Design System colors are used in the components. This change also prepares for a dynamic dark mode by offering CSS variables for background and text contrast colors (see buttons.scss
for an example).
by @gfellerph with #96
Added requirement for width
and height
attributes on images in the topic-teaser component to be set to 100%
. To be able to display the image properly in firefox and safari.
by @gfellerph with #350
Added and extended grid-cols definition for .topic-teaser-content
and .topic-teaser-image-container
containers inside css and removed col classes from html. Improved image aspect-ratios
, as well as font-size
and padding
of .link-list
elements on smaller devices.
by @oliverschuerch with #310
Updated entry file names for the styles package.
@use '@swisspost/design-system-styles'; // Default internet styles @use '@swisspost/design-system-styles/intranet'; // Default intranet styles @use '@swisspost/design-system-styles/core' as post; // Variables, mixins, functions and placeholders
background-color: post.$yellow;
.
Added storybook for documenting the basic styles.
by @gfellerph with #141
Renamed Common Web Frontend to Swiss Post Design System.
by @gfellerph with #355
Removed sass-variables such as $isolate-components
. Moved bootstrap-feature variables ($enable-*) to a separate file. These will no longer be forwarded and cannot be overriden.
by @oliverschuerch with #188
Dropped rounded and colored badges, updated dismissible badges and added checkable badges.
by @alizedebray with #353
Removed inverted
class for the subnavigation component, which is no longer necessary when using any bg-{colorname}
class.
by @gfellerph with #361
Css variables originating from the Design System are now prefixed with --post-{variablename}
. Css variables from bootstrap are prefixed with --bs-{variablename}
.
by @gfellerph with #361
Removed deprecated scss-variables $font-size-map
, $font-size-sm
, $font-size-rg
and $font-size-lg
from project, in favor of the new $font-sizes
map.
by @oliverschuerch with #189
Refactored font-size
and line-height
maps with keys, for easier automation. Variables now are always accessible individually and collected in a loopable map. Font-sizes and line-heights are defined for the same sizes so it's possible to cross-reference a line-height based on font-size (see font-curve mixin).
by @gfellerph with #115
Refactored background classes (.bg-{colorname}
) for the alert and notification component.
by @oliverschuerch with #357
Fixed heights on .form-control-lg
and .floating-label .form-control
elements. Removed some Design System only scss-variables.
by @oliverschuerch with #450
Added a story for the cards component.
by @LarissaMS with #250
Added migrations for ng-button
component. This will replace .btn-primary
with .btn.btn-secondary
on ng-button label elements.
by @oliverschuerch with #628
Added migration for close-button
component. This will remove .btn
and .btn-icon
from close-button elements.
by @oliverschuerch with #642
Added a story for the badge component.
by @LarissaMS with #420
Added a story for blockquote component.
by @LarissaMS with #257
Added Angular migration schematics to the @swisspost/design-system-styles
package. These migrations can be automatically applied by using the ng update @swisspost/design-system-styles
command in your Angular project. For more information, have a look at the migration guide.
by @oliverschuerch with #611
Added a button story with an overview and two single button stories.
by @LarissaMS with #233
Added migration for the subnavigation component. This will remove the subnavigation-inverted
class from the main element.
by @oliverschuerch with #640
Added a story for topic-teaser component.
by @LarissaMS with #449
Added migration for the topic-teaser component. This will remove the grid
and font-curve
classes.
by @oliverschuerch with #643
Added migration for secondary-classes. This will remove the classes bg-secondary
, border-secondary
and text-secondary
.
by @oliverschuerch with #626
Added Angular migration schematics that can be executed with the ng update
command.
by @oliverschuerch with #538
Changed the form-range component to show the pointer cursor on the thumb element.
by @LarissaMS with #302
Added high-contrast-mode styles for the form-range component.
by @oliverschuerch with #159
Fixed the contrast color used in alert component with color success
, the close button styles and icons color in toast and alert component in high-contrast-mode.
by @Janobob with #2
Removed the postinstall
script from the package.json
files, which was previously used to install the cypress binary in the CI environment. This is now handled on the CI environment itself.
by @oliverschuerch with #656
Added high-contrast-mode styles for form-switch component.
by @oliverschuerch with #342
Fixed high-contrast-mode styles for tabs component.
by @oliverschuerch with #252
Added high-contrast-mode styles for .accordion-button
elements.
by @oliverschuerch with #388
Fixed dropdown line-height
and an invalid background-color
style in the intranet-header component.
by @oliverschuerch with #253
Fixed heading styles. This includes the html tags h1
, h2
, h3
, h4
, h5
and h6
, as well as there css-class pendants .h1
, h2
...
by @gfellerph with #115
Updated sizes for button components and reduced CSS output size.
by @gfellerph with #103
Refactored tabs component, to get rid of the css-class text-auto
.
by @oliverschuerch with #187
Added styles to show floating-label placeholder
in empty form-select component like a default input placeholder.
by @oliverschuerch with #169
Added high-contrast-mode styles for datatable component.
by @oliverschuerch with #434
Fixed border
styles in form-switch component in high-contrast-mode.
by @gfellerph with #116
Fixed floating-label placeholder opacity
in high-contrast-mode.
by @LarissaMS with #303
Added high-contrast-mode styles for all form components with class form-control
.
by @oliverschuerch with #384
Fixed safari display error in forms components.
by @oliverschuerch with #433
Added high-contrast-mode styles for component stepper component.
by @oliverschuerch with #164
Refactored styles for topic-teaser component.
by @oliverschuerch with #162
Added styles and documentation for ng-datatable component loading indicator.
by @Janobob with #7
Removed border
style from the table body
element.
by @Janobob with #5
Added high-contrast-mode styles for the subnavigation component.
by @oliverschuerch with #403
Added high-contrast-mode styles for the form-select component.
by @oliverschuerch with #348
Added high-contrast-mode styles for the progressbar component.
by @oliverschuerch with #153
Added high-contrast-mode styles for link elments. This overrides all a
, a:visited
, a:focus
and a:hover
colors with important
, to avoid different styling for visited links in firefox.
by @oliverschuerch with #402
Added high-contrast-mode styles for the spinner component.
by @oliverschuerch with #395
Added font-size
in .link-list
elements, without a font-size-curve
and removed the corresponding classes from the html-example.
by @oliverschuerch with #310
Added padding
for inner elements in nested badge component.
by @oliverschuerch with #646
Moved timepicker validation fix from version 4 to version 5.
by @Janobob with #14
Added high-contrast-mode styles to dropdown compoment. Added high-contrast-mode styles to the .datatale-button
element in the datatable component.
Fixed high-contrast-mode styles for disabled buttons.
by @oliverschuerch with #439
Added high-contrast-mode styles for the ng-timepicker component.
by @oliverschuerch with #394
Included last 2 safari versions in the .browserslistrc
and aligned .browserslistrc
files in all projects.
by @oliverschuerch with #162
Added high-contrast-mode styles for the progressbar component.
by @oliverschuerch with #393
Added story for the form-control component.
by @alizedebray with #560
Fixed font-color
in high-contrast-mode for focussed .form-select
and .form-select[multiple]
elements.
by @oliverschuerch with #338
Removed unnecessary pseudo-element on open sidebar menu icon.
by @oliverschuerch with #419
Removed search button border
, from the intranet-header component.
by @oliverschuerch with #417
Add padding
on media-breakpoint-down(md)
in the intranet-header component.
by @LarissaMS with #451
Fixed missing scss-variable imports in the datepicker component.
by @oliverschuerch with #460
Created a new package offering migration schematics for the Design System Styles. Removed custom input styles that are no longer used.
by @alizedebray with #183
Switched to the Apache 2.0 License.
by @gfellerph with #12
Removed license text from CSS bundles. The license is included in distributed NPM packages.
by @gfellerph with #12