dtookey
/
Engine_Rebuild
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

updated help window html and assigned themed colors for chevrons

Browse Source
pull/2/head
Rebecca Hollis 5 years ago
parent 833664bb1b
commit 37e8d5b13f
11 changed files with 31 additions and 111 deletions
Show Stats Download Patch File Download Diff File

2
src/assets/images/chevron-down-dark.svg
Unescape Escape View File

@ -1 +1 @@
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-chevron-down" fill="red" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"/></svg>
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-chevron-down" fill="#9d9d9d" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 279 B

After

Width:  |  Height:  |  Size: 283 B

2
src/assets/images/chevron-down-light.svg
Unescape Escape View File

@ -1 +1 @@
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-chevron-down" fill="blue" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"/></svg>
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-chevron-down" fill="#434344" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 280 B

After

Width:  |  Height:  |  Size: 283 B

2
src/assets/images/chevron-up-dark.svg
Unescape Escape View File

@ -1 +1 @@
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-chevron-up" fill="red" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M7.646 4.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 5.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z"/></svg>
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-chevron-up" fill="#787572" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M7.646 4.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 5.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 260 B

After

Width:  |  Height:  |  Size: 264 B

2
src/assets/images/chevron-up-light.svg
Unescape Escape View File

@ -1 +1 @@
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-chevron-up" fill="blue" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M7.646 4.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 5.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z"/></svg>
<svg width="1em" height="1em" viewBox="0 0 16 16" class="bi bi-chevron-up" fill="#434344" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M7.646 4.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1-.708.708L8 5.707l-5.646 5.647a.5.5 0 0 1-.708-.708l6-6z"/></svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 261 B

After

Width:  |  Height:  |  Size: 264 B

18
src/assets/pages/help-about.html
Unescape Escape View File

@ -1,12 +1,12 @@
<!doctype html>
<html lang="en">
<div class="helpcontent text-paragraphtextcolor">
<h4>About the Resource Center</h4>
<p></p>
<p class="lead">You rely on a vast amount of resources to do your job. How can you keep track of them all?
<p></p>
<p class="lead">Explore the Resource Center.
<p></p>
<p class="lead">From accounting to workflows, this desktop application can help you find the resources you need.</p>
</div>
<div class="helpcontent text-activetextaccordion">
<h4>About the Resource Center</h4>
<p></p>
<p class="lead">You rely on a vast amount of resources to do your job. How can you keep track of them all?
<p></p>
<p class="lead">Explore the Resource Center.
<p></p>
<p class="lead">From accounting to workflows, this desktop application can help you find the resources you need.</p>
</div>
</html>

24
src/assets/pages/help-categories.html
Unescape Escape View File

@ -1,18 +1,6 @@
<!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>Help Menu: Categories</title>
<link rel="stylesheet" href="styles/resources-landing-page.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="helpcontent text-paragraphtextcolor">
<div class="helpcontent text-activetextaccordion">
<h4>Categories</h4>
<p></p>
<p class="lead">What are <i>categories</i>?
@ -20,13 +8,5 @@
<p class="lead">JDSfaulkner has so many helpful resources available to employees that it might be overwhelming to see them all at once. That's why this application categorizes them into topics.</p>
<p></p>
<p class="lead">Click a category in the main workspace to expand a section and view all the related resources. With a section expanded, you can navigate more easily using the scrollbar on the right or by clicking a category heading in the left sidebar.</p>
<p></p>
<p> <a href="resources-landing-page.html">Back to main</a> </p>
</div>
</body>
<script src="scripts/tsUtil.js"></script>
<script>loadTSTarget("themes.js");</script>
<script src="scripts/index_app.js"></script>
</div>
</html>

24
src/assets/pages/help-resources.html
Unescape Escape View File

@ -1,18 +1,6 @@
<!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>Help Menu: Resources</title>
<link rel="stylesheet" href="styles/resources-landing-page.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="helpcontent text-paragraphtextcolor">
<div class="helpcontent text-paragraphtextcolor">
<h4>Resources</h4>
<p></p>
<p class="lead">We get it. <i>Resources</i> can mean many things to many people.</p>
@ -20,13 +8,5 @@
<p class="lead">When it comes to the Resource Center, resources are digital files, storage systems, software and websites that help you do your job.</p>
<p></p>
<p class="lead">The company's top managers decided to create the Resource Center to help new and existing employees become oriented and familiar with the many tools available to them.</p>
<p></p>
<p><a href="resources-landing-page.html">Back to main</a> </p>
</div>
</body>
<script src="scripts/tsUtil.js"></script>
<script>loadTSTarget("themes.js");</script>
<script src="scripts/index_app.js"></script>
</div>
</html>

24
src/assets/pages/help-searches.html
Unescape Escape View File

@ -1,18 +1,6 @@
<!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>Help Menu: Searches</title>
<link rel="stylesheet" href="styles/resources-landing-page.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="helpcontent text-paragraphtextcolor">
<div class="helpcontent text-paragraphtextcolor">
<h4>Searches</h4>
<p></p>
<p class="lead">Save time. Simplify your searches.
@ -20,13 +8,5 @@
<p class="lead">Finding resources that meet your criteria is easy when you use the search tool. At the top of your workspace, type a search term in the rounded search bar. Click "enter" on your keyboard, or click the search icon, and matching results populate your workspace.</p>
<p></p>
<p class="lead">Voil&aacute; &mdash; helpful resources at your fingertips.</p>
<p> <a href="resources-landing-page.html">Back to main</a> </p>
</div>
</body>
<script src="scripts/tsUtil.js"></script>
<script>loadTSTarget("themes.js");</script>
<script src="scripts/index_app.js"></script>
</div>
</html>

24
src/assets/pages/help-updates.html
Unescape Escape View File

@ -1,18 +1,6 @@
<!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>Help Menu: Updates</title>
<link rel="stylesheet" href="styles/resources-landing-page.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="helpcontent text-paragraphtextcolor">
<div class="helpcontent text-paragraphtextcolor">
<h4>Updates</h4>
<p></p>
<p class="lead">Occasionally, you might see computer code moving across your screen for a few seconds after opening the Resource Center.</p>
@ -20,13 +8,5 @@
<p class="lead">What is going on? An <i>update</i>.</p>
<p></p>
<p class="lead">Developers send updates periodically to improve functionality. If you have a reliable internet connection, updates should occur quickly and automatically.</p>
<p><a href="resources-landing-page.html">Back to main</a> </p>
</div>
</body>
<script src="scripts/tsUtil.js"></script>
<script>loadTSTarget("themes.js");</script>
<script src="scripts/index_app.js"></script>
</div>
</html>

8
src/assets/pages/resources-landing-page.html
Unescape Escape View File

@ -27,10 +27,10 @@
<a class="p-2 text-navbartext" href="#" role="button" id="helpdropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" data-offset="-75,4">Help</a>
<div class="dropdown-menu" aria-labelledby="dropdownMenuOffset">
<a class="dropdown-item help-menu-item" onclick="help.openHelpOverlay('help-about.html');">About the Resource Center</a>
<a class="dropdown-item help-menu-item" href="help-searches.html">Searches</a>
<a class="dropdown-item help-menu-item" href="help-categories.html">Categories</a>
<a class="dropdown-item help-menu-item" href="help-resources.html">Resources</a>
<a class="dropdown-item help-menu-item" href="help-updates.html">Updates</a>
<a class="dropdown-item help-menu-item" onclick="help.openHelpOverlay('help-searches.html');">Searches</a>
<a class="dropdown-item help-menu-item" onclick="help.openHelpOverlay('help-categories.html');">Categories</a>
<a class="dropdown-item help-menu-item" onclick="help.openHelpOverlay('help-resources.html');">Resources</a>
<a class="dropdown-item help-menu-item" onclick="help.openHelpOverlay('help-updates.html');">Updates</a>
</div>
</div>
</nav>

12
src/assets/pages/styles/theme-base.scss
Unescape Escape View File

@ -163,7 +163,7 @@ body {
left: 0;
right: 0;
bottom: 0;
background-color: rgba(0,0,0,0.5); /* Black background with opacity */
background-color: rgba(0,0,0,0.7); /* Black background with opacity */
z-index: 2000; /* Specify a stack order in case you're using a different order for other elements */
cursor: pointer; /* Add a pointer on hover */
}
@ -192,10 +192,10 @@ body {
.overlay-content{
position: fixed; /* Sit on top of the page content */
width: 50%; /* Full width (cover the whole page) */
height: 50%; /* Full height (cover the whole page) */
top: 25%;
left: 25%;
background-color: map-get($theme-colors, secondary); /* Black background with opacity */
width: 400px; /* Full width (cover the whole page) */
height: 600px; /* Full height (cover the whole page) */
top: 5%;
right: 25%;
background-color: map-get($theme-colors, sidebarfill); /* Black background with opacity */
cursor: pointer; /* Add a pointer on hover */
}
Write Preview
Loading…
Cancel
Save