Harmonize list- and indent-related CSS in the pad editor and timeslider.

* Add a new file `lists_and_indents.css` to hold the common CSS.
* Remove the corresponding CSS from `iframe_editor.css`, replacing it with
  an `@import` of the new file.
* Remove the list/indent code from `timeslider.css`, which was _unlike_ the
  corresponding editor CSS code, again replacing it with an `@import` of the
  new file.

3 files changed, 212 insertions, 278 deletions

diff --git a/src/static/css/iframe_editor.css b/src/static/css/iframe_editor.css
index 451ce807..5eb94cf7 100644
--- a/src/static/css/iframe_editor.css
+++ b/src/static/css/iframe_editor.css
@@ -1,6 +1,9 @@
 /* These CSS rules are included in both the outer and inner ACE iframe.
    Also see inner.css, included only in the inner one.
 */
+
+@import url('css/lists_and_indents.css');
+
 html { cursor: text; } /* in Safari, produces text cursor for whole doc (inc. below body) */
 span { cursor: auto; }
 
@@ -11,75 +14,11 @@ span { cursor: auto; }
   background: #acf;
 }
 
-a { 
-  cursor: pointer !important; 
+a {
+  cursor: pointer !important;
   white-space:pre-wrap;
 }
 
-ul, ol, li {
-  padding: 0;
-  margin: 0;
-}
-
-ul { margin-left: 1.5em; }
-ul ul { margin-left: 0 !important; }
-ul.list-bullet1 { margin-left: 1.5em; }
-ul.list-bullet2 { margin-left: 3em; }
-ul.list-bullet3 { margin-left: 4.5em; }
-ul.list-bullet4 { margin-left: 6em; }
-ul.list-bullet5 { margin-left: 7.5em; }
-ul.list-bullet6 { margin-left: 9em; }
-ul.list-bullet7 { margin-left: 10.5em; }
-ul.list-bullet8 { margin-left: 12em; }
-ul.list-bullet9 { margin-left: 13.5em; }
-ul.list-bullet10 { margin-left: 15em; }
-ul.list-bullet11 { margin-left: 16.5em; }
-ul.list-bullet12 { margin-left: 18em; }
-ul.list-bullet13 { margin-left: 19.5em; }
-ul.list-bullet14 { margin-left: 21em; }
-ul.list-bullet15 { margin-left: 22.5em; }
-ul.list-bullet16 { margin-left: 24em; }
-
-ul { list-style-type: disc; }
-ul.list-bullet1 { list-style-type: disc; }
-ul.list-bullet2 { list-style-type: circle; }
-ul.list-bullet3 { list-style-type: square; }
-ul.list-bullet4 { list-style-type: disc; }
-ul.list-bullet5 { list-style-type: circle; }
-ul.list-bullet6 { list-style-type: square; }
-ul.list-bullet7 { list-style-type: disc; }
-ul.list-bullet8 { list-style-type: circle; }
-ul.list-bullet9 { list-style-type: disc; }
-ul.list-bullet10 { list-style-type: circle; }
-ul.list-bullet11 { list-style-type: square; }
-ul.list-bullet12 { list-style-type: disc; }
-ul.list-bullet13 { list-style-type: circle; }
-ul.list-bullet14 { list-style-type: square; }
-ul.list-bullet15 { list-style-type: disc; }
-ul.list-bullet16 { list-style-type: circle; }
-
-ul.list-indent1 { margin-left: 1.5em; }
-ul.list-indent2 { margin-left: 3em; }
-ul.list-indent3 { margin-left: 4.5em; }
-ul.list-indent4 { margin-left: 6em; }
-ul.list-indent5 { margin-left: 7.5em; }
-ul.list-indent6 { margin-left: 9em; }
-ul.list-indent7 { margin-left: 10.5em; }
-ul.list-indent8 { margin-left: 12em; }
-ul.list-indent9 { margin-left: 13.5em; }
-ul.list-indent10 { margin-left: 15em; }
-ul.list-indent11 { margin-left: 16.5em; }
-ul.list-indent12 { margin-left: 18em; }
-ul.list-indent13 { margin-left: 19.5em; }
-ul.list-indent14 { margin-left: 21em; }
-ul.list-indent15 { margin-left: 22.5em; }
-ul.list-indent16 { margin-left: 24em; }
-
-ul.list-indent1, ul.list-indent2, ul.list-indent3, ul.list-indent4, ul.list-indent5, 
-ul.list-indent6, ul.list-indent7, ul.list-indent8, ul.list-indent9, ul.list-indent10, 
-ul.list-indent11, ul.list-indent12, ul.list-indent13, 
-ul.list-indent14, ul.list-indent15, ul.list-indent16 { list-style-type: none; }
-
 body {
   margin: 0;
   white-space: nowrap;
@@ -102,11 +41,11 @@ body.grayedout { background-color: #eee !important }
 body.doesWrap {
   /* white-space: pre-wrap; */
 
-  /* 
-    Must be pre-wrap to keep trailing spaces. Otherwise you get a zombie caret, 
+  /*
+    Must be pre-wrap to keep trailing spaces. Otherwise you get a zombie caret,
     walking around your screen (see #1766).
     WARNING: Enabling this causes Paste as plain text in Chrome to remove line breaks
-    this is probably undesirable 
+    this is probably undesirable
     WARNING: This causes copy & paste events to lose bold etc. attributes
     NOTE: The walking-zombie caret issue seems to have been fixed in FF upstream
     so let's try diabling pre-wrap and see how we get on now.
@@ -208,134 +147,6 @@ p {
    Commented out because it stops IE from being able to render the document, crazy IE bug is crazy. */
 /*
 .ace-line{
-  overflow:hidden; 
+  overflow:hidden;
 }
 */
-
-ol { 
-  list-style-type: decimal;
-}
-
-/* Fixes #2223 and #1836 */
-ol > li {
-  display:block;
-}
-
-/* Set the indentation */
-ol.list-number1{ text-indent: 0px; }
-ol.list-number2{ text-indent: 10px; }
-ol.list-number3{ text-indent: 20px; }
-ol.list-number4{ text-indent: 30px; }
-ol.list-number5{ text-indent: 40px; }
-ol.list-number6{ text-indent: 50px; }
-ol.list-number7{ text-indent: 60px; }
-ol.list-number8{ text-indent: 70px; }
-ol.list-number9{ text-indent: 80px; }
-ol.list-number10{ text-indent: 90px; }
-ol.list-number11{ text-indent: 100px; }
-ol.list-number12{ text-indent: 110px; }
-ol.list-number13{ text-indent: 120px; }
-ol.list-number14{ text-indent: 130px; }
-ol.list-number15{ text-indent: 140px; }
-ol.list-number16{ text-indent: 150px; }
-
-/* Add styling to the first item in a list */
-
-.list-start-number1 { counter-reset: first second; }
-.list-start-number2 { counter-reset: second; }
-.list-start-number3 { counter-reset: third; }
-.list-start-number4 { counter-reset: fourth; }
-.list-start-number5 { counter-reset: fifth; }
-.list-start-number6 { counter-reset: sixth; }
-.list-start-number7 { counter-reset: seventh; }
-.list-start-number8 { counter-reset: eighth; }
-.list-start-number9 { counter-reset: ninth; }
-.list-start-number10 { counter-reset: tenth; }
-.list-start-number11 { counter-reset: eleventh; }
-.list-start-number12 { counter-reset: twelth; }
-.list-start-number13 { counter-reset: thirteenth; }
-.list-start-number14 { counter-reset: fourteenth; }
-.list-start-number15 { counter-reset: fifteenth; }
-.list-start-number16 { counter-reset: sixteenth; }
-
-/* The behavior for incrementing and the prefix */
-.list-number1 li:before {
-  content: counter(first) ". " ;
-  counter-increment: first;
-}
-
-.list-number2 li:before {
-  content: counter(first) "." counter(second) ". ";
-  counter-increment: second;
-}
-
-.list-number3 li:before {
-  content: counter(first) "." counter(second) "." counter(third) ". ";
-  counter-increment: third 1;
-}
-
-.list-number4 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) ". ";
-  counter-increment: fourth 1;
-}
-
-.list-number5 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) ". ";
-  counter-increment: fifth 1;
-}
-
-.list-number6 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) ". ";
-  counter-increment: sixth 1;
-}
-
-.list-number7 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) ". ";
-  counter-increment: seventh 1;
-}
-
-.list-number8 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) ". " ;
-  counter-increment: eighth 1;
-}
-
-.list-number9 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) ". ";
-  counter-increment: ninth 1;
-}
-
-.list-number10 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) ". ";
-  counter-increment: tenth 1;
-}
-
-.list-number11 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) ". ";
-  counter-increment: eleventh 1;
-}
-
-.list-number12 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelth) ". ";
-  counter-increment: twelth 1;
-}
-
-.list-number13 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelth) "." counter(thirteenth) ". ";
-  counter-increment: thirteenth 1;
-}
-
-.list-number14 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelth) "." counter(thirteenth) "." counter(fourteenth) ". ";
-  counter-increment: fourteenth 1;
-}
-
-.list-number15 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelth) "." counter(thirteenth) "." counter(fourteenth) "." counter(fifteenth) ". ";
-  counter-increment: fifteenth 1;
-}
-
-.list-number16 li:before {
-  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelth) "." counter(thirteenth) "." counter(fourteenth) "." counter(fifteenth) "." counter(sixteenth) ". ";
-  counter-increment: fixteenth 1;
-}
-
diff --git a/src/static/css/lists_and_indents.css b/src/static/css/lists_and_indents.css
new file mode 100644
index 00000000..c6348efa
--- /dev/null
+++ b/src/static/css/lists_and_indents.css
@@ -0,0 +1,195 @@
+/*
+ * These are the common definitions for the styling of bulleted lists, numbered
+ * lists, and plain indented blocks, shared by the editor and timeslider pages.
+ */
+
+ul, ol, li {
+  padding: 0;
+  margin: 0;
+}
+
+ul { margin-left: 1.5em; }
+ul ul { margin-left: 0 !important; }
+ul.list-bullet1 { margin-left: 1.5em; }
+ul.list-bullet2 { margin-left: 3em; }
+ul.list-bullet3 { margin-left: 4.5em; }
+ul.list-bullet4 { margin-left: 6em; }
+ul.list-bullet5 { margin-left: 7.5em; }
+ul.list-bullet6 { margin-left: 9em; }
+ul.list-bullet7 { margin-left: 10.5em; }
+ul.list-bullet8 { margin-left: 12em; }
+ul.list-bullet9 { margin-left: 13.5em; }
+ul.list-bullet10 { margin-left: 15em; }
+ul.list-bullet11 { margin-left: 16.5em; }
+ul.list-bullet12 { margin-left: 18em; }
+ul.list-bullet13 { margin-left: 19.5em; }
+ul.list-bullet14 { margin-left: 21em; }
+ul.list-bullet15 { margin-left: 22.5em; }
+ul.list-bullet16 { margin-left: 24em; }
+
+ul { list-style-type: disc; }
+ul.list-bullet1 { list-style-type: disc; }
+ul.list-bullet2 { list-style-type: circle; }
+ul.list-bullet3 { list-style-type: square; }
+ul.list-bullet4 { list-style-type: disc; }
+ul.list-bullet5 { list-style-type: circle; }
+ul.list-bullet6 { list-style-type: square; }
+ul.list-bullet7 { list-style-type: disc; }
+ul.list-bullet8 { list-style-type: circle; }
+ul.list-bullet9 { list-style-type: disc; }
+ul.list-bullet10 { list-style-type: circle; }
+ul.list-bullet11 { list-style-type: square; }
+ul.list-bullet12 { list-style-type: disc; }
+ul.list-bullet13 { list-style-type: circle; }
+ul.list-bullet14 { list-style-type: square; }
+ul.list-bullet15 { list-style-type: disc; }
+ul.list-bullet16 { list-style-type: circle; }
+
+ul.list-indent1 { margin-left: 1.5em; }
+ul.list-indent2 { margin-left: 3em; }
+ul.list-indent3 { margin-left: 4.5em; }
+ul.list-indent4 { margin-left: 6em; }
+ul.list-indent5 { margin-left: 7.5em; }
+ul.list-indent6 { margin-left: 9em; }
+ul.list-indent7 { margin-left: 10.5em; }
+ul.list-indent8 { margin-left: 12em; }
+ul.list-indent9 { margin-left: 13.5em; }
+ul.list-indent10 { margin-left: 15em; }
+ul.list-indent11 { margin-left: 16.5em; }
+ul.list-indent12 { margin-left: 18em; }
+ul.list-indent13 { margin-left: 19.5em; }
+ul.list-indent14 { margin-left: 21em; }
+ul.list-indent15 { margin-left: 22.5em; }
+ul.list-indent16 { margin-left: 24em; }
+
+ul.list-indent1, ul.list-indent2, ul.list-indent3, ul.list-indent4, ul.list-indent5,
+ul.list-indent6, ul.list-indent7, ul.list-indent8, ul.list-indent9, ul.list-indent10,
+ul.list-indent11, ul.list-indent12, ul.list-indent13,
+ul.list-indent14, ul.list-indent15, ul.list-indent16 { list-style-type: none; }
+
+ol {
+  list-style-type: decimal;
+}
+
+/* Fixes #2223 and #1836 */
+ol > li {
+  display:block;
+}
+
+/* Set the indentation */
+ol.list-number1{ text-indent: 0px; }
+ol.list-number2{ text-indent: 10px; }
+ol.list-number3{ text-indent: 20px; }
+ol.list-number4{ text-indent: 30px; }
+ol.list-number5{ text-indent: 40px; }
+ol.list-number6{ text-indent: 50px; }
+ol.list-number7{ text-indent: 60px; }
+ol.list-number8{ text-indent: 70px; }
+ol.list-number9{ text-indent: 80px; }
+ol.list-number10{ text-indent: 90px; }
+ol.list-number11{ text-indent: 100px; }
+ol.list-number12{ text-indent: 110px; }
+ol.list-number13{ text-indent: 120px; }
+ol.list-number14{ text-indent: 130px; }
+ol.list-number15{ text-indent: 140px; }
+ol.list-number16{ text-indent: 150px; }
+
+/* Add styling to the first item in a list */
+
+.list-start-number1 { counter-reset: first second; }
+.list-start-number2 { counter-reset: second; }
+.list-start-number3 { counter-reset: third; }
+.list-start-number4 { counter-reset: fourth; }
+.list-start-number5 { counter-reset: fifth; }
+.list-start-number6 { counter-reset: sixth; }
+.list-start-number7 { counter-reset: seventh; }
+.list-start-number8 { counter-reset: eighth; }
+.list-start-number9 { counter-reset: ninth; }
+.list-start-number10 { counter-reset: tenth; }
+.list-start-number11 { counter-reset: eleventh; }
+.list-start-number12 { counter-reset: twelfth; }
+.list-start-number13 { counter-reset: thirteenth; }
+.list-start-number14 { counter-reset: fourteenth; }
+.list-start-number15 { counter-reset: fifteenth; }
+.list-start-number16 { counter-reset: sixteenth; }
+
+/* The behavior for incrementing and the prefix */
+.list-number1 li:before {
+  content: counter(first) ". " ;
+  counter-increment: first;
+}
+
+.list-number2 li:before {
+  content: counter(first) "." counter(second) ". ";
+  counter-increment: second;
+}
+
+.list-number3 li:before {
+  content: counter(first) "." counter(second) "." counter(third) ". ";
+  counter-increment: third 1;
+}
+
+.list-number4 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) ". ";
+  counter-increment: fourth 1;
+}
+
+.list-number5 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) ". ";
+  counter-increment: fifth 1;
+}
+
+.list-number6 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) ". ";
+  counter-increment: sixth 1;
+}
+
+.list-number7 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) ". ";
+  counter-increment: seventh 1;
+}
+
+.list-number8 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) ". " ;
+  counter-increment: eighth 1;
+}
+
+.list-number9 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) ". ";
+  counter-increment: ninth 1;
+}
+
+.list-number10 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) ". ";
+  counter-increment: tenth 1;
+}
+
+.list-number11 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) ". ";
+  counter-increment: eleventh 1;
+}
+
+.list-number12 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelfth) ". ";
+  counter-increment: twelfth 1;
+}
+
+.list-number13 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(seventh) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelfth) "." counter(thirteenth) ". ";
+  counter-increment: thirteenth 1;
+}
+
+.list-number14 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelfth) "." counter(thirteenth) "." counter(fourteenth) ". ";
+  counter-increment: fourteenth 1;
+}
+
+.list-number15 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelfth) "." counter(thirteenth) "." counter(fourteenth) "." counter(fifteenth) ". ";
+  counter-increment: fifteenth 1;
+}
+
+.list-number16 li:before {
+  content: counter(first) "." counter(second) "." counter(third) "." counter(fourth) "." counter(fifth) "." counter(sixth) "." counter(eighth) "." counter(ninth) "." counter(tenth) "." counter(eleventh) "." counter(twelfth) "." counter(thirteenth) "." counter(fourteenth) "." counter(fifteenth) "." counter(sixteenth) ". ";
+  counter-increment: sixteenth 1;
+}
diff --git a/src/static/css/timeslider.css b/src/static/css/timeslider.css
index 2756a006..c2e8aea7 100644
--- a/src/static/css/timeslider.css
+++ b/src/static/css/timeslider.css
@@ -1,3 +1,9 @@
+@import url('css/lists_and_indents.css');
+
+p.pblort {
+  height: 100px;
+}
+
 #editorcontainerbox {
   overflow: auto;
   top: 40px;
@@ -90,7 +96,7 @@
   cursor:hand;
 }
 #playpause_button_icon:before {
-  line-height:44px;  
+  line-height:44px;
   padding-left:2px;
   font-family: fontawesome-etherpad;
   content: "\e82c";
@@ -105,7 +111,7 @@
   border: solid 1px #666;
 }
 .pause:before {
-  line-height:44px;  
+  line-height:44px;
   padding-left:2px;
   font-family: fontawesome-etherpad;
   content: "\e82e" !important;
@@ -256,83 +262,6 @@ stepper:active{
 #padeditor {
   position: static
 }
-/* lists */
-.list-bullet2,
-.list-indent2,
-.list-number2 {
-  margin-left: 3em
-}
-.list-bullet3,
-.list-indent3,
-.list-number3 {
-  margin-left: 4.5em
-}
-.list-bullet4,
-.list-indent4,
-.list-number4 {
-  margin-left: 6em
-}
-.list-bullet5,
-.list-indent5,
-.list-number5 {
-  margin-left: 7.5em
-}
-.list-bullet6,
-.list-indent6,
-.list-number6 {
-  margin-left: 9em
-}
-.list-bullet7,
-.list-indent7,
-.list-number7 {
-  margin-left: 10.5em
-}
-.list-bullet8,
-.list-indent8,
-.list-number8 {
-  margin-left: 12em
-}
-/* unordered lists */
-UL {
-  list-style-type: disc;
-  margin-left: 1.5em;
-}
-UL UL {
-  margin-left: 0 !important
-}
-.list-bullet2,
-.list-bullet5,
-.list-bullet8 {
-  list-style-type: circle
-}
-.list-bullet3,
-.list-bullet6 {
-  list-style-type: square
-}
-.list-indent1,
-.list-indent2,
-.list-indent3,
-.list-indent5,
-.list-indent5,
-.list-indent6,
-.list-indent7,
-.list-indent8 {
-  list-style-type: none
-}
-/* ordered lists */
-OL {
-  list-style-type: decimal;
-  margin-left: 1.5em;
-}
-.list-number2,
-.list-number5,
-.list-number8 {
-  list-style-type: lower-latin
-}
-.list-number3,
-.list-number6 {
-  list-style-type: lower-roman
-}
 
 button{
   margin:0;
@@ -348,4 +277,3 @@ button::-moz-focus-inner {
 button:focus{
   border: 1px solid #666;
 }
-