fix: make 'Rayons' title adaptable to screen width

resources/views/Shop/Shelves/partials/breadcrumb.blade.php

@@ -1,8 +1,6 @@
-<h1 style="font-size: 1.5em;">
+<h1 class="breadcrumb-title">
 	@foreach($breadcrumb ?? [] as $parent)
-		<a href="{{ route('Shop.Categories.show', ['id' => $parent['id']]) }}" style="text-decoration: none; color: inherit;">{{ $parent['name'] }}</a> /
+		<a href="{{ route('Shop.Categories.show', ['id' => $parent['id']]) }}" class="breadcrumb-link">{{ $parent['name'] }}</a> /
 	@endforeach
-	<span style="font-size: 1.4em;">
-		{{ $category['name'] }}
-	</span>
+	<span class="breadcrumb-current">{{ $category['name'] }}</span>
 </h1>

resources/views/Shop/Shelves/partials/category.blade.php

@@ -1,7 +1,7 @@
 <div class="row">
 	<div class="col-8">
-		<h1 style="font-size: 2em;">{{ $category['name'] }}</h1>
-		<h3 style="font-size: 1.2em;">{!! $category['description'] !!}</h3>
+		<h1 class="category-title">{{ $category['name'] }}</h1>
+		<h3 class="category-description">{!! $category['description'] !!}</h3>
 	</div>
 	<div class="col-4">
 		@include('Shop.layout.partials.category_add')
@@ -12,4 +12,4 @@
 	<div class="col-12">
 		@include('Shop.layout.partials.category_articles')
 	</div>
-</div>
+</div>

resources/views/Shop/Shelves/partials/category_articles.blade.php

@@ -1,7 +1,7 @@
-<div class="row">
+<div class="row mx-n1">
 	@if ($articles ?? false)
 		@foreach ($articles as $product_name => $article)
-			<div class="col-lg-3 col-xs-12 mb-3">
+			<div class="category-card col-6 col-md-4 col-lg-3 mb-2 px-1">
 				@include('Shop.Articles.partials.article')
 			</div>
 		@endforeach
@@ -46,4 +46,3 @@
         });
 	</script>
 @endpush
-