Refactor dialog.js and test.html files

dialog.js

@@ -1,6 +1,7 @@
 // TODO: 
-// should we move the dom inside shadowDom to avoid style conflicts?
-// or should we add an option to use shadowDom or just to define the container for the dialog-element?
+// - should we move the dom inside shadowDom to avoid style conflicts?
+//  or should we add an option to use shadowDom or just to define the container for the dialog-element?
+// - rename to modal.js? see <iframe sandbox="allow-modals">
 
 class Dialog {
     constructor(options) {
@@ -192,7 +193,11 @@ const text = {
 }
 
 
-/* Works! Waiting for demand
+/* 
+
+Works! Waiting for demand
+There are standards on the way that allow animations (@starting-style, transition-behavior: allow-discrete;)
+
 needs css:
 dialog.animated[hidden] {
     display:block !important;

tests/test.html

@@ -7,12 +7,12 @@
     <script src="../../u1/tests/test-init.js" type=module></script>
     <title>dialog.js test.html | U1 design-system</title>
 
-    <link rel=stylesheet href="https://cdn.jsdelivr.net/gh/u1ui/base.css/full.css">
-    <link rel=stylesheet href="https://cdn.jsdelivr.net/gh/u1ui/classless.css/variables.min.css">
-    <link rel=stylesheet href="https://cdn.jsdelivr.net/gh/u1ui/classless.css/classless.min.css">
-    <link rel=stylesheet href="https://cdn.jsdelivr.net/gh/u1ui/classless.css/more.min.css">
-    <link rel=stylesheet href="https://cdn.jsdelivr.net/gh/u1ui/classless.css/simple.min.css">
-    <link rel=stylesheet href="https://cdn.jsdelivr.net/gh/u1ui/table.class/table.css">
+    <link rel=stylesheet href="../../base.css/full.css">
+    <link rel=stylesheet href="../../classless.css/variables.min.css">
+    <link rel=stylesheet href="../../classless.css/classless.min.css">
+    <link rel=stylesheet href="../../classless.css/more.min.css">
+    <link rel=stylesheet href="../../classless.css/simple.min.css">
+    <link rel=stylesheet href="../../table.class/table.css">
 
     <script src="../../code.el/code.js" type=module></script>
     <link rel=stylesheet href="../../code.el/code.css">
@@ -49,11 +49,6 @@ <h2>Tests</h2>
     <br><br>
     <button onclick="dialog.alert({body:'click on the backdrop',init:el=>el.classList.add('backdropClose')}).then(console.log)">backdropClose class</button>
     <br><br>
-    <button onclick="var dialog = this.nextElementSibling; dialog.open = !dialog.open">toggle non modal dialog</button>
-    <dialog open>
-        opan dialog
-    </dialog>
-    <br><br>
 
     <button id=formTestHtml>form(html) beta</button>
     <script>