govuk_publishing_components 41.0.0 → 41.1.0

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_stat-headline.scss

@@ -17,14 +17,14 @@
     }
 
     p {
-      @include govuk-font($size: 19, $weight: bold);
       margin: 0;
+      @include govuk-font($size: 19, $weight: bold);
     }
 
     em {
-      @include govuk-font($size: 80, $weight: bold);
       display: block;
       margin: 3px 0 -5px;
+      @include govuk-font($size: 80, $weight: bold);
     }
   }
 }

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_tables.scss

@@ -33,9 +33,9 @@
     }
 
     th {
-      @include govuk-font($size: 19, $weight: bold);
       text-align: left;
       color: $govuk-text-colour;
+      @include govuk-font($size: 19, $weight: bold);
     }
 
     td small {

data/app/assets/stylesheets/govuk_publishing_components/components/govspeak/_warning-callout.scss

@@ -30,8 +30,8 @@
     }
 
     p {
-      @include govuk-font($size: 19, $weight: bold);
       margin-left: 1em;
+      @include govuk-font($size: 19, $weight: bold);
     }
   }
 

data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_markdown-typography.scss

@@ -8,9 +8,9 @@
   ol,
   ul,
   p {
-    @include govuk-font($size: 19);
     margin-top: $govuk-gutter-half;
     margin-bottom: $govuk-gutter-half;
+    @include govuk-font($size: 19);
 
     @include govuk-media-query($from: tablet) {
       margin-top: $gutter-two-thirds;
@@ -24,15 +24,15 @@
   // thus H1's are not expected and are discouraged by bare styling
 
   h1 {
-    @include govuk-font($size: 19);
     margin: 0;
     padding: 0;
+    @include govuk-font($size: 19);
   }
 
   h2 {
-    @include govuk-font($size: 27, $weight: bold);
     margin-top: $govuk-gutter;
     margin-bottom: 0;
+    @include govuk-font($size: 27, $weight: bold);
 
     @include govuk-media-query($from: desktop) {
       margin-top: $govuk-gutter * 1.5;
@@ -41,9 +41,9 @@
   }
 
   h3 {
-    @include govuk-font($size: 19, $weight: bold);
     margin-top: $govuk-gutter + 5px;
     margin-bottom: 0;
+    @include govuk-font($size: 19, $weight: bold);
   }
 
   // H4, H5 and H6 are discouraged and thus styled the same
@@ -51,9 +51,9 @@
   h4,
   h5,
   h6 {
-    @include govuk-font($size: 19, $weight: bold);
     margin-top: $govuk-gutter + 5px;
     margin-bottom: 0;
+    @include govuk-font($size: 19, $weight: bold);
 
     + p {
       margin-top: 5px;

data/app/views/govuk_publishing_components/components/_cards.html.erb

@@ -3,9 +3,12 @@
   heading ||= nil
   items ||= nil
   sub_heading_level ||= 3
-  two_column_layout ||= false
+  columns ||= false
+
   ul_classes = %w[gem-c-cards__list]
-  ul_classes << 'gem-c-cards__list--two-column-desktop' if two_column_layout
+  ul_classes << 'gem-c-cards__list--two-column-desktop' if columns == 2
+  ul_classes << 'gem-c-cards__list--three-column-desktop' if columns == 3
+
   shared_helper = GovukPublishingComponents::Presenters::SharedHelper.new(local_assigns)
   component_helper = GovukPublishingComponents::Presenters::ComponentWrapperHelper.new(local_assigns)
   component_helper.add_class("gem-c-cards")

data/app/views/govuk_publishing_components/components/docs/cards.yml

@@ -1,13 +1,11 @@
-name: Cards (experimental)
+name: Cards
 description: A grid of cards that have a link and a description
 body: |
-  The component renders the cards as an unordered list element and visually presents it as a grid. It doesn't use the [GOV.UK Design System grid](https://design-system.service.gov.uk/styles/layout/#grid-system) but sets its own so that it can separately target desktop, tablet and mobile columns.
+  The component renders the cards as an unordered list element and visually presents it using CSS grid to display the cards in either a one (default), two or three column layout. It doesn't use the [GOV.UK Design System grid](https://design-system.service.gov.uk/styles/layout/#grid-system) but sets its own so that it can separately target desktop, tablet and mobile columns.
 
-  You can display the grid in three or two columns on desktop. Browsers that don't support CSS grid always display one column.
+  Browsers that don't support CSS grid always display one column.
 
   You must set a `href` for all the links.
-
-  This component is currently experimental. If you are using it, please feed back any research findings to the GOV.UK Explore team.
 accessibility_criteria: |
   The component must:
 
@@ -71,9 +69,42 @@ examples:
             path: http://www.gov.uk
           description: Owning or renting and council services
   two_column_layout:
-    description:  Override default three column layout on desktop by passing through `two_column_layout` parameter (defaults to `false`).
+    description:  Override default single column layout on desktop by setting the `columns` parameter to `2`.
+    data:
+      columns: 2
+      items:
+        - link:
+            text: Benefits
+            path: http://www.gov.uk
+          description: Includes eligibility, appeals, tax credits and Universal Credit
+        - link:
+            text: Births, deaths, marriages and care
+            path: http://www.gov.uk
+          description: Parenting, civil partnerships, divorce and Lasting Power of Attorney
+        - link:
+            text: Business and self-employed
+            path: http://www.gov.uk
+          description: Tools and guidance for businesses
+        - link:
+            text: Childcare and parenting
+            path: http://www.gov.uk
+          description: Includes giving birth, fostering, adopting, benefits for children, childcare and schools
+        - link:
+            text: Citizenship and living in the UK
+            path: http://www.gov.uk
+          description: Voting, community participation, life in the UK, international projects
+        - link:
+            text: Crime, justice and the law
+            path: http://www.gov.uk
+          description: Legal processes, courts and the police
+        - link:
+            text: Disabled people
+            path: http://www.gov.uk
+          description: Includes carers, your rights, benefits and the Equality Act
+  three_column_layout:
+    description: Override default single column layout on desktop by setting the `columns` parameter to `3`.
     data:
-      two_column_layout: true
+      columns: 3
       items:
         - link:
             text: Benefits

data/lib/govuk_publishing_components/version.rb

@@ -1,3 +1,3 @@
 module GovukPublishingComponents
-  VERSION = "41.0.0".freeze
+  VERSION = "41.1.0".freeze
 end

metadata

@@ -1,14 +1,14 @@
 --- !ruby/object:Gem::Specification
 name: govuk_publishing_components
 version: !ruby/object:Gem::Version
-  version: 41.0.0
+  version: 41.1.0
 platform: ruby
 authors:
 - GOV.UK Dev
 autorequire: 
 bindir: bin
 cert_chain: []
-date: 2024-07-30 00:00:00.000000000 Z
+date: 2024-08-06 00:00:00.000000000 Z
 dependencies:
 - !ruby/object:Gem::Dependency
   name: govuk_app_config
@@ -1837,14 +1837,14 @@ required_ruby_version: !ruby/object:Gem::Requirement
   requirements:
   - - ">="
     - !ruby/object:Gem::Version
-      version: '3.1'
+      version: '3.2'
 required_rubygems_version: !ruby/object:Gem::Requirement
   requirements:
   - - ">="
     - !ruby/object:Gem::Version
       version: '0'
 requirements: []
-rubygems_version: 3.5.16
+rubygems_version: 3.5.17
 signing_key: 
 specification_version: 4
 summary: A gem to document components in GOV.UK frontend applications