wcrisman/PetitTeton
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Removed submenu; Added border div around everything; Replaced ID's with Classes in index.html

Browse Source
This commit is contained in:
DESKTOP-C9V2M01\Zeeri
2025-09-13 12:21:19 -07:00
parent cf147b8ffa
commit c36bb1f351
3 changed files with 87 additions and 132 deletions
Download Patch File Download Diff File Expand all files Collapse all files

82
public/_index.sass
View File

@@ -36,14 +36,14 @@ body
max-width: 950px
min-width: 250px
margin: 0 auto
#page
.page
/*background: url('images/GrassBackground_v1.jpg') repeat*/
//background: #F6F6F6
background: #DDE1D5
/* Small Devices (phones) */
@media(max-width: 549px)
#head
.head
margin: 0 auto
//background: url(images/Header_v2.jpg) no-repeat top center
//height: 171px
@@ -61,11 +61,11 @@ body
margin: 0 auto
padding: 6px 4px
position: relative
#menuBackground
.menuBackground
height: 20px
max-width: 950px
background: #FFF
#menu
.menu
white-space: nowrap
position: absolute
height: 20px
@@ -73,7 +73,7 @@ body
font-family: "Open Sans", Arial, Helvetica, sans-serif
font-weight: 600
font-size: .8em
#menu a
.menu a
margin: 0 0 0 5px
text-decoration: none
color: black
@@ -85,7 +85,7 @@ body
-webkit-box-sizing: border-box /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box /* Firefox, other Gecko */
box-sizing: border-box /* Opera/IE 8+ */
#menu a:hover
.menu a:hover
opacity: .7
color: black
border-bottom: 1px solid red
@@ -125,14 +125,14 @@ body
/* Large(r) Devices (tablets and full computers) */
@media(min-width: 550px)
#head
.head
margin: 0 auto
background: url(images/HeaderTall_v1test.jpg) no-repeat top center
background-size: 100%
background-position: bottom left
max-width: 950px
height: 171px
#head.tall
.head.tall
height: 342px
#logo
position: absolute
@@ -147,11 +147,11 @@ body
margin: 0 auto
padding: 30px 20px
position: relative
#menuBackground
.menuBackground
height: 5rem
max-width: 950px
background: #DDE1D5
#menu
.menu
white-space: nowrap
position: absolute
height: 2.5rem
@@ -163,7 +163,7 @@ body
display: flex
justify-content: space-between
margin-left: 10%
#menu a
.menu a
margin: 0 auto
margin-top: .325rem
white-space: nowrap
@@ -177,57 +177,23 @@ body
-webkit-box-sizing: border-box /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box /* Firefox, other Gecko */
box-sizing: border-box /* Opera/IE 8+ */
#menu a.holidayMenuItem
.menu a.holidayMenuItem
font-family: "Grand Hotel", "Open Sans", Arial, Helvetica, sans-serif
font-weight: 400
font-size: 1.3em
letter-spacing: 1px
vertical-align: top
#menu a.shippingMenuItem
.menu a.shippingMenuItem
font-family: "Grand Hotel", "Open Sans", Arial, Helvetica, sans-serif
font-weight: 400
font-size: 1.3em
letter-spacing: 1px
vertical-align: top
#menu a:hover
.menu a:hover
opacity: 1
color: #9E8200
background: transparent
border-bottom: 3px solid #9E8200
.menu2
white-space: nowrap
background-color: #9E8200
position: absolute
top: 2.75rem
height: 2rem
width: 80%
z-index: 200
font-family: "Open Sans", Arial, Helvetica, sans-serif
font-weight: 600
font-size: 1.25rem
display: flex
justify-content: space-between
margin-left: 10%
.menu2.hidden
display: none
.menu2 a
margin: 0 auto
margin-top: .325rem
white-space: nowrap
text-decoration: none
color: black
line-height: 30px
display: inline-block
height: 30px
border-bottom: 3px solid transparent
/* Force the browser to include padding and border as part of the size of the block. */
-webkit-box-sizing: border-box /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box /* Firefox, other Gecko */
box-sizing: border-box /* Opera/IE 8+ */
.menu2 a:hover
opacity: 1
color: blue
background: transparent
#links
white-space: nowrap
position: absolute
@@ -293,7 +259,7 @@ h1
/* bar in the middle */
//display: table
//width: 100%
//margin-bottom: 10px
//margin-bottom: 10px
white-space: nowrap
color: black
font-family: 'trebuchet ms', verdana, arial, helvetica, sans-serif
@@ -313,7 +279,7 @@ h1:after
// width: 100%
// border-left: 100% solid black
// background-image: linear-gradient(transparent 47%, #dddddd 48%, #dddddd 52%, transparent 52%)
h2
display: inline
color: #333
@@ -348,6 +314,12 @@ li
sup, sub
line-height: 0.1em
.pageBorder
background-color: blue
padding: 40px 10px 10px 10px
margin-bottom: 20px
margin-top: 10px
.submenu
h2:after
border-bottom: 1px solid gray
@@ -369,7 +341,7 @@ sup, sub
-moz-column-fill: balance
column-fill: balance
.columnContent
height:15rem
height: 15rem
text-align: center
cursor: pointer
margin: 4px 15px 4px 15px
@@ -476,17 +448,17 @@ sup, sub
//background: url(images/Chicken-Egg.gif) no-repeat center top
/* Footer Lines */
#footer
.footer
margin-top: 6px
color: #666
font-family: verdana, arial, helvetica, sans-serif
font-size: 0.7em
text-align: left
#footer a
.footer a
color: #666
font-family: verdana, arial, helvetica, sans-serif
text-decoration: none
#footer a:hover
.footer a:hover
color: #00a55d
#designedBy
@@ -579,4 +551,4 @@ sup, sub
float: left
margin: 4px 10px 10px 0
.blogLink
//color: #e40329 !important
//color: #e40329 !important

71
public/index.html
View File

@@ -12,9 +12,9 @@
<meta name="revisit-after" content="12 days"/>
<meta name="robots" content="index, follow"/>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Petit Teton Farm</title>
<link rel="shortcut icon" href="images/Chicken.ico"/>
<link rel="stylesheet" href="main.css" type="text/css"/>
<script type="text/javascript" language="JavaScript" src="js/jquery-1.12.4.min.js"></script>
@@ -25,54 +25,37 @@
<script type="text/javascript" language="JavaScript" src="js/jquery.cycle2.min.js"></script>
<script type="text/javascript" language="JavaScript" src="js/jquery.shadow.js"></script>
<script type="text/javascript" language="JavaScript" src="js/scroller.js"></script>
<!--<script type="text/javascript" language="JavaScript" src="js/framework.js"></script>-->
<script type="text/javascript" language="JavaScript" src="js/main.js"></script>
</head>
<body>
<div id="overall">
<div id="page">
<div id="menu"><!-- Note: Comment out spacing between the elements since the browser will interpret the spaces as characters to be displayed.
--><a href="#!/farm">Home</a><!--
--><a href="#!/food">Food</a><!--
--><a href="#!/markets">Markets</a><!--
--><a href="#!/us">About Us</a><!--
--<a href="#!/animals">Animals</a><!--
--<a href="#!/services">Services</a><!--
--><a class="blogLink" style="display: inline" target="_blank" href="//blog.petitteton.com">Blog</a><!--
--><!--<a href="#!/holidays" class="holidayMenuItem">Holidays</a>--><!--
--><!--<a href="#!/shipping" class="shippingMenuItem">Shipping</a>--><!--
--></div>
<div id="submenu-home" class="menu2 hidden"></div>
<div id="submenu-food" class="menu2 hidden"><!-- Note: Comment out spacing between the elements since the browser will interpret the spaces as characters to be displayed.
--><a href="#!/canned">Canned</a><!--
--><a href="#!/produce">Produce</a><!--
--></div>
<!-- <div id="links">-->
<!-- &lt;!&ndash; Note: Comment out spacing between the elements since the browser will interpret the spaces as characters to be displayed. &ndash;&gt;-->
<!--&lt;!&ndash; <a id="linkFacebook" href="http://www.facebook.com/pages/Petit-Teton-Farm/229690830390080?sk=wall#" target='_blank' rel="nofollow"></a>&lt;!&ndash;&ndash;&gt;-->
<!--&lt;!&ndash; &ndash;&gt;<a id="linkGoogle" href="https://plus.google.com/104893482629844050636/about" target='_blank' rel="nofollow"></a>&lt;!&ndash;&ndash;&gt;-->
<!--&lt;!&ndash; &ndash;&gt;<a id="linkTwitter" style="display: none" href="https://twitter.com/PetitTeton" target='_blank' rel="nofollow"></a>&ndash;&gt;-->
<!-- </div>-->
<div id="menuBackground"></div>
<div id="head">
<div id="logo" onclick="window.location.hash='#!/farm'"></div>
</div>
<div id="content" bs-view="main-view">
<!--CONTENT:main-->
<div class="pageBorder">
<div class="page">
<div class="menu"><!-- Note: Comment out spacing between the elements since the browser will interpret the spaces as characters to be displayed.
--><a href="#!/farm">Home</a><!--
--><a href="#!/food">Food</a><!--
--><a href="#!/markets">Markets</a><!--
--><a href="#!/us">About Us</a><!--
--><a class="blogLink" style="display: inline" target="_blank" href="//blog.petitteton.com">Blog</a><!--
--></div>
<div class="menuBackground"></div>
<div class="head">
<div id="logo" onclick="window.location.hash='#!/farm'"></div>
</div>
<div id="content" bs-view="main-view">
<!--CONTENT:main-->
</div>
</div>
<div>
<p style="text-align: center;"><strong>Petit Teton Farm</strong>
<br>18501 Hwy 128, Yorkville, CA 95494
<br>707-123-4567
<br><a href="mailto:farmer@petitteton.com">farmer@petitteton.com</a>
</p></div>
<!-- footer lines -->
<div class="footer">&copy; 2009,2023 Petit Teton LLC | Farm Email <a href="mailto:farmer@petitteton.com">farmer@petitteton.com</a></div>
</div>
<div>
<p style="text-align: center;"><strong>Petit Teton Farm</strong>
<br>18501 Hwy 128, Yorkville, CA 95494
<br>707-123-4567
<br><a href="mailto:farmer@petitteton.com">farmer@petitteton.com</a>
</p></div>
<!-- footer lines -->
<div id="footer">&copy; 2009,2023 Petit Teton LLC | Farm Email <a href="mailto:farmer@petitteton.com">farmer@petitteton.com</a></div>
<!-- <div id="designedBy" style="">-->
<!-- Web Site By: <a href="http://de22.com" style="font-weight: normal" target="_blank">Declarative Engineering LLC</a>-->
<!-- </div>-->
</div>
</body>
</html>
</html>

66
public/js/main.js
View File

@@ -1,22 +1,22 @@
var slideShowIndex = 0;
var slideShowSlides = []; //An array of arrays - each sub-array contains the image path, title, description, width, and height.//
var scrollerScrollTime = 3500;
var scrollerInitialDelay = 5000;
var scrollerTransitionTime = 1000;
let slideShowIndex = 0;
let slideShowSlides = []; //An array of arrays - each sub-array contains the image path, title, description, width, and height.//
let scrollerScrollTime = 3500;
let scrollerInitialDelay = 5000;
let scrollerTransitionTime = 1000;
window.status="";
//Handle the document ready event which is where any initialization code goes.
$(document).ready(function($) {
var contentDiv = $('#content');
//var viewName = "main-view";
//var view = $('[bs-view="' + viewName + '"]');
let contentDiv = $('#content');
//let viewName = "main-view";
//let view = $('[bs-view="' + viewName + '"]');
//if(!view || view.length != 1) {
// throw "View with name: '" + viewName + "' not found";
//}
//var layoutManager = new LayoutManager("main-view");
var layoutManager = new LayoutManager(contentDiv);
//let layoutManager = new LayoutManager("main-view");
let layoutManager = new LayoutManager(contentDiv);
//layoutManager.defaultUrl = '!/holidays';
layoutManager.defaultUrl = '!/home';
layoutManager.pageClassFades = [
@@ -25,7 +25,7 @@ $(document).ready(function($) {
layoutManager.viewMetadataDefaults = {classes: 'full'};
// layoutManager.viewMetadata = {
// weddings: {
// load: "element.data('scroller', new ItemScroller($('div.scrollViewport'), 142, scrollerScrollTime, scrollerInitialDelay, scrollerTransitionTime, false));",
// load: "element.data('scroller', new ItemScroller($('div.scrollViewport'), 142, scrollerScrollTime, scrollerInitialDelay, scrollerTransitionTime, false));",
// unload:"element.data('scroller').release(); element.data('scroller', undefined);"
// },
// home: {
@@ -41,35 +41,35 @@ $(document).ready(function($) {
// load: "$('#head').addClass('tall');",
// unload: "$('#head').removeClass('tall')"
// },
farm: {
load: "$('#submenu-home').removeClass('hidden')",
unload: "$('#submenu-home').addClass('hidden')"
},
food: {
load: "$('#submenu-food').removeClass('hidden')",
unload: "$('#submenu-food').addClass('hidden')"
},
canned: {
load: "$('#submenu-food').removeClass('hidden')",
unload: "$('#submenu-food').addClass('hidden')"
},
produce: {
load: "$('#submenu-food').removeClass('hidden')",
unload: "$('#submenu-food').addClass('hidden')"
}
// farm: {
// load: "$('#submenu-home').removeClass('hidden')",
// unload: "$('#submenu-home').addClass('hidden')"
// },
// food: {
// load: "$('#submenu-food').removeClass('hidden')",
// unload: "$('#submenu-food').addClass('hidden')"
// },
// canned: {
// load: "$('#submenu-food').removeClass('hidden')",
// unload: "$('#submenu-food').addClass('hidden')"
// },
// produce: {
// load: "$('#submenu-food').removeClass('hidden')",
// unload: "$('#submenu-food').addClass('hidden')"
// }
};
//Associate a function with the history jquery addon that will load the url content after the history is updated.
$.history.init(function(url) {
if(!url || url.length == 0) {
url = layoutManager.defaultUrl;
}
layoutManager.show(url);
});
/*
var websocket = new WebSocket('ws://petitteton.com/');
let websocket = new WebSocket('ws://petitteton.com/');
websocket.onopen = function() {
websocket.ping();
};
@@ -80,4 +80,4 @@ $(document).ready(function($) {
console.log('Server: ' + message);
};
*/
});
});