Add layout logic diagrams for the block clock

[GBKS]

Defines and visualizes the logic of how the block clock adjusts to varying screen sizes. Feedback appreciated.

This came up in conversations in this PR.

[mouxdesign]

This looks great, can especially see it being very useful developers as well as future contributors. Also ensures the quality of the blockclock among various devices.

When reading the content, it came through that the info for the various sizes were in 4 bigger buckets. An idea could be to state those more intentionally which might help with readers who are trying to pull the information fast. Not a must as the content is 100% understandable as is. The buckets that came through from reading:

Default

• Network indicator positioning: center below clock
• Block clock size: 200x200px
• Padding: 30px
• Top bar height: 46px

Showcase mode

• Network indicator positioning: center below clock
• Block clock size: 200x200px
• Padding: 30px
• Top bar height: ?

Smaller sizes (height < 400)

• Network indicator positioning: top-left corner
• Block clock size: 200x200px
• Padding: ?
• Top bar height: 46px

Even smaller

• Network indicator positioning: top-left corner
• Block clock size: Shrinks smaller than 200x200px
• Padding: Minimum: 26px
• Top bar height: 36px