Making WordPress.org

Changeset 11802


Ignore:
Timestamp:
04/27/2022 08:15:15 AM (17 months ago)
Author:
dd32
Message:

Trac: Better styles for GitHub PRs section.

When multiple PRs are attached, the various datapoints are now better aligned, as it's a tabular display.
Mobile views are now better handled, as it wraps to two lines
The PR title is now dynamic in sizing, so more of the title will display if possible.

See #4917.
Fixes #6290.

Location:
sites/trunk
Files:
3 edited

Legend:

Unmodified
Added
Removed
  • sites/trunk/trac.wordpress.org/templates/site.html

    r11798 r11802  
    55
    66<?python
    7     scripts_version = '157'
     7    scripts_version = '158'
    88    project_slug = req.environ['HTTP_HOST'].split(':')[0].split('.')[0]
    99    wporg_endpoint = 'https://make.wordpress.org/' + project_slug + '/'
  • sites/trunk/wordpress.org/public_html/style/trac/wp-trac.css

    r11638 r11802  
    24512451#github-prs ul.pull-requests {
    24522452    border: 1px solid #ccc;
     2453    display: table;
     2454    margin: 0;
     2455    max-width: 56em;
    24532456    padding: 0 1em;
    2454     margin: 0;
    24552457    position: relative;
     2458    width: 100%;
    24562459}
    24572460#github-prs ul.pull-requests li {
    24582461    align-items: center;
    2459     display: flex;
     2462    display: table-row;
    24602463    justify-content: space-between;
    24612464    padding: 0;
    24622465}
    24632466#github-prs ul.pull-requests li div {
    2464     margin: 0.5em 0;
     2467    display: table-cell;
     2468    padding: 0.5em 0;
     2469}
     2470#github-prs ul.pull-requests li > div:first-of-type > a:first-of-type {
     2471    display: inline-block;
     2472    max-width: 20em;
     2473    overflow: hidden;
     2474    text-overflow: ellipsis;
     2475    vertical-align: text-bottom;
     2476    white-space: nowrap;
     2477}
     2478#github-prs ul.pull-requests li:not(.loading) > div:last-of-type {
     2479    text-align: right;
    24652480}
    24662481#github-prs .button {
     
    24792494    text-decoration: none;
    24802495}
    2481 @media screen and (max-width: 782px) {
     2496@media screen and (max-width: 820px) {
    24822497    #github-prs .button {
    24832498        line-height: 20px;
    24842499        margin-right: 0.3em;
    24852500    }
    2486     #github-prs li {
     2501    #github-prs ul.pull-requests {
    24872502        display: block;
     2503        width: auto;
     2504    }
     2505    #github-prs ul.pull-requests li {
     2506        display: flex;
     2507        flex-wrap: wrap;
     2508    }
     2509    #github-prs ul.pull-requests li > div:first-of-type {
     2510        width: 100%; /* force other items to wrap to second line. */
     2511    }
     2512    #github-prs ul.pull-requests li > div:first-of-type > a:first-of-type {
     2513        max-width: 70%;
     2514        margin-bottom: -1px;
    24882515    }
    24892516}
  • sites/trunk/wordpress.org/public_html/style/trac/wp-trac.js

    r11798 r11802  
    19301930                            'a',
    19311931                            { href: data.changes.html_url, title: data.title },
    1932                             '#' + data.number + ' ' +
    1933                                 ( data.title.length > 23 ? data.title.substr( 0, 20 ) + '...' : data.title )
     1932                            '#' + data.number + ' ' + data.title
    19341933                        ) +
    19351934                        ' by ' +
Note: See TracChangeset for help on using the changeset viewer.