Bald kommt die erste Public Beta von Blocksy v2.
Wie gewohnt wurde hier wieder erstklassige Arbeit abgeliefert.
Zum Beispiel war es bisher nur möglich die display conditions (für content blocks, sidebars etc) nur in der “oder” Beziehung anzulegen, oder für alle mittels Code Snippet die Beziehung auf “und” zu stellen.
Jetzt wurden die display conditions aufgebohrt, so dass nun auch komplexere Logiken (“oder” und “und” in Kombinationen) möglich sind.
Auch der lang erwartete und heißbegehrte Dark Mode wurde implementiert.
Aber worauf ich eigentlich Hinweisen möchte:
Namenskonvention der Theme Css Variablen geändert
Bisher waren die vom Blocks Theme verwendeten Variablen in CamelCase Schreibweise notiert. Zusätzlich wurde noch ein Präfix drangehängt.
Warum?
Dies war notwendig, da heutzutage immer mehr Plugins CSS-Variablen verwenden und das Blocksy Team, viele Konflikte durch die Benennung hatten fest stellten.
Außerdem laufen einige Server immer noch mit veralteter Technologie und es gibt ein Modul, das in CSS-Variablen keine Camel-Case-Namen mag – was dazu führt, dass im Frontend keine Stile angezeigt werden.
Falls du in deinem custom CSS die Blocks Variablen nutzt, musst du die Benennung korrigieren.
Hier eine Übersicht der Änderungen:
--theme-palette-color-1 -----> --theme-palette-color-1
--theme-palette-color-2 -----> --theme-palette-color-2
--theme-palette-color-3 -----> --theme-palette-color-3
--theme-palette-color-4 -----> --theme-palette-color-4
--theme-palette-color-5 -----> --theme-palette-color-5
--theme-palette-color-6 -----> --theme-palette-color-6
--theme-palette-color-7 -----> --theme-palette-color-7
--theme-palette-color-8 -----> --theme-palette-color-8
--fontFamily -----> --theme-font-family
--fontSize -----> --theme-font-size
--fontWeight -----> --theme-font-weight
--fontStyle -----> --theme-font-style
--lineHeight -----> --theme-line-height
--letterSpacing -----> --theme-letter-spacing
--textTransform -----> --theme-text-transform
--textDecoration -----> --theme-text-decoration
--buttonFontFamily -----> --theme-button-font-family
--buttonFontSize -----> --theme-button-font-size
--buttonFontWeight -----> --theme-button-font-weight
--buttonFontStyle -----> --theme-button-font-style
--buttonLineHeight -----> --theme-button-line-height
--buttonLetterSpacing -----> --theme-button-letter-spacing
--buttonTextTransform -----> --theme-button-text-transform
--buttonTextDecoration -----> --theme-button-text-decoration
--color -----> --theme-text-color
--linkInitialColor -----> --theme-link-initial-color
--linkHoverColor -----> --theme-link-hover-color
--linkActiveColor -----> --theme-link-active-color
--selectionTextColor -----> --theme-selection-text-color
--selectionBackgroundColor -----> --theme-selection-background-color
--buttonMinHeight -----> --theme-button-min-height
--button-width -----> --theme-button-max-width
--buttonShadow -----> --theme-button-shadow
--buttonTransform -----> --theme-button-transform
--buttonTextInitialColor -----> --theme-button-text-initial-color
--buttonTextHoverColor -----> --theme-button-text-hover-color
--theme-button-background-initial-color -----> --theme-button-background-initial-color
--buttonHoverColor -----> --theme-button-background-hover-color
--button-border -----> --theme-button-border
--button-border-hover-color -----> --theme-button-border-hover-color
--buttonBorderRadius -----> --theme-button-border-radius
--button-padding -----> --theme-button-padding
--form-font-size -----> --theme-form-font-size
--form-field-width -----> --theme-form-field-width
--form-field-height -----> --theme-form-field-height
--form-field-padding -----> --theme-form-field-padding
--form-field-border-width -----> --theme-form-field-border-width
--form-field-border-style -----> --theme-form-field-border-style
--form-text-initial-color -----> --theme-form-text-initial-color
--form-text-focus-color -----> --theme-form-text-focus-color
--form-field-border-initial-color -----> --theme-form-field-border-initial-color
--form-field-border-focus-color -----> --theme-form-field-border-focus-color
--form-field-border-radius -----> --theme-form-field-border-radius
--form-field-initial-background -----> --theme-form-field-background-initial-color
--form-field-focus-background -----> --theme-form-field-background-focus-color
--form-field-select-initial-background -----> --theme-form-select-background-initial-color
--form-field-select-active-background -----> --theme-form-select-background-active-color
--form-checkbox-border-radius -----> --theme-form-checkbox-border-radius
--form-selection-control-initial-color -----> --theme-form-selection-field-initial-color
--form-selection-control-accent-color -----> --theme-form-selection-field-active-color
--headings-color -----> --theme-headings-color
--heading-color -----> --theme-heading-color
--heading-1-color -----> --theme-heading-1-color
--heading-2-color -----> --theme-heading-2-color
--heading-3-color -----> --theme-heading-3-color
--heading-4-color -----> --theme-heading-4-color
--heading-5-color -----> --theme-heading-5-color
--heading-6-color -----> --theme-heading-6-color
--box-shadow -----> --theme-box-shadow
--border-color -----> --theme-border-color
--borderRadius -----> --theme-border-radius
--border -----> --theme-border
--borderTop -----> --theme-border-top
--borderBottom -----> --theme-border-bottom
--wide-offset -----> --theme-wide-offset
--content-spacing -----> --theme-content-spacing
--has-content-spacing -----> --has-theme-content-spacing
--boxed-content-spacing -----> --theme-boxed-content-spacing
--content-vertical-spacing -----> --theme-content-vertical-spacing
--container-edge-spacing -----> --theme-container-edge-spacing
--container-width -----> --theme-container-width
--container-width-base -----> --theme-container-width-base
--normal-container-max-width -----> --theme-normal-container-max-width
--narrow-container-max-width -----> --theme-narrow-container-max-width
--frame-size -----> --theme-frame-size
--frame-color -----> --theme-frame-color
--block-width -----> --theme-block-width
--block-max-width -----> --theme-block-max-width
--block-wide-max-width -----> --theme-block-wide-max-width
--boxed-content-max-width -----> --theme-boxed-content-max-width
--listIndent -----> --theme-list-indent
--listStyleType -----> --theme-list-style-type
--listItemSpacing -----> --theme-list-items-spacing
--descListIndent -----> --theme-description-list-indent
--descListSpacing -----> --theme-description-list-spacing
--table-font-size -----> --theme-table-font-size
--table-border-width -----> --theme-table-border-width
--table-border-style -----> --theme-table-border-style
--table-border-color -----> --theme-table-border-color
--table-padding -----> --theme-table-padding
--transition -----> --theme-transition
--default-editor -----> --theme-default-editor
--icon-size -----> --theme-icon-size
--icon-color -----> --theme-icon-color
--icon-hover-color -----> --theme-icon-hover-color
--icon-focus-color -----> --theme-icon-focus-color
--icon-active-color -----> --theme-icon-active-color
--icon-transition -----> --theme-icon-transition
--object-fit -----> --theme-object-fit
--object-position -----> --theme-object-position
