Changeset 249506 in webkit


Ignore:
Timestamp:
Sep 4, 2019 5:47:32 PM (5 years ago)
Author:
Jonathan Bedard
Message:

results.webkit.org: Fix mobile vs desktop mode
​https://bugs.webkit.org/show_bug.cgi?id=201441

Rubber-stamped by Aakash Jain.

We should unconditionally use desktop mode if the device screen-width
is large enough.

  • resultsdbpy/resultsdbpy/view/static/library/css/webkit.css:
Location:
trunk/Tools
Files:
2 edited

Legend:

Unmodified
Added
Removed

  • trunk/Tools/ChangeLog

    r249500 r249506  
     12019-09-04  Jonathan Bedard  <jbedard@apple.com>
     2
     3        results.webkit.org: Fix mobile vs desktop mode
     4        https://bugs.webkit.org/show_bug.cgi?id=201441
     5
     6        Rubber-stamped by Aakash Jain.
     7
     8        We should unconditionally use desktop mode if the device screen-width
     9        is large enough.
     10
     11        * resultsdbpy/resultsdbpy/view/static/library/css/webkit.css:
     12
    1132019-09-04  Jonathan Bedard  <jbedard@apple.com>
    214

  • trunk/Tools/resultsdbpy/resultsdbpy/view/static/library/css/webkit.css

    r249443 r249506  
    9696}
    9797
    98 @media screen and (min-width: 600px) and (orientation: landscape) {
     98@media screen and (min-width: 600px) {
    9999  :root {
    100100    --tinySize: 11px;
    … …  
    106106}
    107107
    108 @media screen and (min-width: 768px) and (orientation: landscape) {
     108@media screen and (min-width: 768px) {
    109109  :root {
    110110    --tinySize: 12px;
    … …  
    305305}
    306306
    307 @media screen and (min-width: 600px) and (orientation: landscape) {
    308   .header, .topbar {
    309     flex-direction: row;
    310   }
    311 
    312   .header>.actions, .topbar>.actions {
    313     border-top: none;
    314   }
    315 
    316   .header.fixed+.content, .topbar.fixed+.content {
    317     margin-top: 80px;
    318   }
    319 
    320   .header.fixed>.actions, .topbar.fixed>.actions {
    321     background: none;
    322   }
    323 }
    324 
    325 @media screen and (min-width: 768px) and (orientation: landscape) {
     307@media screen and (min-width: 600px) {
    326308  .header, .topbar {
    327309    flex-direction: row;
    … …  
    355337}
    356338
    357 @media screen and (min-width: 600px) and (orientation: landscape) {
     339@media screen and (min-width: 600px) {
    358340  .row {
    359341    display: flex;
    … …  
    410392}
    411393
    412 @media screen and (min-width: 768px) and (orientation: landscape) {
    413   /* For desktop: */
    414   .row {
    415     display: flex;
    416     flex-direction: row;
    417   }
    418 
    419   .col-1 {
    420     width: 8.33%;
    421   }
    422 
    423   .col-2 {
    424     width: 16.66%;
    425   }
    426 
    427   .col-3 {
    428     width: 25%;
    429   }
    430 
    431   .col-4 {
    432     width: 33.33%;
    433   }
    434 
    435   .col-5 {
    436     width: 41.66%;
    437   }
    438 
    439   .col-6 {
    440     width: 50%;
    441   }
    442 
    443   .col-7 {
    444     width: 58.33%;
    445   }
    446 
    447   .col-8 {
    448     width: 66.66%;
    449   }
    450 
    451   .col-9 {
    452     width: 75%;
    453   }
    454 
    455   .col-10 {
    456     width: 83.33%;
    457   }
    458 
    459   .col-11 {
    460     width: 91.66%;
    461   }
    462 
    463   .col-12 {
    464     width: 100%;
    465   }
    466 }
    467 
    468394.hide-for-xs {
    469395  display: none;
    … …  
    474400}
    475401
    476 @media screen and (min-width: 600px) and (orientation: landscape) {
     402@media screen and (min-width: 600px) {
    477403  .hide-for-xs {
    478404    display: block;
    … …  
    481407  .hide-for-s {
    482408    display: none;
    483   }
    484 }
    485 
    486 @media screen and (min-width: 768px) and (orientation: landscape) {
    487   .hide-for-s {
    488     display: block;
    489   }
    490 
    491   .hide-for-xs {
    492     display: block;
    493409  }
    494410}
    … …  
    879795}
    880796
    881 @media screen and (min-width: 600px) and (orientation: landscape) {
    882   .section>.header {
    883     flex-direction: row;
    884   }
    885 }
    886 
    887 @media screen and (min-width: 768px) and (orientation: landscape) {
     797@media screen and (min-width: 600px) {
    888798  .section>.header {
    889799    flex-direction: row;
    … …  
    979889}
    980890
    981 @media screen and (min-width: 600px) and (orientation: landscape) {
     891@media screen and (min-width: 600px) {
    982892  .sidebar {
    983893    display: block;
    … …  
    1028938}
    1029939
    1030 @media screen and (min-width: 768px) and (orientation: landscape) {
     940@media screen and (min-width: 768px) {
    1031941  .sidebar {
    1032942    display: block;
    … …  
    1049959  }
    1050960
     961  .mobile-sidebar-control.display {
     962    display: none;
     963  }
     964
    1051965  .main {
    1052966    margin-left: 310px;
    … …  
    1057971    margin-left: 0px;
    1058972    margin-right: 310px;
    1059   }
    1060 
    1061   .main.under-topbar-with-actions {
    1062     margin-top: calc(12px * 2  + var(--largeSize) * 1.3);
    1063973  }
    1064974}
    … …  
    16591569}
    16601570
    1661 @media screen and (min-width: 600px) and (orientation: landscape) {
    1662   .drawer.left.display, .drawer.right.display {
    1663     width: 20%;
    1664   }
    1665 
    1666   .drawer.left.under-topbar-with-actions, .drawer.right.under-topbar-with-actions {
    1667     height: calc(100% - 12px * 2  - var(--largeSize) * 1.3);
    1668   }
    1669 }
    1670 
    1671 @media screen and (min-width: 768px) and (orientation: landscape) {
     1571@media screen and (min-width: 600px) {
    16721572  .drawer.left.display, .drawer.right.display {
    16731573    width: 20%;
    … …  
    26642564}
    26652565
    2666 @media screen and (min-width: 600px) and (orientation: landscape) {
     2566@media screen and (min-width: 600px) {
    26672567  .desktop-control {
    26682568    display: block;
    26692569  }
    26702570}
     2571
Note: See TracChangeset for help on using the changeset viewer.