revi-archive/phorge-phorge
1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-11-22 14:52:41 +01:00
Code Issues Releases Wiki Activity

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

Browse source 
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
Show stats Download patch file Download diff file Expand all files Collapse all files

8
src/view/page/PhabricatorStandardPageView.php
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 // Try to guess the device resolution based on UA strings to avoid a flash
// of incorrectly-styled content. // of incorrectly-styled content.
$device_guess = 'device-desktop'; $device_guess = 'device-desktop';
if (preg_match('/iPhone|iPod/', $agent)) { if (preg_match('@iPhone|iPod|(Android.*Chrome/[.0-9]* Mobile)@', $agent)) {
$device_guess = 'device-phone'; $device_guess = 'device-phone device';
} else if (preg_match('/iPad/', $agent)) { } else if (preg_match('@iPad|(Android.*Chrome/)@', $agent)) {
$device_guess = 'device-tablet'; $device_guess = 'device-tablet device';
} }
$classes = array( $classes = array(

21
webroot/rsrc/css/aphront/phabricator-nav-view.css
View file

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

64
webroot/rsrc/css/application/base/main-menu-view.css
View file

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

3
webroot/rsrc/css/application/base/notification-menu.css
View file

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

9
webroot/rsrc/css/application/phame/phame.css
View file

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

3
webroot/rsrc/css/layout/phabricator-action-list-view.css
View file

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

3
webroot/rsrc/css/layout/phabricator-crumbs-view.css
View file

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

16
webroot/rsrc/css/layout/phabricator-form-view.css
View file

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

9
webroot/rsrc/css/layout/phabricator-property-list-view.css
View file

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

12
webroot/rsrc/css/layout/phabricator-timeline-view.css
View file

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

1
webroot/rsrc/js/application/core/behavior-device.js
View file

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