A bunch of changes to kick off remaking the website.

This commit is contained in:
2025-09-13 11:48:21 -07:00
parent 1f942b113d
commit d8b158f63b
21 changed files with 179 additions and 96 deletions

6
.theia/launch.json Normal file
View File

@@ -0,0 +1,6 @@
{
// Use IntelliSense to learn about possible attributes.
// Hover to view descriptions of existing attributes.
"version": "0.2.0",
"configurations": []
}

View File

@@ -1,4 +1,4 @@
#farm-made-fare
#canned
.mainTextBlock
.secondaryTextBlock

View File

@@ -12,7 +12,7 @@ html, body, #archives ul, #overall-footer, #content ul
margin: 0 0 0 0
padding: 0 0 0 0
body
background: #F6F6F6
background: #84916E
font-family: verdana, arial, helvetica, sans-serif
font-size: 1.0em
@@ -37,16 +37,16 @@ body
min-width: 250px
margin: 0 auto
#page
/*background: url('images/GrassBackground_v1.jpg') repeat
background: #F6F6F6*/
background: #FDFDFD
/*background: url('images/GrassBackground_v1.jpg') repeat*/
//background: #F6F6F6
background: #DDE1D5
/* Small Devices (phones) */
@media(max-width: 549px)
#head
margin: 0 auto
/*background: url(images/Header_v2.jpg) no-repeat top center
height: 171px*/
//background: url(images/Header_v2.jpg) no-repeat top center
//height: 171px
height: 0
#logo
position: absolute
@@ -127,7 +127,7 @@ body
@media(min-width: 550px)
#head
margin: 0 auto
background: url(images/HeaderTall_v1.jpg) no-repeat top center
background: url(images/HeaderTall_v1test.jpg) no-repeat top center
background-size: 100%
background-position: bottom left
max-width: 950px
@@ -136,8 +136,8 @@ body
height: 342px
#logo
position: absolute
right: 10px
top: 10px
left: 10px
top: 90px
width: 120px
height: 120px
background: url(images/PetitTetonLogo_v2.png) no-repeat top center
@@ -148,20 +148,25 @@ body
padding: 30px 20px
position: relative
#menuBackground
height: 31px
height: 5rem
max-width: 950px
background: #FFF
background: #DDE1D5
#menu
white-space: nowrap
position: absolute
height: 30px
margin-bottom: 1px
height: 2.5rem
width: 80%
z-index: 200
font-family: "Open Sans", Arial, Helvetica, sans-serif
font-weight: 600
font-size: 1em
font-size: 1.25rem
display: flex
justify-content: space-between
margin-left: 10%
#menu a
margin: 0 0 0 16px
margin: 0 auto
margin-top: .325rem
white-space: nowrap
text-decoration: none
color: black
line-height: 30px
@@ -186,9 +191,43 @@ body
vertical-align: top
#menu a:hover
opacity: 1
color: black
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
border-bottom: 3px solid #a20010
#links
white-space: nowrap
position: absolute
@@ -268,13 +307,13 @@ h1:after
margin-bottom: 10px
content: ""
display: block
/* bar in the middle
content: ""
display: table-cell
width: 100%
border-left: 100% solid black
background-image: linear-gradient(transparent 47%, #dddddd 48%, #dddddd 52%, transparent 52%)
*/
// bar in the middle
// content: ""
// display: table-cell
// width: 100%
// border-left: 100% solid black
// background-image: linear-gradient(transparent 47%, #dddddd 48%, #dddddd 52%, transparent 52%)
h2
display: inline
color: #333
@@ -330,6 +369,7 @@ sup, sub
-moz-column-fill: balance
column-fill: balance
.columnContent
height:15rem
text-align: center
cursor: pointer
margin: 4px 15px 4px 15px
@@ -539,4 +579,4 @@ sup, sub
float: left
margin: 4px 10px 10px 0
.blogLink
color: #e40329 !important
//color: #e40329 !important

View File

@@ -1,4 +1,4 @@
#veggies
#produce
.produceTable
min-width: 200px
float: left

View File

@@ -1 +1,2 @@
#aphome

View File

@@ -1,5 +1,5 @@
<div id="farm-made-fare" class="page">
<h1>FARM-MADE FARE</h1>
<div id="canned" class="page">
<h1>Canned Goods</h1>
<!--<div class="secondaryTextBlock">-->
<!--<img class="shipImage" src="images/WeShip_v1.jpg"/>-->
<!--<p>We now ship our farm made fare. For those who cannot visit the farm or come to a farmers' market, there is now the option to call <b>707.684.4146</b> or email <a href="mailto:farmer@petitteton.com"><b>farmer@petitteton.com</b></a> with an order. Download the latest product list below, choose what interests you, then let us know. If emailing, include your mailing address and payment preference. We will check availability and give you a total, then you can send a check, call with your credit card number or have us send a PayPal bill to your email address. We will ship as soon as we have payment. -->

View File

@@ -1,5 +1,5 @@
<div id="eggs" class="page">
<h1>Chickens &amp; EGGS</h1>
<h1>Eggs &amp; Meat</h1>
<p><img class="shadow floatLeft" style="width:160px;height:120px;" src="images/Eggs1_v1.jpg" alt="" border="0" align="left"/>
The eggs in our cartons look as though they've come from an Easter basket - many shades of brown and green, and different sizes!
It's the result of our wide variety of hens, including Rhode Island Red & White, Plymouth Rock, Sexlink, Buff Orpington, Araucana, Barred Rock, Cochin, Maran, and Australorp.

View File

@@ -1,38 +1,40 @@
<div id="farm" class="page submenu">
<div class="columnContainer">
<h1>Farm</h1>
<!--<h1>Petit Teton Farm</h1>
<-->
<div class="columned">
<!--<div class="columnContent" onclick="window.location.hash='#!/farm-made-fare'">-->
<!--<h2>Now Shipping</h2>-->
<!--<img class="shadow" src="images/WeShip_v1.jpg" alt="" border="0" align="left"/>-->
<!--<p>We now ship our farm-made fare.</p>-->
<!--</div>-->
<div class="columnContent" onclick="window.location.hash='#!/land'">
<h2>Our Land</h2>
<img class="shadow" src="images/Farm_Land_v1.jpg" alt="" border="0" align="left"/>
<p>The land we own had been a ranch for generations, part of a much larger spread, and was still a small sheep ranch when we bought it in 2004. In 2011 we bought the neighboring property...</p>
<div class="columnContent" onclick="window.location.hash='#!/food'">
<h2>Food</h2>
<img class="shadow" src="images/FoodFMF_v2_CropTest.jpg" alt="" border="0" align="left"/>
<p style="text-align: center;"></p>
</div>
<div class="columnContent" onclick="window.location.hash='#!/us'">
<h2>About Us</h2>
<img class="shadow" src="images/Farm_AboutUs_v1.jpg" alt="" border="0" align="left"/>
<p>Our jobs on the farm and our backgrounds...</p>
<div class="columnContent" onclick="window.location.hash='#!/land'">
<h2>Our Story</h2>
<img class="shadow" src="images/Farm_Land_v1.jpg" alt="" border="0" align="left"/>
<p style="text-align: center;"></p>
</div>
<div class="columnContent" onclick="window.location.hash='#!/markets'">
<h2>Markets</h2>
<img class="shadow" src="images/Farm_Markets_v1.jpg" alt="" border="0" align="left"/>
<p>For many years now we've sold our produce at farmers' markets. Currently you'll find us...</p>
</div>
<div class="columnContent" onclick="window.location.hash='#!/aquaponics'">
<h2>Aquaponics</h2>
<img class="shadow" src="images/Farm_Aquaponics_v1.jpg" alt="" border="0" align="left"/>
<p>Aquaponics is a system of growing crops and fish in tandem. The water is recycled continuously and the fish...</p>
<img class="shadow" src="images/Farmers_Market_1_CropTest.jpg" alt="" border="0" align="left"/>
<p style="text-align: center;"></p>
</div>
<div class="columnContent" onclick="window.location.hash='#!/animals'">
<h2>Animals</h2>
<img class="shadow" src="images/FoodBeef_v1.jpg" alt="" border="0" align="left"/>
<h2>Blog</h2>
<img class="shadow" src="images/Farm_AboutUs_v1.jpg" alt="" border="0" align="left"/>
<p>...</p>
</div>
<div class="columnContent" onclick="window.location.hash='#!/us'">
<h2>About Us</h2>
<img class="shadow" src="images/Visit4_v1_CropTest.jpg" alt="" border="0" align="left"/>
<p style="text-align: center;"></pstyle></p>
</div>
<!--<div class="columnContent" onclick="window.location.hash='#!/visiting'">-->
<!--<h2>Contact &amp; Visit</h2>-->
<!--<img class="shadow" src="images/Driveway2_v2.jpg" alt="" border="0" align="left"/>-->

View File

@@ -1,14 +1,14 @@
<div id="food" class="page submenu">
<div class="columnContainer">
<h1>Food</h1>
<div class="columned">
<div class="columnContent" onclick="window.location.hash='#!/farm-made-fare'">
<h2>Farm-Made Fare</h2>
<div class="columned">
<div class="columnContent" onclick="window.location.hash='#!/canned'">
<h2>Canned Goods</h2>
<img class="shadow" src="images/FoodFMF_v1.jpg" alt="" border="0" align="left"/>
<p>Check out what we are cooking in the kitchen!</p>
</div>
<div class="columnContent" onclick="window.location.hash='#!/eggs'">
<h2>Meat &amp; Eggs</h2>
<h2>Eggs &amp; Meat</h2>
<img class="shadow" src="images/FoodEggs_v1.jpg" alt="" border="0" align="left"/>
<p>Eggs from our truly free range chickens are provided in a colorful array and sold by the dozen.</p>
</div>
@@ -32,7 +32,7 @@
<!--<img class="shadow" src="images/FoodChicken_v1.jpg" alt="" border="0" align="left"/>-->
<!--<p>We have over 100 laying hens spread across several areas of the farm, and we sell the spent laying hens as organic fed chicken.</p>-->
<!--</div>-->
<div class="columnContent" onclick="window.location.hash='#!/veggies'">
<div class="columnContent" onclick="window.location.hash='#!/produce'">
<h2>Produce</h2>
<img class="shadow" src="images/FoodVeggies_v1.jpg" alt="" border="0" align="left"/>
<p>We grow and sell a very wide variety of freshly picked produce.</p>

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 219 KiB

After

Width:  |  Height:  |  Size: 417 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 440 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 53 KiB

View File

@@ -33,15 +33,21 @@
<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">Farm</a><!--
--><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 href="#!/visiting">Contact / Visit</a><!--
--><a class="blogLink" style="display: none" target="_blank" href="//blog.petitteton.com">Blog</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;-->
@@ -50,12 +56,18 @@
<!-- </div>-->
<div id="menuBackground"></div>
<div id="head">
<div id="logo" onclick="window.location.hash='#!/grow-and-can'"></div>
<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 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="">-->

View File

@@ -23,16 +23,39 @@ $(document).ready(function($) {
{cls: 'full', fadeIn: null, fadeOut: null}
];
layoutManager.viewMetadataDefaults = {classes: 'full'};
// layoutManager.viewMetadata = {
// weddings: {
// load: "element.data('scroller', new ItemScroller($('div.scrollViewport'), 142, scrollerScrollTime, scrollerInitialDelay, scrollerTransitionTime, false));",
// unload:"element.data('scroller').release(); element.data('scroller', undefined);"
// },
// home: {
// load: "$('#head').addClass('tall')",
// unload: "$('#head').removeClass('tall')"
// //load: "$('#head, #links').css({display: 'none'})",
// //unload: "$('#head, #links').css({display: 'block'})"
// }
// };
layoutManager.viewMetadata = {
weddings: {
load: "element.data('scroller', new ItemScroller($('div.scrollViewport'), 142, scrollerScrollTime, scrollerInitialDelay, scrollerTransitionTime, false));",
unload:"element.data('scroller').release(); element.data('scroller', undefined);"
// home: {
// load: "$('#head').addClass('tall');",
// unload: "$('#head').removeClass('tall')"
// },
farm: {
load: "$('#submenu-home').removeClass('hidden')",
unload: "$('#submenu-home').addClass('hidden')"
},
home: {
load: "$('#head').addClass('tall')",
unload: "$('#head').removeClass('tall')"
//load: "$('#head, #links').css({display: 'none'})",
//unload: "$('#head, #links').css({display: 'block'})"
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')"
}
};

File diff suppressed because one or more lines are too long

27
public/main.sass Normal file
View File

@@ -0,0 +1,27 @@
@use 'index'
@use "clearfix"
@use "home"
@use "farm"
@use "food"
@use "animals"
@use "services"
@use "holidays"
@use "produce"
@use "grow-and-can"
@use "eggs"
@use "beef"
@use "pigs"
@use "chicken"
@use "markets"
@use "slideshow"
@use "visiting"
@use "weddings"
@use "community"
@use "yaks"
@use "us"
@use "canned"
@use "aquaponics"
@use "shipping"
@use "ap/aphome"
@use "ap/airlift"

View File

@@ -1,28 +0,0 @@
@use 'basic';
@use "clearfix";
@use "home";
@use "farm";
@use "food";
@use "animals";
@use "services";
@use "holidays";
@use "farm-made-fare";
@use "grow-and-can";
@use "eggs";
@use "beef";
@use "pigs";
@use "chicken";
@use "markets";
@use "slideshow";
@use "visiting";
@use "weddings";
@use "yaks";
@use "community";
@use "yaks";
@use "us";
@use "veggies";
@use "aquaponics";
@use "shipping";
@use "ap/aphome";
@use "ap/airlift";

View File

@@ -1,4 +1,4 @@
<div id="veggies" class="page">
<div id="produce" class="page">
<h1>PRODUCE</h1>
<p>We grow a cornucopia of fruits and vegetables at <b>Petit Teton</b>. Below is a listing of the things we have grown over the years. We do not use chemicals, and we use organic seed where possible (never GMO). To bring the best quality product to you, we practice biodiversity, make our own compost from crop and animal waste, and rotate crops. We grow our crops a lot like family farms 100 years ago did, before corporations took over the business of farming.</p>
<span class="produceTable">