first push
This commit is contained in:
75
templates/base.html
Normal file
75
templates/base.html
Normal file
@@ -0,0 +1,75 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>Blog</title>
|
||||
<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.6.16/css/uikit.min.css"/>
|
||||
<style>
|
||||
.blog-card {
|
||||
width: 300px;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.blog-card img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.grid-container {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: center;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- include libraries(jQuery, bootstrap) -->
|
||||
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
|
||||
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
|
||||
|
||||
<!-- include summernote css/js -->
|
||||
<link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
|
||||
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.js"></script>
|
||||
|
||||
<script src="https://unpkg.com/masonry-layout@4/dist/masonry.pkgd.min.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<nav class="uk-navbar-container" uk-navbar>
|
||||
<div class="uk-navbar-left">
|
||||
<ul class="uk-navbar-nav">
|
||||
<li class="uk-active"><a href="#">
|
||||
<img src="http://webmail.wixon.co.kr/user_img/logoImage.jpeg" alt="">
|
||||
</a></li>
|
||||
<li><a href="/">목록</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="uk-navbar-right">
|
||||
<ul class="uk-navbar-nav">
|
||||
{% if g.is_login %}
|
||||
<li>
|
||||
<a href="#">{{ g.user_info.mb_name }} <span class="uk-icon"
|
||||
uk-icon="icon: triangle-down"></span></a>
|
||||
<div class="uk-navbar-dropdown">
|
||||
<ul class="uk-nav uk-navbar-dropdown-nav">
|
||||
<li class="uk-active"><a href="/write">포스트 작성</a></li>
|
||||
<li class="uk-active"><a href="/logout">로그아웃</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</li>
|
||||
{% else %}
|
||||
<li><a href="/login">로그인</a></li>
|
||||
{% endif %}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
|
||||
</nav>
|
||||
|
||||
{% block content %}{% endblock %}
|
||||
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.6.16/js/uikit.min.js"></script>
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/uikit/3.6.16/js/uikit-icons.min.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
32
templates/index.html
Normal file
32
templates/index.html
Normal file
@@ -0,0 +1,32 @@
|
||||
{% extends 'base.html' %}
|
||||
|
||||
{% block content %}
|
||||
<div class="uk-container">
|
||||
<div class="grid-container masonry-grid">
|
||||
{% for post in posts %}
|
||||
<div class="blog-card uk-card uk-card-default">
|
||||
<div class="uk-card-media-top">
|
||||
<img src="{{ post.thumbnail_img }}" alt="{{ post.title }}">
|
||||
</div>
|
||||
<div class="uk-card-body">
|
||||
<h3 class="uk-card-title">{{ post.title }}</h3>
|
||||
<!-- Truncate the contents to 100 characters, removing any HTML tags -->
|
||||
<p>{{ post.contents | striptags | truncate(100) }}</p>
|
||||
<a href="#" class="uk-button uk-button-text">Read more</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
$('.masonry-grid').masonry({
|
||||
// options...
|
||||
itemSelector: '.blog-card',
|
||||
columnWidth: '.blog-card',
|
||||
percentPosition: true
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
32
templates/login.html
Normal file
32
templates/login.html
Normal file
@@ -0,0 +1,32 @@
|
||||
{% extends 'base.html' %}
|
||||
|
||||
{% block content %}
|
||||
<div class="uk-container uk-margin-top">
|
||||
<h1 class="uk-text-center"><span>윅슨 블로그 로그인</span></h1>
|
||||
{% with messages = get_flashed_messages() %}
|
||||
{% if messages %}
|
||||
<div class="uk-alert-danger" uk-alert>
|
||||
<a class="uk-alert-close" uk-close></a>
|
||||
{{ messages[0] }}
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endwith %}
|
||||
<form class="uk-form-stacked" action="{{ url_for('login') }}" method="post">
|
||||
<div class="uk-margin">
|
||||
<label class="uk-form-label" for="form-stacked-text">Username</label>
|
||||
<div class="uk-form-controls">
|
||||
<input class="uk-input" id="form-stacked-text" type="text" placeholder="Username..." name="username">
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-margin">
|
||||
<label class="uk-form-label" for="form-stacked-text">Password</label>
|
||||
<div class="uk-form-controls">
|
||||
<input class="uk-input" id="form-stacked-text" type="password" placeholder="Password..." name="password">
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-margin">
|
||||
<button class="uk-button uk-button-default">Log In</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
{% endblock %}
|
||||
65
templates/write.html
Normal file
65
templates/write.html
Normal file
@@ -0,0 +1,65 @@
|
||||
{% extends 'base.html' %}
|
||||
|
||||
{% block content %}
|
||||
<div class="uk-container uk-margin-top">
|
||||
<h1 class="uk-text-center"><span>포스트 작성</span></h1>
|
||||
<form action="/write" method="post" class="uk-form-stacked">
|
||||
<div class="uk-margin">
|
||||
<label class="uk-form-label" for="title">제목</label>
|
||||
<div class="uk-form-controls">
|
||||
<input class="uk-input" id="title" type="text" name="title" placeholder="제목을 입력하세요..." required>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-margin">
|
||||
<label class="uk-form-label" for="category">카테고리</label>
|
||||
<div class="uk-form-controls">
|
||||
<select class="uk-select" id="category" name="category" required>
|
||||
<option value="">카테고리를 선택하세요...</option>
|
||||
<option value="IT">IT</option>
|
||||
<option value="NEWS">NEWS</option>
|
||||
<option value="ETC">ETC</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-margin">
|
||||
<label class="uk-form-label" for="contents">내용</label>
|
||||
<div class="uk-form-controls">
|
||||
<textarea class="summernote" id="contents" name="contents" required></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="uk-margin">
|
||||
<button type="submit" class="uk-button uk-button-default">글 작성</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
<script>
|
||||
$(document).ready(function () {
|
||||
$('.summernote').summernote({
|
||||
height: 300,
|
||||
callbacks: {
|
||||
onImageUpload: function (files) {
|
||||
var $editor = $(this);
|
||||
var data = new FormData();
|
||||
data.append("file", files[0]);
|
||||
$.ajax({
|
||||
url: "/upload_image",
|
||||
method: "POST",
|
||||
data: data,
|
||||
processData: false,
|
||||
contentType: false,
|
||||
success: function (response) {
|
||||
if (response.success) {
|
||||
var imageUrl = response.fileUrl;
|
||||
$editor.summernote("insertImage", imageUrl);
|
||||
} else {
|
||||
alert(response.message);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
Reference in New Issue
Block a user