From 58e05b2eb6381fbda8d9175baf95a212d4f2b019 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?"J.=20Rene=CC=81e=20Beach"?= Date: Fri, 9 Nov 2012 10:15:06 -0500 Subject: [PATCH] Issue #1137920 by jessebeach, benjifisher, nod_, sjbassett, kathryn531: Fix toolbar on small screen sizes and redesign toolbar for desktop MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: J. ReneĢe Beach --- core/misc/debounce.js | 28 ++ core/modules/shortcut/shortcut.base.css | 14 - core/modules/shortcut/shortcut.module | 42 ++- core/modules/shortcut/shortcut.theme.css | 72 ++-- core/modules/system/system.module | 14 +- .../modules/toolbar/config/toolbar.breakpoints.yml | 1 + core/modules/toolbar/config/toolbar.config.yml | 2 + core/modules/toolbar/css/interactivemenu.css | 46 +++ core/modules/toolbar/css/toolbar.base-rtl.css | 25 ++ core/modules/toolbar/css/toolbar.base.css | 185 ++++++++++ core/modules/toolbar/css/toolbar.icons.css | 79 ++++ core/modules/toolbar/css/toolbar.theme-rtl.css | 7 + core/modules/toolbar/css/toolbar.theme.css | 250 +++++++++++++ core/modules/toolbar/js/interactivemenu.js | 130 +++++++ core/modules/toolbar/js/toolbar.js | 258 +++++++++++++ core/modules/toolbar/templates/toolbar.tpl.php | 17 +- core/modules/toolbar/toolbar-rtl.css | 37 -- core/modules/toolbar/toolbar.api.php | 97 +++++ core/modules/toolbar/toolbar.css | 129 ------- core/modules/toolbar/toolbar.info | 5 + core/modules/toolbar/toolbar.js | 115 ------ core/modules/toolbar/toolbar.module | 381 ++++++++++---------- core/modules/user/user.css | 12 +- core/modules/user/user.module | 67 ++++ 24 files changed, 1447 insertions(+), 566 deletions(-) create mode 100644 core/misc/debounce.js create mode 100644 core/modules/toolbar/config/toolbar.breakpoints.yml create mode 100644 core/modules/toolbar/config/toolbar.config.yml create mode 100644 core/modules/toolbar/css/interactivemenu.css create mode 100644 core/modules/toolbar/css/toolbar.base-rtl.css create mode 100644 core/modules/toolbar/css/toolbar.base.css create mode 100644 core/modules/toolbar/css/toolbar.icons.css create mode 100644 core/modules/toolbar/css/toolbar.theme-rtl.css create mode 100644 core/modules/toolbar/css/toolbar.theme.css create mode 100644 core/modules/toolbar/js/interactivemenu.js create mode 100644 core/modules/toolbar/js/toolbar.js delete mode 100644 core/modules/toolbar/toolbar-rtl.css create mode 100644 core/modules/toolbar/toolbar.api.php delete mode 100644 core/modules/toolbar/toolbar.css delete mode 100644 core/modules/toolbar/toolbar.js diff --git a/core/misc/debounce.js b/core/misc/debounce.js new file mode 100644 index 0000000..523b402 --- /dev/null +++ b/core/misc/debounce.js @@ -0,0 +1,28 @@ +/** + * Limits the invocations of a function in a given time frame. + * + * @param {Function} callback + * The function to be invoked. + * + * @param {Number} wait + * The time period within which the callback function should only be + * invoked once. For example if the wait period is 250ms, then the callback + * will only be called at most 4 times per second. + */ +Drupal.debounce = function (callback, wait) { + + "use strict"; + + var timeout, result; + return function () { + var context = this; + var args = arguments; + var later = function () { + timeout = null; + result = callback.apply(context, args); + }; + window.clearTimeout(timeout); + timeout = window.setTimeout(later, wait); + return result; + }; +}; diff --git a/core/modules/shortcut/shortcut.base.css b/core/modules/shortcut/shortcut.base.css index 90a1046..aca7807 100644 --- a/core/modules/shortcut/shortcut.base.css +++ b/core/modules/shortcut/shortcut.base.css @@ -1,23 +1,9 @@ - /** * @file * Generic base styles for shortcut module. */ /** - * Toolbar. - */ -#edit-shortcuts { - float: right; /* LTR */ -} -#shortcut-toolbar ul { - float: left; /* LTR */ -} -#shortcut-toolbar .icon { - float: left; /* LTR */ -} - -/** * Add/remove links. */ .add-or-remove-shortcuts .icon { diff --git a/core/modules/shortcut/shortcut.module b/core/modules/shortcut/shortcut.module index 9bbb12a..20fd405 100644 --- a/core/modules/shortcut/shortcut.module +++ b/core/modules/shortcut/shortcut.module @@ -713,18 +713,27 @@ function shortcut_preprocess_page(&$variables) { } /** - * Implements hook_page_alter(). - */ -function shortcut_page_alter(&$page) { - if (isset($page['page_top']['toolbar'])) { - // If the toolbar is available, add a pre-render function to display the - // current shortcuts in the toolbar drawer. - $page['page_top']['toolbar']['#pre_render'][] = 'shortcut_toolbar_pre_render'; - } + * Implements hook_toolbar(). + */ +function shortcut_toolbar() { + $items['shortcuts'] = array( + 'tab' => array( + 'title' => t('Shortcuts'), + 'href' => 'admin/config/user-interface/shortcut', + 'html' => FALSE, + 'attributes' => array( + 'title' => t('Shortcuts'), + ), + ), + 'tray' => array( + '#pre_render' => array('shortcut_toolbar_pre_render'), + ), + ); + return $items; } /** - * Pre-render function for adding shortcuts to the toolbar drawer. + * Pre-render function for adding shortcuts to the toolbar. */ function shortcut_toolbar_pre_render($toolbar) { $links = shortcut_renderable_links(); @@ -734,8 +743,6 @@ function shortcut_toolbar_pre_render($toolbar) { drupal_get_path('module', 'shortcut') . '/shortcut.theme.css', ), ); - $links['#prefix'] = '
'; - $links['#suffix'] = '
'; $shortcut_set = shortcut_current_displayed_set(); $configure_link = NULL; if (shortcut_set_edit_access($shortcut_set)) { @@ -747,13 +754,18 @@ function shortcut_toolbar_pre_render($toolbar) { ); } - $drawer = array( - 'shortcuts' => $links, + $links_wrapper = array( + 'shortcuts' => array( + '#type' => 'container', + '#attributes' => array( + 'class' => array('toolbar-list'), + ), + 'links' => $links, + ), 'configure' => $configure_link, ); - $toolbar['toolbar_drawer'][] = $drawer; - return $toolbar; + return $links_wrapper; } /** diff --git a/core/modules/shortcut/shortcut.theme.css b/core/modules/shortcut/shortcut.theme.css index 9e2dc69..71d02a3 100644 --- a/core/modules/shortcut/shortcut.theme.css +++ b/core/modules/shortcut/shortcut.theme.css @@ -1,49 +1,9 @@ - /** * @file * Styling for the shortcut module. */ /** - * Toolbar. - */ -.toolbar #edit-shortcuts { - line-height: 24px; - padding: 5px 10px; -} -#edit-shortcuts:focus, -#edit-shortcuts:hover, -#edit-shortcuts.active { - text-decoration: underline; -} -#shortcut-toolbar ul { - line-height: 24px; - margin-left: 5px; /* LTR */ - padding: 5px 0; -} -#shortcut-toolbar a { - border-radius: 5px; - margin-right: 5px; /* LTR */ - padding: 0 5px; -} -#shortcut-toolbar a:focus, -#shortcut-toolbar a:hover, -#shortcut-toolbar a.active:focus { - background: #555; -} -#shortcut-toolbar a.active:hover, -#shortcut-toolbar a.active { - background-color: #000; -} -#shortcut-toolbar .icon { - background-color: #444; - border-radius: 5px; - height: 30px; - margin-right: 5px; /* LTR */ - width: 30px; -} - -/** * Add/remove links. */ .add-or-remove-shortcuts .icon { @@ -65,15 +25,27 @@ .remove-shortcut a:hover .icon { background-position: -12px -12px; /* LTR */ } -.add-or-remove-shortcuts .text { - padding: 0 6px 0 10px; /* LTR */ + +/** + * Toolbar icon. + */ +.toolbar-main .shortcuts .tab { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iNDkuOTk5NSIgeTE9IjQuNTQ1NCIgeDI9IjQ5Ljk5OTUiIHkyPSIxMDQuNTQ1OSI+DQoJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6I0NDQ0NDQyIvPg0KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiM5OTk5OTkiLz4NCjwvbGluZWFyR3JhZGllbnQ+DQo8cG9seWdvbiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIGNsaXAtcnVsZT0iZXZlbm9kZCIgZmlsbD0idXJsKCNTVkdJRF8xXykiIHBvaW50cz0iMTMuNjM2LDAgMTMuNjM2LDEwMCA0OS42MzYsNzYuNzI3IDg2LjM2MywxMDAgDQoJODYuMzYzLDAgIi8+DQo8L3N2Zz4NCg==); +} +.toolbar-main .shortcuts .tab:active, +.toolbar-main .shortcuts.active .tab { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iNDkuOTk5NSIgeTE9Ijk2LjQ1NTEiIHgyPSI0OS45OTk1IiB5Mj0iLTMuNTQ0OSIgZ3JhZGllbnRUcmFuc2Zvcm09Im1hdHJpeCgxIDAgMCAtMSAwIDEwMSkiPg0KCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGRkZGRkYiLz4NCgk8c3RvcCAgb2Zmc2V0PSIxIiBzdHlsZT0ic3RvcC1jb2xvcjojRTVFNUU1Ii8+DQo8L2xpbmVhckdyYWRpZW50Pg0KPHBvbHlnb24gZmlsbD0idXJsKCNTVkdJRF8xXykiIHBvaW50cz0iMTMuNjM2LDAgMTMuNjM2LDEwMCA0OS42MzYsNzYuNzI3IDg2LjM2MywxMDAgODYuMzYzLDAgIi8+DQo8L3N2Zz4NCg==); +} +.toolbar-main #edit-shortcuts { + display: block; +} +.toolbar-main .vertical #edit-shortcuts { + text-align: right; + padding: 1em; } -.add-or-remove-shortcuts a:focus .text, -.add-or-remove-shortcuts a:hover .text { - background-color: #5f605b; - border-radius: 0 5px 5px 0; /* LTR */ - color: #fff; - cursor: pointer; - font-size: 10px; - line-height: 12px; +.toolbar-main .horizontal #edit-shortcuts { + border-left: 1px solid #d9d9d9; + float: left; + margin-left: 0.3333em; + padding: 1em 0.3333em 1em 0.6667em; } diff --git a/core/modules/system/system.module b/core/modules/system/system.module index 541f9bd..8e8ee24 100644 --- a/core/modules/system/system.module +++ b/core/modules/system/system.module @@ -1290,6 +1290,19 @@ function system_library_info() { ), ); + // A utility function to limit calls to a function with a given time. + $libraries['drupal.debounce'] = array( + 'title' => 'Drupal debounce', + 'version' => VERSION, + 'js' => array( + 'core/misc/debounce.js' => array('group' => JS_LIBRARY), + ), + 'dependencies' => array( + // @todo remove drupal dependency. + array('system', 'drupal'), + ), + ); + // jQuery. $libraries['jquery'] = array( 'title' => 'jQuery', @@ -1905,7 +1918,6 @@ function system_library_info() { array('system', 'jquery'), ), ); - $libraries['drupal.tableselect'] = array( 'title' => 'Tableselect', 'version' => VERSION, diff --git a/core/modules/toolbar/config/toolbar.breakpoints.yml b/core/modules/toolbar/config/toolbar.breakpoints.yml new file mode 100644 index 0000000..1acf114 --- /dev/null +++ b/core/modules/toolbar/config/toolbar.breakpoints.yml @@ -0,0 +1 @@ +wide: 'all and (min-width: 50em)' diff --git a/core/modules/toolbar/config/toolbar.config.yml b/core/modules/toolbar/config/toolbar.config.yml new file mode 100644 index 0000000..79522f0 --- /dev/null +++ b/core/modules/toolbar/config/toolbar.config.yml @@ -0,0 +1,2 @@ +breakpoints: + - 'module.toolbar.wide' diff --git a/core/modules/toolbar/css/interactivemenu.css b/core/modules/toolbar/css/interactivemenu.css new file mode 100644 index 0000000..118aae5 --- /dev/null +++ b/core/modules/toolbar/css/interactivemenu.css @@ -0,0 +1,46 @@ +/** + * Toolbar menus. + */ +.toolbar-main .menu { + list-style: none; + margin: 0; + padding: 0; +} +.toolbar-main .box { + display: block; + line-height: 1em; /* this prevents the value "normal" from being returned as the line-height */ + position: relative; + width: auto; +} +.toolbar-main .tray .interactive-menu li { + display: block; +} +.toolbar-main .horizontal .interactive-menu .handle, +.toolbar-main .horizontal .level-1 ul, +.toolbar-main .vertical .level-1 ul { + display: none; +} +.toolbar-main .vertical .open > ul { /* Show the sub-menus */ + display: block; +} +.toolbar-main .interactive-menu a { + display: block; + line-height: 1; + overflow: hidden; +} +.toolbar-main .tray .interactive-menu li a, +.toolbar-main .toolbar-list a { + display: block; +} +.toolbar-main .handle { + float: right; +} +.toolbar-main .handle:hover { + cursor: pointer; +} +.toolbar-main .horizontal .toolbar-list li { + float: left; +} +.toolbar-main .horizontal .toolbar-list li + li { + margin-left: 0.5em; /* LTR */ +} diff --git a/core/modules/toolbar/css/toolbar.base-rtl.css b/core/modules/toolbar/css/toolbar.base-rtl.css new file mode 100644 index 0000000..00e0669 --- /dev/null +++ b/core/modules/toolbar/css/toolbar.base-rtl.css @@ -0,0 +1,25 @@ +.toolbar-main, +.toolbar-main * { + text-align: right; +} +.toolbar-main ul li { + float: right; +} +.toolbar-main ul li a { + display: inline-block; + float: none; + zoom: 1; +} +.toolbar-main-user { + float: left; +} +.toolbar-main .toolbar-main-user li { + float: none; + display: inline; +} +.toolbar-main-menu { + float: none; +} +.toolbar-main-home { + float: right; +} diff --git a/core/modules/toolbar/css/toolbar.base.css b/core/modules/toolbar/css/toolbar.base.css new file mode 100644 index 0000000..08481df --- /dev/null +++ b/core/modules/toolbar/css/toolbar.base.css @@ -0,0 +1,185 @@ +/** + * @file toolbar.admin.css + * + * + * Aggressive resets so we can achieve a consistent look in hostile CSS + * environments. + */ +body.toolbar-tray-open { + -moz-box-sizing: border-box; + -o-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; +} +.toolbar-main, +.toolbar-main * { + -moz-box-sizing: border-box; + -o-box-sizing: border-box; + -webkit-box-sizing: border-box; + box-sizing: border-box; + margin: 0; + outline: 0; + padding: 0; + vertical-align: baseline; +} +.toolbar-main { + font-size: 100%; + line-height: 1; +} +/* These are scoped to .toolbar and not .toolbar-main because Internet Explorer +doesn't paint the list items correctly on load when scoped to the dynamic +class .toolbar-main */ +.toolbar li, +.toolbar .menu li, +.toolbar .item-list, +.toolbar .item-list li, +.toolbar .menu li.expanded { + list-style-type: none; + list-style-image: none; +} +.toolbar-main .menu li { + padding-top: 0; +} +/** + * Administration menu. + */ +.toolbar-main .bar { + left: 0; + position: absolute; + right: 0; + top: 0; + z-index: 750; +} +.toolbar-main .bar li { + display: block; +} +.toolbar-main .bar a { + display: block; +} +@media screen and (min-width: 16.5em) { + .toolbar-main .bar li { + float: left; /* LTR */ + } +} +@media screen and (min-width: 28.125em) { + .toolbar-main .bar { + position: fixed; + } +} +/** + * Toolbar tray. + */ +.toolbar-main .tray { + display: none; + position: absolute; + width: 100%; + z-index: 250; +} +.toolbar-main .vertical { + left: -100%; + position: absolute; +} +.toolbar-main .horizontal { + left: 0; /* LTR */ + height: 0; + z-index: 750; +} +.toolar-main .tray .lining { + position: relative; +} +.toolbar-main .vertical > .lining { + left: -100%; /* LTR */ + min-height: 100%; + position: absolute; + width: 100%; +} +.toolbar-main .vertical > .lining > .edge { + display: none; +} +.toolbar-main .tray.active { + display: block; +} +.toolbar-main .horizontal.active { + height: auto; +} +.toolbar-main .tray.vertical.active, +.toolbar-main .tray.vertical.active > .lining { + left: 0; /* LTR */ +} +@media screen and (min-width: 16.5em) { + .toolbar-main .vertical { + bottom: 0; + } + .toolbar-main .vertical, + .toolbar-main .vertical > .lining > .edge { + width: 240px; + width: 15rem; + } + .toolbar-main .vertical.active > .lining > .edge { + display: block; + height: 100%; + left: 1px; + /* Support for devices that do not support position fixed. */ + position: absolute; + position: fixed; + top: 0; + z-index: -1; + } +} +@media screen and (min-width: 28.125em) { + .toolbar-main .horizontal { + position: fixed; + } +} +/** + * At larger screen sizes, the tray pushes the page content + * using padding instead of left. + */ +@media screen and (min-width: 28.125em) { + body.toolbar-tray-open.toolbar-vertical { + padding-left: 240px; + padding-left: 15rem; + } +} +/** + * ToolBar icons. + */ +.toolbar-main .bar .tab, +.toolbar-main .bar .active .tab, +.toolbar-main .bar .tab:active, +.toolbar-main .level-1 > .box > a { + background-attachment: scroll; + background-color: transparent; + background-image: none; + background-position: -999em -999em; + background-repeat: no-repeat; +} +/** + * ToolBar tray orientation toggle. + */ +.toolbar-main .toggle-orientation { + display: none; +} +.toolbar-main .horizontal .toggle-orientation { + bottom: 0; + position: absolute; + right: 0; + top: 0; +} +.toolbar-main .vertical .toggle-orientation { + float: right; + width: 100%; +} +@media screen and (min-width: 16.5em) { + .toolbar-main .toggle-orientation { + display: block; + } + .toolbar-main .administration .toggle-orientation { + display: none; + } +} +@media screen and (min-width: 28.125em) { + .toolbar-main .administration .toggle-orientation { + display: block; + } +} diff --git a/core/modules/toolbar/css/toolbar.icons.css b/core/modules/toolbar/css/toolbar.icons.css new file mode 100644 index 0000000..6293a4f --- /dev/null +++ b/core/modules/toolbar/css/toolbar.icons.css @@ -0,0 +1,79 @@ +/** + * @file toolbar.icons.css + */ + +@media screen and (min-width: 16.5em) { + .toolbar-main .bar .tab, + .toolbar-main .bar .active .tab, + .toolbar-main .bar .tab:active, + .toolbar-main .level-1 > .box > a { + background-size: 1.75em 1.75em; + } + .toolbar-main .bar .tab, + .toolbar-main .bar .active .tab, + .toolbar-main .bar .tab:active { + background-position: center center; + text-indent: -9999px; /* LTR */ + width: 3em; + } + .toolbar-main .level-1 > .box > a { + background-position: 0.4545em center; + padding-left: 2.5em; + } + .toolbar-main .level-1 > ul { + margin-left: 2.3333em; + } + /* ToolBar bar icons. */ + .toolbar-main .bar .home .tab { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iNDkuOTk5NSIgeTE9IjYiIHgyPSI0OS45OTk1IiB5Mj0iOTIuNjIyMyI+DQoJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6I0NDQ0NDQyIvPg0KCTxzdG9wICBvZmZzZXQ9IjEiIHN0eWxlPSJzdG9wLWNvbG9yOiM5OTk5OTkiLz4NCjwvbGluZWFyR3JhZGllbnQ+DQo8cG9seWdvbiBmaWxsPSJ1cmwoI1NWR0lEXzFfKSIgcG9pbnRzPSI4Mi4wMDEsMzguODg0IDgyLjAwMSwxNS4wNzYgNjcuOTk5LDE1LjA3NiA2Ny45OTksMjQuNTAxIDUwLDYgMCw1Ny4zODMgMTIsNTcuMzgzIA0KCTEyLDkwLjYxNSA0Myw5MC42MTUgNDMsNjMuNDIyIDU3LjAwMSw2My40MjIgNTcuMDAxLDkwLjYxNSA4Ny45OTksOTAuNjE1IDg3Ljk5OSw1Ny4zODMgMTAwLDU3LjM4MyAiLz4NCjwvc3ZnPg0K); + } + .toolbar-main .bar .home .tab:active { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iNTAiIHkxPSI5NSIgeDI9IjUwIiB5Mj0iOC4zNzc3IiBncmFkaWVudFRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIC0xIDAgMTAxKSI+DQoJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6I0ZGRkZGRiIvPg0KCTxzdG9wICBvZmZzZXQ9IjAuOTk1MSIgc3R5bGU9InN0b3AtY29sb3I6I0U1RTVFNSIvPg0KPC9saW5lYXJHcmFkaWVudD4NCjxwb2x5Z29uIGZpbGw9InVybCgjU1ZHSURfMV8pIiBwb2ludHM9IjgyLjAwMSwzOC44ODQgODIuMDAxLDE1LjA3NiA2Ny45OTksMTUuMDc2IDY3Ljk5OSwyNC41MDEgNTAsNiAwLDU3LjM4MyAxMiw1Ny4zODMgDQoJMTIsOTAuNjE1IDQzLDkwLjYxNSA0Myw2My40MjIgNTcuMDAxLDYzLjQyMiA1Ny4wMDEsOTAuNjE1IDg3Ljk5OSw5MC42MTUgODcuOTk5LDU3LjM4MyAxMDAsNTcuMzgzICIvPg0KPC9zdmc+DQo=); + } + .toolbar-main .bar .administration .tab { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iNDkuOTk5NSIgeTE9IjUiIHgyPSI0OS45OTk1IiB5Mj0iOTQuMDEyNiI+DQoJCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNDQ0NDQ0MiLz4NCgkJPHN0b3AgIG9mZnNldD0iMSIgc3R5bGU9InN0b3AtY29sb3I6Izk5OTk5OSIvPg0KCTwvbGluZWFyR3JhZGllbnQ+DQoJPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9InVybCgjU1ZHSURfMV8pIiBkPSJNMCw3Ni43Mjh2MTguMTgyaDEwMFY3Ni43MjhIMHogTTAsNHYxOC4xODJoMTAwVjRIMHoNCgkJIE0wLDQwLjM2M3YxOC4xODNoMTAwVjQwLjM2M0gweiIvPg0KPC9nPg0KPC9zdmc+DQo=); + } + .toolbar-main .bar .administration .tab:active, + .toolbar-main .bar .administration.active .tab { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iNDkuOTk5NSIgeTE9IjUiIHgyPSI0OS45OTk1IiB5Mj0iOTQuMDEyNiI+DQoJCTxzdG9wICBvZmZzZXQ9IjAiIHN0eWxlPSJzdG9wLWNvbG9yOiNGRkZGRkYiLz4NCgkJPHN0b3AgIG9mZnNldD0iMSIgc3R5bGU9InN0b3AtY29sb3I6I0U1RTVFNSIvPg0KCTwvbGluZWFyR3JhZGllbnQ+DQoJPHBhdGggZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIGZpbGw9InVybCgjU1ZHSURfMV8pIiBkPSJNMCw3Ni43Mjh2MTguMTgyaDEwMFY3Ni43MjhIMHogTTAsNHYxOC4xODJoMTAwVjRIMHoNCgkJIE0wLDQwLjM2M3YxOC4xODNoMTAwVjQwLjM2M0gweiIvPg0KPC9nPg0KPC9zdmc+DQo=); + } + /* Main menu icons. */ + .toolbar-main #toolbar-link-admin-dashboard { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiM3Nzc3NzciIGQ9Ik05NC44MjUsNDAuNDU2aC03LjU3NmMtMC45MDgtMy42MzQtMi4zMzMtNy4wNjItNC4xOS0xMC4yMDVsNS4zMzItNS4zMzINCgljMS45NTItMS45NTIsMi4zMjgtNC43NDIsMC44MzgtNi4yMzJsLTguMDktOC4wOTFjLTEuNDktMS40ODktNC4yODEtMS4xMTQtNi4yMzIsMC44MzlsLTUuMjg5LDUuMjg4DQoJYy0zLjE1Mi0xLjg4OC02LjU5Ni0zLjM0LTEwLjI0OS00LjI3VjVjMC0yLjc2MS0xLjcwNy01LTMuODEzLTVINDQuMTEyYy0yLjEwNiwwLTMuODE0LDIuMjM5LTMuODE0LDV2Ny40NTQNCgljLTMuNjUzLDAuOTI5LTcuMDk2LDIuMzgxLTEwLjI0OCw0LjI2OWwtNS4yODctNS4yODdjLTEuOTUyLTEuOTUyLTQuNzQzLTIuMzI4LTYuMjMyLTAuODM5bC04LjA5MSw4LjA5MQ0KCWMtMS40OSwxLjQ4OS0xLjExNCw0LjI4LDAuODM4LDYuMjMybDUuMzMsNS4zM2MtMS44NTcsMy4xNDQtMy4yODMsNi41NzItNC4xOTEsMTAuMjA3SDQuODQzYy0yLjc2MSwwLTUsMS43MDctNSwzLjgxM3YxMS40NDINCgljMCwyLjEwNiwyLjIzOSwzLjgxMyw1LDMuODEzdjAuMDAyaDcuNjVjMC45MzEsMy41OTQsMi4zNjksNi45ODIsNC4yMywxMC4wOWwtNS40NDUsNS40NDVjLTEuOTUyLDEuOTUzLTIuMzI4LDQuNzQyLTAuODM5LDYuMjMyDQoJbDguMDkxLDguMDkxYzEuNDksMS40OSw0LjI4MSwxLjExMyw2LjIzMy0wLjgzOWw1LjQ4OC01LjQ4OGMzLjA5OCwxLjgzLDYuNDcxLDMuMjQ0LDEwLjA0Nyw0LjE1M3Y3Ljc3MWMwLDIuNzYxLDEuNzA4LDUsMy44MTQsNQ0KCWgxMS40NDNjMi4xMDcsMCwzLjgxNC0yLjIzOSwzLjgxNC01aC0wLjAwMXYtNy43NzFjMy41NzYtMC45MDksNi45NS0yLjMyNCwxMC4wNDktNC4xNTRsNS40ODksNS40ODgNCgljMS45NTEsMS45NTIsNC43NDIsMi4zMjksNi4yMzIsMC44MzlsOC4wOS04LjA5MWMxLjQ4OS0xLjQ4OSwxLjExMy00LjI4LTAuODM4LTYuMjMxbC01LjQ0Ny01LjQ0Nw0KCWMxLjg2LTMuMTA3LDMuMjk5LTYuNDk2LDQuMjI5LTEwLjA5aDcuNjUyYzIuNzYxLDAsNS0xLjcwNyw1LTMuODEzVjQ0LjI3Qzk5LjgyNSw0Mi4xNjQsOTcuNTg2LDQwLjQ1Niw5NC44MjUsNDAuNDU2eiBNNjguNzUsNTANCgljMCwxMC4zNTUtOC4zOTUsMTguNzUtMTguNzUsMTguNzVjLTEwLjM1NSwwLTE4Ljc1LTguMzk1LTE4Ljc1LTE4Ljc1YzAtMTAuMzU1LDguMzk1LTE4Ljc1LDE4Ljc1LTE4Ljc1DQoJQzYwLjM1NSwzMS4yNSw2OC43NSwzOS42NDUsNjguNzUsNTB6Ii8+DQo8L3N2Zz4NCg==); + } + .toolbar-main #toolbar-link-admin-content { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiM3Nzc3NzciIGQ9Ik02NC4wNjYsMGwyNi45NjksMjcuNjMxVjEwMEg4Ljk2NVYwSDY0LjA2NnogTTIwLjgwOSw4OC4xNTZoNTguMzl2LTU2LjU4SDU3Ljk3OVYxMS44NDFIMjAuODA5Vjg4LjE1NnoNCgkgTTI4Ljg2Nyw0OS41MDRoNDEuNzc3di00LjYwNUgyOC44NjdWNDkuNTA0eiBNMjguODY3LDYyLjY2NWg0MS43Nzd2LTQuNjA0SDI4Ljg2N1Y2Mi42NjV6IE0yOC44NjcsNzUuODE4aDQxLjc3N3YtNC42MDVIMjguODY3DQoJVjc1LjgxOHoiLz4NCjwvc3ZnPg0K); + } + .toolbar-main #toolbar-link-admin-structure { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwb2x5Z29uIGZpbGw9IiM3Nzc3NzciIHBvaW50cz0iODguMDAxLDY0LjA0NSA4OC4wMDEsNTEuOTk4IDg4LjAwMSw0OC4wMDIgODQuMDAxLDQ4LjAwMiA1MS45OTcsNDguMDAyIDUxLjk5NywzNS45NTMgDQoJNjQuMDAzLDM1Ljk1MyA2NC4wMDMsMTUuOTEgMzYsMTUuOTEgMzYsMzUuOTUzIDQ4LjAwMSwzNS45NTMgNDguMDAxLDQ4LjAwMiAxNS45OTgsNDguMDAyIDEyLjAwMyw0OC4wMDIgMTIuMDAzLDUxLjk5OCANCgkxMi4wMDMsNjQuMDQ1IDAsNjQuMDQ1IDAsODQuMDkyIDI4LDg0LjA5MiAyOCw2NC4wNDUgMTUuOTk4LDY0LjA0NSAxNS45OTgsNTEuOTk4IDQ4LjAwMSw1MS45OTggNDguMDAxLDY0LjA0NSAzNiw2NC4wNDUgDQoJMzYsODQuMDkyIDY0LjAwMyw4NC4wOTIgNjQuMDAzLDY0LjA0NSA1MS45OTcsNjQuMDQ1IDUxLjk5Nyw1MS45OTggODQuMDAxLDUxLjk5OCA4NC4wMDEsNjQuMDQ1IDcyLjAwMiw2NC4wNDUgNzIuMDAyLDg0LjA5MiANCgkxMDAsODQuMDkyIDEwMCw2NC4wNDUgIi8+DQo8L3N2Zz4NCg==); + } + .toolbar-main #toolbar-link-admin-appearance { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiM3Nzc3NzciIGQ9Ik01My40ODIsNTMuMDE2TDQwLjg3NSw2Ni4xNjhMMzAuMDYyLDU0Ljg2NGwyMS43MjYtMjkuODk5bDE0LjI2OSwxNC44OThMNTMuNDgyLDUzLjAxNnogTTU4LjE3MSwyNS40NDgNCgljMCwwLTE0LjY3NS0yMC42MjUtMTYuMjQtMjMuMzg3Yy0xLjU2NS0yLjc2My03LjIwMS0zLjIyOS0xMC44MDMsMS42MjJDMjkuNDEzLDUuOTk0LDMuOTc5LDMxLjc3MywyLjc2NCwzMy4yMjENCgljLTEuMjEzLDEuNDQ3LTEuOTUyLDQuNzc2LDAuMjk2LDYuNDc1YzIuMjQ4LDEuNzAyLDI0LjAzLDE4LjIyNiwyNC4wMywxOC4yMjZsMTAuODU1LDExLjM1NGwtMS40ODYsMS41MjUNCgljNC42MzYsNC44NjUsNS40MDYsNS42NzYsNi45MzcsNS43MjVjNC45NTgsMC4wOTMsMTQuOTExLTkuOTExLDE4LjAxNi01Ljg5NmM2LjIyLDguMDE1LDIyLjUyMSwyNi42MTgsMjIuNTIxLDI2LjYxOA0KCWMzLjM3NSwzLjU1Miw4LjgzMiwzLjY5MSwxMi4wOCwwLjI3YzMuMjc3LTMuNDI1LDMuMTQ4LTkuMTAyLTAuMjc1LTEyLjY1M2MwLDAtMTcuNzQyLTE3LjAzNS0yNS40NTEtMjMuNTYNCgljLTMuODI3LTMuMTk5LDUuNzYyLTEzLjYwMyw1LjYzNC0xOC44MjljLTAuMDQ5LTEuNTc5LTAuODEyLTIuMzg4LTUuNDU3LTcuMjU0bC0xLjQ3OCwxLjU4TDU4LjE3MSwyNS40NDh6Ii8+DQo8L3N2Zz4NCg==); + } + .toolbar-main #toolbar-link-admin-people { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiM3Nzc3NzciIGQ9Ik0xOC4yNzEsMjAuNjM1YzAsNy42NCw2LjIzMSwxMy44MTgsMTMuODY3LDEzLjgxOEMzOS44MTYsMzQuNDUzLDQ2LDI4LjI3NSw0NiwyMC42MzUNCgljMC03LjYzOC02LjE4My0xMy44MTgtMTMuODYyLTEzLjgxOEMyNC41MDIsNi44MTcsMTguMjcxLDEyLjk5NywxOC4yNzEsMjAuNjM1eiBNNTMuMzYzLDQwLjc3NQ0KCWMtNC43MjktMS42NDItMTEuNS0yLjU5Mi0yMS4yMjYtMi41OTJDMC43NzIsMzguMTgzLDAsNDcuMzE3LDAsNjAuODE2aDQ5LjMxOWMwLDAtMi4zMjUtNC43Ni0wLjg5My0xMC44NjgNCglDNDkuOTcsNDMuMzY5LDUzLjM2Myw0MC43NzUsNTMuMzYzLDQwLjc3NXogTTUzLjk5OSw1M2MwLDcuNjMzLDYuMTgzLDEzLjgxNiwxMy44NiwxMy44MTZjNy42MzYsMCwxMy44NjctNi4xODQsMTMuODY3LTEzLjgxNg0KCWMwLTcuNTkxLTYuMjMtMTMuODE4LTEzLjg2Ny0xMy44MThDNjAuMTgyLDM5LjE4Miw1My45OTksNDUuNDA5LDUzLjk5OSw1M3ogTTEwMCw5My4xODRjMC0xMy0wLjcyNy0yMi41OTYtMzIuMTQxLTIyLjU5Ng0KCWMtMzEuNDA4LDAtMzIuMTM2LDkuMTM3LTMyLjEzNiwyMi41OTZIMTAweiIvPg0KPC9zdmc+DQo=); + } + .toolbar-main #toolbar-link-admin-modules { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiM3Nzc3NzciIGQ9Ik0xMDAsOTEuMzM2TDc5LjM4OSw3MC43MjVsMTEuNzQzLTExLjc0MmMzLjEyNS0zLjEyNSwzLjEyNS04LjE5LTAuMDAxLTExLjMxM2wtMzAuOTA2LTMwLjkxbC02LjY4OCw2LjY4Nw0KCUwzMC4wOTIsMGwtNi4yNTksNi4yNmwyMy40NDUsMjMuNDQ0TDI5LjcwNCw0Ny4yNzhMNi4yNTksMjMuODMzTDAsMzAuMDkzbDIzLjQ0NSwyMy40NDNsLTYuNjg3LDYuNjg3bDMwLjkxMSwzMC45MQ0KCWMzLjEyMSwzLjEyMyw4LjE4OCwzLjEyMywxMS4zMTIsMGwxMS43NDQtMTEuNzQyTDkxLjMzNiwxMDBMMTAwLDkxLjMzNnoiLz4NCjwvc3ZnPg0K); + } + .toolbar-main #toolbar-link-admin-config { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiM3Nzc3NzciIGQ9Ik05LjA5Nyw1My4wMDJjOS40OTksOS41LDIzLjU0MSwxMS41NDQsMzUuMDQyLDYuMjI3bDM3LjYzNCwzNy42MzhjNC4xODEsNC4xODEsMTAuOTUzLDQuMTgxLDE1LjA5LDANCgljNC4xODItNC4xNCw0LjE4Mi0xMC45MSwwLTE1LjA5M0w1OS4yMjcsNDQuMTM5YzUuMzE5LTExLjUsMy4yNzQtMjUuNTQzLTYuMjIzLTM1LjA0MkM0NC41OTcsMC42OTEsMzIuNTUtMS45MDEsMjEuOTYsMS4zNw0KCWwyMy40OTcsMjMuNTAybC00LjQxMiwxNi4wODRsLTE2LjE3NCw0LjUwMUwxLjM3LDIxLjk2Qy0xLjkwMSwzMi41NSwwLjY5MSw0NC41OTcsOS4wOTcsNTMuMDAyeiIvPg0KPC9zdmc+DQo=); + } + .toolbar-main #toolbar-link-admin-reports { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxnPg0KCTxwYXRoIGZpbGw9IiM3Nzc3NzciIGQ9Ik0zNy4yMDYsMTguNzI2VjBMMTIuNDk4LDI0LjcwOGgxOC43MjZDMzQuNTI5LDI0LjcwOCwzNy4yMDYsMjIuMDMyLDM3LjIwNiwxOC43MjZ6Ii8+DQoJPHBhdGggZmlsbD0iIzc3Nzc3NyIgZD0iTTI3Ljk0Nyw1MC40OTJoNy40NjljMC44NDMsMCwxLjUyNS0wLjY4NSwxLjUyNS0xLjUyNXYtNy40NjZjMC0wLjg0MS0wLjY4Mi0xLjUzMi0xLjUyNS0xLjUzMmgtNy40NjkNCgkJYy0wLjgzOCwwLTEuNTIsMC42OTEtMS41MiwxLjUzMnY3LjQ2NkMyNi40MjgsNDkuODA4LDI3LjEwOSw1MC40OTIsMjcuOTQ3LDUwLjQ5MnoiLz4NCgk8cGF0aCBmaWxsPSIjNzc3Nzc3IiBkPSJNODEuNDk2LDBINDMuNTM5djIyLjI3NGMwLDQuODQtMy45MjQsOC43NjYtOC43NjMsOC43NjZIMTIuNDk4djYyLjk2MmMwLDMuMzExLDIuNjg4LDUuOTk4LDYsNS45OThoNjIuOTk5DQoJCWMzLjMxNywwLDYuMDA3LTIuNjg4LDYuMDA3LTUuOTk4VjUuOTk3Qzg3LjUwMywyLjY4OSw4NC44MTQsMCw4MS40OTYsMHogTTIzLjgwNSwzOS42NGMwLTEuMjYsMS4wMjMtMi4yODgsMi4yODgtMi4yODhoMTEuMTgzDQoJCWMxLjI2LDAsMi4yODcsMS4wMjgsMi4yODcsMi4yODh2MTEuMThjMCwxLjI2Ni0xLjAyNywyLjI4Ny0yLjI4NywyLjI4N0gyNi4wOTNjLTEuMjY1LDAtMi4yODgtMS4wMjEtMi4yODgtMi4yODdWMzkuNjR6DQoJCSBNNzYuMTkzLDgxLjM5NmMwLDEuODI2LTEuNDc5LDMuMzA2LTMuMzAxLDMuMzA2SDI3LjEwOWMtMS44MjcsMC0zLjMwNS0xLjQ3OS0zLjMwNS0zLjMwNnYtMS4xMDVjMC0xLjgyLDEuNDc4LTMuMzAyLDMuMzA1LTMuMzAyDQoJCWg0NS43ODRjMS44MjIsMCwzLjMwMSwxLjQ4LDMuMzAxLDMuMzAyVjgxLjM5NnogTTc2LjE5Myw2My43NDhjMCwxLjgyMi0xLjQ3OSwzLjMwMi0zLjMwMSwzLjMwMkgyNy4xMDkNCgkJYy0xLjgyNywwLTMuMzA1LTEuNDc5LTMuMzA1LTMuMzAydi0xLjEwNWMwLTEuODI2LDEuNDc4LTMuMzAzLDMuMzA1LTMuMzAzaDQ1Ljc4NGMxLjgyMiwwLDMuMzAxLDEuNDc3LDMuMzAxLDMuMzAzVjYzLjc0OHoNCgkJIE03Ni4xOTMsNDYuNjk2YzAsMS44MjYtMS40NzksMy4zMDYtMy4zMDEsMy4zMDZINDYuMjc3Yy0xLjgyMSwwLTMuMzAyLTEuNDc5LTMuMzAyLTMuMzA2di0xLjEwNWMwLTEuODI1LDEuNDgxLTMuMzAzLDMuMzAyLTMuMzAzDQoJCWgyNi42MTZjMS44MjMsMCwzLjMwMywxLjQ3OCwzLjMwMywzLjMwM3YxLjEwNUg3Ni4xOTN6Ii8+DQo8L2c+DQo8L3N2Zz4NCg==); + } + .toolbar-main #toolbar-link-admin-help { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxwYXRoIGZpbGw9IiM3Nzc3NzciIGQ9Ik0xMDAsNTBjMCwyNy42MTQtMjIuMzg3LDUwLTUwLjAwMSw1MFMwLDc3LjYxMywwLDUwQzAsMjIuMzg2LDIyLjM4NSwwLDQ5Ljk5OSwwUzEwMCwyMi4zODYsMTAwLDUweg0KCSBNNTUuMjA5LDY1LjQzNHYtMy4yNjhjMC0yLjE3NiwwLjQ2Mi0zLjkzOCwxLjM4OS01LjI3OWMwLjkyNC0xLjM0LDMuMTMxLTMuMzAxLDYuNjE1LTUuODgxYzUuMDgyLTMuNjI1LDguNTIxLTYuODkyLDEwLjM0Mi05Ljc5Nw0KCWMxLjgxMy0yLjkwNSwyLjcyMS02LjM0OSwyLjcyMS0xMC4zNDJjMC01Ljk4Ny0yLjIwMy0xMC43NzgtNi42MTMtMTQuMzcyYy00LjQwOC0zLjU5MS0xMC4zNTItNS4zODktMTcuODI2LTUuMzg5DQoJYy05LjA3MSwwLTE3LjY1OSwyLjI2Ni0yNS43NDgsNi44MDVsNS45MzMsMTEuOTIxYzYuOTY4LTMuNTU4LDEzLjE3My01LjMzNSwxOC42MTgtNS4zMzVjMy4xMjEsMCw1LjU1MSwwLjYyMSw3LjI5MywxLjg1Mg0KCWMxLjc0MSwxLjIzMSwyLjYxMiwzLjAyOCwyLjYxMiw1LjM4OGMwLDIuMTAzLTAuNjA0LDQuMDA5LTEuODIzLDUuNzE2Yy0xLjIxOSwxLjcwOC0zLjcyOSwzLjkyLTcuNTM5LDYuNjQxDQoJYy0zLjk1NCwyLjkwNi02LjY3Niw1LjY0Mi04LjE2Niw4LjIxOWMtMS40OTEsMi41NzgtMi4yMzEsNS42MDctMi4yMzEsOS4wOTJ2NC4wMjlINTUuMjA5eiBNNDEuNTQ0LDg4LjI3MQ0KCWMxLjY2NywxLjYxMiw0LjAyOSwyLjQyMiw3LjA3OCwyLjQyMmMyLjk3MiwwLDUuMzAxLTAuODI0LDYuOTY4LTIuNDc4YzEuNjY1LTEuNjU1LDIuNTAzLTMuOTE0LDIuNTAzLTYuNzc2DQoJYzAtMi45NzYtMC44MjEtNS4yNTgtMi40NzYtNi44NjFjLTEuNjU0LTEuNTk4LTMuOTgtMi4zOTUtNi45OTUtMi4zOTVjLTMuMTIzLDAtNS40OTcsMC43ODItNy4xMywyLjM0Mg0KCWMtMS42MzUsMS41NTktMi40NDksMy44NjMtMi40NDksNi45MTRDMzkuMDQyLDg0LjM3OSwzOS44NzgsODYuNjU2LDQxLjU0NCw4OC4yNzF6Ii8+DQo8L3N2Zz4NCg==); + } +} + +@media screen and (min-width: 28.125em) { + .toolbar-main .bar .tab, + .toolbar-main .bar .active .tab, + .toolbar-main .bar .tab:active { + background-position: 0.5em center; + padding-left: 2.5em; /* LTR */ + text-indent: 0; + width: auto; + } +} diff --git a/core/modules/toolbar/css/toolbar.theme-rtl.css b/core/modules/toolbar/css/toolbar.theme-rtl.css new file mode 100644 index 0000000..e8cb8cf --- /dev/null +++ b/core/modules/toolbar/css/toolbar.theme-rtl.css @@ -0,0 +1,7 @@ +.toolbar-main .bar .menu li + li { + margin-left: auto; + margin-right: 1em; +} +.toolbar-main .shortcuts .menu li { + float: right; +} diff --git a/core/modules/toolbar/css/toolbar.theme.css b/core/modules/toolbar/css/toolbar.theme.css new file mode 100644 index 0000000..10789d5 --- /dev/null +++ b/core/modules/toolbar/css/toolbar.theme.css @@ -0,0 +1,250 @@ +/** + * @file toolbar.theme.css + */ +.toolbar-main { + font-family: "Source Sans Pro", "Lucida Grande", Verdana, sans-serif; + /* Set base font size to 13px based on root ems. */ + font-size: 0.8125rem; + -moz-tap-highlight-color: rgba(0,0,0,0); + -o-tap-highlight-color: rgba(0,0,0,0); + -webkit-tap-highlight-color: rgba(0,0,0,0); + tap-highlight-color: rgba(0,0,0,0); + -moz-touch-callout: none; + -o-touch-callout: none; + -webkit-touch-callout: none; + touch-callout: none; +} +.toolbar-main a { + text-decoration: none; +} +.toolbar-main a:hover { + text-decoration: underline; +} +/** + * Toolbar bar. + */ +.toolbar-main .bar { + background-color: #0f0f0f; + box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.3333); + color: #dddddd; +} +.toolbar-main .bar li:hover { + background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.125) 20%, transparent 200%); + background-image: linear-gradient(rgba(255, 255, 255, 0.125) 20%, transparent 200%); +} +.toolbar-main .bar li.active { + background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.25) 20%, transparent 200%); + background-image: linear-gradient(rgba(255, 255, 255, 0.25) 20%, transparent 200%); +} +.toolbar-main .bar a { + color: #ffffff; + cursor: pointer; + padding: 1em 0.3333em; +} +@media screen and (min-width: 16.5em) { + .toolbar-main .bar a { + padding-left: 1.3333em; + padding-right: 1.3333em; + } +} +/** + * Toolbar tray. + */ +.toolbar-main .tray > .lining { + background-color: #ffffff; +} +.toolbar-main .vertical > .lining > .edge { + background-color: #ffffff; + border-right: 1px solid #aaaaaa; + box-shadow: -1px 0 5px 2px rgba(0, 0, 0, 0.3333); +} +.toolbar-main .horizontal { + border-bottom: 1px solid #aaaaaa; + box-shadow: 0 1px 3px 1px rgba(0, 0, 0, 0.3333); +} +.toolbar-main .horizontal .tray { + background-color: #f5f5f5; +} +.toolbar-main .tray a { + color: #333333; +} +.toolbar-main .horizontal .toolbar-list { + background-color: #ffffff; +} +.toolbar-main .toolbar-list a { + padding: 1em 0.3333em; +} +.toolbar-main .vertical .toolbar-list { + border-bottom: 1px solid #dddddd; +} +.toolbar-main .vertical .toolbar-list a { + margin-right: 20%; +} +.toolbar-main .vertical .level-1 + .level-1, +.toolbar-main .vertical .toolbar-list > li + li, +.toolbar-main .vertical .toolbar-list > .menu > li + li { + border-top: 1px solid #dddddd; +} +.toolbar-main .vertical .level-1 a { + font-weight: bold; +} +.toolbar-main .level-2 ul { + margin-left: 0.25em; +} +.toolbar-main .vertical .level-2 ul { + border-bottom-style: solid; + border-top-style: solid; + border-bottom-width: 1px; + border-top-width: 1px; +} +.toolbar-main .vertical .level-1 li:last-child > ul { + border-bottom: 0; +} +.toolbar-main .level-2 a { + color: #333333; + padding-bottom: 0.6667em; + padding-top: 0.6667em; +} +.toolbar-main .vertical .level-2 a { + font-weight: normal; +} +.toolbar-main .level-3 { + padding-left: 0.1667em; +} +.toolbar-main .level-3 a { + color: #303030; +} +.toolbar-main .level-4 a { + color: #2d2d2d; +} +.toolbar-main .level-5 a { + color: #2a2a2a; +} +.toolbar-main .level-6 a { + color: #272727; +} +.toolbar-main .level-7 a { + color: #2a2a2a; +} +.toolbar-main .level-8 a { + color: #2d2d2d; +} +.toolbar-main .level-9 a { + color: #303030; +} +.toolbar-main .level-2 > ul { + background-color: #f5f5f5; + border-color: #cccccc; +} +.toolbar-main .level-3 > ul { + background-color: #e5e5e5; + border-color: #bbbbbb; +} +.toolbar-main .level-4 > ul { + background-color: #d5d5d5; + border-color: #aaaaaa; +} +.toolbar-main .level-5 > ul { + background-color: #c5c5c5; + border-color: #999999; +} +.toolbar-main .level-6 > ul { + background-color: #b5b5b5; + border-color: #888888; +} +.toolbar-main .level-7 > ul { + background-color: #c5c5c5; + border-color: #999999; +} +.toolbar-main .level-8 > ul { + background-color: #d5d5d5; + border-color: #aaaaaa; +} +.toolbar-main .level-9 > ul { + background-color: #e5e5e5; + border-color: #bbbbbb; +} +/** + * ToolBar tray - horizontal. + */ +.toolbar-main .horizontal .level-1 > li.open > .box { + border-bottom-color: white; + border-bottom-width: 1px; + border-bottom-style: solid; + position: relative; + margin-top: -1px; + top: 1px; +} +.toolbar-main .horizontal .level-2 ul { + border-left: 1px solid #bcbcbc; +} +.toolbar-main .horizontal .level-2 a { + padding: 0.6667em 1em; +} + +/** + * Interactive menu. + */ + +.toolbar-main .handle { + background-attachment: scroll; + background-color: transparent; + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjI1NiAzNDYgMTAwIDEwMCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAyNTYgMzQ2IDEwMCAxMDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPGc+DQoJPHBhdGggZmlsbD0iIzk5OTk5OSIgZD0iTTI1NiwzOTZjMCwyNy41OTgsMjIuNCw1MCw1MCw1MGMyNy41OTgsMCw1MC0yMi40MDIsNTAtNTBjMC0yNy42LTIyLjQwMi01MC01MC01MA0KCQlDMjc4LjQsMzQ2LDI1NiwzNjguNCwyNTYsMzk2eiBNMjYxLDM5NmMwLTI0Ljg1MiwyMC4xNDktNDUsNDUtNDVjMjQuODU0LDAsNDUsMjAuMTQ4LDQ1LDQ1YzAsMjQuODU0LTIwLjE0Niw0NS00NSw0NQ0KCQlDMjgxLjE0OSw0NDEsMjYxLDQyMC44NTQsMjYxLDM5NnoiLz4NCgk8cG9seWdvbiBmaWxsPSIjNTE4MUMyIiBwb2ludHM9IjMwNiw0MTEgMjgxLDM4NiAzMzEsMzg2IAkiLz4NCjwvZz4NCjwvc3ZnPg0K); + background-position: center center; + background-repeat: no-repeat; + background-size: auto 70%; + border: 0; + bottom: 0; + display: block; + font-size: 1em; + height: 100%; + position: absolute; + right: 0; + text-indent: -999em; + top: 0; + width: 20%; + z-index: 1; +} +.toolbar-main .level-2 .handle { + padding-bottom: 0.4545em; + padding-top: 0.4545em; +} +.toolbar-main .handle.open { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjI1NiAzNDYgMTAwIDEwMCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAyNTYgMzQ2IDEwMCAxMDAiIHhtbDpzcGFjZT0icHJlc2VydmUiPg0KPHBhdGggZmlsbD0iIzk5OTk5OSIgZD0iTTM1NiwzOTZjMC0yNy42LTIyLjQwMi01MC01MC01MGMtMjcuNiwwLTUwLDIyLjQtNTAsNTBjMCwyNy41OTgsMjIuNCw1MCw1MCw1MA0KCUMzMzMuNTk4LDQ0NiwzNTYsNDIzLjU5OCwzNTYsMzk2eiBNMzUxLDM5NmMwLDI0Ljg0OS0yMC4xNTEsNDUtNDUsNDVjLTI0Ljg1NiwwLTQ1LTIwLjE1MS00NS00NWMwLTI0Ljg1NSwyMC4xNDQtNDUsNDUtNDUNCglDMzMwLjg0OSwzNTEsMzUxLDM3MS4xNDUsMzUxLDM5NnoiLz4NCjxwb2x5Z29uIGZpbGw9IiM3Nzc3NzciIHBvaW50cz0iMzA2LDM4MSAzMzEsNDA2IDI4MSw0MDYgIi8+DQo8L3N2Zz4NCg==); +} + +/* Orientation toggle */ + +.toolbar-main .toggle-orientation { + background-color: #f5f5f5; + padding: 1em; +} +.toolbar-main .horizontal .toggle-orientation { + border-left: 1px solid #c9c9c9; /* LTR */ +} +.toolbar-main .toggle-orientation > .lining { + background-color: #ffffff; + border: 1px solid #c9c9c9; + float: right; /* LTR */ + padding: 0.1667em; +} +.toolbar-main .toggle-orientation button { + background-color: transparent; + border: 1px solid #b0b0b0; + cursor: pointer; + display: inline-block; + float: left; + height: 0.9em; + text-indent: -999em; + width: 1.4562em; +} +.toolbar-main .toggle-orientation [value="vertical"] { + border-left-width: 7px; + margin-left: 0.5em; +} +.toolbar-main .toggle-orientation [value="horizontal"] { + border-top-width: 4px; +} +.toolbar-main .toggle-orientation .active { + border-color: #3F9AD3; +} diff --git a/core/modules/toolbar/js/interactivemenu.js b/core/modules/toolbar/js/interactivemenu.js new file mode 100644 index 0000000..56575c4 --- /dev/null +++ b/core/modules/toolbar/js/interactivemenu.js @@ -0,0 +1,130 @@ +/** + * Decorate a menu with markup and classes for attaching behaviors. + */ + +(function ($, Drupal) { + +"use strict"; + +/** + * Store the open menu tray. + */ +var openItem = JSON.parse(localStorage.getItem('Drupal.interactivemenu.openItem')); + + $.fn.interactiveMenu = function () { + + var ui = { + 'handleOpen': Drupal.t('Open'), + 'handleClose': Drupal.t('Close') + }; + /** + * + */ + function toggleClickHandler (event) { + var $toggle = $(event.target); + var $item = $toggle.closest('li'); + // Toggle the list item. + toggleList($item); + // Close open siblings and their open children. + var $openItems = $item.siblings().filter('.open'); + $openItems = $openItems.add($openItems.find('.open')); + toggleList($openItems, false); + // Save link of the closest open item through a unique selector. + var href = $toggle.siblings('a[href]').attr('href'); + if (href) { + localStorage.setItem('Drupal.interactivemenu.openItem', JSON.stringify(href)); + } + else { + localStorage.removeItem('Drupal.interactivemenu.openItem'); + } + } + /** + * + */ + function toggleList ($item, switcher) { + var $toggle = $item.find('> .box > .handle'); + switcher = (typeof switcher !== 'undefined') ? switcher : !$item.hasClass('open'); + // Toggle the item open state. + $item.toggleClass('open', switcher); + // Twist the toggle. + $toggle.toggleClass('open', switcher); + // Adjust the toggle text. + $toggle + .text((switcher) ? ui.handleOpen : ui.handleClose) + .attr('aria-pressed', switcher); + } + /** + * + */ + function initItems ($menu) { + var options = { + 'class': 'handle', + 'text': ui.handleOpen + }; + // Initialize items and their links. + $menu.find('li > a').wrap('
'); + // Add a handle to each list item if it has a menu. + $menu.find('li').each(function (index, element) { + var $item = $(element); + if ($item.find('> ul.menu').length) { + $item.find('> .box') + .prepend(Drupal.theme('interactionMenuItemToggle', options)); + } + }); + } + /** + * Adds a level class to each list based on its depth in the menu. + */ + function markListLevels ($lists, level) { + level = (!level) ? 1 : level; + var $lis = $lists.find('> li').addClass('level-' + level); + $lists = $lis.find('> ul'); + if ($lists.length) { + markListLevels($lists, level + 1); + } + } + /** + * + */ + function traceActiveTrail ($menu) { + $menu.find('a.active').parentsUntil('.root', 'li').addClass('active-trail'); + } + /** + * + */ + function openActiveItem ($menu) { + var $activeItem = $menu.find('a.active'); + if ($activeItem.attr('href') === location.pathname) { + toggleList($menu.find('a[href="' + location.pathname + '"]').parentsUntil('.root', 'li'),true); + localStorage.setItem('Drupal.interactivemenu.openItem', JSON.stringify(location.pathname)); + } + else if (openItem) { + toggleList($menu.find('a[href="' + openItem + '"]').parentsUntil('.root', 'li'),true); + } + } + // Bind event handlers. + $(document).on('click.interactivemenu', '.handle', toggleClickHandler); + return this.each(function (selector) { + var $menu = $(this).once('interactivemenu'); + if ($menu.length) { + $menu.addClass('root'); + initItems($menu); + markListLevels($menu); + // Restore previous and active states. + traceActiveTrail($menu); + openActiveItem($menu); + } + }); + }; + + /** + * A toggle is an interactive element often bound to a click handler. + * + * @return {String} + * A string representing a DOM fragment. + */ + Drupal.theme.interactionMenuItemToggle = function (options) { + return ''; + }; + +}(jQuery, Drupal)); diff --git a/core/modules/toolbar/js/toolbar.js b/core/modules/toolbar/js/toolbar.js new file mode 100644 index 0000000..c64ebdb --- /dev/null +++ b/core/modules/toolbar/js/toolbar.js @@ -0,0 +1,258 @@ +/** + * @file toolbar.js + * + * Defines the behavior of the Drupal administration toolbar. + */ +(function ($, Drupal, drupalSettings) { + +"use strict"; + +Drupal.toolbar = Drupal.toolbar || {}; + +/** + * Store the state of the active tab so it will remain active across page loads. + */ +var activeTab = JSON.parse(localStorage.getItem('Drupal.toolbar.activeTab')); + +/** + * Store the state of the tray orientations to maintain them across page loads. + */ +var trayOrientations = JSON.parse(localStorage.getItem('Drupal.toolbar.trayOrientations')) || []; + +/** + * Holds the jQuery object of the toolbar DOM element. + */ +var $toolbar; + +/** + * Register tabs with the toolbar. + * + * The Drupal toolbar allows modules to register top-level tabs. These may point + * directly to a resource or toggle the visibility of a tray. + * + * Modules register tabs with hook_toolbar_register_tabs. + */ +Drupal.behaviors.toolbar = { + attach: function(context) { + var options = $.extend(this.options, drupalSettings.toolbar); + $toolbar = $(context).find('#toolbar').once('toolbar'); + if ($toolbar.length) { + $toolbar.addClass('toolbar-main'); + // Set the initial orientation of the trays. + var $tray = $toolbar.find('.tray') + .attr('data-toolbar-orientation', 'vertical') + .addClass('vertical'); + // Add the tray orientation toggles. + $tray + .find('.lining') + .append(Drupal.theme('toolbarOrientationToggle')); + + // Set up switching between the vertical and horizontal presentation + // of the toolbar trays based on a breakpoint. + if (options.breakpoints && typeof options.breakpoints['module.toolbar.wide'] !== 'undefined') { + var mql = window.matchMedia(options.breakpoints['module.toolbar.wide']); + mql.addListener(Drupal.toolbar.mediaQueryChangeHandler); + if (mql.matches) { + Drupal.toolbar.mediaQueryChangeHandler(mql); + } + } + // Recalculate the offset top of the toolbar once on initialization. + Drupal.toolbar.setHeight(); + // Call setHeight on screen resize. Wrap it in debounce to prevent + // setHeight from being called too frequently. + var setHeight = Drupal.debounce(Drupal.toolbar.setHeight, 250); + $(window) + .on('resize.toolbar', setHeight); + // Attach behaviors to the toolbar. + $toolbar + .on('click.toolbar', '.bar .tab', Drupal.toolbar.toggleTray) + .on('click.toolbar', '.toggle-orientation button', Drupal.toolbar.orientationChangeHandler); + // Decorate the main menu with an interactive menu. + $toolbar.find('.administration.tray .interactive-menu > .menu').interactiveMenu(); + // Restore the toolbar to its saved state. + restoreState(); + } + }, + options: { + breakpoints: null + } +}; +/** + * Toggle a toolbar tab and the associated tray. + */ +Drupal.toolbar.toggleTray = function (event) { + var $tab = $(event.target); + var $parent = $tab.parent(); + var name = $tab.attr('data-toolbar-tray'); + var $toolbar = $tab.closest('#toolbar'); + // Activate the selected tab and associated tray. + var $activateTray = $toolbar.find('[data-toolbar-tray="' + name + '"].tray').toggleClass('active'); + if ($activateTray.length) { + event.preventDefault(); + event.stopPropagation(); + $parent.toggleClass('active'); + // Store the active tab name or remove the setting. + if ($parent.hasClass('active')) { + localStorage.setItem('Drupal.toolbar.activeTab', JSON.stringify(name)); + } + else { + localStorage.removeItem('Drupal.toolbar.activeTab'); + } + // Disable non-selected tabs and trays. + $toolbar.find('.bar .tab').not($tab).parent().removeClass('active'); + $toolbar.find('.tray').not($activateTray).removeClass('active'); + // Adjust the body to accommodate trays. + setBodyState(); + // Adjust the height of the toolbar. + Drupal.toolbar.setHeight(); + } +}; + +/** + * The height of the toolbar offsets the top of the page content. + * + * Page components can register with the offsettopchange event to know when + * the height of the toolbar changes. + */ +Drupal.toolbar.setHeight = function () { + // Set the top of the all the trays to the height of the bar. + var $trays = $toolbar.find('.tray'); + var barHeight = $toolbar.find('.bar').outerHeight(); + var height = barHeight; + var bhpx = barHeight + 'px'; + var tray; + for (var i = 0, il = $trays.length; i < il; i++) { + tray = $trays[i]; + if (!tray.style.top.length || (tray.style.top !== bhpx)) { + tray.style.top = bhpx; + } + } + // Get the height of the active horizontal tray and include it in the total + // height of the toolbar. + height += $trays.filter('.active.horizontal').height('auto').outerHeight() || 0; + // Indicate the height of the toolbar in the attribute data-offset-top. + var offset = parseInt($toolbar.attr('data-offset-top'), 10); + if (offset !== height) { + $toolbar.attr('data-offset-top', height); + // Alter the padding on the top of the body element. + $('body').css('padding-top', height); + $(document).trigger('offsettopchange', height); + $(window).trigger('resize'); + } +}; +/** + * + */ +Drupal.toolbar.mediaQueryChangeHandler = function (mql) { + var orientation = (mql.matches) ? 'horizontal' : 'vertical'; + changeOrientation($toolbar.find('.tray'), orientation); + // Adjust the body to accommodate trays. + setBodyState(); + // Adjust the height of the toolbar. + Drupal.toolbar.setHeight(); +}; +/** + * + */ +Drupal.toolbar.orientationChangeHandler = function (event) { + event.preventDefault(); + event.stopPropagation(); + var $button = $(event.target); + var orientation = event.target.value; + var $tray = $button.closest('.tray'); + changeOrientation($tray, orientation, true); + // Adjust the body to accommodate trays. + setBodyState(); + // Adjust the height of the toolbar. + Drupal.toolbar.setHeight(); +}; +/** + * + */ +function restoreState () { + // Restore the open tab. + if (activeTab) { + $toolbar.find('[data-toolbar-tray="' + activeTab + '"].tab').trigger('click.toolbar'); + } + // Restore tray orientations. + if (trayOrientations.length) { + var $trays = $toolbar.find('.tray'); + var $tray; + for (var i = 0, il = trayOrientations.length; i < il; i++) { + $tray = $trays.filter('[data-toolbar-tray="' + trayOrientations[i].tray + '"]'); + changeOrientation($tray, trayOrientations[i].orientation, true); + } + } + // Adjust the body to accomodate trays. + setBodyState(); + // Adjust the height of the toolbar. + Drupal.toolbar.setHeight(); +} +/** + * + */ +function changeOrientation ($trays, orientation, isOverride) { + for (var i = 0, il = $trays.length; i < il; i++) { + var $tray = $trays.eq(i); + if (isOverride) { + var locked = orientation === 'vertical'; + $tray.attr('data-toolbar-orientation-locked', JSON.stringify(locked)); + } + var currentOrientation = $tray.attr('data-toolbar-orientation'); + var isOrientationLocked = JSON.parse($tray.attr('data-toolbar-orientation-locked') || null); + if ((!isOrientationLocked && orientation === 'horizontal' && currentOrientation === 'vertical') + || (orientation === 'vertical' && currentOrientation === 'horizontal')) { + $tray.attr('data-toolbar-orientation', orientation) + .removeClass('horizontal vertical') + .addClass(orientation); + toggleOrientationToggle($tray, currentOrientation); + } + } + // Save the state of overridden trays. + function getTrayOrientation (index, tray) { + var $tray = $(tray); + return { + 'tray': $tray.attr('data-toolbar-tray'), + 'orientation': $tray.attr('data-toolbar-orientation') || 'vertical' + }; + } + + var traysState = $toolbar.find('[data-toolbar-orientation-locked="true"]').map(getTrayOrientation); + localStorage.setItem('Drupal.toolbar.trayOrientations', JSON.stringify(traysState.get())); +} +/** + * + */ +function setBodyState () { + var $activeTray = $toolbar.find('.tray.active'); + var orientation = $activeTray.attr('data-toolbar-orientation'); + $('body') + .toggleClass('toolbar-tray-open', !!$activeTray.length) + .toggleClass('toolbar-vertical', (!!$activeTray.length && orientation === 'vertical')) + .toggleClass('toolbar-horizontal', (!!$activeTray.length && orientation === 'horizontal')); +} +/** + * Change the orientation toggle active state. + */ +function toggleOrientationToggle ($trays, orientation) { + for (var i = 0, il = $trays.length; i < il; i++) { + var $tray = $trays.eq(i); + $tray.find('.toggle-orientation button').removeClass('active'); + $tray.find('.toggle-orientation button[value="' + orientation + '"]').addClass('active'); + } +} + +/** + * A toggle is an interactive element often bound to a click handler. + * + * @return {String} + * A string representing a DOM fragment. + */ +Drupal.theme.toolbarOrientationToggle = function () { + return '
' + + '' + + '' + + '
'; +}; + +}(jQuery, Drupal, drupalSettings)); diff --git a/core/modules/toolbar/templates/toolbar.tpl.php b/core/modules/toolbar/templates/toolbar.tpl.php index b3d561c..572f4ff 100644 --- a/core/modules/toolbar/templates/toolbar.tpl.php +++ b/core/modules/toolbar/templates/toolbar.tpl.php @@ -19,15 +19,10 @@ * @ingroup themeable */ ?> - + + +
diff --git a/core/modules/toolbar/toolbar-rtl.css b/core/modules/toolbar/toolbar-rtl.css deleted file mode 100644 index e121547..0000000 --- a/core/modules/toolbar/toolbar-rtl.css +++ /dev/null @@ -1,37 +0,0 @@ - -#toolbar, -#toolbar * { - text-align: right; -} -#toolbar ul li { - float: right; -} -#toolbar ul li a { - display: inline-block; - float: none; - zoom: 1; -} -#toolbar div.toolbar-menu { - padding: 5px 50px 5px 50px; -} -#toolbar-user { - float: left; -} -#toolbar ul#toolbar-user li { - float: none; - display: inline; -} -#toolbar-menu { - float: none; -} -#toolbar-home { - float: right; -} -#toolbar ul li.home a { - position: absolute; - right: 10px; -} -#toolbar div.toolbar-menu a.toggle { - left: 10px; - right: auto; -} diff --git a/core/modules/toolbar/toolbar.api.php b/core/modules/toolbar/toolbar.api.php new file mode 100644 index 0000000..783089b --- /dev/null +++ b/core/modules/toolbar/toolbar.api.php @@ -0,0 +1,97 @@ + array( + 'title' => t('Home'), + 'href' => '', + 'html' => FALSE, + 'attributes' => array( + 'title' => t('Home page'), + ), + ), + 'weight' => -10, + ); + + // Define the tray in a separate function. + $items['shortcuts'] = array( + 'tab' => array( + 'title' => t('Shortcuts'), + 'href' => '', + 'html' => FALSE, + 'attributes' => array( + 'title' => t('Shortcuts'), + ), + ), + 'tray' => array( + '#pre_render' => array('shortcut_toolbar_pre_render'), + ), + ); + + return $items; +} + +/** + * Alter the Toolbar menu after hook_toolbar() is invoked. + * + * This hook is invoked by toolbar_view() immediately after hook_toolbar(). The + * toolbar definitions are passed in by reference. Each element of the $items + * array is one item returned by a module from hook_toolbar(). Additional items + * may be added, or existing items altered. + * + * @param $items + * Associative array of Toolbar menu definitions returned from hook_toolbar(). + */ +function hook_toolbar_alter(&$items) { + // Move the User tab to the right. + $items['user']['weight'] = 5; +} + +/** + * @} End of "addtogroup hooks". + */ diff --git a/core/modules/toolbar/toolbar.css b/core/modules/toolbar/toolbar.css deleted file mode 100644 index bd18110..0000000 --- a/core/modules/toolbar/toolbar.css +++ /dev/null @@ -1,129 +0,0 @@ - -body.toolbar { - padding-top: 2.2em; -} -body.toolbar-drawer { - padding-top: 5.3em; -} - -/** - * Aggressive resets so we can achieve a consistent look in hostile CSS - * environments. - */ -#toolbar, -#toolbar * { - border: 0; - font-size: 100%; - line-height: inherit; - list-style: none; - margin: 0; - outline: 0; - padding: 0; - text-align: left; /* LTR */ - vertical-align: baseline; -} - -/** - * Base styles. - * - * We use a keyword for the toolbar font size to make it display consistently - * across different themes, while still allowing browsers to resize the text. - */ -#toolbar { - background: #666; - color: #ccc; - font: normal small "Lucida Grande", Verdana, sans-serif; - left: 0; - margin: 0 -20px; - padding: 0 20px; - position: fixed; - right: 0; - top: 0; - box-shadow: 0 3px 20px #000; - z-index: 600; -} -#toolbar div.collapsed { - display: none; - visibility: hidden; -} -#toolbar a { - color: #fff; - font-size: .846em; - text-decoration: none; -} -#toolbar ul li, -#toolbar ul li a { - float: left; /* LTR */ -} - -/** - * Administration menu. - */ -#toolbar div.toolbar-menu { - background: #000; - line-height: 20px; - padding: 5px 50px 5px 10px; /* LTR */ - position: relative; -} -#toolbar-home a span { - background: url(toolbar.png) no-repeat 0 -45px; - display: block; - height: 14px; - margin: 3px 0px; - text-indent: -9999px; - vertical-align: text-bottom; - width: 11px; -} -#toolbar-user { - float: right; /* LTR */ -} -#toolbar-menu { - float: left; /* LTR */ -} -#toolbar div.toolbar-menu a.toggle { - background: url(toolbar.png) 0 -20px no-repeat; - bottom: 0; - cursor: pointer; - height: 25px; - overflow: hidden; - position: absolute; - right: 10px; /* LTR */ - text-indent: -9999px; - width: 25px; -} -#toolbar div.toolbar-menu a.toggle:focus, -#toolbar div.toolbar-menu a.toggle:hover { - background-position: -50px -20px; -} -#toolbar div.toolbar-menu a.toggle-active { - background-position: -25px -20px; -} -#toolbar div.toolbar-menu a.toggle-active.toggle:focus, -#toolbar div.toolbar-menu a.toggle-active.toggle:hover { - background-position: -75px -20px; -} -#toolbar div.toolbar-menu ul li a { - padding: 0 10px; - border-radius: 10px; -} -#toolbar div.toolbar-menu ul li a:focus, -#toolbar div.toolbar-menu ul li a:hover, -#toolbar div.toolbar-menu ul li a:active, -#toolbar div.toolbar-menu ul li a.active:focus { - background: #444; -} -#toolbar div.toolbar-menu ul li a.active:hover, -#toolbar div.toolbar-menu ul li a.active:active, -#toolbar div.toolbar-menu ul li a.active, -#toolbar div.toolbar-menu ul li.active-trail a { - background: url(toolbar.png) 0 0 repeat-x; - text-shadow: #333 0 1px 0; -} - -/** - * Collapsed drawer of additional toolbar content. - */ -#toolbar div.toolbar-drawer { - position: relative; - padding: 0 10px; -} diff --git a/core/modules/toolbar/toolbar.info b/core/modules/toolbar/toolbar.info index 758dc9c..1f3a375 100644 --- a/core/modules/toolbar/toolbar.info +++ b/core/modules/toolbar/toolbar.info @@ -3,3 +3,8 @@ description = Provides a toolbar that shows the top-level administration menu it core = 8.x package = Core version = VERSION + +dependencies[] = config +dependencies[] = breakpoint + +configure = admin/structure/toolbar diff --git a/core/modules/toolbar/toolbar.js b/core/modules/toolbar/toolbar.js deleted file mode 100644 index 2353050..0000000 --- a/core/modules/toolbar/toolbar.js +++ /dev/null @@ -1,115 +0,0 @@ -(function ($) { - -"use strict"; - -Drupal.toolbar = Drupal.toolbar || {}; - -/** - * Attach toggling behavior and notify the overlay of the toolbar. - */ -Drupal.behaviors.toolbar = { - attach: function(context, settings) { - var $toolbar = $('#toolbar').once('toolbar'); - if ($toolbar.length) { - - // Set the initial state of the toolbar. - Drupal.toolbar.init(); - - $(window).on('resize.toolbar', Drupal.toolbar.height); - - // Toggling toolbar drawer. - $toolbar.find('a.toggle').once('toolbar-toggle').click(function(e) { - e.preventDefault(); - Drupal.toolbar.toggle(); - // Allow resize event handlers to recalculate sizes/positions. - $(window).triggerHandler('resize'); - }); - } - } -}; - -/** - * Retrieve last saved cookie settings and set up the initial toolbar state. - */ -Drupal.toolbar.init = function() { - // Retrieve the collapsed status from a stored cookie. - var collapsed = $.cookie('Drupal.toolbar.collapsed'); - - // Expand or collapse the toolbar based on the cookie value. - if (collapsed === '1') { - Drupal.toolbar.collapse(); - } - else { - Drupal.toolbar.expand(); - } -}; - -/** - * Collapse the toolbar. - */ -Drupal.toolbar.collapse = function() { - var toggle_text = Drupal.t('Show shortcuts'); - $('#toolbar div.toolbar-drawer').addClass('collapsed'); - $('#toolbar a.toggle') - .removeClass('toggle-active') - .attr('title', toggle_text) - .html(toggle_text); - $('body').removeClass('toolbar-drawer').css('paddingTop', Drupal.toolbar.height()); - $.cookie( - 'Drupal.toolbar.collapsed', - 1, - { - path: Drupal.settings.basePath, - // The cookie should "never" expire. - expires: 36500 - } - ); - Drupal.toolbar.height(); - $(document).trigger('offsettopchange'); -}; - -/** - * Expand the toolbar. - */ -Drupal.toolbar.expand = function() { - var toggle_text = Drupal.t('Hide shortcuts'); - $('#toolbar div.toolbar-drawer').removeClass('collapsed'); - $('#toolbar a.toggle') - .addClass('toggle-active') - .attr('title', toggle_text) - .html(toggle_text); - $('body').addClass('toolbar-drawer').css('paddingTop', Drupal.toolbar.height()); - $.cookie( - 'Drupal.toolbar.collapsed', - 0, - { - path: Drupal.settings.basePath, - // The cookie should "never" expire. - expires: 36500 - } - ); - Drupal.toolbar.height(); - $(document).trigger('offsettopchange'); -}; - -/** - * Toggle the toolbar. - */ -Drupal.toolbar.toggle = function() { - if ($('#toolbar div.toolbar-drawer').hasClass('collapsed')) { - Drupal.toolbar.expand(); - } - else { - Drupal.toolbar.collapse(); - } -}; - -Drupal.toolbar.height = function() { - // @TODO this needs to be cached outside this function. - var $toolbar = $('#toolbar'); - var height = $toolbar.outerHeight(); - $toolbar.attr('data-offset-top', height); - return height; -}; - -})(jQuery); diff --git a/core/modules/toolbar/toolbar.module b/core/modules/toolbar/toolbar.module index a54743a..c725353 100644 --- a/core/modules/toolbar/toolbar.module +++ b/core/modules/toolbar/toolbar.module @@ -41,87 +41,21 @@ function toolbar_theme($existing, $type, $theme, $path) { 'render element' => 'toolbar', 'template' => 'toolbar', ); - $items['toolbar_toggle'] = array( - 'variables' => array( - 'collapsed' => NULL, - 'attributes' => array(), - ), - ); - return $items; -} - -/** - * Implements hook_menu(). - */ -function toolbar_menu() { - $items['toolbar/toggle'] = array( - 'title' => 'Toggle drawer visibility', - 'type' => MENU_CALLBACK, - 'page callback' => 'toolbar_toggle_page', - 'access arguments' => array('access toolbar'), + $items['toolbar_tray'] = array( + 'render element' => 'element', ); return $items; } /** - * Page callback: Toggles the visibility of the toolbar drawer. - * - * @see toolbar_menu(). - */ -function toolbar_toggle_page() { - global $base_path; - // Toggle the value in the cookie. - setcookie('Drupal.toolbar.collapsed', !_toolbar_is_collapsed(), NULL, $base_path); - // Redirect the user from where he used the toggle element. - drupal_goto(); -} - -/** - * Formats an element used to toggle the toolbar drawer's visibility. - * - * @param $variables - * An associative array containing: - * - collapsed: A boolean value representing the toolbar drawer's visibility. - * - attributes: An associative array of HTML attributes. - * - * @return - * An HTML string representing the element for toggling. - * - * @ingroup themable - */ -function theme_toolbar_toggle($variables) { - if ($variables['collapsed']) { - $toggle_text = t('Show shortcuts'); - } - else { - $toggle_text = t('Hide shortcuts'); - $variables['attributes']['class'][] = 'toggle-active'; - } - return l($toggle_text, 'toolbar/toggle', array('query' => drupal_get_destination(), 'attributes' => array('title' => $toggle_text) + $variables['attributes'])); -} - -/** - * Determines the current state of the toolbar drawer's visibility. - * - * @return - * TRUE when drawer is collapsed, FALSE when it is expanded. - */ -function _toolbar_is_collapsed() { - // PHP converts dots into underscores in cookie names to avoid problems with - // its parser, so we use a converted cookie name. - return isset($_COOKIE['Drupal_toolbar_collapsed']) ? $_COOKIE['Drupal_toolbar_collapsed'] : 0; -} - -/** * Implements hook_page_build(). * - * Add admin toolbar to the page_top region automatically. + * Add admin toolbar to the page_bottom region automatically. */ function toolbar_page_build(&$page) { - $page['page_top']['toolbar'] = array( + $page['page_bottom']['toolbar'] = array( '#pre_render' => array('toolbar_pre_render'), '#access' => user_access('access toolbar'), - 'toolbar_drawer' => array(), ); } @@ -139,20 +73,6 @@ function toolbar_pre_render($toolbar) { } /** - * Implements hook_preprocess_HOOK() for html.tpl.php. - * - * Add some page classes, so global page theming can adjust to the toolbar. - */ -function toolbar_preprocess_html(&$vars) { - if (isset($vars['page']['page_top']['toolbar']) && user_access('access toolbar')) { - $vars['attributes']['class'][] = 'toolbar'; - if (!_toolbar_is_collapsed()) { - $vars['attributes']['class'][] = 'toolbar-drawer'; - } - } -} - -/** * Implements hook_preprocess_HOOK() for toolbar.tpl.php. * * Adding the 'overlay-displace-top' class to the toolbar pushes the overlay @@ -165,7 +85,7 @@ function toolbar_preprocess_toolbar(&$variables) { /** * Implements hook_system_info_alter(). * - * Indicate that the 'page_top' region (in which the toolbar will be displayed) + * Indicate that the 'page_bottom' region (in which the toolbar will be displayed) * is an overlay supplemental region that should be refreshed whenever its * content is updated. * @@ -174,98 +94,157 @@ function toolbar_preprocess_toolbar(&$variables) { */ function toolbar_system_info_alter(&$info, $file, $type) { if ($type == 'theme') { - $info['overlay_supplemental_regions'][] = 'page_top'; + $info['overlay_supplemental_regions'][] = 'page_bottom'; } } /** - * Builds the admin menu as a structured array ready for drupal_render(). - * - * @return - * Array of links and settings relating to the admin menu. + * Implements hook_toolbar(). */ -function toolbar_view() { - global $user; +function toolbar_toolbar() { + $items = array(); - $build = array( - '#theme' => 'toolbar', - '#attached'=> array( - 'library' => array( - array('toolbar', 'drupal.toolbar'), + // The 'Home' tab is a simple link, with no corresponding tray. + $items['home'] = array( + 'tab' => array( + 'title' => t('Home'), + 'href' => '', + 'html' => FALSE, + 'attributes' => array( + 'title' => t('Home page'), ), ), + 'weight' => -10, ); - // Retrieve the admin menu from the database. - $links = toolbar_menu_navigation_links(toolbar_get_menu_tree()); - $build['toolbar_menu'] = array( - '#theme' => 'links__toolbar_menu', - '#links' => $links, - '#attributes' => array('id' => 'toolbar-menu'), - '#heading' => array('text' => t('Administrative toolbar'), 'level' => 'h2', 'class' => 'element-invisible'), + // Retrieve the administration menu from the database. + $tree = toolbar_get_menu_tree(); + + // Add attributes to the links before rendering. + toolbar_menu_navigation_links($tree); + + $menu = array(); + $menu['toolbar_administration'] = array( + '#type' => 'container', + '#attributes' => array( + 'class' => array('interactive-menu', 'toolbar-list'), + ), + 'administration_menu' => menu_tree_output($tree), ); - // Add logout & user account links or login link. - if ($user->uid) { - $links = array( - 'account' => array( - 'title' => t('Hello @username', array('@username' => user_format_name($user))), - 'href' => 'user', - 'html' => TRUE, - 'attributes' => array('title' => t('User account')), - ), - 'logout' => array( - 'title' => t('Log out'), - 'href' => 'user/logout', - ), - ); - } - else { - $links = array( - 'login' => array( - 'title' => t('Log in'), - 'href' => 'user', + $items['administration'] = array( + 'tab' => array( + 'title' => t('Menu'), + 'href' => 'admin', + 'html' => FALSE, + 'attributes' => array( + 'title' => t('Admin menu'), ), + ), + 'tray' => $menu, + 'weight' => -5, + ); + + return $items; +} + +/** + * Builds the Toolbar as a structured array ready for drupal_render(). + * + * @return + * A renderable arrray, with two children: + * - 'toolbar_tabs': an array of links, rendered by theme('links'). + * - 'toolbar_tray': an array of render elements, at moat one of which is + * displayed at once, when the corresponding tab is activated. The trays + * are rendered by theme('toolbar_tray'). + */ +function toolbar_view() { + + $build = array('#theme' => 'toolbar'); + $build['#attached']['library'][] = array('toolbar', 'toolbar'); + + // Get the configured breakpoint for switch from vertical to horizontal + // toolbar presentation. + $breakpoints = entity_load('breakpoint_group', 'module.toolbar.toolbar'); + if (!empty($breakpoints)) { + $media_queries = array(); + $media_queries['toolbar']['breakpoints'] = array_map( + function($object) {return $object->mediaQuery;}, + $breakpoints->breakpoints); + + $build['#attached']['js'] = array(); + $build['#attached']['js'][] = array( + 'data' => $media_queries, + 'type' => 'setting', ); + // // Load the breakpoints for toolbar. + foreach ($breakpoints->breakpoints as $key => $breakpoint) { + $build['#attached']['js'][0]['data']['toolbar']['breakpoints'][$key] = $breakpoint->mediaQuery; + } } - $build['toolbar_user'] = array( - '#theme' => 'links__toolbar_user', - '#links' => $links, - '#attributes' => array('id' => 'toolbar-user'), - ); - // Add a "home" link. - $link = array( - 'home' => array( - 'title' => 'Home', - 'href' => '', - 'html' => TRUE, - 'attributes' => array('title' => t('Home')), - ), - ); - $build['toolbar_home'] = array( - '#theme' => 'links', - '#links' => $link, - '#attributes' => array('id' => 'toolbar-home'), + // Get toolbar items from all modules that implement hook_toolbar() or + // hook_toolbar_alter(). + $toolbar_groups = module_invoke_all('toolbar'); + drupal_alter('toolbar', $toolbar_groups); + uasort($toolbar_groups, 'drupal_sort_weight'); + + // Build the tabs and trays from the toolbar groups. + $toolbar_tabs = array(); + $toolbar_trays = array(); + $tab_defaults = array( + 'title' => '', + 'href' => '', + 'html' => FALSE, + 'attributes' => array(), ); - // Add an anchor to be able to toggle the visibility of the drawer. - $build['toolbar_toggle'] = array( - '#theme' => 'toolbar_toggle', - '#collapsed' => _toolbar_is_collapsed(), - '#attributes' => array('class' => array('toggle')), + foreach ($toolbar_groups as $category => $items) { + if ($tab = $items['tab']) { + // Log a warning if the tab is already defined. + if (array_key_exists($category, $toolbar_tabs)) { + watchdog('toolbar', 'Toolbar tab %category is already defined.', + array('$category' => $category) + ); + } + + // Merge in the defaults. + $tab += $tab_defaults; + $tab['attributes'] += array('class' => array()); + $tab['attributes']['class'] += array('tab'); + + // Provide a data attribute linking each tab to the corresponding tray. + // Unlike the defaults above, these properties may override values. + $tab['attributes']['data-toolbar-tray'] = $category; + $tab['attributes']['role'] = 'button'; + + $toolbar_tabs[$category] = $tab; + } + if (!empty($items['tray'])) { + if (array_key_exists($category, $toolbar_trays)) { + array_merge($toolbar_trays[$category], $items['tray']); + } + else { + $toolbar_trays[$category] = $items['tray']; + } + } + } + + // Assign the tabs to the build. + $build['toolbar_tabs'] = array( + '#theme' => 'links', + '#links' => $toolbar_tabs, + '#attributes' => array( + 'class' => array('bar', 'clearfix'), + ), + '#heading' => array('text' => t('Drupal toolbar'), 'level' => 'h2', 'class' => 'element-invisible'), ); - // Prepare the drawer links CSS classes. - $toolbar_drawer_classes = array( - 'toolbar-drawer', - 'clearfix', + // Assign the trays to the build. + $build['toolbar_trays'] = array( + '#theme' => 'toolbar_tray', + '#trays' => $toolbar_trays, ); - if (_toolbar_is_collapsed()) { - $toolbar_drawer_classes[] = 'collapsed'; - } - $build['toolbar_drawer']['#type'] = 'container'; - $build['toolbar_drawer']['#attributes']['class'] = $toolbar_drawer_classes; return $build; } @@ -280,14 +259,13 @@ function toolbar_get_menu_tree() { $tree = array(); $admin_link = db_query('SELECT * FROM {menu_links} WHERE menu_name = :menu_name AND module = :module AND link_path = :path', array(':menu_name' => 'admin', ':module' => 'system', ':path' => 'admin'))->fetchAssoc(); if ($admin_link) { - $tree = menu_build_tree('admin', array( - 'expanded' => array($admin_link['mlid']), - 'min_depth' => $admin_link['depth'] + 1, - 'max_depth' => $admin_link['depth'] + 1, - )); + $tree = menu_tree_all_data('admin'); } - - return $tree; + // Return the sub-menus of the admin menu root. + foreach ($tree as $key => $menu) { + return (!empty($tree[$key]['below'])) ? $tree[$key]['below'] : array(); + } + return array(); } /** @@ -299,34 +277,31 @@ function toolbar_get_menu_tree() { * @return * An array of links as defined above. */ -function toolbar_menu_navigation_links($tree) { - $links = array(); - foreach ($tree as $item) { - if (!$item['link']['hidden'] && $item['link']['access']) { - // Make sure we have a path specific ID in place, so we can attach icons - // and behaviors to the items. - $id = str_replace(array('/', '<', '>'), array('-', '', ''), $item['link']['href']); - - $link = $item['link']['localized_options']; - $link['href'] = $item['link']['href']; - // Add icon placeholder. - $link['title'] = '' . check_plain($item['link']['title']); - // Add admin link ID. - $link['attributes'] = array('id' => 'toolbar-link-' . $id); - if (!empty($item['link']['description'])) { - $link['title'] .= ' (' . $item['link']['description'] . ')'; - $link['attributes']['title'] = $item['link']['description']; - } - $link['html'] = TRUE; - - $class = ' path-' . $id; - if (toolbar_in_active_trail($item['link']['href'])) { - $class .= ' active-trail'; - } - $links['menu-' . $item['link']['mlid'] . $class] = $link; +function toolbar_menu_navigation_links(&$tree) { + foreach ($tree as $key => $item) { + // Configure sub-items. + if (!empty($item['below'])) { + toolbar_menu_navigation_links($tree[$key]['below']); } + // Make sure we have a path specific ID in place, so we can attach icons + // and behaviors to the items. + $tree[$key]['link']['localized_options']['attributes']['id'] = 'toolbar-link-' . str_replace(array('/', '<', '>'), array('-', '', ''), $item['link']['link_path']); + } +} + +/** + * + */ +function theme_toolbar_tray($trays) { + $output = ''; + + foreach ($trays['element']['#trays'] as $key => $tray) { + $output .= ''; } - return $links; + + return $output; } /** @@ -361,21 +336,41 @@ function toolbar_in_active_trail($path) { * Implements hook_library_info(). */ function toolbar_library_info() { - $libraries['drupal.toolbar'] = array( + $libraries['toolbar'] = array( 'title' => 'Toolbar', 'version' => VERSION, 'js' => array( - drupal_get_path('module', 'toolbar') . '/toolbar.js' => array(), + drupal_get_path('module', 'toolbar') . '/js/toolbar.js' => array(), ), 'css' => array( - drupal_get_path('module', 'toolbar') . '/toolbar.css', + drupal_get_path('module', 'toolbar') . '/css/toolbar.base.css', + drupal_get_path('module', 'toolbar') . '/css/toolbar.theme.css', + drupal_get_path('module', 'toolbar') . '/css/toolbar.icons.css', ), 'dependencies' => array( array('system', 'jquery'), array('system', 'drupal'), array('system', 'drupalSettings'), + array('system', 'matchmedia'), + array('system', 'jquery.once'), + array('system', 'drupal.debounce'), + array('toolbar', 'toolbar.interactiveMenu'), + ), + ); + + $libraries['toolbar.interactiveMenu'] = array( + 'title' => 'Toolbar interactive menu decorator', + 'version' => VERSION, + 'js' => array( + drupal_get_path('module', 'toolbar') . '/js/interactivemenu.js' => array(), + ), + 'css' => array( + drupal_get_path('module', 'toolbar') . '/css/interactivemenu.css', + ), + 'dependencies' => array( + array('system', 'jquery'), + array('system', 'drupal'), array('system', 'jquery.once'), - array('system', 'jquery.cookie'), ), ); diff --git a/core/modules/user/user.css b/core/modules/user/user.css index 866ee40..d7fff65 100644 --- a/core/modules/user/user.css +++ b/core/modules/user/user.css @@ -1,4 +1,3 @@ - #permissions td.module { font-weight: bold; } @@ -88,3 +87,14 @@ div.password-suggestions ul { .profile dd { margin: 0 0 1em 0; } + +/** + * Toolbar icon. + */ +.toolbar-main .user .tab { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iNDkuOTk5NSIgeTE9IjQuMDc3MSIgeDI9IjQ5Ljk5OTUiIHkyPSI4OC44ODc0Ij4NCgk8c3RvcCAgb2Zmc2V0PSIwIiBzdHlsZT0ic3RvcC1jb2xvcjojQ0NDQ0NDIi8+DQoJPHN0b3AgIG9mZnNldD0iMSIgc3R5bGU9InN0b3AtY29sb3I6Izk5OTk5OSIvPg0KPC9saW5lYXJHcmFkaWVudD4NCjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBmaWxsPSJ1cmwoI1NWR0lEXzFfKSIgZD0iTTI4LjQyNCwyNy42NTNjMCwxMS45NjMsOS42NTMsMjEuNjUzLDIxLjU3NiwyMS42NTMNCgljMTEuOTIyLDAsMjEuNTc0LTkuNjksMjEuNTc0LTIxLjY1M0M3MS41NzQsMTUuNjkyLDYxLjkyMiw2LDUwLDZDMzguMDc3LDYsMjguNDI0LDE1LjY5MiwyOC40MjQsMjcuNjUzeiBNMTAwLDkwLjYxNQ0KCWMwLTIwLjM0Ni0xLjExNS0zNS40MjMtNTAtMzUuNDIzYy00OC44MDgsMC01MCwxNC4zMDctNTAsMzUuNDIzSDEwMHoiLz4NCjwvc3ZnPg0K); +} +.toolbar-main .user .tab:active, +.toolbar-main .user.active .tab { + background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxNi4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkxheWVyXzEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4Ig0KCSB3aWR0aD0iMTAwcHgiIGhlaWdodD0iMTAwcHgiIHZpZXdCb3g9IjAgMCAxMDAgMTAwIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxMDAgMTAwIiB4bWw6c3BhY2U9InByZXNlcnZlIj4NCjxsaW5lYXJHcmFkaWVudCBpZD0iU1ZHSURfMV8iIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iNTAiIHkxPSI5Ni45MjI5IiB4Mj0iNTAiIHkyPSIxMi4xMTI2IiBncmFkaWVudFRyYW5zZm9ybT0ibWF0cml4KDEgMCAwIC0xIDAgMTAxKSI+DQoJPHN0b3AgIG9mZnNldD0iMCIgc3R5bGU9InN0b3AtY29sb3I6I0ZGRkZGRiIvPg0KCTxzdG9wICBvZmZzZXQ9IjAuOTkwMSIgc3R5bGU9InN0b3AtY29sb3I6I0U1RTVFNSIvPg0KPC9saW5lYXJHcmFkaWVudD4NCjxwYXRoIGZpbGw9InVybCgjU1ZHSURfMV8pIiBkPSJNMjguNDI0LDI3LjY1M2MwLDExLjk2Myw5LjY1MywyMS42NTMsMjEuNTc2LDIxLjY1M2MxMS45MjIsMCwyMS41NzQtOS42OSwyMS41NzQtMjEuNjUzDQoJQzcxLjU3NCwxNS42OTIsNjEuOTIyLDYsNTAsNkMzOC4wNzcsNiwyOC40MjQsMTUuNjkyLDI4LjQyNCwyNy42NTN6IE0xMDAsOTAuNjE1YzAtMjAuMzQ2LTEuMTE1LTM1LjQyNC01MC0zNS40MjQNCgljLTQ4LjgwOCwwLTUwLDE0LjMwOC01MCwzNS40MjRIMTAweiIvPg0KPC9zdmc+DQo=); +} diff --git a/core/modules/user/user.module b/core/modules/user/user.module index f1d3254..fbea0b4 100644 --- a/core/modules/user/user.module +++ b/core/modules/user/user.module @@ -3065,6 +3065,73 @@ function user_file_download_access($field, EntityInterface $entity, File $file) } /** + * Implements hook_toolbar(). + */ +function user_toolbar() { + global $user; + + $items['user'] = array( + 'tab' => array( + 'title' => user_format_name($user), + 'href' => 'user', + 'html' => FALSE, + 'attributes' => array( + 'title' => t('My account'), + ), + ), + 'tray' => array( + '#pre_render' => array('user_toolbar_pre_render'), + ), + ); + + return $items; +} + +/** + * Pre-render function for adding user account actions to the toolbar. + */ +function user_toolbar_pre_render($toolbar) { + global $user; + + // Add logout & user account links or login link. + if ($user->uid) { + $links = array( + 'account' => array( + 'title' => t('View profile'), + 'href' => 'user', + 'html' => TRUE, + 'attributes' => array( + 'title' => t('User account'), + ), + ), + 'logout' => array( + 'title' => t('Log out'), + 'href' => 'user/logout', + ), + ); + } + else { + $links = array( + 'login' => array( + 'title' => t('Log in'), + 'href' => 'user', + ), + ); + } + + $user_links = array( + '#theme' => 'links__toolbar_user', + '#links' => $links, + '#attributes' => array( + 'class' => array('toolbar-list'), + ), + '#heading' => array('text' => t('User account actions'), 'level' => 'h2', 'class' => 'element-invisible'), + ); + + return $user_links; +} + +/** * Implements hook_library_info(). */ function user_library_info() { -- 1.7.10.4