WordPress.org

Make WordPress Core

Changeset 18342


Ignore:
Timestamp:
06/25/2011 08:24:07 PM (7 years ago)
Author:
azaozz
Message:

Twenty Eleven RTL update, props yoavf, fixes #17882

Location:
trunk/wp-content/themes/twentyeleven
Files:
2 added
4 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-content/themes/twentyeleven/colors/dark.css

    r18255 r18342  
    211211}
    212212
     213.rtl .entry-header .comments-link a {
     214    background-image: url(../images/comment-bubble-dark-rtl.png);
     215}
    213216/* Singular content styles for Posts and Pages */
    214217.singular .entry-title {
  • trunk/wp-content/themes/twentyeleven/inc/theme-options.php

    r18276 r18342  
    165165        'theme_layout' => 'content-sidebar',
    166166    );
     167
     168    if ( is_rtl() )
     169        $default_theme_options['theme_layout'] = 'sidebar-content';
    167170
    168171    return apply_filters( 'twentyeleven_default_theme_options', $default_theme_options );
     
    392395        $classes = array( 'one-column' );
    393396
    394     $classes[] = $current_layout;
     397    if ( 'content-sidebar' == $current_layout )
     398        $classes[] = 'right-sidebar';
     399    elseif ( 'sidebar-content' == $current_layout )
     400        $classes[] = 'left-sidebar';
     401    else
     402        $classes[] = $current_layout;
    395403
    396404    $classes = apply_filters( 'twentyeleven_layout_classes', $classes, $current_layout );
  • trunk/wp-content/themes/twentyeleven/rtl.css

    r17791 r18342  
    1010*/
    1111
    12 /* =Global
    13 ----------------------------------------------- */
    14 
    15 body {
    16     direction: rtl;
    17     unicode-bidi: embed;
    18 }
     12/* =Reset reset
     13----------------------------------------------- */
     14
    1915caption, th, td {
    2016    text-align: right;
    2117}
     18
     19/* =Structure
     20----------------------------------------------- */
     21
     22body {
     23    direction:rtl;
     24    unicode-bidi:embed;
     25}
     26
     27/* Showcase */
     28.page-template-showcase-php section.recent-posts {
     29    float: left;
     30    margin: 0 31% 0 0;
     31}
     32.page-template-showcase-php #main .widget-area {
     33    float: right;
     34    margin: 0 0 0 -22.15%;
     35}
     36
     37/* One column */
     38
     39.one-column article.feature-image.small .entry-summary a {
     40    left: auto;
     41    right: -9%;
     42}
     43
     44/* Simplify the pullquotes and pull styles */
     45.one-column.singular .entry-meta .edit-link a {
     46    right: 0px;
     47    left: auto;
     48}
     49/* Make sure we have room for our comment avatars */
     50.one-column .commentlist > li.comment {
     51    margin-left: 0;
     52    margin-right: 102px;
     53}
     54/* Make sure the logo and search form don't collide */
     55.one-column #branding #searchform {
     56    right: auto;
     57    left: 40px;
     58}
     59/* Talking avatars take up too much room at this size */
     60.one-column .commentlist > li.comment {
     61    margin-right: 0;
     62}
     63.one-column .commentlist > li.comment .comment-meta,
     64.one-column .commentlist > li.comment .comment-content {
     65    margin-right: 0;
     66    margin-left: 85px;
     67}
     68.one-column .commentlist .avatar {
     69    right: auto;
     70    left: 1.625em;
     71}
     72.one-column .commentlist .children .avatar {
     73    left: auto;
     74    right: 2.2em;
     75}
     76
     77/* =Global
     78----------------------------------------------- */
     79
     80/* Text elements */
     81p {
     82    margin-bottom: 1.625em;
     83}
    2284ul, ol {
    2385    margin: 0 2.5em 1.625em 0;
    2486}
     87.ltr ul, ol {
     88    margin: 0 0 1.625em  2.5em;
     89}
     90blockquote {
     91    font-family: Arial, sans-serif;
     92}
     93blockquote em, blockquote i, blockquote cite {
     94    font-style: normal;
     95}
     96
     97/* Forms */
    2598textarea {
     99    padding-left: 0;
    26100    padding-right: 3px;
    27     padding-left: 0;
    28 }
    29 
     101}
     102input#s {
     103    background-position: 97% 6px;
     104    padding: 4px 28px 4px 10px;
     105}
     106
     107/* Assistive text */
     108#access a.assistive-text:active,
     109#access a.assistive-text:focus {
     110    left: auto;
     111    right: 7.6%;
     112}
     113
     114/* =Header
     115----------------------------------------------- */
     116
     117#site-title {
     118    margin-right: 0;
     119    margin-left: 270px;
     120}
     121
     122#site-description {
     123    margin: 0 0 3.65625em 270px;
     124}
    30125
    31126/* =Menu
     
    38133    margin: 0 -0.8125em 0 0;
    39134    padding-right: 0;
    40     padding-left: 0;
    41135}
    42136#access li {
     
    45139#access ul ul {
    46140    float: right;
     141    left: auto;
    47142    right: 0;
    48143}
    49144#access ul ul ul {
     145    left: auto;
    50146    right: 100%;
    51147}
     
    53149/* Search Form */
    54150#branding #searchform {
     151    right: auto;
    55152    left: 7.6%;
    56153    text-align: left;
    57154}
    58 
    59155#branding #s {
    60156    float: left;
    61     padding: 4px 28px 4px 10px;
    62     width: 8%;
    63 }
    64 #branding #s:focus {
    65     width: 26%;
     157}
     158#branding .only-search + #access div {
     159    padding-right: 0;
     160    padding-left: 160px;
    66161}
    67162
     
    69164/* =Content
    70165----------------------------------------------- */
    71 
    72166.entry-title,
    73167.entry-header .entry-meta {
     168    padding-right: 0;
    74169    padding-left: 76px;
    75     padding-right: 0;
    76170}
    77171.entry-content td,
     
    80174}
    81175.page-link span {
     176    margin-right: 0;
    82177    margin-left: 6px;
    83     margin-right: auto;
    84178}
    85179.entry-meta .edit-link a {
    86180    float: left;
     181}
     182/* Images */
     183
     184.wp-caption .wp-caption-text,
     185.gallery-caption {
     186    font-family: Arial, sans-serif;
     187}
     188.wp-caption .wp-caption-text {
     189    padding: 10px 40px 5px 0px;
     190}
     191.wp-caption .wp-caption-text:before {
     192    margin-right: 0;
     193    margin-left: 5px;
     194    left: auto;
     195    right: 10px;
     196}
     197#content .gallery-columns-4 .gallery-item {
     198    padding-right:0;
     199    padding-left:2%;
    87200}
    88201
     
    93206#author-avatar {
    94207    float: right;
     208    margin-right: 0;
    95209    margin-left: -78px;
    96     margin-right: auto;
    97210}
    98211#author-description {
    99212    float: right;
     213    margin-left: 0;
    100214    margin-right: 108px;
    101     margin-left: auto;
    102 }
    103 
     215}
    104216/* Comments link */
    105217.entry-header .comments-link a {
     218    background-image: url(images/comment-bubble-rtl.png);
     219    right: auto;
    106220    left: 0;
    107     right: auto;
    108 }
    109 
    110 /* Singular content styles for Posts and Pages */
     221}
     222
     223/*
     224    Post Formats Headings
     225*/
    111226.singular .entry-title,
    112227.singular .entry-header .entry-meta {
    113228    padding-left: 0;
    114     padding-right: 0;
    115229}
    116230.singular .entry-header .entry-meta {
     231    left: auto;
    117232    right: 0;
    118233}
    119 .singular .pull.alignright {
    120     margin: 0 -22.25% 0 1.625em;
    121 }
    122 .singular .pull.alignleft {
    123     margin: 0 1.625em 0 -22.25%;
    124 }
    125234.singular .entry-meta .edit-link a {
     235    left: auto;
    126236    right: 50px;
    127     left: auto;
    128237}
    129238
     
    134243.format-gallery .gallery-thumb {
    135244    float: right;
    136     margin-left: 1.625em;
     245    margin: .375em 0 0 1.625em;
     246}
     247
     248
     249/* =Status
     250----------------------------------------------- */
     251
     252.format-status img.avatar {
     253    float: right;
     254    margin: 4px 0 2px 10px;
     255}
     256
     257
     258/* =Image
     259----------------------------------------------- */
     260
     261.indexed.format-image div.entry-meta {
     262    float: right;
     263}
     264/* =error404
     265----------------------
     266------------------------- */
     267.error404 #main .widget {
     268    float: right;
    137269    margin-right: auto;
    138 }
    139 
    140 
    141 /* =Status
    142 ----------------------------------------------- */
    143 
    144 .format-status img.avatar {
    145     float: right;
    146     margin: 4px 0 2px 10px;
    147 }
    148 
    149 
    150 /* =Quote
    151 ----------------------------------------------- */
    152 
    153 /* =Image
    154 ----------------------------------------------- */
    155 
    156 .format-image footer.entry-meta {
    157     margin-left: 2px;
    158     margin-right: auto;
    159 }
    160 .format-image div.entry-meta {
    161     float: right;
    162 }
    163 
    164 
    165 /* =error404
    166 ----------------------------------------------- */
    167 
    168 .error404 #main .widget {
    169     float: right;
    170270    margin-left: 3.7%;
    171     margin-right: auto;
    172 }
    173 
     271}
    174272.error404 #main .widget_archive {
    175273    margin-left: 0;
    176     margin-right: auto;
    177 }
    178 
     274}
    179275.error404 #main .widget_tag_cloud {
    180276    margin-left: 0;
    181     margin-right: auto;
    182 }
    183 
     277}
    184278
    185279/* =Showcase
    186280----------------------------------------------- */
    187281
    188 /* Intro */
    189282article.intro .edit-link a {
     283    right: auto;
    190284    left: 20px;
    191285}
     
    198292/* Small featured post */
    199293section.featured-post .attachment-small-feature {
    200     border-left: 20px solid #bbb;
    201294    float: left;
    202     margin: -10px 0 1.625em -8.9%;
    203     left: -35px;
    204     border-right: none;
     295    margin: 0 0 1.625em -8.9%;
     296    right: auto;
     297    left: -15px;
    205298}
    206299article.feature-image.small {
     
    208301}
    209302article.feature-image.small .entry-summary p a {
     303    left:auto;
    210304    right: -23.8%;
    211     padding: 4px 85px 4px 26px;
     305    padding: 9px 85px 9px 26px;
    212306}
    213307
    214308/* Large featured post */
    215309section.feature-image.large .hentry {
     310    left:auto;
    216311    right: 9%;
    217312    margin: 1.625em 0 0 9%;
    218313}
    219 
    220314/* Featured Slider */
    221315.featured-posts .showcase-heading {
     316    padding-left: 0;
    222317    padding-right: 8.9%;
    223     padding-left: 0;
    224318}
    225319.featured-posts section.featured-post {
     320    left: auto;
    226321    right: 0;
    227322}
    228323#content .feature-slider {
    229     right: 8.9%;
     324    right: auto;
     325    left: 8.9%;
    230326}
    231327.feature-slider li {
    232328    float: right;
    233329}
    234 
    235330/* Recent Posts */
    236331section.recent-posts .other-recent-posts a[rel="bookmark"] {
     
    244339}
    245340
    246 
    247 /* =Images
    248 ----------------------------------------------- */
    249 
    250 .wp-caption .wp-caption-text {
    251     padding: 10px 40px 5px 0px;
    252 }
    253 .wp-caption .wp-caption-text:before {
    254     margin-left: 5px;
    255     right: 10px;
    256     margin-right: auto;
    257 }
    258 
     341/* =Attachments
     342----------------------------------------------- */
    259343
    260344/* =Navigation
     
    271355/* Singular navigation */
    272356#nav-single {
     357    right: auto;
    273358    left: 0;
    274     right: auto;
    275359}
    276360#nav-single .nav-next {
     361    padding-left: 0;
    277362    padding-right: .5em;
    278     padding-left: 0;
    279363}
    280364
     
    284368
    285369.widget ul ul {
     370    margin-left: 0;
    286371    margin-right: 1.5em;
    287     margin-left: auto;
    288372}
    289373
    290374/* Twitter */
    291375.widget_twitter .timesince {
     376    margin-right: 0;
    292377    margin-left: -10px;
    293378    text-align: left;
    294     margin-right: auto;
    295 }
    296 
     379}
    297380
    298381/* =Comments
     
    300383
    301384.commentlist .children li.comment {
     385    border-left: none;
    302386    border-right: 1px solid #ddd;
    303     -moz-border-radius: 3px 0 0 3px;
     387    -moz-border-radius: 3px 0  0 3px;
    304388    border-radius: 3px 0 0 3px;
    305     border-left: none;
    306389}
    307390.commentlist .children li.comment .comment-meta {
     391    margin-left: 0;
    308392    margin-right: 50px;
    309     margin-left: auto;
    310393}
    311394.commentlist .avatar {
     395    left: auto;
    312396    right: -102px;
    313397}
    314398.commentlist > li:before {
    315399    content: url(images/comment-arrow-rtl.png);
     400    left:auto;
    316401    right: -21px;
    317402}
     403.commentlist > li.pingback:before {
     404    content: '';
     405}
     406.commentlist .children .avatar {
     407    left: auto;
     408    right: 2.2em;
     409}
     410
     411/* Post author highlighting */
    318412.commentlist > li.bypostauthor:before {
    319413    content: url(images/comment-arrow-bypostauthor-rtl.png);
    320414}
    321 .commentlist .children .avatar {
    322     right: 2.2em;
     415
     416/* sidebar-page.php comments */
     417/* Make sure we have room for our comment avatars */
     418.page-template-sidebar-page-php .commentlist > li.comment,
     419.page-template-sidebar-page-php.commentlist .pingback {
     420    margin-left: 0;
     421    margin-right: 102px;
    323422}
    324423
     
    328427#respond .comment-form-url label,
    329428#respond .comment-form-comment label {
     429    left: auto;
    330430    right: 4px;
     431}
     432#respond .comment-form-author label,
     433#respond .comment-form-email label,
     434#respond .comment-form-url label,
     435#respond .comment-form-comment label {
     436    -webkit-box-shadow: -1px 2px 2px rgba(204,204,204,0.8);
     437    -moz-box-shadow: -1px 2px 2px rgba(204,204,204,0.8);
     438    box-shadow: -1px 2px 2px rgba(204,204,204,0.8);
    331439}
    332440#respond .comment-form-author .required,
    333441#respond .comment-form-email .required {
    334     right: 68%;
     442    left: auto;
     443    right: 75%;
    335444}
    336445#respond .form-submit {
     
    338447}
    339448#respond input#submit {
     449    left: auto;
    340450    right: 30px;
    341451    padding: 5px 22px 5px 42px;
    342452}
    343453#respond #cancel-comment-reply-link {
     454    margin-left: 0;
    344455    margin-right: 10px;
    345     margin-left: auto;
    346456}
    347457#cancel-comment-reply-link {
     458    right: auto;
    348459    left: 1.625em;
    349460}
    350 
    351461
    352462/* =Footer
     
    356466#supplementary.two .widget-area {
    357467    float: right;
     468    margin-right: 0;
    358469    margin-left: 3.7%;
    359     margin-right: auto;
    360470}
    361471#supplementary.two .widget-area + .widget-area {
    362472    margin-left: 0;
    363     margin-right: auto;
    364473}
    365474
     
    367476#supplementary.three .widget-area {
    368477    float: right;
     478    margin-right: 0;
    369479    margin-left: 3.7%;
    370     margin-right: auto;
    371480}
    372481#supplementary.three .widget-area + .widget-area + .widget-area {
    373482    margin-left: 0;
    374     margin-right: auto;
    375 }
    376 
    377 /* Simplify the showcase template when small feature */
     483}
     484
     485/* Site Generator Line */
     486#site-generator .sep {
     487    background-position: right center;
     488}
     489
     490
     491/* =Responsive Structure
     492----------------------------------------------- */
     493
     494@media (max-width: 800px) {
     495    /* Simplify the showcase template when small feature */
    378496    section.featured-post .attachment-small-feature,
    379497    .one-column section.featured-post .attachment-small-feature {
    380     float: right;
    381 }
    382 article.feature-image.small {
    383     float: left;
    384 }
    385 article.feature-image.small .entry-summary a {
    386     right: -9%;
    387 }
    388 
    389 
    390 /* =Responsive Structure
    391 ----------------------------------------------- */
    392 
    393 @media (max-width: 800px) {
    394 
    395     /* Three Footer Widget Areas */
    396     #supplementary.three .widget-area {
    397         float: right;
    398         margin-left: 3.7%;
    399         margin-right: auto;
    400     }
    401     #supplementary.three .widget-area + .widget-area + .widget-area {
    402         margin-left: 0;
    403         margin-right: auto;
    404     }
    405 
    406     /* Simplify the showcase template when small feature */
    407         section.featured-post .attachment-small-feature,
    408         .one-column section.featured-post .attachment-small-feature {
    409498        float: right;
    410499    }
     
    412501        float: left;
    413502    }
    414     article.feature-image.small .entry-summary a {
    415         right: -9%;
    416     }
    417 
    418     /* Make sure the logo and search form don't collide */
    419         #branding #searchform {
    420         left: 1px;
    421     }
    422 }
    423 
    424 @media (max-width: 800px) {
    425 
    426     /* Three Footer Widget Areas */
    427     #supplementary.three .widget-area {
    428         float: right;
    429         margin-left: 3.7%;
    430         margin-right: auto;
    431     }
    432     #supplementary.three .widget-area + .widget-area + .widget-area {
     503    article.feature-image.small .entry-summary p a {
     504        right: 0;
     505    }
     506    .singular .entry-meta .edit-link a {
     507        left: auto;
     508        right: 0px;
     509    }
     510    /* Make sure we have room for our comment avatars */
     511    .commentlist > li.comment,
     512    .commentlist .pingback {
    433513        margin-left: 0;
    434         margin-right: auto;
    435     }
    436 
    437     /* Simplify the showcase template when small feature */
    438         section.featured-post .attachment-small-feature,
    439         .one-column section.featured-post .attachment-small-feature {
    440         float: right;
    441     }
    442     article.feature-image.small {
    443         float: left;
    444     }
    445     article.feature-image.small .entry-summary a {
    446         right: -9%;
    447         right: auto;
    448     }
    449 
    450     /* Make sure the logo and search form don't collide */
    451     #branding #searchform {
    452     left: 1px;
    453     }
    454 }
    455 
    456 @media only screen and (min-device-width: 320px) and (max-device-width: 480px) {
    457     #primary {
    458         float: right;
    459     }
    460     .commentlist .avatar {
     514        margin-right: 102px;
     515    }
     516    /* No need to float footer widgets at this size */
     517    #colophon #supplementary .widget-area {
     518        margin-left: 0;
     519    }
     520    /* No need to float 404 widgets at this size */
     521    .error404 #main .widget {
     522        margin-left: 0;
     523    }
     524}
     525@media (max-width: 650px) {
     526    /* @media (max-width: 650px) Reduce font-sizes for better readability on smaller devices */
     527    #site-title,
     528    #site-description {
     529        margin-left: 0;
     530    }
     531    /* Talking avatars take up too much room at this size */
     532    .commentlist > li.comment,
     533    .commentlist > li.pingback {
     534        margin-right: 0 !important;
     535    }
     536    .commentlist .children .avatar {
     537        left: auto;
    461538        right: 2.2em;
    462539    }
    463 }
    464 
     540    /* Use the available space in the smaller comment form */
     541    #respond .comment-form-author .required,
     542    #respond .comment-form-email .required {
     543        left: auto;
     544        right: 95%;
     545    }
     546    #content .gallery-columns-3 .gallery-item {
     547        padding-right: 0;
     548        padding-left:2%;
     549    }
     550}
     551@media (max-width: 450px) {
     552    #content .gallery-columns-2 .gallery-item {
     553        padding-right:0;
     554        padding-left:4%;
     555    }
     556}
    465557
    466558/* =Print
     
    469561@media print {
    470562    #primary {
    471         float: right;
    472     }
    473 
     563        float: right;
     564    }
    474565    /* Comments */
    475566    .commentlist .avatar {
    476         right: 2.2em;
    477     }
    478 }
    479 
     567        left: auto;
     568        right: 2.2em;
     569    }
     570    .commentlist li.comment .comment-meta {
     571        margin-left: 0;
     572        margin-right: 50px;
     573    }
     574}
    480575
    481576/* =IE7
    482577----------------------------------------------- */
    483578
    484 #ie7 article.intro {
    485     margin-right: -7.6%;
    486     margin-left: -7.6%;
    487     padding-right: -7.6%;
    488     padding-left: -7.6%;
    489 }
    490 
    491 #ie7 section.featured-post {
    492     margin-right: -7.6%;
    493     margin-left: -7.6%;
    494 }
    495 
    496579#ie7 section.recent-posts {
     580    margin-right: 0;
    497581    margin-left: 7.6%;
    498     margin-right: auto;
    499 }
     582}
  • trunk/wp-content/themes/twentyeleven/style.css

    r18336 r18342  
    102102}
    103103.singular #content,
    104 .sidebar-content.singular #content {
     104.left-sidebar.singular #content {
    105105    margin: 0 7.6%;
    106106    position: relative;
     
    127127/* Showcase */
    128128.page-template-showcase-php #primary,
    129 .sidebar-content.page-template-showcase-php #primary {
     129.left-sidebar.page-template-showcase-php #primary {
    130130    margin: 0;
    131131}
    132132.page-template-showcase-php #content,
    133 .sidebar-content.page-template-showcase-php #content {
     133.left-sidebar.page-template-showcase-php #content {
    134134    margin: 0 7.6%;
    135135    width: auto;
     
    175175
    176176/* Right Content */
    177 .sidebar-content #primary {
     177.left-sidebar #primary {
    178178    float: right;
    179179    margin: 0 0 0 -26.4%;
    180180    width: 100%;
    181181}
    182 .sidebar-content #content {
     182.left-sidebar #content {
    183183    margin: 0 7.6% 0 34%;
    184184    width: 58.4%;
    185185}
    186 .sidebar-content #secondary {
     186.left-sidebar #secondary {
    187187    float: left;
    188188    margin-left: 7.6%;
     
    20442044    z-index: 1;
    20452045}
    2046 .rtl #respond .comment-form-author label,
    2047 .rtl #respond .comment-form-email label,
    2048 .rtl #respond .comment-form-url label,
    2049 .rtl #respond .comment-form-comment label {
    2050     -webkit-box-shadow: -1px 2px 2px rgba(204,204,204,0.8);
    2051     -moz-box-shadow: -1px 2px 2px rgba(204,204,204,0.8);
    2052     box-shadow: -1px 2px 2px rgba(204,204,204,0.8);
    2053 }
    20542046#respond input[type="text"]:focus,
    20552047#respond textarea:focus {
Note: See TracChangeset for help on using the changeset viewer.