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