diff --git a/src/app.js b/src/app.js index 9a3c463..547b1b7 100644 --- a/src/app.js +++ b/src/app.js @@ -16,9 +16,15 @@ TW.Init(ShadowCSS, ShadowDiv); React.render(html` <${Store.Provider}> <${UI.Select}/> - <${UI.Controls}/> - <${UI.Chart}> - <${UI.Audiogram}/> - + +
+ <${UI.Controls}/> +
+ <${UI.Chart}> + <${UI.Audiogram}/> + +
+
+ `, ShadowDiv); \ No newline at end of file diff --git a/src/twind.js b/src/twind.js index 17d5e07..22f4a55 100644 --- a/src/twind.js +++ b/src/twind.js @@ -48,6 +48,12 @@ export const Configure = { "fill": "none" }, ], + [ + "bg-metal", + { + "background": "linear-gradient(159deg, rgb(236, 236, 236) 0%, rgb(233, 233, 233) 36%, rgb(213, 213, 213) 36.1%, rgb(236, 236, 236) 100%)" + } + ], [ 'shadow-glow-(.*)', (match, context)=> @@ -58,9 +64,11 @@ export const Configure = { [ 'shadow-sss', { - "box-shadow": "rgb(0 0 0 / 50%) 0px -3px 2px inset, rgb(255 255 255 / 50%) 0px 10px 10px inset" + "box-shadow": "rgb(0 0 0 / 50%) 0px -2px 3px inset, rgb(255 255 255 / 50%) 0px 10px 10px inset" } - ] + ], + [ 'box-notch', "border-t(1 [#ffffff]) border-b(1 [#00000033]) flex items-center justify-end gap-1 p-2" ], + [ "box-buttons", "flex gap-1 items-center p-2 rounded-lg bg-gradient-to-b from-zinc-300 border-b(1 [#ffffff]) border-t(1 [#00000033])"] ], presets: [TWPreTail(), TWPreAuto()] }; diff --git a/src/ui.js b/src/ui.js index feb89f8..7cd939a 100644 --- a/src/ui.js +++ b/src/ui.js @@ -19,7 +19,7 @@ export function Button({children, icon, light, disabled, inactive, onClick, clas return html`