Natalie
ba6940eb81
* chore: update time travelers shop to display seasonal backgrounds * chore: update time travelers banner (note CSS borken rn) * chore: fix borken CSS and update logic in shop * chore: added isSubscribed function, not working * chore: isSubscribed working but no bg for subscribers * chore: logic and css updates * chore: add check for trinket * chore: more time traveler shop logicking * chore(git): heckin habitica-images * refactor(style): indents/readability * refactor(style): one more line break * refactor(style): still more indents * refactor(style): I wonder if lint can help with this stuff * refactor(style): tighten up --------- Co-authored-by: Kalista Payne <sabrecat@gmail.com>
95 lines
1.4 KiB
SCSS
95 lines
1.4 KiB
SCSS
.featured-label {
|
|
margin: 24px auto;
|
|
}
|
|
|
|
.group {
|
|
display: inline-block;
|
|
width: 33%;
|
|
margin-bottom: 24px;
|
|
|
|
.items {
|
|
border-radius: 2px;
|
|
background-color: #edecee;
|
|
display: inline-block;
|
|
padding: 8px;
|
|
}
|
|
|
|
.item-wrapper {
|
|
margin-bottom: 0;
|
|
}
|
|
|
|
.items > div:not(:last-of-type) {
|
|
margin-right: 16px;
|
|
}
|
|
}
|
|
|
|
.timeTravelers {
|
|
.standard-page {
|
|
position: relative;
|
|
}
|
|
|
|
.badge-pin:not(.pinned) {
|
|
display: none;
|
|
}
|
|
|
|
.item:hover .badge-pin {
|
|
display: block;
|
|
}
|
|
|
|
.avatar {
|
|
cursor: default;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.featuredItems {
|
|
height: 192px;
|
|
|
|
.background {
|
|
background-repeat: repeat-x;
|
|
height:216px;
|
|
width: 100%;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
align-items: center;
|
|
}
|
|
.background-open, .background-closed {
|
|
height: 216px;
|
|
}
|
|
|
|
.content {
|
|
display: flex;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.shop-message {
|
|
position: relative;
|
|
height: 76px;
|
|
margin: 71px auto;
|
|
width: 240px;
|
|
}
|
|
|
|
.npc {
|
|
position: absolute;
|
|
left: 0;
|
|
top: 0;
|
|
width: 100%;
|
|
height: 216px;
|
|
background-repeat: no-repeat;
|
|
|
|
&.closed {
|
|
background-repeat: no-repeat;
|
|
}
|
|
|
|
.featured-label {
|
|
position: absolute;
|
|
bottom: -14px;
|
|
margin: 0;
|
|
left: 79px;
|
|
}
|
|
}
|
|
}
|
|
} |