Migrated _sass code to fix deprecation warnings.

[RemcoSchrijver]

Migrated sass code so no warnings are shown when building. Also fixed some typo's in the comments.

Fixing #261

[Phlow]

Ahhh, this looks nice and clean :)

[RemcoSchrijver]

Alright nice thank you, I'll close the associated issue!

[TWiStErRob]

@RemcoSchrijver please undo the formatting changes in another PR, $per-row >=$i { is inhuman 😔

[dwhswenson]

FWIW, this broke an environment where I had pinned gem 'jekyll-sass-converter', '~> 2.2' in my Gemfile. Unpinning solves. Mentioning here to help anyone else who has the same problem. The error (so search spiders can find it):

Conversion error: Jekyll::Converters::Scss encountered an error while converting 'assets/css/styles_feeling_responsive.scss':
                    Error: argument `$number` of `percentage($number)` must be a number on line 32:11 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in function `percentage` from line 32:11 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in function `grid-calc` from line 124:12 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in mixin `grid-column` from line 289:16 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in mixin `@content` from line 23:3 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/_functions.scss, in mixin `exports` from line 260:10 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss from line 6:9 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_top-bar.scss from line 10:9 of styles_feeling_responsive.scss >> @return percentage(calc($colNumber / $totalColumns)); ----------^ 

/home/runner/work/hyperblazer-net/hyperblazer-net/vendor/bundle/ruby/3.0.0/gems/jekyll-sass-converter-2.2.0/lib/jekyll/converters/scss.rb:200:in `rescue in sass_convert': Error: argument `$number` of `percentage($number)` must be a number (Jekyll::Converters::Scss::SyntaxError)
        on line 32:11 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in function `percentage`
        from line 32:11 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in function `grid-calc`
        from line 124:12 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in mixin `grid-column`
        from line 289:16 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in mixin `@content`
        from line 23:3 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/_functions.scss, in mixin `exports`
        from line 260:10 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss
        from line 6:9 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_top-bar.scss
        from line 10:9 of styles_feeling_responsive.scss
>>   @return percentage(calc($colNumber / $totalColumns));

[Phlow]

@dwhswenson Thank you for mentioning. In my case I didn't get the error, because – I suppose – I first ran bundle update.

[amunn]

I'm getting

FWIW, this broke an environment where I had pinned gem 'jekyll-sass-converter', '~> 2.2' in my Gemfile. Unpinning solves. Mentioning here to help anyone else who has the same problem. The error (so search spiders can find it):

Conversion error: Jekyll::Converters::Scss encountered an error while converting 'assets/css/styles_feeling_responsive.scss':
                    Error: argument `$number` of `percentage($number)` must be a number on line 32:11 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in function `percentage` from line 32:11 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in function `grid-calc` from line 124:12 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in mixin `grid-column` from line 289:16 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in mixin `@content` from line 23:3 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/_functions.scss, in mixin `exports` from line 260:10 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss from line 6:9 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_top-bar.scss from line 10:9 of styles_feeling_responsive.scss >> @return percentage(calc($colNumber / $totalColumns)); ----------^ 

/home/runner/work/hyperblazer-net/hyperblazer-net/vendor/bundle/ruby/3.0.0/gems/jekyll-sass-converter-2.2.0/lib/jekyll/converters/scss.rb:200:in `rescue in sass_convert': Error: argument `$number` of `percentage($number)` must be a number (Jekyll::Converters::Scss::SyntaxError)
        on line 32:11 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in function `percentage`
        from line 32:11 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in function `grid-calc`
        from line 124:12 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in mixin `grid-column`
        from line 289:16 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss, in mixin `@content`
        from line 23:3 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/_functions.scss, in mixin `exports`
        from line 260:10 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_grid.scss
        from line 6:9 of ../../../../../tmp/jekyll-remote-theme-20230807-1787-l1nxgf/_sass/foundation-components/_top-bar.scss
        from line 10:9 of styles_feeling_responsive.scss
>>   @return percentage(calc($colNumber / $totalColumns));

I'm getting this issue, but my bundle has been updated and the jekyll-sass-converter is not pinned. Is there another way to solve this?