Files
Piwigo/admin/themes/default/default-layout.css
nikrou ef7b4cd2b5 Feature 1031 : Automatically sort photos by rank when manual ranks are edited
Add fields to choose sorting mode.
If order of images is changed, checked automaticaly rank for sorting mode.

Need refactoring between admin/element_set_ranks.php admin/cat_modify.php

git-svn-id: http://piwigo.org/svn/trunk@5759 68402e56-0260-453c-a942-63ccdbb3a9ee
2010-04-10 13:25:20 +00:00

844 lines
20 KiB
CSS

/* History tables */
TABLE.table2 {
border: 1px solid #111;
margin: 1em auto;
padding: 0;
}
TABLE.table2 TD, TABLE.table2 TH {
padding: 0 5px;
}
TABLE.table2 TR {
text-align: left;
}
TABLE.table2 THEAD TD { padding:7px 10px 3px 10px; }
TABLE.table2 TR.throw { text-align: center; }
TABLE.table2 { margin:0pt auto; }
.sort { display:block; padding:8px 5px 0px 1px; clear: right; float:left; }
.hour {
white-space: pre;
}
.number {
text-align: right;
}
TABLE#dailyStats {
width: 60%;
}
TABLE#detailedStats {
width: 99%;
}
/* Plugins, languages tables */
TABLE.plugins,
TABLE.languages {
min-width: 500px;
}
TABLE.plugins A { border: 0; }
TABLE.plugins TR TD { padding: 4px 10px; }
TABLE.plugins TR TD.pluginState { padding: 4px 16px; }
TABLE.languages TR TD { padding: 7px 20px; }
TABLE.plugins TR TD.active,
TABLE.languages TR TD.active {
background: url(icon/plugin_active.gif) no-repeat center left;
background-color: inherit; /* IE need it */
}
TABLE.plugins TR TD.inactive {
background: url(icon/plugin_inactive.gif) no-repeat center left;
background-color: inherit; /* IE need it */
}
TABLE.plugins ul.pluginsActions {
float: left;
padding: 0;
margin: 0;
width: 60px;
list-style: none;
text-align: center;
}
TABLE.plugins ul.pluginsActions li { display: inline; }
/* categoryOrdering */
SELECT.categoryList {
width: 100%;
}
FORM#categoryOrdering {
padding-left: 1em; /* same as FIELDSET margin (there is no fieldset in this form) */
padding-right: 1em; /* same as FIELDSET margin (there is no fieldset in this form) */
}
FORM#categoryOrdering p {
text-align: left;
margin-top: 1em;
margin-bottom: 1em;
}
UL.categoryUl {
list-style: none;
padding: 0;
margin: 0;
}
LI.categoryLi {
width: 100%;
border: 1px solid #666;
padding: 0px 5px;
margin-bottom: 5px;
}
FORM#categoryOrdering UL.categoryActions {
float: right;
height:45px;
line-height:45px;
}
/* */
FORM#catModify TABLE { width: auto; }
FIELDSET.elementEdit A {
display: block;
float: right;
}
TABLE.doubleSelect {
text-align: center;
margin: 0 auto;
width: 100%;
}
TABLE.doubleSelect TD {
padding: 0 3px;
width: 50%;
}
TABLE.doubleSelect SELECT.categoryList {
width: 100%; max-width: 100%; overflow-x: auto;
}
FORM#categoryPermissions LI {
display:inline;
white-space: nowrap;
}
FIELDSET#mainConfCheck SPAN.property,
FIELDSET#historyConf SPAN.property,
FIELDSET#commentsConf SPAN.property,
FIELDSET#uploadConf SPAN.property,
FIELDSET#indexDisplayConf SPAN.property,
FIELDSET#pictureDisplayConf SPAN.property,
FIELDSET#pictureInfoConf SPAN.property {
float: right;
text-align: left;
}
FIELDSET#mainConfCheck INPUT,
FIELDSET#historyConf INPUT,
FIELDSET#commentsConf INPUT,
FIELDSET#uploadConf INPUT,
FIELDSET#indexDisplayConf INPUT,
FIELDSET#pictureDisplayConf INPUT,
FIELDSET#pictureInfoConf INPUT {
float: none;
}
FIELDSET#mainConf SPAN.property {
width: 25%;
}
FIELDSET#mainConf TEXTAREA.description {
width: 70%;
}
FIELDSET#mainConfCheck SPAN.property,
FIELDSET#historyConf SPAN.property,
FIELDSET#indexDisplayConf SPAN.property,
FIELDSET#pictureDisplayConf SPAN.property,
FIELDSET#pictureInfoConf SPAN.property {
width: 90%;
}
FIELDSET#mainConfCheck INPUT,
FIELDSET#historyConf INPUT,
FIELDSET#commentsConf INPUT,
FIELDSET#indexDisplayConf INPUT,
FIELDSET#pictureDisplayConf INPUT,
FIELDSET#pictureInfoConf INPUT {
margin-left: 5%;
}
FIELDSET#uploadConf SELECT {
float: right;
margin: 2px 10px 0px;
}
FIELDSET#uploadConf INPUT {
float: right;
margin: 5px 10px 0px;
}
FIELDSET#uploadConf SPAN.property {
width: 65%;
}
FIELDSET#commentsConf SPAN.property {
width: 85%;
}
.statBar {
height: 10px;
background-color: #ff7700;
border: 1px solid #666;
}
.over{
position: relative;
z-index: 0;
}
.over:hover{
background-color: transparent;
z-index: 50;
}
.over SPAN{ /*CSS for enlarged image*/
position: absolute;
background-color: #222;
padding: 5px;
left: -1000px;
border: 1px solid #ff3363;
visibility: hidden;
color: black;
text-decoration: none;
}
.over SPAN IMG{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}
.over:hover SPAN{ /*CSS for enlarged image on hover*/
visibility: visible;
top: 0;
left: 60px; /*position where enlarged image should offset horizontally */
}
BODY {
margin: 5px;
padding: 0;
font-size: 0.8em;
font-family: "Lucida Grande",Verdana,Arial,"Bitstream Vera Sans",sans-serif;
text-align: center; /* be nice to IE5 */
}
H1 {
color:#eee;
letter-spacing:1px;
text-align: left;
font-size: 150%;
font-weight: normal;
font-style:italic;
padding: 8px 0 0 10px;
margin: 0;
float:left;
}
#pwgHead {color:#aaa;}
#pwgHead A {color:#ccc;}
#pwgHead A:hover {color:#fff;border-bottom:1px solid #fff}
#pwgHead A#instructions:hover {border:none;}
#headActions {float:right; height:46px; line-height:46px; margin-right:10px;}
A {
text-decoration:none;
border-bottom: 0;
}
A:hover {
border-bottom: 1px solid #FF3363;
}
A.button, A.button:hover {
border: 0;
}
IMG {
border: none;
}
HR.separation {
visibility: hidden;
clear: both;
}
/** General defaults **/
INPUT, SELECT {
margin: 0;
font-size: 1em; /* <= some browsers don't set it correctly */
}
UL, DL, OL { text-align: left;}
TABLE { /* horizontaly centered */
margin-left: auto;
margin-right: auto;
}
/* for debugging purpose */
PRE { text-align:left; }
/** forms **/
FORM { padding: 0em; }
FORM P {
text-align: center;
margin-top: 2em;
margin-bottom: 2em;
}
form p.field {
text-align: left;
}
FORM FIELDSET P {
margin-top: 1em;
margin-bottom: 0;
}
.small {
font-size: 80%;
}
TEXTAREA.description {
height: 6em;
width: 40em;
overflow: auto;
}
SELECT.categoryList {
height: 20em;
width: auto;
}
DIV.comment BLOCKQUOTE {
padding: 0.5em;
overflow: auto; /* no solution for IE6 */
min-height: 2.75em; /* fix a Gecko bug whith scrollbar and 1 line only */
}
/**
* Filter forms are displayed label by label with the input (or select...)
* below the label. Use an UL to make a group (radiobox for instance).
* Use a SPAN to group objects in line
*/
FIELDSET {
padding: 1em;
margin: 1em;
overflow: hidden; /* <- makes Opera happy */
}
FORM.filter FIELDSET UL {
margin: 0;
}
FORM.filter FIELDSET UL,
FORM.filter FIELDSET LABEL {
display: block;
float: left;
margin-right: 1em;
padding: 0;
}
FORM.filter FIELDSET LI {
list-style: none;
margin-bottom: 0.5em;
}
FORM.filter FIELDSET LI LABEL {
display: inline;
float: none;
}
FORM.filter FIELDSET UL.tagSelection LABEL {
display: inline;
float: none;
margin-right:0.5em;/*reduce from above*/
}
/* cannot use FIELDSET>LABEL because of IE<=6 */
FORM.filter FIELDSET LABEL INPUT,
FORM.filter FIELDSET LABEL SELECT,
FORM.filter FIELDSET LABEL SPAN,
FORM.filter FIELDSET LABEL TEXTAREA {
display: block;
margin: 0.5em 0;
}
FORM.filter FIELDSET * LABEL INPUT,
FORM.filter FIELDSET * LABEL SELECT,
FORM.filter FIELDSET * LABEL TEXTAREA,
FORM.filter FIELDSET LABEL SPAN INPUT,
FORM.filter FIELDSET LABEL SPAN SELECT,
FORM.filter FIELDSET LABEL SPAN TEXTAREA {
display: inline;
vertical-align: top;
margin: 0 0.5em 0 0;
}
FORM.filter FIELDSET UL.tagSelection LI LABEL INPUT {
margin-right:0;
}
/* following declaration is important to avoid strange FF behaviour */
FORM.filter FIELDSET LABEL SPAN SELECT {
margin: 0;
}
FORM.filter FIELDSET P
{
clear: left;
display: block;
}
FORM.filter INPUT[type="submit"] {
margin-top: 1.8em;
}
FORM.properties UL, FORM#update UL {
list-style-type: none;
margin: 0;
padding: 0;
}
FORM.properties LI, FORM#update UL {
margin-bottom: 0.5em;
padding: 0;
line-height: 1.8em;
clear: left;
}
FORM.properties SPAN.property {
font-weight: bold;
float: left;
width: 50%;
text-align: right;
margin: 0;
padding: 0 0.5em 0 0;
}
#theHeader H1 {
margin-bottom: 0.5em;
}
/* button tools */
UL.actions {
text-indent: 0;
list-style: none;
}
UL.actions LI {
display: inline;
}
UL.actions A {
border: none;
}
UL.tagSelection {
width: 99%;
margin: 1em 0 1em 0;
padding: 0;
}
UL.tagSelection LI {
display:inline-block;
width:150px!important;
overflow:hidden;
white-space: nowrap;
}
/* jQuery tooltips */
.cluetip-default #cluetip-outer {
position: relative;
border: 1px solid #111111;
color: #dddddd;
background-color: #222222;
text-align: left;
}
.cluetip-default h3#cluetip-title {
margin: 0 0 5px;
padding: 8px;
color: #666666;
background-color: #d3d3d3;
font-size: 1.1em;
font-weight: bold;
}
.cluetip-default #cluetip-inner {
padding: 10px;
}
/* jQuery datepicker */
img.ui-datepicker-trigger {
cursor : pointer;
vertical-align: middle;
margin:-3px 5px 2px 5px;
}
/* jQuery FCBKcomplete */
/* TextboxList sample CSS */
ul.holder { margin: 0; border: 1px solid #999; overflow: hidden; height: auto !important; height: 1%; padding: 4px 5px 0; }
*:first-child+html ul.holder { padding-bottom: 2px; } * html ul.holder { padding-bottom: 2px; } /* ie7 and below */
ul.holder li { float: left; list-style-type: none; margin: 0 5px 4px 0; white-space:nowrap;}
ul.holder li.bit-box, ul.holder li.bit-input input { font: 11px "Lucida Grande", "Verdana"; }
ul.holder li.bit-box { -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; border: 1px solid #CAD8F3; background: #DEE7F8; padding: 1px 5px 2px; }
ul.holder li.bit-box-focus { border-color: #598BEC; background: #598BEC; color: #fff; }
ul.holder li.bit-input input { width: auto; overflow:visible; margin: 0; border: 0px; outline: 0; padding: 3px 0px 2px; } /* no left/right padding here please */
ul.holder li.bit-input input.smallinput { width: 20px; }
/* Facebook demo CSS */
#add { border: 1px solid #999; width: 550px; margin: 50px; padding: 20px 30px 10px; }
form ol li { list-style-type: none; }
form ol { font: 11px "Lucida Grande", "Verdana"; margin: 0; padding: 0; }
form ol li.input-text { margin-bottom: 10px; list-style-type: none; padding-bottom: 10px; }
form ol li.input-text label { font-weight: bold; cursor: pointer; display: block; font-size: 13px; margin-bottom: 10px; }
form ol li.input-text input { width: 500px; padding: 5px 5px 6px; font: 11px "Lucida Grande", "Verdana"; border: 1px solid #999; }
form ul.holder { width: 500px; }
form ul { margin: 0 !important }
ul.holder li.bit-box, #apple-list ul.holder li.bit-box { padding-right: 15px; position: relative; z-index:1000;}
#apple-list ul.holder li.bit-input { margin: 0; }
#apple-list ul.holder li.bit-input input.smallinput { width: 5px; }
ul.holder li.bit-hover { background: #BBCEF1; border: 1px solid #6D95E0; }
ul.holder li.bit-box-focus { border-color: #598BEC; background: #598BEC; color: #fff; }
ul.holder li.bit-box a.closebutton { position: absolute; right: 4px; top: 5px; display: block; width: 7px; height: 7px; font-size: 1px; background: url(icon/fcbkcomplete_close.gif); }
ul.holder li.bit-box a.closebutton:hover { background-position: 7px; }
ul.holder li.bit-box-focus a.closebutton, ul.holder li.bit-box-focus a.closebutton:hover { background-position: bottom; }
/* Autocompleter */
.facebook-auto { display: none; position: absolute; width: 512px; background: #eee; }
.facebook-auto .default { padding: 5px 7px; border: 1px solid #ccc; border-width: 0 1px 1px;font-family:"Lucida Grande","Verdana"; font-size:11px; }
.facebook-auto ul { display: none; margin: 0; padding: 0; overflow: auto; position:absolute; z-index:9999}
.facebook-auto ul li { padding: 5px 12px; z-index: 1000; cursor: pointer; margin: 0; list-style-type: none; border: 1px solid #ccc; border-width: 0 1px 1px; font: 11px "Lucida Grande", "Verdana"; background-color: #eee }
.facebook-auto ul li em { font-weight: bold; font-style: normal; background: #ccc; }
.facebook-auto ul li.auto-focus { background: #4173CC; color: #fff; }
.facebook-auto ul li.auto-focus em { background: none; }
.deleted { background-color:#4173CC !important; color:#ffffff !important;}
.hidden { display:none;}
#demo ul.holder li.bit-input input { padding: 2px 0 1px; border: 1px solid #999; }
.ie6fix {height:1px;width:1px; position:absolute;top:0px;left:0px;z-index:1;}
/* Add photos, direct mode */
#uploadBoxes P {
margin:0;
margin-bottom:2px;
padding:0;
}
#batchLink {
text-align:center;
}
.category_selection {
min-height:65px;
margin-top:5px;
}
.category_selection TABLE {
margin:0;
}
#photosAddContent FIELDSET {
width:650px;
margin:0 auto 20px auto;
}
#photosAddContent P {
margin:0;
}
#photosAddContent TH {
text-align:right;
padding-right: 5px;
}
#uploadFormSettings input[type="text"] {
text-align:right;
}
#uploadFormSettings TH {
width:50%;
}
#pwgHead {
background-color:#464646;
height:46px;
}
html, body {height:100%; margin:0; padding:0;}
#the_page {min-height:100%; position:relative; padding:0;margin:0;}
#pwgMain {padding:10px;padding-bottom:60px;}
#footer {
position:absolute;
bottom:0;
width:100%;
height:46px;
background: url(images/logo.png) no-repeat bottom left;
background-color:#464646;
color:#aaa;
line-height:46px;
}
#footer A {color:#ccc;}
#footer A:hover {color:#fff;border-bottom:1px solid #fff;}
#adminHome {
text-align:center;
margin-bottom:15px;
line-height:30px;
width:200px;
margin-left:5px;
-moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px;
}
#adminHome A {display:block; font-size:1.1em; font-weight:bold;}
#adminHome A {border:none;}
#piwigoInfos {float:left; margin-left:100px;}
#pageInfos {float:right; margin-right:10px;}
/* TipTip CSS - Version 1.2 */
#tiptip_holder {
display: none;
position: absolute;
top: 0;
left: 0;
z-index: 99999;
}
#tiptip_holder.tip_top {
padding-bottom: 5px;
}
#tiptip_holder.tip_bottom {
padding-top: 5px;
}
#tiptip_holder.tip_right {
padding-left: 5px;
}
#tiptip_holder.tip_left {
padding-right: 5px;
}
#tiptip_content {
font-size: 11px;
color: #fff;
text-shadow: 0 0 2px #000;
padding: 4px 8px;
border: 1px solid rgba(255,255,255,0.25);
background-color: rgb(25,25,25);
background-color: rgba(25,25,25,0.92);
background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(transparent), to(#000));
border-radius: 3px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
box-shadow: 0 0 3px #555;
-webkit-box-shadow: 0 0 3px #555;
-moz-box-shadow: 0 0 3px #555;
}
#tiptip_arrow, #tiptip_arrow_inner {
position: absolute;
border-color: transparent;
border-style: solid;
border-width: 6px;
height: 0;
width: 0;
}
#tiptip_holder.tip_top #tiptip_arrow {
border-top-color: #fff;
border-top-color: rgba(255,255,255,0.35);
}
#tiptip_holder.tip_bottom #tiptip_arrow {
border-bottom-color: #fff;
border-bottom-color: rgba(255,255,255,0.35);
}
#tiptip_holder.tip_right #tiptip_arrow {
border-right-color: #fff;
border-right-color: rgba(255,255,255,0.35);
}
#tiptip_holder.tip_left #tiptip_arrow {
border-left-color: #fff;
border-left-color: rgba(255,255,255,0.35);
}
#tiptip_holder.tip_top #tiptip_arrow_inner {
margin-top: -7px;
margin-left: -6px;
border-top-color: rgb(25,25,25);
border-top-color: rgba(25,25,25,0.92);
}
#tiptip_holder.tip_bottom #tiptip_arrow_inner {
margin-top: -5px;
margin-left: -6px;
border-bottom-color: rgb(25,25,25);
border-bottom-color: rgba(25,25,25,0.92);
}
#tiptip_holder.tip_right #tiptip_arrow_inner {
margin-top: -6px;
margin-left: -5px;
border-right-color: rgb(25,25,25);
border-right-color: rgba(25,25,25,0.92);
}
#tiptip_holder.tip_left #tiptip_arrow_inner {
margin-top: -6px;
margin-left: -7px;
border-left-color: rgb(25,25,25);
border-left-color: rgba(25,25,25,0.92);
}
/* Webkit Hacks */
@media screen and (-webkit-min-device-pixel-ratio:0) {
#tiptip_content {
padding: 4px 8px 5px 8px;
background-color: rgba(45,45,45,0.88);
}
#tiptip_holder.tip_bottom #tiptip_arrow_inner {
border-bottom-color: rgba(45,45,45,0.88);
}
#tiptip_holder.tip_top #tiptip_arrow_inner {
border-top-color: rgba(20,20,20,0.92);
}
}
/* Set the width of the menubar for the galery */
#menubar {
width: 18em;
}
.content {
margin-left: 20em; /* = #menubar width + 2em */
}
/* Set minimum width of the page before getting a scrollbar */
/* IE5 and IE6 don't get that */
BODY {
min-width: 60em; /* ~ 3* #menubar width */
}
BODY#thePopuphelpPage {
min-width: 0;
}
/* Set some sizes according to your maximum thumbnail width and height */
.content UL.thumbnails SPAN,
.content UL.thumbnails SPAN.wrap2 A,
.content UL.thumbnails LABEL,
.content DIV.thumbnailCategory DIV.illustration {
width: 140px; /* max thumbnail width + 2px */
}
.content UL.thumbnails SPAN.wrap2,
.content DIV.thumbnailCategory DIV.description {
height: 140px; /* max thumbnail height + 2px */
}
/* Category thumbnails on main page */
.content UL.thumbnailCategories LI {
width: 49.7%; /* 49.7% for 2 per line, 33.2% for 3 per line*/
}
/* Set defaults for thumbnails legend */
.content UL.thumbnails SPAN.thumbLegend {
display: block; /* display: none; if you don't want legend */
height: 4em; /* legend height (don't set auto to be Gecko friendly)*/
}
.themeBox {display:inline-table; text-align:center; height:192px; background-color:#eee; margin:5px; -moz-border-radius:5px; overflow:hidden; }
.themeBox IMG {border:1px solid white; margin:0 15px;}
.themeName {font-size:1.1em; margin:5px 0;}
.themeActions {display: table-row; font-size:12px; height: 43px; }
.themeActions DIV {display: table-cell; vertical-align: middle; line-height:18px; }
.themeActions A {}
#themesContent .themeBox IMG {width:150px; height:120px;}
#themesContent H3 {font-size:16px; text-align:left; border-bottom:1px solid #444; letter-spacing:1px; margin:5px;}
.themeBoxes {min-height:0;text-align:left;}
h2 { letter-spacing:2px; font-weight:bold;}
h2:lang(en) { text-transform:capitalize; }
#pluginsMenuSeparator {width:80%; margin:5px auto;}
#helpContent P {text-align:left; margin-left:10px;}
#helpContent LI, #ftpPage LI {margin-top:10px;}
#helpContent P.nextStepLink {text-align:center; font-weight:bold; margin-bottom:20px;}
#configContent FIELDSET, #availablePlugins FIELDSET {border:none;}
/**
* Informations box in administration
*/
.infos, .errors {
text-align: left;
margin: 5px;
padding: 10px 50px 10px 10px;
font-weight:bold;
background-repeat: no-repeat;
background-position: 5px 5px;
padding:5px 70px 0pt 30px;
min-height: 54px;
}
.infos {
color: #0a0;
background-color:#c2f5c2;
background-image: url(icon/infos.png);
}
.errors {
color: #f22;
background-color: #ffd5dc;
background-image: url(icon/errors.png);
}
.infos li, .errors li { list-style-type:square; }
.infos .submit {margin-left:30px;}
.checkActions {text-align:left;padding:0;margin:0;}
.comment A:hover {border:none;}
.pluginBox {margin-bottom:10px;-moz-border-radius:5px;}
.pluginBox table {width:99%}
.pluginBox td {text-align:left;}
.pluginBox td.pluginDesc {cursor:pointer;}
.pluginBox td.pluginDesc img{vertical-align:middle;}
.pluginBox td em{float:right;}
.pluginBoxNameCell {width:150px; vertical-align:top;}
.languageBoxes {min-height:0;text-align:left;}
.languageBox {display:inline-table; text-align:center; width:200px; height:40px; margin:5px; -moz-border-radius:5px; overflow:hidden; }
.languageName {font-size:1.1em; margin:5px 0;}
.languageActions {display: table-row; font-size:12px; }
.languageActions DIV {display: table-cell; vertical-align: middle; line-height:18px; }
#ui-datepicker-div {-moz-border-radius:5px;}
#ui-datepicker-div .ui-icon-circle-triangle-w, #ui-datepicker-div .ui-icon-circle-triangle-e {color:transparent;}
#ui-datepicker-div A.ui-datepicker-prev, #ui-datepicker-div A.ui-datepicker-next {background-color:transparent;}
#ui-datepicker-div A.ui-datepicker-prev:hover, #ui-datepicker-div A.ui-datepicker-next:hover {-moz-border-radius:5px;}
.HelpActions {
float:right;
margin:0;
padding:0;
padding-top:2px;
padding-left:3px;
}
.HelpActions a { border:0; margin:0; }
.HelpActions a:hover {border:0;}
.HelpActions li {list-style-image:none; list-style-position:outside; list-style-type:none; text-align:center; text-indent:0pt; }