Page MenuHomePhabricator
Differential D15017

Make profile menu full-height
ClosedPublic
Actions

Authored by epriestley on Jan 14 2016, 1:56 AM.
Tags
None
Referenced Files
F14352285: D15017.id.diff
Thu, Dec 19, 1:28 PM
F14352284: D15017.diff
Thu, Dec 19, 1:28 PM
Unknown Object (File)
Mon, Dec 16, 6:46 PM
Unknown Object (File)
Sun, Dec 15, 8:44 AM
Unknown Object (File)
Wed, Dec 11, 7:07 AM
Unknown Object (File)
Mon, Dec 9, 10:57 AM
Unknown Object (File)
Fri, Dec 6, 8:55 PM
Unknown Object (File)
Thu, Dec 5, 5:06 AM
View All Files
Subscribers
None

Details

Reviewers
chad
Maniphest Tasks
T10054: Define product direction for Project/Profile UIs
Commits
Restricted Diffusion Commit
rPc019f76283ce: Make profile menu full-height
Summary

Ref T10054. This makes the profile menu full-height. It uses two pieces of dark magic:

  • calc(), which allows you to do math in CSS.
  • The vh unit, which is CSS for "viewport height".

Apparently this kind of stuff just works now? CSS got good at some point?

Test Plan
  • Page looks correct in Safari, Chrome, Firefox.
  • Checked caniuse.com for vh and calc(), saw they're supported?

Diff Detail

Repository
rP Phabricator
Lint
Lint Not Applicable
Unit
Tests Not Applicable

Event Timeline

epriestley updated this revision to Diff 36269.Jan 14 2016, 1:56 AM
epriestley retitled this revision from to Make profile menu full-height.
epriestley updated this object.
epriestley edited the test plan for this revision. (Show Details)
epriestley added a reviewer: chad.
epriestley added a task: T10054: Define product direction for Project/Profile UIs.
Herald edited edge metadata. · View Herald TranscriptJan 14 2016, 1:56 AM
epriestley added a comment.Jan 14 2016, 1:57 AM

Screen Shot 2016-01-13 at 5.56.52 PM.png (1×1 px, 233 KB)

epriestley added a comment.Jan 14 2016, 1:58 AM

Most of this is just shuffling the footer around so we can put it after the content (instead of after the whole menu) when rendering a profile menu.

Then the rest is magic.

webroot/rsrc/css/phui/phui-profile-menu.css
7

This is the magic.

epriestley added a comment.Jan 14 2016, 1:59 AM

Also:

  • this rule only activates on desktop; and
  • if it doesn't work for some reason, everything still looks mostly OK, the menu just won't be as tall as the window on pages with a small amount of content.
chad edited edge metadata.Jan 14 2016, 2:08 AM

wut

epriestley added a comment.Jan 14 2016, 2:11 AM

ya i kno rite

chad added a comment.Jan 14 2016, 2:12 AM

im flagging this for later when someone says it doesn't work on Android on a 2G connection in the outback.

chad accepted this revision.Jan 14 2016, 9:07 PM
chad edited edge metadata.
This revision is now accepted and ready to land.Jan 14 2016, 9:07 PM
Closed by commit rPc019f76283ce: Make profile menu full-height (authored by epriestley, committed by epriestley). · Explain WhyJan 15 2016, 5:12 PM
This revision was automatically updated to reflect the committed changes.

Revision Contents
Changeset List

PathSize
resources/
celerity/
6 lines
src/
applications/
celerity/
postprocessor/
2 lines
view/
layout/
40 lines
page/
17 lines
webroot/
rsrc/
css/
phui/
26 lines

Diff 36302

View Options

resources/celerity/map.php

Loading...
View Options

src/applications/celerity/postprocessor/CelerityDefaultPostprocessor.php

Loading...
View Options

src/view/layout/AphrontSideNavFilterView.php

Loading...
View Options

src/view/page/PhabricatorStandardPageView.php

Loading...
View Options

webroot/rsrc/css/phui/phui-profile-menu.css

Loading...
Phabricator · Built by Phacility