Files
web/style/pi-hole.css

254 lines
5.4 KiB
CSS

/* Pi-hole: A black hole for Internet advertisements
* (c) 2017 Pi-hole, LLC (https://pi-hole.net)
* Network-wide ad blocking via your own hardware.
*
* This file is copyright under the latest version of the EUPL.
* Please see LICENSE file for your rights under this license. */
.small-box {
cursor: default;
-webkit-user-select: none; /* Chrome/Safari */
-moz-user-select: none; /* Firefox */
-ms-user-select: none; /* IE10+ */
/* Rules below not implemented in browsers yet */
-o-user-select: none;
user-select: none;
}
.small-box span {
-webkit-transition-duration: 500ms;
-o-transition-duration: 500ms;
transition-duration: 500ms;
}
.small-box span.glow {
text-shadow: 0 0 5px #fff;
}
.skin-blue .list-group-item:hover {
background: #ddd;
}
.skin-blue .not-used {
background: #eee;
}
.skin-blue .not-used:hover {
background: #c5c5c5;
}
.skin-blue .used {
background: #fff;
}
.skin-blue .used:hover {
background: #ddd;
}
@-webkit-keyframes Pulse{
from {color:#630030;-webkit-text-shadow:0 0 2px transparent;}
50% {color:#e33100;-webkit-text-shadow:0 0 5px #e33100;}
to {color:#630030;-webkit-text-shadow:0 0 2px transparent;}
}
@-o-keyframes Pulse{
from {color:#630030;text-shadow:0 0 2px transparent;}
50% {color:#e33100;text-shadow:0 0 5px #e33100;}
to {color:#630030;text-shadow:0 0 2px transparent;}
}
@keyframes Pulse{
from {color:#630030;text-shadow:0 0 2px transparent;}
50% {color:#e33100;text-shadow:0 0 5px #e33100;}
to {color:#630030;text-shadow:0 0 2px transparent;}
}
.lookatme {
-webkit-animation-name: Pulse;
-o-animation-name: Pulse;
animation-name: Pulse;
-webkit-animation-duration: 2s;
-o-animation-duration: 2s;
animation-duration: 2s;
-webkit-animation-iteration-count: infinite;
-o-animation-iteration-count: infinite;
animation-iteration-count: infinite;
}
.table-responsive {
-webkit-overflow-scrolling: touch;
overflow: visible;
}
/* Optimize Queries-Table for small screens */
#all-queries td:nth-of-type(1), /* Time column */
#all-queries td:nth-of-type(5) { /* Status column */
white-space: nowrap;
}
#all-queries td:nth-of-type(3) { /* Domain column */
min-width: 200px;
word-break: break-all;
white-space: pre-wrap;
}
#all-queries_info { /* Allow Info String to wrap (useful while filtering entries on small screen) */
white-space: unset;
}
#all-queries_wrapper .pagination > li > a { /* adjust the buttons width */
padding-left: 6px;
padding-right: 6px;
min-width: 34px;
text-align: center;
}
@media screen and (max-width: 500px),
screen and (min-width: 767px) and (max-width: 1000px) {
/* Hide "Previous" & "Next"-Buttons in Pagination */
#all-queries_wrapper .pagination > li.previous,
#all-queries_wrapper .pagination > li.next {
display: none;
}
#all-queries_wrapper .pagination > li:nth-of-type(2) a {
border-top-left-radius: 4px;
border-bottom-left-radius: 4px;
}
#all-queries_wrapper .pagination > li:nth-last-of-type(2) a {
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
}
}
.main-header > .navbar,
.navbar > .sidebar-toggle {
height: 50px;
}
#resetButton {
color: #f00;
font-weight: 700;
}
.vertical-alignment-helper {
display: table;
width: 100%;
height: 100%;
pointer-events: none;
}
.vertical-alignment-helper > .vertical-align-center {
display: table-cell;
vertical-align: middle;
}
.vertical-alignment-helper > .vertical-align-center > .modal-content {
width: 250px;
margin-left: auto;
margin-right: auto;
word-wrap: break-word;
pointer-events: all;
}
.alSpinner {
top: 0.1em;
left: 0.1em;
width: 0.8em;
height: 0.8em;
border-radius: 50%;
border: 4px solid #c0c0c0;
border-right-color: transparent;
-webkit-animation: fa-spin 1s infinite linear;
-o-animation: fa-spin 1s infinite linear;
animation: fa-spin 1s infinite linear;
}
.extratooltipcanvas{
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none
}
#chartjs-tooltip {
opacity: 1;
position: absolute;
background: rgba(0, 0, 0, .7);
color: #fff;
border-radius: 3px;
-webkit-transition: all .1s ease;
-o-transition: all .1s ease;
transition: all .1s ease;
pointer-events: none;
-webkit-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
-o-transform: translate(-50%, 0);
transform: translate(-50%, 0);
}
.chartjs-tooltip-key {
display: inline-block;
width: 20px;
height: 10px;
margin-right: 10px;
}
.chart-legend {
height: 250px;
overflow: auto;
}
.chart-legend ul {
list-style-type: none;
}
.chart-legend li {
cursor: pointer;
}
.chart-legend li span {
display: inline-block;
width: 20px;
height: 12px;
margin-right: 5px;
}
.strike {
text-decoration: line-through !important;
}
.fa-paypal-icon {
width: 18px;
margin-left: 2px;
}
.sidebar-toggle:before {
font-weight: 900;
font-family: "Font Awesome 5 Free";
}
/* Utilities */
.text-black {
color: #000 !important;
}
.text-green-light {
color: #7fff00 !important;
}
.text-green {
color: #080 !important;
}
.text-orange {
color: #ffa500 !important;
}
.text-red {
color: #f00 !important;
}
.text-vivid-blue {
color: #36f !important;
}
td.highlight {
background-color: yellow;
}
.underline {
text-decoration: underline;
}
.pointer {
cursor: pointer;
}