-
Notifications
You must be signed in to change notification settings - Fork 4
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
fix(documentation): Fixed asset urls (#75)
- Loading branch information
1 parent
4414003
commit 375e3c3
Showing
8 changed files
with
83 additions
and
34 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,34 +1,34 @@ | ||
# Navigation | ||
Navigation structure and used elements highly depend on system **Information Architecture** structure. Think about it before you make decision about your navigation and menu structure. | ||
|
||
![Example](/img/navigation1.svg) | ||
![Example](/src/style/assets/navigation1.svg) | ||
|
||
|
||
## Context Links | ||
The most natural way to move through the system is a system of well placed context links that leads to proper place. | ||
|
||
![Example](/img/navigation2.svg) | ||
![Example](/src/style/assets/navigation2.svg) | ||
|
||
|
||
## Menu Structure | ||
First level | ||
|
||
![Example](/img/navigation3.png) | ||
![Example](/src/style/assets/navigation3.png) | ||
|
||
Second level | ||
|
||
![Example](/img/navigation4.png) | ||
![Example](/src/style/assets/navigation4.png) | ||
|
||
|
||
## Tabs | ||
Tabs can be used to divide page content into sections. It should be used to show only content relevant to specific user actions. | ||
|
||
![Example](/img/navigation5.png) | ||
![Example](/src/style/assets/navigation5.png) | ||
|
||
|
||
## Overlays | ||
Layers are very efficient in showing detailed data or advanced actions without leaving current context. They should be considered as a standard way to show details in Fabric based products. | ||
|
||
![Example](/img/navigation6.png) | ||
![Example](/src/style/assets/navigation6.png) | ||
|
||
More details in [Overlays](../#/general/7-overlays) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,49 @@ | ||
# System Feedback | ||
System feedback elements should be used to inform user about important system actions. | ||
|
||
![Example](/src/style/assets/feed-ex1.jpg) | ||
<p>Inform about finished/successful actions.</p> | ||
|
||
![Example](/src/style/assets/feed-ex2.jpg) | ||
<p>Inform about system errors.</p> | ||
|
||
![Example](/src/style/assets/feed-ex3.jpg) | ||
<p>Inform about input errors (ex. wrong data format).</p> | ||
|
||
![Example](/src/style/assets/feed-ex4.jpg) | ||
<p>Skip obvious information.</p> | ||
|
||
## Feedback Categories | ||
### Neutral | ||
General information | ||
|
||
<h3 style="color:#F44F41">Error</h3> | ||
Information about system problem | ||
|
||
<h3 style="color:#1EB234">Success</h3> | ||
Information about successful or finished activity | ||
|
||
<h3 style="color:#FF9C0F">Warning</h3> | ||
Information about action that can be potentially harmful | ||
|
||
## Feedback forms | ||
### Contextual Feedback | ||
It is short feedback (text, icon) shown next to the linked area when feedback action occurs. It can be show for a short time (ex. 3 seconds) or it can stay until it is relevant. | ||
|
||
Option to provide feedback next to associated element should be considered as default. Consider alternatives only if contextual feedback is not possible or not linked with any screen area. | ||
|
||
![Example](/src/style/assets/feedback1.jpg) | ||
|
||
### Notifications | ||
Used for general system feedback. | ||
|
||
![Example](/src/style/assets/feedback2.jpg) | ||
|
||
For more info, check [Notifications](../#/components/notification). | ||
|
||
### Modal Window | ||
Used when system feedback breaks user activity and using a system can’t be continued without getting an info or making a decision. | ||
|
||
![Example](/src/style/assets/feedback3.jpg) | ||
|
||
For more info, check [Overlays](../#/general/7-overlays). |