Change Log

6.12.0+doc.2 - 2024-06-27#

Deprecated#

  • Doc: "Lidl Plus Pricebox" | This component is deprecated and will not supported anymore.

6.12.0+doc.1 - 2023-04-03#

Deprecated#

  • CSS, Doc: "Customization - Medallia" | Add a warning about the deprecation of the complete medallia styling of CAKE and its documentation. The documentation and corresponding styling will be removed in a future version.

6.12.0 - 2023-03-16#

Added#

  • CSS, Doc: "Customization - Medallia" | added new utility class cake-medallia-survey--reduced-spacing

6.11.0 - 2023-03-06#

Added#

  • CSS, Doc: "Customization - Medallia" | new utility class to remove max-width and height from image elements cake-medallia-survey--no-max-dimension
  • CSS, Doc: "Customization - Medallia" | new utility classes to add additional spacing to form elements cake-medallia-survey--spacing-(top|right|bottom|left|x|y)

Fixed#

  • CSS, Doc: "Customization - Medallia" | fixed wrong font-family in textare elements in the "lidl.de" property
  • CSS, Doc: "Customization - Medallia" | fixed broken styling of NPS elements in the "lidl.de" property
  • CSS, Doc: "Customization - Medallia" | fixed broken styling of active checkboxes in the "lidl.de" property

6.10.1 - 2023-01-04#

Changed#

  • CSS, Doc: "Customization - Medallia" | updated asset url for lidl fonts to make them avaialble through official CDN

6.10.0 - 2022-11-14#

Added#

  • CSS, Doc: "Customization - Medallia" | added CAKE styles for section break, text, text input, email and dropdown
  • CSS, Doc: "Customization - Medallia" | added documentation for the image class cake-medallia-survey--unstyled
  • Doc: "Customization - Medallia" | added note for unwanted text styles (italic, underline and h6)

Changed#

  • Doc: "Cookie alert" | moved CookieBot theme and OneTrust theme to Customization

6.9.0 - 2022-10-04#

Added#

  • Added: Medallia documentation for integrating surveys

6.8.0 - 2022-09-05#

Added#

  • SCSS, JS, Doc: "Customization" | added theme for OneTrust

6.7.1 - 2022-08-08#

Fixed#

  • SCSS, Doc: "Form" | fixed wrong horizontal paddings of textarea elements

6.7.0 - 2022-07-25#

Added#

  • SCSS, Doc: "Form" | added stylings and documentation for textarea elements

Changed#

  • Doc: "Form" | restructured the content of form documentation to improve readability

6.6.0 - 2022-06-27#

Highlights#

  • SCSS: "Grid" | Updated smallest breakpoint XS to 360px
  • Added: "Skeleton" | Added new skeleton utitlity for loading contents

6.5.1 - 2022-02-21#

Removed#

  • Assets: "Icon" | removed redundant store locator pin/group-store-default.svg

6.5.0 - 2022-02-21#

Highlights#

  • Added: "Rating" | Added new (star-)rating component

Added#

  • Assets: "Icon" | added new store locator pin icons
    • store locator pin/available-store-default.svg
    • store locator pin/available-store-selected.svg
    • store locator pin/group-store-default.svg
    • store locator pin/group.svg
    • store locator pin/low-stock-store-default.svg
    • store locator pin/low-stock-store-selected.svg
    • store locator pin/my-store-default.svg
    • store locator pin/my-store-selected.svg
    • store locator pin/no-data-available-store-default.svg
    • store locator pin/no-data-available-store-selected.svg
    • store locator pin/sold-out-store-default.svg
    • store locator pin/sold-out-store-selected.svg

Changed#

  • SCSS: "Availability badge" | updated default (gray) badge to also show the dot
  • SCSS, HTML: "Availability badge" | added new class .av-badge-dot to display dot before content (previously the dot was added automatically at the colored availability badges)
  • Assets: "Icon" | updated all icons via our Design from the Brand Portal

Removed#

  • DOC: "Ribbon" | Removed mentions and example of product tile in the documentation

Fixed#

CSS: "product tile" | Reduce card-body padding on XS screensizes to match design specification

6.4.2 - 2022-01-24#

Fixed#

  • SCSS: "Form" | fixed on focus invisibility in chrome on inputs with icon

6.4.1 - 2021-11-29#

Changed#

  • Assets: "Breadcrumb" | updated SCSS-only icon ./icons/_scssOnly/pipe.svg to match pipe of design specification and remove messy corners

6.4.0 - 2021-10-28#

Added#

  • Assets: "Breadcrumb" | added new SCSS-only icon ./icons/_scssOnly/pipe.svg
  • SCSS: "Breadcrumb" | added general $icon-discrepancy variable to _variables-theme.scss
  • SCSS: "Breadcrumb" | added new variables $breadcrumb-item-margin-y, $breadcrumb-icon-color, $breadcrumb-link-hover-active-color, $breadcrumb-divider-width to _variables-theme.scss

Changed#

  • SCSS: "Breadcrumb" | updated styling of breadcrumb to match new styleguide specification
  • SCSS: "Breadcrumb" | updated $breadcrumb-divider in _variables-root.scss

Removed#

  • HTML: "Breadcrumb" | Remove active item from breadcrumb
  • SCSS: "Breadcrumb" | removed $breadcrumb-active-color in _variables-root.scss

6.3.0 - 2021-10-01#

Highlights#

  • Added: Availability Badge-Component

Added#

  • Doc: "JavaScript" | Add documentation for the JavaScript extensions available through cakeDOM(.min).js

Changed#

  • JS, Doc: "Customization - CookieBot" | updated JavaScript to add close functionality and improve reliability

Fixed#

  • SCSS: "Button" | fixed font-size for md and smaller to 1rem (16px)

6.2.0 - 2021-08-19#

Added#

  • Doc: "Accordion" | added javaScript file content as "JS" tab
  • SCSS: "Alert" | added font-size to alert-close button to match the icon size
  • Doc: "Alert" | added javaScript file content as "JS" tab
  • Doc: "Cookie alert" | added javaScript file content as "JS" tab
  • Doc: "Form" | added javaScript file content as "JS" tab
  • Doc: "Header" | added javaScript file content as "JS" tab
  • Doc: "Popover" | added javaScript file content as "JS" tab
  • Doc: "Tab" | added javaScript file content as "JS" tab
  • Doc: "Theme-Slider" | added javaScript file content as "JS" tab
  • Doc: "To top" | added javaScript file content as "JS" tab

Changed#

  • Docs: "Theming" | Fix missing package-name and wrong file-path in example SCSS import
  • Docs: "Reboot" | Add missing fallback fonts Calibri and Arial to documentation example
  • SCSS: "Pricebox" | changed .pricebox-highlight font-weight to 800
  • Docs: "Color" | Fix 2 broken links to Theming documentation page

6.1.0 - 2021-07-22#

Added#

  • CSS, Doc: "Shadow" | Added .shadow, .shadow-strong and .shadow-flyout to the new Utilities->Shadow documentation page.

Changed#

  • SCSS: "Badge" | move calculation subtraction of border-width from paddings into the component SCSS instead of the configuration variables
  • Assets: "Icon" | added new solid versions of the smiley icons
    • smiley/smiley-bad-solid.svg
    • smiley/smiley-best-solid.svg
    • smiley/smiley-better-solid.svg
    • smiley/smiley-good-solid.svg
    • smiley/smiley-neutral-solid.svg
    • smiley/smiley-worst-solid.svg

6.0.1 - 2021-06-24#

Changed#

  • Doc: "Download" | Update naming of download button
  • Doc, SCSS: "Typography" | Update font-family definition ($font-family-sans-serif) by adding additional fallback-fonts Calibri, Arial directly after the default font-family LidlFontCondPro
  • Assets: "Icon" | updated box icon in transport & logistic/box.svg
  • SCSS: "Pricebox" | Update pricebox stylings to bring the appearance more in line with the print definitions
    • Update text color of the component
    • Update label and basic quantity font size
    • Update margins of price container (.pricebox-container)

6.0.0 - 2021-04-19#

Highlights#

  • SCSS, Doc, HTML: "Pricebox" | The pricebox with the theme info has been completely removed from our framework and documentation. With this we follow the internal guidelines. Read more about this in our Migration guide.

Added#

  • Assets: "Icon" | added new icons
    • expression/conversation-ballons-chat.svg
    • expression/lightbulb-off.svg
    • expression/piggy-bank.svg
    • food & beverage/beer-glass.svg
    • food & beverage/bottle.svg
    • food & beverage/piece-of-cake.svg
    • interaction/invoice.svg
    • nature/ecology-2.svg
    • payment/voucher-euro.svg
    • payment/voucher-gift.svg
    • technology/e-charging-station.svg
    • technology/keyboard.svg
    • technology/power.svg
    • transport & logistic/box-multiple.svg
    • transport & logistic/box-return-30-days.svg
    • transport & logistic/box-return-90-days.svg
    • transport & logistic/express-delivery.svg
    • transport & logistic/packstation.svg

Removed#

  • SCSS, Doc, HTML: "Pricebox" | removed pricebox theme .pricebox-with-highlight-info completely

5.1.0 - 2021-03-22#

Added#

  • Doc, SCSS: "Typography" | added .display-1 to .display-5 to theme
  • SCSS: "Accordion" | added margin-left to the icon, to match the design requirements
  • SCSS: "Accordion" | Added overflow: hidden and text-overflow: ellipsis to the accordion label to hide too much content.
  • SCSS: "Color" | Added new color $disabled with code #7e868f
  • SCSS: "Color" | Added new color $disabled-lighter with code #eaebec

Changed#

  • SCSS: "Button" | Updated styling of disabled buttons to achieve better contrast ratios and accessibility
  • Assets: "Icon" | updated interaction/house.svg icon

Fixed#

  • SCSS: "Accordion" | fixed margin-top between accordion elements to be exact 8px

5.0.0 - 2021-01-28#

Remove#

  • SCSS: Remove $orientation parameter from media-breakpoint-… – …-up, …-down, …-between, …-only mixin (now it's bootstrap original mixin)

Added#

  • SCSS: Add new mixins cake-media-breakpoint-… – …-up, …-down, …-between, …-only with $orientation property (functionality of previous media-breakpoint-…)

Changed#

  • Doc: "JavaScript" | Remove "Schwarz" theme example from documentation. It will be relocated in a "Schwarz" theme specific documentation.
  • SCSS: "Section head" | added variables $section-head-min-height and $section-head-min-height-lg-up
  • Doc, SCSS: "Typography" | Rename font-face mixin to cake-font-face
  • Doc, SCSS: "Typography" | Rename build-font-faces mixin to cake-build-font-faces
  • JS, Doc: "Accordion" | updated javascript to provide options object for better integration of CAKE
  • HTML, Doc: "Accordion" | refactored data-toggle=accordion-collapse to data-controller="accordion/input"
  • SCSS: "Accordion" | add new variables $accordion-max-height and $accordion-padding-y
  • JS, Doc: "Alert" | updated javascript to provide options object for better integration of CAKE
  • HTML, Doc: "Alert" | refactored data-dismiss=alert to data-controller="alert"
  • SCSS: "Alert" | Rename alert mixin alert-variant to cake-alert-variant
  • SCSS: "Breadcrumb" | added new variable $breadcrumb-icon-margin-top
  • HTML: "Breadcrumb" | removed icon-sizing from css and use icon utility-class .icon-2 for icon
  • SCSS: "Button" | rename button mixins
    • button-variant to cake-button-variant
    • button-outline-variant to cake-button-outline-variant
    • button-size to cake-button-size
    • button-size-fixed-height to cake-button-size-fixed-height
  • JS, Doc: "Form" | updated javascript to provide options object for better integration of CAKE
  • SCSS: "Form" | rename mixin form-validation-state to cake-form-validation-state
  • SCSS: "Form" | rename mixin dynamic-padding-y-for-fixed-height to cake-dynamic-padding-y-for-fixed-height
  • JS, Doc: "Header" | updated javascript to provide options object for better integration of CAKE
  • HTML, Doc: "Header" | rename all data-toggle attributes to data-controller
  • SCSS: "Header" | the mobile header (xs-sm) no longer overlaps the web page content (use of position: sticky instead of position: fixed)
  • SCSS: "Header" | add new variable for mobile header-height $header-mobile-height with value of 56px (equals 3.5rem)
  • Scss: "Icon" | changed .icon-8 > .icon-1, .icon-16 > .icon-2, .icon-24 > .icon-3 and .icon-32 > .icon-4
  • Assets: "Icon" | renamed icon calender-clock.svg to calendar-clock.svg
  • JS, Doc: "Popover" | updated javascript to provide options object for better integration of CAKE
  • SCSS: "Popover" | rename tippyjs-theme mixin to cake-tippyjs-theme
  • NPM: "Popover" | updated the dependency tippy.js from version 6.2.3 to 6.2.7
  • JS, Doc: "Tab" | updated javascript to provide options object for better integration of CAKE
  • JS, Doc: "Theme-Slider" | updated javascript to provide options object for better integration of CAKE
  • HTML, Doc: "Theme-Slider" | refactor all data-toggle properties to data-controller for unification of all CAKE components
  • SCSS: "Theme-Slider" | added the variables $theme-slider-width and $theme-slider-width-md-up to specify the width of theme-slider
  • NPM: "Theme-Slider" | updated the dependency tiny-slider from version 2.9.1 to 2.9.3
  • JS, Doc: "To top" | updated javascript to provide options object for better integration of CAKE
  • Doc: "Customization - CookieBot" | Updated description of cookiebot usage when cake-bundle is used
  • SCSS: Renamed bg-gradient-variant mixin to cake-bg-gradient-variant
  • SCSS: Renamed triangle mixin to cake-triangle
  • SCSS: Renamed triangle-position mixin to cake-triangle-position
  • SCSS: Renamed reset-link mixin to cake-reset-link
  • SCSS: Renamed gradient-diagonal-line mixin to cake-gradient-diagonal-line
  • SCSS: Adjusted the variable $border-radius-lg to a value of 10px in REM

Fixed#

  • SCSS: "Alert" | fixed padding to exclude the border size
  • SCSS: "Badge" | fixed padding to exclude the border size
  • SCSS: "Form" | fixed correct calculation of the right pudding from inputs with icons
  • SCSS: "Pricebox" | fixed padding to exclude the border size

4.4.0 - 2020-10-22#

Added#

  • SCSS: "Alert" | added focus style to alert-close button

Changed#

  • SCSS: "Button" | set focus style to default CAKE focus on each button variant
  • Assets: "Lidl-Theme" | "Icon" | updated #store-magnifier and #store to look more like lidl
  • SCSS: "To top" | adjusted focus style to use default CAKE focus stylings
  • Doc: "To top" | Fix negative example of to top button

Fixed#

  • Doc: "Reboot" | Removed !default from font stack from Lidl theme
  • SCSS: "Floating action button" | fix box shadow variable
  • SCSS: "Popover" | reset border-radius to 0 after tippy SCSS

4.3.0 - 2020-09-24#

Highlights#

  • Added new Component "Floating action button"

Added#

  • Doc, SCSS: "Typography" | Added negative link styling
  • SCSS, DOC: "Floating action button" | Added new floating action button

Changed#

  • SCSS: "Button" | add cursor not-allowed to disabled buttons

4.2.0 - 2020-08-27#

Highlights#

  • Added: Added new section for all Lidl Plus relevant content (Coupon, Flap, Pricebox and Ribbon)

Added#

  • SCSS, DOC: "Lidl Plus" | Added new Lidl Plus ribbon variant (.ribbon-item-lidl-plus) for usage in Lidl Plus projects
  • Added: "Lidl Plus Coupon" | Added new component for Lidl Plus only, the coupon
  • Assets: "Schwarz Theme" | Added alternative logo variant logo-simple.svg

Changed#

  • Doc: "Pricebox" | Moved Lidl Plus pricebox variant to "Lidl Plus" category
  • Assets: "Schwarz Theme" | Replaced logo file logo.svg. Now the "Lidl" and "Kaufland" logo is included.

Fixed#

  • HTML: "Grid" | removed wrapper .cake-example-row div from code examples
  • HTML: "Overview" | removed wrapper .cake-example-container div from code examples
  • HTML: "Button" | removed wrapper .cake-example-negative div from some code examples
  • HTML: "Popover" | removed wrapper .cake-example-popover div from code examples
  • HTML: "Ribbon" | removed wrapper .cake-example-ribbon div from some code examples
  • HTML: "Tab" | removed wrapper .cake-example-tab-content div from some code examples
  • HTML: "Teaser" | removed wrapper .cake-example-container div from some code examples
  • HTML: "Border" | removed wrapper .cake-example-border-utils div from code examples

4.1.0 - 2020-07-30#

Added#

  • Assets: "Lidl-Theme" | "Icon" | new paper-plane and share icon in interaction icons
  • CSS, Doc: "Pricebox" | Add new Lidl Plus pricebox variant (.pricebox-lidl-plus) for usage in Lidl Plus projects

Changed#

  • SCSS: Set $list-group-border-color to "gray lighter".

4.0.0+doc.1 - 2020-07-01#

Fixed#

  • Doc: "Download" | Fixed wrong link to npm package.

4.0.0 - 2020-06-25#

Added#

  • Doc: "Theming" | Added scss/variables-root to imports in example code.
  • Doc: "Theming" | Updated simple theming example: changed path of import to the new location ../themes/Cake/scss/cake
  • SCSS: "Popover" | New variables are available for popover: $popover-font-weight, $popover-bg-color, $popover-color, $popover-border-color, $popover-arrow-color, $popover-svg-arrow-color, $popover-backdrop-bg-color additional to the existing $popover-border-radius, $popover-box-shadow, $popover-font-size, $popover-padding
  • JS: All themes compile a JavaScript file for each component. Not only a large cellecting JS file. So you can include a ready to use JS file for only the comonents you use in your project.
  • NPM: Added Themed files to npm package
  • SCSS: The Lidl and Schwarz themes also contains cake-grid.scss and cake-reboot.scss file.

Changed#

  • Doc: "Download" | Updated the registry and npm description because there no longer exists the need to authenticate in order to download the package!
  • Doc: "JavaScript" | Updated the example code lines to match the new structure with theme folder.
  • SCSS: "Typography" | renamed _typography-content.scss to _typography.scss
  • SCSS: "Typography" | the import of typography-font-face SCSS file takes now place in the cake.scss file
  • CSS: "Alert" | Use text color for closing "x" hover state instead of black.
  • SCSS: "Card" | Change links on cards to do not hide underline on hover
  • SCSS, JS, HTML: "Cookie alert" | Renamed cookie-alert-extended to cookie-alert in all classes, javascript-methods, data-controllers and files.
  • JS: "Cookie alert" | Disable primary CTA button on expanded details
  • JS: "Popover" | Updated Tippy.js to version 6.2.3. Import "~tippy.js/dist/tippy" and "~tippy.js/dist/border" into your project for styling.
  • Assets: Moved CAKE logo from /Container/assets/images/logo.svg to theme folder /Container/themes/Cake/assets/images/logo.svg.
  • JS: Moved collecting JS file cake.js from /Container/js/ folder to /Container/themes/Cake/js. This file contains all JavaScript components.
  • SCSS: Moved SCSS files cake-cookiebot.scss, cake-grid.scss, cake-reboot.scss and cake.scss from /Container/scss/ folder to /Container/themes/Cake/scss. The general files with _ prefix stays in /Container/scss/.
  • SCSS: Renamed class .cake-html-default to .html-style
  • SCSS: Renamed class .cake-body-defautl to .body-style
  • SCSS: Renamed file _variables-color to _variables-root

Removed#

  • SCSS, JS, HTML: "Cookie alert" | Removed deprecated cookie-alert in all classes, javascript-methods, data-controllers and files.

Fixed#

  • CSS: "Form" | Set font color for focused select field in Firefox instead of inheritance. The ESR 68 Version has a different behavior as newer once.

3.11.1 - 2020-05-07#

Fixed#

  • Doc: "Download page" | Fixed version number

3.11.0 - 2020-04-09#

Highlights#

  • Added: Added Lidl Plus page in new Additional specalties category
  • Added: "Flap" | Added flap component to Lidl Plus page

Changed#

  • SCSS: "Header" | Changed background opacity of $header-mobile-overlay-color to 72%
  • DOC: "Ribbon" | Add note that wrapper element should have position: relative

Fixed#

  • Doc: "Text" | Fixed table head of .hyphens

3.10.0 - 2020-02-27#

Added#

  • SCSS: "Theme-Slider" | The card component has a updated "card-body" padding. The theme slider inherit this value. So we have to set the previos value of .5rem explicitly. The padding can be modified with the new $theme-slider-card-body-padding variable.

Changed#

  • SCSS: "Card" | Set $card-spacer-x from .5rem to 1rem
  • SCSS: "Card" | Set $card-img-overlay-padding from 1.25rem to 1rem
  • SCSS: "Card" | Set $card-columns-margin from $card-spacer-y to $card-spacer-y * 2
  • SCSS: "Card" | Set $list-group-item-padding-y from .75rem to .5rem
  • SCSS: "Card" | Set $list-group-item-padding-x from 1.25rem to 1rem
  • HTML: "Card" | We use the modifier .text-sm with fixed font size to set smaller font sizes instead of <small> tag with a percentage value. Also the example with <h6> has the .text-sm modifier class.

Deprecated#

  • CSS: "Form" | .text-disabled class becomes obsolete
  • SCSS: "Form" | $text-disabled variable becomes obsolete

Removed#

  • HTML: "Form" | Disabled form element labels no longer have a text-disabled modifier CSS class.

3.9.0 - 2020-01-16#

Highlights#

  • Added: "Cookie alert" | Added extended overlay version of cookie alert with configuration menu
  • Added: "Cookie alert" | Added templates and tutorial on how to integrate our cookie alert into Cookie-Bot
  • Doc: "Browser focus" | Added basic explanation and style description for cake browser focus

Added#

  • Doc: "Browser focus" | Added basic explanation and style description for cake browser focus

Changed#

  • SCSS: "Accordion" | added new height for xs-md
  • CSS: "Alert" | Changed background color to "base" version instead of "dark".
  • CSS: "Alert" | Changed border color to "darker" version instead of "dark".
  • SCSS: "Button" | added new calculated height for xs-md
  • SCSS: "Form" | added new height via calculated padding-y on xs-md for inputs and selects
  • SCSS: "Ribbon" | Use position: absolute instead of relative in .ribbon class to allow useful positioning (eg. in the product tile)
  • SCSS: "Ribbon" | Add left: 0 to .ribbon styling to span it over the complete width of it's parent
  • DOC: "Ribbon" | The headings "Multiple ribbons and "Ribbon colors" have been exchanged.
  • DOC: "Ribbon" | Add example ribbon on product tile and teaser component.
  • SCSS: Use // comments if possible instead of /* */. The first ones are not in the CSS output.

Deprecated#

  • "Cookie alert" | The simple version with notice banner will be deprecated in future releases. Due to legal requirements the extended cookie alert with settings must be used.

Removed#

  • SCSS: "Button" | variable $btn-padding-tb-diff and corresponding calculation deleted

3.8.0 - 2019-11-07#

Highlights#

  • Changed: Improvement of Header accessibility
  • Changed: Code improvement (linter)

Added#

  • SCSS: "Accordion" | Transitions are configurable in the variables.scss file
  • Doc: "Badge" | Inform about the diff between frontend and design
  • SCSS, JS, HTML: "Cookie alert" | Added extended overlay version of cookie alert with configuration menu
  • HTML, CSS, Doc: "Header" | Added <abbr> tags and aria-label text to the language selection in header for better accessibility
  • HTML, CSS, Doc: "Header" | Added sr-only text to the user navigation badges in header for better accessibility
  • Doc: "Icon" | info to more icons

Changed#

  • SCSS: "Accordion" | Icon transition is now configurable $accordion-icon-transition
  • SCSS: "Accordion" | Use mixins for border radius and transition
  • SCSS: "Banner" | Use mixins for border radius
  • SCSS: "Button" | Set !default to variable $btn-slider-color, $btn-slider-bg and $btn-slider-box-shadow
  • SCSS: "Card" | Set !default to variable $card-title-line-height and $card-subtitle-line-height
  • Doc: "Form" | Moved input-group documentation from menu "Input group" to "Form" (and deleted dedicated page "Input group")
  • SCSS: "Form" | Set !default to variable $custom-control-indicator-checked-danger-color
  • SCSS: "Header" | Use mixins for border radius and transition
  • CSS: "Header" | Moved some CSS parts inside the file to reduce selectors
  • CSS: "Pagination" | Prevent selector "no-qualifying-type"
  • SCSS: "Popover" | Use mixins for border radius
  • CSS: "Popover" | Add " to some selectors
  • CSS: "product tile" | Prevent selector "no-qualifying-type"
  • SCSS: "Ribbon" | Use mixins for border radius
  • SCSS: "Tab" | Use mixins for border radius
  • CSS: "Theme-Slider" | updated line-height of theme-slider headlines to be 120%
  • CSS: "Theme-Slider" | updated spacing between subheadline and headline to be 0.25rem
  • SCSS: "Theme-Slider" | Use mixins for border
  • SCSS: "To top" | Use mixins for border radius

Fixed#

  • SCSS: "Section head" | Added !default to $section-head-border-colort in _variables.scss file.
  • SCSS: "Button" | Added !default to $btn-slider-hover-color, $btn-slider-hover-bg in _variables.scss file.
  • SCSS: "Cookie alert" | Added !default to $cookie-alert-color, $cookie-alert-bg-color, $cookie-alert-font-size in _variables.scss file.
  • SCSS: "Header" | Added !default to $header-usernavigation-link-width, $header-usernavigation-link-width-md, $header-usernavigation-link-width-lg, $header-mobile-overlay-width-percentpoints, $header-mobile-overlay-width in _variables.scss file.
  • SCSS: "Tab" | Added !default to $tab-icon-path-previous, $tab-icon-path-next in _variables.scss file.
  • SCSS: "Theme-Slider" | Added !default to $theme-slider-outer-gutter, $theme-slider-active-color, $theme-slider-active-card-body-bg, $theme-slider-active-hover-color, $theme-slider-card-inner-border-radius, $theme-slider-subhead-font-weight, $theme-slider-title-font-weight in _variables.scss file.
  • CSS: "Theme Slider" | updated title font-size to 1rem on MD and 1.125rem from LG
  • SCSS: "To top" | Added !default to $to-top-right in _variables.scss file.
  • SCSS: "Trustbar" | Added !default to $trustbar-bg, $trustbar-color, $trustbar-icon-margin-right, $trustbar-item-height-sm, $trustbar-item-height-lg in _variables.scss file.

3.7.1 - 2019-10-01#

Fixed#

  • Doc: "Change log" | Added missing change log entries of the header in v3.7.0
  • Doc: "Change log" | Added missing change log entry of the new JavaScript documentation page in v3.7.0

3.7.0 - 2019-09-30#

Highlights#

  • Added: Added slider functionality to the header component
  • Doc: Added new explanation page for using our JavaScript

Added#

  • Doc: "Button" | Added possibility to add white background to positive secondary button in documentation.
  • HTML, JS, CSS: "Header" | Added slider functionality to the header component
  • Doc: "Header" | Added text to explain the possibility to enlarge the usernavigation width to fit long words in title.
  • Doc: "JavaScript" | Added new explanation page for using our JavaScript

Changed#

  • CSS: "Header" | Using fixed width instead of paddings for header usernavigation. The width is customizable to the word length in your project.
  • CSS: "Header" | Usernavigation title can have two lines.
  • JS: "Theme-Slider" | updated tiny-slider default config to set fixedWith also on breakpoint, if defined

Deprecated#

  • CSS: "Header" | $header-usernavigation-link-padding-y. The padding applies now to the top. So we renamed the variable to $header-usernavigation-link-padding-top. For backward compatibility the old variable is maped to the new one.

Fixed#

  • CSS: "Alert" | Darker text color for a higher contrast ratio
  • CSS: "Header" | Fixed wrong margin and line-height of .header-navigation-link and .header-subnavigation-link resulting in a wrong height of these elements.
  • CSS: "Header" | margin-right: 0.0625rem in language list items applied only to itself. Not to the other list items in header any more.
  • CSS: "Header" | Usernavigation title has line-height: 1.2 instead of inherited 1.4
  • CSS: "Header" | Added 0.125rem space between usernavigation icon and title

3.6.0 - 2019-08-15#

Highlights#

  • Added: Badge-Component

Added#

  • Doc: "Typography" | fonts-to-load discription added
  • CSS, HTML: "Header" | add badge (pill) to usernavigation as an indicator
  • JS: "Header" | add "open" event to header element, when burger-menu toggles
  • JS, CSS, HTML: "Header" | add multiple subnavigations with sliding effect on mobile

3.5.0 - 2019-07-18#

Highlights#

  • Added: Cookie Alert-Component

Added#

  • CSS, HTML: "Header" | subnavigation has been added in breakpoints MD-LG

Changed#

  • CSS: "To top" | Updated position of to-top button with additional .btn-to-top-position to stay on the right position of the grid.

Fixed#

  • Doc: "Overview" | container examples fixed (only the first one was rendered three times before)

3.4.0 - 2019-07-04#

Changed#

  • CSS: "Button" | font-size changed to be constant at 1.125rem (18px)

Fixed#

  • Doc: "Icon" | Fix not showing icons in IE11 in showroom

3.3.0 - 2019-06-26#

Added#

  • Doc: New notice to inform the user if the component or element is modifiable or not modifiable.

Changed#

  • Env: Update npm package URL from schwarzit.pkgs.visualstudio.com to pkgs.dev.azure.com/schwarzit

Fixed#

  • Doc: "Icon" | misspelled headline fixed in icon sizing example
  • CSS: "price-box"
    • Padding top of pricebox "highlight" from 0.375rem (6px) to 0.25rem (4px) from breakpoint SM and higher
    • Padding bottom of pricebox "highlight" from 0.875rem (14px) to 0.75rem (12px) from breakpoint SM and higher

3.2.0 - 2019-06-06#

Highlights#

  • Doc: "Download" | CAKE is now available on the world wide web as an npm package. See the documentation on how to get it, under "Download".

Changed#

  • Assets: "Lidl-Theme" | "Icon" | Replace and add new set of lidl-icons into the lidl-theme
  • Doc: "Icon" | Icon sizing examples restructured

Fixed#

  • Doc: "Grid" | wrapping div .container-responsive removed from no-gutter example
  • CSS: "product tile" | Only if the product tile is linked, the title has an underline on hover.

3.1.0 - 2019-05-24#

Highlights#

  • Changed: CAKE is now available in a neutral design. The styling of the components is done in themes and Lidl is now one of them.

Added#

  • Doc: "To top" | Added spacing information between "To top" button and "Footer" components.

Changed#

  • CSS, Assets: "Header" | component get the Logo from the theme
  • CSS, Assets: "Icon" | component get the icon set from the theme
  • CSS, Assets: Split component styling from default CAKE to seperate theme repository. You have to include a theme to get styled components. Otherwise the components are displayed in neutral gray colors.
    • New theme repositories
    • CAKE has now neutral colors, icons and fonts instead of Lidl styling.
    • "Header" component get the Logo from the theme
    • "Icon" component get the icon set from the theme
    • variables.scss
      • $fonts-to-load has now the value null as default. The Lidl fonts now takes place in the Lidl theme.
      • $font-family-sans-serif moved LidlFontCondPro from font set in CAKE to the Lidl theme.
      • $font-weight-bold has now the value 700. The Lidl font-weight for bold now takes place in the Lidl theme.

Removed#

  • Assets: "Icon" | removed social-media icons
  • HTML: removed the deprecated example pages site/examples

Fixed#

  • CSS: "Header" | Changed color of $header-navigation-back-bg-color in variables.scss to "gray lighter"
  • CSS: "Header" | Changed width calculation for mobile menu in component "Header" (.header-navigation)