From 97897463033a533903d144adcebdf504850e32aa Mon Sep 17 00:00:00 2001 From: Tapas Adhikary Date: Mon, 16 Nov 2020 10:30:05 +0530 Subject: [PATCH] Added a dialog example --- dialog/index.html | 49 +++++++++++++++++++++++++++++++++++++++++++++++ index.html | 4 ++++ main.css | 13 ++++++++++++- 3 files changed, 65 insertions(+), 1 deletion(-) create mode 100644 dialog/index.html diff --git a/dialog/index.html b/dialog/index.html new file mode 100644 index 0000000..19c9280 --- /dev/null +++ b/dialog/index.html @@ -0,0 +1,49 @@ + + + + + + + HTML Tips and Tricks - Dialog Tag + + + + + + +
+ + home + +

Dialog Tag

+ + + + +
+

I'm a Dialog

+

What do you think of me?

+ + + +
+
+ +
+ + + + + \ No newline at end of file diff --git a/index.html b/index.html index 8577561..7057a9e 100644 --- a/index.html +++ b/index.html @@ -71,6 +71,10 @@ Meter and Progress - Display a gauge +
  • + + Dialog - Display a Modal Dialog +
  • diff --git a/main.css b/main.css index 1feb93e..c3c4867 100644 --- a/main.css +++ b/main.css @@ -63,4 +63,15 @@ li { .demo .range output { font-size: 62px; -} \ No newline at end of file +} + +dialog::backdrop { + background: repeating-linear-gradient( + 45deg, + rgba(0, 0, 0, 0.2), + rgba(0, 0, 0, 0.2) 1px, + rgba(0, 0, 0, 0.3) 1px, + rgba(0, 0, 0, 0.3) 20px + ); + backdrop-filter: blur(3px); +}