WordPress.org
Get WordPress

Making WordPress.org

Ticket #974: 974.3.patch

File 974.3.patch, 12.2 KB (added by BrashRebel, 9 years ago)

Fixed some CSS issues in the header, sidebar, upload page and featured video section.

  • sidebar.php 

    IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
     
    11<div class="secondary-content">
    22        <ul>
    3                 <li>
     3                <li class="widget">
    44                        <h3><?php esc_html_e( 'Resources', 'wptv' ); ?></h3>
    55
    66                        <ul>
    … …  
    88                        </ul>
    99                </li>
    1010        <ul/>
    11 </div><!-- .secondary_content -->
    12  No newline at end of file
     11</div><!-- .secondary_content -->

  • style.css 

    IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
     
    242242
    243243#header {
    244244        margin-top: 10px;
    245         height: 57px;
    246245}
    247246
    248247#header h1 {
    … …  
    251250}
    252251
    253252#header .sleeve {
    254         width: 942px;
     253        max-width: 942px;
    255254        margin: 0 auto;
    256255}
    257256
     257.menu-toggle {
     258        display: none;
     259        margin: 0 auto;
     260}
     261
     262#menu {
     263        clear: both;
     264}
     265
    258266#menu ul {
    259267        float: right;
    260268        height: 57px;;
    … …  
    286294        color: #000 !important;
    287295}
    288296
    289 #searchform {
    290         float: right;
    291         margin-left: 15px;
    292 }
    293 
    294297#searchform #searchbox,
    295298#searchform input#s {
    296299        box-sizing: content-box;
    … …  
    322325        box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
    323326}
    324327
     328/* Forms */
     329
    325330input[type=submit], button, .button {
    326331        text-decoration: none;
    327332        -moz-border-radius: 5px;
    … …  
    396401        );
    397402}
    398403
     404/* Intro */
     405
    399406.intro {
    400407        font-size: 30px;
    401408        height: 64px;
    … …  
    14641471        display: none;
    14651472}
    14661473
    1467 #content {
    1468         width: 630px;
    1469         float: left;
    1470 }
    1471 
    14721474#content .post {
    14731475        margin-bottom: 20px;
    14741476        clear: both;
    … …  
    15511553}
    15521554
    15531555#commentform textarea {
    1554         width: 600px;
     1556        width: 96%;
    15551557        height: 100px;
    15561558        margin-bottom: 5px;
    15571559}
    … …  
    17671769}
    17681770
    17691771.container {
    1770         width: 940px;
     1772        max-width: 940px;
    17711773        margin: auto;
    17721774}
    17731775
    17741776.primary-content {
    1775         float: left;
    1776         width: 700px;
    17771777        margin: 0;
    17781778}
    17791779
    17801780.secondary-content {
    1781         float: right;
    1782         width: 170px;
    1783         margin: 0 0 50px 0;
     1781        margin: 0 30px;
    17841782}
    17851783
    17861784.tag-count {
    … …  
    18491847
    18501848/* Menu */
    18511849
    1852 #menu {
    1853         margin-right: 5px;
    1854 }
    1855 
    18561850#menu li {
    18571851        font-size: 14px;
    18581852}
    … …  
    18951889}
    18961890
    18971891.page-title {
    1898         width: 940px;
     1892        max-width: 940px;
    18991893        margin: auto;
    19001894}
    19011895
    … …  
    19891983.wptv-hero {
    19901984        clear: both;
    19911985
    1992         margin: 10px auto 30px auto;
     1986        margin: 20px auto 30px auto;
    19931987        padding: 30px 0 10px 0;
    19941988
    19951989        background: #F0F0F0;
    … …  
    19981992.wptv-hero .main-video {
    19991993        background: #2f2f2f;
    20001994        clear: both;
    2001 
    2002         float: left;
    2003         width: 575px;
    20041995}
    20051996
    20061997.wptv-hero .main-video .video-player {
    20071998        width: 100% !important;
    2008         height: 323px !important;
    20091999        margin: 0 !important;
    20102000}
    20112001
    … …  
    20222012}
    20232013
    20242014.wptv-hero .main-video .video-player .videopress-title,
    2025 .wptv-hero .main-video .video-player .videopress-watemark {
     2015.wptv-hero .main-video .video-player .videopress-watermark {
    20262016        display: none !important;
    20272017}
    20282018
    … …  
    20622052        display: none;
    20632053}
    20642054
    2065 .wptv-hero .secondary-videos {
    2066         float: right;
    2067         width: 345px;
    2068 }
    2069 
    20702055.wptv-hero .secondary-videos h3 {
    20712056        font-size: 18px;
    20722057        font-weight: bold;
    … …  
    20792064.wptv-hero .secondary-videos li {
    20802065        font-size: 13px;
    20812066
    2082         min-height: 75px;
     2067        min-height: 78px;
    20832068        position: relative;
    20842069
    20852070        margin: 0 auto 23px 0;
    2086         padding: 0 0 0 142px;
     2071        padding: 0 0 0 142px;   /* todo pushes title outside container at 450px wide */
    20872072}
    20882073
    20892074.wptv-hero .secondary-videos .video-thumbnail img {
    … …  
    21062091}
    21072092
    21082093.video-list li {
    2109         float: left;
    2110         min-height: 220px;
    21112094        margin-bottom: 20px;
    21122095}
    21132096
    21142097.video-list li .video-thumbnail {
    21152098        display: block;
    21162099        width: 100%;
    2117         height: 100px;
    21182100
    21192101        margin: 0 0 8px 0;
    21202102
    … …  
    21272109        min-height: 100px;
    21282110}
    21292111
    2130 .video-list.four-col {
    2131         width: 860px;
    2132 }
    2133 
    2134 .video-list.four-col li {
    2135         width: 160px;
    2136         margin-right: 20px;
    2137 }
    2138 
    21392112.secondary-content .video-list .video-title {
    21402113        font-size: 13px;
    21412114        display: block;
    … …  
    21702143        position: relative;
    21712144}
    21722145
    2173 .archive.video-list .video-thumbnail {
    2174         position: absolute;
    2175         top: 0;
    2176         left: 0;
    2177 
    2178         width: 220px;
    2179         height: 120px;
    2180 
    2181         margin: 0 20px 0 0;
    2182 }
    2183 
    21842146.archive.video-list .video-title {
    21852147        font-size: 16px;
    21862148        margin: 4px 0 8px;
    21872149}
    21882150
    2189 .archive.video-list .video-description {
    2190         display: block;
    2191         padding-left: 240px;
    2192 }
    2193 
    21942151.archive.video-list .video-date {
    21952152        color: #aaa;
    21962153        display: block;
    … …  
    22472204}
    22482205
    22492206/* Video Player and Placeholder */
    2250 
    2251 .single .video-player {
    2252         float: left;
    2253         width: 940px !important;
    2254         height: 529px !important;
    2255 
    2256         overflow: hidden;
    2257 }
    2258 
    22592207.videopress-placeholder,
    22602208.video-player object {
    22612209        width: 100% !important;
    … …  
    23962344        margin: 3px 0 20px 0;
    23972345}
    23982346
    2399 .category-wordcamptv .secondary-content {
    2400         float: left;
    2401         width: 170px;
    2402 }
    2403 
    2404 .category-wordcamptv .primary-content {
    2405         float: right;
    2406         margin: 0;
    2407 }
    2408 
    24092347/* WordCamp Individual Page
    24102348============================================================= */
    24112349
    … …  
    24432381============================================================= */
    24442382
    24452383.error404 .primary-content {
    2446         width: 940px;
     2384        max-width: 940px;
    24472385}
    24482386
    24492387.error404 h2 {
    … …  
    24822420        clear: both;
    24832421        color: #888;
    24842422        height: 3.5em;
    2485         margin: 10px 0 15px 0;
     2423        margin: 10px 0 0 0;
    24862424        padding: 10px 0;
    24872425}
    24882426
    … …  
    25422480
    25432481#footer img.videopress {
    25442482        display: inline;
     2483}
     2484
     2485/* Media Queries
     2486============================================================= */
     2487
     2488@media screen and ( min-width:941px ) {
     2489        .wptv-hero .main-video {
     2490                width: 575px;
     2491        }
     2492
     2493        .wptv-hero .main-video .video-player {
     2494                height: 323px !important;
     2495        }
     2496
     2497        .primary-content {
     2498                float: left;
     2499                max-width: 700px;
     2500        }
     2501
     2502        .secondary-content {
     2503                float: right;
     2504                width: 170px;
     2505                margin: 0 0 50px 0;
     2506        }
     2507
     2508        .container {
     2509                overflow: hidden;
     2510        }
     2511
     2512        .category-wordcamptv .secondary-content {
     2513                float: left;
     2514                width: 170px;
     2515        }
     2516
     2517        .category-wordcamptv .primary-content {
     2518                float: right;
     2519                margin: 0;
     2520        }
     2521
     2522        .video-list.four-col {
     2523                width: 860px;
     2524        }
     2525
     2526        .wptv-hero .main-video {
     2527                float: left;
     2528        }
     2529
     2530        .wptv-hero .secondary-videos {
     2531                float: right;
     2532                width: 345px;
     2533        }
     2534
     2535        .single .video-player {
     2536                float: left;
     2537                width: 940px !important;
     2538                height: 529px !important;
     2539                overflow: hidden;
     2540        }
     2541}
     2542
     2543@media screen and ( max-width:940px ) {
     2544        #header {
     2545                padding: 0 30px;
     2546        }
     2547
     2548        .category .page-title,
     2549        .desc {
     2550                float: none;
     2551        }
     2552
     2553        .wptv-hero .main-video .video-player {
     2554                /*height: auto !important;*/
     2555
     2556                /* todo when video starts playing, it dissappears */
     2557                /* todo watermark is creating empty space */
     2558        }
     2559
     2560        .primary-content {
     2561                padding: 0 30px;
     2562        }
     2563
     2564        .wptv-hero {
     2565                padding: 30px 30px 10px;
     2566        }
     2567
     2568        .wptv-hero .secondary-videos {
     2569                margin-top: 20px;
     2570        }
     2571
     2572        .wptv-hero .secondary-videos li {
     2573                display: inline-block;
     2574                width: 150px;
     2575                vertical-align: top;
     2576                padding-right: 20px;
     2577        }
     2578
     2579        .secondary-content {
     2580                clear: both;
     2581        }
     2582
     2583        .secondary-content li.widget {
     2584                width: 45%;
     2585                display: inline-block;
     2586                vertical-align: top;
     2587                margin-right: -6px;     /* http://css-tricks.com/fighting-the-space-between-inline-block-elements/ */
     2588                padding-right: 30px;
     2589        }
     2590
     2591                .secondary-content li.widget:nth-child( even ) {
     2592                        margin-right: 0;
     2593                        padding-right: 0;
     2594                }
     2595}
     2596
     2597@media screen and ( min-width:921px ) {
     2598        #footer {
     2599                clear: both;
     2600                height: 3.5em;
     2601
     2602        }
     2603
     2604        .automattic {
     2605                width: 380px;
     2606                float: right;
     2607                text-align: right;
     2608        }
     2609}
     2610
     2611@media screen and ( max-width:920px ) {
     2612        .menu-footer-container {
     2613                float: none;
     2614                text-align: center;
     2615        }
     2616
     2617        .automattic {
     2618                width: 100%;
     2619                clear: both;
     2620                text-align: center;
     2621        }
     2622}
     2623
     2624@media screen and ( max-width: 700px ) {
     2625        .wptv-hero .secondary-videos li {
     2626                display: block;
     2627                width: auto;
     2628                padding-right: 0;
     2629        }
     2630}
     2631
     2632@media screen and ( min-width:621px ) {
     2633        .menu-footer-container li {
     2634                display: inline-block;
     2635        }
     2636}
     2637
     2638@media screen and ( max-width:620px ) {
     2639        .dot {
     2640                display: none;
     2641        }
     2642}
     2643
     2644@media screen and ( min-width:620px ) and ( max-width:940px ) {
     2645
     2646}
     2647
     2648@media screen and ( min-width:601px ) {
     2649        #header {
     2650                height: 57px;
     2651        }
     2652}
     2653
     2654@media screen and ( max-width:600px ) {
     2655        /* Menu */
     2656        .menu-toggle {
     2657                display: block;
     2658        }
     2659
     2660        .menu-primary-container {
     2661                display: none;
     2662                margin-top: 20px;
     2663        }
     2664
     2665        #menu.toggled .menu-primary-container {
     2666                display: block;
     2667        }
     2668
     2669        #menu {
     2670                text-align: center;
     2671                padding: 10px 0;
     2672        }
     2673
     2674        #menu ul {
     2675                float: none;
     2676                height: auto;
     2677                margin-left: -30px;     /* offset margins on #header, to achieve 100% viewport width */
     2678                margin-right: -30px;
     2679                background-color: #2698CF;
     2680                text-align: center;
     2681        }
     2682
     2683        #menu li {
     2684                float: none;
     2685                margin-left: 0;
     2686                padding: 10px 0 8px;
     2687                line-height: 2em;
     2688                border-bottom: 1px solid white;
     2689        }
     2690
     2691        #menu li:last-child {
     2692                border-bottom: none;
     2693        }
     2694
     2695        #menu li a,
     2696        #menu li a:link,
     2697        #menu li a:visited {
     2698                color: white;
     2699        }
     2700
     2701        #menu .current-menu-item > a,
     2702        #menu .current-menu-ancestor > a,
     2703        #menu .current_page_item > a,
     2704        #menu .current_page_ancestor > a {
     2705                color: white !important;
     2706        }
     2707
     2708        /* Footer */
     2709        .menu-footer-container {
     2710                float: none;
     2711        }
     2712
     2713        #menu-footer {
     2714                text-align: center;
     2715        }
     2716
     2717        #menu-footer li {
     2718                display: block;
     2719        }
     2720}
     2721
     2722@media screen and ( min-width:621px ) {
     2723        .archive.video-list .video-thumbnail {
     2724                position: absolute;
     2725                top: 0;
     2726                left: 0;
     2727
     2728                width: 220px;
     2729                height: 120px;
     2730
     2731                margin: 0 20px 0 0;
     2732        }
     2733
     2734        .archive.video-list .video-description {
     2735                display: block;
     2736                padding-left: 240px;
     2737        }
     2738}
     2739
     2740@media screen and ( min-width:501px ) {
     2741        #searchform {
     2742                float: right;
     2743                margin-left: 15px;
     2744        }
     2745}
     2746
     2747@media screen and ( max-width: 500px ) {
     2748        .secondary-content li.widget {
     2749                width: auto;
     2750                display: block;
     2751                margin-right: 0;
     2752                padding-right: 0;
     2753                text-align: center;
     2754        }
     2755
     2756        #header h1 {
     2757                float: none;
     2758        }
     2759
     2760        #searchform {
     2761                width: 100%;
     2762                float: none;
     2763                margin-left: auto;
     2764        }
     2765
     2766        #searchform #searchbox,
     2767        #searchform input#s {
     2768                width: 71%;
     2769        }
     2770}
     2771
     2772@media screen and ( max-width:400px ) {
     2773
     2774        .entry .contact-form textarea {
     2775                width: 98%;
     2776        }
     2777}
     2778
     2779@media screen and ( min-width:395px ) {
     2780        .video-list li {
     2781                float: left;
     2782                min-height: 220px;
     2783        }
     2784
     2785        .video-list.four-col li {
     2786                width: 160px;
     2787                margin-right: 20px;
     2788        }
    25452789}

  • header.php 

    IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
     
    1414
    1515<head>
    1616        <meta charset="<?php bloginfo( 'charset' ); ?>">
     17        <meta name="viewport" content="width=device-width, initial-scale=1">
    1718        <title><?php wp_title( '|', true, 'right' ); ?></title>
    1819
    1920        <link rel="alternate" type="application/rss+xml" title="<?php esc_attr_e( 'WordPress.tv RSS Feed', 'wptv' ); ?>" href="https://wordpress.tv/feed/" />
    … …  
    4041                        </form>
    4142
    4243                        <div id="menu">
     44                                <button class="menu-toggle" aria-controls="primary-menu" aria-expanded="false"><?php esc_html_e( 'Menu', 'wptv' ); ?></button>
    4345                                <?php wp_nav_menu( array( 'theme_location' => 'primary' ) ); ?>
    4446                        </div>
    4547

  • anon-upload-template.php 

    IDEA additional info:
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP
<+>UTF-8
     
    2929                padding-top: 10px;
    3030        }
    3131
    32         .page-template-anon-upload-template-php #footer {
    33                 position: absolute;
    34                 bottom: 0;
    35                 right: 0;
    36                 left: 0;
    37         }
    38 
    39         .video-upload {
    40                 padding-bottom: 70px;
    41         }
    42 
    4332        .noscript-show p {
    4433                margin: 0 !important;
    4534        }
    … …  
    5140
    5241        .video-upload-left {
    5342                max-width: 550px;
     43                margin: 15px;
    5444        }
    5545
    5646        .video-upload-right {
    … …  
    5949                margin: -25px 0 25px;
    6050        }
    6151
     52        @media screen and ( max-width:920px ) {
     53                .video-upload-right {
     54                        float: none;
     55                        width: auto;
     56                        margin: 0 10px;
     57                }
     58        }
     59
    6260        .video-upload p {
    6361                margin: 16px 0;
    6462                overflow: auto;
    … …  
    7775                font-weight: bold;
    7876        }
    7977
     78        @media screen and ( max-width: 500px ) {
     79                .video-upload-left p > label,
     80                .video-upload-left div > label {
     81                        width: 100%;
     82                }
     83        }
     84
    8085        .video-upload-left p > label.wptv-video-wordcamp-cb {
    8186                display: inline;
    8287                float: none;
    … …  
    96101            color: #333;
    97102            background-color: #fff;
    98103            padding: 4px;
    99             width: 329px;
     104            width: 96%;
    100105                max-width: 329px;
    101106        }
    102107
    103108        .video-upload-left ul.cats-checkboxes {
    104                 margin-left: 130px;
    105109                height: 150px;
    106110                overflow: auto;
    107111        }