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: 2em;
  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.5em;
 160   padding-bottom: 1em;
 161 }
 162
 163 #content figcaption.center {
 164         text-align: center;
 165 }
 166
 167 #content figcaption.titleover {
 168   text-align: center;
 169         caption-side: top;
 170 }
 171
 172 #content figure.right {
 173   margin: 0 0 1em 1em;
 174   float: right;
 175   clear: right;
 176 }
 177
 178 #content figure.left {
 179   margin: 0 1em 1em 0;
 180   float: left;
 181   clear: left;
 182 }
 183
 184 #content figure.center {
 185   margin: 1em auto 1em auto;
 186   clear: both;
 187 }
 188
 189 #content img.mini {
 190   width: 200px;
 191 }
 192
 193 #content img.mini:hover {
 194   width: 100%;
 195 }
 196
 197 #content img.fit {
 198         width: 100%;
 199 }
 200
 201 kbd {
 202   text-shadow: 0 0 2px rgb(255, 255, 255);
 203   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);
 204 }
 205
 206
 207 kbd.cmd {
 208   text-shadow: none;
 209   box-shadow: none;
 210 }
 211
 212 #content p.center {
 213         text-align:center;
 214 }
 215
 216 @media (max-width: 800px) {
 217   #tree {
 218     position: relative;
 219     height: 250px;
 220     width: 100%;
 221     margin-top: 20px;
 222   }
 223   #content {
 224     padding-left: 20px;
 225     margin-top: 0px;
 226   }
 227 }
 228
 229 /* for the TOC */
 230 #content p.chapter,
 231 #content p.subchapter,
 232 #content p.section,
 233 #content p.subsection {
 234   line-height:1em;
 235 }
 236 #content p.chapter { padding-top: 1em; padding-left: 1em; padding-bottom:1em; }
 237 #content p.subchapter { padding-left: 4em; }
 238 #content p.section { padding-left: 6em; }
 239 #content p.subsection { padding-left: 8em; }
 240
 241 /* for images sliced in divs, as in http://manual.ardour.org/ardours-interface/about/ */
 242 .hoverimg:hover{ z-index:100; box-shadow: 0 0 .2em .2em lightgreen; }