商品評價提示
新增商品評價提示與提示對話框 css 樣式,確保 UI 正確。
至 網店設計 > 編輯 HTML/CSS
中theme.css.liquid
檔案貼上以下 css 語法:
.product-review-container {
.condition-bar {
margin-top: 10px;
display: flex;
flex-direction: row;
justify-content: space-between;
}
.condition-bar-text {
padding-left: 10px;
}
.condition-bar-flex-row {
display: flex;
flex-direction: row;
align-items: center;
}
}
.product-review-comments-modal {
&-header {
padding: 16px;
font-size: 16px;
font-weight: 700;
}
&-body {
padding: 0 15px 15px 15px;
border: none;
.modal-content {
background-color: rgba(204, 204, 204, 0.2);
border: none;
box-shadow: none;
border-radius: 0;
padding: 15px;
.modal-content-item-title {
color: #999999;
}
.modal-content-item {
display: flex;
flex-direction: row;
align-items: center;
gap: 8px;
padding-top: 15px;
&:first-child {
padding-top: 0;
}
}
}
}
&-footer {
text-align: right;
padding: 0 15px 20px 15px;
@media (max-width: 767px) {
.btn {
width: 100%;
}
}
}
}
Updated 9 days ago