11.dropdownContainer {
22 position : absolute;
3- top : 0 ;
4- right : 0 ;
5- bottom : 0 ;
6- width : 280px ;
7- z-index : 2000 ;
8- pointer-events : none;
3+ top : 100% ;
4+ left : 0 ;
5+ z-index : 1000 ;
96}
107
118.dropdownMenu {
129 position : absolute;
13- top : 0 ;
14- right : 0 ;
15- width : 100% ;
16- height : calc (100% - 40px );
17- background : var (--ui-white );
18- border-left : 1px solid var (--ui-black-transparent );
19- box-shadow : -4px 0 16px rgba (0 , 0 , 0 , 0.12 ), -2px 0 4px rgba (0 , 0 , 0 , 0.08 );
20- z-index : 2000 ;
21- overflow-y : auto;
22- overflow-x : hidden;
23- backdrop-filter : blur (8px );
24- pointer-events : auto;
25- display : flex;
26- flex-direction : column;
27- padding : 20px ;
28- border-radius : 0 0 8px 8px ;
29- margin-bottom : 20px ;
10+ background : white;
11+ border : 1px solid # ddd ;
12+ border-radius : 4px ;
13+ box-shadow : 0 2px 8px rgba (0 , 0 , 0 , 0.15 );
14+ min-width : 150px ;
15+ z-index : 1000 ;
16+ overflow : hidden;
3017}
3118
3219.dropdownItem {
3320 width : 100% ;
34- padding : 16 px 20 px ;
21+ padding : 8 px 12 px ;
3522 background : none;
3623 border : none;
3724 text-align : left;
38- font-size : 16px ;
39- font-weight : 500 ;
40- color : var (--text-primary );
25+ font-size : 14px ;
26+ color : # 333 ;
4127 cursor : pointer;
42- transition : all 0.3 s ease ;
28+ transition : background-color 0.2 s ;
4329 white-space : nowrap;
44- display : flex;
45- align-items : center;
46- gap : 12px ;
47- position : relative;
48- border-radius : 8px ;
49- margin-bottom : 8px ;
50- }
51-
52- .dropdownItem ::before {
53- content : '' ;
54- width : 20px ;
55- height : 20px ;
56- flex-shrink : 0 ;
57- background-size : contain;
58- background-repeat : no-repeat;
59- background-position : center;
60- opacity : 0.9 ;
61- border-radius : 4px ;
62- display : flex;
63- align-items : center;
64- justify-content : center;
65- font-size : 14px ;
66- font-weight : 600 ;
67- }
68-
69- /* Commit Icon - Modern checkmark with teal background */
70- .dropdownItem : nth-child (1 )::before {
71- content : '✓' ;
72- background : linear-gradient (135deg , # 00baad 0% , # 009688 100% );
73- color : white;
74- box-shadow : 0 2px 4px rgba (0 , 186 , 173 , 0.3 );
75- text-shadow : 0 1px 2px rgba (0 , 0 , 0 , 0.1 );
76- }
77-
78- /* Fetch Icon - Modern download arrow with teal background */
79- .dropdownItem : nth-child (2 )::before {
80- content : '↓' ;
81- background : linear-gradient (135deg , # 00baad 0% , # 009688 100% );
82- color : white;
83- box-shadow : 0 2px 4px rgba (0 , 186 , 173 , 0.3 );
84- text-shadow : 0 1px 2px rgba (0 , 0 , 0 , 0.1 );
85- }
86-
87- /* Pull Request Icon - Modern merge arrow with teal background */
88- .dropdownItem : nth-child (3 )::before {
89- content : '⤴' ;
90- background : linear-gradient (135deg , # 00baad 0% , # 009688 100% );
91- color : white;
92- box-shadow : 0 2px 4px rgba (0 , 186 , 173 , 0.3 );
93- text-shadow : 0 1px 2px rgba (0 , 0 , 0 , 0.1 );
94- }
95-
96- /* Settings Icon - Gray theme for configuration */
97- .dropdownItem : nth-child (4 )::before {
98- content : '⚙' ;
99- background : linear-gradient (135deg , # 6c757d 0% , # 495057 100% );
100- color : white;
101- box-shadow : 0 2px 4px rgba (108 , 117 , 125 , 0.3 );
102- text-shadow : 0 1px 2px rgba (0 , 0 , 0 , 0.1 );
10330}
10431
10532.dropdownItem : hover {
106- background : linear-gradient (135deg , rgba (0 , 186 , 173 , 0.08 ) 0% , rgba (0 , 186 , 173 , 0.04 ) 100% );
107- transform : translateX (4px );
108- box-shadow : 0 2px 8px rgba (0 , 186 , 173 , 0.15 );
109- border : 1px solid rgba (0 , 186 , 173 , 0.2 );
33+ background-color : # f0f0f0 ;
11034}
11135
11236.dropdownItem : active {
113- background : linear-gradient (135deg , rgba (0 , 186 , 173 , 0.12 ) 0% , rgba (0 , 186 , 173 , 0.06 ) 100% );
114- transform : translateX (2px );
115- box-shadow : 0 1px 4px rgba (0 , 186 , 173 , 0.2 );
37+ background-color : # e0e0e0 ;
38+ }
39+
40+ .dropdownItem : not (: last-child ) {
41+ border-bottom : 1px solid # eee ;
11642}
11743
11844/* 响应式设计 */
11945@media (max-width : 600px ) {
12046 .dropdownMenu {
121- min-width : 160 px ;
47+ min-width : 140 px ;
12248 }
12349
12450 .dropdownItem {
12551 padding : 10px 12px ;
12652 font-size : 13px ;
127- gap : 8px ;
12853 }
129-
130- .dropdownItem ::before {
131- width : 14px ;
132- height : 14px ;
133- }
134- }
54+ }
0 commit comments