[terms] implement terms and conditions blur modal, fixes #1166
This commit is contained in:
parent
d04407d3bc
commit
68be2c7123
2 changed files with 30 additions and 25 deletions
19
ext/terms/style.css
Normal file
19
ext/terms/style.css
Normal file
|
@ -0,0 +1,19 @@
|
||||||
|
.terms-modal-enter {
|
||||||
|
margin: 10px;
|
||||||
|
}
|
||||||
|
#terms-modal {
|
||||||
|
margin: auto;
|
||||||
|
margin-top: 20vh;
|
||||||
|
padding: 5px 20px;
|
||||||
|
text-align: center;
|
||||||
|
width: fit-content;
|
||||||
|
}
|
||||||
|
#terms-modal-bg {
|
||||||
|
position: fixed;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 999;
|
||||||
|
backdrop-filter: blur(10px);
|
||||||
|
}
|
|
@ -8,30 +8,16 @@ class TermsTheme extends Themelet
|
||||||
{
|
{
|
||||||
public function display_page(Page $page, string $sitename, string $path, string $body): void
|
public function display_page(Page $page, string $sitename, string $path, string $body): void
|
||||||
{
|
{
|
||||||
$page->set_mode(PageMode::DATA);
|
$html =
|
||||||
$page->add_auto_html_headers();
|
"<div id='terms-modal-bg'>
|
||||||
$hh = $page->get_all_html_headers();
|
<dialog id='terms-modal' class='setupblock' open>
|
||||||
$page->set_data(
|
<h1><span>$sitename</span></h1>
|
||||||
<<<EOD
|
$body
|
||||||
<!doctype html>
|
<form action='/accept_terms/$path' method='POST'>
|
||||||
<html lang="en">
|
<button class='terms-modal-enter' autofocus>Enter</button>
|
||||||
<head>
|
</form>
|
||||||
<title>$sitename</title>
|
</dialog>
|
||||||
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
|
</div>";
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
$page->add_block(new Block(null, $html, "main", 1));
|
||||||
$hh
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<div id="front-page">
|
|
||||||
<h1><span>$sitename</span></h1>
|
|
||||||
$body
|
|
||||||
<form action="/accept_terms/$path" method="POST">
|
|
||||||
<button>Enter</button>
|
|
||||||
</form>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
EOD
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Reference in a new issue