mirror of
https://we.phorge.it/source/phorge.git
synced 2024-11-27 01:02:42 +01:00
fa5a5a0a12
Summary: This is the first time I've ever had CSS actually work like it promises it does (i.e., markup the "right" way and then you don't have to change the markup later). Since I laboriously laid this whole thing out with <divs> originally, I was able to just override some of the styles and make the layout reasonable for devices. The only differences for existing forms are: - No colon after labels (looks cleaner anyway). - Non-error required text is no longer a red star but a the grey word "Required" (this is clearer). Test Plan: Viewed paste form on a phone. Viewed ~20 other forms on the site to verify that I didn't break anything. Reviewers: btrahan, chad, vrana Reviewed By: btrahan CC: aran Maniphest Tasks: T1569 Differential Revision: https://secure.phabricator.com/D3298
56 lines
1.2 KiB
CSS
56 lines
1.2 KiB
CSS
/**
|
|
* @provides phabricator-form-view-css
|
|
*/
|
|
|
|
.phabricator-form-view {
|
|
padding: .75em;
|
|
overflow: hidden;
|
|
|
|
background: #f9f9f9;
|
|
|
|
border-width: 1px 0;
|
|
border-style: solid;
|
|
border-color: #dbdbdb;
|
|
}
|
|
|
|
|
|
.device-tablet .phabricator-form-view .aphront-form-control .aphront-form-label,
|
|
.device-phone .phabricator-form-view .aphront-form-control .aphront-form-label {
|
|
display: block;
|
|
float: none;
|
|
text-align: left;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.device-tablet .phabricator-form-view .aphront-form-control
|
|
.aphront-form-caption,
|
|
.device-phone .phabricator-form-view .aphront-form-control
|
|
.aphront-form-caption {
|
|
display: block;
|
|
float: none;
|
|
text-align: left;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.device-tablet .phabricator-form-view .aphront-form-control
|
|
.aphront-form-input,
|
|
.device-phone .phabricator-form-view .aphront-form-control
|
|
.aphront-form-input {
|
|
float: none;
|
|
display: block;
|
|
text-align: left;
|
|
margin: .25em 0 0 0;
|
|
width: 99%;
|
|
padding: 0;
|
|
}
|
|
|
|
.device-tablet .phabricator-form-view .aphront-form-control .aphront-form-error,
|
|
.device-phone .phabricator-form-view .aphront-form-control .aphront-form-error {
|
|
float: none;
|
|
text-align: left;
|
|
display: block;
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|