1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-22 14:52:41 +01:00

Simplify ".device-phone X, .device-tablet X { ... }" rules

Summary: Add a ".device" rule which means "phone or tablet". Simplify about 5000 rules which were written ".device-phone X, device-tablet X { ... }".

Test Plan: Browsed the site a bit without incident.

Reviewers: chad

Reviewed By: chad

CC: aran

Maniphest Tasks: T1960

Differential Revision: https://secure.phabricator.com/D4103
This commit is contained in:
epriestley 2012-12-07 13:37:10 -08:00
parent 8cff6ea9cb
commit 8bcdf42762
11 changed files with 51 additions and 98 deletions

View file

@ -287,10 +287,10 @@ final class PhabricatorStandardPageView extends PhabricatorBarePageView {
// Try to guess the device resolution based on UA strings to avoid a flash
// of incorrectly-styled content.
$device_guess = 'device-desktop';
if (preg_match('/iPhone|iPod/', $agent)) {
$device_guess = 'device-phone';
} else if (preg_match('/iPad/', $agent)) {
$device_guess = 'device-tablet';
if (preg_match('@iPhone|iPod|(Android.*Chrome/[.0-9]* Mobile)@', $agent)) {
$device_guess = 'device-phone device';
} else if (preg_match('@iPad|(Android.*Chrome/)@', $agent)) {
$device_guess = 'device-tablet device';
}
$classes = array(

View file

@ -32,8 +32,7 @@
background-image: url(/rsrc/image/menu_texture.png);
}
.device-tablet .phabricator-nav-local,
.device-phone .phabricator-nav-local {
.device .phabricator-nav-local {
display: none;
}
@ -58,8 +57,7 @@
background-repeat: no-repeat;
}
.device-tablet .phabricator-nav-drag,
.device-phone .phabricator-nav-drag {
.device .phabricator-nav-drag {
display: none;
}
@ -83,30 +81,25 @@
margin-left: 2.5em !important;
}
.device-tablet .phabricator-nav-col,
.device-phone .phabricator-nav-col {
.device .phabricator-nav-col {
position: absolute;
top: 0px;
}
.device-tablet .phabricator-nav-local,
.device-phone .phabricator-nav-local {
.device .phabricator-nav-local {
left: -300px;
}
.device-tablet .phabricator-nav,
.device-phone .phabricator-nav {
.device .phabricator-nav {
overflow-x: hidden;
position: relative;
}
.device-tablet .phabricator-nav-content,
.device-phone .phabricator-nav-content {
.device .phabricator-nav-content {
width: 100%;
}
.device-tablet .phabricator-nav-content,
.device-phone .phabricator-nav-content {
.device .phabricator-nav-content {
margin-left: 0;
position: relative;
}

View file

@ -44,6 +44,10 @@
background: 6px 9px url(/rsrc/image/header_logo.png) no-repeat;
}
.device .phabricator-main-menu-logo {
display: none;
}
/* - Expand/Collapse Button ----------------------------------------------------
On phones, the menu switches to a vertical layout and uses a button to expand
@ -85,8 +89,7 @@
display: none;
}
.device-tablet .phabricator-main-menu-expand-button,
.device-phone .phabricator-main-menu-expand-button {
.device .phabricator-main-menu-expand-button {
display: block;
}
@ -124,8 +127,7 @@
margin-left: -150px;
}
.device-tablet .phabricator-main-menu-search-target,
.device-phone .phabricator-main-menu-search-target {
.device .phabricator-main-menu-search-target {
width: 100%;
margin-left: -25px;
@ -135,8 +137,7 @@
margin: 0 8px 0 50px;
}
.device-tablet .phabricator-main-menu-search-container,
.device-phone .phabricator-main-menu-search-container {
.device .phabricator-main-menu-search-container {
margin: 0 18px 0 60px;
}
@ -235,8 +236,7 @@ a:hover .phabricator-main-search-typeahead-result .result-type {
display: inline-block;
}
.device-tablet .phabricator-main-menu-alerts,
.device-phone .phabricator-main-menu-alerts {
.device .phabricator-main-menu-alerts {
position: absolute;
left: 60px;
right: 60px;
@ -296,21 +296,17 @@ a:hover .phabricator-main-search-typeahead-result .result-type {
*/
.device-phone .phabricator-dark-menu,
.device-tablet .phabricator-dark-menu,
.device-phone .phabricator-dark-menu a.phabricator-menu-item-type-link,
.device-tablet .phabricator-dark-menu a.phabricator-menu-item-type-link {
.device .phabricator-dark-menu,
.device .phabricator-dark-menu a.phabricator-menu-item-type-link{
color: #ffffff;
}
.device-phone .phabricator-dark-menu .phabricator-menu-item-view,
.device-tablet .phabricator-dark-menu .phabricator-menu-item-view {
.device .phabricator-dark-menu .phabricator-menu-item-view {
display: block;
padding: 4px 0;
}
.device-phone .phabricator-dark-menu .phabricator-menu-item-type-label,
.device-tablet .phabricator-dark-menu .phabricator-menu-item-type-label {
.device .phabricator-dark-menu .phabricator-menu-item-type-label {
text-transform: uppercase;
font-size: 11px;
background-color: #151719;
@ -318,21 +314,17 @@ a:hover .phabricator-main-search-typeahead-result .result-type {
height: 24px;
}
.device-phone .phabricator-dark-menu .phabricator-menu-item-type-spacer,
.device-tablet .phabricator-dark-menu .phabricator-menu-item-type-spacer {
.device .phabricator-dark-menu .phabricator-menu-item-type-spacer {
display: none;
}
.device-phone .phabricator-dark-menu .phabricator-menu-item-type-label
.phabricator-menu-item-name,
.device-tablet .phabricator-dark-menu .phabricator-menu-item-type-label
.device .phabricator-dark-menu .phabricator-menu-item-type-label
.phabricator-menu-item-name {
display: block;
padding: 6px 0 0;
}
.device-phone .phabricator-dark-menu .phabricator-menu-item-type-link,
.device-tablet .phabricator-dark-menu .phabricator-menu-item-type-link {
.device .phabricator-dark-menu .phabricator-menu-item-type-link {
border-width: 1px 0;
border-style: solid;
border-color: #34373b transparent #282c2d;
@ -357,25 +349,20 @@ a:hover .phabricator-main-search-typeahead-result .result-type {
background-size: 26px 26px;
}
.device-phone .phabricator-core-menu,
.device-tablet .phabricator-core-menu {
.device .phabricator-core-menu {
display: none;
}
.device-phone .phabricator-core-menu-expanded .phabricator-core-menu,
.device-tablet .phabricator-core-menu-expanded .phabricator-core-menu {
.device .phabricator-core-menu-expanded .phabricator-core-menu {
display: block;
}
.device-phone .phabricator-core-menu .phabricator-menu-item-type-link,
.device-tablet .phabricator-core-menu .phabricator-menu-item-type-link {
.device .phabricator-core-menu .phabricator-menu-item-type-link {
font-size: 15px;
min-height: 30px;
}
.device-phone .phabricator-core-menu
.phabricator-menu-item-type-link .phabricator-menu-item-name,
.device-tablet .phabricator-core-menu
.device .phabricator-core-menu
.phabricator-menu-item-type-link .phabricator-menu-item-name {
margin-left: 40px;
line-height: 28px;
@ -409,8 +396,7 @@ a:hover .phabricator-main-search-typeahead-result .result-type {
left: 6px;
}
.device-phone .phabricator-core-menu-icon,
.device-tablet .phabricator-core-menu-icon {
.device .phabricator-core-menu-icon {
left: 6px;
}
@ -428,10 +414,7 @@ a:hover .phabricator-main-search-typeahead-result .result-type {
*/
.device-phone .phabricator-application-menu-expanded
.phabricator-application-menu,
.device-tablet .phabricator-application-menu-expanded
.phabricator-application-menu {
.device .phabricator-application-menu-expanded .phabricator-application-menu {
display: block;
padding-top: 44px;
}
@ -445,10 +428,7 @@ a:hover .phabricator-main-search-typeahead-result .result-type {
padding-left: 12px;
}
.device-phone .phabricator-application-menu-expanded
.phabricator-application-menu,
.device-tablet .phabricator-application-menu-expanded
.phabricator-application-menu {
.device .phabricator-application-menu-expanded .phabricator-application-menu {
display: block;
padding-top: 44px;
}

View file

@ -20,8 +20,7 @@
border-top-width: 0;
}
.device-tablet .phabricator-notification-menu,
.device-phone .phabricator-notification-menu {
.device .phabricator-notification-menu {
border-bottom: 1px solid #222222;
}

View file

@ -29,8 +29,7 @@
padding: 0px 8px 12px 8px;
}
.device-tablet .blog-post-list,
.device-phone .blog-post-list {
.device .blog-post-list {
float: none;
width: 90%;
margin: 16px auto;
@ -43,8 +42,7 @@
padding: 0px 16px 0px 16px;
}
.device-tablet .blog-post-list-full,
.device-phone .blog-post-list-full {
.device .blog-post-list-full {
float: none;
margin: 16px auto;
}
@ -56,8 +54,7 @@
margin: 16px 16px 16px 0px;
}
.device-tablet .blog-detail,
.device-phone .blog-detail {
.device .blog-detail {
float: none;
margin: 16px auto;
width: 90%;

View file

@ -20,8 +20,7 @@
box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.10);
}
.device-tablet .phabricator-action-list-view,
.device-phone .phabricator-action-list-view {
.device .phabricator-action-list-view {
background: #f3f3f3;
border-top: 1px solid #dcdcdc;
padding: .5em 0;

View file

@ -2,8 +2,7 @@
* @provides phabricator-crumbs-view-css
*/
.device-phone .phabricator-crumbs-view,
.device-tablet .phabricator-crumbs-view {
.device .phabricator-crumbs-view {
display: none;
}

View file

@ -14,8 +14,7 @@
}
.device-tablet .phabricator-form-view .aphront-form-control .aphront-form-label,
.device-phone .phabricator-form-view .aphront-form-control .aphront-form-label {
.device .phabricator-form-view .aphront-form-control .aphront-form-label {
display: block;
float: none;
text-align: left;
@ -23,10 +22,7 @@
padding: 0;
}
.device-tablet .phabricator-form-view .aphront-form-control
.aphront-form-caption,
.device-phone .phabricator-form-view .aphront-form-control
.aphront-form-caption {
.device .phabricator-form-view .aphront-form-control .aphront-form-caption {
display: block;
float: none;
text-align: left;
@ -34,10 +30,7 @@
padding: 0;
}
.device-tablet .phabricator-form-view .aphront-form-control
.aphront-form-input,
.device-phone .phabricator-form-view .aphront-form-control
.aphront-form-input {
.device .phabricator-form-view .aphront-form-control .aphront-form-input {
float: none;
display: block;
text-align: left;
@ -46,8 +39,7 @@
padding: 0;
}
.device-tablet .phabricator-form-view .aphront-form-control .aphront-form-error,
.device-phone .phabricator-form-view .aphront-form-control .aphront-form-error {
.device .phabricator-form-view .aphront-form-control .aphront-form-error {
float: none;
text-align: left;
display: block;

View file

@ -19,8 +19,7 @@
padding: 1em 0 0.5em;
}
.device-tablet .phabricator-property-list-container,
.device-phone .phabricator-property-list-container {
.device .phabricator-property-list-container {
padding: .5em 0;
}
@ -40,8 +39,7 @@
margin-bottom: .5em;
}
.device-tablet .phabricator-property-list-key,
.device-phone .phabricator-property-list-key {
.device .phabricator-property-list-key {
padding-left: .5em;
}
@ -57,8 +55,7 @@
margin-bottom: .5em;
}
.device-tablet .phabricator-property-list-value,
.device-phone .phabricator-property-list-value {
.device .phabricator-property-list-value {
padding-left: 1.5em;
margin-bottom: .5em;
}

View file

@ -105,8 +105,7 @@
border-color: #009966;
}
.device-tablet .phabricator-timeline-event-view,
.device-phone .phabricator-timeline-event-view {
.device .phabricator-timeline-event-view {
min-height: 25px;
position: relative;
margin-left: 3px;
@ -116,21 +115,18 @@
border-right-style: solid;
}
.device-tablet .phabricator-timeline-image,
.device-phone .phabricator-timeline-image {
.device .phabricator-timeline-image {
display: none;
}
.device-tablet .phabricator-timeline-title,
.device-phone .phabricator-timeline-title {
.device .phabricator-timeline-title {
line-height: 25px;
min-height: 25px;
background: #f7f7f7;
padding: 0 5px;
}
.device-tablet .phabricator-timeline-spacer,
.device-phone .phabricator-timeline-spacer {
.device .phabricator-timeline-spacer {
min-height: 8px;
border-width: 0;
}

View file

@ -39,6 +39,7 @@ JX.behavior('device', function(config) {
JX.DOM.alterClass(e, 'device-phone', (device == 'phone'));
JX.DOM.alterClass(e, 'device-tablet', (device == 'tablet'));
JX.DOM.alterClass(e, 'device-desktop', (device == 'desktop'));
JX.DOM.alterClass(e, 'device', (device != 'desktop'));
JX.Stratcom.invoke('phabricator-device-change', null, device);
}