0

Alter widget

GV

01 October 2007 12:53

None

Follow

I want to copy the Example Colorized Code Section widget and create a new widget that has a light grey background.

Inserting the widget into a 1x1 table works, but I would like to alter the widget itself.

Is this possible?

I could not find much online.

• Facebook
• Twitter
• LinkedIn

3 comments

• 0
  
  Permanently deleted user 03 October 2007 03:08

  I'm assuming you mean the 'Colorized Example Code' widget, used with the 'Language Filtered Section' option?

  If so, you can define a style rule in your project to control the background. The style rule needs to match the .LanguageFiltered class. Here's an example:

  DIV.LanguageSpecific
  {
      background: #e0e0e0
  }

  Let me know if you need any more information, or if it is a different widget type you are using.

• 0
  
  GV 09 October 2007 08:43

  Excellent. I was also able to alter the font and give a little border. Code included below for others reference.

  Extended Question:

  I cannot locate the style of the FONT in the code box. (the widget with colorized code in a box with the 'Copy Code' icon.

  The colorized code-font still comes up as Courier, so .LanguageSpecific is not the style for the code box. Any idea what the style is for Language Filtered Code Box?

   

  .LanguageSpecific
  

  {
  font-size: 1.1em;
  font-family: consolas,lucida console,verdana,courier new,monospace
  }

  DIV.LanguageSpecific
  

  {
  margin-top: 1em;
  background: #efefef;
  margin-bottom: 1.2em
  }
• 0
  
  GV 09 October 2007 11:25

  After a hunt and alter through the helpstudio2005.css I found the answer to my question.

  I added this CSS settting to my projects customstyles.css to alter the 'code Box' font

  table.syntaxtable

  {

  font-size: 1.1em;

  font-family: consolas,lucida console,verdana,courier new,monospace

  }