header h3 a { display: none !important; } :is(body[data-page="admin-status-overview"], body[data-page=""]) .cbi-title .label { width: 32px; padding: 0; font-size: 0 !important; gap: 0; } :is(body[data-page="admin-status-overview"], body[data-page=""]) .cbi-title .label::before { flex: 0 0 auto; } @media screen and (max-device-width: 600px) { .modal { margin: 1.5em auto; } .tabs, .cbi-tabmenu { background: var(--material3-card-background); border-radius: var(--material3-card-radius); margin: 1px 1px 10px; } .tabs>li, .cbi-tabmenu>li { height: 32px; } .tabs>li>a, .cbi-tabmenu>li>a { padding: 0 12px; border-radius: var(--material3-card-radius); } body[data-page^="admin-services-dockerman"] #view div[style*="grid-template-columns"][style*="minmax(300px"] { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; } body[data-page^="admin-services-dockerman"] #view a[href*="/dockerman/"]>div[style*="min-height: 120px"] { min-height: 96px !important; padding: 10px !important; } body[data-page^="admin-services-dockerman"] #view a[href*="/dockerman/"] img[src*="dockerman/"][src$=".svg"] { width: 52px !important; height: 52px !important; } body[data-page^="admin-services-dockerman"] #view a[href*="/dockerman/"] div[style*="margin-right: 15px"] { margin-right: 8px !important; } .table { display: flex; flex-direction: column; width: 100%; padding: 4px; } .tr { display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-end; padding: 5px 0; margin: 0 -3px; } .table .th, .table .td, .table .tr::before { flex: 1 1 50%; align-self: flex-start; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; display: inline-block; border-top: none; padding: 3px; box-sizing: border-box; } .table .td.cbi-dropdown-open { overflow: visible; } .col-1 { flex: 1 1 30px !important; -webkit-flex: 1 1 30px !important; } .col-2 { flex: 2 2 60px !important; -webkit-flex: 2 2 60px !important; } .col-3 { flex: 3 3 90px !important; -webkit-flex: 3 3 90px !important; } .col-4 { flex: 4 4 120px !important; -webkit-flex: 4 4 120px !important; } .col-5 { flex: 5 5 150px !important; -webkit-flex: 5 5 150px !important; } .col-6 { flex: 6 6 180px !important; -webkit-flex: 6 6 180px !important; } .col-7 { flex: 7 7 210px !important; -webkit-flex: 7 7 210px !important; } .col-8 { flex: 8 8 240px !important; -webkit-flex: 8 8 240px !important; } .col-9 { flex: 9 9 270px !important; -webkit-flex: 9 9 270px !important; } .col-10 { flex: 10 10 300px !important; -webkit-flex: 10 10 300px !important; } .td select { word-wrap: normal; } .td[data-widget="button"], .td[data-widget="fvalue"] { flex: 1 1 17%; text-align: left; } .td.cbi-value-field { align-self: flex-start; flex-basis: 100%; margin-bottom: .3em; } .td.cbi-value-field .cbi-button { width: 100%; } .table.cbi-section-table { border: none; background: none; margin: 0; } .tr.table-titles, .tr.dashboard-table-titles, .thead.dashboard-table-titles, thead.dashboard-table-titles, .cbi-section-table-titles, .cbi-section-table-descr { display: none; } .cbi-section-table-row { display: flex; flex-direction: row; flex-wrap: wrap; margin: 0 0 .5em 0; } .cbi-section-table+.cbi-section-create { padding-top: 4px; } .tr[data-title]::before { display: block; flex: 1 1 100%; background: var(--background-color-low) !important; font-size: 16px; border-bottom: 1px solid var(--border-color-medium); } .td[data-title]::before { content: attr(data-title); font-weight: bold; display: block; overflow: hidden; text-overflow: ellipsis; white-space: pre-line; } .td[data-description]::after { display: block; } .td[data-title]~.td.cbi-section-actions { align-self: flex-start; } .td.cbi-section-actions { overflow: initial; max-width: 100%; padding: 3px 2px; flex-basis: 100%; text-align: left; } .hide-sm, .hide-xs { display: none !important; } .td.cbi-value-field[data-widget="CBI.DummyValue"], .td.cbi-value-field[data-widget="CBI.Button"], .td.cbi-value-field[data-widget="CBI.FlagValue"], .td.cbi-value-field[data-widget="dvalue"], .td.cbi-value-field[data-widget="button"], .td.cbi-value-field[data-widget="fvalue"] { flex-basis: 50%; text-align: left; } .cbi-section-table .tr:hover .td, .cbi-section-table .tr:hover .th, .cbi-section-table .tr:hover::before { background-color: transparent; } .cbi-tab-descr { margin: 0 0 .5em 0; } .cbi-value { padding-bottom: .5em; margin-bottom: .5em; display: block; align-items: baseline; } .cbi-value.hidden { display: none; } .cbi-value .cbi-value:last-child { border-bottom: none; padding-bottom: inherit; margin-bottom: inherit; } .cbi-value label.cbi-value-title { font-weight: bold; } .cbi-value:not(.hidden)[data-widget="CBI.FlagValue"]:has(> .cbi-value-field > .cbi-checkbox) { display: grid; grid-template-columns: minmax(0, 1fr) max-content; align-items: center; column-gap: 10px; } .cbi-value:not(.hidden)[data-widget="CBI.FlagValue"]:has(> .cbi-value-field > .cbi-checkbox) > label.cbi-value-title { width: auto; max-width: none; padding: 0; margin: 0; text-align: left; text-indent: 0; white-space: normal; } .cbi-value:not(.hidden)[data-widget="CBI.FlagValue"]:has(> .cbi-value-field > .cbi-checkbox) > .cbi-value-field { display: contents; } .cbi-value:not(.hidden)[data-widget="CBI.FlagValue"]:has(> .cbi-value-field > .cbi-checkbox) > .cbi-value-field > .cbi-checkbox { grid-column: 2; } .cbi-value:not(.hidden)[data-widget="CBI.FlagValue"]:has(> .cbi-value-field > .cbi-checkbox) > .cbi-value-field > .cbi-value-description { grid-column: 1 / -1; width: auto; max-width: calc(100% - 1.25em); box-sizing: border-box; margin: .25em 0 0 1.25em; } .cbi-value.hidden { display: none !important; } .cbi-value-field, .cbi-select, .cbi-dynlist, .cbi-dropdown:not(.btn):not(.cbi-button) { width: 100%; margin: 0; } .cbi-dynlist>.item { min-height: 30px; display: flex; align-items: center; } input, textarea, select, .cbi-dropdown>ul>li { font-size: 16px !important; height: auto; } .cbi-dropdown>ul>li input[type="text"] { line-height: 28px; } select, input[type="text"], input[type="password"], .cbi-dropdown>ul>li input[type="text"], .cbi-value-field .control-group { width: 100%; height: 30px; } input.cbi-input-password { width: calc(100% - 25px); } input[type="text"]+.cbi-button, input[type="password"]+.cbi-button, select+.cbi-button { /* overflow: hidden; */ text-overflow: ellipsis; } .cbi-value-field input[type="checkbox"], .cbi-value-field input[type="radio"] { margin: 0; } button, .btn, .cbi-button { font-size: 14px !important; padding: 0 8px; } .actions, .cbi-page-actions { border-top: none; padding: 8px; } :is([data-page="admin-status-overview"], [data-page=""]) .td[width="33%"] { flex-basis: 33%; } :is([data-page="admin-status-overview"], [data-page=""]) .table, :is([data-page="admin-status-overview"], [data-page=""]) .tr, :is([data-page="admin-status-overview"], [data-page=""]) .td, :is([data-page="admin-status-overview"], [data-page=""]) .th, :is([data-page="admin-status-overview"], [data-page=""]) .tr[data-title]::before, :is([data-page="admin-status-overview"], [data-page=""]) .td[data-title]::before { border-top: 0; border-bottom: 0; } :is([data-page="admin-dashboard"], [data-page="admin"], [data-page=""]) :is(.Dashboard, .dashboard-bg.box-s1) .td[data-title]::before { word-break: keep-all; } :is([data-page="admin-dashboard"], [data-page="admin"], [data-page=""]) .Dashboard .devices-list .devices-info .tr .td { padding: 3px !important; } :is([data-page="admin-dashboard"], [data-page="admin"], [data-page=""]) .Dashboard .router-status-wifi.dashboard-bg.box-s1 .assoclist.devices-info.table>.tr:not(.dashboard-table-titles)>.td { display: block; flex: 0 0 50% !important; width: 50% !important; max-width: 50%; min-width: 0; } :is([data-page="admin-dashboard"], [data-page="admin"], [data-page=""]) .Dashboard .router-status-wifi.dashboard-bg.box-s1 .assoclist.devices-info .cbi-progressbar { width: 100% !important; min-width: 0 !important; } header .pull-right .label { white-space: normal; display: inline-block; text-align: center; line-height: 12px; margin: 1px 0; } header>.fill { padding: 1px; } header>.fill>.container { display: flex; flex-direction: row; } header .nav { flex: 3 3 80%; margin: 2px 5px 2px 0; display: flex; flex-wrap: wrap; justify-content: flex-start; } header .nav a { padding: 2px 6px; } header .pull-right { display: flex; flex-direction: row; align-items: center; gap: 4px; padding: 0; justify-content: flex-end; margin: .2em 5px .2em auto; } header [data-indicator] { width: 2.5rem; height: 2.5rem; padding: 0; margin: 0 4px; font-size: 0; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; position: relative; white-space: nowrap; line-height: 16px; } header [data-indicator="poll-status"]::before { position: absolute; inset: 0; margin: auto; width: 24px; height: 24px; } header [data-indicator="uci-changes"]::before { position: absolute; inset: 0; margin: auto; width: 20px; height: 20px; } .menu-dropdown, .dropdown-menu { top: 23px; } .cbi-optionals, .cbi-section-create { padding: 0 0 14px 0; } #cbi-network-switch_vlan .th, #cbi-network-switch_vlan .td { flex-basis: 12%; } #cbi-network-switch_vlan .td.cbi-section-actions>* { width: auto; display: block; } #wifi_assoclist_table .td, [data-page="admin-status-processes"] .td { flex-basis: 50% !important; } [data-page="admin-status-processes"] .td[data-widget="button"] { flex-basis: 33% !important; } [data-page="admin-status-processes"] .td[data-name="PID"], [data-page="admin-status-processes"] .td[data-name="USER"] { flex-basis: 25% !important; } [data-page="admin-system-fstab"] .td[data-widget="button"]::before, [data-page="admin-system-startup"] .td[data-widget="button"]::before, [data-page="admin-status-processes"] .td[data-widget="button"]::before { display: none; } [data-name="bridge-vlan"]>div { overflow: visible !important; } [data-name="bridge-vlan"] .td[data-title] { flex-basis: 33%; } [data-name="bridge-vlan"] .td[data-title]::before { content: attr(data-title); } [data-page="admin-network-network"] .td[data-name="_ifacebox"] { flex-basis: 40%; } [data-page="admin-network-network"] .td[data-name="_ifacestat"] { flex-basis: 60%; } } @media screen and (max-device-width: 375px) { .cbi-page-actions { display: flex; justify-content: space-between; margin: 0 -1px; padding: 0; } .cbi-page-actions button { overflow: hidden; text-overflow: ellipsis; } .cbi-page-actions .cbi-button { flex: 1; margin: 1px !important; line-height: 2em; } .cbi-page-actions .cbi-button-negative, .cbi-page-actions .cbi-button-primary, .cbi-page-actions .cbi-button-apply { flex: 3; } .cbi-section-actions .cbi-button { overflow: hidden; text-overflow: ellipsis; margin: 1px !important; } body[data-page="admin-network-wireless"] .td[data-name="_badge"] { max-width: 90px; align-self: center; } body[data-page="admin-network-wireless"] .td[data-name="_badge"] .ifacebadge { display: flex; align-items: center; flex-direction: column; } body[data-page="admin-network-wireless"] .td[data-name="_stat"] { flex-basis: 60%; } body[data-page="admin-network-network"] .td.cbi-section-actions::before, body[data-page="admin-network-wireless"] .td.cbi-section-actions::before { content: none !important; } [data-page="admin-network-network"] .td[data-name="_ifacebox"], [data-page="admin-network-network"] .td[data-name="_ifacestat"] { flex-basis: 100%; } .td .ifacebox { width: 100%; margin: 0 !important; flex-direction: row; } .td .ifacebox .ifacebox-head { min-width: 25%; justify-content: space-around; border-radius: 11px 0 0 11px; } .td .ifacebox .ifacebox-head, .td .ifacebox .ifacebox-body { display: flex; border-bottom: none; align-items: center; } .td .ifacebox .ifacebox-head>*, .ifacebox .ifacebox-body>* { margin: .125em; } }