feat: Release 3.3 (#508)

* Update CHANGELOG.rst

* Update __init__.py

* Fix: Checkboxes
More: Flexbox-misalignments

* Update changelog

* Remove typo

* Fix: login bottom margin

Author: fsbraun

CHANGELOG.rst

@@ -2,10 +2,12 @@
 Changelog
 =========
 
-unreleased
-==========
+3.3.0 (2024-01-14)
+==================
 
-* Adjiust flex-container in newer Django versions (4.2+) for submit row and admin header
+* Allow more than two columns (as in the original Django admin)
+* Adjust flex-container in newer Django versions (4.2+) for submit row and admin header
+* Fix help texts for checkboxes and radio buttons
 
 3.2.7 (2024-01-04)
 ==================

djangocms_admin_style/__init__.py

@@ -16,4 +16,4 @@
 10. Publish the release when ready
 11. Github actions will publish the new package to pypi
 """
-__version__ = '3.2.7'
+__version__ = '3.3.0'

djangocms_admin_style/sass/components/_content.scss

@@ -374,12 +374,12 @@ ul.messagelist + #content {
         width: 100% !important;
         input {
             width: calc(100% - 50px) !important;
-            margin: 5px 50px 5px 0 !important;
+            margin: 0px 50px 5px 0 !important;
         }
         img {
             position: absolute;
             right: 0;
-            margin: 5px 0;
+            margin: 0;
 
             order: 2;
         }

djangocms_admin_style/sass/components/_forms.scss

@@ -9,6 +9,27 @@ form {
     fieldset, .inline-group {
         width: 80%;
     }
+
+    // Newer Django admin styles use flexbox, we do not
+    .flex-container {
+        display: block;
+        margin-right: 20px;
+    }
+    .flex-container.form-multiline {
+        display: flex;
+        margin-right: 0;
+        div.fieldBox {
+            display: block;
+            //margin-right: 0;
+        }
+        div:has(div.hidden) {
+            display: none;
+        }
+    }
+    fieldset.module > h2 {
+        margin-right: 20px;
+    }
+
     // only uses this styles if form-row is not set on a table row because before and after breaks tables #247
     .form-row:not(tr) {
         // adds clearfix because overflow hidden truncates highlighted focus fields #242
@@ -100,9 +121,11 @@ form {
         }
 
         // only affects field boxes when they are next to each other
-        & > .fieldBox, & > div > .fieldBox,
-        & > div > .flex-container > div:not(.related-widget-wrapper, .cke, .widget),
-        .form-multiline > div:not(.related-widget-wrapper, .cke, .widget) {
+        & > .fieldBox, & > div:not([class]) > .fieldBox,
+        & > div:not([class]) > .flex-container > div:not(.related-widget-wrapper, .cke, .widget),
+        .form-multiline > div:not(.related-widget-wrapper,
+        .form-multiline > div:not([class]) > div:not(.related-widget-wrapper),
+        .cke, .widget) {
             margin-right: 0px;
             box-sizing: border-box;
             width: 50%;
@@ -119,26 +142,6 @@ form {
                 border-top: none;
                 // padding-right: 2vw;
             }
-
-            &:nth-of-type(1) {
-                &:nth-last-of-type(2) {
-                    width: 50%;
-                    box-sizing: border-box;
-                    margin: 0 !important;
-                    padding-right: 10px;
-                    padding-left: 0;
-                }
-            }
-
-            &:nth-of-type(2) {
-                &:nth-last-of-type(1) {
-                    width: 50%;
-                    box-sizing: border-box;
-                    margin: 0 !important;
-                    padding-left: 10px;
-                    padding-top: 0;
-                }
-            }
         }
     }
     input[type="color"] {
@@ -430,7 +433,7 @@ form {
     }
     .checkbox-row {
         line-height: 20px;
-        margin-bottom: -10px;
+        margin-bottom: -5px;
         // wraps checkbox rows with border #188
         padding-top: 15px;
         border-top: solid 1px $gray-lighter;
@@ -459,10 +462,13 @@ form {
     }
 
     // backport from django 1.9
-    .aligned label + p {
-        padding: 6px 0;
-        margin-top: 0;
-        margin-bottom: 0;
+    .aligned label.vCheckboxLabel {
+        display: inline;
+        + p {
+            padding: 6px 0;
+            margin-top: 0;
+            margin-bottom: 0;
+        }
     }
 }
 
@@ -996,10 +1002,3 @@ form select[multiple] {
 .related-widget-wrapper-link:link:hover {
     opacity: 1;
 }
-
-form .flex-container {
-    display: block;
-    div.fieldBox {
-        display: inline-block;
-    }
-}

djangocms_admin_style/sass/components/_login.scss

@@ -9,6 +9,7 @@ body.login.djangocms-admin-style {
         width: 35.5% !important;
         min-width: 320px !important;
         margin-top: 165px;
+        padding: 20px 0;
         border: none;
         box-shadow: $base-box-shadow;
         background-color: $white !important;