@@ -199,18 +199,43 @@ $list: (
199199
200200// Sass theme approach
201201
202- // $custom-button -theme: button-theme(
202+ // $custom-contained -theme: contained- button-theme(
203203// $background: #f9f0ff,
204204// $foreground: #722ed1,
205- // $border-color: #722ed1,
206205// $hover-background: #efdbff,
207206// $hover-foreground: #9254de,
208- // $hover-border-color: #9254de,
209- // $active-border-color: #531dab,
210207// $active-foreground: #531dab,
211- // $focus-visible-background: #f9f0ff,
208+ // $active-background: #dfc2fa,
209+ // $focus-visible-background: #d3adf7
210+ // );
211+
212+ // $custom-outlined-theme: outlined-button-theme(
213+ // $background: #fff2f0,
214+ // $foreground: #ff4d4f,
215+ // $border-color: #ff4d4f,
216+ // $hover-background: #ffdfdc,
217+ // $hover-foreground: #ff7875,
218+ // $hover-border-color: #ff7875,
219+ // $focus-visible-background: #ffccc7,
220+ // $focus-visible-foreground: #d9363e,
221+ // $focus-border-color: #d9363e
222+ // );
223+
224+ // $custom-flat-theme: flat-button-theme(
225+ // $background: #e6fffb,
226+ // $foreground: #13c2c2,
227+ // $hover-background: #b5f5ec,
228+ // $hover-foreground: #36cfc9,
229+ // $active-foreground: #08979c,
230+ // $focus-visible-background: #b5f5ec,
231+ // $focus-visible-foreground: #08979c
212232// );
213233
214234// .button-sample {
215- // @include css-vars($custom-button-theme)
235+ // @include css-vars($custom-contained-theme);
236+ // @include css-vars($custom-outlined-theme);
237+ // }
238+
239+ // .button-sample.filled {
240+ // @include css-vars($custom-flat-theme);
216241// }
0 commit comments