+
+/* Rules for rich text */
+
+.richtext {
+ h1, h2 {
+ padding-bottom: 10px;
+ border-bottom: 1px dashed #cccccc;
+ margin-bottom: 10px;
+ }
+
+ h1 {
+ font-size: 24px;
+ }
+
+ h2 {
+ font-size: 18px;
+ }
+
+ h3 {
+ font-size: 14px;
+ }
+
+ img {
+ padding: 20px;
+ background-color: #f4f4ff;
+ display: block;
+ max-width: 100%;
+ margin: auto;
+ box-sizing: border-box;
+ -moz-box-sizing: border-box;
+ }
+
+ blockquote {
+ border-left: 20px solid #f4f4ff;
+ padding-left: 20px;
+ margin: 0;
+ color: #7E7E7E;
+ }
+
+ ul, ol {
+ font-style: italic;
+ padding-left: 20px;
+ margin-bottom: 20px;
+ margin-left: 20px;
+ }
+
+ ul li {
+ list-style: disc;
+ }
+
+ ol li {
+ list-style: decimal;
+ }
+}
+
+.diary_post .richtext {
+ margin-top: 20px;
+ }
+
+.comments .richtext {
+ margin-left: 70px;
+ margin-top: 0;
+}
+
+/* Rules for rich text editors */
+
+.richtext_container {
+ white-space: nowrap;
+
+ .richtext_content {
+ display: inline-block;
+ vertical-align: top;
+ white-space: normal;
+
+ .richtext_preview {
+ display: inline-block;
+ padding: 20px;
+ background-color: #f4f4ff;
+ overflow-x: scroll;
+
+ &.loading {
+ background-image: image-url("loading.gif");
+ background-repeat: no-repeat;
+ background-position: center;
+ }
+
+ > :first-child {
+ margin-top: 0px;
+ }
+ }
+ }
+
+ .richtext_help {
+ display: inline-block;
+ vertical-align: top;
+ margin-left: 15px;
+ background-color: #f8f8ff;
+ padding: 10px;
+ width: 200px;
+
+ ul {
+ margin-bottom: 0;
+ }
+
+ h4.heading, li {
+ border-bottom: 1px solid #ccc;
+ margin-bottom: 5px;
+ padding-bottom: 5px;
+ }
+
+ li h4, li span {
+ display: block;
+ font-size: 11px;
+ }
+
+ li h4 {
+ margin: 0;
+ float: left;
+ }
+
+ li span {
+ float: right;
+ width: 50%;
+ margin-left: 10px;
+ }
+
+ input.richtext_doedit,
+ input.richtext_dopreview {
+ margin-right: 10px;
+ }
+ }
+}
+
+/* Rules for the user notes list */
+
+.note_list {
+ tr.creator {
+ background-color: #eeeeee;
+ }
+
+ td {
+ padding: 3px;
+ }
+
+ p {
+ margin-bottom: 0px;
+ }
+}
+
+/* Rules for the notes interface */
+
+.note {
+ padding-top: 10px;
+}
+
+.note {
+ h2 {
+ margin-bottom: 10px;
+ }
+
+ div {
+ margin-top: 10px;
+ }
+
+ .permalink {
+ position: absolute;
+ top: 5px;
+ left: 5px;
+ min-width: 15px;
+ min-height: 15px;
+ background: image-url("sprite.png") 0 -45px no-repeat;
+ }
+
+ .permalink span {
+ display: none;
+ padding-left: 20px;
+ }
+
+ .permalink:hover span {
+ display: block;
+ }
+
+ .warning {
+ display: block;
+ background-color: #ffe0cc;
+ padding: 4px 6px;
+ margin-bottom: 10px;
+ }
+
+ .comment_body {
+ margin-top: 2px;
+ margin-bottom: 2px;
+
+ p {
+ margin-top: 0px;
+ margin-bottom: 0px;
+ }
+ }
+
+ .comment {
+ width: 100%;
+ }
+
+ .buttons {
+ margin-top: 5px;
+ text-align: right;
+ }
+}