diff --git a/applications/garden/controllers/activity.php b/applications/garden/controllers/activity.php index 274ae1ae2d3..21d3dbed18d 100755 --- a/applications/garden/controllers/activity.php +++ b/applications/garden/controllers/activity.php @@ -12,6 +12,10 @@ class ActivityController extends GardenController { public $Uses = array('Database', 'Form', 'Gdn_ActivityModel', 'Html'); + public function Initialize() { + parent::Initialize(); + $this->AddCssFile('activity.css'); + } public function Index() { if ($this->Head) { $this->Head->AddScript('/applications/garden/js/activity.js'); diff --git a/applications/garden/controllers/appcontroller.php b/applications/garden/controllers/appcontroller.php index 5f25780495f..dd0840e0453 100755 --- a/applications/garden/controllers/appcontroller.php +++ b/applications/garden/controllers/appcontroller.php @@ -30,7 +30,7 @@ public function Initialize() { $this->AddCssFile('popup.css'); $this->AddModule('PoweredByVanillaModule'); - if ($this->ControllerName != 'profilecontroller') + if (!in_array($this->ControllerName, array('profilecontroller', 'activitycontroller'))) $this->AddCssFile('garden.css'); parent::Initialize(); diff --git a/applications/garden/design/activity.css b/applications/garden/design/activity.css new file mode 100755 index 00000000000..866bc9491a2 --- /dev/null +++ b/applications/garden/design/activity.css @@ -0,0 +1,709 @@ +@import url('reset.css') /* NoFollow */; +/* +Welcome to the Garden CSS File! 5 Things you should know: + +1. The reset.css file imported above breaks all elements down to a base style. + +2. There is a menu.css file that is also included on every page of Garden. It + defines the layout of the main dropdown menu at the top of the page. + +3. There is a popup.css file that is also included on every page of Garden. It + defines the appearance of popups (warnings, editing routes & messages, etc). + +4. This css file will be included on the activity pages. Specifically: + + Activity/* + +5. This file is broken down into the following sections: + + Line 26: General Styles & Typography + + Line 335: Header + + Line 398: Main Menu + + Line 433: Panels / Sidebars + + Line 514: Activities + + Line 693: Footer +*/ + + +/* General Styles & Typography */ +body { + color: #000 /* Body Default Font Color */; + font: 75%/1.7em "Helvetica Neue",Helvetica,arial,sans-serif; + background: #ffffff /* Body Background Color */; + margin: 0; + padding: 0; + text-align: center; + font-size: small; +} +#Body { + width: 960px; + text-align: left; + margin: 0 auto; +} +#Body { + margin: 15px auto 0 auto; + } +#Content { + float: left; + width: 680px; + margin: 0 0 40px; +} +.Hidden { + display: none; +} +.nowrap { + white-space: nowrap; +} +.Center { + text-align: center; +} +.Right { + text-align: right; +} +h1, h2, h3, h4, h5, h6 { + color: #000 /* Body Heading Font Color */; + font-family: "Helvetica Neue",Helvetica,arial,sans-serif; + font-weight: normal; + margin: 0; +} +p { + margin: 0.5em 0 0 0; + line-height: 1.6em; + font-family: "Helvetica Neue",Helvetica,arial,sans-serif; +} +h1, h2 { + border-bottom:1px solid #bbb; + font-size:140%; + font-weight:bold; + margin-bottom:10px; +} +h3 { + font-size:140%; +} +h4 { + font-size: 120%; + color: #6C6C6C /* Body Subheading Font Color */; +} +h5 { + font-size: 120%; + color: #6C6C6C /* Body Subheading Font Color */; +} +a, +a:link, +a:visited, +a:active { + text-decoration: none; + color: #2786c2 /* Body Link Font Color */; +} +a:hover { + text-decoration: none; + color: #ff0084 /* Body Hover Font Color */; +} +input.DateBox, +input.InputBox, +input.SmallInput, +textarea { + font-family: arial; + color: #222; + font-size: 14px; + padding: 3px; + margin: 0; + width: 250px; + border: 1px solid #888; +} +textarea.TextBox { + width: 500px; + height: 100px; + min-height: 100px; + max-height: 500px; +} +#Popup textarea.TextBox { + width: 465px; +} +input.SmallInput, +input.InputBox { + font-size: 15px; + padding: 6px 3px; +} +input.SmallInput:focus, +input.InputBox:focus, +textarea:focus { + background: #ffe; +} +textarea { + line-height: 128%; +} +select { + font-family: arial; + font-size: 14px; + color: #222; + margin: 0; + padding: 3px; + } +select.Day, +select.Year { + margin-left: 4px; +} +.Button { + cursor: pointer; + margin: 0 0 0 0; + font-family: Tahoma, 'Trebuchet MS', Arial, Verdana; + padding: 4px; + font-size: 11px; + background: url('button_bg2.png') repeat-x center left #f8f8f8; + color: #555; + border: 1px solid #bbb; + -moz-border-radius: 2px; + -webkit-border-radius: 2px; + } +input.Button { + font-weight: bold; +} +.Button:hover { + color: #333; + border: 1px solid #888; +} +.Loading { + height: 100px; + padding: 0 20px; + background: url('progress.gif') center center no-repeat; +} +.Progress { + padding: 10px 40px 10px 0; + background: url('progress.gif') center center no-repeat; +} +/* Note: Messages are the yellow notices that appear at the top/center of the + page to notify users of things like drafts being saved, etc. */ +div.Messages { + text-align: center; + position: fixed; + top: 0; + left: 0; + z-index: 200; + margin: 0 !important; + padding: 0 !important; + list-style: none !important; + font-size: 12px; + display: block; + width: 100%; +} +* html div.Messages { + position: absolute; + width: 100%;/*IE5.5*/ + top: 0; + left: 0; + overflow: visible; + top: expression(eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop : document.body.scrollTop); +} +div.Messages ul { + cursor: pointer; + width: auto !important; + border: 0 !important; + margin: 0 auto !important; + padding: 4px 8px !important; + -moz-border-radius-bottomleft: 2px; + -moz-border-radius-bottomright: 2px; + -webkit-border-bottom-left-radius: 2px; + -webkit-border-bottom-right-radius: 2px; + background: #ff9 !important; + display:-moz-inline-stack; + display:inline-block; + zoom:1; + *display:inline; +} +div.Messages ul li { + text-align: left !important; + border: 0 !important; + color: #000 !important; + padding: 0 !important; + margin: 0 !important; + list-style-position: outside; +} +div.Errors ul { + background: #d50a0a !important; +} +div.Errors ul li { + color: #fff !important; +} +/* Note: Warning, Alert & Info are simple boxes that can be used to wrap message + strings & imply importance. */ +.Warning { + background: #ffc; + border: 1px solid #ff9; + color: #000; + padding: 6px 8px; + -moz-border-radius: 3px; + -webkit-border-radius: 3px; +} +.Alert { + background: #d00; + border: 1px solid #b00; + color: #fff; + padding: 3px 6px; + -moz-border-radius: 3px; + -webkit-border-radius: 3px; +} +.Alert a { + color: #fff; +} +.Alert a:hover { + text-decoration: underline; +} +div.Info { + font-size: 13px; + background: #fafafa; + border: 1px solid #eee; + color: #888; + -moz-border-radius: 4px; + padding: 6px; + margin: 0 0 10px; +} +div.EmptyInfo { + margin: 10px 0; +} +/* Note: The MessageModule (in /applications/garden/modules) wraps all messages + that it renders in a div with this DismissMessage class. */ +div.DismissMessage { + margin: 0 0 10px; +} +div.DismissMessage p { + margin: 0; +} +div.DismissMessage a.Close { + float: right; + background: #fafafa; + line-height: 120%; + border: 1px solid #eee; + color: #aaa; +} +div.DismissMessage a.Close:hover { + background: #fafafa; + border: 1px solid #ccc; + color: #777; +} +/* Note: The close class is used on the "close" anchor in popups. */ +a.Close { + font-weight: bold; + font-family: tahoma; + font-size: 10px; + text-transform: uppercase; + color: #bbb; + background: #f9f9f9; + -moz-border-radius: 8px; + -webkit-border-radius: 8px; + padding: 1px 4px 2px 5px; + margin: 0; + line-height: 100%; + border: 1px solid #ddd; +} +a.Close:hover { + border: 1px solid #bbb; + color: #999; + background: #fff; +} +/* Note: MorePager is related to the /applications/garden/modules/MorePagerModule. */ +.MorePager { + list-style: none; + margin: 1px 0 0; + padding: 3px 6px; + text-align: right; + background: #e9f9ff; + } +.MorePager a { + font-size: 13px; + font-weight: bold; + text-align: right; +} +.MorePager a:hover { + color: #2786c2 !important; + text-decoration: underline; +} +#PagerLess { + -moz-border-radius-topright: 2px; + -moz-border-radius-topleft: 2px; + -webkit-border-top-right-radius: 2px; + -webkit-border-top-left-radius: 2px; + margin-bottom: 1px; +} +tr#PagerMore td { + border: 0; + text-align: right; +} +#PagerMore { + margin-bottom: 1px; +} + + +/* =================================================================== Header */ +#Head { + background: #44c7f4 /* Banner Background Color */; + padding: 0; + text-align: right; + height: 50px; +} +body #Head h1 { + display: block; + font-weight: bold; + margin: 0; + padding: 21px 7px 0 0; + border: 0; + float: left; + line-height: 1; +} +#Head h1 a span { + font-size: 24px; + color:#E4F7FE /* Banner Font Color */; + text-shadow:0 1px 0 #30ACD6 /* Banner Font Shadow Color */; +} +#Head h1 a:hover span { + color:#f3fcff /* Banner Hover Font Color */; +} +#Head form { + float: right; + width: 250px; + background: #fff; + padding: 0; + margin: 15px 0 0; + -moz-border-radius: 2px; + -webkit-border-radius: 2px; +} +#Head form input.InputBox { + width: 204px; + border: 0; + padding: 4px 2px 4px 0; + background: #fff; + margin: 0; + -moz-border-radius-topleft: 2px; + -moz-border-radius-bottomleft: 2px; + -webkit-border-top-left-radius: 2px; + -webkit-border-bottom-left-radius: 2px; + color: #969696; + font-size: 13px; +} +#Head form input.Button { + border: 0; + width: 38px; + height: 26px; + background: #E9F9FF /* Panel Background Color */; + color: #2786C2 /* Panel Font Color */; + padding: 3px 0 4px; + margin: 0; + -moz-border-radius: 0; + -webkit-border-radius: 0; + -moz-border-radius-topright: 2px; + -moz-border-radius-bottomright: 2px; + -webkit-border-top-right-radius: 2px; + -webkit-border-bottom-right-radius: 2px; +} + + +/* ================================================================ Main Menu */ +div.Menu { + text-align: right; + width: 960px; + margin: 0 auto; +} +ul#Menu { + float: left; + margin: 0 auto; + padding: 22px 0 0 10px; +} +#Menu ul, +#Menu li.Active { + background: #44c7f4; +} +#Menu a, +#Menu li.Active a { + color: #fff; +} +#Menu a:hover { + background: #28bcef; +} +#Menu a:hover, +#Menu li.NonTab a:hover { + color: #fff !important; +} +/* Numbers next to menu items */ +#Menu a span, +#Menu li.Active a span, +#Menu li.Highlight a:hover span { + background: #f2fcff; + color: #299fc7; +} + + +/* ======================================================== Panels / Sidebars */ +#Panel { + width: 250px; + float: right; +} +div.Box { + -moz-border-radius: 1px; + -webkit-border-radius: 1px; + background: #e9f9ff /* Panel Background Color */; + color: #999 /* Panel Font Color */; + padding: 6px 10px; + margin: 0 0 10px 0; +} +div.Box h4 { + font-size: 110%; + color: #2786c2 /* Panel Font Color */; + font-weight: bold; + margin: 0; + padding: 0 0 1px; + border-bottom: 1px solid #caf0fe /* Panel Inlay Border Color */; +} +div.Box dl { + border-bottom: 1px solid #caf0fe /* Panel Inlay Border Color */; + background: #f0fbff /* Panel Inlay Background Color */; + padding: 3px; + font-size: 90%; + overflow: hidden; +} +div.Box dl dt { + float: left; + width: 80px; + color: #2786C2 /* Panel Font Color */; +} +div.Box dl dd { + margin-left: 80px; +} +div.Box p { + font-size: 100%; + padding: 0 0 4px; + color: #555 /* Body Text Font Color */; +} +ul.PanelInfo { + margin-bottom: 4px; +} +ul.PanelInfo { + border-bottom: 1px solid #caf0fe; +} +ul.PanelInfo li { + background: #f5fcff /* Panel Inlay Background Color */; + padding: 2px 4px; + font-family: tahoma; + font-size: 80%; +} +ul.PanelInfo li strong { + font-weight: normal; + text-align: left; + font-size: 120%; + margin-right: 12px; +} +ul.PanelInfo li.Active { + background: #fff; +} +#Panel a.PanelButton { + padding: 6px 0; + display: block; + text-align: center; + font-size: 16px; + font-weight: bold; + -moz-border-radius: 2px; + -webkig-border-radius: 2px; + background: #44c7f4 /* Banner Background Color */; + color: #fff /* Banner Font Color */; + text-decoration: none; + margin: 0 0 10px 0; +} +#Panel a.PanelButton:hover { + background: #11e420 /* Menu Hover Background Color */; + color: #fff /* Menu Hover Font Color */; +} + + +/* =============================================================== Activities */ +body.Activity h1 { + margin: 0; +} +ul.Activities { + margin-bottom: 6px; +} +ul.Activities li { + border-bottom: 1px solid #ddd; + padding: 8px 0 6px; + color: #454545; + clear: left; + font-size: 105%; +} +ul.Activities div span { + padding: 0 6px 0 0; +} +ul.Activities li a.Photo { + float: left; +} +ul.Activities li img { + margin: 0; + border: 0; + height: 40px; + width: 40px; +} +ul.Activities li.ActivityComment img { + height: 32px; + width: 32px; +} +ul.Activities li h3 { + display: inline; + padding: 0; + font-size: 100%; + font-weight: normal; +} +ul.Activities li h3 em { + font-weight: normal; + font-style: normal; + color: #33afda; + font-size: 10px; + margin: 0 10px; +} +ul.Activities li h3 a.CommentOption { + font-size: 10px; + font-weight: normal; +} +ul.Activities li a.Delete { + float: right; + width: auto; + padding: 4px; + margin: 0 1px 0 0; + font-family: Tahoma, 'Trebuchet MS', Arial, Verdana; + font-size: 10px; + font-weight: normal; + background: url('button_bg2.png') repeat-x center left #f8f8f8; + border: 1px solid #ddd; + -moz-border-radius: 2px; + -webkit-border-radius: 2px; + color: #888; + cursor: pointer; + line-height: 100%; +} +ul.Activities li a.Delete:hover { + color: #333; + border: 1px solid #888; +} +ul.Activities li div.Story { + border: 1px solid #eee; + -moz-border-radius: 2px; + -webkit-border-radius: 2px; + background: #fafafa; + margin: 4px 0; + padding: 4px 6px; + line-height: 130%; + color: #2b3033; + display: block; +} +ul.Activities li.PictureChange div.Story { + border: 0; + background: none; + margin: 4px 0 0; + padding: 0 8px; +} +ul.Activities li div.Story blockquote { + margin: 2px 0 0; + padding: 0; + background: none; + border: 0; + color: #999; +} +ul.Activities li div.Story img { + height: auto; + width: auto; + background: #fff; + padding: 2px; + border: 1px solid #ccc; + float: none; + margin: 0 4px 0 0; +} +ul.Activities ul.Comments { + background: #fff; + margin: 0 0 0 46px; + padding: 1px 0 0; + list-style: none; + font-size: 85%; + clear: left; +} +ul.Activities ul.Comments li { + background: #e9f9ff /* Panel Background Color */; + margin-bottom: 1px; + border-bottom: 0; + padding: 6px; + line-height: 1; +} +ul.Activities li.HasPhoto div { + margin-left: 46px; +} +ul.Activities li.HasPhoto ul.Comments div { + margin: 0; +} +ul.Activities ul.Comments li.HasPhoto div { + margin-left: 40px; +} +ul.Activities a.Name, +ul.Activities a.Photo { + font-weight: bold; + padding-right: 6px; +} +ul.Activities p { + display: inline; + margin: 0; + line-height: 1.4; +} +ul.Activities div.Meta { + line-height: 1; + color: #888; + padding: 4px 0 0 6px; + margin: 0 !important; + font-size: 90%; + display: inline; +} +ul.Activities li.AboutUpdate div.Meta, +ul.Activities li.WallComment div.Meta, +ul.Activities ul.Comments div.Meta { + display: block; + padding: 4px 0 4px; +} +ul.Activities div.Meta a { + font-weight: normal; +} +ul.Activities div.Meta span { + padding: 0 6px; + font-size: 8px; +} +ul.Activities ul.Comments li.CommentForm { + clear: left; + padding: 8px; +} +ul.Activities ul.Comments li.CommentForm a.CommentLink, +ul.Activities ul.Comments li.CommentForm a.CommentLink:hover { + cursor: text; + background: #fff; + color: #bbb !important; + padding: 5px; + text-decoration: none; + border: 1px solid #aaa; + display: block; + line-height: 100%; + font-weight: normal; +} +ul.Activities li.CommentForm textarea.TextBox { + width: 610px; + min-height: 40px; + height: 40px; + margin-bottom: 2px; +} + + +/* =================================================================== Footer */ +#Foot { + clear: both; + text-align: center; + margin: 2px 0; + font-family: 'lucida grande','helvetica neue',helvetica,arial,sans-serif; + padding: 4px 9px; + font-size: 13px; + color: #ddd; + line-height: 1; +} +#Foot a { + color: #ccc; +} +#Foot a:hover { + color: #aaa; +} \ No newline at end of file diff --git a/applications/garden/design/garden.css b/applications/garden/design/garden.css index 0b15f20865d..8ed8fcc6849 100755 --- a/applications/garden/design/garden.css +++ b/applications/garden/design/garden.css @@ -13,7 +13,6 @@ Welcome to the Garden CSS File! 6 Things you should know: 4. This css file will be included on most Garden pages. Specifically: + Settings/* + Routes/* - + Activity/* + Entry/* + Home/* + Messages/* @@ -27,21 +26,20 @@ Welcome to the Garden CSS File! 6 Things you should know: kinds of custom magic there (profile.css). 6. This file is broken down into the following sections: - + Line 44: General Styles & Typography - + Line 368: Forms - + Line 370: Header - + Line 433: Main Menu - + Line 468: Panels / Sidebars - + Line 549: Dashboard - + Line 634: Activities - + Line 811: Entry Screen - + Line 917: DataList (Search Results) - + Line 983: User Search Page - + Line 992: Footer + + Line 42: General Styles & Typography + + Line 366: Forms + + Line 630: Header + + Line 693: Main Menu + + Line 728: Panels / Sidebars + + Line 809: Dashboard + + Line 879: Entry Screen + + Line 985: DataList (Search Results) + + Line 1051: User Search Page + + Line 1060: Footer */ -/* General Styles & Typography */ +/* ============================================== General Styles & Typography */ body { color: #000 /* Body Default Font Color */; font: 75%/1.7em "Helvetica Neue",Helvetica,arial,sans-serif; @@ -878,185 +876,6 @@ li.four { background: url('four.png') no-repeat center left; } li.five { background: url('five.png') no-repeat center left; } -/* =============================================================== Activities */ -body.Activity h1 { - margin: 0; -} -ul.Activities { - margin-bottom: 6px; -} -ul.Activities li { - border-bottom: 1px solid #ddd; - padding: 8px 0 6px; - color: #454545; - clear: left; - font-size: 105%; -} -ul.Activities div span { - padding: 0 6px 0 0; -} -ul.Activities li a.Photo { - float: left; -} -ul.Activities li img { - margin: 0; - border: 0; - height: 40px; - width: 40px; -} -ul.Activities li.ActivityComment img { - height: 32px; - width: 32px; -} -ul.Activities li h3 { - display: inline; - padding: 0; - font-size: 100%; - font-weight: normal; -} -ul.Activities li h3 em { - font-weight: normal; - font-style: normal; - color: #33afda; - font-size: 10px; - margin: 0 10px; -} -ul.Activities li h3 a.CommentOption { - font-size: 10px; - font-weight: normal; -} -ul.Activities li a.Delete { - float: right; - width: auto; - padding: 4px; - margin: 0 1px 0 0; - font-family: Tahoma, 'Trebuchet MS', Arial, Verdana; - font-size: 10px; - font-weight: normal; - background: url('button_bg2.png') repeat-x center left #f8f8f8; - border: 1px solid #ddd; - -moz-border-radius: 2px; - -webkit-border-radius: 2px; - color: #888; - cursor: pointer; - line-height: 100%; -} -ul.Activities li a.Delete:hover { - color: #333; - border: 1px solid #888; -} -ul.Activities li div.Story { - border: 1px solid #eee; - -moz-border-radius: 2px; - -webkit-border-radius: 2px; - background: #fafafa; - margin: 4px 0; - padding: 4px 6px; - line-height: 130%; - color: #2b3033; - display: block; -} -ul.Activities li.PictureChange div.Story { - border: 0; - background: none; - margin: 4px 0 0; - padding: 0 8px; -} -ul.Activities li div.Story blockquote { - margin: 2px 0 0; - padding: 0; - background: none; - border: 0; - color: #999; -} -ul.Activities li div.Story img { - height: auto; - width: auto; - background: #fff; - padding: 2px; - border: 1px solid #ccc; - float: none; - margin: 0 4px 0 0; -} -ul.Activities ul.Comments { - background: #fff; - margin: 0 0 0 46px; - padding: 1px 0 0; - list-style: none; - font-size: 85%; - clear: left; -} -ul.Activities ul.Comments li { - background: #e9f9ff /* Panel Background Color */; - margin-bottom: 1px; - border-bottom: 0; - padding: 6px; - line-height: 1; -} -ul.Activities li.HasPhoto div { - margin-left: 46px; -} -ul.Activities li.HasPhoto ul.Comments div { - margin: 0; -} -ul.Activities ul.Comments li.HasPhoto div { - margin-left: 40px; -} -ul.Activities a.Name, -ul.Activities a.Photo { - font-weight: bold; - padding-right: 6px; -} -ul.Activities p { - display: inline; - margin: 0; - line-height: 1.4; -} -ul.Activities div.Meta { - line-height: 1; - color: #888; - padding: 4px 0 0 6px; - margin: 0 !important; - font-size: 90%; - display: inline; -} -ul.Activities li.AboutUpdate div.Meta, -ul.Activities li.WallComment div.Meta, -ul.Activities ul.Comments div.Meta { - display: block; - padding: 4px 0 4px; -} -ul.Activities div.Meta a { - font-weight: normal; -} -ul.Activities div.Meta span { - padding: 0 6px; - font-size: 8px; -} -ul.Activities ul.Comments li.CommentForm { - clear: left; - padding: 8px; -} -ul.Activities ul.Comments li.CommentForm a.CommentLink, -ul.Activities ul.Comments li.CommentForm a.CommentLink:hover { - cursor: text; - background: #fff; - color: #bbb !important; - padding: 5px; - text-decoration: none; - border: 1px solid #aaa; - display: block; - line-height: 100%; - font-weight: normal; -} -ul.Activities li.CommentForm textarea.TextBox { - width: 610px; - min-height: 40px; - height: 40px; - margin-bottom: 2px; -} - - /* ============================================================= Entry Screen */ body.Entry { text-align: center;