CascadeKit
SectionsHow it worksPricingDocs
Sign inGet the library
Fn
npx cascadekit add fn.get_section_padding
Files
snippets/fn.get_section_padding.liquid
Copied!
{%- liquid
  assign padding_top = section.settings.padding_top
  assign padding_bottom = section.settings.padding_bottom
  assign padding_top_class = ''
  assign padding_bottom_class = ''

  case padding_top
    when 'sm'
      assign padding_top_class = 'pt-5 lg:pt-8'
    when 'base'
      assign padding_top_class = 'pt-8 lg:pt-16'
    when 'md'
      assign padding_top_class = 'pt-12 lg:pt-20'
    when 'lg'
      assign padding_top_class = 'pt-14 lg:pt-30'
  endcase

  case padding_bottom
    when 'sm'
      assign padding_bottom_class = 'pb-5 lg:pb-8'
    when 'base'
      assign padding_bottom_class = 'pb-8 lg:pb-16'
    when 'md'
      assign padding_bottom_class = 'pb-12 lg:pb-20'
    when 'lg'
      assign padding_bottom_class = 'pb-14 lg:pb-30'
  endcase
-%}

{{ padding_top_class }} {{ padding_bottom_class }}