0.0.7: update css.
This commit is contained in:
@@ -12,6 +12,6 @@ git clone https://git.licsber.site/ruby/open_explorer
|
||||
## ChangeLog
|
||||
|
||||
```
|
||||
250823周六:(0.0.6)修改按钮出现位置;优化样式
|
||||
250823周六:(0.0.7)修改按钮出现位置;优化样式
|
||||
250823周六:(0.0.1)基础功能
|
||||
```
|
||||
|
@@ -11,7 +11,8 @@
|
||||
<a href="<%= archive_url %>"
|
||||
target="_blank"
|
||||
class="archive-button">
|
||||
<span class="archive-icon">📂</span> 一键打开
|
||||
<span class="archive-icon">📂</span>
|
||||
一键打开
|
||||
</a>
|
||||
<% end %>
|
||||
|
||||
@@ -21,26 +22,55 @@
|
||||
padding: 4px 6px;
|
||||
background: #333;
|
||||
color: white !important;
|
||||
border-radius: 6px;
|
||||
border-radius: 8px;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 4px;
|
||||
gap: 8px;
|
||||
transition: all 0.3s ease;
|
||||
font-size: 14px;
|
||||
font-size: 16px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
text-decoration: none;
|
||||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
|
||||
border: none;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.archive-button::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background: white;
|
||||
transform: scaleX(0);
|
||||
transform-origin: right;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.archive-button:hover {
|
||||
transform: translateY(-2px);
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
|
||||
background: #444;
|
||||
}
|
||||
|
||||
.archive-button:hover::after {
|
||||
transform: scaleX(1);
|
||||
transform-origin: left;
|
||||
}
|
||||
|
||||
.archive-button:active {
|
||||
transform: translateY(1px);
|
||||
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.archive-icon {
|
||||
font-size: 16px;
|
||||
font-size: 20px;
|
||||
transition: transform 0.3s ease;
|
||||
}
|
||||
|
||||
.archive-button:hover .archive-icon {
|
||||
transform: scale(1.2);
|
||||
transform: scale(1.2) rotate(10deg);
|
||||
}
|
||||
</style>
|
||||
|
Reference in New Issue
Block a user