From 33e70fafab726a89f0550c29a4e87a9bce791ae4 Mon Sep 17 00:00:00 2001 From: Anna Knoerr Date: Tue, 21 Dec 2021 06:31:38 +0100 Subject: will modals work? --- modal.css | 37 +++++++++++++++++++++++++++++++++++++ 1 file changed, 37 insertions(+) create mode 100644 modal.css (limited to 'modal.css') diff --git a/modal.css b/modal.css new file mode 100644 index 0000000..2ea7ee9 --- /dev/null +++ b/modal.css @@ -0,0 +1,37 @@ + /* The Modal (background) */ +.modal { + display: none; /* Hidden by default */ + position: fixed; /* Stay in place */ + z-index: 1; /* Sit on top */ + left: 0; + top: 0; + width: 100%; /* Full width */ + height: 100%; /* Full height */ + overflow: auto; /* Enable scroll if needed */ + background-color: rgb(0,0,0); /* Fallback color */ + background-color: rgba(0,0,0,0.4); /* Black w/ opacity */ +} + +/* Modal Content/Box */ +.modal-content { + background-color: #fefefe; + margin: 15% auto; /* 15% from the top and centered */ + padding: 20px; + border: 1px solid #888; + width: 80%; /* Could be more or less, depending on screen size */ +} + +/* The Close Button */ +.close { + color: #aaa; + float: right; + font-size: 28px; + font-weight: bold; +} + +.close:hover, +.close:focus { + color: black; + text-decoration: none; + cursor: pointer; +} -- cgit v1.2.3-54-g00ecf