You are here

Home » API reference » Editor 6

editor.css in Editor 6

Same filename and directory in other branches
  1. 5 editor.css
            
/**
* Structure
*/
.editor-toolbar {
  padding: 0 5px;
  height: 25px;
  border-left: 1px solid #99bbe8;
  border-right: 1px solid #abc7ec;
  background: #d2e1f4 url(images/tile-blue.gif) top left repeat-x;
}
.editor-options {
  margin: 2px 0;
  padding: 5px 15px;
  border-left: 1px solid #e9e9e9;
  border-right: 1px solid #e9e9e9;
  background: #fff url(images/tile-white.gif) top left repeat-x;
}
.editor-preview {
  margin: 2px 0;
  padding: 5px;
  height: 200px;
  overflow: auto;
  border: 1px solid #ccc;
  border-right-color: #eee;
  border-bottom-color: #eee;
  background: #fff;    
}

/**
* Types
*/         
.editor-plugin,
.editor-spacer {
  display: block;
  float: left;
  margin: 2px;
}
.editor-spacer { 
  margin: 5px; 
  width: 0;
  height: 15px;
  border-left: 1px solid #aaccf6;
  border-right: 1px solid #eee;
}
.editor-plugin.hover,
.editor-plugin:hover {
  background-color: #d4e2f4;
}
.editor-plugin.active,
.editor-plugin:active {
  background-color: #d4e2f4;
}
.editor-button {
  width: 20px;
  height: 20px;
  cursor: pointer;
  background: 50% 50% no-repeat;
}

/**
* Plugins
*/
#editor-undo {
  background-image: url(images/undo.png); 
}
#editor-redo {
  background-image: url(images/redo.png); 
}
#editor-align_left {
  background-image: url(images/text_align_left.png);
}
#editor-align_center {
  background-image: url(images/text_align_center.png); 
}
#editor-align_right {
  background-image: url(images/text_align_right.png); 
}
#editor-align_justify {
  background-image: url(images/text_align_justify.png); 
}
#editor-link {
  background-image: url(images/link.png); 
}
#editor-mailto {
  background-image: url(images/email_link.png); 
}
#editor-bold {
  background-image: url(images/text_bold.png); 
}
#editor-italic {
  background-image: url(images/text_italic.png); 
}
#editor-code {
  background-image: url(images/page_code.png); 
}
#editor-image {
  background-image: url(images/camera.png); 
}
#editor-html {
  background-image: url(images/html.png); 
}

File

editor.css
View source 
  1.             

  2. /**

  3. * Structure

  4. */

  5. .editor-toolbar {

  6.   padding: 0 5px;

  7.   height: 25px;

  8.   border-left: 1px solid #99bbe8;

  9.   border-right: 1px solid #abc7ec;

  10.   background: #d2e1f4 url(images/tile-blue.gif) top left repeat-x;

  11. }

  12. .editor-options {

  13.   margin: 2px 0;

  14.   padding: 5px 15px;

  15.   border-left: 1px solid #e9e9e9;

  16.   border-right: 1px solid #e9e9e9;

  17.   background: #fff url(images/tile-white.gif) top left repeat-x;

  18. }

  19. .editor-preview {

  20.   margin: 2px 0;

  21.   padding: 5px;

  22.   height: 200px;

  23.   overflow: auto;

  24.   border: 1px solid #ccc;

  25.   border-right-color: #eee;

  26.   border-bottom-color: #eee;

  27.   background: #fff;    

  28. }

  29. 

  30. /**

  31. * Types

  32. */         

  33. .editor-plugin,

  34. .editor-spacer {

  35.   display: block;

  36.   float: left;

  37.   margin: 2px;

  38. }

  39. .editor-spacer { 

  40.   margin: 5px; 

  41.   width: 0;

  42.   height: 15px;

  43.   border-left: 1px solid #aaccf6;

  44.   border-right: 1px solid #eee;

  45. }

  46. .editor-plugin.hover,

  47. .editor-plugin:hover {

  48.   background-color: #d4e2f4;

  49. }

  50. .editor-plugin.active,

  51. .editor-plugin:active {

  52.   background-color: #d4e2f4;

  53. }

  54. .editor-button {

  55.   width: 20px;

  56.   height: 20px;

  57.   cursor: pointer;

  58.   background: 50% 50% no-repeat;

  59. }

  60. 

  61. /**

  62. * Plugins

  63. */

  64. #editor-undo {

  65.   background-image: url(images/undo.png); 

  66. }

  67. #editor-redo {

  68.   background-image: url(images/redo.png); 

  69. }

  70. #editor-align_left {

  71.   background-image: url(images/text_align_left.png);

  72. }

  73. #editor-align_center {

  74.   background-image: url(images/text_align_center.png); 

  75. }

  76. #editor-align_right {

  77.   background-image: url(images/text_align_right.png); 

  78. }

  79. #editor-align_justify {

  80.   background-image: url(images/text_align_justify.png); 

  81. }

  82. #editor-link {

  83.   background-image: url(images/link.png); 

  84. }

  85. #editor-mailto {

  86.   background-image: url(images/email_link.png); 

  87. }

  88. #editor-bold {

  89.   background-image: url(images/text_bold.png); 

  90. }

  91. #editor-italic {

  92.   background-image: url(images/text_italic.png); 

  93. }

  94. #editor-code {

  95.   background-image: url(images/page_code.png); 

  96. }

  97. #editor-image {

  98.   background-image: url(images/camera.png); 

  99. }

  100. #editor-html {

  101.   background-image: url(images/html.png); 

  102. }