Equipment.css:修订间差异
来自卡厄思梦境WIKI
无编辑摘要 |
无编辑摘要 |
||
| 第1行: | 第1行: | ||
.equipment-manager { | |||
.equipment- | |||
max-width: 1200px; | max-width: 1200px; | ||
margin: | margin: 20px auto; | ||
padding: 20px; | padding: 20px; | ||
font-family: | font-family: sans-serif; | ||
} | } | ||
.equipment- | .equipment-title { | ||
font-size: 24px; | |||
font-weight: bold; | |||
margin-bottom: 20px; | |||
margin-bottom: | |||
color: #333; | color: #333; | ||
} | } | ||
.equipment-button { | |||
.equipment- | |||
display: inline-block; | display: inline-block; | ||
padding: 10px 20px; | padding: 10px 20px; | ||
margin: 5px; | |||
color: | background-color: #f0f0f0; | ||
border: 1px solid #ccc; | |||
border-radius: 4px; | border-radius: 4px; | ||
cursor: pointer; | cursor: pointer; | ||
user-select: none; | |||
transition: all 0.2s; | |||
} | } | ||
.equipment- | .equipment-button:hover { | ||
background-color: # | background-color: #e0e0e0; | ||
} | } | ||
.equipment- | .equipment-button-primary { | ||
background-color: # | background-color: #0066cc; | ||
color: white; | |||
border-color: #0052a3; | |||
} | } | ||
.equipment- | .equipment-button-primary:hover { | ||
background-color: # | background-color: #0052a3; | ||
} | } | ||
.equipment- | .equipment-button-danger { | ||
background-color: # | background-color: #cc0000; | ||
color: white; | |||
border-color: #a30000; | |||
border | |||
} | } | ||
. | .equipment-button-danger:hover { | ||
background-color: #a30000; | |||
} | } | ||
. | .equipment-button-small { | ||
padding: 5px 15px; | |||
padding: | |||
font-size: 14px; | font-size: 14px; | ||
} | } | ||
.equipment-list { | .equipment-list { | ||
margin-top: 20px; | |||
} | } | ||
.equipment-item { | .equipment-item { | ||
display: flex; | display: flex; | ||
justify-content: space-between; | |||
align-items: center; | align-items: center; | ||
padding: 15px; | padding: 15px; | ||
background-color: # | margin-bottom: 10px; | ||
border: 1px solid # | background-color: #f9f9f9; | ||
border: 1px solid #ddd; | |||
border-radius: 4px; | border-radius: 4px; | ||
} | } | ||
.equipment-info { | .equipment-info { | ||
flex: 1; | flex: 1; | ||
} | } | ||
.equipment-name { | .equipment-name { | ||
font-size: | font-size: 18px; | ||
font-weight: bold; | font-weight: bold; | ||
margin-bottom: 5px; | |||
color: #333; | color: #333; | ||
} | } | ||
.equipment-meta { | .equipment-meta { | ||
font-size: 14px; | |||
color: #666; | |||
margin-bottom: 5px; | margin-bottom: 5px; | ||
} | } | ||
.equipment- | .equipment-tags { | ||
font-size: 14px; | |||
color: #888; | |||
font-size: | |||
} | } | ||
.equipment-actions { | |||
. | display: flex; | ||
gap: 5px; | |||
} | } | ||
. | .equipment-overlay { | ||
background-color: | position: fixed; | ||
top: 0; | |||
left: 0; | |||
right: 0; | |||
bottom: 0; | |||
background-color: rgba(0, 0, 0, 0.5); | |||
display: flex; | |||
align-items: center; | |||
justify-content: center; | |||
z-index: 1000; | |||
} | } | ||
. | .equipment-modal { | ||
background: | background-color: white; | ||
border-radius: 8px; | |||
padding: 20px; | |||
max-width: 600px; | |||
max-height: 80vh; | |||
overflow-y: auto; | |||
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); | |||
} | } | ||
.equipment- | .equipment-modal-title { | ||
font-size: 20px; | |||
color: # | font-weight: bold; | ||
margin-bottom: 20px; | |||
color: #333; | |||
} | } | ||
.equipment- | .equipment-form { | ||
margin-bottom: 20px; | |||
} | } | ||
.equipment- | .equipment-form-field { | ||
margin-bottom: 15px; | |||
margin- | |||
} | } | ||
.equipment- | .equipment-form-label { | ||
display: | display: block; | ||
margin-bottom: 5px; | |||
font-weight: bold; | |||
color: #555; | |||
} | } | ||
.equipment- | .equipment-form-input { | ||
padding: | width: 100%; | ||
border | padding: 8px; | ||
border: 1px solid #ccc; | |||
font-size: | border-radius: 4px; | ||
font-size: 14px; | |||
box-sizing: border-box; | |||
} | } | ||
. | .equipment-form-input:focus { | ||
outline: none; | |||
color: # | border-color: #0066cc; | ||
} | } | ||
. | .equipment-form-input[readonly] { | ||
background-color: # | background-color: #f0f0f0; | ||
cursor: not-allowed; | |||
} | } | ||
. | .equipment-modal-actions { | ||
display: flex; | |||
justify-content: flex-end; | |||
gap: 10px; | |||
padding-top: 15px; | |||
border-top: 1px solid #eee; | |||
} | } | ||
2025年10月17日 (五) 19:36的版本
.equipment-manager {
max-width: 1200px;
margin: 20px auto;
padding: 20px;
font-family: sans-serif;
}
.equipment-title {
font-size: 24px;
font-weight: bold;
margin-bottom: 20px;
color: #333;
}
.equipment-button {
display: inline-block;
padding: 10px 20px;
margin: 5px;
background-color: #f0f0f0;
border: 1px solid #ccc;
border-radius: 4px;
cursor: pointer;
user-select: none;
transition: all 0.2s;
}
.equipment-button:hover {
background-color: #e0e0e0;
}
.equipment-button-primary {
background-color: #0066cc;
color: white;
border-color: #0052a3;
}
.equipment-button-primary:hover {
background-color: #0052a3;
}
.equipment-button-danger {
background-color: #cc0000;
color: white;
border-color: #a30000;
}
.equipment-button-danger:hover {
background-color: #a30000;
}
.equipment-button-small {
padding: 5px 15px;
font-size: 14px;
}
.equipment-list {
margin-top: 20px;
}
.equipment-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 15px;
margin-bottom: 10px;
background-color: #f9f9f9;
border: 1px solid #ddd;
border-radius: 4px;
}
.equipment-info {
flex: 1;
}
.equipment-name {
font-size: 18px;
font-weight: bold;
margin-bottom: 5px;
color: #333;
}
.equipment-meta {
font-size: 14px;
color: #666;
margin-bottom: 5px;
}
.equipment-tags {
font-size: 14px;
color: #888;
}
.equipment-actions {
display: flex;
gap: 5px;
}
.equipment-overlay {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0, 0, 0, 0.5);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.equipment-modal {
background-color: white;
border-radius: 8px;
padding: 20px;
max-width: 600px;
max-height: 80vh;
overflow-y: auto;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.equipment-modal-title {
font-size: 20px;
font-weight: bold;
margin-bottom: 20px;
color: #333;
}
.equipment-form {
margin-bottom: 20px;
}
.equipment-form-field {
margin-bottom: 15px;
}
.equipment-form-label {
display: block;
margin-bottom: 5px;
font-weight: bold;
color: #555;
}
.equipment-form-input {
width: 100%;
padding: 8px;
border: 1px solid #ccc;
border-radius: 4px;
font-size: 14px;
box-sizing: border-box;
}
.equipment-form-input:focus {
outline: none;
border-color: #0066cc;
}
.equipment-form-input[readonly] {
background-color: #f0f0f0;
cursor: not-allowed;
}
.equipment-modal-actions {
display: flex;
justify-content: flex-end;
gap: 10px;
padding-top: 15px;
border-top: 1px solid #eee;
}