WordPress.org
Get WordPress

Making WordPress.org

Ticket #171: Initial_styling_and_front_page_layout_.patch

File Initial_styling_and_front_page_layout_.patch, 17.6 KB (added by Rarst, 12 years ago)

  • wp-content/themes/wporg-developer/style.css 

    IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
     
    2727        content: '()';
    2828}
    2929
    30 article.wpapi-function .wpfuncref-prototype {   
     30article.wpapi-function .wpfuncref-prototype {
    3131        font-family: 'Droid Sans Mono', Courier New, Monospace;
    3232        font-size: 1.1em;
    3333        margin: 1em 0;
    … …  
    5353        margin: 1em 0;
    5454}
    5555article.wpapi-function dl {
    56        
     56
    5757}
    5858
    5959article.wpapi-function dl dt {
    … …  
    7474article.wpapi-function .wpfuncref-arg {
    7575        margin-bottom: 1em;
    7676}
    77 article.
    78 #comments .comment {
     77article.wpapi-function #comments .comment {
    7978        padding-bottom: 5px;
    8079        margin-bottom: 10px;
    8180}
    … …  
    8483        display: block;
    8584}
    8685
    87 #comments #ace-editor { 
     86#comments #ace-editor {
    8887        width: 60%;
    8988        height: 250px;
    9089        border: 1px solid #ccc;
    … …  
    109108}
    110109
    111110#comments .comment-author {
    112        
    113 }
     111
     112}
     113
     114
     115
     116/* =========== New styles ======== */
     117
     118/* =========== _s Standard ======= */
     119
     120/*
     121Resetting and rebuilding styles have been helped along thanks to the fine work of
     122Eric Meyer http://meyerweb.com/eric/tools/css/reset/index.html
     123along with Nicolas Gallagher and Jonathan Neal http://necolas.github.com/normalize.css/
     124and Blueprint http://www.blueprintcss.org/
     125*/
     126
     127
     128/* =Reset
     129-------------------------------------------------------------- */
     130
     131html, body, div, span, applet, object, iframe,
     132h1, h2, h3, h4, h5, h6, p, blockquote, pre,
     133a, abbr, acronym, address, big, cite, code,
     134del, dfn, em, font, ins, kbd, q, s, samp,
     135small, strike, strong, sub, sup, tt, var,
     136dl, dt, dd, ol, ul, li,
     137fieldset, form, label, legend,
     138table, caption, tbody, tfoot, thead, tr, th, td {
     139        border: 0;
     140        font-family: inherit;
     141        font-size: 100%;
     142        font-style: inherit;
     143        font-weight: inherit;
     144        margin: 0;
     145        outline: 0;
     146        padding: 0;
     147        vertical-align: baseline;
     148}
     149html {
     150        font-size: 62.5%; /* Corrects text resizing oddly in IE6/7 when body font-size is set using em units http://clagnut.com/blog/348/#c790 */
     151        overflow-y: scroll; /* Keeps page centered in all browsers regardless of content height */
     152        -webkit-text-size-adjust: 100%; /* Prevents iOS text size adjust after orientation change, without disabling user zoom */
     153        -ms-text-size-adjust:     100%; /* www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */
     154}
     155body {
     156        background: #fff;
     157}
     158article,
     159aside,
     160details,
     161figcaption,
     162figure,
     163footer,
     164header,
     165main,
     166nav,
     167section {
     168        display: block;
     169}
     170ol, ul {
     171        list-style: none;
     172}
     173table { /* tables still need 'cellspacing="0"' in the markup */
     174        border-collapse: separate;
     175        border-spacing: 0;
     176}
     177caption, th, td {
     178        font-weight: normal;
     179        text-align: left;
     180}
     181blockquote:before, blockquote:after,
     182q:before, q:after {
     183        content: "";
     184}
     185blockquote, q {
     186        quotes: "" "";
     187}
     188a:focus {
     189        outline: thin dotted;
     190}
     191a:hover,
     192a:active { /* Improves readability when focused and also mouse hovered in all browsers people.opera.com/patrickl/experiments/keyboard/test */
     193        outline: 0;
     194}
     195a img {
     196        border: 0;
     197}
     198
     199
     200/* =Global
     201----------------------------------------------- */
     202
     203body,
     204button,
     205input,
     206select,
     207textarea {
     208        color: #404040;
     209        font-family: sans-serif;
     210        font-size: 16px;
     211        font-size: 1.6rem;
     212        line-height: 1.5;
     213}
     214
     215/* Headings */
     216h1, h2, h3, h4, h5, h6 {
     217        clear: both;
     218        font-weight: normal;
     219}
     220hr {
     221        background-color: #ccc;
     222        border: 0;
     223        height: 1px;
     224        margin-bottom: 1.5em;
     225}
     226
     227/* Text elements */
     228p {
     229        margin-bottom: 1.5em;
     230}
     231ul, ol {
     232        margin: 0 0 1.5em 3em;
     233}
     234ul {
     235        list-style: disc;
     236}
     237ol {
     238        list-style: decimal;
     239}
     240li > ul,
     241li > ol {
     242        margin-bottom: 0;
     243        margin-left: 1.5em;
     244}
     245dt {
     246        font-weight: bold;
     247}
     248dd {
     249        margin: 0 1.5em 1.5em;
     250}
     251b, strong {
     252        font-weight: bold;
     253}
     254dfn, cite, em, i {
     255        font-style: italic;
     256}
     257blockquote {
     258        margin: 0 1.5em;
     259}
     260address {
     261        margin: 0 0 1.5em;
     262}
     263pre {
     264        background: #eee;
     265        font-family: "Courier 10 Pitch", Courier, monospace;
     266        font-size: 15px;
     267        font-size: 1.5rem;
     268        line-height: 1.6;
     269        margin-bottom: 1.6em;
     270        max-width: 100%;
     271        overflow: auto;
     272        padding: 1.6em;
     273}
     274code, kbd, tt, var {
     275        font: 15px Monaco, Consolas, "Andale Mono", "DejaVu Sans Mono", monospace;
     276}
     277abbr, acronym {
     278        border-bottom: 1px dotted #666;
     279        cursor: help;
     280}
     281mark, ins {
     282        background: #fff9c0;
     283        text-decoration: none;
     284}
     285sup,
     286sub {
     287        font-size: 75%;
     288        height: 0;
     289        line-height: 0;
     290        position: relative;
     291        vertical-align: baseline;
     292}
     293sup {
     294        bottom: 1ex;
     295}
     296sub {
     297        top: .5ex;
     298}
     299small {
     300        font-size: 75%;
     301}
     302big {
     303        font-size: 125%;
     304}
     305figure {
     306        margin: 0;
     307}
     308table {
     309        margin: 0 0 1.5em;
     310        width: 100%;
     311}
     312th {
     313        font-weight: bold;
     314}
     315img {
     316        height: auto; /* Make sure images are scaled correctly. */
     317        max-width: 100%; /* Adhere to container width. */
     318}
     319
     320/* Links */
     321a {
     322        color: royalblue;
     323}
     324a:visited {
     325        color: purple;
     326}
     327a:hover,
     328a:focus,
     329a:active {
     330        color: midnightblue;
     331}
     332
     333/* Alignment */
     334.alignleft {
     335        display: inline;
     336        float: left;
     337        margin-right: 1.5em;
     338}
     339.alignright {
     340        display: inline;
     341        float: right;
     342        margin-left: 1.5em;
     343}
     344.aligncenter {
     345        clear: both;
     346        display: block;
     347        margin: 0 auto;
     348}
     349
     350/* Text meant only for screen readers */
     351.screen-reader-text {
     352        clip: rect(1px, 1px, 1px, 1px);
     353        position: absolute !important;
     354}
     355
     356.screen-reader-text:hover,
     357.screen-reader-text:active,
     358.screen-reader-text:focus {
     359        background-color: #f1f1f1;
     360        border-radius: 3px;
     361        box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
     362        clip: auto !important;
     363        color: #21759b;
     364        display: block;
     365        font-size: 14px;
     366        font-weight: bold;
     367        height: auto;
     368        left: 5px;
     369        line-height: normal;
     370        padding: 15px 23px 14px;
     371        text-decoration: none;
     372        top: 5px;
     373        width: auto;
     374        z-index: 100000; /* Above WP toolbar */
     375}
     376
     377/* Clearing */
     378.clear:before,
     379.clear:after,
     380.entry-content:before,
     381.entry-content:after,
     382.comment-content:before,
     383.comment-content:after,
     384.site-header:before,
     385.site-header:after,
     386.site-content:before,
     387.site-content:after,
     388.site-footer:before,
     389.site-footer:after {
     390        content: '';
     391        display: table;
     392}
     393
     394.clear:after,
     395.entry-content:after,
     396.comment-content:after,
     397.site-header:after,
     398.site-content:after,
     399.site-footer:after {
     400        clear: both;
     401}
     402
     403
     404/* =========== Devhub Custom ===== */
     405
     406.devhub-wrap *,
     407.devhub-wrap *:before,
     408.devhub-wrap *:after {
     409  -moz-box-sizing: border-box;
     410  -webkit-box-sizing: border-box;
     411  box-sizing: border-box;
     412}
     413
     414.devhub-wrap a {
     415        color: #21759b;
     416        font-weight: bold;
     417}
     418
     419.devhub-wrap h2,
     420.devhub-wrap h3,
     421.devhub-wrap h4,
     422.devhub-wrap h5,
     423.devhub-wrap h6 {
     424        color: #1e1e1e;
     425        font-family: Georgia, serif;
     426}
     427
     428.devhub-wrap h2.widget-title,
     429.devhub-wrap h3.widget-title {
     430        font-family: Helvetica, sans-serif;
     431}
     432
     433#headline h2 a {
     434        color: #555;
     435        font-weight: 300;
     436        font-size: 28px;
     437        line-height: 1em;
     438        text-shadow: #fff 0px 1px 0px;
     439        font-family: Helvetica, sans-serif;
     440}
     441
     442.devhub-wrap h2 {
     443        font-size: 28px;
     444        line-height: 32px;
     445}
     446.devhub-wrap h3 {
     447        font-size: 22px;
     448        line-height: 26px;
     449}
     450.devhub-wrap h4 {
     451        font-size: 18px;
     452        line-height: 22px;
     453        border-bottom: none;
     454}
     455
     456
     457.devhub-wrap button,
     458.devhub-wrap input,
     459.devhub-wrap select,
     460.devhub-wrap textarea {
     461        font-size: 100%; /* Corrects font size not being inherited in all browsers */
     462        margin: 0; /* Addresses margins set differently in IE6/7, F3/4, S5, Chrome */
     463        vertical-align: baseline; /* Improves appearance and consistency in all browsers */
     464        *vertical-align: middle; /* Improves appearance and consistency in all browsers */
     465}
     466.devhub-wrap button,
     467.devhub-wrap input {
     468        line-height: normal; /* Addresses FF3/4 setting line-height using !important in the UA stylesheet */
     469}
     470.devhub-wrap button,
     471.devhub-wrap input[type="button"],
     472.devhub-wrap input[type="reset"],
     473.devhub-wrap input[type="submit"] {
     474        background-color: #21759b;
     475        background-image: -webkit-gradient(linear, left top, left bottom, from(#2a95c5), to(#21759b));
     476        background-image: -webkit-linear-gradient(top, #2a95c5, #21759b);
     477        background-image:    -moz-linear-gradient(top, #2a95c5, #21759b);
     478        background-image:     -ms-linear-gradient(top, #2a95c5, #21759b);
     479        background-image:      -o-linear-gradient(top, #2a95c5, #21759b);
     480        background-image:   linear-gradient(to bottom, #2a95c5, #21759b);
     481        border-color: #21759b;
     482        border-bottom-color: #1e6a8d;
     483        -webkit-box-shadow: inset 0 1px 0 rgba(120,200,230,0.5);
     484        box-shadow: inset 0 1px 0 rgba(120,200,230,0.5);
     485        color: #fff;
     486        text-decoration: none;
     487        text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
     488}
     489.devhub-wrap button:hover,
     490.devhub-wrap input[type="button"]:hover,
     491.devhub-wrap input[type="reset"]:hover,
     492.devhub-wrap input[type="submit"]:hover {
     493        background-color: #278ab7;
     494        background-image: -webkit-gradient(linear, left top, left bottom, from(#2e9fd2), to(#21759b));
     495        background-image: -webkit-linear-gradient(top, #2e9fd2, #21759b);
     496        background-image:    -moz-linear-gradient(top, #2e9fd2, #21759b);
     497        background-image:     -ms-linear-gradient(top, #2e9fd2, #21759b);
     498        background-image:      -o-linear-gradient(top, #2e9fd2, #21759b);
     499        background-image:   linear-gradient(to bottom, #2e9fd2, #21759b);
     500        border-color: #1b607f;
     501        -webkit-box-shadow: inset 0 1px 0 rgba(120,200,230,0.6);
     502        box-shadow: inset 0 1px 0 rgba(120,200,230,0.6);
     503        color: #fff;
     504        text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
     505}
     506.devhub-wrap button:focus,
     507.devhub-wrap input[type="button"]:focus,
     508.devhub-wrap input[type="reset"]:focus,
     509.devhub-wrap input[type="submit"]:focus,
     510.devhub-wrap button:active,
     511.devhub-wrap input[type="button"]:active,
     512.devhub-wrap input[type="reset"]:active,
     513.devhub-wrap input[type="submit"]:active {
     514        border-color: #0e3950;
     515        -webkit-box-shadow: inset 0 1px 0 rgba(120,200,230,0.6), 1px 1px 2px rgba(0,0,0,0.4);
     516        box-shadow: inset 0 1px 0 rgba(120,200,230,0.6), 1px 1px 2px rgba(0,0,0,0.4);
     517}
     518.devhub-wrap input[type="checkbox"],
     519.devhub-wrap input[type="radio"] {
     520        box-sizing: border-box; /* Addresses box sizing set to content-box in IE8/9 */
     521        padding: 0; /* Addresses excess padding in IE8/9 */
     522}
     523.devhub-wrap input[type="search"] {
     524        -webkit-appearance: textfield; /* Addresses appearance set to searchfield in S5, Chrome */
     525        -webkit-box-sizing: content-box; /* Addresses box sizing set to border-box in S5, Chrome (include -moz to future-proof) */
     526        -moz-box-sizing:    content-box;
     527        box-sizing:         content-box;
     528}
     529.devhub-wrap input[type="search"]::-webkit-search-decoration { /* Corrects inner padding displayed oddly in S5, Chrome on OSX */
     530        -webkit-appearance: none;
     531}
     532.devhub-wrap button::-moz-focus-inner,
     533.devhub-wrap input::-moz-focus-inner { /* Corrects inner padding and border displayed oddly in FF3/4 www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */
     534        border: 0;
     535        padding: 0;
     536}
     537.devhub-wrap input[type="text"],
     538.devhub-wrap input[type="email"],
     539.devhub-wrap input[type="url"],
     540.devhub-wrap input[type="password"],
     541.devhub-wrap input[type="search"],
     542.devhub-wrap textarea {
     543        color: #666;
     544        border: 1px solid #ccc;
     545        border-radius: 3px;
     546}
     547.devhub-wrap input[type="text"]:focus,
     548.devhub-wrap input[type="email"]:focus,
     549.devhub-wrap input[type="url"]:focus,
     550.devhub-wrap input[type="password"]:focus,
     551.devhub-wrap input[type="search"]:focus,
     552.devhub-wrap textarea:focus {
     553        color: #111;
     554}
     555.devhub-wrap input[type="text"],
     556.devhub-wrap input[type="email"],
     557.devhub-wrap input[type="url"],
     558.devhub-wrap input[type="password"],
     559.devhub-wrap input[type="search"] {
     560        padding: 3px;
     561}
     562.devhub-wrap textarea {
     563        overflow: auto; /* Removes default vertical scrollbar in IE6/7/8/9 */
     564        padding-left: 3px;
     565        vertical-align: top; /* Improves readability and alignment in all browsers */
     566        width: 98%;
     567}
     568
     569.reference-landing {
     570        margin: 0 auto;
     571        max-width: 660px;
     572        max-width: 66rem;
     573        padding: 1em 0;
     574}
     575
     576.reference-landing .section {
     577        padding: 1.5em 0;
     578}
     579
     580.devhub-wrap .horizontal-list {
     581        display: inline;
     582        list-style-type: none;
     583        margin: 0;
     584        padding: 0;
     585}
     586.devhub-wrap .horizontal-list li {
     587        display: inline;
     588}
     589.devhub-wrap .horizontal-list li a {
     590        padding: 0px 40px;
     591        border-left: 1px solid #ccc;
     592}
     593.devhub-wrap .horizontal-list li:first-child a {
     594        padding-left: 0;
     595        border-left: none;
     596}
     597
     598.search-guide h3 {
     599        margin-bottom: 1em;
     600}
     601
     602.reference-landing .searchform,
     603.reference-landing .searchform input {
     604        height: 50px;
     605        margin-bottom: 1em;
     606}
     607
     608.reference-landing .searchform input[type="text"] {
     609        width: 560px;
     610        margin-right: 15px;
     611        float: left;
     612}
     613.reference-landing .searchform input[type="submit"] {
     614        width: 85px;
     615        float: left;
     616}
     617
     618@media ( max-width: 66em ) {
     619        .reference-landing .searchform input[type="text"],
     620        .reference-landing .searchform input[type="submit"] {
     621                width: 100%;
     622                margin-right: 0;
     623                margin-bottom: 1em;
     624                float: none;
     625                clear: both;
     626        }
     627}
     628
     629.devhub-wrap .box {
     630        width: 48%;
     631        background: #f7f7f7;
     632        border: 1px solid #dfdfdf;
     633        padding: 30px;
     634        padding: 3rem;
     635}
     636.devhub-wrap .box-left {
     637        float: left;
     638}
     639.devhub-wrap .box-right {
     640        float: right;
     641}
     642
     643.devhub-wrap .box .unordered-list {
     644        list-style-type: none;
     645        padding: 0;
     646        margin: 0;
     647        font-size: 13px;
     648        line-height: 30px;
     649}
     650
     651.devhub-wrap .box .widget-title {
     652        font-size: 16px;
     653        line-height: 26px;
     654        font-weight: bold;
     655        border-bottom: 1px solid #dfdfdf;
     656        margin-bottom: 10px;
     657        margin-bottom: 1rem;
     658}
     659 No newline at end of file

  • wp-content/themes/wporg-developer/front-page.php 

    IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
     
    33<div class="pagebody">
    44        <div class="wrapper">
    55
    6                 <div style="margin: 3em 0 1em; color: #666; text-transform: uppercase; font-size: 15px; text-align: center">(As announced at WordCamp San Francisco 2013)</div>
    7                 <div style="margin: 1em 0 3em; font-size: 16px; text-align: center">Coming soon. In the meantime, <a href="http://codex.wordpress.org/">the Codex</a> is still pretty great.</div>
     6                <div class="reference-landing">
     7
     8                        <div class="search-guide section clear">
     9                                <h3><?php _e( 'Find what you need:', 'wporg' ); ?></h3>
     10                                <?php get_search_form(); ?>
     11                        </div><!-- /search-guide -->
     12
     13                        <div class="topic-guide section">
     14                                <h4><?php _e( 'Or browse through topics:', 'wporg' ); ?></h4>
     15                                <ul class="unordered-list horizontal-list no-bullets">
     16                                        <li><a href="#"><?php _e( 'Functions', 'wporg' ); // TODO archive links ?></a></li>
     17                                        <li><a href="#"><?php _e( 'Hooks', 'wporg' ); ?></a></li>
     18                                        <li><a href="#"><?php _e( 'Classes', 'wporg' ); ?></a></li>
     19                                </ul>
     20                        </div><!-- /topic-guide -->
     21
     22                        <div class="new-in-guide section clear">
     23                                <div class="widget box box-left">
     24                                        <h3 class="widget-title"><?php printf( __( 'New in %s:', 'wporg' ), '3.7' ); // TODO current version ?></h3>
     25                                        <ul class="unordered-list no-bullets">
     26                                                <?php
     27
     28                                                // TODO version query
     29                                                $list = new WP_Query( array(
     30                                                        'posts_per_page' => 10,
     31                                                        'post_type'      => 'wpapi-function',
     32                                                        'orderby'        => 'title',
     33                                                        'order'          => 'ASC',
     34                                                ) );
     35
     36                                                while ( $list->have_posts() ) : $list->the_post();
     37
     38                                                        echo '<li><a href="' . get_permalink() . '">' . get_the_title() . '</a></li>';
     39
     40                                                endwhile;
     41                                                ?>
     42                                        </ul>
     43                                </div>
     44                                <div class="widget box box-right">
     45                                        <h3 class="widget-title"><?php _e( 'APIs', 'wporg' ); ?></h3>
     46                                        <ul class="unordered-list no-bullets">
     47                                                <li><a href="#">Some API</a></li>
     48                                                <li><a href="#">Some other API</a></li>
     49                                                <li><a href="#">Another new API</a></li>
     50                                        </ul>
     51                                </div>
     52                        </div><!-- /new-in-guide -->
     53
     54                </div><!-- /reference-landing -->
    855
    956        </div><!-- /wrapper -->
    1057</div><!-- /pagebody -->

  • wp-content/themes/wporg-developer/footer.php 

    IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
     
    11</div> <!-- /#wrapper -->
    22
     3</div><!-- /devhub-wrap -->
    34<?php
    45require WPORGPATH . 'footer.php';
    56

  • wp-content/themes/wporg-developer/header.php 

    IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
     
    44wp_enqueue_style( 'wporg-developer', get_bloginfo( 'stylesheet_url' ), array(), 1, 'screen' );
    55require WPORGPATH . 'header.php';
    66?>
     7<div class="devhub-wrap">
     8
    79<div id="headline">
    810        <div class="wrapper">
    911                <h2><a href="<?php echo home_url( '/' ); ?>"><?php bloginfo( 'name' ); ?></a></h2>