/** ======================================================================= Frog CMS - Content Management Simplified. Copyright (C) 2008 Philippe Archambault This program is free software: you can redistribute it and/or modify it under the terms of the GNU Affero General Public License as published by the Free Software Foundation, either version 3 of the License, or (at your option) any later version. This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU Affero General Public License for more details. You should have received a copy of the GNU Affero General Public License along with this program. If not, see . ======================================================================== THIS STYLESHEET was first published Feb 14, 2009 by Ricky Irvine. No warranties or guarantees come with it. Feel free to edit it further and give it to all your neighbors. If you have Q's about it, post to the FROG CMS forum: http://forum.madebyfrog.com/topic/1016 UPDATES: Feb 16, 2009 - Moved selectors for boxes with CSS3 shadows to one place. - Added shadows to .popup. Feb 23, 2009 - Commented out fancy #site-title font styling by default (not everyone has Calibri font installed; if you have it, see line 89!). - Removed most unused selectors. ======================================================================== */ /* General ---------------------------------------------------------------- */ body {background-color:#fff} h1 {color:#000; background-color:#f5f5f5; text-shadow:none; padding-top:.5em} h1 a {color:#000} h3, form h3:first-child {padding:2em 0 0 0; margin:0} h3:first-child {padding-top:.5em} .warning {color:#D42B27} #content textarea, .form-area .title .textbox, code {font-family:consolas} code {font-size:.9em} #site-title, h1,h2,h3,h4,h5,h6 {text-shadow:none !important} .form-area .title .textbox {font:bold 1.5em "Lucida Sans","Lucida Sans Unicode","Lucida Grande",Lucida,sans-serif; padding:.3em 0 .3em .4em; width:98.5%; margin:0} #snippet_name {margin:0; width:98.5%; border:0;} /* Rounded stuff ---------------------------------------------------------- */ #installation #content-wrapper, #body_setting_index #content-wrapper, #body_page_index #content-wrapper, #body_page_add #content-wrapper, #body_page_edit #content-wrapper, #body_snippet_add #content-wrapper, #body_snippet_edit #content-wrapper, #body_layout_add #content-wrapper, #body_layout_edit #content-wrapper, #body_user_add #content-wrapper, #body_user_edit #content-wrapper, #body_comment_edit #content-wrapper, #body_plugin_index #content-wrapper, #content, #content-wrapper, #mainTabs a, .tab, #sidebar p.button {-moz-border-radius-topleft:3px; -moz-border-radius-topright:3px; -webkit-border-top-left-radius:3px; -webkit-border-top-right-radius:3px} /* Shadowed stuff --------------------------------------------------------- */ .dpDiv, .popup {-webkit-box-shadow:0 2px 20px #444; -moz-box-shadow:0 2px 20px #444} /* Header ----------------------------------------------------------------- */ #header {color:#fff; background-color:#77C022} #header a {color:#fff} /* Uncomment the following line if you have Calibri installed on your computer (http://en.wikipedia.org/wiki/Calibri) */ /* #site-title, #site-title a {font:italic bold 1.5em/1 calibri} */ /* Navigation ------------------------------------------------------------- */ #mainTabs a:link, #mainTabs a:visited {color:#ecffd8; background-color:#3e6511; border-color:#3e6511; line-height:14px; margin-top:2px} #mainTabs a:hover {color:#ecffd8; border-color:#3e6511} #mainTabs a:link.current, #mainTabs a:visited.current {color:#3e6511; background-color:#fff; border-color:#fff; font-weight:normal} /* Content ---------------------------------------------------------------- */ #content-wrapper {background-color:#fff; border-color:#C7C7C7} #content {border:.4em solid #f5f5f5; padding-bottom:0; background:#f5f5f5} .index, #site-map {border-bottom:1.5em solid transparent !important} /* Sidebar ---------------------------------------------------------------- */ #sidebar {color:#5a5a5a;} #sidebar h2 {border-color:#bfbfbf} #sidebar .box {background-color:#f5f5f5; border-color:#bfbfbf} #sidebar p.button {background-color:#f2f29d} #sidebar p.button img {background-color:#e5e572} #sidebar p.button a {color:#4b4b25} #sidebar p.button a:hover {color:#303030} #sidebar .this {color:#999} #sidebar .optional {color:#666} /* Footer ----------------------------------------------------------------- */ #footer {color:#555} #footer .stats {color:#777} /* Site links ------------------------------------------------------------- */ #site-links {color:#fff} #site-links a, #site-links a:visited {color:#fff} /* Messages --------------------------------------------------------------- */ #info {background:#f2f29d} #error {background:#a22; color:#fff} #error a {color:#fff; font-weight:bold} #success {background:#cfc; color:#051} /* Index table ------------------------------------------------------------ */ table.index {border-color:#ddd} table.index th {background-color:#f5f5f5} table.index td {border-color:#ddd} table.index .node .user small {color:#666} table.index .even:hover, table.index .odd:hover, table.index .even.hover, table.index .odd.hover {background-color:#f5f5f5;} table.index .node .snippet a, table.index .node .snippet a:visited, table.index .node .layout a, table.index .node .layout a:visited, table.index .node .user a, table.index .node .user a:visited {color:#000;} table.index td.note {color:silver} .index-def, #site-map-def {padding-bottom:.4em;} /* Site Map --------------------------------------------------------------- */ #site-map-root .page a .title, #site-map .page a .title, #site-map .node .page a:visited .title {color:#000} #site-map .node .page .title.protected {color:#9eb3bf} #site-map .node .page .info {color:#999; font-style:normal} #site-map-def div {background-color:#f5f5f5;} #site-map {border-color:#ddd} #site-map-root li, #site-map li {border-color:#e6e6e6} #site-map-root li:hover, #site-map-root li.hover, #site-map li:hover, #site-map li.hover {background-color:#eee} #site-map ul {background-color:#f9f9f9} #site-map .status {color:#999} #site-map .status.draft-status {color:#c00} #site-map .status.published-status {color:#000} #site-map .status.hidden-stats {color:#0c0} /* Form Elements ---------------------------------------------------------- */ .form-area {background-color:#f5f5f5; padding-top:0} .form-area .error-with-field .error {color:#f00} table.fieldset td {background-color:white; border-color:#ccc} table.fieldset td.label .optional {color:#929488} table.fieldset td.help {background-color:#fff; font-size:11px; color:#777;} table.fieldset .error-with-field small {color:red} /* Tabs ------------------------------------------------------------------- */ #tabs-meta .tab, #tabs .tab {background-color:#ddd; color:#000} #tabs-meta .tab.here, #tabs .tab.here {background-color:#fff} #tab-toolbar img {padding-bottom:2px} #meta-divs td {background-color:#fff} #meta-divs td.label .optional {color:#929488} #meta-divs, #pages {background-color:white} #content textarea {border-color:#ccc} /* Popups ----------------------------------------------------------------- */ #content .popup {background-color:white; border-color:silver} #content .popup .close-link {color:#999} /* Comments --------------------------------------------------------------- */ #comments-def div {background-color:#f5f5f5; border-color:#ddd} #comments li {border-color:#ddd} #comments li:hover {background-color:#eee} #comments .infos {color:#666} #comments .approve {color:#7a7; background-color:#dfd; border-color:#9c9} #comments .approve a {color:#696} #comments .approve .infos {color:#8b8} /* Admin page ------------------------------------------------------------- */ .plugin h4 {font-size:1.1em; line-height:1.1em; padding-top:.4em} .plugin p {color:#555} /* Calendar (Date picker) ------------------------------------------------- */ .dpDiv {background-color:#fff; border:6px solid #d0d0d0; padding:.3em 1em} /* the table (within the div) that holds the date picker calendar */ .dpTable {color:#666} .dpTable td {border-color:#f0f0f0; line-height:1.5} /* a table row that holds date numbers (either blank or 1-31) */ .dpTR {} /* the top table row that holds the month, year, and forward/backward buttons */ .dpTitleTR {color:#000; background-color:#fff} /* the second table row, that holds the names of days of the week (Mo, Tu, We, etc.) */ .dpDayTR {} /* the bottom table row, that has the "This Month" and "Close" buttons */ .dpTodayButtonTR {background-color:#eee} /* a table cell that holds a date number (1-31) */ .dpTD {background-color:#fff} .dpTDempty {} /* a table cell that holds a highlighted day (usually either today's date or the current date field value) */ .dpDayHighlightTD {background:#77C022} /* the date number table cell that the mouse pointer is currently over (you can use contrasting colors to make it apparent which cell is being hovered over) */ .dpTDHover {color:#666; background-color:#fff} /* the table cell that holds the name of the month and the year */ .dpTitleTD {} /* a table cell that holds one of the forward/backward buttons */ .dpButtonTD button {color:#000; background-color:#fff} /* the table cell that holds the "This Month" or "Close" button at the bottom */ .dpTodayButtonTD {background-color:#fff; border:0 !important} /* a table cell that holds the names of days of the week (Mo, Tu, We, etc.) */ .dpDayTD {color:#666; background-color:#f0f0f0; border-color:#ccc; font-size:.7em} /* additional style information for the cell that holds a highlighted day (usually either today's date or the current date field value) */ .dpDayHighlight {color:#fff; background-color:#77C022} /* the forward/backward buttons at the top */ .dpButton {color:#fff} /* the "This Month" and "Close" buttons at the bottom */ .dpTodayButton {color:#666; text-transform:capitalize}