aug25
This commit is contained in:
parent
cfd615e807
commit
c61099379d
23 changed files with 2240 additions and 72 deletions
53
src/main.rs
53
src/main.rs
|
@ -1,4 +1,3 @@
|
||||||
// use rocket macros globally
|
|
||||||
#[macro_use] extern crate rocket;
|
#[macro_use] extern crate rocket;
|
||||||
|
|
||||||
// push strings to path
|
// push strings to path
|
||||||
|
@ -10,10 +9,11 @@ use std::path::{ PathBuf, Path };
|
||||||
use rocket::fs::{ NamedFile, relative };
|
use rocket::fs::{ NamedFile, relative };
|
||||||
|
|
||||||
// Set MIME-Types, Accept Header for Response
|
// Set MIME-Types, Accept Header for Response
|
||||||
use rocket::http::{ Accept, QMediaType, MediaType };
|
use rocket::http::{ Accept, MediaType };
|
||||||
|
use rocket::http::ContentType;
|
||||||
|
|
||||||
// Equivalent to main()
|
// Equivalent to main()
|
||||||
#[rocket::main] // enable asyn main()
|
#[rocket::main] // enable async main()
|
||||||
async fn main() -> Result<(), rocket::Error> {
|
async fn main() -> Result<(), rocket::Error> {
|
||||||
|
|
||||||
// State Rocket<Build> => configuration
|
// State Rocket<Build> => configuration
|
||||||
|
@ -26,11 +26,7 @@ async fn main() -> Result<(), rocket::Error> {
|
||||||
// State Rocket<Ignite> => Finalized App ready to launch
|
// State Rocket<Ignite> => Finalized App ready to launch
|
||||||
// check before launching
|
// check before launching
|
||||||
// catch errors
|
// catch errors
|
||||||
// constructs FileServer with Path
|
.mount("/", routes![ index, fileserver, experiments, perma, greentech ])
|
||||||
.mount("/", routes![index, fileserver])
|
|
||||||
|
|
||||||
//FileServer unable to set Mime-Types
|
|
||||||
// .mount("/", FileServer::from(relative!("templates/assets")))
|
|
||||||
|
|
||||||
.ignite().await?
|
.ignite().await?
|
||||||
// State Rocket<Orbit> => Running App
|
// State Rocket<Orbit> => Running App
|
||||||
|
@ -46,11 +42,28 @@ async fn main() -> Result<(), rocket::Error> {
|
||||||
#[route(GET, uri = "/")]
|
#[route(GET, uri = "/")]
|
||||||
// if success call handler
|
// if success call handler
|
||||||
async fn index() -> Option<NamedFile> {
|
async fn index() -> Option<NamedFile> {
|
||||||
|
|
||||||
NamedFile::open("templates/index.html").await.ok()
|
NamedFile::open("templates/index.html").await.ok()
|
||||||
}
|
}
|
||||||
|
|
||||||
// Serve static files from Index.html
|
// serve other pages (html GET)
|
||||||
|
// create routes for pages
|
||||||
|
#[get("/experiments")]
|
||||||
|
async fn experiments() -> Option<NamedFile> {
|
||||||
|
NamedFile::open("templates/experiments.html").await.ok()
|
||||||
|
}
|
||||||
|
|
||||||
|
#[get("/permaculture")]
|
||||||
|
async fn perma() -> Option<NamedFile> {
|
||||||
|
NamedFile::open("templates/permaculture.html").await.ok()
|
||||||
|
}
|
||||||
|
|
||||||
|
#[get("/greentech")]
|
||||||
|
async fn greentech() -> Option<NamedFile> {
|
||||||
|
NamedFile::open("templates/greentech.html").await.ok()
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
// Serve static files from /
|
||||||
// Match against multiple segments
|
// Match against multiple segments
|
||||||
// parameters need to implement FromSegments
|
// parameters need to implement FromSegments
|
||||||
// PathBuf implements FromSegments
|
// PathBuf implements FromSegments
|
||||||
|
@ -58,21 +71,15 @@ async fn index() -> Option<NamedFile> {
|
||||||
// Option<Some, Err> implements Responder
|
// Option<Some, Err> implements Responder
|
||||||
// NamedFile implements Responder => generates Response
|
// NamedFile implements Responder => generates Response
|
||||||
#[route(GET, uri= "/<path..>")]
|
#[route(GET, uri= "/<path..>")]
|
||||||
async fn fileserver(path: PathBuf) -> Option<NamedFile> {
|
async fn fileserver(path: PathBuf) -> Option<NamedFile> { // PathBuf = Heapstring, growable
|
||||||
// set path to static files
|
// set path to static files
|
||||||
let mut path = Path::new(relative!("templates/assets")).join(path);
|
let mut path = Path::new(relative!("templates/assets")).join(path); // Path = stack string, fixed size
|
||||||
// if path exists add path to index.html ?
|
// path accessible from /
|
||||||
let accept = vec![
|
|
||||||
MediaType::CSS.into(), MediaType::JavaScript.into(),
|
|
||||||
];
|
|
||||||
|
|
||||||
if path.is_dir() {
|
// Note: How to serve fontawesome ?
|
||||||
path.push("templates/index.html");
|
if path.ends_with("all.css") {
|
||||||
Accept::new(accept);
|
println!("Can not load fontawesome icons at: {:?}", path);
|
||||||
}
|
}
|
||||||
|
// Open file at path
|
||||||
// open file readonly
|
|
||||||
// NamedFile = Response
|
|
||||||
println!("{:?}", path);
|
|
||||||
NamedFile::open(path).await.ok()
|
NamedFile::open(path).await.ok()
|
||||||
}
|
}
|
112
templates/assets/components/experiments-content.html
Normal file
112
templates/assets/components/experiments-content.html
Normal file
|
@ -0,0 +1,112 @@
|
||||||
|
|
||||||
|
<div class="page-wrapper">
|
||||||
|
<section class="title">
|
||||||
|
<h1>Experiments</h1>
|
||||||
|
<p class="short">Each of our CBD products helps you and us understand our planet.</p>
|
||||||
|
<div class="image">
|
||||||
|
<img id="mobile" src="global/img/sample-closeup-oil.png">
|
||||||
|
<img id="desktop" src="global/img/sample-closeup-oil.png">
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section id="about">
|
||||||
|
<p> #oils&soon flower&edibles Our Experiments explore how plants react to changes.<br>
|
||||||
|
Environmental conditions and the relations between plants define a plants health, growth taste and effect. <br>
|
||||||
|
With our Experiments strive to understand our planet in order to create an organic, automated indoor garden for everyone, everywhere.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section id="links">
|
||||||
|
<div id="oils-link">
|
||||||
|
<div class="image" id="gallery">
|
||||||
|
<div class="main-img">
|
||||||
|
<a href="oils.html">
|
||||||
|
<img id="current" src="global/img/sample-sauvage.svg"><!--replace with sauvage-->
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="imgs">
|
||||||
|
<img src="global/img/sample-sauvage.svg">
|
||||||
|
<img src="global/img/img1.jpg">
|
||||||
|
<img src="global/img/img2.jpg">
|
||||||
|
<img src="global/img/img3.jpg">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
<h3 class="heading">CBD Oils</h3>
|
||||||
|
<p class="text">
|
||||||
|
Explore all our full-spectrum CBD oils
|
||||||
|
All oils are of 100% organic grown italian hemp. <br>The experiments vary in extraction methods, strain selection and carrier oil. Each experiment is distinguished through the selection of environmental conditions and partnerplants.<br>
|
||||||
|
Explore everything from salvia flavoured - to robot grown CBD.
|
||||||
|
</p>
|
||||||
|
<ul>
|
||||||
|
<li> hemp grown in italy</li>
|
||||||
|
<li> lab tested</li>
|
||||||
|
<li> available in strenghts X</li>
|
||||||
|
<li> all oils contain less than .2% THC</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="page-button">
|
||||||
|
<a href="oils.html">Explore</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="flower-link">
|
||||||
|
<div class="image">
|
||||||
|
<div class="main-img">
|
||||||
|
<a href="flower.html">
|
||||||
|
<img id="flower" src="global/img/sample-plant-flower.jpg">
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="flowers">
|
||||||
|
<img src="global/img/sample-flower.svg">
|
||||||
|
<img src="global/img/sample-light.jpg">
|
||||||
|
<img src="global/img/sample-girl.jpg">
|
||||||
|
<img src="global/img/sample-plant-flower.jpg">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
<h3>CBD Flower</h3>
|
||||||
|
<p class="text">
|
||||||
|
<span>Coming Soon : CBD Flower </span><br>Explore our current & future experiments..<br>
|
||||||
|
Learn about Flower flavoured with homegrown fruit, sun-flower, b-flower and more.. that are currently experimented on #dummy text.</p>
|
||||||
|
<ul>
|
||||||
|
<li> hemp grown in italy</li>
|
||||||
|
<li> lab tested</li>
|
||||||
|
<li> all flowers contain less than .2% THC</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="page-button">
|
||||||
|
<a href="flower.html">Learn</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="edibles-link">
|
||||||
|
<div class="image">
|
||||||
|
<div class="main-img">
|
||||||
|
<a href="edibles.html">
|
||||||
|
<img id="fruit" src="global/img/sample-lemon.png">
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="fruits">
|
||||||
|
<img src="global/img/sample-jelly.jpg">
|
||||||
|
<img src="global/img/sample-herbs.jpg">
|
||||||
|
<img src="global/img/sample-mate.jpg">
|
||||||
|
<img src="global/img/sample-lemon.png">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="description">
|
||||||
|
<h3>Candy</h3>
|
||||||
|
<p class="text" class="additional"><span>Coming Soon : CBD Edibles</span><br>Explore future experiments.<br>
|
||||||
|
Learn about organic CBD gummies,<br> homemade CBD lemonade, CBD cookies and more.#dummy text</p>
|
||||||
|
<ul>
|
||||||
|
<li> hemp grown in italy</li>
|
||||||
|
<li> organic fruit and herbs</li>
|
||||||
|
<li> all edibles contain less than .2% THC</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div class="page-button">
|
||||||
|
<a href="edibles.html">Learn</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
<script src="global/js/image.js"></script>
|
102
templates/assets/components/footer.html
Normal file
102
templates/assets/components/footer.html
Normal file
|
@ -0,0 +1,102 @@
|
||||||
|
|
||||||
|
<footer class="footer" style="font-family: 'Fira Sans', sans-serif;">
|
||||||
|
<div id="footer-wrapper">
|
||||||
|
<div id="column1">
|
||||||
|
<a href="../../../responsive.html">
|
||||||
|
<h3><span>Cannabinieri</span>@</h3>
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div id="column2">
|
||||||
|
<h6 onclick="show()">Information
|
||||||
|
<span class="show">
|
||||||
|
<i class="arrow down"></i>
|
||||||
|
</span>
|
||||||
|
</h6>
|
||||||
|
<ul id="information">
|
||||||
|
<li>
|
||||||
|
<p>
|
||||||
|
<a href="meet.html">Contact Us</a>
|
||||||
|
</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p>
|
||||||
|
<a href="#">FAQ</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p>
|
||||||
|
<a href="#">Certificate of Analysis</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="column3">
|
||||||
|
<h6 onclick="display()">links
|
||||||
|
<span class="show">
|
||||||
|
<i class="arrow down2"></i>
|
||||||
|
</span>
|
||||||
|
</h6>
|
||||||
|
<ul id="footer-links">
|
||||||
|
<li>
|
||||||
|
<p>
|
||||||
|
<a href="#">Blog</a>
|
||||||
|
</p>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p>
|
||||||
|
<a href="#">Shop</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<p>
|
||||||
|
<a class="code" href="#">Code</a>
|
||||||
|
</p>
|
||||||
|
|
||||||
|
</li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
<div id="column4">
|
||||||
|
<h6>TO BE SAID</h6>
|
||||||
|
<p> All our products contain<br class ="desktop">less than 0.2% THC</p>
|
||||||
|
</div>
|
||||||
|
<div id="column5">
|
||||||
|
<h6 class="follow">Follow us</h6>
|
||||||
|
<div id="social-media">
|
||||||
|
<ul>
|
||||||
|
<li class="youtube">
|
||||||
|
<a href="#">
|
||||||
|
<img id="youtube" src= "global/img/peertube.svg">
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#">
|
||||||
|
<img id="instagram" src="global/img/pixelfed.svg">
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li>
|
||||||
|
<a href="#">
|
||||||
|
<img id="gitea" src="global/img/gitea.svg">
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div id="row2">
|
||||||
|
<p id ="print">©2021 Cannabinieri</p>
|
||||||
|
</div>
|
||||||
|
<div id="row3">
|
||||||
|
<div class="languages" id ="footer-languages">
|
||||||
|
<a href="../languages/deutsch.html">Deutsch |</a>
|
||||||
|
<a href="../languages/italiano.html">Italiano |</a>
|
||||||
|
<a href="../languages/francais.html">Francais </a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
</div>
|
128
templates/assets/components/main-nav.html
Normal file
128
templates/assets/components/main-nav.html
Normal file
|
@ -0,0 +1,128 @@
|
||||||
|
<div id="main-bar">
|
||||||
|
<div id="logo-container">
|
||||||
|
<a href="/">
|
||||||
|
<img class="logo" src= "img/Logo.svg">
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<nav class="main-navigation-bar">
|
||||||
|
<ul>
|
||||||
|
<li><a href="experiments.html">EXPERIMENTS</a>
|
||||||
|
<ul id="experiments">
|
||||||
|
<li><a href="oils.html">Oils</a></li>
|
||||||
|
<li><a href="flower.html">Flower</a></li>
|
||||||
|
<li><a href="edibles.html">Edibles</a></li>
|
||||||
|
</ul>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li><a href="permaculture.html">PERMACULTURE</a>
|
||||||
|
<ul>
|
||||||
|
<li><a class="pc" href="permapp.html">PermApp</a></li>
|
||||||
|
<li><a class="pc" href="greenlab.html">GreenLab</a></li>
|
||||||
|
<li><a class="pc"id="edit" href="whatsthat.html">What's that ?</a></li>
|
||||||
|
</ul>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li><a href="greentech.html">GREENTECH</a>
|
||||||
|
<ul>
|
||||||
|
<li><a href="automation.html">Automation</a></li>
|
||||||
|
<li><a href="iot.html">IoT</a></li>
|
||||||
|
<li><a href="diy.html">DiY</a></li>
|
||||||
|
</ul>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li><a href="spider.html">SPIDER</a>
|
||||||
|
<ul>
|
||||||
|
<li><a href="spiderpi.html">SpiderPi</a></li>
|
||||||
|
<li><a href="join.html">Join</a></li>
|
||||||
|
</ul>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li><a href="learn.html">LEARN</a>
|
||||||
|
<ul id="learn">
|
||||||
|
<li id="broad" ><a href="whoweare.html">About Us</a></li>
|
||||||
|
<li><a href="partners.html">Partners</a></li>
|
||||||
|
<li><a href="meet.html">Meet</a></li>
|
||||||
|
<li><a href="blog.html">Blog</a></li>
|
||||||
|
<li><a href="code.html">Code</a></li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
<nav class="hamburger-wrap">
|
||||||
|
<input type="checkbox" class="ham-btn" id="ham-btn">
|
||||||
|
<label for="ham-btn" class="hamburger" id="hamburger" onclick= "menu()" onclick="hide()">
|
||||||
|
<span class="hamburger-icon"></span>
|
||||||
|
</label>
|
||||||
|
</nav>
|
||||||
|
<div id="mobile-dropdown-container">
|
||||||
|
<div id="mobile-dropdown">
|
||||||
|
<ul>
|
||||||
|
<li onclick="menu2()"><a href="experiments.html">EXPERIMENTS</a>
|
||||||
|
<span class="drop">
|
||||||
|
<i class="arrow down"></i>
|
||||||
|
</span>
|
||||||
|
<ul id="down">
|
||||||
|
<li><a href="oils.html">Oils</a></li>
|
||||||
|
<li><a href="flower.html">Flower</a></li>
|
||||||
|
<li><a href="edibles.html">Edibles</a></li>
|
||||||
|
</ul>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li onclick="menu3()"><a href="permaculture.html">PERMACULTURE</a>
|
||||||
|
<span class="drop">
|
||||||
|
<i class="arrow down"></i>
|
||||||
|
</span>
|
||||||
|
<ul id="down1">
|
||||||
|
<li><a href="permapp.html">PermApp</a></li>
|
||||||
|
<li><a href="greenlab.html">GreenLab</a></li>
|
||||||
|
<li><a href="whatsthat.html">What's that ?</a></li>
|
||||||
|
</ul>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li onclick="menu4()"><a href="greentech.html">GREENTECH</a>
|
||||||
|
<span class="drop">
|
||||||
|
<i class="arrow down"></i>
|
||||||
|
</span>
|
||||||
|
<ul id="down2">
|
||||||
|
<li><a href="automation.html">Automation</a></li>
|
||||||
|
<li><a href="iot.html">IoT</a></li>
|
||||||
|
<li><a href="diy.html">DiY</a></li>
|
||||||
|
</ul>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li onclick="menu5()"><a href="spider.html">SPIDER</a>
|
||||||
|
<span class="drop">
|
||||||
|
<i class="arrow down"></i>
|
||||||
|
</span>
|
||||||
|
<ul id="down3">
|
||||||
|
<li><a href="spiderpi.html">SpiderPi</a></li>
|
||||||
|
<li><a href="join.html">Join</a></li>
|
||||||
|
</ul>
|
||||||
|
</ul>
|
||||||
|
|
||||||
|
<ul>
|
||||||
|
<li onclick="menu6()"><a href="learn.html">LEARN</a>
|
||||||
|
<span class="drop">
|
||||||
|
<i class="arrow down"></i>
|
||||||
|
</span>
|
||||||
|
<ul id="down4">
|
||||||
|
<li><a href="whoweare.html">About Us</a></li>
|
||||||
|
<li><a href="partners.html">Partners</a></li>
|
||||||
|
<li><a href="meet.html">Meet</a></li>
|
||||||
|
<li><a href="blog.html">Blog</a></li>
|
||||||
|
<li><a href="code.html">Code</a></li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
<a class="button" href="#">Shop</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
8
templates/assets/components/top-nav.html
Normal file
8
templates/assets/components/top-nav.html
Normal file
|
@ -0,0 +1,8 @@
|
||||||
|
<!--Add dynamic language handling here-->
|
||||||
|
<nav class="top-bar">
|
||||||
|
<div class="languages">
|
||||||
|
<a href="../languages/deutsch.html">Deutsch |</a>
|
||||||
|
<a href="static/languages/italiano.html">Italiano |</a>
|
||||||
|
<a href="static/languages/francais.html">Francais </a>
|
||||||
|
</div>
|
||||||
|
</nav>
|
901
templates/assets/css/experiments.css
Normal file
901
templates/assets/css/experiments.css
Normal file
|
@ -0,0 +1,901 @@
|
||||||
|
:root {
|
||||||
|
--space : 5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-wrapper {
|
||||||
|
display:grid;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title{
|
||||||
|
margin-top: var(--space);
|
||||||
|
}
|
||||||
|
|
||||||
|
#about {
|
||||||
|
margin-top: var(--space);
|
||||||
|
background-color:white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#about p {
|
||||||
|
color:black;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link {
|
||||||
|
margin-top: var(--space);
|
||||||
|
}
|
||||||
|
|
||||||
|
#oil {
|
||||||
|
width:100%;
|
||||||
|
height:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link {
|
||||||
|
background-color: white;
|
||||||
|
display: flex;
|
||||||
|
margin-top: var(--space);
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link {
|
||||||
|
background-color:white;
|
||||||
|
display: flex;
|
||||||
|
margin-top: var(--space);
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower {
|
||||||
|
width:100%;
|
||||||
|
height:100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width:1024px) {
|
||||||
|
|
||||||
|
.page-wrapper {
|
||||||
|
grid-template-columns: 25% 25% 25% 25%;
|
||||||
|
grid-template-rows: auto auto auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
grid-column: 1/5;
|
||||||
|
grid-row:1;
|
||||||
|
background-size: cover;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
height: 67vh;
|
||||||
|
padding-left: 7.5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title .short {
|
||||||
|
grid-column: 1;
|
||||||
|
grid-row: 1/2;
|
||||||
|
align-self: flex-end;
|
||||||
|
font-family:'Lato', sans-serif;
|
||||||
|
font-size: 1.5em;
|
||||||
|
font-weight: 300;
|
||||||
|
color: rgb(62, 190, 147);
|
||||||
|
text-align: center;
|
||||||
|
line-height: 6.5vh;
|
||||||
|
padding-bottom: 22vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title .image {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
|
transition: 0.4s;
|
||||||
|
grid-column: 2;
|
||||||
|
grid-row: 1/2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title .image img {
|
||||||
|
max-width: 30vw;
|
||||||
|
padding-right: 5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
grid-column: 1;
|
||||||
|
grid-row: 1;
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-start;
|
||||||
|
font-size: 6rem;
|
||||||
|
font-weight: 300;
|
||||||
|
font-family: 'IBM Plex Sans', sans-serif;
|
||||||
|
line-height: 80px;
|
||||||
|
letter-spacing: 2px;
|
||||||
|
text-transform: uppercase;
|
||||||
|
color: #333;
|
||||||
|
padding-top: 1em;
|
||||||
|
margin-left: .1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#about {
|
||||||
|
grid-column:1/5;
|
||||||
|
grid-row: 2;
|
||||||
|
display: flex;
|
||||||
|
background-color: white;
|
||||||
|
margin: 0 5rem 1.5rem 5rem;
|
||||||
|
border-radius: 25px;
|
||||||
|
box-shadow: .01em .01em .01em .1em hsl(160, 51%, 70%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#about p {
|
||||||
|
font-size:1.5rem;
|
||||||
|
font-weight: 300;
|
||||||
|
padding:1.5rem;
|
||||||
|
text-align: center;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
line-height: 2.75;
|
||||||
|
}
|
||||||
|
|
||||||
|
#links {
|
||||||
|
grid-column:1/5;
|
||||||
|
grid-row:3;
|
||||||
|
padding: 1rem;
|
||||||
|
background-color: white;
|
||||||
|
border-radius: 25px;
|
||||||
|
z-index: 10000;
|
||||||
|
margin-top: 2.5vh;
|
||||||
|
min-height: 90vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link {
|
||||||
|
display:grid;
|
||||||
|
grid-template-columns: 50% 50%;
|
||||||
|
grid-template-rows: 20% 40% 20% ;
|
||||||
|
box-shadow: .01em .01em .01em .03em hsl(160, 100%, 50%);
|
||||||
|
border-radius: 25px;
|
||||||
|
min-height: 115vh;
|
||||||
|
padding: 6vh 3vw 3vh 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .image {
|
||||||
|
grid-column:1 ;
|
||||||
|
grid-row:1/3;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 90vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .image img {
|
||||||
|
margin-top: 1.5em;
|
||||||
|
border: .01em solid hsl(160, 100%, 50%);
|
||||||
|
padding: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#current {
|
||||||
|
border: .01em solid hsl(160, 49%, 51%) !important;
|
||||||
|
max-height: 40vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.imgs {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
grid-gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-image img, .imgs img {
|
||||||
|
height: 15vh;
|
||||||
|
width: auto;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .description {
|
||||||
|
grid-column:2 ;
|
||||||
|
grid-row:1/3;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .description p {
|
||||||
|
font-size: 1.25em;
|
||||||
|
color: #333;
|
||||||
|
line-height: 2.25;
|
||||||
|
justify-self: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.description ul {
|
||||||
|
font-size: 1.25em;
|
||||||
|
color: #333;
|
||||||
|
line-height: 2.25;
|
||||||
|
margin-top: 2rem;
|
||||||
|
padding-left: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .page-button {
|
||||||
|
grid-column:2 ;
|
||||||
|
grid-row:4;
|
||||||
|
display:flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 1vh 0 2vh 1vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .page-button a:hover {
|
||||||
|
background-color: hsl(160, 100%, 75%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .page-button a {
|
||||||
|
text-decoration: none;
|
||||||
|
background-color:#fff;
|
||||||
|
color: #000;
|
||||||
|
padding: .25em .75em;
|
||||||
|
margin-left: .5em;
|
||||||
|
border: .01em solid hsl(160, 100%, 75%);
|
||||||
|
border-radius: 27px;
|
||||||
|
margin-right: 4%;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1.5em;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
text-transform: uppercase;
|
||||||
|
transition: all ease .5s;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .description h3 {
|
||||||
|
font-size: 6em;
|
||||||
|
font-weight: 300;
|
||||||
|
color: hsl(160, 100%, 50%);
|
||||||
|
margin-bottom: .25em;
|
||||||
|
font-family: 'IBM Plex Sans', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link {
|
||||||
|
display:grid;
|
||||||
|
grid-template-columns: 50% 50%;
|
||||||
|
grid-template-rows: 80% 20% ;
|
||||||
|
box-shadow: .01em .01em .01em .03em hsl(300, 100%, 50%);
|
||||||
|
border-radius: 25px;
|
||||||
|
min-height: 85vh;
|
||||||
|
padding: 6vh 0 0 6vw;
|
||||||
|
margin-top: 10vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .image {
|
||||||
|
grid-column: 2;
|
||||||
|
grid-row:1/3;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .image img {
|
||||||
|
margin-top: 1.5em;
|
||||||
|
border: .01em solid hsl(300, 100%, 50%);
|
||||||
|
padding: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower {
|
||||||
|
width: auto;
|
||||||
|
height: 30vh;
|
||||||
|
border: .01em solid hsl(300, 51%, 49%) !important;
|
||||||
|
margin-bottom: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flowers {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
grid-gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-image img, .flowers img {
|
||||||
|
width: 15vh;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .description {
|
||||||
|
grid-column:1 ;
|
||||||
|
grid-row: 1;
|
||||||
|
display:flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .description h3 {
|
||||||
|
font-size: 6em;
|
||||||
|
font-weight: 300;
|
||||||
|
color:hsl(300, 100%, 50%);
|
||||||
|
margin-bottom: .25em;
|
||||||
|
font-family: 'IBM Plex Sans', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .description p {
|
||||||
|
font-size: 1.25em;
|
||||||
|
color: #333;
|
||||||
|
line-height: 2.25;
|
||||||
|
justify-self: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
.description p span {
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 5;
|
||||||
|
color:hsl(300, 100%, 50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .page-button {
|
||||||
|
grid-column: 1 ;
|
||||||
|
grid-row: 2;
|
||||||
|
display:flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 1vh 0 5vh 1vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .page-button a {
|
||||||
|
text-decoration: none;
|
||||||
|
background-color: #fff;
|
||||||
|
color: #333;
|
||||||
|
border: .01em solid hsl(300, 100%, 50%);
|
||||||
|
padding: .25em .75em;
|
||||||
|
margin-left: 0;
|
||||||
|
border-radius: 27px;
|
||||||
|
margin-right: 4%;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1.5em;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
|
margin-top:.75em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
transition: all ease .5s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .page-button a:hover {
|
||||||
|
background-color: hsl(300, 100%, 75%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link {
|
||||||
|
display:grid;
|
||||||
|
grid-template-columns: 50% 50%;
|
||||||
|
grid-template-rows: 20% 40% 20% ;
|
||||||
|
box-shadow: .01em .01em .01em .03em hsl(75, 100%, 50%);
|
||||||
|
border-radius: 25px;
|
||||||
|
min-height: 85vh;
|
||||||
|
padding: 0 3vw 3vh 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .image {
|
||||||
|
grid-column:1 ;
|
||||||
|
grid-row:1/3;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 90vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .image img {
|
||||||
|
margin-top: 1.5em;
|
||||||
|
border: .01em solid hsl(75, 100%, 50%);
|
||||||
|
padding: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#fruit {
|
||||||
|
height: 35vh;
|
||||||
|
width: auto;
|
||||||
|
margin-bottom: 5vh;
|
||||||
|
border: .01em solid hsl(75, 51%, 49%) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fruits {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(2, 1fr);
|
||||||
|
grid-gap: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fruits img {
|
||||||
|
height: 15vh;
|
||||||
|
width: auto;
|
||||||
|
cursor: pointer;
|
||||||
|
display: flex;
|
||||||
|
justify-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-image img {
|
||||||
|
height: 15vh;
|
||||||
|
width: auto;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#edibles-link .page-button {
|
||||||
|
grid-column:2 ;
|
||||||
|
grid-row:2;
|
||||||
|
display:flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .description {
|
||||||
|
grid-column: 2;
|
||||||
|
grid-row:1/3;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-self: center;
|
||||||
|
padding:1em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .description h3 {
|
||||||
|
font-size: 6.5em;
|
||||||
|
font-weight: 300;
|
||||||
|
color: hsl(75, 100%, 50%);
|
||||||
|
margin-bottom: .25em;
|
||||||
|
font-family: 'IBM Plex Sans', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .description p {
|
||||||
|
font-size: 1.25em;
|
||||||
|
color: #333;
|
||||||
|
line-height: 2.25;
|
||||||
|
justify-self: flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .description p span {
|
||||||
|
font-weight: 400;
|
||||||
|
color: hsl(75, 100%, 50%);
|
||||||
|
line-height: 5;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .page-button {
|
||||||
|
grid-column:2 ;
|
||||||
|
grid-row:4;
|
||||||
|
display:flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 1vh 0 2vh 1vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .page-button a {
|
||||||
|
text-decoration: none;
|
||||||
|
background-color:#fff;
|
||||||
|
color: #333;
|
||||||
|
padding: .25em 1em;
|
||||||
|
margin-left: .5em;
|
||||||
|
border: .01em solid hsl(75, 100%, 50%);
|
||||||
|
border-radius: 27px;
|
||||||
|
margin-right: 4%;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1.5em;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
text-transform: uppercase;
|
||||||
|
transition: all ease .5s;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#edibles-link .page-button a:hover {
|
||||||
|
background-color: hsl(75, 100%, 75%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer-wrapper {
|
||||||
|
margin-top:.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#mobile {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@media only screen and (max-width:768px) {
|
||||||
|
|
||||||
|
.page-wrapper {
|
||||||
|
grid-template-columns: 100%;
|
||||||
|
grid-template-rows: auto auto auto auto ;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
grid-column: 1;
|
||||||
|
grid-row:1/2;
|
||||||
|
background-size: cover;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items:center;
|
||||||
|
justify-content: flex-start;
|
||||||
|
height: 80vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title .short {
|
||||||
|
font-family:'Lato', sans-serif;
|
||||||
|
font-size: 1em;
|
||||||
|
font-weight: 300;
|
||||||
|
line-height: 4.5vh;
|
||||||
|
padding: 1em 0 0 0;
|
||||||
|
color: rgb(62, 190, 147);
|
||||||
|
margin-left:.1em;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title .image {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mobile {
|
||||||
|
max-height: 55vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1 {
|
||||||
|
font-size: 2.6rem;
|
||||||
|
font-weight: 300;
|
||||||
|
line-height: 80px;
|
||||||
|
letter-spacing: .5px;
|
||||||
|
padding-top: .95em;
|
||||||
|
margin-left: .1em;
|
||||||
|
font-family: 'IBM Plex Sans', sans-serif;
|
||||||
|
text-transform: uppercase;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
#about {
|
||||||
|
grid-column:1;
|
||||||
|
grid-row: 2;
|
||||||
|
background-color: white;
|
||||||
|
display: flex;
|
||||||
|
margin:2rem 1rem;
|
||||||
|
margin-top:0;
|
||||||
|
border-radius: 25px;
|
||||||
|
box-shadow: .02em .01em .01em .05em hsl(160, 51%, 60%);
|
||||||
|
padding: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#about p {
|
||||||
|
font-size:1.125rem;
|
||||||
|
font-weight: 300;
|
||||||
|
padding:1rem;
|
||||||
|
line-height: 1.75;
|
||||||
|
color: #333;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#links {
|
||||||
|
grid-column:1;
|
||||||
|
grid-row:3;
|
||||||
|
padding: 1rem;
|
||||||
|
background-color: white;
|
||||||
|
border-radius: 25px;
|
||||||
|
min-height: 90vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.description ul {
|
||||||
|
font-size: .85rem;
|
||||||
|
font-weight: 300;
|
||||||
|
color: #333;
|
||||||
|
line-height: 2.6;
|
||||||
|
margin-top: 1.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link {
|
||||||
|
display:grid;
|
||||||
|
grid-template-rows: repeat(2, .7fr);
|
||||||
|
padding-bottom: 1.5rem;
|
||||||
|
box-shadow: .01em .01em .01em .03em hsl(160, 100%, 50%);
|
||||||
|
border-radius: 25px;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .image {
|
||||||
|
grid-row: 1;
|
||||||
|
height: 50vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .image img {
|
||||||
|
margin-top: 1.5em;
|
||||||
|
border: .01em solid hsl(160, 100%, 50%);
|
||||||
|
padding: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#current {
|
||||||
|
height: 30vh;
|
||||||
|
width: auto;
|
||||||
|
border: .01em solid hsl(160, 51%, 49%) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.imgs {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(4, 1fr);
|
||||||
|
grid-gap: 2vh;
|
||||||
|
padding: 0 .75rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-image img, .imgs img {
|
||||||
|
height: 7vh;
|
||||||
|
width: auto;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-img {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 1.75rem 1rem 1rem 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .description {
|
||||||
|
grid-row: 2;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content:center;
|
||||||
|
margin-top: 6.5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .description h3 {
|
||||||
|
font-size: 2.75rem;
|
||||||
|
font-weight: 300;
|
||||||
|
color: hsl(160, 100%, 50%);
|
||||||
|
margin-bottom: .25em;
|
||||||
|
font-family: 'IBM Plex Sans', sans-serif;
|
||||||
|
text-transform: uppercase;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .description p {
|
||||||
|
font-size: .85em;
|
||||||
|
font-weight: 300;
|
||||||
|
color: #333;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 2.25;
|
||||||
|
padding: 1vh 2vw;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .page-button {
|
||||||
|
grid-row: 3;
|
||||||
|
display:flex;
|
||||||
|
justify-content: center;
|
||||||
|
padding-top: 2rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .page-button a {
|
||||||
|
text-decoration: none;
|
||||||
|
background-color: #fff;
|
||||||
|
color: #333;
|
||||||
|
border: .02em solid #000;
|
||||||
|
padding: .25em .75em;
|
||||||
|
border-radius: 27px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1em;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
|
margin: .25em .75em .75em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
transition: all ease .2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#oils-link .page-button a:active {
|
||||||
|
border-color:hsl(160, 100%, 75%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link {
|
||||||
|
display:grid;
|
||||||
|
grid-template-rows: repeat(2, .7fr);
|
||||||
|
padding-bottom: 1.5rem;
|
||||||
|
box-shadow: .01em .01em .01em .03em hsl(300, 100%, 50%);
|
||||||
|
border-radius: 25px;
|
||||||
|
margin-top: 10vh;
|
||||||
|
padding-top: 2vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .image {
|
||||||
|
grid-row: 1;
|
||||||
|
height: 50vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .image img {
|
||||||
|
margin-top: 1.5em;
|
||||||
|
border: .01em solid hsl(300, 100%, 50%);
|
||||||
|
padding: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower {
|
||||||
|
max-height: 27.5vh;
|
||||||
|
width: auto;
|
||||||
|
border: .01em solid hsl(300, 51%, 49%) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flowers {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(4, 1fr);
|
||||||
|
padding: 1rem;
|
||||||
|
justify-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-image img, .flowers img {
|
||||||
|
height: 7vh;
|
||||||
|
width: auto;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-img {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 3rem 1rem 1rem 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .description {
|
||||||
|
grid-row: 2;
|
||||||
|
display:flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 6.5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#flower-link .description h3 {
|
||||||
|
font-size: 2.25rem;
|
||||||
|
color: hsl(300, 100%, 50%);
|
||||||
|
margin-bottom: .5em;
|
||||||
|
font-family: 'IBM Plex Sans', sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
|
text-transform: uppercase;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .description p {
|
||||||
|
font-size: .85em;
|
||||||
|
font-weight:300;
|
||||||
|
color: #333;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 2.25;
|
||||||
|
padding: 1vh 2vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .description p span {
|
||||||
|
color: hsl(300, 100%, 50%);
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 5;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#flower-link .page-button{
|
||||||
|
display:flex;
|
||||||
|
justify-content: center;
|
||||||
|
padding-top: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .page-button a {
|
||||||
|
text-decoration: none;
|
||||||
|
background-color: #fff;
|
||||||
|
color: #333;
|
||||||
|
border: .02em solid #000;
|
||||||
|
padding: .25em .75em;
|
||||||
|
border-radius: 27px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1em;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
|
margin: .75em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
transition: all ease .2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#flower-link .page-button a:active {
|
||||||
|
border-color: hsl(300, 100%, 75%);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#edibles-link {
|
||||||
|
display:grid;
|
||||||
|
grid-template-rows: repeat(2, .7fr);
|
||||||
|
padding-bottom: 1.5rem;
|
||||||
|
box-shadow: .01em .01em .01em .03em hsl(75, 100%, 50%);
|
||||||
|
border-radius: 25px;
|
||||||
|
margin-top: 10vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .image {
|
||||||
|
grid-row: 1;
|
||||||
|
height: 50vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .image img {
|
||||||
|
margin-top: 1.5em;
|
||||||
|
border: .01em solid hsl(75, 100%, 50%);
|
||||||
|
padding: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#fruit {
|
||||||
|
max-height: 28vh;
|
||||||
|
width: auto;
|
||||||
|
border: .01em solid hsl(75, 51%, 49%) !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fruits {
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: repeat(4, 1fr);
|
||||||
|
padding: 1rem;
|
||||||
|
justify-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-image img, .fruits img {
|
||||||
|
height: 8vh;
|
||||||
|
width: auto;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.main-img {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 1.5rem 1rem 1rem 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#edibles-link .description {
|
||||||
|
grid-row: 2;
|
||||||
|
display:flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-top: 7.5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#edibles-link .description h3 {
|
||||||
|
font-size: 2.5rem;
|
||||||
|
color: hsl(75, 100%, 50%);
|
||||||
|
margin-bottom: .5em;
|
||||||
|
font-family: 'IBM Plex Sans', sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
|
text-transform: uppercase;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .description p {
|
||||||
|
font-size: .85em;
|
||||||
|
font-weight:300;
|
||||||
|
color: #333;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 2.25;
|
||||||
|
padding: 1vh 2vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .description p span {
|
||||||
|
color: hsl(75, 100%, 50%);
|
||||||
|
font-weight: 400;
|
||||||
|
line-height: 5;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .description ul {
|
||||||
|
font-size: .9rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#edibles-link .page-button {
|
||||||
|
grid-row: 3;
|
||||||
|
display:flex;
|
||||||
|
justify-content: center;
|
||||||
|
padding-top: 1.25rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .page-button a {
|
||||||
|
text-decoration: none;
|
||||||
|
background-color: #fff;
|
||||||
|
color: #333;
|
||||||
|
border: .01em solid #000;
|
||||||
|
padding: .25em .75em;
|
||||||
|
border-radius: 27px;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 1em;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
|
margin: .75em;
|
||||||
|
text-transform: uppercase;
|
||||||
|
transition: all ease .2s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#edibles-link .page-button a:active {
|
||||||
|
border-color: hsl(75, 100%, 40%);
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer-wrapper {
|
||||||
|
margin-top:.5rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.description .additional {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title .image #desktop {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
513
templates/assets/css/footer.css
Normal file
513
templates/assets/css/footer.css
Normal file
|
@ -0,0 +1,513 @@
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
src: url('fonts/Lato-Thin.ttf') format('truetype');
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 100;
|
||||||
|
}
|
||||||
|
|
||||||
|
*{
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
box-sizing:border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root{
|
||||||
|
--top_padding:5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
font-weight:500;
|
||||||
|
overflow-x: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width: 1024px){
|
||||||
|
|
||||||
|
footer {
|
||||||
|
grid-area:footer;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer-wrapper {
|
||||||
|
color: white !important;
|
||||||
|
border-top: solid 3px white;
|
||||||
|
border-bottom: solid 1px white;
|
||||||
|
background-color: black;
|
||||||
|
height:100%;
|
||||||
|
display: grid;
|
||||||
|
grid-template-columns: 1fr 0.8fr 1fr 1fr;
|
||||||
|
grid-template-rows: 2fr 1fr;
|
||||||
|
padding-bottom:1%;
|
||||||
|
padding-top: 10vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column1 {
|
||||||
|
background-color: black;
|
||||||
|
display: none;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column1 a h3 {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column2 {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
text-align: center;
|
||||||
|
grid-column: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column2 ul {
|
||||||
|
list-style: none;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column2 ul li p a {
|
||||||
|
text-decoration:none;
|
||||||
|
color:white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column2 ul li {
|
||||||
|
margin: 5vh 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
h6 {
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
font-weight: 350;
|
||||||
|
font-size: 135%;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column3 {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column2 ul li a:hover {
|
||||||
|
color: rgb(0, 255, 170);
|
||||||
|
}
|
||||||
|
|
||||||
|
#column3 ul {
|
||||||
|
list-style: none;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column3 ul li p a {
|
||||||
|
text-decoration:none;
|
||||||
|
color:white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column3 ul li {
|
||||||
|
margin: 5vh 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column3 ul li a:hover {
|
||||||
|
color: rgb(0, 255, 170);
|
||||||
|
}
|
||||||
|
|
||||||
|
#column4 {
|
||||||
|
display:flex;
|
||||||
|
flex-direction: column;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
#column4 p {
|
||||||
|
font-size: 2vh;
|
||||||
|
line-height: 4vh;
|
||||||
|
margin-top: 5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column5 {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column5 #social-media {
|
||||||
|
margin-top: 5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#social-media ul {
|
||||||
|
margin-top:1%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#social-media ul li {
|
||||||
|
display:inline;
|
||||||
|
list-style-type: none;
|
||||||
|
padding-left: 9%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#social-media ul li .youtube {
|
||||||
|
padding-left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#youtube {
|
||||||
|
height: auto;
|
||||||
|
width: 7%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#instagram {
|
||||||
|
height:auto;
|
||||||
|
width: 7%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#gitea {
|
||||||
|
height:auto;
|
||||||
|
width: 10%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#row2 {
|
||||||
|
border-top: .1em solid white;
|
||||||
|
color: white;
|
||||||
|
grid-column: 1/2;
|
||||||
|
display:flex;
|
||||||
|
align-self: center;
|
||||||
|
justify-self: center;
|
||||||
|
padding-top: 1vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#row2 p {
|
||||||
|
text-align: center;
|
||||||
|
padding-top:2%;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
#row3 {
|
||||||
|
grid-column: 3/5;
|
||||||
|
display:flex;
|
||||||
|
align-self: center;
|
||||||
|
justify-self: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#row3 .languages a {
|
||||||
|
color: #fff;
|
||||||
|
padding: 0 1vh !important;
|
||||||
|
transition: all .3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
#row3 .languages a:hover {
|
||||||
|
color:hsl(160, 50%, 70%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.arrow .down {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#dropdown {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ham-btn {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hamburger {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hamburger-icon{
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mobile-dropdown-container {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer-languages {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@media only screen and (max-width: 1023px) {
|
||||||
|
|
||||||
|
footer {
|
||||||
|
grid-area:footer;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer-wrapper {
|
||||||
|
grid-template-columns: 50% 50%;
|
||||||
|
grid-template-rows: .6fr 0.1fr 0.1fr 0.1fr 0.1fr;
|
||||||
|
display: grid;
|
||||||
|
background-color:black;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column1 {
|
||||||
|
grid-row: 1;
|
||||||
|
grid-column: 1;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
min-height: 25vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column1 a {
|
||||||
|
color: white;
|
||||||
|
text-decoration: none;
|
||||||
|
text-transform: uppercase;
|
||||||
|
margin-left: 0;
|
||||||
|
font-size:100%;
|
||||||
|
padding-top:5%;
|
||||||
|
padding-bottom:5%;
|
||||||
|
display:flex;
|
||||||
|
padding-left: 2.5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column1 a:active {
|
||||||
|
color: rgb(0, 255, 170);
|
||||||
|
}
|
||||||
|
|
||||||
|
#column1 a h3 {
|
||||||
|
display:flex;
|
||||||
|
align-items: center;
|
||||||
|
letter-spacing: .1em;
|
||||||
|
font-weight: 100;
|
||||||
|
padding-left: .5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column1 a h3 span {
|
||||||
|
color: hsl(160, 51%, 80%);
|
||||||
|
letter-spacing: .095em;
|
||||||
|
margin-right: .5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column2{
|
||||||
|
grid-column:1/3;
|
||||||
|
grid-row: 2;
|
||||||
|
margin-top:0;
|
||||||
|
border-top:1px solid white;
|
||||||
|
padding-top:5%;
|
||||||
|
padding-left: 5%;
|
||||||
|
padding-right: 5%;
|
||||||
|
padding-bottom: 5%;
|
||||||
|
border-bottom:1px solid white;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column2 ul {
|
||||||
|
display:none;
|
||||||
|
position: relative;
|
||||||
|
width:100%;
|
||||||
|
overflow:auto;
|
||||||
|
z-index: 1;
|
||||||
|
list-style : none;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 1vh 5% 0 5%;
|
||||||
|
text-align: center;
|
||||||
|
border-top: 1px solid rgb(62, 190, 147);
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column2 ul li p a {
|
||||||
|
font-weight: 300;
|
||||||
|
text-decoration: none;
|
||||||
|
color:white;
|
||||||
|
letter-spacing: .075em
|
||||||
|
}
|
||||||
|
|
||||||
|
#column2 ul li p a:active{
|
||||||
|
color: rgb(0, 255, 170);
|
||||||
|
}
|
||||||
|
|
||||||
|
#column2 ul li {
|
||||||
|
margin-bottom: 5%;
|
||||||
|
margin-top:5%;
|
||||||
|
}
|
||||||
|
|
||||||
|
h6 {
|
||||||
|
font-size: 100%;
|
||||||
|
font-weight: 400;
|
||||||
|
letter-spacing: .075em;
|
||||||
|
padding: 2vh 0;
|
||||||
|
text-transform: uppercase;
|
||||||
|
color:white;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: .6s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
h6:active {
|
||||||
|
color: rgb(0, 255, 170);
|
||||||
|
}
|
||||||
|
|
||||||
|
.arrow {
|
||||||
|
border: solid white;
|
||||||
|
border-width: 0 2px 2px 0;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 3px;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: .1s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.down {
|
||||||
|
transform: rotate(45deg);
|
||||||
|
position: relative;
|
||||||
|
margin-left:55%;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.down2 {
|
||||||
|
transform: rotate(45deg);
|
||||||
|
position: relative;
|
||||||
|
margin-left:73%;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#column3 {
|
||||||
|
grid-column: 1/3;
|
||||||
|
grid-row: 3;
|
||||||
|
margin-top:0;
|
||||||
|
border-top:1px solid white;
|
||||||
|
padding-top:5%;
|
||||||
|
padding-bottom:4%;
|
||||||
|
padding-left: 5%;
|
||||||
|
padding-right: 1%;
|
||||||
|
border-bottom:1px solid white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column3 ul {
|
||||||
|
display:none;
|
||||||
|
position: relative;
|
||||||
|
width:100%;
|
||||||
|
overflow:auto;
|
||||||
|
z-index: 1;
|
||||||
|
list-style : none;
|
||||||
|
justify-content: space-between;
|
||||||
|
border-top: 1px solid rgb(62, 190, 147);
|
||||||
|
padding-right: 5%;
|
||||||
|
padding-left: 5%;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column3 h6 {
|
||||||
|
padding: 2vh 0;
|
||||||
|
transition: .6s ease;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column3 ul li {
|
||||||
|
margin: 5vh 0 3vh 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column3 ul li p a {
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
|
text-decoration:none;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column3 ul li p a:active {
|
||||||
|
color: hsl(160, 100%, 50%);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
#column4 {
|
||||||
|
grid-column: 1/3;
|
||||||
|
grid-row:4;
|
||||||
|
border-bottom: solid white 1px;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column4 p {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
padding: 1.5vh 0;
|
||||||
|
color:white;
|
||||||
|
font-size: 1.75vh;
|
||||||
|
font-weight: 400;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column4 h6 {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column5 {
|
||||||
|
grid-column:2;
|
||||||
|
grid-row: 1;
|
||||||
|
margin-top:15%;
|
||||||
|
padding-bottom: 10%;
|
||||||
|
display:flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#social-media {
|
||||||
|
padding-left: 5vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
#social-media ul li {
|
||||||
|
display:inline;
|
||||||
|
list-style-type: none;
|
||||||
|
padding-left: 10%;
|
||||||
|
padding-bottom:5%;
|
||||||
|
}
|
||||||
|
|
||||||
|
#column5 h6 {
|
||||||
|
display:none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#gitea {
|
||||||
|
width:18%;
|
||||||
|
height:auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
#youtube {
|
||||||
|
height: auto;
|
||||||
|
width: 4.5vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
#instagram {
|
||||||
|
height:auto;
|
||||||
|
width: 6.5vw;
|
||||||
|
}
|
||||||
|
|
||||||
|
#row2 {
|
||||||
|
grid-column:1;
|
||||||
|
grid-row:5;
|
||||||
|
display:flex;
|
||||||
|
align-items:center;
|
||||||
|
justify-content:center;
|
||||||
|
margin: 2.5vh 0;
|
||||||
|
background-color: black;
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
font-weight: 500;
|
||||||
|
letter-spacing: .095em;
|
||||||
|
}
|
||||||
|
|
||||||
|
#row2 p {
|
||||||
|
align-items: center;
|
||||||
|
padding-top:0;
|
||||||
|
font-size: .75em;
|
||||||
|
color:white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#row3 {
|
||||||
|
grid-column:2/3;
|
||||||
|
grid-row:5;
|
||||||
|
margin: 2.5vh 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
#row3 .languages {
|
||||||
|
margin-left:0;
|
||||||
|
align-self:flex-end;
|
||||||
|
}
|
||||||
|
|
||||||
|
#row3 .languages a {
|
||||||
|
color: hsl(160, 51%, 80%);
|
||||||
|
font-size: .75em;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
#row3 .languages a:active {
|
||||||
|
color: rgb(0, 255, 170);
|
||||||
|
}
|
||||||
|
|
||||||
|
.desktop {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
81
templates/assets/css/global.css
Normal file
81
templates/assets/css/global.css
Normal file
|
@ -0,0 +1,81 @@
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
src: url('fonts/Lato-Thin.ttf') format('truetype');
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 100;
|
||||||
|
}
|
||||||
|
|
||||||
|
*{
|
||||||
|
margin:0;
|
||||||
|
padding:0;
|
||||||
|
box-sizing:border-box;
|
||||||
|
}
|
||||||
|
|
||||||
|
:root{
|
||||||
|
--top_padding:5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
html,
|
||||||
|
body {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
font-weight:500;
|
||||||
|
}
|
||||||
|
|
||||||
|
#top-nav {
|
||||||
|
grid-area: top-bar;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
#main-nav {
|
||||||
|
grid-area: main-bar;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
#content {
|
||||||
|
grid-area: main;
|
||||||
|
}
|
||||||
|
|
||||||
|
#footer {
|
||||||
|
grid-area:footer;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media screen and (min-width:1024px){
|
||||||
|
|
||||||
|
.global-wrapper {
|
||||||
|
display:grid;
|
||||||
|
height:100vh;
|
||||||
|
grid-template-columns: 1fr 1fr 1fr 1fr;
|
||||||
|
grid-template-rows: 10% 22% auto 40%;
|
||||||
|
grid-template-areas:
|
||||||
|
"top-bar top-bar top-bar top-bar"
|
||||||
|
"main-bar main-bar main-bar main-bar"
|
||||||
|
"main main main main"
|
||||||
|
"footer footer footer footer";
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
font-weight: 300;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
@media screen and (max-width:480px) {
|
||||||
|
|
||||||
|
.global-wrapper {
|
||||||
|
grid-template-columns: 100%;
|
||||||
|
grid-template-rows: auto auto auto;
|
||||||
|
grid-template-areas:
|
||||||
|
"main-bar"
|
||||||
|
"main"
|
||||||
|
"footer";
|
||||||
|
font-family: 'Lato', sans-serif;
|
||||||
|
font-weight:500;
|
||||||
|
display:grid;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
3
templates/assets/css/test.css
Normal file
3
templates/assets/css/test.css
Normal file
|
@ -0,0 +1,3 @@
|
||||||
|
h1 {
|
||||||
|
color: greenyellow;
|
||||||
|
}
|
4
templates/assets/font-awesome.min.css
vendored
4
templates/assets/font-awesome.min.css
vendored
File diff suppressed because one or more lines are too long
Before Width: | Height: | Size: 602 KiB After Width: | Height: | Size: 602 KiB |
2
templates/assets/jquery/jquery-3.5.1.min.js
vendored
Normal file
2
templates/assets/jquery/jquery-3.5.1.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
108
templates/assets/js/main.js
Normal file
108
templates/assets/js/main.js
Normal file
|
@ -0,0 +1,108 @@
|
||||||
|
|
||||||
|
|
||||||
|
// this function shows an element by id
|
||||||
|
|
||||||
|
function show() {
|
||||||
|
var x= document.getElementById("information");
|
||||||
|
if (x.style.display === "none") {
|
||||||
|
x.style.display = "flex"; }
|
||||||
|
else {
|
||||||
|
x.style.display ="none";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
//this function shows element2 by id -to be generalized
|
||||||
|
|
||||||
|
function display() {
|
||||||
|
var x= document.getElementById("footer-links");
|
||||||
|
if (x.style.display === "none") {
|
||||||
|
x.style.display = "flex";}
|
||||||
|
else {
|
||||||
|
x.style.display ="none";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function menu() {
|
||||||
|
var x= document.getElementById("mobile-dropdown");
|
||||||
|
if (x.style.display === "none") {
|
||||||
|
x.style.display = "block";}
|
||||||
|
else {
|
||||||
|
x.style.display ="none";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
function menu2() {
|
||||||
|
var x= document.getElementById("down");
|
||||||
|
if (x.style.display === "none") {
|
||||||
|
x.style.display = "block";}
|
||||||
|
else {
|
||||||
|
x.style.display ="none";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function menu3() {
|
||||||
|
var x= document.getElementById("down1");
|
||||||
|
if (x.style.display === "none") {
|
||||||
|
x.style.display = "block";}
|
||||||
|
else {
|
||||||
|
x.style.display ="none";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function menu4() {
|
||||||
|
var x= document.getElementById("down2");
|
||||||
|
if (x.style.display === "none") {
|
||||||
|
x.style.display = "block";}
|
||||||
|
else {
|
||||||
|
x.style.display ="none";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function menu5() {
|
||||||
|
var x= document.getElementById("down3");
|
||||||
|
if (x.style.display === "none") {
|
||||||
|
x.style.display = "block";}
|
||||||
|
else {
|
||||||
|
x.style.display ="none";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function menu6() {
|
||||||
|
var x= document.getElementById("down4");
|
||||||
|
if (x.style.display === "none") {
|
||||||
|
x.style.display = "block";}
|
||||||
|
else {
|
||||||
|
x.style.display ="none";
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
//print pdf file
|
||||||
|
|
||||||
|
// const pdfBtn = document.getElementById('print');
|
||||||
|
|
||||||
|
// console.log(pdfBtn);
|
||||||
|
|
||||||
|
// const printPage = () => {
|
||||||
|
// window.print();
|
||||||
|
// }
|
||||||
|
|
||||||
|
// pdfBtn.addEventListener("click", (event) => {
|
||||||
|
// printPage(event, 'printed');
|
||||||
|
|
||||||
|
// });
|
||||||
|
|
||||||
|
// let screen = () => {
|
||||||
|
// console.log(window.innerHeight);
|
||||||
|
// console.log(window.innerWidth);
|
||||||
|
// };
|
||||||
|
|
||||||
|
// screen();
|
||||||
|
|
||||||
|
window.addEventListener('load', () => {
|
||||||
|
document.getElementById('print').addEventListener('click', () => {
|
||||||
|
let page = this.document.querySelector('.wrapper');
|
||||||
|
console.log(page);
|
||||||
|
console.log(window);
|
||||||
|
|
||||||
|
})
|
||||||
|
}, false);
|
20
templates/assets/js/pages.js
Normal file
20
templates/assets/js/pages.js
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
$(document).ready(function(){
|
||||||
|
// Add smooth scrolling to all links with #
|
||||||
|
$("a").on('click', function(event) {
|
||||||
|
if (this.hash !== "") {
|
||||||
|
|
||||||
|
// Prevent default anchor click behavior
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
// Store hash
|
||||||
|
var hash = this.hash;
|
||||||
|
|
||||||
|
$('html, body').animate({
|
||||||
|
scrollTop: $(hash).offset().top
|
||||||
|
}, 1000, function(){
|
||||||
|
// Add hash (#) to URL when done scrolling (default click behavior)
|
||||||
|
window.location.hash = hash;
|
||||||
|
});
|
||||||
|
} // End if
|
||||||
|
});
|
||||||
|
});
|
80
templates/assets/js/slider.js
Normal file
80
templates/assets/js/slider.js
Normal file
|
@ -0,0 +1,80 @@
|
||||||
|
let slides=document.querySelector('.slider-items').children;
|
||||||
|
let nextSlide=document.querySelector('.right-slide');
|
||||||
|
let prevSlide=document.querySelector('.left-slide');
|
||||||
|
let totalSlides=slides.length;
|
||||||
|
let index=0;
|
||||||
|
|
||||||
|
console.log(index);
|
||||||
|
|
||||||
|
|
||||||
|
nextSlide.onclick = () => {
|
||||||
|
next("next");
|
||||||
|
}
|
||||||
|
|
||||||
|
prevSlide.onclick = () => {
|
||||||
|
next("prev");
|
||||||
|
}
|
||||||
|
|
||||||
|
let next = (direction)=> {
|
||||||
|
if (direction=="next"){
|
||||||
|
index++;
|
||||||
|
if (index==totalSlides){
|
||||||
|
index=0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
if(index==0){
|
||||||
|
index=totalSlides-1;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
index--;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
for (i=0; i<slides.length;i++){
|
||||||
|
slides[i].classList.remove("active");
|
||||||
|
}
|
||||||
|
slides[index].classList.add("active");
|
||||||
|
}
|
||||||
|
|
||||||
|
const spider=document.querySelector('.spider-items').children;
|
||||||
|
const spiderNext=document.querySelector('#spider-right');
|
||||||
|
const spiderPrev=document.querySelector('#spider-left');
|
||||||
|
let spiderTotal=spider.length;
|
||||||
|
|
||||||
|
console.log(spider);
|
||||||
|
console.log(spiderNext);
|
||||||
|
console.log(spiderPrev);
|
||||||
|
console.log(spiderTotal);
|
||||||
|
|
||||||
|
|
||||||
|
spiderNext.onclick = () => {
|
||||||
|
nextSpider("next");
|
||||||
|
}
|
||||||
|
|
||||||
|
spiderPrev.onclick = () => {
|
||||||
|
nextSpider("prev");
|
||||||
|
}
|
||||||
|
|
||||||
|
let nextSpider = (direction)=> {
|
||||||
|
if (direction=="next"){
|
||||||
|
index++;
|
||||||
|
if (index==spiderTotal){
|
||||||
|
index=0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
else{
|
||||||
|
if(index==0){
|
||||||
|
index=spiderTotal-1;
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
index--;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
for (i=0; i<spider.length;i++){
|
||||||
|
spider[i].classList.remove("active");
|
||||||
|
}
|
||||||
|
spider[index].classList.add("active");
|
||||||
|
}
|
||||||
|
|
|
@ -4,20 +4,19 @@
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta http-eqiv="X-UA-Compatible" content="ie=edge"/>
|
<meta http-eqiv="X-UA-Compatible" content="ie=edge"/>
|
||||||
<link rel="stylesheet" type="text/css" href="global/css/nav.css">
|
<link rel="stylesheet" type="text/css" href="css/nav.css">
|
||||||
<link rel="stylesheet" type="text/css" href="global/css/footer.css">
|
<link rel="stylesheet" type="text/css" href="css/footer.css">
|
||||||
<link rel="stylesheet" type="text/css" href="global/css/global.css">
|
<link rel="stylesheet" type="text/css" href="css/global.css">
|
||||||
<link rel="stylesheet" type="text/css" href="css/experiments.css">
|
<link rel="stylesheet" type="text/css" href="css/experiments.css">
|
||||||
<link rel="icon" href="global/img/Logo.svg">
|
<link rel="icon" type="img/svg+xml"href="img/Logo.svg">
|
||||||
<title>
|
<title>
|
||||||
Cannabinieri - Experiments
|
Cannabinieri - Experiments
|
||||||
</title>
|
</title>
|
||||||
<script src="../../static/js/jquery-3.5.1.min.js"></script>
|
<script src="jquery/jquery-3.5.1.min.js"></script>
|
||||||
<script src="../../static/js/pages.js"></script>
|
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function(){
|
$(document).ready(function(){
|
||||||
|
|
||||||
$('#top-nav').load("global/top-nav.html");
|
$('#top-nav').load("components/top-nav.html");
|
||||||
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
@ -25,21 +24,21 @@
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function(){
|
$(document).ready(function(){
|
||||||
|
|
||||||
$('#main-nav').load("global/main-nav.html");
|
$('#main-nav').load("components/main-nav.html");
|
||||||
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function(){
|
$(document).ready(function(){
|
||||||
|
|
||||||
$('#content').load("global/content/experiments-content.html");
|
$('#content').load("components/experiments-content.html");
|
||||||
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<script>
|
<script>
|
||||||
$(document).ready(function(){
|
$(document).ready(function(){
|
||||||
|
|
||||||
$('#footer').load("global/footer.html");
|
$('#footer').load("components/footer.html");
|
||||||
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
@ -51,7 +50,7 @@
|
||||||
<div id="content"></div>
|
<div id="content"></div>
|
||||||
<div id="footer"></div>
|
<div id="footer"></div>
|
||||||
</div>
|
</div>
|
||||||
<script src="global/js/pages.js"></script>
|
<script src="js/pages.js"></script>
|
||||||
<script src="global/js/main.js"></script>
|
<script src="js/main.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
53
templates/greentech.html
Normal file
53
templates/greentech.html
Normal file
|
@ -0,0 +1,53 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Cannabinieri - GreenTech</title>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<meta http-eqiv="X-UA-Compatible" content="ie=edge"/>
|
||||||
|
<link rel="stylesheet" type="text/css" href="global/css/nav.css">
|
||||||
|
<link rel="stylesheet" type="text/css" href="global/css/footer.css">
|
||||||
|
<link rel="stylesheet" type="text/css" href="global/css/global.css">
|
||||||
|
<link rel="stylesheet" type="text/css" href="css/greentech.css">
|
||||||
|
<link rel="icon" href="global_img/Logo.svg">
|
||||||
|
<script src="../../static/js/jquery-3.5.1.min.js"></script>
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
$('#top-nav').load("global/top-nav.html");
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
$('#main-nav').load("global/main-nav.html");
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
$('#content').load("global/content/greentech-content.html");
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
$('#footer').load("global/footer.html");
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<script src="global/js/main.js"></script>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="global-wrapper">
|
||||||
|
<div id="top-nav"></div>
|
||||||
|
<div id="main-nav"></div>
|
||||||
|
<div id="content"></div>
|
||||||
|
<div id="footer"></div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -4,14 +4,14 @@
|
||||||
<meta charset="UTF-8" />
|
<meta charset="UTF-8" />
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
<meta http-eqiv="X-UA-Compatible" content="ie=edge"/>
|
<meta http-eqiv="X-UA-Compatible" content="ie=edge"/>
|
||||||
<link rel="stylesheet" type="text/css" href="index.css">
|
<link rel="stylesheet" type="text/css" href="css/index.css">
|
||||||
<link rel="stylesheet" type="text/css" href="nav.css">
|
<link rel="stylesheet" type="text/css" href="css/nav.css">
|
||||||
<link rel="icon" type="img/svg+xml" href="Logo.svg">
|
<link rel="icon" type="img/svg+xml" href="img/Logo.svg">
|
||||||
<title>
|
<title>
|
||||||
Cannabinieri CBD
|
Cannabinieri CBD
|
||||||
</title>
|
</title>
|
||||||
<script defer src="fontawesome.min.css"></script>
|
<script defer src="fontawesome/all.css"></script>
|
||||||
<script src="assets/jquery/jquery-3.5.1.min.js"></script>
|
<script src="jquery/jquery-3.5.1.min.js"></script>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div class="wrapper">
|
<div class="wrapper">
|
||||||
|
@ -25,11 +25,12 @@
|
||||||
</nav>
|
</nav>
|
||||||
<div id="main-bar">
|
<div id="main-bar">
|
||||||
<div id="logo-container">
|
<div id="logo-container">
|
||||||
<img class="logo" type="image/webp" src="Logo.svg">
|
<img class="logo" type="image/webp" src="img/Logo.svg">
|
||||||
</div>
|
</div>
|
||||||
<nav class="main-navigation-bar">
|
<nav class="main-navigation-bar">
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="experiments.html">EXPERIMENTS</a>
|
<!--GET method-->
|
||||||
|
<li><a href="/experiments">EXPERIMENTS</a>
|
||||||
<ul class="sub">
|
<ul class="sub">
|
||||||
<li><a href="oils.html">Oils</a></li>
|
<li><a href="oils.html">Oils</a></li>
|
||||||
<li><a href="flower.html">Flower</a></li>
|
<li><a href="flower.html">Flower</a></li>
|
||||||
|
@ -38,7 +39,7 @@
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="permaculture.html">PERMACULTURE</a>
|
<li><a href="/permaculture">PERMACULTURE</a>
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="permapp.html">PermApp</a></li>
|
<li><a href="permapp.html">PermApp</a></li>
|
||||||
<li><a href="greenlab.html">GreenLab</a></li>
|
<li><a href="greenlab.html">GreenLab</a></li>
|
||||||
|
@ -47,7 +48,7 @@
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="greentech.html">GREENTECH</a>
|
<li><a href="/greentech">GREENTECH</a>
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="automation.html">Automation</a></li>
|
<li><a href="automation.html">Automation</a></li>
|
||||||
<li><a href="iot.html">IoT</a></li>
|
<li><a href="iot.html">IoT</a></li>
|
||||||
|
@ -84,7 +85,7 @@
|
||||||
<div id="mobile-dropdown-container">
|
<div id="mobile-dropdown-container">
|
||||||
<div id="mobile-dropdown">
|
<div id="mobile-dropdown">
|
||||||
<ul>
|
<ul>
|
||||||
<li onclick="menu2()"><a href="experiments.html">EXPERIMENTS</a>
|
<li onclick="menu2()"><a href="/experiments">EXPERIMENTS</a>
|
||||||
<span class="drop">
|
<span class="drop">
|
||||||
<i class="arrow down"></i>
|
<i class="arrow down"></i>
|
||||||
</span>
|
</span>
|
||||||
|
@ -96,7 +97,7 @@
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
<li onclick="menu3()"><a href="permaculture.html">PERMACULTURE</a>
|
<li onclick="menu3()"><a href="/permaculture">PERMACULTURE</a>
|
||||||
<span class="drop">
|
<span class="drop">
|
||||||
<i class="arrow down"></i>
|
<i class="arrow down"></i>
|
||||||
</span>
|
</span>
|
||||||
|
@ -108,7 +109,7 @@
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
<ul>
|
<ul>
|
||||||
<li onclick="menu4()"><a href="greentech.html">GREENTECH</a>
|
<li onclick="menu4()"><a href="/greentech">GREENTECH</a>
|
||||||
<span class="drop">
|
<span class="drop">
|
||||||
<i class="arrow down"></i>
|
<i class="arrow down"></i>
|
||||||
</span>
|
</span>
|
||||||
|
@ -199,7 +200,7 @@
|
||||||
<span id="desktop"> With our Experiments strive to understand our planet in order to create an organic, automated indoor garden for everyone, everywhere.</span>
|
<span id="desktop"> With our Experiments strive to understand our planet in order to create an organic, automated indoor garden for everyone, everywhere.</span>
|
||||||
</p>
|
</p>
|
||||||
<div class="page-button">
|
<div class="page-button">
|
||||||
<a href="experiments.html">More</a>
|
<a href="/experiments">More</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -446,8 +447,8 @@
|
||||||
</div>
|
</div>
|
||||||
</footer>
|
</footer>
|
||||||
</div>
|
</div>
|
||||||
<script src="test/main.js" type="text/javascript"></script>
|
<script src="js/main.js" type="application/javascript"></script>
|
||||||
<script src="assets/js/pages.js"></script>
|
<script src="js/pages.js" type="application/javascript"></script>
|
||||||
<script src="assets/js/slider.js"></script>
|
<script src="js/slider.js" type="application/javascript"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|
55
templates/permaculture.html
Normal file
55
templates/permaculture.html
Normal file
|
@ -0,0 +1,55 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html>
|
||||||
|
<head>
|
||||||
|
<title>Cannabinieri - Permaculture</title>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<meta http-eqiv="X-UA-Compatible" content="ie=edge"/>
|
||||||
|
<link rel="stylesheet" type="text/css" href="global/css/nav.css">
|
||||||
|
<link rel="stylesheet" type="text/css" href="global/css/footer.css">
|
||||||
|
<link rel="stylesheet" type="text/css" href="global/css/global.css">
|
||||||
|
<link rel="stylesheet" type="text/css" href="css/permaculture.css">
|
||||||
|
<link rel="icon" href="global_img/Logo.svg">
|
||||||
|
<script src="../../static/js/jquery-3.5.1.min.js"></script>
|
||||||
|
<script src="../../static/js/pages.js"></script>
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
$('#top-nav').load("global/top-nav.html");
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
$('#main-nav').load("global/main-nav.html");
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
$('#content').load("global/content/permaculture-content.html");
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<script>
|
||||||
|
$(document).ready(function(){
|
||||||
|
|
||||||
|
$('#footer').load("global/footer.html");
|
||||||
|
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
<script src="../../static/js/main.js"></script>
|
||||||
|
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<div class="global-wrapper">
|
||||||
|
<div id="top-nav"></div>
|
||||||
|
<div id="main-nav"></div>
|
||||||
|
<div id="content"></div>
|
||||||
|
<div id="footer"></div>
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
</html>
|
14
templates/test.html
Normal file
14
templates/test.html
Normal file
|
@ -0,0 +1,14 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<link rel="stylesheet" type="text/css" href="css/test.css">
|
||||||
|
<title>Test</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>I can display plain html</h1>
|
||||||
|
<script src="js/test.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
|
@ -1,15 +0,0 @@
|
||||||
<!doctype html>
|
|
||||||
<html>
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
||||||
<meta http-eqiv="X-UA-Compatible" content="ie=edge"/>
|
|
||||||
<link rel="stylesheet" type="text/css" href="test_index.css">
|
|
||||||
<title>Test</title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<h1>Purple</h1>
|
|
||||||
<img src="test_logo.svg" type="image/webp">
|
|
||||||
<script src="test_index.js" type="text/javascript"></script>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
Loading…
Reference in a new issue