﻿/* Custom styles - SharePoint Default Rich Html editor - for dropdown list of "styles" button in ribbon */
/** 
1. refer this css file in master page:
	<SharePoint:CssRegistration name="/_layouts/SSWStyles/editor.css" runat="server" id="editorcss"/>

2. want to use below custom styles in rich html editor, try to update page layout like this:
<PublishingWebControls:RichHtmlField PrefixStyleSheet="ssw15-rte" HasInitialFocus="True" id="PageContent" FieldName="PublishingPageContent" runat="server" />
PrefixStyleSheet="ssw15-rte"  is necessary, it will filter ssw style only, otherwise, it will use SharePoint default styles
HasInitialFocus="True" is optional
FieldName="PublishingPageContent" should be a rich html field name in the page content type.

read more about SharePoint 2010 custom styles:
http://www.sharepointblues.com/2010/10/27/custom-styles-for-sharepoint-2010-rich-html-field/

 **/


/*
.ssw-inputeditorfield
{
    border:1px solid #cccccc;
}*/

/*{prefixstylesheet}Language-{language_code} {
  -ms-name: {display name};
}*/

/**** Style for SharePoint 2013 Html Editor Start ****/
.ssw15-rteLanguage-en {
    -ms-name: English;
}

/*Page Elements*/
P.ssw15-rteElement-P{
    -ms-name:"Paragraph";
    color: #333333;
    line-height: 20px; 
}
H3.ssw15-rteElement-H3 {
    -ms-name:"Heading 3";
    clear: both;
}
/*.RuleContent img
{
	border:1px solid #ccc;
	margin:5px 0px;
	padding:15px;
	background: #eee;
    overflow-x:auto;
	display:block;    
}*/

dl.ssw15-rteElement-ImageArea
{ 
    -ms-name:"Image Area"; 
    padding:2px;    
    margin: 5px 3px 0px 3px;
    border:0px solid #ccc;
    background: none;
}
dl.ssw15-rteElement-ImageArea img
{
	border:1px solid #ccc;
	margin:0px;
	padding:15px;
	background: #eee;
    overflow-x:auto;
	display:block;    
}

dd.ssw15-rteElement-FigureGood{
    -ms-name:"Figure Good";
    background-image: url("/Style Library/SSW/CoreImages/Good.gif");
	background-repeat: no-repeat;
	background-position: left top; 
    padding:0 0 3px 20px;
}
dd.ssw15-rteElement-FigureBad{
	-ms-name:"Figure Bad";
    background-image: url("/Style Library/SSW/CoreImages/Bad.gif");
	background-repeat: no-repeat;
	background-position: left top;
    padding:0 0 3px 20px;
}
dd.ssw15-rteElement-FigureNormal{
	-ms-name:"Figure Normal";
    padding:0 0 3px 0;
}
dd.ssw15-rteElement-FigureGood,dd.ssw15-rteElement-FigureBad,dd.ssw15-rteElement-FigureNormal
{	
	margin:0px 8px 5px 8px;
	display:block;
	font-weight:bold;
}

P.ssw15-rteElement-Tip
{
	-ms-name:"Tip";
	margin:8px;
	display:block;
	font-weight:bold;
}

P.ssw15-rteElement-GreyBox
{
	-ms-name:"Grey Box";
	background: #F5F5F5 none repeat scroll 0 0;
	border:1px solid #999;
	margin: 8px;
	padding:5px 10px 5px 10px;
	display:block;
}
P.ssw15-rteElement-CodeArea
{	
	-ms-name:"Code Area";
	border: solid #CCC;
	border-width: 1px 1px 1px 10px;
	background: #EEE;
	padding: 5px 10px;
	margin: 8px;
	overflow-x:auto;
	display:block;
	width:93%;
}
P.ssw15-rteElement-MultimediaBox
{	
	-ms-name:"Multimedia Box";
	background:#FFFFCC url("/Style Library/SSW/CoreImages/icon-multimedia.jpg") no-repeat scroll 5px 5px;
	display:inline-block;
	min-height:70px;
	min-width:300px;
	border: 1px dashed #999999;
    margin: 8px;
	padding:10px 5px 15px 100px;
}
P.ssw15-rteElement-InfoBox
{	
	-ms-name:"Info Box";
    background-color: #EEEEEE;
    background-image: url("/Style Library/SSW/CoreImages/icon_info.gif");
    background-repeat: no-repeat;
    background-position: 5px 5px;
    border: 1px dashed #999999;
    margin: 8px;
    padding: 10px 5px 15px 60px;
    display: block;
    min-height:35px;
    min-width:300px;
}

P.ssw15-rteElement-YellowBorderBox
{	
	-ms-name:"Yellow Border Box";
	border: solid #FFFF00;
	border-width:2px;
	padding:10px;
	margin: 8px;
	display:inline-block;
}
P.ssw15-rteElement-Reference{
    -ms-name:"People Saying";
    margin:8px;
    border-bottom-color: #cccccc;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    padding: 4px;
    border-left-color: #cccccc;
    border-left-width: 5px;
    border-left-style: solid;
}
P.ssw15-rteElement-SSW-Only
{	
	-ms-name:"SSW Internal Paragraph";
	background-image: url("/Style Library/SSW/CoreImages/Icon_attention.png");
	background-repeat: no-repeat;
	background-position: 10px 10px;
	display:inline-block;
	min-height:40px;
	min-width:300px;
	border: 1px dashed #999999;
	background-color: #EEEEEE;
	float: none;
    margin: 8px;
    padding: 10px 5px 15px 60px;
}
div.ssw15-rteElement-ContentBlock-SSW-Only
{	
	-ms-name:"SSW Internal Block";
	background-image: url("/Style Library/SSW/CoreImages/Icon_attention.png");
	background-repeat: no-repeat;
	background-position: 10px 10px;
	display:inline-block;
	min-height:40px;
	min-width:400px; 
	border: 1px dashed #999999;
	background-color: #EEEEEE;
	float: none;
    margin: 8px;
    padding: 10px 5px 15px 60px;
}

/*Text Styles*/

/* Do not apply this style anymore, changed to use SSWScripts/link.js to apply link styles*/
/*.ssw15-rteStyle-External
{
	-ms-name:"External Link";
	background-image: url("/Style Library/SSW/CoreImages/LeaveSite.gif");
	background-repeat: no-repeat;
	background-position: right center;  
	padding-top: 0px;
	padding-right: 20px;
	padding-bottom: 1px;
	padding-left: 4px;
}*/

.ssw15-rteStyle-Strike
{
	-ms-name:"Strike";
	text-decoration: line-through;
}

.ssw15-rteStyle-Highlight
{
	-ms-name:"Highlight";
	background-color: #FFFF00;
}

.ssw15-rteStyle-Caption
{
	-ms-name:"Caption";
	margin-left:0;
	font-weight:bold;
	color:#555;
}

.ssw15-rteStyle-IndentText
{	
	-ms-name:"Indent Text";
	margin:2px 5px 2px 20px;
}


/**** Style for SharePoint 2013 Html Editor End ****/

table.ssw15-rteTable-default
{
	-ms-name:"SSW Table";
	border:1px solid #ddd;
	margin: 5px 0px;	
	background-color:#f0f0f0;
}
.ssw15-rteTableHeaderRow-default th
{
	text-align: left;
    font-weight: bold;
    color: #333;
    background-color: #DDDDDD;
    border-bottom: 1px solid #FD1912;
    padding: 5px 10px;
}
.ssw15-rteTableOddRow-default {
    background-color: #f5f5f5;
}
.ssw15-rteTableEvenRow-default {
    background-color: white;
}
.ssw15-rteTableOddCol-default {
    padding:5px 10px;
}
.ssw15-rteTableEvenCol-default {
    padding:5px 10px;
}

@media print {
    .hidden-print {
        display:none;
    }
}

/*TODO: Fix - ForeColor, BackColor, FontFace, FontSize*/
