mirror of
https://github.com/Cacti/cacti.git
synced 2026-10-23 03:27:02 +09:00
5403cf75bb
* feature: user-defined filter layouts with administrator publishing
Add a render_layouts toggle to the CactiTableFilter class so list pages
offer Save / New / Rename / Delete controls for saved filter layouts,
modelled on the monitor plugin. Layouts persist to a new user_layouts
table (id, user_id, page, name, url). The toggle defaults on for every
page except the Console > Presets pages (CDEFs, VDEFs, Colors, GPRINTs,
Data Profiles, SNMP), where it is off.
Each user manages their own layouts from any filter. Administrators who
hold the Settings/Utilities realm can publish a layout to all users
(moving it to user_id = 0) from the filter, and from a new
Console > Presets > Filters management page (layouts.php) where they can
view and manage every user's layouts. Published layouts appear for all
users on that page.
Layout create/rename/delete/publish requests are handled centrally by
filter_layouts_handle_request(), invoked from include/auth.php after the
user has been authorized for the current page, so the controls work on any
filter page while publishing stays gated on the realm. layouts.php itself
is mapped to the Settings/Utilities realm so the Presets > Filters menu
pick is administrator-only.
Schema added to cacti.sql, install/upgrades/1_3_0.php, and
docs/audit_schema.sql. Adds tests/Unit/FilterLayoutsTest.php covering the
URL-safety validation, preset-page defaults, and the request/permission
wiring.
* changelog: 8185.feature fragment for filter layouts
* chore: enforce LF line endings via .gitattributes and normalize new files
* fix: address review - attribute-escape layout options, honor failed/non-editable layout ops, regenerate cacti.pot, move test to Unit/Ui/Html
* chore: renormalize pre-existing CRLF files to LF per .gitattributes
* chore: keep vendored JS (big.js, tablesorter) byte-identical to upstream and exclude from LF normalization
* style: apply php-cs-fixer formatting and resolve PHPStan level 8 findings in filter layouts
* ci: re-trigger checks on current head
* refactor: store filter layouts as a versioned JSON document in a TEXT data column
Replace the user_layouts.url varchar(1024) column with a data TEXT column holding a versioned {version,page,filter} document. The navigable url is rebuilt server-side from the document (page basename + rebuilt query) plus the filter_layout marker, removing the stored-url redirect/XSS surface and making the backend forward-compatible with a structured query builder without a further schema change.
* feature: add Modern/Legacy page filter format with an Edit dialog for filters
Modern (default) collapses the filter to a Layouts selector plus an Edit dialog holding the Filter Name and all filter fields; Save and Publish live in the dialog, with Edit/Rename/Delete/Save As on the bar and time controls/refresh kept on the bar. Legacy keeps the classic inline filter. The format is a per-user General setting (page_filter_format). Field rendering is factored into emit_field() so both layouts share one source.
* fix: render page-action buttons (import, export, sort) on the modern filter bar
Import, Export, Purge, Save, and sort ascending/descending are page actions, not filter inputs, so they render on the bar beside the Layouts selector instead of inside the Edit dialog. Only go/clear are dropped from the bar; the dialog keeps the Search/Clear footer.
* feature: render the modern Edit dialog one filter variable per row
The dialog no longer mirrors the inline filter's multi-field row packing; each filter variable renders on its own row (label + control) for a clean, responsive form. Hidden/validate fields stay in the form without an empty visible row. Rows carry a cactiFilterEditRow hook for label-column alignment styling.
* feature: align the modern edit dialog one-per-row and skin it per theme
Render all dialog fields in a single table so the label column aligns via the existing table-cell layout. Tag the dialog widget with cactiFilterDialog and add a scoped skin to the modern theme (slate titlebar, styled button pane, accented primary action). Add a bar separator between layout and page-action buttons.
* feature: skin the modern filter Edit dialog across the classic themes
Add the scoped .cactiFilterDialog skin (accent titlebar, white title/close, styled button pane with an accented primary action) to cacti, carrot, dark, hollyberry, paper-plane, paw, raspberry, and sunrise, each using its own brand accent. The skin is accent-only and inherits each theme's dialog surface, so it works on light and dark themes. MidWinter is intentionally skipped (its variable-based CSS is handled in a separate Epic).
* fix: delete a user's saved filter layouts when the user is removed
user_remove() now deletes the user's own user_layouts rows alongside their other per-user data. Scoped to user_id so published (user_id = 0) layouts remain available to everyone.
* fix: address PR review — PHPStan return type, escaping, callbacks, SQL columns, mb truncation, contrast, POT
- create_filter(): cast both ob_get_clean() returns to string and drop the now-unused PHPStan baseline entry (fixes Level 6 failure).
- Edit dialog title now uses html_escape_attr() (attribute-context double-encoding).
- Modern Search/Clear honor the page's configured go/clear callbacks instead of hardcoding applyFilter()/clearFilter().
- filter_layouts_get() and layouts.php select explicit columns instead of *.
- Layout name truncation uses mb_substr() to avoid cutting multibyte codepoints.
- layouts.php management callback checks result.ok before reloading.
- carrot/paper-plane dialog accents darkened to meet WCAG AA (>=4.5:1) with white text.
- Added the new translatable msgids (Page Filter Format, Filters, Edit Filter, Filter Name, Save As, ...) to cacti.pot.
* fix: resolve Semgrep reflected-xss by reading filter_layout inside layout_select
The request var is no longer passed into layout_select() as a parameter (which Semgrep tracked parameter-to-return to the print sink); it is read internally like create_filter(), and the option markup remains escaped. No behavior change.
---------
Co-authored-by: TheWitness <copilot@users.noreply.github.com>
Co-authored-by: TheWitness <TheWitness@users.noreply.github.com>
2962 lines
60 KiB
CSS
2962 lines
60 KiB
CSS
/*
|
|
+-------------------------------------------------------------------------+
|
|
| Copyright (C) 2004-2026 The Cacti Group |
|
|
| |
|
|
| This program is free software; you can redistribute it and/or |
|
|
| modify it under the terms of the GNU General Public License |
|
|
| as published by the Free Software Foundation; either version 2 |
|
|
| of the License, or (at your option) any later version. |
|
|
| |
|
|
| This program 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 General Public License for more details. |
|
|
+-------------------------------------------------------------------------+
|
|
| Cacti: The Complete RRDtool-based Graphing Solution |
|
|
+-------------------------------------------------------------------------+
|
|
| This code is designed, written, and maintained by the Cacti Group. See |
|
|
| about.php and/or the AUTHORS file for specific developer information. |
|
|
+-------------------------------------------------------------------------+
|
|
| http://www.cacti.net/ |
|
|
+-------------------------------------------------------------------------+
|
|
*/
|
|
|
|
/* main styles */
|
|
|
|
body, table, tr, td, textarea {
|
|
font-family: 'Segoe UI', 'Segoe UI Web Regular', 'Segoe UI Symbol', 'Helvetica Neue', 'BBAlpha Sans', 'S60 Sans', Arial, sans-serif;
|
|
font-size: 12px;
|
|
-ms-overflow-style: scrollbar;
|
|
}
|
|
|
|
body {
|
|
margin: 0px;
|
|
background-color: white;
|
|
background-repeat: repeat-y;
|
|
overflow: hidden;
|
|
}
|
|
|
|
textarea {
|
|
font-family: 'Segoe UI', 'Segoe UI Web Regular', 'Segoe UI Symbol', 'Helvetica Neue', 'BBAlpha Sans', 'S60 Sans', Arial, sans-serif;
|
|
font-size: 1.0em;
|
|
padding: 5px;
|
|
width: 400px;
|
|
height: 100px;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
table {
|
|
border-collapse: collapse;
|
|
border-spacing: 0;
|
|
border: none;
|
|
text-align: left;
|
|
}
|
|
|
|
td, th {
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
th {
|
|
white-space: nowrap;
|
|
height: 20px;
|
|
line-height: 20px;
|
|
}
|
|
|
|
img {
|
|
border: none;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
fieldset {
|
|
border: none;
|
|
padding: 0px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.cols1 {
|
|
width: 100%;
|
|
display:table-cell;
|
|
}
|
|
|
|
.cols2 {
|
|
width: 50%;
|
|
display:table-cell;
|
|
}
|
|
|
|
.cols3 {
|
|
width: 33%;
|
|
display:table-cell;
|
|
}
|
|
|
|
.cols4 {
|
|
width: 25%;
|
|
display:table-cell;
|
|
}
|
|
|
|
.cols5 {
|
|
width: 20%;
|
|
display:table-cell;
|
|
}
|
|
|
|
.cols6 {
|
|
width: 16.6%;
|
|
display:table-cell;
|
|
}
|
|
|
|
.graphPage {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
hr.menu {
|
|
border: 0;
|
|
height: 1px;
|
|
background: #333;
|
|
background-image: linear-gradient(to right, #ccc, #333, #ccc);
|
|
}
|
|
|
|
.reindex_methods span {
|
|
font-size: 9px;
|
|
}
|
|
|
|
.checkboxLabel {
|
|
display: none;
|
|
}
|
|
|
|
.realms .checkboxLabel {
|
|
display: inline !important;
|
|
}
|
|
|
|
/* links */
|
|
|
|
a, a:active, a:visited {
|
|
color: rgba(255,157,0,1);
|
|
text-decoration: none;
|
|
font-size: 12px;
|
|
}
|
|
|
|
a:hover {
|
|
text-decoration: none;
|
|
color: #333333;
|
|
}
|
|
|
|
i.fa, i.fas, i.fab, i.far, i.fal {
|
|
font-size: 15px;
|
|
padding: 0px 3px;
|
|
text-align: left;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
th .fa {
|
|
margin-top: -5px;
|
|
position: absolute;
|
|
right: 3px;
|
|
top: 50%;
|
|
}
|
|
|
|
#main {
|
|
display: none;
|
|
width: 100%;
|
|
position: relative;
|
|
z-index: 0;
|
|
}
|
|
|
|
input, select {
|
|
padding: 0.4em 0.4em 0.4em 0.4em;
|
|
}
|
|
|
|
label {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.glyph_tab-console:before {
|
|
content: '\f7aa';
|
|
font-family: "Font Awesome 5 Free";
|
|
display: inline-block;
|
|
}
|
|
|
|
.text_tab-console {
|
|
display: none;
|
|
}
|
|
|
|
.nowrap {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.prewrap {
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
.top {
|
|
vertical-align: top;
|
|
}
|
|
|
|
.right {
|
|
text-align: right !important;
|
|
}
|
|
|
|
.left {
|
|
text-align: left;
|
|
}
|
|
|
|
.center {
|
|
text-align: center !important;
|
|
}
|
|
|
|
.usermenudown {
|
|
background: transparent url('./../../../images/bullet_arrow_down.png') no-repeat center right;
|
|
}
|
|
|
|
.usermenuup {
|
|
background: transparent url('./../../../images/bullet_arrow_up.png') no-repeat center right;
|
|
}
|
|
|
|
.user {
|
|
padding-right: 16px;
|
|
font-weight: bold;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.filter {
|
|
position: relative;
|
|
left: -20px;
|
|
margin-right: -10px;
|
|
font-size: 13px !important;
|
|
}
|
|
|
|
.badpassword {
|
|
padding: 4px;
|
|
color: red;
|
|
font-size: 1.5em !important;
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
.goodpassword {
|
|
padding: 4px;
|
|
color: green;
|
|
font-size: 1.5em !important;
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
.associated {
|
|
color: green;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.notAssociated {
|
|
color: red;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.disabled_row span, .disabled_row td, .disabled_row a {
|
|
color: grey;
|
|
}
|
|
|
|
.disabled {
|
|
color: grey;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.idle {
|
|
color: green;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.running {
|
|
color: red;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.newObject {
|
|
color: blue;
|
|
}
|
|
|
|
.updateObject {
|
|
color: grey;
|
|
}
|
|
|
|
.unmetDependency {
|
|
color: red;
|
|
}
|
|
|
|
.foundDependency {
|
|
color: navy;
|
|
}
|
|
|
|
.success {
|
|
color: green;
|
|
}
|
|
|
|
.failed {
|
|
color: red;
|
|
}
|
|
|
|
.accessGranted {
|
|
color: green;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.accessGrantedItem {
|
|
color: green;
|
|
}
|
|
|
|
.accessRestricted {
|
|
color: red;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.accessRestrictedItem {
|
|
color: red;
|
|
}
|
|
|
|
.deleteIcon {
|
|
width: 10px;
|
|
height: 10px;
|
|
cursor: pointer;
|
|
padding: 2px;
|
|
border: none;
|
|
}
|
|
|
|
.drillDown {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.monoSpace {
|
|
font-size: 9px;
|
|
font-family: monospace;
|
|
}
|
|
|
|
.utilityPick {
|
|
width: 200px;
|
|
}
|
|
|
|
.itemlist {
|
|
max-height: 200px;
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.realms {
|
|
width: 20%;
|
|
vertical-align: top;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.spikeKillMenuItem {
|
|
display: block;
|
|
width: 100%;
|
|
}
|
|
|
|
.deviceUp {
|
|
color: rgba(148, 179, 107, 0.8) !important;
|
|
}
|
|
|
|
.deviceDown {
|
|
color: #ff0000 !important;
|
|
}
|
|
|
|
.deviceUnknown {
|
|
color: #0000ff !important;
|
|
}
|
|
|
|
.deviceDisabled {
|
|
color: #a1a1a1 !important;
|
|
}
|
|
|
|
.deviceRecovering {
|
|
color: #ff8f1e !important;
|
|
}
|
|
|
|
.deviceError {
|
|
color: #750F7D !important;
|
|
}
|
|
|
|
.deviceDownMuted {
|
|
color: #ffe333 !important;
|
|
}
|
|
|
|
.deviceThreshold {
|
|
color: #ffa833 !important;
|
|
}
|
|
|
|
.deviceUnmonitored {
|
|
color: rgba(250, 253, 158, 0.8) !important;
|
|
}
|
|
|
|
.deviceWarning {
|
|
color: #aa7807 !important;
|
|
}
|
|
|
|
.deviceAlert {
|
|
color: #660000 !important;
|
|
}
|
|
|
|
.deviceUpBg {
|
|
color: rgba(22,22,22,0.8);
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
background-color: rgba(148, 179, 107, 0.8);
|
|
}
|
|
|
|
.deviceDownBg {
|
|
color: rgba(22,22,22,0.8);
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
background-color: #ff0000;
|
|
}
|
|
|
|
.deviceUnknownBg {
|
|
color: rgba(22,22,22,0.8);
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
background-color: #0000ff;
|
|
}
|
|
|
|
.deviceDisabledBg {
|
|
color: rgba(22,22,22,0.8);
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
background-color: #a1a1a1;
|
|
}
|
|
|
|
.deviceRecoveringBg {
|
|
color: rgba(22,22,22,0.8);
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
background-color: #ff8f1e;
|
|
}
|
|
|
|
.deviceErrorBg {
|
|
color: rgba(22,22,22,0.8);
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
background-color: #750F7D;
|
|
}
|
|
|
|
.deviceDownMutedBg {
|
|
color: rgba(22,22,22,0.8);
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
background-color: #ffe333;
|
|
}
|
|
|
|
.deviceThresholdBg {
|
|
color: rgba(22,22,22,0.8);
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
background-color: #ffa833;
|
|
}
|
|
|
|
.deviceUnmonitoredBg {
|
|
color: rgba(22,22,22,0.8);
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
background-color: rgba(250, 253, 158, 0.8);
|
|
}
|
|
|
|
.deviceWarningBg {
|
|
color: rgba(22,22,22,0.8);
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
background-color: #aa7807;
|
|
}
|
|
|
|
.deviceAlertBg {
|
|
color: rgba(22,22,22,0.8);
|
|
font-size: 10pt;
|
|
font-weight: bold;
|
|
background-color: #660000;
|
|
}
|
|
|
|
.beingGraphed {
|
|
color: rgba(148, 179, 107, 0.8);
|
|
}
|
|
|
|
.notBeingGraphed {
|
|
color: #484848;
|
|
}
|
|
|
|
.submenuoptions {
|
|
background: white;
|
|
border-width: 0px 3px 3px 3px;
|
|
border-color: rgba(0, 161, 11,0.7);
|
|
border-style: solid;
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.7) 0%, rgba(3,159,11,0.7) 99%, rgba(0,161,11,0.7) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
position: absolute;
|
|
top: 45px;
|
|
list-style: none;
|
|
text-align: left;
|
|
margin: 0px;
|
|
padding: 10px 0px 10px 0px;
|
|
}
|
|
|
|
.submenuoptions li a {
|
|
display: block;
|
|
padding: 2px 15px 2px 15px;
|
|
font-size: 14px;
|
|
font-weight: lighter;
|
|
color: rgba(0, 161, 11,0.9);
|
|
text-decoration: none;
|
|
}
|
|
|
|
.submenuoptions li a:hover {
|
|
display: block;
|
|
background: rgba(0, 161, 11,0.1);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.1) 0%, rgba(3,159,11,0.1) 99%, rgba(0,161,11,0.1) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.1) 0%,rgba(3,159,11,0.1) 99%,rgba(0,161,11,0.1) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.1) 0%,rgba(3,159,11,0.1) 99%,rgba(0,161,11,0.1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
.menuoptions {
|
|
background: white;
|
|
border-width: 0px 3px 3px 3px;
|
|
border-color: rgba(0, 161, 11,0.7);
|
|
border-style: solid;
|
|
display: block;
|
|
float: right;
|
|
position: absolute;
|
|
right: 0px;
|
|
top: 45px;
|
|
list-style: none;
|
|
text-align: right;
|
|
margin: 0px;
|
|
padding: 10px 0px 10px 0px;
|
|
}
|
|
|
|
.menuoptions li a {
|
|
display: block;
|
|
padding: 2px 15px 2px 15px;
|
|
font-size: 14px;
|
|
font-weight: lighter;
|
|
color: rgba(0, 161, 11,0.9);
|
|
text-decoration: none;
|
|
}
|
|
|
|
.menuoptions li a:hover {
|
|
display: block;
|
|
background: rgba(0, 161, 11,0.1);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.1) 0%, rgba(3,159,11,0.1) 99%, rgba(0,161,11,0.1) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.1) 0%,rgba(3,159,11,0.1) 99%,rgba(0,161,11,0.1) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.1) 0%,rgba(3,159,11,0.1) 99%,rgba(0,161,11,0.1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
.import_label {
|
|
opacity: 1;
|
|
}
|
|
|
|
.import_button {
|
|
display: none;
|
|
opacity: 0;
|
|
}
|
|
|
|
.import_text {
|
|
opacity: 1;
|
|
color: #2d4ca8;
|
|
}
|
|
|
|
.color-icon {
|
|
background-image: none !important;
|
|
}
|
|
|
|
.emailtest {
|
|
cursor: pointer;
|
|
display: block;
|
|
float: right;
|
|
text-align: right;
|
|
padding: 0px 5px 0px 0px;
|
|
}
|
|
|
|
.reloadquery {
|
|
cursor: pointer;
|
|
padding: 2px;
|
|
vertical-align: middle;
|
|
color: lime;
|
|
font-weight: bold;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.verbosequery {
|
|
cursor: pointer;
|
|
padding: 2px;
|
|
vertical-align: middle;
|
|
color: rgba(255, 204, 0, 0.8);
|
|
font-size: 14px;
|
|
}
|
|
|
|
.deletequery {
|
|
cursor: pointer;
|
|
padding: 2px;
|
|
vertical-align: middle;
|
|
color: red !important;
|
|
font-weight: bold;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.deletequery:hover {
|
|
color: red !important;
|
|
text-decoration: none;
|
|
padding: 2px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.odd {
|
|
background: none repeat scroll 0 0 #F5F5F5;
|
|
border: none;
|
|
}
|
|
|
|
.odd td, .even td, .even-alternate td {
|
|
min-height: 20px !important;
|
|
line-height: 20px;
|
|
}
|
|
|
|
.even {
|
|
background: none repeat scroll 0 0 rgba(230, 89, 58,0.1);
|
|
border: none;
|
|
}
|
|
|
|
.even-alternate {
|
|
#background: none repeat scroll 0 0 #E7E9F2;
|
|
#background-color: #E7E9F2;
|
|
border: none;
|
|
#box-shadow: 0 0 1px rgba(230, 89, 58, 0.1);
|
|
}
|
|
|
|
.saveRow {
|
|
background-color: #EAEAEA;
|
|
text-align: right;
|
|
padding: 4px;
|
|
padding-right: 14px;
|
|
}
|
|
|
|
.treeArea, .treeItemsArea {
|
|
width: 25%;
|
|
border: 1px solid #006400;
|
|
vertical-align: top;
|
|
}
|
|
|
|
.linkMarker {
|
|
color: #c16921;
|
|
}
|
|
|
|
.filteredValue {
|
|
background-color: #F8D93D;
|
|
}
|
|
|
|
.graphItemGr1Alt1 {
|
|
background-color: #EEEEEE;
|
|
}
|
|
|
|
.graphItemGr1Alt2 {
|
|
background-color: #EEEEEE;
|
|
}
|
|
|
|
.graphItemGr1Cust {
|
|
background-color: #D5D5D5;
|
|
}
|
|
|
|
.graphItemGr2Alt1 {
|
|
background-color: #E7E9F2;
|
|
}
|
|
|
|
.graphItemGr2Alt2 {
|
|
background-color: #E7E9F2;
|
|
}
|
|
|
|
.graphItemGr1Cust {
|
|
background-color: #D2D6E7;
|
|
}
|
|
|
|
.graphItemAdd {
|
|
background-color: #00438c;
|
|
}
|
|
|
|
.graphItemDel {
|
|
background-color: #C63636;
|
|
}
|
|
|
|
.graphItemHR {
|
|
color: #FF0000;
|
|
}
|
|
|
|
.hostUp {
|
|
color: #000000;
|
|
font-size: 10px;
|
|
font-weight: normal;
|
|
font-family: monospace;
|
|
}
|
|
|
|
.hostDown {
|
|
color: #ff0000;
|
|
font-size: 10px;
|
|
font-weight: normal;
|
|
font-family: monospace;
|
|
}
|
|
|
|
.cactiPageHead {
|
|
background-color: rgba(0, 161, 11,1);
|
|
background: -moz-linear-gradient(top, #ff0400 0%, #00a10b 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, #ff0400 0%, #00a10b 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, #ff0400 0%, #00a10b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0400', endColorstr='#00a10b',GradientType=0 ); /* IE6-9 */
|
|
height: 45px;
|
|
width: 100%;
|
|
padding: 0px;
|
|
}
|
|
|
|
.cactiPageHead div {
|
|
left: 0;
|
|
top: 0;
|
|
}
|
|
|
|
.cactiPageHead #tabs {
|
|
overflow-x: auto;
|
|
overflow-y: hidden;
|
|
}
|
|
|
|
.cactiGraphPageHeadBackdrop {
|
|
padding-bottom: 0px;
|
|
float: right;
|
|
position: fixed;
|
|
}
|
|
|
|
.cactiPageBottom {
|
|
background-color: rgba(0, 161, 11,0.7);
|
|
background: -moz-linear-gradient(top, #ff0400 0%, #00a10b 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, #ff0400 0%, #00a10b 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, #ff0400 0%, #00a10b 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff0400', endColorstr='#00a10b',GradientType=0 ); /* IE6-9 */
|
|
height: 15px;
|
|
width: 100%;
|
|
position: fixed;
|
|
bottom: 0;
|
|
left: 0;
|
|
}
|
|
|
|
.cactiConsolePageHeadBackdrop {
|
|
padding-bottom: 0px;
|
|
float: right;
|
|
position: fixed;
|
|
}
|
|
|
|
.navigation {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.debug td {
|
|
padding: 3px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.breadCrumbBar {
|
|
display: none !important;
|
|
}
|
|
|
|
.cactiContent {
|
|
clear: both;
|
|
width: 100%;
|
|
vertical-align: top;
|
|
}
|
|
|
|
.cactiTreeNavigationArea {
|
|
background: #f0f0f0;
|
|
overflow-y: auto;
|
|
margin-left: 0px;
|
|
margin-right: 0px;
|
|
height: 100%;
|
|
float: left;
|
|
display: none;
|
|
}
|
|
|
|
.cactiTreeNavigationArea a {
|
|
padding-right: 18px !important;
|
|
}
|
|
|
|
.cactiTreeNavigationArea div:first-child {
|
|
padding-left: 5px;
|
|
}
|
|
|
|
.cactiTreeSearch {
|
|
padding-top: 5px;
|
|
}
|
|
|
|
.jstree {
|
|
position: relative;
|
|
display: block;
|
|
}
|
|
|
|
.cactiContentNavigationArea {
|
|
overflow: hidden;
|
|
padding-left: 0px;
|
|
padding-right: 0px;
|
|
padding-top: 0px;
|
|
vertical-align: top;
|
|
left: 0px;
|
|
}
|
|
|
|
.cactiConsoleNavigationArea {
|
|
background: #f0f0f0;
|
|
overflow-y: auto !important;
|
|
width: 167px;
|
|
height: 100%;
|
|
float: left;
|
|
}
|
|
|
|
.cactiLogo {
|
|
background: #efefef url('./images/cacti_logo.svg') no-repeat 30px;
|
|
display: table;
|
|
cursor: pointer;
|
|
padding-bottom: 140px;
|
|
margin-bottom: 60px;
|
|
width: 156px;
|
|
margin-top: 10px;
|
|
margin-left: 2px;
|
|
margin-right: 2px;
|
|
}
|
|
|
|
.cactiAuthLogo {
|
|
position: relative;
|
|
background: transparent url('./images/cacti_logo.svg') no-repeat 30px;
|
|
width: 130px;
|
|
height: 148px;
|
|
z-index: 2;
|
|
margin-top: -310px;
|
|
margin-left: 250px;
|
|
}
|
|
|
|
.cactiAuthCenter {
|
|
width: 350px;
|
|
}
|
|
|
|
.cactiAuthCenter hr {
|
|
display:none;
|
|
}
|
|
|
|
.cactiAuthArea {
|
|
-moz-border-radius: 10px;
|
|
border-radius: 10px;
|
|
padding: 15px;
|
|
background-color: white;
|
|
top: 30%;
|
|
width: 360px;
|
|
max-height: 300px;
|
|
background: rgba(255,255,255,1);
|
|
background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
|
|
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1)));
|
|
background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
|
|
background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
|
|
background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
|
|
background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 );
|
|
}
|
|
|
|
.cactiAuthTitle {
|
|
padding-top: 5px;
|
|
padding-bottom: 5px;
|
|
}
|
|
|
|
.cactiAuthTable td {
|
|
padding-bottom: 6px;
|
|
padding-right: 6px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.cactiAuthErrors {
|
|
color: red;
|
|
min-height: 20px;
|
|
}
|
|
|
|
legend {
|
|
font-size: 22px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.cactiAuthBody {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
width: 100%;
|
|
height: 100%;
|
|
background: rgba(0, 161, 11,0.7);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.7) 0%, rgba(3,159,11,0.7) 99%, rgba(0,161,11,0.7) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
.cactiAuthPanel {
|
|
padding: 4px 0px;
|
|
}
|
|
|
|
.versionInfo {
|
|
padding-top: 5px;
|
|
float: right;
|
|
margin-top: 15px;
|
|
color: white;
|
|
}
|
|
|
|
.actionsDropdown {
|
|
vertical-align: middle;
|
|
padding: 3px;
|
|
width: 100%;
|
|
text-align: right;
|
|
display: table;
|
|
}
|
|
|
|
.actionsDropdown div {
|
|
display: table-row;
|
|
margin-top: auto;
|
|
margin-bottom: auto;
|
|
}
|
|
|
|
.actionsDropdownButton {
|
|
vertical-align: top;
|
|
float: right;
|
|
padding-left: 3px;
|
|
display: table-cell;
|
|
padding-right: 14px;
|
|
}
|
|
|
|
.actionsDropdownArrow {
|
|
margin-top: auto;
|
|
margin-bottom: auto;
|
|
float: left !important;
|
|
padding: 3px;
|
|
}
|
|
|
|
.cactiTooltipHint {
|
|
cursor: pointer;
|
|
padding: 5px;
|
|
font-size: 14px !important;
|
|
}
|
|
|
|
.spikekillData, .spikekillData td {
|
|
border: 1px solid #999;
|
|
}
|
|
|
|
.spikekillNote {
|
|
padding: 1px;
|
|
margin: 0px;
|
|
}
|
|
|
|
.spikekillMenu {
|
|
background: #f5f5f5 none repeat scroll 0 0;
|
|
border: 1px solid #979797;
|
|
box-shadow: 2px 2px 2px #999999;
|
|
margin: 0;
|
|
padding: 2px;
|
|
line-height: 1.5em;
|
|
}
|
|
|
|
.spikekillMenu li {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.spikekillMenu i {
|
|
text-align: center;
|
|
width: 2.0em;
|
|
display: inline-block;
|
|
}
|
|
|
|
.spikekillMenu i:empty {
|
|
width: 2.0em;
|
|
display: inline-block;
|
|
}
|
|
|
|
.loginPanel {
|
|
padding: 4px 0px;
|
|
}
|
|
|
|
.treeTable {
|
|
width: 100%;
|
|
}
|
|
|
|
.treeArea {
|
|
vertical-align: top;
|
|
}
|
|
|
|
.graphDrillDown {
|
|
padding: 10px 3px;
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
align-self: left;
|
|
z-index: 4;
|
|
height: 100%;
|
|
height: 200px;
|
|
width: 22px;
|
|
min-width: 22px;
|
|
}
|
|
|
|
.graphWrapper {
|
|
padding: 10px 3px;
|
|
display: inline-block;
|
|
}
|
|
|
|
.cactiGraphContentArea {
|
|
height: 100vh;
|
|
overflow-y: auto !important;
|
|
overflow-x: hidden !important;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.cactiGraphContentArea>div:last-child {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.cactiGraphContentAreaPreview {
|
|
height: 100vh;
|
|
overflow-y: auto !important;
|
|
overflow-x: hidden !important;
|
|
padding-left: 10px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.cactiGraphContentAreaPreview>div:last-child {
|
|
margin-top: 10px;
|
|
}
|
|
|
|
.cactiConsoleContentArea {
|
|
height: 100vh;
|
|
overflow-y: auto !important;
|
|
overflow-x: hidden !important;
|
|
padding-left: 10px;
|
|
}
|
|
|
|
.cactiConsoleContentArea>div:last-child {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.hyperLink {
|
|
color: #2d4ca8;
|
|
font-size: 12px;
|
|
padding: 3px;
|
|
cursor: pointer;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.iconLink {
|
|
}
|
|
|
|
.iconLink img {
|
|
padding-bottom: 2px;
|
|
}
|
|
|
|
.piinstall, .pienable, .pidisable, .piuninstall, .pierror, .piforceremove, .pirmdata, .piload, .pireadme, .pichangelog, .pirestore, .pirmarchive {
|
|
padding: 0px 3px !important;
|
|
}
|
|
|
|
.linkEditMain, .linkEditMain:visited, .linkEditMain:active {
|
|
color: #a84ca8;
|
|
text-decoration: none;
|
|
font-size: 12px;
|
|
white-space: nowrap;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.linkEditMain:hover {
|
|
color: yellow;
|
|
white-space: nowrap;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.linkOverDark, .linkOverDark:visited, .linkOverDark:active {
|
|
color: white;
|
|
font-weight: normal;
|
|
text-decoration: none;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.linkOverDark:hover {
|
|
color: white;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.linkCopyDark, .linkCopyDark:visited, .linkCopyDark:active {
|
|
color: white;
|
|
font-weight: normal;
|
|
text-decoration: none;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.linkCopyDark:hover {
|
|
color: white;
|
|
text-decoration: none;
|
|
}
|
|
|
|
/* text styles */
|
|
|
|
.textError {
|
|
font-size: 12px;
|
|
color: red;
|
|
}
|
|
|
|
.textWarning {
|
|
font-size: 12px;
|
|
color: #ee7600 !important;
|
|
}
|
|
|
|
.textInfo {
|
|
font-size: 12px;
|
|
color: black;
|
|
}
|
|
|
|
.textHeader {
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.textOverflow {
|
|
max-width: 200px;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
display: block;
|
|
}
|
|
|
|
.bold {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.remover {
|
|
cursor: pointer;
|
|
}
|
|
|
|
.messageContainer {
|
|
text-align: center;
|
|
position: absolute;
|
|
display: none;
|
|
left: 30%;
|
|
right: 30%;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
z-index: 4;
|
|
}
|
|
|
|
.messageBox {
|
|
padding: 1px;
|
|
margin-top: 2px;
|
|
border-radius: 3px;
|
|
background-color: white;
|
|
border: 1px solid #BBBBBB;
|
|
position: relative;
|
|
z-index: 4;
|
|
}
|
|
|
|
.textHeaderDark {
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
color: white;
|
|
}
|
|
|
|
.templateHeader {
|
|
background: rgba(0, 161, 11,0.55);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.5) 0%, rgba(0,161,11,0.55) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.5) 0%,rgba(0,161,11,0.55) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.5) 0%,rgba(0,161,11,0.55) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#80ff0400', endColorstr='#8c00a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
.templateHeader td {
|
|
padding: 3px;
|
|
}
|
|
|
|
.textSubHeaderDark, .textSubHeaderDark:visited {
|
|
font-size: 11px;
|
|
color: white;
|
|
font-weight: bold;
|
|
padding: 0px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.cactiBorderWall {
|
|
border-width: 1px;
|
|
border-color: #E5E5E5;
|
|
border-style: solid;
|
|
}
|
|
|
|
.cactiTable {
|
|
display: table;
|
|
width: 100%;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
|
|
.cactiInstallLoaderSpinnerTheme {
|
|
border-top-color: rgba(0, 161, 11, 0.9) !important;
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.9) 0%, rgba(3,159,11,0.9) 99%, rgba(0,161,11,0.9) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.9) 0%,rgba(3,159,11,0.9) 99%,rgba(0,161,11,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.9) 0%,rgba(3,159,11,0.9) 99%,rgba(0,161,11,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
.cactiTableTitleRow {
|
|
color: white;
|
|
float: left;
|
|
text-align: left;
|
|
height: 25px;
|
|
display: table-column;
|
|
width: 100%;
|
|
font-size: 1em;
|
|
font-weight: 700;
|
|
background: rgba(0, 161, 11,0.9);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.9) 0%, rgba(3,159,11,0.9) 99%, rgba(0,161,11,0.9) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.9) 0%,rgba(3,159,11,0.9) 99%,rgba(0,161,11,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.9) 0%,rgba(3,159,11,0.9) 99%,rgba(0,161,11,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
.cactiTableTitle {
|
|
color: white;
|
|
float: left;
|
|
text-align: left;
|
|
line-height: 22px;
|
|
display: table-column;
|
|
font-size: 1em;
|
|
font-weight: 700;
|
|
background: rgba(0, 161, 11,0.7);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.7) 0%, rgba(3,159,11,0.7) 99%, rgba(0,161,11,0.7) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
.cactiTableButton {
|
|
float: right;
|
|
line-height: 22px;
|
|
display: table-column;
|
|
text-align: right;
|
|
background: rgba(0, 161, 11,0.7);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.7) 0%, rgba(3,159,11,0.7) 99%, rgba(0,161,11,0.7) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.cactiTableButton.debug {
|
|
background: transparent;
|
|
float: right;
|
|
padding: 0px;
|
|
padding-bottom: 3px;
|
|
margin-right: -5px;
|
|
}
|
|
|
|
.cactiTableButton span, .cactiTableTitle span {
|
|
color: white;
|
|
padding: 0px;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.cactiTableButton i {
|
|
padding: 0px 8px;
|
|
}
|
|
|
|
.cactiTableButton span:last-child, .cactiTableTitle span:last-child {
|
|
padding: 0px 5px;
|
|
}
|
|
|
|
.cactiDebugTable {
|
|
width: 100%;
|
|
}
|
|
|
|
.filterTable {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.filterTable td:first-child {
|
|
width: 55px;
|
|
min-width: 55px;
|
|
}
|
|
|
|
.filterTable td {
|
|
padding: 2px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.filterTable td label {
|
|
vertical-align: 10%;
|
|
}
|
|
|
|
.filterTable .filterRow {
|
|
display: table-row;
|
|
}
|
|
|
|
.filterTable .filterColumn {
|
|
display: table-cell;
|
|
padding: 5px 0px 5px 5px;
|
|
text-align: left;
|
|
}
|
|
|
|
.filterTable .filterColumn label {
|
|
vertical-align: -10%;
|
|
}
|
|
|
|
.filterTable .filterColumnButton {
|
|
display: table-cell;
|
|
padding: 5px 0px 5px 5px;
|
|
text-align: left;
|
|
}
|
|
|
|
.filterTable .filterColumn:first-child {
|
|
width: 55px;
|
|
}
|
|
|
|
/* Modern page filter dialog skin (page_filter_format = modern), scoped to the
|
|
cactiFilterDialog widget so other dialogs are unaffected. */
|
|
.cactiFilterModernBar .barSep {
|
|
display: inline-block;
|
|
width: 1px;
|
|
height: 20px;
|
|
margin: 0 6px;
|
|
background-color: rgba(128, 128, 128, 0.45);
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog {
|
|
padding: 0;
|
|
border-radius: 6px;
|
|
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
|
|
overflow: hidden;
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog .ui-dialog-titlebar {
|
|
border: 0;
|
|
border-radius: 0;
|
|
padding: 10px 14px;
|
|
background: #b3007d;
|
|
color: #ffffff;
|
|
font-size: 14px;
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog .ui-dialog-title {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog .ui-dialog-titlebar .ui-dialog-titlebar-close {
|
|
background: transparent;
|
|
border: 0;
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog .ui-dialog-titlebar-close .ui-icon {
|
|
filter: invert(1) brightness(2);
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog .ui-dialog-content {
|
|
padding: 14px 16px;
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog .cactiFilterEditTable {
|
|
white-space: normal;
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog .cactiFilterEditRow .filterColumn:first-child {
|
|
min-width: 120px;
|
|
padding-right: 12px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog .cactiFilterEditRow .filterColumn:last-child select,
|
|
.ui-dialog.cactiFilterDialog .cactiFilterEditRow .filterColumn:last-child input[type="text"] {
|
|
min-width: 220px;
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog .ui-dialog-buttonpane {
|
|
margin: 0;
|
|
border-top: 1px solid rgba(0, 0, 0, 0.12);
|
|
padding: 8px 12px;
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog .ui-dialog-buttonpane .ui-button {
|
|
margin: 0 0 0 6px;
|
|
padding: 5px 14px;
|
|
}
|
|
|
|
.ui-dialog.cactiFilterDialog .ui-dialog-buttonpane .ui-button:first-child {
|
|
background: #b3007d;
|
|
color: #ffffff;
|
|
border-color: rgba(0, 0, 0, 0.25);
|
|
}
|
|
|
|
.settingsFilter {
|
|
display: table;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.settingsFilter div {
|
|
display: table-cell;
|
|
padding: 5px 0px 5px 5px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.pingRow {
|
|
padding-left: 5px;
|
|
min-height: 50px;
|
|
vertical-align: text-top;
|
|
display: table-cell;
|
|
margin: 0px;
|
|
}
|
|
|
|
.formRow {
|
|
display: table;
|
|
width: 100%;
|
|
line-height: 30px;
|
|
}
|
|
|
|
.formColumn {
|
|
float: left;
|
|
display: table-column;
|
|
text-align: left;
|
|
}
|
|
|
|
.formColumnLeft {
|
|
float: left;
|
|
display: table-column;
|
|
width: 45%;
|
|
text-align: left;
|
|
}
|
|
|
|
.formColumnRight {
|
|
float: left;
|
|
display: table-column;
|
|
width: 45%;
|
|
text-align: left;
|
|
}
|
|
|
|
.formData {
|
|
display: inline-block;
|
|
float: left;
|
|
text-align: left;
|
|
}
|
|
|
|
.confirm_actions .formColumnLeft {
|
|
min-width: 10%;
|
|
max-width: 45%;
|
|
width: initial;
|
|
display: table-cell;
|
|
float: initial;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.confirm_actions .formColumnRight {
|
|
display: table-cell;
|
|
float: initial;
|
|
}
|
|
|
|
.confirm_actions label {
|
|
white-space: wrap;
|
|
}
|
|
|
|
.formRadio {
|
|
line-height: 22px;
|
|
}
|
|
|
|
.formSubCheckbox {
|
|
line-height: 20px;
|
|
height: 20px;
|
|
float: left;
|
|
}
|
|
|
|
.formSubCheckbox input {
|
|
margin: 0px;
|
|
vertical-align: -10%;
|
|
}
|
|
|
|
.formSubCheckbox label {
|
|
}
|
|
|
|
.formCheckbox {
|
|
vertical-align: -15%;
|
|
}
|
|
|
|
.formFieldName {
|
|
display: inline-block;
|
|
color: #000000;
|
|
float: left;
|
|
text-align: left;
|
|
font-weight: bold;
|
|
padding-left: 3px;
|
|
}
|
|
|
|
.formFieldDescription {
|
|
float: left;
|
|
text-align: left;
|
|
font-weight: normal;
|
|
line-height: 14px;
|
|
}
|
|
|
|
.formTooltip {
|
|
display: inline-block;
|
|
padding-left: 4px;
|
|
}
|
|
|
|
.formHeader {
|
|
float: left;
|
|
width: 100%;
|
|
text-align: left;
|
|
line-height: 25px;
|
|
background: rgba(0, 161, 11,0.7);
|
|
background: -moz-linear-gradient(left, rgba(255,4,0,0.7) 0%, rgba(3,159,11,0.7) 99%, rgba(0,161,11,0.7) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(left, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to right, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
color: white;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.formHeaderText {
|
|
padding-left: 3px;
|
|
}
|
|
|
|
.formHeaderAnchor {
|
|
float: right;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
.formConfirmRadio {
|
|
width: 10px;
|
|
}
|
|
|
|
.formConfirmRow {
|
|
margin: 3px;
|
|
}
|
|
|
|
.formConfirmRow td {
|
|
padding: 3px 8px;
|
|
}
|
|
|
|
.formConfirmRow td:first-child {
|
|
width: 1%;
|
|
}
|
|
|
|
.hostInfoHeader {
|
|
width: 100%;
|
|
}
|
|
|
|
.queryAdd, .templateAdd {
|
|
padding: 3px;
|
|
}
|
|
|
|
@media screen and (max-width: 640px) {
|
|
.formRow {
|
|
display: table;
|
|
width: 100%;
|
|
line-height: 35px;
|
|
}
|
|
|
|
.formColumn {
|
|
float: left;
|
|
display: table-row;
|
|
color: #000000;
|
|
}
|
|
|
|
.formColumnLeft {
|
|
float: left;
|
|
display: table-row;
|
|
width: 90%;
|
|
color: #000000;
|
|
text-align: left;
|
|
}
|
|
|
|
.formColumnRight {
|
|
float: left;
|
|
display: table-row;
|
|
width: 100%;
|
|
color: #000000;
|
|
text-align: left;
|
|
}
|
|
|
|
.formFieldName {
|
|
color: #000000;
|
|
float: left;
|
|
text-align: left;
|
|
white-space: nowrap;
|
|
padding-left: 3px;
|
|
}
|
|
|
|
.formData {
|
|
float: left;
|
|
}
|
|
|
|
.hostInfoHeader {
|
|
overflow: hidden;
|
|
}
|
|
|
|
.queryAdd, .templateAdd, .navBar, #ping_results {
|
|
display: none;
|
|
}
|
|
|
|
.ui-button-text-only .ui-button-text {
|
|
padding: 0.4em;
|
|
}
|
|
}
|
|
|
|
.graphItem {
|
|
background-color: #D5D5D5;
|
|
}
|
|
|
|
.graphItemAlternate {
|
|
background-color: #D2D6E7;
|
|
}
|
|
|
|
.break {
|
|
height: 4px;
|
|
}
|
|
|
|
.next {
|
|
padding-right: 6px;
|
|
padding-left: 6px;
|
|
}
|
|
|
|
.previous {
|
|
padding-right: 6px;
|
|
padding-left: 6px;
|
|
}
|
|
|
|
.cactiNavBarTop {
|
|
border-bottom: 1px solid rgba(0, 161, 11,0.5);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.5) 0%, rgba(3,159,11,0.5) 99%, rgba(0,161,11,0.5) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.5) 0%,rgba(3,159,11,0.5) 99%,rgba(0,161,11,0.5) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.5) 0%,rgba(3,159,11,0.5) 99%,rgba(0,161,11,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
.cactiNavBarBottom {
|
|
background-color: #00438c;
|
|
}
|
|
|
|
.tableHeader {
|
|
display: table-row;
|
|
color: white;
|
|
background: rgba(246,166,134,0.55);
|
|
}
|
|
|
|
th.sortable {
|
|
cursor: pointer;
|
|
line-height: 10px;
|
|
}
|
|
|
|
.tableHeader th {
|
|
color: white;
|
|
cursor: pointer;
|
|
vertical-align: middle;
|
|
text-align: left;
|
|
font-size: 11px;
|
|
font-weight: bold;
|
|
padding: 2px;
|
|
}
|
|
|
|
.tableHeader th div {
|
|
display: block;
|
|
padding-right: 0px;
|
|
font-size: 11px;
|
|
}
|
|
|
|
.tableHeaderColumnSelected {
|
|
background: rgba(246,166,134,1);
|
|
}
|
|
|
|
.tableHeaderColumnHover {
|
|
background: rgba(0, 161, 11,0.4);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.4) 0%, rgba(3,159,11,0.4) 99%, rgba(0,161,11,0.4) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.4) 0%,rgba(3,159,11,0.4) 99%,rgba(0,161,11,0.4) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.4) 0%,rgba(3,159,11,0.4) 99%,rgba(0,161,11,0.4) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
.tableSubHeaderColumn, .tableSubHeaderColumnCenter, .tableSubHeaderColumnRight {
|
|
font-weight: bold;
|
|
vertical-align: middle;
|
|
text-align: left;
|
|
cursor: pointer;
|
|
padding: 3px;
|
|
}
|
|
|
|
.tableSubHeaderColumnCenter {
|
|
text-align: center;
|
|
}
|
|
|
|
.tableSubHeaderColumnRight {
|
|
text-align: right;
|
|
}
|
|
|
|
.graphSubHeaderColumn {
|
|
color: white;
|
|
font-size: 12px;
|
|
vertical-align: middle;
|
|
text-align: left;
|
|
padding: 3px;
|
|
}
|
|
|
|
.tableSubHeaderCheckbox {
|
|
max-width: 20px;
|
|
width: 20px;
|
|
background: #a275A2;
|
|
}
|
|
|
|
.tableHeaderGraph {
|
|
line-height: 22px;
|
|
vertical-align: top;
|
|
color: #101010;
|
|
background: rgba(246,166,134,0.55);
|
|
}
|
|
|
|
.tableHeaderGraph span {
|
|
padding: 3px;
|
|
vertical-align: top;
|
|
}
|
|
|
|
.tableRow td {
|
|
line-height: 25px !important;
|
|
}
|
|
|
|
.image_table {
|
|
width: 100%;
|
|
}
|
|
|
|
.tableConfirmation {
|
|
width: 100%;
|
|
text-align: center;
|
|
background-color: #f5f5f5;
|
|
border: 1px solid #aaaaaa;
|
|
}
|
|
|
|
.navBar {
|
|
min-width: 30%;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.navBarNavigation {
|
|
display: table;
|
|
color: rgba(0, 161, 11,0.9);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.9) 0%, rgba(3,159,11,0.9) 99%, rgba(0,161,11,0.9) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.9) 0%,rgba(3,159,11,0.9) 99%,rgba(0,161,11,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.9) 0%,rgba(3,159,11,0.9) 99%,rgba(0,161,11,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
width: 100%;
|
|
text-align: center;
|
|
height: 20px;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.navBarNavigationPrevious {
|
|
text-align: left;
|
|
white-space: nowrap;
|
|
display: table-cell;
|
|
width: 10%;
|
|
height: 20px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.navBarNavigationCenter {
|
|
text-align: center;
|
|
display: table-cell;
|
|
white-space: nowrap;
|
|
width: 80%;
|
|
height: 20px;
|
|
margin-top: auto;
|
|
vertical-align: middle;
|
|
color: #101010;
|
|
}
|
|
|
|
.navBarNavigationCenter span {
|
|
vertical-align: middle;
|
|
display: table-cell;
|
|
}
|
|
|
|
.navBarNavigationNext {
|
|
text-align: right;
|
|
white-space: nowrap;
|
|
display: table-cell;
|
|
width: 10%;
|
|
padding: 2px 0px;
|
|
height: 20px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.navBarNavigationNone {
|
|
text-align: center;
|
|
display: table-cell;
|
|
white-space: nowrap;
|
|
width: 100%;
|
|
height: 20px;
|
|
margin-top: auto;
|
|
}
|
|
|
|
.navBarNavigationNext i.ui-icon {
|
|
margin-top: -16px;
|
|
margin-right: -16px;
|
|
top: 50%;
|
|
}
|
|
|
|
.navBarNavigationPrevious i.ui-icon {
|
|
margin-bottom: -16px;
|
|
margin-left: -16px;
|
|
top: 50%;
|
|
}
|
|
|
|
.textArea {
|
|
font-size: 12px;
|
|
background-color: #f5f5f5;
|
|
}
|
|
|
|
.textArea a {
|
|
font-size: 1.1em;
|
|
}
|
|
|
|
.popupBox {
|
|
#z-index: 2;
|
|
position: absolute;
|
|
padding: 0px;
|
|
display: none;
|
|
overflow: auto;
|
|
color: white;
|
|
background-color: #e5e5e5;
|
|
border: 1px solid #e5e5e5;
|
|
}
|
|
|
|
.installArea {
|
|
background-color: white;
|
|
padding: 10px;
|
|
}
|
|
|
|
.textAreaNotes {
|
|
font-size: 12px;
|
|
font-family: Verdana, Arial, Helvetica, sans-serif;
|
|
}
|
|
|
|
.textEditTitle {
|
|
font-weight: bold;
|
|
}
|
|
|
|
.textMenuHeader {
|
|
color: white;
|
|
background-color: #9C9C9C;
|
|
font-family: Verdana, Arial, Helvetica, sans-serif;
|
|
font-size: 10px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.textMenuItem {
|
|
background-color: #efefef;
|
|
font-family: Verdana, Arial, Helvetica, sans-serif;
|
|
font-size: 10px;
|
|
}
|
|
|
|
.textMenuSubItem {
|
|
background-color: white;
|
|
font-family: Verdana, Arial, Helvetica, sans-serif;
|
|
font-size: 10px;
|
|
}
|
|
|
|
.textMenuItemSelected {
|
|
background-color: #E1E1E1;
|
|
font-family: Verdana, Arial, Helvetica, sans-serif;
|
|
font-size: 10px;
|
|
}
|
|
|
|
.txtErrorTextBox {
|
|
border: 2px solid #ff0000 !important;
|
|
}
|
|
|
|
.txtErrorText {
|
|
color: #FF0000;
|
|
font-size: 12px;
|
|
font-weight: bold;
|
|
}
|
|
|
|
/* tabs */
|
|
.tabSpacer {
|
|
width: 0px;
|
|
padding-right: 2px;
|
|
padding-left: 0px;
|
|
}
|
|
|
|
.tabsMarginLeft {
|
|
padding-left: 2px;
|
|
}
|
|
|
|
.tabSelected {
|
|
background-color: silver;
|
|
white-space: nowrap;
|
|
width: 1%;
|
|
}
|
|
|
|
.tabNotSelected {
|
|
background-color: #dfdfdf;
|
|
white-space: nowrap;
|
|
width: 1%;
|
|
}
|
|
|
|
.subTab a {
|
|
height: 14px;
|
|
border-bottom: 1px solid #555 !important;
|
|
}
|
|
|
|
.deleteMarker {
|
|
color: rgba(0, 161, 11,0.6);
|
|
vertical-align: middle;
|
|
text-decoration: none !important;
|
|
display: inline-block !important;
|
|
width: 14.75px !important;
|
|
}
|
|
|
|
.deleteMarker:hover {
|
|
text-decoration: none !important;
|
|
}
|
|
|
|
.deleteMarkerDisabled {
|
|
color: rgba(0, 161, 11,0.6);
|
|
vertical-align: middle;
|
|
text-decoration: none !important;
|
|
display: inline-block !important;
|
|
width: 14.75px !important;
|
|
}
|
|
|
|
.deleteMarkerDisabled:hover {
|
|
text-decoration: none !important;
|
|
}
|
|
|
|
.moveArrow {
|
|
color: #00438C !important;
|
|
height: 14px !important;
|
|
font-size: 14px !important;
|
|
display: inline-block !important;
|
|
width: 14.75px !important;
|
|
vertical-align: middle;
|
|
text-decoration: none !important;
|
|
}
|
|
|
|
.moveArrow:hover {
|
|
text-decoration: none !important;
|
|
}
|
|
|
|
.moveArrowNone {
|
|
display: inline-block !important;
|
|
width: 14.75px !important;
|
|
}
|
|
|
|
.action, .shiftArrow, .calendar {
|
|
cursor: pointer;
|
|
padding: 2px;
|
|
}
|
|
|
|
td.tab {
|
|
border-top: 1px solid #999;
|
|
border-right: 1px solid #666;
|
|
border-left: 1px solid #999;
|
|
padding-left: 3px;
|
|
padding-right: 3px;
|
|
min-width: 0%;
|
|
border-bottom: none;
|
|
border-top-left-radius: 4px;
|
|
border-top-right-radius: 4px;
|
|
-moz-border-radius-topright: 4px;
|
|
-moz-border-radius-topleft: 4px;
|
|
}
|
|
|
|
.cactiGraphHeaderBackground {
|
|
display: none;
|
|
}
|
|
|
|
div#gtabs {
|
|
padding-bottom: 0px;
|
|
vertical-align: bottom;
|
|
display: none !important;
|
|
position: fixed;
|
|
right: 5px;
|
|
top: 5px;
|
|
height: 30px;
|
|
}
|
|
|
|
.ellipsis {
|
|
width: 25px !important;
|
|
display: none;
|
|
}
|
|
|
|
.usertabs {
|
|
float: right !important;
|
|
}
|
|
|
|
.maintabs {
|
|
line-height: 35px;
|
|
float: left;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.maintabs a.lefttab, .usertabs a {
|
|
color: #fff;
|
|
float: left !important;
|
|
padding: 5px 8px;
|
|
text-decoration: none;
|
|
font-size: 18px;
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
.maintabs a:hover {
|
|
background-color: rgba(255,255,255,0.3);
|
|
}
|
|
|
|
.maintabs a.selected {
|
|
color: white;
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.1) 0%, rgba(3,159,11,0.1) 99%, rgba(0,161,11,0.1) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.1) 0%,rgba(3,159,11,0.3) 99%,rgba(0,161,11,0.1) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.1) 0%,rgba(3,159,11,0.1) 99%,rgba(0,161,11,0.1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
.maintabs a:active {
|
|
font-size: 18px;
|
|
}
|
|
|
|
.maintabs nav {
|
|
display: block;
|
|
}
|
|
|
|
.maintabs li {
|
|
bottom: -1px;
|
|
float: left;
|
|
}
|
|
|
|
.maintabs-submenu {
|
|
display: none;
|
|
}
|
|
|
|
#menu-tab-graphs.maintabs-submenu, .maintabs-submenu-ellipsis a {
|
|
padding: 5px 5px 5px 0px;
|
|
color: #fff;
|
|
float: left !important;
|
|
text-decoration: none;
|
|
font-size: 18px;
|
|
vertical-align: bottom;
|
|
display: block;
|
|
}
|
|
|
|
.maintabs-submenu i, .maintabs-submenu-ellipsis i {
|
|
color: #fff;
|
|
padding-left: 2px;
|
|
font-size: 18px;
|
|
border-left: 1px solid #ccc;
|
|
}
|
|
|
|
div.submenu {
|
|
display: none;
|
|
position: absolute;
|
|
border: 2px solid #2d4ca8;
|
|
top: 0;
|
|
left: 0;
|
|
z-index: 200;
|
|
}
|
|
|
|
div.submenu span {
|
|
display: block;
|
|
}
|
|
|
|
.tabs a {
|
|
background-color: #ddd;
|
|
background-image: -moz-linear-gradient(#f0f0f0,#ddd);
|
|
background-image: -ms-linear-gradient(#f0f0f0,#ddd);
|
|
background-image: -webkit-linear-gradient(#f0f0f0,#ddd);
|
|
background-image: linear-gradient(#f0f0f0,#ddd);
|
|
background-repeat: repeat-x;
|
|
border: 1px solid #555;
|
|
border-color: #eee #ccc #ccc #eee;
|
|
color: #333;
|
|
float: left !important;
|
|
padding: 5px 8px;
|
|
text-decoration: none;
|
|
font-size: 11px;
|
|
vertical-align: bottom;
|
|
}
|
|
|
|
.tabs a:hover {
|
|
background-color: #ddd;
|
|
background-image: -moz-linear-gradient(#e0e0e0,#ccc);
|
|
background-image: -ms-linear-gradient(#e0e0e0,#ccc);
|
|
background-image: -webkit-linear-gradient(#e0e0e0,#ccc);
|
|
background-image: linear-gradient(#e0e0e0,#ccc);
|
|
background-repeat: repeat-x;
|
|
}
|
|
|
|
.tabs nav a.selected {
|
|
color: white;
|
|
border-bottom: 1px solid rgba(162,117,162,0.8);
|
|
background: rgba(162,117,162,0.8);
|
|
}
|
|
|
|
.tabs li {
|
|
bottom: -1px;
|
|
float: left;
|
|
margin: 0 3px 0 0;
|
|
position: relative;
|
|
}
|
|
|
|
.tabs li.current a, .maintabs li.current a {
|
|
background: #fff;
|
|
border-bottom: 1px solid #fff;
|
|
}
|
|
|
|
.tabs li.current a:hover, .maintabs li.current a:hover {
|
|
background: #fff;
|
|
border-bottom: 1px solid #fff;
|
|
}
|
|
|
|
.tabs nav {
|
|
border-bottom: 1px solid #ccc;
|
|
}
|
|
|
|
.tabs nav:after, .maintabs nav:after {
|
|
clear: both;
|
|
content: ".";
|
|
display: block;
|
|
height: 0;
|
|
visibility: hidden;
|
|
}
|
|
|
|
.tabs ul, .maintabs ul {
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
tr td:last-child .checkbox {
|
|
margin-right: 10px !important;
|
|
}
|
|
|
|
tr th:last-child .checkbox {
|
|
margin-right: 10px !important;
|
|
}
|
|
|
|
/* Navigation Area */
|
|
#nav {
|
|
float: left;
|
|
border-top: 0px solid #999;
|
|
border-right: 0px solid #999;
|
|
border-left: 0px solid #999;
|
|
font-size: 12px;
|
|
margin: 0px 0;
|
|
}
|
|
|
|
#nav li a {
|
|
display: block;
|
|
padding: 2px 4px 2px 5px;
|
|
background: #ccc;
|
|
color: rgba(0, 161, 11,0.9);
|
|
text-decoration: none;
|
|
}
|
|
|
|
#nav li a.active {
|
|
font-weight: 600;
|
|
font-size: 14px;
|
|
background: #f0f0f0;
|
|
color: rgba(79, 0, 79, 1);
|
|
}
|
|
|
|
th {
|
|
border-right: 1px groove #eee;
|
|
}
|
|
|
|
th:last-child {
|
|
border-right: none !important;
|
|
}
|
|
|
|
tr.selected {
|
|
color: white;
|
|
background: rgba(0, 161, 11,1);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,1) 0%, rgba(3,159,11,1) 99%, rgba(0,161,11,1) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,1) 0%,rgba(3,159,11,1) 99%,rgba(0,161,11,1) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,1) 0%,rgba(3,159,11,1) 99%,rgba(0,161,11,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
tr.selected a.linkEditMain:visited {
|
|
color: yellow;
|
|
}
|
|
|
|
tr:not(.selectable) a.linkEditMain:hover {
|
|
color: #2d4ca8;
|
|
}
|
|
|
|
tr.selectable a.linkEditMain:hover {
|
|
color: yellow;
|
|
}
|
|
|
|
tr.selectable:hover:not(.selected) {
|
|
background: rgba(0, 161, 11,0.3);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.3) 0%, rgba(3,159,11,0.3) 99%, rgba(0,161,11,0.3) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.3) 0%,rgba(3,159,11,0.3) 99%,rgba(0,161,11,0.3) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.3) 0%,rgba(3,159,11,0.3) 99%,rgba(0,161,11,0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
tr.selectable td {
|
|
height: 25px;
|
|
}
|
|
|
|
tr.selected a {
|
|
color: yellow;
|
|
}
|
|
|
|
#nav li a.pic:hover:not(.selected), #nav li a.menu_parent:hover:not(.selected) {
|
|
color: rgba(79, 0, 79, 1);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.3) 0%, rgba(3,159,11,0.3) 99%, rgba(0,161,11,0.3) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.3) 0%,rgba(3,159,11,0.3) 99%,rgba(0,161,11,0.3) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.3) 0%,rgba(3,159,11,0.3) 99%,rgba(0,161,11,0.3) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
#nav li a.selected {
|
|
color: white;
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.7) 0%, rgba(3,159,11,0.7) 99%, rgba(0,161,11,0.7) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.7) 0%,rgba(3,159,11,0.7) 99%,rgba(0,161,11,0.7) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
#nav li ul {
|
|
display: none;
|
|
padding: 0;
|
|
}
|
|
|
|
#nav li ul li a {
|
|
padding: 2px 4px 2px 32px;
|
|
background: #f0f0f0;
|
|
}
|
|
|
|
#nav li ul li {
|
|
list-style: none;
|
|
padding: 0;
|
|
}
|
|
|
|
ul#nav {
|
|
list-style: none;
|
|
padding: 0;
|
|
width: 100%;
|
|
}
|
|
|
|
.clogError {
|
|
background-color: #FF3932;
|
|
}
|
|
|
|
.clogWarning {
|
|
background-color: #EACC00;
|
|
}
|
|
|
|
.clogSQL {
|
|
background-color: #6DC8FE;
|
|
}
|
|
|
|
.clogDebug {
|
|
background-color: #C4FD3D;
|
|
}
|
|
|
|
.clogStats {
|
|
background-color: #96E78A;
|
|
}
|
|
|
|
.clogLimit {
|
|
background-color: #EACC00;
|
|
}
|
|
|
|
.clogStats td, .clogDebug td, .clogSQL td, .clogWarning td, .clogError td, .clogLimit td {
|
|
padding: 3px;
|
|
}
|
|
|
|
@media print {
|
|
.noprint {
|
|
display: none;
|
|
}
|
|
}
|
|
|
|
.ui-tooltip {
|
|
max-width: none !important;
|
|
}
|
|
|
|
.ui-tooltip-content div.header {
|
|
color: #3f75a2;
|
|
}
|
|
|
|
.ui-tooltip-content div.content {
|
|
font-size: 10px;
|
|
color: #333333;
|
|
}
|
|
|
|
.ui-tooltip-content {
|
|
max-width: 500px !important;
|
|
overflow: auto !important;
|
|
opacity: 0.95;
|
|
border-radius: 5px !important;
|
|
border: transparent;
|
|
}
|
|
|
|
.ui-selectmenu-search input {
|
|
width: 100%;
|
|
}
|
|
|
|
div.preformatted {
|
|
font-family: monospace;
|
|
white-space: pre;
|
|
}
|
|
|
|
ul.pagination {
|
|
display: inline-block;
|
|
padding: 0;
|
|
margin: 0;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
ul.pagination li {
|
|
display: inline;
|
|
}
|
|
|
|
ul.pagination li a {
|
|
float: left;
|
|
padding: 0px 2px 2px 2px;
|
|
text-decoration: none;
|
|
margin: 0px 1px;
|
|
vertical-align: -40%;
|
|
}
|
|
|
|
ul.pagination li span {
|
|
float: left;
|
|
padding: 0px 0px;
|
|
text-decoration: none;
|
|
margin: 0px 1px;
|
|
}
|
|
|
|
ul.pagination li a.active {
|
|
background: #000000; /*rgba(246,166,134,1);*/
|
|
color: white;
|
|
}
|
|
|
|
ul.pagination li a:hover:not(.active) {
|
|
background: #f0f0f0;
|
|
}
|
|
|
|
tr#realtime td:first-child {
|
|
height: 68px;
|
|
}
|
|
|
|
.logEmergency {
|
|
background-color: rgba(250, 116, 32, 0.2);
|
|
text-align: center;
|
|
width: 12.5%;
|
|
color: black;
|
|
}
|
|
|
|
.logCritical {
|
|
background-color: rgba(242, 23, 33, 0.2);
|
|
text-align: center;
|
|
width: 12.5%;
|
|
color: black;
|
|
}
|
|
|
|
.logAlert {
|
|
background-color: rgba(242, 25, 36, 0.2);
|
|
text-align: center;
|
|
width: 12.5%;
|
|
color: black;
|
|
}
|
|
|
|
.logWarning {
|
|
background-color: rgba(255, 122, 48, 0.2);
|
|
text-align: center;
|
|
width: 12.5%;
|
|
color: black;
|
|
}
|
|
|
|
.logError {
|
|
background-color: rgba(251, 74, 20, 0.2);
|
|
text-align: center;
|
|
width: 12.5%;
|
|
color: black;
|
|
}
|
|
|
|
.logNotice {
|
|
background-color: rgba(250, 253, 158, 0.2);
|
|
text-align: center;
|
|
width: 12.5%;
|
|
color: black;
|
|
}
|
|
|
|
.logInfo {
|
|
background-color: rgba(204, 255, 204, 0.2);
|
|
text-align: center;
|
|
width: 12.5%;
|
|
color: black;
|
|
}
|
|
|
|
.logDebug {
|
|
background-color: rgba(205, 207, 196, 0.2);
|
|
text-align: center;
|
|
width: 12.5%;
|
|
color: black;
|
|
}
|
|
|
|
.darkblue {
|
|
background: #2d4ca8;
|
|
}
|
|
|
|
.ui-corner-all {
|
|
border-radius: 0px !important;
|
|
-moz-border-radius-bottomright: 0px !important;
|
|
-moz-border-radius-bottomleft: 0px !important;
|
|
-moz-border-radius-topright: 0px !important;
|
|
-moz-border-radius-topleft: 0px !important;
|
|
}
|
|
|
|
#graph_view_tree_content2_child > tbody > .tableHeader {
|
|
background: rgba(246,166,134,0.9);
|
|
}
|
|
|
|
.menuitem {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.menu_glyph {
|
|
font-size: 18px !important;
|
|
vertical-align: middle;
|
|
text-align: left;
|
|
width: 22px;
|
|
padding-right: 0px !important;
|
|
display: inline-block;
|
|
}
|
|
|
|
.menuitem span {
|
|
}
|
|
|
|
.ui-autocomplete {
|
|
height: 300px;
|
|
overflow-y: scroll;
|
|
overflow-x: hidden;
|
|
}
|
|
|
|
.ui-select-text input {
|
|
width: 180px;
|
|
margin: 0;
|
|
padding: 0;
|
|
background: transparent;
|
|
}
|
|
|
|
.ui-multiselect {
|
|
padding: 0.4em 1em;
|
|
text-align: left;
|
|
line-height: initial;
|
|
}
|
|
|
|
.ui-multiselect .ui-icon {
|
|
margin-top: 0px;
|
|
}
|
|
|
|
.ui-widget {
|
|
font-size: unset;
|
|
}
|
|
|
|
.ui-checkboxradio-icon {
|
|
display: none;
|
|
}
|
|
|
|
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover {
|
|
color: white;
|
|
background: rgba(0, 161, 11,0.9);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.9) 0%, rgba(3,159,11,0.9) 99%, rgba(0,161,11,0.9) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.9) 0%,rgba(3,159,11,0.9) 99%,rgba(0,161,11,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.9) 0%,rgba(3,159,11,0.9) 99%,rgba(0,161,11,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
/* New Checkbox Stuff */
|
|
.checkboxSwitch {
|
|
position: relative;
|
|
display: inline-block;
|
|
width: 45px;
|
|
height: 24px;
|
|
margin-left: 5px;
|
|
margin-right: 5px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.checkboxSwitch input {
|
|
display: none;
|
|
}
|
|
|
|
.checkboxSlider {
|
|
position: absolute;
|
|
cursor: pointer;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background-color: rgba(255, 157, 0, 0.25);
|
|
-webkit-transition: .4s;
|
|
transition: .4s;
|
|
}
|
|
|
|
.checkboxSlider:before {
|
|
position: absolute;
|
|
content: "";
|
|
height: 16px;
|
|
width: 16px;
|
|
left: 4px;
|
|
bottom: 4px;
|
|
background-color: white;
|
|
background-image: url('./images/cacti_logo.svg');
|
|
background-repeat: no-repeat;
|
|
background-size: 7px;
|
|
background-position: center;
|
|
-webkit-transition: .4s;
|
|
transition: .4s;
|
|
}
|
|
|
|
input:checked + .checkboxSlider {
|
|
background-color: rgba(255, 157, 0,0.9);
|
|
}
|
|
|
|
input:disabled + .checkboxSlider {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
input:focus + .checkboxSlider {
|
|
box-shadow: 0 0 1px #2196F3;
|
|
}
|
|
|
|
input:checked + .checkboxSlider:before {
|
|
-webkit-transform: translateX(20px);
|
|
-ms-transform: translateX(20px);
|
|
transform: translateX(20px);
|
|
}
|
|
|
|
/* Rounded.checkboxSliders */
|
|
.checkboxSlider.checkboxRound {
|
|
border-radius: 24px;
|
|
}
|
|
|
|
.checkboxSlider.checkboxRound:before {
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.checkboxLabelWanted {
|
|
display: inline-block;
|
|
margin-left: 5px;
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.right {
|
|
text-align: right;
|
|
}
|
|
|
|
.radioSwitch {
|
|
position: relative;
|
|
display: inline-block;
|
|
margin-left: 5px;
|
|
margin-right: 5px;
|
|
height: 24px;
|
|
width: 24px;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.radioSwitch input {
|
|
display: none;
|
|
}
|
|
|
|
.radioSlider {
|
|
position: absolute;
|
|
cursor: pointer;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
height: 24px;
|
|
width: 24px;
|
|
background-color: rgba(230, 89, 58, 0.55);
|
|
-webkit-transition: .4s;
|
|
transition: .4s;
|
|
}
|
|
|
|
.radioSlider:before {
|
|
display: none;
|
|
position: absolute;
|
|
content: "";
|
|
height: 16px;
|
|
width: 16px;
|
|
left: 4px;
|
|
bottom: 4px;
|
|
background-color: white;
|
|
background-image: url('./images/cacti_logo.svg');
|
|
background-repeat: no-repeat;
|
|
background-size: 7px;
|
|
background-position: center;
|
|
-webkit-transition: .4s;
|
|
transition: .4s;
|
|
}
|
|
|
|
input:checked + .radioSlider {
|
|
background-color: rgba(0, 161, 11,0.9);
|
|
background: -moz-linear-gradient(top, rgba(255,4,0,0.9) 0%, rgba(3,159,11,0.9) 99%, rgba(0,161,11,0.9) 100%); /* FF3.6-15 */
|
|
background: -webkit-linear-gradient(top, rgba(255,4,0,0.9) 0%,rgba(3,159,11,0.9) 99%,rgba(0,161,11,0.9) 100%); /* Chrome10-25,Safari5.1-6 */
|
|
background: linear-gradient(to bottom, rgba(255,4,0,0.9) 0%,rgba(3,159,11,0.9) 99%,rgba(0,161,11,0.9) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
|
|
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e6ff0400', endColorstr='#e600a10b',GradientType=0 ); /* IE6-9 */
|
|
}
|
|
|
|
input:disabled + .radioSlider {
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
input:focus + .radioSlider {
|
|
box-shadow: 0 0 1px #2196F3;
|
|
}
|
|
|
|
input:checked + .radioSlider:before {
|
|
display: block;
|
|
}
|
|
|
|
/* Rounded.radioSliders */
|
|
.radioSlider.radioRound {
|
|
border-radius: 24px;
|
|
}
|
|
|
|
.radioSlider.radioRound:before {
|
|
border-radius: 50%;
|
|
}
|
|
|
|
.radioLabelWanted {
|
|
display: inline-block;
|
|
margin-left: 5px;
|
|
margin-right: 10px;
|
|
vertical-align: middle;
|
|
line-height: 20px;
|
|
}
|
|
|
|
td.center > table {
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.ui-menu-item-wrapper {
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.ui-button {
|
|
padding: .4em .4em;
|
|
}
|
|
|
|
.cactiLogo {
|
|
display: none;
|
|
}
|
|
|
|
.actionHelp {
|
|
color:#00758F !important;
|
|
}
|
|
|
|
.plusAdd {
|
|
color:#CE3500 !important;
|
|
}
|
|
|
|
.actionCog {
|
|
color:#FDAC53 !important;
|
|
}
|
|
|
|
.fileCSV {
|
|
color:#9BB7D4 !important;
|
|
}
|
|
|
|
.threeBars {
|
|
color:#B55A30 !important;
|
|
}
|
|
|
|
.editServer {
|
|
color:#F5DF4D !important;
|
|
}
|
|
|
|
.editTemplate {
|
|
color:#0072B5 !important;
|
|
}
|
|
|
|
.realTime {
|
|
color:#A0DAA9 !important;
|
|
}
|
|
|
|
.spikeKill {
|
|
color:#E9897E !important;
|
|
}
|
|
|
|
.newDevice {
|
|
color:#00A170 !important;
|
|
}
|
|
|
|
.newGraph {
|
|
color:#926AA6 !important;
|
|
}
|
|
|
|
.reindexDevice {
|
|
color:#D2386C !important;
|
|
}
|
|
|
|
.enableDebug {
|
|
color:#363945 !important;
|
|
}
|
|
|
|
.disableDebug {
|
|
color:#939597 !important;
|
|
}
|
|
|
|
.repopulateCache {
|
|
color:#EFE1CE !important;
|
|
}
|
|
|
|
.viewCache {
|
|
color:#E0B589 !important;
|
|
}
|
|
|
|
.viewGraphs {
|
|
color:#9A8B4F !important;
|
|
}
|
|
|
|
.viewSources {
|
|
color:#56C6A9 !important;
|
|
}
|
|
|
|
|
|
/* Select2 - adapt to look like a native Cacti/jQuery UI control.
|
|
Select2 4.x ships no jQuery UI theme, so these overrides reuse this
|
|
theme's own jquery-ui.css/main.css colors (see .ui-widget-content /
|
|
.ui-state-hover / .ui-state-active) to match its look and feel. */
|
|
.select2-container--default .select2-selection--single,
|
|
.select2-container--default .select2-selection--multiple {
|
|
border: 1px solid #aaaaaa;
|
|
border-radius: 6px;
|
|
background: #e6e6e6 url("images/ui-bg_glass_75_e6e6e6_1x400.png") 50% 50% repeat-x;
|
|
color: #222222;
|
|
}
|
|
|
|
/* match jQuery UI's shorter button height */
|
|
.select2-container--default .select2-selection--single {
|
|
height: 24px;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--single .select2-selection__rendered {
|
|
line-height: 24px;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--single .select2-selection__arrow {
|
|
height: 22px;
|
|
}
|
|
|
|
/* match the multi-select (e.g. Templates) control to the single-select height;
|
|
flexbox centers content vertically regardless of font metrics */
|
|
.select2-container--default .select2-selection--multiple {
|
|
min-height: 24px;
|
|
padding: 0 20px 0 0;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--multiple .select2-selection__rendered {
|
|
display: block;
|
|
flex: 1;
|
|
margin: 0;
|
|
padding-left: 8px;
|
|
overflow: hidden;
|
|
line-height: 24px;
|
|
}
|
|
|
|
/* select2-multi-count always replaces the rendered area with "N Selected" text;
|
|
only hide the inline search-while-typing box while closed (it doesn't fit
|
|
that display and was inflating the control's height) - let it reappear once
|
|
the dropdown opens, since that's the only place multi-selects can search from */
|
|
select.select2-multi-count.select2-hidden-accessible + .select2-container:not(.select2-container--open) .select2-search--inline {
|
|
display: none;
|
|
}
|
|
|
|
.select2-selection--multiple .select2-count-label {
|
|
display: block;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
/* once open, let the search box sit on its own row below the current
|
|
selection instead of overlapping it */
|
|
.select2-container--default .select2-selection--multiple .select2-search--inline {
|
|
display: block;
|
|
width: 100%;
|
|
margin: 4px 0 0;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--multiple .select2-search--inline .select2-search__field {
|
|
width: 100% !important;
|
|
box-sizing: border-box;
|
|
margin: 0 !important;
|
|
}
|
|
|
|
/* select2 doesn't draw a dropdown arrow for multi-selects by default; add one to match */
|
|
.select2-container--default .select2-selection--multiple::after {
|
|
content: '';
|
|
position: absolute;
|
|
top: 50%;
|
|
right: 8px;
|
|
margin-top: -2px;
|
|
border-color: currentColor transparent transparent transparent;
|
|
border-style: solid;
|
|
border-width: 5px 4px 0 4px;
|
|
height: 0;
|
|
width: 0;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.select2-container--default.select2-container--open .select2-selection--multiple::after {
|
|
border-color: transparent transparent currentColor transparent;
|
|
border-width: 0 4px 5px 4px;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--single .select2-selection__rendered {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.select2-results__option {
|
|
white-space: nowrap;
|
|
min-height: 24px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* keep the first 15 results visible before the list needs to scroll */
|
|
.select2-container--default .select2-results > .select2-results__options {
|
|
max-height: 360px;
|
|
}
|
|
|
|
/* checkbox-style indicator for select2-multi-count option rows */
|
|
.select2-results__option .select2-checkbox-option {
|
|
position: relative;
|
|
display: block;
|
|
padding-left: 20px;
|
|
}
|
|
|
|
.select2-results__option .select2-checkbox-option::before {
|
|
content: '';
|
|
position: absolute;
|
|
left: 0;
|
|
top: 50%;
|
|
width: 13px;
|
|
height: 13px;
|
|
margin-top: -7px;
|
|
border: 1px solid currentColor;
|
|
border-radius: 2px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
/* select2 also (re)uses aria-selected for mouse-hover/keyboard highlight
|
|
* tracking, unrelated to actual selection - key off the --selected class
|
|
* instead, which setClasses() only ever sets from the real selected data */
|
|
.select2-results__option.select2-results__option--selected .select2-checkbox-option::after {
|
|
content: '\2713';
|
|
position: absolute;
|
|
left: 2px;
|
|
top: 50%;
|
|
margin-top: -7px;
|
|
font-size: 11px;
|
|
line-height: 13px;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--single .select2-selection__rendered,
|
|
.select2-container--default .select2-selection--single .select2-selection__placeholder {
|
|
color: #222222;
|
|
}
|
|
|
|
/* select2 keeps --focus set after the dropdown closes; only --open should get the active look */
|
|
.select2-container--default.select2-container--open .select2-selection--single,
|
|
.select2-container--default.select2-container--open .select2-selection--multiple {
|
|
border-color: #999999;
|
|
background: #dadada;
|
|
color: #212121;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--single .select2-selection__arrow b {
|
|
border-top-color: #222222;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--multiple .select2-selection__choice {
|
|
background: #dadada;
|
|
border: 1px solid #aaaaaa;
|
|
color: #212121;
|
|
}
|
|
|
|
.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
|
|
color: #212121;
|
|
}
|
|
|
|
.select2-dropdown {
|
|
border: 1px solid #aaaaaa;
|
|
background: #ffffff;
|
|
color: #222222;
|
|
}
|
|
|
|
.select2-container--default .select2-search--dropdown .select2-search__field,
|
|
.select2-container--default .select2-search--inline .select2-search__field {
|
|
border: 1px solid #aaaaaa;
|
|
background: #ffffff;
|
|
color: #222222;
|
|
}
|
|
|
|
.select2-container--default .select2-results__option--selected {
|
|
background: #dadada;
|
|
color: #212121;
|
|
}
|
|
|
|
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
|
|
background: rgba(0, 161, 11,0.9);
|
|
color: white;
|
|
}
|
|
/* ======================================================================== */
|
|
/* jsTree glyph icons - node type colors, sizing, and open/close carets */
|
|
/* ======================================================================== */
|
|
|
|
/* remove the indent/connector dotted lines (also disabled via dots:false) */
|
|
.jstree-default .jstree-node { background: transparent !important; }
|
|
|
|
/* node type glyphs, centered in the 20px node row */
|
|
.jstree-default .jstree-anchor > .jstree-themeicon {
|
|
background-image: none !important;
|
|
font-size: 14px;
|
|
line-height: 20px;
|
|
text-align: center;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.jstree-default .jstree-anchor > .jstree-themeicon.ti-folder { color: #F9A825; }
|
|
.jstree-default .jstree-anchor > .jstree-themeicon.ti-sitemap { color: #546E7A; }
|
|
.jstree-default .jstree-anchor > .jstree-themeicon.ti-building { color: #00897B; }
|
|
.jstree-default .jstree-anchor > .jstree-themeicon.ti-map-pin { color: #E53935; }
|
|
.jstree-default .jstree-anchor > .jstree-themeicon.ti-server { color: #1E88E5; }
|
|
.jstree-default .jstree-anchor > .jstree-themeicon.ti-server-cog { color: #8E24AA; }
|
|
.jstree-default .jstree-anchor > .jstree-themeicon.ti-list-search { color: #0097A7; }
|
|
.jstree-default .jstree-anchor > .jstree-themeicon.ti-chart-line { color: #388E3C; }
|
|
.jstree-default .jstree-anchor > .jstree-themeicon.ti-chart-histogram { color: #F57C00; }
|
|
.jstree-default .jstree-anchor > .jstree-themeicon.ti-chart-infographic { color: #C2185B; }
|
|
|
|
/* open/close carets as glyphs, centered to match the node glyphs */
|
|
/* scoped to non-loading nodes so the AJAX loading throbber is preserved */
|
|
.jstree-default .jstree-node:not(.jstree-loading) > .jstree-ocl {
|
|
background: none !important;
|
|
font-family: "tabler-icons";
|
|
font-size: 14px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
height: 20px;
|
|
color: #78909C;
|
|
}
|
|
.jstree-default .jstree-closed:not(.jstree-loading) > .jstree-ocl::before { content: "\ea61"; }
|
|
.jstree-default .jstree-open:not(.jstree-loading) > .jstree-ocl::before { content: "\ea5f"; }
|
|
.jstree-default .jstree-leaf:not(.jstree-loading) > .jstree-ocl::before { content: ""; }
|