Merge pull request #1 from ourworld-tsc/development

adding new domain changes
This commit is contained in:
PeterNashaat 2023-07-19 13:07:56 +03:00 committed by GitHub
commit 7d219196a1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
27 changed files with 813 additions and 178 deletions

View File

@ -1,4 +1,4 @@
name: www2.ourphone.tf
name: www2.ourzone.ourworld.tf
on:
push:
branches: [ development ]
@ -8,17 +8,17 @@ jobs:
name: Deploy
runs-on: ubuntu-latest
steps:
- name: pushing latest change on www2.ourphone.tf
- name: pushing latest change on www2.ourzone.ourworld.tf
uses: appleboy/ssh-action@master
with:
host: www2.ourphone.tf
host: www2.ourzone.ourworld.tf
username: webuser
key: ${{ secrets.TF_SECRET }}
port: 34022
script: |
cd websites/www2/www_ourphone/
cd websites/www2/www_ourzone/
git log -1
git restore .
git pull
sed -i "s/https:\/\/ourphone.tf/https:\/\/www2.ourphone.tf/g" config.toml
git fetch
git reset --hard origin/development
sed -i "s/https:\/\/ourzone.ourworld.tf/https:\/\/www2.ourzone.ourworld.tf/g" config.toml
./build.sh

View File

@ -1,4 +1,4 @@
name: ourphone.tf
name: ourzone.ourworld.tf
on:
push:
branches: [ master ]
@ -8,17 +8,17 @@ jobs:
name: Deploy
runs-on: ubuntu-latest
steps:
- name: pushing latest change on ourphone.tf
- name: pushing latest change on ourzone.ourworld.tf
uses: appleboy/ssh-action@master
with:
host: ourphone.tf
host: ourzone.ourworld.tf
username: webuser
key: ${{ secrets.TF_SECRET }}
port: 34022
script: |
cd websites/www_ourphone/
cd websites/www_ourzone/
git log -1
git restore .
git pull
sed -i "s/https:\/\/ourphone.tf/https:\/\/ourphone.tf/g" config.toml
git fetch
git reset --hard origin/master
sed -i "s/https:\/\/www2.ourzone.ourworld.tf/https:\/\/ourzone.ourworld.tf/g" config.toml
./build.sh

View File

@ -1,5 +1,5 @@
# The URL the site will be built for
base_url = "https://ourphone.tf/"
base_url = "https://www2.ourzone.ourworld.tf/"
# Change this to your own URL! Please note this variable **must** be uncommented.
title = "OurPhone"
@ -60,6 +60,12 @@ feed = true
paginate_by = 2
paginate_path = "blog-posts"
[[taxonomies]]
name = "items"
feed = true
paginate_by = 2
paginate_path = "product-posts"
[[taxonomies]]
name = "roles"
feed = true

View File

@ -12,5 +12,7 @@ extra:
- [BUYNOW]("/buynow")
- [SPECS]("/specs")
- [INFO]("/blog")
- [PRODUCTS]("/products")
- [TECHNOLOGY]("/technology")
- [PEOPLE]("https://www.threefold.io/people/")
- [OURVERSE]("https://ourverse.tf/")

View File

@ -0,0 +1,15 @@
---
title: "Products"
paginate_by: 5
# paginate_reversed: false
sort_by: "date"
insert_anchor_links: "left"
#base_url: "posts"
#first: "first"
#last: "last"
template: "layouts/products.html"
page_template: "productPage.html"
#transparent: true
extra:
imgPath: /images/threefold_img2.png
---

View File

@ -0,0 +1,52 @@
---
title: "Co-Realizing the Promise"
description: "Together with our global community, we're realizing the initial promise of an open-source, peer-to-peer Internet owned by the people."
date: 2022-03-21T14:40:00-05:00
template: blogPage.html
taxonomies:
items: ["product1"]
extra:
subtitle: "Together with our global community, we're realizing the initial promise of an open-source, peer-to-peer Internet owned by the people."
author: "Sacha Obeegadoo"
imgPath: realizing_the_promise.png
isFeatured: "true"
---
What was once a massive global movement sparked by the idealism of free culture and the net, is now hosting a wave of unintended consequences that may destroy sovereignty and freedom as we know it. The digital revolution and the “democratization” of the Internet promised to lead us to a prosperous and equitable world, one that brought us closer together, eliminating both physical and virtual boundaries.
<br/>
“We are creating a world that all may enter without privilege or prejudice accorded by race, economic power, military force, or station of birth… a world where anyone, anywhere may express his or her beliefs, no matter how singular, without fear of being coerced into silence or conformity… Your legal concepts of property, expression, identity, movement, and context do not apply to us. They are all based on matter, and there is no matter here.” Declaration of independence of Cyberspace John Perry Barlow Davos, 1996.
<br/>
Unfortunately, this is not the world we live in today. Borders are hardening in our virtual world with the Great Firewall of China and the widespread emergence of Internet “clusters”. Many countries have attempted to turn off Internet services or to prevent free speech. Networks and algorithms turn us into data generators, influencing our daily habits and interests. Its turning into a big AI-driven machine that commoditizes our lives, leaves the underserved behind and fails to provide sovereignty where we gather.
<br/>
A centralized Internet which is controlled by a handful of companies is a serious existential threat. The technology that connects us is now used to distract, manipulate, polarize, divide and control the way we think, act and live our lives. If emerging technologies such as IoT, Blockchain and the Metaverse are not hosted on a self-sovereign, peer-to-peer infrastructure owned by all of us, we may be running head down into the matrix.
<br/>
With billions of people and IoT devices expected to join this broken digital world this decade, we have no choice but to heal our broken information ecosystem if we want to address the challenges we face collectively. So as we move towards a world where tech and science are merging together, how do we ensure a neutral, inclusive and regenerative digital future one that truly serves humanity and eliminates the barriers that divide us?
<br/>
The peer-to-peer Internet incentivizes all citizens of our world to connect computers from their homes or offices to participate in a distributed data economy owned by the people. By allowing humans and machines to interweave without intermediaries, a decentralized and self-sovereign Internet can emerge.
<br/>
Quite simply there is no good reason that our data is being stored and controlled by others in the information age. Why are we paying centralized companies to handle our information on our behalf, when it makes us vulnerable to be turned into products, and would take us the same time to do it ourselves?
<br/>
Peer-to-peer isnt an alternative to the Internet, its an alternative to centralized cloud giants. The Internet doesnt need replacing; it is one of the most beautiful inventions of our civilization, if not the greatest. Which is not to say that cloud providers are completely obsolete. They serve functions that decentralized systems cannot (e.g. big data); but peer-to-peer systems are just infinitely more resilient, secure, private and scalable.
<br/>
In times of exponential evolution and innovation, we have our fears around the Internet.
We dont need to disconnect ourselves even further from our reality and it is our responsibility to ensure a safe and fair future for the generations to come. A centralized Internet which is controlled by a handful of companies is a serious existential threat. If emerging technologies such as IoT, Blockchain and the Metaverse are not hosted on a self-sovereign, peer-to-peer infrastructure owned by all of us, we may be running head down into the matrix.
<br/>
The potential of technology to change the world remains endless and limited to our own imagination. We decide to switch from fear to love, and to move forward as one humanity. It is our responsibility as global citizens to pursue greater collective consciousness.

Binary file not shown.

After

Width:  |  Height:  |  Size: 80 KiB

View File

@ -0,0 +1,75 @@
---
id: tech_as_a_tool_for_humanity
title: "Technology as a Tool for Humanity"
image_caption: "Technology as a Tool for Humanity"
description: While technology has had an important role in the creation of todays societies, it might have an even greater role for our future. Two opposite pictures could be painted - a utopia or a dystopia. Technology should not be a tool to extort humanity, but one at the service of humanity.
date: 2022-10-28
taxonomies:
tags: []
items: [product4]
extra:
author: victoria_obeegadoo
imgPath: tech_as_a_tool_for_humanity.png
---
## Technology as a tool for humanity
Technology… In todays world, technology holds a central role. Younger generations in developed countries grow up amidst technological wonders of all sorts, truly immersed in an evolving digital landscape. Any information is a click away, offering immense intellectual capital unlike ever before and on the other hand, great distraction, misinformation, and potential for division.
<br>
Technology is a word dating back to the early 17th century, formed from the Greek _tekhnologia_ meaning systematic treatment, itself formed from _tekhnē_ meaning art, craft. Technology is the application of knowledge to reach practical goals in a specifiable and reproducible way. The word technology may also mean the product of such an endeavor, as it is mostly used today.
<br>
As technologies enter our world they either add on incrementally to already existing technologies (i.e., tablets) or shake everything up (i.e., television). Technology can be found in most industries and at different levels, ranging from vehicles to home appliances, passing through healthcare, education, and even entertainment. Sometimes technology replaces human labor by replicating it, other times it facilitates processes and makes labor less intensive. Some technology even surpasses human precision.
<br>
While technology has had an important role in the creation of todays societies, it might have an even greater role for our future. Two opposite pictures could be painted: a utopia or a dystopia. The utopia of a world full of values-driven, well-constructed technologies promises an increased quality of life for all, with digital tools which, for instance, could provide or enable equal educational opportunities for all, mobility everywhere, a universal basic income and the promise of never having to work again (e.g. in the sense of wage labor).
<br>
On the other hand, a dystopia could be the result of reckless technological advancement. Questions are raised, like, will most jobs be dominated by artificial intelligence (AI) in 20 years? Will privacy become a myth, with personal data being controlled by a handful? Will consumerism rule societies and reinforce social struggles?
<br>
One technology that has been slowly taking the dystopian route is the Internet. While major Internet and Cloud infrastructure advancements were made since the beginning of the millennium through hyper-scale data centers, the current Internet infrastructure model has many flaws:
<br>
- **It is centralized**: The GAFAM (Google, Amazon, Facebook, Apple and Microsoft) own 80% of the global compute, storage and network infrastructures. Also the global infrastructure is concentrated in the U.S in large majority, as well as Europe and China.
- **It is inefficient**: Most of the data centers are located in the U.S, forcing the rest of the world to connect via Internet sea cables and having their data flowing outside of their borders and back.
- **It is not scalable**: Emerging technologies require the global Internet infrastructure to triple in size in the next 4 years. It took 20+ years to build the current Internet infrastructure. So, we need to build 3 times more in 5 times less time.
- **It is not affordable**: It costs billions of dollars and enormous amounts of energy and time to build, manage and productize hyper-scale data centers. Only the richest countries in the world build data centers and the rest of the world become their clients.
- **It is not private**: Anyone can access Google Chrome or Facebook for free. But as outlined by movies such as the Social Dilemma or The Great Hack, if it is free, you are the product. The webs Ad model is threatening our privacy and the net neutrality of the global internet.
- **It is not secure**: The current IT stack depends on human error and it has been considered as the major cause of cybersecurity breaches with more than 95% of the cases. Human errors allow attackers to access encrypted channels and sensitive information
- **It is not sustainable:** Data centers are extremely power hungry, consuming over 2 trillion gigabytes of storage and consuming around 205 TWh - More than the State of New York. According to statistics, the Internet consumes between 10-20% of global energy resources.
- **It cannot support future demand:** To meet projected demand for 2022, more than 4,000 new data centers, costing an estimated $5 trillion, will be needed to build and consume an additional 400 GW/h. This is roughly equivalent to Japans energy consumption and would place an impossible strain on the global electricity grid. The rising demand for Internet storage is already causing hardware shortages and price hikes.
<br>
At ThreeFold, we want to encourage the creation of a utopian future driven by thoughtful technology. Our founders took part in the way the Internet was created, full of beautiful promises, and have seen first-hand how those promises have been corrupted throughout its evolution. By building a new Internet infrastructure from scratch, ThreeFold goes back to those original promises while having learnt from the development mistakes.
<br>
Kristof, our CEO, [wrote in a blog](https://medium.com/@despiegk/once-upon-a-time-only-30-years-ago-an-experiment-started-called-the-internet-5251e0da6a76):
> "The Internet allows the expansion of our village life to become a global community. It allows us to act as a global tribe with all information at our fingertips, it offers the possibility to get equal access to all planet resources. It has the promise for global free communication, instant availability of information, unlimited opportunities for growth and education. But what happened to our Beautiful Internet?"
> "The Internet allowed us to become more efficient in depriving mother earth from her resources. It allowed us to become more addicted to immediate gratification, examples are social media networks and the adult entertainment industry. Beautiful new possibilities like digital currencies became a gambling game and a source of wealth for the smartest hackers. The communication capabilities of the Internet allowed the few to manipulate the many."
<br>
By putting people, planet and authenticity at the core of the development of our technology, we want to gift societes a remade internet. Features of this technology include sovereignty & decentralization, security & privacy, unlimited scalability, green & self healing properties, cost effectiveness, and reliability. The human is put at the center of our Internet model.
<br>
Technology should not be a tool to extort humanity, but one at the service of humanity.

Binary file not shown.

After

Width:  |  Height:  |  Size: 38 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 427 KiB

View File

@ -0,0 +1,130 @@
---
id: what_is_farming
title: What is ThreeFold Farming?
image_caption: What is farming
description: A decentralized and energy-efficient way for people to expand a new Internet infrastructure.
date: 2022-03-01
taxonomies:
tags: []
items: [product2]
extra:
author: sacha_obeegadoo
imgPath: what_is_farming.png
---
ThreeFold farming refers to the act of connecting a 3Node to the ThreeFold Grid providing Internet capacity to a globally distributed peer-to-peer Internet infrastructure. Farming is a decentralized and energy-efficient way for people to expand a new Internet infrastructure instead of corporations building hyper-scale data centers. Its also a way to extend the Internet to underserved regions of our planet, which cannot afford data centers. Every ThreeFold Farmer around the world contributes to the growth of the foundation for a self-sovereign, private and secure digital world.
<br/>
![3Node](./3node_example.png)
<br/>
Anyone can start farming by hosting a computer at their home or office and taking part in the decentralization of our global Internet and Cloud economy.
## Why become a ThreeFold Farmer?
Todays Internet model is highly centralized, owned and operated by the few. It has turned people into products, is too harmful for our planet, cannot scale to meet emerging demands and connect the billions who are being left behind. These alone are powerful reasons to participate in ThreeFold farming and participate in the growth of a new peer-to-peer Internet economy.
<br/>
Further, the Internet is the second largest and fastest growing industry in the world after the financial markets. With the Internet expected to triple in size by 2025 to meet the data requirements of emerging technologies such as blockchain, Web3 and IoT, we need more capacity and especially in underserved regions of the world.
## Basics of ThreeFold Farming
ThreeFold is a peer-to-peer network of computers (known as “3Nodes”), including servers, desktops and laptops, that creates an open-source, decentralized Internet. People who connect computers to the ThreeFold Grid (known as “farmers”) are rewarded with ThreeFold Tokens (TFT) on a monthly basis for meeting the required uptime necessary for users to access their workloads.
<br/>
The process of connecting decentralized Internet capacity and thereby creating new ThreeFold Tokens is described as farming because it resembles the process of farming in agriculture. With agricultural farming, farmers cultivate the land and earn revenue from their harvests. With ThreeFold, farmers connect decentralized Internet capacity and earn ThreeFold Tokens every month for achieving a certain uptime.
<br/>
The above model represents the building block for a distributed, edge infrastructure that can scale to anywhere electricity and network exists, to meet emerging data demands while also providing the self-sovereignty, privacy and security features to achieve true net-neutrality.
## A Fair Economic Model
ThreeFold was created to realize the promise of an open-source, peer-to-peer Internet. As such, ThreeFold farming rewards all farmers equally according to the amount of Internet capacity they provide to the network.
<br/>
ThreeFold Tokens are rewarded for the amount of Internet capacity added and kept connected to the network. [Farming rewards](https://library.threefold.me/info/threefold#/tfgrid/farming/threefold__farming_reward) are calculated according to the compute, storage and network capacity made available by the computers:
<br/>
- 30 TFT per Compute Unit (2 vCPU and 4 GB memory) per month
- 12.5 TFT per Storage Unit (1 TB of SSD and HDD) per month
- 0.38 TFT per Network Unit (1 GB of data transfer)
- 0.06 TFT per public IP address per hour
<br/>
The above prices are based on the price of 1 TFT equalling $0.08. The farming rewards are pegged to the U.S Dollar and the price is locked from the time a farmer gets started to incentivize early contributors to the network. When the price of TFT rises, the farming rewards will decrease.
<br/>
Farming rewards are designed to be “reviewed” by [the ThreeFold DAO](https://library.threefold.me/info/threefold#/decentralization/dao/threefold__tfdao) (a decentralized autonomous organization owned by the ThreeFold community) according to the growth of the ThreeFold Grid and the utilization of its decentralized cloud to ensure a fair distribution of the token economy while also ensuring that farmers will always be justly rewarded for their contribution.
## An innovative and sustainable solution
Bitcoin mining and other blockchains became famous for requiring enormous amounts of computers and power to solve complex mathematical equations to win the chance of earning the famous cryptocurrency. Since then, many other projects have been born and carried on the mining concept.
<br/>
ThreeFolds model is inclusive and planet-friendly. The decentralized operating system built and used by ThreeFold is extremely lightweight, allowing the peer-to-peer Internet infrastructure to be up-to 10x more energy efficient than the data center model and up-to 100x more energy efficient than Bitcoin mining.
<br/>
The infrastructure was built in such a way that it removes the need for human intervention or maintenance to eliminate all unnecessary backdoors that open the possibility for ransomware and cyberattacks. Once booted, the decentralized operating system runs forever as the whole infrastructure was designed to be self-driving and self-healing. This 100% autonomous model allows for a completely decentralized system while also enhancing the security and privacy.
<br/>
While blockchain remains an incredible store of value, it is neither an efficient nor a scalable solution to store data and run applications. Only a peerto-peer model can scale the Internet infinitely and efficiently.
## Considerations before getting started
The following are important factors to consider for ThreeFold farming profitability:
### Computer Hardware
Farmers are encouraged to use the latest computers, including servers, desktops, and laptops that come with an AMD and Intel processor. The computer should have at least 1 Terabyte of SSD to optimize the performance of their farming activity. It is recommended to buy a ThreeFold 3Node server from certified partners around the globe that comes pre-configured and ready to run on the Grid.
<br/>
Used or refurbished computers can be used but it is important to understand that older computers are less efficient and more power-hungry. Computers not older than 4 years are recommended. Please visit [the DIY section of our forum](https://forum.threefold.io/c/farming/diy-farming/43) for support and feedback on farming setups.
### Power Costs
Electrical power is the main operating expense. Electricity is charged per kilowatt-hour (kWh). The cost of farming can float from $0.10 to $0.35 per kWh. It is important for a farmer to verify the expected power usage of a computer before starting the operation to improve profitability.
<br/>
*Note that the price of kWh varies depending on the country. Find a country power cost average comparison [here](https://www.electricrate.com/data-center/electricity-prices-by-country/).*
### ThreeFold Token Price
An incentive to farm ThreeFold Tokens is because of its future potential. What Bitcoin did to money, ThreeFold is doing to the Internet. While Bitcoin and Etheruem have already reached high market caps, ThreeFold is just getting started.
<br/>
Farmers are rewarded a given amount of TFT monthly based on the amount of Internet capacity they provide to the network.
<br/>
If the price of TFT is $0.1, the profitability of the farm will be average. If the price of TFT is $0.3 your farming operation may operate with healthy rewards. If the price of TFT is $1 your farming operation will be highly rewarding.
<br/>
Farming rewards are also locked until 30% utilization for a period of 2 years to incentivize early participants. The earlier you start your farming operation, the greater the rewards along with the growth in the value of TFT.
<br/>
The right mix of the above elements make farming an attractive venture. If the variables are favorable, farmers can scale up operations and earn more rewards.
## Conclusion
Anyone can start farming by hosting a computer at their home or office and take part in the decentralization of our global Internet and Cloud economy. Considering ThreeFolds market cap alongside the growing demand for a decentralized Internet, theres no better time than now to get started farming!
<br/>
[Buy](https://shop.threefold.tech/) or [build](https://manual.grid.tf/farmers/3node_building/3node_building.html) a 3Node and become a ThreeFold Farmer!

Binary file not shown.

After

Width:  |  Height:  |  Size: 134 KiB

View File

@ -0,0 +1,51 @@
---
id: what_is_peer_to_peer
title: What Is Peer-to-Peer and Why Is It so Important?
image_caption: peer to peer
description: P2P systems are network, not linear or pyramidal hierarchies (though they may share some elements)..
date: 2020-12-15
taxonomies:
tags: []
items: [product3]
extra:
author: sacha_obeegadoo
imgPath: peer_to_peer.png
---
## What is Peer-to-Peer?
Peer-to-peer (P2P) is a term that originated from the distributed computer application architecture where tasks and workloads are shared between peers, popularized by [Napster](https://en.wikipedia.org/wiki/Napster), a revolutionary file storing system from the late 1990s.
<br/>
<br/>
The concept inspired new structures and philosophies in many areas of human interaction. P2P systems and groups are typically critical of authoritarian and centralized social structures and believe in equality, meritocracy, flat systems, participatory & circular economies, as the concept represents a concrete pathway to these outcomes or visions.
<br/>
<br/>
P2P systems are network, not linear or 'pyramidal' hierarchies (though they may share some elements). They are 'distributed', though they may have elements of 'centralization' and 'decentralization.' And intelligence is not located at any center, but everywhere within the system.
## How does ThreeFold relate to peer-to-peer?
ThreeFold's Peer-to-Peer (P2P) computing network is a distributed architecture that splits tasks and workloads between its peers, [ThreeFold Farmers](https://library.threefold.me/info/tfgrid/#/what_is_farming). Farmers are equal participants in the network and together they form a peer-to-peer network of nodes, the ThreeFold Grid.
<br/>
<br/>
Farmers make their resources, such as processing power, disk storage or network bandwidth, directly available to other network participants, without the need for central coordination by servers or stable hosts. Farmers are both suppliers and consumers of resources, in contrast to the traditional [client-server](https://en.wikipedia.org/wiki/Client-server) model in which the consumption and supply of resources is divided.
<br/>
<br/>
In the near future, ThreeFold will create Digital Twin, which will go beyond the era of peers doing similar things while sharing resources. It will actually enable much more than that. Digital Twin will create a complete new digital world with diverse peers that can bring in unique resources and capabilities to a [virtual community](https://en.wikipedia.org/wiki/Virtual_community) on the ThreeFold Grid. This will empower the network of peers to engage in greater tasks beyond those that can be accomplished by individual peers, and are beneficial to all the peers.
## Why did ThreeFold choose peer-to-peer? 
Everything starts (or should start) from the why, and the ThreeFold story started a long time ago. Before the inception of ThreeFold, many of the co-founders of the project used to work with the largest IT & Cloud actors. Throughout their experience working in the Industry, they realized that the complexity of the technology and the centralization of knowledge & power led to an inefficient, unsustainable, not scalable and unequally distributed infrastructure. So they decided to redesign the whole Internet and cloud infrastructure bottom-up with the vision of shaping a global internet economy that can scale anywhere efficiently, cost efficiently and sustainably. 
## Why does the world needs peer-to-peer? 
By developing the technology, the conviction that peer-to-peer was the best solution for humanity and the planet strengthened itself. Why? Well, put simply, a peer-to-peer system removes all forms of intermediaries, unnecessary steps and complexity from the picture. Therefore, it simplifies the architecture in an incredible way. The benefits are many but here are the most popular benefits:
<br/>
- *Privacy*: Our peer-to-peer environment means no middlemen or intermediaries, meaning data travels directly between peers and stored on the nodes of their choice rather than being sent through and stored by a third party.
- *Security*: Data stored in data centers is susceptible to security breaches. In bypassing data centers and exchanging data directly between peers, we can achieve much greater security as it reduces code and back doors significantly. 
- *Scalability*: In a many-to-many system, scale is essentially unlimited. There is simply no bottleneck. And hardware (nodes) can be added at ease compared to current data center model.
- *Cost-efficiency & Sustainability*: End-to-end (direct) connection between peers means a more efficient path for data and less energy is needed. Less energy means less cost, and less harm to our planet.
## In 2021 the world is going peer-to-peer! 
We're now in 4 years into the project, and it is clear that ThreeFold holds the most advanced technology and is probably the only tech company in the world that can achieve a peer-to-peer network & digital world as envisioned by the concept authors. The ThreeFold Grid is running and already at it's 2.4 version and 2021 will bring various commercial opportunities for the public to partake in the peer-to-peer network, from hosting IT workloads to experiencing P2P end-user solutions. In other words, in 2021, the world will be able to go peer-to-peer.

Binary file not shown.

After

Width:  |  Height:  |  Size: 193 KiB

110
static/js/custom.js Normal file
View File

@ -0,0 +1,110 @@
var displayedMenu = "";
var hamburgerShown = false;
let width = screen.width;
var isMobile = width < 1024;
function toggleMenu(button) {
if (displayedMenu === button.id.split("-")[0]) {
button.className = button.className.replace(
" text-blue-500 bg-stone-200 sm:bg-transparent",
" text-gray-900"
);
hideMenu(button.id.split("-")[0]);
button.lastElementChild.className = button.lastElementChild.className.replace(
"rotate-0",
"-rotate-90"
);
displayedMenu = "";
} else {
showMenu(button.id.split("-")[0]);
button.lastElementChild.className = button.lastElementChild.className.replace(
"-rotate-90",
"rotate-0"
);
button.className = button.className.replace(
" text-gray-900",
" text-blue-500 bg-stone-200 sm:bg-transparent"
);
displayedMenu = button.id.split("-")[0];
}
}
function handleClick(button) {
if (button.id === "hamburger-btn" || button.id === "close-hamburger-btn") {
toggleHamburger();
}
if (button.id.indexOf("menu") !== -1) {
toggleMenu(button);
}
}
function toggleHamburger() {
if (hamburgerShown) {
hideHamburger();
hamburgerShown = false;
} else {
showHamburger();
hamburgerShown = true;
}
}
function showMenu(menuName) {
var menuId = menuName + (isMobile ? "-mobile-menu" : "-menu");
var menuBtnId = menuName + (isMobile ? "-mobile-menu" : "-menu");
var menuElement = document.getElementById(menuId);
menuElement.className = menuElement.className.replace(" hidden", "");
setTimeout(function () {
menuElement.className = menuElement.className.replace(
"duration-200 ease-in opacity-0 -translate-y-1",
"duration-150 ease-out opacity-1 -translate-y-0"
);
}, 10);
}
function hideMenu(menuName) {
var menuId = menuName + (isMobile ? "-mobile-menu" : "-menu");
var menuElement = document.getElementById(menuId);
menuElement.className = menuElement.className.replace(
"duration-150 ease-out opacity-1 -translate-y-0",
"duration-200 ease-in opacity-0 -translate-y-1"
);
setTimeout(function () {
menuElement.className = menuElement.className + " hidden";
}, 300);
}
function showHamburger() {
document.getElementById("header-container").className = "overflow-hidden";
document.getElementById("hamburger").className =
"fixed mt-24 z-20 top-0 inset-x-0 transition transform origin-top-right";
document.getElementById("hamburger-btn").className =
"hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
document.getElementById("close-hamburger-btn").className =
"inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
}
function hideHamburger() {
document.getElementById("header-container").className = "";
document.getElementById("hamburger").className =
"hidden absolute z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden";
document.getElementById("hamburger-btn").className =
"inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
document.getElementById("close-hamburger-btn").className =
"hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
if (displayedMenu !== "") {
hideMenu(displayedMenu);
}
}
window.onload = function () {
let elements = document.getElementsByTagName("button");
let buttons = [...elements];
buttons.forEach((button) => {
button.addEventListener("click", function () {
handleClick(button);
});
});
document
.getElementById("mobile-learn-btn")
?.addEventListener("click", toggleMenu);
};

View File

@ -9,5 +9,6 @@
{% block content %}{% endblock %}
</div>
{% include "partials/footer.html" %}
<script type="text/javascript" src="{{ get_url(path='js/custom.js')}}"></script>
</body>
</html>

View File

@ -0,0 +1,4 @@
{% extends "index.html" %}
{% block content %}
{% endblock content %}

View File

@ -0,0 +1,14 @@
{% extends "index.html" %}
{% block content %}
<main class="pt-16">
<div class="flex flex-col md:flex-row">
{% include "partials/productPosts.html" %}
{% include "partials/productSidebar.html" %}
</div>
</main>
{% endblock content %}

View File

@ -21,7 +21,7 @@ and a side nav for category and featured post navigation
{% include "partials/featuredBlog.html" %}
<div class="flex flex-col md:flex-row">
<div class="flex flex-col md:flex-row container mx-auto">
{% include "partials/blogPosts.html" %}
{% include "partials/blogSidebar.html" %}
</div>

View File

@ -0,0 +1,30 @@
{% extends "_default/base.html" %}
<!-- blog template
the template for displaying the blog page.
consists of a featured blog row,
a paginated list of posts (sorted by date),
and a side nav for category and featured post navigation
-->
{% block content %}
<main>
<!--sets global featured variable as the most recent post with the isFeatured tag-->
{%- set section = get_section(path="products/_index.md") %}
{% for page in section.pages %}
{% if page.extra.isFeatured %}
{%- set_global featured = page %}
{% break %}
{% endif %}
{% endfor %}
{% include "partials/featuredProduct.html" %}
<div class="flex flex-col md:flex-row container mx-auto">
{% include "partials/productPosts.html" %}
{% include "partials/productSidebar.html" %}
</div>
</main>
{% endblock content %}

View File

@ -0,0 +1,36 @@
{% if featured.taxonomies.people %}
{% set people = get_section(path="people/_index.md") %}
{% set pages_str = people.pages | json_encode() | as_str %}
{% if pages_str is containing(featured.taxonomies.people[0]) %}
{% set author_path = 'people/' ~ featured.taxonomies.people[0] ~ '/index.md' %}
{% set author = get_page(path=author_path) %}
{% endif %}
{% endif %}
<body>
<div class="md:grid md:grid-cols-2 md:gap-8 relative mt-16 lg:mt-16 items-center container mx-auto">
<div class="relative lg:ml-8 my-8 w-full md:w-auto">
<h3 class="text-base not-italic leading-6 text-gray-600">FEATURED PRODUCT</h3>
<a href={{featured.permalink}} class="">
<h2
class="mt-8 text-2xl main-title sm:text-3xl md:text-4xl lg:text-5xl fw-500 leading-snug font-normal mb-4 md:mb-10 ">
{{ featured.title }}
</h2>
</a>
<h4 class="text-sm not-italic font-light leading-6 text-gray-600">
{{ featured.date | date(format="%B %e, %Y", timezone="America/Chicago")}} -
</h4>
</div>
<div class="mx-4 relative lg:mt-0 max-w-full">
<img class="relative mx-auto md:w-auto rounded md:max-w-full max-h-80" src={{featured.permalink}}{{featured.extra.imgPath}} alt="" />
</div>
</div>
<hr class="mt-6">
</div>
</div>
</body>

View File

@ -3,87 +3,6 @@
Read the documentation to get started: https://tailwindui.com/documentation
--><!-- This example requires Tailwind CSS v1.4.0+ -->
<script type="text/javascript">
var displayedMenu = "";
var hamburgerShown = false;
let width = screen.width;
var isMobile = width < 1024;
function toggleMenu(button) {
if (displayedMenu === button.id.split("-")[0]) {
button.className = button.className.replace(" text-blue-500 bg-stone-200 sm:bg-transparent", " text-gray-900");
hideMenu(button.id.split("-")[0]);
button.lastElementChild.className = button.lastElementChild.className.replace("rotate-0", "-rotate-90")
displayedMenu = "";
}
else {
showMenu(button.id.split("-")[0]);
button.lastElementChild.className = button.lastElementChild.className.replace("-rotate-90", "rotate-0")
button.className = button.className.replace(" text-gray-900", " text-blue-500 bg-stone-200 sm:bg-transparent");
displayedMenu = button.id.split("-")[0]
}
}
function handleClick(button) {
if (button.id === "hamburger-btn" || button.id === "close-hamburger-btn") { toggleHamburger() }
if (button.id.indexOf("menu") !== -1 ) {
toggleMenu(button)
}
}
function toggleHamburger() {
if (hamburgerShown) {
hideHamburger();
hamburgerShown = false;
}
else {
showHamburger();
hamburgerShown = true;
}
}
function showMenu(menuName) {
var menuId = menuName + (isMobile ? '-mobile-menu' : '-menu');
var menuBtnId = menuName + (isMobile ? '-mobile-menu' : '-menu');
var menuElement = document.getElementById(menuId)
menuElement.className = menuElement.className.replace(" hidden" , "");
setTimeout(function() { menuElement.className = menuElement.className.replace("duration-200 ease-in opacity-0 -translate-y-1", "duration-150 ease-out opacity-1 -translate-y-0"); }, 10);
}
function hideMenu(menuName) {
var menuId = menuName + (isMobile ? '-mobile-menu' : '-menu');
var menuElement = document.getElementById(menuId)
menuElement.className = menuElement.className.replace("duration-150 ease-out opacity-1 -translate-y-0", "duration-200 ease-in opacity-0 -translate-y-1");
setTimeout(function() { menuElement.className = menuElement.className + " hidden" }, 300);
}
function showHamburger() {
document.getElementById('header-container').className = "overflow-hidden";
document.getElementById('hamburger').className = "fixed mt-24 z-20 top-0 inset-x-0 transition transform origin-top-right";
document.getElementById('hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
document.getElementById('close-hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
}
function hideHamburger() {
document.getElementById('header-container').className = "";
document.getElementById('hamburger').className = "hidden absolute z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden";
document.getElementById('hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
document.getElementById('close-hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
if (displayedMenu !== "") { hideMenu(displayedMenu); }
}
window.onload = function(){
let elements = document.getElementsByTagName("button");
let buttons = [...elements]
buttons.forEach((button) => {
button.addEventListener( 'click', function() { handleClick(button) });
})
document.getElementById("mobile-learn-btn").addEventListener( 'click', toggleMenu);
}
</script>
<!-- set variables used for header template -->
{% set section = get_section(path="_index.md") %}

View File

@ -3,87 +3,6 @@
Read the documentation to get started: https://tailwindui.com/documentation
--><!-- This example requires Tailwind CSS v1.4.0+ -->
<script type="text/javascript">
var displayedMenu = "";
var hamburgerShown = false;
let width = screen.width;
var isMobile = width < 1024;
function toggleMenu(button) {
if (displayedMenu === button.id.split("-")[0]) {
button.className = button.className.replace(" text-blue-500 bg-stone-200 sm:bg-transparent", " text-gray-900");
hideMenu(button.id.split("-")[0]);
button.lastElementChild.className = button.lastElementChild.className.replace("rotate-0", "-rotate-90")
displayedMenu = "";
}
else {
showMenu(button.id.split("-")[0]);
button.lastElementChild.className = button.lastElementChild.className.replace("-rotate-90", "rotate-0")
button.className = button.className.replace(" text-gray-900", " text-blue-500 bg-stone-200 sm:bg-transparent");
displayedMenu = button.id.split("-")[0]
}
}
function handleClick(button) {
if (button.id === "hamburger-btn" || button.id === "close-hamburger-btn") { toggleHamburger() }
if (button.id.indexOf("menu") !== -1 ) {
toggleMenu(button)
}
}
function toggleHamburger() {
if (hamburgerShown) {
hideHamburger();
hamburgerShown = false;
}
else {
showHamburger();
hamburgerShown = true;
}
}
function showMenu(menuName) {
var menuId = menuName + (isMobile ? '-mobile-menu' : '-menu');
var menuBtnId = menuName + (isMobile ? '-mobile-menu' : '-menu');
var menuElement = document.getElementById(menuId)
menuElement.className = menuElement.className.replace(" hidden" , "");
setTimeout(function() { menuElement.className = menuElement.className.replace("duration-200 ease-in opacity-0 -translate-y-1", "duration-150 ease-out opacity-1 -translate-y-0"); }, 10);
}
function hideMenu(menuName) {
var menuId = menuName + (isMobile ? '-mobile-menu' : '-menu');
var menuElement = document.getElementById(menuId)
menuElement.className = menuElement.className.replace("duration-150 ease-out opacity-1 -translate-y-0", "duration-200 ease-in opacity-0 -translate-y-1");
setTimeout(function() { menuElement.className = menuElement.className + " hidden" }, 300);
}
function showHamburger() {
document.getElementById('header-container').className = "overflow-hidden";
document.getElementById('hamburger').className = "fixed mt-16 z-20 top-0 inset-x-0 transition transform origin-top-right";
document.getElementById('hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
document.getElementById('close-hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
}
function hideHamburger() {
document.getElementById('header-container').className = "";
document.getElementById('hamburger').className = "hidden absolute z-20 top-0 inset-x-0 transition transform origin-top-right lg:hidden";
document.getElementById('hamburger-btn').className = "inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
document.getElementById('close-hamburger-btn').className = "hidden lg:hidden inline-flex items-center justify-center p-2 rounded-md text-gray-400 hover:text-gray-500 hover:bg-gray-100 focus:outline-none focus:bg-gray-100 focus:text-gray-500 transition duration-150 ease-in-out my-2";
if (displayedMenu !== "") { hideMenu(displayedMenu); }
}
window.onload = function(){
let elements = document.getElementsByTagName("button");
let buttons = [...elements]
buttons.forEach((button) => {
button.addEventListener( 'click', function() { handleClick(button) });
})
document.getElementById("mobile-learn-btn").addEventListener( 'click', toggleMenu);
}
</script>
{%- set section = get_section(path="header/_index.md") %}
{% set header_items = section.content | safe | split(pat="<li>") %}
@ -193,9 +112,15 @@
{% if '<a' in header_label %}
{% set link_label = header_label | striptags %}
{% set link_path = header_label | split(pat="%22") | safe%}
{% if header_label is containing("http") %}
<a href="{{link_path[1]}}" target="_blank" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
{{link_label}}
</a>
{% else %}
<a href="{{link_path[1]}}" class="text-lg px-8 py-3 leading-6 font-normal text-gray-900 hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">
{{link_label}}
</a>
{% endif %}
{% else %}
{% set button_id = header_label ~ "-mobile-menu-btn" | slugify %}
<button type="button" id="{{button_id}}" class="flex flex px-8 py-3 items-start text-left text-gray-900 group inline-flex space-x-2 text-lg leading-6 font-normal hover:text-gray-900 focus:outline-none focus:text-gray-900 transition ease-in-out duration-150">

View File

@ -0,0 +1,75 @@
{% if post.date %}
{% if post.taxonomies.people %}
{% set people = get_section(path="people/_index.md") %}
{% set pages_str = people.pages | json_encode() | as_str %}
{% if pages_str is containing(post.taxonomies.people[0]) %}
{% set author_path = 'people/' ~ post.taxonomies.people[0] ~ '/index.md' %}
{% set author = get_page(path=author_path) %}
{% set content = get_page(path=author_path) %}
{% endif %}
{% endif %}
<div class="flex flex-col rounded-lg shadow-lg overflow-hidden">
<div class="flex-1 border-b">
<a href="{{ post.permalink }}" class="block">
{% if post.extra.imgPath %}
{% set img_url = get_url(path='/' ~ post.relative_path | replace(from='_', to='-') | replace(from='index.md',
to=post.extra.imgPath)) %}
<div class="flex-shrink-0">
<img class="h-48 w-full mx-auto object-cover" src={{img_url}} alt="{{post.title ~ ' Picture'}}" />
</div>
{%endif%}
<div class="flex-1 bg-white p-6 flex flex-col justify-between">
<h3 class="mt-2 text-xl leading-6 font-medium text-gray-900 text-left not-italic">
{{ post.title }}
</h3>
{% if post.description %}
<p class="mt-3 text-sm font-normal text-gray-500 text-left">
{{ post.description }}
</p>
{% endif %}
<div class="article hidden">{{ post.content | safe }}</div>
<div class="w-full post-card-meta py-3">
<div class="avatars">
<div class="flex">
<div class="flex">
<ul class="list-none flex author-list mr-2 pl-0">
{% if author %}
{% set author_img = get_url(path='/' ~ author.relative_path | replace(from='_', to='-') |
replace(from='index.md', to=author.extra.imgPath)) %}
<li class="author-list-item"><img alt="{{author.title}}" src="{{author_img}}"
class="w-8 h-8 rounded-full bg-gray-200 border-2 border-white"></li>
{% endif %}
</ul>
</div>
<div class="flex flex-col text-left leading-none uppercase">
{% if author %}
<p class="text-gray-700 text-xs">{{ author.title }}</p>
{% endif %}
<p class="text-gray-700 text-xs">
<time datetime="{{post.date}}">
{{ post.date | date(format="%B %e, %Y", timezone="America/Chicago") }}
</time>
</p>
<p class="flex justify-between lowercase my-2 items-center text-gray-700 text-xs"><span id="time"
class="time"></span>
</p>
</div>
<br />
</div>
</div>
</div>
</a>
</div>
</div>
</div>
<style>
.border-b {
border-bottom-width: 1px !important;
}
</style>
{% endif %}

View File

@ -0,0 +1,70 @@
{% block content %}
<div class="text-center main-title px-0 md:w-2/3 lg:w-2/3 mx-8 md:mx-12">
<h1
class="tracking-tight text-left text-2xl md:text-4xl lg:text-5xl fw-500 leading-snug font-normal mb-10"
>
{% set path_array = current_path | split(pat="/") %}
{% set taxonomy = path_array[1] %}
{% set item = path_array[2] %}
The Latest from OurPhone
{% if taxonomy == "items" %} -
{{item | replace(from='-', to=' ' ) | title}}
{% endif %}
</h1>
<div>
<div class="mt-12 grid gap-5 max-w-lg mx-auto lg:grid-cols-2 xl:grid-cols-3 lg:max-w-none">
{%- for post in paginator.pages %}
{% if not post.extra.hidden %}
{% include "partials/productCard.html" %}
{%endif%} {%- endfor %}
</div>
<hr class="mt-6" />
<p class="text-center text-sm mt-2 mb-16">
{% if paginator.previous %}
<a
class="border-transparent"
aria-label="First page"
href="{{ paginator.first }}"
>{% include "partials/icons/svgPrevPageIcon.html" %}{% include
"partials/icons/svgPrevPageIcon.html" %}</a
>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a
class="border-transparent"
aria-label="Previous page"
href="{{ paginator.previous }}"
>{% include "partials/icons/svgPrevPageIcon.html" %}</a
>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% else %} {%
include "partials/icons/svgFirstPageIcon.html" %}{% include
"partials/icons/svgFirstPageIcon.html" %}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% include
"partials/icons/svgFirstPageIcon.html" %}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% endif %} {% if
paginator.next %}
<a
class="border-transparent"
aria-label="Next page"
href="{{ paginator.next }}"
>{% include "partials/icons/svgNextPageIcon.html" %}</a
>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a
class="border-transparent"
aria-label="Last page"
href="{{ paginator.last }}"
>{% include "partials/icons/svgNextPageIcon.html" %}{% include
"partials/icons/svgNextPageIcon.html" %}</a
>
{% else %} {% include "partials/icons/svgLastPageIcon.html" %}
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {% include
"partials/icons/svgLastPageIcon.html" %}{% include
"partials/icons/svgLastPageIcon.html" %} {% endif %}
</p>
</div>
</div>
{% endblock content %}

View File

@ -0,0 +1,38 @@
<div class="mx-8 md:mx-4 flex flex-col">
<div class="flex flex-col mb-12 mr-8 lg:mr-24">
<h4 class="text-base not-italic font-medium leading-6 text-gray-600 mb-6"> FILTER PRODUCTS BY</h4>
<a id="all" class="mb-3 text-black font-normal" href="/products">All</a>
{% set taxonomy = get_taxonomy(kind="items") %}
{% set items = taxonomy.items %}
{% for item in items %}
{% set path = item.name | slugify %}
{% set fullpath = "/items/" ~ path %}
<a id="{{path}}" class="mb-3 text-black font-normal" href={{fullpath}}> {{item.name}} </a>
{% endfor %}
</div>
{% set section = get_section(path="products/_index.md")%}
<div class="lg:pt-6 flex flex-col mb-12 w-64 mr-8 lg:mr-24">
<h4 class="text-base not-italic font-medium leading-6 text-gray-600 mb-6"> FEATURED POSTS</h4>
{% for page in section.pages %}
{% if page.extra.isFeatured %}
<a class="mb-3 text-blue-700" href={{page.permalink}}>{{ page.title }}</a>
{% endif %}
{% endfor %}
</div>
</div>
<script>
function setActiveProduct() {
let activeProduct = window.location.pathname.split("/")[2]
if (typeof activeProduct === "undefined") { activeLink = document.getElementById("all") }
else { activeLink = document.getElementById(activeProduct)}
activeLink.className = activeLink.className.replace("text-black font-normal", "text-black font-semibold");
}
setActiveProduct()
</script>

View File

@ -0,0 +1,82 @@
{% extends "_default/base.html" %}
{% block content %}
{% if page.taxonomies.people %}
{% set people = get_section(path="people/_index.md") %}
{% set pages_str = people.pages | json_encode() | as_str %}
{% if pages_str is containing(page.taxonomies.people[0]) %}
{% set author_path = 'people/' ~ page.taxonomies.people[0] ~ '/index.md' %}
{% set author = get_page(path=author_path) %}
{% endif %}
{% endif %}
<!-- Default page template for blog posts and basic informative markdown files -->
{% set split = page.content | split(pat="ourphone.tf") %}
{% if split | length < 2 %} {% set content=page.content %} {% else %} {% set content="" %} {% for part in split %} {% if
part is starting_with("/product") %} {% set split_part=part | split(pat='/">' ) %} {% set link=split_part[0] %} {% set
link=link | replace(from="/product/post" , to="/product" ) %} {% set link=link | replace(from="_" , to="-" ) %} {% set
rest_part=split_part | slice(start=1) | join(sep='/"' ) %} {% set part=link ~ '/">' ~ rest_part %} {% endif %} {% if
loop.first %} {% set_global content=part%} {% else %} {% set_global content=content ~ "ourphone.tf" ~ part%} {% endif
%} {% endfor %} {% endif %} <main>
<div class="container mx-auto mt-20">
<div>
<article class="article lg:w-4/6 mx-auto">
<h1 class="lg:text-5xl text-2xl font-medium leading-none mt-0 text-gray-700">
{{ page.title }}
</h1>
<h4 class="lg:text-2xl text-base text-gray-600 leading-8">
{{ page.description }}
</h4>
<section class="post-author-list mb-3 mx-0">
<div class="flex items-center">
<div class="flex justify-between items-center">
<ul class="list-none flex author-list m-0">
<li class="author-list-item">
{% if author %}
{% set author_img = get_url(path='/' ~ author.relative_path | replace(from='_', to='-') |
replace(from='index.md', to=author.extra.imgPath)) %}
<img src="{{author_img}}" alt="{{author.title}}" class="
h-8
w-8
sm:h-10
sm:w-10
rounded-full
bg-gray-200
border-2 border-white
" />
</li>
{% endif %}
</ul>
</div>
<div class="pl-3 flex flex-col text-xs leading-none uppercase">
{% if author %}
<a href="{{author.permalink}}" class="text-gray-700 text-xs">{{ author.title }}</a>
{% endif %}
<p class="text-gray-700 text-xs">
<time datetime="{{ page.date }}"> {{ page.date | date(format="%B %e, %Y", timezone="America/Chicago")
}}</time><br />
<span id="time"
class="time"></span>
</p>
</div>
</div>
<div class="my-2 sharethis-inline-share-buttons"></div>
</section>
{% set img_url = get_url(path='/' ~ page.relative_path | replace(from='_', to='-') | replace(from='index.md',
to=page.extra.imgPath)) %}
<img class="mb-8 mx-auto" src={{img_url}} alt="{{page.title ~ 'Picture'}}">
<div>{{ content | safe }}</div>
</article>
</div>
</div>
</main>
{% endblock content %}