Forum Discussion

peterlu's avatar
peterlu
Champion
4 years ago

SCSS Issue Tracker

As there is no public issue tracker (afaik) or reporting workflow (other than support tickets and ideas), I'd like to collect some things that were found through hour-long trial end error (some including workarounds) so others trying to customize the platform hopefully don't have to jump trough the same hoops as I had to or at least might be able to find some information or workarounds regarding things that don't behave as advertised or expected.

This topic is NOT a place to rant about the platform, the devs or the product (it's software after all, and software has bugs, we know that very well...).

I will make a new reply to this post for each issue and link them in the topic message for easier access.

Hope it helps somebody!

PS: If you know about something similar and it's not yet listed below, please feel free to add your own reply to the original topic message using the template below as a rough guideline of what information to provide. If you'd like to comment on a bug, try to reply to that specific "issue" message (so technically a threaded view could be aggregated, it's not right here, I know...) and reference (via permalink!) the issue you're commenting on, otherwise it's going to be very confusing =)...

Quoted from https://community.khoros.com/t5/Developer-Discussion/API-amp-FreeMarker-Issue-Tracker/td-p/547711

3 Replies

Sort By
  • peterlu's avatar
    peterlu
    Champion
    4 years ago

    Issue found in mixins/_media-queries.scss.  It was reported to Support few years ago, maybe the ticket didn't go anywhere  :).

    Code with issues

     

    $li-breakpoints: (
  phone-min:                  '(max-width: #{$screen-xs})',
  phone:                      '(max-width: #{$screen-xs-max})',
  phone-and-smaller:          '(max-width: #{$screen-xs-max})',
  phone-and-down:             '(max-width: #{$screen-xs-max})',
  phone-only:                 '(max-width: #{$screen-xs-max})',
  phone-landscape:            '(max-width: #{$screen-xs-max}) and (orientation: landscape)',
  phone-portrait:             '(max-width: #{$screen-xs-max}) and (orientation: portrait)',
  phone-to-tablet:            '(min-width: #{$screen-xs-min}) and (max-width: #{$screen-xs-max})',
  tablet:                     '(max-width: #{$screen-sm-max})',
  tablet-and-smaller:         '(max-width: #{$screen-sm-max})',
  tablet-and-down:            '(max-width: #{$screen-sm-max})',
  tablet-only:                '(min-width: #{$screen-xs-max}) and (max-width: #{$screen-sm-max})',
  tablet-landscape:           '(min-width: #{$screen-xs-max}) and (max-width: #{$screen-sm-max}) and (orientation: landscape)',
  tablet-portrait:            '(min-width: #{$screen-xs-max}) and (max-width: #{$screen-sm-max}) and (orientation: portrait)',
  tablet-and-larger:          '(min-width: #{$screen-xs-max})',
  tablet-and-up:              '(min-width: #{$screen-xs-max})',
  tablet-and-bigger:          '(min-width: #{$screen-xs-max})',
  tablet-to-desktop:          '(min-width: #{$screen-sm-min}) and (max-width: #{$screen-sm-max})',
  desktop:                    '(min-width: #{$screen-md-min})',
  desktop-and-smaller:        '(max-width: #{$screen-md-max})',
  desktop-and-down:           '(max-width: #{$screen-md-max})',
  desktop-only:               '(min-width: #{$screen-md-min}) and (max-width: #{$screen-md-max})',
  desktop-and-larger:         '(min-width: #{$screen-md-min})',
  desktop-and-up:             '(min-width: #{$screen-md-min})',
  desktop-and-bigger:         '(min-width: #{$screen-md-min})',
  large-desktop:              '(min-width: #{$screen-lg-min})',
  large-desktop-only:         '(min-width: #{$screen-lg-min})',

  product-questions-phone-min:'(max-width: 320px)'
);

     

     

    Code with fixes

     

    $li-breakpoints: (
  phone-min:          '(max-width: #{$screen-xs})',
  phone:              '(max-width: #{$screen-xs-max})',
  phone-and-smaller:  '(max-width: #{$screen-xs-max})',
  phone-and-down:     '(max-width: #{$screen-xs-max})',
  phone-only:         '(max-width: #{$screen-xs-max})',
  phone-landscape:    '(max-width: #{$screen-xs-max}) and (orientation: landscape)',
  phone-portrait:     '(max-width: #{$screen-xs-max}) and (orientation: portrait)',
  phone-to-tablet:    '(min-width: #{$screen-xs-min}) and (max-width: #{$screen-xs-max})',
  tablet:             '(max-width: #{$screen-sm-max})',
  tablet-and-smaller: '(max-width: #{$screen-sm-max})',
  tablet-and-down:    '(max-width: #{$screen-sm-max})',
  tablet-only:        '(min-width: #{$screen-sm-min}) and (max-width: #{$screen-sm-max})',
  tablet-landscape:   '(min-width: #{$screen-sm-min}) and (max-width: #{$screen-sm-max}) and (orientation: landscape)',
  tablet-portrait:    '(min-width: #{$screen-sm-min}) and (max-width: #{$screen-sm-max}) and (orientation: portrait)',
  tablet-and-larger:  '(min-width: #{$screen-sm-min})',
  tablet-and-up:      '(min-width: #{$screen-sm-min})',
  tablet-and-bigger:  '(min-width: #{$screen-sm-min})',
  tablet-to-desktop:  '(min-width: #{$screen-sm-min}) and (max-width: #{$screen-sm-max})',
  desktop:            '(min-width: #{$screen-md-min})',
  desktop-and-smaller:'(max-width: #{$screen-md-max})',
  desktop-and-down:   '(max-width: #{$screen-md-max})',
  desktop-only:       '(min-width: #{$screen-md-min}) and (max-width: #{$screen-md-max})',
  desktop-and-larger: '(min-width: #{$screen-md-min})',
  desktop-and-up:     '(min-width: #{$screen-md-min})',
  desktop-and-bigger: '(min-width: #{$screen-md-min})',
  large-desktop:      '(min-width: #{$screen-lg-min})',
  large-desktop-only: '(min-width: #{$screen-lg-min})',

  product-questions-phone-min:'(max-width: 320px)'
);

     

     

    Please pass this to the engineering team. Thanks.

  • peterlu's avatar
    peterlu
    Champion
    4 years ago

    Font-awesome SCSS variable issue:

    If we try to override the built-in font-awesome variable, it is very difficult.

    Variable path: responsive_peak/sass/vendor/font-awesome/_variables.scss

    $fa-var-adjust: "\f042";
$fa-var-adn: "\f170";
$fa-var-align-center: "\f037";
$fa-var-align-justify: "\f039";
$fa-var-align-left: "\f036";
$fa-var-align-right: "\f038";
$fa-var-ambulance: "\f0f9";
$fa-var-anchor: "\f13d";
...
...
...

     

    We suggest the CORE team update this file with the below syntax:

    $fa-var-adjust: "\f042" !default;
$fa-var-adn: "\f170" !default;
$fa-var-align-center: "\f037" !default;
$fa-var-align-justify: "\f039" !default;
$fa-var-align-left: "\f036" !default;
$fa-var-align-right: "\f038" !default;
$fa-var-ambulance: "\f0f9" !default;
$fa-var-anchor: "\f13d" !default;
$fa-var-android: "\f17b" !default;
$fa-var-angellist: "\f209" !default;
...
...
...

     

    SuzieH 

  • isxtn's avatar
    isxtn
    Advisor
    11 months ago
    1. It would be great to have some minor changes in SDK to be able to upload only changed files. I know you guys are focused on Aurora, but there are numerous legacy clients, and this has been asked for for at least 8 years. 
    2. Additionally, better error messages in Freemarker, especially when it's a CSS problem. When there is a CSS problem, the entire site is blown up and there is no way to trace the problem except to trace your own steps. No numbers given.
    3. This includes line numbers for errors. Sometimes they are included, sometimes not. Sometimes the error messages make some sense, sometimes Freemarker errors are indecipherable. 
    4. A single ; in the text.properties file can blow up the entire site. It would be great to see that changed so that it just throws an error with a line number as well.