212 lines
2.8 KiB
JavaScript
212 lines
2.8 KiB
JavaScript
|
|
//import document from '/unify/document.js';
|
|
|
|
export default class button{
|
|
|
|
height = "fit-content";
|
|
|
|
layers = 1;
|
|
|
|
fontWeight = "normal";
|
|
|
|
borderRadius = "4px";
|
|
|
|
fontSize = "12px";
|
|
|
|
cursor = "pointer";
|
|
|
|
color = "white";
|
|
|
|
width = "fit-content";
|
|
|
|
|
|
#ifdef ANDROID
|
|
|
|
borderRadius = 40;
|
|
|
|
fontSize = 15
|
|
|
|
margin = 20;
|
|
|
|
width = "-webkit-fill-available";
|
|
|
|
fontSize = 22;
|
|
|
|
fontWeight = "bold"
|
|
|
|
textAlign = "center";
|
|
|
|
padding = 20;
|
|
|
|
|
|
|
|
#ifdef LIGHT
|
|
|
|
background = "#f2f2f2";
|
|
|
|
color = "#019e7c";
|
|
|
|
hoverBackgroundColor = "#d9d9d9";
|
|
|
|
opaqueBackgroundColor = "#f2f2f2";
|
|
|
|
#endif
|
|
|
|
#ifdef DARK
|
|
|
|
background = "#323232";
|
|
|
|
color = "white";
|
|
|
|
//border = "1px solid #3d3a3a";
|
|
|
|
hoverBackgroundColor = "#3e3e3e";
|
|
|
|
opaqueBackgroundColor = "#323232";
|
|
|
|
#endif
|
|
|
|
#endif
|
|
|
|
|
|
#ifdef WINDOWS
|
|
|
|
border = "1px solid #7f7b7b";
|
|
|
|
margin = 12;
|
|
|
|
padding = "8px 40px";
|
|
|
|
#ifdef LIGHT
|
|
|
|
background = "#0067C0";
|
|
|
|
color = "white";
|
|
|
|
hoverBackgroundColor = "rgb(86 141 189)";
|
|
|
|
opaqueBackgroundColor = "#0067C0";
|
|
|
|
#endif
|
|
|
|
#ifdef DARK
|
|
|
|
background = "#323232";
|
|
|
|
color = "white";
|
|
|
|
border = "1px solid #3d3a3a";
|
|
|
|
hoverBackgroundColor = "#3e3e3e";
|
|
|
|
opaqueBackgroundColor = "#323232";
|
|
|
|
#endif
|
|
|
|
#endif
|
|
|
|
|
|
#ifdef MACOS
|
|
|
|
border = "1px solid #7f7b7b";
|
|
|
|
margin = 2;
|
|
|
|
margin = "4px 2px"
|
|
|
|
padding = "4px 20px";
|
|
|
|
#ifdef LIGHT
|
|
|
|
color = "black";
|
|
|
|
background = "white";
|
|
|
|
border = "1px solid #e3e1e1";
|
|
|
|
fontSize = 14;
|
|
|
|
opaqueBackgroundColor = "white";
|
|
|
|
hoverBackgroundColor = "rgb(230 231 230 / 65%)";
|
|
|
|
#endif
|
|
|
|
#ifdef DARK
|
|
|
|
color = "white";
|
|
|
|
background = "#282828";
|
|
|
|
hoverBackgroundColor = "#3e3e3e";
|
|
|
|
opaqueBackgroundColor = "#282828";
|
|
|
|
#endif
|
|
|
|
#endif
|
|
|
|
|
|
|
|
display = "block";
|
|
|
|
async mousedown() {
|
|
/*
|
|
|
|
var backgroundAnimation = this.createAnimation("backgroundAnimation");
|
|
|
|
var key = backgroundAnimation.createKeyFrame( 0 );
|
|
|
|
|
|
key.setProperty( "background", this.background );
|
|
|
|
|
|
|
|
var key = backgroundAnimation.createKeyFrame( 100 );
|
|
|
|
|
|
#ifdef WINDOWS
|
|
|
|
#ifdef DARK
|
|
|
|
key.setProperty( "background", "#484747" );
|
|
|
|
#endif
|
|
|
|
#endif
|
|
|
|
|
|
var animationPromiseC = await backgroundAnimation.play("500ms");
|
|
|
|
this.background = "076fc9";
|
|
*/
|
|
|
|
}
|
|
|
|
|
|
mouseover() {
|
|
|
|
this.background = this.hoverBackgroundColor;
|
|
|
|
}
|
|
|
|
mouseleave() {
|
|
|
|
this.background = this.opaqueBackgroundColor;
|
|
|
|
#ifdef WINDOWS
|
|
|
|
#ifdef DARK
|
|
|
|
this.background = this.opaqueBackgroundColor;
|
|
|
|
#endif
|
|
|
|
#endif
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|