Merge pull request #152 from greezybacon/issue/137

Ensure sane and consistent styling

Reviewed-By: Peter Rotich <peter@osticket.com>

assets/default/css/theme.css

@@ -824,32 +824,6 @@ a.refresh {
   background-position: 0 50%;
   background-repeat: no-repeat;
 }
-/* Inline image hovering with download link */
-.image-hover {
-    display: inline-block;
-    position: relative;
-}
-.image-hover .caption {
-    background-color: rgba(0,0,0,0.5);
-    min-width: 20em;
-    color: white;
-    padding: 1em;
-    display: none;
-    width: 100%;
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
-}
-.image-hover .caption .filename {
-    display: inline-block;
-    max-width: 60%;
-}
-.ticket-thread-body img {
-    width: auto;
-    height: auto;
-    max-width: 100%;
-}
 .action-button {
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;

css/thread.css

@@ -161,33 +161,6 @@
 .thread-body cite {
   font-style: normal;
 }
-.thread-body .text-muted {
-  color: #999999;
-}
-.thread-body .text-primary {
-  color: #428bca;
-}
-.thread-body .text-warning {
-  color: #c09853;
-}
-.thread-body .text-danger {
-  color: #b94a48;
-}
-.thread-body .text-success {
-  color: #468847;
-}
-.thread-body .text-info {
-  color: #3a87ad;
-}
-.thread-body .text-left {
-  text-align: left;
-}
-.thread-body .text-right {
-  text-align: right;
-}
-.thread-body .text-center {
-  text-align: center;
-}
 .thread-body h1,
 .thread-body h2,
 .thread-body h3,
@@ -410,6 +383,98 @@
   display: table-cell;
 }
 
+/* Redactor consistency styles */
+.thread-body div,
+.thread-body p,
+.thread-body ul,
+.thread-body ol,
+.thread-body table,
+.thread-body dl,
+.thread-body blockquote,
+.thread-body pre {
+	font-size: 14px;
+	line-height: 1.25rem;
+}
+
+.thread-body div:not(.caption),
+.thread-body p,
+.thread-body ul,
+.thread-body ol,
+.thread-body table,
+.thread-body dl,
+.thread-body blockquote,
+.thread-body pre {
+	margin: 0;
+	margin-bottom: 10px !important;
+	border: none;
+	background: none !important;
+	box-shadow: none !important;
+}
+
+.thread-body iframe,
+.thread-body object,
+.thread-body hr {
+	margin-bottom: 15px !important;
+}
+
+.thread-body iframe {
+    display: block;
+	margin: 0;
+	padding: 0;
+}
+
+/* Styles or override ridiculous Microsoft Outlook list styles */
+.thread-body ul,
+.thread-body ol {
+	padding-left: 2em !important;
+}
+.thread-body ul ul,
+.thread-body ol ol,
+.thread-body ul ol,
+.thread-body ol ul {
+	margin: 2px !important;
+	padding: 0 !important;
+	padding-left: 2em !important;
+	border: none;
+}
+
+/* Styles to keep the thread-entry sizing sane */
+.thread-body img:not(.optional),
+.thread-body div.non-local-image {
+    width: auto;
+    height: auto;
+    max-width: 100%;
+}
+
+table.thread-entry {
+    table-layout: fixed;
+}
+
+/* Inline image hovering with download link */
+.image-hover {
+    display: inline-block;
+    position: relative;
+}
+.image-hover .caption {
+    background-color: rgba(0,0,0,0.5);
+    min-width: 20em;
+    color: white;
+    padding: 1em;
+    display: none;
+    width: 100%;
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
+    font-size: 14px;
+    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
+}
+.image-hover .caption .filename {
+    display: inline-block;
+    max-width: 60%;
+    overflow: hidden;
+}
+
 /* Additional style for the mighty Microsoft Office emails "standard" style */
 p.MsoNormal, li.MsoNormal, div.MsoNormal,
 p.MsoPlainText, li.MsoPlainText, div.MsoPlainText

scp/css/scp.css

@@ -1472,39 +1472,6 @@ ul.progress li.no small {color:red;}
 
 #loading h4, #upgrading h4 { margin: 3px 0 0 0; padding: 0; color: #d80; }
 
-/* Inline image hovering with download link */
-.image-hover {
-    display: inline-block;
-    position: relative;
-}
-.image-hover .caption {
-    background-color: rgba(0,0,0,0.5);
-    min-width: 20em;
-    color: white;
-    padding: 1em;
-    display: none;
-    width: 100%;
-    position: absolute;
-    bottom: 0;
-    left: 0;
-    -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
-}
-.image-hover .caption .filename {
-    display: inline-block;
-    max-width: 60%;
-    overflow: hidden;
-}
-
-.thread-body img:not(.optional) {
-    width: auto;
-    height: auto;
-    max-width: 100%;
-}
-
-.non-local-image {
-    display: inline-block;
-}
-
 .non-local-image:after {
     background: url(../images/ost-logo.png) center center no-repeat;
     background-size: cover;