2017-10-03 18:34:59 +02:00
<!doctype html>
2017-10-22 14:02:24 +02:00
< html lang = "en" >
2016-11-12 16:12:58 +01:00
< head >
< meta charset = "utf-8" >
2019-02-27 16:47:41 +01:00
< meta name = "viewport" content = "width=device-width, initial-scale=1" >
2020-10-22 08:38:15 +02:00
< link href = "../../../dist/css/bootstrap.min.css" rel = "stylesheet" >
2016-11-12 16:12:58 +01:00
< title > Alert< / title >
< / head >
< body >
< div class = "container" >
< h1 > Alert < small > Bootstrap Visual Test< / small > < / h1 >
2014-06-08 04:11:44 +02:00
2016-10-28 00:13:17 +02:00
< div class = "alert alert-warning alert-dismissible fade show" role = "alert" >
2020-11-14 07:16:30 +01:00
< button type = "button" class = "btn-close" data-bs-dismiss = "alert" aria-label = "Close" > < / button >
2016-11-12 16:12:58 +01:00
< strong > Holy guacamole!< / strong > You should check in on some of those fields below.
< / div >
2014-06-08 04:11:44 +02:00
2016-10-28 00:13:17 +02:00
< div class = "alert alert-danger alert-dismissible fade show" role = "alert" >
2020-11-14 07:16:30 +01:00
< button type = "button" class = "btn-close" data-bs-dismiss = "alert" aria-label = "Close" > < / button >
2016-11-12 16:12:58 +01:00
< p >
< strong > Oh snap!< / strong > < a href = "#" class = "alert-link" > Change a few things up< / a > and try submitting again.
< / p >
< p >
< button type = "button" class = "btn btn-danger" > Danger< / button >
< button type = "button" class = "btn btn-secondary" > Secondary< / button >
< / p >
< / div >
2014-06-08 04:11:44 +02:00
2016-10-28 00:13:17 +02:00
< div class = "alert alert-danger alert-dismissible fade show" role = "alert" >
2020-11-14 07:16:30 +01:00
< button type = "button" class = "btn-close" data-bs-dismiss = "alert" aria-label = "Close" > < / button >
2016-11-12 16:12:58 +01:00
< p >
< strong > Oh snap!< / strong > < a href = "#" class = "alert-link" > Change a few things up< / a > and try submitting again. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Cras mattis consectetur purus sit amet fermentum.
< / p >
< p >
< button type = "button" class = "btn btn-danger" > Take this action< / button >
< button type = "button" class = "btn btn-primary" > Or do this< / button >
< / p >
< / div >
2018-03-13 09:59:20 +01:00
< div class = "alert alert-warning alert-dismissible fade show" role = "alert" style = "transition-duration: 5s;" >
2020-11-14 07:16:30 +01:00
< button type = "button" class = "btn-close" data-bs-dismiss = "alert" aria-label = "Close" > < / button >
2018-03-13 09:59:20 +01:00
This alert will take 5 seconds to fade out.
< / div >
2016-11-12 16:12:58 +01:00
< / div >
2014-06-08 04:11:44 +02:00
2019-05-08 15:11:24 +02:00
< script src = "../../dist/dom/event-handler.js" > < / script >
< script src = "../../dist/dom/selector-engine.js" > < / script >
2017-08-21 09:11:37 +02:00
< script src = "../../dist/dom/data.js" > < / script >
2021-02-22 07:42:43 +01:00
< script src = "../../dist/base-component.js" > < / script >
2016-11-12 16:12:58 +01:00
< script src = "../../dist/alert.js" > < / script >
< / body >
2014-06-08 04:11:44 +02:00
< / html >