Skip to content

Commit 7105f85

Browse files
committed
Style CMS
1 parent 883b37e commit 7105f85

File tree

9 files changed

+466
-5
lines changed

9 files changed

+466
-5
lines changed

cms/settings.py

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -13,12 +13,15 @@
1313
from pathlib import Path
1414

1515
import os
16+
import mimetypes
1617

1718
# Build paths inside the project like this: BASE_DIR / 'subdir'.
1819
BASE_DIR = Path(__file__).resolve().parent
1920

2021
APPEND_SLASH = False
2122

23+
LOGIN_REDIRECT_URL = '/'
24+
2225
# Quick-start development settings - unsuitable for production
2326
# See https://docs.djangoproject.com/en/3.2/howto/deployment/checklist/
2427

@@ -156,6 +159,9 @@
156159

157160
STATIC_ROOT = '/staticfiles'
158161
STATIC_URL = '/static/'
162+
STATICFILES_DIRS = [
163+
os.path.join(BASE_DIR, "static"),
164+
]
159165

160166
# Default primary key field type
161167
# https://docs.djangoproject.com/en/3.2/ref/settings/#default-auto-field
@@ -175,3 +181,5 @@
175181
SPECTACULAR_SETTINGS = {
176182
'COMPONENT_SPLIT_REQUEST': True,
177183
}
184+
185+
mimetypes.add_type("text/css", ".css", True)

cms/static/CherryCreamSoda.woff2

18.1 KB
Binary file not shown.

cms/static/style.css

Lines changed: 188 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,188 @@
1+
@font-face {
2+
font-family: 'Cherry Cream Soda';
3+
src: url('CherryCreamSoda.woff2');
4+
}
5+
6+
h1 {
7+
color: rgb(241 238 236);
8+
}
9+
10+
h3 {
11+
border-bottom-width: 1px;
12+
color: var(--licorice);
13+
}
14+
15+
h3 a:link, h3 a:visited {
16+
color: var(--licorice);
17+
}
18+
19+
nav {
20+
width: 100%;
21+
}
22+
23+
main {
24+
display: flex;
25+
justify-content: center;
26+
}
27+
28+
[multiple], [type=date], [type=datetime-local], [type=email], [type=month], [type=number], [type=password], [type=search], [type=tel], [type=text], [type=time], [type=url], [type=week], input:where(:not([type])), select, textarea {
29+
border-color: var(--stainless);
30+
border-radius: 0.125rem;
31+
}
32+
33+
select {
34+
height: 2.5rem;
35+
}
36+
37+
a:link, a:visited {
38+
color: var(--bloodorange);
39+
font-weight: 400;
40+
}
41+
42+
th a {
43+
font-weight: 400;
44+
}
45+
46+
.button.default, input[type=submit].default, .submit-row input.default {
47+
background-color: var(--bloodorange);
48+
}
49+
50+
.button.default:hover, input[type=submit].default:hover, .submit-row input.default:hover {
51+
background-color: var(--smashed-pumpkin);
52+
}
53+
54+
.button:hover, input[type=submit]:hover, input[type=button]:hover, .submit-row input:hover, a.button:hover {
55+
background-color: var(--bloodorange);
56+
}
57+
58+
.button, input[type=submit], input[type=button], .submit-row input, a.button {
59+
background-color: var(--smashed-pumpkin);
60+
}
61+
62+
.submit-row input.default {
63+
text-transform: none;
64+
}
65+
66+
.module caption {
67+
background-color: none;
68+
}
69+
70+
.module caption .section:link, .module caption .section:visited {
71+
color: var(--licorice);
72+
}
73+
74+
a.section:link, a.section:visited {
75+
color: var(--licorice);
76+
}
77+
78+
#header {
79+
background-color: var(--bloodorange);
80+
color: rgb(241 238 236);
81+
display: flex;
82+
flex-direction: column;
83+
padding: 0.5rem;
84+
overflow: visible;
85+
}
86+
87+
#header h1 {
88+
font-family: 'Cherry Cream Soda';
89+
font-weight: 400;
90+
font-style: normal;
91+
}
92+
93+
#branding h1 {
94+
color: rgb(241 238 236);
95+
font-size: 72px;
96+
font-weight: bolder;
97+
margin-left: 16px;
98+
}
99+
100+
#branding_and_tools {
101+
color: var(--jasmine-rice);
102+
display: flex;
103+
align-items: flex-end;
104+
flex-direction: row;
105+
justify-content: space-between;
106+
width: 100%;
107+
}
108+
109+
nav a h2.hidden {
110+
color: var(--licorice);
111+
display: block !important;
112+
}
113+
114+
nav a:link svg, nav a:visited svg {
115+
color: var(--licorice);
116+
}
117+
118+
.addlink {
119+
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true" data-slot="icon" class="w-5"><path stroke-linecap="round" stroke-linejoin="round" d="M12 4.5v15m7.5-7.5h-15"></path></svg>');
120+
background-size: 16px 16px;
121+
}
122+
123+
.changelink {
124+
background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--!Font Awesome Free 6.6.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license/free Copyright 2024 Fonticons, Inc.--><path d="M410.3 231l11.3-11.3-33.9-33.9-62.1-62.1L291.7 89.8l-11.3 11.3-22.6 22.6L58.6 322.9c-10.4 10.4-18 23.3-22.2 37.4L1 480.7c-2.5 8.4-.2 17.5 6.1 23.7s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L387.7 253.7 410.3 231zM160 399.4l-9.1 22.7c-4 3.1-8.5 5.4-13.3 6.9L59.4 452l23-78.1c1.4-4.9 3.8-9.4 6.9-13.3l22.7-9.1 0 32c0 8.8 7.2 16 16 16l32 0zM362.7 18.7L348.3 33.2 325.7 55.8 314.3 67.1l33.9 33.9 62.1 62.1 33.9 33.9 11.3-11.3 22.6-22.6 14.5-14.5c25-25 25-65.5 0-90.5L453.3 18.7c-25-25-65.5-25-90.5 0zm-47.4 168l-144 144c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6l144-144c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6z"/></svg>');
125+
background-position: 0% 50%;
126+
background-size: 12px 12px;
127+
}
128+
129+
div.breadcrumbs {
130+
background: none;
131+
color: var(--smashed-pumpkin);
132+
font-size: 0.8rem;
133+
}
134+
135+
div.breadcrumbs a:hover, .breadcrumbs a:focus {
136+
color: var(--bloodorange);
137+
}
138+
139+
.login #container {
140+
background: var(--jasmine-rice);
141+
border: none;
142+
border-radius: 0 !important;
143+
overflow: hidden;
144+
width: 100% !important;
145+
min-width: 300px;
146+
margin: 0 auto !important;
147+
height: 100%;
148+
}
149+
150+
.login #header h1 {
151+
font-size: 72px !important;
152+
margin-left: 16px !important;
153+
}
154+
155+
div.breadcrumbs a {
156+
color: var(--trout-back);
157+
}
158+
159+
.related-widget-wrapper {
160+
display: flex;
161+
justify-content: center;
162+
align-items: center;
163+
}
164+
165+
#logout-form button {
166+
background-color: var(--jasmine-rice);
167+
color: var(--black-bean);
168+
padding-left: .75rem;
169+
padding-right: .75rem;
170+
font-size: .875rem;
171+
line-height: 1.25rem;
172+
text-transform: none;
173+
height: 36px;
174+
border-radius: 2px;
175+
}
176+
177+
#logout-form button:hover {
178+
background-color: var(--stainless);
179+
color: var(--licorice);
180+
}
181+
182+
#logout-form button:active, #logout-form button:hover {
183+
margin-bottom: 0;
184+
}
185+
186+
[multiple]:focus, [type=date]:focus, [type=datetime-local]:focus, [type=email]:focus, [type=month]:focus, [type=number]:focus, [type=password]:focus, [type=search]:focus, [type=tel]:focus, [type=text]:focus, [type=time]:focus, [type=url]:focus, [type=week]:focus, input:where(:not([type])):focus, select:focus, textarea:focus {
187+
border-color: var(--bloodorange);
188+
}

cms/templates/admin/app_list.html

Lines changed: 49 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,49 @@
1+
{% load i18n %}
2+
3+
{% if app_list %}
4+
{% for app in app_list %}
5+
<div class="app-{{ app.app_label }} module{% if app.app_url in request.path|urlencode %} current-app{% endif %}">
6+
<h3><a href="{{ app.app_url }}" class="section" title="{% blocktranslate with name=app.name %}Models in the {{ name }} application{% endblocktranslate %}">{{ app.name }}</a></h3>
7+
<table>
8+
<thead class="visually-hidden">
9+
<tr>
10+
<th scope="col">{% translate 'Model name' %}</th>
11+
<th scope="col">{% translate 'Add link' %}</th>
12+
<th scope="col">{% translate 'Change or view list link' %}</th>
13+
</tr>
14+
</thead>
15+
{% for model in app.models %}
16+
{% with model_name=model.object_name|lower %}
17+
<tr class="model-{{ model_name }}{% if model.admin_url in request.path|urlencode %} current-model{% endif %}">
18+
<th scope="row" id="{{ app.app_label }}-{{ model_name }}">
19+
{% if model.admin_url %}
20+
<a href="{{ model.admin_url }}"{% if model.admin_url in request.path|urlencode %} aria-current="page"{% endif %}>{{ model.name }}</a>
21+
{% else %}
22+
{{ model.name }}
23+
{% endif %}
24+
</th>
25+
26+
{% if model.add_url %}
27+
<td><a href="{{ model.add_url }}" class="addlink" aria-describedby="{{ app.app_label }}-{{ model_name }}">{% translate 'Add' %}</a></td>
28+
{% else %}
29+
<td></td>
30+
{% endif %}
31+
32+
{% if model.admin_url and show_changelinks %}
33+
{% if model.view_only %}
34+
<td><a href="{{ model.admin_url }}" class="viewlink" aria-describedby="{{ app.app_label }}-{{ model_name }}">{% translate 'View' %}</a></td>
35+
{% else %}
36+
<td><a href="{{ model.admin_url }}" class="changelink" aria-describedby="{{ app.app_label }}-{{ model_name }}">{% translate 'Change' %}</a></td>
37+
{% endif %}
38+
{% elif show_changelinks %}
39+
<td></td>
40+
{% endif %}
41+
</tr>
42+
{% endwith %}
43+
{% endfor %}
44+
</table>
45+
</div>
46+
{% endfor %}
47+
{% else %}
48+
<p>{% translate 'You don’t have permission to view or edit anything.' %}</p>
49+
{% endif %}

0 commit comments

Comments
 (0)