aboutsummaryrefslogtreecommitdiffstats
path: root/pydis_site
diff options
context:
space:
mode:
Diffstat (limited to 'pydis_site')
-rw-r--r--pydis_site/static/css/base/base.css6
-rw-r--r--pydis_site/static/css/home/index.css37
-rw-r--r--pydis_site/templates/home/index.html121
3 files changed, 113 insertions, 51 deletions
diff --git a/pydis_site/static/css/base/base.css b/pydis_site/static/css/base/base.css
index f9c557d5..969511f4 100644
--- a/pydis_site/static/css/base/base.css
+++ b/pydis_site/static/css/base/base.css
@@ -12,6 +12,12 @@ main.site-content {
flex: 1;
}
+div.card.has-equal-height {
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+}
+
#django-logo {
padding-bottom: 2px;
background: url(https://static.djangoproject.com/img/logos/django-logo-negative.png) no-repeat center;
diff --git a/pydis_site/static/css/home/index.css b/pydis_site/static/css/home/index.css
index 9f060562..4f1a25ab 100644
--- a/pydis_site/static/css/home/index.css
+++ b/pydis_site/static/css/home/index.css
@@ -48,9 +48,9 @@
.video-container {
position: relative;
- padding-bottom: 285px;
- padding-top: 30px;
- height: 0;
+ padding-top: 56.25%;
+ margin-left: 10px;
+ margin-right: 10px;
overflow: hidden;
}
@@ -60,8 +60,37 @@
position: absolute;
top: 0;
left: 0;
+ right: 0;
width: 100%;
height: 100%;
- max-width: 560px;
+ border: 0;
max-height: 315px;
+ max-width: 560px;
+}
+
+span.repo-language-dot {
+ border-radius: 50%;
+ height: 12px;
+ width: 12px;
+ top: 1px;
+ display: inline-block;
+ position: relative;
+}
+
+span.repo-language-dot.python {
+ background-color: #3572A5;
+}
+
+span.repo-language-dot.html {
+ background-color: #e34c26;
+}
+
+span.repo-language-dot.css {
+ background-color: #563d7c;
+}
+
+
+
+#repo-footer-item {
+ margin-left: 1.2rem;
}
diff --git a/pydis_site/templates/home/index.html b/pydis_site/templates/home/index.html
index 88d557e1..9f9fe93e 100644
--- a/pydis_site/templates/home/index.html
+++ b/pydis_site/templates/home/index.html
@@ -11,9 +11,8 @@
<section class="section">
- <!-- About us -->
+ <!-- Who are we? -->
<div class="container is-spaced">
-
<h1 class="is-size-1">Who are we?</h1>
<br>
<div class="columns">
@@ -39,8 +38,10 @@
complex project, we've got someone who can help you if you get stuck.
</p>
</div>
- <div class="column is-half is-first has-text-centered video-container">
- <iframe width="560" height="315" src="https://www.youtube.com/embed/DIBXg8Qh7bA" frameborder="0"
+
+ <!-- Intro video -->
+ <div class="column is-half video-container">
+ <iframe src="https://www.youtube.com/embed/DIBXg8Qh7bA" frameborder="0"
allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen></iframe>
</div>
@@ -49,68 +50,94 @@
<!-- Projects -->
<h1 class="is-size-1">Projects</h1>
<br>
- <div class="columns">
+ <div class="columns is-multiline">
<!-- Site -->
- <div class="column is-one-quarter">
- <div class="card">
- <header class="card-header">
- <p class="card-header-title">
- pythondiscord/site
- </p>
- </header>
+ <div class="column is-one-third">
+ <div class="card has-equal-height">
<div class="card-content">
- <div class="content">
- Some stuff goes in here. tags? dynamic info?
- </div>
+ <i class="fab fa-github"></i> <a href="pythondiscord.com"> python-discord/site</a>
+ <br><br>
+ <em>Source code for our website</em>
+ <br><br>
+ </span><span class="repo-language-dot python"></span> Python
+ <span id="repo-footer-item"><i class="fas fa-star"></i> 566</span>
+ <span id="repo-footer-item"><i class="fas fa-code-branch"></i> 27</span>
</div>
</div>
</div>
- <!-- SeasonalBot -->
- <div class="column is-one-quarter">
- <div class="card">
- <header class="card-header">
- <p class="card-header-title">
- pythondiscord/seasonalbot
- </p>
- </header>
+ <!-- Bot -->
+ <div class="column is-one-third">
+ <div class="card has-equal-height">
<div class="card-content">
- <div class="content">
- Some stuff goes in here. tags? dynamic info? github stars?
- </div>
+ <i class="fab fa-github"></i> <a href="pythondiscord.com"> python-discord/bot</a>
+ <br><br>
+ <em>Source code for our Discord bot</em>
+ <br><br>
+ </span><span class="repo-language-dot python"></span> Python
+ <span id="repo-footer-item"><i class="fas fa-star"></i> 566</span>
+ <span id="repo-footer-item"><i class="fas fa-code-branch"></i> 27</span>
</div>
</div>
</div>
- <!-- SeasonalBot -->
- <div class="column is-one-quarter">
- <div class="card">
- <header class="card-header">
- <p class="card-header-title">
- pythondiscord/seasonalbot
- </p>
- </header>
+ <!-- Snekbox -->
+ <div class="column is-one-third">
+ <div class="card has-equal-height">
<div class="card-content">
- <div class="content">
- Some stuff goes in here. tags? dynamic info? github stars?
- </div>
+ <i class="fab fa-github"></i> <a href="pythondiscord.com"> python-discord/snekbox</a>
+ <br><br>
+ <em>Easy, safe evaluation of arbitrary Python code</em>
+ <br><br>
+ </span><span class="repo-language-dot python"></span> Python
+ <span id="repo-footer-item"><i class="fas fa-star"></i> 566</span>
+ <span id="repo-footer-item"><i class="fas fa-code-branch"></i> 27</span>
</div>
</div>
</div>
<!-- SeasonalBot -->
- <div class="column is-one-quarter">
- <div class="card">
- <header class="card-header">
- <p class="card-header-title">
- pythondiscord/seasonalbot
- </p>
- </header>
+ <div class="column is-one-third">
+ <div class="card has-equal-height">
+ <div class="card-content">
+ <i class="fab fa-github"></i> <a href="pythondiscord.com"> python-discord/seasonalbot</a>
+ <br><br>
+ <em>A Discord bot that changes with the seasons. Meant as a beginner-friendly learning project.</em>
+ <br><br>
+ </span><span class="repo-language-dot python"></span> Python
+ <span id="repo-footer-item"><i class="fas fa-star"></i> 566</span>
+ <span id="repo-footer-item"><i class="fas fa-code-branch"></i> 27</span>
+ </div>
+ </div>
+ </div>
+
+ <!-- django-simple-bulma -->
+ <div class="column is-one-third">
+ <div class="card has-equal-height">
+ <div class="card-content">
+ <i class="fab fa-github"></i> <a href="pythondiscord.com"> python-discord/django-simple-bulma</a>
+ <br><br>
+ <em>Django application to add the Bulma CSS framework and its extensions</em>
+ <br><br>
+ </span><span class="repo-language-dot css"></span> CSS
+ <span id="repo-footer-item"><i class="fas fa-star"></i> 566</span>
+ <span id="repo-footer-item"><i class="fas fa-code-branch"></i> 27</span>
+ </div>
+ </div>
+ </div>
+
+ <!-- django-crispy-bulma -->
+ <div class="column is-one-third">
+ <div class="card has-equal-height">
<div class="card-content">
- <div class="content">
- Some stuff goes in here. tags? dynamic info? github stars?
- </div>
+ <i class="fab fa-github"></i> <a href="pythondiscord.com"> python-discord/django-crispy-bulma</a>
+ <br><br>
+ <em>Django application to add 'django-crispy-forms' layout objects for Bulma.io</em>
+ <br><br>
+ </span><span class="repo-language-dot html"></span> HTML
+ <span id="repo-footer-item"><i class="fas fa-star"></i> 566</span>
+ <span id="repo-footer-item"><i class="fas fa-code-branch"></i> 27</span>
</div>
</div>
</div>
generated by cgit v1.2.3 (git 2.39.1) at 2025-10-31 04:30:57 +0000