the-tempus-project/thetempusproject
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add mobile tutorials

Browse Source
This commit is contained in:
Joey Kimsey
2025-01-30 16:06:06 -05:00
parent 928d78ce44
commit 2301e212bf
9 changed files with 134 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
app/plugins/bookmarks/controllers/tutorials.php
View File

@ -100,4 +100,15 @@ class Tutorials extends Controller {
}
return Views::view( 'bookmarks.tutorials.safari.' . $tutorial );
}
public function mobile( $tutorial = '' ) {
Navigation::setCrumbComponent( 'tutorialCrumbs', Input::get( 'url' ) );
if ( ! in_array( $tutorial, ['iphone','android'] ) ) {
$test = new \stdClass();
$test->pretty = 'Mobile';
$test->printed = 'mobile';
return Views::view( 'bookmarks.tutorials.mobileCard', [ $test ] );
}
return Views::view( 'bookmarks.tutorials.mobile.' . $tutorial );
}
}

BIN
app/plugins/bookmarks/images/android/add.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 51 KiB

BIN
app/plugins/bookmarks/images/android/add2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 36 KiB

BIN
app/plugins/bookmarks/images/android/add3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 38 KiB

BIN
app/plugins/bookmarks/images/android/added.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 152 KiB

38
app/plugins/bookmarks/views/tutorials/list.html
View File

@ -1,4 +1,42 @@
<section class="container my-5">
<h1 class="text-center mb-4">Mobile Tutorials</h1>
<div class="row g-4 mb-4">
<!-- Apple Section -->
<div class="col-md-6">
<div class="card h-100 shadow-sm context-main-bg">
<div class="card-body text-center">
<i class="fab fa-apple fa-3x mb-3 atb-green"></i>
<h5 class="card-title text-center">Apple</h5>
<hr>
<ul class="list-group list-group-flush rounded">
<li class="list-group-item context-second-bg mb-1">
<a href="{ROOT_URL}tutorials/mobile/iphone" class="text-decoration-none atb-green">
How to add the app to your iPhone home-screen.
</a>
</li>
</ul>
</div>
</div>
</div>
<!-- Opera Section -->
<div class="col-md-6">
<div class="card h-100 shadow-sm context-main-bg">
<div class="card-body text-center">
<i class="fab fa-android fa-3x mb-3 atb-green"></i>
<h5 class="card-title text-center">Android</h5>
<hr>
<ul class="list-group list-group-flush rounded">
<li class="list-group-item context-second-bg mb-1">
<a href="{ROOT_URL}tutorials/mobile/android" class="text-decoration-none atb-green">
How to add the app to your Android home-screen.
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<h1 class="text-center mb-4">Browser Tutorials</h1>
<div class="row g-4">
<!-- Opera Section -->

33
app/plugins/bookmarks/views/tutorials/mobile/android.html Normal file
View File

@ -0,0 +1,33 @@
<section class="container my-5">
<div class="card shadow-sm">
<div class="card-body context-main-bg">
<h2 class="card-title text-center mb-4">How to add the app to your Android home-screen.</h2>
{tutorialCrumbs}
<hr>
<h5 class="mt-4">Step 1: Open https://allthebookmarks.com in Chrome.</h5>
<p class="card-text">
from this page, tap the menu icon (three dots) in the top-right corner.
</p>
<div class="text-center">
<img src="/app/plugins/bookmarks/images/android/add.png" class="img-fluid rounded mb-4" alt="Extension settings page">
</div>
<h5>Step 2: Select "Add to Home screen" and a popup will let you choose the name.</h5>
<p class="card-text">
Next, tap "Add".
</p>
<div class="text-center">
<img src="/app/plugins/bookmarks/images/android/add2.png" class="img-fluid rounded mb-4" alt="Extension settings page">
</div>
<h5>Step 3: A popup will let you drag the icon around or you can simply select "Add to Home screen". </h5>
<div class="text-center">
<img src="/app/plugins/bookmarks/images/android/add3.png" class="img-fluid rounded mb-4" alt="Extension settings page">
</div>
<p class="card-text">
The shortcut will now appear on your home screen.
</p>
<div class="text-center">
<img src="/app/plugins/bookmarks/images/android/added.png" class="img-fluid rounded mb-4" alt="Extension settings page">
</div>
</div>
</div>
</section>

24
app/plugins/bookmarks/views/tutorials/mobile/iphone.html Normal file
View File

@ -0,0 +1,24 @@
<section class="container my-5">
<div class="card shadow-sm">
<div class="card-body context-main-bg">
<h2 class="card-title text-center mb-4">How to add the app to your iPhone home-screen</h2>
{tutorialCrumbs}
<hr>
<h5 class="mt-4">Step 1: Open https://allthebookmarks.com in Safari.</h5>
<span class="text-muted">(this is required; Chrome doesn’t support adding shortcuts on iOS)</span>
<h5>Step 2: Tap the Share icon (square with an upward arrow).</h5>
<p class="card-text">
Next, Scroll down and select "Add to Home Screen" then tap "Add".
</p>
<div class="text-center">
<img src="/app/plugins/bookmarks/images/iphone/add.png" class="img-fluid rounded mb-4" alt="Extension settings page">
</div>
<p class="card-text">
The shortcut will appear on your home screen.
</p>
<div class="text-center">
<img src="/app/plugins/bookmarks/images/iphone/added.png" class="img-fluid rounded mb-4" alt="Extension settings page">
</div>
</div>
</div>
</section>

28
app/plugins/bookmarks/views/tutorials/mobileCard.html Normal file
View File

@ -0,0 +1,28 @@
<section class="container my-5">
<h1 class="text-center mb-4">{pretty} Tutorials</h1>
<div class="row g-4">
<!-- Opera Section -->
<div class="col-md-8 offset-2">
{tutorialCrumbs}
<div class="card h-100 shadow-sm context-main-bg">
<div class="card-body text-center">
<i class="fa-solid fa-mobile fa-3x mb-3 atb-green"></i>
<h5 class="card-title text-center">{pretty}</h5>
<hr>
<ul class="list-group list-group-flush rounded">
<li class="list-group-item context-second-bg mb-1">
<a href="{ROOT_URL}tutorials/mobile/iphone" class="text-decoration-none atb-green">
How to add the app to your iPhone home-screen.
</a>
</li>
<li class="list-group-item context-second-bg mb-1">
<a href="{ROOT_URL}tutorials/mobile/android" class="text-decoration-none atb-green">
How to add the app to your Android home-screen.
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>