Made alternate html and css landing pages to work on major changes
parent
a12dcdcd85
commit
797e41e4a7
Binary file not shown.
|
After Width: | Height: | Size: 113 KiB |
@ -0,0 +1,143 @@
|
||||
html {
|
||||
font-size: 14px;
|
||||
}
|
||||
@media (min-width: 768px) {
|
||||
html {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
max-width: 960px;
|
||||
}
|
||||
|
||||
.main {
|
||||
background-color: secondary;
|
||||
color: navbartext;
|
||||
}
|
||||
|
||||
.body {
|
||||
font-size: .875rem;
|
||||
}
|
||||
|
||||
.feather {
|
||||
width: 16px;
|
||||
height: 16 px;
|
||||
vertical-align: text-bottom;
|
||||
}
|
||||
|
||||
.album {
|
||||
background-color: secondary;
|
||||
color: navbartext;
|
||||
}
|
||||
|
||||
.img-thumbnail {
|
||||
background-color: primary;
|
||||
}
|
||||
|
||||
.thumbnail {
|
||||
background-color: primary;
|
||||
}
|
||||
|
||||
body {
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.navbar {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
/*
|
||||
* Sidebar
|
||||
*/
|
||||
|
||||
.sidebar {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 100; /* Behind the navbar */
|
||||
padding: 0;
|
||||
box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);
|
||||
}
|
||||
|
||||
.sidebar-sticky {
|
||||
position: -webkit-sticky;
|
||||
position: sticky;
|
||||
top: 48px; /* Height of navbar */
|
||||
height: calc(100vh - 48px);
|
||||
padding-top: .5rem;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
|
||||
}
|
||||
|
||||
.sidebar .nav-link {
|
||||
font-weight: 500;
|
||||
color: navbartext;
|
||||
}
|
||||
|
||||
.sidebar .nav-link .feather {
|
||||
margin-right: 4px;
|
||||
color: navbartextfeather;
|
||||
}
|
||||
|
||||
.sidebar .nav-link.active {
|
||||
color: navbartextactive;
|
||||
}
|
||||
|
||||
.sidebar .nav-link:hover .feather,
|
||||
.sidebar .nav-link.active .feather {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.sidebar-heading {
|
||||
font-size: .75rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
/*
|
||||
* End Sidebar
|
||||
*/
|
||||
|
||||
.border-top { border-top: 1px solid #e5e5e5; }
|
||||
.border-bottom { border-bottom: 1px solid #e5e5e5; }
|
||||
.nav-link {
|
||||
color: navbartext;
|
||||
}
|
||||
|
||||
@media (min-width: 768 px) {
|
||||
.main {
|
||||
padding-right: 40px;
|
||||
padding-left: 220px; /* 180 + 40 */
|
||||
}
|
||||
}
|
||||
|
||||
.form-control:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
.card-image-background{
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.text-align-left{
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.form-control::-webkit-input-placeholder { color: searchfont; } /* WebKit, Blink, Edge */
|
||||
.form-control:-moz-placeholder { color: searchfont; } /* Mozilla Firefox 4 to 18 */
|
||||
.form-control::-moz-placeholder { color: searchfont; } /* Mozilla Firefox 19+ */
|
||||
.form-control:-ms-input-placeholder { color: searchfont; } /* Internet Explorer 10-11 */
|
||||
.form-control::-ms-input-placeholder { color: searchfont; } /* Microsoft Edge */
|
||||
|
||||
|
||||
.footer {
|
||||
padding-top: 3rem;
|
||||
padding-bottom: 3rem;
|
||||
background: primary;
|
||||
}
|
||||
|
||||
.footer p {
|
||||
margin-bottom: .25rem;
|
||||
}
|
||||
|
||||
@ -0,0 +1,119 @@
|
||||
<!doctype html>
|
||||
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||
<title>Steering Wheel</title>
|
||||
|
||||
<link rel="stylesheet" href="styles/test-resources-landing-page2.css">
|
||||
|
||||
<script>let $ = require('jquery');</script>
|
||||
<script>require('popper.js')</script>
|
||||
<script>require('bootstrap')</script>
|
||||
</head>
|
||||
|
||||
<body hidden ONLOAD="$('body').removeAttr('hidden');" class="bg-secondary">
|
||||
|
||||
<div class="fixed-top d-flex flex-column flex-md-row align-items-center p-3 px-md-4 mb-0 bg-primary border-top shadow-sm">
|
||||
<a class="navbar-brand text-navbartext my-0 mr-md-auto">
|
||||
<img src="../images/JDS_faulkner_Logo_NoTextAtBottom.png" height="30" class="d-inline-block align-top" alt="JDSfaulkner logo">
|
||||
Steering Wheel
|
||||
</a>
|
||||
<nav class="my-2 my-md-0 mr-md-3">
|
||||
<a class="p-2 text-navbartext" href="#">Help</a>
|
||||
<a class="p-2 text-navbartext" href="#">Feedback</a>
|
||||
</nav>
|
||||
<a class="btn btn-outline-themebuttonoutline" id="theme-toggle">Theme</a>
|
||||
</div>
|
||||
|
||||
|
||||
<div class="container-fluid">
|
||||
<div class="row">
|
||||
<nav class="col-md-2 d-none d-md-block bg-sidebarfill sidebar">
|
||||
<div class="sidebar-sticky">
|
||||
<ul class="nav flex-column">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link active" href="#">
|
||||
<span data-feather="home"></span>
|
||||
Top <span class="sr-only">(current)</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<h6 class="sidebar-heading d-flex justify-content-between align-items-center px-3 mt-4 mb-1 text-sidebartext">
|
||||
<span>Resource Categories</span>
|
||||
<a class="d-flex align-items-center" href="#">
|
||||
</a>
|
||||
</h6>
|
||||
<ul class="nav flex-column mb-2">
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">
|
||||
<span data-feather="list-ul"></span>
|
||||
Category 1
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">
|
||||
<span data-feather="list-ul"></span>
|
||||
Category 2
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#">
|
||||
<span data-feather="list-ul"></span>
|
||||
Category 3
|
||||
</a>
|
||||
</li>
|
||||
<li class="nav-item">
|
||||
<a class="nav-link" href="#Tax-Documents-collapser">
|
||||
<span data-feather="list-ul"></span>
|
||||
Tax Documents
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main>
|
||||
|
||||
<div class="album py-5 bg-secondary">
|
||||
<div class="container">
|
||||
<input class="form-control form-control-dark w-100 bg-info border border-boxborder text-searchfont"
|
||||
placeholder="Search"
|
||||
aria-label="Search">
|
||||
</div>
|
||||
|
||||
<div class="album py-5 bg-secondary">
|
||||
<div class="container bg-secondary">
|
||||
<!-- div container-->
|
||||
<div id="grid-container">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<footer class="page-footer">
|
||||
<div class="container">
|
||||
<p class="float-left text-navbartext">
|
||||
<a href="resources-landing-page.html">Back to original layout</a>
|
||||
</p>
|
||||
<p class="float-right text-navbartext">
|
||||
<a href="#">Back to top</a>
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
</main>
|
||||
</body>
|
||||
|
||||
|
||||
<script src="scripts/tsUtil.js"></script>
|
||||
<script>loadTSTarget("themes.js");</script>
|
||||
<script src="scripts/index_app.js"></script>
|
||||
</html>
|
||||
Loading…
Reference in New Issue