2013-01-01 23:09:59 +01:00
|
|
|
/**
|
|
|
|
* @provides config-options-css
|
|
|
|
*/
|
|
|
|
|
2013-01-01 23:10:33 +01:00
|
|
|
.config-option-table {
|
2013-01-01 23:09:59 +01:00
|
|
|
width: 100%;
|
|
|
|
border-collapse: collapse;
|
2013-09-03 19:18:43 +02:00
|
|
|
border: 1px solid {$lightgreyborder};
|
Update form styles, implement in many places
Summary:
This creates a common form look and feel across the site. I spent a bit of time working out a number of kinks in our various renderings. Some things:
- Font Styles are correctly applied for form elements now.
- Everything lines up!
- Selects are larger, easier to read, interact.
- Inputs have been squared.
- Consistant CSS applied glow (try it!)
- Improved Mobile Responsiveness
- CSS applied to all form elements, not just Aphront
- Many other minor tweaks.
I tried to hit as many high profile forms as possible in an effort to increase consistency. Stopped for now and will follow up after this lands. I know Evan is not a super fan of the glow, but after working with it for a week, it's way cleaner and responsive than the OS controls. Give it a try.
Test Plan: Tested many applications, forms, mobile and tablet.
Reviewers: epriestley, btrahan
Reviewed By: epriestley
CC: aran, Korvin
Differential Revision: https://secure.phabricator.com/D5860
2013-05-07 23:07:06 +02:00
|
|
|
background: #fff;
|
2013-01-01 23:09:59 +01:00
|
|
|
}
|
|
|
|
|
2013-01-01 23:10:33 +01:00
|
|
|
.config-option-table th,
|
|
|
|
.config-option-table td {
|
|
|
|
padding: 4px 12px;
|
2013-09-03 19:18:43 +02:00
|
|
|
border: 1px solid {$lightgreyborder};
|
2013-01-01 23:09:59 +01:00
|
|
|
}
|
|
|
|
|
2013-01-01 23:10:33 +01:00
|
|
|
.config-option-table th {
|
2013-09-03 19:18:43 +02:00
|
|
|
background: {$lightgreybackground};
|
|
|
|
color: {$bluetext};
|
2013-01-01 23:09:59 +01:00
|
|
|
text-align: right;
|
2013-01-01 23:10:33 +01:00
|
|
|
white-space: nowrap;
|
2013-01-01 23:09:59 +01:00
|
|
|
}
|
|
|
|
|
2013-09-03 19:18:43 +02:00
|
|
|
.config-option-table th em,
|
|
|
|
.config-option-table td em {
|
2013-01-01 23:09:59 +01:00
|
|
|
font-weight: normal;
|
2013-09-02 17:08:54 +02:00
|
|
|
color: {$greytext};
|
2013-01-01 23:09:59 +01:00
|
|
|
}
|
|
|
|
|
2013-01-01 23:10:33 +01:00
|
|
|
.config-option-table td {
|
2013-09-03 19:18:43 +02:00
|
|
|
color: {$darkgreytext};
|
2013-01-01 23:10:33 +01:00
|
|
|
width: 100%;
|
|
|
|
}
|
|
|
|
|
|
|
|
.config-option-table .column-labels th {
|
|
|
|
font-weight: bold;
|
2013-09-03 19:18:43 +02:00
|
|
|
color: {$bluetext};
|
2013-01-01 23:10:33 +01:00
|
|
|
text-align: center;
|
2013-09-03 19:18:43 +02:00
|
|
|
background: {$greybackground};
|
2013-01-01 23:09:59 +01:00
|
|
|
}
|
|
|
|
|
2013-01-01 23:11:39 +01:00
|
|
|
.config-options-current-value {
|
2013-04-03 17:28:22 +02:00
|
|
|
padding: 0 8px 6px;
|
2013-01-01 23:11:39 +01:00
|
|
|
white-space: pre-wrap;
|
|
|
|
}
|
2013-01-01 23:09:59 +01:00
|
|
|
|
2013-01-01 23:11:39 +01:00
|
|
|
.config-options-current-value span {
|
2013-09-02 17:10:47 +02:00
|
|
|
color: {$greytext};
|
2013-01-01 23:11:39 +01:00
|
|
|
}
|