Shamusworld >> Repos - ardour-manual/blob - source/css/screen.css

   1
   2 .clear {
   3   clear:both;
   4 }
   5
   6 #tree {
   7   background-color: #212A30;
   8   line-height: 1.8ex;
   9   height: 100%;
  10   overflow: scroll;
  11   position: fixed;
  12   top: 0;
  13   bottom: 0;
  14   left: 0;
  15   width: 20em;
  16   padding: 1em 1em 2em 1.5em;
  17 }
  18
  19 #tree h1 {
  20   font-size: 1.75em;
  21   margin-bottom: 1em;
  22   font-weight: normal;
  23 }
  24
  25 #tree ul {
  26   padding-left: 1em;
  27   list-style-type: none;
  28 }
  29
  30 #tree a {
  31   display: inline !important;
  32   font-size: 0.88em;
  33   line-height: 2em;
  34   color: #E4E4E4;
  35   border-bottom: 1px solid transparent;
  36 }
  37
  38 #tree a:hover {
  39   text-decoration: none;
  40   border-bottom: 1px solid #aaa;
  41 }
  42
  43 #tree .active > a {
  44   display: inline;
  45   color: #FF8080;
  46 }
  47
  48 #content {
  49   padding: 1em 2em 2ex 21em;
  50   margin-left: 0;
  51   line-height: 1.8em;
  52 }
  53
  54 #content h1,
  55 #content h2,
  56 #content h3,
  57 #content h4 {
  58   font-weight: normal;
  59   padding-bottom: .3ex;
  60 }
  61
  62 #content h1 {
  63   font-size: 1.8em;
  64   margin: 0 0 2ex 0;
  65   padding-bottom: .8ex;
  66   border-bottom: 2px solid #ccc;
  67 }
  68
  69 #content h2 {
  70   font-size: 1.3em;
  71   margin: 2ex 0 1ex 0;
  72   border-bottom: 2px solid #ddd;
  73 }
  74
  75 #content h3 {
  76   font-size: 1.2em;
  77   margin: 1.5ex 0 1ex 0;
  78   border-bottom: 1px solid #eee;
  79 }
  80
  81 #content h4 {
  82   font-size: 1.1em;
  83   margin: 1.5ex 0 .5ex 0;
  84   border-bottom: 1px solid #eee;
  85 }
  86
  87 #content table {
  88   width:100%;
  89   margin: 1em 0;
  90   padding: 0;
  91   font-weight: normal;
  92   text-align: left;
  93 }
  94
  95 #content table tr {
  96   border-bottom: 2px solid #eeeeee;
  97 }
  98
  99 #content table tr:nth-child(odd){
 100   background-color: white;
 101 }
 102
 103 #content table tr:nth-child(even){
 104   background-color: #f5f5f5;
 105 }
 106
 107 #content table tr:hover {
 108   background-color: #F2F9FF;
 109 }
 110
 111 #content table td,
 112 #content table th {
 113   margin: 0;
 114   padding: .5em;
 115 }
 116
 117 #content table th {
 118   font-weight: bold;
 119 }
 120
 121 #content table th.sub1 {
 122   padding-left: 2em;
 123 }
 124
 125 #content table th.sub2 {
 126   padding-left: 4em;
 127 }
 128
 129 #content table thead {
 130   font-weight:bold;
 131 }
 132
 133 #content table.dl th {
 134   /* dl class (definition list) is for 2-columns tables that describe properties:
 135   maximmizes the width of the 2nd (description) column */
 136   vertical-align: top;
 137   min-width: 20%;
 138   white-space:nowrap
 139 }
 140
 141 #content table.dl td {
 142   vertical-align: top;
 143   width: 100%;
 144 }
 145
 146 #content ul,
 147 #content ol {
 148   overflow: hidden;
 149 }
 150
 151 #content figure {
 152   display: table;
 153 }
 154
 155 #content figcaption {
 156   display: table-caption;
 157   caption-side: bottom;
 158   font-style: italic;
 159   padding-top: 0.4em;
 160   padding-bottom: 1em;
 161   font-size: .9em;
 162   line-height: .9em;
 163 }
 164 }
 165
 166 #content figcaption.center {
 167   text-align: center;
 168 }
 169
 170 #content figcaption.titleover {
 171   text-align: center;
 172   caption-side: top;
 173 }
 174
 175 #content figure.right {
 176   margin: 0 0 1em 1em;
 177   float: right;
 178   clear: right;
 179 }
 180
 181 #content figure.left {
 182   margin: 0 1em 1em 0;
 183   float: left;
 184   clear: left;
 185 }
 186
 187 #content figure.center {
 188   margin: 1em auto 1em auto;
 189   clear: both;
 190 }
 191
 192 #content img.mini {
 193   width: 200px;
 194 }
 195
 196 #content img.mini:hover {
 197   width: 100%;
 198 }
 199
 200 #content img.fit {
 201   width: 100%;
 202 }
 203
 204 kbd {
 205   text-shadow: 0 0 2px rgb(255, 255, 255);
 206   box-shadow: inset 0 0 1px rgb(255, 255, 255), inset 0 0 .4em rgb(200, 200, 200), 0 .1em 0 rgb(130, 130, 130), 0 .11em 0 rgba(0, 0, 0, .4), 0 .1em .11em rgba(0, 0, 0, .9);
 207 }
 208
 209
 210 kbd.cmd {
 211   text-shadow: none;
 212   box-shadow: none;
 213 }
 214
 215 #content p.center {
 216         text-align:center;
 217 }
 218
 219 @media (max-width: 800px) {
 220   #tree {
 221     position: relative;
 222     height: 250px;
 223     width: 100%;
 224     margin-top: 20px;
 225   }
 226   #content {
 227     padding-left: 20px;
 228     margin-top: 0px;
 229   }
 230 }
 231
 232 /* for the TOC */
 233 #content p.chapter,
 234 #content p.subchapter,
 235 #content p.section,
 236 #content p.subsection {
 237   line-height:1em;
 238 }
 239 #content p.chapter { padding-top: 1em; padding-left: 1em; padding-bottom:1em; }
 240 #content p.subchapter { padding-left: 4em; }
 241 #content p.section { padding-left: 6em; }
 242 #content p.subsection { padding-left: 8em; }
 243
 244 /* for images sliced in divs, as in http://manual.ardour.org/ardours-interface/about/ */
 245 .hoverimg:hover{ z-index:100; box-shadow: 0 0 .2em .2em lightgreen; }