summaryrefslogtreecommitdiff
path: root/app
diff options
context:
space:
mode:
Diffstat (limited to 'app')
-rw-r--r--app/routes.py31
-rw-r--r--app/static/styles/default.css46
-rw-r--r--app/static/styles/home.css8
-rw-r--r--app/static/styles/yes.css71
4 files changed, 116 insertions, 40 deletions
diff --git a/app/routes.py b/app/routes.py
index e520602..67b9359 100644
--- a/app/routes.py
+++ b/app/routes.py
@@ -16,6 +16,7 @@ Personal imports:
These are used to avoid cluttering this file with
placeholder data for posts' content.
"""
+from datetime import datetime
from flask import Flask, render_template, flash, redirect, url_for
from forms import RegistrationForm, LoginForm
from flask_sqlalchemy import SQLAlchemy
@@ -26,11 +27,37 @@ from placeholder_messages import messages
app = Flask(__name__)
app.config['SECRET_KEY'] = 'Scooby_Lu,_where_are_you?'
-app.config['SQLALCHEMY_DATABASE_URI'] = 'mariadb:///site.db'
-
+app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///site.db'
db = SQLAlchemy(app)
+class Alias(db.Model):
+ id = db.Column(db.Integer, primary_key=True)
+ username = db.Column(db.String(20), unique=True, nullable=False)
+ email = db.Column(db.String(120), unique=True, nullable=False)
+ image_file = db.Column(db.String(20),
+ nullable=False,
+ default='default.png')
+ password = db.Column(db.String(60), nullable=False)
+ posts = db.relationship('Post', backref='author', lazy=True)
+
+ def __repr__(self):
+ return f"Alias('{self.username}','{self.email}','{self.image_file}' )"
+
+
+class Post(db.Model):
+ id = db.Column(db.Integer, primary_key=True)
+ title = db.Column(db.String(100), nullable=False)
+ date_posted = db.Column(db.DateTime,
+ nullable=False,
+ default=datetime.utcnow)
+ content = db.Column(db.Text, nullable=False)
+ user_id = db.Column(db.Integer, db.ForeignKey('alias.id'), nullable=False)
+
+ def __repr__(self):
+ return f"Post('{self.title}', '{self.date_posted}')"
+
+
@app.route("/")
@app.route("/home")
def home():
diff --git a/app/static/styles/default.css b/app/static/styles/default.css
index 654b42f..3812189 100644
--- a/app/static/styles/default.css
+++ b/app/static/styles/default.css
@@ -2,16 +2,14 @@
--primary-color: #003B5C;
--secondary-color: #C3D7EE;
--home: rgba(200, 200, 200, 0.7);
- --yes: rgba(0, 255, 0, 0.7);
- --no: rgba(255, 0, 0, 0.7);
+ --yes: #5cff5c;
+ --no: #ff5c5c;
font-size: 18;
--fast-speed: 0.2s;
--med-speed: 0.4s;
--slow-speed: 1s;
}
-* {}
-
body {
font-family: 'Liberation Sans', sans-serif;
line-height: 1.2;
@@ -33,3 +31,43 @@ p {
margin-left: 1rem;
margin-right: 1rem;
}
+
+/* Animation on page load. */
+@keyframes fade-refresh {
+ 0% {
+ opacity: 0%;
+ }
+ 100% {
+ opacity: 100%;
+ }
+}
+
+@keyframes squeeze-refresh {
+ 0% {
+ width: 50%;
+ }
+ 100% {
+ /* opacity: 100%; */
+ width: 10%;
+ }
+}
+
+@keyframes home-refresh {
+ 0% {
+ transform: translateY(100%);
+ /* opacity: 0%; */
+ }
+ 100% {
+ transform: translateY(0);
+ /* opacity: 100%; */
+ }
+}
+
+@keyframes yes-refresh {
+ 0% {
+ transform: translateX(-100%);
+ }
+ 100% {
+ transform: translateX(0);
+ }
+}
diff --git a/app/static/styles/home.css b/app/static/styles/home.css
index f4ba121..290909f 100644
--- a/app/static/styles/home.css
+++ b/app/static/styles/home.css
@@ -5,6 +5,8 @@
position: absolute;
left: 0;
background: var(--yes);
+ animation-name: squeeze-refresh;
+ animation-duration: var(--med-speed);
}
.tab-yes:hover ~ .feed-post {
left: 6%;
@@ -17,6 +19,8 @@
position: absolute;
right: 0;
background: var(--no);
+ animation-name: squeeze-refresh;
+ animation-duration: var(--med-speed);
}
.tab-no:hover ~ .feed-post {
left: 0%;
@@ -37,6 +41,8 @@
flex-wrap: wrap;
overflow: auto;
justify-content: space-between;
+ animation-name: fade-refresh;
+ animation-duration: var(--slow-speed);
}
.post-wrapper {
@@ -91,7 +97,7 @@
.post-wrapper:hover > .btn-no {transform: rotateY(0deg);}
/* Dynamic content reajustment if browser window is made too narrow */
-@media (max-width: 800px) {
+@media (max-width: 900px) {
.feed-post {
display: inline;
}
diff --git a/app/static/styles/yes.css b/app/static/styles/yes.css
index fa6b917..bcaf7a4 100644
--- a/app/static/styles/yes.css
+++ b/app/static/styles/yes.css
@@ -1,51 +1,33 @@
/* Main page area. */
+:root {background: var(--yes);}
+
.main {
height: 100%;
position: relative;
z-index: 0;
overflow: hidden;
-}
-
-/* Feeds. */
-.feed-message {
- height: 100%;
- width: 25%;
- position: relative;
- float: left;
- overflow: auto;
-}
-.feed-news {
- height: 100%;
- width: 55%;
- display: flex;
- position: relative;
- float: left;
- flex-wrap: wrap;
- overflow: auto;
- justify-content: space-between;
-}
-.feed-ads {
- height: 100%;
- width: 20%;
- position: relative;
- float: right;
- overflow: auto;
+ /* animation-name: yes-refresh; */
+ /* animation-duration: var(--slow-speed); */
}
/* Tabs. */
.tab-no {
height: 100%;
width: 3%;
- float: right;
- position: relative;
+ position: absolute;
+ right: 0;
background: var(--no);
+ /* animation-name: yes-refresh; */
+ /* animation-duration: var(--slow-speed); */
}
.tab-home {
height: 100%;
width: 3%;
float: right;
- position: relative;
- background: var(--home);
+ position: absolute;
+ /* background: var(--home); */
+ /* animation-name: yes-refresh; */
+ animation-duration: var(--slow-speed);
}
.tab-home:hover {
width: 4%;
@@ -60,7 +42,15 @@
transition: 0.2s;
}
-/* Messages. */
+
+/* Feeds. */
+.feed-message {
+ height: 100%;
+ width: 25%;
+ position: relative;
+ float: left;
+ overflow: auto;
+}
.message {
background: white;
border-radius: 14px;
@@ -74,7 +64,16 @@
color: white;
}
-/* News. */
+.feed-news {
+ height: 100%;
+ width: 55%;
+ display: flex;
+ position: relative;
+ float: left;
+ flex-wrap: wrap;
+ overflow: auto;
+ justify-content: space-between;
+}
.news {
max-height: 10%;
max-width: 50%;
@@ -93,7 +92,13 @@
overflow: auto;
}
-/* Ads. */
+.feed-ads {
+ height: 100%;
+ width: 20%;
+ position: relative;
+ float: right;
+ overflow: auto;
+}
.ad {
background: white;
border-radius: 14px;
Copyright 2019--2024 Marius PETER