|
1 | 1 | --- |
2 | 2 | layout: post |
3 | | -permalink: /pretzel.html |
4 | | -date: 2012-01-31 08:00 |
5 | | -title: "Pretzel" |
| 3 | +permalink: /metro-dot-css.html |
| 4 | +date: 2012-02-07 08:00 |
| 5 | +title: "metro.css" |
6 | 6 | author: "@aeoth, @shiftkey and @tobin" |
7 | 7 | comments: true |
8 | 8 | --- |
9 | 9 |
|
| 10 | +[This idea](https://code52.uservoice.com/forums/143105-code-52/suggestions/2465600-metro-css-built-on-bootstrap) started out as something straight-forward which we suggested before Code52 had officially started, and we've had a couple of projects touch on the [Metro design language](http://en.wikipedia.org/wiki/Metro_(design_language)) - our [Markpad](http://code52.org/DownmarkerWPF/) app in particular. And with Windows 8 nudging towards a new public build, more and more people are curious abbout it. |
10 | 11 |
|
11 | | -After an epic week doing game development (which for many of us was new territory), we've picked a project which revisits one of languages we use everywhere with Code52 - Markdown. |
| 12 | +## metro.css - using Bootstrap |
12 | 13 |
|
13 | | -## Pretzel |
| 14 | +Twitter just unveiled [Bootstrap](http://twitter.github.com/bootstrap/) V2 - a lean template for getting a website started with grid layout, responsive design, cross-platform support and a bunch of other bells and whistles. |
14 | 15 |
|
15 | | -Code52 are big fans of [Jekyll](https://github.com/mojombo/jekyll), the Ruby-based static site generator tool. In fact, the site you are reading leverages output from Jekyll (running on GitHub too - check out the code [here](https://github.com/code52/code52.github.com)) and all our project sites run on top of the same stack (more details [here](http://code52.org/gh-pages.html)). |
| 16 | +We want to see something similar for helping people build Metro-style applications. |
16 | 17 |
|
17 | | -To develop locally against Jekyll, you need to install ruby and configure your environment to install the right set of gems. **We want to create a tool in this vein which is more friendly for .NET developers - and support for the technologies that they use so that they too can quickly create sites.** |
| 18 | +## More than just a CSS file |
18 | 19 |
|
19 | | -We also want to explore implementing features on top of this Jekyll-like workflow: |
| 20 | +As this may appear to be a simple task, we are currently discussing specific goals to acheive: |
20 | 21 |
|
21 | | - * support different templating engines - Razor/Spark/??? |
22 | | - * support dynamic content alongside static content - for example using AppHarbor to generate content on-the-fly. |
23 | | - * support for different inputs - could we generate documentation for code using this tool? |
| 22 | + * Is it worth following the Bootstrap conventions for styles and structure, or do we not gain much given the differences in style. |
| 23 | + * A package to integrate metro.css with an ASP.NET MVC app - reuse what @Tobin has build with his [NuGet package](http://nuget.org/packages/MahApps.Twitter.Bootstrap) |
| 24 | + * A template for a Liquid-based static site - implement a better template for the Pretzel default sites. |
| 25 | + * What cool Javascript tricks can we add? Can we do some cross-platform work? |
24 | 26 |
|
25 | | -But before we head down that road, we want a simple tool to generate our websites. |
26 | | - |
27 | | -## Why Pretzel? |
28 | | - |
29 | | -We were discussing on JabbR what to name this tool, and someone described the process of generating a site as "baking". A few minutes later, we'd settled on the name "Pretzel" for the tool, rather than some derivative of Jekyll and Hyde. |
30 | | - |
31 | | -Conceptually, Pretzel could support two modes - **bake** and **taste**. |
32 | | - |
33 | | -**Bake** is for a once-off generation of the site. |
34 | | - |
35 | | -To scan the current directory for a website and detect the content to process, run: |
36 | | - |
37 | | - pretzel bake |
38 | | - |
39 | | -To scan a specific folder and parse the contents, run: |
40 | | - |
41 | | - pretzel bake C:\path\to\folder |
42 | | - |
43 | | -To explicitly specify the input - we should support inferring the input based on the files found anyway - run: |
44 | | - |
45 | | - pretzel bake --engine jekyll |
46 | | - |
47 | | -**Taste** is for testing a site locally using a browser - make a change, and Pretzel should detect the file changes and regenerate the site. |
48 | | - |
49 | | -To test a site locally (we plan to use [Dragonfly](https://github.com/loudej/dragonfly)), run: |
50 | | - |
51 | | - pretzel taste |
52 | | - |
53 | | -To specify the port to serve the site from (default will be 4000), run: |
54 | | - |
55 | | - pretzel taste --port 5000 |
56 | | - |
57 | | - |
58 | | -There's more ideas that we'll get to over teh course of the week, but this should give people an idea of how the tool should behave. |
| 27 | +## Follow the chatter |
59 | 28 |
|
| 29 | +This week will likely be a highly-entertaining process of discussing, iterating and experimenting with style, layout and usage. We use [JabbR](http://jabbr.net/#/rooms/code52) heavily to discuss stuff in real-time - if you want to get involved, drop in on the action. If you can't keep up, don't worry - JabbR also supports browsing the conversation history of a room (just scroll up to go back in time), so you can catch up on the past discussion. |
60 | 30 |
|
61 | 31 | ## How can I get involved? |
62 | 32 |
|
63 | | -The initial code is up on [GitHub](http://github.com/Code52/pretzel). The [Trello board](https://trello.com/board/pretzel/4f25ffb3dbbed1ab5a4f0f5a) will be updated over the course of today to define the set of tasks we plan to implement. |
64 | | - |
65 | | -Got an feature you'd like to see implemented in Pretzel? Hang out in the chatroom at [JabbR](http://jabbr.net/#/rooms/code52) and join in on the fun! |
66 | | - |
67 | | - |
68 | | - |
69 | | - |
70 | | - |
| 33 | +The initial code is up on [GitHub](http://github.com/Code52/metro.css). The [Trello board](https://trello.com/board/metro-css/4f2fd841a5146fa91fbff127) will be updated over the course of today/tomorrow as we sketch out what we'd like to demonstrate. |
71 | 34 |
|
| 35 | +Got some opinions on Metro UI? Hang out in the chatroom at [JabbR](http://jabbr.net/#/rooms/code52) and join in on the fun! |
0 commit comments