|
4 | 4 | @use '../../themes/schemas' as *; |
5 | 5 | @use 'igniteui-theming/sass/animations/easings' as *; |
6 | 6 |
|
7 | | -//// |
8 | | -/// @group themes |
9 | | -/// @access public |
10 | | -//// |
11 | | - |
12 | | -/// @param {Map} $schema [$light-material-schema] - The schema used as basis for styling the component. |
13 | | -/// @param {Color} $file-names-background [null] - The file names container background color. |
14 | | -/// @param {Color} $file-names-background--focused [null] - The file names container background color when the file input is focused. |
15 | | -/// @param {Color} $file-names-background--filled [null] - The file names container background color when the file input is filled. |
16 | | -/// @param {Color} $file-names-background--disabled [null] - The file names container background color when the file input is disabled. |
17 | | -/// @param {Color} $file-names-foreground [null] - The file names color. |
18 | | -/// @param {Color} $file-names-foreground--focused [null] - The file names color when the file input is focused. |
19 | | -/// @param {Color} $file-names-foreground--filled [null] - The file names color when the file input is filled. |
20 | | -/// @param {Color} $file-names-foreground--disabled [null] - The file names color when the file input is disabled. |
21 | | -/// @param {Color} $file-selector-button-background [null] - The file input selector button background color. |
22 | | -/// @param {Color} $file-selector-button-background--focused [null] - The selector button background color when the file input is focused. |
23 | | -/// @param {Color} $file-selector-button-background--filled [null] - The selector button background color when the file input is filled. |
24 | | -/// @param {Color} $file-selector-button-background--disabled [null] - The selector button background color when the file input is disabled. |
25 | | -/// @param {Color} $file-selector-button-foreground [null] - The file input selector button foreground color. |
26 | | -/// @param {Color} $file-selector-button-foreground--focused [null] - The selector button foreground color when the file input is focused. |
27 | | -/// @param {Color} $file-selector-button-foreground--filled [null] - The selector button foreground color when the file input is filled. |
28 | | -/// @param {Color} $file-selector-button-foreground--disabled [null] - The selector button foreground color when the file input is disabled. |
29 | | -/// @example scss Change the focused border and label colors |
30 | | -/// $my-file-input-theme: file-input-theme($file-names-foreground: #09f); |
31 | | -/// // Pass the theme to the css-vars() mixin |
32 | | -/// @include css-vars($my-file-input-theme); |
33 | | -@function file-input-theme( |
34 | | - $schema: $light-material-schema, |
35 | | - $file-names-background: null, |
36 | | - $file-names-background--focused: null, |
37 | | - $file-names-background--filled: null, |
38 | | - $file-names-background--disabled: null, |
39 | | - $file-names-foreground: null, |
40 | | - $file-names-foreground--focused: null, |
41 | | - $file-names-foreground--filled: null, |
42 | | - $file-names-foreground--disabled: null, |
43 | | -
|
44 | | - $file-selector-button-background: null, |
45 | | - $file-selector-button-background--focused: null, |
46 | | - $file-selector-button-background--filled: null, |
47 | | - $file-selector-button-background--disabled: null, |
48 | | - $file-selector-button-foreground: null, |
49 | | - $file-selector-button-foreground--focused: null, |
50 | | - $file-selector-button-foreground--filled: null, |
51 | | - $file-selector-button-foreground--disabled: null, |
52 | | -) { |
53 | | - $name: 'igx-file-input'; |
54 | | - $file-input-schema: (); |
55 | | - |
56 | | - @if map.has-key($schema, 'file-input') { |
57 | | - $file-input-schema: map.get($schema, 'file-input'); |
58 | | - } @else { |
59 | | - $file-input-schema: $schema; |
60 | | - } |
61 | | - |
62 | | - $theme: digest-schema($file-input-schema); |
63 | | - |
64 | | - @return extend( |
65 | | - $theme, |
66 | | - ( |
67 | | - name: $name, |
68 | | - file-names-background: $file-names-background, |
69 | | - file-names-background--focused: $file-names-background--focused, |
70 | | - file-names-background--filled: $file-names-background--filled, |
71 | | - file-names-background--disabled: $file-names-background--disabled, |
72 | | - file-names-foreground: $file-names-foreground, |
73 | | - file-names-foreground--focused: $file-names-foreground--focused, |
74 | | - file-names-foreground--filled: $file-names-foreground--filled, |
75 | | - file-names-foreground--disabled: $file-names-foreground--disabled, |
76 | | - |
77 | | - file-selector-button-background: $file-selector-button-background, |
78 | | - file-selector-button-background--focused: $file-selector-button-background--focused, |
79 | | - file-selector-button-background--filled: $file-selector-button-background--filled, |
80 | | - file-selector-button-background--disabled: $file-selector-button-background--disabled, |
81 | | - file-selector-button-foreground: $file-selector-button-foreground, |
82 | | - file-selector-button-foreground--focused: $file-selector-button-foreground--focused, |
83 | | - file-selector-button-foreground--filled: $file-selector-button-foreground--filled, |
84 | | - file-selector-button-foreground--disabled: $file-selector-button-foreground--disabled, |
85 | | - ), |
86 | | - ); |
87 | | -} |
88 | | - |
89 | 7 | /// @deprecated Use the `css-vars` mixin instead. |
90 | 8 | /// @see {mixin} css-vars |
91 | 9 | /// @param {Map} $theme - The theme used to style the component. |
|
0 commit comments