Subject: The mailing list for listmasters using Sympa
List archive
Re: [sympa-users] Re: Misaligned list-of-lists in Sympa
- From: Igor Pruchanskiy <address@concealed>
- To: David Verdin <address@concealed>
- Cc: address@concealed
- Subject: Re: [sympa-users] Re: Misaligned list-of-lists in Sympa
- Date: Wed, 10 Mar 2010 15:44:25 -0800
Hi David,
Apologies for the late response.
My CSS is still work in progress, as I was pulled in different direction to finish another project, however, i would say it is usable. I did not get a chance to test it on Windows,
but it seems to work OK on OS X 10.6 (Safari/Firefox/Chrome).
As far as one-column presentation goes, it may be problematic. I am migrating a very large number of lists (and domains) to Sympa, but some of those domains have over 300 lists,
so it will make a page very very long and hard to navigate, because my tests showed that most of the people prefer scrolling down vs. using little tabs with letters.
And thanks for the pointers to the translation files. I am definitely going to contribute.
My sympa.css is attached. I had to re-arrange some stuff to make it easier for me to navigate, but this file still requires a lot of work.
Oh, and I tried the fix mentioned in this thread and inserted paragraph tags in lists.tt2, but that did not fix my issue.
Thanks,
Igor
@media screen { }
/* @group main */
* {
border: 0px solid #999;
color: #323232;
font-family:Arial, Helvetica, "Trebuchet MS", Myriad, "Gill Sans", "Century Gothic", "Bitstream Vera Sans", verdana, lucida, arial, helvetica, sans-serif;
padding-left: 5px;
padding-right: 5px;
padding-top: 2px;
padding-bottom: 0px;
margin: 0;
}
html {
height:100%;
padding: 0;
margin: 0;
}
body {
font-size: 75%;
background: #f4f4f4;
height:100%;
padding: 0;
margin: 0;
}
ul {
margin: 0 0 0 4em;
}
ol {
margin: 0 0 0 4em;
}
dl {
margin: 0 0 0 1em;
}
/* @end*/
/* @group #ActionHeader */
#ActionHeader {
background: #f4f4f4;
border: 1px solid #f77d18!important;
font-size: 1em;
text-align: left;
vertical-align: top;
padding-bottom: 0px;
padding-top: 5px;
padding-left: 5px;
padding-right: 5px;
padding-bottom: 5px;
margin-bottom: 2em;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-KHTML-border-radius:4px;
-icab-border-radius:4px;
border-radius:4px;
}
#ActionHeader div.text_center h2 {
margin-top: 1em;
margin-left: 0.5em;
border: 0;
}
#ActionHeader span.search_form {
margin-top:1em;
}
#ActionHeader #MainMenuLinks {
margin-top: -0.2em!important;
border-bottom: none;
}
#ActionHeader div.search_form form {
background: #fff;
padding: 0.3em;
margin-top: 0;
border: 1px solid #999;
}
#ActionHeader span.search_form a.ArcMenuLinksSortInactive,
#ActionHeader span.search_form a.ArcMenuLinksSortInactive:hover {
border: 1px solid #f77d18!important;
background: #fff;
color: #f77d18;
text-decoration: none;
padding: 0px 10px 0px 10px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-KHTML-border-radius:5px;
-icab-border-radius:5px;
border-radius:5px;
}
/* @end */
/* ########## Blocks, id and class ########## */
/*Global container*/
/* @group #Canvas */
#Canvas {
min-height: 95%;
position:relative;
width: 98%;
margin: 0 0.8em -5em 0.8em;
}
/* @group #Header */
#Header {
position:relative;
background: none;
border: none;
}
/* @group #bandeau_top */
#bandeau_top {
position: relative;
width:97.5%;
min-height: 2.5em;
margin: 0 1em;
background: #999;
clear: both;
-moz-border-radius: 20px 20px 20px 20px;
-webkit-border-top-left-radius:20px;
-webkit-border-top-right-radius:20px;
-webkit-border-bottom-left-radius:20px;
-webkit-border-bottom-right-radius:20px;
-KHTML-border-radius:20px 20px 20px 20px;
-icab-border-radius:20px 20px 20px 20px;
border-radius:20px 20px 20px 20px;
z-index:2000;
overflow: hidden;
}
#bandeau_top #Identity {
float:left;
width:33%;
text-align: center;
font-family:sans-serif,serif!important;
font-size: 1em;
font-weight: bold;
color:#323232!important;
background: #f4f4f4;
overflow: hidden;
margin-top:0.5em;
margin-left: 0.4em;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-top-left-radius:10px;
-webkit-border-top-right-radius:10px;
-webkit-border-bottom-left-radius:10px;
-webkit-border-bottom-right-radius:10px;
-KHTML-border-radius:10px 10px 10px 10px;
-icab-border-radius:0 0 10px 10px;
border-radius:10px 10px 10px 10px;
}
#bandeau_top #Identity_not_connect {
width:99%;
text-align: left;
font-size: 1em;
font-weight: bold;
font-family:sans-serif,serif!important;
color:#000!important;
overflow: hidden;
margin-left:1em;
}
#bandeau_top #Identity_not_connect form {
text-align: left;
font-size: 1em;
font-weight: bold;
font-family:sans-serif,serif!important;
color:#323232!important;
overflow: hidden;
margin-left: 0em;
}
#bandeau_top #Identity_not_connect .MainMenuLinks {
font-weight:600;
letter-spacing: 0.5em;
margin-top: 0.3em!important;
margin-bottom: 0px!important;
font-size: 1em;
height: 1.3em;
text-align: center;
width: 10%;
color: #323232!important;
background-color:#f4f4f4!important;
border:1px solid #f4f4f4!important;
}
#bandeau_top #Identity_not_connect .MainMenuLinks:hover {
color: #fff!important;
background-color:#f77d18!important;
border:1px solid #f77d18!important;
}
#bandeau_top #Identity_not_connect .remember {
margin-top: -1.7em!important;
float: right;
font-size: 0.9em;
font-family:sans-serif,serif!important;
text-align: right;
font-weight: bold;
color:#fff!important;
width:25%;
}
#bandeau_top #Identity_not_connect label {
color:#000!important;
font-family:sans-serif,serif!important;
}
#bandeau_top #Identity_not_connect input {
border: 1px solid #323232!important;
}
#bandeau_top #Identity span {
font-size: 0.9em;
font-weight: normal;
color:#000!important;
}
#bandeau_top .prefs {
font-size: 1em!important;
font-family:sans-serif,serif!important;
text-align:center;
width:25%;
float:right;
overflow: visible;
border-style: solid;
margin-top: 0.5em;
margin-right: 2.2em;
background: #f4f4f4;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-top-left-radius:10px;
-webkit-border-top-right-radius:10px;
-webkit-border-bottom-left-radius:10px;
-webkit-border-bottom-right-radius:10px;
-KHTML-border-radius:10px 10px 10px 10px;
-icab-border-radius:0 0 10px 10px;
border-radius:10px 10px 10px 10px;
}
#bandeau_top .prefs a:hover {
color: #f77d18!important;
}
#bandeau_top a {
font-family: sans-serif, serif;
color:#323232!important;
text-decoration: none;
font-weight: 600;
border-bottom: 1px dotted #f77d18;
}
#bandeau_top a:hover {
background:none;
border: none;
color:#fff!important;
text-decoration:underline;
}
#bandeau_top .login {
background: #f4f4f4;
float: right;
font-family:sans-serif,serif!important;
color:#fff!important;
width:33%;
height: 1em;
margin-top: 0.5em;
margin-right: 0.4em;
margin-left: 0px;
border:1px solid #f4f4f4!important;
-moz-border-radius: 10px 10px 10px 10px;
-webkit-border-top-left-radius:10px;
-webkit-border-top-right-radius:10px;
-webkit-border-bottom-left-radius:10px;
-webkit-border-bottom-right-radius:10px;
-KHTML-border-radius:10px 10px 10px 10px;
-icab-border-radius:10px 10px 10px 10px;
border-radius:10px 10px 10px 10px;
}
#bandeau_top .login fieldset {
text-align: center;
padding: 0px!important;
margin-top: 0!important;
height: 1.3em;
}
#bandeau_top form {
text-align: center;
margin: 0px;
padding: 0px;
}
#bandeau_top .remember {
float:right;
font-size: 0.9em;
font-family:sans-serif,serif!important;
text-align:right;
font-weight: bold;
color:#fff!important;
width:25%;
}
#bandeau_top .remember a {
margin-right:1em;
}
#bandeau_top .MainMenuLinks {
font-weight:600;
letter-spacing: 0.5em;
margin-top: -0.3em!important;
margin-bottom: 0px!important;
font-size: 1em;
height: 1.3em;
text-align: center;
width: 30%;
color: #323232!important;
background-color:#f4f4f4!important;
border:1px solid #f4f4f4!important;
}
#bandeau_top .MainMenuLinks:hover {
background-color:#f4f4f4!important;
border:1px solid #f4f4f4!important;
color:#f77d18 !important;
margin-top: -3px!important;
text-decoration: none!important;
}
/* @end */
/* @end */
/* @group #Paint */
#single_list {
display: inline-table!important;
}
#Paint {
vertical-align: top;
text-align: center;
}
#Paint a.input {
color: #323232;
background: #f4f4f4;
border: 1px solid #999;
padding-right: 5px!important;
padding-left: 5px!important;
}
#Paint div.ContentBlock div.block {
min-height: 70px;
border: 1px dotted #999;
overflow: auto;
}
#Paint div.ContentBlock div.block div div.block {
min-height: 140px;
height: 100%;
border: 1px solid #999;
margin-top: 4em;
margin-bottom: 1em;
}
#Paint div.ContentBlock div.block div.columns {
overflow: visible;
}
#Paint div.ContentBlock div.block div.columns div {
overflow: hidden!important;
column-break-inside: avoid!important;
page-break-inside: avoid!important;
-webkit-column-break-inside: avoid!important;
}
#Paint div.ContentBlock div.block div.columns div.single_list {
overflow: visible;
}
#Paint div.ContentBlock div.block div.search_form a {
border-bottom: 0!important;
}
#Paint div.ContentBlock div.block div span.search_form form {
margin-top: 0;
padding: 5px;
}
#Paint div.ContentBlock div.block form fieldset table.listOfItems.text_center tbody tr th a {
border-bottom: 1px dotted #f4f4f4;
text-align: left;
padding: 0px!important;
}
#Paint div.listTitle {
margin-top: -1.1em;
margin-bottom: 2em;
background: #ccc;
}
#Paint div.listTitle.description {
margin-top: 0em;
margin-bottom: 0.5em;
}
#Paint div.listTitle.description span {
font-size: 1.5em
}
#Paint div.ContentBlock div.block p font {
font-size: 0.7em;
}
#Paint div.ContentBlock div.block p {
padding: 0.5em;
padding-bottom: 0px;
overflow: visible;
}
#Paint div.ContentBlock div.block form fieldset table.listOfItems.text_center tbody tr td.text_left a:hover {
border: 0!important;
}
/* @end */
/* @end */
/* Menus Block*/
#Menus {
float:left;
width: 20em;
border: 0px solid #999;
margin-top:1em;
padding-top: 0;
text-align: left;
}
#Menus .MenuBlock.menu_search {
padding-top: 0!important;
padding-bottom: 0.3em!important;
}
#Menus div.MenuBlock.without_padding ul.listenum li span {
padding-top: 0.3em;
position: absolute;
}
/*Content Block*/
#Stretcher {
margin-left:21.5em;
margin-top: 1em;
text-align: left;
}
input#quiet {
margin-top: -0.4em;
}
select#directories {
width: 10em;
height: 10em;
margin-bottom: 1em;
}
#msglist input.MainMenuLinks {
margin-top: 1em;
}
#msglist ul li b a {
margin-left: 0.6em;
}
#msglist ul li b a:hover {
margin-left: 0.6em;
border: 0!important;
}
#Clock {
float: right;
padding-right: 3px;
vertical-align:top;
}
#Login {
text-align: left;
padding-left: 5px;
vertical-align:top;
}
#Search input.textbox {
width: 90%;
}
#logo {
position:absolute;
top:0.5em;
left:4em;
z-index:510;
}
/*Robot title*/
#Title {
position:relative;
text-align: center;
font-size:1.8em;
font-weight: bold;
padding:0.3em 0;
margin-top:0em;
margin-left:5em;
z-index:520;
}
#error {
font-size: 1em;
}
select {
color: #323232!important;
background: #fff!important;
border: 1px solid #999!important;
}
.menuInactive2 {
font-size: 1em;
line-height:1.4em;
text-decoration: none;
font-weight:normal;
}
#FormLabel {
font-size: 1.2em;
font-weight: bold;
}
#ArcCalendar {
padding: 0 0 1em 0;
}
ul#MainMenuLinks {
border-bottom: 1px solid #999;
float:right;
width:100%;
}
ul#MainMenuLinks li {
border: none;
list-style: none;
display: inline;
padding-bottom: 0px!important;
overflow: hidden;
}
ul#MainMenuLinks li a.MainMenuLinks {
border: 1px solid #999;
background: #f4f4f4;
color:#323232;
}
ul#MainMenuLinks li a.MainMenuLinks:hover {
color:#323232;
}
#toggleMenu {
float: right;
padding-right: 3px;
}
td.adminmenu {
background: #DEE7F7;
text-align: center;
}
.text_left {
text-align: left;
}
.text_right {
text-align: right!important;
}
td.text_right {
text-align: right;
}
.text_center {
text-align: center;
}
.text_justify {
text-align: justify;
}
.without_padding {
padding:0!important;
}
/* list_panel and list_admin_menu .tt2 block*/
.list_panel,
#list_admin_menu {
font-size: 1.4em;
font-weight: bold;
border: 1px solid #999;
padding:0.5em;
background: #f4f4f4;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-KHTML-border-radius:4px;
-icab-border-radius:4px;
border-radius:4px;
}
.list_panel {
font-size: 1.2em;
margin-bottom:0.5em
}
.list_panel ul,
#list_admin_menu ul {
list-style-type: none;
margin:0 0.5em
}
.list_panel ul li,
#list_admin_menu ul li {
font-size:1em;
line-height:1.4em;
margin-top:0.3em;
}
.list_panel span {
font-weight: normal!important;
}
.list_panel ul li a:hover,
#list_admin_menu ul li a:hover {
color:#f77d18;
text-decoration:none;
}
.list_panel ul li ul,
#list_admin_menu ul li ul {
font-size:0.9em;
}
.list_panel ul li ul li,
#list_admin_menu ul li ul li{
font-size:0.9em;
line-height:1.2em;
margin-top:0em;
}
/* list type on the list creation page */
#list_type {
margin-left: 5em;
list-style-type: none;
}
#list_type dd {
margin-left: 1em;
}
img {
border: 0px;
}
/* Font */
.smaller {
font-size: 11px;
}
.larger {
font-size: larger;
}
span.center {
text-align: center;
}
/* review.tt2 cels */
td.review_cels {
text-align: center;
padding:0 0.2em;
}
td.review_cels_mail {
text-align: left;
padding:0 0 0 0.2em;
}
.search_form, .edit_list_request_help {
float: right;
}
#home_rss_news {
float: right;
}
#home_rss_news input {
background: #f77d18;
border: 1px solid #f77d18!important;
color: #fff;
padding:0.05em 1em;
margin:0.1em;
text-decoration: none;
font-size: 0.9em;
font-weight: 600;
letter-spacing:0.1em;
/* if IE zoom:1;*/
zoom: 1;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-KHTML-border-radius:10px;
-icab-border-radius:10px;
border-radius:10px;
}
#home_rss_news input:hover {
background: #fff;
color: #f77d18;
}
#home_search_list {
clear: both;
}
#home_search_list form fieldset {
display: inline;
vertical-align: middle;
}
#home_container {
padding: 10px;
margin: 0;
border: 1px dashed #999;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-KHTML-border-radius:4px;
-icab-border-radius:4px;
border-radius:4px;
}
.edit_list_request_enum{
margin: 1em;
padding-left: 1em;
text-align: left;
font-size: 1em;
}
/* menu button which allowed to manage your list*/
.list_admin {
font-size: 1em;
}
/*colors*/
.color0 {
background-color: #F4F4F4;
}
.color4 {
background-color: #DEE7F7;
}
.color7 {
background-color: #ff99cc;
}
.color_light {
background-color: #DEE7F7;
}
.color_dark {
color: #DEE7F7;
}
.bg_color_dark {
background-color: #DEE7F7;
}
.color_bg {
color: #ffffce;
}
.bg_color_bg {
background-color: #ffffce;
}
.bg_color_error {
background-color: #ff99cc;
}
.list_menu_links {
font-weight: bold;
font-size: 1.2em;
}
a.list_menu_links:hover {
color:#f77d18;
text-decoration:none;
}
.mailing_lists_menu {
padding: 10px;
margin: 5px 25px 5px 25px;
float: left;
font-size: 1.1em;
text-align: left;
}
ul.no_style {
list-style: none;
}
.align_top {
vertical-align: top;
}
/*explanation bloc of the template "ls_template.tt2"*/
#template_editor {
margin-top: 10px;
}
#template_editor ul {
padding-left: 5px;
}
#template_editor li {
margin: 2px;
}
/*block of the color table*/
#color_table {
border: 1px dotted;
padding-top: 3px;
padding-left: 3px;
padding-bottom: 4px;
}
#color_table th {
border: solid 1px;
text-align: center;
padding: 1px;
}
#color_table td {
border: 1px solid #000;
padding-left: 10px;
}
#color_table .separator {
border: none;
padding: 0px;
background-color: #fff;
}
#color_table tr#color_table_title th {
background-color: #DEE7F7;
}
/*ul of the "help.tt2" template*/
#help {
padding-left: 10px;
padding-top: 5px;
margin-bottom: 20px;
}
#help li {
padding: 1px;
}
/** menu "ul" "li" style **/
#help_editfile, #blaklist {
margin: 1em;
}
#help_editfile ul, #blacklist ul {
padding-left: 1em;
margin-top: 0.5em;
margin-bottom: 0.5em;
}
/*bounce level color*/
.bounce_level2 {
background-color: #F00;
}
.bounce_level1 {
background-color: #FF8C00;
}
/* set_pending_list_request.tt2 template*/
ul#set_pending_radio {
display: inline;
list-style-type: none;
}
ul#set_pending_radio li {
display: inline;
margin-right: 1em;
margin-left: 1em;
}
form {
line-height: 1.8em;
}
form input,
form textarea,
form select {
margin: 0px 0px;
padding: 0px;
font-size: 1em;
border: 1px solid #999;
}
form#logs_form label,
form.bold_label label {
font-weight: bold;
}
form#bold_label input {
margin-left: 5px;
margin-top: 5px;
}
form input[type="radio"],
form input[type="checkbox"] {
vertical-align: middle;
border:none;
}
#global_mailing_lists {
text-align: center;
}
#show_cert {
border: 1px solid;
}
#show_cert ul {
list-style-type: none;
padding-top: 5px;
margin-bottom: 5px;
}
#show_cert ul li {
line-height: 1em;
padding-left: 3px;
}
#cp_template {
border: 1px solid;
padding: 3px;
background-color: #000000;
width: 410px;
}
#cp_template fieldset {
display: inline;
border: 1px solid;
vertical-align: top;
margin-left: 3px;
}
#cp_template legend,
#cp_template label {
padding-left: 3px;
}
/* pre */
pre.code {
font-family: monospace;
}
#Footer {
width:98%;
height:1.5em;
position:relative;
margin: 0 0.8em;
background: #999;
font-family: sans-serif,serif;
font-size: 0.9em;
text-align: center;
padding-top:0.5em;
padding-bottom:0.5em;
-moz-border-radius:10px 10px 0 0;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-left-radius:0px;
-webkit-border-bottom-right-radius:0px;
-KHTML-border-radius:10px 10px 0 0;
-icab-border-radius:10px 10px 0 0;
border-radius:10px 10px 0 0;
}
#Footer a {
color:#f4f4f4;
font-family: sans-serif,serif!important;
font-weight:bold;
font-variant: small-caps!important;
}
#Footer img {
margin:0 0.5em 0 0;
height:20px;
width:20px;
vertical-align:middle;
}
.clearfooter {
height: 3em;
clear: both;
}
#Identity {
text-align: left;
font-size: 1.2em;
font-weight: bold;
overflow: hidden;
}
.Help {
display: none;
position: absolute;
border: 1px dotted #999;
z-index: 1000;
background: #ffffce;
}
#rows_nb {
font-size: 0.8em;
}
#page_size {
float: right;
margin-bottom: 20px;
padding-bottom: 20px;
}
#setlang {
background: #fff;
padding: 0.3em;
text-align: center;
font-weight: bold;
margin-bottom:2em!important;
border:1px solid #999;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-KHTML-border-radius:10px;
-icab-border-radius:10px;
border-radius:10px;
}
#setlang form {
letter-spacing:0.1em;
padding: 0.3em 0;
border:1px dotted #999;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-KHTML-border-radius:4px;
-icab-border-radius:4px;
border-radius:4px;
}
.MenuBlock {
background: #fff;
padding: 0.5em;
text-align: left;
margin-bottom: 1.5em;
border:1px solid #999;
border-width: 1px 1px 1px 1px;
border-top:1px solid #999;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-KHTML-border-radius:10px;
-icab-border-radius:10px;
border-radius:10px;
}
.MenuBlock p strong {
font-size: 1.4em;
}
.MenuBlock h1 {
background: #3366CC;
color:#fff;
text-align: center;
font-size: 1.2em;
letter-spacing:0.1em;
padding:0.1em 0;
margin:0 0 1em 0;
-moz-border-radius:10px 10px 0 0;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-left-radius:0px;
-webkit-border-bottom-right-radius:0px;
-KHTML-border-radius:10px 10px 0 0;
-icab-border-radius:10px 10px 0 0;
}
.MenuBlock strong {
text-indent: 0px;
font-size: 1.2em;
padding-bottom:10px;
}
.ContentBlock {
position: relative;
font-size: 1.1em;
margin: 0;
background: #fff;
padding: 0.3em;
text-align: left;
height: 100%;
border:1px solid #999;
z-index:310;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-KHTML-border-radius:10px;
-icab-border-radius:10px;
border-radius:10px;
}
.ContentBlock p {
padding: 10px;
font-size: 1em;
}
.ContentBlock * {
color: #323232;
padding: 0px;
border: none;
text-align: left;
overflow: visible;
}
.ContentBlock * a {
border-bottom: 1px dotted #999;
overflow: visible;
}
.ContentBlock * strong {
color: #323232;
padding: 0px!important;
overflow: visible;
}
.ContentBlock * strong:hover {
color: #fff!important;
background: #f77d18;
padding: 0px!important;
}
.ContentBlock * a:hover {
background: #f77d18!important;
color: #fff!important;
/* border: 1px solid #f77d18!important; */
text-decoration:none;
text-align: left;
}
.ContentBlock * a img {
border: none!important;
margin-bottom: -0.7em;
padding-top: 0.1em;
padding-bottom: 0.1em;
border: none!important;
}
.ContentBlock * a img:hover {
border: 1px solid #999!important;
background: #f4f4f4;
}
#Paint div.ContentBlock div.block ul li strong a:hover {
border: 0!important;
}
#Paint div.ContentBlock div.block div.search_form a:hover {
background: #f4f4f4!important;
border:none!important;
}
#Paint div.ContentBlock div.block div.search_form a img:hover {
background: #f77d18!important;
border: none!important;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-KHTML-border-radius:4px;
-icab-border-radius:4px;
border-radius:4px;
}
a img.Pictures {
height:30px;
}
a:hover img.Pictures {
height: 80px;
}
.sub_pictures {
margin: 2em;
}
/* pictures block on the suboptions form*/
#pictures_block {
text-align: center;
height: 120px ;
}
#pictures_block div {
margin: 1em;
float: left;
}
#large_picture {
height: 80px;
}
#pictures_block #large img{
height: 80px;
}
#pictures_block #small img{
height: 30px;
margin-top: 50px;
}
.navBar {
position:relative;
text-align: center;
margin: 1em 0 0 0;
font-size: 1.2em;
}
.navBar .MainMenuLinks {
padding:3px 5px 0px 5px!important;
-moz-border-radius:10px 10px 0 0;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-left-radius:0px;
-webkit-border-bottom-right-radius:0px;
-KHTML-border-radius:10px 10px 0 0;
-icab-border-radius:10px 10px 0 0;
border-radius:10px 10px 0 0;
}
.displayNone {
display: none;
height:0px;
width:0px;
}
.printNone {
}
.title {
position: absolute;
top: 60px;
font-size: 1.6em;
text-indent: 30px;
}
.customMenu {
text-indent: 0px;
}
a.dingbat {
text-align: center;
}
.dingbat {
text-indent: 0px;
text-align: center;
font-weight: 100;
}
.button {
background:#DEE7F7 !important;
border: 3px solid;
padding: 0px 2px 0px 2px;
margin:2px;
border-top-color: #99ccff;
border-right-color: #999;
border-bottom-color: #999;
border-left-color: #99ccff;
}
.button:hover {
background: #DEE7F7;
border-top-color: #999;
border-right-color: #99ccff;
border-bottom-color: #99ccff;
border-left-color: #999;
}
.smalltext {
font-size: 0.8em;
}
.smalltext a {
font-size: 0.8em;
}
.smallblacktext {
color: #000;
font-size: 1.2em;
}
.mediumtext {
font-size: 1.2em;
}
.largetext {
font-size: 1.6em;
}
/* ########## Elements ########## */
.MainMenuLinks {
border: 1px solid #323232;
background: #f4f4f4;
color: #323232 ;
text-decoration: none;
padding: 0 5px!important;
vertical-align:top;
cursor:pointer;
-moz-border-radius:10px;
-KHTML-border-radius:10px;
-webkit-border-radius:10px;
-icab-border-radius:10px;
border-radius:10px;
}
a.MainMenuLinks {
border: 1px solid #999!important;
background: #f4f4f4!important;
color:#323232;
text-decoration: none;
padding: 0px 5px 0px 5px;
margin-bottom: 3px;
}
a.MainMenuLinks:hover {
border: 1px solid #f77d18!important;
border-bottom: 1px solid #f77d18!important;
background: #f77d18!important;
color: #fff!important;
text-decoration: none;
padding: 0px 5px 0px 5px;
}
a.MainMenuLinksCurrentPage {
border: 1px solid #999;
background: #f4f4f4;
border-bottom: 1px solid #f4f4f4;
color: #323232;
text-decoration: none;
padding: 3px 5px 0px 5px;
-moz-border-radius:10px 10px 0 0;
-webkit-border-top-left-radius: 10px;
-webkit-border-top-right-radius: 10px;
-webkit-border-bottom-left-radius:0px;
-webkit-border-bottom-right-radius:0px;
-KHTML-border-radius:10px 10px 0 0;
-icab-border-radius:10px 10px 0 0;
border-radius:10px 10px 0 0;
}
a.MainMenuLinksCurrentPage:hover {
border: 1px solid #f77d18!important;
border-bottom: 1px solid #f77d18!important;
background: #f77d18!important;
color: #fff;
text-decoration: none;
}
input.MainMenuLinks {
color: #323232!important;
background: #f4f4f4!important;
border: 1px solid #999!important;
margin-top: 0.2em;
margin-bottom: 0px!important;
}
input.MainMenuLinks:hover {
color: #fff!important;
border: 1px solid #f77d18!important;
background: #f77d18!important;
}
a.actionMenuLinks {
border: 1px solid #999;
background: #f4f4f4!important;
color: #323232!important;
text-decoration: none;
padding: 0 5px!important;
margin: 0 0.5em 0 0;
cursor:pointer;
-moz-border-radius:10px;
-KHTML-border-radius:10px;
-webkit-border-radius:8px;
-icab-border-radius:10px;
border-radius:10px;
}
a.actionMenuLinks:hover {
color: #fff!important;
border: 1px solid #f77d18!important;
background: #f77d18!important;
text-decoration: none;
}
a.actionMenuLinksCurrentPage {
border: 1px solid #333;
background: #99ccff;
color: #3366CC;
text-decoration: none;
padding: 0px 10px 0px 10px;
}
a.actionMenuLinksCurrentPage:hover{
border: 1px solid #333;
background: #99ccff;
text-decoration: none;
padding: 0px 10px 0px 10px;
}
a.actionMenuLinksInactive {
border-bottom: 1px solid #333;
border-right: 1px solid #777777;
border-top: 1px solid #777777;
border-left: 1px solid #777777;
color: #777777;
text-decoration: none;
padding: 0px 10px 0px 10px;
}
a.actionMenuLinksInactive:hover {
border-bottom: 1px solid #333;
border-right: 1px solid #777777;
border-top: 1px solid #777777;
border-left: 1px solid #777777;
color: #777777;
text-decoration: none;
padding: 0px 10px 0px 10px;
}
#actionnuLinksInactive {
border: 0px solid #333;
text-decoration: none;
padding: 0px 0px 0px 3px;
}
a.ArcMenuLinks {
border: 1px solid #333;
text-decoration: none;
padding: 0px 10px 0px 10px;
}
a.ArcMenuLinks,
a.ArcMenuLinks:visited,
a.ArcMenuLinks:link {
border: 1px solid #999;
color: #323232;
background-color:#f4f4f4;
text-decoration: none;
padding: 0px 10px 0px 10px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-KHTML-border-radius:5px;
-icab-border-radius:5px;
border-radius:5px;
}
a.ArcMenuLinks:hover {
background: none;
color: #3366CC;
}
a.ArcMenuLinks:active {
border: 1px solid #333;
background: #99ccff;
color: #3366CC;
text-decoration: none;
padding: 0px 10px 0px 10px;
}
a.ArcMenuLinksCurrentPage {
border: 1px solid #333;
background: #99ccff;
color: #3366CC;
text-decoration: none;
padding: 0px 10px 0px 10px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-KHTML-border-radius:5px;
-icab-border-radius:5px;
border-radius:5px;
}
a.ArcMenuLinksCurrentPage:hover {
border: 1px solid #333;
background: #99ccff;
text-decoration: none;
padding: 0px 10px 0px 10px;
}
a.ArcMenuLinksInactive {
border: 1px solid #999;
color: #323232;
background: #f4f4f4;
text-decoration: none;
padding: 0px 10px 0px 10px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-KHTML-border-radius:5px;
-icab-border-radius:5px;
border-radius:5px;
}
a.ArcMenuLinksInactive:hover {
border: 1px solid #f77d18!important;
color: #fff;
text-decoration: none;
padding: 0px 10px 0px 10px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-KHTML-border-radius:5px;
-icab-border-radius:5px;
border-radius:5px;
}
a.ArcMenuLinksSortActive,
a.ArcMenuLinksSortActive:hover,
a.ArcMenuLinksSortInactive:hover {
border: 1px solid #f77d18!important;
background: #fff;
color: #f77d18;
text-decoration: none;
padding: 0px 10px 0px 10px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-KHTML-border-radius:5px;
-icab-border-radius:5px;
border-radius:5px;
}
a.ArcMenuLinksSortInactive {
border: 1px solid #f77d18;
background: #f77d18;
color: #fff;
text-decoration: none;
padding: 0px 10px 0px 10px;
-moz-border-radius:5px;
-webkit-border-radius:5px;
-KHTML-border-radius:5px;
-icab-border-radius:5px;
border-radius:5px;
}
#ArcMenuLinksInactive {
border: 0px solid #333;
text-decoration: none;
padding: 0px 0px 0px 3px;}
.block {
border: 1px dotted #999;
padding: 7px;
margin-top:0;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-KHTML-border-radius:4px;
-icab-border-radius:4px;
border-radius:4px;
overflow: visible;
}
.block form {
padding-left: 1em;
margin:0.5em 0;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-KHTML-border-radius:4px;
-icab-border-radius:4px;
border-radius:4px;
}
.block form fieldset {
padding:0.5em;
text-indent:0px;
}
h1.block,
h2.block,
h3.block,
h4.block,
h5.block,
h6.block {
text-align: center;
background: #f4f4f4;
margin-bottom: 5px;
}
.block span.default {
color: #999;
padding-left: 2em;
font-weight: bold;
}
h7 {
font-size: 0.8em;
font-style: italic;
}
h7 strong {
font-size: 1em;
}
.listTitle {
position:relative;
height: 1%;
width: 99.5%;
text-align: center;
border: 1px solid #999;
padding: 2px 0px;
background: #ffffce;
font-size:1.3em;
margin:0 auto;
-moz-border-radius:10px;
-KHTML-border-radius:10px;
-webkit-border-radius:10px;
-icab-border-radius:10px;
border-radius:10px;
}
.listTitle a,
.listTitle a:hover {
color:#323232;
font-weight:bold;
letter-spacing: 0.1em;
text-decoration:none;
background:none!important;
border:none!important;
}
.listTitle.description {
font-size:1.5em;
font-weight:bold;
margin-top:1em;
margin-bottom:1.3em;
background:none!important;
border:none;
}
.listTitle.description span {
color:#f77d18;
}
#ErrorBlock {
margin:0;
padding:0;
position:absolute;
left:0;
top:0;
z-index:600;
background: #f4f4f4;
opacity:0.8;
width:100%;
height:100%;
}
#ErrorMsg {
position:absolute;
width:60%;
margin:20% 19%;
z-index:610!important;
border: 5px solid #999!important;
font-family:sans-serif,serif;
font-size: 1.6em;
font-weight: bold;
text-align: center;
color: #323232!important;
background-color: #f77d18;
padding:1em 0.5em;
-moz-border-radius:20px;
-webkit-border-radius:20px;
-KHTML-border-radius:20px;
-icab-border-radius:20px;
border-radius:20px;
}
#ErrorMsg .MainMenuLinks {
color:#323232!important;
background-color:#fff;
border:2px solid #999!important;
padding: 0 1.8em!important;
margin-top:1em;
font-size: 0.7em;
font-weight:bold;
-moz-border-radius:20px;
-webkit-border-radius:20px;
-KHTML-border-radius:20px;
-icab-border-radius:20px;
border-radius:20px;
}
#ErrorMsg .MainMenuLinks:hover {
background-color:#f77d18!important;
border:2px solid #fff!important;
color:#fff!important;
}
#noticeMsg {
margin-top: 0em;
margin-bottom: 0.5em;
width:98%;
border: 1px solid #999;
font-famillly:sans-serif,serif;
font-size: 1.6em;
font-weight: bold;
text-align:center;
color:#f77d18!important;
background-color: #ffffce;
padding:1em 0.5em;
-moz-border-radius:20px;
-webkit-border-radius:20px;
-KHTML-border-radius:20px;
-icab-border-radius:20px;
border-radius:20px;
}
#noticeMsg .MainMenuLinks {
color:#000;
background-color:#fff;
border:2px outset #000;
padding: 0 2em!important;
margin-top:1em;
font-size: 0.8em;
-moz-border-radius:20px;
-webkit-border-radius:20px;
-KHTML-border-radius:20px;
-icab-border-radius:20px;
border-radius:20px;
}
#noticeMsg .MainMenuLinks:hover {
background-color:#000!important;
border:2px inset #fff;
color:#fff!important;
}
p.listenum {
margin: 0 0 0.5em 1.5em;
padding:0.3em 0 0 0.5em;
font-size:0.9em;
break-inside: avoid-column!important;
}
ul.listenum {
list-style: none;
margin: 0 0 0 1em;
break-inside: avoid!important;
}
ul.listenum li {
padding: 0.5em;
overflow: hidden;
}
ul.listenum li a.actionMenuLinks {
background: #f4f4f4;
color: #323232;
font-size:1em;
padding:0.1em 0.4em!important;
overflow: auto;
}
ul.listenum li a.actionMenuLinks:hover {
background: #f77d18!important;
color:#fff!important;
border: 1px solid #f77d18!important;
padding:0.1em 0.4em!important;
}
div.admin_cmd {
float:left;
margin: 0em 0.3em 0.1em 0;
padding-left: 0.3em;
padding-right: 0.3em;
font-size: 1.1em;
background: #f77d18;
border: 1px solid #f77d18;
-moz-border-radius:8px;
-webkit-border-radius:8px;
-KHTML-border-radius:8px;
-icab-border-radius:8px;
border-radius:8px;
}
div.admin_cmd a {
color: #fff;
background: #f77d18;
padding: 0px;
font-size: 0.7em;
font-weight:bold;
border: none;
}
div.admin_cmd a:hover {
font-weight:bold;
color: #f77d18!important;
background: #fff!important;
border: none!important;
}
div.admin_cmd:hover {
background: #fff!important;
color: #f77d18!important;
border: 1px solid #f77d18;
}
div.admin_cmd:hover a {
background: #fff!important;
color: #f77d18!important;
}
ul li.menuLinksCurrentPage a {
color:#f77d18!important;
}
ul.calendar {
margin-left:0!important;
padding-left:0!important;
}
ul.calendar a {
font-size: 1em;
}
ul.calendar li {
list-style: none;
display: inline;
line-height: 2em;
font-size: 1em;
text-decoration: none;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-KHTML-border-radius:4px;
-icab-border-radius:4px;
border-radius:4px;
}
ul li.calendarLinks {
border: 1px solid #f77d18;
background: #fff;
padding-top: 1px;
padding-bottom: 1px;
}
ul li.calendarLinks:hover {
background: #f77d18;
color: #fff;
border: 1px solid #f77d18;
}
ul li.calendarLinks a {
color: #f77d18;
background: #fff;
border: none!important;
border-radius:2px;
padding: 1px 4px 1px 4px;
text-decoration: none;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-KHTML-border-radius:4px;
-icab-border-radius:4px;
border-radius:4px;
}
ul li.calendarLinks a:hover {
color: #fff!important;
border: 0!important;
}
ul li.calendarLinksCurrentPage {
border: 1px solid #f77d18!important;
padding-top: 1px;
padding-bottom: 1px;
background: #f77d18;
}
ul li.calendarLinksCurrentPage:hover {
border: 1px solid #f77d18!important;
background: #fff!important;
}
ul li.calendarLinksCurrentPage a {
background: #f77d18;
color: #fff!important;
border-bottom:1px solid #f77d18!important;
padding: 1px 4px 1px 4px;
text-decoration: none;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-KHTML-border-radius:4px;
-icab-border-radius:4px;
border-radius:4px;
}
ul li.calendarLinksCurrentPage a:hover {
background: #fff!important;
color: #f77d18!important;
border: none!important;
}
ul li.calendarLinksInactive {
background: #ccc;
border: 1px solid #999;
color: #999;
padding: 1px 4px 1px 4px;
text-decoration: none;
-moz-border-radius:4px;
-webkit-border-radius:4px;
-KHTML-border-radius:4px;
-icab-border-radius:4px;
border-radius:4px;
}
ul li.calendarYear {
background: #000;
border: 1px solid #000;
font-weight: bold;
color: #fff;
padding-left: 0.2em;
padding-right: 0.2em;
}
a img {
border: 0px;
}
a {
text-decoration: none;
}
a:link {
text-decoration: none;
}
a:visited {
text-decoration: none;
}
a:hover {
color: #f77d18;
text-decoration:underline;
background:none;
}
abbr,
acronym,
.info {
border-bottom: 1px dotted #3366CC;
cursor: help;
}
h1 a:hover {
text-indent: 30px;
font-size: 1.6em;
padding-bottom:10px;
}
p a:hover {
text-indent: 30px;
}
p a:first-letter {
font-size: 1.6em;
font-weight: bold;
}
p {
text-indent: 0px;
}
p.spacer {
clear: both;
}
code {
font-weight: bold;
}
.retraitita {
background-color: #ffffce;
border: 1px dashed #999;
padding: 2px 2px 2px 2px;
margin: 5px 5px 5px 5px;
}
span.retraitita {
background-color: #ffffce;
border: 1px dashed #999;
padding: 5px 10px 5px 10px;
margin: 5px 5px 5px 5px;
display: block;
}
h1 {
text-indent: 10px;
margin-top: 10px;
font-size: 1.8em;
}
h2 {
color: #f77d18;
text-indent: 10px;
margin-top: 10px;
font-size: 1.4em;
}
h3 {
color: #000;
text-indent: 10px;
margin-top: 10px;
font-size: 1.2em;
}
h4 {
color: #323232;
text-indent: 0px;
margin-top: 10px;
font-size: 1.2em;
padding-bottom: 10px!important;
}
h5 {
color: #3366CC;
text-indent: 30px;
margin-top: 15px;
margin-bottom: 2px;
font-size: 1em;
}
h6 {
color: #3366CC;
text-indent: 40px;
margin-top: 10px;
font-size: 1em;
}
/* input */
a.input {
background: #999;
border: 1px solid #999;
color: #fff;
padding: 0.2em 0.3em;
margin-left:0.2em;
text-decoration: none;
vertical-align: middle;
font-size: 0.9em;
font-weight:bold;
font-variant:small-caps;
/* if IE zoom:1;*/
zoom: 1;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-KHTML-border-radius:10px;
-icab-border-radius:10px;
border-radius:10px;
}
a.input:hover {
background: #f77d18;
color: #fff;
border: 1px solid #f77d18!important;
}
h2 a.input {
font-size: 0.7em;
}
input {
background: #f4f4f4;
border: 1px solid #999!important;
padding: 0.2em!important;
}
input[type="radio"],
input[type="checkbox"] {
margin-bottom: 0;
}
textarea {
background: #f4f4f4;
border: 1px solid #999!important;
padding: 3px;
}
textarea:hover {
background: #fff;
}
textarea.desc {
width: 75%;
max-width: 500px;
}
textarea.textbox {
background: #99ccff;
border: 1px solid #333;
padding: 3px;
}
textarea.textbox:hover {
background: #99ccff;
}
input.textbox {
background: #99ccff;
border: 1px solid #333;
padding: 3px;
}
input.textbox:hover {
background: #99ccff;
}
input.button {
background:#DEE7F7!important;
border: 1px solid;
padding: 0px 2px 0px 2px;
margin:2px;
border-top-color: #99ccff;
border-right-color: #999;
border-bottom-color: #999;
border-left-color: #99ccff;
}
input.button:hover {
background: #DEE7F7;
border-top-color: #999;
border-right-color: #99ccff;
border-bottom-color: #99ccff;
border-left-color: #999;
}
/* Tables */
/* default table style */
table.table_style,
table.listOfItems,
table.ls_template {
border: 1px solid #999!important;
background-color:#f4f4f4;
width: auto;
margin: 10px;
font-size: 1em;
-moz-border-radius: 5px;
-webkit-border-radius:5px;
-KHTML-border-radius:5px;
-icab-border-radius:5px;
border-radius:5px;
}
table.listOfItems {
overflow: scroll;
}
table.listOfItems td {
font-size: smaller;
border:1px solid #999;
text-align: center;
padding-right: 1em;
padding-left: 1em;
}
table.listOfItems tr {
border:1px solid #323232;
}
table.listOfItems th {
background-color: #999;
border: 1px solid #323232!important;
color:#fff;
padding-left: 5px;
padding-right: 5px;
border:solid 1px;
text-align: center;
white-space: nowrap;
}
table.listOfItems th a {
color:#fff;
}
table.listOfItems th a:hover {
color: #f77d18;
border-bottom: 1px dotted #fff!important;
}
table.listOfItems th:hover {
color: #fff;
background: #f77d18;
}
table.listOfItems th.sortby {
background-color: #f77d18;
color:#fff;
border: 1px solid #999;
}
table.pending_lists {
border: 1px solid;
width: auto;
margin: 10px;
}
table.pending_lists th {
padding: 3px;
border: 1px solid;
}
table.pending_lists th.title_pending {
padding: 10px;
}
table.ls_template th {
padding: 3px;
border: solid 1px;
background: #DEE7F7;
text-align: center;
}
/*pref.tt2 template - maybe to delete*/
table.preferences {
border: none;
border-spacing: 0.5em;
font-size: 1em;
}
table.preferences th {
font-weight: normal;
white-space: nowrap;
}
#table_container {
overflow: auto;
}
/* test relookage */
/* A modified version of A List Apart - http://alistapart.com/articles/slidingdoors2/ */
#nav {
position:relative;
float:left;
width:100%;
margin:-1.6em 0 0 0.5em;
clear:right;
z-index:350;
}
#nav ul {
height:1.4em;
margin:0;
padding: 0;
list-style:none;
}
#nav ul li {
float:left;
min-width:0.7em;
display:inline;
margin:0 0 0.2em 0.5em;
border:1px solid #999;
border-bottom:1px solid #999;
-moz-border-radius:9px 9px 0 0;
-webkit-border-top-left-radius:9px;
-webkit-border-top-right-radius:9px;
-webkit-border-bottom-left-radius:0;
-webkit-border-bottom-right-radius:0;
-KHTML-border-radius:9px 9px 0 0;
-icab-border-radius:9px 9px 0 0;
border-radius:9px 9px 0 0;
}
#nav li.MainMenuLinks {
color:#323232;
font-weight:normal;
background-color:#f4f4f4;
padding-top: 0.2em!important;
}
#nav li.MainMenuLinks a {
color: #323232;
}
#nav li.MainMenuLinks a:hover {
color: #fff!important;
background: #f77d18;
text-decoration:none!important;
margin-left: 0px!important;
}
#nav li.MainMenuLinks:hover {
color:#fff!important;
background-color: #f77d18;
border:1px solid #f77d18;
border-bottom:1px solid #f77d18;
z-index:300;
}
#nav li.MainMenuLinks:hover a {
color:#fff!important;
background-color: #f77d18;
border:none!important;
border-bottom:1px solid #f77d18;
z-index:300;
}
#nav li.MainMenuLinksCurrentPage {
font-weight:normal;
border:1px solid #999;
border-bottom:1px solid #fff;
background-color: #fff;
padding-top: 0.2em!important;
}
#nav li.MainMenuLinksCurrentPage a {
color: #323232;
/*border-bottom: 1px solid #f77d18;*/
}
#nav li.MainMenuLinksCurrentPage a:hover {
text-decoration:none!important;
background-color: #f77d18;
color: #fff!important;
}
#nav li.MainMenuLinksCurrentPage:hover {
color: #fff;
background-color: #f77d18;
border:1px solid #f77d18;
border-bottom:1px solid #f77d18;
z-index:300;
}
#nav li.MainMenuLinksCurrentPage:hover a {
color: #fff;
background-color: #f77d18;
border:none!important;
border-bottom:1px solid #f77d18;
z-index:300;
}
#nav li.nolink{
background-color: #999;
color:#323232;
min-width:0.9em;
padding:0.2em 0.4em 0em 0.4em;
-moz-border-radius:10px 10px 0 0;
-webkit-border-top-left-radius:9px;
-webkit-border-top-right-radius:9px;
-webkit-border-bottom-left-radius:0;
-webkit-border-bottom-right-radius:0;
-KHTML-border-radius:10px 10px 0 0;
-icab-border-radius:10px 10px 0 0;
border-radius:10px 10px 0 0;
border-bottom: 1px solid #fff!important;
}
#nav > ul a {width:auto;}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#nav a {float:none;}
/* End IE5-Mac hack */
/* A modified version of A List Apart - http://alistapart.com/articles/slidingdoors2/ */
#nav-lists {
position:relative;
float:left;
width:100%;
margin:-1.6em 0 0 0;
clear:right;
z-index:350;
}
#nav-lists ul {
height:1.4em;
margin:0;
margin-top: 0.2em;
padding: 0;
list-style:none;
overflow: hidden;
}
#nav-lists ul li {
float:left;
min-width:0.7em;
display:inline;
margin:0 0 0.2em 0.5em;
padding:0.1em 0.2em;
border:1px solid #999;
border-bottom:1px solid #fff;
-moz-border-radius:10px 10px 0 0;
-webkit-border-top-left-radius:9px;
-webkit-border-top-right-radius:9px;
-webkit-border-bottom-left-radius:0;
-webkit-border-bottom-right-radius:0;
-KHTML-border-radius:10px 10px 0 0;
-icab-border-radius:10px 10px 0 0;
border-radius:10px 10px 0 0;
}
#nav-lists li.MainMenuLinks {
font-weight:normal;
background-color:#fff;
padding-top:0.2em!important;
border-bottom: 1px solid #fff!important;
padding-bottom: 1em;
}
#nav-lists li.MainMenuLinks a {
color: #323232;
border-bottom: 1px solid #fff!important;
}
#nav-lists li.MainMenuLinks a:hover {
color:#fff!important;
text-decoration:none!important;
border-bottom:1px solid #f77d18!important;
}
#nav-lists li.MainMenuLinks:hover {
color: #fff;
background: #f77d18;
border:1px solid #f77d18!important;
border-bottom:1px solid #f77d18;
z-index:300;
}
#nav-lists li.MainMenuLinks:hover a {
color: #fff;
border:none;
border-bottom:1px solid #f77d18!important;
z-index:300;
}
#nav-lists li.MainMenuLinksCurrentPage {
font-weight:normal;
border:1px solid #999;
border-bottom:1px solid #fff;
background-color: #fff;
}
#nav-lists li.MainMenuLinksCurrentPage a {
color:#323232;
padding:0.1em 0.4em;
border: 1px solid #999!important;
border-bottom: 1px solid #fff;
}
#nav-lists li.MainMenuLinksCurrentPage a:hover {
text-decoration:none!important;
color:#323232;
border-bottom: 1px solid #f77d18;
}
#nav-lists li.MainMenuLinksCurrentPage:hover {
border-bottom:1px solid #f77d18;
border-right:1px solid #3366CC;
z-index:300;
}
#nav-lists li.nolink{
background-color: transparent;
color: transparent;
min-width:0.9em;
padding:0.2em 0.4em 0em 0.4em;
border: 0;
}
#nav-lists > ul a {width:auto;}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
#nav-lists a {float:none;}
/* End IE5-Mac hack */
/* not for IE5.x or IE6 */
#subnav {
background-color: transparent;
position:relative;
float:left;
width:99.9%;
margin:0 0 0 0;
z-index:400!important;
}
#subnav ul {
font-size:0.9em;
margin:1em 0 0 2em;
padding: 0;
list-style:none;
}
#subnav ul li {
float:left;
display:inline;
margin:0 0.5em 0.2em 0.2em;
background-color:#fff;
-moz-border-radius:10px;
-KTML-border-radius:10px;
-webkit-border-radius:8px;
-icab-border-radius:10px;
border-radius:10px;
}
#subnav ul li.MainMenuLinks{
background-color:#f4f4f4;
padding:0 1em!important;
border:1px solid #999;
font-size: 1.1em;
}
#subnav ul li.MainMenuLinks a {
text-decoration:none;
color:#323232;
}
#subnav ul li.MainMenuLinks a:hover {
text-decoration:none;
color:#323232;
}
#subnav ul li.MainMenuLinks:hover {
color:#fff;
border: 1px solid #f77d18;
}
#subnav ul li.MainMenuLinks:hover a {
color:#fff;
}
#subnav ul li.MainMenuLinks:hover{
text-decoration:none;
background-color:#f77d18!important;
}
#subnav ul li.MainMenuLinksCurrentPage{
background-color:#f77d18;
padding:0 1em!important;
color: #fff!important;
border:1px solid #f77d18;
font-size: 1.1em;
}
#subnav ul li.MainMenuLinksCurrentPage a {
color: #fff;
text-decoration:none;
}
.columns {
-moz-column-width: auto;
-moz-column-count: 2;
-moz-column-gap:1em;
-moz-column-rule: 1px solid #999;
-webkit-column-width: auto;
-webkit-column-count: 2;
-webkit-column-gap: 1em;
-webkit-column-rule: 1px solid #999;
-icab-column-width: auto;
-icab-column-count: 2;
-icab-column-gap:1em;
-icab-column-rule: 1px solid #999;
column-width:auto;
column-count: 2;
column-gap:1em;
column-rule: 1px solid #999;
overflow: visible;
}
.menu_search {
width:100%;
border: 1px solid #999;
border-width: 1px 1px 1px 1px;
background:#fff;
padding:0.5em 0 0.5em 0;
text-align:center;
}
.menu_search input {
padding: 0 1px;
}
.menu_search input.MainMenuLinks {
height: 1.5em;
margin-left: 5px;
border: 1px solid #f77d18;
background: #fff;
color:#f77d18;
padding-left: 3px;
padding-right: 3px;
font-size:0.9em;
font-weight:600;
letter-spacing: 0.1em;
-moz-border-radius:10px;
-webkit-border-radius:10px;
-KHTML-border-radius:10px;
-icab-border-radius:10px;
border-radius:10px;
}
.menu_search input.MainMenuLinks:hover {
border: 1px solid #f77d18;
background: #f77d18!important;
color:#fff!important;
}
span.bottom_page {
font-size: 0.6em;
font-weight: normal;
}
.top {
float:right;
margin:0.5em 1em 1.5em 1em;
}
.noborder {
border: none!important;
}On Mar 3, 2010, at 1:51 AM, David Verdin wrote:
Hi Igor,
So many things about that thread...
First : You said you rebuilt entirely your CSS. Would it be possible to see your CSS ? I think it would be great to propose alternate skins to Sympa users. If you agreed and your CSS is developped enough to be a full alternative to the default distributed with Sympa, we could propose it in the contributions section. Please let we know if you're interested.
Second: Considering the fair amount of work you did about this issue, without, it seems, fixing it in a way that definitively satisfies you, we may change the paradigm. I tend to conclude that the two-cloumns presentation id not solid enough to be cross-platform, or cross-browser at least. I wonder if we should not simply change the way the list of lists is displayed. In other words: let's go back to one-column presentation and everybody will live happily ever after. What do you think?
Third: The English thing... Yes, we know our English is awful. But we have a solution: we did an internationalization catalogue from English to English. A quick word on internationalization in Sympa: the English character strings are written in the code and are thus used as keys for the other translations. Modifying them would then invalidate their translations for all the other languages. That's why we use a catalogue to fix pure English problems. Roger Klorese (who frequently posts on this list) offered recently to work on this issue, so you may contact him first to check what work he did yet.
You can download the catalogue here: http://pootle.sympa.org/en_US/sympa/sympa-en_US.zip. The file to modify is sympa.po.
Once you're done translating in correct English, you can send us the result, we'll integrate it to the next Sympa release.
You can also translate directly in our online translation tool: http://pootle.sympa.org/
Best regards,
David
Igor Pruchanskiy a écrit :Hm... I guess my fix does not work when search returns a single result. However, it works ok everywhere else. What I had to do is to wrap each list definition (including buttons) into a div id called "single_list" in lists.tt2 (search_lists.tt2 is just a symlink to it) and then added this to .css file: #single_list { display: inline-table !important; } This stopped the buttons from appearing on top of the second column, while the list definition is at the bottom of the first one. -i On Feb 24, 2010, at 6:01 AM, Robert Beer wrote:Have either of you folks made any progress on this issue of the misaligned lists? I also discovered that search box will render lists incorrectly. That is from: ~sympa/default/web_tt2/search_list.tt2 The sympa-users list has been pretty quite about the topic after the posts we made. -- Bob Beer <address@concealed> Ohio Northern University, Information Technology, Ada, OH 45810
-
Re: [sympa-users] Re: Misaligned list-of-lists in Sympa,
David Verdin, 03/03/2010
- Re: [sympa-users] Re: Misaligned list-of-lists in Sympa, Igor Pruchanskiy, 03/10/2010
Archive powered by MHonArc 2.6.19+.