diff options
Diffstat (limited to 'src/css/modal.css')
-rw-r--r-- | src/css/modal.css | 36 |
1 files changed, 17 insertions, 19 deletions
diff --git a/src/css/modal.css b/src/css/modal.css index bd6f2a3..a609ef9 100644 --- a/src/css/modal.css +++ b/src/css/modal.css @@ -1,32 +1,30 @@ -/* The Modal (background) */ .modal { - display: none; /* Hidden by default */ - position: fixed; /* Stay in place */ - z-index: 1; /* Sit on top */ + display: none; + position: fixed; + z-index: 1; left: 0; top: 0; - width: 100%; /* Full width */ - height: 100%; /* Full height */ - justify-content: center; /* Center horizontally */ - align-items: center; /* Center vertically */ - background-color: rgba(0, 0, 0, 0.4); /* Black w/ opacity */ - overflow: auto; /* Enable scroll if needed */ - animation: fadeIn 0.25s; /* Fade in the background */ + width: 100%; + height: 100%; + justify-content: center; + align-items: center; + background-color: rgba(0, 0, 0, 0.4); + overflow: auto; + animation: fadeIn 0.25s; } -/* Modal Content */ .modal-content { display: flex; - background-color: #282828; /* Gruvbox background */ - color: #ebdbb2; /* Gruvbox foreground */ + background-color: #282828; + color: #ebdbb2; margin: auto; padding: 20px; - border: 1px solid #928374; /* Gruvbox grey */ - width: 40%; /* Adjust as needed */ + border: 1px solid #928374; + width: 40%; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2); - animation: scaleUp 0.25s; /* Scale animation */ - border-radius: 8px; /* Rounded corners */ - justify-content: center; /* Center horizontally */ + animation: scaleUp 0.25s; + border-radius: 8px; + justify-content: center; } /* Animations */ |