Page Comparison

...

Topics that are out of scope for this training (and why)

These items will be better addressed in a dedicated meeting with all stakeholders.

1. Improvements to the TD application.
   These requests should be routed through the PUR team to be evaluated and groomed if the work is approved. PUR will communicate with me as needed.

2. Exposing TD to resorts to use.
   Due to the application complexity, TD is not currently designed or built to be a public facing tool and it has a long way to go before we could ever put this in the hands of the resorts. There is currently no appetite with leadership to move in this direction with the application as doing so would be a months long endeavor involving the product team and engineering and this years dev schedule is already planned out. This would require a proposal, possibly for submission next year.

3. Adding more design options to TD.
   These decisions are no longer in the hands of engineering. The design system is managed by Product and all design options are chosen to be themable (or not) by our Designer. Any changes to themeable options and therefore the design system will have to be evaluated by the Product team and in some cases A/B tested before they can be implemented to first determine what impacts the change will have on the user experience and the overall cohesiveness of the design system. It is important to communicate to resorts that the design decisions are often user tested and leveraged to ensure the best experience for the end user and so some things are just not going to be customizable to the degree they may desire.

...

4. Identify the --ads prefixed TD properties. All TD customizable properties start with the characters --ads and the naming of the property determines where the control for it will be located in the TD App as well as the control type that will be displayed. You may also see --adx prefixed properties applied to some elements. These are not customizable in the TD App and are used by engineering to manage the base Aspenware Design System.
   
   Lets take a look at one of the properties for the Card Title Color from the screenshot above to see what it tells us.
   
   color: var(--ads-page-plp-cards-header-color)
   
   color: - This is the CSS property that the value of the custom variable will be applied to. In this example this is the text color property being configured.
   var() - This wraps any custom CSS property and tells the parser that this is a variable custom property inside the parenthesis.
   --ads - this segment tells the TD app to consume and render this property as a control in the TD App
   -page-plp-cards-header - this segment tells the TD app to render the color control within the page > plp > cards > header section in the TD app.
   -color - this tells the TD app to use a color control type in the TD UI for this setting because it is acting on the CSS text color property.
   
   Other control types include fontfamily, fontsize, backgroundimage, width, and height, just to list a few. You will find a full list of the supported control types here: https://aspenware.atlassian.net/wiki/spaces/AT/pages/2573828170/Creating+CSS+Properties+for+Theme+Designer+V2#C.-Property-Names-Determine-the-Control-Type
   
   With this information you can now identify themeable properties applied to an element, as well as where to find the control for the property in the TD App. This formula apples to all --ads properties used in a TD theme.

Lesson 2. Ensuring a site is properly

...

configured to use TD

Before starting to use the TD App on a site you will want to ensure that it is properly configured and ready to go. This will prevent discovering that there is an issue when you click Save and it will prevent accidentally overwriting other themes if the incorrect slug was applied in NOP settings.

...