Huge updates:

1. Redesigned the web
2. Fixed logging in redirect issue
3. Added new route
4. Fixed sql issue on entry
5. Fixed typos
This commit is contained in:
2017-09-14 16:39:53 +07:00
parent ae8ce075e8
commit 00c5aba77d
12 changed files with 348 additions and 116 deletions

View File

@@ -19,7 +19,9 @@
<div class="fourth-600 none"></div>
<input type="hidden" name="_token" value="{{ token }}">
<div>
<button type="submit" class="half-600 full">Masuk</button>
<button type="submit" class="half-600 full pseudo">
<i class="fa fa-check fa-fw"></i>
</button>
</div>
</div>
</form>

View File

@@ -13,19 +13,21 @@
<form method="post">
<input type="hidden" name="id" value="{{ cat.id }}">
{% if cat.status == 1 %}
<input type="hidden" name="status" value="0">
<input type="hidden" name="_method" value="delete">
{% elseif cat.status == 0 %}
<input type="hidden" name="status" value="1">
<input type="hidden" name="_method" value="put">
{% endif %}
<input type="hidden" name="_addon" value="kategori">
<input type="hidden" name="_token" value="{{ token }}">
<button type="submit" class="shyButton error">
<button type="submit" class="shyButton
{% if cat.status == 1 %}
Nonaktifkan
error">Nonaktifkan
{% elseif cat.status == 0 %}
Aktifkan
success">Aktifkan
{% endif %}
</button>
</form>

View File

@@ -6,15 +6,15 @@
<input type="checkbox" id="bmenug" class="show">
<label for="bmenug" class="burger pseudo button"><i class="fa fa-bars" aria-hidden="true"></i></label>
<div class="menu">
{% if privilage != "" %}
<a href="/posts/entry" class="pseudo button" data-tooltip="Pengumuman Baru"><i class="fa fa-newspaper-o" aria-hidden="true"></i></a>
{% if privilage == 1 %}
<a href="/posts/category" class="pseudo button" data-tooltip="Kategori"><i class="fa fa-list-ul" aria-hidden="true"></i></a>
<a href="/register" class="pseudo button" data-tooltip="User Baru"><i class="fa fa-user-plus" aria-hidden="true"></i></a>
{% if privilege != "" %}
<a href="/posts/entry" class="navy" data-tooltip="Pengumuman Baru"><i class="fa fa-newspaper-o" aria-hidden="true"></i></a>
{% if privilege == 1 %}
<a href="/posts/category" class="navy" data-tooltip="Kategori"><i class="fa fa-list-ul" aria-hidden="true"></i></a>
<a href="/register" class="navy" data-tooltip="User Baru"><i class="fa fa-user-plus" aria-hidden="true"></i></a>
{% endif %}
<a href="/logout" class="pseudo button" data-tooltip="Keluar"><i class="fa fa-sign-out" aria-hidden="true"></i></a>
<a href="/logout" class="navy" data-tooltip="Keluar"><i class="fa fa-sign-out" aria-hidden="true"></i></a>
{% else %}
<a href="/login" class="pseudo button" data-tooltip="Masuk">
<a href="/login" class="navy hidden-hover" data-tooltip="Masuk">
<i class="fa fa-sign-in" aria-hidden="true"></i>
</a>
{% endif %}
@@ -23,37 +23,104 @@
{% block body %}
<main class="documentation">
<section>
<h1>List Pengumuman</h1>
{% for post in posts %}
{% if post.id %}
<h2>
Pengumuman {{ post.id }}
<div style="background:#fff;text-align:left;width:100%;padding:80px 0 0;">
<span class="shyFont">
{% if status %}
{% if post.status == 1 %}
<a href="/posts/edit/{{ post.id }}" data-tooltip="Ubah">
<i class="fa fa-edit" aria-hidden="true"></i>
</a>
{% elseif post.status == 2 %}
<a href="/posts/edit/{{ post.id }}" data-tooltip="Ubah (Belum aktif)">
<strike><i class="fa fa-edit" aria-hidden="true"></i></strike>
</a> (Belum aktif)
{% else %}
<strike data-tooltip="Tidak dapat diubah (Tidak aktif)"><i class="fa fa-edit" aria-hidden="true"></i></strike>
(Nonaktif)
{% endif %}
{% endif %}
</span>
</h2>
{{ post.content | raw }}
{% endif %}
{% endfor %}
</section>
{% if privilege == "" %}
<div id="slidr-div">
{% if not posts %}
<h1 class="fitty">Tidak ada pengumuman</h1>
{% else %}
{% for post in posts %}
<div data-slidr="{{ post.id }}" style="width: 100%;">
<div class="fitty" style="padding: 0 5rem">
{{ post.content | raw }}
</div>
</div>
{% endfor %}
{% endif %}
</div>
<section>
</section>
{% else %}
<div class="filter flex six-600 four grow">
<div class="sixth-600 none"></div>
<a href="/" class="navy noFitty">Semua</a>
<a href="/?status=1" class="navy noFitty">Aktif</a>
<a href="/?status=2" class="navy noFitty">Belum Aktif</a>
<a href="/?status=0" class="navy noFitty">Nonaktif</a>
<div class="sixth-600 none"></div>
</div>
<div class="flex four-900 full card-wrapper" style="padding: 0 .6em;">
<a href="/posts/entry" class="fourth-900 half-600 card box new">
<i class="fa fa-plus fa-3x"></i>
</a>
{% for post in posts %}
<div class="fourth-900 half-600 card box">
<span>{{ post.content }}</span>
<form method="post">
<footer class="flex full grow">
{% if post.status != 0 %}
<div class="half-900">
<a href="/posts/edit/{{ post.id }}" class="button full">
<i class="fa fa-edit fa-fw"></i>
</a>
</div>
{% else %}
<div class="half-900">
<span class="button pseudo full" style="color:rgba(17,17,17,.3)">Nonaktif</span>
</div>
{% endif %}
{% if (post.status == 1 and editor_now.id == creator.id) %}
<div class="half-900">
<input type="hidden" name="id" value="{{ post.id }}">
<input type="hidden" name="status" value="0">
<!-- Method -->
<input type="hidden" name="_method" value="delete">
<!-- Token -->
<input type="hidden" name="_token" value="{{ token }}">
<button type="submit" class="error full">
<i class="fa fa-times-circle-o fa-fw" aria-hidden="true"></i>
</button>
</div>
{% elseif (post.status == 2 and editor_now.id == creator.id) %}
<div class="half-900">
<input type="hidden" name="id" value="{{ post.id }}">
<input type="hidden" name="valid_at" value="##date##">
<!-- Method -->
<input type="hidden" name="_method" value="put">
<!-- Token -->
<input type="hidden" name="_token" value="{{ token }}">
<button type="submit" class="success full">
<i class="fa fa-check fa-fw" aria-hidden="true"></i>
</button>
</div>
{% endif %}
</footer>
</form>
</div>
{% endfor %}
</div>
{% endif %}
</div>
</main>
<script>
fitty('.fitty', {
minSize: 120,
maxSize: 700
});
fitty('.noFitty', {
minSize: 15,
maxSize: 15
});
slidr.create('slidr-div', {
controls: false,
timing: {'linear': '0.5s ease-in'},
theme: '#666',
touch: true
}).add("h", [{% for post in posts %}"{{ post.id }}", {% endfor %} {% if posts|length > 1 %}"{{ posts.0.id }}"{% endif %}]).start().auto();
</script>
{% endblock %}

View File

@@ -6,6 +6,7 @@
<link rel="stylesheet" href="/font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="/css/picnic.min.css">
<link rel="stylesheet" href="/css/rome.css">
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet">
<title>{% block title %}{% endblock %}</title>
<style>
@@ -18,6 +19,10 @@
padding: 80px 0 0;
}
.flex>* {
padding-right: .6em;
}
nav.transparent {
box-shadow: none;
background: none;
@@ -37,7 +42,6 @@
}
.top {
position: fixed;
z-index: 10001;
}
@@ -52,18 +56,105 @@
td, th {
padding: .3em .45em .3em .6em;
}
.fitty {
display: inline-block;
white-space: nowrap;
line-height: 1em;
padding-bottom: .1em;
text-align: center;
}
.title {
font-family: 'Lobster', cursive;
font-size: x-large;
}
nav .menu>.navy {
color: #000;
margin-right: 2.5em;
}
.navy:hover, .title:hover {
color: rgba(17, 17, 17, .3);
}
.hidden-hover {
opacity: 0;
}
.hidden-hover:hover {
opacity: 1;
}
.filter a {
text-align: center;
}
.card footer {
position: absolute;
bottom: 0;
}
.card-wrapper {
margin: 0 auto;
}
.box {
padding: 1em;
background-color: rgba(17, 17, 17, .1);
border: none;
height: 17em;
width: 17em;
margin: .6em auto;
}
.new i {
position: absolute;
top: 50%;
left: 50%;
margin-right: -50%;
transform: translate(-50%, -50%);
}
.box:hover {
background-color: rgba(17, 17, 17, .05);
}
.card footer {
padding-left: 0;
padding-bottom: 0;
}
</style>
</head>
<body>
<nav>
<a href="/" class="brand">
<span><i class="fa fa-home" aria-hidden="true"></i></span>
<span class="title">Live Info</span>
</a>
{% block nav %}{% endblock %}
</nav>
<script src="/js/rome.js"></script>
<script src="/js/fitty.min.js"></script>
<script src="/js/slidr.min.js"></script>
{% block body %}
{% endblock %}
<script>
function fadeOutEffect() {
var fadeTarget = document.getElementById("info");
var fadeEffect = setInterval(function () {
if (!fadeTarget.style.opacity) {
fadeTarget.style.opacity = 1;
}
if (fadeTarget.style.opacity < 0.1) {
clearInterval(fadeEffect);
} else {
fadeTarget.style.opacity -= 0.1;
}
}, 50);
}
</script>
</body>
</html>