Subversion Repositories wimsdev

Rev

Blame | Last modification | View Log | RSS feed

  1. /**
  2.   seriebar.css
  3.   Displays a list of exo (exo done, current exo and exo to do), with an "arrow" style.
  4.   If you want an "square" style, use "seriebar_squares.css" instead
  5.     HTML template can look like this :
  6.     <ul class="wims_serie_bar inline">
  7.       <li class="wims_exo_done" title="Question 1 (done)">1</li>
  8.       <li class="wims_exo_todo" title="Question 2 (current)">2</li>
  9.       <li title="Question 3 (not tried yet)">3</li>
  10.       <li title="Question 4 (not tried yet)">3</li>
  11.       [...]
  12.     </ul>
  13. **/
  14.  
  15. #oef_actions .wims_serie_bar{
  16.     display:block;
  17.     margin:4px auto;
  18.     /*font-size:90%;*/
  19. }
  20.  
  21. .wims_serie_bar li{
  22.     display: inline-block;
  23.     position: relative;
  24.     /*min-height:1em;*/
  25.     line-height:1em;
  26.     min-width:1em;
  27.     padding:.1em 3px;
  28.     margin:0;
  29.     margin-right:.66em;
  30.     cursor:help;
  31. }
  32.  
  33. .wims_serie_bar .wims_next_exo{
  34.     padding:0;
  35.     cursor:hand;
  36.     border:none;
  37. }
  38.  
  39. .wims_serie_bar li:after, .wims_serie_bar li:before {
  40.     left: 100%;
  41.     /*right:0;*/
  42.     top: 50%;
  43.     border: solid transparent;
  44.     content: " ";
  45.     height: 0;
  46.     width: 0;
  47.     position: absolute;
  48.     pointer-events: none;
  49. }
  50.  
  51. .wims_serie_bar li:after {
  52.     border-color: transparent;
  53.     border-width: .5em;
  54.     margin-top: -.5em;
  55. }
  56. .wims_serie_bar li:before {
  57.     border-color: transparent;
  58.     border-width: .8em;
  59.     margin-top: -.8em;
  60. }
  61.  
  62. /* lien vers l'exercice suivant */
  63. .wims_serie_bar li a {
  64.     display: inline-block;
  65.     padding:1px .4em;
  66.     border:2px solid #88b7d5;
  67.     border-right:none;
  68.     text-decoration: none;
  69.     color:white;
  70. }
  71. .wims_serie_bar li a:hover{
  72.     color:rgb(34, 125, 163);
  73. }
  74.  
  75. .wims_serie_bar .wims_next_exo:after {
  76.     left:93%;
  77. }
  78. .wims_serie_bar .wims_next_exo:before {
  79.     border-width: .8em;
  80.     margin-top: -.8em;
  81.     left:93%;
  82.     border-left-color:#88b7d5;
  83. }
  84.  
  85. /* Questions not tried */
  86. .wims_serie_bar li {
  87.     border: 2px solid #DFDFDF;
  88.     background-color: lightgrey;
  89.     color: white;
  90. }
  91. .wims_serie_bar li:after {
  92.     border-left-color: lightgrey;
  93. }
  94. .wims_serie_bar li:before {
  95.     border-left-color: #DFDFDF;
  96. }
  97.  
  98. /* Current Question */
  99. .wims_serie_bar .wims_exo_todo{
  100.     border-color: #A5D7DE;
  101.     background-color: rgb(34, 125, 163);
  102. }
  103. .wims_serie_bar .wims_exo_todo:after{
  104.     border-left-color: rgb(34, 125, 163);
  105. }
  106. .wims_serie_bar .wims_exo_todo:before {
  107.     border-left-color: #A5D7DE;
  108. }
  109.  
  110.  
  111. /* Questions done */
  112. .wims_serie_bar .wims_exo_done{
  113.     border-color: #c2e1f5;
  114.     background: #88b7d5;
  115. }
  116. .wims_serie_bar .wims_exo_done:after{
  117.     border-left-color: #88b7d5;
  118. }
  119. .wims_serie_bar .wims_exo_done:before {
  120.     border-left-color: #c2e1f5;
  121. }
  122.