This causes undesirable extra space if
the margin_top is not 0 */
p {
line-height: 1.5em;
}
/* mngmnt_icon is used for many of the various action images, the red Xs, the up and down arrows, etc
Example: 
Note the doodlelink is also used.
*/
img.mngmnt_icon {
}
/* ==============================
== Containers
== Most blocks are within a container of some kind
== Setting container layout can have a huge effect on look and feel
============================== */
/* container_box is the main wrapper for all containers. It is invoked by itself. e.g.
*/
div.container_box {
padding: 0px;
margin-bottom: 0px; /* space between containers, shows the generic section color or background
do not set margin-left or margin-right or else the container will be indented*/
/* Do NOT set background color if you want background images to come through */
background-color: transparent; /* =CONTAINER_BG_COLOR= */
/* For blockish themes, set a border on the container box
also consider using a color other than =BORDER_COLOR= for the container boarders */
/* Setting background color in container boxes is like setting it on the generic div
-- it turns the color of almost everything (except where there is a background image)
*/
}
/* ========================================
=== Bring in standard block outlining, new 2/2007 standard
======================================== */
/* =======================================================================
=======================================================================
=========== Start include of _outlines.tpl ============================
=======================================================================
=======================================================================
Used from nearly all looks
========================================
=== Bring in standard block outlining
========================================
include file="common/_outlines.tpl"
*/
/* Each Block's Border in Outline View*/
/* container_edit box is shown when the view is structure
It appears before and ends before the container. e.g.
When not in structure mode:
It is followed by another td with the move block ops
Post 7/2014 -- for BOTH HTML5 and for non-HTML5
There is no table holding the items within container_editheader
It is like the div.container_controls
*/
.container_info {
font-size: small;
/* white-space: nowrap; */
color: #3d2312; /* =CONTAINER_CONTAINER_CONTROL_FONT_COLOR= */
}
div.container_editheader div.container_editheader_info {
/* float: left; Might not be needed, testing */
text-align: left;
font-weight: bold;
}
div.container_editheader div.container_editheader_block {
float: right;
text-align: left
}
/* If the block has a responsive class (Mobile, Tablet, etc) and is suppressed, and if config blocks is on
There is a "Hidden: " warning. It is intended as a prefix, but it seems to go 100% wide
forcing a new line.
*** Dino TODO ***
usage:
Hidden: Mobile General
*/
span.container_info_hidden {
background-color: yellow; /* TODO */
}
/* Standards changed 11/14/06 to allow containermodule_container_editbox and containermodule_side_container_editbox
Delete any container_container stuff */
/* containermodule_container_editbox, containermodule_container_editheader, and containermodule_container_info
apply only to container blocks. The _side variants apply only when the block is not in the main area.
Example Usage when on a sidebar:
*/
div.side_container_editbox {border: 3px solid #DDDDDD;} /* =CONTAINER_SIDE_CONTROL_BG_COLOR= */
div.side_container_editheader {background-color: #DDDDDD;} /* =CONTAINER_SIDE_CONTROL_BG_COLOR= */
div.containermodule_container_editbox {border: 3px solid #9999cc;} /* =CONTAINER_CONTAINER_CONTROL_BG_COLOR= */
div.containermodule_container_editheader {padding: 0px;background-color: #9999cc;} /* =CONTAINER_CONTAINER_CONTROL_BG_COLOR= */
div.containermodule_side_container_editbox {border: 3px solid #9999cc;} /* =CONTAINER_SIDE_CONTAINER_CONTROL_BG_COLOR= */
div.containermodule_side_container_editheader {padding: 0px; background-color: #9999cc;} /* =CONTAINER_SIDE_CONTAINER_CONTROL_BG_COLOR= */
div.allpages_container_editbox {border: 3px solid #669999;} /* =CONTAINER_ALLPAGES_CONTROL_BG_COLOR= */
div.allpages_container_editheader {background-color: #669999;} /* =CONTAINER_ALLPAGES_CONTROL_BG_COLOR= */
div.allpages_containermodule_container_editbox {border: 3px solid #669999;} /* =CONTAINER_ALLPAGES_CONTROL_BG_COLOR= */
div.allpages_container_editheader {background-color: #669999;} /* =$CONTAINER_ALLPAGES_CONTROL_BG_COLOR= */
div.allpages_containermodule_container_editheader {background-color: #669999;} /* =$CONTAINER_ALLPAGES_CONTROL_BG_COLOR= */
/* container_selectbox is a style imposed temporarily when they hover over an edit button.
This class is used by itself
Example Usage:
content from the embedded blocks
When in structure mode, for top level containers:
info icon, up/down links, configure icon
When in structure mode, Embedded containers use
info icon, up/down links, configure icon
content from the embedded blocks
*/
div.container_editbox {
/* Lynn: Not so sure about this. Might be too subtle. Was 3px solid non-grey color */
border: 2px dashed #DDDDDD; /* =CONTAINER_CONTROL_BG_COLOR= */
margin: 5px;
}
div.top_container_editbox {
margin: 0px 0px 4px 0px; }
/* Add a classs that toggles to be visible only when in config blocks */
.in_configblocks {
display: none;
}
div.container_editbox .in_configblocks {
display: block;
}
/* Each Block's Header background color in Structure View*/
div.container_editheader {
padding: 3px;
background-color: #DDDDDD; /* =CONTAINER_CONTROL_BG_COLOR= */
}
/* Pre 7/2014:
container_info is used in a td within the container_editheader
with description about the container such as @left_before127
It should use a small and inobstrusive font and should show well against the
background color of container_editheader
The class is used alone. e.g.
buttons to manipulate the block go here. These are what used to be outside the block in the editheader
Configure block is also here
Only visible if configure blocks or higher
Note that this div is first, even though it floats to the right
This means that if the block size shrinks this div is on top, but still to the right
buttons describing contents of the block
only visible if in debug blocks mode, or in some add block ops
The best class name here is container_editheader_info, but we use container_info as it was ready in use for this
| Not Categorized | orThe 1 board See all 3 Articles | */ .category_title { font-family: arial, helvetica, verdana, tahoma, sans-serif; /* =MAIN_FONT_FAMILY= */ font-size: medium; /* If you use a contrasting background-color, you should set the padding so that the text is not too close to the colored rectangle. */ /* Do not set the background color if in a totally non blockish theme */ /* background-color: WHITE; */ /* =NAVBUTTON_HIGHLIGHT_BG_COLOR= */ padding-left: 4px; padding-top: 1px; padding-bottom: 1px; } /* After modules and cats, there are items Example Use:{$gallery->name}
{$post->title}
*/
.itemtitle { /* imagegallery, newsmodule, weblogmodule. See moduletitle */
/*
font-size: medium;
font-family: Helvetica, Verdana;
*/
font-weight: bold;
}
.paypal_itemtitle {
font-size: large;
}
/* Title links are for parts of titles that are links
They should generally have the same color as a navlink
It is pretty much a manditory class.
Example Usage:
Details...
*/
.title_link {
font-size: x-small;
font-weight: bold;
text-decoration: underline;
color: #6a9282; /* =NAVLINK_FONT_COLOR= */
}
/* If the category title is inversed, then the font must also be inversed
Example Usage:
id more=1 title=$moduletitle}">{$board->name}
id more=1 title=$moduletitle}">{if $board->article_cnt > 1}See all {$board->article_cnt} {$config->article_name_plural}{else}See {$config->article_name}{/if}
|
*/
.category_title_link {
color: #6a9282; /* =MODULE_TITLE_FONT_COLOR= */
}
/* Summaries are the opposite of titles
Example Usage:
|
*/
.summary {
padding-top: 1.3em;
font-size: small;
color: #3d2312; /* =MAIN_FONT_COLOR= */
}
/* Some things need a deeper indentation and less emphisis. They use summary2
Example: |
*/
.summary2 {
font-size: x-small;
text-align: right;
color: #3d2312; /* =MINOR_FONT_COLOR= */
}
/* Much of the site is in table columns, so any setting of
general td will affect many things.
It is best to not have anything here and to let the general div take care of it all
*/
td {
}
/* H3s are still in use in a few places
configure_site, some calendar views, some workflow views
*/
h1 {
color: #3d2312; /* =MAIN_FONT_COLOR= */
padding-bottom: 3px;
border-bottom: 1px solid #6a9282; /* =BASE1_COLOR= */
font-size: xx-large;
letter-spacing: -1px;
}
h2 {
color: #3d2312; /* =MINOR_FONT_COLOR= */
padding-bottom: 3px;
border-bottom: 1px solid #6a9282; /* =BASE1_COLOR= */
font-size: large;
letter-spacing: -1px;
}
h3 {
color: #3d2312; /* =MINOR_FONT_COLOR= */
padding-bottom: 3px;
border-bottom: 1px solid #6a9282; /* =BASE1_COLOR= */
font-size: x-large;
letter-spacing: -1px;
}
/* H1: manage_sites */
/* H2: manage_sites */
/* Unqualified spans are used for theme display, file upload
article status
It is probably best if it resets the color to the system default
*/
span {
}
/* table {
padding: 0px;
width: 100%; -- Blows the mini calendar
} */
/* Some tables have alternating highlight rows.
example: class="row {cycle values='even_row,odd_row'}"
See the "manage page" page for an example
*/
tr.row {
}
tr.even_row {
background-color: transparent; /* =CONTENT_BG_COLOR= */
}
tr.odd_row {
background-color: WHITE; /* =EDITOR_BG_COLOR= */
}
tr.row:hover td, tr.row:hover td a {
background-color: #CCCCCC; /* =HOVER_BG_COLOR= */
}
/* Headers of tables
Example Use:
| Username |
*/
td.header {
background-color: transparent; /* =MODULE_TITLE_BG_COLOR= */
color: #6a9282; /* =MODULE_TITLE_FONT_COLOR= */
font-weight: bold;
font-size: medium; /* Medium? */
text-align: center;
/* No padding if not in a blockish theme */
padding: 0px;
}
td.header a {
/*background-color: transparent; /* =MODULE_TITLE_BG_COLOR= */
/* Don't override the link color */
font-weight: bold;
font-size: medium; /* Medium? */
text-align: center;
padding: 2px;
}
td.boxed { /* This was called administration_modmgrbody in older stylesheets */
border: 2px solid #CCCCCC; /* =BORDER_COLOR= */
padding-left: 10px;
}
/* ==============================
== Links
============================== */
/* 'a' is for the links the user embeds such as with the wywisig editor.
Links to other pages in the site are some form of the a.navlink class
and links to functionality (such as add article) are some form of the a.mngmtlink class */
a {
color: #6a9282; /* =LINK_FONT_COLOR= */
text-decoration: none;
}
a:visited {
color: #6a9282; /* =VISITED_LINK_FONT_COLOR= */
text-decoration: none;
}
/* All of the used links can have a :visited form that changes their color a bit so
folks can see where they have recently been */
a:hover {
color: #4F829E; /* =BASE1_DARKEST_COLOR= */
text-decoration: underline;
}
a.title_empty, a.title_empty:hover {
color: #6a9282; /* =LINK_FONT_COLOR= */
}
/* mngmntlinks (all variants) are for links that do something -- drop a posting,
join a group, etc. They change the state of the DB.
Some themes prefer to mark these somehow, perhaps by making them a bolder color
or in a different font or text decoration. This acts as a warning to users
that the link will do something.
This class is manditory, it is the lead and sometimes the only class listed
Many modules will have a variant of this for optional overrides e.g.
class="mngmntlink article_mngmntlink"
class="mngmntlink calendar_mngmntlink"
It is also often used with mngmntlink_small and doodlelink
*/
a.mngmntlink, a.mngmntlink:visited {
font-size: medium;
text-decoration: none;
color: #6a9282; /* =MANAGEMENTLINK_FONT_COLOR= */
background-color: transparent; /* =MANAGEMENTLINK_BG_COLOR= */
}
a.mngmntlink:hover {
text-decoration: underline;
color: #6a9282; /* =MODULE_TITLE_FONT_COLOR= */
background-color: transparent; /* =MANAGEMENTLINK_BG_COLOR= */
}
/* The _small mngmntlink is used for secondary actions, actions that
need to be listed but which are not often used.
It is an optional class, always being used in a sequence of the following
class="mngmntlink mngmntlink_small"
*/
a.mngmntlink_small {
font-size: x-small;
}
/* The chooselink is used for modal actions such as insert image
When it is used most other link are disabled, so it should be
set to be extra visible.
*/
a.chooselink {
background-image: url("/hotdoodle_engine/iconset/doodle_splat.gif");
background-repeat: no-repeat;
background-position: top left;
height: 20px;
padding-left: 16px;
}
/* The doodlelink is used for things like the edit and permission icons.
It should be visually small, but visually distinctive (such as being red).
Should generally be set the same as a.mngmtlink, but perhaps smaller
It is an optional class, always being used in a sequence of the following
class="mngmntlink doodlelink"
*/
a.doodlelink, a.doodlelink:visited {
font-size: x-small;
text-decoration: none;
color: #6a9282; /* =MANAGEMENTLINK_FONT_COLOR= */
background-color: transparent; /* =MANAGEMENTLINK_BG_COLOR= */
}
a.doodlelink:hover {
text-decoration: underline;
color: #3d2312; /* =MAIN_FONT_COLOR= */
background-color: transparent; /* =MANAGEMENTLINK_BG_COLOR= */
}
/* navigation_mngmntlink is used for those mngmntlinks that affect navigation
e.g. add a page, what type of page, delete page
It is a very optional class, always being used in a sequence of the following
class="mngmntlink navigation_mngmntlink"
*/
a.navigation_mngmntlink {
text-decoration: none;
color: #6a9282; /* =MANAGEMENTLINK_FONT_COLOR= */
font-weight: bold;
font-size: medium;
}
/* navlinks (all variants) are for links that take you somewhere else in the site
but which do NOT do something -- they do not change the state of the DB.
This class is manditory, it is the lead and sometimes the only class listed.
Many modules will have a variant of this for optional overrides e.g.
class="navlink article_navlink"
class="navlink login_navlink"
*/
.navlink, .navlink:visited {
font-size: small;
color: #6a9282; /* =NAVLINK_FONT_COLOR= */
}
/* Consider also setting a.navlink:hover */
.navlink:hover {
color: #6a9282; /* =MODULE_TITLE_FONT_COLOR= */
}
/* Navlink current is used only on navlinks that refer to the current page
In it, you can change the color, font, background, etc to show the user where they are
The class is optional, all uses of it also use navlink.
class="navlink navlinkcurrent"
class="navlink navlinkbutton navlinkcurrent navlinkcurrentbutton"
*/
.navlinkcurrent {
font-weight: 900;
background-color: transparent; /* =NAVLINK_BG_COLOR= */
}
/* For navlinks used in categories. If the category uses a background color,
then we must invert the font color. Example Usage:
id}">{$board->name}
|
or
{$catid->name}
|
*/
.category_navlink, .category_navlink:visited {
color: #6a9282 !important; /* =MODULE_TITLE_FONT_COLOR= */
font-size: x-large;
/* font-weight: bold; */
}
/* ==============================
== Navigation Menu Buttons
============================== *
/* Navlink button is used only in SOME navigation menus such as Expanding_hierarchy_Buttons.
This class is used for the wrapping table, for the individual table cells,
and for the links in the table.
class="navlink navlinkbutton"
class="navlink navlinkbutton navlinkcurrent navlinkcurrentbutton"
*/
table.navbutton {
/* For some reason, full width tables cross outside of the container boundaries
in Mozilla but not in netscape.
Narrow this table
*/
width: 100%;
}
/* The normal navbuttons are either of class navbutton or,if the Rounded style
is in effect, of class navbutton_rounded. Unlike most things on this
stylesheet, both are not used, so navbutton_rounded is not just a fine-tune
of navbutton
*/
td.navbutton {
height: 40px;
padding-left: 10px !important;
border-bottom: 1px solid #4D4D4D; /* =BASE1_DARK_COLOR= */
/*background: #6a9282;;*/ /* =TOPNAV_BG_IMAGE= */
white-space: nowrap;
}
td.navbutton_rounded { /* Used when the rounded style is in effect. Ir is this or td.navbutton, but not both */
border: none;
padding: 4px 0px 4px 0px; /* inner space between menu items */
background-image: none;
}
td.navbutton:hover { /* Not honored in IE */
background-color: WHITE; /* =NAVBUTTON_HIGHLIGHT_BG_COLOR= */
}
/* Chose between =MAIN_BG_COLOR= and =NAVLINK_FONT_COLOR= for the colors here */
td.navbuttoncurrent {
background-color: WHITE; /* =NAVBUTTON_HIGHLIGHT_BG_COLOR= */
}
.navlinkbutton, .navlinkbutton:visited, .navlinkcurrentbutton {
margin: 0px;
padding: 0px;
height: 40px;
color: #3d2312; /* =MAIN_FONT_COLOR= */
font-size: small;
white-space: nowrap;
}
.navlinkbutton_rounded, .navlinkbutton_rounded:visited,
.navlinkcurrentbutton_rounded, .navlinkcurrentbutton_rounded:visited {
background-color: #6a9282; /* =ROUNDED_BG_COLOR= */
background-image: none !important;
}
.navlinkcurrentbutton_rounded, .navlinkcurrentbutton_rounded:visited {
background-color: #6a9282; /* =ROUNDED_BG_COLOR= */
}
/* Mark non-show-in-menu pages */
.navbutton_hidden {
font-weight: lighter;
font-style: italic;
}
/* ========================================
=== Bring in standard shared elements such as help links and boxes
=== These generally do not need to be changed from look to look
======================================== */
/* =======================================================================
=======================================================================
=========== Start _standard_elements.tpl 5/6/2016 ====================
=======================================================================
=======================================================================
Changes here DO NOT CAUSE LOOK RECOMPILATION -- cause all CUSTOM looks to be recompiled.
Built-in looks incorporate changes automatically only if DEVBOX must be set.
Used from nearly all non-responsive looks
========================================
=== Bring in standard shared elements such as help links and boxes
=== These generally do not need to be changed from look to look
========================================
include file="common/_standard_elements.tpl"
Structure of a typical look:
Header variable assignments
_assign_defaults -- for the rest
core stuff: body, div, module title, links
nav buttons and navigation menu related classes
_standard_elements.tpl
title, article, cat
fine tune
topnav
rounded tabs -- todo: explain them
_tbox
_slideshow
_grid
_ezpulldownmenus.tpl
editor
layout areas
styles -- feature, etc
_standard_styles.tpl
style adjustments
*/
/* =======================================
=======================================
=======================================
Most tables
=======================================
=======================================
======================================= */
/* =======================================================================
=======================================================================
=========== Start _tables.tpl 6/2015 ====================================
=======================================================================
=======================================================================
Supplies formatting for hotdoodle tables
Included by _standard_elements when using HTML5.
If you change this file you need to change _standard_elements to force a regen of looks
*/
/* =======================================
Most tables
======================================= */
/* There are many hotdoodle generated tables. This is the basic formatting */
table.table_hd { /* When you want to see the borders, has spacing */
/* replaces |
Articles Block
Articles Block
// ===========================
// Note that there are 3 picture_img clases -- one on the div, on the link, and on the image
// The div is the max image size, but not each image will be that big unless they all
// have the perfect aspect ratio.
// ===========================
