Browse Source

a toast for reminding ending

pull/5/head
namasikanam 2 years ago
parent
commit
4c56a29edc
3 changed files with 26 additions and 1 deletions
  1. +3
    -1
      README.md
  2. +7
    -0
      static/css/ordinary.css
  3. +16
    -0
      templates/story.html

+ 3
- 1
README.md View File

@ -5,8 +5,10 @@
## Run in Develop Mode
```bash
export FLASK_APP=app.py
export FLASK_ENV=development
python3 init_data.py
python3 app.py
flask run
```
Open http://127.0.0.1:5000/ordinary in a browser.

+ 7
- 0
static/css/ordinary.css View File

@ -187,3 +187,10 @@ nav .page-item.active .page-link {
background-color: #000;
border-color: #000;
}
.toast {
left: 50%;
position: fixed;
transform: translate(-50%, 0px);
z-index: 9999;
}

+ 16
- 0
templates/story.html View File

@ -35,6 +35,16 @@
</div>
</div>
<div class="toast fixed-top" id="ending-toast" role="alert" aria-live="assertive" aria-atomic="true" autohide="false">
<div class="toast-header">
<strong class="me-auto">结尾提醒</strong>
<button type="button" class="btn-close" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
<div class="toast-body">
到最后一个时段啦,请为故事续写结尾吧~
</div>
</div>
<div class="part1 col-md-6">
<div class="story-box qbox part-box">
<h1>{{story.title}}</h1>
@ -183,6 +193,12 @@
<script src="https://cdn.bootcdn.net/ajax/libs/jquery-timeago/1.6.7/locales/jquery.timeago.zh-CN.js"></script>
<script>
window.onload = function(e) {
var DOMToast = document.getElementById('ending-toast');
var bootstrapToast = new bootstrap.Toast(DOMToast);
bootstrapToast.show();
};
$('.can-react').click(function (e) {
$this = $(this);
$.post(

Loading…
Cancel
Save