|
|
- <!DOCTYPE html>
- <html lang="zh-CN">
-
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
- <link rel="icon" type="image/png" href="/img/ord/icon-128.png" />
- <link href="https://fonts.yecdn.com/css2?family=Noto+Serif+SC:wght@300;700&display=swap" rel="stylesheet">
- <link href="https://fonts.yecdn.com/css2?family=Noto+Sans+SC&display=swap" rel="stylesheet">
- <meta property="og:title" content="十三月评凡" />
- <meta property="og:description" content="其实就是复旦大学特普通奖学金,但是他们辅导员好像不让提学校,搞不懂,搞不懂" />
- <link href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet">
- <title>十三月评凡 报名页面</title>
- <style>
- body,
- pre {
- font-family: 'Noto Sans SC', sans-serif;
- }
-
- h1,
- h2,
- h3,
- h4,
- h5,
- h6,
- .sort-by{
- font-family: 'Noto Serif SC', serif;
- font-weight: 300;
- }
-
- .sort-by b {
- font-weight: 700;
- }
-
- a,
- a:hover,
- .btn-link,
- .btn-link:hover {
- color: inherit;
- text-decoration: underline;
- }
-
- nav .page-link {
- color: #000;
- }
-
- nav .page-item.active .page-link {
- background-color: #000;
- border-color: #000;
- }
-
- .btn-lg {
- font-size: 2em;
- font-family: 'Noto Serif SC', serif;
- }
-
- .part1 {
- max-width: 500px;
- float: left;
- padding-right: 10px;
- position: relative;
- }
-
- .input-form {
- position: absolute;
- top: 0;
- overflow-y: auto;
- overflow-x: hidden;
- background-color: #0006;
- height: 100%;
- }
-
- .part2 {
- min-width: 200px;
- overflow: hidden;
- padding-left: 25px;
- }
-
- .qbox {
- border: 2px black solid;
- background: white;
- padding: 5px;
- color: black;
- margin: 5px 5px 40px;
- }
-
- .new .qbox {
- background: transparent;
- color: white;
- border: none;
- }
-
- .new .qbox input,
- .new .qbox textarea {
- border: none;
- border-bottom: 2px solid;
- background: transparent;
- color: white;
- border-radius: 0;
- }
-
- .qbox .inner {
- margin: 15px 0 20px 15px;
- white-space: pre-wrap;
- }
-
- .like {
- fill: #fff;
- }
-
- .liked {
- fill: #000;
- }
-
- .timeago {
- font-size: 0.5em;
- margin-right: 10px;
- }
-
- .display_name {
- margin: 0;
- }
-
- .card-body {
- padding: 0.75em;
- }
-
- .behind {
- z-index: 98;
- cursor: pointer;
- transform: translateY(5px) scale(0.98);
- transform-origin: top;
- transition-property: transform;
- transition-duration: 0.5s;
- }
-
- .front {
- z-index: 99;
- transition-property: transform;
- transition-duration: 0.5s;
- }
-
- .twin {
- overflow: hidden;
- }
-
- .new {
- position: relative;
- margin: 30px 20px 30px 0;
- }
-
- .twin-collapse {
- max-height: 360px;
- }
-
- .show-mask {
- display: block;
- position: absolute;
- top: 20px;
- right: 35px;
- text-align: center;
- padding-top: 330px;
- width: 100%;
- z-index: 999;
- }
-
- .footer {
- background: black;
- color: white;
- text-align: center;
- font-size: 80%;
- border-top: solid 1px white;
- }
-
- .footer p {
- margin: 10px 0 0;
- float: bottom;
- }
- </style>
- </head>
-
- <body style="background: #fff url('/img/ord_fudan/bg_sm.jpg') repeat fixed center top / 250px">
- <div class="container" style="overflow: hidden;min-height: 100vh">
- <div style='padding:15px'>
- <img src="/img/ord_fudan/logo_sm.png" width="200px" />
- </div>
-
- <div class="part1">
- <div id="new" class="new twin-collapse twin front">
- <img src="/img/ord_fudan/input_bg.jpg" width="100%">
- <div class="input-form">
- <form action="new" method="post">
- <div class="form-group qbox">
- <h1 style="margin: -18px -16px 15px">自荐提名</h1>
- <textarea class="form-control" name="text" rows="5" maxlength="4000" placeholder="{{text1}}" required="required"></textarea>
- <textarea class="form-control" name="privateText" rows="4" maxlength="1000" placeholder="{{text2}}"></textarea>
- {% for v in vs %}
- <div class="form-group row">
- <label for="{{v.name}}" class="col-sm-7 col-form-label">{{v.ques}}</label>
- <div class="col-sm-5">
- <input type="text" class="form-control" name="{{v.name}}" placeholder="{{v.hint}}" required="required">
- </div>
- </div>
- {% endfor %}
- <button type="submit" class="btn btn-link btn-lg">报名</button>
- </div>
- </form>
- </div>
-
- </div>
-
- <a href="##" onclick="showNew()" class="show-mask">
- <span>
- <svg fill="#fff" viewBox="0 12 24 48" width="24">
- <path d="m0 24 l12 18 l12 -18 z"></path>
- </svg>
- </span>
- </a>
-
-
- <script>
- function showNew() {
- $('.twin').removeClass('twin-collapse');
- $('.show-mask').hide();
- }
- </script>
-
- </div>
-
- <div class="part2" id="part2">
- <div style="display:flex;justify-content:space-between;align-items: flex-end">
- <h1>已有报名</h1>
- <span style="margin:8px" class="sort-by">
- {% if sort_by == 'likeNum' %}
- <a href="?sort_by=time#part2">按时间</a> | <b>按赞数</b>
- {% else %}
- <b>按时间</b> | <a href="?sort_by=likeNum#part2">按赞数</a>
- {% endif %}
- </span>
- </div>
- {% for c in pagination.items %}
- <div class="qbox">
- {% if showPrivate %}
- <form action="{{c.id}}/delete" method="post">
- <input type="hidden" name="key" value="{{key}}">
- <button type="submit" class="close" aria-label="Close">
- <span>×</span>
- </button>
- </form>
- {% endif %}
- <small>No. {{c.id}}</small>
- <pre class="inner">{{c.content}}</pre>
- {% if showPrivate %}
- <hr />
- <pre class="inner">{{c.private}}</pre>
- <hr />
- {% endif %}
- {% if c.url %}
- <p class="inner"><a href="{{c.url}}" target="_black">补充材料</a></p>
- {% endif %}
- <div style="text-align:right;margin: 27px 0 -5px">
- <time class="timeago" datetime="{{c.time}}"></time>
- <a href="##" class="btn btn-link" id="like-{{c.id}}" onClick="like('{{c.id}}')" style="text-decoration: none;">
- <svg viewBox="-20 0 552 512" height="16" class="{{c.liked}}">
- <path stroke="#000" stroke-width="30" d="M474.644,74.27C449.391,45.616,414.358,29.836,376,29.836c-53.948,0-88.103,32.22-107.255,59.25
- c-4.969,7.014-9.196,14.047-12.745,20.665c-3.549-6.618-7.775-13.651-12.745-20.665c-19.152-27.03-53.307-59.25-107.255-59.25
- c-38.358,0-73.391,15.781-98.645,44.435C13.267,101.605,0,138.213,0,177.351c0,42.603,16.633,82.228,52.345,124.7
- c31.917,37.96,77.834,77.088,131.005,122.397c19.813,16.884,40.302,34.344,62.115,53.429l0.655,0.574
- c2.828,2.476,6.354,3.713,9.88,3.713s7.052-1.238,9.88-3.713l0.655-0.574c21.813-19.085,42.302-36.544,62.118-53.431
- c53.168-45.306,99.085-84.434,131.002-122.395C495.367,259.578,512,219.954,512,177.351
- C512,138.213,498.733,101.605,474.644,74.27z" />
- </svg>
- <span>
- {{c.likeNum}}
- </span>
- </a>
- </div>
- </div>
- {% endfor %}
-
- <nav>
- <ul class="pagination">
- {%- for page in pagination.iter_pages() %}
- {% if page %}
- {% if page != pagination.page %}
- <li class="page-item"><a class="page-link" href="{{ url_for('can_list', page=page, per_page=pagination.per_page, key=key, sort_by=sort_by) }}">{{ page }}</a></li>
- {% else %}
- <li class="page-item active">
- <a class="page-link" href="#">{{ page }}<span class="sr-only">(current)</span></a>
- </li>
- {% endif %}
- {% else %}
- <li class="page-item"><span class=ellipsis>…</span></li>
- {% endif %}
- {%- endfor %}
- </ul>
- </nav>
-
- </div>
-
- </div>
- <div class="footer">
- <p>
- 主办:十三月评凡项目组 <a href="mailto:fdpf2020@163.com">fdpf2020@163.com</a><br>
- 由<a href="//closed.social" target="_blank">闭社</a>提供技术支持,本报名系统开源于<a href="//git.closed.social/closed-social/ordinary/src/branch/fudan">碧茶</a>。
- </p>
- <p> 🄯 2020 Copyleft: closed.social</p>
- </div>
- </body>
-
- <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
- <script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
- <script src="https://cdn.bootcdn.net/ajax/libs/jquery-timeago/1.6.7/jquery.timeago.min.js"></script>
- <script src="https://cdn.bootcdn.net/ajax/libs/jquery-timeago/1.6.7/locales/jquery.timeago.zh-CN.js"></script>
-
- <script>
- function like(toot) {
- if ($(`#like-${toot} svg`).hasClass("liked")) {
- alert('赞都赞了,别撤回嘛');
- return;
- }
- $.ajax({
- type: 'POST',
- url: toot + '/like',
- success: (result, status, xhr) => {
- console.log(result + ' : ' + status);
- $(`#like-${toot} span`).text(result);
- $(`#like-${toot} svg`).toggleClass("like liked");
- },
- error: (xhr, status, error) => {
- alert(error + ': ' + xhr.responseText);
- }
- });
- }
-
- $(document).ready(function(){
- if(window.innerWidth > 1000)
- showNew();
- $('.timeago').timeago();
- });
- </script>
-
- </html>
|