From 4d6038709b50029f46e67f1403e18b4300474855 Mon Sep 17 00:00:00 2001
From: khyatig0206 <khyatig0206@gmail.com>
Date: Wed, 29 Jan 2025 09:59:47 +0530
Subject: [PATCH 1/3] added scrollbar to homepage sidebar and separated main
and sidebar content
---
.gitignore | 1 +
djangoproject/scss/_dashboard.scss | 1 +
djangoproject/scss/_style.scss | 45 ++++++++++++++++++++++++++-
djangoproject/templates/base.html | 2 +-
djangoproject/templates/homepage.html | 4 ++-
5 files changed, 50 insertions(+), 3 deletions(-)
diff --git a/.gitignore b/.gitignore
index 005ef51dfc..cfba8b5e6b 100644
--- a/.gitignore
+++ b/.gitignore
@@ -16,3 +16,4 @@ locale/*/LC_MESSAGES/django.mo
djangoproject/cache
djangoproject/static/css/*.map
djangoproject/static/css/*.css
+venv
\ No newline at end of file
diff --git a/djangoproject/scss/_dashboard.scss b/djangoproject/scss/_dashboard.scss
index f19ee03c9a..887628ee5f 100644
--- a/djangoproject/scss/_dashboard.scss
+++ b/djangoproject/scss/_dashboard.scss
@@ -102,3 +102,4 @@
width: 100%;
height: 20em;
}
+
diff --git a/djangoproject/scss/_style.scss b/djangoproject/scss/_style.scss
index 48b436a088..1ec9b66722 100644
--- a/djangoproject/scss/_style.scss
+++ b/djangoproject/scss/_style.scss
@@ -352,12 +352,16 @@ blockquote {
//Sidebar in column layouts, gray section in fullwidth layout
padding: 0 10px 20px;
@include font-size(14);
+ position: sticky;
+ top: 0;
+ max-height: calc(100vh);
+ overflow-y: auto;
@include respond-min(768px) {
float: right;
margin: 20px 0;
margin-right: 3%;
- padding: 0 0 40px 0;
+ padding: 0 40px 40px 0;
width: 30%;
.sidebar-right & {
@@ -392,6 +396,34 @@ blockquote {
}
}
}
+/* Default scrollbar styles */
+[role="complementary"]::-webkit-scrollbar {
+ width: 8px;
+}
+
+[role="complementary"]::-webkit-scrollbar-track {
+ background: transparent; /* Hide track */
+}
+
+[role="complementary"]::-webkit-scrollbar-button {
+ background-color: transparent;
+}
+
+[role="complementary"]::-webkit-scrollbar-thumb {
+ background: #ccc;
+ border-radius: 0;
+}
+
+/* Thumb hover effect */
+[role="complementary"]::-webkit-scrollbar-thumb:hover {
+ background: #aaa; /* Darker on hover */
+}
+
+/* For Firefox */
+[role="complementary"] {
+ scrollbar-width: thin; /* Thin scrollbar */
+ scrollbar-color: #ccc transparent; /* Default thumb color and track color */
+}
[role="secondary"] {
margin: 0 10px;
@@ -3548,3 +3580,14 @@ ul.corporate-members li {
color: var(--community-img-fg);
}
}
+.homepage-container {
+ width: 100%;
+ }
+
+ /* Apply left padding only on full-screen (large screens) */
+ @media (min-width: 1200px) { /* Adjust breakpoint as needed */
+ .homepage-container {
+ padding-left: 40px; /* Adjust the padding as needed */
+ }
+ }
+
diff --git a/djangoproject/templates/base.html b/djangoproject/templates/base.html
index bb664c63f3..cb27da35b5 100644
--- a/djangoproject/templates/base.html
+++ b/djangoproject/templates/base.html
@@ -75,7 +75,7 @@
<div id="billboard">{% block billboard %}{% endblock %}</div>
- <div class="container {% block layout_class %}{% endblock %}">
+ <div class="{% block layout_class %}{% endblock %}">
<div role="main">
{% block messages %}
diff --git a/djangoproject/templates/homepage.html b/djangoproject/templates/homepage.html
index e981d0023a..e799638d95 100644
--- a/djangoproject/templates/homepage.html
+++ b/djangoproject/templates/homepage.html
@@ -16,6 +16,7 @@ <h1 class="visuallyhidden">Django</h1>
{% endblock %}
{% block content %}
+<div class="homepage-container">
<div class="section">
<h1>{% translate "Meet Django" %}</h1>
<p>
@@ -99,11 +100,12 @@ <h3 class="logo" title="Knight Foundation">Knight Foundation</h3>
</div>
{% endcomment %}
-
+ </div>
<!-- END #content-secondary -->
{% endblock %}
{% block content-related %}
+
<div role="complementary">
<a href="{% url 'download' %}" class="cta">
{% blocktranslate trimmed %}
From 647fb6f4f3fa985e0f7e1dc8ecd4850a2c89f551 Mon Sep 17 00:00:00 2001
From: khyatig0206 <khyatig0206@gmail.com>
Date: Wed, 29 Jan 2025 10:04:36 +0530
Subject: [PATCH 2/3] added scrollbar to homepage sidebar and separated main
and sidebar content
---
djangoproject/scss/_dashboard.scss | 3 +--
djangoproject/scss/_style.scss | 4 ++--
2 files changed, 3 insertions(+), 4 deletions(-)
diff --git a/djangoproject/scss/_dashboard.scss b/djangoproject/scss/_dashboard.scss
index 887628ee5f..e82a9ce239 100644
--- a/djangoproject/scss/_dashboard.scss
+++ b/djangoproject/scss/_dashboard.scss
@@ -101,5 +101,4 @@
margin: 0 auto;
width: 100%;
height: 20em;
-}
-
+}
\ No newline at end of file
diff --git a/djangoproject/scss/_style.scss b/djangoproject/scss/_style.scss
index 1ec9b66722..fbc13ba714 100644
--- a/djangoproject/scss/_style.scss
+++ b/djangoproject/scss/_style.scss
@@ -3584,8 +3584,8 @@ ul.corporate-members li {
width: 100%;
}
- /* Apply left padding only on full-screen (large screens) */
- @media (min-width: 1200px) { /* Adjust breakpoint as needed */
+/* Apply left padding only on full-screen (large screens) */
+@media (min-width: 1200px) { /* Adjust breakpoint as needed */
.homepage-container {
padding-left: 40px; /* Adjust the padding as needed */
}
From 0da64fccdca889aa1012c790dc3d6f9e73e9b07d Mon Sep 17 00:00:00 2001
From: "pre-commit-ci[bot]"
<66853113+pre-commit-ci[bot]@users.noreply.github.com>
Date: Wed, 29 Jan 2025 04:47:50 +0000
Subject: [PATCH 3/3] [pre-commit.ci] auto fixes from pre-commit.com hooks
for more information, see https://pre-commit.ci
---
.gitignore | 2 +-
djangoproject/scss/_dashboard.scss | 2 +-
djangoproject/scss/_style.scss | 11 ++--
djangoproject/templates/homepage.html | 88 +++++++++++++--------------
4 files changed, 51 insertions(+), 52 deletions(-)
diff --git a/.gitignore b/.gitignore
index cfba8b5e6b..ede1fb7892 100644
--- a/.gitignore
+++ b/.gitignore
@@ -16,4 +16,4 @@ locale/*/LC_MESSAGES/django.mo
djangoproject/cache
djangoproject/static/css/*.map
djangoproject/static/css/*.css
-venv
\ No newline at end of file
+venv
diff --git a/djangoproject/scss/_dashboard.scss b/djangoproject/scss/_dashboard.scss
index e82a9ce239..f19ee03c9a 100644
--- a/djangoproject/scss/_dashboard.scss
+++ b/djangoproject/scss/_dashboard.scss
@@ -101,4 +101,4 @@
margin: 0 auto;
width: 100%;
height: 20em;
-}
\ No newline at end of file
+}
diff --git a/djangoproject/scss/_style.scss b/djangoproject/scss/_style.scss
index fbc13ba714..e84bf035a4 100644
--- a/djangoproject/scss/_style.scss
+++ b/djangoproject/scss/_style.scss
@@ -398,7 +398,7 @@ blockquote {
}
/* Default scrollbar styles */
[role="complementary"]::-webkit-scrollbar {
- width: 8px;
+ width: 8px;
}
[role="complementary"]::-webkit-scrollbar-track {
@@ -406,12 +406,12 @@ blockquote {
}
[role="complementary"]::-webkit-scrollbar-button {
- background-color: transparent;
+ background-color: transparent;
}
[role="complementary"]::-webkit-scrollbar-thumb {
- background: #ccc;
- border-radius: 0;
+ background: #ccc;
+ border-radius: 0;
}
/* Thumb hover effect */
@@ -3583,11 +3583,10 @@ ul.corporate-members li {
.homepage-container {
width: 100%;
}
-
+
/* Apply left padding only on full-screen (large screens) */
@media (min-width: 1200px) { /* Adjust breakpoint as needed */
.homepage-container {
padding-left: 40px; /* Adjust the padding as needed */
}
}
-
diff --git a/djangoproject/templates/homepage.html b/djangoproject/templates/homepage.html
index e799638d95..7f5bef92f4 100644
--- a/djangoproject/templates/homepage.html
+++ b/djangoproject/templates/homepage.html
@@ -16,57 +16,57 @@ <h1 class="visuallyhidden">Django</h1>
{% endblock %}
{% block content %}
-<div class="homepage-container">
- <div class="section">
- <h1>{% translate "Meet Django" %}</h1>
- <p>
- {% blocktranslate trimmed %}
- Django is a high-level Python web framework that encourages rapid development and clean, pragmatic design.
- Built by experienced developers, it takes care of much of the hassle of web development, so you can focus
- on writing your app without needing to reinvent the wheel. It’s free and open source.
- {% endblocktranslate %}
- </p>
- <dl class="list-features">
- <dt><i class="icon icon-bolt"></i> {% translate "Ridiculously fast." %}</dt>
- <dd>
- <p>{% translate "Django was designed to help developers take applications from concept to completion as quickly as possible." %}</p>
- </dd>
+ <div class="homepage-container">
+ <div class="section">
+ <h1>{% translate "Meet Django" %}</h1>
+ <p>
+ {% blocktranslate trimmed %}
+ Django is a high-level Python web framework that encourages rapid development and clean, pragmatic design.
+ Built by experienced developers, it takes care of much of the hassle of web development, so you can focus
+ on writing your app without needing to reinvent the wheel. It’s free and open source.
+ {% endblocktranslate %}
+ </p>
+ <dl class="list-features">
+ <dt><i class="icon icon-bolt"></i> {% translate "Ridiculously fast." %}</dt>
+ <dd>
+ <p>{% translate "Django was designed to help developers take applications from concept to completion as quickly as possible." %}</p>
+ </dd>
- <dt><i class="icon icon-lock"></i> {% translate "Reassuringly secure." %}</dt>
- <dd>
- <p>{% translate "Django takes security seriously and helps developers avoid many common security mistakes." %}</p>
- </dd>
+ <dt><i class="icon icon-lock"></i> {% translate "Reassuringly secure." %}</dt>
+ <dd>
+ <p>{% translate "Django takes security seriously and helps developers avoid many common security mistakes." %}</p>
+ </dd>
- <dt><i class="icon icon-dashboard"></i> {% translate "Exceedingly scalable." %}</dt>
- <dd>
- <p>{% translate "Some of the busiest sites on the web leverage Django’s ability to quickly and flexibly scale." %}</p>
- </dd>
- </dl>
+ <dt><i class="icon icon-dashboard"></i> {% translate "Exceedingly scalable." %}</dt>
+ <dd>
+ <p>{% translate "Some of the busiest sites on the web leverage Django’s ability to quickly and flexibly scale." %}</p>
+ </dd>
+ </dl>
- <a href="{% url 'overview' %}" class="cta outline">{% translate "Learn more about Django" %}</a>
- </div>
+ <a href="{% url 'overview' %}" class="cta outline">{% translate "Learn more about Django" %}</a>
+ </div>
- <div class="section">
- <h2>{% translate "Join the Community" %}</h2>
- <div class="community-cta-wrapper">
- <a href="https://forum.djangoproject.com/" class="community-cta-a">
- <div class="community-cta">
- <div>
- {% include "svg_logos/forum.html" %}
+ <div class="section">
+ <h2>{% translate "Join the Community" %}</h2>
+ <div class="community-cta-wrapper">
+ <a href="https://forum.djangoproject.com/" class="community-cta-a">
+ <div class="community-cta">
+ <div>
+ {% include "svg_logos/forum.html" %}
+ </div>
+ <h3>{% translate "Forum - Post a question" %}</h3>
</div>
- <h3>{% translate "Forum - Post a question" %}</h3>
- </div>
- </a>
- <a href="https://chat.djangoproject.com" class="community-cta-a">
- <div class="community-cta">
- <div>
- {% include "svg_logos/discord.html" %}
+ </a>
+ <a href="https://chat.djangoproject.com" class="community-cta-a">
+ <div class="community-cta">
+ <div>
+ {% include "svg_logos/discord.html" %}
+ </div>
+ <h3>{% translate "Discord - Chat with us" %}</h3>
</div>
- <h3>{% translate "Discord - Chat with us" %}</h3>
- </div>
- </a>
+ </a>
+ </div>
</div>
- </div>
{% comment %}