Skip to content

NotableAPP/Alert

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

45 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

CREATE ALERTS LIKE this


See the latest preview here

Getting started

<link rel="stylesheet" href="https://rawcdn.githack.com/NotableAPP/Alert/ad1d80a15959b5f7357657d3732160cbc6fafc06/cdn/TeDlert.css">
<script src="https://rawcdn.githack.com/NotableAPP/Alert/ad1d80a15959b5f7357657d3732160cbc6fafc06/cdn/TeDlertmain.js"></script>
/* Creating simple alert */
var bsted = Ted();
bsted.alert({
 content:`Welcome to Gboard clipboard, any text you copy will be saved here.`,
 title:`Getting started with Gboard`,
});
/*✅ DONE*/

All Params

Param type default example global set methods
title string none "Gboard clipboard" Ted().globalSet({title:"title goes here"})
content string none "Welcome to Gboard clipboard, any text you copy will be saved here." none
mode string(dark or light) "light" "dark" <meta name="ted-globalmode" content="dark">&Ted().globalSet({mode:'dark'});
theme string(primary, danger,success and warning) "primary" "danger" none
html Boolean false true Ted().globalSet({html:true});
closeBtn Boolean true false none
btns array none [{val:'#1',fun:(e)=>{del(e)},}] none

creating complex alerts for web projects like progrssive web apps

<!-- setting up default mode for the file with this meta tag -->
<meta name="ted-globalmode" content="dark"> <!-- or <meta name="ted-globalmode" content="light"> -->
<!-- It will help you to avoid javascript and use html only to set up dark mode for alerts -->

OR You are also able to create 3 default Params

var boost = Ted();
boost.globalSet({
   title:'your default title',
   mode:'your default mode',
   html:true ,/* default is false */
   });
boost.alert({
 content:'yeah use only a param',
});

fully filled Params

var attributes = {
title:'Gboard clipboard',
Content:`Touch and hold a clip to pin it. Unpinned clips will be deleted after 1 hour.`,
html:false,
mode:'dark',
closeBtn:true,
btns:[
{
val:"#1",
fun: function (e){
del(e);/*deletes alert*/
},
},
],
}

for more information get attributes.json file

btns

btns is Param which creates custom button with there custom click event functions

[
{
val:'#button',
fun:(e)=>{
del(e);
}
}
]
Param default type used for
val undefined string buttons value
fun none function Triggers on click of button

About

No description or website provided.

Topics

Resources

License

Stars

Watchers

Forks

Contributors 2

  •  
  •  

Languages