Plans CSS comparison tool
31 views
Skip to first unread message
Tom Baldwin
May 24, 2013, 1:58:21 PM5/24/13
to grinnellplan...@googlegroups.com
As previously discussed on this list (8-9 May 2012), deleting the 'interfaces' feature from plans would enable big simplifications in the codebase. However, before the 'postmodern' interface can become the one used by everyone, popular stylesheets need to be updated to appear passably attractive.
Here's what the default stylesheets look like under 'postmodern' right now:
http://pages.uoregon.edu/tbaldwin/planscss/
I can't blame anybody for lack of progress on this work, because it's kind of a drag. To grease the wheels a little bit I made a quick stylesheet comparison tool:
https://github.com/baldwint/planscss
This is the script I used to generate the stylesheet wall of shame linked above. It also makes copies of example pages that are handy to have open in your browser's web inspector when hacking on the CSS.
I've started work on converting "terminal", my personal favorite. This diff can give you an idea of the sorts of changes that are involved:
https://github.com/baldwint/planscss/compare/master...terminal
I encourage any CSS-literate web devs with some time to kill on the holiday weekend to clone the repo, make a feature branch, and start fiddling with a stylesheet. It should be easier than setting up a plans development server to do the same thing (most things are).
Happy Memorial Day,
tk
Here's what the default stylesheets look like under 'postmodern' right now:
http://pages.uoregon.edu/tbaldwin/planscss/
I can't blame anybody for lack of progress on this work, because it's kind of a drag. To grease the wheels a little bit I made a quick stylesheet comparison tool:
https://github.com/baldwint/planscss
This is the script I used to generate the stylesheet wall of shame linked above. It also makes copies of example pages that are handy to have open in your browser's web inspector when hacking on the CSS.
I've started work on converting "terminal", my personal favorite. This diff can give you an idea of the sorts of changes that are involved:
https://github.com/baldwint/planscss/compare/master...terminal
I encourage any CSS-literate web devs with some time to kill on the holiday weekend to clone the repo, make a feature branch, and start fiddling with a stylesheet. It should be easier than setting up a plans development server to do the same thing (most things are).
Happy Memorial Day,
tk
Ian Young
May 24, 2013, 2:27:16 PM5/24/13
to grinnellplan...@googlegroups.com
Super cool! Thanks for creating this. Having some copies of representative pages around while working sounds great too.
--
You received this message because you are subscribed to the Google Groups "GrinnellPlans Development" group.
To unsubscribe from this group and stop receiving emails from it, send an email to grinnellplans-deve...@googlegroups.com.
To post to this group, send email to grinnellplan...@googlegroups.com.
Visit this group at http://groups.google.com/group/grinnellplans-development?hl=en.
For more options, visit https://groups.google.com/groups/opt_out.
Anna Carey
May 24, 2013, 2:41:05 PM5/24/13
to Erin oneil
Could we take the even simpler route and do a plans poll to ask something like:
We're thinking about removing some of the older css options and replacing them with new clean, simple styles. If you use the postmodern styles, this won't affect you. What do you think?*Yay!*Who cares?
*I'd like you to keep Pastel Hell
* I'd like you to keep Black, White, and Red all over
*I'd like you to keep Old style color scheme.
*I'd like you to keep Jolly Rancher
*I'd like you to keep Pastel Purgatory
*I'd like you to keep Terminal
*I'd like you to keep Parchment
I think we could avoid some work if we dont' have to work on the ones nobody cares about. Last time I worked on plans, I got bogged down by all of the layout and interface stuff, but this could give me some new energy.
Anna
Ian Young
May 24, 2013, 4:13:10 PM5/24/13
to grinnellplan...@googlegroups.com
Ian Atha pulled some numbers a while ago relating to how many users had each stylesheet set - sort of the easier version of doing a poll. IIRC, the (perhaps surprising) answer was that a decent number of people were using almost every built-in stylesheet. That's not to say that everyone would be heartbroken to see some of these go (especially if we offered a nice similar-looking replacement), but I think updating all the built-ins is a nice way to go (assuming none of them involve a prohibitive amount of work).
I'm also hoping that someone who spends time updating some of these defaults (Tom?) might write up some documentation, or even a barebones positioning stylesheet that others could use to help update their custom Plans stylesheets to the new interface. Some custom stylesheets are fairly popular, and it would be nice to make the transition less disruptive for those folks too.
Anna, if you'd like to carry on development based on the assumption that we'll eliminate the layouts, I'd support that. Heck, if we finish everything else and the only thing standing in the way of launching is updating these stylesheets, I solemnly swear that I'll update them myself. And I don't even like working with CSS!
Ian Young
May 24, 2013, 4:18:44 PM5/24/13
to grinnellplan...@googlegroups.com
Here's the stats I mentioned: http://code.google.com/p/grinnellplans/issues/detail?id=91#c5
Tom Baldwin
May 24, 2013, 7:11:56 PM5/24/13
to grinnellplan...@googlegroups.com
On Friday, May 24, 2013 1:13:10 PM UTC-7, Ian Young wrote:
I'm also hoping that someone who spends time updating some of these defaults (Tom?) might write up some documentation, or even a barebones positioning stylesheet that others could use to help update their custom Plans stylesheets to the new interface. Some custom stylesheets are fairly popular, and it would be nice to make the transition less disruptive for those folks too.
This is a brilliant idea. I spun out some of the layout stuff from my terminal branch into the barebones positioning stylesheet that you suggested:
This can be included at the top of an older stylesheet to make it acquire the two-column "modern" look when used under postmodern. I applied this and a few other changes to the built-in stylesheets, and voila:
This is already looking way better than it was this morning (compare against my previous wall of shame link). Obviously there's a few bits that still need some work, but we can totally finish it this weekend.
The stats are interesting, and raise a few points:
1. The "old term" interface ("autofinger" instead of "autoread") is apparently very popular. Wording changes can't (to my knowledge) be done in CSS. I don't think it would kill us to add a separate preference setting that prints out "autofinger" in the postmodern interface, and migrate these people into that setting.
2. I've been ignoring the "centered" interface so far, but apparently there's at least a hundred people using it. It'd be interesting to know how many of these people are recently active users. If we do a poll I think it should be to ask if there is anyone out there who cares about the centered interface.
tk
Ian Young
May 24, 2013, 7:32:34 PM5/24/13
to grinnellplan...@googlegroups.com
Awesome, that positioning stylesheet is great. Once we have a more solid plan about how to proceed on deprecating the interfaces, we should definitely publicize it on [css] and maybe elsewhere.
When those numbers were taken, it was for *reasonably* active users (logged in within the past year). Perhaps those stats have changed a bit in the intervening time, but I bet they're still similar. I'd say if it's easy to create alternate centered versions of some stylesheets, we could do that. But it's probably not worth going to extraordinary lengths over it. I'd just as soon offer people some new, prettier stylesheets that offer similar layouts.
tk--
Alex Cohn
May 24, 2013, 9:36:58 PM5/24/13
to grinnellplan...@googlegroups.com
Here are the numbers as of 30 seconds ago:
$ echo "select interface, effective_stylesheet , count(*) as count from ian_effective_view where login > date_sub(now(), interval 1 year) group by interface, effective_stylesheet order by count desc;" | mysql plans_prod
interface effective_stylesheet count
interfaces/tableless/tableless.php styles/slate.css 1054
interfaces/default/defaultinterface.php styles/default/default.css 440
interfaces/oldplans/oldplan.php styles/oldstyle/oldstyle.css 226
interfaces/default/defaultinterface.php styles/oldstyle/oldstyle.css 176
interfaces/default/defaultinterface.php styles/jolly/jolly.css 169
interfaces/tableless/tableless.php styles/libre.css 157
interfaces/default/defaultinterface.php styles/terminal/terminal.css 124
interfaces/default/defaultinterface.php styles/parchment/parchment.css 97
interfaces/oldplans/oldplan.php styles/default/default.css 76
interfaces/centered/centered.php styles/oldstyle/oldstyle.css 57
interfaces/oldplans/oldplan.php styles/jolly/jolly.css 47
interfaces/default/defaultinterface.php styles/libre.css 36
interfaces/oldplans/oldplan.php styles/terminal/terminal.css 31
interfaces/centered/centered.php styles/jolly/jolly.css 31
interfaces/oldplans/oldplan.php styles/parchment/parchment.css 29
interfaces/default/defaultinterface.php styles/blue/blue.css 28
interfaces/tableless/tableless.php styles/oldstyle/oldstyle.css 26
interfaces/centered/centered.php styles/default/default.css 23
interfaces/centered/centered.php styles/terminal/terminal.css 22
interfaces/centered/centered.php styles/parchment/parchment.css 21
interfaces/tableless/tableless.php styles/terminal/terminal.css 18
interfaces/tableless/tableless.php styles/default/default.css 17
interfaces/tableless/tableless.php styles/jolly/jolly.css 16
interfaces/oldplans/oldplan.php styles/libre.css 11
interfaces/centered/centered.php styles/libre.css 10
interfaces/oldplans/oldplan.php styles/blue/blue.css 9
interfaces/default/defaultinterface.php styles/slate.css 7
interfaces/default/defaultinterface.php http://static.iangreenleaf.com/plans/css/arrows/arrowstyle.css 6
interfaces/default/defaultinterface.php http://www.cs.grinnell.edu/~wangentz/CSSplans/flowers/grinnell_blossom.css 6
interfaces/tableless/tableless.php styles/parchment/parchment.css 6
interfaces/default/defaultinterface.php http://www.wangentz.org/grinnellplans/flowers/my_garden.css 5
interfaces/default/defaultinterface.php http://www.wangentz.org/grinnellplans/flowers/grinnell_blossom.css 5
interfaces/centered/centered.php styles/blue/blue.css 4
interfaces/default/defaultinterface.php http://www.math.grinnell.edu/~youngian/style/safe/arrowstyle_safe.css 3
interfaces/default/defaultinterface.php http://web.grinnell.edu/individuals/rootwile/plans/msplans.css 3
interfaces/default/defaultinterface.php http://www.cs.grinnell.edu/~wangentz/CSSplans/flowers/my_garden.css 3
interfaces/default/defaultinterface.php http://www.wangentz.org/grinnellplans/vegetables/grocery_shopping.css 3
interfaces/default/defaultinterface.php http://www.wangentz.org/grinnellplans/memory/childhood_memory2.css 3
interfaces/default/defaultinterface.php http://www.math.grinnell.edu/~youngian/style/arrowstyle.css 2
interfaces/default/defaultinterface.php http://www.wangentz.org/grinnellplans/flowers/my_garden.cs 2
interfaces/default/defaultinterface.php http://www.wangentz.org/grinnellplans/memory/childhood_memory.css 2
interfaces/default/defaultinterface.php http://www.cs.grinnell.edu/~wangentz/CSSplans/vegetables/grocery_shopping.css 2
interfaces/oldplans/oldplan.php http://www.cs.grinnell.edu/~wangentz/CSSplans/vegetables/grocery_shopping.css 2
interfaces/oldplans/oldplan.php http://www.wangentz.org/grinnellplans/flowers/grinnell_blossom.css 2
interfaces/centered/centered.php styles/slate.css 2
interfaces/tableless/tableless.php http://www.wangentz.org/grinnellplans/memory/childhood_memory.css 2
interfaces/default/defaultinterface.php http://web.grinnell.edu/individuals/patterso/modplants.css 1
interfaces/default/defaultinterface.php http://www.wallpapergate.com/data/media/1581/Audrey_Hepburn.jpg 1
interfaces/default/defaultinterface.php http://www.cs.grinnell.edu/~wangentz/CSSplans/vegetables/yummy_white.css 1
interfaces/default/defaultinterface.php http://web.grinnell.edu/individuals/rootwile/plans/schoolspiritplan.css 1
interfaces/default/defaultinterface.php http://www.wangentz.org/grinnellplans/patterson/ireland.css 1
interfaces/default/defaultinterface.php http://www.cs.grinnell.edu/~wangentz/CSSplans/memory/childhood_memory.css 1
interfaces/default/defaultinterface.php http://www.cs.grinnell.edu/~wangentz/CSSplans/memory/childhood_memory2.css 1
interfaces/default/defaultinterface.php http://www.wangentz.org/grinnellplans/boys_and_girls/some_cuteness.css 1
interfaces/default/defaultinterface.php http://www.cs.grinnell.edu/~wangentz/CSSplans/the_sky/the_sky.css 1
interfaces/default/defaultinterface.php http://www.cs.grinnell.edu/~exarhosa/plans_styles/swing/swing.css 1
interfaces/default/defaultinterface.php body {font-size:62%; color:#333; font-family:arial,verdana,sans; margin:0; padding:0; } /* Divs */ #wrapper {width:960px; margin:0 auto; font-size:1.165em; line-height:1.275em; position:relative; top:120px;} #finger {float:right; margin: 0 0 30px 660px; 1
interfaces/oldplans/oldplan.php http://www.fanny.foodbeam.com/wp-content/themes/fannycollection/style.css 1
interfaces/oldplans/oldplan.php http://www.cs.grinnell.edu/~wangentz/CSSplans/flowers/grinnell_blossom.css 1
\nhttp://www.cs.grin.edu/~caseevan/terminal-blue.css 1
interfaces/oldplans/oldplan.php http://www.wangentz.org/grinnellplans/memory/childhood_memory2.css 1
interfaces/centered/centered.php http://www.cs.grinnell.edu/~wangentz/CSSplans/vegetables/grocery_shopping.css 1
interfaces/centered/centered.php http://www.wangentz.org/grinnellplans/memory/childhood_memory.css 1
interfaces/centered/centered.php http://www.wangentz.org/grinnellplans/memory/childhood_memory2.css 1
interfaces/centered/centered.php http://www.cs.grinnell.edu/~wangentz/CSSplans/flowers/my_garden.css 1
interfaces/tableless/tableless.php http://www.wangentz.org/grinnellplans/flowers/grinnell_blossom.css 1
interfaces/tableless/tableless.php http://www.wangentz.org/grinnellplans/vegetables/grocery_shopping.css 1
interfaces/tableless/tableless.php https://pioneerweb.grinnell.edu/bbcswebdav/users/conleyal/plans/beartato.css 1
interfaces/tableless/tableless.php https://pioneerweb.grinnell.edu/bbcswebdav/users/conleyal/plans/davidbowieplans.css 1
interfaces/tableless/tableless.php https://pioneerweb.grinnell.edu/bbcswebdav/users/conleyal/plans/jellyfish.css 1
Tom Baldwin
May 24, 2013, 11:50:38 PM5/24/13
to grinnellplan...@googlegroups.com
THX 4 data, Alex. I gave it the ol' parse and pivot:
Scroll to the last chart. The 10 sheets I plot there comprise 91% of users still using older interfaces.
Of the top 10, four are already postmodern sheets (freebies). The remaining 6 are the older default interfaces in the repo I linked this morning.
default, oldstyle, and terminal are all very close to done. blue needs a lot of work but is unpopular so we could drop it. That leaves jolly and parchment, which I have not worked on yet - any takers?
Another thing to note from the data is that a substantial fraction of people are using the centered interface (much to my chagrin since I don't care enough to work on that). However, an even larger fraction have opted to use the term "autofinger", not just the ones using `oldstyle`.
Given that, I'd say preserving the old term is just as important as preserving centered stylesheets, if not more. (That is not to say that either one of those things is necessarily important enough to spend dev time on.)
tk
Reply all
Reply to author
Forward
0 new messages