@syncfusion/ej2-navigations 19.3.54 → 19.4.40
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.github/PULL_REQUEST_TEMPLATE/Bug.md +63 -0
- package/.github/PULL_REQUEST_TEMPLATE/feature.md +39 -0
- package/CHANGELOG.md +58 -0
- package/dist/ej2-navigations.umd.min.js +2 -2
- package/dist/ej2-navigations.umd.min.js.map +1 -1
- package/dist/es6/ej2-navigations.es2015.js +525 -147
- package/dist/es6/ej2-navigations.es2015.js.map +1 -1
- package/dist/es6/ej2-navigations.es5.js +532 -148
- package/dist/es6/ej2-navigations.es5.js.map +1 -1
- package/dist/global/ej2-navigations.min.js +2 -2
- package/dist/global/ej2-navigations.min.js.map +1 -1
- package/dist/global/index.d.ts +1 -1
- package/package.json +11 -12
- package/src/accordion/accordion-model.d.ts +5 -5
- package/src/accordion/accordion.d.ts +5 -5
- package/src/accordion/accordion.js +2 -19
- package/src/breadcrumb/breadcrumb-model.d.ts +23 -11
- package/src/breadcrumb/breadcrumb.d.ts +33 -10
- package/src/breadcrumb/breadcrumb.js +320 -78
- package/src/common/menu-base.js +2 -2
- package/src/common/v-scroll.js +1 -1
- package/src/sidebar/sidebar.js +4 -4
- package/src/tab/tab-model.d.ts +14 -6
- package/src/tab/tab.d.ts +26 -15
- package/src/tab/tab.js +56 -27
- package/src/toolbar/toolbar-model.d.ts +7 -7
- package/src/toolbar/toolbar.d.ts +6 -6
- package/src/toolbar/toolbar.js +81 -13
- package/src/treeview/treeview-model.d.ts +10 -0
- package/src/treeview/treeview.d.ts +13 -0
- package/src/treeview/treeview.js +68 -5
- package/styles/accordion/_bootstrap-dark-definition.scss +4 -0
- package/styles/accordion/_bootstrap-definition.scss +4 -0
- package/styles/accordion/_bootstrap4-definition.scss +4 -0
- package/styles/accordion/_bootstrap5-definition.scss +39 -35
- package/styles/accordion/_fabric-dark-definition.scss +4 -0
- package/styles/accordion/_fabric-definition.scss +4 -0
- package/styles/accordion/_fluent-definition.scss +85 -0
- package/styles/accordion/_highcontrast-definition.scss +5 -1
- package/styles/accordion/_highcontrast-light-definition.scss +4 -0
- package/styles/accordion/_layout.scss +6 -14
- package/styles/accordion/_material-dark-definition.scss +4 -0
- package/styles/accordion/_material-definition.scss +4 -0
- package/styles/accordion/_tailwind-definition.scss +83 -79
- package/styles/accordion/_theme.scss +12 -11
- package/styles/accordion/bootstrap4.css +1 -2
- package/styles/accordion/bootstrap5-dark.css +11 -2
- package/styles/accordion/bootstrap5.css +11 -2
- package/styles/accordion/highcontrast-light.css +0 -4
- package/styles/accordion/highcontrast.css +1 -5
- package/styles/accordion/icons/_fluent.scss +17 -0
- package/styles/accordion/icons/_tailwind.scss +17 -17
- package/styles/bootstrap-dark.css +317 -84
- package/styles/bootstrap.css +316 -83
- package/styles/bootstrap4.css +317 -76
- package/styles/bootstrap5-dark.css +339 -75
- package/styles/bootstrap5.css +341 -77
- package/styles/breadcrumb/_bootstrap-dark-definition.scss +14 -0
- package/styles/breadcrumb/_bootstrap-definition.scss +13 -0
- package/styles/breadcrumb/_bootstrap4-definition.scss +13 -0
- package/styles/breadcrumb/_bootstrap5-definition.scss +15 -2
- package/styles/breadcrumb/_fabric-dark-definition.scss +13 -0
- package/styles/breadcrumb/_fabric-definition.scss +13 -0
- package/styles/breadcrumb/_fluent-definition.scss +59 -0
- package/styles/breadcrumb/_highcontrast-definition.scss +13 -0
- package/styles/breadcrumb/_highcontrast-light-definition.scss +13 -0
- package/styles/breadcrumb/_layout.scss +171 -22
- package/styles/breadcrumb/_material-dark-definition.scss +13 -0
- package/styles/breadcrumb/_material-definition.scss +13 -0
- package/styles/breadcrumb/_tailwind-dark-definition.scss +13 -0
- package/styles/breadcrumb/_tailwind-definition.scss +13 -0
- package/styles/breadcrumb/_theme.scss +27 -8
- package/styles/breadcrumb/bootstrap-dark.css +194 -17
- package/styles/breadcrumb/bootstrap.css +194 -17
- package/styles/breadcrumb/bootstrap4.css +194 -17
- package/styles/breadcrumb/bootstrap5-dark.css +198 -24
- package/styles/breadcrumb/bootstrap5.css +198 -24
- package/styles/breadcrumb/fabric-dark.css +197 -20
- package/styles/breadcrumb/fabric.css +197 -20
- package/styles/breadcrumb/highcontrast-light.css +200 -22
- package/styles/breadcrumb/highcontrast.css +200 -22
- package/styles/breadcrumb/icons/_bootstrap-dark.scss +2 -1
- package/styles/breadcrumb/icons/_bootstrap.scss +2 -1
- package/styles/breadcrumb/icons/_bootstrap4.scss +2 -1
- package/styles/breadcrumb/icons/_bootstrap5.scss +2 -1
- package/styles/breadcrumb/icons/_fabric-dark.scss +2 -1
- package/styles/breadcrumb/icons/_fabric.scss +2 -1
- package/styles/breadcrumb/icons/_fluent.scss +25 -0
- package/styles/breadcrumb/icons/_highcontrast-light.scss +2 -1
- package/styles/breadcrumb/icons/_highcontrast.scss +2 -1
- package/styles/breadcrumb/icons/_material-dark.scss +2 -1
- package/styles/breadcrumb/icons/_material.scss +2 -1
- package/styles/breadcrumb/icons/_tailwind-dark.scss +2 -1
- package/styles/breadcrumb/icons/_tailwind.scss +2 -1
- package/styles/breadcrumb/material-dark.css +186 -13
- package/styles/breadcrumb/material.css +186 -13
- package/styles/breadcrumb/tailwind-dark.css +195 -22
- package/styles/breadcrumb/tailwind.css +195 -22
- package/styles/context-menu/_bootstrap-dark-definition.scss +1 -1
- package/styles/context-menu/_bootstrap-definition.scss +1 -1
- package/styles/context-menu/_bootstrap4-definition.scss +1 -1
- package/styles/context-menu/_bootstrap5-definition.scss +5 -5
- package/styles/context-menu/_fluent-definition.scss +52 -0
- package/styles/context-menu/_material-dark-definition.scss +1 -1
- package/styles/context-menu/_material-definition.scss +1 -1
- package/styles/context-menu/_tailwind-definition.scss +1 -1
- package/styles/context-menu/bootstrap-dark.css +1 -1
- package/styles/context-menu/bootstrap.css +1 -1
- package/styles/context-menu/bootstrap4.css +1 -1
- package/styles/context-menu/bootstrap5-dark.css +5 -5
- package/styles/context-menu/bootstrap5.css +6 -6
- package/styles/context-menu/icons/_fluent.scss +32 -0
- package/styles/context-menu/material-dark.css +1 -1
- package/styles/context-menu/material.css +1 -1
- package/styles/context-menu/tailwind-dark.css +1 -1
- package/styles/context-menu/tailwind.css +1 -1
- package/styles/fabric-dark.css +305 -41
- package/styles/fabric.css +308 -44
- package/styles/h-scroll/_fluent-definition.scss +78 -0
- package/styles/h-scroll/_tailwind-definition.scss +78 -78
- package/styles/h-scroll/_theme.scss +1 -1
- package/styles/h-scroll/bootstrap-dark.css +1 -1
- package/styles/h-scroll/bootstrap.css +1 -1
- package/styles/h-scroll/bootstrap4.css +1 -1
- package/styles/h-scroll/bootstrap5-dark.css +1 -1
- package/styles/h-scroll/bootstrap5.css +1 -1
- package/styles/h-scroll/fabric-dark.css +1 -1
- package/styles/h-scroll/fabric.css +1 -1
- package/styles/h-scroll/highcontrast-light.css +1 -1
- package/styles/h-scroll/highcontrast.css +1 -1
- package/styles/h-scroll/icons/_fluent.scss +49 -0
- package/styles/h-scroll/icons/_tailwind.scss +49 -49
- package/styles/h-scroll/material-dark.css +1 -1
- package/styles/h-scroll/material.css +1 -1
- package/styles/h-scroll/tailwind-dark.css +1 -1
- package/styles/h-scroll/tailwind.css +1 -1
- package/styles/highcontrast-light.css +317 -47
- package/styles/highcontrast.css +322 -52
- package/styles/material-dark.css +295 -32
- package/styles/material.css +296 -33
- package/styles/menu/_fluent-definition.scss +68 -0
- package/styles/menu/_layout.scss +1 -1
- package/styles/menu/_theme.scss +9 -0
- package/styles/menu/bootstrap-dark.css +1 -1
- package/styles/menu/bootstrap.css +1 -1
- package/styles/menu/bootstrap4.css +1 -1
- package/styles/menu/bootstrap5-dark.css +4 -4
- package/styles/menu/bootstrap5.css +5 -5
- package/styles/menu/icons/_fluent.scss +133 -0
- package/styles/menu/material-dark.css +1 -1
- package/styles/menu/material.css +1 -1
- package/styles/menu/tailwind-dark.css +1 -1
- package/styles/menu/tailwind.css +1 -1
- package/styles/sidebar/_bootstrap5-definition.scss +5 -5
- package/styles/sidebar/_fluent-definition.scss +5 -0
- package/styles/sidebar/_theme.scss +4 -2
- package/styles/sidebar/bootstrap5-dark.css +0 -1
- package/styles/sidebar/bootstrap5.css +0 -1
- package/styles/sidebar/tailwind-dark.css +0 -1
- package/styles/sidebar/tailwind.css +0 -1
- package/styles/tab/_bootstrap-dark-definition.scss +10 -1
- package/styles/tab/_bootstrap-definition.scss +10 -1
- package/styles/tab/_bootstrap4-definition.scss +9 -1
- package/styles/tab/_bootstrap5-definition.scss +401 -401
- package/styles/tab/_fabric-dark-definition.scss +10 -0
- package/styles/tab/_fabric-definition.scss +10 -0
- package/styles/tab/_fluent-definition.scss +409 -0
- package/styles/tab/_highcontrast-definition.scss +10 -0
- package/styles/tab/_highcontrast-light-definition.scss +10 -0
- package/styles/tab/_layout.scss +145 -0
- package/styles/tab/_material-dark-definition.scss +10 -0
- package/styles/tab/_material-definition.scss +10 -0
- package/styles/tab/_tailwind-definition.scss +431 -420
- package/styles/tab/_theme.scss +188 -113
- package/styles/tab/bootstrap-dark.css +43 -18
- package/styles/tab/bootstrap.css +42 -17
- package/styles/tab/bootstrap4.css +47 -28
- package/styles/tab/bootstrap5-dark.css +53 -30
- package/styles/tab/bootstrap5.css +53 -30
- package/styles/tab/fabric-dark.css +43 -20
- package/styles/tab/fabric.css +46 -23
- package/styles/tab/highcontrast-light.css +52 -19
- package/styles/tab/highcontrast.css +56 -23
- package/styles/tab/icons/_bootstrap-dark.scss +2 -2
- package/styles/tab/icons/_fabric-dark.scss +2 -2
- package/styles/tab/icons/_fluent.scss +140 -0
- package/styles/tab/icons/_tailwind.scss +140 -140
- package/styles/tab/material-dark.css +42 -15
- package/styles/tab/material.css +42 -15
- package/styles/tab/tailwind-dark.css +42 -17
- package/styles/tab/tailwind.css +42 -17
- package/styles/tailwind-dark.css +313 -50
- package/styles/tailwind.css +313 -50
- package/styles/toolbar/_bootstrap-dark-definition.scss +7 -1
- package/styles/toolbar/_bootstrap-definition.scss +7 -1
- package/styles/toolbar/_bootstrap4-definition.scss +8 -2
- package/styles/toolbar/_bootstrap5-definition.scss +104 -86
- package/styles/toolbar/_fabric-dark-definition.scss +7 -0
- package/styles/toolbar/_fabric-definition.scss +7 -0
- package/styles/toolbar/_fluent-definition.scss +149 -0
- package/styles/toolbar/_highcontrast-definition.scss +7 -0
- package/styles/toolbar/_highcontrast-light-definition.scss +7 -0
- package/styles/toolbar/_layout.scss +27 -72
- package/styles/toolbar/_material-dark-definition.scss +7 -1
- package/styles/toolbar/_material-definition.scss +7 -1
- package/styles/toolbar/_tailwind-definition.scss +149 -143
- package/styles/toolbar/_theme.scss +12 -15
- package/styles/toolbar/bootstrap-dark.css +17 -46
- package/styles/toolbar/bootstrap.css +17 -46
- package/styles/toolbar/bootstrap4.css +12 -26
- package/styles/toolbar/bootstrap5-dark.css +6 -7
- package/styles/toolbar/bootstrap5.css +6 -7
- package/styles/toolbar/fabric-dark.css +4 -0
- package/styles/toolbar/fabric.css +4 -0
- package/styles/toolbar/highcontrast-light.css +4 -1
- package/styles/toolbar/highcontrast.css +4 -1
- package/styles/toolbar/icons/_fluent.scss +16 -0
- package/styles/toolbar/icons/_tailwind.scss +16 -16
- package/styles/toolbar/material-dark.css +4 -1
- package/styles/toolbar/material.css +5 -2
- package/styles/toolbar/tailwind-dark.css +8 -6
- package/styles/toolbar/tailwind.css +8 -6
- package/styles/treeview/_bootstrap-dark-definition.scss +11 -0
- package/styles/treeview/_bootstrap-definition.scss +11 -0
- package/styles/treeview/_bootstrap4-definition.scss +11 -0
- package/styles/treeview/_bootstrap5-definition.scss +120 -109
- package/styles/treeview/_fabric-dark-definition.scss +11 -0
- package/styles/treeview/_fabric-definition.scss +11 -0
- package/styles/treeview/_fluent-definition.scss +120 -0
- package/styles/treeview/_highcontrast-definition.scss +11 -0
- package/styles/treeview/_highcontrast-light-definition.scss +11 -0
- package/styles/treeview/_layout.scss +116 -20
- package/styles/treeview/_material-dark-definition.scss +13 -0
- package/styles/treeview/_material-definition.scss +11 -0
- package/styles/treeview/_tailwind-definition.scss +12 -0
- package/styles/treeview/_theme.scss +5 -5
- package/styles/treeview/bootstrap-dark.css +60 -0
- package/styles/treeview/bootstrap.css +60 -0
- package/styles/treeview/bootstrap4.css +60 -0
- package/styles/treeview/bootstrap5-dark.css +61 -1
- package/styles/treeview/bootstrap5.css +61 -1
- package/styles/treeview/fabric-dark.css +60 -0
- package/styles/treeview/fabric.css +60 -0
- package/styles/treeview/highcontrast-light.css +60 -0
- package/styles/treeview/highcontrast.css +60 -0
- package/styles/treeview/icons/_bootstrap5.scss +43 -43
- package/styles/treeview/icons/_fluent.scss +43 -0
- package/styles/treeview/icons/_tailwind-dark.scss +43 -43
- package/styles/treeview/material-dark.css +60 -0
- package/styles/treeview/material.css +60 -0
- package/styles/treeview/tailwind-dark.css +65 -1
- package/styles/treeview/tailwind.css +65 -1
- package/styles/v-scroll/_fluent-definition.scss +49 -0
- package/styles/v-scroll/_tailwind-definition.scss +49 -49
- package/styles/v-scroll/icons/_fluent.scss +26 -0
- package/styles/v-scroll/icons/_tailwind.scss +26 -26
|
@@ -16,7 +16,9 @@ $tbar-tab-highlight-color: rgba(0, 0, 0, 0) !default;
|
|
|
16
16
|
$tbar-border-nav-type: solid !default;
|
|
17
17
|
$tbar-btn-box-shadow: none !default;
|
|
18
18
|
$tbar-hover-font: $hover-font-color !default;
|
|
19
|
+
$tbar-hover-font-color: $tbar-hover-font !default;
|
|
19
20
|
$tbar-press-font: $active-font-color !default;
|
|
21
|
+
$tbar-btn-active-font-color: $tbar-press-font !default;
|
|
20
22
|
$tbar-active-font-color: $active-font-color !default;
|
|
21
23
|
$tbar-default-font-overlay: $default-font-color !default;
|
|
22
24
|
$tbar-default-icon-overlay: $default-icon-color !default;
|
|
@@ -24,7 +26,8 @@ $tbar-select-font: $tbar-hover-font !default;
|
|
|
24
26
|
$tbar-pressed-font: $tbar-hover-font !default;
|
|
25
27
|
|
|
26
28
|
$tbar-default-bg: $grey-f8 !default;
|
|
27
|
-
|
|
29
|
+
$tbar-pop-bg: $tbar-default-bg !default;
|
|
30
|
+
$tbar-items-default-bg: $tbar-default-bg !default;
|
|
28
31
|
$tbar-hover-bg: $grey-e6 !default;
|
|
29
32
|
$tbar-pressed-bg: $grey-d4 !default;
|
|
30
33
|
$tbar-btn-txt-font-size: 14px !default;
|
|
@@ -32,6 +35,7 @@ $tbar-hover-border-color: $grey-ad !default;
|
|
|
32
35
|
$tbar-focus-bg: $tbar-hover-bg !default;
|
|
33
36
|
$tbar-focus-border-color: $grey-8c !default;
|
|
34
37
|
$tbar-press-bg: $tbar-hover-bg !default;
|
|
38
|
+
$tbar-btn-press-bg: $tbar-press-bg !default;
|
|
35
39
|
$tbar-press-border-color: $tbar-hover-border-color !default;
|
|
36
40
|
$tbar-btn-family: 'Helvetica Neue' , 'Helvetica' , 'Arial' , 'sans-serif' !default;
|
|
37
41
|
$tbar-nrml-size: 40px !default;
|
|
@@ -108,6 +112,7 @@ $tbar-left-item-line-height: 35px !default;
|
|
|
108
112
|
$tbar-right-item-line-height: 24px !default;
|
|
109
113
|
$tbar-item-bgr-padding: 2.5px 5px !default;
|
|
110
114
|
$tbar-nrml-item-size: 0 !default;
|
|
115
|
+
$tbar-item-height: auto !default;
|
|
111
116
|
$tbar-bgr-item-size: 0 !default;
|
|
112
117
|
$tbar-item-bgr-padding: 3.5px 2.5px !default;
|
|
113
118
|
$tbar-item-nrml-padding: 4px 2.5px !default;
|
|
@@ -119,6 +124,7 @@ $tbar-separator-nrml-mrgn: 5.5px 6px !default;
|
|
|
119
124
|
$tbar-separator-vertical-bgr-mrgn: 6px !default;
|
|
120
125
|
$tbar-separator-vertical-nrml-mrgn: 6px 5.5px !default;
|
|
121
126
|
$tbar-btn-bgr-padding: 1px 7px !default;
|
|
127
|
+
$tbar-btn-bgr-focus-padding: 0 6px !default;
|
|
122
128
|
$tbar-btn-nrml-padding: 1px 2.5px !default;
|
|
123
129
|
$tbar-icons-bgr-font-size: 14px !default;
|
|
124
130
|
$tbar-multirow-items-mrgn-bigger: 15px !default;
|
|
@@ -18,7 +18,9 @@ $tbar-border-nav-type: solid !default;
|
|
|
18
18
|
$tbar-btn-box-shadow: none !default;
|
|
19
19
|
$tbar-focus-btn-box-shadow: 0 0 0 3px rgba(130, 138, 145, .5);
|
|
20
20
|
$tbar-hover-font: $primary-font !default;
|
|
21
|
+
$tbar-hover-font-color: $tbar-hover-font !default;
|
|
21
22
|
$tbar-press-font: $primary-font !default;
|
|
23
|
+
$tbar-btn-active-font-color: $tbar-press-font !default;
|
|
22
24
|
$tbar-active-font-color: $primary-font !default;
|
|
23
25
|
$tbar-default-font-overlay: $gray-700 !default;
|
|
24
26
|
$tbar-default-icon-overlay: $gray-700 !default;
|
|
@@ -27,7 +29,8 @@ $tbar-pressed-font: $tbar-hover-font !default;
|
|
|
27
29
|
|
|
28
30
|
$tbar-default-bg: $gray-100 !default;
|
|
29
31
|
$tbar-hor-active-bg: $gray-600 !default;
|
|
30
|
-
|
|
32
|
+
$tbar-pop-bg: $tbar-default-bg !default;
|
|
33
|
+
$tbar-items-default-bg: $tbar-default-bg !default;
|
|
31
34
|
$tbar-hover-bg: $gray-600 !default;
|
|
32
35
|
$tbar-popup-hover-bg: darken($gray-600, 7.5%) !default;
|
|
33
36
|
$tbar-pressed-bg: $gray-600 !default;
|
|
@@ -37,6 +40,7 @@ $tbar-focus-bg: $tbar-hover-bg !default;
|
|
|
37
40
|
$tbar-active-btn-bg: darken($gray-600, 10%) !default;
|
|
38
41
|
$tbar-focus-border-color: $gray-600 !default;
|
|
39
42
|
$tbar-press-bg: $tbar-hover-bg !default;
|
|
43
|
+
$tbar-btn-press-bg: $tbar-press-bg !default;
|
|
40
44
|
$tbar-press-border-color: $tbar-hover-border-color !default;
|
|
41
45
|
$tbar-active-border-color: darken($gray-600, 12.5%) !default;
|
|
42
46
|
$tbar-btn-family: 'Helvetica Neue' , 'Helvetica' , 'Arial' , 'sans-serif' !default;
|
|
@@ -106,13 +110,14 @@ $tbar-btn-pressed-box-shadow: inset 0 3px 5px rgba(0 , 0 , 0 , .125) !default;
|
|
|
106
110
|
$tbar-btn-icon-bgr-width: 24px !default;
|
|
107
111
|
$tbar-btn-icon-bgr-height: 32px !default;
|
|
108
112
|
$tbar-btn-icon-bgr-line-height: 32px !default;
|
|
109
|
-
$tbar-btn-txt-line-height:
|
|
113
|
+
$tbar-btn-txt-line-height: inherit !default;
|
|
110
114
|
$tbar-btn-icon-nrml-width: 26px !default;
|
|
111
115
|
$tbar-btn-icon-nrml-height: 26px !default;
|
|
112
116
|
$tbar-btn-icon-nrml-line-height: 26px !default;
|
|
113
117
|
$tbar-left-item-line-height: 35px !default;
|
|
114
118
|
$tbar-right-item-line-height: 24px !default;
|
|
115
119
|
$tbar-nrml-item-size: 0 !default;
|
|
120
|
+
$tbar-item-height: auto !default;
|
|
116
121
|
$tbar-bgr-item-size: 0 !default;
|
|
117
122
|
$tbar-item-bgr-padding: 8px 2.5px !default;
|
|
118
123
|
$tbar-item-nrml-padding: 3px 4px !default;
|
|
@@ -124,6 +129,7 @@ $tbar-separator-nrml-mrgn: 5.5px 6px !default;
|
|
|
124
129
|
$tbar-separator-vertical-bgr-mrgn: 6px !default;
|
|
125
130
|
$tbar-separator-vertical-nrml-mrgn: 6px 5.5px !default;
|
|
126
131
|
$tbar-btn-bgr-padding: 1.5px 5.5px !default;
|
|
132
|
+
$tbar-btn-bgr-focus-padding: 0 4.5px !default;
|
|
127
133
|
$tbar-btn-nrml-padding: 0 3px !default;
|
|
128
134
|
$tbar-icons-bgr-font-size: 16px !default;
|
|
129
135
|
$tbar-multirow-items-mrgn-bigger: 15px !default;
|
|
@@ -1,86 +1,33 @@
|
|
|
1
|
+
/*! Toolbar's bootstrap5 theme wise override definitions and variables */
|
|
2
|
+
// sass-lint:disable-all
|
|
1
3
|
$tbar-skin: 'bootstrap5' !default;
|
|
2
|
-
$border-size: 0;
|
|
3
|
-
$border-type: solid;
|
|
4
|
-
$tbar-icons-bgr-font-size: $text-xl;
|
|
5
|
-
$tbar-separator-bgr-mrgn: 8px 4px;
|
|
6
|
-
$tbar-separator-vertical-bgr-mrgn: 5px 10px;
|
|
7
|
-
$tbar-radius: 0;
|
|
8
|
-
$tbar-separator-nrml-mrgn: 7px 3px;
|
|
9
|
-
$tbar-pop-radius: 4px;
|
|
10
|
-
$tbar-separator-vertical-nrml-mrgn: 3px 7px;
|
|
11
|
-
$tbar-border-size: $border-size;
|
|
12
|
-
$tbar-separator-border-type: $border-type;
|
|
13
|
-
$tbar-pop-box-shadow: $shadow-lg;
|
|
14
|
-
$tbar-hover-border-color: $icon-color;
|
|
15
|
-
$tbar-pressed-border: $tbar-hover-border-color;
|
|
16
|
-
$tbar-btn-bgr-line-height: 24px !default;
|
|
17
|
-
$tbar-zero-value: 0 !default;
|
|
18
|
-
$tbar-btn-nrml-line-height: 22px !default;
|
|
19
|
-
$tbar-btn-weight: $font-weight-normal !default;
|
|
20
|
-
$tbar-border-radius: 4px !default;
|
|
21
|
-
$tbar-tab-highlight-color: rgba(0, 0, 0, 0) !default;
|
|
22
|
-
$tbar-border-nav-type: solid !default;
|
|
23
|
-
$tbar-btn-box-shadow: none !default;
|
|
24
4
|
|
|
25
|
-
|
|
26
|
-
$tbar-default-font: $content-text-color !default;
|
|
27
|
-
$tbar-active-bg: $secondary-bg-color-pressed !default;
|
|
28
|
-
$tbar-active-icon-color: $primary-text-color !default;
|
|
5
|
+
//font definitions
|
|
29
6
|
$tbar-btn-family: $font-family !default;
|
|
30
|
-
$tbar-
|
|
31
|
-
$tbar-
|
|
32
|
-
$tbar-hover-bg: $secondary-bg-color-hover !default;
|
|
33
|
-
$tbar-hover-font: $icon-color !default;
|
|
34
|
-
$tbar-default-icon-color: $icon-color !default;
|
|
35
|
-
$tbar-pressed-bg: $content-bg-color-alt2 !default;
|
|
36
|
-
$tbar-pressed-font: $content-text-color-alt2 !default;
|
|
37
|
-
$tbar-select-font: $content-text-color-alt2 !default;
|
|
38
|
-
$tbar-default-font-overlay: $content-text-color-alt2 !default;
|
|
39
|
-
$tbar-default-icon-overlay: $content-text-color-alt2 !default;
|
|
40
|
-
$tbar-separator-border: $border-light !default;
|
|
41
|
-
$tbar-default-border: $border-light !default;
|
|
42
|
-
$tbar-hover-border-color: $icon-color !default;
|
|
43
|
-
$tbar-focus-border-color: $tbar-hover-border-color !default;
|
|
44
|
-
$tbar-focus-bg: $tbar-hover-bg !default;
|
|
45
|
-
$tbar-press-font: $content-text-color-alt2 !default;
|
|
46
|
-
|
|
47
|
-
$tbar-active-font-color: $tbar-press-font !default;
|
|
48
|
-
$tbar-border-nav-type: $border-light !default;
|
|
49
|
-
$tbar-border-nav-active-type: $border-light !default;
|
|
50
|
-
$tbar-btn-border: none !default;
|
|
51
|
-
|
|
52
|
-
$tbar-box-shadow: none !default;
|
|
53
|
-
$tbar-border-type: $border-type !default;
|
|
54
|
-
$tbar-separator-size: 1px !default;
|
|
55
|
-
$tba-horizontal-separator: 0 $tbar-separator-size 0 0 !default;
|
|
56
|
-
$tba-vertical-separator: 0 0 $tbar-separator-size 0 !default;
|
|
57
|
-
$tbar-popup-border-width: 0 0 0 $border-size !default;
|
|
58
|
-
$tbar-popup-rtl-border-width: 0 $border-size 0 0 !default;
|
|
59
|
-
$tbar-popup-vertical-border-width: $border-size 0 0 0 !default;
|
|
60
|
-
$tbar-popup-vertical-rtl-border-width: 0 0 $border-size 0 !default;
|
|
61
|
-
$tbar-nrml-size: 38px !default;
|
|
62
|
-
$tbar-bgr-size: 48px !default;
|
|
63
|
-
$tbar-nrml-items-size: 38px !default;
|
|
64
|
-
$tbar-bgr-items-size: 48px !default;
|
|
65
|
-
$tbar-nrml-item-size: 38px !default;
|
|
66
|
-
$tbar-item-nrml-minwidth: 28px !default;
|
|
67
|
-
$tbar-bgr-item-size: 49px !default;
|
|
7
|
+
$tbar-btn-weight: $font-weight-normal !default;
|
|
8
|
+
$tbar-icons-bgr-font-size: $text-xl;
|
|
68
9
|
$tbar-btn-font-size: $text-lg !default;
|
|
69
10
|
$tbar-btn-txt-font-size: $text-sm !default;
|
|
70
|
-
$tbar-popup-btn-bg-color: transparent !default;
|
|
71
11
|
|
|
12
|
+
// box shadow definitions
|
|
13
|
+
$tbar-pop-box-shadow: $shadow-lg;
|
|
14
|
+
$tbar-btn-box-shadow: none !default;
|
|
15
|
+
$tbar-box-shadow: none !default;
|
|
16
|
+
$tbar-nav-pressed-box-shadow: none !default;
|
|
17
|
+
$tbar-btn-pressed-box-shadow: none !default;
|
|
18
|
+
|
|
19
|
+
// padding definitions
|
|
72
20
|
$tbar-item-bgr-padding: 5px 6px !default;
|
|
73
21
|
$tbar-item-nrml-padding: 4px !default;
|
|
74
22
|
$tbar-btn-nrml-padding: 0 4px !default;
|
|
75
23
|
$tbar-btn-bgr-padding: 0 8px !default;
|
|
24
|
+
$tbar-btn-bgr-focus-padding: 0 6px !default;
|
|
76
25
|
$tbar-btn-icn-nrml-padding: 4px !default;
|
|
77
26
|
$tbar-btn-icn-bgr-padding: 4px 6px !default;
|
|
78
27
|
$tbar-btn-icn-right-bgr-padding: 4px 6px !default;
|
|
79
28
|
$tbar-btn-icn-right-nrml-padding: 4px !default;
|
|
80
29
|
$btn-txt-nrml-padding: 4px !default;
|
|
81
30
|
$btn-txt-bgr-padding: 4px !default;
|
|
82
|
-
|
|
83
|
-
$tbar-pop-bg: $flyout-bg-color;
|
|
84
31
|
$tbar-item-pop-nrml-padding: 0 !default;
|
|
85
32
|
$tbar-item-pop-bgr-padding: 0 !default;
|
|
86
33
|
$tbar-pop-btn-bgr-padding: 8px 18px !default;
|
|
@@ -89,28 +36,27 @@ $tbar-pop-icon-bgr-padding: 0 6px 0 0 !default;
|
|
|
89
36
|
$tbar-pop-icon-nrml-padding: 0 4px 0 0 !default;
|
|
90
37
|
$tbar-pop-btn-txt-nrml-pad: 0 0 0 4px !default;
|
|
91
38
|
$tbar-pop-btn-txt-bgr-pad: 0 0 0 6px !default;
|
|
92
|
-
|
|
93
|
-
$tbar-nav-press-border: 0 !default;
|
|
94
|
-
$tbar-nav-hover-border: 0 !default;
|
|
95
|
-
$tbar-nav-focus-border: 0 !default;
|
|
96
|
-
$tbar-nav-pressed-box-shadow: none !default;
|
|
97
|
-
$tbar-btn-border-radius: 0 !default;
|
|
98
|
-
$tbar-btn-pressed-box-shadow: none !default;
|
|
99
|
-
$tbar-btn-bgr-mrgn: 0 !default;
|
|
100
|
-
$tbar-btn-nrml-mrgn: 0 !default;
|
|
101
|
-
$tbar-v-btn-bgr-mrgn: 0 !default;
|
|
102
|
-
$tbar-v-btn-nrml-mrgn: 0 !default;
|
|
103
39
|
$tbar-popup-padding: 0 !default;
|
|
40
|
+
$tbar-item-bgr-padding-bigger: 1.5px 0 !default;
|
|
41
|
+
$tbar-item-nrml-padding-small: 1px 0 !default;
|
|
42
|
+
|
|
43
|
+
// dimension definitions
|
|
44
|
+
$tbar-btn-bgr-line-height: 24px !default;
|
|
45
|
+
$tbar-btn-nrml-line-height: 22px !default;
|
|
104
46
|
$tbar-btn-nrml-minheight: 30px !default;
|
|
105
47
|
$tbar-btn-bgr-minheight: 38px !default;
|
|
106
48
|
$tbar-btn-nrml-minwidth: 30px !default;
|
|
107
49
|
$tbar-btn-bgr-minwidth: 38px !default;
|
|
108
50
|
$tbar-btn-bgr-height: calc(100% - 11px) !default;
|
|
109
51
|
$tbar-btn-nrml-height: calc(100% - 10px) !default;
|
|
110
|
-
$tbar-
|
|
111
|
-
$tbar-
|
|
112
|
-
$tbar-
|
|
113
|
-
$tbar-
|
|
52
|
+
$tbar-nrml-size: 38px !default;
|
|
53
|
+
$tbar-bgr-size: 48px !default;
|
|
54
|
+
$tbar-nrml-items-size: 38px !default;
|
|
55
|
+
$tbar-bgr-items-size: 48px !default;
|
|
56
|
+
$tbar-nrml-item-size: 38px !default;
|
|
57
|
+
$tbar-item-height: 38px !default;
|
|
58
|
+
$tbar-item-nrml-minwidth: 28px !default;
|
|
59
|
+
$tbar-bgr-item-size: 49px !default;
|
|
114
60
|
$tbar-btn-icon-nrml-width: 12px !default;
|
|
115
61
|
$tbar-btn-icon-nrml-height: 16px !default;
|
|
116
62
|
$tbar-btn-icon-nrml-line-height: 16px !default;
|
|
@@ -122,17 +68,89 @@ $tbar-btn-icon-bgr-line-height: 18px !default;
|
|
|
122
68
|
$tbar-btn-txt-line-height: inherit !default;
|
|
123
69
|
$tbar-nav-nrml-width: 28px !default;
|
|
124
70
|
$tbar-nav-bgr-width: 36px !default;
|
|
125
|
-
$tbar-item-nrml-mrgn: 8px !default;
|
|
126
|
-
$tbar-item-bgr-mrgn: 10px !default;
|
|
127
71
|
$tbar-btn-pop-nrml-minheight: 38px !default;
|
|
128
72
|
$tbar-btn-pop-bgr-minheight: 48px !default;
|
|
73
|
+
$tbar-radius: 0;
|
|
74
|
+
$tbar-pop-radius: 4px;
|
|
75
|
+
$tbar-pop-padding-bottom: 5px !default;
|
|
76
|
+
$tbar-big-pop-padding-bottom: 3px !default;
|
|
77
|
+
$tbar-zero-value: 0 !default;
|
|
78
|
+
$tbar-separator-nrml-height: 24px !default;
|
|
79
|
+
$tbar-separator-bgr-height: 30px !default;
|
|
80
|
+
$tbar-separator-nrml-minheight: $tbar-separator-nrml-height !default;
|
|
81
|
+
$tbar-separator-bgr-minheight: $tbar-separator-bgr-height !default;
|
|
82
|
+
$tbar-separator-size: 1px !default;
|
|
83
|
+
$tba-horizontal-separator: 0 $tbar-separator-size 0 0 !default;
|
|
84
|
+
$tba-vertical-separator: 0 0 $tbar-separator-size 0 !default;
|
|
85
|
+
|
|
86
|
+
// margin definitions
|
|
87
|
+
$tbar-item-nrml-mrgn: 8px !default;
|
|
88
|
+
$tbar-item-bgr-mrgn: 10px !default;
|
|
129
89
|
$tbar-multirow-items-mrgn-bigger: 12.5px !default;
|
|
130
90
|
$tbar-multirow-items-mrgn-small: 10px !default;
|
|
131
91
|
$tbar-multirow-item-top-btm-mrgn-bigger: 1.5px 0 !default;
|
|
132
92
|
$tbar-multirow-item-top-btm-mrgn-small: 1px 0 !default;
|
|
133
93
|
$tbar-multirow-item-mrgn: 0 !default;
|
|
134
|
-
$tbar-
|
|
135
|
-
$tbar-
|
|
94
|
+
$tbar-btn-bgr-mrgn: 0 !default;
|
|
95
|
+
$tbar-btn-nrml-mrgn: 0 !default;
|
|
96
|
+
$tbar-v-btn-bgr-mrgn: 0 !default;
|
|
97
|
+
$tbar-v-btn-nrml-mrgn: 0 !default;
|
|
98
|
+
$tbar-separator-vertical-nrml-mrgn: 3px 7px;
|
|
99
|
+
$tbar-separator-bgr-mrgn: 8px 4px;
|
|
100
|
+
$tbar-separator-vertical-bgr-mrgn: 5px 10px;
|
|
101
|
+
$tbar-separator-nrml-mrgn: 7px 3px;
|
|
102
|
+
|
|
103
|
+
// border definitions
|
|
104
|
+
$border-size: 0;
|
|
105
|
+
$border-type: solid;
|
|
106
|
+
$tbar-border-radius: 4px !default;
|
|
107
|
+
$tbar-border-nav-type: solid !default;
|
|
108
|
+
$tbar-border-size: $border-size;
|
|
109
|
+
$tbar-separator-border-type: $border-type;
|
|
110
|
+
$tbar-hover-border-color: $icon-color;
|
|
111
|
+
$tbar-pressed-border: $tbar-hover-border-color;
|
|
112
|
+
$tbar-separator-border: $border-light !default;
|
|
113
|
+
$tbar-default-border: $border-light !default;
|
|
114
|
+
$tbar-hover-border-color: $icon-color !default;
|
|
115
|
+
$tbar-focus-border-color: $tbar-hover-border-color !default;
|
|
116
|
+
$tbar-press-border-color: $border-light !default;
|
|
117
|
+
$tbar-border-nav-type: $border-light !default;
|
|
118
|
+
$tbar-border-nav-active-type: $border-light !default;
|
|
119
|
+
$tbar-btn-border: none !default;
|
|
120
|
+
$tbar-popup-border-width: 0 0 0 $border-size !default;
|
|
121
|
+
$tbar-popup-rtl-border-width: 0 $border-size 0 0 !default;
|
|
122
|
+
$tbar-popup-vertical-border-width: $border-size 0 0 0 !default;
|
|
123
|
+
$tbar-popup-vertical-rtl-border-width: 0 0 $border-size 0 !default;
|
|
124
|
+
$tbar-border-type: $border-type !default;
|
|
125
|
+
$tbar-nav-press-border: 0 !default;
|
|
126
|
+
$tbar-nav-hover-border: 0 !default;
|
|
127
|
+
$tbar-nav-focus-border: 0 !default;
|
|
128
|
+
$tbar-btn-border-radius: 0 !default;
|
|
129
|
+
|
|
130
|
+
// color definitions
|
|
131
|
+
$tbar-default-bg: $content-bg-color-alt1 !default;
|
|
132
|
+
$tbar-items-default-bg: $tbar-default-bg !default;
|
|
133
|
+
$tbar-default-font: $content-text-color !default;
|
|
134
|
+
$tbar-active-bg: $secondary-bg-color-pressed !default;
|
|
135
|
+
$tbar-active-icon-color: $primary-text-color !default;
|
|
136
|
+
$tbar-tab-highlight-color: rgba(0, 0, 0, 0) !default;
|
|
137
|
+
$tbar-press-bg: $content-bg-color-alt2 !default;
|
|
138
|
+
$tbar-btn-press-bg: $tbar-active-bg !default;
|
|
139
|
+
$tbar-hover-bg: $secondary-bg-color-hover !default;
|
|
140
|
+
$tbar-hover-font: $icon-color !default;
|
|
141
|
+
$tbar-hover-font-color: $tbar-hover-font !default;
|
|
142
|
+
$tbar-default-icon-color: $icon-color !default;
|
|
143
|
+
$tbar-pressed-bg: $content-bg-color-alt2 !default;
|
|
144
|
+
$tbar-pressed-font: $content-text-color-alt2 !default;
|
|
145
|
+
$tbar-select-font: $content-text-color-alt2 !default;
|
|
146
|
+
$tbar-default-font-overlay: $content-text-color-alt2 !default;
|
|
147
|
+
$tbar-default-icon-overlay: $content-text-color-alt2 !default;
|
|
148
|
+
$tbar-focus-bg: $tbar-hover-bg !default;
|
|
149
|
+
$tbar-press-font: $content-text-color-alt2 !default;
|
|
150
|
+
$tbar-active-font-color: $tbar-press-font !default;
|
|
151
|
+
$tbar-btn-active-font-color: $tbar-press-font !default;
|
|
152
|
+
$tbar-popup-btn-bg-color: transparent !default;
|
|
153
|
+
$tbar-pop-bg: $flyout-bg-color !default;
|
|
136
154
|
|
|
137
155
|
@mixin tbar-btn-animation {
|
|
138
156
|
content: '';
|
|
@@ -43,12 +43,15 @@ $tbar-popup-border-width: 0 0 0 $border-size !default;
|
|
|
43
43
|
$tbar-select-font: $tbar-hover-font !default;
|
|
44
44
|
$tbar-pressed-font: $tbar-hover-font !default;
|
|
45
45
|
$tbar-default-bg: $neutral-lighter !default;
|
|
46
|
+
$tbar-items-default-bg: $tbar-default-bg !default;
|
|
47
|
+
$tbar-pop-bg: $tbar-default-bg !default;
|
|
46
48
|
$tbar-default-font: $neutral-light-font !default;
|
|
47
49
|
$tbar-active-bg: $neutral-light !default;
|
|
48
50
|
$tbar-active-icon-color: $neutral-light-fontalt !default;
|
|
49
51
|
$tbar-btn-family: 'Segoe UI', 'GeezaPro', 'DejaVu Serif' !default;
|
|
50
52
|
$tbar-press-bg: $neutral-quintenary !default;
|
|
51
53
|
$tbar-press-border-color: $tbar-press-bg !default;
|
|
54
|
+
$tbar-btn-press-bg: $tbar-press-bg !default;
|
|
52
55
|
$tbar-hover-bg: $neutral-light !default;
|
|
53
56
|
$tbar-hover-font: $neutral-light-fontalt !default;
|
|
54
57
|
$tbar-default-icon-color: $neutral-light-font !default;
|
|
@@ -63,6 +66,8 @@ $tbar-hover-border-color: $neutral-light !default;
|
|
|
63
66
|
$tbar-focus-border-color: $tbar-hover-border-color !default;
|
|
64
67
|
$tbar-focus-bg: $tbar-hover-bg !default;
|
|
65
68
|
$tbar-press-font: $neutral-light-fontalt !default;
|
|
69
|
+
$tbar-hover-font-color: $tbar-hover-font !default;
|
|
70
|
+
$tbar-btn-active-font-color: $tbar-press-font !default;
|
|
66
71
|
|
|
67
72
|
$tbar-border-nav-type: solid !default;
|
|
68
73
|
$tbar-border-nav-active-type: solid !default;
|
|
@@ -85,6 +90,8 @@ $tbar-item-bgr-padding: 0 1.5px !default;
|
|
|
85
90
|
$tbar-item-nrml-padding: 0 1px !default;
|
|
86
91
|
$tbar-btn-nrml-padding: 0 !default;
|
|
87
92
|
$tbar-btn-bgr-padding: 0 !default;
|
|
93
|
+
$tbar-btn-bgr-focus-padding: 0 6px !default;
|
|
94
|
+
$tbar-item-height: auto !default;
|
|
88
95
|
$tbar-btn-icn-nrml-padding: 0 0 0 12px !default;
|
|
89
96
|
$tbar-btn-icn-bgr-padding: 0 0 0 15px !default;
|
|
90
97
|
$tbar-btn-icn-right-bgr-padding: 0 12px 0 0 !default;
|
|
@@ -21,14 +21,18 @@ $tbar-border-nav-type: solid !default;
|
|
|
21
21
|
$tbar-btn-box-shadow: none !default;
|
|
22
22
|
|
|
23
23
|
$tbar-default-bg: $neutral-white !default;
|
|
24
|
+
$tbar-items-default-bg: $tbar-default-bg !default;
|
|
25
|
+
$tbar-pop-bg: $tbar-default-bg !default;
|
|
24
26
|
$tbar-default-font: $neutral-light-font !default;
|
|
25
27
|
$tbar-active-bg: $theme-primary !default;
|
|
26
28
|
$tbar-active-icon-color: $theme-primary-font !default;
|
|
27
29
|
$tbar-btn-family: 'Segoe UI', 'GeezaPro', 'DejaVu Serif' !default;
|
|
28
30
|
$tbar-press-bg: $theme-lighter !default;
|
|
29
31
|
$tbar-press-border-color: $tbar-press-bg !default;
|
|
32
|
+
$tbar-btn-press-bg: $tbar-press-bg !default;
|
|
30
33
|
$tbar-hover-bg: $neutral-lighter !default;
|
|
31
34
|
$tbar-hover-font: $neutral-light-fontalt !default;
|
|
35
|
+
$tbar-hover-font-color: $tbar-hover-font !default;
|
|
32
36
|
$tbar-default-icon-color: $theme-light-font !default;
|
|
33
37
|
$tbar-pressed-bg: $theme-lighter !default;
|
|
34
38
|
$tbar-pressed-font: $theme-primary-font !default;
|
|
@@ -42,6 +46,7 @@ $tbar-focus-border-color: $tbar-hover-border-color !default;
|
|
|
42
46
|
$tbar-focus-bg: $tbar-hover-bg !default;
|
|
43
47
|
$tbar-press-font: $theme-light-font !default;
|
|
44
48
|
|
|
49
|
+
$tbar-btn-active-font-color: $tbar-press-font !default;
|
|
45
50
|
$tbar-active-font-color: $tbar-press-font !default;
|
|
46
51
|
$tbar-border-nav-type: solid !default;
|
|
47
52
|
$tbar-border-nav-active-type: solid !default;
|
|
@@ -61,6 +66,7 @@ $tbar-bgr-size: 50px !default;
|
|
|
61
66
|
$tbar-nrml-items-size: 39px !default;
|
|
62
67
|
$tbar-bgr-items-size: 49px !default;
|
|
63
68
|
$tbar-nrml-item-size: 39px !default;
|
|
69
|
+
$tbar-item-height: auto !default;
|
|
64
70
|
$tbar-item-nrml-minwidth: 34px !default;
|
|
65
71
|
$tbar-bgr-item-size: 49px !default;
|
|
66
72
|
$tbar-btn-font-size: 16px !default;
|
|
@@ -70,6 +76,7 @@ $tbar-item-bgr-padding: 0 1.5px !default;
|
|
|
70
76
|
$tbar-item-nrml-padding: 0 1px !default;
|
|
71
77
|
$tbar-btn-nrml-padding: 0 !default;
|
|
72
78
|
$tbar-btn-bgr-padding: 0 !default;
|
|
79
|
+
$tbar-btn-bgr-focus-padding: 0 6px !default;
|
|
73
80
|
$tbar-btn-icn-nrml-padding: 0 0 0 12px !default;
|
|
74
81
|
$tbar-btn-icn-bgr-padding: 0 0 0 15px !default;
|
|
75
82
|
$tbar-btn-icn-right-bgr-padding: 0 12px 0 0 !default;
|
|
@@ -0,0 +1,149 @@
|
|
|
1
|
+
$tbar-skin: 'FluentUI' !default;
|
|
2
|
+
$border-size: 0;
|
|
3
|
+
$border-type: solid;
|
|
4
|
+
$tbar-icons-bgr-font-size: $text-xl;
|
|
5
|
+
$tbar-separator-bgr-mrgn: 8px 4px;
|
|
6
|
+
$tbar-separator-vertical-bgr-mrgn: 5px 10px;
|
|
7
|
+
$tbar-radius: 0;
|
|
8
|
+
$tbar-separator-nrml-mrgn: 7px 3px;
|
|
9
|
+
$tbar-pop-radius: 4px;
|
|
10
|
+
$tbar-separator-vertical-nrml-mrgn: 3px 7px;
|
|
11
|
+
$tbar-border-size: $border-size;
|
|
12
|
+
$tbar-separator-border-type: $border-type;
|
|
13
|
+
$tbar-pop-box-shadow: $shadow-md;
|
|
14
|
+
$tbar-hover-border-color: $icon-color;
|
|
15
|
+
$tbar-pressed-border: $tbar-hover-border-color;
|
|
16
|
+
$tbar-btn-bgr-line-height: 24px !default;
|
|
17
|
+
$tbar-zero-value: 0 !default;
|
|
18
|
+
$tbar-btn-nrml-line-height: 22px !default;
|
|
19
|
+
$tbar-btn-weight: $font-weight-normal !default;
|
|
20
|
+
$tbar-border-radius: 4px !default;
|
|
21
|
+
$tbar-tab-highlight-color: rgba(0, 0, 0, 0) !default;
|
|
22
|
+
$tbar-border-nav-type: solid !default;
|
|
23
|
+
$tbar-btn-box-shadow: none !default;
|
|
24
|
+
|
|
25
|
+
$tbar-default-bg: $content-bg-color-alt2 !default;
|
|
26
|
+
$tbar-items-default-bg: $transparent !default;
|
|
27
|
+
$tbar-default-font: $content-text-color !default;
|
|
28
|
+
$tbar-active-bg: $content-bg-color-alt4 !default;
|
|
29
|
+
$tbar-active-icon-color: $icon-color !default;
|
|
30
|
+
$tbar-btn-family: $font-family !default;
|
|
31
|
+
$tbar-press-bg: $content-bg-color-alt4 !default;
|
|
32
|
+
$tbar-btn-press-bg: $tbar-press-bg !default;
|
|
33
|
+
$tbar-press-border-color: $content-bg-color-alt4 !default;
|
|
34
|
+
$tbar-hover-bg: $content-bg-color-alt3 !default;
|
|
35
|
+
$tbar-hover-font: $content-text-color !default;
|
|
36
|
+
$tbar-hover-font-color: $tbar-hover-font !default;
|
|
37
|
+
$tbar-default-icon-color: $icon-color !default;
|
|
38
|
+
$tbar-pressed-bg: $content-bg-color-alt2 !default;
|
|
39
|
+
$tbar-pressed-font: $content-text-color !default;
|
|
40
|
+
$tbar-select-font: $content-text-color !default;
|
|
41
|
+
$tbar-default-font-overlay: $content-text-color !default;
|
|
42
|
+
$tbar-default-icon-overlay: $content-text-color !default;
|
|
43
|
+
$tbar-separator-border: $border-dark !default;
|
|
44
|
+
$tbar-default-border: $border-light !default;
|
|
45
|
+
$tbar-hover-border-color: $icon-color !default;
|
|
46
|
+
$tbar-focus-border-color: $tbar-hover-border-color !default;
|
|
47
|
+
$tbar-focus-bg: $tbar-hover-bg !default;
|
|
48
|
+
$tbar-press-font: $content-text-color !default;
|
|
49
|
+
|
|
50
|
+
$tbar-btn-active-font-color: $tbar-press-font !default;
|
|
51
|
+
$tbar-active-font-color: $tbar-press-font !default;
|
|
52
|
+
$tbar-border-nav-type: $border-light !default;
|
|
53
|
+
$tbar-border-nav-active-type: $border-light !default;
|
|
54
|
+
$tbar-btn-border: none !default;
|
|
55
|
+
|
|
56
|
+
$tbar-box-shadow: $shadow-sm !default;
|
|
57
|
+
$tbar-border-type: $border-type !default;
|
|
58
|
+
$tbar-separator-size: 1px !default;
|
|
59
|
+
$tba-horizontal-separator: 0 $tbar-separator-size 0 0 !default;
|
|
60
|
+
$tba-vertical-separator: 0 0 $tbar-separator-size 0 !default;
|
|
61
|
+
$tbar-popup-border-width: 0 0 0 $border-size !default;
|
|
62
|
+
$tbar-popup-rtl-border-width: 0 $border-size 0 0 !default;
|
|
63
|
+
$tbar-popup-vertical-border-width: $border-size 0 0 0 !default;
|
|
64
|
+
$tbar-popup-vertical-rtl-border-width: 0 0 $border-size 0 !default;
|
|
65
|
+
$tbar-nrml-size: 38px !default;
|
|
66
|
+
$tbar-bgr-size: 48px !default;
|
|
67
|
+
$tbar-nrml-items-size: 38px !default;
|
|
68
|
+
$tbar-bgr-items-size: 48px !default;
|
|
69
|
+
$tbar-nrml-item-size: 38px !default;
|
|
70
|
+
$tbar-item-height: auto !default;
|
|
71
|
+
$tbar-item-nrml-minwidth: 28px !default;
|
|
72
|
+
$tbar-bgr-item-size: 49px !default;
|
|
73
|
+
$tbar-btn-font-size: $text-lg !default;
|
|
74
|
+
$tbar-btn-txt-font-size: $text-sm !default;
|
|
75
|
+
$tbar-popup-btn-bg-color: transparent !default;
|
|
76
|
+
|
|
77
|
+
$tbar-item-bgr-padding: 5px 6px !default;
|
|
78
|
+
$tbar-item-nrml-padding: 4px !default;
|
|
79
|
+
$tbar-btn-nrml-padding: 0 4px !default;
|
|
80
|
+
$tbar-btn-bgr-padding: 0 8px !default;
|
|
81
|
+
$tbar-btn-bgr-focus-padding: 0 6px !default;
|
|
82
|
+
$tbar-btn-icn-nrml-padding: 4px !default;
|
|
83
|
+
$tbar-btn-icn-bgr-padding: 4px 6px !default;
|
|
84
|
+
$tbar-btn-icn-right-bgr-padding: 4px 6px !default;
|
|
85
|
+
$tbar-btn-icn-right-nrml-padding: 4px !default;
|
|
86
|
+
$btn-txt-nrml-padding: 4px !default;
|
|
87
|
+
$btn-txt-bgr-padding: 4px !default;
|
|
88
|
+
|
|
89
|
+
$tbar-pop-bg: $flyout-bg-color;
|
|
90
|
+
$tbar-item-pop-nrml-padding: 0 !default;
|
|
91
|
+
$tbar-item-pop-bgr-padding: 0 !default;
|
|
92
|
+
$tbar-pop-btn-bgr-padding: 8px 18px !default;
|
|
93
|
+
$tbar-pop-btn-nrml-padding: 6px 12px !default;
|
|
94
|
+
$tbar-pop-icon-bgr-padding: 0 6px 0 0 !default;
|
|
95
|
+
$tbar-pop-icon-nrml-padding: 0 4px 0 0 !default;
|
|
96
|
+
$tbar-pop-btn-txt-nrml-pad: 0 0 0 4px !default;
|
|
97
|
+
$tbar-pop-btn-txt-bgr-pad: 0 0 0 6px !default;
|
|
98
|
+
|
|
99
|
+
$tbar-nav-press-border: 0 !default;
|
|
100
|
+
$tbar-nav-hover-border: 0 !default;
|
|
101
|
+
$tbar-nav-focus-border: 0 !default;
|
|
102
|
+
$tbar-nav-pressed-box-shadow: none !default;
|
|
103
|
+
$tbar-btn-border-radius: 0 !default;
|
|
104
|
+
$tbar-btn-pressed-box-shadow: none !default;
|
|
105
|
+
$tbar-btn-bgr-mrgn: 0 !default;
|
|
106
|
+
$tbar-btn-nrml-mrgn: 0 !default;
|
|
107
|
+
$tbar-v-btn-bgr-mrgn: 0 !default;
|
|
108
|
+
$tbar-v-btn-nrml-mrgn: 0 !default;
|
|
109
|
+
$tbar-popup-padding: 0 !default;
|
|
110
|
+
$tbar-btn-nrml-minheight: 30px !default;
|
|
111
|
+
$tbar-btn-bgr-minheight: 38px !default;
|
|
112
|
+
$tbar-btn-nrml-minwidth: 30px !default;
|
|
113
|
+
$tbar-btn-bgr-minwidth: 38px !default;
|
|
114
|
+
$tbar-btn-bgr-height: calc(100% - 11px) !default;
|
|
115
|
+
$tbar-btn-nrml-height: calc(100% - 10px) !default;
|
|
116
|
+
$tbar-separator-nrml-height: 24px !default;
|
|
117
|
+
$tbar-separator-bgr-height: 30px !default;
|
|
118
|
+
$tbar-separator-nrml-minheight: $tbar-separator-nrml-height !default;
|
|
119
|
+
$tbar-separator-bgr-minheight: $tbar-separator-bgr-height !default;
|
|
120
|
+
$tbar-btn-icon-nrml-width: 12px !default;
|
|
121
|
+
$tbar-btn-icon-nrml-height: 16px !default;
|
|
122
|
+
$tbar-btn-icon-nrml-line-height: 16px !default;
|
|
123
|
+
$tbar-left-item-line-height: 35px !default;
|
|
124
|
+
$tbar-right-item-line-height: 24px !default;
|
|
125
|
+
$tbar-btn-icon-bgr-width: 13px !default;
|
|
126
|
+
$tbar-btn-icon-bgr-height: 18px !default;
|
|
127
|
+
$tbar-btn-icon-bgr-line-height: 18px !default;
|
|
128
|
+
$tbar-btn-txt-line-height: inherit !default;
|
|
129
|
+
$tbar-nav-nrml-width: 28px !default;
|
|
130
|
+
$tbar-nav-bgr-width: 36px !default;
|
|
131
|
+
$tbar-item-nrml-mrgn: 8px !default;
|
|
132
|
+
$tbar-item-bgr-mrgn: 10px !default;
|
|
133
|
+
$tbar-btn-pop-nrml-minheight: 38px !default;
|
|
134
|
+
$tbar-btn-pop-bgr-minheight: 48px !default;
|
|
135
|
+
$tbar-multirow-items-mrgn-bigger: 12.5px !default;
|
|
136
|
+
$tbar-multirow-items-mrgn-small: 10px !default;
|
|
137
|
+
$tbar-multirow-item-top-btm-mrgn-bigger: 1.5px 0 !default;
|
|
138
|
+
$tbar-multirow-item-top-btm-mrgn-small: 1px 0 !default;
|
|
139
|
+
$tbar-multirow-item-mrgn: 0 !default;
|
|
140
|
+
$tbar-item-bgr-padding-bigger: 1.5px 0 !default;
|
|
141
|
+
$tbar-item-nrml-padding-small: 1px 0 !default;
|
|
142
|
+
|
|
143
|
+
@mixin tbar-btn-animation {
|
|
144
|
+
content: '';
|
|
145
|
+
}
|
|
146
|
+
|
|
147
|
+
@mixin tbar-btn-animation-after {
|
|
148
|
+
content: '';
|
|
149
|
+
}
|
|
@@ -22,17 +22,22 @@ $tbar-border-nav-type: solid !default;
|
|
|
22
22
|
$tbar-btn-box-shadow: none !default;
|
|
23
23
|
|
|
24
24
|
$tbar-default-bg: $bg-base-0 !default;
|
|
25
|
+
$tbar-items-default-bg: $tbar-default-bg !default;
|
|
26
|
+
$tbar-pop-bg: $tbar-default-bg !default;
|
|
25
27
|
$tbar-default-font: $content-font !default;
|
|
26
28
|
$tbar-active-bg: transparent !default;
|
|
27
29
|
$tbar-active-icon-color: $selection-font !default;
|
|
28
30
|
$tbar-btn-family: 'Segoe UI', 'GeezaPro', 'DejaVu Serif' !default;
|
|
29
31
|
$tbar-press-bg: $selection-bg !default;
|
|
30
32
|
$tbar-press-border-color: $tbar-press-bg !default;
|
|
33
|
+
$tbar-btn-press-bg: $tbar-press-bg !default;
|
|
31
34
|
$tbar-hover-bg: $hover-bg !default;
|
|
32
35
|
$tbar-hover-font: $hover-font !default;
|
|
36
|
+
$tbar-hover-font-color: $tbar-hover-font !default;
|
|
33
37
|
$tbar-default-icon-color: $content-font !default;
|
|
34
38
|
$tbar-pressed-bg: $selection-bg !default;
|
|
35
39
|
$tbar-pressed-font: $selection-font !default;
|
|
40
|
+
$tbar-btn-active-font-color: $tbar-pressed-font !default;
|
|
36
41
|
$tbar-select-font: $selection-font !default;
|
|
37
42
|
$tbar-default-font-overlay: $border-alt !default;
|
|
38
43
|
$tbar-default-icon-overlay: $border-alt !default;
|
|
@@ -61,6 +66,7 @@ $tbar-bgr-size: 50px !default;
|
|
|
61
66
|
$tbar-nrml-items-size: 39px !default;
|
|
62
67
|
$tbar-bgr-items-size: 49px !default;
|
|
63
68
|
$tbar-nrml-item-size: 39px !default;
|
|
69
|
+
$tbar-item-height: auto !default;
|
|
64
70
|
$tbar-item-nrml-minwidth: 34px !default;
|
|
65
71
|
$tbar-bgr-item-size: 49px !default;
|
|
66
72
|
$tbar-btn-font-size: 16px !default;
|
|
@@ -71,6 +77,7 @@ $tbar-item-bgr-padding: 0 1.5px !default;
|
|
|
71
77
|
$tbar-item-nrml-padding: 0 1px !default;
|
|
72
78
|
$tbar-btn-nrml-padding: 0 !default;
|
|
73
79
|
$tbar-btn-bgr-padding: 0 !default;
|
|
80
|
+
$tbar-btn-bgr-focus-padding: 0 6px !default;
|
|
74
81
|
$tbar-btn-icn-nrml-padding: 0 0 0 12px !default;
|
|
75
82
|
$tbar-btn-icn-bgr-padding: 0 0 0 15px !default;
|
|
76
83
|
$tbar-btn-icn-right-bgr-padding: 0 12px 0 0 !default;
|
|
@@ -53,12 +53,15 @@ $tbar-popup-border-width: 0 0 0 $border-size !default;
|
|
|
53
53
|
$tbar-select-font: $tbar-hover-font !default;
|
|
54
54
|
$tbar-pressed-font: $tbar-hover-font !default;
|
|
55
55
|
$tbar-default-bg: $bg-base-0 !default;
|
|
56
|
+
$tbar-items-default-bg: $tbar-default-bg !default;
|
|
57
|
+
$tbar-pop-bg: $tbar-default-bg !default;
|
|
56
58
|
$tbar-default-font: $content-font !default;
|
|
57
59
|
$tbar-active-bg: transparent !default;
|
|
58
60
|
$tbar-active-icon-color: $selection-font !default;
|
|
59
61
|
$tbar-btn-family: 'Segoe UI', 'GeezaPro', 'DejaVu Serif' !default;
|
|
60
62
|
$tbar-press-bg: $selection-bg !default;
|
|
61
63
|
$tbar-press-border-color: $tbar-press-bg !default;
|
|
64
|
+
$tbar-btn-press-bg: $tbar-press-bg !default;
|
|
62
65
|
$tbar-hover-bg: $hover-bg !default;
|
|
63
66
|
$tbar-hover-font: $hover-font !default;
|
|
64
67
|
$tbar-default-icon-color: $content-font !default;
|
|
@@ -73,6 +76,8 @@ $tbar-hover-border-color: $hover-border !default;
|
|
|
73
76
|
$tbar-focus-border-color: $tbar-hover-border-color !default;
|
|
74
77
|
$tbar-focus-bg: inherit !default;
|
|
75
78
|
$tbar-press-font: $selection-font !default;
|
|
79
|
+
$tbar-hover-font-color: $tbar-hover-font !default;
|
|
80
|
+
$tbar-btn-active-font-color: $tbar-press-font !default;
|
|
76
81
|
|
|
77
82
|
$tbar-active-font-color: $tbar-press-font !default;
|
|
78
83
|
$tbar-border-nav-type: solid !default;
|
|
@@ -87,6 +92,7 @@ $tbar-bgr-size: 50px !default;
|
|
|
87
92
|
$tbar-nrml-items-size: 39px !default;
|
|
88
93
|
$tbar-bgr-items-size: 49px !default;
|
|
89
94
|
$tbar-nrml-item-size: 39px !default;
|
|
95
|
+
$tbar-item-height: auto !default;
|
|
90
96
|
$tbar-item-nrml-minwidth: 34px !default;
|
|
91
97
|
$tbar-bgr-item-size: 49px !default;
|
|
92
98
|
$tbar-btn-font-size: 16px !default;
|
|
@@ -96,6 +102,7 @@ $tbar-item-bgr-padding: 0 1.5px !default;
|
|
|
96
102
|
$tbar-item-nrml-padding: 0 1px !default;
|
|
97
103
|
$tbar-btn-nrml-padding: 0 !default;
|
|
98
104
|
$tbar-btn-bgr-padding: 0 !default;
|
|
105
|
+
$tbar-btn-bgr-focus-padding: 0 6px !default;
|
|
99
106
|
$tbar-btn-icn-nrml-padding: 0 0 0 12px !default;
|
|
100
107
|
$tbar-btn-icn-bgr-padding: 0 0 0 15px !default;
|
|
101
108
|
$tbar-btn-icn-right-bgr-padding: 0 12px 0 0 !default;
|