1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-12-19 03:50:54 +01:00
Commit graph

30 commits

Author SHA1 Message Date
Merula Turdus
4accca8420 Phriction: fix issue with icons in table of contents on wide screens
Summary:
When using icons in front of a header title, a part of the icon was
not visible in the TOC on wide screens.

| Before    | After    |
|-----------|----------|
| {F2670860}|{F2670861}|

Look at the table of contents on the left side.

Closes T15920

Test Plan:
Steps to reproduce in a Phriction document:

```
== {icon users} How to Register-in ==

=== {icon heart spin} Credits ===
```

Verify if all icons are visible in TOC.

Reviewers: O1 Blessed Committers, aklapper, valerio.bozzolan

Reviewed By: O1 Blessed Committers, aklapper, valerio.bozzolan

Subscribers: aklapper, tobiaswiese, valerio.bozzolan, Matthew, Cigaryno

Maniphest Tasks: T15920

Differential Revision: https://we.phorge.it/D25854
2024-12-12 16:51:08 +01:00
Merula Turdus
9448e81572 Show table of contents by default on wide screens
Summary:
Show table of content in left whitespace area in wide screens (width >= 1792px)

Closes T15920

Test Plan:
1) Open Phriction wiki page in browser which contain a number of chapter titles
2) Open Responsive Design Mode in browser (Ctrl-Shift-M in Firefox) and test different width's of the page (e.g. 1024, 1280, 1440, 1600, 1920, ...)
3) Open Remarkup Reference at `/book/phorge/article/remarkup/` and repeat step 2
4) Open a Differential revision to confirm that the unrelated ToC panel has no changes

Reviewers: O1 Blessed Committers, aklapper

Reviewed By: O1 Blessed Committers, aklapper

Subscribers: aklapper, tobiaswiese, valerio.bozzolan, Matthew, Cigaryno

Maniphest Tasks: T15920

Differential Revision: https://we.phorge.it/D25790
2024-12-09 18:33:33 +01:00
epriestley
248d79f36d Fix "Actions" button on Phame standalone/live pages (bonus: JX.sprintf())
Summary:
See <https://discourse.phabricator-community.org/t/non-functional-actions-menu-on-live-phame-views/2593>. Several layers here:

The "Actions" button is broken because a menu behavior is failing, since we aren't rendering the menu.

When a behavior fails to initialize, catch and log the exception and continue. Previously, we stopped initializing behaviors if any failed, but behaviors are usually independent and continuing with an explicit exception seems reasonable.

Give "JX.log()" some "sprintf()" semantics to make logging the behavior failure easier. We can probably afford these extra 200 bytes now in 2019.

This fixes the button and gives us explicit errors in the log. So far, so good.

Then, when a page won't render chrome, don't try to render the main menu. This fixes the actual errors (we no longer try to initialize menu behaviors for nodes which don't exist).

Completely hide the "Actions" and "Comment" flows if the viewer isn't logged in. Although this isn't completely consistent with other applications, I think it's more appropriate for Phame. In applications like Maniphest, we show a full set of controls (but disable them) so that users who are not currently logged in have a clear path to interact with the content, under the assumption that this is a relatively common workflow. This is probably less common for Phame, where we expect most anonymous viewers not to log in or interact.

Finally, parametrize a one-off border color and add a border under the crumbs at the top of the page.

Test Plan:
  - Viewed a "Live" Phame blog post page, clicked "Actions", got a dropdown.

Reviewers: amckinley

Reviewed By: amckinley

Differential Revision: https://secure.phabricator.com/D20378
2019-04-04 06:10:14 -07:00
epriestley
cfd9fa7f55 Add an explicit "max-width" to PHUIDocumentPro pages to force large tables to scroll
Summary:
Ref T13202. See <https://discourse.phabricator-community.org/t/phriction-page-controls-lost-after-creating-very-wide-table/1961>.

If you put a very wide table in the markup for a new-layout Phriction page, it can push the actions element off screen to the right.

Tables already get a scrollbar if encouraged strongly enough; add a `max-width` to encourage them.

Test Plan:
  - Viewed pages with a large wrappable and non-wrappable content on mobile, tablet, and desktop.

{F5915976}

Reviewers: amckinley

Reviewed By: amckinley

Maniphest Tasks: T13202

Differential Revision: https://secure.phabricator.com/D19723
2018-10-01 13:15:59 -07:00
epriestley
e19c555913 Support (basic) commenting on Phriction documents
Summary:
Depends on D19659. Fixes T1894. Ref T13077. See PHI840.

  - Add an EditEngine, although it currently supports no fields.
  - Add (basic, top-level-only) commenting (we already had the table in the database).

This will probably create some issues. I'm most concerned about documents accumulating a ton of old, irrelevant comments over time which are hard to keep track of and no longer relevant. But I think this is probably a step forward in almost all cases, and a good thing on the balance.

This also moves us incrementally toward putting all editing on top of EditEngine.

Test Plan: {F5877347}

Reviewers: amckinley

Reviewed By: amckinley

Maniphest Tasks: T13077, T1894

Differential Revision: https://secure.phabricator.com/D19660
2018-09-12 13:20:52 -07:00
epriestley
6dc721009d Layout Phriction actions without floats, to avoid conflicts with floating content
Summary:
Ref T13195. If a Phriction page begins with a code block, the `clear: both;` currently makes it clear the action list.

Instead, use table-cell layout on desktops.

Test Plan: Viewed a Phriction page with an initial code block on desktop/tablet/mobile/printable layouts. Now got more sensible layouts in all cases.

Reviewers: amckinley

Reviewed By: amckinley

Subscribers: GoogleLegacy

Maniphest Tasks: T13195

Differential Revision: https://secure.phabricator.com/D19649
2018-09-10 11:19:53 -07:00
epriestley
4afb6446d9 Allow DocumentView to render with a curtain, and make Phriction use a curtain
Summary:
Depends on D19616. Ref T13077. Fixes T8172. In the last round of design updates, a lot of actions got stuffed into "Actions" menus.

I never really got used to these and think they're a net usability loss, and broadly agree with the feedback in T8172. I'd generally like to move back toward a state where actions are available on the page, not hidden in a menu.

For now, just put a curtain view on these pages. This could be refined later (e.g., stick this menu to the right hand side of the screen) depending on where other Phriction changes go.

(Broadly, I'm also not satisfied with where we ended up on the fixed-width pages like Diffusion > Manage, Config, and Instances. In contrast, I //do// like where we ended up with Phortune in terms of overall design. I anticipate revisiting some of this stuff eventually.)

Test Plan:
  - Looked at Phriction pages on desktop/tablet/mobile/printable -- actions are now available on the page.
  - Looked at other DocumentView pages (like Phame blogs) -- no changes for now.

Reviewers: amckinley

Maniphest Tasks: T13077, T8172

Differential Revision: https://secure.phabricator.com/D19617
2018-08-28 14:58:05 -07:00
Chad Little
7aeefc0cca Add an Experimental Dark Mode to Phabricator
Summary: Mostly this is an exercise to clean up our CSS and Celerity processor by making sure all important color decisions are generatable. It's somewhat resonable to use if you don't review code. Posting it up here mostly so I don't lose the work.

Test Plan: Visit lots and lots of pages with dark mode on and off.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D18227
2017-07-18 06:44:32 -07:00
Chad Little
f66c6e5c1f Fix Phriction toc button states
Summary: Some unneeded CSS here.

Test Plan: Click on ToC button, see more normal colors.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D18073
2017-06-04 08:55:08 -07:00
Chad Little
718c39131d Add a little style to Phriction ToC menu
Summary: Adds some indentation and color. Ref T9868.

Test Plan: A long page with multiple indentation levels.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Maniphest Tasks: T9868

Differential Revision: https://secure.phabricator.com/D18025
2017-05-26 09:17:30 -07:00
Chad Little
6b3d04683d Clean up SIMPLE button styles
Summary: Some of these are unused, defaults to a lighter color naturally.

Test Plan: uiexamples, grep, phriction

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D18020
2017-05-25 14:53:59 -07:00
Chad Little
279816683b Move ToC 4px in documentproview
Summary: Fixes T12637.

Test Plan: Reload page, see wider button.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Maniphest Tasks: T12637

Differential Revision: https://secure.phabricator.com/D17790
2017-04-25 10:50:34 -07:00
Chad Little
6f5dab634d Redesign header menus and search
Summary:
Still lots to fix here, punting up since I'm running into a few roadblocks.

TODO:
[] Sort Personal/Global correctly
[] Quicksand in Help Items correctly on page changes

Test Plan: Verify new menus work on desktop, tablet, mobile. Test logged in menus, logged out menus. Logging out via a menu, verify each link works as expected. Help menus get build when using an app like Maniphest, Differential. Check that search works, preferences still save.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Maniphest Tasks: T12107

Differential Revision: https://secure.phabricator.com/D17209
2017-01-17 12:13:06 -08:00
Chad Little
7c80257a57 Clean up Phame comment box CSS
Summary: Fixes some outlying issues with new comment box and Phame Posts.

Test Plan: Review CSS in sandbox, post new reply, see proper spacing.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D16869
2016-11-15 11:26:33 -08:00
Chad Little
037793ab60 Update PHUIInfoView
Summary: Just some minor UI tweaks. Make AphrontTagView, add Icons, whiten background.

Test Plan: Legalpad, Settings, Auth, UIExamples, Differential... desktop, mobile.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D16850
2016-11-12 21:32:13 -08:00
Chad Little
d7bc582530 Printable pages for PHUIDocumentViewPro
Summary: Fixes T10131. Adds new CSS to better present document pages for printing. Added a print link to Phriction.

Test Plan: Tested Phriction, Phame, and Legalpad.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Maniphest Tasks: T10131

Differential Revision: https://secure.phabricator.com/D16524
2016-09-08 19:14:32 -07:00
Chad Little
11e84c166a Redesign Application Search
Summary: This moves aphront-side-nav to use same table css display as profile nav. Slightly less code to support. Cleans up AppSearch UI, think I've gotten all the edge cases here, but bang on it, can hold until after release cut.

Test Plan: Config, Maniphest, Differential, Diffusion, Home.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D16346
2016-08-01 12:23:36 -07:00
Chad Little
e384e945d0 Add basic support for Phame blog headers
Summary: Fixes T10901. Allows blogs to have headers. I've built this in a basic way, any file, max-height is 240. Should bleed into top crumbs, so any spacing you want you should add to the file itself. Might have to see how users break this.

Test Plan: Set a blog header, see blog header, remove blog header, see no blog header. Check mobile, tablet, desktop break points.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Maniphest Tasks: T10901

Differential Revision: https://secure.phabricator.com/D16141
2016-06-17 12:08:51 -07:00
Chad Little
d85386488b Add "wide" remarkup image support for Documents
Summary: Seems to work ok, if you give `size=wide` to an image file, we blow it out a bit in DocumentPro mode.

Test Plan:
Test in Phame and Maniphest.

{F1256717}

{F1256718}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D15840
2016-05-03 17:27:30 -07:00
Chad Little
fa6151778f Fix Legalpad "Sign" box
Summary: Missed converting this page, scenario. The box was poorly formatted.

Test Plan: Create a new document that needs signed, verify box is correctly spaced and colored.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D15591
2016-04-02 19:58:35 -07:00
Chad Little
023cfbb23a Restrict PropertyListView width to just DocumentProView
Summary: Fixes T10409. Long term need to build a proper "PageEngine" of sorts for layouts not needing special magic. For now this just affects a few applications.

Test Plan: View Diffusion, Phriction, Phame, Legalpad, Diviner.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Maniphest Tasks: T10409

Differential Revision: https://secure.phabricator.com/D15328
2016-02-22 11:54:23 -08:00
Chad Little
0e5cd478c4 Move rgba rules into CelerityDefaultPostprocessor
Summary: Should make it simpler here to have more `rgba` rules in CSS for things like hovers, selected states. Maybe only use `rgb` colors? Color pallette probably needs an overhaul.

Test Plan: Bounce around random pages, buttons, menus. Everything appears normal.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D15273
2016-02-16 09:54:43 -08:00
Chad Little
fe6224f505 Add Next and Previous UI to PhamePostView
Summary: Creates a new next/previous UI for PhamePosts, and adds a setFoot to PHUIDocumentViewPro for future use in other apps.

Test Plan:
Test first, next, last posts on Phame in mobile, desktop, and tablet breakpoints.

{F1050152}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D14919
2015-12-31 13:09:59 -08:00
Chad Little
a6e24cb2be Remove pro-white-background, re-style PHUIDocumentViewPro
Summary: This makes document views a little more automatic, and a little more style to the page. The Document itself remains on a pure white centered background, but footer and preceeding objects go back to the original body color. This provides a bit more depth and separation over content and definitions/comments.

Test Plan:
Tested Phriction, Diviner, Legalpad, Phame, Email Commands, HTTP Commands, with and without a footer.

{F1005853}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D14582
2015-11-28 07:20:55 -08:00
Chad Little
bf227f77a5 Update Phriction for PHUIDocumentViewPro
Summary: Moves Phriction to use PHUIDocumentViewPro

Test Plan: Read lots of documents, tablet, mobile, and desktop. Check ToC, non ToC, Edit a Maniphest Task, New Phriction Document, edit Phriction Document.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Maniphest Tasks: T9826

Differential Revision: https://secure.phabricator.com/D14399
2015-11-22 13:11:20 -08:00
Chad Little
b315f61f49 Add comments to internal Phame Posts
Summary: Adds commenting to Phame Posts, also testing a new "document comment style". Unsure about it but Phame is a prototype so good place to explore.

Test Plan: Leave some comments, see some comments, test show/hide.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Maniphest Tasks: T9746

Differential Revision: https://secure.phabricator.com/D14451
2015-11-10 08:19:38 -08:00
Chad Little
e4806631a5 Use PHUIDocumentProView in Phame
Summary: Updates "View Post" to use PHUIDocumentViewPro, updates calls to `newPage` and other minor modernizations. Edit Page updated to show proper document display as well. Ref T9545

Test Plan:
Write a blog post, edit it.

{F945897}

{F945896}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Maniphest Tasks: T9545

Differential Revision: https://secure.phabricator.com/D14415
2015-11-05 12:14:45 -08:00
Chad Little
39f8feab5a PHUIDocumentViewPro tweaks
Summary: Use in MailCommands and HTTP Parameters

Test Plan: Tested MailCommands in Paste, HTTP Parameters in Paste, Legalpad, Diviner. Mobile and Desktop breakpoints.

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D14397
2015-11-03 13:43:26 -08:00
Chad Little
b7a4d3b9a5 Redesign Legalpad
Summary: Rolls out PHUIDocumentViewPro to Legalpad. Minor tweaks to provide space around Preamble and Signature blocks. Otherwise, straight forward.

Test Plan:
Build a new document with and without Preamble, sign document.

{F933386}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: Korvin

Differential Revision: https://secure.phabricator.com/D14377
2015-11-01 16:04:56 -08:00
Chad Little
c45ba30416 Redesign Diviner
Summary:
This implements `PHUIDocumentViewPro` which should move to be the base for all documents (Phame, Phriction, Legalpad, Diviner). Overall this feels really good to me, but I'd like to roll it out into Diviner specifically first to work through the issues and then move into other apps and drop `PHUIDocumentView` once everything is converted. Some features are:

 - White Background, no border on page
 - Table of Contents is move to hidden menu (more space for documentation)
 - Property List sits under the document

Some design decisions above are in anticipation of Phriction v3 and Unbeta Phame, specifically commenting and maybe some cool new Remarkup text layout options for Phame.

Test Plan:
Went through tons of pages on Diviner on Desktop, Tablet, Mobile. Bounce back to Phriction to make sure DocumentView CSS changes actually look better there.

{F930518}

{F930519}

{F930520}

{F930521}

Reviewers: epriestley

Reviewed By: epriestley

Subscribers: tycho.tatitscheff, joshuaspence, Korvin

Differential Revision: https://secure.phabricator.com/D14374
2015-11-01 08:58:33 -08:00