web/data/cubicweb.css
changeset 5478 c52124b7a00e
parent 5477 f79c39be0b9b
child 5479 6ba3587c5cda
equal deleted inserted replaced
5477:f79c39be0b9b 5478:c52124b7a00e
     7 /***************************************/
     7 /***************************************/
     8 /* xhtml tags                          */
     8 /* xhtml tags                          */
     9 /***************************************/
     9 /***************************************/
    10 
    10 
    11 /* scale and rhythm cf http://lamb.cc/typograph/ */
    11 /* scale and rhythm cf http://lamb.cc/typograph/ */
    12 body { font-size:100%; line-height:1.25; }
    12 body {
       
    13   font-family:  Verdana,sans-serif;
       
    14   font-size: 12px;
       
    15   line-height: 1.5;
       
    16 }
    13 h1, h2, h3 { margin-top:0; margin-bottom:0; }
    17 h1, h2, h3 { margin-top:0; margin-bottom:0; }
    14 
    18 
       
    19 /* got rhythm ? beat of 12*1.25 = 15 px */
       
    20 .rhythm_bg { background: url(/data/rhythm18.png) repeat ! important; }
       
    21 
       
    22 /* scale 3:5 stranded */
       
    23 /* h1 { font-size:2em; } */
       
    24 /* h2 { font-size:1.61538em; } */
       
    25 /* h3 { font-size:1.23077em; } */
       
    26 
       
    27 /* scale le corbusier */
       
    28 /* h1 { font-size:2.11538em; } */
       
    29 /* h2 { font-size:1.61538em; } */
       
    30 /* h3 { font-size:1.30769em; } */
       
    31 
    15 /* scale traditional */
    32 /* scale traditional */
    16 h1 { font-size:1.5em; padding:1.45833em 0; }
    33 h1 { font-size: 1.5em; }
    17 h2 { font-size:1.33333em; padding:1.25em 0; }
    34 h2 { font-size: 1.33333em; }
    18 h3 { font-size:1.16667em; padding:1.51785em 0; }
    35 h3 { font-size: 1.16667em; }
    19 .rhythm_bg { background: url(/data/rhythm20.png) repeat ! important; }
    36 
    20 
    37 /* paddings */
    21 /* scale 3:5 stranded */
    38 h1 {
    22 /* h1 { font-size:2em; padding:1.25em 0; } */
    39     border-bottom: 0.06em solid black;
    23 /* h2 { font-size:1.61538em; padding:1.30936em 0; } */
    40     padding-top: 0.9em;
    24 /* h3 { font-size:1.23077em; padding:1.40579em 0; } */
    41     margin-bottom: 0.44em;
    25 /* .rhythm_bg { background: url(/data/rhythm20.png) repeat ! important; } */
    42 }
    26 
    43 h2 { padding: 0.4em 0 0.25em 0; }
    27 /* scale le corbusier */
    44 h3 { padding: 0.5em 0 0.57em 0; }
    28 /* h1 { font-size:2.11538em; padding:1.44305em 0; } */
       
    29 /* h2 { font-size:1.61538em; padding:1.30936em 0; } */
       
    30 /* h3 { font-size:1.30769em; padding:1.28686em 0; } */
       
    31 /* .rhythm_bg { background: url(/data/rhythm20.png) repeat ! important; } */
       
    32 
    45 
    33 html, body {
    46 html, body {
    34   background: #e2e2e2;
    47   background: #e2e2e2;
    35 }
    48 }
    36 
    49 
    37 a, a:active, a:visited, a:link {
    50 a, a:active, a:visited, a:link {
    38   color: #ff4500;
    51   color: #ff4500; /*  XXX make this configurable */
    39   text-decoration: none;
    52   text-decoration: none;
    40 }
    53 }
    41 
    54 
    42 a:hover{
    55 a:hover{
    43   text-decoration: underline;
    56   text-decoration: underline;
    44 }
    57 }
    45 
    58 
    46 /* a img, img { */
       
    47 /*   border: none; */
       
    48 /*   text-align: center; */
       
    49 /* } */
       
    50 
       
    51 /* p { */
       
    52 /*   margin: 0em 0px 0.2em; */
       
    53 /*   padding-top: 2px; */
       
    54 /* } */
       
    55 
       
    56 /* table, td, input, select{ */
       
    57 /*   font-size: 100%; */
       
    58 /* } */
       
    59 
       
    60 table {
    59 table {
    61   border: none;
    60   border: none;
    62 }
    61 }
    63 
    62 
    64 table th, table td {
    63 table th, table td {
    65   vertical-align: top;
    64   vertical-align: top;
    66 }
    65 }
    67 
    66 
    68 /* table td img { */
       
    69 /*   vertical-align: middle; */
       
    70 /*   margin-right: 10px; */
       
    71 /* } */
       
    72 
       
    73 /* ol { */
       
    74 /*   margin: 1px 0px 1px 16px; */
       
    75 /* } */
       
    76 
       
    77 /* ul{ */
       
    78 /*   margin: 1px 0px 1px 4px; */
       
    79 /* } */
       
    80 
       
    81 /* ul li { */
       
    82 /*   margin-top: 2px; */
       
    83 /*   padding: 0px 0px 2px 8px; */
       
    84 /*   background: url("bullet_orange.png") 0% 6px no-repeat; */
       
    85 /* } */
       
    86 
       
    87 /* dt { */
       
    88 /*   font-size:1.17em; */
       
    89 /*   font-weight:600; */
       
    90 /* } */
       
    91 
       
    92 /* dd { */
       
    93 /*   margin: 0.6em 0 1.5em 2em; */
       
    94 /* } */
       
    95 
       
    96 /* fieldset { */
       
    97 /*   border: none; */
       
    98 /* } */
       
    99 
       
   100 /* legend { */
       
   101 /*   padding: 0px 2px; */
       
   102 /*   font: bold 1em Verdana, sans-serif; */
       
   103 /* } */
       
   104 
       
   105 /* input, textarea { */
       
   106 /*   padding: 0.2em; */
       
   107 /*   vertical-align: middle; */
       
   108 /*   border: 1px solid #ccc; */
       
   109 /* } */
       
   110 
       
   111 input:focus {
    67 input:focus {
   112   border: 1px inset #ff7700;
    68   border: 1px inset #ff7700;
   113 }
    69 }
   114 
    70 
   115 label, .label {
    71 label, .label {
   116   font-weight: bold;
    72   font-weight: bold;
   117 }
    73 }
   118 
    74 
   119 pre {
    75 pre {
   120   font-family: Courier, "Courier New", Monaco, monospace;
    76   clear: both;
   121 /*   font-size: 100%; */
    77   font-family: 'Courier New', monospace;
   122 /*   color: #000; */
    78   letter-spacing: 0.015em;
   123 /*   background-color: #f2f2f2; */
    79   padding: 0.5em;
   124 /*   border: 1px solid #ccc; */
    80   margin: 0 1.5em 1.5em;
   125 }
    81   background-color: #F0F0F0;
   126 
    82   border: 1px solid #CCBCA7;
   127 /* code { */
    83 }
   128 /*   font-size: 120%; */
    84 
   129 /*   color: #000; */
    85 p {
   130 /*   background-color: #f2f2f2; */
    86   text-align: justify;
   131 /*   border: 1px solid #ccc; */
    87   margin-bottom: 1.5em;
   132 /* } */
    88 }
   133 
    89 
   134 /* blockquote { */
    90 ol, ul {
   135 /*   font-family: Courier, "Courier New", serif; */
    91   list-style-type: disc;
   136 /*   font-size: 120%; */
    92   margin-bottom: 1.25em;
   137 /*   margin: 5px 0px; */
    93 }
   138 /*   padding: 0.8em; */
    94 
   139 /*   background-color: #f2f2f2; */
    95 p + ul {
   140 /*   border: 1px solid #ccc; */
    96   margin-top: -1.5em;
   141 /* } */
    97 }
       
    98 
       
    99 li {
       
   100   margin-left: 1.5em;
       
   101 }
       
   102 
       
   103 fieldset {
       
   104   border: none;
       
   105 }
       
   106 
       
   107 h2 a, h2 a:active, h2 a:visited, h2 a:link,
       
   108 h3 a, h3 a:active, h3 a:visited, h3 a:link {
       
   109   color: inherit;
       
   110   text-decoration: none;
       
   111 }
   142 
   112 
   143 /***************************************/
   113 /***************************************/
   144 /* generic classes                     */
   114 /* generic classes                     */
   145 /***************************************/
   115 /***************************************/
   146 
   116 
   152   background-color: transparent;
   122   background-color: transparent;
   153 }
   123 }
   154 
   124 
   155 .hr {
   125 .hr {
   156   border-bottom: 1px dotted #ccc;
   126   border-bottom: 1px dotted #ccc;
   157   margin: 1em 0px;
   127   margin: 19px 0px 20px 0px;
   158 }
   128 }
   159 
   129 
   160 .left {
   130 .left {
   161   float: left;
   131   float: left;
   162 }
   132 }
   172 .hidden {
   142 .hidden {
   173   display: none;
   143   display: none;
   174   visibility: hidden;
   144   visibility: hidden;
   175 }
   145 }
   176 
   146 
   177 li.invisible { list-style: none; background: none; padding: 0px 0px
   147 li.invisible {
   178 1px 1px; }
   148   list-style: none;
       
   149   background: none;
       
   150   padding: 0px 0px 1px 1px;
       
   151 }
   179 
   152 
   180 li.invisible div{
   153 li.invisible div{
   181   display: inline;
   154   display: inline;
   182 }
   155 }
   183 
   156 
   189 /* header */
   162 /* header */
   190 
   163 
   191 table#header {
   164 table#header {
   192   background: #ff7700 url("banner.png") left top repeat-x;
   165   background: #ff7700 url("banner.png") left top repeat-x;
   193   text-align: left;
   166   text-align: left;
       
   167   height: 45px; /* height counts in font-size -> 2.5*16 = 40 */
   194 }
   168 }
   195 
   169 
   196 table#header td {
   170 table#header td {
   197   vertical-align: middle;
   171   vertical-align: middle;
   198 }
   172 }
   199 
   173 
   200 table#header a {
   174 table#header a {
   201 color: #000;
   175   color: #000;
       
   176 }
       
   177 
       
   178 table#header img#logo{
       
   179   vertical-align: middle;
   202 }
   180 }
   203 
   181 
   204 span#appliName {
   182 span#appliName {
   205  font-weight: bold;
   183   font-weight: bold;
   206  color: #000;
   184   color: #000;
   207  white-space: nowrap;
   185   white-space: nowrap;
   208 }
   186 }
   209 
   187 
   210 table#header td#headtext {
   188 table#header td#headtext {
   211   width: 100%;
   189   width: 100%;
   212 }
   190 }
   213 
   191 
   214 /* FIXME appear with 4px width in IE6 */
       
   215 div#stateheader{
       
   216   min-width: 66%;
       
   217 }
       
   218 
       
   219 /* Popup on login box and userActionBox */
   192 /* Popup on login box and userActionBox */
   220 div.popupWrapper{
   193 div.popupWrapper{
   221  position:relative;
   194   position:relative;
   222  z-index:100;
   195   z-index:100;
   223 }
   196 }
   224 
   197 
   225 div.popup {
   198 div.popup {
   226   position: absolute;
   199   position: absolute;
   227   background: #fff;
   200   background: #fff;
   228   border: 1px solid black;
   201   border: 1px solid black;
   229   text-align: left;
   202   text-align: left;
   230   z-index:400;
   203   z-index: 400;
   231 }
   204 }
   232 
   205 
   233 div.popup ul li a {
   206 div.popup ul li a {
   234   text-decoration: none;
   207   text-decoration: none;
   235   color: black;
   208   color: black;
   236 }
   209 }
   237 
   210 
       
   211 /* FIXME appear with 4px width in IE6 */
       
   212 div#stateheader{
       
   213   min-width: 66%;
       
   214 }
       
   215 
   238 /* main zone */
   216 /* main zone */
   239 
   217 
   240 div#page {
   218 div#page {
   241   background: #e2e2e2;
       
   242   position: relative;
       
   243   min-height: 800px;
   219   min-height: 800px;
   244 }
   220   margin: 8px;
   245 
   221 }
   246 table#mainLayout{
   222 
   247  margin:0px 3px;
   223 table#mainLayout #navColumnLeft {
   248 }
       
   249 
       
   250 table#mainLayout td#contentcol {
       
   251   padding: 8px 10px 5px;
       
   252 }
       
   253 
       
   254 table#mainLayout td.navcol {
       
   255   width: 16em;
   224   width: 16em;
   256 }
   225   padding-right: 8px;
   257 
   226 }
       
   227 
       
   228 table#mainLayout #navColumnRight {
       
   229   width: 16em;
       
   230   padding-left: 8px;
       
   231 }
       
   232 
       
   233 div#pageContent {
       
   234   clear: both;
       
   235 /*  margin-top:-1px; /* enable when testing rhythm */
       
   236   background: #ffffff;
       
   237   border: 1px solid #ccc;
       
   238 }
       
   239 
       
   240 /* */
   258 #contentheader {
   241 #contentheader {
   259   margin: 0px;
   242   margin: 0px;
   260   padding: 0.2em 0.5em 0.5em 0.5em;
   243   padding: 0.2em 0.5em 0.5em 0.5em;
       
   244   border:2px solid blue;
   261 }
   245 }
   262 
   246 
   263 #contentheader a {
   247 #contentheader a {
   264   color: #000;
   248   color: #000;
   265 }
   249 }
   266 
   250 
   267 div#pageContent {
   251 div#contentmain {
   268   clear: both;
   252   padding: 0 1em 1em;
   269 /*   padding: 10px 1em 2em; */
       
   270   background: #ffffff;
       
   271   border: 1px solid #ccc;
       
   272 }
   253 }
   273 
   254 
   274 /* rql bar */
   255 /* rql bar */
   275 
   256 
   276 div#rqlinput {
   257 div#rqlinput {
   283 input#rql{
   264 input#rql{
   284   width: 95%;
   265   width: 95%;
   285 }
   266 }
   286 
   267 
   287 /* boxes */
   268 /* boxes */
   288 div.navboxes {
       
   289  margin-top: 8px;
       
   290 }
       
   291 
   269 
   292 div.boxFrame {
   270 div.boxFrame {
   293   width: 100%;
   271   width: 100%;
   294 }
   272 }
   295 
   273 
   365   background: #eeedd9;
   343   background: #eeedd9;
   366   color: #111100;
   344   color: #111100;
   367 }
   345 }
   368 
   346 
   369 ul.boxListing a.boxMenu:hover {
   347 ul.boxListing a.boxMenu:hover {
   370                                 background: #eeedd9 url(puce_down.png) no-repeat scroll 98% 6px;
   348   background: #eeedd9 url(puce_down.png) no-repeat scroll 98% 6px;
   371                                 cursor:pointer;
   349   cursor:pointer;
   372                                 border-top:medium none;
   350   border-top:medium none;
   373                                 }
   351 }
       
   352 
   374 a.boxMenu {
   353 a.boxMenu {
   375   background: transparent url("puce_down.png") 98% 6px no-repeat;
   354   background: transparent url("puce_down.png") 98% 6px no-repeat;
   376   display: block;
   355   display: block;
   377   padding: 1px 9px 1px 3px;
   356   padding: 1px 9px 1px 3px;
   378 }
   357 }
   379 
       
   380 
   358 
   381 a.popupMenu {
   359 a.popupMenu {
   382   background: transparent url("puce_down_black.png") 2% 6px no-repeat;
   360   background: transparent url("puce_down_black.png") 2% 6px no-repeat;
   383   padding-left: 2em;
   361   padding-left: 2em;
   384 }
   362 }
   525 
   503 
   526 /***************************************/
   504 /***************************************/
   527 /* entity views                        */
   505 /* entity views                        */
   528 /***************************************/
   506 /***************************************/
   529 
   507 
   530 .mainInfo  {
       
   531   margin-right: 1em;
       
   532   padding: 0.2em;
       
   533 }
       
   534 
       
   535 
       
   536 div.mainRelated {
   508 div.mainRelated {
   537   border: none;
   509   border: none;
   538   margin-right: 1em;
   510   margin-right: 1em;
   539   padding: 0.5em 0.2em 0.2em;
   511   padding: 0.5em 0.2em 0.2em;
   540 }
   512 }
   549   font-style: italic;
   521   font-style: italic;
   550   text-align: right;
   522   text-align: right;
   551 }
   523 }
   552 
   524 
   553 div.section {
   525 div.section {
   554   margin-top: 0.5em;
   526 /*  margin-top: 0.5em; */
   555   width:100%;
   527   width:100%;
   556 }
   528 }
   557 
   529 
   558 div.section a:hover {
   530 div.section a:hover {
   559   text-decoration: none;
   531   text-decoration: none;
   790 
   762 
   791 /***************************************/
   763 /***************************************/
   792 /* footer                              */
   764 /* footer                              */
   793 /***************************************/
   765 /***************************************/
   794 
   766 
   795 div.footer {
   767 div#footer {
   796   text-align: center;
   768   text-align: center;
   797 }
   769 }
   798 div.footer a {
   770 div#footer a {
   799   color: #000;
   771   color: #000;
   800   text-decoration: none;
   772   text-decoration: none;
   801 }
   773 }
   802 
   774 
   803 
   775