Xxe/Css/publiquiz.css
author Patrick PIERRE
jeu., 11 avril 2013 16:53:38 +0200
changeset 195 f23374888940
parent 175 9817635631aa
permissions -rw-r--r--
Gestion des dropzones
patrick@87
     1
@charset "UTF-8";
patrick@87
     2
patrick@87
     3
/* $Id$ */
patrick@87
     4
patrick@87
     5
@import url(publidoc.css);
patrick@87
     6
patrick@87
     7
patrick@87
     8
publiquiz {
patrick@87
     9
  display: block;
patrick@87
    10
  font-family: sans-serif;
patrick@87
    11
  padding: 0;
patrick@87
    12
}
patrick@87
    13
patrick@87
    14
patrick@87
    15
/* Component level ========================================================= */
patrick@87
    16
patrick@87
    17
quiz:before  {
patrick@87
    18
  display: block;
patrick@87
    19
  color: #7f7f7f;
patrick@87
    20
  background-color: #ddddcc;
patrick@87
    21
  border: 1px solid #aeaea0;
patrick@87
    22
  font-weight: bold;
patrick@87
    23
  padding: .5em 5px .5em 5px;
patrick@87
    24
  content: collapser() " " insert-before-button() insert-after-button()
patrick@87
    25
           " " add-attribute-button() " Quiz";
patrick@87
    26
}
patrick@87
    27
Patrick@158
    28
quiz[id]:before {
Patrick@158
    29
  content: collapser() " " insert-before-button() insert-after-button()
Patrick@158
    30
           " " add-attribute-button() " Quiz"
Patrick@158
    31
           " – ID = " text-field(attribute, "id", columns, 15, color, black);
Patrick@158
    32
}
Patrick@158
    33
quiz[type]:before {
Patrick@158
    34
  content: collapser() " " insert-before-button() insert-after-button()
Patrick@158
    35
           " " add-attribute-button() " Quiz"
Patrick@158
    36
           " – Type = " text-field(attribute, type, columns, 10, color, black);
Patrick@158
    37
}
Patrick@158
    38
quiz[id][type]:before {
Patrick@158
    39
  content: collapser() " " insert-before-button() insert-after-button()
Patrick@158
    40
           " Quiz"
Patrick@158
    41
           " – ID = " text-field(attribute, "id", columns, 15, color, black)
Patrick@158
    42
           " – Type = " text-field(attribute, type, columns, 10, color, black);
patrick@87
    43
}
patrick@87
    44
patrick@87
    45
quiz {
patrick@87
    46
  display: block;
patrick@87
    47
  border: 1px solid #aeaea0;
patrick@87
    48
  margin-bottom: .5em;
patrick@87
    49
  padding: 5px;
patrick@87
    50
  collapsible: yes;
patrick@87
    51
}
patrick@87
    52
quiz:last-child {
patrick@87
    53
  margin-bottom: 0;
patrick@87
    54
}
patrick@87
    55
patrick@87
    56
quiz > head {
patrick@87
    57
  background-color: #ffffee;
patrick@87
    58
  padding: .3em .5em .3em .5em;
patrick@87
    59
  border-radius: 0.5em;
patrick@87
    60
}
patrick@87
    61
patrick@87
    62
patrick@87
    63
/* Top level =============================================================== */
patrick@87
    64
patrick@87
    65
publiquiz > *:before {
patrick@87
    66
  display: block;
patrick@87
    67
  color: #bbbbbb;
patrick@87
    68
  background: #993333 url('top.png') repeat-x top left;
patrick@87
    69
  font-weight: bold;
patrick@87
    70
  padding: 1.2em 5px 1em 5px;
patrick@87
    71
}
patrick@87
    72
publiquiz > document:before {
patrick@87
    73
  content: add-attribute-button() " Document"
patrick@117
    74
           " – ID = " text-field(attribute, "id", columns, 15, color, white);
patrick@87
    75
}
patrick@117
    76
publiquiz > document[id][xml|lang]:before {
patrick@87
    77
  content: "Document"
patrick@117
    78
           " – ID = " text-field(attribute, "id", columns, 15, color, white)
patrick@87
    79
           " – Langue principale  = " combo-box(attribute, "xml:lang", font-size, 75%,
patrick@125
    80
             values, "en\A fr\A es", color, white);
patrick@87
    81
}
patrick@117
    82
publiquiz > quiz[id]:before {
patrick@87
    83
  content: add-attribute-button() " Quiz"
patrick@117
    84
           " – ID = " text-field(attribute, "id", columns, 15, color, white);
patrick@87
    85
}
Patrick@158
    86
publiquiz > quiz[id][type]:before {
Patrick@158
    87
  content: add-attribute-button() " Quiz"
Patrick@158
    88
           " – ID = " text-field(attribute, "id", columns, 15, color, white)
Patrick@158
    89
           " – Type = " text-field(attribute, type, columns, 10, color, white);
Patrick@158
    90
}
patrick@117
    91
publiquiz > quiz[id][xml|lang]:before {
Patrick@158
    92
  content: add-attribute-button() " Quiz"
Patrick@158
    93
           " – ID = " text-field(attribute, "id", columns, 15, color, white)
Patrick@158
    94
           " – Langue principale = " combo-box(attribute, "xml:lang", font-size, 75%,
Patrick@158
    95
             values, "en\A fr\A es", color, white);
Patrick@158
    96
}
Patrick@158
    97
publiquiz > quiz[id][type][xml|lang]:before {
patrick@87
    98
  content: "Quiz"
patrick@117
    99
           " – ID = " text-field(attribute, "id", columns, 15, color, white)
Patrick@158
   100
           " – Type = " text-field(attribute, type, columns, 10, color, white)
Patrick@158
   101
           " – Langue principale = " combo-box(attribute, "xml:lang", font-size, 75%,
patrick@125
   102
             values, "en\A fr\A es", color, white);
patrick@87
   103
}
patrick@87
   104
patrick@87
   105
publiquiz > * {
patrick@87
   106
  display: block;
patrick@87
   107
  margin: 5px;
patrick@87
   108
  padding: 0;
patrick@87
   109
  border: 0;
patrick@87
   110
}
patrick@87
   111
patrick@87
   112
publiquiz > * > head {
patrick@87
   113
  background-color: #ffffee;
patrick@87
   114
  padding: .3em .5em .3em .5em;
patrick@87
   115
  border-radius: 0.5em;
patrick@87
   116
}
patrick@87
   117
patrick@87
   118
publiquiz > * > head > title {
patrick@87
   119
  font-size: 140%;
patrick@87
   120
}
patrick@87
   121
patrick@87
   122
patrick@87
   123
/* Section level =========================================================== */
patrick@87
   124
patrick@87
   125
quiz > *:before, quiz > composite > *:before {
patrick@87
   126
  display: block;
patrick@87
   127
  color: #7f7f7f;
patrick@87
   128
  text-align: left;
patrick@87
   129
  font-style: normal;
patrick@87
   130
  font-size: 75%;
patrick@87
   131
  padding-bottom: 3px;
patrick@87
   132
}
patrick@87
   133
patrick@87
   134
quiz > *, quiz > composite > * {
patrick@87
   135
  display: block;
patrick@87
   136
}
patrick@87
   137
patrick@87
   138
quiz > *:after, quiz > composite > *:after {
patrick@87
   139
  color: #7f7f7f;
patrick@87
   140
  content: insert-after-button();
patrick@87
   141
}
patrick@87
   142
patrick@87
   143
quiz > head:after {
patrick@87
   144
  display: none;
patrick@87
   145
}
patrick@87
   146
patrick@87
   147
/* instructions ~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   148
patrick@87
   149
instructions:before {
patrick@87
   150
  background-color: #e8f0f7;
patrick@87
   151
  content: insert-before-button() " Consigne";
patrick@87
   152
}
patrick@87
   153
patrick@87
   154
instructions {
patrick@87
   155
  display: block;
patrick@87
   156
  background-color: #e8f0f7;
patrick@87
   157
}
patrick@87
   158
patrick@87
   159
instructions section:before, instructions section, instructions section:after {
patrick@87
   160
  margin-left: 1em;
patrick@87
   161
}
patrick@87
   162
patrick@87
   163
/* choices ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   164
patrick@87
   165
choices-radio:before {
patrick@128
   166
  color: #7f7f7f;
patrick@87
   167
  content: insert-before-button()
patrick@87
   168
           command-button(command, "putAttribute", parameter, "shuffle true", icon, icon(plus-box))
patrick@87
   169
           " QCM – radio";
patrick@87
   170
}
patrick@87
   171
choices-radio[shuffle]:before {
patrick@87
   172
  content: insert-before-button()
patrick@87
   173
           " QCM – radio"
patrick@87
   174
           " – shuffle = " label(attribute, shuffle, color, black)
patrick@87
   175
           set-attribute-button(attribute, shuffle, unset-attribute, yes);
patrick@87
   176
}
patrick@87
   177
patrick@87
   178
choices-check:before {
patrick@128
   179
  color: #7f7f7f;
patrick@87
   180
  content: insert-before-button()
patrick@87
   181
           command-button(command, "putAttribute", parameter, "shuffle true", icon, icon(plus-box))
patrick@87
   182
           " QCM – check";
patrick@87
   183
}
patrick@87
   184
choices-check[shuffle]:before {
patrick@87
   185
  content: insert-before-button()
patrick@87
   186
           " QCM – check"
patrick@87
   187
           " – shuffle = " label(attribute, shuffle, color, black)
patrick@87
   188
           set-attribute-button(attribute, shuffle, unset-attribute, yes);
patrick@87
   189
}
patrick@87
   190
patrick@87
   191
/* blanks ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   192
patrick@87
   193
blanks-fill:before {
patrick@87
   194
  content: insert-before-button()
patrick@87
   195
           command-button(command, "putAttribute", parameter, "strict true", icon, icon(plus-box))
patrick@87
   196
           " Exercice à trous – saisie libre";
patrick@87
   197
}
patrick@87
   198
blanks-fill[strict]:before {
patrick@87
   199
  content: insert-before-button()
patrick@87
   200
           " Exercice à trous – saisie libre"
patrick@87
   201
           " – strict = " label(attribute, strict, color, black)
patrick@87
   202
           set-attribute-button(attribute, strict, unset-attribute, yes);
patrick@87
   203
}
patrick@87
   204
patrick@87
   205
blanks-select:before {
patrick@87
   206
  content: insert-before-button()
patrick@87
   207
           command-button(command, "putAttribute", parameter, "multiple true", icon, icon(plus-box))
patrick@87
   208
           " Exercice à trous – liste fermée";
patrick@87
   209
}
patrick@87
   210
blanks-select[multiple]:before {
patrick@87
   211
  content: insert-before-button()
patrick@87
   212
           " Exercice à trous – liste fermée"
patrick@87
   213
           " – multiple = " label(attribute, multiple, color, black)
patrick@87
   214
           set-attribute-button(attribute, multiple, unset-attribute, yes);
patrick@87
   215
}
patrick@87
   216
patrick@87
   217
/* point ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   218
patrick@87
   219
point:before {
patrick@87
   220
  content: insert-before-button() " "
patrick@87
   221
           command-button(command, "putAttribute", parameter, "type radio", icon, icon(plus-box))
patrick@87
   222
           " Pointage";
patrick@87
   223
}
patrick@87
   224
point[type]:before {
patrick@87
   225
  content: insert-before-button()
patrick@87
   226
           " Pointage – type = " label(attribute, type, color, black)
patrick@87
   227
           set-attribute-button(attribute, type, unset-attribute, yes);
patrick@87
   228
}
patrick@87
   229
patrick@87
   230
/* matching ~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   231
patrick@87
   232
matching:before {
Patrick@170
   233
  content: insert-before-button() " "
Patrick@170
   234
           command-button(command, "putAttribute", parameter, "multiple true", icon, icon(plus-box))
Patrick@170
   235
           " Appariement";
Patrick@170
   236
}
Patrick@170
   237
matching[multiple]:before {
Patrick@170
   238
  content: insert-before-button()
Patrick@170
   239
           " Appariement – multiple = " label(attribute, multiple, color, black)
Patrick@170
   240
           set-attribute-button(attribute, multiple, unset-attribute, yes)
patrick@87
   241
}
patrick@87
   242
patrick@87
   243
/* sort ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   244
patrick@87
   245
sort:before {
patrick@87
   246
  content: insert-before-button() 
patrick@87
   247
           command-button(command, "putAttribute", parameter, "shuffle true", icon, icon(plus-box))
patrick@87
   248
           " Tri";
patrick@87
   249
}
patrick@87
   250
sort[shuffle]:before {
patrick@87
   251
  content: insert-before-button()
patrick@87
   252
           " Tri – shuffle = " label(attribute, shuffle, color, black)
patrick@87
   253
           set-attribute-button(attribute, shuffle, unset-attribute, yes);
patrick@87
   254
}
patrick@87
   255
patrick@125
   256
/* categories ~~~~~~~~~~~~~~~~~~~~~~ */
patrick@125
   257
patrick@125
   258
categories:before {
Patrick@170
   259
  content: insert-before-button() " "
Patrick@170
   260
           command-button(command, "putAttribute", parameter, "multiple true", icon, icon(plus-box))
Patrick@170
   261
           " Catégories";
Patrick@170
   262
}
Patrick@170
   263
categories[multiple]:before {
Patrick@170
   264
  content: insert-before-button()
Patrick@170
   265
           " Catégories – multiple = " label(attribute, multiple, color, black)
Patrick@170
   266
           set-attribute-button(attribute, multiple, unset-attribute, yes)
patrick@125
   267
}
patrick@125
   268
patrick@87
   269
/* production ~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   270
patrick@87
   271
production:before {
patrick@87
   272
  content: insert-before-button() " Production";
patrick@87
   273
}
patrick@87
   274
patrick@87
   275
/* composite ~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   276
patrick@87
   277
composite:before {
Patrick@161
   278
  content: insert-before-button()
Patrick@161
   279
           command-button(command, "putAttribute", parameter, "multipage true", icon, icon(plus-box))
Patrick@161
   280
           " Composite";
Patrick@161
   281
}
Patrick@161
   282
composite[multipage]:before {
Patrick@161
   283
  content: insert-before-button()
Patrick@161
   284
           " Composite – multipage = " label(attribute, multipage, color, black)
Patrick@161
   285
           set-attribute-button(attribute, multipage, unset-attribute, yes)
patrick@87
   286
}
patrick@87
   287
patrick@87
   288
subquiz {
patrick@87
   289
  display: block;
patrick@87
   290
  border-style: none;
patrick@87
   291
  margin: 0 0 .6em 1em;
patrick@87
   292
  padding: 0;
patrick@87
   293
}
patrick@87
   294
patrick@87
   295
subquiz > *, subquiz > *:before  {
patrick@87
   296
  display: block;
patrick@87
   297
}
patrick@87
   298
patrick@87
   299
subquiz > head {
patrick@87
   300
  background-color: #ffffee;
patrick@87
   301
  padding: .3em .5em .3em .5em;
patrick@87
   302
  border-radius: 0.5em;
patrick@87
   303
}
patrick@87
   304
patrick@87
   305
subquiz > instructions:before {
patrick@87
   306
  content: "Consigne";
patrick@87
   307
}
patrick@87
   308
patrick@87
   309
/* help ~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   310
patrick@87
   311
help:before {
patrick@87
   312
  margin-top: .5em;
patrick@87
   313
  background-color: #ffffdd;
patrick@125
   314
  content: insert-before-button() insert-button() " Aide ";
patrick@87
   315
}
patrick@87
   316
patrick@87
   317
help, help > *:before, help > * {
patrick@87
   318
  background-color: #ffffdd;
patrick@87
   319
}
patrick@87
   320
patrick@87
   321
/* answer ~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   322
patrick@87
   323
answer:before {
patrick@87
   324
  margin-top: .5em;
patrick@87
   325
  background-color: #eaffe9;
patrick@87
   326
  content: insert-before-button() insert-button() " Réponse";
patrick@87
   327
}
patrick@87
   328
patrick@87
   329
answer, answer > *:before, answer > * {
patrick@87
   330
  background-color: #eaffe9;
patrick@87
   331
}
patrick@87
   332
patrick@87
   333
answer:after {
patrick@87
   334
  display: none;   
patrick@87
   335
}
patrick@87
   336
patrick@87
   337
patrick@87
   338
/* Block level ============================================================= */
patrick@87
   339
Patrick@161
   340
/* image ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
Patrick@161
   341
Patrick@161
   342
right image, wrong image, item image {
Patrick@161
   343
  content: concatenate("image('Images/", attr(id), ".png', -128, -96, smooth)");
Patrick@161
   344
  vertical-align: middle;
Patrick@161
   345
}
Patrick@161
   346
Patrick@195
   347
/* dropzone ~~~~~~~~~~~~~~~~~~~~~~~~ */
Patrick@195
   348
Patrick@195
   349
dropzone {
Patrick@195
   350
  display: block;
Patrick@195
   351
  padding: .4em;
Patrick@195
   352
  margin: 0 1em .1em 0; 
Patrick@195
   353
  background-color: #ffefd8;
Patrick@195
   354
  border-radius: 1.5em;
Patrick@195
   355
}
Patrick@195
   356
Patrick@195
   357
dropzone image:before {
Patrick@195
   358
  content: "";
Patrick@195
   359
}
Patrick@195
   360
dropzone > image {
Patrick@195
   361
  content: concatenate("image('Images/", attr(id), ".png', -128, -96, smooth)");
Patrick@195
   362
}
Patrick@195
   363
Patrick@195
   364
dropzone > blank {
Patrick@195
   365
  background-color: transparent;
Patrick@195
   366
}
Patrick@195
   367
Patrick@195
   368
dropzone:after {
Patrick@195
   369
  display: marker;
Patrick@195
   370
  padding-bottom: .7em;
Patrick@195
   371
  content: insert-same-after-button(color, #7f7f7f, icon, icon(right-half-disc));
Patrick@195
   372
}
Patrick@195
   373
patrick@87
   374
/* choices.right, choices.wrong ~~~~ */
patrick@87
   375
patrick@87
   376
choices-radio right:before, choices-radio wrong:before,
patrick@87
   377
choices-check right:before, choices-check wrong:before {
patrick@87
   378
  display: marker;
patrick@87
   379
  content: insert-before-button(color, #7f7f7f, icon, icon(left-half-disc))
patrick@87
   380
           insert-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@87
   381
}
patrick@87
   382
patrick@87
   383
choices-radio right, choices-radio wrong,
patrick@87
   384
choices-check right, choices-check wrong {
patrick@87
   385
  display: block;
patrick@87
   386
  margin-left: 24px;
patrick@87
   387
  font-size: 115%;
patrick@87
   388
  font-family: serif;
patrick@87
   389
}
patrick@87
   390
patrick@87
   391
choices-radio > right:before {
patrick@87
   392
  color: #7f7f7f;
patrick@87
   393
  content: insert-before-button(icon, icon(left-half-disc))
patrick@87
   394
           insert-after-button(icon, icon(right-half-disc))
patrick@87
   395
           "  " icon(radio-on) " ";
patrick@87
   396
    
patrick@87
   397
}
patrick@87
   398
choices-radio > wrong:before {
patrick@87
   399
  color: #7f7f7f;
patrick@87
   400
  content: insert-before-button( icon, icon(left-half-disc))
patrick@87
   401
           insert-after-button(icon, icon(right-half-disc))
patrick@87
   402
           "  " icon(radio-off) " ";
patrick@87
   403
    
patrick@87
   404
}
patrick@87
   405
choices-check > right:before {
patrick@87
   406
  color: #7f7f7f;
patrick@87
   407
  content: insert-before-button(icon, icon(left-half-disc))
patrick@87
   408
           insert-after-button(icon, icon(right-half-disc))
patrick@87
   409
           command-button(command, "convert", parameter, "wrong", icon, icon(convert))
patrick@87
   410
           "  " icon(check-on) " ";
patrick@87
   411
}
patrick@87
   412
choices-check > wrong:before {
patrick@87
   413
  color: #7f7f7f;
patrick@87
   414
  content: insert-before-button(icon, icon(left-half-disc))
patrick@87
   415
           insert-after-button(icon, icon(right-half-disc))
patrick@87
   416
           command-button(command, "convert", parameter, "right", icon, icon(convert))
patrick@87
   417
           "  " icon(check-off) " ";
patrick@87
   418
}
patrick@87
   419
patrick@87
   420
choices-radio > right, choices-radio > wrong {
patrick@87
   421
  margin-left: 52px;
patrick@87
   422
}
patrick@87
   423
choices-check > right, choices-check > wrong {
patrick@108
   424
  margin-left: 60px;
patrick@87
   425
}
patrick@87
   426
patrick@87
   427
/* blanks.wrongs ~~~~~~~~~~~~~~~~~~~ */
patrick@87
   428
patrick@87
   429
blanks-select > wrongs:before {
patrick@87
   430
  color: #7f7f7f;
patrick@87
   431
  content: "Intrus : ";
patrick@87
   432
}
patrick@87
   433
patrick@87
   434
blanks-select > wrongs {
patrick@87
   435
  display: block;
patrick@87
   436
  margin: .5em 0 .5em 0;
patrick@87
   437
}
patrick@87
   438
patrick@87
   439
wrongs > wrong {
patrick@87
   440
  display: inline;
patrick@87
   441
  background-color: #c7e0f8;
patrick@87
   442
}
patrick@87
   443
patrick@87
   444
wrongs > wrong:after {
patrick@87
   445
  color: #7f7f7f;
patrick@87
   446
  content: "  –  ";
patrick@87
   447
  background-color: transparent;
patrick@87
   448
}
patrick@87
   449
wrongs > wrong:after:last-child {
patrick@87
   450
  content: insert-same-after-button(color, #7f7f7f, icon, icon(right-half-disc));
patrick@87
   451
}
patrick@87
   452
patrick@87
   453
/* match ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   454
patrick@87
   455
match:before {
patrick@87
   456
  display: marker;
patrick@87
   457
  color: #7f7f7f;
patrick@87
   458
  content: insert-same-before-button(icon, icon(left-half-disc))
patrick@87
   459
           insert-same-after-button(icon, icon(right-half-disc));
patrick@87
   460
}
patrick@87
   461
patrick@87
   462
match {
patrick@87
   463
  display: block;
patrick@87
   464
  margin-left: 24px;
Patrick@161
   465
  margin-bottom: .8em;
patrick@87
   466
}
patrick@87
   467
Patrick@161
   468
match > item:before {
patrick@87
   469
  display: none;
patrick@87
   470
}
patrick@87
   471
Patrick@161
   472
match item {
patrick@87
   473
  display: inline;
patrick@87
   474
}
patrick@87
   475
Patrick@161
   476
match > item:first-child:after {
patrick@87
   477
  color: #7f7f7f;
patrick@87
   478
  content: " —>  ";
patrick@87
   479
}
Patrick@161
   480
match > item:last-child:after {
patrick@87
   481
  display: none;
patrick@87
   482
}
patrick@87
   483
patrick@87
   484
/* sort > comparison ~~~~~~~~~~~~~~~ */
patrick@87
   485
patrick@87
   486
comparison:before {
patrick@87
   487
  color: #7f7f7f;
patrick@87
   488
  content: "Logique de comparaison : "
patrick@87
   489
}
patrick@87
   490
patrick@87
   491
comparison {
patrick@87
   492
  display: block;
patrick@87
   493
  margin: .2em 0 .5em 0;
patrick@87
   494
}
patrick@87
   495
patrick@87
   496
/* sort > item ~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   497
patrick@87
   498
sort > item:before {
patrick@87
   499
  color: #7f7f7f;
patrick@87
   500
  content: insert-before-button(icon, icon(left-half-disc))
patrick@87
   501
           text-field(attribute, "shuffle", columns, 1, font-size, 75%, color, black)
patrick@87
   502
           " ";
patrick@87
   503
}
patrick@87
   504
patrick@87
   505
sort > item {
patrick@87
   506
  display: inline;
patrick@87
   507
}
patrick@87
   508
patrick@87
   509
sort > item:after {
patrick@87
   510
  color: #7f7f7f;
patrick@87
   511
  content: insert-same-after-button(icon, icon(right-half-disc))
patrick@87
   512
           " " xpath("../comparison") " ";
patrick@87
   513
}
patrick@87
   514
sort > item:last-child:after {
patrick@87
   515
  content: insert-same-after-button(icon, icon(right-half-disc)) "\A";
patrick@87
   516
}
patrick@87
   517
patrick@125
   518
/* category ~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@125
   519
Patrick@174
   520
category:before {
Patrick@174
   521
  color: #7f7f7f;
Patrick@174
   522
  content: "  " insert-before-button();
Patrick@174
   523
}
Patrick@174
   524
patrick@125
   525
category {
patrick@125
   526
  display: block;
patrick@125
   527
  margin-bottom: .3em;
patrick@125
   528
}
patrick@125
   529
patrick@125
   530
category > head {
patrick@125
   531
  display: block;
patrick@125
   532
}
patrick@125
   533
Patrick@163
   534
category > head > title:after {
Patrick@163
   535
  content: "";
Patrick@163
   536
}
Patrick@163
   537
patrick@125
   538
category > item {
patrick@125
   539
  margin-left: 1em;
Patrick@161
   540
  margin-bottom: 0.8em;
patrick@125
   541
}
patrick@125
   542
patrick@125
   543
category:after {
patrick@125
   544
  color: #7f7f7f;
patrick@125
   545
  content: "  " insert-same-after-button();
patrick@125
   546
}
patrick@125
   547
patrick@87
   548
patrick@87
   549
/* Inline level ============================================================ */
patrick@87
   550
patrick@87
   551
/* blank ~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
patrick@87
   552
patrick@87
   553
blank {
patrick@87
   554
  background-color: #c0ffc0;
patrick@87
   555
}
patrick@87
   556
patrick@87
   557
s:after {
patrick@87
   558
  color:  #7f7f7f;
Patrick@175
   559
  background-color: #c0ffc0;
patrick@87
   560
  content: insert-same-after-button(icon, icon(right-half-disc));
patrick@87
   561
}
patrick@87
   562
patrick@87
   563
/* point.right & point.wrong ~~~~~~~ */
patrick@87
   564
patrick@87
   565
point right:before, point wrong:before {
patrick@87
   566
  background: transparent;
patrick@87
   567
  color: #7f7f7f;
patrick@87
   568
}
patrick@87
   569
point right:before {
patrick@87
   570
  content: command-button(command, "convert", parameter, "wrong", icon, icon(convert));
patrick@87
   571
}
patrick@87
   572
point wrong:before {
patrick@87
   573
  content: command-button(command, "convert", parameter, "right", icon, icon(convert));
patrick@87
   574
}
patrick@87
   575
patrick@87
   576
point right {
patrick@87
   577
  background-color: #c0ffc0;
patrick@87
   578
}
patrick@87
   579
patrick@87
   580
point wrong {
patrick@87
   581
  background-color: #c7e0f8;
patrick@87
   582
}