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