// ```
.window.popup.popup-example-2 {
.lib-popup(
@_popup-height: 200px
);
}
// # Fixed content height popup
// To get a fixed height popup content set the desired value for @_popup-content-height variable:
//
// ``` html
//
//
// ```
.window.popup.popup-example-3 {
.lib-popup(
@_popup-content-height: 200px
);
}
// # Margins for header, content and footer block in popup
//
// To set margins to header, content and footer block in popup, use variables:
// ```css
// @_popup-header-margin: value,
// @_popup-content-margin: value,
// @_popup-footer-margin: value
// ```
// ``` html
//
//
//
//
//
//
//
//
// Popup title
//
//
//
Popup content
//
//
//
// ```
.window.popup.popup-example-4 {
.lib-popup(
@_popup-header-margin: 0 0 25px,
@_popup-content-margin: 0 0 20px,
@_popup-footer-margin: 0 20px
);
}
// # Popup titles styled as theme headings
//
// To enable inheritance of the page heading style for popup title set:
// ```css
// @_popup-title-headings: true
// ```
// To set the page heading to inherit use:
// ```css
// @_popup-title-headings-level: h3 // h1, h2, h3, h4, h5, h6
// ```
// ``` html
//
//
//
//
//
//
//
//
// Popup title
//
//
//
Popup content
//
//
//
// ```
.window.popup.popup-example-5 {
.lib-popup(
@_popup-title-headings: true,
@_popup-title-headings-level: h1
);
}
// # Popup action toolbar
//
// The .lib-popup() mixin uses the same variables as .actions-toolbar(), but with '@_popup-' prefix added.
//
// To use variables from the .actions-toolbar() mixin set:
// ```css
// @_popup-actions-toolbar: true // false
// ```
// More information about parameters you will find at **Actions-toolbar** page.
// ``` html
//
//
//
//
//
//
//
//
// Popup title
//
//
//
Popup content
//
//
//
// ```
.window.popup.popup-example-6 {
.lib-popup(
@_popup-actions-toolbar: true,
@_popup-actions-toolbar-actions-position: left,
@_popup-actions-toolbar-actions-reverse: true
);
}
// # Popup Close button without an icon
// You can set the popup close button to inherit theme's default button styles without an icon.
// ```css
// @_popup-button-close-icon: false,
// @_popup-button-close-reset: false
// ```
// ``` html
//
//
//
//
//
//
//
//
// Popup title
//
//
//
Popup content
//
//
//
// ```
.window.popup.popup-example-7 {
.lib-popup(
@_popup-button-close-icon: false,
@_popup-button-close-reset: false
);
}
// # Modify the icon of popup Close button
//
// The .lib-popup() mixin uses all the same variables as .icon-font() mixin with '@_popup-' prefix added. More information about .lib-icon-font() parameters you can find at **Icons** page
//
// ``` html
//
//