From aca28de01e7327a45ce025303fc2acc5c3813406 Mon Sep 17 00:00:00 2001 From: Matthias Andreas Benkard Date: Sat, 9 Jun 2018 19:25:33 +0200 Subject: Use WYMeditor as the article text editor. WYMeditor produces much better XHTML than Trumbowyg. --- .../journal/wymeditor/skins/seamless/icons.png | Bin 0 -> 3651 bytes .../journal/wymeditor/skins/seamless/skin.css | 306 +++++++++++++++++++++ 2 files changed, 306 insertions(+) create mode 100644 static-files/journal/wymeditor/skins/seamless/icons.png create mode 100644 static-files/journal/wymeditor/skins/seamless/skin.css (limited to 'static-files/journal/wymeditor/skins/seamless') diff --git a/static-files/journal/wymeditor/skins/seamless/icons.png b/static-files/journal/wymeditor/skins/seamless/icons.png new file mode 100644 index 0000000..c6eb463 Binary files /dev/null and b/static-files/journal/wymeditor/skins/seamless/icons.png differ diff --git a/static-files/journal/wymeditor/skins/seamless/skin.css b/static-files/journal/wymeditor/skins/seamless/skin.css new file mode 100644 index 0000000..c48d618 --- /dev/null +++ b/static-files/journal/wymeditor/skins/seamless/skin.css @@ -0,0 +1,306 @@ +/*TRYING TO RESET STYLES THAT MAY INTERFERE WITH WYMEDITOR*/ +.wym_skin_seamless p, +.wym_skin_seamless h2, +.wym_skin_seamless h3, +.wym_skin_seamless ul, +.wym_skin_seamless li { + background: transparent url(); + margin: 0; + padding: 0; + border-width: 0; + list-style: none; +} + +/*HIDDEN BY DEFAULT*/ +.wym_skin_seamless .wym_area_left { + display: none; +} +.wym_skin_seamless .wym_area_right { + display: block; +} + +/*TYPOGRAPHY*/ +.wym_skin_seamless { + font-size: 62.5%; + font-family: Verdana, Arial, sans-serif; +} +.wym_skin_seamless h2 { + font-size: 110%; /* = 11px */ +} +.wym_skin_seamless h3 { + font-size: 100%; /* = 10px */ +} +.wym_skin_seamless li { + font-size: 100%; /* = 10px */ +} + +/*WYM_BOX*/ +.wym_box { + margin: 0; + overflow: visible; + width: 98%; +} +.wym_skin_seamless { + border-style: none; + padding: 1px; +} + +/*WYM_HTML*/ +.wym_skin_seamless .wym_html { + width: 98%; +} +.wym_skin_seamless .wym_html textarea { + width: 100%; + height: 200px; + border: 1px solid gray; + background: white; +} + +/* Top controls */ +.wym_skin_seamless .wym_area_top { + width: 802px; + margin-left: auto; + margin-right: auto; + height: 24px; +} +.wym_skin_seamless .wym_area_top_affix_placeholder { + margin: 0px; + padding: 0px; +} +.wym_skin_seamless .affix { + position: fixed; + top: 0px; + width: 100%; + background: white; +} + +/*WYM_IFRAME*/ +.wym_skin_seamless .wym_iframe { + width: 802px; + margin-left: auto; + margin-right: auto; +} +.wym_skin_seamless .wym_iframe iframe { + width: 100%; + /* Don't set a height. That will be dynamic based on the content. */ + border-style: none; + background: white; + display: block; + vertical-align: bottom; +} + +/*AREAS*/ +.wym_skin_seamless .wym_area_left { + width: 150px; + float: left; +} +.wym_skin_seamless .wym_area_right { + width: 150px; + float: right; +} +.wym_skin_seamless .wym_area_bottom { + height: 1%; + clear: both; +} + +/*SECTIONS SYSTEM*/ +/*common defaults for all sections*/ +.wym_skin_seamless .wym_section { + margin-bottom: 5px; +} +.wym_skin_seamless .wym_section h2, +.wym_skin_seamless .wym_section h3 { + padding: 1px 3px; + margin: 0; +} +.wym_skin_seamless .wym_section a { + display: block; + text-decoration: none; + color: black; +} +.wym_skin_seamless .wym_section a:hover { + background-color: yellow; +} +/*hide section titles by default*/ +.wym_skin_seamless .wym_section h2 { + display: none; +} +/*disable any margin-collapse*/ +.wym_skin_seamless .wym_section { + padding-top: 1px; + padding-bottom: 1px; +} + +/*option: add this class to a section to make it render as a panel*/ +.wym_skin_seamless .wym_panel { +} +.wym_skin_seamless .wym_panel h2 { + display: block; +} + +/*option: add this class to a section to make it render as a dropdown menu*/ +.wym_skin_seamless .wym_dropdown { + padding: 0; + background: #ddd; + border: solid gray; + margin-right: 10px; + width: 110px; + float: left; + border-width: 1px 1px 1px 1px; +} +.wym_skin_seamless .wym_dropdown h2 { + display: block; + font-size: 2.0em; + line-height: 20px; +} +.wym_skin_seamless .wym_dropdown ul { + display: none; + position: absolute; + background: white; + font-size: 1.7em; + /* If there's a top margin, we hit a gap and break the hover + * when scrolling down */ + margin-top: 0px; + margin-left: -1px; + padding: 5px 10px 5px 3px; +} +.wym_skin_seamless .wym_dropdown:hover ul, +.wym_skin_seamless .wym_dropdown.hover ul { + display: block; +} +.wym_skin_seamless .wym_dropdown li { + width: 120px; +} + +/* option: add this class to a section to make its elements render buttons + (icons are only available for the wym_tools section for now) + */ +.wym_skin_seamless .wym_buttons { + margin-right: 5px; + float: left; +} +.wym_skin_seamless .wym_buttons li { + float:left; +} +.wym_skin_seamless .wym_buttons a { + width: 20px; + height: 20px; + overflow: hidden; + padding: 2px; +} +/*image replacements*/ +.wym_skin_seamless .wym_buttons li a { + background: url(icons.png) no-repeat; + text-indent: -9999px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_strong a { + background-position: 0 -382px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_emphasis a { + background-position: 0 -22px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_superscript a { + background-position: 0 -430px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_subscript a { + background-position: 0 -454px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_ordered_list a { + background-position: 0 -48px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_unordered_list a { + background-position: 0 -72px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_indent a { + background-position: 0 -574px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_outdent a { + background-position: 0 -598px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_undo a { + background-position: 0 -502px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_redo a { + background-position: 0 -526px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_link a { + background-position: 0 -96px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_unlink a { + background-position: 0 -168px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_image a { + background-position: 0 -121px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_table a { + background-position: 0 -144px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_paste a { + background-position: 0 -552px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_html a { + background-position: 0 -193px; +} +.wym_skin_seamless .wym_buttons li.wym_tools_preview a { + background-position: 0 -408px; +} + +/*DECORATION*/ +.wym_skin_seamless .wym_panel { + padding: 0; + border: solid gray; + border-width: 1px; + background: white; +} +.wym_skin_seamless .wym_panel ul { + margin: 2px 0 5px; +} + +/*DIALOGS*/ +.wym_dialog div.row { + margin-bottom: 5px; +} +.wym_dialog div.row input { + margin-right: 5px; +} +.wym_dialog div.row label { + float: left; + width: 120px; + display: block; + text-align: right; + margin-right: 10px; +} +.wym_dialog div.row-indent { + padding-left: 160px; +} +/*autoclearing*/ +.wym_dialog div.row:after { + content: "."; + display: block; + height: 0; + clear: both; + visibility: hidden; +} +.wym_dialog div.row { + display: inline-block; +} +/* Hides from IE-mac \*/ +* html .wym_dialog div.row { + height: 1%; +} +.wym_dialog div.row { + display: block; +} +/* End hide from IE-mac */ + +/*WYMEDITOR_LINK*/ +a.wym_wymeditor_link { + text-indent: -9999px; + float: right; + display: block; + width: 50px; + height: 15px; + background: url(../wymeditor_icon.png); + overflow: hidden; + text-decoration: none; +} -- cgit v1.2.3