From: Harris Lapiroff Date: Thu, 26 May 2011 17:48:36 +0000 (-0400) Subject: Lots of updates, textual and stylistic. X-Git-Url: http://git.ithinksw.org/philo.git/commitdiff_plain/af7fa05ae7ba985fc27b17dceeacabd4175f1d7f Lots of updates, textual and stylistic. --- diff --git a/index.html b/index.html index 22235b5..a9ba889 100644 --- a/index.html +++ b/index.html @@ -24,25 +24,25 @@

Philo is a powerful content-management system built with Django. It manages websites, simple and complex.

- -
-
-

Features

-
- -

Philo allows the creation of complex site structures from Django’s own admin interface (or similar database interface). For a simple site, you will use the following three objects, included in the Philo core.

- - - -

Philo also provides a number of useful template tags, in particular {% container %}, which generates a relationship (and a field in the admin interface) on any pages which use that template. For more about Philo and its features, read the documentation.

-
+ +
+
+

Philo was developed by a team of developers working for Oberlin College to meet their needs for flexible, manageable website development and maintenance. To learn more about Philo’s features and functionality read the documentation.

+
+ +
+
+

Philo-Powered Websites

+
+ +
+
-

A Simple Example

+
@@ -59,7 +59,7 @@
-

You can use also collections, redirects, files, content references (all included in the Philo core), as well as the Philo contrib apps and your own code to create and manage more powerful, complex websites.

+

You can use collections, redirects, files, content references (included in the Philo core), as well as the Philo contrib apps and your own code to create and manage more powerful, complex websites. Learn more in the documentation.

@@ -115,24 +115,26 @@
-
-

Install Philo

-
- git clone git://git.ithinksw.org/philo.git - python philo/setup.py install - rm -rf philo -
-
+
+
+

Install Philo

+
+ git clone git://git.ithinksw.org/philo.git + python philo/setup.py install + rm -rf philo +
+
-
-

Get Involved

-

Philo is still under heavy development. If you’re a Python/Django developer, help out by forking Philo on GitHub to add features or fix bugs.

-
+
+

Get Involved

+

Philo is still under heavy development. If you’re a Python/Django developer, help out by forking Philo on GitHub to add features or fix bugs.

+
+
diff --git a/static/css/screen.css b/static/css/screen.css index 8efa5cc..773f42c 100644 --- a/static/css/screen.css +++ b/static/css/screen.css @@ -79,6 +79,44 @@ html > body { 100% { text-shadow: 0 0 3px rgba(255, 255, 255, 0.5); } } +@-webkit-keyframes pulse { + 0% { + -webkit-transform: scale(1); } + + 100% { + -webkit-transform: scale(1.05); } } + +.lite { + -webkit-animation-name: pulse; + -webkit-animation-duration: .25s; + -webkit-animation-iteration-count: infinite; + -webkit-animation-direction: alternate; + -webkit-animation-timing-function: linear; + margin: -10px; + padding: 9px; + border: 1px solid #cfd7e6; + background: white; + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + -o-border-radius: 5px; + -ms-border-radius: 5px; + -khtml-border-radius: 5px; + border-radius: 5px; } + +section { + -moz-transition-property: all; + -webkit-transition-property: all; + -o-transition-property: all; + transition-property: all; + -moz-transition-duration: 0.15s; + -webkit-transition-duration: 0.15s; + -o-transition-duration: 0.15s; + transition-duration: 0.15s; + -moz-transition-timing-function: linear; + -webkit-transition-timing-function: linear; + -o-transition-timing-function: linear; + transition-timing-function: linear; } + body { background: #e0e5ef; background: -webkit-gradient(linear, 50% 0%, 50% 250, color-stop(0%, #b4bdcf), color-stop(100%, #e0e5ef)); @@ -236,6 +274,35 @@ body { color: #4d4d4d; } #content .pname { color: #354668; } +#content .tucol { + *zoom: 1; + margin-top: 3.125em; + margin-bottom: 3.125em; } + #content .tucol:after { + content: "\0020"; + display: block; + height: 0; + clear: both; + overflow: hidden; + visibility: hidden; } + #content .tucol section { + width: 355px; + float: right; } + #content .tucol section:first-child { + float: left; } + #content .tucol section:nth-child(2) { + width: 335px; + padding: 15px 15px; + background: rgba(255, 255, 255, 0.5); + -moz-border-radius: 5px; + -webkit-border-radius: 5px; + -o-border-radius: 5px; + -ms-border-radius: 5px; + -khtml-border-radius: 5px; + border-radius: 5px; + border: 1px solid #cfd7e6; } + #content .tucol section :last-child { + margin-bottom: 0; } .three-up { background: #333333; @@ -251,6 +318,7 @@ body { -webkit-box-shadow: 0 1px 0 0 white, 0 2px 4px rgba(0, 0, 0, 0.35) inset; -o-box-shadow: 0 1px 0 0 white, 0 2px 4px rgba(0, 0, 0, 0.35) inset; box-shadow: 0 1px 0 0 white, 0 2px 4px rgba(0, 0, 0, 0.35) inset; + height: 300px; overflow: hidden; *zoom: 1; } .three-up figure { @@ -283,7 +351,7 @@ body { -khtml-border-radius: 3px; border-radius: 3px; } .three-up figure.shrunk { - width: 62px; } + width: 60px; } .three-up figure.expanded { width: 600px; } .three-up figure:last-child { @@ -343,7 +411,8 @@ body { box-shadow: none; } #whatIs a:hover { background: transparent; - color: #73e600; } + color: #d9fbb7; + border: none; } #modelList { margin-left: 1.5em; } @@ -412,7 +481,17 @@ body { opacity: .5; } #contribList a { color: #CCC; - border: none; } + border: none; + -moz-box-shadow: none; + -webkit-box-shadow: none; + -o-box-shadow: none; + box-shadow: none; } + #contribList a:hover { + color: #FFF; + border: none; } + +.getInvolved { + margin: -16px 0; } footer { margin-top: 25px; diff --git a/static/js/init.js b/static/js/init.js index 29ccd41..3257288 100644 --- a/static/js/init.js +++ b/static/js/init.js @@ -12,7 +12,26 @@ var philo_site = { var $this = $(this); $this.parent().children().removeClass('expanded').removeClass('shrunk'); } + }, + anchor_light: { + init: function () { + var self = philo_site.anchor_light; + links = $('a[href^="#"]'); + links.click(self.hiliteHandler); + }, + hiliteHandler: function () { + var self = philo_site.anchor_light, + $this = $(this), + id = $this.attr('href'), + el = $(id); + el.addClass("lite"); + setTimeout(self.unhiliteHandler, 1000); + }, + unhiliteHandler: function () { + $('.lite').removeClass('lite'); + } } } -$(philo_site.three_up.init); \ No newline at end of file +$(philo_site.three_up.init); +$(philo_site.anchor_light.init); \ No newline at end of file diff --git a/static/scss/screen.scss b/static/scss/screen.scss index 3cca3b0..b531c1a 100644 --- a/static/scss/screen.scss +++ b/static/scss/screen.scss @@ -25,6 +25,32 @@ } } +@-webkit-keyframes pulse{ + 0%{ + -webkit-transform: scale(1); + } + 100%{ + -webkit-transform: scale(1.05); + } +} + +.lite{ + -webkit-animation-name: pulse; + -webkit-animation-duration: .25s; + -webkit-animation-iteration-count: infinite; + -webkit-animation-direction: alternate; + -webkit-animation-timing-function: linear; + margin: -10px; + padding: 9px; + border:1px solid darken($page-background, 5%); + background:lighten($page-background, 10%); + @include border-radius(5px); +} + +section{ + @include transition(all, .15s, linear); +} + body{ background:$page-background; @include background( @@ -148,6 +174,36 @@ body{ .pname{ color:darken($page-background, 60%); } + + + + .tucol{ + @include pie-clearfix; + section{ + width:$page-width/2 - 20px; + float:right; + } + + section:first-child{ + float:left; + } + section:nth-child(2){ + width:$page-width/2 - 40px; + padding:15px 15px; + background:rgba(255,255,255,.5); + @include border-radius(5px); + border:1px solid darken($page-background, 5%); + } + + section :last-child{ + margin-bottom:0; + } + + @include margin-leader(2); + @include margin-trailer(2); + } + + } .three-up{ @@ -158,6 +214,7 @@ body{ padding:$pad; @include border-radius(5px); @include box-shadow(0 1px 0 0 #FFF, 0 2px 4px rgba(0,0,0,.35) inset); + height:300px; figure{ $border: 1px; @@ -172,7 +229,7 @@ body{ @include border-radius(3px); &.shrunk{ - width: ($width - 610px) / 2 - $pad - 3 * $border; + width: ($width - 610px) / 2 - $pad - 3 * $border - 2px; } &.expanded{ width:600px; @@ -234,7 +291,8 @@ body{ @include box-shadow(none); &:hover{ background:transparent; - color:lighten($accent, 20%); + color:desaturate(lighten($accent, 60%), 10%); + border:none; } } } @@ -302,9 +360,18 @@ body{ a{ color:#CCC; border:none; + @include box-shadow(none); + &:hover{ + color:#FFF; + border:none; + } } } +.getInvolved{ + margin:-16px 0; +} + footer{ margin-top: 25px; padding-top: 20px;