From aacb83fee50a58036ca73fac9b34943f1b0f476f Mon Sep 17 00:00:00 2001 From: Divya Manian Date: Mon, 28 Nov 2011 15:53:40 -0800 Subject: [PATCH] adding twitter to sidebar. need the content to be tweaked. list items are styled per tasks as envisioned by @wilto --- css/style.css | 37 ++++++------- index.html | 140 ++++++++++++++++++++++++++++++-------------------- 2 files changed, 99 insertions(+), 78 deletions(-) diff --git a/css/style.css b/css/style.css index 2298833..a00bea2 100644 --- a/css/style.css +++ b/css/style.css @@ -241,17 +241,9 @@ dd:last-child, border-bottom: none; } -.q-a, -.key-val { float: left; } +.section > section { margin-top: 2em; } -.key-val dt, -.key { - color: #3d526d; - padding: .5em 0 0 0; - margin: 0; -} - -.tasks { +section ul { font-size: .9em; margin-top: .9em; list-style: none; @@ -259,14 +251,13 @@ dd:last-child, margin-left: 0; } -.tasks li:not(:last-child) { +section li:not(:last-child) { border-bottom: 1px dotted #bfc6cf; - padding: 0 0 .5em 0; -} -.tasks p { - margin: .5em 0 0 0; + padding: 0.5em 0; } +.getinvolved { font-size: 0.9em; } + .pledges { padding-top: .5em; } @@ -307,6 +298,7 @@ dd:last-child, font-size: 1.15em; } + .resources { overflow: auto; list-style: none; @@ -374,8 +366,9 @@ nav li { width: 94.1%; } - .col-a, - .col-b { width: 48.020833333333%; } + .col-a { width: 72%; } + + .col-b { width: 25%;} .col-a { float: left; } @@ -453,18 +446,20 @@ nav li { ========================================================================== */ -/* Hide from both screenreaders and browsers: h5bp.com/u */ .hidden { display: none !important; visibility: hidden; } -/* Hide only visually, but have it available for screenreaders: h5bp.com/v */ .a11y-only { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; } -/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */ .a11y-only.focusable:active, .a11y-only.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; } -/* Hide visually and from screenreaders, but maintain layout */ .hide { visibility: hidden; } +.clearfix:before, .clearfix:after, +.section > section:before, +.section > section:after { content: ""; display: table; } +.clearfix:after, +.section > section:after { clear: both; } +.clearfix { *zoom: 1; } diff --git a/index.html b/index.html index 9b9d1f1..5fff0e5 100644 --- a/index.html +++ b/index.html @@ -37,7 +37,7 @@

OMG Welcome! Let's work together to push the web forward!

-
+

Learn

One of the most beautiful things about the web is that it's constantly changing. While these changes and improvements can be overwhelming, we're here to help you get caught up! Here are some great resources to walk you through how browsers work, and help keep you up to date on their improvements.

How do I keep up with what’s landing in browsers?

@@ -89,10 +89,18 @@

Reference docs/wikis

  • Forward-compatible websites - list of best practices for creating websites that won’t break when browsers are updated.
    • +
    +
    +

    Can you do this?

    +
    +

    If you want to be counted among those brave enough to attempt to do this.

    +
    +
    +
    -
    +

    Explore

    Once you've picked up the basics, it's time to dive a bit deeper into the current (and future) state of web standards! Get excited, because here, we check out advanced CSS, brand-new HTML5 features/APIs, and even what the future of these languages are expected to be. Several new capabilities are now available in browsers, and exploring these new capabilities will help us push the web forward!

    +
    +
    +

    Can you do this?

    +
    +

    If you want to be counted among those brave enough to attempt to do this.

    +
    +
    +
    -
    +

    Meet like-minded folks

    Attending local meetups and conferences is a great way to connect with other developers to learn, share resources, and bring new ideas and collaborations to life. Sites like Meetup.com and Lanyrd can help you find events in your neighborhood.

    +
    +
    +

    Can you do this?

    +
    +

    If you want to be counted among those brave enough to attempt to do this.

    +
    +
    +
    -
    +

    Ask for help

    Answer questions and participate in conversations on IRC

    How to get started with freenode and irc

    @@ -145,53 +169,15 @@

    How to ask for help

  • Remember: be specific!
    • +
    +
    +

    Can you do this?

    +
    +

    If you want to be counted among those brave enough to attempt to do this.

    +
    +
    +
    - -
    -
    -

    How can I get involved?

    - -
      -
    • -

      Curabitur gravida blandit quam, et venenatis libebro cursus vel. Integer mattis, enim in ultricies pharetra, nibh risus accumsan odio.

      -
      • -
    • -

      Class aptent taciti sociosqu ad litora torquent per conubia nostra.

      -
      • -
    - - -
    -
    @@ -200,7 +186,7 @@

    Mo’ Advanced

    Are you a ninja? Dare to know what you can do beyond these?

    -
    +

    Help Others

    Open-Source projects worth your time

    @@ -215,12 +201,20 @@

    Open-Source projects worth your ti
  • jQuery standards
    • -

    Do what is asked in ‘ask for help’ above and check out Addy Osmani’s video about getting involved!

    +

    Do what is asked in ‘ask for help’ above and check out Addy Osmani’s video about getting involved!

    +
    +
    +

    Can you do this?

    +
    +

    If you want to be counted among those brave enough to attempt to do this.

    +
    +
    +
    -
    -
    +
    +

    Give Feedback on Specifications

    Specs codify the expected behavior. They are developed by Working Groups (WG) along with active discussion on mailing lists. While we can’t always be certain that all browser vendors will adhere to the rules set forth in a spec they provide us with something that we, as developers, can standardize against.

    @@ -246,9 +240,17 @@

    Give Feedback on Specifications

    +
    +
    +

    Can you do this?

    +
    +

    If you want to be counted among those brave enough to attempt to do this.

    +
    +
    +
    -
    +

    Write

    Publish what you learn and don’t be afraid to make mistakes. Publish to your personal blog and keep your posts updated. Be sure to speak with your own voice! Remember that it is okay to not be an absolute authority on a subject to author a post! Always ask questions and prompt conversations. There is seldom a wrong question or a wrong answer.

    @@ -275,9 +277,17 @@

    What should you start to learn abo

    +
    +
    +

    Can you do this?

    +
    +

    If you want to be counted among those brave enough to attempt to do this.

    +
    +
    +
    -
    +

    File bugs

    Seriously, all browser vendors would much rather you file tickets with them than tweet about bugs. :)

      @@ -295,6 +305,14 @@

      File bugs

    +
    +
    +

    Can you do this?

    +
    +

    If you want to be counted among those brave enough to attempt to do this.

    +
    +
    +
    @@ -303,7 +321,7 @@

    Winrar!

    You are the expert and you are bored with all these suggestions? May we suggest you these?

    -
    +

    Hack!

    Push the web to it's limits! Hack on CSS, advanced HTML, and JavaScript. Hack on the browser's rendering engine. Fork github repos, dig through the code, and keep on learning. Let's make the web more awesome. There are so many ways…

    Contribute to browsers

    @@ -337,6 +355,14 @@

    Contribute to validators

  • WebVTT
    • +
    +
    +

    Can you do this?

    +
    +

    If you want to be counted among those brave enough to attempt to do this.

    +
    +
    +