1 |
|
2 |
|
3 |
|
4 |
|
5 |
|
6 |
|
7 |
|
8 |
|
9 | <div class="bx--snippet bx--snippet--multi"
|
10 | data-code-snippet> <div class="bx--snippet-container" aria-label="Code Snippet Text">
|
11 | <pre>
|
12 | <code>@mixin grid-container {
|
13 | width: 100%;
|
14 | padding-right: padding(mobile);
|
15 | padding-left: padding(mobile);
|
16 |
|
17 | @include breakpoint(bp--xs--major) {
|
18 | padding-right: padding(xs);
|
19 | padding-left: padding(xs);
|
20 | }
|
21 | }
|
22 |
|
23 | $z-indexes: (
|
24 | modal : 9000,
|
25 | overlay : 8000,
|
26 | dropdown : 7000,
|
27 | header : 6000,
|
28 | footer : 5000,
|
29 | hidden : - 1,
|
30 | overflowHidden: - 1,
|
31 | floating: 10000
|
32 | );</code>
|
33 | </pre>
|
34 | </div>
|
35 | <button data-copy-btn class="bx--snippet-button" type="button" aria-label="Copy" tabindex="0">
|
36 | <svg focusable="false" preserveAspectRatio="xMidYMid meet" style="will-change: transform;" xmlns="http://www.w3.org/2000/svg" class="bx--snippet__icon" width="16" height="16" viewBox="0 0 16 16" aria-hidden="true"><path d="M14 5v9H5V5h9m0-1H5a1 1 0 0 0-1 1v9a1 1 0 0 0 1 1h9a1 1 0 0 0 1-1V5a1 1 0 0 0-1-1z"></path><path d="M2 9H1V2a1 1 0 0 1 1-1h7v1H2z"></path></svg>
|
37 | <div class="bx--btn--copy__feedback" role="alert" data-feedback="Copied!"></div>
|
38 | </button>
|
39 | <button class="bx--btn bx--btn--ghost bx--btn--sm bx--snippet-btn--expand"
|
40 | type="button">
|
41 | <span class="bx--snippet-btn--text" data-show-more-text="Show more" data-show-less-text="Show less">Show
|
42 | more</span>
|
43 | <svg focusable="false" preserveAspectRatio="xMidYMid meet" style="will-change: transform;" xmlns="http://www.w3.org/2000/svg" aria-label="Show more icon" class="bx--icon-chevron--down bx--snippet__icon" width="16" height="16" viewBox="0 0 16 16" role="img"><path d="M8 11L3 6l.7-.7L8 9.6l4.3-4.3.7.7z"></path></svg>
|
44 | </button>
|
45 | </div>
|