MVR - Training Detail | Active
Short page description
<header>
<a class="sr-only sr-only-focusable" href="#mainContent">Skip navigation to main content</a> <nav class="navbar navbar-expand-lg atp-navbar" aria-label="Main">
<div class="container">
<div class="row no-gutters w-100 mb-lg-2">
<div class="col d-flex align-items-center">
<button class="navbar-toggler mr-2 px-1" type="button" data-toggle="collapse" data-target="#atpNavbarContent" aria-controls="atpNavbarContent" aria-expanded="false" aria-label="Toggle navigation">
<i class="lmp-icon icon-lg" aria-hidden="true">menu</i>
</button>
<a class="navbar-brand d-none d-lg-inline-block" href="#">
Aviation Training Portal
</a>
<div class="navbar-title d-lg-none">
Products & Services
</div>
</div>
<div class="col-auto">
<ul class="navbar-nav navbar-icon-nav justify-content-end">
<li class="nav-item d-none d-sm-block">
<a class="nav-link" href="#">
<i class="lmp-icon icon-lg" aria-hidden="true">help_outline</i>
<span class="sr-only">Help Center</span>
</a>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="lmp-icon icon-lg" aria-hidden="true">apps</i>
<span class="sr-only">Applications Menu</span>
</a>
<div class="dropdown-menu dropdown-menu-right atp-nav-dropdown" aria-labelledby="navbarDropdown">
<h6 class="dropdown-header">Portal</h6>
<a class="dropdown-item" href="#">MyBoeingFleet</a>
<div class="dropdown-divider"></div>
<h6 class="dropdown-header">Applications</h6>
<a class="dropdown-item" href="#">Application 1</a>
<a class="dropdown-item" href="#">Application 2</a>
<a class="dropdown-item" href="#">Application 3</a>
<a class="dropdown-item" href="#">More Applications</a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="accountMenuDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="lmp-icon icon-lg" aria-hidden="true">account_circle</i>
<span class="sr-only">Account Menu</span>
</a>
<div class="dropdown-menu dropdown-menu-right atp-nav-dropdown pb-0" aria-labelledby="accountMenuDropdown">
<div class="h5 font-weight-bold mb-1 px-4">FirstName LastName</div>
<div class="dropdown-small-text">firstname.lastname@company.com</div>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">MBF Account Details</a>
<a href="#" class="dropdown-item dropdown-btn mt-4">Log Out</a>
</div>
</li>
</ul>
</div>
</div>
<div class="collapse navbar-collapse" id="atpNavbarContent">
<div class="row d-lg-none pt-lg-1">
<div class="col py-3 pl-4">
<img src="../../../../assets/images/boeing-logo.svg" width="145" height="34" alt="Boeing" loading="lazy" style="width: 150px; display: block; height: auto;">
</div>
<div class="col-auto py-3 pr-2">
<button class="navbar-toggler text-dark" type="button" data-toggle="collapse" data-target="#atpNavbarContent" aria-controls="atpNavbarContent" aria-expanded="false" aria-label="Close navigation">
<i class="lmp-icon icon-lg" aria-hidden="true">close</i>
</button>
</div>
<div class="col-12 border-top border-bottom py-1 px-3">
<a class="navbar-brand-mobile" href="#">Aviation Training Portal</a>
</div>
</div>
<div class="row no-gutters">
<div class="col-12">
<ul class="navbar-nav navbar-link-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Products & Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Materials</a>
</li>
<li class="nav-item d-sm-none border-top mt-1 pt-2">
<a href="#" class="nav-link d-flex align-items-center">
<i class="lmp-icon mr-2" aria-hidden="true">help_outline</i> Help Center
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</nav>
</header>
<main id="mainContent" class="bg-gray-lt">
<div class="atp-header">
<div class="container">
<div class="row">
<div class="col d-flex align-items-start order-1 order-md-0">
<h1 class="order-1">
Training Details
</h1>
<a href="#" class="btn lmp-link atp-header-back-link order-0">
<i class="lmp-icon icon-md" aria-hidden="true">arrow_back</i>
<span class="sr-only">Navigate to previous page</span>
</a>
</div>
</div>
</div>
</div>
<div class="container lmp-page-content">
<div class="row py-md-3 py-lg-4 px-lg-2 bg-md-gray-md rounded">
<div class="col-lg-9 mb-4 mb-lg-0">
<div class="lmp-card-detail">
<div class="row no-gutters">
<div class="col card-details">
<div class="p-3 pt-md-4">
<ul class="lmp-tag-list active">
<li>Active</li>
<li>Flight Training</li>
</ul>
<h2>(787) Air Canada Type Rating with LOFT, CAT II/III</h2>
<ul class="lmp-inline-bullet">
<li>Type Rating</li>
<li>787 - 8/9/10</li>
<li>Product # 100178896</li>
<li>TP ID # 1234567</li>
</ul>
</div>
<ul class="lmp-outlined">
<li>Miami</li>
<li>3 Aug 2020 - 12 Aug 2020</li>
</ul>
</div>
</div>
</div>
<a href="#" class="btn lmp-primary mb-4 d-lg-none" data-toggle="modal" data-target="#sendMessageModal">Send a Message to Boeing</a>
<div class="lmp-card-single">
<h3 class="card-title">Progress</h3>
<div class="card-val">50%</div>
<span class="progress lmp-progress"><span class="progress-bar" role="progressbar" style="width: 50%" aria-valuenow="50" aria-valuemin="0" aria-valuemax="100" aria-label="Course progress"></span></span>
</div>
<div class="lmp-card-single">
<h3 class="card-title">Participants</h3>
<div class="card-val">2</div>
</div>
<div class="lmp-card-collapse">
<h3 id="descriptionCardCardHeading" class="mb-0">
<button class="card-trigger" type="button" data-toggle="collapse" data-target="#descriptionCard" aria-expanded="true" aria-controls="descriptionCard">
<span class="card-label">Description</span>
</button>
</h3>
<div id="descriptionCard" class="card-collapse collapse show" aria-labelledby="descriptionCardCardHeading">
<div class="lmp-card-content p-4">
<p>The Shortened Type Rating (STAR) Course saves an airline time and money by offering an effective solution tailored to pilots who have a minimum amount of glass flight deck experience. The Shortened Type Rating (STAR) Course includes ground and flight training delivered by highly qualified instructors who have gone through a rigorous certification process to ensure the highest caliber of instruction. Courseware is provided by the customer. The ground training portion of the course focuses on learning and applying systems knowledge through procedural training in a fixed training device or flat panel trainer. The flight training portion if the course takes place in a full-time simulator and simulator and includes an end-of-course check ride.</p>
<h4>Student Receives</h4>
<ul class="list-unstyled">
<li>Type Rating</li>
</ul>
</div>
</div>
</div>
<div class="lmp-card-collapse">
<h3 id="addonsCardCardHeading" class="mb-0">
<button class="card-trigger" type="button" data-toggle="collapse" data-target="#addonsCard" aria-expanded="true" aria-controls="addonsCard">
<span class="card-label">Specialty Course Add-Ons</span>
</button>
</h3>
<div id="addonsCard" class="card-collapse collapse show" aria-labelledby="addonsCardCardHeading">
<div class="lmp-card-content p-4">
<div class="row">
<div class="col-lg-6">
<h4>Selected Options</h4>
<ul class="lmp-lined-list">
<li>EFB (Product #123456)</li>
<li>ETOPS (Product #123456)</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-3 lmp-siderail">
<a href="#" class="btn lmp-primary mb-4 mb-lg-5 d-none d-lg-block" data-toggle="modal" data-target="#sendMessageModal">Send a Message to Boeing</a>
<h4>Reference Materials</h4>
<ul class="lmp-lined-list">
<li><a href="#"><i class="lmp-icon" aria-hidden="true">get_app</i> Training Program Schedule</a></li>
</ul>
<h4 class="mb-1">Campus Information</h4>
<h5>Miami</h5>
<ul class="lmp-lined-list">
<li><a href="#"><i class="lmp-icon" aria-hidden="true">get_app</i> Miami Campus Guide</a></li>
<li><a href="tel:+1786-265-4700"><i class="lmp-icon" aria-hidden="true">phone</i> Phone: +1-786-265-4700</a></li>
</ul>
<h5>Gatwick</h5>
<ul class="lmp-lined-list">
<li><a href="#"><i class="lmp-icon" aria-hidden="true">get_app</i> Gatwick Campus Guide</a></li>
<li>
<a href="tel:+441293-819-000"><i class="lmp-icon" aria-hidden="true">phone</i> Phone: +44-1293-819-000</a>
</li>
</ul>
<h4>Campus Information</h4>
<div class="lmp-error">
<i class="lmp-icon icon-lg" aria-hidden="true">error</i>
Something went wrong loading this information. Please <a href="#">reload</a> or try again later.
</div>
</div>
</div>
</div>
</main>
<footer class="atp-foooter">
<div class="container">
<div class="row">
<div class="col-lg-7">
<nav class="atp-footer-links" aria-label="Footer">
<a href="#">MBF Home</a>
<a href="#">Contact Us</a>
<a href="#">Terms of Use</a>
<a href="#">Boeing Privacy & Cookie Statement</a>
</nav>
</div>
<div class="col-lg-5 text-center text-lg-right">
Copyright © 2020 Boeing. All right reserved.
</div>
</div>
</div>
</footer>
<div class="lmp-modal modal fade" id="sendMessageModal" tabindex="-1" aria-labelledby="sendMessageModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title" id="sendMessageModalLabel">Send Message to Boeing</h3>
</div>
<div class="modal-body">
<table class="table lmp-table table-stack mb-2">
<thead>
<tr>
<th scope="col">TP ID</th>
<th scope="col">Name</th>
<th scope="col">Location</th>
<th scope="col">Date</th>
</tr>
</thead>
<tbody>
<tr>
<th scope="row" data-title="TP ID">1234567</th>
<td data-title="Name">(787) WestJet Type Rating with LOFT, CAT II/III</td>
<td data-title="Location">Buenos Aires</td>
<td data-title="Date">DD Mon YYYY - DD Mon YYYY</td>
</tr>
</tbody>
</table>
<div class="mb-5 lmp-text-sm">
Specialty Course Add-Ons Selected: EFB (Product #123456); ETOPS (Product #123456)
</div>
<h4>Message Details</h4>
<div class="lmp-form">
<div class="mb-3">
<div class="animated-input">
<div class="form-group">
<input type="" class="form-control" id="activesendmessage-subject" required>
<label for="activesendmessage-subject">Subject</label>
</div>
</div>
</div>
<div class="mb-3">
<div class="animated-input">
<div class="form-group">
<textarea class="form-control" id="activesendmessage-message" rows="4" required></textarea>
<label for="activesendmessage-message">Message</label>
</div>
</div>
</div>
<div class="row mb-3">
<div class="col-lg-6">
<h4>Your Information</h4>
<ul class="list-unstyled font-size-sm">
<li class="my-1">Karen Smith</li>
<li class="my-1 collapse multi-collapse no-transition show" id="userEmailRow"><span id="userCurrentAddress">karen.smith@westjet.ca</span> <a href="#" id="editEmailTrigger" class="asdf" role="button" data-toggle="collapse" data-target=".multi-collapse" aria-expanded="false" aria-controls="userEmailRow multiCollapseExample2">Edit</a></li>
<li class="collapse multi-collapse no-transition" id="userEmailEdit">
<div class="my-3">
<div class="animated-input">
<div class="form-group">
<input type="" class="form-control" id="activesendmessage-useremailedit-input" required value="karen.smith@westjet.ca">
<label for="activesendmessage-useremailedit-input">Email</label>
</div>
</div>
</div>
</li>
<li>
<div class="my-3">
<div class="form-group">
<label for="activesendmessage-phonenumber">Phone Number (Optional)</label>
<input id="activesendmessage-phonenumber" class="" type="tel" placeholder="Phone Number (Optional)">
<div id="lmpFormTelError" class="iti-invalid-feedback">Please enter a valid phone number.</div>
</div>
</div>
</li>
</ul>
<a href="#altContactInfo" id="altContactTrigger" class="lmp-toggle-hide font-size-sm collapsed" data-toggle="collapse" role="button" aria-expanded="false" aria-controls="altContactInfo"><i class="lmp-icon" aria-hidden="true">add_circle</i> Add Alternate Contact</a>
</div>
<div class="col-12">
<div class="collapse no-transition" id="altContactInfo">
<h4>Alternative Contact(s)</h4>
<div class="animated-input">
<div class="form-group">
<input type="" class="form-control is-invalid" id="activeformInput-altContacts" aria-describedby="inputHelp-activeformInput-altContacts" required>
<label for="activeformInput-altContacts">Email Address(es)</label>
<div class="invalid-feedback">Please enter valid email address(es) separated by a semicolon.</div>
<span id="inputHelp-activeformInput-altContacts" class="form-text">Add additional emails, separated by a semicolon. These will be CC'd on communications around this message.</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn lmp-outline-secondary mr-2" data-dismiss="modal" aria-label="Close">Cancel</button>
<button class="btn lmp-secondary" data-dismiss="modal" data-toggle="modal" data-target="#messageSubmitModal">Submit</button>
</div>
</div>
</div>
</div>
<div class="lmp-modal modal fade" id="messageSubmitModal" tabindex="-1" aria-labelledby="messageSubmitModalLabel" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered modal-lg">
<div class="modal-content">
<div class="modal-header">
<h3 class="modal-title" id="messageSubmitModalLabel">Send Message to Boeing</h3>
</div>
<div class="modal-body">
<h4>Message Sent</h4>
<p>Your message has been sent. You will receive an email confirmation.</p>
<p>Your request will be revised by Boeing's Scheduling team.</p>
</div>
<div class="modal-footer"> <button class="btn lmp-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>