Einführung in die Erstellung von Designs in Asset Share Commons

Letzte Aktualisierung: 2023-12-01
  • Erstellt für:
  • Intermediate
    Developer

Eine kurze Einführung in die Erstellung von Designs in Asset Share Commons. Das Video führt durch den Prozess der Erstellung eines neuen Designs mit einem benutzerdefinierten Farbschema.

In diesem Video wird ein neues Design basierend auf dem Asset Share Commons Dark-Design erstellt. Das Farbschema wird mit einem benutzerdefinierten Logo übereinstimmen, sodass die Site ein einheitliches Erscheinungsbild hat.

Design-Variablen

/*******************************
         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;

Herunterladen von Benutzerdefiniertes Client-Bibliotheks-Design

Zusätzliche Ressourcen

Auf dieser Seite