Test page for designers

Prev Next

I’ve created this page to demonstrate to design team a couple of “problems” / limitations that I’m currently experiencing with Doc360.

Banner

All the HR documents have now been migrated into Document360. Most of them have this table at the top to indicate which versions and users can access and use this feature.

Apart from how it looks, I really don’t think this is the best way to convey this information. Firstly, most people won’t know or care what version of HR they are using, and also, using bold text isn’t a great way to inform people what role they need to use this feature.

Here’s an article explaining the different versions: HR - versions

Perhaps it would be better shown as:

  • Version: HR Essentials and above

  • Role: HR manager or above

This banner shouldn’t be shown if it applies to all versions and/or all users (i.e. so it may only have Version or Role or neither)

Headings

Here are the current H2-H4 headings which don’t look great (there isn’t a heading 1 in text styles for some reason)

Heading 2

Heading 3

Heading 4

See also: https://cintra.document360.io/docs/leave-allowances-1#i-need-to-remove-x-days-from-an-employees-allowance

Image thumbnails / captions

SCRAP THIS. No longer required.

Expanding text / accordion

Also to save space on the screen, I want to use the accordion feature which the user would click to expand the text. However, it doesn’t look great at the moment!

This is the accordion header. Click me to view the text below.

Here is some text below.

And more text.

And a picture.

See also: https://cintra.document360.io/docs/leave-allowances-1#i-need-to-remove-x-days-from-an-employees-allowance

Tables

Tables look very poor when published and sometimes “fall off” the side of the page, e.g. on this page: https://cintra.document360.io/docs/setting-up-and-using-passkeys

Callouts

There are various “built-in” callouts. They’re okay, but if you feel they could be improved, be my guest!

Note

The first note was taken by Sir Samuel Note in 1588.

Remember!

Rhythm has your two hips moving

Warning!

Don’t click this button

Example

Here is some example text

“Workspace” menu at top-left of the screen

From the PM managers meeting, we would like to hide this menu, to prevent people switching between workspaces. It would appear that the only way to do this AND keep each of the workspace / help files public is to hide the menu completely using the CSS.

FAQs

I was intending to create FAQs using accordion / captions. Here’s a good example, and as you can see, the page needs a bit of work!

https://cintra.document360.io/docs/leave-allowances-1#i-need-to-remove-x-days-from-an-employees-allowance

In particular, if I use H3 for the accordion (i.e. where you click to expand) and I use H4 within the question answer, it shows in the right-hand Table of Contents, but it only works if you’ve already expanded the accordion.

Basically, any guidance you can give me to make this look better / less bad would be much appreciated!