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
F15524155: D15017.id36269.diff
Mon, Apr 21, 6:16 AM
F15520923: D15017.id36269.diff
Sun, Apr 20, 9:17 AM
F15515495: D15017.id.diff
Fri, Apr 18, 11:05 AM
F15513635: D15017.id36302.diff
Thu, Apr 17, 8:31 PM
F15513419: D15017.diff
Thu, Apr 17, 6:59 PM
F15441697: D15017.diff
Wed, Mar 26, 7:24 PM
F15435644: D15017.id.diff
Tue, Mar 25, 9:29 AM
F15419476: D15017.id.diff
Mar 21 2025, 6:24 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
Branch
pmenu3
Lint
Lint Passed
Unit
Tests Passed
Build Status
Buildable 10103
Build 12245: Run Core Tests
Build 12244: arc lint + arc unit

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 36269

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