Mixins

Collection of PAM LESS mixins.

.button-outlined(@color-1, @color-2, @darken)

Generate a outline button from a filled button.

Parameters:
  • @color-1
    Reverse color one.
  • @color-2
    Reverse color two.
  • @darken
    Procent to darken active color.

.grid-units(@columns, @startIndex, @prefix)

Generate number of requested columns starting from given number and optional adds a passed prefixed value.

Parameters:
  • @columns
    Number of columns.
  • @startIndex
    What number to start on.
    Defaults to: 1
  • @prefix
    Attribute value prefix.
    Defaults to: ''

.placeholder-color(@color)

Applies text color for placeholder.

Parameters:
  • @color
    Set placeholder color.
    Defaults to: @skin-text-secondary

.zindex(@elementName, @elementList)

Handles z-index contextual by retrieving the elements position from a element list and returns the positon as a z-index value.

@z-index-global list is shipped with PAM and is empty by default. Add element names to appropriate z-index in the list and use the .zindex mixin to retrive the z-index value for that element in the given context. If more z-index contexts are needed add another @z-index-* list for that context.

 // Example
 @z-index-global: 'overlay', 'dialog', 'notification';
 zindex('notification', @z-index-global);
 output: z-index: 3;
Parameters:
  • @elementName
    Find position for given name.
  • @elementList
    Contextual z-index element list.