Briq/django-admin-interface
8
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add collapsible inlines support. (#282)

Browse Source 
* Improve code formatting.

* Add collapsible inlines frontend support.

* Add collapsible inlines options fields to model and admin.

* Add option classes to body.

* Update translations.

* Update README.md
This commit is contained in:
Fabio Caccamo
2023-05-11 01:33:35 +02:00
committed by GitHub
parent a8897a942d
commit a48575e047
17 changed files with 322 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
admin_interface/static/admin_interface/collapsible-inlines/collapsible-inlines.js
+45
View File
@@ -0,0 +1,45 @@
/** global: django */
if (typeof(django) !== 'undefined' && typeof(django.jQuery) !== 'undefined')
{
(function($) {
$(document).ready(function(){
function collapsibleInline(scope, collapsed) {
var fieldsetCollapsed = collapsed;
var fieldsetEl = $(scope).find('> fieldset.module');
fieldsetEl.addClass('collapse');
var fieldsetHasErrors = (fieldsetEl.children('.errors').length > 0);
if (fieldsetHasErrors === true) {
fieldsetCollapsed = false;
}
if (fieldsetCollapsed === true) {
fieldsetEl.addClass('collapsed');
}
var collapseToggleText = (fieldsetCollapsed ? gettext('Show') : gettext('Hide'));
var collapseToggleHTML = ' (<a class="collapse-toggle" href="#">' + collapseToggleText + '</a>)';
var headerEl = fieldsetEl.find('> h2,> h3');
headerEl.append(collapseToggleHTML);
}
var stackedInlinesOptionSel = '.admin-interface.collapsible-stacked-inlines';
var stackedInlinesSel = stackedInlinesOptionSel + ' .inline-group[data-inline-type="stacked"]';
var stackedInlinesCollapsed = $(stackedInlinesOptionSel).hasClass('collapsible-stacked-inlines-collapsed');
var tabularInlinesOptionSel = '.admin-interface.collapsible-tabular-inlines';
var tabularInlinesSel = tabularInlinesOptionSel + ' .inline-group[data-inline-type="tabular"] .inline-related.tabular';
var tabularInlinesCollapsed = $(stackedInlinesOptionSel).hasClass('collapsible-tabular-inlines-collapsed');
$(stackedInlinesSel).each(function() {
collapsibleInline(this, stackedInlinesCollapsed);
});
$(tabularInlinesSel).each(function() {
collapsibleInline(this, tabularInlinesCollapsed);
});
});
})(django.jQuery);
}
admin_interface/static/admin_interface/css/admin-interface-fix.css
+3 -1
View File
@@ -121,7 +121,9 @@
}
.admin-interface fieldset.collapse.collapsed a.collapse-toggle,
.admin-interface fieldset.collapse a.collapse-toggle {
.admin-interface fieldset.collapse a.collapse-toggle,
.admin-interface .inline-group .inline-related fieldset.module a.collapse-toggle,
.admin-interface .inline-group .inline-related fieldset.module.collapsed a.collapse-toggle {
font-weight: normal;
text-transform: lowercase;
font-size: 12px;
admin_interface/static/admin_interface/css/admin-interface.css
+11 -11
View File
@@ -192,21 +192,21 @@
color: var(--admin-interface-module-link-hover-color);
}
.admin-interface fieldset.collapse.collapsed a.collapse-toggle {
color: var(--admin-interface-module-link-color);
}
.admin-interface fieldset.collapse.collapsed a.collapse-toggle:hover,
.admin-interface fieldset.collapse.collapsed a.collapse-toggle:active {
color: var(--admin-interface-module-link-hover-color);
}
.admin-interface fieldset.collapse a.collapse-toggle {
.admin-interface fieldset.collapse a.collapse-toggle,
.admin-interface fieldset.collapse.collapsed a.collapse-toggle,
.admin-interface .inline-group .inline-related fieldset.module a.collapse-toggle,
.admin-interface .inline-group .inline-related fieldset.module.collapsed a.collapse-toggle {
color: var(--admin-interface-module-link-color);
}
.admin-interface fieldset.collapse a.collapse-toggle:hover,
.admin-interface fieldset.collapse a.collapse-toggle:active {
.admin-interface fieldset.collapse a.collapse-toggle:active,
.admin-interface fieldset.collapse.collapsed a.collapse-toggle:hover,
.admin-interface fieldset.collapse.collapsed a.collapse-toggle:active,
.admin-interface .inline-group .inline-related fieldset.module a.collapse-toggle:hover,
.admin-interface .inline-group .inline-related fieldset.module a.collapse-toggle:active,
.admin-interface .inline-group .inline-related fieldset.module.collapsed a.collapse-toggle:hover,
.admin-interface .inline-group .inline-related fieldset.module.collapsed a.collapse-toggle:active {
color: var(--admin-interface-module-link-hover-color);
}