Browse Source

adjust task-list layout and styles

Yuki Takei 7 years ago
parent
commit
7539f8fe04
1 changed files with 23 additions and 15 deletions
  1. 23 15
      src/client/styles/scss/_wiki.scss

+ 23 - 15
src/client/styles/scss/_wiki.scss

@@ -79,17 +79,32 @@ div.body {
     }
     }
   }
   }
 
 
-  // borrowed from https://www.npmjs.com/package/github-markdown-css
-  .contains-task-list {
+  .task-list {
     .task-list-item {
     .task-list-item {
       list-style-type: none;
       list-style-type: none;
-    }
-    .task-list-item+.task-list-item {
-      margin-top: 3px;
-    }
-    .task-list-item input {
       margin: 0 0.2em 0.25em -1.6em;
       margin: 0 0.2em 0.25em -1.6em;
-      vertical-align: middle;
+    }
+    .task-list-item > .task-list {
+      margin-left: 30px;
+    }
+    // use awesome-bootstrap-checkbox
+    .task-list-item .checkbox input[type="checkbox"] {
+      // layout
+      +label {
+        padding-left: 0.3em;
+        &:before {
+          margin-top: 0.4em;
+        }
+      }
+      // styles
+      cursor: default;
+      +label {
+        cursor: default;
+        opacity: 1;
+        &:before, &:after {
+          cursor: default;
+        }
+      }
     }
     }
   }
   }
 
 
@@ -190,13 +205,6 @@ div.body {
       }
       }
     }
     }
 
 
-    // borrowed from https://www.npmjs.com/package/github-markdown-css
-    .contains-task-list {
-      .task-list-item input {
-        margin: 0 0.2em * $ratio 0.25em * $ratio -1.6em * $ratio;
-      }
-    }
-
     .revision-head {
     .revision-head {
       .revision-head-link,
       .revision-head-link,
       .revision-head-edit-button {
       .revision-head-edit-button {