Spaces:
Runtime error
Runtime error
Commit ·
3bab0ce
1
Parent(s): 7ffb950
Update app.py
Browse files
app.py
CHANGED
|
@@ -80,8 +80,8 @@ css = """
|
|
| 80 |
max-width: 900px;
|
| 81 |
margin: auto;
|
| 82 |
padding-top: 1.5rem;
|
| 83 |
-
border-radius: 15px; /*
|
| 84 |
-
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /*
|
| 85 |
}
|
| 86 |
|
| 87 |
/* Button Styles */
|
|
@@ -90,47 +90,53 @@ css = """
|
|
| 90 |
border-color: black;
|
| 91 |
background: black;
|
| 92 |
white-space: nowrap;
|
| 93 |
-
border-radius: 8px; /*
|
| 94 |
-
transition: background-color 0.3s, color 0.3s; /*
|
| 95 |
}
|
| 96 |
|
| 97 |
.gr-button:hover {
|
| 98 |
-
background-color: #555; /*
|
| 99 |
color: #fff;
|
| 100 |
}
|
| 101 |
|
| 102 |
.gr-button:focus {
|
| 103 |
-
/* [
|
| 104 |
}
|
| 105 |
|
| 106 |
/* Textbox Styles */
|
| 107 |
.gr-textbox {
|
| 108 |
-
border-radius: 8px; /*
|
| 109 |
-
border: 1px solid #ccc; /*
|
| 110 |
-
transition: border-color 0.3s; /*
|
| 111 |
}
|
| 112 |
|
| 113 |
.gr-textbox:focus {
|
| 114 |
-
border-color: #333; /*
|
| 115 |
-
outline: none; /*
|
| 116 |
}
|
| 117 |
|
| 118 |
/* Footer Styles */
|
| 119 |
-
/* [
|
| 120 |
|
| 121 |
/* Share Button Styles */
|
| 122 |
#share-btn-container {
|
| 123 |
-
/* [
|
| 124 |
-
border-radius: 20px; /*
|
| 125 |
}
|
| 126 |
|
| 127 |
/* Animation Styles */
|
| 128 |
-
/* [
|
| 129 |
|
| 130 |
/* Gallery Styles */
|
| 131 |
#gallery {
|
| 132 |
-
/* [
|
| 133 |
-
border-radius: 12px; /*
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 134 |
}
|
| 135 |
"""
|
| 136 |
|
|
|
|
| 80 |
max-width: 900px;
|
| 81 |
margin: auto;
|
| 82 |
padding-top: 1.5rem;
|
| 83 |
+
border-radius: 15px; /* 添加圆角边框 */
|
| 84 |
+
box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* 可选:为深度添加阴影 */
|
| 85 |
}
|
| 86 |
|
| 87 |
/* Button Styles */
|
|
|
|
| 90 |
border-color: black;
|
| 91 |
background: black;
|
| 92 |
white-space: nowrap;
|
| 93 |
+
border-radius: 8px; /* 圆角按钮 */
|
| 94 |
+
transition: background-color 0.3s, color 0.3s; /* 平滑的悬停效果过渡 */
|
| 95 |
}
|
| 96 |
|
| 97 |
.gr-button:hover {
|
| 98 |
+
background-color: #555; /* 悬停时略微变亮的黑色 */
|
| 99 |
color: #fff;
|
| 100 |
}
|
| 101 |
|
| 102 |
.gr-button:focus {
|
| 103 |
+
/* [其他焦点样式] */
|
| 104 |
}
|
| 105 |
|
| 106 |
/* Textbox Styles */
|
| 107 |
.gr-textbox {
|
| 108 |
+
border-radius: 8px; /* 文本框的圆角边框 */
|
| 109 |
+
border: 1px solid #ccc; /* 添加微弱的边框 */
|
| 110 |
+
transition: border-color 0.3s; /* 焦点效果的过渡 */
|
| 111 |
}
|
| 112 |
|
| 113 |
.gr-textbox:focus {
|
| 114 |
+
border-color: #333; /* 焦点时较暗的边框 */
|
| 115 |
+
outline: none; /* 移除默认轮廓 */
|
| 116 |
}
|
| 117 |
|
| 118 |
/* Footer Styles */
|
| 119 |
+
/* [这里不需要更改,除非你想要圆角边框] */
|
| 120 |
|
| 121 |
/* Share Button Styles */
|
| 122 |
#share-btn-container {
|
| 123 |
+
/* [现有样式] */
|
| 124 |
+
border-radius: 20px; /* 更圆角的分享按钮容器 */
|
| 125 |
}
|
| 126 |
|
| 127 |
/* Animation Styles */
|
| 128 |
+
/* [这里不需要更改] */
|
| 129 |
|
| 130 |
/* Gallery Styles */
|
| 131 |
#gallery {
|
| 132 |
+
/* [现有样式] */
|
| 133 |
+
border-radius: 12px; /* 图库的圆角边框 */
|
| 134 |
+
}
|
| 135 |
+
|
| 136 |
+
/* 图片大小限制 */
|
| 137 |
+
.gradio-container img {
|
| 138 |
+
max-width: 100%; /* 图片宽度不超过父容器的100% */
|
| 139 |
+
height: auto; /* 自适应高度 */
|
| 140 |
}
|
| 141 |
"""
|
| 142 |
|