TOPICS×
Introduction to Theming in Asset Share Commons
A brief introduction to theming in Asset Share Commons. The video walks through the process of creating a new theme with a custom color scheme.
AIn this video a new theme will be created based on the Asset Share Commons Dark theme. The color scheme will match a custom logo to give the site a consistent look and feel.
Theme Variables
/******************************* Theme Variables *******************************/ /* Below is a condensed list of variables for easy updating of the theme */ /* Color Palette */ @primaryColor : #560a63; @secondaryColor : #fc3096; /* Text */ @fontName : 'LatoWeb'; @fontSmoothing : antialiased; @headerFont : @fontName, 'Helvetica Neue', Arial, Helvetica, sans-serif; @pageFont : @fontName, 'Helvetica Neue', Arial, Helvetica, sans-serif; @textColor : #D0D0D0; /* Backgrounds */ @pageBackground : #3C3C3C; @sideBarBackground : #363636; /* Links */ @linkColor : #FFFFFF; @linkHoverColor : @secondaryColor; /* Buttons */ @buttonPrimaryColor : #560a63; /* must be a value to prevent variable recursion*/ @buttonPrimaryColorHover : saturate(darken(@buttonPrimaryColor, 5), 10, relative); /* Filters (Checkboxes,radio buttons, toggle, slider, dropdown, accordion colors)*/ @filterPrimaryColor : @secondaryColor; @filterPrimaryColorFocus : saturate(darken(@filterPrimaryColor, 5), 10, relative); /* Label */ @labelPrimaryColor : @primaryColor; @labelPrimaryColorHover : saturate(darken(@labelPrimaryColor, 5), 10, relative); /* Menu */ @menuPrimaryColor : @primaryColor; /* Message */ @msgPositiveBackgroundColor : @secondaryColor; @msgNegativeBackgroundColor : @red; @msgInfoBackgroundColor: @midBlack; @msgWarningBackgroundColor: @yellow;
Download
Custom Client Library Theme
Additional Resources
Last update:
<0> min read
WAS THIS CONTENT HELPFUL?
By submitting your feedback, you accept the Adobe Terms of Use.
Thank you for submitting your feedback.