piwigo/themes/Sylvia/theme.css
plegall 2de0f01dce feature 2027 implemented: the "lost password" feature was rewritten.
The algorithm is highly inspired from WordPress :

1) in a single field, you give a username or an email
2) Piwigo sends an email with the activation key
3) the user clicks on the link in the email (with the activation key) and is able to set a new password

The "lost password" feature is no longer limited to "classic" users:
administrators and webmasters can use it too (no need to tell webmasters
that they can only change their password in the database)


git-svn-id: http://piwigo.org/svn/trunk@11992 68402e56-0260-453c-a942-63ccdbb3a9ee
2011-08-24 20:03:53 +00:00

470 lines
10 KiB
CSS

/* thumbnail wrap size */
.content .thumbnailCategory div.illustration {
width:165px !important; /* Usable range 162px-360px , optimal : Thumbnail width + 40px */
}
#comments .thumbnailCategory div.illustration {
width:220px !important; /* Usable range 219px-360px , optimal : Thumbnail width + 95px */
}
/**
* Menubar
*/
#menubar DL {
background:transparent url(images/menuBox_top.gif) no-repeat scroll left top;
margin:0 0 5px 40px;
padding:0;
width: 231px;
min-width: 231px;
border: 0;
min-height: 32px;
overflow-x: hidden;
}
#menubar DT {
background-color:#111;
border:0;
display:inline;
margin-left:8px;
text-align:left;
}
#menubar DD {
background:transparent url(images/menuBox_bottom.gif) no-repeat scroll left bottom;
margin:14px 0 0 0;
padding:0 0 22px;
width: 231px;
min-width: 231px;
border: 0;
overflow-x: hidden;
}
#menubar DD P {
background:transparent url(images/menuBox_sides.gif) repeat-y scroll left bottom;
padding: 2px 16px 0;
margin: 0;
}
#menubar UL, #menubar #mbCategories p, #menubar .illustration {
background:transparent url(images/menuBox_sides.gif) repeat-y scroll left bottom;
margin:0;
}
#menubar DT A {
font-size: 100%;
}
#menubar UL {
color:#333;
font-size: 16px;
line-height: 15px;
}
#menubar UL SPAN.menuInfoCat {
color:#666;
}
#menubar LI {
padding-left: 12px;
}
#menubar LI UL {
background: transparent url(images/transparent.gif);
}
#menubar A, .menuInfoCat {
font-size: 13px;
}
#menubar form {
background:transparent url(images/menuBox_sides.gif) repeat-y scroll left bottom;
margin:0;
}
#menubar p {
padding: 16px 16px 0;
}
#menubar .button {
position:relative;
right:9px;
top:16px;
height:16px;
width:16px;
}
#menubar #mbIdentification {
background:transparent url(images/menuId_top.gif) no-repeat scroll left top !important;
}
#menubar #mbIdentification DD {
background:transparent url(images/menuId_bottom.gif) no-repeat scroll left bottom;
}
#menubar #mbIdentification UL, #menubar #mbIdentification p, #menubar #mbIdentification .illustration {
background:transparent url(images/menuId_sides.gif) repeat-y scroll left bottom;
}
#menubar #mbIdentification form {
background:transparent url(images/menuId_sides.gif) repeat-y scroll left bottom;
}
#menubar #mbIdentification form p {
background:transparent none repeat-y scroll left bottom;
}
#menubar #mbIdentification p {
padding: 2px 16px 0;
margin: 0;
}
#menubar #mbIdentification fieldset div input[type="text"] {
margin: 0 0 3px;
width: 174px;
display: inline;
}
#menubar #mbIdentification .button {
height:24px;
width:24px;
right:0px;
top:-40px;
}
#menubar #mbIdentification fieldset {
border:0;
margin:0 24px 0 23px;
}
#menubar #mbIdentification legend {
display: none;
}
#mbIdentification p, .totalImages {
color:#666;
}
#menubar #menuTagCloud {
background:transparent url(images/menuBox_sides.gif) repeat-y scroll left bottom;
margin:0;
padding: 0 12px;
}
#qsearchInput:focus, input:focus, select:focus, textarea:focus, input.focus, form .focus {
background-color:#444;
color:#999;
}
#qsearchInput {
color:#999;
}
/**
* Content
*/
.content {
background:#222 url(images/fillet.gif) repeat-x scroll left top;
min-height:466px;
border: 1px solid #000;
border-top: 0;
margin:21px 7px 0 290px !important;
padding-top:7px;
}
#the_page {
background:transparent url(images/top-left-bg.jpg) no-repeat scroll left top;
left:0;
margin:0;
padding:0;
position:absolute;
top:0;
z-index:0;
width: 100%;
min-width: 100%;
}
.content h2 {
margin:0;
padding:0px 10px 15px 15px;
border:0;
}
.content .navigationBar {
color:#666;
}
/* Category thumbnails on main page */
.content .thumbnailCategories li {
background:#222 url(images/cat_bottom-right.gif) no-repeat scroll right bottom;
width:49%;
margin: 0;
padding:0;
}
.content .thumbnailCategory {
background:transparent url(images/cat_bottom-left.gif) no-repeat scroll left bottom;
padding: 0 0 2px;
margin:0;
}
.content .thumbnailCategory div.illustration {
background:transparent url(images/cat_top-left.gif) no-repeat scroll left top;
padding: 0 0 0 10px;
margin: 0 !important;
}
.content .thumbnailCategory div.illustration a {
display: block;
margin: 0;
padding:20px 0 0 8px;
border:0;
}
.content .thumbnailCategory .description {
background:transparent url(images/cat_top-right.gif) no-repeat scroll right top;
margin: 0;
padding:15px 10px 3px 0;
overflow-x: hidden !important;
height:158px;
}
.content .thumbnailCategory .description .text {
display:block;
margin:10px 2px 0 0;
overflow: auto;
overflow-x:hidden;
padding:0 0 5px;
}
.content .thumbnailCategory .description p.dates {
margin: 0 15px 0 15px;
text-align: right;
}
.content .thumbnailCategory .description H3 {
display: block;
}
.content .thumbnailCategories li:hover {
background-color:#111;
}
/* header */
#theHeader {
min-height:110px;
height:110px;
}
.header_msgs {
background:transparent url(images/header_msgs-bg.gif) repeat scroll left top;
border:0;
color:#333;
font-size:24px;
left:0;
margin:0;
padding:10px 0 6px 0;
text-align:center;
top:0;
width:100%;
z-index:99;
}
.header_notes {
background:transparent url(images/header_msgs-bg.gif) repeat scroll left top;
border:0 none;
color:#333;
font-size:16px;
margin:0;
padding:0;
position:absolute;
top:0;
width:100%;
z-index:99;
}
.infos {
color:#f70;
border:0;
background-color: transparent;
margin-left:125px;
padding:5px 0px 0pt 10pt;
min-height: 48px;
text-align:left;
}
.errors {
color:#f33;
border:0;
background: transparent url(icon/errors.png) no-repeat scroll right top;
margin-left:125px;
padding:5px 0px 0pt 10pt;
min-height: 48px;
text-align:left;
font-weight:bold;
}
.infos li, .errors li {
list-style-type:none;
}
/* User comments */
#theCommentsPage .content .thumbnailCategories li,
#theCommentsPage .content .thumbnailCategory ,
#theCommentsPage .content .thumbnailCategory .description,
#theCommentsPage .content .thumbnailCategory div.illustration {
background-image: none;
}
#theCommentsPage .content .thumbnailCategory {
padding: 15px 2px 6px 12px;
border: 1px solid #666;
}
#theCommentsPage .content .odd {
background-color: #222;
border-top:0 !important;
}
#theCommentsPage .content .even {
background-color: #111;
}
#theCommentsPage .content .thumbnailCategories li:hover {
background-color: transparent;
}
#theCommentsPage #comments {
padding: 0 0 5px 10px;
}
#comments .thumbnailCategories hr {display:none;}
#comments .filter input[type="submit"] { margin-top:1.8em; }
/* Thumbnails */
.thumbnails .wrap2 {
border: 1px solid #666; /* thumbnails border color and style */
border-radius: 4px 4px; /* round corners with CSS3 compliant browsers */
}
.thumbnails .wrap2:hover {
color:#666;
background-color:#111;
border:1px solid #ff3363; /* thumbnails border color when mouse cursor is over it */
}
.calItem {
border:1px solid #666;
margin:0 5px;
padding:2px 5px 0 8px;
}
.calItemEmpty, td.calDayCellEmpty, td.calDayCellFull {
border:1px solid #666;
}
/**
* Picture
*/
#imageToolBar {
padding:0 7%;
}
#imageHeaderBar .imageNumber {
margin-right:7%;
}
#imageHeaderBar .browsePath {
margin-left:7%;
}
#imageHeaderBar, #imageToolBar A:hover {
background-color: transparent;
}
#imageHeaderBar H2 {
border: 0;
}
#theImage A, .illustration A, A.navThumb, A.navThumb {
border-bottom-width: 0;
}
.rateButtonStarFull, .rateButtonStarEmpty {
background-image: url('icon/rating-stars.gif');
}
#thePicturePage .thumbnailCategory {
padding: 15px 2px 6px 12px;
border: 1px solid #666;
}
#thePicturePage .thumbnailCategory .date, #thePicturePage .thumbnailCategory .author {
font-weight:bold;
}
#thePicturePage .thumbnailCategories {
padding-left: 12px;
padding-right: 12px;
}
#thePicturePage .odd {
background-color: #222;
border-top:0 !important;
}
.pictureContent {
margin:0 7px 7px 290px;
}
#addComment fieldset {
color: #f70;
border-color: #f70;
}
#addComment fieldset label {
color: #666;
}
/**
* Default Layout
*/
*, *:focus, *:active, input:active, a:active, input:focus, a:focus {
outline: none;
}
BODY {
background:#111 url(images/bottom-left-bg.jpg) no-repeat fixed left bottom;
margin:0;
min-height: 100%;
height: 100%;
padding:0;
}
BODY, H1, H3, DT, INPUT.rateButtonSelected, H2, #menubar DT {
color:#666;
}
/* forms */
FIELDSET, INPUT, SELECT, TEXTAREA {
border: 1px solid #666;
}
input[type="text"], input[type="password"], input[type="button"], input[type="submit"], input[type="reset"], input[type="file"] {
background-color:#444;
color:#999;
} /* stupid Line but needed due to inpact on other themes and deadline of Piwigo 2.0 */
input[type="file"] {
background-color:#222;
border: 1px solid #666;
}
INPUT, select, textarea {
color:#999;
background-color:#444;
}
input[type="radio"], input[type="checkbox"], input[type="button"].rateButtonStarEmpty, input[type="button"].rateButtonStarFull {
background-color: transparent;
}
input[type="button"], input[type="submit"], input[type="reset"] {
color:#ff3363;
background-color:#222;
border-color:#ff3363;
}
input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover {
color:#999;
border-color:#666;
}
/* links */
A, .rateButton {
color:#f70;
border-width: 0;
}
A:hover, A:active {
color:#f33;
border-bottom: 1px solid #ff3363;
cursor: pointer;
}
a.external {
color:#ff3363;
border:0;
text-decoration: none;
}
a.external:hover {
color:#ff7700;
border:0;
}
a.Piwigo {
font-family: verdana, arial, helvetica, sans-serif !important;
font-size: 11px; font-weight: normal; letter-spacing: 0;
color : #F33; text-decoration: none; border: 0; }
a.Piwigo:hover {
border-bottom: 1px solid #ff3363;
}
.titrePage img.button[alt="x"] { margin: 0 3px 3px; }
tr.tagLine, fieldset.tagLetter, legend.tagLetterLegend {
border-color: #666;
}
#debug {
margin: 15px 15px 5px 248px;
font-size:12px;
clear: both;
}
/* sprites */
.pwg-icon {
background-image: url(../default/s26/outline_ff3363.png);
}
A:hover .pwg-icon {
background-image: url(../default/s26/outline_ff7700.png);
}
.message {
color:white;
background-color:#666;
}