Comments (4)
Thanks for sharing @carderm! I still had issues with it, so I made a fix without fork. With django-admin-shortcuts
normally installed, add these two files:
templates/admin/base_site.html
{# FIXME: This is a workaround to https://github.com/alesdotio/django-admin-shortcuts/issues/34 #}
{# It consists in a merge of both conflicting base_site.html #}
{% extends "admin/base.html" %}
{% load i18n static admin_style_tags admin_shortcuts_tags %}
{% block extrastyle %}
{{ block.super }}
{% include 'admin/inc/extrastyle.html' %}
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/solid.css" integrity="sha384-QokYePQSOwpBDuhlHOsX0ymF6R/vLk/UQVz3WHa6wygxI5oGTmDTv8wahFOSspdm" crossorigin="anonymous">
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.1/css/fontawesome.css" integrity="sha384-vd1e11sR28tEK9YANUtpIOdjGW14pS87bUBuOIoBILVWLFnS+MCX9T6MMf0VdPGq" crossorigin="anonymous">
<style type="text/css">{% admin_shortcuts_css %}</style>
{% endblock %}
{% block extrahead %}
{{ block.super }}
<meta name="viewport" content="width=device-width,initial-scale=1" />
<link rel="stylesheet" type="text/css" href="{% static 'djangocms_admin_style/css/djangocms-admin.css' %}" />
{% if request.user.is_superuser %}{% render_update_notification %}{% endif %}
<script src="{% static 'djangocms_admin_style/js/dist/bundle.adminstyle.min.js' %}"></script>
{% include 'admin/inc/extrahead.html' %}
{% admin_shortcuts_js %}
{% endblock %}
{% block title %}{% include 'admin/inc/title.html' %}{% endblock %}
{% block bodyclass %}{{ block.super }} djangocms-admin-style{% endblock %}
{% block branding %}{% include 'admin/inc/branding.html' %}{% endblock %}
{% block userlinks %}{% include 'admin/inc/userlinks.html' %}{{ block.super }}{% endblock %}
{% block nav-global %}
{% block admin_shortcuts %}
</div> {# this closes the #header div #}
<div class="admin_shortcuts">
{% admin_shortcuts %}
{# </div> don't close this one, because it's closed in base.html #}
{% endblock %}
{% endblock %}
templates/admin_shortcuts/base.css
{% block main %}{% endblock %}
{% block count %}{% endblock %}
{% block advanced %}{% endblock %}
{% block icons %}{% endblock %}
.admin_shortcuts .shortcuts li a .icon {
position: static;
color: inherit;
}
.admin_shortcuts .shortcuts li a .icon i {
font-size: inherit;
}
from django-admin-shortcuts.
Thanks @BertrandBordage - do you think this could be merged as a pull request to resolve the issues?
from django-admin-shortcuts.
I'm not sure it's that simple, as this module needs to support the builtin Django admin as well as django-cms-admin-style…
If we put these changes in a PR, django-admin-shortcuts would only work with django-cms-admin-style.
from django-admin-shortcuts.
Starting djangocms-admin-style v3.2.1 it does not work because they removed support for shortcuts https://github.com/django-cms/djangocms-admin-style/blob/d2055f107d2ac0b1e30460ff84f83cfa52087fd5/djangocms_admin_style/sass/djangocms-admin.scss#L31.
Here you can compare changes between 3.2.0 and 3.2.1
What I did instead is took content from components/shortcuts.scss
and converted it manually from scss to css.
Here is my scss which I converted (pay attention that I just added some variable and commented %icon function)
//##############################################################################
// DJANGO ADMIN SHORTCUTS
$toolbar-height: 46px; // has to be even number
$gray-lighter: var(--dca-gray-lighter); //lighten($gray, 46.5%); // #ddd
$gray-light: var(--dca-gray-light); // // #999
$gray-darkest: var(--dca-gray-darkest); // // #333
$font-size-large: 16px;
$color-primary: var(--dca-primary);
$white: var(--dca-white);
$gray: var(--dca-gray); // lighten(#000, 40%); // #666;
$color-primary-light: rgba($color-primary, 30%);
.admin_shortcuts {
max-width: 900px;
margin: $toolbar-height 35% 0 3%;
border-bottom: solid 1px $gray-lighter;
+ #content {
margin-top: 60px !important;
}
.shortcuts {
color: $gray-light;
padding: 10px !important;
background-color: transparent !important;
border: 0 !important;
box-shadow: none;
h2 {
color: $gray-darkest;
font-weight: bold !important;
font-size: $font-size-large;
border: 0;
}
li {
a,
a:link,
a:visited,
a:active {
color: $color-primary !important;
text-decoration: none;
min-height: 20px;
padding: 5px 10px;
border: 1px solid $gray-lighter;
background-color: $white;
box-shadow: none;
.count {
color: $gray;
}
.count_new {
border-color: $color-primary;
background: $color-primary;
}
.title {
vertical-align: middle;
text-shadow: none;
padding-right: 5px;
padding-left: 5px;
}
}
a:hover,
a:focus {
color: $color-primary-light !important;
background-color: $color-primary;
}
a:before {
font-size: 30px;
margin-right: 0;
}
// replaces shortcut link images with icon font #199
.archive {
// @include icon(archive);
}
.back {
// @include icon(reply);
}
.basket {
// @include icon(shopping-cart);
}
.blog {
// @include icon(comment);
}
.camera {
// @include icon(camera);
}
.card {
// @include icon(credit-card);
}
.cash {
// @include icon(money);
}
.certificate {
// @include icon(certificate);
}
.clock {
// @include icon(clock);
}
.cloud1 {
// @include icon(cloud);
}
.cloud2 {
// @include icon(cloud-upload);
}
.cloud3 {
// @include icon(cloud-download);
}
.cloud4 {
// @include icon(refresh);
}
.config {
// @include icon(cog);
}
.config2 {
// @include icon(cog);
}
.date {
// @include icon(calendar);
}
.delivery1 {
// @include icon(envelope-square);
}
.delivery2 {
// @include icon(envelope);
}
.diskette {
// @include icon(floppy-o);
}
.file1 {
// @include icon(file);
}
.file2 {
// @include icon(files-o);
}
.film {
// @include icon(film);
}
.flag {
// @include icon(flag);
}
.folder {
// @include icon(folder-open);
}
.gamepad {
// @include icon(gamepad);
}
.garbage {
// @include icon(trash);
}
.gift {
// @include icon(gift);
}
.help {
// @include icon(life-ring);
}
.home {
// @include icon(home);
}
.key {
// @include icon(key);
}
.less {
// @include icon(minus-circle);
}
.letter {
// @include icon(file-text);
}
.letters {
// @include icon(newspaper-o);
}
.light {
// @include icon(lightbulb-o);
}
.lock {
// @include icon(lock);
}
.love {
// @include icon(heart);
}
.mail {
// @include icon(envelope);
}
.monitor {
// @include icon(desktop);
}
.music {
// @include icon(music);
}
.note {
// @include icon(file-text);
}
.notepad {
// @include icon(file-text);
}
.ok {
// @include icon(check);
}
.package {
// @include icon(cube);
}
.pencil {
// @include icon(pencil);
}
.phone {
// @include icon(mobile);
}
.picture {
// @include icon(picture-o);
}
.pin {
// @include icon(map-marker);
}
.plus {
// @include icon(plus-circle);
}
.print {
// @include icon(print);
}
.sound {
// @include icon(volume-up);
}
.suitcase {
// @include icon(suitcase);
}
.tag {
// @include icon(tag);
}
.ticket {
// @include icon(ticket);
}
.tool {
// @include icon(wrench);
}
.unlock {
// @include icon(unlock-alt);
}
.user {
// @include icon(user);
}
.warning {
// @include icon(exclamation-triangle);
}
.zoom {
// @include icon(search-plus);
}
}
}
}
And here what I get after converting it:
.admin_shortcuts {
max-width: 900px;
margin: 46px 35% 0 3%;
border-bottom: solid 1px var(--dca-gray-lighter);
}
.admin_shortcuts + #content {
margin-top: 60px !important;
}
.admin_shortcuts .shortcuts {
color: var(--dca-gray-light);
padding: 10px !important;
background-color: transparent !important;
border: 0 !important;
box-shadow: none;
}
.admin_shortcuts .shortcuts h2 {
color: var(--dca-gray-darkest);
font-weight: bold !important;
font-size: 16px;
border: 0;
}
.admin_shortcuts .shortcuts li a, .admin_shortcuts .shortcuts li a:link, .admin_shortcuts .shortcuts li a:visited, .admin_shortcuts .shortcuts li a:active {
color: var(--dca-primary) !important;
text-decoration: none;
min-height: 20px;
padding: 5px 10px;
border: 1px solid var(--dca-gray-lighter);
background-color: var(--dca-white);
box-shadow: none;
}
.admin_shortcuts .shortcuts li a .count, .admin_shortcuts .shortcuts li a:link .count, .admin_shortcuts .shortcuts li a:visited .count, .admin_shortcuts .shortcuts li a:active .count {
color: var(--dca-gray);
}
.admin_shortcuts .shortcuts li a .count_new, .admin_shortcuts .shortcuts li a:link .count_new, .admin_shortcuts .shortcuts li a:visited .count_new, .admin_shortcuts .shortcuts li a:active .count_new {
border-color: var(--dca-primary);
background: var(--dca-primary);
}
.admin_shortcuts .shortcuts li a .title, .admin_shortcuts .shortcuts li a:link .title, .admin_shortcuts .shortcuts li a:visited .title, .admin_shortcuts .shortcuts li a:active .title {
vertical-align: middle;
text-shadow: none;
padding-right: 5px;
padding-left: 5px;
}
.admin_shortcuts .shortcuts li a:hover, .admin_shortcuts .shortcuts li a:focus {
color: rgba(0, 30, 0, ) !important;
background-color: var(--dca-primary);
}
.admin_shortcuts .shortcuts li a:before {
font-size: 30px;
margin-right: 0;
}
Then I placed it after a line <link rel="stylesheet" type="text/css" href="{% static 'djangocms_admin_style/css/djangocms-admin.css' %}" />
as a <style>
HTML tag.
from django-admin-shortcuts.
Related Issues (20)
- Customizing the icons
- Index only HOT 4
- Usage of ``count`` and ``count_new`` at the same time. HOT 1
- 'str' object does not support item assignment on admin_shortcuts/templates/admin/index.html HOT 1
- How to set Count and Count new HOT 2
- caching
- (enhancement) extending django-admin-shortcuts to all app pages in admin HOT 4
- Solution regarding compatibility issue with django-admin-interface
- The right way to extend index.html HOT 2
- Django 1.3: 'admin_static' is not a valid tag library HOT 1
- Django 2 HOT 3
- Python 3.4: Type str doesn't support the buffer API HOT 1
- Doesn't work with Grappelli HOT 5
- Allow no icons & remove external icon resources
- rtl support
- icon alignment
- 'admin_shortcuts_tags' is not a valid tag library: ImportError raised loading admin_shortcuts.templatetags.admin_shortcuts_tags: No module named importlib HOT 5
- KeyError Context HOT 5
- KeyError at /admin/ HOT 3
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from django-admin-shortcuts.