diff --git a/pages/settings/settings.pixy b/pages/settings/settings.pixy index 99cee268..2a8dfa0a 100644 --- a/pages/settings/settings.pixy +++ b/pages/settings/settings.pixy @@ -1,3 +1,7 @@ +component SettingsTabs + .tabs + Tab("Personal", "user", "/settings/personal") + component Settings(user *arn.User) h1.page-title Settings diff --git a/pages/settings/settings.scarlet b/pages/settings/settings.scarlet index 5425717f..1bd383ff 100644 --- a/pages/settings/settings.scarlet +++ b/pages/settings/settings.scarlet @@ -1,5 +1,8 @@ .settings - horizontal-wrap-center + vertical + margin 0 auto + width 100% + max-width 400px .widget-section > button, .widget-section > .button diff --git a/pages/shop/history.pixy b/pages/shop/history.pixy index 0992e59f..914ed05b 100644 --- a/pages/shop/history.pixy +++ b/pages/shop/history.pixy @@ -4,7 +4,7 @@ component PurchaseHistory(purchases []*arn.Purchase, user *arn.User) h1.page-title Purchase History if len(purchases) == 0 - p.text-center.mountable You haven't bought anything yet. + p.text-center.mountable You haven't bought any items yet. else table thead diff --git a/pages/shop/shop.pixy b/pages/shop/shop.pixy index db8edda8..d0e97467 100644 --- a/pages/shop/shop.pixy +++ b/pages/shop/shop.pixy @@ -15,8 +15,8 @@ component ShopTabs(user *arn.User) Tab(strconv.Itoa(user.Balance), "diamond", "/charge") component ShopItem(item *arn.Item) - .widget.shop-item.mountable(data-item-id=item.ID) - h3.widget-title.shop-item-name + .shop-item.mountable(data-item-id=item.ID) + h3.shop-item-name .item-icon Icon(item.Icon) span= item.Name @@ -24,5 +24,5 @@ component ShopItem(item *arn.Item) .shop-item-description!= markdown.Render(item.Description) .buttons.shop-buttons button.shop-button-buy.action(data-item-id=item.ID, data-item-name=item.Name, data-price=item.Price, data-trigger="click", data-action="buyItem") - span.shop-item-price= item.Price + span.shop-item-price= "Buy for " + toString(item.Price) Icon("diamond") \ No newline at end of file diff --git a/pages/shop/shop.scarlet b/pages/shop/shop.scarlet index a99e56e2..1a70c6df 100644 --- a/pages/shop/shop.scarlet +++ b/pages/shop/shop.scarlet @@ -2,7 +2,21 @@ item-color-pro-account = hsl(0, 100%, 71%) item-color-anime-support-ticket = hsl(217, 64%, 50%) .shop-items - // ... + horizontal-wrap + justify-content space-around + +.shop-item + ui-element + flex 1 + flex-basis 380px + margin calc(content-padding / 2) + padding 0.5rem 1rem + +.shop-item-name + font-size 1.7rem + text-align center + padding 0.75rem 0 + // border-bottom 1px solid rgba(0, 0, 0, 0.1) .item-icon display inline-block diff --git a/patches/add-shop-items/add-shop-items.go b/patches/add-shop-items/add-shop-items.go index 8c44fd5d..4d79929b 100644 --- a/patches/add-shop-items/add-shop-items.go +++ b/patches/add-shop-items/add-shop-items.go @@ -7,7 +7,7 @@ var items = []*arn.Item{ ID: "pro-account-3", Name: "PRO Account (1 season)", Price: 900, - Description: `PRO account for 1 anime season (3 months). + Description: `PRO status for 1 anime season (3 months). 1 month equals 300 gems. @@ -28,9 +28,9 @@ Includes: ID: "pro-account-6", Name: "PRO Account (2 seasons)", Price: 1600, - Description: `PRO account for 2 anime seasons (6 months). + Description: `PRO status for 2 anime seasons (6 months). -11% less monthly costs compared to standard. +11% less monthly costs compared to 1 season. Includes: @@ -49,9 +49,9 @@ Includes: ID: "pro-account-12", Name: "PRO Account (4 seasons)", Price: 3000, - Description: `PRO account for 4 anime seasons (12 months). + Description: `PRO status for 4 anime seasons (12 months). -16% less monthly costs compared to standard. +16% less monthly costs compared to 1 season. Includes: @@ -70,9 +70,9 @@ Includes: ID: "pro-account-24", Name: "PRO Account (8 seasons)", Price: 5900, - Description: `PRO account for 8 anime seasons (24 months). + Description: `PRO status for 8 anime seasons (24 months). -18% less monthly costs compared to standard. +18% less monthly costs compared to 1 season. Includes: diff --git a/styles/include/dark.scarlet b/styles/include/dark.scarlet index b47a9495..b55c961d 100644 --- a/styles/include/dark.scarlet +++ b/styles/include/dark.scarlet @@ -1,37 +1,37 @@ -// Dark theme +// // Dark theme -// Main color -hue = 45 -saturation = 100% +// // Main color +// hue = 45 +// saturation = 100% -// Main -text-color = hsl(0, 0%, 90%) -bg-color = hsl(0, 0%, 24%) -link-color = hsl(hue, saturation, 66%) -link-hover-color = hsl(hue, saturation, 76%) -link-hover-text-shadow = 0 0 8px hsla(hue, saturation, 66%, 0.5) -ui-background = hsla(0, 0%, 8%, 0.3) -sidebar-background = rgba(0, 0, 0, 0.2) -sidebar-opaque-background = ui-background -table-row-hover-background = hsla(0, 0%, 100%, 0.01) +// // Main +// text-color = hsl(0, 0%, 90%) +// bg-color = hsl(0, 0%, 24%) +// link-color = hsl(hue, saturation, 66%) +// link-hover-color = hsl(hue, saturation, 76%) +// link-hover-text-shadow = 0 0 8px hsla(hue, saturation, 66%, 0.5) +// ui-background = hsla(0, 0%, 8%, 0.3) +// sidebar-background = rgba(0, 0, 0, 0.2) +// sidebar-opaque-background = ui-background +// table-row-hover-background = hsla(0, 0%, 100%, 0.01) -// White/black -theme-white = bg-color -theme-black = text-color +// // White/black +// theme-white = bg-color +// theme-black = text-color -main-color = link-color -link-active-color = link-hover-color -button-hover-color = link-hover-color -button-hover-background = hsla(0, 0%, 12%, 0.5) -tab-background = hsla(0, 0%, 0%, 0.1) -tab-hover-background = hsla(0, 0%, 0%, 0.2) -tab-active-color = hsl(0, 0%, 95%) -tab-active-background = hsla(0, 0%, 2%, 0.5) -loading-anim-color = link-color -anime-alternative-title-color = hsla(0, 0%, 100%, 0.5) -anime-list-item-name-color = text-color +// main-color = link-color +// link-active-color = link-hover-color +// button-hover-color = link-hover-color +// button-hover-background = hsla(0, 0%, 12%, 0.5) +// tab-background = hsla(0, 0%, 0%, 0.1) +// tab-hover-background = hsla(0, 0%, 0%, 0.2) +// tab-active-color = hsl(0, 0%, 95%) +// tab-active-background = hsla(0, 0%, 2%, 0.5) +// loading-anim-color = link-color +// anime-alternative-title-color = hsla(0, 0%, 100%, 0.5) +// anime-list-item-name-color = text-color -// Forum -post-like-color = link-color -post-unlike-color = link-color -post-permalink-color = link-color \ No newline at end of file +// // Forum +// post-like-color = link-color +// post-unlike-color = link-color +// post-permalink-color = link-color \ No newline at end of file