Index: wp-content/themes/twentytwelve/editor-font.css =================================================================== --- wp-content/themes/twentytwelve/editor-font.css (revision 0) +++ wp-content/themes/twentytwelve/editor-font.css (revision 0) @@ -0,0 +1 @@ +@import url("http://fonts.googleapis.com/css?family=Open+Sans:400italic,700italic,400,700"); \ No newline at end of file Index: wp-content/themes/twentytwelve/functions.php =================================================================== --- wp-content/themes/twentytwelve/functions.php (revision 21358) +++ wp-content/themes/twentytwelve/functions.php (working copy) @@ -56,11 +56,16 @@ // Load up our theme options page and related code. require( get_template_directory() . '/inc/theme-options.php' ); $twentytwelve_options = new Twenty_Twelve_Options(); - - // You can define support for an editor stylesheet here; Twenty Twelve doesn't have a default one. - // Then, create a CSS file called editor-style.css and place it in your theme directory. + + // Some awesome comment that explains why we have to add another editor style + $options = $twentytwelve_options->get_theme_options(); + if ( $options['enable_fonts'] ) + add_editor_style( 'editor-font.css' ); + + // This theme styles the visual editor with editor-style.css to match the theme style. add_editor_style(); - + + // Add default posts and comments RSS feed links to . add_theme_support( 'automatic-feed-links' ); Index: wp-content/themes/twentytwelve/editor-style.css =================================================================== --- wp-content/themes/twentytwelve/editor-style.css (revision 0) +++ wp-content/themes/twentytwelve/editor-style.css (revision 0) @@ -0,0 +1,371 @@ +/* +Theme Name: Twenty Twelve +Description: Used to style the TinyMCE editor. +*/ + +html { + font-size: 87.5%; +} + +html .mceContentBody { + max-width: 625px; +} + +body { + color: #444; + font-family: "Open Sans", Helvetica, Arial, sans-serif; + font-size: 14px; + font-size: 1rem; + line-height: 1; + text-rendering: optimizeLegibility; + vertical-align: baseline; +} + + +/* Headings */ +h1, +h2, +h3, +h4, +h5, +h6 { + clear: both; + line-height: 1.846153846; + margin: 24px 0; + margin: 1.714285714rem 0; +} + +h1 { + font-size: 21px; + font-size: 1.5rem; + line-height: 1.5; +} + +h2 { + font-size: 18px; + font-size: 1.285714286rem; + line-height: 1.6; +} + +h3 { + font-size: 16px; + font-size: 1.142857143rem; +} + +h4 { + font-size: 14px; + font-size: 1rem; +} + +h5 { + font-size: 13px; + font-size: 0.928571429rem; +} + +h6 { + font-size: 12px; + font-size: 0.857142857rem; +} + +hr { + /* TODO */ +} + + +/* Text elements */ +p { + margin: 0 0 24px; + margin: 0 0 1.714285714rem; + line-height: 1.714285714; +} + +ul, +ol { + margin: 0 0 24px; + margin: 0 0 1.714285714rem; + line-height: 1.714285714; + padding: 0; +} + +ul { + list-style: disc outside; +} + +ol { + list-style: decimal outside; +} + +ul ul, +ol ol, +ul ol, +ol ul { + margin-bottom: 0; +} + +li { + margin: 0 0 0 24px; + margin: 0 0 0 1.714285714rem; +} + +dl { + margin: 0 24px; + margin: 0 1.714285714rem; +} + +dt { + font-weight: bold; + margin-bottom: 24px; + margin-bottom: 1.714285714rem; +} + +dd { + line-height: 1.714285714; + margin: 0 0 24px; + margin: 0 0 1.714285714rem; +} + +strong { + font-weight: bold; +} + +cite, +em, +i { + font-style: italic; +} + +cite { + border: none; +} + +big { + /* TODO */ +} + +.mceContentBody blockquote { + font-style: italic !important; + font-weight: normal; + margin: 0; + padding: 24px; + padding: 1.714285714rem; +} + +pre { + border: 1px solid #ededed; + color: #666; + font-family: Consolas, Monaco, Lucida Console, monospace; + font-size: 12px; + font-size: 0.857142857rem; + line-height: 1.714285714; + margin: 24px 0; + margin: 1.714285714rem 0; + overflow: auto; + padding: 24px; + padding: 1.714285714rem; +} + +code, +kbd, +samp, +var { + font-family: Consolas, Monaco, Lucida Console, monospace; + font-size: 12px; + font-size: 0.857142857rem; + line-height: 2; +} + +abbr, +acronym, +dfn { + border-bottom: 1px dotted #666; + cursor: help; +} + +address { + display: block; + line-height: 1.714285714; + margin: 0 0 24px; + margin: 0 0 1.714285714rem; +} + +del { + /* TODO */ +} + +ins { + /* TODO */ +} + +sup, +sub { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sup { + top: -0.5em; +} + +sub { + bottom: -0.25em; +} + +input[type=text] { + border: 1px solid #ccc; + border-radius: 3px; + font-family: inherit; + padding: 6px; + padding: 0.428571429rem; +} + +textarea { + border: 1px solid #d5d2ca; + border-radius: 3px; + font-family: inherit; + font-size: 12px; + font-size: 0.857142857rem; + line-height: 1.714285714; + padding: 10px; + padding: 0.714285714rem; + width: 96%; +} + + +/* Links */ +a, +a em, +a strong { + outline: none; + color: #21759b; +} + +a:focus, +a:active, +a:hover { + color: #0f3647; +} + + +/* Alignment */ +.alignleft { + display: inline; + float: left; +} + +.alignright { + display: inline; + float: right; + margin: 12px 0 12px 24px; + margin: 0.857142857rem 0 0.857142857rem 1.714285714rem; +} + +.aligncenter { + clear: both; + display: block; + margin-top: 12px; + margin-top: 0.857142857rem; + margin-bottom: 12px; + margin-bottom: 0.857142857rem; +} + + +/* Tables */ +table { + border-bottom: 1px solid #ededed; + border-collapse: collapse; + border-spacing: 0; + color: #777; + font-size: 12px; + font-size: 0.857142857rem; + line-height: 2; + margin: 0 0 24px; + margin: 0 0 1.714285714rem; + width: 100%; +} + +tr th { + color: #636363; + font-size: 11px; + font-size: 0.785714286rem; + font-weight: bold; + line-height: 2.181818182; + text-align: left; + text-transform: uppercase; +} + +td { + border-top: 1px solid #ededed !important; + color: #777; + font-size: inherit; + font-weight: normal; + text-align: left; + padding: 6px 10px 6px 0; +} + + +/* Images */ +img { + border: 0; + border-radius: 3px; + box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2); + max-width: 100%; +} + +img.size-full { + width: auto/9; /* Prevent stretching of full-size images in IE8 */ +} + +img[class*="wp-image-"] { + height: auto; + max-width: 100%; +} + +img.alignleft { + margin: 12px 24px 12px 0; + margin: 0.857142857rem 1.714285714rem 0.857142857rem 0; +} + +img[class*="align"], +img[class*="wp-image-"], +img[class*="attachment-"] { + height: auto; /* Make sure images with WordPress-added height and width attributes are scaled correctly */ +} + +img.mceWPnextpage { + border-radius: 0; + box-shadow: none; +} + +img.wp-smiley { + border: 0; + border-radius: 0; + box-shadow: none; + margin-bottom: 0; + margin-top: 0; + padding: 0; +} + +.wp-caption { + background: transparent; + border: none; + margin: 0; + padding: 4px; + text-align: left; +} + +.wp-caption-dt { + margin: 0; +} + +.wp-caption .wp-caption-text, +.wp-caption-dd { + color: #777; + font-style: italic; + font-size: 12px; + font-size: 0.857142857rem; + line-height: 2; + margin: 0 0 24px; + margin: 0 0 1.71429rem; +} \ No newline at end of file