artabro/wire/templates-admin/styles/ui.css

259 lines
4.7 KiB
CSS
Raw Permalink Normal View History

2024-08-27 11:35:37 +02:00
/**********************************************************************************************
* ProcessWire Admin Control Panel - Skyscraper Theme - ui.css
*
* 1. jQuery UI overrides.
* 2. Theming of specific user interface elements (MarkupPagerNav and PageList)
*
* Copyright 2012 by Ryan Cramer
*
*/
/****************************************************************************************
* 1. Theme specific jQuery UI overrides and additions
*
*/
.ui-icon {
float: left;
margin-right: 2px;
}
label.ui-widget-header + div.ui-widget-content {
/* remove doubled border between header/content on ui-widgets */
border-top: none;
}
#notices .ui-state-highlight,
#notices .ui-state-error {
padding: 0.5em;
}
#notices .ui-state-error pre {
font-size: 11px;
margin: 1em 0;
}
#notices .ui-icon {
position: relative;
top: 2px;
}
#notices a {
text-decoration: underline;
}
p span.ui-state-error {
padding: 0.25em 0.5em;
}
.ui-dialog .ui-dialog-titlebar {
margin: 0;
}
.ui-dialog .ui-dialog-titlebar .ui-button {
/*
background: none;
border: none;
*/
outline: none;
}
.ui-dialog .ui-dialog-titlebar .ui-button .ui-icon {
position: relative;
top: 0;
left: 0;
margin: 0;
}
.ui-dialog .ui-dialog-content {
padding: 0;
}
.ui-widget-overlay {
background: #000;
}
.ui-button {
font-size: 1em;
margin: 0 1em 0 0;
padding: 3px 9px;
cursor: pointer;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}
p > a > .ui-button {
font-size: 0.923076923076923em;
}
a .ui-button {
display: block;
}
.ui-accordion-header-icon {
display: none;
}
/**
* jQuery UI autocomplete
*
*/
.ui-autocomplete {
box-shadow: 0 1px 3px 3px rgba(0,0,0,0.15);
}
.ui-autocomplete li {
border-bottom: 1px solid #eee;
}
.ui-autocomplete li small {
opacity: 0.5;
}
.ui-autocomplete .ui-widget-header a {
font-size: 0.9em;
font-weight: bold;
}
/**
* jQuery UI tooltips
*
*/
.ui-tooltip, .arrow:after {
background: black;
border: 2px solid white;
}
.ui-tooltip {
padding: 10px 20px;
color: white;
border-radius: 20px;
font: bold 12px "Helvetica Neue", Sans-Serif;
box-shadow: 0 0 7px black;
}
.arrow {
width: 70px;
height: 16px;
overflow: hidden;
position: absolute;
left: 50%;
margin-left: -35px;
bottom: -16px;
}
.arrow.top {
top: -16px;
bottom: auto;
}
.arrow.left {
left: 20%;
}
.arrow:after {
content: "";
position: absolute;
left: 20px;
top: -20px;
width: 25px;
height: 25px;
box-shadow: 6px 5px 9px -9px black;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
tranform: rotate(45deg);
}
.arrow.top:after {
bottom: -20px;
top: auto;
}
/***********************************************************************************************
* 2a. Theme Specific Pagination Markup
*
*/
.MarkupPagerNav {
list-style: none;
margin: 0;
padding: 0;
margin: 1em 0;
}
.MarkupPagerNav li {
padding: 0;
margin: 0;
list-style: none;
display: inline;
padding: 6px 0;
background: none;
}
.MarkupPagerNav li a {
padding: 4px 9px;
margin: 0;
text-decoration: none;
border: none;
background: #2f4248;
color: #fff;
font-weight: bold;
font-size: 11px;
text-transform: uppercase;
opacity: 0.8;
}
.MarkupPagerNav li a:hover {
opacity: 1.0;
}
.MarkupPagerNav li.MarkupPagerNavOn a {
opacity: 1.0;
color: #fff;
background: #db1174;
}
.MarkupPagerNav li.MarkupPagerNavSeparator {
border: none;
}
/****************************************************************************************
* 2b. Theme specific PageList overrides
*
*/
.PageList {
}
/**
* Default color for page list items
*
*/
.PageList a.PageListPage,
.PageList a.PageListPage:hover {
color: #7a002b;
}
/**
* Color when hovered
*
*/
.PageList a.PageListPage:hover {
background: none;
text-decoration: underline;
}
.PageList a.PageListPage i {
margin-right: 0.25em;
}
/**
* Color of page when opened
*
*/
.PageList .PageListItemOpen > a.PageListPage {
color: #000;
background-color: #ffffdd;
}
/**
* Give the page a lighter/alternate color when it has a hidden status
*
*/
.PageList .PageListStatusHidden a.PageListPage {
color: #ac6186;
}