diff --git a/core/config.class.inc.php b/core/config.class.inc.php index 7faec4710..8b1141423 100644 --- a/core/config.class.inc.php +++ b/core/config.class.inc.php @@ -1412,6 +1412,19 @@ class Config return $this->m_aSettings[$sPropCode]['value']; } + /** + * Whether the $sPropCode parameter has a custom value or the default one. + * + * @param string $sPropCode + * + * @return bool true if the $sPropCode parameter has been customized, false if it is the default value. + * @since 3.0.0 + */ + public function IsCustomValue(string $sPropCode): bool + { + return $this->m_aSettings[$sPropCode]['value'] !== $this->m_aSettings[$sPropCode]['default']; + } + /** * Event log options (see LOG_... definition) */ diff --git a/css/backoffice/components/_quick-create.scss b/css/backoffice/components/_quick-create.scss index 00b8992f1..bbe3f43dd 100644 --- a/css/backoffice/components/_quick-create.scss +++ b/css/backoffice/components/_quick-create.scss @@ -41,20 +41,25 @@ $ibo-quick-create--drawer--top: -1 * ($ibo-quick-create--drawer--max-height) !de $ibo-quick-create--drawer--top--is-opened: 100% !default; $ibo-quick-create--drawer--background-color: $ibo-color-white-100 !default; -$ibo-quick-create--compartment-title--margin-bottom: 8px !default; +$ibo-quick-create--compartment-title--margin-top: 8px !default; +$ibo-quick-create--compartment-title--margin-bottom: $ibo-quick-create--compartment-title--margin-top !default; $ibo-quick-create--compartment-title--padding-left: 32px !default; $ibo-quick-create--compartment-title--text-color: $ibo-color-grey-600 !default; $ibo-quick-create--compartment-title--line-spacing: 8px !default; $ibo-quick-create--compartment-content--text-color: $ibo-color-grey-900 !default; -$ibo-quick-create--compartment-element--margin-bottom: 8px !default; - -$ibo-quick-create--compartment-results--element--option: $ibo-quick-create--compartment-element--margin-bottom !default; +$ibo-quick-create--compartment-element--padding-x: 8px !default; +$ibo-quick-create--compartment-element--padding-y: 4px !default; +$ibo-quick-create--compartment-element--margin-x: -1 * $ibo-quick-create--compartment-element--padding-x !default; +$ibo-quick-create--compartment-element--background-color--is-active: $ibo-color-grey-200 !default; +$ibo-quick-create--compartment-element--border-radius--is-active: $ibo-border-radius-300 !default; $ibo-quick-create--compartment-element-image--margin-right: 8px !default; $ibo-quick-create--compartment-element-image--width: 20px !default; +$ibo-quick-create--compartment-results--container--width: 100% !important !default; + $ibo-quick-create--compartment--placeholder-image--margin-top: 24px !default; $ibo-quick-create--compartment--placeholder-image--margin-bottom: 16px !default; $ibo-quick-create--compartment--placeholder-image--margin-x: auto !default; @@ -168,6 +173,7 @@ $ibo-quick-create--compartment--placeholder-hint--text-color: $ibo-color-grey-70 @extend %ibo-font-ral-nor-100; } .ibo-quick-create--compartment-title{ + margin-top: $ibo-quick-create--compartment-title--margin-top; margin-bottom: $ibo-quick-create--compartment-title--margin-bottom; padding-left: $ibo-quick-create--compartment-title--padding-left; overflow-x: hidden; @@ -202,27 +208,41 @@ $ibo-quick-create--compartment--placeholder-hint--text-color: $ibo-color-grey-70 .ibo-quick-create--compartment-element{ display: flex; align-items: center; + padding: $ibo-quick-create--compartment-element--padding-y $ibo-quick-create--compartment-element--padding-x; + margin-left: $ibo-quick-create--compartment-element--margin-x; + margin-right: $ibo-quick-create--compartment-element--margin-x; color: inherit; @extend %ibo-text-truncated-with-ellipsis; - - &:not(:last-child){ - margin-bottom: $ibo-quick-create--compartment-element--margin-bottom; - } } .ibo-quick-create--compartment-element-image{ margin-right: $ibo-quick-create--compartment-element-image--margin-right; width: $ibo-quick-create--compartment-element-image--width; } +.ibo-quick-create--compartment-results--container{ + width: $ibo-quick-create--compartment-results--container--width; +} .ibo-quick-create--compartment-results--element > .option{ - margin-bottom: $ibo-quick-create--compartment-element--margin-bottom; + padding: $ibo-quick-create--compartment-element--padding-y $ibo-quick-create--compartment-element--padding-x; + margin-left: $ibo-quick-create--compartment-element--margin-x; + margin-right: $ibo-quick-create--compartment-element--margin-x; color: inherit; - + + @extend %ibo-text-truncated-with-ellipsis; + + &.active{ + background-color: $ibo-quick-create--compartment-element--background-color--is-active; + border-radius: $ibo-quick-create--compartment-element--border-radius--is-active; + } &:hover{ cursor: pointer; @extend a:hover; } + + .highlight{ + font-weight: bold; + } } .ibo-quick-create--compartment--placeholder{ diff --git a/css/backoffice/layout/_navigation-menu.scss b/css/backoffice/layout/_navigation-menu.scss index eb39e5b7b..0c1fbdb50 100644 --- a/css/backoffice/layout/_navigation-menu.scss +++ b/css/backoffice/layout/_navigation-menu.scss @@ -31,15 +31,6 @@ $ibo-navigation-menu--top-part--padding-y: $ibo-navigation-menu--body--padding-y $ibo-navigation-menu--top-part--padding-x: $ibo-navigation-menu--body--padding-x !default; $ibo-navigation-menu--top-part--elements-spacing: 20px !default; -$ibo-navigation-menu--silo-selection--width: 70% !default; -$ibo-navigation-menu--silo-selection--margin-left: 15px !default; -$ibo-navigation-menu--silo-selection--input--action-button--hierarchy--padding-right: -42px !default; -$ibo-navigation-menu--silo-selection--input--padding-right: 38px !default; -$ibo-navigation-menu--silo-selection--input-select--action-button--hierarchy--margin-left: -42px !default; -$ibo-navigation-menu--silo-selection--input-select-autocomplete--padding-left: 60px !default; -$ibo-navigation-menu--silo-selection--input-select-autocomplete--action-button--search--margin-left: -42px !default; -$ibo-navigation-menu--silo-selection--input-select-autocomplete--action-button--hierarchy--margin-left: -60px !default; - $ibo-navigation-menu--middle-part--padding-top: 24px !default; $ibo-navigation-menu--middle-part--padding-bottom: 16px !default; $ibo-navigation-menu--middle-part--padding-x: $ibo-navigation-menu--body--padding-x !default; @@ -58,6 +49,26 @@ $ibo-navigation-menu--bottom-part--background-color: $ibo-color-grey-800 !defaul $ibo-navigation-menu--bottom-part--is-expanded--padding-top: 24px !default; $ibo-navigation-menu--bottom-part--is-expanded--padding-bottom: 12px !default; +$ibo-navigation-menu--visual-hint--size: 16px !default; +$ibo-navigation-menu--visual-hint--background-color: $ibo-color-red-600 !default; +$ibo-navigation-menu--visual-hint--border-radius: $ibo-border-radius-full !default; + +$ibo-navigation-menu--silo-selection--width: 70% !default; +$ibo-navigation-menu--silo-selection--margin-left: 15px !default; +$ibo-navigation-menu--silo-selection--input--action-button--hierarchy--padding-right: -42px !default; +$ibo-navigation-menu--silo-selection--input--padding-right: 38px !default; +$ibo-navigation-menu--silo-selection--input-select--action-button--hierarchy--margin-left: -42px !default; +$ibo-navigation-menu--silo-selection--input-select-autocomplete--padding-left: 60px !default; +$ibo-navigation-menu--silo-selection--input-select-autocomplete--action-button--search--margin-left: -42px !default; +$ibo-navigation-menu--silo-selection--input-select-autocomplete--action-button--hierarchy--margin-left: -60px !default; + +$ibo-navigation-menu--silo-visual-hint--top: 2px !default; +$ibo-navigation-menu--silo-visual-hint--right: 0 !default; +$ibo-navigation-menu--silo-visual-hint--size: $ibo-navigation-menu--visual-hint--size !default; +$ibo-navigation-menu--silo-visual-hint--background-color: $ibo-navigation-menu--visual-hint--background-color !default; +$ibo-navigation-menu--silo-visual-hint--border: 2px solid $ibo-navigation-menu--body--background-color !default; +$ibo-navigation-menu--silo-visual-hint--border-radius: $ibo-navigation-menu--visual-hint--border-radius !default; + $ibo-navigation-menu--action--padding-x: 8px !default; $ibo-navigation-menu--action--padding-y: 10px !default; $ibo-navigation-menu--action--border-radius: $ibo-border-radius-500 !default; @@ -163,13 +174,12 @@ $ibo-navigation-menu--notifications-toggler--color: $ibo-color-grey-600 !default $ibo-navigation-menu--notifications-toggler--color--is-loaded: $ibo-color-grey-300 !default; $ibo-navigation-menu--notifications-toggler--color--on-hover: $ibo-color-white-200 !default; -$ibo-navigation-menu--notifications-toggler--new-messages--width: 16px !default; -$ibo-navigation-menu--notifications-toggler--new-messages--height: 16px !default; $ibo-navigation-menu--notifications-toggler--new-messages--top: -2px !default; $ibo-navigation-menu--notifications-toggler--new-messages--right: -7px !default; -$ibo-navigation-menu--notifications-toggler--new-messages--background-color: $ibo-color-red-600 !default; -$ibo-navigation-menu--notifications-toggler--new-messages--border: solid 2px $ibo-navigation-menu--bottom-part--background-color !default; -$ibo-navigation-menu--notifications-toggler--new-messages--border-radius: $ibo-border-radius-full !default; +$ibo-navigation-menu--notifications-toggler--new-messages--size: $ibo-navigation-menu--visual-hint--size !default; +$ibo-navigation-menu--notifications-toggler--new-messages--background-color: $ibo-navigation-menu--visual-hint--background-color !default; +$ibo-navigation-menu--notifications-toggler--new-messages--border: 2px solid $ibo-navigation-menu--bottom-part--background-color !default; +$ibo-navigation-menu--notifications-toggler--new-messages--border-radius: $ibo-navigation-menu--visual-hint--border-radius !default; $ibo-navigation-menu--user-notifications--notifications-toggler--new-messages--width: 10px !default; $ibo-navigation-menu--user-notifications--notifications-toggler--new-messages--height: 10px !default; @@ -215,6 +225,9 @@ $ibo-navigation-menu--user-info--height--is-expanded: 100% !default; .ibo-navigation-menu--silo-selection{ display: inline-block; } + .ibo-navigation-menu--silo-visual-hint{ + display: none; + } .ibo-navigation-menu--body{ width: $ibo-navigation-menu--body--width-expanded; @@ -383,6 +396,7 @@ $ibo-navigation-menu--user-info--height--is-expanded: 100% !default; } /* - Toggler */ .ibo-navigation-menu--toggler{ + position: relative; /* For the silo visual hint to be placed relatively to it */ display: inline-flex; /* Width is define here in addition of the icon so we can fix its width whether the menu is collapsed or expanded */ width: $ibo-navigation-menu--toggler--width; @@ -447,6 +461,16 @@ $ibo-navigation-menu--user-info--height--is-expanded: 100% !default; } } } +.ibo-navigation-menu--silo-visual-hint{ + position: absolute; + top: $ibo-navigation-menu--silo-visual-hint--top; + right: $ibo-navigation-menu--silo-visual-hint--right; + width: $ibo-navigation-menu--silo-visual-hint--size; + height: $ibo-navigation-menu--silo-visual-hint--size; + background-color: $ibo-navigation-menu--silo-visual-hint--background-color; + border: $ibo-navigation-menu--silo-visual-hint--border; + border-radius: $ibo-navigation-menu--silo-visual-hint--border-radius; +} /* - Menu groups */ @@ -698,8 +722,8 @@ $ibo-navigation-menu--user-info--height--is-expanded: 100% !default; .ibo-navigation-menu--notifications-toggler--new-messages{ top: $ibo-navigation-menu--notifications-toggler--new-messages--top; right: $ibo-navigation-menu--notifications-toggler--new-messages--right; - width: $ibo-navigation-menu--notifications-toggler--new-messages--width; - height: $ibo-navigation-menu--notifications-toggler--new-messages--height; + width: $ibo-navigation-menu--notifications-toggler--new-messages--size; + height: $ibo-navigation-menu--notifications-toggler--new-messages--size; } } diff --git a/datamodels/2.x/itop-portal-base/portal/public/css/bootstrap-theme-combodo.css b/datamodels/2.x/itop-portal-base/portal/public/css/bootstrap-theme-combodo.css index 9f9d9fbf7..b38529a02 100644 --- a/datamodels/2.x/itop-portal-base/portal/public/css/bootstrap-theme-combodo.css +++ b/datamodels/2.x/itop-portal-base/portal/public/css/bootstrap-theme-combodo.css @@ -1,4 +1,21 @@ -/* +/*! + * Copyright (C) 2013-2020 Combodo SARL + * + * This file is part of iTop. + * + * iTop is free software; you can redistribute it and/or modify + * it under the terms of the GNU Affero General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * iTop is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU Affero General Public License for more details. + * + * You should have received a copy of the GNU Affero General Public License + */ +/*! * Copyright (C) 2013-2020 Combodo SARL * * This file is part of iTop. @@ -15,11 +32,22 @@ * * You should have received a copy of the GNU Affero General Public License */ - /*! * Combodo portal theme v2.7.0 * Based on Bootswatch Simplex */ +/*! + * bootswatch v3.3.5 + * Homepage: http://bootswatch.com + * Copyright 2012-2015 Thomas Park + * Licensed under MIT + * Based on Bootstrap + */ +/*! + * Bootstrap v3.3.5 (http://getbootstrap.com) + * Copyright 2011-2015 Twitter, Inc. + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + */ * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; diff --git a/datamodels/2.x/itop-portal-base/portal/public/css/portal.css b/datamodels/2.x/itop-portal-base/portal/public/css/portal.css index abb11f52b..90fe7787d 100644 --- a/datamodels/2.x/itop-portal-base/portal/public/css/portal.css +++ b/datamodels/2.x/itop-portal-base/portal/public/css/portal.css @@ -34,60 +34,60 @@ */ /*! * Combodo portal template v1.0.0 -*/ + */ /*******************/ /* Global settings */ /*******************/ @media (max-width: 768px) { body { - padding-top: 60px; } - + padding-top: 60px; + } body.home { - padding-top: 70px; } } + padding-top: 70px; + } +} footer { margin: 5em 1em; - text-align: center; } - + text-align: center; +} /* Environment banner */ #envbanner { position: relative; z-index: 10; padding: 5px 15px; - text-align: center; } - + text-align: center; +} #envbanner > button { margin-left: 5px; - color: #000; } - + color: #000; +} /* Navigation menu */ -.navbar-nav .dropdown-menu a .glyphicon, -.user_infos .dropdown-menu a .glyphicon { - margin-right: 15px; } - -.nav > li > a > span.brick_icon, -.dropdown-menu > li > a > span.brick_icon { +.navbar-nav .dropdown-menu a .glyphicon, .user_infos .dropdown-menu a .glyphicon { + margin-right: 15px; +} +.nav > li > a > span.brick_icon, .dropdown-menu > li > a > span.brick_icon { margin-right: 20px; - vertical-align: sub; } - + vertical-align: sub; +} /* Topbar */ #topbar .navbar-header { position: relative; - z-index: 2; } - + z-index: 2; +} #topbar .navbar-collapse { position: relative; z-index: 1; - overflow-y: auto; } - + overflow-y: auto; +} #topbar .navbar-collapse > .navbar-nav { - padding-top: 30px; } - + padding-top: 30px; +} #topbar .navbar-brand > img { - max-height: 100%; } - + max-height: 100%; +} #topbar .user_infos { - text-decoration: none; } - + text-decoration: none; +} #topbar .user_photo { position: absolute; display: block; @@ -100,8 +100,8 @@ footer { background-color: #585653; border: 2px solid #FFFFFF; border-radius: 100%; - box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4); } - + box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4); +} #topbar .user_fullname { display: inline-block; position: absolute; @@ -110,8 +110,8 @@ footer { /*color: $white;*/ white-space: nowrap; text-overflow: ellipsis; - overflow-x: hidden; } - + overflow-x: hidden; +} /* Sidebar */ @media (min-width: 768px) { #sidebar { @@ -120,12 +120,12 @@ footer { left: 0px; padding: 0px; /* Overriding BS */ - height: 100%; } - + height: 100%; + } #sidebar .user_card { padding: 30px 0px; - text-align: center; } - + text-align: center; + } #sidebar .user_card .user_photo { margin: 0px auto 10px auto; width: 80px; @@ -135,60 +135,64 @@ footer { background-color: #585653; background-repeat: no-repeat; border: 2px solid #FFFFFF; - border-radius: 100%; } - + border-radius: 100%; + } #sidebar .user_card .user_infos { font-size: 1em; - color: #FFFFFF; } - + color: #FFFFFF; + } #sidebar .user_card .user_infos .dropdown-toggle { - color: #FFFFFF; } - + color: #FFFFFF; + } #sidebar .user_card .user_options.dropdown-menu { width: 92%; - left: 4%; } - + left: 4%; + } #sidebar .user_card .user_fullname { - font-weight: 600; } - + font-weight: 600; + } #sidebar .menu { max-height: 59%; overflow-y: auto; - overflow-x: hidden; } - + overflow-x: hidden; + } #sidebar .menu .navbar-nav { - width: 100%; } - + width: 100%; + } #sidebar .menu .navbar-nav > li { - width: 100%; } - + width: 100%; + } #sidebar .menu .navbar-nav > li > a > .brick_icon { width: 1.2em; vertical-align: sub; text-align: center; - margin-right: 10px; } - + margin-right: 10px; + } #sidebar .logo { position: absolute; bottom: 15px; width: 100%; - text-align: center; } - + text-align: center; + } #sidebar .logo img { max-width: 100%; - max-height: 50px; } - - /* Main content */ + max-height: 50px; + /* Main content */ + } #main-wrapper { - margin-top: 20px; } } + margin-top: 20px; + } +} /* Warning : Not a offical BS breakpoint */ @media (min-width: 1600px) { #sidebar .user_card .user_photo { width: 120px; - height: 120px; } - + height: 120px; + } #sidebar .menu .nav > li > a > .brick_icon { - margin-right: 20px; } } + margin-right: 20px; + } +} /* Overlays*/ .global_overlay { z-index: 9999; @@ -199,19 +203,19 @@ footer { width: 100%; height: 100%; background-color: black; - opacity: 0.5; } - + opacity: 0.5; +} #page_overlay .overlay_content { margin-top: 20em; width: 100%; - color: white; } - + color: white; +} .overlay_content { - text-align: center; } - + text-align: center; +} .content_loader { - text-align: center; } - + text-align: center; +} .content_loader .icon { margin-bottom: 0.3em; /*width: 52px;*/ @@ -223,16 +227,16 @@ footer { animation: spin 1.2s linear infinite; -webkit-animation: spin 1.2s linear infinite; -moz-animation: spin 1.2s linear infinite; - -ms-animation: spin 1.2s linear infinite; } - + -ms-animation: spin 1.2s linear infinite; +} .content_loader .message { font-size: 1.5em; - /* 2em; */ } - + /* 2em; */ +} .datatables_overlay { padding: 5% 0px !important; - background-color: white; } - + background-color: white; +} /******************/ /* Global classes */ /******************/ @@ -249,113 +253,123 @@ footer { -moz-box-align: center; -ms-flex-align: center; align-items: center; - /* Also 'margin: 0 auto' doesn't have any effect on flex items in such web browsers - hence the bootstrap's container won't be aligned to the center anymore. - - Therefore, we should use the following declarations to get it centered again */ -webkit-box-pack: center; + /* Also 'margin: 0 auto' doesn't have any effect on flex items in such web browsers + hence the bootstrap's container won't be aligned to the center anymore. + Therefore, we should use the following declarations to get it centered again */ -moz-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; - justify-content: center; } - + justify-content: center; +} .text_decoration { vertical-align: baseline; - margin-right: 8px; } - + margin-right: 8px; +} /*********************/ /* Global animations */ /*********************/ /* Spin */ @keyframes spin { 100% { - transform: rotate(360deg); } } + transform: rotate(360deg); + } +} @-webkit-keyframes spin { 100% { - -webkit-transform: rotate(360deg); } } + -webkit-transform: rotate(360deg); + } +} @-moz-keyframes spin { 100% { - -moz-transform: rotate(360deg); } } + -moz-transform: rotate(360deg); + } +} @-ms-keyframes spin { 100% { - -ms-transform: rotate(360deg); } } + -ms-transform: rotate(360deg); + } +} /*********************/ /* BS theme override */ /*********************/ .list-group.tree { margin-top: 11px; - margin-bottom: -11px; } - + margin-bottom: -11px; +} .list-group.tree .list-group-item { padding-right: 0px; - /* To align all actions on the right without indent */ } - + /* To align all actions on the right without indent */ +} /******************/ /* Modal settings */ /******************/ #modal-for-alert { z-index: 9999; - /* Should always be on top to display errors messages */ } - + /* Should always be on top to display errors messages */ +} .modal-content .content_loader { margin: 7em 0em; - text-align: center; } - + text-align: center; +} /*******************/ /* Clipboard icons */ /*******************/ .url-to-clipboard.url-to-clipboard-icon { opacity: 0.5; cursor: pointer; - transition: opacity 0.2s linear; } - .url-to-clipboard.url-to-clipboard-icon:hover { - opacity: 1; } - + transition: opacity 0.2s linear; +} +.url-to-clipboard.url-to-clipboard-icon:hover { + opacity: 1; +} .url-to-clipboard-tooltip-copied { color: green; - margin-right: 3px; } - + margin-right: 3px; +} /**************************/ /* MagnificPopup settings */ /**************************/ .mfp-bg { - z-index: 1200; } - + z-index: 1200; +} .mfp-wrap { - z-index: 1210; } - + z-index: 1210; +} .mfp-img { cursor: pointer; - cursor: zoom-out; } - + cursor: zoom-out; +} /********************/ /* Typeahead setting */ /********************/ .twitter-typeahead .tt-menu { max-height: 200px; - overflow-y: auto; } - + overflow-y: auto; +} @media (min-width: 768px) { .twitter-typeahead .tt-menu { - max-height: 300px; } } + max-height: 300px; + } +} .twitter-typeahead .tt-dataset > .content_loader { margin: 10px 0px; text-align: center; - font-size: 0.6em; } - + font-size: 0.6em; +} .twitter-typeahead .tt-dataset > .content_loader .icon { - height: 25px; } - + height: 25px; +} .twitter-typeahead .tt-dataset .no_result { text-align: center; - font-style: italic; } - + font-style: italic; +} /*****************/ /* Home settings */ /*****************/ .home #main-wrapper { - padding-top: 15px; } - + padding-top: 15px; +} .home .tile { display: block; margin-bottom: 8px; @@ -369,47 +383,49 @@ footer { text-decoration: none; white-space: normal; line-height: 4em; - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15); } - + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15); +} .home .tile .tile_decoration { position: absolute; top: 0.3em; - left: 2.5em; } - + left: 2.5em; +} .home .tile .tile_title { font-weight: bold; - color: #777; } - + color: #777; +} .home .tile .tile_title > span.icon { - color: #EA7D1E; } - + color: #EA7D1E; +} .home .tile .tile_description { display: none; - color: #555555; } - + color: #555555; +} /**********************************/ /* ManageBrick badge tile display */ /**********************************/ .home a.tile.tile_badge > div { display: table; - width: 100%; } - + width: 100%; +} .home a.tile.tile_badge > div > div { - display: table-row; } - + display: table-row; +} .home a.tile.tile_badge > div > div > div { - display: table-cell; } - + display: table-cell; +} @media (max-width: 768px) { .home a.tile.tile_badge > div > div > div.tile_body div.tile_count { position: absolute; top: 0em; right: 2em; text-align: right; - font-size: 1.2em; } - + font-size: 1.2em; + } .home a.tile.tile_badge > div.tile_description { - display: none; } } + display: none; + } +} @media (min-width: 768px) { .home .tile { display: block; @@ -417,178 +433,187 @@ footer { padding: 40px 40px 30px 40px; min-height: 10em; text-align: left; - transition: all 0.2s linear; } - + transition: all 0.2s linear; + } .home .tile:hover { - box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1); } - + box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.1); + } .home .tile .tile_decoration { display: block; position: relative; float: left; top: 1.5em; left: initial; - margin: 0px 30px 15px 0px; } - + margin: 0px 30px 15px 0px; + } .home .tile .tile_body { display: block; padding-left: 4.3em; text-align: left; - line-height: 1.5em; } - + line-height: 1.5em; + } .home .tile .tile_title { margin-bottom: 1em; - font-size: 1.0em; } - + font-size: 1em; + } .home .tile .tile_description { display: block; - text-align: left; } - + text-align: left; + } .home a.tile.tile_badge { height: 10em; - overflow: hidden; } - + overflow: hidden; + } .home a.tile.tile_badge > div > div > div.tile_decoration { top: unset; - vertical-align: middle; } - + vertical-align: middle; + } .home a.tile.tile_badge > div > div > div.tile_decoration > span.icon { - font-size: 4em; } - + font-size: 4em; + } .home a.tile.tile_badge > div > div > div.tile_body { position: relative; padding: 0; margin: 0; vertical-align: middle; - text-align: right; } - + text-align: right; + } .home a.tile.tile_badge > div > div > div.tile_body .tile_title { margin-top: 1em; margin-bottom: 0; font-size: 1em; - font-weight: normal; } - + font-weight: normal; + } .home a.tile.tile_badge > div > div > div.tile_body .tile_count { position: absolute; top: 0; right: 0; font-size: 2em; font-weight: bold; - color: #777; } - + color: #777; + } .home a.tile.tile_badge .tile_description { - display: none; } } + display: none; + } +} @media (min-width: 992px) { .home .tile { min-height: 14em; - padding: 30px 40px 30px 40px; } - + padding: 30px 40px 30px 40px; + } .home .tile .tile_decoration > span.icon { - font-size: 4em; } - + font-size: 4em; + } .home .tile .tile_body { - padding-left: 6.3em; } - + padding-left: 6.3em; + } .home .tile .tile_title { - font-size: 1.4em; } - + font-size: 1.4em; + } .home .tile .tile_description { - font-size: 1.2em; } - + font-size: 1.2em; + } .home a.tile.tile_badge > div > div > div.tile_body .tile_title { - font-size: 1.2em; } - + font-size: 1.2em; + } .home a.tile.tile_badge > div > div > div.tile_body .tile_count { - font-size: 3em; } - + font-size: 3em; + } .home a.tile.tile_badge > div > div > div.tile_decoration > span.icon { - font-size: 4em; } - + font-size: 4em; + } .home a.tile.tile_badge .tile_description { display: block; font-size: 1em; - text-align: center; } } + text-align: center; + } +} @media (min-width: 1200px) { .home .tile { margin-bottom: 40px; min-height: 15em; - padding: 40px 50px 30px 50px; } - + padding: 40px 50px 30px 50px; + } .home .tile .tile_decoration { margin: 0px 40px 15px 0px; - top: 1.5em; } - + top: 1.5em; + } .home .tile .tile_decoration > span.icon { - font-size: 6em; } - + font-size: 6em; + } .home .tile .tile_body { - padding-left: 9.1em; } - + padding-left: 9.1em; + } .home .tile .tile_title { - font-size: 1.5em; } - + font-size: 1.5em; + } .home .tile .tile_description { - font-size: 1.2em; } - + font-size: 1.2em; + } .home a.tile.tile_badge > div > div > div.tile_decoration > span.icon { - font-size: 6em; } } + font-size: 6em; + } +} /********************/ /* Modules settings */ /********************/ #main-header { - text-align: center; } - + text-align: center; +} #main-header-title { - margin-bottom: 15px; } - #main-header-title .subtitle { - display: block; - margin-top: 8px; - margin-bottom: 20px; } - + margin-bottom: 15px; +} +#main-header-title .subtitle { + display: block; + margin-top: 8px; + margin-bottom: 20px; +} #main-header-actions { - margin-bottom: 15px; } - + margin-bottom: 15px; +} /* This is no longer necessary but we keep it just in case */ /*#main-header-actions .btn-group .btn{ - padding: 0em 1.5em; - line-height: 2.4em; - font-size: 14px; - background-image: none; -}*/ + padding: 0em 1.5em; + line-height: 2.4em; + font-size: 14px; + background-image: none; + }*/ @media (min-width: 768px) { #main-header:after { - clear: both; } - + clear: both; + } #main-header-title { float: left; margin-bottom: 0px; min-height: 6em; - text-align: left; } - + text-align: left; + } #main-header-actions { float: right; - margin-bottom: 0px; } } + margin-bottom: 0px; + } +} .dataTables_wrapper { - padding: 10px 10px; } - + padding: 10px 10px; +} .dataTable.table td img { max-width: 100%; - height: initial !important; } - + height: initial !important; +} #brick_content_toolbar { /* margin: 10px 0px 6px 0px; */ - padding: 10px; } - + padding: 10px; +} #brick_content_toolbar > div label { font-weight: normal; white-space: nowrap; - text-align: left; } - + text-align: left; +} #brick_content_toolbar > div label input { margin-left: 0.5em; display: inline-block; - width: 130px; } - + width: 130px; +} /***********************/ /* Brick communication */ /***********************/ @@ -597,13 +622,13 @@ footer { padding: 20px; background-color: #EDEDED; border: none; - font-weight: initial; } - + font-weight: initial; +} .home .tile_communication .carousel { margin-bottom: 0px; width: 100%; - height: 200px; } - + height: 200px; +} /**********************/ /* Brick user profile */ /**********************/ @@ -618,36 +643,36 @@ footer { text-align: center; color: white; background-color: black; - opacity: 0.5; } - + opacity: 0.5; +} #user-profile-wrapper .user_profile_picture .preview { display: inline-block; position: relative; max-width: 175px; max-height: 175px; - overflow: hidden; } - + overflow: hidden; +} #user-profile-wrapper .user_profile_picture .preview img { max-width: 100%; - max-height: 100%; } - + max-height: 100%; +} #user-profile-wrapper .user_profile_picture .actions { display: inline-block; vertical-align: top; /*middle;*/ - margin-left: 5px; } - + margin-left: 5px; +} #user-profile-wrapper .user_profile_picture .actions .btn { display: block; position: relative; - margin-bottom: 10px; } - + margin-bottom: 10px; +} #user-profile-wrapper .user_profile_picture .actions .btn:last-child { - margin-bottom: 0px; } - + margin-bottom: 0px; +} #user-profile-wrapper .user_profile_picture .actions .btn.btn_edit { - overflow: hidden; } - + overflow: hidden; +} #user-profile-wrapper .user_profile_picture .actions .btn.btn_edit input { position: absolute; top: 0px; @@ -655,8 +680,8 @@ footer { width: 100%; height: 100%; opacity: 0; - cursor: pointer; } - + cursor: pointer; +} /****************/ /* Brick browse */ /****************/ @@ -664,61 +689,53 @@ footer { /****************/ #brick_content_tree { position: relative; - margin-top: 0px; } - + margin-top: 0px; +} #brick_content_tree .list-group-item { - padding-top: 0px; } - + padding-top: 0px; +} #brick_content_tree .list-group-item > .tree-item-wrapper { display: block; padding-top: 10px; color: inherit; text-decoration: inherit; - cursor: pointer; } - + cursor: pointer; +} .list-group-item > .list-group-item-actions { /*display: none; Displaying actions only when hovering was not unanimous in the team */ position: absolute; top: 10px; - right: 10px; } - -.list-group-item:hover > .list-group-item-actions, -.mosaic-group-item:hover > .mosaic-group-item-actions { - display: block; } - -.list-group-item .list-group-item-actions a:not(:first-child), -.mosaic-group-item .mosaic-group-item-actions a:not(:first-child) { - margin-left: 10px; } - + right: 10px; +} +.list-group-item:hover > .list-group-item-actions, .mosaic-group-item:hover > .mosaic-group-item-actions { + display: block; +} +.list-group-item .list-group-item-actions a:not(:first-child), .mosaic-group-item .mosaic-group-item-actions a:not(:first-child) { + margin-left: 10px; +} .list-group-item .keep-spinning { animation: spin 1s linear infinite; -webkit-animation: spin 1s linear infinite; -moz-animation: spin 1s linear infinite; - -ms-animation: spin 1s linear infinite; } - + -ms-animation: spin 1s linear infinite; +} .list-group.tree .list-group-item .list-group-item-description { display: block; margin-top: 3px; - font-size: 0.8em; } - + font-size: 0.8em; +} /* Secondary actions */ -.list-group-item-actions .group-actions-wrapper, -.mosaic-group-item-actions .group-actions-wrapper, -table .group-actions-wrapper { - text-align: center; } - +.list-group-item-actions .group-actions-wrapper, .mosaic-group-item-actions .group-actions-wrapper, table .group-actions-wrapper { + text-align: center; +} table .group-actions { - position: relative; } - -.list-group-item-actions a.glyphicon-menu-hamburger, -.mosaic-group-item-actions a.glyphicon-menu-hamburger, -table .group-actions a.glyphicon-menu-hamburger { + position: relative; +} +.list-group-item-actions a.glyphicon-menu-hamburger, .mosaic-group-item-actions a.glyphicon-menu-hamburger, table .group-actions a.glyphicon-menu-hamburger { cursor: pointer; - text-decoration: none; } - -.list-group-item-actions .item-action-wrapper, -.mosaic-group-item-actions .item-action-wrapper, -table .group-actions .item-action-wrapper { + text-decoration: none; +} +.list-group-item-actions .item-action-wrapper, .mosaic-group-item-actions .item-action-wrapper, table .group-actions .item-action-wrapper { display: none; position: absolute; z-index: 5; @@ -726,43 +743,34 @@ table .group-actions .item-action-wrapper { right: 15px; -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15); -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15); - box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15); } - -.list-group-item-actions .item-action-wrapper .glyphicon, -.mosaic-group-item-actions .item-action-wrapper .glyphicon, -table .group-actions .item-action-wrapper .glyphicon { - margin-right: 0.6em; } - -.list-group-item-actions .item-action-wrapper.collapse.in, -.mosaic-group-item-actions .item-action-wrapper.collapse.in, -table .group-actions .item-action-wrapper.collapse.in { - display: block; } - -.list-group-item-actions .item-action-wrapper .panel-body > p, -.mosaic-group-item-actions .item-action-wrapper .panel-body > p, -table .group-actions .item-action-wrapper .panel-body > p { + box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15); +} +.list-group-item-actions .item-action-wrapper .glyphicon, .mosaic-group-item-actions .item-action-wrapper .glyphicon, table .group-actions .item-action-wrapper .glyphicon { + margin-right: 0.6em; +} +.list-group-item-actions .item-action-wrapper.collapse.in, .mosaic-group-item-actions .item-action-wrapper.collapse.in, table .group-actions .item-action-wrapper.collapse.in { + display: block; +} +.list-group-item-actions .item-action-wrapper .panel-body > p, .mosaic-group-item-actions .item-action-wrapper .panel-body > p, table .group-actions .item-action-wrapper .panel-body > p { text-align: left; - white-space: nowrap; } - -.list-group-item-actions .item-action-wrapper .panel-body > p:last-child, -.mosaic-group-item-actions .item-action-wrapper .panel-body > p:last-child, -table .group-actions .item-action-wrapper .panel-body > p:last-child { - margin-bottom: 0px; } - + white-space: nowrap; +} +.list-group-item-actions .item-action-wrapper .panel-body > p:last-child, .mosaic-group-item-actions .item-action-wrapper .panel-body > p:last-child, table .group-actions .item-action-wrapper .panel-body > p:last-child { + margin-bottom: 0px; +} #brick_content_empty { display: none; padding: 40px; font-size: 1.3em; - font-style: italic; } - + font-style: italic; +} /* Loader */ -#brick_tree_overlay, -#brick_mosaic_overlay { +#brick_tree_overlay, #brick_mosaic_overlay { display: none; padding: 8% 0px; border-radius: 0px 0px 4px 4px; - font-size: 1em; } - + font-size: 1em; +} /****************************************************************/ /* - Mosaic mode */ /* */ @@ -778,8 +786,8 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child { /****************************************************************/ #brick_content_mosaic { position: relative; - padding: 10px 10px 1px 10px; } - + padding: 10px 10px 1px 10px; +} /* Breadcrumb */ #mosaic-breadcrumb { margin-bottom: 5px; @@ -787,107 +795,101 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child { font-size: 12px; white-space: nowrap; overflow-x: hidden; - text-overflow: ellipsis; } - + text-overflow: ellipsis; +} .mosaic-group { - display: none; } - + display: none; +} /* Only the first level is showed by default */ .mosaic-group:first-of-type { - display: block; } - -.mosaic-group-back, -.mosaic-group-item { + display: block; +} +.mosaic-group-back, .mosaic-group-item { position: relative; height: 55px; margin-bottom: 10px; text-align: center; - color: #FFFFFF; } - + color: #FFFFFF; +} .mosaic-group-back { - font-size: 25px; } - + font-size: 25px; +} .mosaic-item { display: table; width: 100%; height: 100%; overflow: hidden; background-color: #585653; - transition: all linear 0.3s; } - -.mosaic-item, -.mosaic-item:hover, -.mosaic-item:active, -.mosaic-item:focus, -.mosaic-item:visited { + transition: all linear 0.3s; +} +.mosaic-item, .mosaic-item:hover, .mosaic-item:active, .mosaic-item:focus, .mosaic-item:visited { color: #FFFFFF; - text-decoration: none; } - + text-decoration: none; +} .mosaic-item:active { - background-color: #9e510f; } - -.mosaic-item-image, -.mosaic-item-text { + background-color: #9e510f; +} +.mosaic-item-image, .mosaic-item-text { display: table-cell; text-align: center; - vertical-align: middle; } - + vertical-align: middle; +} .mosaic-item-image > img { - max-width: 85%; } - + max-width: 85%; +} .mosaic-item-text { max-width: 1px; /* This is an arbitrary value. It is just here to make .mosaic-item-name wrap when there is a very long word in it. */ - overflow: hidden; } - + overflow: hidden; +} .mosaic-group-item > .mosaic-group-item-actions { position: absolute; top: 5px; - right: 5px; } - + right: 5px; +} .mosaic-group-item-actions > a { color: #FFFFFF; - text-decoration: none; } - -.mosaic-group-item-actions > a:hover, -.mosaic-group-item-actions > a:focus { - color: #EEEEEE; } - + text-decoration: none; +} +.mosaic-group-item-actions > a:hover, .mosaic-group-item-actions > a:focus { + color: #EEEEEE; +} @media (max-width: 768px) { .mosaic-group-item > .mosaic-group-item-actions { top: 12px; - right: 6px; } - + right: 6px; + } .mosaic-group-item > .mosaic-group-item-actions > .glyphicon { - margin-top: 5px; } - + margin-top: 5px; + } .mosaic-group-item-actions > a { - font-size: 20px; } - - /* All layouts */ + font-size: 20px; + /* All layouts */ + } .mosaic-item-image { width: 55px; - padding: 10px; } - + padding: 10px; + } .mosaic-item-image > img { - max-height: 30px; } - + max-height: 30px; + } .mosaic-item-name { font-size: 14px; max-height: 50px; - overflow: hidden; } - + overflow: hidden; + } .mosaic-item-description { - display: none; } - - /* Layout 2 */ + display: none; + /* Layout 2 */ + } .mosaic-item-layout-2 .mosaic-item-description { - display: block; } - - /* Layout 5/7 */ - .mosaic-item-layout-5 .mosaic-item-name, - .mosaic-item-layout-7 .mosaic-item-name { - padding-right: 40px; } } + display: block; + /* Layout 5/7 */ + } + .mosaic-item-layout-5 .mosaic-item-name, .mosaic-item-layout-7 .mosaic-item-name { + padding-right: 40px; + } +} @media (min-width: 768px) { .mosaic-group-item { display: inline-block; @@ -895,113 +897,117 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child { height: 120px; margin-right: 1.95%; /* We don't put 2% to keep a margin in case of a bad browser rendering */ - word-break: break-word; } - + word-break: break-word; + } .mosaic-item { - padding: 10px; } - - .mosaic-item:hover, - .mosaic-item:focus { + padding: 10px; + } + .mosaic-item:hover, .mosaic-item:focus { background-color: #EA7D1E; - box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.2); } - - /* All layouts */ - /* .mosaic-item-image{ - vertical-align: inherit; Note: This was introduced to avoid image from going down the tile when .mosaic-item-name was way too long, but the .mosaic-item-image glitched by being a little too high. As a very long .mosaic-item-name is extremely rare, we decided that it was not worth it. - }*/ + box-shadow: 0px 3px 5px rgba(0, 0, 0, 0.2); + /* All layouts */ + /* .mosaic-item-image{ + vertical-align: inherit; Note: This was introduced to avoid image from going down the tile when .mosaic-item-name was way too long, but the .mosaic-item-image glitched by being a little too high. As a very long .mosaic-item-name is extremely rare, we decided that it was not worth it. + }*/ + } .mosaic-item-text .mosaic-item-text-wrapper { max-height: 100px; - /* Must be .mosaic-item absolute height (in px) */ } - + /* Must be .mosaic-item absolute height (in px) */ + } .mosaic-item-name { max-height: 100%; /* It's ok if description is pushed down and not visible; but we truncate before it flows out of the tile */ overflow: hidden; font-weight: 600; - font-size: 12px; } - + font-size: 12px; + } .mosaic-item-description { overflow: hidden; - text-overflow: ellipsis; } - - /* Layout 1 */ + text-overflow: ellipsis; + /* Layout 1 */ + } .mosaic-item-layout-1 .mosaic-item-name { font-weight: inherit; - font-size: 14px; } - - /* Layout 7 */ + font-size: 14px; + /* Layout 7 */ + } .mosaic-item-layout-7 .mosaic-item-image { - display: none; } - - .mosaic-item-layout-3 .mosaic-item-description, - .mosaic-item-layout-7 .mosaic-item-description { + display: none; + } + .mosaic-item-layout-3 .mosaic-item-description, .mosaic-item-layout-7 .mosaic-item-description { margin-top: 10px; max-height: 40px; - font-size: 10px; } - - /* Layout 5 & 7 */ - .mosaic-item-layout-5 .mosaic-item-image, - .mosaic-item-layout-7 .mosaic-item-image { + font-size: 10px; + /* Layout 5 & 7 */ + } + .mosaic-item-layout-5 .mosaic-item-image, .mosaic-item-layout-7 .mosaic-item-image { display: table-cell; width: 65px; padding-left: 5px; - padding-right: 10px; } - - .mosaic-item-layout-5 .mosaic-item-image > img, - .mosaic-item-layout-7 .mosaic-item-image > img { + padding-right: 10px; + } + .mosaic-item-layout-5 .mosaic-item-image > img, .mosaic-item-layout-7 .mosaic-item-image > img { max-width: 65px; /* Equals parent element width */ max-height: 100px; - /* Equals parent element height */ } } + /* Equals parent element height */ + } +} @media (min-width: 992px) { .mosaic-item { - padding: 10px 15px; } - + padding: 10px 15px; + } .mosaic-group-back { - font-size: 40px; } - - /* Layout 5 & 7 */ - .mosaic-item-layout-5 .mosaic-item-image, - .mosaic-item-layout-7 .mosaic-item-image { + font-size: 40px; + /* Layout 5 & 7 */ + } + .mosaic-item-layout-5 .mosaic-item-image, .mosaic-item-layout-7 .mosaic-item-image { width: 105px; - padding-right: 18px; } - - .mosaic-item-layout-5 .mosaic-item-image > img, - .mosaic-item-layout-7 .mosaic-item-image > img { + padding-right: 18px; + } + .mosaic-item-layout-5 .mosaic-item-image > img, .mosaic-item-layout-7 .mosaic-item-image > img { max-width: 105px; /* Equals parent element width */ max-height: 100px; - /* Equals parent element height */ } - - .mosaic-item-layout-5 .mosaic-item-name, - .mosaic-item-layout-7 .mosaic-item-name { - font-size: 12px; } } + /* Equals parent element height */ + } + .mosaic-item-layout-5 .mosaic-item-name, .mosaic-item-layout-7 .mosaic-item-name { + font-size: 12px; + } +} @media (min-width: 1200px) { .mosaic-group-item { width: 24%; height: 140px; - margin-right: 1.3%; } - - /* All layouts */ + margin-right: 1.3%; + /* All layouts */ + } .mosaic-item-text .mosaic-item-text-wrapper { max-height: 120px; /* Must be .mosaic-item absolute height (in px) */ - /* overflow hidden inherited */ } - - .mosaic-item-layout-5 .mosaic-item-image > img, - .mosaic-item-layout-7 .mosaic-item-image > img { + /* overflow hidden inherited */ + } + .mosaic-item-layout-5 .mosaic-item-image > img, .mosaic-item-layout-7 .mosaic-item-image > img { max-height: 120px; - /* Equals parent element height */ } } + /* Equals parent element height */ + } +} /* Helper classes to remove margin depending on the screen size */ @media (min-width: 768px) and (max-width: 992px) { .mosaic-group-item:nth-child(3n) { - margin-right: 0px; } } + margin-right: 0px; + } +} @media (min-width: 992px) and (max-width: 1200px) { .mosaic-group-item:nth-child(3n) { - margin-right: 0px; } } + margin-right: 0px; + } +} @media (min-width: 1200px) { .mosaic-group-item:nth-child(4n) { - margin-right: 0px; } } + margin-right: 0px; + } +} /****************/ /* - List mode */ /****************/ @@ -1009,29 +1015,35 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child { /* Filter brick */ /****************/ .tile.tile-filter-brick a.tile_decoration { - cursor: default; } - + cursor: default; +} .tile.tile-filter-brick .tile_filterbox .form-group:first-child { - width: 100%; } - + width: 100%; +} .tile.tile-filter-brick .tile_filterbox input[type="text"] { - width: 100%; } - + width: 100%; +} @media (max-width: 768px) { .tile.tile-filter-brick .tile_filterbox .form-group:first-child { - margin-bottom: 5px; } } + margin-bottom: 5px; + } +} @media (min-width: 768px) { .tile.tile-filter-brick .tile_filterbox form { - display: table; } - + display: table; + } .tile.tile-filter-brick .tile_filterbox .form-group:first-child { - display: table-cell; } - + display: table-cell; + } .tile.tile-filter-brick .tile_filterbox button[type="submit"] { - margin-left: 5px; } } + margin-left: 5px; + } +} @media (min-width: 992px) { .tile.tile-filter-brick .tile_filterbox .form-group:first-child { - display: table-cell; } } + display: table-cell; + } +} /*********/ /* Forms */ /*********/ @@ -1041,88 +1053,94 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child { vertical-align: top; cursor: pointer; color: #777; - font-size: 0.85em; } - + font-size: 0.85em; +} .form_field .form_mandatory .control-label:after { content: "\002a"; position: relative; left: 3px; color: #EA7D1E; - font-size: 0.9em; } - + font-size: 0.9em; +} /* Note: We don't put the .form_field selector as it must work for read-only */ .form-control-static img { max-width: 100% !important; - height: initial !important; } - + height: initial !important; +} /* ExternalKey */ .selectobject .input-group-addon { - cursor: pointer; } - + cursor: pointer; +} /* InlineImage */ .inline-image { cursor: pointer; - cursor: zoom-in; } - + cursor: zoom-in; +} /* CaseLog field */ .caselog-thread { position: relative; border: 1px solid #ddd; - border-top: none; } - + border-top: none; +} .caselog-thread--header { padding: 8px; font-size: 11px; background-color: rgba(242, 242, 242, 0.38); - border-bottom: 1px solid #ddd; } - .caselog-thread--header span { - color: #777; - /* body: color */ } - + border-bottom: 1px solid #ddd; +} +.caselog-thread--header span { + color: #777; + /* body: color */ +} .caselog-thread--header-toggler { cursor: pointer; color: inherit; - text-decoration: none; } - .caselog-thread--header-toggler:hover, .caselog-thread--header-toggler:active, .caselog-thread--header-toggler:focus { - color: inherit; - text-decoration: none; } - .caselog-thread--header-toggler:not(:first-child)::before { - content: "-"; - margin: 0 0.4em 0 0.2em; - /* Note: Difference between left and right margin is due to a left space being output because the line break in the HTML isn't tidy */ } - + text-decoration: none; +} +.caselog-thread--header-toggler:hover, .caselog-thread--header-toggler:active, .caselog-thread--header-toggler:focus { + color: inherit; + text-decoration: none; +} +.caselog-thread--header-toggler:not(:first-child)::before { + content: "-"; + margin: 0 0.4em 0 0.2em; + /* Note: Difference between left and right margin is due to a left space being output because the line break in the HTML isn't tidy */ +} .caselog-thread--header-info > span { - margin-left: 0.5em; } - .caselog-thread--header-info > span > span { - margin-left: 0.5em; } - .caselog-thread--header-info > span:first-child { - margin-left: 0; } - + margin-left: 0.5em; +} +.caselog-thread--header-info > span > span { + margin-left: 0.5em; +} +.caselog-thread--header-info > span:first-child { + margin-left: 0; +} .caselog-thread--content { padding: 5px; /*max-height: 400px; - overflow: auto;*/ - background-color: #f2f2f2; } - + overflow: auto;*/ + background-color: #f2f2f2; +} .caselog-thread--date { margin-bottom: 10px; text-align: center; - color: #808080; } - .caselog-thread--date:first-child { - display: none; } - + color: #808080; +} +.caselog-thread--date:first-child { + display: none; +} .caselog-thread--block { position: relative; min-height: 40px; /* .caselog-thread--block-medallion height */ - margin-bottom: 15px; } - .caselog-thread--block:last-child { - margin-bottom: 0px; } - -.caselog-thread--block-medallion, -.caselog-thread--block-entries { - box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15); } - + margin-bottom: 15px; +} +.caselog-thread--block:last-child { + margin-bottom: 0px; +} +.caselog-thread--block-medallion, .caselog-thread--block-entries { + box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15); +} .caselog-thread--block-medallion { position: absolute; top: 0px; @@ -1132,79 +1150,88 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child { text-align: center; line-height: 40px; font-size: 18px; - color: #444; + color: #FFFFFF; /* .caselog-thread--block-entries color */ background-size: 100%; /* Full size is necessary for images with filled background to fit nicely in the medallion, even if this means that images with a transparent background might appear cropped */ background-position: center center; - background-color: #FFFFFF; + background-color: #585653; /* .caselog-thread--block-entries background-color */ background-repeat: no-repeat; - border-radius: 100%; } - + border-radius: 100%; +} .caselog-thread--block-user { display: none; margin-left: 54px; font-size: 12px; font-weight: bold; - color: #444; - /* .caselog-thread--block-entries background-color */ } - + color: #FFFFFF; + /* .caselog-thread--block-entries background-color */ +} .caselog-thread--block-entries { position: relative; display: inline-block; margin-left: 60px; - background-color: #FFFFFF; - color: #444; } - + background-color: #585653; + color: #FFFFFF; +} .caselog-thread--block-entry { position: relative; padding: 8px 10px; - border-bottom: 1px solid rgba(0, 0, 0, 0.05); } - .caselog-thread--block-entry img { - max-width: 100%; } - .caselog-thread--block-entry.closed { - cursor: pointer; } - .caselog-thread--block-entry.closed .caselog-thread--block-entry-content { - height: 0px; - overflow-y: hidden; } - .caselog-thread--block-entry.closed .caselog-thread--block-entry-content:after { - content: "..."; - position: absolute; - top: 10px; - left: 9px; } - .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { - content: ""; - position: absolute; - top: 0px; - left: -15px; - width: 15px; - height: 15px; - border: 8px solid transparent; - border-top-color: #FFFFFF; - /* .caselog-thread--block-entries background-color */ - border-right-color: #FFFFFF; - /* .caselog-thread--block-entries background-color */ } - .caselog-thread--block-entry:last-child { - border-bottom: none; } - .caselog-thread--block-entry:hover .caselog-thread--block-entry-date { - opacity: 1; } - .caselog-thread--block-entry:hover:not(.closed) .caselog-thread--block-entry-toggler { - opacity: 1; } - + border-bottom: 1px solid rgba(0, 0, 0, 0.05); +} +.caselog-thread--block-entry img { + max-width: 100%; +} +.caselog-thread--block-entry.closed { + cursor: pointer; +} +.caselog-thread--block-entry.closed .caselog-thread--block-entry-content { + height: 0px; + overflow-y: hidden; +} +.caselog-thread--block-entry.closed .caselog-thread--block-entry-content:after { + content: "..."; + position: absolute; + top: 10px; + left: 9px; +} +.caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { + content: ""; + position: absolute; + top: 0px; + left: -15px; + width: 15px; + height: 15px; + border: 8px solid transparent; + border-top-color: #585653; + /* .caselog-thread--block-entries background-color */ + border-right-color: #585653; + /* .caselog-thread--block-entries background-color */ +} +.caselog-thread--block-entry:last-child { + border-bottom: none; +} +.caselog-thread--block-entry:hover .caselog-thread--block-entry-date { + opacity: 1; +} +.caselog-thread--block-entry:hover:not(.closed) .caselog-thread--block-entry-toggler { + opacity: 1; +} .caselog-thread--block-entry-content { display: block; - overflow-x: auto; } - .caselog-thread--block-entry-content > p:last-of-type { - margin-bottom: 0px; } - + overflow-x: auto; +} +.caselog-thread--block-entry-content > p:last-of-type { + margin-bottom: 0px; +} .caselog-thread--block-entry-date { margin-top: 5px; opacity: 0.6; font-size: 10px; text-align: right; - transition: all 0.2s linear; } - + transition: all 0.2s linear; +} .caselog-thread--block-entry-toggler { position: absolute; top: 2px; @@ -1212,274 +1239,332 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child { padding: 2px 5px; opacity: 0; cursor: pointer; - background-color: #FFFFFF; + background-color: #585653; /* .caselog-thread--block-entries background-color */ - transition: all 0.2s linear; } - + transition: all 0.2s linear; +} .caselog-thread--block-me { - text-align: right; } - .caselog-thread--block-me .caselog-thread--block-medallion { - left: initial; - right: 0px; } - .caselog-thread--block-me .caselog-thread--block-user { - display: none; - margin-left: initial; - margin-right: 54px; } - .caselog-thread--block-me .caselog-thread--block-entries { - margin-left: initial; - margin-right: 60px; - text-align: right; } - .caselog-thread--block-me .caselog-thread--block-entries .caselog-thread--block-entry { - text-align: left; } - .caselog-thread--block-me .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { - right: initial; - left: 5px; } - .caselog-thread--block-me .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { - left: initial; - right: -15px; - border-right-color: transparent; - border-left-color: #FFFFFF; - /* .caselog-thread--block-entries background-color */ } - + text-align: right; +} +.caselog-thread--block-me .caselog-thread--block-medallion { + left: initial; + right: 0px; +} +.caselog-thread--block-me .caselog-thread--block-user { + display: none; + margin-left: initial; + margin-right: 54px; +} +.caselog-thread--block-me .caselog-thread--block-entries { + margin-left: initial; + margin-right: 60px; + text-align: right; +} +.caselog-thread--block-me .caselog-thread--block-entries .caselog-thread--block-entry { + text-align: left; +} +.caselog-thread--block-me .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { + right: initial; + left: 5px; +} +.caselog-thread--block-me .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { + left: initial; + right: -15px; + border-right-color: transparent; + border-left-color: #585653; + /* .caselog-thread--block-entries background-color */ +} .caselog-thread--block-color-1 .caselog-thread--block-medallion { - color: #FFFFFF; - background-color: #EA7D1E; } + color: #444; + background-color: #FFFFFF; +} .caselog-thread--block-color-1 .caselog-thread--block-user { - color: #EA7D1E; } + color: #FFFFFF; +} .caselog-thread--block-color-1 .caselog-thread--block-entries { - color: #FFFFFF; - background-color: #EA7D1E; } - .caselog-thread--block-color-1 .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { - background-color: #EA7D1E; } - .caselog-thread--block-color-1 .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { - border-top-color: #EA7D1E; - border-right-color: #EA7D1E; } - + color: #444; + background-color: #FFFFFF; +} +.caselog-thread--block-color-1 .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { + background-color: #FFFFFF; +} +.caselog-thread--block-color-1 .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { + border-top-color: #FFFFFF; + border-right-color: #FFFFFF; +} .caselog-thread--block-color-2 .caselog-thread--block-medallion { - color: #FFFFFF; - background-color: #e9a537; } + color: #444; + background-color: #FFFFFF; +} .caselog-thread--block-color-2 .caselog-thread--block-user { - color: #e9a537; } + color: #FFFFFF; +} .caselog-thread--block-color-2 .caselog-thread--block-entries { - color: #FFFFFF; - background-color: #e9a537; } - .caselog-thread--block-color-2 .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { - background-color: #e9a537; } - .caselog-thread--block-color-2 .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { - border-top-color: #e9a537; - border-right-color: #e9a537; } - + color: #444; + background-color: #FFFFFF; +} +.caselog-thread--block-color-2 .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { + background-color: #FFFFFF; +} +.caselog-thread--block-color-2 .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { + border-top-color: #FFFFFF; + border-right-color: #FFFFFF; +} .caselog-thread--block-color-3 .caselog-thread--block-medallion { - color: #FFFFFF; - background-color: #d16c13; } + color: #444; + background-color: #FFFFFF; +} .caselog-thread--block-color-3 .caselog-thread--block-user { - color: #d16c13; } + color: #FFFFFF; +} .caselog-thread--block-color-3 .caselog-thread--block-entries { - color: #FFFFFF; - background-color: #d16c13; } - .caselog-thread--block-color-3 .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { - background-color: #d16c13; } - .caselog-thread--block-color-3 .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { - border-top-color: #d16c13; - border-right-color: #d16c13; } - + color: #444; + background-color: #FFFFFF; +} +.caselog-thread--block-color-3 .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { + background-color: #FFFFFF; +} +.caselog-thread--block-color-3 .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { + border-top-color: #FFFFFF; + border-right-color: #FFFFFF; +} .caselog-thread--block-color-4 .caselog-thread--block-medallion { - color: #FFFFFF; - background-color: #e3952c; } + color: #444; + background-color: #FFFFFF; +} .caselog-thread--block-color-4 .caselog-thread--block-user { - color: #e3952c; } + color: #FFFFFF; +} .caselog-thread--block-color-4 .caselog-thread--block-entries { - color: #FFFFFF; - background-color: #e3952c; } - .caselog-thread--block-color-4 .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { - background-color: #e3952c; } - .caselog-thread--block-color-4 .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { - border-top-color: #e3952c; - border-right-color: #e3952c; } - + color: #444; + background-color: #FFFFFF; +} +.caselog-thread--block-color-4 .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { + background-color: #FFFFFF; +} +.caselog-thread--block-color-4 .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { + border-top-color: #FFFFFF; + border-right-color: #FFFFFF; +} .caselog-thread--block-color-5 .caselog-thread--block-medallion { - color: #FFFFFF; - background-color: #b05b10; } + color: #444; + background-color: #FFFFFF; +} .caselog-thread--block-color-5 .caselog-thread--block-user { - color: #b05b10; } -.caselog-thread--block-color-5 .caselog-thread--block-entries { color: #FFFFFF; - background-color: #b05b10; } - .caselog-thread--block-color-5 .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { - background-color: #b05b10; } - .caselog-thread--block-color-5 .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { - border-top-color: #b05b10; - border-right-color: #b05b10; } - +} +.caselog-thread--block-color-5 .caselog-thread--block-entries { + color: #444; + background-color: #FFFFFF; +} +.caselog-thread--block-color-5 .caselog-thread--block-entries .caselog-thread--block-entry .caselog-thread--block-entry-toggler { + background-color: #FFFFFF; +} +.caselog-thread--block-color-5 .caselog-thread--block-entries .caselog-thread--block-entry:first-child .caselog-thread--block-entry-content:before { + border-top-color: #FFFFFF; + border-right-color: #FFFFFF; +} /* collapsable sections*/ -.form_linkedset_toggler, .form_linkedset_toggler:hover, .form_linkedset_toggler:focus, .form_upload_toggler, .form_upload_toggler:hover, .form_upload_toggler:focus { +.form_linkedset_toggler, .form_upload_toggler, .form_linkedset_toggler:hover, .form_upload_toggler:hover, .form_linkedset_toggler:focus, .form_upload_toggler:focus { text-decoration: none; - color: inherit; } + color: inherit; +} .form_linkedset_toggler > .text, .form_upload_toggler > .text { - margin-left: 0.4em; } + margin-left: 0.4em; +} .form_linkedset_toggler > .text:before, .form_upload_toggler > .text:before { - content: "("; } + content: "("; +} .form_linkedset_toggler > .text:after, .form_upload_toggler > .text:after { - content: ")"; } + content: ")"; +} .form_linkedset_toggler > .glyphicon, .form_upload_toggler > .glyphicon { margin-left: 0.5em; font-size: 0.85em; color: #EA7D1E; - transition: transform 0.2s linear; } + transition: transform 0.2s linear; +} .form_linkedset_toggler > .glyphicon.collapsed, .form_upload_toggler > .glyphicon.collapsed { - transform: rotateZ(-90deg); } - + transform: rotateZ(-90deg); +} /* - DataTables : Loader */ .form_linkedset_wrapper .datatables_overlay { - padding: 8px !important; } - + padding: 8px !important; +} .form_linkedset_wrapper .overlay_content { - font-size: 0.6em; } - + font-size: 0.6em; +} .form_linkedset_wrapper .content_loader { - margin: 0px; } - + margin: 0px; +} .form_linkedset_wrapper .content_loader .icon { - height: 23px; } - + height: 23px; +} /* - DataTables : Fit the table in the form */ .form_linkedset_wrapper .dataTables_wrapper { margin-bottom: 5px; - padding: 0px; } - + padding: 0px; +} /* FileUpload */ .attachments_container .attachments-list thead > tr > th { - text-align: center; } + text-align: center; +} .attachments_container .attachments-list tbody > tr > td { padding: 0.5rem 8px; text-align: left; - vertical-align: middle; } - .attachments_container .attachments-list tbody > tr > td[role="icon"] { - text-align: center; } - .attachments_container .attachments-list tbody > tr > td[role="icon"] img { - max-height: 32px; } - .attachments_container .attachments-list tbody > tr > td[role="formatted-size"] { - text-align: right; } - .attachments_container .attachments-list tbody > tr > td[role="delete"] { - text-align: center; } - + vertical-align: middle; +} +.attachments_container .attachments-list tbody > tr > td[role="icon"] { + text-align: center; +} +.attachments_container .attachments-list tbody > tr > td[role="icon"] img { + max-height: 32px; +} +.attachments_container .attachments-list tbody > tr > td[role="formatted-size"] { + text-align: right; +} +.attachments_container .attachments-list tbody > tr > td[role="delete"] { + text-align: center; +} .attachment-tooltip { width: 350px; - height: 300px; } - .attachment-tooltip img { - max-width: 100%; - max-height: 100%; } - + height: 300px; +} +.attachment-tooltip img { + max-width: 100%; + max-height: 100%; +} .upload_container input { - display: inline; } - + display: inline; +} .upload_container .loader { visibility: hidden; margin-left: 7px; font-size: 1.2em; - animation: spin 1.0s linear infinite; - -webkit-animation: spin 1.0s linear infinite; - -moz-animation: spin 1.0s linear infinite; - -ms-animation: spin 1.0s linear infinite; } - + animation: spin 1s linear infinite; + -webkit-animation: spin 1s linear infinite; + -moz-animation: spin 1s linear infinite; + -ms-animation: spin 1s linear infinite; +} #drag_overlay { display: block; top: inherit; bottom: 0px; - height: 0px; } - + height: 0px; +} #drag_overlay .overlay_content { margin-top: 5em; width: 100%; - color: white; } - + color: white; +} #drag_overlay .overlay_content .icon { - font-size: 3em; } - + font-size: 3em; +} #drag_overlay .overlay_content .message { - font-size: 1.5em; } - + font-size: 1.5em; +} /* Attachments drag & drop zone, only for none mobile devices */ @media (min-width: 768px) { #drag_overlay.drag_in { animation: show-drop-zone 0.3s ease-out forwards; -webkit-animation: show-drop-zone 0.3s ease-out forwards; -moz-animation: show-drop-zone 0.3s ease-out forwards; - -ms-animation: show-drop-zone 0.3s ease-out forwards; } - + -ms-animation: show-drop-zone 0.3s ease-out forwards; + } #drag_overlay.drag_out { animation: hide-drop-zone 0.3s ease-out forwards; -webkit-animation: hide-drop-zone 0.3s ease-out forwards; -moz-animation: hide-drop-zone 0.3s ease-out forwards; - -ms-animation: hide-drop-zone 0.3s ease-out forwards; } - + -ms-animation: hide-drop-zone 0.3s ease-out forwards; + } @keyframes show-drop-zone { 100% { - height: 20%; } } + height: 20%; + } + } @-webkit-keyframes show-drop-zone { 100% { - height: 20%; } } + height: 20%; + } + } @-moz-keyframes show-drop-zone { 100% { - height: 20%; } } + height: 20%; + } + } @-ms-keyframes show-drop-zone { 100% { - height: 20%; } } + height: 20%; + } + } @keyframes hide-drop-zone { 0% { - height: 20%; } + height: 20%; + } 100% { - height: 0%; } } + height: 0%; + } + } @-webkit-keyframes hide-drop-zone { 0% { - height: 20%; } + height: 20%; + } 100% { - height: 0%; } } + height: 0%; + } + } @-moz-keyframes hide-drop-zone { 0% { - height: 20%; } + height: 20%; + } 100% { - height: 0%; } } + height: 0%; + } + } @-ms-keyframes hide-drop-zone { 0% { - height: 20%; } + height: 20%; + } 100% { - height: 0%; } } } + height: 0%; + } + } +} /* BlobField */ .form_fields .file_open_link { - margin-left: 10px; } - + margin-left: 10px; +} .form_buttons { padding-top: 20px; - text-align: center; } - + text-align: center; +} .form_buttons .form_btn_misc { - margin-bottom: 20px; } - + margin-bottom: 20px; +} .form_buttons .form_btn_transitions { - margin-bottom: 20px; } - + margin-bottom: 20px; +} .form_buttons .btn .glyphicon { - margin-right: 0.5em; } - + margin-right: 0.5em; +} .form_btn_regular.sticky { - display: none; } - + display: none; +} @media (min-width: 768px) { .form_buttons .form_btn_misc { - float: left !important; } - + float: left !important; + } .form_buttons .form_btn_transitions { float: right !important; - margin-left: 3px; } - + margin-left: 3px; + } .form_buttons .form_btn_regular { - text-align: right; } - + text-align: right; + } .form_buttons .form_btn_regular .btn { - width: inherit; } - - /* Making regular button sticky */ + width: inherit; + /* Making regular button sticky */ + } .form_btn_regular.sticky { display: block; position: fixed; @@ -1490,25 +1575,27 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child { background-color: #FFFFFF; border: 1px solid #ddd; border-radius: 0px; - transition: right 0.3s; } - + transition: right 0.3s; + } .form_btn_regular.sticky.closed { - right: -75px; } - + right: -75px; + } .form_btn_regular.sticky button { - display: block; } - + display: block; + } .form_btn_regular.sticky button:first-child { - margin-bottom: 4px; } } + margin-bottom: 4px; + } +} /* CKEditor : Adding BS error feedback */ .form_field .cke { - border: 1px solid #ddd; } - + border: 1px solid #ddd; +} .form_field.has-error .cke { border: 1px solid #b94a48; border-radius: 0px; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); } - + box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); +} /* CKEditor : Styling notifications based on BS alerts */ .cke_notification { position: relative; @@ -1516,43 +1603,40 @@ table .group-actions .item-action-wrapper .panel-body > p:last-child { margin-bottom: 18px; border: 1px solid transparent; border-radius: 4px; - background-color: #FFFFFF; } - + background-color: #FFFFFF; +} .cke_notification_close { position: absolute; top: 2px; - right: 5px; } - + right: 5px; +} .cke_notification_message { margin-bottom: 0px; line-height: 1em; - font-size: 1em; } - + font-size: 1em; +} .cke_notification_success { display: none; background-color: #dff0d8; border-color: #58a959; - color: #468847; } - + color: #468847; +} .cke_notification_warning { background-color: #fcf8e3; border-color: #ceae78; - color: #c09853; } - + color: #c09853; +} /* CKEditor : Misc */ -.cke_toolbox_collapser, -.cke_toolbox_collapser .cke_arrow { - cursor: pointer !important; } - +.cke_toolbox_collapser, .cke_toolbox_collapser .cke_arrow { + cursor: pointer !important; +} /* DataTables : Selection inputs */ -.dataTable.table th span.row_input, -.dataTable.table td span.row_input { +.dataTable.table th span.row_input, .dataTable.table td span.row_input { display: inline-block; width: 100%; - text-align: center; } - + text-align: center; +} /* Wiki text (hyperlinks) */ .wiki_broken_link { - text-decoration: line-through; } - -/*# sourceMappingURL=portal.css.map */ + text-decoration: line-through; +} diff --git a/datamodels/2.x/itop-portal-base/portal/public/css/variables.scss b/datamodels/2.x/itop-portal-base/portal/public/css/variables.scss index 97812ee5c..ce0c11dcc 100644 --- a/datamodels/2.x/itop-portal-base/portal/public/css/variables.scss +++ b/datamodels/2.x/itop-portal-base/portal/public/css/variables.scss @@ -943,15 +943,15 @@ $hr-border: $gray-lighter !default; // //## -$messaging-self-primary-color: $white !default; -$messaging-self-secondary-color: $gray-dark !default; -$messaging-1st-peer-primary-color: $combodo-orange !default; -$messaging-1st-peer-secondary-color: $white !default; -$messaging-2nd-peer-primary-color: #e9a537 !default; -$messaging-2nd-peer-secondary-color: $white !default; -$messaging-3rd-peer-primary-color: darken($combodo-orange, 7%) !default; -$messaging-3rd-peer-secondary-color: $white !default; -$messaging-4th-peer-primary-color: #e3952c !default; -$messaging-4th-peer-secondary-color: $white !default; -$messaging-5th-peer-primary-color: darken($combodo-orange, 14%) !default; -$messaging-5th-peer-secondary-color: $white !default; +$messaging-self-primary-color: $combodo-dark-gray !default; +$messaging-self-secondary-color: $white !default; +$messaging-1st-peer-primary-color: $white !default; +$messaging-1st-peer-secondary-color: $gray-dark !default; +$messaging-2nd-peer-primary-color: $white !default; +$messaging-2nd-peer-secondary-color: $gray-dark !default; +$messaging-3rd-peer-primary-color: $white !default; +$messaging-3rd-peer-secondary-color: $gray-dark !default; +$messaging-4th-peer-primary-color: $white !default; +$messaging-4th-peer-secondary-color: $gray-dark !default; +$messaging-5th-peer-primary-color: $white !default; +$messaging-5th-peer-secondary-color: $gray-dark !default; diff --git a/dictionaries/ui/layouts/en.dictionary.itop.navigation-menu.php b/dictionaries/ui/layouts/en.dictionary.itop.navigation-menu.php index 699474f8a..92dbdeea7 100644 --- a/dictionaries/ui/layouts/en.dictionary.itop.navigation-menu.php +++ b/dictionaries/ui/layouts/en.dictionary.itop.navigation-menu.php @@ -21,10 +21,11 @@ Dict::Add('EN US', 'English', 'English', array( 'UI:Layout:NavigationMenu:CompanyLogo:AltText' => 'Company logo', 'UI:Layout:NavigationMenu:Toggler:Tooltip' => 'Expand / Collapse', + 'UI:Layout:NavigationMenu:Toggler:TooltipWithSiloLabel' => 'Expand / Collapse (Filtered on %1$s)', 'UI:Layout:NavigationMenu:MenuFilter:Input:Placeholder' => 'Filter...', 'UI:Layout:NavigationMenu:MenuFilter:Input:Tooltip' => 'Type your keywords to filter menus', 'UI:Layout:NavigationMenu:MenuFilter:Input:Hotkey' => 'Alt + M', - 'UI:Layout:NavigationMenu:MenuFilter:Input:Hint' => 'Matches from all menu groups will be displayed, not only those from this one', + 'UI:Layout:NavigationMenu:MenuFilter:Input:Hint' => 'Matches from all menu groups will be displayed', 'UI:Layout:NavigationMenu:MenuFilter:Placeholder:Hint' => 'No result for this menu filter', 'UI:Layout:NavigationMenu:UserInfo:WelcomeMessage:Text' => 'Hi %1$s!', 'UI:Layout:NavigationMenu:UserInfo:Picture:AltText' => '%1$s\'s contact picture' diff --git a/js/components/global-search.js b/js/components/global-search.js index a8fa69e6a..d6a87cbce 100644 --- a/js/components/global-search.js +++ b/js/components/global-search.js @@ -31,6 +31,7 @@ $(function() css_classes: { opened: 'ibo-is-opened', + hidden: 'ibo-is-hidden', }, js_selectors: { @@ -143,11 +144,14 @@ $(function() }, _openDrawer: function() { + this.element.find(this.js_selectors.compartment_element).removeClass(this.css_classes.hidden); this.element.addClass(this.css_classes.opened); }, _closeDrawer: function() { this.element.removeClass(this.css_classes.opened); + //Note: Elements are hidden to avoid having the keyboard navigation "TAB" passing throught them when they are not displayed + this.element.find(this.js_selectors.compartment_element).addClass(this.css_classes.hidden); }, _setFocusOnInput: function() { diff --git a/js/components/quick-create.js b/js/components/quick-create.js index 11a7f9657..de2400b64 100644 --- a/js/components/quick-create.js +++ b/js/components/quick-create.js @@ -31,6 +31,7 @@ $(function() css_classes: { opened: 'ibo-is-opened', + hidden: 'ibo-is-hidden', }, js_selectors: { @@ -157,11 +158,14 @@ $(function() }, _openDrawer: function() { + this.element.find(this.js_selectors.compartment_element).removeClass(this.css_classes.hidden); this.element.addClass(this.css_classes.opened); }, _closeDrawer: function() { this.element.removeClass(this.css_classes.opened); + //Note: Elements are hidden to avoid having the keyboard navigation "TAB" passing throught them when they are not displayed + this.element.find(this.js_selectors.compartment_element).addClass(this.css_classes.hidden); }, _setFocusOnInput: function() { diff --git a/js/layouts/navigation-menu.js b/js/layouts/navigation-menu.js index 73bfd40b2..4180b1f90 100644 --- a/js/layouts/navigation-menu.js +++ b/js/layouts/navigation-menu.js @@ -123,7 +123,12 @@ $(function() oEvent.preventDefault(); var sMenuGroupId = oMenuGroupElem.attr('data-menu-group-id'); - this._openDrawer(sMenuGroupId); + if(this._getActiveMenuGroupId() === sMenuGroupId) { + this._closeDrawer(); + } + else { + this._openDrawer(sMenuGroupId); + } }, _onBodyClick: function(oEvent) { diff --git a/pages/UI.php b/pages/UI.php index 71c563ddd..9d46cd529 100644 --- a/pages/UI.php +++ b/pages/UI.php @@ -630,6 +630,7 @@ try $sQueryLabel = $sFullText; } GlobalSearchHelper::AddQueryToHistory($sQuery, $sQueryIconUrl, $sQueryLabel); + $oP->GetTopBarLayout()->GetGlobalSearch()->SetLastQueries(GlobalSearchHelper::GetLastQueries()); // Check the needle length $iMinLenth = MetaModel::GetConfig()->Get('full_text_needle_min'); diff --git a/pages/run_query.php b/pages/run_query.php index 2e43d2811..73992656d 100644 --- a/pages/run_query.php +++ b/pages/run_query.php @@ -213,7 +213,7 @@ EOF null, null, true - ); + )->SetTooltip(Dict::S('UI:Button:Evaluate:Title')); $oQueryForm->AddSubBlock($oQuerySubmit); diff --git a/sources/application/UI/Base/Component/GlobalSearch/GlobalSearchHelper.php b/sources/application/UI/Base/Component/GlobalSearch/GlobalSearchHelper.php index 964688069..9ed2d0797 100644 --- a/sources/application/UI/Base/Component/GlobalSearch/GlobalSearchHelper.php +++ b/sources/application/UI/Base/Component/GlobalSearch/GlobalSearchHelper.php @@ -112,7 +112,7 @@ class GlobalSearchHelper // Add HTML label if missing if(!isset($aHistoryEntries[$iIdx]['label_html'])) { - $aHistoryEntries[$iIdx]['label_html'] = utils::HtmlEntities($aHistoryEntries[$iIdx]['query']); + $aHistoryEntries[$iIdx]['label_html'] = utils::EscapeHtml($aHistoryEntries[$iIdx]['query']); } // Set absolute URL diff --git a/sources/application/UI/Base/Component/QuickCreate/QuickCreateHelper.php b/sources/application/UI/Base/Component/QuickCreate/QuickCreateHelper.php index 656b30249..950426c4f 100644 --- a/sources/application/UI/Base/Component/QuickCreate/QuickCreateHelper.php +++ b/sources/application/UI/Base/Component/QuickCreate/QuickCreateHelper.php @@ -108,7 +108,7 @@ class QuickCreateHelper // Add class label if(!isset($aHistoryEntries[$iIdx]['label_html'])) { - $aHistoryEntries[$iIdx]['label_html'] = utils::HtmlEntities(MetaModel::GetName($sClass)); + $aHistoryEntries[$iIdx]['label_html'] = utils::EscapeHtml(MetaModel::GetName($sClass)); } // Add url diff --git a/sources/application/UI/Base/Layout/NavigationMenu/NavigationMenu.php b/sources/application/UI/Base/Layout/NavigationMenu/NavigationMenu.php index 68bb87b39..fe04d3b5c 100644 --- a/sources/application/UI/Base/Layout/NavigationMenu/NavigationMenu.php +++ b/sources/application/UI/Base/Layout/NavigationMenu/NavigationMenu.php @@ -61,14 +61,18 @@ class NavigationMenu extends UIBlock /** @var string $sAppRevisionNumber */ protected $sAppRevisionNumber; - /** @var string $sAppSquareIconUrl */ + /** @var string Logo to display when the menu is collapsed */ protected $sAppSquareIconUrl; - /** @var string $sAppFullIconUrl */ + /** @var string Logo to display when the menu is expanded */ protected $sAppFullIconUrl; - /** @var string $sAppIconLink */ + /** @var string URL of the link on both $AppXXXIconUrl */ protected $sAppIconLink; - /** @var array $aSiloSelection */ + /** @var array Data to render the silo selection area */ protected $aSiloSelection; + /** @var bool Whether a silo is currently selected or not */ + protected $bHasSiloSelected; + /** @var string|null Current silo label */ + protected $sSiloLabel; /** @var array $aMenuGroups */ protected $aMenuGroups; /** @var array $aUserData */ @@ -110,6 +114,7 @@ class NavigationMenu extends UIBlock $this->oUserMenu = $oUserMenu; $this->oNewsroomMenu = $oNewsroomMenu; + $this->ComputeAppIconLink(); $this->ComputeExpandedState(); $this->ComputeMenuFilterHintState(); $this->ComputeUserData(); @@ -125,6 +130,7 @@ class NavigationMenu extends UIBlock } /** + * @uses $sAppSquareIconUrl * @return string */ public function GetAppSquareIconUrl() @@ -133,6 +139,7 @@ class NavigationMenu extends UIBlock } /** + * @uses $sAppFullIconUrl * @return string */ public function GetAppFullIconUrl() @@ -141,6 +148,7 @@ class NavigationMenu extends UIBlock } /** + * @uses $sAppIconLink * @return string */ public function GetAppIconLink() @@ -155,6 +163,24 @@ class NavigationMenu extends UIBlock { return $this->aSiloSelection; } + + /** + * @uses $bHasSiloSelected + * @return bool + */ + public function HasSiloSelected(): bool + { + return $this->bHasSiloSelected; + } + + /** + * @uses $sSiloLabel + * @return string|null + */ + public function GetSiloLabel() + { + return $this->sSiloLabel; + } /** * @return array @@ -223,6 +249,24 @@ class NavigationMenu extends UIBlock return MetaModel::GetConfig()->Get('newsroom_enabled'); } + /** + * @uses $sAppIconLink + * @return void + */ + public function ComputeAppIconLink(): void + { + $sPropCode = 'app_icon_url'; + + // Try if a custom URL was set in the configuration file + if(MetaModel::GetConfig()->IsCustomValue($sPropCode)) { + $this->sAppIconLink = MetaModel::GetConfig()->Get('app_icon_url'); + } + // Otherwise use the home page + else { + $this->sAppIconLink = MetaModel::GetConfig()->Get('app_root_url'); + } + } + /** * @return void * @throws \CoreException @@ -231,6 +275,9 @@ class NavigationMenu extends UIBlock */ public function ComputeSiloSelection() { + $this->bHasSiloSelected = false; + $this->sSiloLabel = null; + //TODO 3.0 Use components if we have the time to build select/autocomplete components before release // List of visible Organizations $iCount = 0; @@ -263,6 +310,13 @@ class NavigationMenu extends UIBlock default: $oAppContext = new ApplicationContext(); $iCurrentOrganization = $oAppContext->GetCurrentValue('org_id'); + + if(!empty($iCurrentOrganization)) { + $oCurrentOrganization = MetaModel::GetObject('Organization', $iCurrentOrganization, true, true); + $this->bHasSiloSelected = true; + $this->sSiloLabel = $oCurrentOrganization->GetRawName(); + } + $this->aSiloSelection['html'] = '