/* // Copyright (C) 2014 The Syncthing Authors. // // This Source Code Form is subject to the terms of the Mozilla Public // License, v. 2.0. If a copy of the MPL was not distributed with this file, // You can obtain one at http://mozilla.org/MPL/2.0/. */ body { padding-bottom: 70px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; } h1, h2, h3, h4, h5 { font-family: "Raleway", "Helvetica Neue", Helvetica, Arial, sans-serif; line-height: 1.25; } ul+h5 { margin-top: 1.5em; } #content { margin-bottom: 50px; } .panel-progress { background: #3498db; height: 3px; left: 0; position: absolute; top: 0; display: block; } .panel-title { position: relative; text-overflow: ellipsis; overflow: hidden; } identicon { display: inline-block; position: relative; width: 1em; height: 1em; line-height: 1; margin-right: 5px; } .identicon { width: 1em; height: 1em; } .identicon rect { fill: #333; } .checkbox { margin-top: 0px; } .checkbox input[type="checkbox"], .radio input[type="radio"] { float: none; /* issue #1197 */ } .popover { max-width: none; min-width: 250px; } .panel-heading .fa, .modal-header .fa { margin-right: 10px; } .panel-heading { position: relative; overflow: hidden; } .text-monospace { font-family: Menlo, Monaco, Consolas, "Courier New", monospace; } .table-condensed>thead>tr>th, .table-condensed>tbody>tr>th, .table-condensed>tfoot>tr>th, .table-condensed>thead>tr>td, .table-condensed>tbody>tr>td, .table-condensed>tfoot>tr>td { border-top: none; } .logo { margin: 0; padding: 0; top: -5px; position: relative; } .list-no-bullet { list-style-type: none } .li-column { display: inline-block; min-width: 7em; margin-right: 1em; background-color: rgb(236, 240, 241); border-radius: 3px; padding: 1px 4px; margin: 2px 2px; } .li-column span.data { margin-left: 0.5em; min-width: 10em; text-align: right; display: inline-block; } .ng-cloak { display: none !important; } .table th { white-space: nowrap; font-weight: 400; } .table td { padding-left: 20px !important; } .table td.small-data { white-space: nowrap; } table.table-condensed { table-layout: fixed; } table.table-condensed td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } @media (max-width:767px) { table.table-condensed td { /* for mobile phones to allow linebreaks in long repro folder/shared with * columns. */ white-space: normal; } } .navbar-right { /* to align with panel */ padding-right: 15px; } /** * Menu for select language */ @media (min-width:480px) and (max-width:649px) { *[language-select] > .dropdown-menu { width: 230px; } } @media (min-width:650px) { *[language-select] > .dropdown-menu > li { width: 50%; float: left; } *[language-select] > .dropdown-menu { width: 440px; } } @media (max-width:479px) { .dropdown-menu { padding-top: 55px; } nav .dropdown-toggle { font-size: 14px; } .dropdown-toggle { float: left; } .navbar-brand { padding-left: 0; padding-top: 16px; } .navbar-nav .open .dropdown-menu > li > a { padding: 12px 15px 12px 25px; } } .panel-body .table-condensed { margin-bottom: 0; } .dl-horizontal.dl-narrow dt { width: 40px; } .dl-horizontal.dl-narrow dd { margin-left: 60px; } /** * Progress bars with centered text */ .progress { margin-bottom: 0px; position: relative; } .progress span.frontal { text-align: center; position: absolute; display: block; width: 100%; } .three-columns { -webkit-column-count: 3; -moz-column-count: 3; column-count: 3; } .two-columns { -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; } ul.three-columns li, ul.two-columns li { padding-left: 0.5em; text-indent: -0.5em; } /** Footer nav on small devices **/ @media (max-width: 1199px) { body { padding-bottom: 0; } .navbar-fixed-bottom { position: static; } } /** Dark theme customizations start here. Author: alessandro.g89 Source: https://userstyles.org/styles/122502/syncthing-dark **/ body { color: #aaa !important; background-color: black !important; } a:hover,a:focus,a.focus{ outline: none !important; } /* navbar */ .navbar { background-color: #333 !important; border-color: #333 !important; border-width: 2px !important; } .navbar-text, .dropdown>a, .dropdown-menu>li>a, .hidden-xs>a, .navbar-link { color: #aaa !important; } .dropdown-menu { border-color: #333 !important; border-width: 2px !important; background-color: #222 !important; } .dropdown-menu>li>a:hover, .dropdown-menu>li>a:focus { color: #fff !important; background-color: #333 !important; } .open>.dropdown-toggle, .dropdown-toggle:hover { border-color: #333 !important; background-color: #222 !important; } .divider { background-color: #333 !important; height: 2px !important; } li.hidden-xs:hover, .navbar-link:hover, .navbar-link:focus { outline: none !important; border-color: #333 !important; background-color: #222 !important; } .dropdown-menu>.active>a { color: #fff !important; background-color: #217dbb !important; } /* main panel */ .panel { background-color: #111 !important; border-width: 2px !important; } .panel-default { border-color: #222 !important; } .panel-default>.panel-heading { color: #aaa !important; border-color: #222 !important; background-color: #222 !important; } .panel-footer { background-color: #111 !important; border-width: 0 !important; } .table-striped>tbody>tr:nth-of-type(odd) { background-color: #181818 !important; } .panel-group .panel-heading+.panel-collapse>.panel-body, .panel-group .panel-heading+.panel-collapse>.list-group { border-top: 1px solid #222 !important; } .identicon>rect { fill: #aaa !important; } /* buttons */ .btn { border-radius: 3px !important; border-width: 0px !important; } .btn:hover, .btn:focus, .btn.focus { outline: none !important; } .btn-default { color: #aaa !important; background-color: #333 !important; } .btn-default:hover, .btn-default:focus, .btn-default.focus { color: #fff !important; background-color: #484848 !important; } .btn-primary { background-color: #217dbb !important; } .btn-primary:hover, .btn-primary:focus, .btn-primary.focus { background-color: #3498db !important; } .btn-warning { background-color: #c29d0b !important; } .btn-warning:hover, .btn-warning:focus, .btn-warning.focus { background-color: #f1c40f !important; } .btn-danger { background-color: #d62c1a !important; } .btn-danger:hover, .btn-danger:focus, .btn-danger.focus { background-color: #e74c3c !important; } /* modal dialogs */ .modal-header { border-color: #222 !important; background-color: #222; } .modal-content { border-color: #666 !important; border-width: 2px !important; background-color: #111 !important; } .modal-footer { border-color: #111 !important; background-color: #111 !important; } .alert-warning { background-color: #c29d0b !important; } .alert-danger { background-color: #d62c1a !important; } .help-block { color: #aaa !important; } .form-control { color: #aaa !important; border-color: #444 !important; background-color: black !important; } code.ng-binding{ color: #f99 !important; background-color: #444 !important; } .well, .form-control[readonly="readonly"] { /* read-only fields*/ color: #444 !important; border-color: #444 !important; background-color: #111 !important; } /* buttons for pagination */ .pagination>li>a, .pagination>li>span { background-color: #333 !important; border-color: #484848 !important; } .pagination>li>a:hover, .pagination>li>a:focus, .pagination>li>a.focus { background-color: #484848 !important; } /* progess bars */ .progress-bar { background-color: #217dbb !important; } .progress-bar-success { background-color: #0A8522 !important; } .progress-bar-info { background-color: #9b59b6 !important; } .progress-bar-warning { background-color: #c29d0b !important; } .progress-bar-danger { background-color: #d62c1a !important; }