Commit bc765071 authored by simmalik's avatar simmalik
Browse files

templates

parents
File added
The MIT License (MIT)
Copyright (c) 2020 themefisher
Permission is hereby granted, free of charge, to any person obtaining a copy of
this software and associated documentation files (the "Software"), to deal in
the Software without restriction, including without limitation the rights to
use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
the Software, and to permit persons to whom the Software is furnished to do so,
subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
# Easy Setup (Hugo + Netlify + Forestry)
Build your website with omega hugo theme by following this easy steps (No Coding Required)
<a href="http://bit.ly/meghna-hugo-installation" target="_blank" title="meghna hugo installation" rel="nofollow"><img width="100%" src="https://user-images.githubusercontent.com/37659754/70844354-4028be00-1e6a-11ea-8d84-02e9a25e7db8.png"></a>
In this tutorial we will show you to make your website live without buying any hosting and touching a single line of code. We made this tutorial based on [meghna hugo](https://github.com/themefisher/meghna-hugo) but you can setup everithing like this.
### What you need !!
1. Git acccount (Ex: Github, Gitlab etc ) . In our case we use github.
2. [Netlify](https://bit.ly/netlify-account) account to host files and add custom domain .
3. [Forestry](https://bit.ly/forestry-account) account to maintain whole project without code.
### Step 1 : Fork or Clone repository
First we will fork this [omega hugo](https://github.com/gethugothemes/omega-hugo/) template.
### Step 2 : Add your repository in Forestry
Go to your [forestry](https://bit.ly/forestry-account) account and click on `import your site now`. declare your config.toml file [`exampleSite`] and fill up basic settings .
**Or just click this button for one click installation** [![import to forestry](https://assets.forestry.io/import-to-forestryK.svg)](https://app.forestry.io/quick-start?repo=gethugothemes/omega-hugo&engine=hugo&version=0.60.1&config=exampleSite)
Now mark everything as done, then go to configuration to change the base url . You can put any url but this have to similar as netlify . So for now put a name which you are going to put in netlify as netlify subdomain.
### Step 3 : Setup and host website with Netlify
Here comes the last step . Go to your [netlify](https://bit.ly/netlify-account) account and click add new site . Choose your git repository to import your website in netlify . And now you can see the forked `omega hugo` theme. select it and follow the steps. Then go to `site settings` for change the site name and put your subdoamin name here what you puted on forestry as base url. save it and go to `deploy` from top menu, Wait a while and click on `site preview` or just simply go to the subdomain you puted as base url. **BOOM! Your site is live.** Now you can go to forestry and add, remove or customize every setting and content.
> If you face any issue regarding the installation feel free to onen [open a new issue](https://github.com/gethugothemes/omega-hugo/issues)
## Table of Contents
- [Demo](#demo)
- [Quick Start](#quick-start)
- [Installation](#installation)
- [Reporting Issues](#reporting-issues)
- [Technical Support or Questions](#technical-support-or-questions-(paid))
- [Licensing](#licensing)
- [More Hugo Themes](https://themefisher.com/hugo-themes/)
## Demo
![omega](images/screenshot.png)
**The images are only for demonstration purpose, Please don't use those images.**
[Live Preview](http://demo.themefisher.com/omega-hugo/).
## Quick Start
Quick start options:
- Clone the repo: `git clone https://github.com/gethugothemes/omega-hugo/.git`.
- [Download from Github](https://github.com/gethugothemes/omega-hugo/archive/master.zip).
## Installation
At the top we have shown an easy hugo installation. but still if you think you want to go with the traditional way then use the following commands:
```
$ git clone git@github.com:gethugothemes/omega-hugo/.git
$ cd omega-hugo/exampleSite/
$ hugo server --themesDir ../..
```
Or Check out [Full Documentation](https://docs.gethugothemes.com/omega/?ref=github).
## Reporting Issues
We use GitHub Issues as the official bug tracker for the **Omega Theme**. Please Search [existing issues](https://github.com/gethugothemes/omega-hugo/issues). It’s possible someone has already reported the same problem.
If your problem or idea is not addressed yet, [open a new issue](https://github.com/gethugothemes/omega-hugo/issues/new)
## Technical Support or Questions (Paid)
If you have questions or need help integrating the product please [contact us](mailto:mehedi@themefisher.com) instead of opening an issue.
## Licensing
- Copyright 2020 Designed by [Themefisher](https://themefisher.com/) & Developed by [Gethugothemes](https://gethugothemes.com/)
- Licensed under MIT (https://github.com/gethugothemes/omega-hugo//blob/master/LICENSE)
## Premium Themes
| [![Mega-Bundle-HUGO](https://gethugothemes.com/wp-content/uploads/edd/2019/09/Mega-Bundle-HUGO.png)](https://themefisher.com/products/hugo-mega-bundle/) | [![Phantop](https://gethugothemes.com/wp-content/uploads/edd/2019/06/Phantom.jpg)](https://gethugothemes.com/products/phantom-hugo-theme/) | [![redlab](https://gethugothemes.com/wp-content/uploads/edd/2019/09/redlab-hugo-thumbnail.jpg)](https://gethugothemes.com/products/redlab-hugo/) |
|:---:|:---:|:---:|
| **Hugo Mega Bundle** | **Phantom** | **Red Lab** |
---
title: "{{ replace .Name "-" " " | title }}"
date: {{ .Date }}
draft: true
# description
description: "This is meta description"
---
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
body{
background: #05091D;
}
.section {
padding: 100px 0;
}
// Promo Video
.video{
position:relative;
&:before{
border-radius: 3px;
}
img{
width: 100%;
}
.video-button{
position: absolute;
left: 0;
top: 0;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
width: 100%;
height: 100%;
}
.video-box{
a{
width: 100%;
height: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-decoration: none;
i{
height: 120px;
width: 120px;
font-size: 20px;
border-radius: 100%;
border: 3px solid $white;
color: $white;
line-height: 120px;
text-align: center;
}
iframe{
width: 100%;
height: 100%;
border: none;
padding: 10px 30px;
background: $black;
}
}
}
}
.dividers{
display: flex;
align-items: center;
width: 1170px;
position: fixed;
top: 0;
left: 50%;
transform: translateX(-50%);
.divider{
border-right: 1px solid $white;
flex-basis: 20%;
height: 100vh;
opacity: .20;
&:first-child{
border-left: 1px solid $white;
}
}
}
.reveal-text {
position: relative;
white-space: nowrap;
animation-name: reveal-text;
animation-duration: 1s;
animation-fill-mode: both;
animation-timing-function: cubic-bezier(1,.01,0,1);
clip-path: inset(0 100% 0 0);
}
.reveal-text::after {
content: "";
position: absolute;
z-index: 999;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: $primary-color;
transform: scaleX(0);
transform-origin: 0 50%;
animation-duration: 1s;
animation-fill-mode: both;
animation-timing-function: cubic-bezier(1,.01,0,1);
animation-name: revealer-text;
}
@keyframes reveal-text {
from {
clip-path: inset(0 100% 0 0);
}
to {
clip-path: inset(0 0 0 0);
}
}
@keyframes revealer-text {
0%, 50% {
transform-origin: 0 50%;
}
51%, 100% {
transform-origin: 100% 50%;
}
50% {
transform: scaleX(1);
}
100% {
transform: scaleX(0);
}
}
.image-reveal{
transform: scaleX(0);
transform-origin: left;
transition: all 1s cubic-bezier(1,.01,0,1);
position: relative;
img{
width: 100%;
}
&:after{
content: '';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background: $white;
z-index: 2;
transition: all .5s cubic-bezier(1,.01,0,1);
transition-delay: 1s;
}
&.trigger{
transform: scaleX(1);
&:after{
transform: translateX(100%);
}
}
}
.preloader{
height: 100%;
width: 100%;
display: flex;
position: fixed;
background: #05091D;
z-index: 9999;
overflow-y: hidden;
}
.spinner {
.double-bounce1, .double-bounce2 {
width: 40px;
height: 40px;
border-radius: 50%;
background-color: #333;
opacity: 0.6;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
-webkit-animation: sk-bounce 2.0s infinite ease-in-out;
animation: sk-bounce 2.0s infinite ease-in-out;
}
.double-bounce2 {
-webkit-animation-delay: -1.0s;
animation-delay: -1.0s;
}
}
@-webkit-keyframes sk-bounce {
0%, 100% { -webkit-transform: scale(0.0) }
50% { -webkit-transform: scale(1.0) }
}
@keyframes sk-bounce {
0%, 100% {
transform: scale(0.0);
-webkit-transform: scale(0.0);
} 50% {
transform: scale(1.0);
-webkit-transform: scale(1.0);
}
}
\ No newline at end of file
/*=== MEDIA QUERY ===*/
@mixin mobile-xs{
@media(max-width:400px){
@content;
}
}
@mixin mobile{
@media(max-width:575px){
@content;
}
}
@mixin tablet{
@media(max-width:767px){
@content;
}
}
@mixin desktop{
@media(max-width:991px){
@content;
}
}
@mixin desktop-lg{
@media(max-width:1200px){
@content;
}
}
@mixin desktop-xl{
@media(min-width:1400px){
@content;
}
}
@mixin desktop-xxl{
@media(min-width:1600px){
@content;
}
}
@mixin desktop-4k {
@media(min-width: 1921px) {
@content;
}
}
\ No newline at end of file
@font-face {
font-family: 'bebas_neue_regular';
src: url('../fonts/bebasneue_regular-webfont.woff2') format('woff2'),
url('../fonts/bebasneue_regular-webfont.woff') format('woff');
}
@font-face {
font-family: 'butlerbold';
src: url('../fonts/butler_bold-webfont.woff2') format('woff2'),
url('../fonts/butler_bold-webfont.woff') format('woff');
}
body {
line-height: 1.5;
font-family: $secondary-font;
-webkit-font-smoothing: antialiased;
}
p {
font-family: $secondary-font;
color: $text-color;
font-size:16px;
letter-spacing: 1px;
}
h1,h2,h3,h4,h5,h6 {
font-family: $primary-font;
color: $text-color;
}
h1, h2, h3, h4, h5, h6 {
font-weight:600;
}
// h1 {
// font-size: 45px;
// }
// h2 {
// font-size:34px;
// }
// h3 {
// font-size:20px;
// }
// h4 {
// font-size:16px;
// }
// h6{
// font-size: 18px;
// }
label{
font-size: 15px;
margin-bottom: 5px;
}
// Colors
$primary-color: #0a6446;
$black: #000;
$white: #fff;
$gray: #848484;
$border-color:#d8dbdd;
$primary-font: 'butlerbold';
$secondary-font: 'bebas_neue_regular';
$icon-font: 'FontAwesome';
$text-color: $white;
$text-color-dark: #05091D;
$btn-color: #FF1D5D;
$body-color: #0c5460;
\ No newline at end of file
@import 'vendors/bootstrap';
@import 'vendors/fancybox';
@import 'vendors/font-awesome';
@import 'vendors/slick';
@import 'variables';
@import 'media-query';
@import 'typography';
@import 'buttons';
@import 'common';
@import 'templates/navigation';
@import 'templates/hero-area';
@import 'templates/mission';
@import 'templates/vision';
@import 'templates/products';
@import 'templates/contact';
@import 'templates/career';
@import 'templates/footer';
.career-featured{
.block{
display: flex;
@include tablet {
flex-wrap: wrap;
}
.content{
flex-basis: 100%;
align-self: center;
margin-right: 20px;
@include tablet {
flex-grow: 1;
width: 100%;
margin-bottom: 30px;
text-align: center;
}
h2{
font-size: 35px;
margin-bottom: 20px;
span{
clip-path: inset(0 100% 0 0);
}
}
p{
letter-spacing: 1px;
}
}
.video{
justify-content: center;
align-self: center;
flex-basis: 100%;
margin-left: 10px;
overflow: hidden;
@include tablet {
flex-grow: 1;
width: 100%;
}
}
}
}
.company-fun-facts{
h2{
font-size: 60px;
margin-bottom: 60px;
text-transform: capitalize;
@include desktop{
font-size: 40px;
}
@include tablet{
font-size: 30px;
}
}
.fun-fact{
margin-bottom: 20px;
text-align: center;
i{
font-size: 25px;
display: inline-block;
margin-bottom: 10px;
line-height: 60px;
height: 60px;
width: 60px;
border: 1px solid $white;
border-radius: 100%;
color: $white;
}
}
}
.gallery{
.image{
overflow: hidden;
cursor: pointer;
}
}
.job-list{
.block{
padding: 50px 80px;
background: lighten($color: $body-color, $amount: 10);
h2{
margin-bottom: 60px;
font-size: 30px;
}
.job{
padding: 50px 10px;
border-top: 1px solid $border-color;
display: flex;
@include tablet {
flex-wrap: wrap;
}
.content{
flex-basis: 60%;
@include tablet {
flex-basis: 100%;
width: 100%;
flex-grow: 1;
text-align: center;
margin-bottom: 30px;
}
h3{
margin-bottom: 15px;
font-size: 25px;
}
p{
font-size: 18px;
letter-spacing: 1px;
}
}
.apply-button{
flex-basis: 40%;
align-self: center;
text-align: right;
@include tablet {
flex-basis: 100%;
width: 100%;
flex-grow: 1;
text-align: center;
}
}
}
}
}
.jd-modal{
.close{
color: $white;
text-shadow: none;
cursor: pointer;
outline: 0;
font-weight: 300;
font-size: 40px;
}
.modal-content{
padding: 25px;
text-align: left;
background: lighten($color: $body-color, $amount: 10);
.modal-body{
.block-2{
display: flex;
.title{
width: 30%;
}
.details{
width: 70%;
ul{
padding-left: 0;
margin: 0;
li{
list-style: none;
margin-bottom: 5px;