mirror of
https://github.com/TryGhost/Ghost.git
synced 2024-11-28 14:03:48 +03:00
Added frontend CSS file for product card
refs https://github.com/TryGhost/Team/issues/1233
This commit is contained in:
parent
16a73f7017
commit
bf78df0e07
104
core/frontend/src/cards/css/product.css
Normal file
104
core/frontend/src/cards/css/product.css
Normal file
@ -0,0 +1,104 @@
|
||||
.kg-product-card {
|
||||
display: flex;
|
||||
background: transparent;
|
||||
box-shadow: inset 0 0 0 1px rgb(124 139 154 / 25%);
|
||||
border-radius: 5px;
|
||||
flex-direction: column;
|
||||
text-decoration: none;
|
||||
min-width: 512px;
|
||||
max-width: 512px;
|
||||
padding: 20px;
|
||||
}
|
||||
|
||||
.kg-product-card-image, .kg-product-card-image-placeholder {
|
||||
margin-bottom: 1.6rem;
|
||||
}
|
||||
|
||||
.kg-product-card-trash-icon svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.kg-product-card-trash-icon path {
|
||||
fill: #15171a;
|
||||
}
|
||||
|
||||
.kg-product-card-header {
|
||||
display: flex;
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.kg-product-card-title-container {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.kg-product-card-title, .kg-product-card-title h4 {
|
||||
text-decoration: none;
|
||||
color: #15171A;
|
||||
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Droid Sans,Helvetica Neue,sans-serif;
|
||||
font-weight: 700 !important;
|
||||
font-size: 1.9rem !important;
|
||||
}
|
||||
|
||||
.kg-product-card-title ::after {
|
||||
font-weight: 700 !important;
|
||||
font-size: 2rem !important;
|
||||
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Droid Sans,Helvetica Neue,sans-serif;
|
||||
letter-spacing: .02rem;
|
||||
line-height: 1.4em;
|
||||
}
|
||||
|
||||
.kg-product-card-description, .kg-product-card-description p {
|
||||
font-size: 1.4rem !important;
|
||||
line-height: 1.6em;
|
||||
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Droid Sans,Helvetica Neue,sans-serif !important;
|
||||
color: #656E7A;
|
||||
margin-top: 8px !important;
|
||||
}
|
||||
|
||||
.kg-product-card-description ::after {
|
||||
font-size: 1.4rem !important;
|
||||
line-height: 1.6em;
|
||||
font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Droid Sans,Helvetica Neue,sans-serif !important;
|
||||
}
|
||||
|
||||
.kg-product-card-button {
|
||||
width: 100%;
|
||||
margin-top: 24px;
|
||||
}
|
||||
|
||||
.kg-product-card-rating-star {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 2.4rem;
|
||||
width: 2.4rem;
|
||||
}
|
||||
|
||||
.kg-product-card-rating-star svg {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
fill: #fff;
|
||||
}
|
||||
|
||||
.kg-product-card-rating-edit .kg-product-card-rating-star:hover {
|
||||
opacity: 0.7;
|
||||
}
|
||||
|
||||
.kg-product-card-rating-edit {
|
||||
background: none;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.kg-product-card-rating-preview {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.kg-product-card-rating-star path {
|
||||
fill: var(--whitegrey);
|
||||
}
|
||||
|
||||
.kg-product-card-rating-active.kg-product-card-rating-star path {
|
||||
fill: var(--darkgrey);
|
||||
}
|
Loading…
Reference in New Issue
Block a user