Attachment 84907 Details for Bug 22261 – Bug 22261: Revise style of DataTables menus

[patch] Bug 22261: Revise style of DataTables menus

Bug-22261-Revise-style-of-DataTables-menus.patch (text/plain), 4.80 KB, created by Katrin Fischer on 2019-02-09 19:27:12 UTC

(hide)

Description:

Filename:

MIME Type:

Creator: Katrin Fischer

Created: 2019-02-09 19:27:12 UTC

Size: 4.80 KB

patch

obsolete

>From 2779b943c7f6019ef46ce6e335653c5a17acd9f6 Mon Sep 17 00:00:00 2001
>From: Owen Leonard <oleonard@myacpl.org>
>Date: Sun, 27 Jan 2019 00:53:05 +0000
>Subject: [PATCH] Bug 22261: Revise style of DataTables menus
>
>This patch revises our custom DataTables CSS to give a more colorful
>style to the columns configuration and export menus. The primary goal of
>this change is to make it easier to tell which columns are visible and
>which are hidden.
>
>To test, apply the patch and clear your browser cache if necessary.
>
>View a table with columns configuration and export options, e.e. Tools
>-> Notices & slip. Test the DataTables menus and confirm that they work
>as expected.
>
>Signed-off-by: Liz Rea <wizzyrea@gmail.com>
>This is a nice update to the styles.
>
>Signed-off-by: Jose-Mario Monteiro-Santos <jose-mario.monteiro-santos@inLibro.com>
>
>Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
>---
> koha-tmpl/intranet-tmpl/prog/css/datatables.css    | 103 +++++++++++++++++++++
> .../prog/en/includes/columns_settings.inc          |   1 +
> 2 files changed, 104 insertions(+)
>
>diff --git a/koha-tmpl/intranet-tmpl/prog/css/datatables.css b/koha-tmpl/intranet-tmpl/prog/css/datatables.css
>index 9cd66a016c..97b756884d 100644
>--- a/koha-tmpl/intranet-tmpl/prog/css/datatables.css
>+++ b/koha-tmpl/intranet-tmpl/prog/css/datatables.css
>@@ -305,14 +305,117 @@ table.group tr.even td {
> 
> button.dt-button,
> div.dt-button,
>+a.dt-button,
> a.dt-button:link,
> a.dt-button:visited,
> a.dt-button:hover,
> a.dt-button:active {
>     color: #000;
>+    font-size: 1em;
>     margin: 3px 3px 0;
> }
> 
>+button.dt-button::before,
>+div.dt-button::before,
>+a.dt-button::before {
>+    content: '';
>+}
>+
>+button.dt-button:active:not(.disabled):hover:not(.disabled),
>+button.dt-button.active:not(.disabled):hover:not(.disabled),
>+div.dt-button:active:not(.disabled):hover:not(.disabled),
>+div.dt-button.active:not(.disabled):hover:not(.disabled),
>+a.dt-button:active:not(.disabled):hover:not(.disabled),
>+a.dt-button.active:not(.disabled):hover:not(.disabled) {
>+    background: #FFC none;
>+    border-color: #CCC;
>+    box-shadow: none;
>+    text-shadow: none;
>+}
>+
>+div.dt-button-collection {
>+    width: auto;
>+}
>+
>+div.dt-button-collection a.dt-button {
>+    background: #FFF none;
>+    border-color: #EEE;
>+    text-shadow: none;
>+}
>+
>+div.dt-button-collection a.dt-button::before {
>+    color: #CCC;
>+    content: "\f00d";
>+    display: inline-block;
>+    font-family: FontAwesome;
>+    margin-right: .5em;
>+    width: 1em;
>+}
>+
>+div.dt-button-collection a.dt-button:active:not(.disabled),
>+div.dt-button-collection a.dt-button.active:not(.disabled) {
>+    background: #E6F0F2 none;
>+    border: 1px solid #999;
>+    box-shadow: none;
>+}
>+
>+div.dt-button-collection a.dt-button:active:not(.disabled)::before,
>+div.dt-button-collection a.dt-button.active:not(.disabled)::before {
>+    color:  #538200;
>+    content: "\f00c";
>+    display: inline-block;
>+    font-family: FontAwesome;
>+    margin-right: .5em;
>+    width: 1em;
>+}
>+
>+div.dt-button-collection a.dt-button:not(.disabled):hover,
>+div.dt-button-collection a.dt-button.active:not(.disabled):hover {
>+    box-shadow: none;
>+    border: 1px solid #999;
>+    background: #FFC none;
>+}
>+
>+
>+div.dt-button-collection a.dt-button:not(.disabled)::before,
>+div.dt-button-collection a.dt-button.active:not(.disabled):hover::before {
>+    color:  #CC0000;
>+    content: "\f00d";
>+    display: inline-block;
>+    font-family: FontAwesome;
>+    margin-right: .5em;
>+    width: 1em;
>+}
>+
>+div.dt-button-collection a.dt-button.buttons-html5:not(.disabled)::before {
>+    color: #222BAC;
>+    display: inline-block;
>+    font-family: FontAwesome;
>+    margin-right: .5em;
>+    width: 1em;
>+}
>+
>+div.dt-button-collection a.dt-button.buttons-excel:not(.disabled)::before {
>+    content: "\f1c3";
>+}
>+
>+div.dt-button-collection a.dt-button.buttons-csv:not(.disabled)::before {
>+    content: "\f0ce";
>+}
>+
>+div.dt-button-collection a.dt-button.buttons-copy:not(.disabled)::before {
>+    content: "\f0c5";
>+}
>+
>+div.dt-button-collection a.dt-button.buttons-print:not(.disabled)::before {
>+    color:  #222BAC;
>+    content: "\f02f";
>+    display: inline-block;
>+    font-family: FontAwesome;
>+    margin-right: .5em;
>+    width: 1em;
>+}
>+
> .dt-button-text {
>     display: none;
> }
>diff --git a/koha-tmpl/intranet-tmpl/prog/en/includes/columns_settings.inc b/koha-tmpl/intranet-tmpl/prog/en/includes/columns_settings.inc
>index a0989a3a3e..e9461f353b 100644
>--- a/koha-tmpl/intranet-tmpl/prog/en/includes/columns_settings.inc
>+++ b/koha-tmpl/intranet-tmpl/prog/en/includes/columns_settings.inc
>@@ -72,6 +72,7 @@ function KohaTable(id_selector, dt_parameters, columns_settings, add_filters) {
>         },
>         {
>             extend: 'collection',
>+            autoClose: true,
>             fade: 100,
>             className: "export_controls",
>             titleAttr: _("Export or print"),
>-- 
>2.11.0

Actions: View | Diff | Splinter Review

Attachments on bug 22261: 84636 | 84750 | 84856 | 84893 | 84907