Styles Cleanup

This commit is contained in:
Praneeth Bhandaru 2020-10-20 16:57:12 -04:00
parent ff29d47eef
commit 58a60fbdb7
5 changed files with 8 additions and 665 deletions

View File

@ -2,6 +2,6 @@ from django.urls import path
from . import views
urlpatterns = [
path('', views.test, name='notes'),
path('', views.meeting_overview, name='notes'),
path('meeting/<str:meeting_id>/', views.show_meeting, name='show_meetings'),
]

View File

@ -4,7 +4,7 @@ from django.conf import settings
# Create your views here.
def test(request):
def meeting_overview(request):
html = ''
page = NotionPage.objects.get(url=settings.NOTION_URL).page
@ -17,9 +17,7 @@ def test(request):
for meeting in meeting_block.get_rows():
html += f'<h4><a href="/notes/meeting/{meeting.id}">{meeting.title}</a></h4>'
html += '<hr>'
return render(request, 'notes/test.html', {'html': html})
return render(request, 'notes/notes.html', {'html': html})
def has_children(block):

View File

@ -27,186 +27,10 @@ body {
color: #444;
}
.seperate {
display: flex;
justify-content: space-between;
}
.seperate i {
margin-left: 10px;
font-size: 22px;
color: #AAA;
}
.seperate i:hover {
color: #444;
}
.submenu {
display: none;
float: left;
text-align: left;
font-size: 12px;
flex-wrap: wrap;
margin: 0px;
margin-top: 5px;
position: absolute;
background-color: #FFF;
box-shadow: 2px 2px 10px #AAA;
-moz-box-shadow: 2px 2px 10px #AAA;
-webkit-box-shadow: 2px 2px 10px #AAA;
}
.submenu ul {
list-style-image: none;
list-style-type: none;
display: flex;
flex-direction: column;
margin: 0px;
padding: 5px;
padding-top: 10px;
padding-bottom: 10px;
}
@media only screen and (max-width: 800px) {
.submenu ul {
padding-top: 5px;
padding-bottom: 5px;
}
}
.submenu ul li {
padding-top: 3px;
padding-bottom: 3px;
}
.submenu ul li a {
padding: 6px;
text-decoration: none;
color: #444;
font-family: "Montserrat", "Helvetica", "Arial", sans-serif;
text-transform: uppercase;
letter-spacing: 1.2px;
line-height: 14.4px;
font-weight: 400;
}
@media only screen and (max-width: 800px) {
.submenu ul li a {
margin: 2px;
padding: 0px;
}
}
.submenu ul li:hover > a {
color: #38A3BD;
}
@media only screen and (max-width: 640px) {
.submenu {
display: none;
}
}
.hero-image {
height: 480px;
z-index: 1;
background-color: #AAA;
overflow: hidden;
display: flex;
align-items: flex-end;
justify-content: center;
}
@media only screen and (max-width: 640px) {
.hero-image {
height: 280px;
}
}
.hero-image img {
flex-shrink: 0;
min-width: 100%;
min-height: 100%;
position: relative;
}
.content {
width: 100vw;
display: flex;
flex-wrap: wrap;
padding-top: 43px;
padding-bottom: 43px;
}
.container-2 {
width: 1200px;
margin-left: calc(50vw - 600px);
margin-right: calc(50vw - 600px);
}
@media only screen and (max-width: 1220px) {
.container-2 {
width: 100%;
padding: 15px;
margin: 0px;
}
}
hr {
width: 1200px;
margin-left: calc(50vw - 600px);
margin-right: calc(50vw - 600px);
}
@media only screen and (max-width: 1220px) {
hr {
width: auto;
margin-left: 15px;
margin-right: 15px;
}
}
.overlay {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
flex-direction: column;
top: 118;
left: 0;
position: absolute;
min-width: 100vw;
min-height: 480px;
}
@media only screen and (max-width: 640px) {
.overlay {
min-height: 280px;
}
}
.overlay .title {
text-align: center;
font-size: 60px;
color: #FFF;
margin-top: 80px;
font-family: "Josefin Slab";
font-style: bold;
}
@media only screen and (max-width: 640px) {
.overlay .title {
margin-top: 40px;
}
}
.row {
display: flex;
flex-direction: row;
}
@media only screen and (max-width: 640px) {
.row {
flex-direction: column;
}
}
.col {
display: flex;
flex: 1 1 0;
flex-direction: column;
justify-content: center;
text-align: center;
}
@media only screen and (max-width: 640px) {
.col {
flex: 1;
}
}
.segment {
padding-left: 17px;
@ -258,206 +82,6 @@ hr {
max-width: 100%;
margin-bottom: 10px;
}
.img_cont {
text-align: center;
}
.banner-img {
width: 100%;
height: 100%;
}
.banner {
padding-top: 0px;
margin-top: 15px;
padding-bottom: 0px;
margin-bottom: 15px;
}
@media only screen and (max-width: 640px) {
.banner {
margin-top: 0px;
margin-bottom: 0px;
}
}
.footer-segment {
display: flex;
flex-direction: column;
padding-left: 17px;
padding-right: 17px;
justify-content: flex-start;
align-items: center;
}
.footer-segment b {
font-size: 14px;
margin-bottom: 24px;
}
.footer-segment .socials {
display: flex;
width: auto;
}
.footer-segment .socials a {
margin-right: 20px;
font-size: 28px;
color: #AAA;
margin-bottom: 17px;
}
.footer-segment .socials a:hover {
color: #444;
}
.footer-segment .socials a:last-child {
margin-right: 0px;
}
.footer-segment a {
text-decoration: none;
color: #444;
font-size: 13px;
margin-bottom: 24px;
}
.footer-segment a:hover {
color: #38A3BD;
}
.footer-segment p {
font-size: 13px;
}
.footer-segment .footer-logo {
width: 100px;
margin-top: 17px;
}
@media only screen and (max-width: 640px) {
.footer-segment {
margin-bottom: 48px;
}
}
.mobile-only {
display: none;
}
@media only screen and (max-width: 640px) {
.mobile-only {
display: flex;
}
}
.menu i {
color: #444;
font-size: 24px;
}
.mobile-nav {
flex-direction: row;
width: 100%;
justify-content: space-between;
margin-left: 15px;
margin-right: 15px;
}
.mobile-nav .title {
font-size: 24px;
font-weight: 500;
}
.desktop-only {
display: flex;
}
@media only screen and (max-width: 640px) {
.desktop-only {
display: none;
}
}
.fa-gap {
width: 25px;
}
.mobile-navigation-links {
display: none;
width: 100vw;
}
.mobile-navigation-links ul {
list-style-image: none;
list-style-type: none;
display: flex;
flex-direction: column;
margin: 0px;
padding: 0px;
width: 100vw;
align-items: center;
}
.mobile-navigation-links ul li {
width: 100vw;
text-align: center;
background-color: #EEE;
padding-top: 12px;
padding-bottom: 12px;
}
.mobile-navigation-links ul li a {
text-decoration: none;
color: #444;
text-transform: uppercase;
letter-spacing: 1.2px;
line-height: 14.4px;
font-weight: 400;
padding-top: 12px;
padding-bottom: 12px;
}
.mobile-navigation-links ul li:hover > a {
color: #38A3BD;
}
.mobile-submenu {
display: none;
}
.mobile-submenu ul {
list-style-image: none;
list-style-type: none;
display: flex;
flex-direction: column;
margin: 0px;
padding: 0px;
width: 100vw;
align-items: center;
}
.mobile-submenu ul li {
width: 100vw;
text-align: center;
background-color: #DDD;
padding-top: 8px;
padding-bottom: 8px;
}
.mobile-submenu ul li a {
text-decoration: none;
color: #444;
text-transform: uppercase;
letter-spacing: 1.2px;
line-height: 14.4px;
font-weight: 400;
}
.w {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
text-align: center;
}
@media only screen and (max-width: 640px) {
.w {
flex: 1;
align-items: flex-start;
text-align: left;
}
}
.w66 {
flex: 2;
margin-right: 17px;
align-items: flex-start;
}
.w33 {
flex: 1;
margin-left: 17px;
}
.segment-quote {
color: #444;
@ -501,284 +125,6 @@ hr {
padding-bottom: 17px;
font-weight: 500;
}
@media only screen and (max-width: 640px) {
.segment-title-outer {
margin-left: 10px;
}
}
.news-block {
display: flex;
flex-direction: row;
margin-bottom: 20px;
}
.news-block .news-img {
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
text-align: left;
width: 25%;
padding-right: 25px;
}
.news-block .news-img img {
width: 100%;
}
.news-block .news-content {
flex-direction: column;
justify-content: flex-start;
align-items: flex-start;
text-align: left;
width: 60%;
}
.news-block .news-content .news-title {
font-size: 20px;
color: #AAA;
}
.news-block .news-content .news-title:hover {
color: #38A3BD;
}
.news-block .news-content .news-para {
font-size: 14px;
color: #444;
}
.news-block .news-content .news-read-more {
font-size: 13px;
color: #AAA;
}
.news-block .news-content .news-read-more:hover {
color: #38A3BD;
}
.news-block .news-content .news-date {
font-size: 12px;
color: #AAA;
}
@media only screen and (max-width: 640px) {
.news-block {
margin-left: 10px;
}
}
.news-and-quote {
padding-top: 17px;
padding-bottom: 32px;
}
.user-image {
align-items: flex-start;
justify-content: flex-start;
margin: 0px;
}
.user-image img {
width: 90%;
}
@media only screen and (max-width: 640px) {
.user-image img {
width: 100%;
}
}
.user-info {
align-items: flex-start;
justify-content: flex-start;
text-align: left;
}
.user-info p {
font-weight: 300;
font-size: 22px;
line-height: 33px;
margin-top: 12px;
margin-bottom: 12px;
}
.user-info .title {
font-weight: 500;
font-size: 18px;
margin: 0px;
}
@media only screen and (max-width: 640px) {
.user-info .title {
margin-top: 24px;
}
}
.committee {
align-items: flex-start;
justify-content: flex-start;
text-align: left;
}
.committee .title {
color: #38A3BD;
font-size: 22px;
font-weight: 500;
}
.committee p:last-child {
margin-bottom: 24px;
}
.committee-list {
padding-bottom: 0px;
padding-top: 0px;
}
.top-padding {
padding-top: 17px;
}
.logo-link {
text-decoration: none;
color: #444;
}
.dark {
color: #000 !important;
font-weight: 500 !important;
}
.big-news-title {
font-size: 24px;
color: #38A3BD;
}
.big-news-date {
font-size: 20px;
color: #AAA;
}
.big-news-para {
font-size: 22px;
line-height: 33px;
color: #444;
margin-top: 0px;
}
.big-news-read-more {
font-size: 18px;
color: #AAA;
}
.large-news {
margin-bottom: 0px;
}
@media only screen and (max-width: 640px) {
.large-news {
flex-direction: column;
align-items: center;
}
.large-news .news-img {
width: 75%;
}
.large-news .news-content {
width: 100%;
}
}
.middle-quote {
display: flex;
flex-direction: column;
}
.quote-text {
width: 100%;
text-align: center;
justify-content: center;
}
@media only screen and (max-width: 640px) {
.quote-text {
text-align: left;
justify-content: flex-start;
}
}
.quote-text p {
font-family: "Arapey";
font-style: italic;
font-weight: 600;
font-size: 28px;
}
.quote-author {
width: 100%;
text-align: right;
justify-content: flex-end;
}
.quote-author p {
margin-right: 200px;
font-size: 22px;
}
@media only screen and (max-width: 800px) {
.quote-author p {
margin-right: 0px;
}
}
.block-title {
text-align: left;
align-items: flex-start;
justify-content: flex-start;
margin-left: 0px;
margin-right: 17px;
}
.block-title p {
font-size: 21px;
}
.block-para {
text-align: left;
align-items: flex-start;
justify-content: flex-start;
}
.block-para p {
font-size: 22px;
line-height: 33px;
}
.block {
padding-top: 7px;
padding-bottom: 7px;
}
.leadership-button-container {
text-align: cetner;
align-items: center;
justify-content: center;
}
.leadership-button {
width: auto;
font-size: 14px;
padding-left: 34px;
padding-right: 34px;
padding-top: 21px;
padding-bottom: 21px;
border-radius: 3px;
background-color: #38A3BD;
color: #FFF;
text-transform: uppercase;
font-weight: 500;
}
.leadership-button:hover {
opacity: 0.7;
}
.involved {
font-size: 22px;
line-height: 33px;
}
.involved .calTitle {
font-size: 28px;
}
.colored {
color: #38A3BD;
}
.thicc {
font-weight: 500;
}
.maxi-padding {
padding-top: 27px;
padding-bottom: 27px;
}
/*# sourceMappingURL=css/index.css.map */
html {

View File

@ -4,14 +4,13 @@
<link rel="stylesheet" type="text/css" href="{% static 'pages/css/styles.css' %}">
{% endblock css %}
{% block content %}
<div class="jumbotron jumbotron-fluid">
<div class="container mt-5">
<h1 class="display-4">The Class Council</h1>
<p class="lead">We are here to serve you.</p>
</div>
<div class="container mt-5">
<h1 class="display-4">The Class Council</h1>
<p class="lead">We are here to serve you.</p>
</div>
<hr>
<div class="council container">
<h3 class="display-6">About us</h3>
<h3 class="display-6">Our Mission</h3>
<p>Some description of what we do</p>
<h6>Our Team</h6>
<p>pics, description, role, and quote, of every class council member</p>