Xxe/Css/publidoc.css
author Patrick PIERRE <patrick.pierre@prismallia.fr>
lun., 09 janv. 2012 19:21:44 +0100
changeset 70 5d58a740a067
parent 68 b47c497e1f0f
child 71 91ae8b8e07c6
permissions -rw-r--r--
Amélioration Didier
patrick@67
     1
@charset "UTF-8";
patrick@67
     2
patrick@59
     3
/* $Id$ */
patrick@59
     4
patrick@60
     5
*::comment { display: none; }
patrick@60
     6
patrick@61
     7
publidoc {
patrick@63
     8
  display: block;
patrick@61
     9
  font-family: sans-serif;
patrick@61
    10
  padding: 0;
patrick@61
    11
}
patrick@60
    12
patrick@60
    13
patrick@60
    14
/* Head level ============================================================== */
patrick@60
    15
patrick@61
    16
head {
patrick@63
    17
  display: block;
patrick@61
    18
  margin-bottom: .5em;
patrick@62
    19
  background-color: #fafafa;
patrick@61
    20
  padding: 0 .2em 0 .2em;
patrick@61
    21
  border: 1px solid #bbbbbb;
patrick@61
    22
  border-radius: 0.2em;
patrick@59
    23
}
patrick@59
    24
patrick@60
    25
head > *:before {
patrick@60
    26
 display: marker;
patrick@65
    27
 color:  #7f7f7f;
patrick@70
    28
 content: element-label() " :";
patrick@60
    29
}
patrick@60
    30
head > title:before { display: none; }
patrick@63
    31
head > subtitle:before { display: none; }
patrick@62
    32
head > identifier[type="uri"]:before { content: insert-before-button() " URI :"; }
patrick@62
    33
head > identifier[type="ean"]:before { content: insert-before-button() " EAN :"; }
patrick@61
    34
head > copyright:before { content: insert-before-button() " Copyright :"; }
patrick@67
    35
head > contributors:before { content: insert-before-button() " Contributeurs :"; }
patrick@60
    36
head > date:before { content: insert-before-button() " Date :"; }
patrick@60
    37
head > place:before { content: insert-before-button() " Lieu :"; }
patrick@60
    38
head > source:before { content: insert-before-button() " Source :"; }
patrick@60
    39
head > keywordset:before { content: insert-before-button() " Mots clés :"; }
patrick@61
    40
head > subjectset:before { content: insert-before-button() " Thèmes :"; }
patrick@61
    41
head > abstract:before { content: insert-before-button() " Résumé :"; }
patrick@61
    42
head > cover:before { content: insert-before-button() " Couverture :"; }
patrick@61
    43
head > annotation:before { content: insert-before-button() " Annotation :"; }
patrick@59
    44
patrick@60
    45
head > * {
patrick@60
    46
 display: block;
patrick@67
    47
 margin: 0 0 .8em 7.5em;
patrick@60
    48
}
patrick@67
    49
patrick@67
    50
head > *:after {
patrick@67
    51
  color:  #7f7f7f;
patrick@67
    52
  content: " " insert-after-button();
patrick@67
    53
}
patrick@67
    54
patrick@67
    55
/* title & subtitle ~~~~~~~~~~~~~~~~ */
patrick@67
    56
patrick@60
    57
head > title {
patrick@63
    58
  font-size: 120%;
patrick@60
    59
  font-weight: bold;
patrick@60
    60
  color: #004080;
patrick@63
    61
  margin: .2em 0 .2em 0;
patrick@61
    62
}
patrick@63
    63
head > subtitle {
patrick@63
    64
  font-weight: bold;
patrick@63
    65
  color: #004080;
patrick@63
    66
  margin: 0 0 .2em 0;
patrick@60
    67
}
patrick@60
    68
patrick@67
    69
/* contributors ~~~~~~~~~~~~~~~~~~~~ */
patrick@67
    70
patrick@67
    71
contributor:before {
patrick@67
    72
  display: marker;
patrick@67
    73
  content: insert-before-button(color, #7f7f7f, icon, icon(left-half-disc))
patrick@67
    74
           insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@60
    75
}
patrick@67
    76
contributor {
patrick@67
    77
  display: block;
patrick@67
    78
  margin: 0 0 .2em 24px;
patrick@62
    79
}
patrick@60
    80
patrick@67
    81
firstname:after, secondname:after, lastname:after, label:after,
patrick@67
    82
address:after {
patrick@65
    83
  content: insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@65
    84
}
patrick@65
    85
patrick@67
    86
contributor > link[uri]:after {
patrick@67
    87
  content: " ‣ " text-field(attribute, uri, color, black, font-size, 80%) "]"
patrick@67
    88
           insert-after-button(icon, icon(right-half-disc));
patrick@67
    89
}
patrick@67
    90
contributor > link[idref]:after {
patrick@67
    91
  content: " ‣ " label(attribute, idref, color, black)
patrick@67
    92
           set-attribute-button(attribute, idref) "]"
patrick@67
    93
           insert-after-button(icon, icon(right-half-disc));
patrick@65
    94
}
patrick@65
    95
patrick@68
    96
contributor role {
patrick@67
    97
  color: #7f7f7f;
patrick@68
    98
  content: " rôle : " combo-box(element, role, font-size, 75%,
patrick@67
    99
             labels, "auteur\A illustrateur\A éditeur"
patrick@68
   100
             values, "author\A illustrator\A publisher", color, black)
patrick@68
   101
           insert-same-after-button(icon, icon(right-half-disc));
patrick@65
   102
}
patrick@65
   103
patrick@67
   104
/* source ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@67
   105
patrick@65
   106
head source[type="book"] {
patrick@65
   107
  display: none;
patrick@65
   108
}
patrick@65
   109
patrick@67
   110
/* keyword & subject ~~~~~~~~~~~~~~~ */
patrick@67
   111
patrick@65
   112
head keyword:after {
patrick@65
   113
  content: insert-same-after-button(color, #7f7f7f, icon, icon(right-half-disc))
patrick@65
   114
           " ";
patrick@65
   115
}
patrick@65
   116
patrick@65
   117
head subject:before {
patrick@65
   118
  color: #7F7f7f;
patrick@65
   119
  content: "ID = " text-field(attribute, id, columns, 10, color, black, font-size, 75%);
patrick@65
   120
}
patrick@65
   121
head subject:after {
patrick@65
   122
  content: insert-same-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@65
   123
}
patrick@65
   124
patrick@67
   125
/* annotation ~~~~~~~~~~~~~~~~~~~~~~ */
patrick@67
   126
patrick@67
   127
head > annotation:after { content: ""; }
patrick@67
   128
patrick@67
   129
patrick@60
   130
/* Division level ========================================================== */
patrick@60
   131
patrick@61
   132
division:before {
patrick@63
   133
  display: block;
patrick@61
   134
  color: #7f7f7f;
patrick@61
   135
  content: collapser() " " insert-before-button() insert-after-button()
patrick@61
   136
           " Division"
patrick@61
   137
}
patrick@61
   138
patrick@61
   139
division {
patrick@61
   140
  display: block;
patrick@61
   141
  border: 1px dotted #7f7f7f;
patrick@61
   142
  padding: 5px;
patrick@61
   143
  margin-bottom: .5em;
patrick@61
   144
  collapsible: yes;
patrick@61
   145
  not-collapsible-head: 1;
patrick@61
   146
}
patrick@61
   147
division:last-child {
patrick@61
   148
  margin-bottom: 0;
patrick@61
   149
}
patrick@61
   150
patrick@61
   151
division > head {
patrick@62
   152
  background-color: #ffffee;
patrick@61
   153
  padding: .3em .5em .3em .5em;
patrick@61
   154
  border-radius: 0.5em;
patrick@61
   155
}
patrick@61
   156
patrick@61
   157
patrick@60
   158
/* Component level ========================================================= */
patrick@60
   159
patrick@61
   160
topic:before {
patrick@61
   161
  display: block;
patrick@61
   162
  color: #7f7f7f;
patrick@61
   163
  background-color: #ddddcc;
patrick@63
   164
  border: 1px solid #aeaea0;
patrick@61
   165
  font-weight: bold;
patrick@61
   166
  padding: .5em 5px .5em 5px;
patrick@61
   167
  content: collapser() " " insert-before-button() insert-after-button()
patrick@61
   168
           " " add-attribute-button() " Topic";
patrick@61
   169
}
patrick@61
   170
topic[xml|id]:before {
patrick@61
   171
  content: collapser() " " insert-before-button() insert-after-button()
patrick@62
   172
           " " add-attribute-button() " Topic"
patrick@62
   173
           " – ID = " text-field(attribute, "xml:id", columns, 15, color, black);
patrick@61
   174
}
patrick@61
   175
topic[type]:before {
patrick@61
   176
  content: collapser() " " insert-before-button() insert-after-button()
patrick@62
   177
           " " add-attribute-button() " Topic"
patrick@62
   178
           " – Type = " text-field(attribute, type, columns, 10, color, black);
patrick@61
   179
}
patrick@61
   180
topic[xml|id][type]:before {
patrick@61
   181
  content: collapser() " " insert-before-button() insert-after-button()
patrick@62
   182
           " Topic"
patrick@62
   183
           " – ID = " text-field(attribute, "xml:id", columns, 15, color, black)
patrick@62
   184
           " – Type = " text-field(attribute, type, columns, 10, color, black);
patrick@61
   185
}
patrick@61
   186
patrick@61
   187
topic {
patrick@63
   188
  display: block;
patrick@63
   189
  border: 1px solid #aeaea0;
patrick@61
   190
  margin-bottom: .5em;
patrick@61
   191
  padding: 5px;
patrick@61
   192
  collapsible: yes;
patrick@61
   193
}
patrick@61
   194
topic:last-child {
patrick@61
   195
  margin-bottom: 0;
patrick@61
   196
}
patrick@61
   197
patrick@61
   198
topic > head {
patrick@62
   199
  background-color: #ffffee;
patrick@61
   200
  padding: .3em .5em .3em .5em;
patrick@61
   201
  border-radius: 0.5em;
patrick@61
   202
}
patrick@61
   203
patrick@61
   204
patrick@61
   205
/* Top level =============================================================== */
patrick@61
   206
patrick@61
   207
publidoc > *:before {
patrick@61
   208
  display: block;
patrick@61
   209
  color: #bbbbbb;
patrick@62
   210
  background: #993333 url('top.png') repeat-x top left;
patrick@61
   211
  font-weight: bold;
patrick@62
   212
  padding: 1.2em 5px 1em 5px;
patrick@61
   213
}
patrick@61
   214
publidoc > document:before {
patrick@67
   215
  content: add-attribute-button() " Document"
patrick@67
   216
           " – ID = " text-field(attribute, "xml:id", columns, 15, color, white);
patrick@67
   217
}
patrick@67
   218
publidoc > document[xml|id][xml|lang]:before {
patrick@67
   219
  content: "Document"
patrick@67
   220
           " – ID = " text-field(attribute, "xml:id", columns, 15, color, white)
patrick@67
   221
           " – Langue principale  = " combo-box(attribute, "xml:lang", font-size, 75%,
patrick@67
   222
             values, "en\A fr\A fr-FR\A es", color, white);
patrick@61
   223
}
patrick@61
   224
publidoc > topic[xml|id]:before {
patrick@67
   225
  content: add-attribute-button() " Topic"
patrick@67
   226
           " – ID = " text-field(attribute, "xml:id", columns, 15, color, white);
patrick@61
   227
}
patrick@61
   228
publidoc > topic[xml|id][type]:before {
patrick@67
   229
  content: add-attribute-button() " Topic"
patrick@62
   230
           " – ID = " text-field(attribute, "xml:id", columns, 15, color, white)
patrick@62
   231
           " – Type = " text-field(attribute, type, columns, 10, color, white);
patrick@61
   232
}
patrick@67
   233
publidoc > topic[xml|id][xml|lang]:before {
patrick@67
   234
  content: add-attribute-button() " Topic"
patrick@67
   235
           " – ID = " text-field(attribute, "xml:id", columns, 15, color, white)
patrick@70
   236
           " – Langue principale = " combo-box(attribute, "xml:lang", font-size, 75%,
patrick@67
   237
             values, "en\A fr\A fr-FR\A es", color, white);
patrick@67
   238
}
patrick@67
   239
publidoc > topic[xml|id][type][xml|lang]:before {
patrick@67
   240
  content: "Topic"
patrick@67
   241
           " – ID = " text-field(attribute, "xml:id", columns, 15, color, white)
patrick@67
   242
           " – Type = " text-field(attribute, type, columns, 10, color, white)
patrick@70
   243
           " – Langue principale = " combo-box(attribute, "xml:lang", font-size, 75%,
patrick@67
   244
             values, "en\A fr\A fr-FR\A es", color, white);
patrick@67
   245
}
patrick@61
   246
patrick@61
   247
publidoc > * {
patrick@63
   248
  display: block;
patrick@61
   249
  margin: 5px;
patrick@62
   250
  padding: 0;
patrick@61
   251
  border: 0;
patrick@61
   252
}
patrick@61
   253
patrick@61
   254
publidoc > * > head {
patrick@62
   255
  background-color: #ffffee;
patrick@61
   256
  padding: .3em .5em .3em .5em;
patrick@61
   257
  border-radius: 0.5em;
patrick@61
   258
}
patrick@61
   259
patrick@63
   260
publidoc > * > head > title {
patrick@63
   261
  font-size: 140%;
patrick@63
   262
}
patrick@63
   263
patrick@61
   264
patrick@60
   265
/* Section level =========================================================== */
patrick@60
   266
patrick@62
   267
section:before {
patrick@63
   268
  display: block;
patrick@62
   269
  color: #7f7f7f;
patrick@64
   270
  text-align: left;
patrick@64
   271
  font-style: normal;
patrick@64
   272
  font-size: 75%;
patrick@63
   273
  padding-bottom: 3px;
patrick@63
   274
  content: insert-before-button() add-attribute-button(icon, icon(plus-box));
patrick@62
   275
}
patrick@62
   276
section[type]:before {
patrick@64
   277
  content: insert-before-button() add-attribute-button(icon, icon(plus-box))
patrick@64
   278
           " Type = " text-field(attribute, type, columns, 5, color, black);
patrick@64
   279
}
patrick@64
   280
section[xml|lang]:before {
patrick@64
   281
  content: insert-before-button() add-attribute-button(icon, icon(plus-box))
patrick@64
   282
           " Langue = " text-field(attribute, "xml:lang", columns, 2, color, black);
patrick@64
   283
}
patrick@64
   284
section[type][xml|lang]:before {
patrick@63
   285
  content: insert-before-button()
patrick@64
   286
           " Type = " text-field(attribute, type, columns, 5, color, black)
patrick@64
   287
           " – Langue = " text-field(attribute, "xml:lang", columns, 2, color, black);
patrick@62
   288
}
patrick@63
   289
section section:before {
patrick@63
   290
  margin-left: 1em;
patrick@63
   291
}
patrick@62
   292
patrick@61
   293
section {
patrick@61
   294
  display: block;
patrick@61
   295
}
patrick@62
   296
section[type="box"] {
patrick@63
   297
  margin-bottom: .5em;
patrick@62
   298
  padding: 5px;
patrick@62
   299
  background-color: #e8f0f7;
patrick@62
   300
  border-radius: 0.2em;
patrick@62
   301
}
patrick@63
   302
section[type="ex"] { font-style: italic; }
patrick@62
   303
section[type="sign"] { text-align: right; }
patrick@62
   304
patrick@62
   305
section section {
patrick@63
   306
  margin-left: 1em;
patrick@62
   307
}
patrick@62
   308
patrick@62
   309
section:after {
patrick@62
   310
  color: #7f7f7f;
patrick@62
   311
  content: insert-after-button();
patrick@61
   312
}
patrick@64
   313
section section:after {
patrick@64
   314
  margin-left: 1em;
patrick@64
   315
}
patrick@61
   316
patrick@59
   317
patrick@60
   318
/* Block level ============================================================= */
patrick@59
   319
patrick@62
   320
p:before, speech:before, list:before,
patrick@62
   321
blockquote:before, table:before, media:before {
patrick@63
   322
  display: marker;
patrick@62
   323
  content: insert-before-button(color, #7f7f7f, icon, icon(left-half-disc))
patrick@62
   324
           insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@62
   325
}
patrick@62
   326
patrick@62
   327
p, speech, list, blockquote, table, media {
patrick@61
   328
  display: block;
patrick@62
   329
  margin-left: 24px;
patrick@63
   330
  font-size: 115%;
patrick@62
   331
  font-family: serif;
patrick@61
   332
}
patrick@61
   333
patrick@67
   334
/* speech ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@65
   335
patrick@65
   336
speaker {
patrick@65
   337
  font-weight: bold;
patrick@65
   338
}
patrick@65
   339
patrick@65
   340
stage:before, stage:after {
patrick@65
   341
  color: #7f7f7f;
patrick@65
   342
  content: "(";
patrick@65
   343
}
patrick@65
   344
stage:before {
patrick@65
   345
  content: " (";
patrick@65
   346
}
patrick@65
   347
stage {
patrick@65
   348
  font-style: italic;  
patrick@65
   349
}
patrick@65
   350
stage:after {
patrick@65
   351
  content: ")";
patrick@65
   352
}
patrick@65
   353
patrick@63
   354
/* list ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@61
   355
patrick@61
   356
list {
patrick@62
   357
  margin: .3em 0 .3em 24px;
patrick@61
   358
}
patrick@61
   359
patrick@63
   360
list > head {
patrick@63
   361
  font-size: 75%;
patrick@63
   362
}
patrick@63
   363
patrick@61
   364
item {
patrick@61
   365
  display: list-item;
patrick@61
   366
}
patrick@61
   367
list[type="ordered"] > item {
patrick@61
   368
  list-style-type: decimal;
patrick@61
   369
}
patrick@61
   370
patrick@63
   371
item:after {
patrick@63
   372
  content: insert-same-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@63
   373
}
patrick@63
   374
patrick@61
   375
list[type="glossary"] > item > label {
patrick@61
   376
  font-weight: bold;
patrick@61
   377
}
patrick@61
   378
patrick@63
   379
/* blockquote ~~~~~~~~~~~~~~~~~~~~~~ */
patrick@62
   380
patrick@62
   381
attribution { font-style: italic; }
patrick@62
   382
patrick@59
   383
patrick@64
   384
/* media ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@64
   385
patrick@68
   386
media {
patrick@68
   387
  text-align: center;
patrick@68
   388
}
patrick@68
   389
patrick@64
   390
image {
patrick@64
   391
  display: block;
patrick@64
   392
  margin: .5em;
patrick@64
   393
  content: concatenate("image('Images/", attr(id), ".png', -200, -200, smooth)");
patrick@64
   394
}
patrick@64
   395
patrick@68
   396
caption {
patrick@68
   397
  font-style: italic;
patrick@68
   398
  font-size: 93%;
patrick@68
   399
}
patrick@68
   400
patrick@64
   401
patrick@60
   402
/* Inline level ============================================================ */
patrick@59
   403
patrick@63
   404
/* sup, sub, var ~~~~~~~~~~~~~~~~~~~ */
patrick@62
   405
patrick@63
   406
sup { font-family: sans-serif; vertical-align: super; font-size: 75%; }
patrick@63
   407
sub { font-family: sans-serif; vertical-align: sub;   font-size: 75%; }
patrick@63
   408
var { font-family: sans-serif; font-style: italic; }
patrick@63
   409
patrick@65
   410
/* date ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@65
   411
patrick@65
   412
date[value]:after {
patrick@65
   413
  color: #7f7f7f;
patrick@65
   414
  content: " (" date-picker(attribute, value, columns, 7, color, black, font-size, 75%) ")";
patrick@65
   415
}
patrick@65
   416
head > date[value]:after {
patrick@65
   417
  color: #7f7f7f;
patrick@65
   418
  content: " (" date-picker(attribute, value, columns, 7, color, black, font-size, 75%)
patrick@65
   419
           ") " insert-after-button();
patrick@65
   420
}
patrick@65
   421
patrick@70
   422
/* name ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@70
   423
patrick@70
   424
name { font-family: sans-serif; color: #004080; }
patrick@70
   425
patrick@63
   426
/* note ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@63
   427
patrick@63
   428
note:before { font-size: 75%; content: "(Note : "; }
patrick@63
   429
note { font-family: sans-serif; color: #004080; font-size: 75%; }
patrick@63
   430
note:after { font-size: 75%; content: ")"; }
patrick@62
   431
note p { display:inline; }
patrick@62
   432
patrick@63
   433
/* highlight ~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@63
   434
patrick@62
   435
highlight { font-weight: bold; }
patrick@63
   436
patrick@68
   437
/* term ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@68
   438
patrick@68
   439
term { font-style: italic; }
patrick@68
   440
patrick@63
   441
/* link ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@63
   442
patrick@63
   443
link:before {
patrick@63
   444
  color: #7f7f7f;
patrick@63
   445
  font-family: sans-serif;
patrick@63
   446
  content: "["
patrick@63
   447
}
patrick@63
   448
patrick@63
   449
media link {
patrick@63
   450
  display: block;
patrick@63
   451
}
patrick@63
   452
patrick@63
   453
link:after {
patrick@63
   454
  color: #7f7f7f;
patrick@63
   455
  font-family: sans-serif;
patrick@63
   456
}
patrick@63
   457
link[uri]:after {
patrick@63
   458
  content: " ‣ " text-field(attribute, uri, color, black, font-size, 80%) "]";
patrick@63
   459
}
patrick@63
   460
link[idref]:after {
patrick@63
   461
  content: " ‣ " label(attribute, idref, color, black)
patrick@63
   462
           set-attribute-button(attribute, idref) "]";
patrick@63
   463
}
patrick@63
   464