Weiße Buttons: graue Tiefe statt schwarz
btn-ghost nutzt grauen Rand und graue Tastenkante (wie die Icon-Keycaps) statt Schwarz, weicherer Schatten. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
1 parent
d54bd2c6a9
commit
2f83a247a4
1 file changed
+8
-7
+8
-7
@@ -123,25 +123,26 @@ a { color: inherit; text-decoration: none; }
|
||||
inset 0 -8px 11px -11px rgba(0,0,0,.9);
|
||||
}
|
||||
|
||||
/* weiße Tastenkappe */
|
||||
/* weiße Tastenkappe — TEST: graue Tiefe statt schwarz */
|
||||
.btn-ghost {
|
||||
background: linear-gradient(180deg, #FFFFFF 0%, #F1F1EF 58%, #E5E5E2 100%);
|
||||
color: var(--black);
|
||||
border-color: #BEBEBE;
|
||||
box-shadow:
|
||||
0 8px 0 0 #0A0A0A,
|
||||
0 17px 18px -8px rgba(0,0,0,.34),
|
||||
0 8px 0 0 #B0B0B0,
|
||||
0 17px 18px -8px rgba(0,0,0,.30),
|
||||
inset 0 2px 0 0 rgba(255,255,255,.95),
|
||||
inset 0 -9px 11px -11px rgba(0,0,0,.42);
|
||||
inset 0 -9px 11px -11px rgba(0,0,0,.30);
|
||||
}
|
||||
.btn-ghost:hover {
|
||||
background: linear-gradient(180deg, #FFFFFF 0%, #EAEAE7 58%, #DBDBD8 100%);
|
||||
}
|
||||
.btn-ghost:active {
|
||||
box-shadow:
|
||||
0 0 0 0 #0A0A0A,
|
||||
0 5px 7px -3px rgba(0,0,0,.3),
|
||||
0 0 0 0 #B0B0B0,
|
||||
0 5px 7px -3px rgba(0,0,0,.26),
|
||||
inset 0 2px 0 0 rgba(255,255,255,.9),
|
||||
inset 0 -7px 10px -11px rgba(0,0,0,.38);
|
||||
inset 0 -7px 10px -11px rgba(0,0,0,.28);
|
||||
}
|
||||
|
||||
/* helle Tastenkappe (auf dunklem Grund) */
|
||||
|
||||
Reference in new issue
Block a user