mirror of
https://we.phorge.it/source/phorge.git
synced 2024-12-22 13:30:55 +01:00
fe7e288cf5
Summary:
Rolls out a new "Object Page" design with PHUITwoColumnView. This is reasonably polished, but wanted to post it up for you now for feedback before chasing down minor bugs. This implements TwoColumn in the following applications:
- Ponder
- Paste
- Slowvote
- Countdown
- Projects
- Profile
- Passphrase
This helped track down display issues and inconsistencies and make sure the layout was flexible for different pages.
Test Plan:
Test each of the applications on mobile, tablet, and desktop breakpoints.
{F1135705}
{F1135706}
{F1135707}
{F1135708}
{F1135709}
{F1135710}
{F1135711}
Reviewers: epriestley
Reviewed By: epriestley
Subscribers: Korvin
Differential Revision: https://secure.phabricator.com/D15366
65 lines
1.2 KiB
CSS
65 lines
1.2 KiB
CSS
/**
|
|
* @provides phabricator-countdown-css
|
|
*/
|
|
|
|
.phabricator-timer {
|
|
margin: 16px 16px 0 16px;
|
|
}
|
|
|
|
.device .phabricator-timer {
|
|
margin-left: 8px;
|
|
margin-right: 8px;
|
|
}
|
|
|
|
.phabricator-remarkup .phabricator-timer-view {
|
|
max-width: 460px;
|
|
margin: 0 0 12px 0;
|
|
}
|
|
|
|
.phabricator-timer .countdown-description {
|
|
border-bottom: 1px solid {$thinblueborder};
|
|
padding-bottom: 16px;
|
|
}
|
|
|
|
.device-phone .phabricator-remarkup .phabricator-timer {
|
|
width: auto;
|
|
}
|
|
|
|
.phabricator-timer-table {
|
|
width: 100%;
|
|
margin: 8px 0 0 0;
|
|
}
|
|
|
|
.phabricator-timer-table th {
|
|
text-align: center;
|
|
font-size: {$biggerfontsize};
|
|
color: {$bluetext};
|
|
width: 10%;
|
|
padding: 4px;
|
|
}
|
|
|
|
.phabricator-timer-table td {
|
|
padding: 4px;
|
|
text-align: center;
|
|
font-size: 36px;
|
|
font-weight: bold;
|
|
overflow: hidden;
|
|
line-height: auto;
|
|
height: auto;
|
|
line-height: 44px;
|
|
}
|
|
|
|
.phabricator-timer-table td.phabricator-timer-foot {
|
|
font-size: {$biggerfontsize};
|
|
line-height: 16px;
|
|
border-top: 1px solid {$thinblueborder};
|
|
color: {$bluetext};
|
|
padding: 12px 0;
|
|
border-bottom-right-radius: 3px;
|
|
border-bottom-left-radius: 3px;
|
|
text-align: center;
|
|
}
|
|
|
|
.phabricator-timer-table small {
|
|
color: {$lightgreytext};
|
|
}
|