From ad45eccd3349d44af4a251ab0f12eb3233cd08b8 Mon Sep 17 00:00:00 2001 From: nikrou Date: Thu, 22 Jun 2006 18:17:47 +0000 Subject: issue 426 step 1 reverted: svn merge -r1466:1465 . svn merge -r1463:1462 . git-svn-id: http://piwigo.org/svn/trunk@1376 68402e56-0260-453c-a942-63ccdbb3a9ee --- template/yoga/content.css | 329 ++++++++++++++++++++++++++++++++++++++++++++++ 1 file changed, 329 insertions(+) create mode 100644 template/yoga/content.css (limited to 'template/yoga/content.css') diff --git a/template/yoga/content.css b/template/yoga/content.css new file mode 100644 index 000000000..7a8909856 --- /dev/null +++ b/template/yoga/content.css @@ -0,0 +1,329 @@ +/* $Id$ */ +#content { + margin-right: 1em; + margin-bottom: 1em; /* when it's longer than menu bar */ +} + +BODY#theCommentsPage #content, +BODY#theRegisterPage #content, +BODY#theIdentificationPage #content, +BODY#theProfilePage #content, +BODY#theSearchPage #content, +BODY#theAboutPage #content, +BODY#thePopuphelpPage #content, +BODY#thePasswordPage #content, +BODY#theNotificationPage #content, +BODY#theTagsPage #content, +BODY#theNBMPage #content +{ + margin: 1em; +} + +#content H3 { + margin-bottom: 1ex; +} + +#content H2 { margin-bottom: 3px;} /*<- for IE otherwise calendar select is displaced to middle of page*/ + +#content H3 { + text-align: center; +} + +/* Thumbnails customization */ +#content UL.thumbnails SPAN.thumbLegend { + font-size: 80%; /* font size */ + overflow: hidden; /* oversized legend is clipped */ +} + +/* Thumbnail "elastic" layout */ +#content UL.thumbnails { + margin: 0; + padding: 0; + list-style: none; + text-align: center; /* to center the whole collection in #content */ +} +#content UL.thumbnails LI { display: inline } + +#content UL.thumbnails SPAN.wrap1 { + margin: 0 5px 5px 5px; + display: table-cell; display: inline-table; display: inline-block; + vertical-align: top; /* OK with Opera and IE6 not Geko */ + text-align: center; /* to center the thumbnail and legend in Geko/Opera */ +} +#content UL.thumbnails SPAN.wrap2 { + margin: 0; /* important reset the margins */ + display: table-cell; /* block prevents vertical-align here */ + vertical-align: middle; /* Ok with Opera and Geko not IE6 */ +} +#content UL.thumbnails SPAN.wrap2 A, +#content UL.thumbnails SPAN.wrap2 LABEL { + display: block; + border-bottom: none; +} +#content UL.thumbnails IMG { + margin-bottom: -4px; /* why ??? something wrong with Geko and Opera ignored by IE6*/ +} + +/* label and input used for caddie in admin section */ +#content UL.thumbnails SPAN.wrap2 LABEL { + position: relative; +} +:root #content UL.thumbnails SPAN.wrap2 INPUT { /* hide from Opera */ + position: absolute; + left: 0; + top: 0; +} + +/* fix IE with another layout */ +* html #content UL.thumbnails SPAN.wrap2 { + display: block; + position: relative; + text-align: left; +} +* html #content UL.thumbnails SPAN.wrap2 A, +* html #content UL.thumbnails SPAN.wrap2 LABEL { + overflow: visible; + position: absolute; + top: 50%; + text-align: center; +} +* html #content UL.thumbnails IMG.thumbnail { + position: relative; + top: -50%; + /*\*//*/ + margin-top: -40%; + /**/ +} +* html #content UL.thumbnails SPAN.wrap2 input { + position: absolute; + left: 0; + top: -50%; /* same as other browsers but not so pretty */ +} + +#content .navigationBar, #content .additional_info { + margin: 10px 0; + text-align: center; +} + +#content .pageNumberSelected { + font-style: italic; +} + +#content .additional_info { + font-size: 110%; +} + +#content FORM { + text-align: left; +} + +/* content defaults */ +#content DL, DD { margin: 10px; } +#content DT { + margin-bottom: 5px; + font-style: italic; + font-size: 110%; +} + +/* actions */ +UL.categoryActions { + margin: 0 2px; + width: auto; + padding: 0; + text-indent: 0; + list-style: none; + text-align: center; +} + +#content DIV.titrePage UL.categoryActions { + float: right; + text-align: center; +} + +#content DIV.titrePage { + padding: 0 0 3px; +} + +#content UL.categoryActions LI { + display: inline; +} + +#content UL.categoryActions A IMG, UL.categoryActions A { + border: none; + margin-bottom: -5px; +} + +/* User comments */ + +#content DIV#comments { + padding-left: 5px; + padding-right: 5px; + -moz-box-sizing: padding-box; +} +#content DIV.comment { + margin: 0 0 0.5em 0; + padding: 0; + overflow: hidden; /* these 2 lines ensure the floating child is kept in the DIV */ + width: 100%; /* don't ask why. It's a very usefull trick */ +} + +#content DIV.comment A.illustration { + display: block; + float: left; + margin: 0.5em 0 0 0.5em; +} + +#content DIV.comment P.commentHeader { + text-align: right; + margin: 0.5em 0.5em 0 0; +} + +#content DIV.comment UL.actions { + text-align: center; + margin: 0.2em; +} + +#content DIV.comment BLOCKQUOTE { + margin-top: 1em; + margin-right: 0.5em; + margin-bottom: 150px; + padding: 0.5em; +} + +/* should be in admin.css ? CSS properties also used in popuphelp */ + +SPAN.pwgScreen { + border-bottom: 1px dotted black; +} + +SPAN.filename:before { + content: "["; +} + +SPAN.filename:after { + content: "]"; +} + +/* begin chronology/calendar elements*/ +#content DIV.calendarViews { + display: block; + float: right; + margin: 2px 0 0; +} + +#content DIV.calendarBar { margin: 8px 4px; } + +SPAN.calItem, SPAN.calItemEmpty { + font-weight: bold; + margin: 0 1px; +} + +SPAN.calItem A { border:0 } + +#content DIV.calendarCalBar { + margin: 10px 10px; + text-align: left; +} + +SPAN.calCalHead { + font-weight: bold; + font-size: 110%; + margin: 0 2px; +} + +SPAN.calCal { margin: 0 2px; } + +/* nice looking month calendar*/ +TABLE.calMonth { + border: none; + border-collapse: collapse; + margin-bottom: 10px; /*<-IE ignores this */ +} + +TD.calDayCellFull, TD.calDayCellEmpty, TD.calDayCellBlank { + text-align:left; + vertical-align: top; + font: bold 18px Arial, Helvetica, sans-serif; +} + +TD.calDayHead { font: bold 12px Arial, Helvetica, sans-serif; } + +DIV.calImg { + overflow: hidden; + vertical-align: bottom; + z-index: 1; + position: relative; /*<- this required by IE*/ +} + +.calImg img { + position: relative; + border: 0; +} + +.calBackDate { + padding-left: 4px; + padding-top: 0px; + z-index: 2; + position: absolute; + text-align: left; + vertical-align: top; +} + +.calForeDate { + padding-left: 5px; + padding-top: 1px; + z-index: 3; + position: absolute; + text-align: left; + vertical-align: top; +} + +/* Category thumbnails on main page, CSS code inspired from MOD subcatify */ +#content UL.thumbnailCategories { + margin: 0; + padding: 0; + list-style: none; + text-align: center; + overflow: hidden; + width: 100%; +} + +* html #content UL.thumbnailCategories { + width: 99%; /* buggy IE box model */ +} + +#content UL.thumbnailCategories LI { + margin:0; + padding:0; + float:left; +} + +#content DIV.thumbnailCategory { + display:block; + padding: 2px 0px 0px 2px; + margin: 5px; +} + +#content DIV.thumbnailCategory DIV.description { + font-size: 90%; + overflow: auto; + /*width: inherit;*/ +} + +#content DIV.thumbnailCategory DIV.description H3 { + text-align: left; + background: transparent; + margin: 0; + padding: 0.1em; + font-size: 120%; +} + +#content DIV.thumbnailCategory DIV.description P { + margin: 0; +} + +#content DIV.thumbnailCategory DIV.illustration { + text-align: left; + margin: 2px 0 0 2px; + float: left; +} -- cgit v1.2.3