Blame view

天文台pc/tianwentai-ui/guidelines/Guidelines.md 2.5 KB
bc518174   王天杨   提交两个项目文件
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
  **Add your own guidelines here**
  <!--
  
  System Guidelines
  
  Use this file to provide the AI with rules and guidelines you want it to follow.
  This template outlines a few examples of things you can add. You can add your own sections and format it to suit your needs
  
  TIP: More context isn't always better. It can confuse the LLM. Try and add the most important rules you need
  
  # General guidelines
  
  Any general rules you want the AI to follow.
  For example:
  
  * Only use absolute positioning when necessary. Opt for responsive and well structured layouts that use flexbox and grid by default
  * Refactor code as you go to keep code clean
  * Keep file sizes small and put helper functions and components in their own files.
  
  --------------
  
  # Design system guidelines
  Rules for how the AI should make generations look like your company's design system
  
  Additionally, if you select a design system to use in the prompt box, you can reference
  your design system's components, tokens, variables and components.
  For example:
  
  * Use a base font-size of 14px
  * Date formats should always be in the format “Jun 10”
  * The bottom toolbar should only ever have a maximum of 4 items
  * Never use the floating action button with the bottom toolbar
  * Chips should always come in sets of 3 or more
  * Don't use a dropdown if there are 2 or fewer options
  
  You can also create sub sections and add more specific details
  For example:
  
  
  ## Button
  The Button component is a fundamental interactive element in our design system, designed to trigger actions or navigate
  users through the application. It provides visual feedback and clear affordances to enhance user experience.
  
  ### Usage
  Buttons should be used for important actions that users need to take, such as form submissions, confirming choices,
  or initiating processes. They communicate interactivity and should have clear, action-oriented labels.
  
  ### Variants
  * Primary Button
    * Purpose : Used for the main action in a section or page
    * Visual Style : Bold, filled with the primary brand color
    * Usage : One primary button per section to guide users toward the most important action
  * Secondary Button
    * Purpose : Used for alternative or supporting actions
    * Visual Style : Outlined with the primary color, transparent background
    * Usage : Can appear alongside a primary button for less important actions
  * Tertiary Button
    * Purpose : Used for the least important actions
    * Visual Style : Text-only with no border, using primary color
    * Usage : For actions that should be available but not emphasized
  -->