bootstrap classes integration (#7789)

* bootstrap classes integration * added btn-xs * added comments
publiclab · Apr 21, 2020 · f7908c3 · f7908c3
1 parent 5cb29b2
commit f7908c3
Showing 1 changed file with 65 additions and 0 deletions.
diff --git a/app/assets/stylesheets/editor.css b/app/assets/stylesheets/editor.css
@@ -1,3 +1,68 @@
+/*
+  PublicLab.Editor(https://github.com/publiclab/PublicLab.Editor/) uses bootstrap version 3.4 
+  and plots2 uses bootstrap version 4. Due to class inconsistency between both of the version of
+  bootstrap, css customization of some classes have been introduced to make editor compatible with 
+  both the versions of bootstrap. This include blockquote, code, pre, .btn-default, .btn-xs.  
+*/
+
+blockquote {
+    padding: 10px 20px;
+    margin: 0 0 20px;
+    font-size: 17.5px;
+    border-left: 5px solid #eee;
+}
+
+code {
+  padding: 2px 4px;
+  font-size: 90%;
+  color: #c7254e;
+  background-color: #f5f5f5;
+  border-radius: 4px;
+}
+
+pre {
+    display: block;
+    padding: 9.5px;
+    margin: 0 0 10px;
+    font-size: 13px;
+    line-height: 1.42857143;
+    color: #333;
+    word-break: break-all;
+    word-wrap: break-word;
+    background-color: #f5f5f5;
+    border: 1px solid #ccc;
+    border-radius: 4px;
+
+  // Account for some code outputs that place code tags in pre tags
+  code {
+    padding: 0;
+    font-size: inherit;
+    color: inherit;
+    white-space: pre-wrap;
+    background-color: transparent;
+    border-radius: 0;
+  }
+}
+
+.btn-default {
+    color: #333;
+    background-color: #fff;
+    border-color: #ccc;
+}
+
+.btn-default:hover {
+    color: #333;
+    background-color: #e6e6e6;
+    border-color: #adadad;
+}
+
+.btn-xs {
+    padding: 1px 5px;
+    font-size: 12px;
+    line-height: 1.5;
+    border-radius: 3px;
+}
+
 .moderation-notice {
   font-style: italic;
   color: #888;