Module: ContentBlockTools::OverrideClasses

Included in:
BaseComponent
Defined in:
lib/content_block_tools/helpers/override_classes.rb

Overview

Helper methods for generating override CSS classes These methods generate CSS class names for spacing and typography utilities from the GOV.UK Design System.

Instance Method Summary collapse

Instance Method Details

#font_classes(size, weight) ⇒ String

Generates combined font size and weight CSS classes

Examples:

Generate font classes with size and weight

font_classes(19, "bold")
# => "govuk-!-font-size-19 govuk-!-font-weight-bold"

Generate font classes with different values

font_classes(24, "regular")
# => "govuk-!-font-size-24 govuk-!-font-weight-regular"

Parameters:

  • size (Integer, String) —

    the font size value (e.g., 16, 19, 24)

  • weight (String, Symbol) —

    the font weight value (e.g., “bold”, “regular”)

Returns:

  • (String) —

    the generated font size and weight classes separated by a space



58
59
60
61
62
63
 
# File 'lib/content_block_tools/helpers/override_classes.rb', line 58

def font_classes(size, weight)
  [
    font_size_class(size),
    font_weight_class(weight),
  ].join(" ")
end

#font_size_class(size) ⇒ String

Generates a font size CSS class

Examples:

font_size_class(19)
# => "govuk-!-font-size-19"

Parameters:

  • size (Integer, String) —

    the font size value (e.g., 16, 19, 24)

Returns:

  • (String) —

    the generated font size class



73
74
75
 
# File 'lib/content_block_tools/helpers/override_classes.rb', line 73

def font_size_class(size)
  "govuk-!-font-size-#{size}"
end

#font_weight_class(weight) ⇒ String

Generates a font weight CSS class

Examples:

font_weight_class("bold")
# => "govuk-!-font-weight-bold"

Parameters:

  • weight (String, Symbol) —

    the font weight value (e.g., “bold”, “regular”)

Returns:

  • (String) —

    the generated font weight class



85
86
87
 
# File 'lib/content_block_tools/helpers/override_classes.rb', line 85

def font_weight_class(weight)
  "govuk-!-font-weight-#{weight}"
end

#margin_classes(top, right = nil, bottom = nil, left = nil) ⇒ String

Generates margin CSS classes

Examples:

Generate uniform margin

margin_classes(4)
# => "govuk-!-margin-4"

Generate individual side margins

margin_classes(4, 3, 2, 1)
# => "govuk-!-margin-top-4 govuk-!-margin-right-3 govuk-!-margin-bottom-2 govuk-!-margin-left-1"

Parameters:

  • top (Integer, String) —

    the margin value for all sides (if used alone) or top margin

  • right (Integer, String, nil) (defaults to: nil) —

    the right margin value (optional)

  • bottom (Integer, String, nil) (defaults to: nil) —

    the bottom margin value (optional)

  • left (Integer, String, nil) (defaults to: nil) —

    the left margin value (optional)

Returns:

  • (String) —

    the generated margin class(es)



22
23
24
 
# File 'lib/content_block_tools/helpers/override_classes.rb', line 22

def margin_classes(top, right = nil, bottom = nil, left = nil)
  spacing_classes("margin", top, right, bottom, left)
end

#padding_classes(top, right = nil, bottom = nil, left = nil) ⇒ String

Generates padding CSS classes

Examples:

Generate uniform padding

padding_classes(4)
# => "govuk-!-padding-4"

Generate individual side paddings

padding_classes(4, 3, 2, 1)
# => "govuk-!-padding-top-4 govuk-!-padding-right-3 govuk-!-padding-bottom-2 govuk-!-padding-left-1"

Parameters:

  • top (Integer, String) —

    the padding value for all sides (if used alone) or top padding

  • right (Integer, String, nil) (defaults to: nil) —

    the right padding value (optional)

  • bottom (Integer, String, nil) (defaults to: nil) —

    the bottom padding value (optional)

  • left (Integer, String, nil) (defaults to: nil) —

    the left padding value (optional)

Returns:

  • (String) —

    the generated padding class(es)



41
42
43
 
# File 'lib/content_block_tools/helpers/override_classes.rb', line 41

def padding_classes(top, right = nil, bottom = nil, left = nil)
  spacing_classes("padding", top, right, bottom, left)
end