mirror of
https://github.com/tjsga/studyguides.git
synced 2025-04-05 03:40:16 -04:00
Updated the frontend for the website
This commit is contained in:
Michael Fatemi
parent
fb50639ef9
commit
972d79e40d
|
|
@ -2,13 +2,27 @@
|
||||||
* {
|
* {
|
||||||
-webkit-font-smoothing: antialiased;
|
-webkit-font-smoothing: antialiased;
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
|
box-sizing: border-box;
|
||||||
|
-moz-box-sizing: border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "Josefin Sans";
|
||||||
|
src: url("/static/josefin-sans-regular.ttf");
|
||||||
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: "Sofia Pro";
|
||||||
|
src: url("/static/sofia-pro-regular.otf");
|
||||||
}
|
}
|
||||||
|
|
||||||
html,
|
html,
|
||||||
body {
|
body {
|
||||||
font-family: "Red Hat Text", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
|
font-family: "Sofia Pro", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
|
||||||
background-color: #fffbfb;
|
/* background-color: #fffbfb; */
|
||||||
color: #090302;
|
background-color: #221f3d;
|
||||||
|
/* color: #090302; */
|
||||||
|
color: #eee;
|
||||||
font-size: 1.2em;
|
font-size: 1.2em;
|
||||||
}
|
}
|
||||||
a,
|
a,
|
||||||
|
|
@ -22,11 +36,8 @@ a:hover {
|
||||||
}
|
}
|
||||||
|
|
||||||
main {
|
main {
|
||||||
margin: 30px;
|
width: max(1000px, 50vw);
|
||||||
}
|
margin: 30px auto;
|
||||||
|
|
||||||
.item {
|
|
||||||
color: #568ea3;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.teacher {
|
.teacher {
|
||||||
|
|
@ -34,10 +45,142 @@ main {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
h1 {
|
.hoverable {
|
||||||
opacity: 0.5;
|
opacity: 0.5;
|
||||||
transition: all 0.2s ease;
|
transition: all 0.2s ease;
|
||||||
}
|
}
|
||||||
h1:hover {
|
.hoverable:hover {
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.bold {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.josefin-sans {
|
||||||
|
font-family: "Josefin Sans";
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-center {
|
||||||
|
display: block;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sofia-pro {
|
||||||
|
font-family: "Sofia Pro";
|
||||||
|
}
|
||||||
|
|
||||||
|
.size-075 {
|
||||||
|
font-size: 0.75em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.size-1 {
|
||||||
|
font-size: 1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.size-2 {
|
||||||
|
font-size: 1.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.size-3 {
|
||||||
|
font-size: 2em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.size-4 {
|
||||||
|
font-size: 4em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-1 {
|
||||||
|
margin-top: 5px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.my-2 {
|
||||||
|
margin-top: 10px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mx-auto {
|
||||||
|
margin-left: auto;
|
||||||
|
margin-right: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.m-2 {
|
||||||
|
margin: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.p-2 {
|
||||||
|
padding: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex-row {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex-col {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
.space-between {
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
|
||||||
|
.align-center {
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
div.subject-grid {
|
||||||
|
display: grid;
|
||||||
|
/* grid-template-columns: 1fr 1fr 1fr; */
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Styles for groups within a subject */
|
||||||
|
div.subject {
|
||||||
|
border-radius: 10px;
|
||||||
|
margin: 5px;
|
||||||
|
padding: 10px;
|
||||||
|
/* width: 400px; */
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
div.guide {
|
||||||
|
/* color: #568ea3; */
|
||||||
|
border-radius: 10px;
|
||||||
|
margin: 5px;
|
||||||
|
padding: 10px;
|
||||||
|
color: #eee;
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.lighter {
|
||||||
|
background-color: rgba(255, 255, 255, 0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.round {
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.subject-name {
|
||||||
|
text-align: center;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.open-guide-button {
|
||||||
|
padding: 3px;
|
||||||
|
border-radius: 5px;
|
||||||
|
background-color: white;
|
||||||
|
color: #707070;
|
||||||
|
}
|
||||||
|
|
||||||
|
a.tag {
|
||||||
|
padding: 5px;
|
||||||
|
border-radius: 1em;
|
||||||
|
border: 2px solid white;
|
||||||
|
margin: 0px 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
|
||||||
BIN
studyguides/static/josefin-sans-regular.ttf
Normal file
BIN
studyguides/static/josefin-sans-regular.ttf
Normal file
Binary file not shown.
|
|
@ -37,7 +37,6 @@
|
||||||
.login-box {
|
.login-box {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
border: 1px solid rgb(24, 82, 103);
|
|
||||||
margin: 15px auto;
|
margin: 15px auto;
|
||||||
max-width: 438px;
|
max-width: 438px;
|
||||||
}
|
}
|
||||||
BIN
studyguides/static/sofia-pro-regular.otf
Normal file
BIN
studyguides/static/sofia-pro-regular.otf
Normal file
Binary file not shown.
|
|
@ -23,6 +23,16 @@
|
||||||
{% block head %}{% endblock %}
|
{% block head %}{% endblock %}
|
||||||
</head>
|
</head>
|
||||||
<body id="page">
|
<body id="page">
|
||||||
{% block main %}{% endblock %}
|
<span class="bold size-4 my-2 josefin-sans text-center">
|
||||||
|
TJHSST Study Guide Collection
|
||||||
|
</span>
|
||||||
|
<main>
|
||||||
|
{% block disclaimer %}{% endblock %}
|
||||||
|
|
||||||
|
<div class="my-2">
|
||||||
|
{% block path %}{% endblock %}
|
||||||
|
</div>
|
||||||
|
{% block content %}{% endblock %}
|
||||||
|
</main>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,40 @@
|
||||||
{% extends "base.html" %} {% load static %} {% block main %}
|
{% extends "base.html" %} {% load static %}
|
||||||
<main>
|
{% block path %}
|
||||||
<h1><a href="/">All</a> / <a href="{% url 'courses:subject_view' subject.url %}">{{subject.name}}</a> / <a href="{% url 'courses:course_view' subject.url course.url %}">{{course.name}}</a></h1>
|
<span class="bold size-2 hoverable">
|
||||||
{% for guide, tags in guides %}
|
<a href="/">
|
||||||
<p class="item"><b><a href="{{ guide.url }}">{{ guide.name }}</a></b> {% for t in tags %}<a href='{% url "courses:tag" t.name %}'>{{ t }} </a>{% endfor %}</p>
|
All
|
||||||
{% endfor %}
|
</a> /
|
||||||
</main>
|
<a href="{% url 'courses:subject_view' subject.url %}">
|
||||||
|
{{subject.name}}
|
||||||
|
</a> /
|
||||||
|
<a href="{% url 'courses:course_view' subject.url course.url %}">
|
||||||
|
{{course.name}}
|
||||||
|
</a>
|
||||||
|
</span>
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
|
{% block content %}
|
||||||
|
{% if guides %}
|
||||||
|
{% for guide, tags in guides %}
|
||||||
|
<div class="guide">
|
||||||
|
<div class="flex-row align-center space-between bold size-3">
|
||||||
|
<a
|
||||||
|
href="{{ guide.url }}"
|
||||||
|
target="_blank">
|
||||||
|
📰 {{ guide.name }}
|
||||||
|
</a>
|
||||||
|
</div><br/>
|
||||||
|
|
||||||
|
<span class="size-075">
|
||||||
|
{% for t in tags %}
|
||||||
|
<a href='{% url "courses:tag" t.name %}'>
|
||||||
|
{{ t }}
|
||||||
|
</a>
|
||||||
|
{% endfor %}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
{% else %}
|
||||||
|
<b>No guides are uploaded yet for this course.</b>
|
||||||
|
{% endif %}
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
||||||
|
|
@ -1,17 +1,31 @@
|
||||||
{% extends "base.html" %} {% load static %} {% block main %}
|
{% extends "base.html" %} {% load static %}
|
||||||
<main>
|
{% block disclaimer %}
|
||||||
<p>DISCLAIMER: Please note these materials are student-made study guides over the past years. Some information may be outdated or not 100% reflective of the content your teacher is teaching. It is also possible the information is not 100% accurate. Therefore, make sure to not solely rely on these study guides. If you see an inconsistency in a study guide that confuses you, ask your teacher to clarify. SGA maintains this site but is not liable for the credibility of the information found. To contact SGA, please email SGA.tjhsst@gmail.com.</p>
|
<p>
|
||||||
|
DISCLAIMER: Please note these materials are student-made study guides over the past years. Some information may be outdated or not 100% reflective of the content your teacher is teaching. It is also possible the information is not 100% accurate. Therefore, make sure to not solely rely on these study guides. If you see an inconsistency in a study guide that confuses you, ask your teacher to clarify. SGA maintains this site but is not liable for the credibility of the information found. To contact SGA, please email SGA.tjhsst@gmail.com.
|
||||||
<br>
|
</p>
|
||||||
|
{% endblock %}
|
||||||
<h1><a href="/">All</a></h1>
|
|
||||||
|
{% block path %}
|
||||||
{% for subject, courses in subjects %}
|
<a href="/" class="bold size-2 hoverable">All</a>
|
||||||
<a href="{% url 'courses:subject_view' subject.url %}"><h2>{{ subject.name }}</h2>
|
{% endblock %}
|
||||||
|
|
||||||
{% for course in courses %}
|
{% block content %}
|
||||||
<p class="item"><a href="{% url 'courses:course_view' subject.url course.url %}">{{ course.name }}</a></p>
|
<div class="flex-col">
|
||||||
|
{% for subject, courses in subjects %}
|
||||||
{% endfor %} {% endfor %}
|
<div class="subject">
|
||||||
</main>
|
<a
|
||||||
|
href="{% url 'courses:subject_view' subject.url %}"
|
||||||
|
class="bold size-3">
|
||||||
|
📚 {{ subject.name }}
|
||||||
|
</a>
|
||||||
|
<!-- {% for course in courses %}
|
||||||
|
<p class="item">
|
||||||
|
<a href="{% url 'courses:course_view' subject.url course.url %}">
|
||||||
|
{{ course.name }}
|
||||||
|
</a>
|
||||||
|
</p>
|
||||||
|
{% endfor %} -->
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
||||||
|
|
@ -6,12 +6,12 @@
|
||||||
<link rel='stylesheet' href="{% static 'login.css' %}">
|
<link rel='stylesheet' href="{% static 'login.css' %}">
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block main %}
|
{% block content %}
|
||||||
<main>
|
<div class='round lighter my-2 mx-auto p-2'>
|
||||||
<h1 class='header_title'>Study Guides</h1>
|
<span>
|
||||||
<div class='login-box'>
|
<b>Login in with your Intranet account</b>
|
||||||
<p><b>Login in with your Intranet account</b> to access the Study Guide website.</p>
|
to access the Study Guide website.
|
||||||
<a href="{% url 'social:begin' 'ion' %}{% if request.GET.next %}?next={{ request.GET.next|urlencode }}{% endif %}" class='btn btn-ion'>Log in with Ion</a>
|
</span><br/>
|
||||||
</div>
|
<a href="{% url 'social:begin' 'ion' %}{% if request.GET.next %}?next={{ request.GET.next|urlencode }}{% endif %}" class='btn btn-ion'>Log in with Ion</a>
|
||||||
</main>
|
</div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
@ -1,8 +1,25 @@
|
||||||
{% extends "base.html" %} {% load static %} {% block main %}
|
{% extends "base.html" %} {% load static %}
|
||||||
<main>
|
{% block path %}
|
||||||
<h1><a href="{% url 'home:index' %}">All</a> / <a href="{% url 'courses:subject_view' subject.url %}">{{subject.name}}</a></h1>
|
<span class="bold size-2 hoverable">
|
||||||
{% for course in courses %}
|
<a href="{% url 'home:index' %}">
|
||||||
<p class="item"><a href="{% url 'courses:course_view' subject.url course.url %}">{{ course.name }}</a></p>
|
All
|
||||||
{% endfor %}
|
</a> /
|
||||||
</main>
|
<a href="{% url 'courses:subject_view' subject.url %}">
|
||||||
|
{{subject.name}}
|
||||||
|
</a>
|
||||||
|
</span>
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
|
{% block content %}
|
||||||
|
<div class="flex-col">
|
||||||
|
{% for course in courses %}
|
||||||
|
<div class="subject">
|
||||||
|
<a
|
||||||
|
href="{% url 'courses:course_view' subject.url course.url %}"
|
||||||
|
class="bold size-3">
|
||||||
|
📖 {{ course.name }}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
|
</div>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
|
||||||
|
|
@ -2,13 +2,36 @@
|
||||||
|
|
||||||
{% load static %}
|
{% load static %}
|
||||||
|
|
||||||
{% block main %}
|
{% block path %}
|
||||||
<main>
|
<span class="bold size-2 hoverable">
|
||||||
<h1><a href="/">All</a> / {{ tag }}</h1>
|
<a href="/">
|
||||||
{% for guide, tags in guides %}
|
All
|
||||||
<p class="item">
|
</a> /
|
||||||
<b><a href="{{ guide.url }}">{{ guide.name }}</a></b> {% for t in tags %}<a href='{% url "courses:tag" t.name %}'>{{ t }} </a>{% endfor %}
|
<a href='{% url "courses:tag" tag.name %}'>
|
||||||
</p>
|
{{ tag }}
|
||||||
{% endfor %}
|
</a>
|
||||||
|
</span>
|
||||||
|
{% endblock %}
|
||||||
|
|
||||||
|
{% block content %}
|
||||||
|
{% for guide, tags in guides %}
|
||||||
|
<div class="guide">
|
||||||
|
<div class="flex-row align-center space-between bold size-3">
|
||||||
|
<a
|
||||||
|
href="{{ guide.url }}"
|
||||||
|
target="_blank">
|
||||||
|
📰 {{ guide.name }}
|
||||||
|
</a>
|
||||||
|
</div><br/>
|
||||||
|
|
||||||
|
<span class="size-075">
|
||||||
|
{% for t in tags %}
|
||||||
|
<a href='{% url "courses:tag" t.name %}'>
|
||||||
|
{{ t }}
|
||||||
|
</a>
|
||||||
|
{% endfor %}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
{% endfor %}
|
||||||
</main>
|
</main>
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
Loading…
Reference in New Issue
Block a user