Skip to content

Commit 08d88d0

Browse files
asimonson1125asimonson1125
committed
style game cards and added socials
1 parent 352d7e9 commit 08d88d0

File tree

8 files changed

+233
-90
lines changed

8 files changed

+233
-90
lines changed

‎src/app.py‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@ def getgame(id):
3333
break
3434
else:
3535
flask.render_template('404.html')
36-
return flask.render_template('game.html', game=i, gamelist=games)
36+
return flask.render_template('game.html', game=games[i])
3737

3838
@app.route('/upload_game', methods = ['POST'])
3939
@login_required
@@ -84,6 +84,7 @@ def page404(e):
8484
eCode = 500
8585
message = "An unknown error occured!"
8686
try:
87+
app.log_exception(e)
8788
message = e.description
8889
eCode = e.code
8990
finally:

‎src/static/css/devcade.css‎

Lines changed: 51 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -222,6 +222,10 @@ img.header {
222222
justify-content: center;
223223
}
224224

225+
.card, .game-card {
226+
margin: 0.5em auto;
227+
}
228+
225229
.card {
226230
padding: 1.875em;
227231
background-color: #340526;
@@ -232,7 +236,51 @@ img.header {
232236
border: 0 solid transparent;
233237
border-radius: .25rem;
234238
width: min(90%, 24em);
235-
margin: 0.5em auto;
239+
}
240+
241+
#upload-card textarea{
242+
width: 100%;
243+
}
244+
245+
.game-card {
246+
display: grid;
247+
grid-template-columns: 20% 80%;
248+
grid-template-rows: 1fr 1fr;
249+
grid-template-areas: "icon name""icon desc";
250+
width: min(90vw, 25em);
251+
height: 200px;
252+
padding: 0.5em 5px;
253+
border-radius: 10px;
254+
}
255+
256+
.game-icon {
257+
grid-area: icon;
258+
width: 80%;
259+
border-radius: 10px;
260+
margin: auto;
261+
border-radius: 10px;
262+
}
263+
264+
.game-name {
265+
grid-area: name;
266+
}
267+
268+
.game-name * {
269+
margin: 0;
270+
}
271+
272+
.game-desc {
273+
grid-area: desc;
274+
font-size: 0.7em;
275+
font-family: "Rubik Medium", Rubik, Roboto, sans-serif;
276+
color: var(--fg);
277+
font-weight: 500;
278+
text-decoration: none !important;
279+
}
280+
281+
.game-desc>div, .game-name>div {
282+
/* display: inline-block; */
283+
background: rgba(44, 44, 44, 0.5);
236284
}
237285

238286
.subcontent {
@@ -327,7 +375,7 @@ a:hover {
327375
width: min(100%, 600px);
328376
}
329377

330-
#feet-quote{
378+
#feet-quote {
331379
padding: 0;
332380
padding-bottom: 5px;
333381
}
@@ -351,7 +399,7 @@ a:hover {
351399
display: none;
352400
}
353401

354-
.card {
402+
.card, .game-card {
355403
margin: 0.5em;
356404
}
357405

‎src/static/icons/csh_logo_square.svg‎

Lines changed: 10 additions & 0 deletions
Loading

‎src/static/icons/twitter.svg‎

Lines changed: 49 additions & 0 deletions
Loading

‎src/templates/catalog.html‎

Lines changed: 1 addition & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -2,16 +2,7 @@
22
block content %}
33
<div class="card-wrapper">
44
{% for i in range(0,gamelist|length) %}
5-
<div class="card">
6-
<a href="/game/{{ gamelist[i].id }}">
7-
<h2>{{ gamelist[i].name }}</h2>
8-
<p>{{ gamelist[i].author }}</p>
9-
<img
10-
class="max"
11-
src="{{ gamelist[i].iconLink }}"
12-
/>
13-
</a>
14-
</div>
5+
{{ gamecard(gamelist[i]) }}
156

167
{% endfor %}
178
</div>

‎src/templates/game.html‎

Lines changed: 5 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,9 @@
1-
{% extends "header.html" %} {% block title %}Devcade - {{gamelist[game].name}}
1+
{% extends "header.html" %} {% block title %}Devcade - {{game.name}}
22
{%endblock %} {% block content %}
3-
<h1>{{ gamelist[game].name }}</h1>
4-
<p>{{ gamelist[game].author }}</p>
5-
<img class="max" src="{{ gamelist[game].bannerLink }}" />
6-
<p>{{ gamelist[game].description }}</p>
7-
{% if current_user.admin %}
3+
<div class="card-wrapper">{{ gamecard(game) }}</div>
4+
{% if current_user.admin or current_user.id == game.author %}
85
<div class="card-wrapper">
9-
<a href='/admin/delete/{{ gamelist[game].id }}'><div class="btn btn-red">Delete</div></a>
10-
<div class="btn btn-red">More Admin Stuff...</div>
6+
<a class="btn btn-red" href="/edit/{{ game.id }}">Edit</a>
7+
<a class="btn btn-red" href="/admin/delete/{{ game.id }}">Delete</a>
118
</div>
129
{% endif %} {% endblock %}

‎src/templates/header.html‎

Lines changed: 59 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,17 @@
1-
{% block header %}
1+
{% macro gamecard(game) %}
2+
<a href="/game/{{ game.id }}">
3+
<div class="game-card" style="background-image: url({{ game.bannerLink }})">
4+
<img class="game-icon" src="{{ game.iconLink }}" />
5+
<div class="game-name">
6+
<div>
7+
<h2>{{ game.name }}</h2>
8+
<h3>{{ game.author }}</h3>
9+
</div>
10+
</div>
11+
<div class="game-desc"><div>{{ game.description }}</div></div>
12+
</div>
13+
</a>
14+
{% endmacro %} {% block header %}
215
<!DOCTYPE html>
316
<html lang="en">
417
<head>
@@ -13,7 +26,10 @@
1326
rel="shortcut icon"
1427
href="{{ url_for('static', filename='favicon.ico') }}"
1528
/>
16-
<script src="{{ url_for('static', filename='js/responsive.js') }}" type="text/javascript"></script>
29+
<script
30+
src="{{ url_for('static', filename='js/responsive.js') }}"
31+
type="text/javascript"
32+
></script>
1733
<title>{% block title %}Devcade{% endblock %}</title>
1834
</head>
1935
<body onload="dropdown_init()">
@@ -28,26 +44,29 @@ <h1>Devcade</h1>
2844
</a>
2945

3046
<div class="dropdown-toggle">
31-
<img src="{{ url_for('static', filename='icons/picklist.svg') }}" class="navbar-toggler-icon"></img>
47+
<img
48+
src="{{ url_for('static', filename='icons/picklist.svg') }}"
49+
class="navbar-toggler-icon"
50+
/>
3251
</div>
3352

3453
<div id="nav" class="dropped hidden">
3554
<div class="item"><a href="/">Home</a></div>
36-
<div class="item"><a href="/about">About</a></div>
55+
<!-- <div class="item"><a href="/about">About</a></div> -->
3756
<div class="item"><a href="/catalog">Catalog</a></div>
3857
{% if current_user.is_authenticated %}
3958
<div class="item"><a href="/upload">Upload</a></div>
4059
<div class="item" id="account">
4160
<div class="dropdown-toggle" href="#" id="user01">
4261
<img class="navUser" src="{{ current_user.picture }}" id="pfp" />
43-
<div id="uname">{{ current_user.firstname }} {{ current_user.lastname }}</div>
62+
<div id="uname">
63+
{{ current_user.firstname }} {{ current_user.lastname }}
64+
</div>
4465
<span class="caret"></span>
4566
</div>
4667
<div class="dropdown-menu dropped hidden">
4768
<!-- <div class="dropdown-divider"></div> -->
48-
<a class="dropdown-item" href="/user"
49-
>User Profile</a
50-
>
69+
<a class="dropdown-item" href="/user">User Profile</a>
5170
<a class="dropdown-item" href="/logout">Logout</a>
5271
</div>
5372
</div>
@@ -84,25 +103,43 @@ <h1>{% block headertext %}{%endblock%}</h1>
84103
<!-- <div id="spaceholder"><h1>L</h1></div> -->
85104
<div id="content">{% block content %}{% endblock %}</div>
86105
<div id="feet">
87-
<div class="feet-flex">
106+
<div class="feet-flex" id="feet-quote">
88107
<p>"For developers, by developers"</p>
89108
</div>
90109
<div class="feet-flex">
91-
<a href="https://github.com/topics/devcade?q=org%3AComputerScienceHouse">
92-
<div class="social">
93-
<img
94-
alt="github"
95-
src="{{ url_for('static', filename='icons/github.svg') }}"
96-
/>
97-
</div>
110+
<a href="https://csh.rit.edu">
111+
<div class="social">
112+
<img
113+
alt="CSH"
114+
src="{{ url_for('static', filename='icons/csh_logo_square.svg') }}"
115+
/>
116+
</div>
117+
</a>
118+
<a
119+
href="https://github.com/topics/devcade?q=org%3AComputerScienceHouse"
120+
>
121+
<div class="social">
122+
<img
123+
alt="github"
124+
src="{{ url_for('static', filename='icons/github.svg') }}"
125+
/>
126+
</div>
98127
</a>
99128
<a href="https://instagram.com/ComputerScienceHouse">
100-
<div class="social">
101-
<img
102-
alt="instagram"
103-
src="{{ url_for('static', filename='icons/instagram.svg') }}"
104-
/>
105-
</div>
129+
<div class="social">
130+
<img
131+
alt="instagram"
132+
src="{{ url_for('static', filename='icons/instagram.svg') }}"
133+
/>
134+
</div>
135+
</a>
136+
<a href="https://twitter.com/RITCSH/">
137+
<div class="social">
138+
<img
139+
alt="twitter"
140+
src="{{ url_for('static', filename='icons/twitter.svg') }}"
141+
/>
142+
</div>
106143
</a>
107144
</div>
108145
</div>

0 commit comments

Comments
 (0)