librelist archives

« back to archive

960 grid implementation

960 grid implementation

From:
Aaron Williams
Date:
2011-12-16 @ 19:38
Hello everyone! 

I love nest and want to use it to build my next site. Question though, is 
there a straight forward to go ahead using 960.gs?

I'm new to SASS, but it seems pretty straight forward. What would be the 
best way to add a grid based theme? I know the Painter theme is based on a
960 grid, but for whatever reason I can't figure out how to set it up.

Thanks! 

-- 
Aaron Williams
@aboutaaron

Re: [nesta] 960 grid implementation

From:
James Abbott
Date:
2011-12-16 @ 20:16
Hi Aaron,-

to add a grid based theme (or any custom theme) to Nesta you'll have to
create your markup in HAML format. As for styles, you can: 1) create a CSS
doc and have it in your /public/css folder. Nesta will detect and load it
before it loads the default theme; 2) create a SASS doc and have it in your
/views folder. That is the way the default layout works, so you'll have to
replace the default theme files with your own.

Here's an overview of what you need to get started:
http://nestacms.com/docs/design/custom-designs

Cheers,
James

On Fri, Dec 16, 2011 at 8:38 PM, Aaron Williams <
aaron.colby.williams@gmail.com> wrote:

>  Hello everyone!
>
> I love nest and want to use it to build my next site. Question though, is
> there a straight forward to go ahead using 960.gs?
>
> I'm new to SASS, but it seems pretty straight forward. What would be the
> best way to add a grid based theme? I know the Painter theme is based on a
> 960 grid, but for whatever reason I can't figure out how to set it up.
>
> Thanks!
>
> --
> Aaron Williams
> @aboutaaron
>
>

Re: [nesta] 960 grid implementation

From:
Aaron Williams
Date:
2011-12-16 @ 20:32
Hi James, 

Thanks for the quick reply. Would I put the 960.css file in /public/css or
do I need to convert the 960.css file to a .sass file?

That's where I'm getting stuck.

Thanks a lot! 

-- 
Aaron Williams
Web Director
Golden Gate Xpress
http://goldengatexpress.org
(510) 207-3331
@aboutaaron


On Friday, December 16, 2011 at 12:16 PM, James Abbott wrote:

> Hi Aaron,-
> 
> to add a grid based theme (or any custom theme) to Nesta you'll have to 
create your markup in HAML format. As for styles, you can: 1) create a CSS
doc and have it in your /public/css folder. Nesta will detect and load it 
before it loads the default theme; 2) create a SASS doc and have it in 
your /views folder. That is the way the default layout works, so you'll 
have to replace the default theme files with your own.
> 
> Here's an overview of what you need to get started:
> http://nestacms.com/docs/design/custom-designs
> 
> Cheers,
> James
> 
> On Fri, Dec 16, 2011 at 8:38 PM, Aaron Williams 
<aaron.colby.williams@gmail.com (mailto:aaron.colby.williams@gmail.com)> 
wrote:
> > Hello everyone! 
> > 
> > I love nest and want to use it to build my next site. Question though,
is there a straight forward to go ahead using 960.gs (http://960.gs)?
> > 
> > I'm new to SASS, but it seems pretty straight forward. What would be 
the best way to add a grid based theme? I know the Painter theme is based 
on a 960 grid, but for whatever reason I can't figure out how to set it 
up. 
> > 
> > Thanks! 
> > 
> > -- 
> > Aaron Williams
> > @aboutaaron
> > 
> 

Re: [nesta] 960 grid implementation

From:
James Abbott
Date:
2011-12-17 @ 10:06
/public/css if you go with CSS files;
/views if you go with SASS files.

Either way works - I'd go with whatever language you're most comfortable
building styles in.

/ James

On Fri, Dec 16, 2011 at 9:32 PM, Aaron Williams <
aaron.colby.williams@gmail.com> wrote:

>  Hi James,
>
> Thanks for the quick reply. Would I put the 960.css file in /public/css or
> do I need to convert the 960.css file to a .sass file?
>
> That's where I'm getting stuck.
>
> Thanks a lot!
>
> --
> Aaron Williams
> Web Director
> Golden Gate Xpress
> http://goldengatexpress.org
> (510) 207-3331
> @aboutaaron
>
> On Friday, December 16, 2011 at 12:16 PM, James Abbott wrote:
>
> Hi Aaron,-
>
> to add a grid based theme (or any custom theme) to Nesta you'll have to
> create your markup in HAML format. As for styles, you can: 1) create a CSS
> doc and have it in your /public/css folder. Nesta will detect and load it
> before it loads the default theme; 2) create a SASS doc and have it in your
> /views folder. That is the way the default layout works, so you'll have to
> replace the default theme files with your own.
>
> Here's an overview of what you need to get started:
> http://nestacms.com/docs/design/custom-designs
>
> Cheers,
> James
>
> On Fri, Dec 16, 2011 at 8:38 PM, Aaron Williams <
> aaron.colby.williams@gmail.com> wrote:
>
>  Hello everyone!
>
> I love nest and want to use it to build my next site. Question though, is
> there a straight forward to go ahead using 960.gs?
>
> I'm new to SASS, but it seems pretty straight forward. What would be the
> best way to add a grid based theme? I know the Painter theme is based on a
> 960 grid, but for whatever reason I can't figure out how to set it up.
>
> Thanks!
>
> --
> Aaron Williams
> @aboutaaron
>
>
>
>

Re: [nesta] 960 grid implementation

From:
Date:
2011-12-17 @ 23:38
Ah, that makes sense. 

 Was under the impression nesta used sass or SCSS only. 

I'll give it a try. 

Thanks



On Dec 17, 2011, at 2:06 AM, James Abbott <abbottjam@gmail.com> wrote:

> /public/css if you go with CSS files;
> /views if you go with SASS files.
> 
> Either way works - I'd go with whatever language you're most comfortable
building styles in.
> 
> / James
> 
> On Fri, Dec 16, 2011 at 9:32 PM, Aaron Williams 
<aaron.colby.williams@gmail.com> wrote:
> Hi James,
> 
> Thanks for the quick reply. Would I put the 960.css file in /public/css 
or do I need to convert the 960.css file to a .sass file?
> 
> That's where I'm getting stuck.
> 
> Thanks a lot!
> 
> -- 
> Aaron Williams
> Web Director
> Golden Gate Xpress
> http://goldengatexpress.org
> (510) 207-3331
> @aboutaaron
> 
> On Friday, December 16, 2011 at 12:16 PM, James Abbott wrote:
> 
>> Hi Aaron,-
>> 
>> to add a grid based theme (or any custom theme) to Nesta you'll have to
create your markup in HAML format. As for styles, you can: 1) create a CSS
doc and have it in your /public/css folder. Nesta will detect and load it 
before it loads the default theme; 2) create a SASS doc and have it in 
your /views folder. That is the way the default layout works, so you'll 
have to replace the default theme files with your own.
>> 
>> Here's an overview of what you need to get started:
>> http://nestacms.com/docs/design/custom-designs
>> 
>> Cheers,
>> James
>> 
>> On Fri, Dec 16, 2011 at 8:38 PM, Aaron Williams 
<aaron.colby.williams@gmail.com> wrote:
>>> Hello everyone!
>>> 
>>> I love nest and want to use it to build my next site. Question though,
is there a straight forward to go ahead using 960.gs?
>>> 
>>> I'm new to SASS, but it seems pretty straight forward. What would be 
the best way to add a grid based theme? I know the Painter theme is based 
on a 960 grid, but for whatever reason I can't figure out how to set it 
up.
>>> 
>>> Thanks!
>>> 
>>> -- 
>>> Aaron Williams
>>> @aboutaaron
>>> 
>> 
> 
> 

Re: [nesta] 960 grid implementation

From:
James Abbott
Date:
2011-12-18 @ 20:27
>
>  Was under the impression nesta used sass or SCSS only.
>

That's technically true, but Nesta is a Sinatra app and as such uses the
/public directory for CSS files and other static site assets:

http://www.sinatrarb.com/intro#Static%20Files

When you place a raw CSS file in /public/css you're essentially telling
Nesta: "Here, no need to look for .sass files in /views; use this instead".
So you override the Nesta default by leaning back on a Sinatra default.

/ James


On Sun, Dec 18, 2011 at 12:38 AM, <aaron.colby.williams@gmail.com> wrote:

> Ah, that makes sense.
>
>  Was under the impression nesta used sass or SCSS only.
>
> I'll give it a try.
>
> Thanks
>
>
>
> On Dec 17, 2011, at 2:06 AM, James Abbott <abbottjam@gmail.com> wrote:
>
> /public/css if you go with CSS files;
> /views if you go with SASS files.
>
> Either way works - I'd go with whatever language you're most comfortable
> building styles in.
>
> / James
>
> On Fri, Dec 16, 2011 at 9:32 PM, Aaron Williams <
> aaron.colby.williams@gmail.com> wrote:
>
>>  Hi James,
>>
>> Thanks for the quick reply. Would I put the 960.css file in /public/css
>> or do I need to convert the 960.css file to a .sass file?
>>
>> That's where I'm getting stuck.
>>
>> Thanks a lot!
>>
>> --
>> Aaron Williams
>> Web Director
>> Golden Gate Xpress
>> http://goldengatexpress.org
>> (510) 207-3331
>> @aboutaaron
>>
>> On Friday, December 16, 2011 at 12:16 PM, James Abbott wrote:
>>
>> Hi Aaron,-
>>
>> to add a grid based theme (or any custom theme) to Nesta you'll have to
>> create your markup in HAML format. As for styles, you can: 1) create a CSS
>> doc and have it in your /public/css folder. Nesta will detect and load it
>> before it loads the default theme; 2) create a SASS doc and have it in your
>> /views folder. That is the way the default layout works, so you'll have to
>> replace the default theme files with your own.
>>
>> Here's an overview of what you need to get started:
>> http://nestacms.com/docs/design/custom-designs
>>
>> Cheers,
>> James
>>
>> On Fri, Dec 16, 2011 at 8:38 PM, Aaron Williams <
>> aaron.colby.williams@gmail.com> wrote:
>>
>>  Hello everyone!
>>
>> I love nest and want to use it to build my next site. Question though, is
>> there a straight forward to go ahead using 960.gs?
>>
>> I'm new to SASS, but it seems pretty straight forward. What would be the
>> best way to add a grid based theme? I know the Painter theme is based on a
>> 960 grid, but for whatever reason I can't figure out how to set it up.
>>
>> Thanks!
>>
>> --
>> Aaron Williams
>> @aboutaaron
>>
>>
>>
>>
>

Re: [nesta] 960 grid implementation

From:
Graham Ashton
Date:
2011-12-19 @ 09:21
On 17 Dec 2011, at 23:38, aaron.colby.williams@gmail.com wrote:

> Was under the impression nesta used sass or SCSS only. 

James is quite right; static files in ./public work a treat.

If you fancy getting into Sass slowly (or just using a few of it's 
features, rather than the full gamut), just copy for .css file into 
./views and rename it with a .scss extension. Nesta will then serve it at 
the URL /css/yourfile.css.

This works because SCSS is a superset of CSS.

Re: [nesta] 960 grid implementation

From:
Aaron Williams
Date:
2011-12-19 @ 09:31
Fantastic! That is super helpful!

Thank you Graham and James. I'll keep you posted on my progress. 

-- 
Aaron Williams
Web Director
Golden Gate Xpress
http://goldengatexpress.org
(510) 207-3331
@aboutaaron


On Monday, December 19, 2011 at 1:21 AM, Graham Ashton wrote:

> On 17 Dec 2011, at 23:38, aaron.colby.williams@gmail.com 
(mailto:aaron.colby.williams@gmail.com) wrote:
> 
> > Was under the impression nesta used sass or SCSS only. 
> 
> James is quite right; static files in ./public work a treat.
> 
> If you fancy getting into Sass slowly (or just using a few of it's 
features, rather than the full gamut), just copy for .css file into 
./views and rename it with a .scss extension. Nesta will then serve it at 
the URL /css/yourfile.css.
> 
> This works because SCSS is a superset of CSS.