Versions Compared

Old Version 12

changes.mady.by.user Danny Gibas

Saved on

compared with

New Version Current

changes.mady.by.user Danny Gibas

Saved on

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

  1. Global vs On-page Indication bug

    Problem: Global vs On-page red indicators are not 100% accurate.
    Details: If the CSS Prop is being used in the <template> instead of the CSS, for example in a component prop <component color="--ads-component-color"> then testing for use on the page will not get picked up by the parser and the indicator will imply the prop is not used on the page even though it is. This makes the indicator unreliable and toggling global props off in the options menu may hide controls for props that are actually used on the page.

    For this reason it is recommended to keep global props toggled on at all times.

  2. Single app support per save file

    Problem: Theme designer can only currently support one application per save file, so each app currently requires its own save container on Azure.
    Details:When saving, the exposed props in the app overwrite the save file. This means any props exposed in other apps using the same save file would be overwritten and therefore each app requires its own safe file and setup at this time.

  3. Vuetify version conflicts

    Problem: Theme Designer uses a newer version of Vuetify then than NOP and Sep-UI due to needed component offerings and this version conflict causes some CSS/Layout issues with Vuetify components in the store while Theme Designer is loaded. This has no impact on the live store other people see.
    Details: Theme designer uses Vuetify V3. Sep UI and NOP both use Vuetify 2. There are CSS differences between the two versions and they leak into eachother when TD is enabled. This causes some layout discrepancies in both the host app and in TD. Some have been resolved with using !important in the TD app, but some CSS issues remain unresolved unless/until Sep-ui and NOP is on Vuetify 3.

  4. Prop inconsistency in Theme Designer when Cloud header styles are activated

    Problem: The cloud header activation comes with some additional page styling for the PLP that hides a couple page styles that are assigned themable custom properties.
    Details: When a resort is on legacy but has the cloud header enabled, additional styles are inserted into the PLP that interfere with the ability of TD to fully style the page. These include editing the page background color, editing the active tabs for tab options c and d, and editing the card container drop shadow. This in itself is not the key issue, but rather that those props are still exposed in the NOP CSS and TD will generate the controls to adjust them but they will have no effect on the page. This is likely to cause confusion with TD users

    It is recommended to only use tab options a or b if resort is using AW Cloud.

  5. Save file props are not adequately considered when scanning the CSS for exposed props

    Problem: When parsing all the page CSS imports, the JS builtin getPropertyValue() only evaluates prop values, not prop keys. So only the prop values referenced by prop keys get included . There is no equivalent getPropertyKey() built in method in JS to get property keys from a stylesheetin the page property list.
    Details:
    For example:

    This is a save file prop. --ads-card-header-primary-color: red;
    Because --ads-card-header-primary-color is only referenced as the key, not the value (red), it would not be included in the prop list.

    In the same save file, we might have:
    --ads-card-header-primary-color: var(--ads-card-text-color)
    In this case, --var-card-text-color would get included in the site prop list because it is a value, but --ads-card-header-primary-color would still not get included, because it is a key.

    This may cause problems if we plan to use a single save file for multiple applications because this means we cannot rely on the save file to carry prop names over to another application unless those prop names are also used by some element in the host applications CSS. This may be a good or bad thing, depending on the use case.

  6. Options Previewer does not save changes

    Problem: Options previewer only allows you to preview the card, tab, and slider on/off options at this time. Changing the card, tab and slider options must be done in NOP settings if you want the changes to save.
    Details:
    The styles for cards, tabs and the slider all rely on SASS mixins due to the extensive amount of CSS involved in theming the different options. To consume the mixins, we toggle various classes on page root that implement the corresponding mixin options. The options that toggle the classes are set in NOP settings.

    A new NOP endpoint will need to be created in order for Theme Designer to change the NOP settings and that work is not yet groomed for development.