Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improved UI of the window prompt #1009

Merged
merged 1 commit into from Oct 13, 2021
Merged
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
30 changes: 15 additions & 15 deletions templates/layout.html
Expand Up @@ -9,31 +9,31 @@
<link rel="shortcut icon" type="image/png" href="{{static('/images/Hedy-logo.png')}}"/>
<link rel="stylesheet" href="{{static('/vendor/gh-fork-ribbon.min.css')}}"/>
</head>

<body class="bg-gray-400">
<noscript>Hedy requires Javascript to be enabled in your browser.</noscript>
<div id="modal-mask" class="hidden absolute bg-gray-400 z-50 w-full h-full" style="opacity: 40%"></div>
<div id="modal-content" class="hidden absolute z-50 p-16 bg-gray-200 border-2 border-black" style="top: 50%; left: 50%; transform: translate(-50%, -50%);">
<div id="modal-mask" class="hidden absolute bg-black z-50 w-full h-full opacity-75"></div>
<div id="modal-content" class="hidden absolute z-50 p-12 pl-16 pr-16 bg-blue-400 border-2 border-gray-400 rounded-lg text-lg text-center" style="top: 40%; left: 50%; transform: translate(-50%, -50%);">
<div id="modal-alert" class="hidden">
<div id="modal-alert-text"></div>
<div style="margin: auto; text-align: center;">
<button class="btn block mt-4" style="min-width:6em" onclick="window.modal.hide ()">{{auth.ok}}</button>
<div id="modal-alert-text" class="text-white mb-8 text-xl"></div>
<div class="ml-auto mr-auto mt-4 flex flex-row justify-center">
<button class="green-btn block m-4 w-40 pb-4 pt-4" onclick="window.modal.hide ()">{{auth.ok}}</button>
</div>
</div>
<div id="modal-confirm" class="hidden">
<div id="modal-confirm-text"></div>
<div style="margin: auto; text-align: center;">
<button class="btn block mt-4" style="min-width:6em" onclick="window.modal.confirmcb (true)">{{auth.yes}}</button>
<button class="btn block mt-4 ml-2" style="min-width:6em" onclick="window.modal.confirmcb (false)">{{auth.no}}</button>
<div id="modal-confirm-text" class="text-white mb-8 text-xl"></div>
<div class="ml-auto mr-auto mt-4 flex flex-row justify-center">
<button class="green-btn block m-4 w-40 pb-4 pt-4" onclick="window.modal.confirmcb (true)">{{auth.yes}}</button>
<button class="red-btn block m-4 w-40 pb-4 pt-4" onclick="window.modal.confirmcb (false)">{{auth.no}}</button>
</div>
</div>
<div id="modal-prompt" class="hidden">
<div id="modal-prompt-text"></div>
<div style="margin: auto; text-align: center;">
<div id="modal-prompt-text" class="text-white mb-8 text-xl"></div>
<div class="ml-auto mr-auto">
<input id="modal-prompt-input" type="text" class="border border-green-400 rounded p-2 px-3 w-4/5 mt-1">
<br>
<button class="btn block mt-4" style="min-width:6em" onclick="window.modal.promptcb ()">{{auth.ok}}</button>
<button class="btn block mt-4 ml-2" style="min-width:6em" onclick="window.modal.promptcb (true)">{{auth.cancel}}</button>
<div class="mt-4 flex flex-row justify-center">
<button class="green-btn block m-4 w-40 pb-4 pt-4" onclick="window.modal.promptcb ()">{{auth.ok}}</button>
<button class="red-btn block m-4 w-40 pb-4 pt-4" onclick="window.modal.promptcb (true)">{{auth.cancel}}</button>
</div>
</div>
</div>
</div>
Expand Down