summaryrefslogtreecommitdiff
path: root/app
diff options
context:
space:
mode:
authorblendoit <blendoit@gmail.com>2020-01-25 09:53:18 -0800
committerblendoit <blendoit@gmail.com>2020-01-25 09:53:18 -0800
commit8a5b3a083ad9b3bd710d944e5c83ac08ead433e7 (patch)
treea8dc75ab9fa433f4c4b808ae570f0fd83280e3b9 /app
parent6056f5a2f5e00347c73e827e6f1f781d08d91799 (diff)
Placeholder content and CSS style sheets.
Diffstat (limited to 'app')
-rw-r--r--app/placeholder_messages.py19
-rw-r--r--app/placeholder_news.py81
-rw-r--r--app/placeholder_posts.py16
-rw-r--r--app/routes.py24
-rw-r--r--app/static/styles/home.css20
-rw-r--r--app/static/styles/no.css26
-rw-r--r--app/static/styles/yes.css18
-rw-r--r--app/templates/home.html14
-rw-r--r--app/templates/no.html13
-rw-r--r--app/templates/yes.html2
10 files changed, 189 insertions, 44 deletions
diff --git a/app/placeholder_messages.py b/app/placeholder_messages.py
index 4416106..6225859 100644
--- a/app/placeholder_messages.py
+++ b/app/placeholder_messages.py
@@ -17,4 +17,23 @@ messages = [{
'Dec. 26th, 2019',
'content':
"Ah, I'm creating a new website with a friend from college, how about you?"
+}, {
+ 'author': 'BChon',
+ 'date': 'Jan. 26th, 2019',
+ 'content': "yo wassap"
+}, {
+ 'author': 'Blendoit',
+ 'date': 'Dec. 26th, 2019',
+ 'content': "Ah why aren't you replying"
+}, {
+ 'author': 'vaqarsyed',
+ 'date': 'Jan. 14th, 2019',
+ 'content': "Hrr, another day on the grind #slatt"
+}, {
+ 'author':
+ 'christinafarhat',
+ 'date':
+ 'Dec. 26th, 2019',
+ 'content':
+ "I'm just using the first name that comes to mind at this point."
}]
diff --git a/app/placeholder_news.py b/app/placeholder_news.py
index a55f8c7..7b2d7fe 100644
--- a/app/placeholder_news.py
+++ b/app/placeholder_news.py
@@ -3,6 +3,33 @@ news = [{
'date': 'Dec. 26th, 2019',
'content': "Breaking news: the squad is in shambles."
}, {
+ 'author':
+ 'Blendoit',
+ 'date':
+ 'Dec. 25th, 2019',
+ 'content':
+ "Ah, this is a public personal update.\n It's pretty long, because this enables testing layouts that adapt to posts with a lot of content. Do we want the content to wrap around? Should we implement a content clipping feature?"
+}, {
+ 'author': 'Country_V',
+ 'date': 'Dec. 24th, 2019',
+ 'content': "This is a second public personal update."
+}, {
+ 'author': 'CNN',
+ 'date': 'Dec. 26th, 2019',
+ 'content': "Breaking news: the squad is in shambles."
+}, {
+ 'author': 'Blendoit',
+ 'date': 'Dec. 25th, 2019',
+ 'content': "Ah, this is a public personal update."
+}, {
+ 'author': 'Country_V',
+ 'date': 'Dec. 24th, 2019',
+ 'content': "This is a second public personal update."
+}, {
+ 'author': 'CNN',
+ 'date': 'Dec. 26th, 2019',
+ 'content': "Breaking news: the squad is in shambles."
+}, {
'author': 'Blendoit',
'date': 'Dec. 25th, 2019',
'content': "Ah, this is a public personal update."
@@ -15,6 +42,60 @@ news = [{
'date': 'Dec. 26th, 2019',
'content': "Breaking news: the squad is in shambles."
}, {
+ 'author':
+ 'Blendoit',
+ 'date':
+ 'Dec. 25th, 2019',
+ 'content':
+ "Ah, this is a public personal update.\n It's pretty long, because this enables testing layouts that adapt to posts with a lot of content. Do we want the content to wrap around? Should we implement a content clipping feature?"
+}, {
+ 'author': 'CNN',
+ 'date': 'Dec. 26th, 2019',
+ 'content': "Breaking news: the squad is in shambles."
+}, {
+ 'author':
+ 'Blendoit',
+ 'date':
+ 'Dec. 25th, 2019',
+ 'content':
+ "Ah, this is a public personal update.\n It's pretty long, because this enables testing layouts that adapt to posts with a lot of content. Do we want the content to wrap around? Should we implement a content clipping feature?"
+}, {
+ 'author': 'Country_V',
+ 'date': 'Dec. 24th, 2019',
+ 'content': "This is a second public personal update."
+}, {
+ 'author': 'CNN',
+ 'date': 'Dec. 26th, 2019',
+ 'content': "Breaking news: the squad is in shambles."
+}, {
+ 'author': 'Blendoit',
+ 'date': 'Dec. 25th, 2019',
+ 'content': "Ah, this is a public personal update."
+}, {
+ 'author': 'Country_V',
+ 'date': 'Dec. 24th, 2019',
+ 'content': "This is a second public personal update."
+}, {
+ 'author': 'CNN',
+ 'date': 'Dec. 26th, 2019',
+ 'content': "Breaking news: the squad is in shambles."
+}, {
+ 'author': 'Blendoit',
+ 'date': 'Dec. 25th, 2019',
+ 'content': "Ah, this is a public personal update."
+}, {
+ 'author': 'Country_V',
+ 'date': 'Dec. 24th, 2019',
+ 'content': "This is a second public personal update."
+}, {
+ 'author': 'Country_V',
+ 'date': 'Dec. 24th, 2019',
+ 'content': "This is a second public personal update."
+}, {
+ 'author': 'CNN',
+ 'date': 'Dec. 26th, 2019',
+ 'content': "Breaking news: the squad is in shambles."
+}, {
'author': 'Blendoit',
'date': 'Dec. 25th, 2019',
'content': "Ah, this is a public personal update."
diff --git a/app/placeholder_posts.py b/app/placeholder_posts.py
new file mode 100644
index 0000000..9e9c25c
--- /dev/null
+++ b/app/placeholder_posts.py
@@ -0,0 +1,16 @@
+posts = [{
+ 'author':
+ 'Marius',
+ 'date':
+ 'Dec. 26th, 2019',
+ 'content':
+ "this is a test where I write a message that isn't too short, it isn't too long, it's just the right size."
+}, {
+ 'author': 'Achille',
+ 'date': 'Dec. 25th, 2019',
+ 'content': "this is a second test!"
+}, {
+ 'author': 'Jeanne',
+ 'date': 'Dec. 24th, 2019',
+ 'content': "this is a third test!"
+}] \ No newline at end of file
diff --git a/app/routes.py b/app/routes.py
index 7152edd..4604827 100644
--- a/app/routes.py
+++ b/app/routes.py
@@ -1,33 +1,18 @@
from flask import Flask, render_template, flash, redirect, url_for
from forms import RegistrationForm, LoginForm
+from placeholder_posts import posts
from placeholder_news import news
from placeholder_messages import messages
app = Flask(__name__)
app.config['SECRET_KEY'] = 'foobarblendoitfoobar!'
-posts = [{
- 'author':
- 'Marius',
- 'date':
- 'Dec. 26th, 2019',
- 'content':
- "this is a test where I write a message that isn't too short, it isn't too long, it's just the right size."
-}, {
- 'author': 'Achille',
- 'date': 'Dec. 25th, 2019',
- 'content': "this is a second test!"
-}, {
- 'author': 'Jeanne',
- 'date': 'Dec. 24th, 2019',
- 'content': "this is a third test!"
-}]
-
@app.route("/")
@app.route("/home")
def home():
- return render_template('home.html', posts=posts)
+ home_posts = posts + news + messages
+ return render_template('home.html', posts=home_posts)
@app.route("/yes")
@@ -37,7 +22,8 @@ def yes():
@app.route("/no")
def no():
- return render_template("no.html")
+ archives = posts + news + messages
+ return render_template("no.html", archive=archives)
@app.route("/register", methods=['GET', 'POST'])
diff --git a/app/static/styles/home.css b/app/static/styles/home.css
index e2617bd..c875893 100644
--- a/app/static/styles/home.css
+++ b/app/static/styles/home.css
@@ -1,9 +1,20 @@
.main {
height: 100%;
position: absolute;
- z-index: 1;
+ z-index: 0;
left: 3%;
right: 3%;
+ overflow: hidden;
+}
+
+.feed-post {
+ height: 100%;
+ padding: 1px;
+ display: flex;
+ position: relative;
+ flex-wrap: wrap;
+ overflow: auto;
+ justify-content: space-around;
}
.tab-yes {
@@ -11,7 +22,6 @@
width: 3%;
float: left;
position: fixed;
- z-index: -1;
left: 0;
background: var(--yes);
}
@@ -20,7 +30,6 @@
width: 3%;
float: right;
position: fixed;
- z-index: -1;
right: 0;
background: var(--no);
}
@@ -46,11 +55,13 @@
}
.post {
+ max-height: 20%;
+ max-width: 30%;
background: white;
border-radius: 14px;
padding: 1rem;
margin: 1rem;
- width: 20%;
+ overflow: hidden;
}
.post:hover {
@@ -58,4 +69,5 @@
cursor: pointer;
transition: 0.8s;
color: white;
+ overflow: auto;
}
diff --git a/app/static/styles/no.css b/app/static/styles/no.css
index 352a635..4673cf3 100644
--- a/app/static/styles/no.css
+++ b/app/static/styles/no.css
@@ -1,8 +1,9 @@
.main {
height: 100%;
- position: absolute;
- z-index: 1;
+ position: fixed;
+ z-index: 0;
left: 7%;
+ overflow: auto;
}
.tab-yes {
@@ -48,10 +49,25 @@
transition: 0.2s;
}
-.post {
+/* Archive. */
+.feed-archive {
+ width: 100%;
+ display: flex;
+ position: relative;
+ flex-wrap: wrap;
+ justify-content: space-around;
+}
+
+.archive {
background: white;
+ position: relative;
border-radius: 14px;
padding: 1rem;
- margin: 1rem;
- width: 20%;
+ margin: 0.5rem;
+}
+.archive:hover {
+ background: linear-gradient(to left, var(--no) 50%, var(--yes) 50%);
+ cursor: pointer;
+ transition: 0.8s;
+ color: white;
}
diff --git a/app/static/styles/yes.css b/app/static/styles/yes.css
index 3e8e614..fa6b917 100644
--- a/app/static/styles/yes.css
+++ b/app/static/styles/yes.css
@@ -1,4 +1,4 @@
-/* Main page components. */
+/* Main page area. */
.main {
height: 100%;
position: relative;
@@ -9,23 +9,26 @@
/* Feeds. */
.feed-message {
height: 100%;
- width: 30%;
+ width: 25%;
position: relative;
float: left;
overflow: auto;
}
-.feed-post {
+.feed-news {
height: 100%;
- width: 30%;
+ 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: left;
+ float: right;
overflow: auto;
}
@@ -73,16 +76,21 @@
/* News. */
.news {
+ max-height: 10%;
+ max-width: 50%;
background: white;
+ position: relative;
border-radius: 14px;
padding: 1rem;
margin: 0.5rem;
+ overflow: hidden;
}
.news:hover {
background: linear-gradient(to left, var(--no) 50%, var(--yes) 50%);
cursor: pointer;
transition: 0.8s;
color: white;
+ overflow: auto;
}
/* Ads. */
diff --git a/app/templates/home.html b/app/templates/home.html
index 6205c03..9d77add 100644
--- a/app/templates/home.html
+++ b/app/templates/home.html
@@ -9,13 +9,15 @@
<a href="{{ url_for('no') }}" class="tab-no"></a>
<div class="main">
- {% for post in posts %}
- <div class="post">
- <h1>{{post.author}}</h1>
- <h2>{{post.date}}</h2>
- <p>{{post.content}}</p>
+ <div class="feed-post">
+ {% for post in posts %}
+ <div class="post">
+ <h1>{{post.author}}</h1>
+ <h2>{{post.date}}</h2>
+ <p>{{post.content}}</p>
+ </div>
+ {% endfor %}
</div>
- {% endfor %}
</div>
</div>
diff --git a/app/templates/no.html b/app/templates/no.html
index 5bb7a0f..f7a2d53 100644
--- a/app/templates/no.html
+++ b/app/templates/no.html
@@ -9,11 +9,16 @@
<a href="{{ url_for('home') }}" class="tab-home"></a>
<div class="main">
- <p>
- Tell me, no
- </p>
+ <div class="feed-archive">
+ {% for archive in archive %}
+ <div class="archive">
+ <h1>{{archive.author}}</h1>
+ <h2>{{archive.date}}</h2>
+ <p>{{archive.content}}</p>
+ </div>
+ {% endfor %}
+ </div>
</div>
</div>
-
{% endblock content %}
diff --git a/app/templates/yes.html b/app/templates/yes.html
index 00a330d..3ccc24b 100644
--- a/app/templates/yes.html
+++ b/app/templates/yes.html
@@ -20,7 +20,7 @@
{% endfor %}
</div>
- <div class="feed-post">
+ <div class="feed-news">
{% for news in news %}
<div class="news">
<h1>{{news.author}}</h1>
Copyright 2019--2024 Marius PETER