ocertat/Kingsborough-LibGuide
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add vue to hamburger menu; add some comments in html

Browse Source
This commit is contained in:
Mark Eaton
2022-08-29 12:09:22 -04:00
parent 4726cc41fd
commit 773040731f
3 changed files with 63 additions and 52 deletions
Download Patch File Download Diff File Expand all files Collapse all files
configuration/main.js
+1
View File
@@ -10,6 +10,7 @@ const menusComponent = {
new Vue({ new Vue({
el: '#app', el: '#app',
data: { data: {
hamburger: Seed.hamburgerMenu,
findIt: Seed.findItMenu, findIt: Seed.findItMenu,
services: Seed.servicesMenu, services: Seed.servicesMenu,
aboutUs: Seed.aboutUsMenu, aboutUs: Seed.aboutUsMenu,
configuration/seed.js
+47 -1
View File
@@ -1,4 +1,49 @@
window.Seed = (function () { window.Seed = (function () {
const hamburgerMenu = [
{
link: "https://cuny-kb.primo.exlibrisgroup.com/discovery/search?tab=Everything&vid=01CUNY_KB:CUNY_KB&lang=en",
icon: "fas fa-search fa-fw bigger-icon",
description: "OneSearch",
target_blank: "",
id: 1
},
{
link: "https://library.kbcc.cuny.edu/az.php",
icon: "fas fa-database fa-fw bigger-icon",
description: "Databases A to Z",
target_blank: "",
id: 2
},
{
link: "https://library.kbcc.cuny.edu/guides",
icon: "fas fa-telescope fa-fw bigger-icon",
description: "Research Guides",
target_blank: "",
id: 3
},
{
link: "https://library.kbcc.cuny.edu/faq",
icon: "fas fa-question-circle fa-fw bigger-icon",
description: "FAQ",
target_blank: "",
id: 4
},
{
link: "https://library.kbcc.cuny.edu/calendar",
icon: "fas fa-clock fa-fw bigger-icon",
description: "Library Hours",
target_blank: "",
id: 5
},
{
link: "https://library.kbcc.cuny.edu/sitemap",
icon: "fas fa-location-arrow fa-fw bigger-icon",
description: "Site Map",
target_blank: "",
id: 6
}
]
const findItMenu = [ const findItMenu = [
{ {
link: "https://library.kbcc.cuny.edu/az.php", link: "https://library.kbcc.cuny.edu/az.php",
@@ -148,7 +193,7 @@ window.Seed = (function () {
{ {
link: "https://library.kbcc.cuny.edu/guides", link: "https://library.kbcc.cuny.edu/guides",
icon: "fas fa-telescope fa-fw bigger-icon", icon: "fas fa-telescope fa-fw bigger-icon",
desciption: "Research Guides and Tutorials", description: "Research Guides and Tutorials",
target_blank: "", target_blank: "",
id: 3 id: 3
}, },
@@ -161,6 +206,7 @@ window.Seed = (function () {
} }
] ]
return { return {
hamburgerMenu: hamburgerMenu,
findItMenu: findItMenu, findItMenu: findItMenu,
servicesMenu: servicesMenu, servicesMenu: servicesMenu,
aboutUsMenu: aboutUsMenu, aboutUsMenu: aboutUsMenu,
groups/home/LibAnswers-SlideOutChat-7.html
+15 -51
View File
@@ -6,8 +6,11 @@
<!-- BEGIN: content --> <!-- BEGIN: content -->
<div id="s-lib-public-main" class="s-lib-main container s-lib-side-borders"> <div id="s-lib-public-main" class="s-lib-main container s-lib-side-borders">
<div id="s-lg-index-cols"> <div id="s-lg-index-cols">
<div id="app"><!-- vue app -->
<div class="row"> <div class="row">
<!--<div id="obsolete_browser_alert" class="alert alert-danger obsolete_browser_alert">It looks like you're using Internet Explorer 11 or older. This website works best with modern browsers such as the latest versions of Chrome, Firefox, Safari, and Edge. If you continue with this browser, you may see unexpected results.</div>--> <!--<div id="obsolete_browser_alert" class="alert alert-danger obsolete_browser_alert">It looks like you're using Internet Explorer 11 or older. This website works best with modern browsers such as the latest versions of Chrome, Firefox, Safari, and Edge. If you continue with this browser, you may see unexpected results.</div>-->
<div class="col-xs-12" id="header-div"> <div class="col-xs-12" id="header-div">
<div class="dropdown" id="hamburger-container"> <div class="dropdown" id="hamburger-container">
<button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" id="hamburger"> <button class="btn btn-default dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true" id="hamburger">
@@ -15,45 +18,12 @@
</button> </button>
<ul class="dropdown-menu fade" aria-labelledby="hamburger" id="hamburger-ul"> <ul class="dropdown-menu fade" aria-labelledby="hamburger" id="hamburger-ul">
<li> <li>
<a class="searchmenu" aria-label="OneSearch" href="https://cuny-kb.primo.exlibrisgroup.com/discovery/search?tab=Everything&vid=01CUNY_KB:CUNY_KB&lang=en"> <a v-for="item in hamburger" v-bind:key="item.id" class="searchmenu" v-bind:aria-label="item.description" v-bind:href="item.link" v-bind:target="item.target_blank">
<div class="highlight-menu-item bigger-fancy-text"> <menus-component v-bind:item="item"></menus-component>
<i class="fas fa-search fa-fw bigger-icon" aria-hidden="true"></i>
<strong>OneSearch</strong>
</div>
</a>
<a class="searchmenu" aria-label="Databases A to Z" href="https://library.kbcc.cuny.edu/az.php">
<div class="highlight-menu-item bigger-fancy-text">
<i class="fas fa-database fa-fw bigger-icon" aria-hidden="true"></i>
<strong>Databases A-Z</strong>
</div>
</a>
<a class="searchmenu" aria-label="Research Guides" href="https://library.kbcc.cuny.edu/guides">
<div class="highlight-menu-item bigger-fancy-text">
<i class="fas fa-telescope fa-fw bigger-icon" aria-hidden="true"></i>
<strong>Research Guides</strong>
</div>
</a>
<a class="searchmenu" aria-label="FAQ" href="https://library.kbcc.cuny.edu/faq">
<div class="highlight-menu-item bigger-fancy-text">
<i class="fas fa-question-circle fa-fw bigger-icon" aria-hidden="true"></i>
<strong>FAQ</strong>
</div>
</a>
<a class="searchmenu" aria-label="Hours" href="https://library.kbcc.cuny.edu/calendar">
<div class="highlight-menu-item bigger-fancy-text">
<i class="fas fa-clock fa-fw bigger-icon" aria-hidden="true"></i>
<strong>Library Hours</strong>
</div>
</a>
<a class="searchmenu" aria-label="Site Map" href="https://library.kbcc.cuny.edu/sitemap">
<div class="highlight-menu-item bigger-fancy-text">
<i class="fas fa-location-arrow fa-fw bigger-icon" aria-hidden="true"></i>
<strong>Site Map</strong>
</div>
</a> </a>
</li> </li>
</ul> </ul>
</div> </div><!-- end of hamburger container -->
<a href="https://cuny-kb.primo.exlibrisgroup.com/discovery/account?vid=01CUNY_KB:CUNY_KB" id="login-div" class="no-underline"> <a href="https://cuny-kb.primo.exlibrisgroup.com/discovery/account?vid=01CUNY_KB:CUNY_KB" id="login-div" class="no-underline">
<div id="login-text">Login</div> <div id="login-text">Login</div>
<div id="login-icon"><i class="fas fa-user"></i></div> <div id="login-icon"><i class="fas fa-user"></i></div>
@@ -62,7 +32,7 @@
<div id="corona-alert" type="button" data-toggle="modal" data-target=".bs-example-modal-sm"> <div id="corona-alert" type="button" data-toggle="modal" data-target=".bs-example-modal-sm">
<span id="corona-alert-text">No fines on KBCC books checked out before the pandemic! Just return them to any CUNY Library.</span> <span id="corona-alert-text">No fines on KBCC books checked out before the pandemic! Just return them to any CUNY Library.</span>
</div> </div>
</div> </div><!-- end of header div -->
<!-- Modal --> <!-- Modal -->
<div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal fade bs-example-modal-sm" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog modal-sm" role="document"> <div class="modal-dialog modal-sm" role="document">
@@ -73,12 +43,8 @@
</div> </div>
</div> </div>
</div> </div>
</div> </div><!-- End of modal -->
<!-- End modal --> </div><!-- end of row -->
</div>
<div id="app"><!-- vue app -->
<div class="row" id="hamburger-alternative"> <div class="row" id="hamburger-alternative">
<div class="col-xs-12"> <div class="col-xs-12">
<nav class="navbar navbar-default main-nav-container"> <nav class="navbar navbar-default main-nav-container">
@@ -145,14 +111,12 @@
</li> </li>
</ul> </ul>
</li> </li>
</ul> </ul><!-- end of navbar-center -->
</div> </div><!-- end of container-fluid -->
</nav> </nav><!-- end of main-nav-container -->
</div> </div><!-- end of col-xs-12 -->
</div><!--end of row-->
</div><!-- end Vue app --> </div><!--end of Vue app-->
</div>
</div> </div>
<div class="container" style="margin-top:14px;"> <div class="container" style="margin-top:14px;">
<div class="row kbcc-background-image"> <div class="row kbcc-background-image">