css/cdm.less

   1 .cdm {
   2         margin-right : 4px;
   3
   4         .cdmHeader, .cdmFooter {
   5                 display : table;
   6         }
   7
   8         .cdmHeader img, .cdmHeader input, .cdmFooter img {
   9                 vertical-align : middle;
  10         }
  11
  12         .cdmHeader > div, .cdmFooter > div {
  13                 white-space : nowrap;
  14         }
  15
  16         .cdmHeader > span, .cdmFooter > span.left {
  17                 width : 100%;
  18         }
  19
  20         .cdmHeader img, .cdmFooter img {
  21                 margin : 0px 4px;
  22         }
  23
  24         .cdmHeader {
  25                 > * {
  26                         display : table-cell;
  27                         padding : 5px;
  28                 }
  29
  30                 span.updated {
  31                         color : #555;
  32                         font-weight : normal;
  33                         font-size : 11px;
  34                         white-space : nowrap;
  35                         vertical-align : middle;
  36                 }
  37
  38                 input {
  39                         margin-right : 5px;
  40                 }
  41
  42                 div.updPic {
  43                         width : 25px;
  44                         display : inline-block;
  45                         text-align : center;
  46                 }
  47
  48                 div.updPic img {
  49                         vertical-align : middle;
  50                 }
  51
  52                 input {
  53                         margin-left : 4px;
  54                         margin-right : 4px;
  55                 }
  56         }
  57
  58         .cdmFooter {
  59                 height : 30px;
  60                 padding-left : 5px;
  61                 font-weight : normal;
  62                 color : #555;
  63                 clear : both;
  64
  65                 > * {
  66                         display : table-cell;
  67                         vertical-align : middle;
  68                 }
  69         }
  70
  71         .cdmIntermediate {
  72                 margin : 10px;
  73         }
  74
  75         .cdmContentInner {
  76                 margin : 10px;
  77                 line-height : 1.5;
  78                 font-size : 16px;
  79
  80                 h1 {
  81                         font-size : 16px;
  82                 }
  83
  84                 h2,
  85                 h3,
  86                 h4 {
  87                         font-size : 15px;
  88                 }
  89
  90         }
  91
  92         .cdmIntermediate img,
  93         .cdmIntermediate video,
  94         .cdmContentInner img,
  95         .cdmContentInner video {
  96                 border-width : 0px;
  97                 max-width : 98%;
  98                 height : auto;
  99         }
 100 }
 101
 102 .cdm.expanded {
 103         margin-top : 4px;
 104         margin-bottom : 4px;
 105
 106         .cdmFooter {
 107                 border: 0px solid #ddd;
 108                 border-bottom-width: 1px;
 109         }
 110
 111         > hr {
 112                 margin-top : 0px;
 113                 margin-bottom : 0px;
 114         }
 115
 116 }
 117
 118 .cdm.expandable {
 119         background-color : #f0f0f0;
 120         border: 0px solid #ddd;
 121         border-bottom-width: 1px;
 122
 123         > hr {
 124                 display : none;
 125         }
 126
 127         div.cdmHeader span.titleWrap {
 128                 white-space : nowrap;
 129                 text-overflow : ellipsis;
 130                 overflow : hidden;
 131                 max-width : 500px;
 132         }
 133 }
 134
 135 .cdm.expandable.Unread {
 136         background : white;
 137 }
 138
 139 .cdm.expandable.Selected {
 140         background : #f9fbff;
 141 }
 142
 143 .cdm.expandable.active {
 144         background : white ! important;
 145 }
 146
 147 div.cdm.expandable.active div.cdmHeader span.titleWrap {
 148         white-space : normal;
 149 }
 150
 151 div.cdm.expandable div.cdmHeader a.title {
 152         font-weight : 600;
 153         color : #555;
 154         font-size : 14px;
 155         -webkit-transition : color 0.2s;
 156         transition : color 0.2s;
 157         text-rendering: optimizelegibility;
 158         font-family : @fonts-ui-bold;
 159 }
 160
 161 div.cdm.expandable.Unread div.cdmHeader a.title {
 162         color : black;
 163 }
 164
 165 div.cdm.expandable.active div.cdmHeader a.title {
 166         color: @color-link;
 167         font-size: 16px;
 168         font-weight: 600;
 169         text-rendering: optimizelegibility;
 170         font-family: @fonts-ui-bold;
 171 }
 172
 173 div.cdm.expanded div.cdmHeader {
 174         background : transparent ! important;
 175 }
 176
 177 div.cdm.expanded div.cdmHeader a.title {
 178         font-size : 16px;
 179         color : #999;
 180         font-weight : 600;
 181         -webkit-transition : color 0.2s;
 182         transition : color 0.2s;
 183         text-rendering: optimizelegibility;
 184         font-family : @fonts-ui-bold;
 185 }
 186
 187 div.cdm.expanded.active {
 188         background : white;
 189 }
 190
 191 div.cdm.expanded.active div.cdmHeader a.title {
 192         color : @color-link;
 193 }
 194
 195 div.cdm.expanded.Unread div.cdmHeader a.title {
 196         color : black;
 197 }
 198
 199 div.cdm.expanded div.cdmContent {
 200         color : #555;
 201 }
 202
 203 div.cdm.expanded.Unread div.cdmContent {
 204         color : black;
 205 }
 206
 207 div.cdm.active div.cdmContent {
 208         color : black;
 209 }
 210
 211 span.cdmExcerpt {
 212         white-space : nowrap;
 213         font-size : 11px;
 214         color : #999;
 215         font-weight : normal;
 216         cursor : pointer;
 217 }
 218
 219 div.cdmContent div.postEnclosures {
 220         margin-top : 1em;
 221         color : #555;
 222 }
 223
 224 div.cdmFeedTitle {
 225         border: 0px solid @color-link;
 226         border-bottom-width: 1px;
 227         padding : 5px 3px 5px 5px;
 228 }
 229
 230 div.cdmFeedTitle a.title {
 231         color : #555;
 232         font-weight : bold;
 233 }
 234
 235 div.cdmFeedTitle a {
 236         color : #555;
 237 }
 238
 239 div.cdmFeedTitle a:hover {
 240         color : @color-link;
 241 }
 242
 243 div.cdmHeader span.hlFeed {
 244         float : right;
 245         font-weight : normal;
 246         font-style : italic;
 247 }
 248
 249 div.cdmHeader div.hlFeed, div.cdmHeader div.hlFeed a {
 250         vertical-align : middle;
 251         color : #555;
 252         font-weight : normal;
 253         font-style : italic;
 254         font-size : 11px;
 255 }
 256
 257 div.cdm .hlFeed a {
 258         border-radius : 4px;
 259         display : inline-block;
 260         padding : 1px 4px 1px 4px;
 261 }
 262
 263 div.cdmContentInner p {
 264         /*max-width : 650px;*/
 265         -webkit-hyphens: auto;
 266         -moz-hyphens: auto;
 267         hyphens: auto;
 268 }
 269
 270 div.cdmContentInner iframe {
 271         min-width : 50%;
 272         max-width : 98%;
 273 }
 274
 275 div.cdmHeader span.author {
 276         white-space : nowrap;
 277         color : #555;
 278         font-size : 11px;
 279         font-weight : normal;
 280 }
 281
 282 div#floatingTitle {
 283         position : absolute;
 284         z-index : 5;
 285         top : 0px;
 286         right : 0px;
 287         left : 0px;
 288         border: 0px solid #ddd;
 289         border-bottom-width: 1px;
 290         background : white;
 291         color : #555;
 292         box-shadow : 0px 1px 1px -1px rgba(0,0,0,0.1);
 293
 294         > * {
 295                 display : table-cell;
 296                 white-space : nowrap;
 297                 vertical-align : middle;
 298                 padding : 9px 5px;
 299         }
 300
 301         img {
 302                 margin-right : 4px;
 303                 margin-left : 4px;
 304         }
 305
 306         span.author {
 307                 color : #555;
 308                 font-size : 11px;
 309                 font-weight : normal;
 310         }
 311
 312         a.title {
 313                 font-size : 16px;
 314                 color : #999;
 315                 -webkit-transition : color 0.2s;
 316                 transition : color 0.2s;
 317                 font-weight : 600;
 318                 text-rendering: optimizelegibility;
 319                 font-family : @fonts-ui-bold;
 320         }
 321
 322         img.anchor {
 323                 margin-left : 0px;
 324         }
 325
 326         div.hlFeed {
 327                 padding-right : 10px;
 328                 color : #555;
 329                 font-weight : normal;
 330                 font-style : italic;
 331                 font-size : 11px;
 332                 white-space : nowrap;
 333         }
 334
 335         div.hlFeed a {
 336                 border-radius : 4px;
 337                 display : inline-block;
 338                 padding : 1px 4px 1px 4px;
 339         }
 340
 341         span.updated {
 342                 padding-right : 10px;
 343                 white-space : nowrap;
 344                 color : #555;
 345                 font-size : 11px;
 346         }
 347
 348         div.hlFeed a {
 349                 color : #555;
 350         }
 351
 352         span.titleWrap {
 353                 width : 100%;
 354                 white-space : normal;
 355         }
 356
 357         .dijit,
 358         img.hlScorePic {
 359                 display : none;
 360         }
 361
 362 }
 363
 364 div#floatingTitle.Unread a.title {
 365         color : black;
 366 }
 367
 368 .cdm.high .cdmHeader {
 369         a.title.high,
 370         .cdmExcerpt,
 371         span.author {
 372                 color : #00aa00;
 373         }
 374 }
 375
 376 .cdm.Unread.high .cdmHeader {
 377         a.title.high,
 378         .cdmExcerpt,
 379         span.author {
 380                 color : #00dd00;
 381         }
 382 }
 383
 384 .cdm .cdmHeader a.title.low,
 385 .cdm.low .cdmHeader .cdmExcerpt,
 386 .cdm.Unread .cdmHeader a.title.low,
 387 .cdm.Unread.low .cdmHeader .cdmExcerpt,
 388 .cdm.low .cdmHeader span.author {
 389         color : #909090;
 390         text-decoration : line-through;
 391 }
 392
 393 .cdmFeedTitle {
 394
 395         > * {
 396                 display : table-cell;
 397                 vertical-align : middle;
 398         }
 399
 400         a.title {
 401                 width : 100%;
 402         }
 403
 404         a.catchup {
 405                 text-align : right;
 406                 color : #555;
 407                 padding-right : 10px;
 408                 font-size : 11px;
 409                 white-space : nowrap;
 410         }
 411
 412         a.catchup:hover {
 413                 color : @color-link;
 414         }
 415
 416 }