Skip to content

Commit

Permalink
Merge pull request #10324 from notbakaneko/feature/store-css
Browse files Browse the repository at this point in the history 
Remove fake css grid
  • Loading branch information
@nanaya
nanaya authored Jul 3, 2023
2 parents 5e3d11a + a81ead2 commit 1534b9b
Show file tree
Hide file tree
Showing 12 changed files with 220 additions and 331 deletions.
3 changes: 1 addition & 2 deletions resources/css/bem-index.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -177,8 +177,6 @@
@import "bem/gallery-thumbnails";
@import "bem/game-mode";
@import "bem/game-mode-link";
@import "bem/grid";
@import "bem/grid-cell";
@import "bem/grid-items";
@import "bem/header-buttons";
@import "bem/header-nav-mobile";
Expand Down Expand Up @@ -389,6 +387,7 @@
@import "bem/user-session-list-session";
@import "bem/user-verification";
@import "bem/user-verification-popup";
@import "bem/username-change";
@import "bem/value-display";
@import "bem/warning-box";
@import "bem/wiki-main-page";
Expand Down
1 change: 1 addition & 0 deletions resources/css/bem/address.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,5 @@

.address {
margin-bottom: 20px;
overflow-wrap: break-word;
}
53 changes: 0 additions & 53 deletions resources/css/bem/grid-cell.less
View file

This file was deleted.

44 changes: 0 additions & 44 deletions resources/css/bem/grid.less
View file

This file was deleted.

24 changes: 24 additions & 0 deletions resources/css/bem/store-page.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,15 @@
background-color: @osu-colour-b4;
}

&__address {
@media @narrow-up {
display: grid;
grid-auto-columns: minmax(0, 1fr);
grid-auto-flow: column;
gap: 33%; // preserve the weird 3 "column" appearance
}
}

&__option {
text-transform: inherit;
margin: 0;
Expand All @@ -34,4 +43,19 @@
margin-bottom: 20px;
}
}

&__invoice-header {
display: flex;
gap: 10px;
justify-content: space-between;
}

&__product {
@media @desktop {
display: grid;
grid-auto-columns: minmax(0, 1fr);
grid-auto-flow: column;
gap: 40px;
}
}
}
2 changes: 2 additions & 0 deletions resources/css/bem/store-slider.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -91,7 +91,9 @@
}

&__presets {
display: flex;
align-items: center;
justify-content: flex-end;
font-size: @preset-font-size;
}

Expand Down
10 changes: 10 additions & 0 deletions resources/css/bem/username-change.less
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the GNU Affero General Public License v3.0.
// See the LICENCE file in the repository root for full licence text.

.username-change {
@media @desktop {
display: grid;
gap: 40px;
grid-template-columns: auto repeat(2, minmax(0, 1fr));
}
}
12 changes: 5 additions & 7 deletions resources/views/store/invoice.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,13 +9,11 @@

<div class="osu-page osu-page--store">
@if (Request::has('thanks'))
<div class="grid grid--gutters no-print store-page">
<div class="grid-cell grid-cell--fill">
<h1 class="store-text store-text--title">Thanks for your order!</h1>
<p>
You will receive a confirmation email soon. If you have any enquiries, please <a href='mailto:osustore@ppy.sh'>contact us</a>!
</p>
</div>
<div class="no-print store-page">
<h1 class="store-text store-text--title">Thanks for your order!</h1>
<p>
You will receive a confirmation email soon. If you have any enquiries, please <a href='mailto:osustore@ppy.sh'>contact us</a>!
</p>
</div>
@endif

Expand Down
145 changes: 66 additions & 79 deletions resources/views/store/orders/_details.blade.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,99 +2,86 @@
Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the GNU Affero General Public License v3.0.
See the LICENCE file in the repository root for full licence text.
--}}
<div class="grid grid--gutters store-page">
<div class="grid-cell grid-cell--fill">
<div class="grid grid--xs">
<div class="grid-cell">
<div>
<h1 class="store-text store-text--title">Invoice</h1>
</div>
<div>
Date:
@if($order->shipped_at)
{{ $order->shipped_at->toDateString() }}
@elseif($order->paid_at)
{{ $order->paid_at->toDateString() }}
@else
{{ $order->updated_at->toDateString() }}
@endif
</div>
</div>
<div class="grid-cell grid-cell--minimum">
<p>
<em class="store-text store-text--emphasis">ppy Pty Ltd</em><br />
ACN 163 593 413 a.t.f. Dean Herbert Family Trust
</p>

<p>contact: pe@ppy.sh / +81 80 1381 1430</p>
<div class="store-page">
<div class="store-page__invoice-header">
<div>
<h1 class="store-text store-text--title">Invoice</h1>
<div>
Date:
@if($order->shipped_at)
{{ $order->shipped_at->toDateString() }}
@elseif($order->paid_at)
{{ $order->paid_at->toDateString() }}
@else
{{ $order->updated_at->toDateString() }}
@endif
</div>
</div>
<div>
<p>
<em class="store-text store-text--emphasis">ppy Pty Ltd</em><br />
ACN 163 593 413 a.t.f. Dean Herbert Family Trust
</p>

<hr />
<p>contact: pe@ppy.sh / +81 80 1381 1430</p>
</div>
</div>

@if($order->address !== null)
<div class="grid grid--xs">
<div class="grid-cell grid-cell--1of3">
<h4 class="store-text store-text--title store-text--title-small">Sent Via:</h4>
<hr />

<div class='address'>
osu!store
</div>
</div>
@if($order->address !== null)
<div class="store-page__address">
<div>
<h4 class="store-text store-text--title store-text--title-small">Sent Via:</h4>

<div class="grid-cell grid-cell--1of3">
</div>

<div class="grid-cell grid-cell--1of3">
<h4 class="store-text store-text--title store-text--title-small">Shipping To:</h4>

@include('store.objects.address', ['data' => $order->address])
<div class='address'>
osu!store
</div>
</div>
@endif

<div class="grid">
<div class="grid-cell">
<h3 class="store-text store-text--title">Order Details</h3>
</div>
</div>

<div class="grid">
<div class="grid-cell">
@include('store.objects.order', [
'order' => $order,
'weight' => true,
'checkout' => false,
])
<div>
<h4 class="store-text store-text--title store-text--title-small">Shipping To:</h4>

@if ($order->isHideSupporterFromActivity())
{{ osu_trans('store.invoice.hide_from_activity') }}
@endif
@include('store.objects.address', ['data' => $order->address])
</div>
</div>
@endif

<div class="store-page__order-details">
<h3 class="store-text store-text--title">Order Details</h3>

@if ($order->address !== null)
@php
$showTrackingCode = ($order->isShipped() || $order->isDelivered() || Auth::user()->isAdmin()) && $order->tracking_code;
@include('store.objects.order', [
'order' => $order,
'weight' => true,
'checkout' => false,
])

$transactionDetails = [
'Salesperson' => 'osu!store',
'Order #' => "#{$order->order_id}",
'Shipping Method' => $showTrackingCode ? 'EMS ('.trim($order->tracking_code).')' : 'N/A',
'Shipping Terms' => 'FOB Japan',
'Payment Terms' => studly_case($order->getPaymentProvider()).' ('.$order->getPaymentStatusText().')',
];
@endphp
<dl class="store-transaction-info">
@foreach ($transactionDetails as $key => $value)
<dt class="store-transaction-info__entry store-transaction-info__entry--term">
{{ $key }}
</dt>
<dd class="store-transaction-info__entry">
{{ $value }}
</dd>
@endforeach
</dl>
@if ($order->isHideSupporterFromActivity())
{{ osu_trans('store.invoice.hide_from_activity') }}
@endif
</div>

@if ($order->address !== null)
@php
$showTrackingCode = ($order->isShipped() || $order->isDelivered() || Auth::user()->isAdmin()) && $order->tracking_code;
$transactionDetails = [
'Salesperson' => 'osu!store',
'Order #' => "#{$order->order_id}",
'Shipping Method' => $showTrackingCode ? 'EMS ('.trim($order->tracking_code).')' : 'N/A',
'Shipping Terms' => 'FOB Japan',
'Payment Terms' => studly_case($order->getPaymentProvider()).' ('.$order->getPaymentStatusText().')',
];
@endphp
<dl class="store-transaction-info">
@foreach ($transactionDetails as $key => $value)
<dt class="store-transaction-info__entry store-transaction-info__entry--term">
{{ $key }}
</dt>
<dd class="store-transaction-info__entry">
{{ $value }}
</dd>
@endforeach
</dl>
@endif
</div>
Loading

0 comments on commit 1534b9b

Please sign in to comment.