openguides 0.76-2 / usr / share / doc / openguides / README.CSS

This document specifies all the classes and IDs you can use to create a
stylesheet for OpenGuides.

Classes
-------

a.home_link
    Used in: search_results.tt
    Purpose: Link to the home page of the site, in the search results page

a.edit_page_link (was div.edit_page_link)
    Used in: navbar_this_page.tt
    Purpose: Link to the edit page function, in the navbar

div.admin_completed_action
    Used in: admin_home.tt
    Purpose: Display a message confirming the action just taken.

div.disallowed_characters_note
    Used in: newpage.tt
    Purpose: Contains text explaining that some characters aren't allowed in
             node names, and a list of such characters.
div.disallowed_characters_text
    Used in: newpage.tt
    Purpose: Contains text explaining that some characters aren't allowed in
             node names.
div.disallowed_characters
    Used in: newpage.tt
    Purpose: Contains a list of characters that aren't allowed in node names.

div.edit_form_actions
    Used in: edit_form_actions.tt
    Purpose: Contains widgets for previewing, cancelling, and committing an
             edit.
div.preview_edit
    Used in: edit_form_actions.tt
    Purpose: Contains a button for previewing an edit.
div.cancel_edit
    Used in: edit_form_actions.tt, edit_form_preview.tt
    Purpose: Contains a link for cancelling an edit.
div.commit_edit
    Used in: edit_form_actions.tt
    Purpose: Contains a button for committing an edit.

div.edit_form_group
    Used in: edit_form.tt openguides_information_boxes.tt node_image_fields.tt
    Purpose: Handles a single type of data (e.g. locales, phone number,
             latitude, etc) in the edit form.  Contains a label, an
             input/select/textarea, and a space where any edit conflict will
             be flagged up.
div.edit_box
    Used in: edit_form.tt openguides_information_boxes.tt node_image_fields.tt
    Purpose: Contains a input, select, or textarea.
div.conflict_group
    Used in: edit_form.tt node_image_fields.tt
    Purpose: Contains a label and details of an edit conflict for a single
             type of data.
div.conflict_box
    Used in: edit_form.tt node_image_fields.tt
    Purpose: Contains details of an edit conflict for a single type of data.

div.jump_to_edit_form
    Used in: edit_form_preview.tt
    Purpose: Contains a link to jump up or down the page to the edit form,
             when previewing one's edits.

div.licence_and_moderation_notes
    Used in: edit_form.tt
    Purpose: Contains a description of the guide's licence and details of any
             moderation of the current node.
div.licence_notes
    Used in: edit_form.tt
    Purpose: Contains a description of the guide's licence.
div.moderation_warning
    Used in: edit_form.tt
    Purpose: Contains details of any moderation of the current node.

div.navbar_group
    Used in: navbar_*.tt
    Purpose: Defines a related set of navigation bar functions

div.navbar_group_title
    Used in: navbar_*.tt
    Purpose: Titles a related set of navigation bar functions

div.navbar_item
    Used in: navbar_*.tt
    Purpose: Defines an item in the navigation bar

div.preview
    Used in: edit_form_preview.tt
    Purpose: Container for use with #maincontent when the content is being
             previewed while editing.

div.preview_actions
    Used in: edit_form_preview.tt
    Purpose: Groups together links for cancelling an edit and for jumping
             up/down the page to the edit form, when previewing one's edits.

div.warning_text
    Used in: edit_form.tt
    Purpose: Warns the user that there is an edit conflict

h1.edit_form_title
    Used in: edit_form.tt
    Purpose: Display the main heading on the edit form - e.g. Edit "My Node"

input.form_button
    Used in: differences.tt, edit_form.tt, footer.tt, navbar_search.tt,
             newpage.tt, node.tt, preferences.tt, search.tt
    Purpose: A standard form button

label.hidden (was span.hidden)
    Used in: navbar_search.tt
    Purpose: A label for the search box that will be hidden for users with
             a CSS-conforming user agent

li.categories_list
li.locales_list
li.telephone
li.address
li.map
li.postcode
li.website_link
li.opening_hours
    Used in: display_metadata.tt
    Purpose: List items containing various metadata bits.

h2.node_name
    Used in: node.tt
    Purpose: Displays the node name

input.hidden
    Used in: navbar_search.tt
    Purpose: Defines content that will be hidden for users with a
             CSS-conforming user agent

span.current_version_title_link
    Used in: node.tt
    Purpose: On display of historical versions of nodes, provides a link to
             the current version.

span.node_name
    Used in: backlink_results.tt delete_confirm.tt delete_done.tt
             differences.tt node_history.tt
    Purpose: Inlines a node name in a snippet of explanatory text,
             without linking to it.

td.admin_action
    Used in: admin_home.tt
    Purpose: Display possible actions for a node, locale, or category in
             the "recently edited" table.

td.admin_lastmodby
    Used in: admin_home.tt
    Purpose: Display username of the last person to edit a node, locale, or
             category in the "recently edited" table.

td.admin_lastmode
    Used in: admin_home.tt
    Purpose: Display the last-modified time of a node, locale, or category in
             the "recently edited" table.

td.admin_moderate
    Used in: admin_home.tt
    Purpose: Display the moderation status of a node, locale, or category in
             the "recently edited" table.

td.admin_name
    Used in: admin_home.tt
    Purpose: Display the name of a node, locale, or category in the
             "recently edited" table.

td.admin_version
    Used in: admin_home.tt
    Purpose: Display the version number of a node, locale, or category in the
             "recently edited" table.

td.label
    Used in: edit_form.tt
    Purpose: Defines a label for a field

td.recentchanges_comment
    Used in: recent_changes.tt
    Purpose: The user's comment on a change

td.recentchanges_meta
    Used in: recent_changes.tt
    Purpose: Miscellaneous information about a change

td.recentchanges_node_name
    Used in: recent_changes.tt
    Purpose: Name of a node that was changed

td.recentchanges_user
    Used in: recent_changes.tt
    Purpose: User who made a change

div.hit_summary
    Used in: search.tt
    Purpose: One-line summary of individual search result.

IDs
---
	
div#banner
    Used in: banner.tt
    Purpose: The site banner/title

div#body_wrapper
    Used in: header.tt
    Purpose: Wrap the entire body of the page.

div#content
div#maincontent
    Used in: backlink_results.tt, delete_confirm.tt, delete_done.tt,
	     delete_password_wrong.tt, edit_form.tt,
	     home_node.tt, newpage.tt, node.tt, node_history.tt, preferences.tt,
	     recent_changes.tt, search_results.tt, site_index.tt,
	     search.tt, userstats.tt, wanted_pages.tt, differences.tt
    Purpose: Defines the main textual content of the page
             content includes the navbar and footer; maincontent does not

div#coordinates
    Used in: node.tt
    Purpose: The physical coordinates of the node

div#create_new_page
    Used in: newpage.tt
    Purpose: Contains the form for typing in the new page name, and the note
             about disallowed characters.

div#find_within_distance
    Used in: node_location_search.tt
    Purpose: A section of the node display that allows the user to search
             for other nodes close by

div#node_location_search
    Used in: node_location_search.tt
    Purpose: A section of the node display that contains location based 
             searches. 

div#footer
    Used in: footer.tt
    Purpose: The bottom portion of the page

div#footer_delete_link
    Used in: footer.tt
    Purpose: Display a "delete this page" link in the footer, if the page is
    editable, and if page deletion is switched on.

div#header
    Used in: search_results.tt
    Purpose: The first part of the page, containing the site name

div#metadata
    Used in: display_metadata.tt
    Purpose: The section of the node display with a list of metadata

div#navbar_parent
    Used in: navbar.tt
    Purpose: Parent of the navigation bar. If you want to pull bits of the
              navigation out, and put them next to the main nav bar, you'll
              want to make this the size of two parts combined, then size
              them within this.

div#navbar
    Used in: navbar.tt
    Purpose: The navigation bar

div#navbar_help
    Used in: navbar_help.tt
    Purpose: Display help links, if user has them turned on.
div#navbar_options
    Used in: navbar_options.tt
    Purpose: Display links to options such as "Set username/prefs".
div#navbar_search
    Used in: navbar_search.tt
    Purpose: Display search box and link to advanced search.
div#navbar_this_page
    Used in: navbar_this_page.tt
    Purpose: Display links to this-page stuff such as "Edit this page", if
    the current page is an editable one.
div#navbar_tools
    Used in: navbar_tools.tt
    Purpose: Display links to tools such as "Recent Changes", "Random Page".

div#navbar_current_version_link
    Used in: navbar_revision_info.tt
    Purpose: Display a link to the current version when showing a historical
    version of an editable node.

div#navbar_last_edited
    Used in: navbar_revision_info.tt
    Purpose: Display the last edited time when showing the current version of
    an editable node.

div#navbar_this_revision_info
    Used in: navbar_revision_info.tt
    Purpose: Display the version number and edit time when showing a historical
    version of an editable node.

div#navbar_version
    Used in: navbar_revision_info.tt
    Purpose: Display the version number when showing the current version of
    an editable node.

div#node_title
    Used in: node.tt
    Purpose: Display the node name and an "edit this page" link.

div#nonexistent_node_message
    Used in: node.tt
    Purpose: Display message when someone tries to view a nonexistent node.

div#rdf_link
    Used in: node.tt
    Purpose: Link to an RDF version of the node

div#recent
    Used in: home_node.tt
    Purpose: Recent changes summary box on the home node

div#home_page_edit_link
    Used in: home_node.tt
    Purpose: "Edit this page" link on the home node - only displayed if neither
    the navbar or the recent changes box are shown, since both those divs also
    contain an edit link.

div#recent_changes_feeds
    Used in: recent_changes.tt
    Purpose: Display links to atom/RSS feeds of the recent changes.

div#search_form
    Used in: footer.tt
    Purpose: The search form at the bottom of the page

div#title_edit_link
    Used in: node.tt
    Purpose: Display an "edit this page" link near the node name.

div#version
    Used in: node.tt
    Purpose: Text describing the version of the node being displayed

div#node_image_box
    Used in: display_metadata.tt
    Purpose: Hold the image for a node.
    Note: If there is no node image, span#node_no_image will exist instead
span#node_no_image
    Used in: display_metadata.tt
    Purpose: To indicate that there is no image for the node
img#node_image
    Used in: display_metadata.tt
    Purpose: To display the image for a node
div#node_image_copyright
    Used in: display_metadata.tt
    Purpose: To display the name of the copyright holder of a node image, and
             optionally a link to the licence we're using it under.

div#navbar_starting_points
    Used in: navbar.tt
    Purpose: Hold the common locales and categories, if enabled
div#navbar_locales
    Used in: navbar_locales.tt
    Purpose: Hold the common locales, if enabled
div#navbar_categories
    Used in: navbar_categories.tt
    Purpose: Hold the common categories, if enabled
div#navbar_group_title
    Used in: navbar_categories.tt, navbar_locales.tt
    Purpose: Title for the common categories / locales
ul#navbar_group
    Used in: navbar_categories.tt, navbar_locales.tt
    Purpose: Parent list for the common categories / locales
#navbar_group > li
    Used in: navbar_categories.tt, navbar_locales.tt
    Purpose: A common category / locale

fieldset#additional_information
    Used in: edit_form.tt
    Purpose: Contains input fields for phone, address, geodata, etc.

fieldset#main_information
    Used in: edit_form.tt
    Purpose: Contains input fields for content, categories, locales, and
             page summary.

fieldset#node_image_fields
    Used in: node_image_fields.tt
    Purpose: contains input fields for node image, copyright, etc.

fieldset#openguides_information
    Used in: openguides_information_boxes.tt
    Purpose: Contains input widgets for username, comment, and edit type.

form#new_page_form
    Used in: newpage.tt
    Purpose: The form for typing in the new page name.

input#address
    Used in: edit_form.tt
    Purpose: An input field for the address of the node

input#comment
    Used in: openguides_information_boxes.tt
    Purpose: An input field for the comment about the change made

input#fax
    Used in: edit_form.tt
    Purpose: An input field for the fax number of the node

input#geocache
    Used in: preferences.tt
    Purpose: An input field for the preference of whether to display
             geocache links

input#go
    Used in: footer.tt, newpage.tt
    Purpose: A standard button

input#hours
    Used in: edit_form.tt
    Purpose: An input field for the opening hours of a node

input#latlong
    Used in: preferences.tt
    Purpose: An input field for the display preferences of latitude and
             longitude

input#map_link
    Used in: edit_form.tt
    Purpose: An input field for the map link of the node

input#nav_search
    Used in: navbar_search.tt
    Purpose: The search input portion of the navigation bar

input#omit_help
    Used in: preferences.tt
    Purpose: An input field for the preference of whether to include
             help links

input#os_x
    Used in: edit_form.tt
    Purpose: An input field for the OS X coordinate of the node

input#os_y
    Used in: edit_form.tt
    Purpose: An input field for the OS Y coordinate of the node

input#pagename
    Used in: newpage.tt
    Purpose: An input field for choosing the name of a new page

input#phone
    Used in: edit_form.tt
    Purpose: An input field for the telephone number of the node

input#postcode
    Used in: edit_form.tt
    Purpose: An input field for the postcode of the node
	
input#preview_above
    Used in: preferences.tt
    Purpose: An input field for the preference of where to display
             node previews

input#search
    Used in: footer.tt
    Purpose: An input field for the search at the bottom of the page

input#search_lower
    Used in: search.tt
    Purpose: An iput field for the lower search in the main search page

input#search_upper
    Used in: search.tt
    Purpose: An input field for the upper search in the main search page

input#show_minor
    Used in: preferences.tt
    Purpose: An input field for the preference of whether to display
             minor changes

input#username
    Used in: openguides_information_boxes.tt, preferences.tt
    Purpose: An input field for entering the username making changes

input#website
    Used in: edit_form.tt
    Purpose: An input field for the web site of the node

select#distance
    Used in: node.tt
    Purpose: A selection of how far to search in the "find nearby nodes"
             function

select#edit_type
    Used in: openguides_information_boxes.tt
    Purpose: A selection of whether the change is minor or major

select#metadata_type
    Used in: missing_metadata.tt
    Purpose: Display a list of the types of metadata we may wish to check for.

table#categories
    Used in: admin_home.tt
    Purpose: Display recently edited categories.

table#locales
    Used in: admin_home.tt
    Purpose: Display recently edited locales.

table#needing_moderation
    Used in: needing_moderation.tt
    Purpose: Display nodes which have edits pending moderation.

table#nodes
    Used in: admin_home.tt
    Purpose: Display recently edited nodes.

    Also used in: missing_metadata.tt
    Purpose: Display nodes which are missing some metadata.

table#recentchanges
    Used in: recent_changes.tt
    Purpose: The main display table of the recent changes page

textarea#categories
    Used in: edit_form.tt
    Purpose: An box to enter the categories of the node

textarea#content_textarea
    Used in: edit_form.tt
    Purpose: A box to enter the main conent of the node
    Note: ID doesn't match class, as IDs have to be globally unique, and we
           already have a div with ID content

textarea#locales
    Used in: edit_form.tt
    Purpose: A box to enter the locales of the node

div#redirect_message
    Used in: node.tt
    Purpose: A short message indicating that your reached a node via a redirect

table#wanted_pages
    Used in: wanted_pages.tt
    Purpose: A list of all unlinked nodes

div#banner
    Used in: node.tt
    Purpose: A one-line summary of what the node is