Skip to content

Commit

Permalink
add bootstrap 5
Browse files Browse the repository at this point in the history
  • Loading branch information
Liocha committed Feb 1, 2021
1 parent db1036a commit 9d637b4
Show file tree
Hide file tree
Showing 26 changed files with 1,041 additions and 511 deletions.
1,346 changes: 935 additions & 411 deletions package-lock.json

Large diffs are not rendered by default.

7 changes: 4 additions & 3 deletions package.json
Expand Up @@ -11,11 +11,12 @@
"heroku-postbuild": "npm run production"
},
"dependencies": {
"axios": "^0.21",
"bootstrap": "^4.4.1",
"@popperjs/core": "^2.6.0",
"axios": "^0.21.1",
"bootstrap": "^5.0.0-beta1",
"cross-env": "^5.1",
"highlight.js": "^10.4.1",
"jquery": "~3.4.1",
"jquery": "^3.5.1",
"jquery-ujs": "^1.2.2",
"laravel-mix": "^4.0.7",
"lodash": "^4.17.19",
Expand Down
10 changes: 10 additions & 0 deletions resources/sass/_variables.scss
Expand Up @@ -25,3 +25,13 @@ $link-hover-color: $orange;

$carousel-control-color: $gray;
$carousel-indicator-active-bg: $gray;

$enable-negative-margins: true;

$container-max-widths: (
sm: 540px,
md: 720px,
lg: 960px,
xl: 1140px,
xxl: 1140px
);
2 changes: 1 addition & 1 deletion resources/views/chapter/list.blade.php
Expand Up @@ -13,7 +13,7 @@
</a>
<br>
@if($chapter->exercises->isNotEmpty())
<a data-toggle="collapse"
<a data-bs-toggle="collapse"
href="#collapse{{ $chapter->id }}"
aria-expanded="false"
aria-controls="collapse{{ $chapter->id }}">
Expand Down
19 changes: 9 additions & 10 deletions resources/views/chapter/show.blade.php
Expand Up @@ -15,11 +15,11 @@
<div class="row justify-content-center">
<div class="sticky-top col-md-12 d-flex justify-content-between">
@if($previousChapter->exists)
<a class="mr-auto"
<a class="me-auto"
href="{{ route('chapters.show', $previousChapter) }}">@lang('chapter.show.previous_chapter')</a>
@endif
@if($nextChapter->exists)
<a class="ml-auto"
<a class="ms-auto"
href="{{ route('chapters.show', $nextChapter) }}">@lang('chapter.show.next_chapter')</a>
@endif
</div>
Expand All @@ -37,7 +37,7 @@
<a class="text-muted"
target="_blank"
href="{{ getChapterOriginLink($chapter) }}"
data-toggle="tooltip"
data-bs-toggle="tooltip"
data-placement="right"
title="{{ __('layout.common.origin') }}">
<i class="fas fa-external-link-alt"></i>
Expand Down Expand Up @@ -80,27 +80,26 @@
@if ($isCompletedChapter)
<a href="{{ route('users.chapters.destroy', [$authUser, $chapter]) }}"
class="text-decoration-none"
data-toggle="tooltip"
data-bs-toggle="tooltip"
data-placement="bottom"
data-confirm="{{ __('chapter.remove_completed_chapter', ['chapter_path' => $chapter->path]) }}"
data-method="delete">
<span class="pl-2">{{ __('layout.common.cancel') }}</span>
<span class="ps-2">{{ __('layout.common.cancel') }}</span>
</a>
@endif
{{ BsForm::close() }}
@endauth
@if ($chapter->users->isNotEmpty())
<br/>
<button type="button" class="btn btn-primary" data-toggle="modal"
data-target="#modalCart">{{ __('chapter.show.who_completed') }}</button>
<button type="button" class="btn btn-primary" data-bs-toggle="modal"
data-bs-target="#modalCart">{{ __('chapter.show.who_completed') }}</button>
<div class="modal fade" id="modalCart" tabindex="-1" role="dialog"
aria-labelledby="exampleModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="myModalLabel">{{ __('chapter.show.completed_by') }}</h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
</button>
</div>
<div class="modal-body">
Expand All @@ -112,7 +111,7 @@ class="text-decoration-none"
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-primary"
data-dismiss="modal">{{ __('layout.common.close') }}</button>
data-bs-dismiss="modal">{{ __('layout.common.close') }}</button>
</div>
</div>
</div>
Expand Down
14 changes: 7 additions & 7 deletions resources/views/components/comment/_comment.blade.php
Expand Up @@ -24,23 +24,23 @@
</h5>
@if ($comment->isReply())
<div class="border my-2">
<div class="small text-muted ml-2">{{ $comment->parent->content }}</div>
<div class="small text-muted ms-2">{{ $comment->parent->content }}</div>
</div>
@endif
<div class="my-2">{{ $comment->content }}</div>
<div>
@can('reply', $comment)
<button
data-toggle="modal"
data-target="#reply-modal-{{ $comment->id }}"
class="btn btn-sm btn-link text-uppercase p-0 mr-2">
data-bs-toggle="modal"
data-bs-target="#reply-modal-{{ $comment->id }}"
class="btn btn-sm btn-link text-uppercase p-0 me-2">
{{ __('comment.reply') }}
</button>
@endcan
@can('update', $comment)
<button data-toggle="modal"
data-target="#comment-modal-{{ $comment->id }}"
class="btn btn-sm btn-link text-uppercase p-0 mr-2">
<button data-bs-toggle="modal"
data-bs-target="#comment-modal-{{ $comment->id }}"
class="btn btn-sm btn-link text-uppercase p-0 me-2">
{{ __('comment.edit') }}
</button>
@endcan
Expand Down
2 changes: 1 addition & 1 deletion resources/views/components/comment/_form.blade.php
Expand Up @@ -8,7 +8,7 @@
{{ BsForm::open(route('comments.store')) }}
{{ Form::hidden('commentable_type', get_class($model)) }}
{{ Form::hidden('commentable_id', $model->id) }}
{{ BsForm::textarea('content')->label(__('comment.enter_your_message'))->required()->attribute('rows', 5) }}
{{ BsForm::textarea('content')->label(__('comment.enter_your_message'))->required()->attribute(['rows' => 5, "class" => "form-control mb-3"]) }}
{{ BsForm::submit(__('comment.submit'))->attribute('class', 'btn btn-success btn-sm text-uppercase') }}
{{ BsForm::close() }}
</div>
Expand Down
10 changes: 4 additions & 6 deletions resources/views/components/comment/_modal.blade.php
Expand Up @@ -13,18 +13,16 @@
{{ BsForm::open(route('comments.update', ['comment' => $comment]), ['method' => $method]) }}
<div class="modal-header">
<h5 class="modal-title">{{ __($modalTitle) }}</h5>
<button type="button" class="close" data-dismiss="modal">
<span>&times;</span>
</button>
<button type="button" class="btn-close" data-bs-dismiss="modal"></button>
</div>
<div class="modal-body">
{{ Form::hidden('commentable_type', $comment->commentable_type) }}
{{ Form::hidden('commentable_id', $comment->commentable_id) }}
{{ BsForm::textarea('content', $comment->content)->label(__('comment.update_comment_here'))->required()->attribute('rows', 3) }}
{{ BsForm::textarea('content', $comment->content)->label(__('comment.update_comment_here'))->required()->attribute(['rows' => 3, "class" => "form-control mb-3"]) }}
</div>
<div class="modal-footer text-left">
<div class="modal-footer text-start">
{{ BsForm::submit(__($submitLabel))->attribute('class', 'btn btn-success btn-sm text-uppercase') }}
{{ Form::button(__('comment.cancel'), ['class' => 'btn btn-secondary btn-sm text-uppercase mr-auto', 'data-dismiss' => 'modal']) }}
{{ Form::button(__('comment.cancel'), ['class' => 'btn btn-secondary btn-sm text-uppercase me-auto', 'data-bs-dismiss' => 'modal']) }}
</div>
{{ BsForm::close() }}
</div>
Expand Down
9 changes: 4 additions & 5 deletions resources/views/components/comment/reply/_modal.blade.php
Expand Up @@ -4,19 +4,18 @@
{{ BsForm::open(route('comments.store')) }}
<div class="modal-header">
<h5 class="modal-title">{{ __('comment.reply_to_comment') }}</h5>
<button type="button" class="close" data-dismiss="modal">
<span>&times;</span>
<button type="button" class="btn-close" data-bs-dismiss="modal">
</button>
</div>
<div class="modal-body">
{{ Form::hidden('commentable_type', $comment->commentable_type) }}
{{ Form::hidden('commentable_id', $comment->commentable_id) }}
{{ Form::hidden('parent_id', $comment->id) }}
{{ BsForm::textarea('content')->label(__('comment.enter_your_message'))->required()->attribute('rows', 5) }}
{{ BsForm::textarea('content')->label(__('comment.enter_your_message'))->required()->attribute(['rows' => 5, "class" => "form-control mb-3"]) }}
</div>
<div class="modal-footer text-left">
<div class="modal-footer text-start">
{{ BsForm::submit(__('comment.reply'))->attribute('class', 'btn btn-success btn-sm text-uppercase') }}
{{ Form::button(__('comment.cancel'), ['class' => 'btn btn-secondary btn-sm text-uppercase mr-auto', 'data-dismiss' => 'modal']) }}
{{ Form::button(__('comment.cancel'), ['class' => 'btn btn-secondary btn-sm text-uppercase me-auto', 'data-bs-dismiss' => 'modal']) }}
</div>
{{ BsForm::close() }}
</div>
Expand Down
2 changes: 1 addition & 1 deletion resources/views/components/solution/_form.blade.php
Expand Up @@ -7,7 +7,7 @@
@endphp
<div>
{{ BsForm::open(route('users.solutions.store', [$authUser])) }}
{{ BsForm::textarea('content')->placeholder(__('solution.placeholder'))->required()->attribute('rows', 10) }}
{{ BsForm::textarea('content')->placeholder(__('solution.placeholder'))->required()->attribute(['rows' => 10, "class" => "form-control mb-3"]) }}
{{ Form::hidden('exercise_id', $exercise->id) }}
<div class="d-flex justify-content-end">
{{ BsForm::submit(__('solution.save'))->primary() }}
Expand Down
12 changes: 5 additions & 7 deletions resources/views/components/solutions.blade.php
Expand Up @@ -11,8 +11,7 @@
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">{{ __('solution.title_add_solution') }}</h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
</button>
</div>
<div class="modal-body">
Expand All @@ -27,18 +26,17 @@
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">{{ __('solution.title_output_solution') }}</h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
</button>
</div>
<div class="modal-body">
@foreach ($userSolutions as $solution)
<p class="bg-light py-2 pl-1"><a href="{{ route('users.solutions.show', [$authUser, $solution]) }}">{{ $solution->created_at }}</a></p>
<pre class="ml-4 mb-2"><code>{{ $solution->content }}</code></pre>
<p class="bg-light py-2 ps-1"><a href="{{ route('users.solutions.show', [$authUser, $solution]) }}">{{ $solution->created_at }}</a></p>
<pre class="ms-4 mb-2"><code>{{ $solution->content }}</code></pre>
@endforeach
</div>
<div class="modal-footer">
<button type="button" class="btn btn-primary" data-dismiss="modal">{{ __('layout.common.close') }}</button>
<button type="button" class="btn btn-primary" data-db-dismiss="modal">{{ __('layout.common.close') }}</button>
</div>
</div>
</div>
Expand Down
4 changes: 2 additions & 2 deletions resources/views/exercise/index.blade.php
Expand Up @@ -19,7 +19,7 @@
<li class="nav-item">
<a class="nav-link {{ $rootChapterPath === 1 ? 'active' : '' }}"
id="subChapters{{ $rootChapterPath }}-tab"
href="#subChapters{{ $rootChapterPath }}" data-toggle="tab" role="tab"
href="#subChapters{{ $rootChapterPath }}" data-bs-toggle="tab" role="tab"
aria-controls="subChapters{{ $rootChapterPath }}"
aria-selected="{{ $rootChapterPath === '1' ? 'true' : 'false' }}">
{{ $rootChapterPath }}. {{ getChapterName($rootChapterPath) }}
Expand All @@ -29,7 +29,7 @@
</ul>
</div>
<div class="col-12 col-md-8">
<div class="card pl-2 pr-3">
<div class="card ps-2 pe-3">
<div class="tab-content">
@foreach($exercisesGroups as $rootChapterPath => $exercises)
<div class="tab-pane card-body {{ $rootChapterPath === 1 ? 'active' : '' }}"
Expand Down
29 changes: 14 additions & 15 deletions resources/views/exercise/show.blade.php
Expand Up @@ -13,7 +13,7 @@
<div class="row justify-content-center">
<div class="sticky-top col-md-12 d-flex justify-content-between">
@if($previousExercise->exists)
<a class="mr-auto text-decoration-none" href="{{ route('exercises.show', $previousExercise) }}">
<a class="me-auto text-decoration-none" href="{{ route('exercises.show', $previousExercise) }}">
<svg class="bi bi-arrow-left" width="2em" height="2em" viewBox="0 0 16 16" fill="currentColor"
xmlns="http://www.w3.org/2000/svg">
<path fill-rule="evenodd"
Expand All @@ -24,7 +24,7 @@
</a>
@endif
@if($nextExercise->exists)
<a class="ml-auto text-decoration-none" href="{{ route('exercises.show', $nextExercise) }}">
<a class="ms-auto text-decoration-none" href="{{ route('exercises.show', $nextExercise) }}">
@lang('exercise.show.next')
<svg class="bi bi-arrow-right" width="2em" height="2em" viewBox="0 0 16 16" fill="currentColor"
xmlns="http://www.w3.org/2000/svg">
Expand All @@ -50,8 +50,8 @@
<a class="text-muted"
target="_blank"
href="{{ getExerciseOriginLink($exercise) }}"
data-toggle="tooltip"
data-placement="right"
data-bs-toggle="tooltip"
data-bs-placement="right"
title="{{ __('layout.common.origin') }}">
<i class="fas fa-external-link-alt"></i>
</a>
Expand All @@ -75,19 +75,19 @@
<div>
@auth
<div class="d-flex mb-4">
<button type="button" class="mr-1 btn btn-primary" data-toggle="modal"
data-target="#interExercise">{{ __('solution.add_solution') }}</button>
<button type="button" class="me-1 btn btn-primary" data-bs-toggle="modal"
data-bs-target="#interExercise">{{ __('solution.add_solution') }}</button>
@if($exercise->solutions()->exists())
<a
class="btn btn-secondary mr-1"
class="btn btn-secondary me-1"
href="{{ route('solutions.index', ['filter' => ['exercise_id' => $exercise->id]]) }}"
role="button">
{{ __('views.exercise.show.buttons.show_solutions') }}
</a>
@endif
@if(!$userSolutions->isEmpty())
<button type="button" class="mr-1 btn btn-primary btn-light" data-toggle="modal"
data-target="#showExercises">{{ __('solution.show_solution') }}</button>
<button type="button" class="me-1 btn btn-primary btn-light" data-bs-toggle="modal"
data-bs-target="#showExercises">{{ __('solution.show_solution') }}</button>
@endif

@solutions(['exercise' => $exercise, 'userSolutions' => $userSolutions])
Expand All @@ -104,12 +104,12 @@ class="btn btn-secondary mr-1"
@if ($userCompletedExercise)
<a href="{{ route('users.exercises.destroy', [$authUser, $exercise]) }}"
class="text-decoration-none"
data-toggle="tooltip"
data-bs-toggle="tooltip"
data-placement="bottom"
title="{{ __('exercise.remove_completed_exercise', ['exercise_path' => $exercise->path]) }}"
data-confirm="{{ __('exercise.remove_completed_exercise', ['exercise_path' => $exercise->path]) }}?"
data-method="delete">
<span class="pl-2">{{ __('layout.common.cancel') }}</span>
<span class="ps-2">{{ __('layout.common.cancel') }}</span>
</a>
@endif
{{ BsForm::close() }}
Expand All @@ -118,7 +118,7 @@ class="text-decoration-none"
@if($exercise->users->isEmpty())
<p>{{ __('exercise.show.nobody_completed') }}</p>
@else
<button type="button" class="btn btn-primary" data-toggle="modal"
<button type="button" class="btn btn-primary" data-bs-toggle="modal"
data-target="#modalCart">{{ __('exercise.show.who_completed') }}</button>
<div class="modal fade" id="modalCart" tabindex="-1" role="dialog"
aria-labelledby="exampleModalLabel" aria-hidden="true">
Expand All @@ -127,8 +127,7 @@ class="text-decoration-none"
<div class="modal-header">
<h4 class="modal-title"
id="myModalLabel">{{ __('exercise.show.completed_by') }}</h4>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close">
</button>
</div>
<div class="modal-body">
Expand All @@ -140,7 +139,7 @@ class="text-decoration-none"
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-primary"
data-dismiss="modal">{{ __('layout.common.close') }}</button>
data-bs-dismiss="modal">{{ __('layout.common.close') }}</button>
</div>
</div>
</div>
Expand Down

0 comments on commit 9d637b4

Please sign in to comment.