Support for Przyporzadkuj with short items.

[edumed.git] / catalogue / static / catalogue / css / exercise.css

diff --git a/catalogue/static/catalogue/css/exercise.css b/catalogue/static/catalogue/css/exercise.css
index b9c91e9..614a14c 100644 (file)
--- a/catalogue/static/catalogue/css/exercise.css
+++ b/catalogue/static/catalogue/css/exercise.css
@@ -1,13 +1,15 @@
 @charset "UTF-8";
+.exercise img {
+  vertical-align: top; }
 .exercise .question-piece {
-  border-radius: 0.688em;
-  padding: 0.5em 0.688em; }
+  border-radius: 0.6875em;
+  padding: 0.5em 0.6875em; }
 .exercise .lista.punkt {
   list-style: none;
   margin: 0;
   padding: 0; }
 .exercise .lista li {
-  margin: 0.313em 0; }
+  margin: 0.3125em 0; }
 .exercise .question-piece.correct {
   background-color: #16a487;
   color: white; }
@@ -21,12 +23,12 @@
   display: inline-block;
   border-radius: 0.5em;
   padding: 0.25em 0.5em;
-  margin: -0.25em -0.5em -1em 0.5em;
+  margin: -0.25em -0.5em -0.25em 0.5em;
   background: #ed7831;
   color: white; }
 .exercise .buttons {
   background: #5e6165;
-  border-radius: 0.563em;
+  border-radius: 0.5625em;
   height: 1.875em;
   line-height: 1.875em;
   overflow: hidden;
@@ -41,9 +43,19 @@
     font-weight: bold; }
   .exercise .buttons .message {
     float: right;
-    margin-right: 1.25em; }
+    padding: 0 1.25em;
+    background: red; }
+  .exercise .buttons .maxscore {
+    background: #16a487; }
   .exercise .buttons input.check {
     background: #ed7831; }
+.exercise .instruction {
+  display: block;
+  margin: .3em;
+  color: green;
+  font-size: .9em; }
+.exercise .instruction:before {
+  content: "☞ "; }
 
 .luki .question-piece {
   background-color: #d4d6d8;
@@ -51,16 +63,17 @@
   cursor: pointer;
   z-index: 2;
   display: inline-block;
-  margin: 0.313em;
-  z-index: 2; }
+  margin: 0.3125em;
+  z-index: 2;
+  max-width: 38em; }
 .luki .question-piece.disabled {
   background-color: #eee;
   color: #d4d6d8; }
 .luki .placeholder {
-  border-radius: 0.688em;
-  padding: 0.5em 0.688em;
+  border-radius: 0.6875em;
+  padding: 0.5em 0.6875em;
   display: inline-block;
-  margin: 0.313em;
+  margin: 0.3125em;
   z-index: 2;
   width: 4em;
   background-color: #eee;
@@ -74,7 +87,7 @@
   cursor: pointer;
   z-index: 2;
   display: inline-block;
-  margin: 0.313em;
+  margin: 0.3125em;
   z-index: 2; }
 .zastap .question-piece.disabled {
   background-color: #eee;
@@ -101,57 +114,89 @@
 .uporzadkuj .lista {
   list-style: none;
   margin: 0;
-  padding: 0; }
+  padding: 0;
+  counter-reset: answer; }
+  .uporzadkuj .lista li {
+    counter-increment: answer;
+    padding-right: 3em;
+    background-image: url(/static/img/ornaments/draggable.png);
+    background-repeat: no-repeat;
+    background-position: 100% 50%; }
+  .uporzadkuj .lista li:before {
+    border-radius: 0.6875em;
+    padding: 0.5em 0.6875em;
+    background-color: #d4d6d8;
+    color: #363a3e;
+    cursor: pointer;
+    z-index: 2;
+    content: counter(answer);
+    float: left;
+    margin: -.5em 0 0 -3em; }
+  .uporzadkuj .lista li.ui-sortable-placeholder {
+    counter-increment: answer 0; }
+  .uporzadkuj .lista li.ui-sortable-helper:before {
+    content: none; }
 
 .przyporzadkuj .question-piece {
   background-color: #d4d6d8;
   color: #363a3e;
   cursor: pointer;
-  z-index: 2; }
+  z-index: 2;
+  width: 38.625em; }
+.przyporzadkuj .question-piece.short {
+  display: inline-block;
+  margin: .2em .1em;
+  width: auto; }
+.przyporzadkuj span.question-piece {
+  display: inline-block;
+  margin: .1em;
+  width: auto; }
 .przyporzadkuj .question-piece.disabled {
   background-color: #eee;
   color: #d4d6d8; }
 .przyporzadkuj .predicate {
   list-style: none;
   margin: 0;
-  padding: 0;
-  white-space: nowrap; }
+  padding: 0; }
   .przyporzadkuj .predicate > li {
-    white-space: normal;
-    border-radius: 0.688em;
-    padding: 0.5em 0.688em;
+    border-radius: 0.6875em;
+    padding: 0.5em 0.6875em;
     display: inline-block;
     background-color: #5e6165;
     color: white;
-    width: 11.25em;
+    width: 11.75em;
     position: relative;
     vertical-align: top; }
     .przyporzadkuj .predicate > li .subjects {
       list-style: none;
       margin: 0;
       padding: 0;
-      min-height: 2.813em;
+      min-height: 2.8125em;
       position: relative;
-      margin: 0.5em -0.688em -0.5em -0.688em;
-      padding: 0.5em 0.688em; }
+      margin: 0.5em -0.6875em -0.5em -0.6875em;
+      padding: 0.5em 0.6875em; }
+      .przyporzadkuj .predicate > li .subjects li {
+        width: auto; }
       .przyporzadkuj .predicate > li .subjects .placeholder {
-        border-radius: 0.688em;
-        padding: 0.5em 0.688em;
+        border-radius: 0.6875em;
+        padding: 0.5em 0.6875em;
+        text-align: right;
+        position: relative;
+        padding: 0.5em 0.6875em;
+        margin: 0 -0.6875em; }
+      .przyporzadkuj .predicate > li .subjects .multiple {
         position: absolute;
+        z-index: -1;
         top: 0;
         bottom: 0;
         left: 0;
         right: 0;
-        margin: 0;
-        z-index: -1;
-        text-align: right; }
+        margin: 0; }
       .przyporzadkuj .predicate > li .subjects .placeholder.dragover {
         z-index: 1; }
       .przyporzadkuj .predicate > li .subjects .placeholder:after {
         content: "upuść tutaj";
         text-style: italic; }
-  .przyporzadkuj .predicate .comment {
-    white-space: normal; }
 .przyporzadkuj .subject {
   list-style: none;
   margin: 0;
@@ -173,7 +218,13 @@
     text-transform: uppercase;
     font-weight: bold;
     display: inline-block;
-    padding: 0 0.688em; }
+    padding: 0 0.6875em; }
   .prawdafalsz .question .buttons a.chosen {
     background: #ed7831;
     color: white; }
+
+.wybor .question .lista {
+  list-style: none;
+  padding: 0; }
+  .wybor .question .lista li {
+    margin: 0; }