bofh/fet2020
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

update css style

Browse Source
This commit is contained in:
Patrick Mayr
2021-03-03 21:52:34 +00:00
parent 74ff9a7199
commit 6686ff8c15
9 changed files with 177 additions and 190 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
fet2020/fet2020/settings.py
View File

@@ -76,6 +76,7 @@ INSTALLED_APPS = [
"django_crontab", "django_crontab",
"django_filters", "django_filters",
"django_static_jquery_ui", "django_static_jquery_ui",
"fontawesome-free",
"posts.apps.PostsConfig", "posts.apps.PostsConfig",
"members.apps.MembersConfig", "members.apps.MembersConfig",
"documents.apps.DocumentsConfig", "documents.apps.DocumentsConfig",
@@ -183,7 +184,7 @@ LOCALE_PATHS = [os.path.join(BASE_DIR, "locale")]
# Static files (CSS, JavaScript, Images) # Static files (CSS, JavaScript, Images)
# https://docs.djangoproject.com/en/3.0/howto/static-files/ # https://docs.djangoproject.com/en/3.0/howto/static-files/
STATIC_URL = "/assets/" STATIC_URL = "/static/"
STATICFILES_DIRS = [os.path.join(BASE_DIR, "static")] STATICFILES_DIRS = [os.path.join(BASE_DIR, "static")]
STATIC_ROOT = "assets/" STATIC_ROOT = "assets/"
@@ -218,10 +219,9 @@ THUMBNAIL_ALIASES = {
}, },
} }
ETHERPAD_HOST = env("ETHERPAD_HOST").strip() ETHERPAD_HOST = env("ETHERPAD_HOST").strip()
if not ETHERPAD_HOST or ETHERPAD_HOST=="": if not ETHERPAD_HOST or ETHERPAD_HOST == "":
ETHERPAD_HOST = urljoin("https://" + env("HOST_NAME"), "etherpad/") ETHERPAD_HOST = urljoin("https://" + env("HOST_NAME"), "etherpad/")
# ETHERPAD CLIENT # ETHERPAD CLIENT
if DEBUG: if DEBUG:
ETHERPAD_CLIENT = { ETHERPAD_CLIENT = {

1
fet2020/requirements.txt
View File

@@ -14,3 +14,4 @@ etherpad-lite==0.5
ghostscript==0.6 ghostscript==0.6
ldap3==2.8.1 ldap3==2.8.1
mysqlclient==2.0.1 mysqlclient==2.0.1
fontawesome-free==5.15.2

103
fet2020/static/fet.css
View File

@@ -1,21 +1,102 @@
body { body {
min-height:100%; min-height: 100%;
position:relative; position: relative;
}
img.logo {
height:40px;
width:40px;
} }
div.footer { img.logo {
height: 50px;
width: 50px;
}
.title-bar {
background: None;
}
a.header-link {
background: None;
color: black;
font-size: medium;
font-weight: bold;
}
a.header-intern-link {
background: lightgrey;
color: black;
font-size: medium;
font-weight: bold;
}
.header-intern-txt {
background: lightgrey;
color: black;
font-size: medium;
}
.header-btn:hover {
background: None;
}
.header-btn:focus {
background: None;
color: black;
}
.header-intern-btn:hover {
background: lightgrey;
}
.header-intern-btn:focus {
background: lightgrey;
color: black;
}
footer {
height: 100%;
background-color: #444;
}
.footer-grid-y {
height: 100%; height: 100%;
} }
.footer a {
color: white; .footer-link {
color: white;
} }
.footer a i {
font-size:30px; .footer-link i {
font-size:30px;
} }
.job-btn {
background-color: gray;
height: 70%;
display: flex;
align-items: center;
justify-content: center;
}
.job-btn:hover {
background-color: black;
}
.job-btn:focus {
background-color: gray;
}
.memb-btn {
background-color: darkgray;
height: 70%;
display: flex;
align-items: center;
justify-content: center;
}
.memb-btn:hover {
background-color: black;
}
.memb-btn:focus {
background-color: darkgray;
}
.active {
background-color: black;
}
a.thumbnail { a.thumbnail {
width: 150px; width: 150px;
height: 150px; height: 150px;

2
fet2020/templates/home.html
View File

@@ -29,7 +29,7 @@
<div class="article-row-section"> <div class="article-row-section">
<div class="article-row-section-inner"> <div class="article-row-section-inner">
<h1 class="article-row-section-header"><a href="{% url 'posts.index' %}">Neuigkeiten</a></h1> <h1 class="article-row-section-header">Events</h1>
{% with post=featured_event %} {% with post=featured_event %}
{% include 'posts/partials/_article_row.html' %} {% include 'posts/partials/_article_row.html' %}

100
fet2020/templates/layout.html
View File

@@ -2,49 +2,42 @@
<!doctype html> <!doctype html>
<html class="no-js" lang="en"> <html class="no-js" lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="x-ua-compatible" content="ie=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>FET</title>
<link rel="stylesheet" href="{% static 'app.css' %}">
<link rel="stylesheet" href="{% static 'fet.css' %}">
<script src="https://kit.fontawesome.com/dbe3c89a9d.js" crossorigin="anonymous"></script>
{% block extraheader %}
{% endblock %}
</head>
<body style="">
<style> <head>
footer { <meta charset="utf-8" />
background-color: #444; <meta http-equiv="x-ua-compatible" content="ie=edge">
} <meta name="viewport" content="width=device-width, initial-scale=1.0">
</style> <title>FET</title>
<link rel="stylesheet" href="{% static 'app.css' %}">
<link rel="stylesheet" href="{% static '../static/fet.css' %}">
<link href="{% static 'fontawesome_free/css/all.min.css' %}" rel="stylesheet" type="text/css">
{% block extraheader %}
{% endblock %}
</head>
<body>
<div id="fb-root"></div> <div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/de_DE/sdk.js#xfbml=1&version=v8.0" nonce="WSEL84CK"></script> <script async defer crossorigin="anonymous" src="https://connect.facebook.net/de_DE/sdk.js#xfbml=1&version=v10.0" nonce="mbyDj8BX"></script>
<div class="header-title-bar" data-responsive-toggle="example-menu" data-hide-for="large"> <div class="header-title-bar" data-responsive-toggle="example-menu" data-hide-for="large">
<div class="title-bar" style="background: None"> <div class="title-bar">
<div class="title-bar-left"> <div class="title-bar-left">
<a href="{% url 'home' %}"> <a href="{% url 'home' %}">
<img class="logo" src="/assets/img/logo2014_64.png"/> <img class="logo" src="{% static 'img/logo2014_64.png' %}"/>
</a> </a>
</div> </div>
<div class="title-bar-right"> <div class="title-bar-right">
<button class="menu-icon dark" type="button" data-toggle="example-menu"></button> <button class="menu-icon dark" type="button" data-toggle="example-menu"></button>
</div> </div>
</div> </div>
</div> </div>
<div class="top-bar" id="example-menu"> <div class="top-bar" id="example-menu">
<div class="top-bar-left show-for-large"> <div class="top-bar-left show-for-large">
<a href="{% url 'home' %}"> <a href="{% url 'home' %}">
<img class="logo" src="/assets/img/logo2014_64.png"/> <img class="logo" src="{% static 'img/logo2014_64.png' %}"/>
</a> </a>
</div> </div>
@@ -52,31 +45,30 @@ footer {
<ul class="dropdown vertical medium-horizontal menu" data-responsive-menu="drilldown medium-dropdown" data-animate-heigt="true"> <ul class="dropdown vertical medium-horizontal menu" data-responsive-menu="drilldown medium-dropdown" data-animate-heigt="true">
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
<li> <li>
<a role="menuitem" style="color: black; background: lightgrey">Hallo <a class="button header-intern-btn header-intern-txt" role="menuitem">
{% if request.user.first_name %} {% if request.user.first_name %}
{{ request.user.first_name }} Hallo {{ request.user.first_name }}
{% else %} {% else %}
{{ request.user.username }} Hallo {{ request.user.username }}
{% endif %} {% endif %}
</a> </a>
</li> </li>
<li><a href="/admin" style="background: lightgrey;">Admin</a></li> <li><a class="button header-intern-btn header-intern-link" href="/admin">Admin</a></li>
<li><a href="{% url 'tasks' %}" style="background: lightgrey;">Tasks</a></li> <li><a class="button header-intern-btn header-intern-link" href="{% url 'tasks' %}">Tasks</a></li>
<li><a href="https://legacy.fet.at/home/intern" style="background: lightgrey;">Intern</a></li> <li><a class="button header-intern-btn header-intern-link" href="https://legacy.fet.at/home/intern">Intern</a></li>
{% endif %} {% endif %}
<li><a href="{% url 'posts.index' %}">Aktuelles</a></li> <li><a class="button header-btn header-link" href="{% url 'posts.index' %}">News</a></li>
<!-- show active members first --> <!-- show active members first -->
<li><a href="{% url 'members' %}A">Fachschaft</a></li> <li><a class="button header-btn header-link" href="{% url 'members' %}A">Fachschaft</a></li>
<li><a href="/fotos/">Fotos</a></li> <li><a class="button header-btn header-link" href="/fotos/">Fotos</a></li>
<li><a href="/blackboard">Blackboard</a></li> <li><a class="button header-btn header-link" href="/blackboard">Blackboard</a></li>
{% if request.user.is_authenticated %} {% if request.user.is_authenticated %}
<li><a href="{% url 'logout' %}">Logout</a></li> <li><a class="button header-btn header-link" href="{% url 'logout' %}">Logout</a></li>
{% else %} {% else %}
<li><a href="{% url 'login' %}?next={{ request.path }}">Login</a></li> <li><a class="button header-btn header-link" href="{% url 'login' %}?next={{ request.path }}">Login</a></li>
{% endif %} {% endif %}
</ul> </ul>
</div> </div>
</div> </div>
{% block content %} {% block content %}
@@ -86,28 +78,38 @@ footer {
<div class="grid-container"> <div class="grid-container">
<div class="grid-x padding-top-1 padding-bottom-1"> <div class="grid-x padding-top-1 padding-bottom-1">
<div class="cell medium-6 large-9"> <div class="cell medium-6 large-9">
<div class="grid-y" style="height: 100%;" class="footer"> <div class="grid-y footer-grid-y">
<div class="cell small-6 medium-9 large-9"> <div class="cell small-6 medium-9 large-9">
<a href="{% url 'posts.show' 'impressum' %}" >Impressum</a> <a class="footer-link" href="{% url 'posts.show' 'impressum' %}" >Impressum</a>
</div> </div>
<div class="cell small-6 medium-3 large-3 padding-bottom-2"> <div class="cell small-6 medium-3 large-3 padding-bottom-2">
<a href="https://www.facebook.com/FachschaftET"><i class="fab fa-facebook-square" style="font-size:30px; color: white;"></i>Facebook</a> <a class="footer-link" href="https://www.facebook.com/FachschaftET">
<a href="https://www.instagram.com/fet_tuwien/"><i class="fab fa-instagram-square" style="font-size:30px; color: white;"></i>Instagram</a> <i class="fab fa-facebook-square"></i>
<a href="https://discord.gg/7qRuuMA"><i class="fab fa-discord" style="font-size:30px; color: white;"></i>Discord</a> </a>
<a href="https://t.me/FETInfo"><i class="fab fa-telegram" style="font-size:30px; color: white;"></i>Telegram</a> <a class="footer-link" href="https://www.instagram.com/fet_tuwien/">
<i class="fab fa-instagram-square"></i>
</a>
<a class="footer-link" href="https://discord.gg/7qRuuMA">
<i class="fab fa-discord"></i>
</a>
<a class="footer-link" href="https://t.me/FETInfo">
<i class="fab fa-telegram"></i>
</a>
</div> </div>
</div> </div>
</div> </div>
<div class="cell medium-6 large-3"> <div class="cell medium-6 large-3">
<div class="fb-page" <div class="fb-page" data-href="https://www.facebook.com/FachschaftET" data-tabs="" data-width="" data-height=""
data-href="https://www.facebook.com/FachschaftET" data-small-header="false" data-adapt-container-width="false" data-hide-cover="false" data-show-facepile="false">
data-width="500" <blockquote cite="https://www.facebook.com/FachschaftET" class="fb-xfbml-parse-ignore">
data-height="150" <a href="https://www.facebook.com/FachschaftET">Fachschaft Elektrotechnik</a>
data-hide-cover="false" </blockquote>
data-show-facepile="false"></div> </div>
</div> </div>
</div> </div>

56
fet2020/templates/members/index.html
View File

@@ -1,45 +1,38 @@
{% extends 'layout.html' %} {% extends "layout.html" %}
{% block content %}
{% load softhyphen_tags %} {% load softhyphen_tags %}
<style> {% block content %}
.button {
background-color: gray;
}
.button:hover {
background-color: black;
}
.memb {
background-color: darkgray;
}
.active {
background-color: black;
}
</style>
<div class="grid-container"> <div class="grid-container">
<div class="grid-x grid-padding-x padding-top-1"> <div class="grid-x grid-padding-x padding-top-1">
{% for job in pinned_job_groups %} {% for job in pinned_job_groups %}
<div class="cell large-2 medium-4 small-6"> <div class="cell large-2 medium-4 small-6">
<a class="button expanded {% if job.slug in request.path %} active {% endif %}" href="{% url 'jobs' job.slug %}"> <a class="button job-btn {% if job.slug in request.path %} active {% endif %}" href="{% url 'jobs' job.slug %}">
{{job.name}}
</a>
</div>
{% endfor %}
{% for job in unpinned_job_groups %}
<div class="cell large-2 medium-4 small-6">
<a class="button expanded {% if job.slug in request.path %} active {% endif %}" href="{% url 'jobs' job.slug %}">
{{ job.name|softhyphen|safe }} {{ job.name|softhyphen|safe }}
</a> </a>
</div> </div>
{% endfor %} {% endfor %}
<div class="cell large-2 medium-4 small-6"><a class="button memb expanded {% if '/members/P' == request.path %} active {% endif %}" href="/members/P">Pension</a></div> {% for job in unpinned_job_groups %}
<div class="cell large-2 medium-4 small-6"><a class="button memb expanded {% if '/members/' == request.path %} active {% endif %}" href="/members">Alle Mitglieder</a></div> <div class="cell large-2 medium-4 small-6">
<a class="button job-btn {% if job.slug in request.path %} active {% endif %} job-btn" href="{% url 'jobs' job.slug %}">
{{ job.name|softhyphen|safe }}
</a>
</div>
{% endfor %}
<div class="cell large-2 medium-4 small-6">
<a class="button memb-btn {% if '/members/P' == request.path %} active {% endif %}" href="/members/P">
Pension
</a>
</div>
<div class="cell large-2 medium-4 small-6">
<a class="button memb-btn {% if '/members/' == request.path %} active {% endif %}" href="/members">
Alle Mitglieder
</a>
</div>
</div> </div>
@@ -53,9 +46,8 @@
<!-- show details of a member --> <!-- show details of a member -->
{% if member %} {% if member %}
<div class="padding-top-1 padding-left-1 padding-bottom-1 padding-right-1" style="background-color: white;"> {% block members_content %}
{% include 'members/partials/_member_details.html' %} {% endblock %}
</div>
{% endif %} {% endif %}
<!-- show all, active or pension members --> <!-- show all, active or pension members -->

2
fet2020/templates/members/jobs_list.html
View File

@@ -1,4 +1,3 @@
{% regroup job_members by job.name as all_jobmem_list %} {% regroup job_members by job.name as all_jobmem_list %}
{% for jobmem in all_jobmem_list %} {% for jobmem in all_jobmem_list %}
@@ -6,7 +5,6 @@
<div class="padding-top-1 padding-left-1 padding-right-1" style="background-color: white;"> <div class="padding-top-1 padding-left-1 padding-right-1" style="background-color: white;">
<h2>{{jobmem.grouper}}<a class="headerlink" id="{{jobmem.list.0.job.slug}}" href="#{{jobmem.list.0.job.slug}}" title="Permalink to {{jobmem.grouper}}"> #</a></h2> <h2>{{jobmem.grouper}}<a class="headerlink" id="{{jobmem.list.0.job.slug}}" href="#{{jobmem.list.0.job.slug}}" title="Permalink to {{jobmem.grouper}}"> #</a></h2>
<b>Aktuelle Mitglieder:</b>
<div class="grid-x align-bottom"> <div class="grid-x align-bottom">

8
fet2020/templates/members/member.html
View File

@@ -1,14 +1,14 @@
{% extends 'members/member_layout.html' %} {% extends 'members/index.html' %}
{% block extraheader %} {% block extraheader %}
<meta content="{{member.image.url}}" property="og:image"> <meta content="{{member.image.url}}" property="og:image">
<meta content="{{ member.firstname }}" property="og:profile:first_name"> <meta content="{{ member.firstname }}" property="og:profile:first_name">
<meta content="{{ member.surname }}" property="og:profile:last_name"> <meta content="{{ member.surname }}" property="og:profile:last_name">
<meta content="profile" property="og:type"> <meta content="profile" property="og:type">
{% endblock %} {% endblock %}
{% block members_content %} {% block members_content %}
<div class="padding-top-1 padding-left-1 padding-bottom-1 padding-right-1" style="background-color: white;"> <div class="padding-top-1 padding-left-1 padding-bottom-1 padding-right-1" style="background-color: white;">
{% include 'members/partials/_member_details.html' %} {% include 'members/partials/_member_details.html' %}
</div> </div>
{% endblock %} {% endblock %}

87
fet2020/templates/members/member_layout.html
View File

@@ -1,87 +0,0 @@
{% extends 'layout.html' %}
{% block content %}
{% load softhyphen_tags %}
<style>
.button {
background-color: gray;
}
.button:hover {
background-color: black;
}
.memb {
background-color: darkgray;
}
.active {
background-color: black;
}
</style>
<div class="grid-container">
<div class="grid-x grid-padding-x padding-top-1">
{% for job in pinned_job_groups %}
<div class="cell large-2 medium-4 small-6">
<a class="button expanded {% if job.slug in request.path %} active {% endif %}" href="{% url 'jobs' job.slug %}">
{{job.name}}
</a>
</div>
{% endfor %}
{% for job in unpinned_job_groups %}
<div class="cell large-2 medium-4 small-6">
<a class="button expanded {% if job.slug in request.path %} active {% endif %}" href="{% url 'jobs' job.slug %}">
{{ job.name|softhyphen|safe }}
</a>
</div>
{% endfor %}
<div class="cell large-2 medium-4 small-6"><a class="button memb expanded {% if '/members/P' == request.path %} active {% endif %}" href="/members/P">Pension</a></div>
<div class="cell large-2 medium-4 small-6"><a class="button memb expanded {% if '/members/' == request.path %} active {% endif %}" href="/members">Alle Mitglieder</a></div>
</div>
{% if description %}
<div class="grid-x">
<div class="cell padding-top-1 padding-left-1 padding-right-1" style="background-color: white; text-align: justify;">
{{ description|safe }}
</div>
</div>
{% endif %}
{% block members_content %}
{% endblock %}
</div>
{% endblock %}
<script>
// Get the container element
var btnContainer = document.getElementById("grid-container");
// Get all buttons with class="btn" inside the container
var grid = btnContainer.getElementsByClassName("grid-x");
var cell = grid.getElementsByClassName("cell");
var btns = cell.getElementsByClassName("button");
// Loop through the buttons and add the active class to the current/clicked button
for (var i = 0; i < btns.length; i++) {
btns[i].addEventListener("click", function() {
var current = document.getElementsByClassName("active");
// If there's no active class
if (current.length > 0) {
current[0].className = current[0].className.replace(" active", "");
}
// Add the active class to the current/clicked button
this.className += " active";
});
}
</script>