yuantao/gitea-banana-theme
1
0
Fork 0
Code Issues Pull Requests Releases 1 Activity

banana v3

Browse Source
This commit is contained in:
User
2025-09-25 14:02:34 +08:00
parent 12915214b6
commit 1f321e6bdd
19 changed files with 233 additions and 127 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
styles/public/button.ts
View File

@@ -12,7 +12,8 @@ export const primaryHoverStyle = {
color: themeVars.github.button.primary.fgColor.rest,
backgroundColor: themeVars.github.button.primary.bgColor.hover,
borderColor: themeVars.github.button.primary.borderColor.hover,
transform: "translateY(-1px)", // 添加轻微的上移效果
// 移除 transform 以避免创建新的层叠上下文
// transform: "translateY(-1px)", // 添加轻微的上移效果
boxShadow: `0 4px 12px rgba(0, 0, 0, 0.1), ${themeVars.github.shadow.resting.small}`, // 增强阴影
};
@@ -48,7 +49,8 @@ export const baseButton = css`
${primaryHoverStyle}
}
&:active {
transform: translateY(0); // 点击时回到原位
// 移除 transform 以避免创建新的层叠上下文
// transform: translateY(0); // 点击时回到原位
}
}
// 按钮组整体有阴影
@@ -72,11 +74,13 @@ export const baseButton = css`
background-color: ${themeVars.color.hover.self};
color: ${themeVars.color.text.self};
border-color: ${themeVars.color.light.border};
transform: translateY(-1px); // 添加轻微的上移效果
position: relative;
top: -1px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); // 添加阴影
}
&:active {
transform: translateY(0); // 点击时回到原位
// 移除 transform 以避免创建新的层叠上下文
// transform: translateY(0); // 点击时回到原位
animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1);
}
}
@@ -87,11 +91,13 @@ export const baseButton = css`
border-radius: 8px; // 增加圆角
&:hover {
border-color: ${themeVars.color.light.border};
transform: translateY(-1px); // 添加轻微的上移效果
position: relative;
top: -1px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05); // 添加阴影
}
&:active {
transform: translateY(0); // 点击时回到原位
// 移除 transform 以避免创建新的层叠上下文
// transform: translateY(0); // 点击时回到原位
animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1);
}
}
@@ -124,11 +130,13 @@ export const redButton = css`
background-color: ${themeVars.github.button.danger.bgColor.hover};
border-color: ${themeVars.github.button.danger.borderColor.hover};
box-shadow: ${themeVars.github.shadow.resting.small};
transform: translateY(-1px); // 添加轻微的上移效果
position: relative;
top: -1px;
}
&:active {
transform: translateY(0); // 点击时回到原位
// 移除 transform 以避免创建新的层叠上下文
// transform: translateY(0); // 点击时回到原位
animation: pulse-click 200ms cubic-bezier(0.4, 0, 0.2, 1);
}
}