#extends('layouts.app')
#section('content')
<h4 style="text-align:center;">SHOES</h4>
#foreach($shoes as $list)
<div style="margin-top: 40px">
<div class="row d-flex justify-content-md-center">
<div class="card" style="width: 22rem;">
<img class="card-img-top justify-content-center" src="{{ asset("images/$list->shoe_image") }}" alt="" style="width:350px; height:350px;">
{{-- bg-card-pink p-2 m-2 --}}
<div class="card-body">
<h1>{{ $list->shoe_name }}</h1><br>
<h6>{{ $list->shoe_description }}</h6><br>
${{ $list->shoe_price }}<br>
</div>
<a class="btn btn-primary btn-dark" href="/detail/{{ $list->id }}">
SEE DETAILS
</a>
</div>
</div>
</div>
#endforeach
<div class="row d-flex justify-content-md-center mt-4">{{ $shoes->links() }}</div>
#endsection
Anybody had any idea changing the color/style of the pagination button on the blade?
I use default pagination by laravel which is $shoes->links()
You can customize default pagination by exporting pagination files from vendor folder to resources.
To export run in terminal: php artisan vendor:publish --tag=laravel-pagination
See Laravel Docs
Related
hi sorry for my bad engilsh.
im using blade component page in laravel to include a blade page in another blade page
i use component blade page.
i send A VARIABLE that its name is "post" like this
#foreach($posts->skip(1) as $post)
<x-post-card :post="$post"/>
#endforeach
i use #props(['post']) on that page to get the variable
#props(['post'])
and when put 'post'
on #ddd its fine and ok
but when i wonna use its property like 'title' the laravel send me a error that Undefined variable: post
this the way i use property
#props(['post'])
#dd($post)
<article class="transition-colors duration-300 hover:bg-gray-100 border border-black border-opacity-0 hover:border-opacity-5 rounded-xl">
<div class="py-6 px-5 lg:flex">
<div class="flex-1 lg:mr-8">
<img src="/images/illustration-1.png" alt="Blog Post illustration" class="rounded-xl">
</div>
<div class="flex-1 flex flex-col justify-between">
<header class="mt-8 lg:mt-0">
<div class="space-x-2">
{{$post->category->name}}
</div>
<div class="mt-4">
<h1 class="text-3xl .bold">
{{$post->title}}
</h1>
<span class="mt-2 block text-gray-400 text-xs">
Published <time>{{$post->created_at->diffForHumans()}}</time>
</span>
</div>
</header>
<div class="text-sm mt-2">
<p>
{{$post->excerpt}}
</p>
</div>
<footer class="flex justify-between items-center mt-8">
<div class="flex items-center text-sm">
<img src="/images/lary-avatar.svg" alt="Lary avatar">
<div class="ml-3">
<h5 class="font-bold">{{$post->user->name}}</h5>
<h6>Mascot at Laracasts</h6>
</div>
</div>
<div class="hidden lg:block">
Read More
</div>
</footer>
</div>
</div>
</article>
I have this in view. It is able to upload alright but it won't show. Is there anything more I should add?
<div class="col-md-4">
<img class="img img-fluid img-thumbnail" src="/storage/profile_images/{{$profile->profile_image}}"/> </div>
here is my show.blade.php file
<div class="col-md-4">
<img class="img img-fluid img-thumbnail" src="/storage/profile_images/{{$profile->profile_image}}"/></div>
Here is the player.blade.php file:
#if(count($players) > 0)
<?php $index = 0; ?>
#foreach($players as $player)
<div class="col-md-4">
<div class="card mb-1" style="width:300px">
<div class="card-body">
<img class="img img-fluid img-thumbnail" style="height: 170px; width: 350px" src="/storage/profile_images/{{$player->profile_image}}">
</div>
<div class="card-footer">
<div class="row justify-content-center">
{{$names[$index]}}<br>
</div>
<div class="row">
<div class="col-10">
<span class="h6">Team: {{$player->current_fc}}</span><br>
<span class="h6">Position: {{$player->position}}</span><br>
</div>
</div>
</div>
</div>
</div>
<?php $index++; ?>
#endforeach
<div class="col-12 mt-3">
{{$players->appends(request()->input())->links()}}
</div>
#else
<p>No Players available</p>
#endif
Follow above your image issue will be resolved:
Step 1:
Delete storage folder from public
Step 2:
Inside your project run this command
player.blade.php
php artisan storage:link
Step 3:
Replace or change as per this:
show.blade.php
<div class="col-md-4">
<img class="img img-fluid img-thumbnail" src="{{ url('storage/profile_images/.$profile->profile_image) }}" /></div>
Step 4:
Replace or change as per you required:
#if(count($players) > 0)
<?php $index = 0; ?>
#foreach($players as $player)
<div class="col-md-4">
<div class="card mb-1" style="width:300px">
<div class="card-body">
<img class="img img-fluid img-thumbnail" style="height: 170px; width: 350px" src="{{ url('storage/profile_images/.$profile->profile_image) }}">
</div>
<div class="card-footer">
<div class="row justify-content-center">
{{$names[$index]}}<br>
</div>
<div class="row">
<div class="col-10">
<span class="h6">Team: {{$player->current_fc}}</span><br>
<span class="h6">Position: {{$player->position}}</span><br>
</div>
</div>
</div>
</div>
</div>
<?php $index++; ?>
#endforeach
<div class="col-12 mt-3">
{{$players->appends(request()->input())->links()}}
</div>
#else
<p>No Players available</p>
#endif
You can use the asset function like in the example below:
#php
$imgUrl = '/storage/profile_images/'.$profile->profile_image;
#endphp
<img class="img img-fluid img-thumbnail" src="{{ asset($imgUrl)}}"/>
Also make sure that the storage is linked using the following command:
php artisan storage:link
There is an issue in the answer section of this code. The question section works fine, it is just the question.. when dd($questionnaire) answer array is there, but no items are shown.
#extends('layouts.app')
#section('content')
<div class="container">
<div class="row justify-content-center">
<div class="col-md-8">
<div class="card">
<div class="card-header">{{ $questionnaire->title }}</div>
<div class="card-body">
<a class="btn btn-dark" href="/questionnaires/{{ $questionnaire->id }}/questions/create">Create Question</a>
<a class="btn btn-dark" href="/surveys/{{ $questionnaire->id }}-{{ Str::slug($questionnaire->title) }}">Complete Questionnaire</a>
</div>
</div>
#foreach($questionnaire->questions as $question)
<div class="card mt-3">
<div class="card-header">{{ $question->question }}</div>
<div class="card-body">
<ul class="list-group">
#foreach($question->answers as $answer)
<li class="list-group-item">{{ $answer->answers }}</li>
#endforeach
</ul>
</div>
</div>
#endforeach
</div>
</div>
</div>
#endsection
dd Function means die and debug so your script stops at this point. Nothing else runs after dd
im newbie about statamic,
im try to solve this code :
<div class="container">
<div class="intro">
<div class="row">
<div class="col-md-12">
<h2 class="title-uppercase text-white">{{ section_three_title }}</h2>
<div class="row-project-box row">
{{ relate:section_three_categories }}
{{ entries }}
<div class="col-project-box col-sm-6 col-md-4 col-lg-3">
<a href="{{ url }}" class="project-box">
<div class="project-box-inner">
<h5>{{ title }}</h5>
</div>
</a>
</div>
{{ /entries }}
{{ /relate:section_three_categories }}
</div>
view all projects <i class="icon icon-chevron-right"></i>
</div>
</div>
</div>
</div>
the code provide this :
i want to align these box
direzionale operativo dirigenziale not in horizonatal but in vertical like this:
direzionale
operativo
dirigenziale
i think that is a bootstrap configuration but i dont know about the statamic world
anyone can help me ?
thanks a lot
The problem here seems that you are using responsive breakpoints on your columns,
so if you want to set the boxes one below the other all the times you have to set the .col-project-box always be full-width adding this class col-12 and set the .row-project-box horizontal alignment center adding this class justify-content-center to it.
<div class="container">
<div class="intro">
<div class="row">
<div class="col-md-12">
<h2 class="title-uppercase text-white">{{ section_three_title }}</h2>
<div class="row-project-box row justify-content-center">
{{ relate:section_three_categories }}
{{ entries }}
<div class="col-project-box col-12">
<a href="{{ url }}" class="project-box">
<div class="project-box-inner">
<h5>{{ title }}</h5>
</div>
</a>
</div>
{{ /entries }}
{{ /relate:section_three_categories }}
</div>
view all projects <i class="icon icon-chevron-right"></i>
</div>
</div>
</div>
I am using a blade template and I was wanting to know within my foreach what the best way is for me to have it so that my first .panel-heading has another class added to it and then the second one has another etc
Example:
.red
.blue
.red
.blue
.red
Code:
#foreach ($dealsDB as $deal)
<div class="col-md-4">
<div class="panel panel-default">
<div class="panel-heading">
<h4><i class="fa fa-fw fa-gift"></i>{{ $deal->title }}</h4>
</div>
<div class="panel-body">
<p>{{ $deal->content }}</p>
</div>
</div>
</div>
#endforeach
try this
$k=0;
#foreach ($dealsDB as $deal)
<div class="col-md-4">
<div class="panel panel-default">
<div class="panel-heading #if($k%2==0) red #else blue #endif">
<h4><i class="fa fa-fw fa-gift"></i>{{ $deal->title }}</h4>
</div>
<div class="panel-body">
<p>{{ $deal->content }}</p>
</div>
</div>
</div>
$k++;
#endforeach
You can use #switch inside your #foreach to assign different class on every iteration.
#foreach (...)
<div class="
#switch($loop->iteration)
#case(1)
red
#break
#case(2)
green
#break
#case(3)
blue
#break
#default
yellow
#endswitch
">
#endforeach
In Laravel 5.8+, the $loop->odd or $loop->even variables can be used for this.
Furthermore, in Laravel 8.0 the #class directive was added. This is the perfect use case example for it.
In Laravel 5.3+ there is the $loop->iteration which returns the current loop iteration (starts at 1).
Docs:
https://laravel.com/docs/5.8/blade#the-loop-variable
https://laravel.com/docs/8.x/blade#conditional-classes
The following examples will return the exact same result.
Laravel 8+ version
#foreach ($dealsDB as $deal)
<div class="col-md-4">
<div #class([
'panel panel-default',
'red-class' => $loop->odd,
'blue-class' => $loop->even
])>
<div class="panel-heading">
<h4><i class="fa fa-fw fa-gift"></i>{{ $deal->title }}</h4>
</div>
<div class="panel-body">
<p>{{ $deal->content }}</p>
</div>
</div>
</div>
#endforeach
Laravel 5.8+ Version
#foreach ($dealsDB as $deal)
<div class="col-md-4">
<div class="panel panel-default
#if($loop->odd) red-class #else blue-class #endif">
<div class="panel-heading">
<h4><i class="fa fa-fw fa-gift"></i>{{ $deal->title }}</h4>
</div>
<div class="panel-body">
<p>{{ $deal->content }}</p>
</div>
</div>
</div>
#endforeach
Laravel 5.3+ Version
#foreach ($dealsDB as $deal)
<div class="col-md-4">
<div class="panel panel-default
#if($loop->iteration % 2 == 0) blue-class #else red-class #endif">
<div class="panel-heading">
<h4><i class="fa fa-fw fa-gift"></i>{{ $deal->title }}</h4>
</div>
<div class="panel-body">
<p>{{ $deal->content }}</p>
</div>
</div>
</div>
#endforeach