Page 1 of 1

Templates using the Yahoo Grids CSS UI Library (YUI) ...

Posted: Thu Feb 22, 2007 5:01 am
by wesyah234
Has anyone created any templates using the Yahoo UI Grids CSS libraries?  This library, along with their Fonts library, looks like a great starting point for an easily modifiable cmsms template.  If one was created, it could be included as one of the standard templates in the installation of CMSMS.

main documentation:
http://developer.yahoo.com/yui/grids/

a nice example writeup:
http://24ways.org/2006/intricate-fluid-layouts

Re: Templates using the Yahoo Grids CSS UI Library (YUI) ...

Posted: Fri Mar 16, 2007 7:06 pm
by kermit
not using the grids here... yet

but i am really starting to like the 'reset' and 'fonts' part of 'reset-fonts-grids.css'

for those who don't know what that is, it's a foundation to put at the start of your css to completely wipe the slate clean & level the playing field...

Code: Select all

/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.2.0
*/
/*reset.css*/body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul {list-style:none;}caption,th {text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border:0;}
/*fonts.css*/body{font:13px arial,helvetica,clean,sans-serif;*font-size:small;*font:x-small;}table {font-size:inherit;font:100%;}select, input, textarea {font:99% arial,helvetica,clean,sans-serif;}pre, code {font:115% monospace;*font-size:100%;}body * {line-height:1.22em;}
try it, you'll like it. ;)

Re: Templates using the Yahoo Grids CSS UI Library (YUI) ...

Posted: Fri Mar 16, 2007 8:21 pm
by heatherfeuer
Kermit,

Thanks for the links!  That is so a way cool tool!!  Just think what that could do for online newsletters!  Complicated layouts like you can get in print AND do it all without a single table!

Re: Templates using the Yahoo Grids CSS UI Library (YUI) ...

Posted: Fri Mar 16, 2007 9:05 pm
by wesyah234
Interesting thing I just noticed about the reset css is that ul / li tags get reset too, so your lists look like nothing, until you set them to the look you want...

I have a template going now in cmsms that uses the yahoo css layouts... I'll post it if anyone's interested.

Re: Templates using the Yahoo Grids CSS UI Library (YUI) ...

Posted: Fri Mar 16, 2007 9:25 pm
by cyberman
wesyah234 wrote: I'll post it if anyone's interested.
Great idea - please do it here

http://themes.cmsmadesimple.org/Share_a_Theme.html

Re: Templates using the Yahoo Grids CSS UI Library (YUI) ...

Posted: Fri Mar 16, 2007 10:19 pm
by wesyah234
What to upload?  the xml file created by the theme exporter?

Re: Templates using the Yahoo Grids CSS UI Library (YUI) ...

Posted: Fri Mar 16, 2007 10:31 pm
by cyberman
Yep. You can zip it too. Maybe a short readme.txt inside could useful.

Re: Templates using the Yahoo Grids CSS UI Library (YUI) ...

Posted: Tue Mar 20, 2007 3:51 am
by wesyah234
Actually, it isn't much at all... yahoo lets you fetch the css right from their server, if you want, so the only css you need is your own styling.

I'll just post the main template source here:

I used global content blocks for the header, footer, and side navigation area.

I also just used a basic menu template that outputted UL/LI's for each content page, no cascading menus.



{sitename} - {title}
{metadata}

{stylesheet}



 
   
      {global_content name='header'}
   
   
     
       
         
            {content}
         
       
     
     
       
         
            {menu template="basic"}
         
          {global_content name='side'}
       
     
   
   
      {global_content name='footer'}
   
 



Re: Templates using the Yahoo Grids CSS UI Library (YUI) ...

Posted: Tue Mar 20, 2007 5:28 am
by cyberman
wesyah234 wrote: I also just used a basic menu template that outputted UL/LI's for each content page, no cascading menus.
Thanks - can you post content of basic menu template for all (newbies) too?