fix /sigh
3
.dockerignore
Normal file
@@ -0,0 +1,3 @@
|
||||
node_modules/
|
||||
.idea/
|
||||
.env
|
2
.env.prod
Normal file
@@ -0,0 +1,2 @@
|
||||
VITE_API_URL=https://api.bacfrederick.com
|
||||
VITE_BUILD=1.0.0
|
25
.gitignore
vendored
Normal file
@@ -0,0 +1,25 @@
|
||||
# Logs
|
||||
logs
|
||||
*.log
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
lerna-debug.log*
|
||||
|
||||
node_modules
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# Editor directories and files
|
||||
.vscode/*
|
||||
!.vscode/extensions.json
|
||||
.idea
|
||||
.DS_Store
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
.env
|
8
Dockerfile
Normal file
@@ -0,0 +1,8 @@
|
||||
FROM node:19.6.0 as build
|
||||
|
||||
ADD . .
|
||||
RUN rm .env.local && cp .env.prod .env && npm i && npm run build
|
||||
|
||||
FROM caddy
|
||||
|
||||
COPY --from=build /dist /usr/share/caddy/
|
18
README.md
Normal file
@@ -0,0 +1,18 @@
|
||||
# Vue 3 + TypeScript + Vite
|
||||
|
||||
This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
|
||||
|
||||
## Recommended IDE Setup
|
||||
|
||||
- [VS Code](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur) + [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
|
||||
|
||||
## Type Support For `.vue` Imports in TS
|
||||
|
||||
TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
|
||||
|
||||
If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
|
||||
|
||||
1. Disable the built-in TypeScript Extension
|
||||
1. Run `Extensions: Show Built-in Extensions` from VSCode's command palette
|
||||
2. Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
|
||||
2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
|
40
index.html
Normal file
@@ -0,0 +1,40 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Beech Aero Club of Frederick</title>
|
||||
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<link rel="manifest" href="/site.webmanifest">
|
||||
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#5bbad5">
|
||||
<meta name="msapplication-TileColor" content="#603cba">
|
||||
<meta name="theme-color" content="#ffffff">
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css" integrity="sha512-z3gLpd7yknf1YoNbCzqRKc4qyor8gaKU1qmn+CShxbuBusANI9QpRohGBreCFkKxLhei6S9CQXFEbbKuqLg0DA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
<meta name="description" content="Affordable Flying for Beechcraft Enthusiasts"/>
|
||||
<meta name="keywords"
|
||||
content="frederick, flying club, beechcraft, debonair, bonanaza, cheep flying, aircraft purchase">
|
||||
<script
|
||||
src="https://code.jquery.com/jquery-2.2.4.min.js"
|
||||
integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44="
|
||||
crossorigin="anonymous"></script>
|
||||
</head>
|
||||
<body data-spy="scroll" data-target="#navbarsspy" data-offset="57">
|
||||
|
||||
<div id="preloader">
|
||||
<div id="preloader-inner"></div>
|
||||
</div>
|
||||
|
||||
<div class="page-wrapper" style="height: 100%; display: none;">
|
||||
<div id="app"></div>
|
||||
</div>
|
||||
|
||||
<a href="#" class="back-to-top hidden-xs-down" id="back-to-top">
|
||||
<i style="margin-left: 20px;" class="fas fa-angle-up"></i>
|
||||
</a>
|
||||
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
<script src="/plugins/plugins.js"></script>
|
||||
|
||||
</body>
|
||||
</html>
|
1264
package-lock.json
generated
Normal file
27
package.json
Normal file
@@ -0,0 +1,27 @@
|
||||
{
|
||||
"name": "frontend",
|
||||
"private": true,
|
||||
"version": "0.0.0",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "vite",
|
||||
"build": "vue-tsc && vite build",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"animate.css": "^3.7.0",
|
||||
"axios": "^1.6.0",
|
||||
"bootstrap": "^4.0.0",
|
||||
"bootstrap-notify": "^3.1.3",
|
||||
"jquery": "^3.3.1",
|
||||
"vue": "^3.3.4"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/jquery": "^3.5.25",
|
||||
"@vitejs/plugin-vue": "^4.2.3",
|
||||
"sass": "^1.69.5",
|
||||
"typescript": "^5.0.2",
|
||||
"vite": "^4.4.5",
|
||||
"vue-tsc": "^1.8.5"
|
||||
}
|
||||
}
|
BIN
public/apple-touch-icon.png
Executable file
After Width: | Height: | Size: 18 KiB |
BIN
public/favicon-16x16.png
Executable file
After Width: | Height: | Size: 1.4 KiB |
BIN
public/favicon-32x32.png
Executable file
After Width: | Height: | Size: 2.5 KiB |
BIN
public/favicon.ico
Executable file
After Width: | Height: | Size: 15 KiB |
BIN
public/images/favicon.png
Executable file
After Width: | Height: | Size: 21 KiB |
BIN
public/images/logo.png
Executable file
After Width: | Height: | Size: 29 KiB |
BIN
public/images/logo_app.png
Executable file
After Width: | Height: | Size: 100 KiB |
BIN
public/images/logo_white.png
Executable file
After Width: | Height: | Size: 40 KiB |
350
public/plugins/plugins.js
Executable file
BIN
public/video/27128760_492610754487667_4824731412490851473_n.mp4
Executable file
BIN
public/video/27128760_492610754487667_4824731412490851473_n.png
Executable file
After Width: | Height: | Size: 522 KiB |
BIN
public/video/27128760_492610754487667_4824731412490851473_n.webm
Executable file
1
public/vite.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="31.88" height="32" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 257"><defs><linearGradient id="IconifyId1813088fe1fbc01fb466" x1="-.828%" x2="57.636%" y1="7.652%" y2="78.411%"><stop offset="0%" stop-color="#41D1FF"></stop><stop offset="100%" stop-color="#BD34FE"></stop></linearGradient><linearGradient id="IconifyId1813088fe1fbc01fb467" x1="43.376%" x2="50.316%" y1="2.242%" y2="89.03%"><stop offset="0%" stop-color="#FFEA83"></stop><stop offset="8.333%" stop-color="#FFDD35"></stop><stop offset="100%" stop-color="#FFA800"></stop></linearGradient></defs><path fill="url(#IconifyId1813088fe1fbc01fb466)" d="M255.153 37.938L134.897 252.976c-2.483 4.44-8.862 4.466-11.382.048L.875 37.958c-2.746-4.814 1.371-10.646 6.827-9.67l120.385 21.517a6.537 6.537 0 0 0 2.322-.004l117.867-21.483c5.438-.991 9.574 4.796 6.877 9.62Z"></path><path fill="url(#IconifyId1813088fe1fbc01fb467)" d="M185.432.063L96.44 17.501a3.268 3.268 0 0 0-2.634 3.014l-5.474 92.456a3.268 3.268 0 0 0 3.997 3.378l24.777-5.718c2.318-.535 4.413 1.507 3.936 3.838l-7.361 36.047c-.495 2.426 1.782 4.5 4.151 3.78l15.304-4.649c2.372-.72 4.652 1.36 4.15 3.788l-11.698 56.621c-.732 3.542 3.979 5.473 5.943 2.437l1.313-2.028l72.516-144.72c1.215-2.423-.88-5.186-3.54-4.672l-25.505 4.922c-2.396.462-4.435-1.77-3.759-4.114l16.646-57.705c.677-2.35-1.37-4.583-3.769-4.113Z"></path></svg>
|
After Width: | Height: | Size: 1.5 KiB |
28
src/App.vue
Normal file
@@ -0,0 +1,28 @@
|
||||
<template>
|
||||
<Video/>
|
||||
<Navbar/>
|
||||
<About/>
|
||||
<Airplane/>
|
||||
<Membership/>
|
||||
<Footer />
|
||||
</template>
|
||||
<script>
|
||||
import {defineComponent} from "vue";
|
||||
import Navbar from "./components/Navbar.vue";
|
||||
import Video from "./components/Video.vue";
|
||||
import About from "./components/About.vue";
|
||||
import Airplane from "./components/Airplane.vue";
|
||||
import Membership from "./components/Membership.vue";
|
||||
import Footer from "./components/Footer.vue";
|
||||
|
||||
export default defineComponent({
|
||||
components: {Footer, Membership, Airplane, About, Video, Navbar},
|
||||
mounted() {
|
||||
setTimeout(() => {
|
||||
window.$('#preloader').hide()
|
||||
window.$('.page-wrapper').show()
|
||||
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
</script>
|
1
src/assets/vue.svg
Normal file
@@ -0,0 +1 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" aria-hidden="true" role="img" class="iconify iconify--logos" width="37.07" height="36" preserveAspectRatio="xMidYMid meet" viewBox="0 0 256 198"><path fill="#41B883" d="M204.8 0H256L128 220.8L0 0h97.92L128 51.2L157.44 0h47.36Z"></path><path fill="#41B883" d="m0 0l128 220.8L256 0h-51.2L128 132.48L50.56 0H0Z"></path><path fill="#35495E" d="M50.56 0L128 133.12L204.8 0h-47.36L128 51.2L97.92 0H50.56Z"></path></svg>
|
After Width: | Height: | Size: 496 B |
81
src/components/About.vue
Normal file
@@ -0,0 +1,81 @@
|
||||
<template>
|
||||
<section id="about" class="pt90 pb50 m-5">
|
||||
<div class="row">
|
||||
<div class="col-md-6 mb40">
|
||||
<div class="section-title title-left mb40 text-left">
|
||||
<span class="section-subTitle">who we are</span>
|
||||
<p class='lead'>A high performance, low cost, flying flub for the Beechcraft Bonanza and its
|
||||
variants, located at Frederick Municipal Airport in Frederick, Maryland. The club is
|
||||
formed
|
||||
to provide its members with cost effective access and ownership to aircraft they want to
|
||||
fly.
|
||||
</p>
|
||||
<p v-if="!membershipsAvailable">
|
||||
Beech Aero Club of Frederick membership has no open positions at this time, but we are
|
||||
accepting
|
||||
potential member applications for the waitlist.
|
||||
</p>
|
||||
<p v-else>
|
||||
Beech Aero Club of Frederick <b>has</b> membership positions at this time! Please
|
||||
contact us for more information!
|
||||
</p>
|
||||
<p>
|
||||
As a club member you will fly a complex high-performance Beechcraft Debonair. The
|
||||
purpose of
|
||||
the club is to provide aircraft for local and cross-country travel by its members, as
|
||||
well
|
||||
as create an environment where a group of like-minded individuals can socialize and
|
||||
share
|
||||
their passion for flying.
|
||||
</p>
|
||||
<p>
|
||||
If you are interested in becoming a member of our club, or a member in a similar club in
|
||||
another area, please send a message with your interest for more information.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 mb40">
|
||||
<ContactUs />
|
||||
</div>
|
||||
<div class='row'>
|
||||
<div class='col-md-4 mb40'>
|
||||
<img src='https://i.siteworxpro.com/MgGDS08hwJxBR783-LU33bpCIn_-AGQgdhjYKQP19b8/rs:fill:600:390/czM6Ly9pbWFnZXMuc2l0ZXdvcnhwcm8uY29tL0dYc1ZZLnBuZw' alt=''
|
||||
class='img-fluid center-img shadow-card mb30'>
|
||||
<h5 class='text-uppercase'>LED Lighting</h5>
|
||||
<p>
|
||||
All aircraft lighting has been upgraded with LED lighting, including the landing light,
|
||||
beacon, navigation and strobe lights.
|
||||
</p>
|
||||
</div>
|
||||
<div class='col-md-4 mb40'>
|
||||
<img src='https://i.siteworxpro.com/9EUkRWShsUQ4lEc-jAbWY_AQGRPyjvRbh-1aao8J9Jk/rs:fill:600:390/czM6Ly9pbWFnZXMuc2l0ZXdvcnhwcm8uY29tLzBhQkJzLmpwZw' alt=''
|
||||
class='img-fluid center-img shadow-card mb30'>
|
||||
<h5 class='text-uppercase'>upgraded avionics</h5>
|
||||
<p>
|
||||
Upgraded avionics featuring an Aspen EFD1000 Pro. Transponder is also upgraded with
|
||||
ADS-B out and is 2020 compliant!
|
||||
</p>
|
||||
</div>
|
||||
<div class='col-md-4 mb40'>
|
||||
<img src='https://i.siteworxpro.com/5oc6HNDtE_-b8Lj6VdgjSEfMlCx6hucPlyn3vMhOQpI/rs:fill:600:390/czM6Ly9pbWFnZXMuc2l0ZXdvcnhwcm8uY29tL2o5WnNqLnBuZw' alt=''
|
||||
class='img-fluid center-img shadow-card mb30'>
|
||||
<h5 class='text-uppercase'>New Interior and Exterior</h5>
|
||||
<p>
|
||||
Looks like a brand new aircraft! New leather interior was installed in 2015. Painted in
|
||||
2008 and still has a like new condition.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section><!--section end about-->
|
||||
</template>
|
||||
<script>
|
||||
import ContactUs from "./Contact-Us.vue";
|
||||
|
||||
export default {
|
||||
components: {ContactUs},
|
||||
data: () => ({
|
||||
membershipsAvailable: false
|
||||
})
|
||||
}
|
||||
</script>
|
52
src/components/Airplane.vue
Normal file
@@ -0,0 +1,52 @@
|
||||
<template>
|
||||
<div class="cta bg-dark pt90 angle-top mt70 pb60" id="airplane">
|
||||
<div class="container">
|
||||
<div class="row align-items-center">
|
||||
<div class="col-md-6">
|
||||
<div class="wow fadeInLeft mb30" data-wow-delay=".1s">
|
||||
<img src="https://i.siteworxpro.com/9PH661tMSb7cJvJBnzZkpEI9xxX6jwuc-jE-Rznt6Dw/rs:fill:600:390/czM6Ly9pbWFnZXMuc2l0ZXdvcnhwcm8uY29tL3UxQTdYLnBuZw" alt="" class="img-fluid">
|
||||
</div>
|
||||
<div class="wow fadeInLeft mb30" data-wow-delay=".2s">
|
||||
<img src="https://i.siteworxpro.com/o62a1kvzhRhsRk9_MrWe_C-VVtDbZFUYHgz_GbW5e1s/rs:fill:600:390/czM6Ly9pbWFnZXMuc2l0ZXdvcnhwcm8uY29tL3BiT1lvLnBuZw" alt="" class="img-fluid">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-6 pb40">
|
||||
<h2 class="text-white font300 mb20">1963 Beechcraft Debonair 35-B33</h2>
|
||||
<p class="lead text-white-gray">
|
||||
75% Power @ 8,000 feet 13 gph 157 Knots<br>
|
||||
80 gallons fuel / 74 useable<br>
|
||||
Useful Load 1081 pounds<br>
|
||||
</p>
|
||||
<h5 class="h5 text-white">Engine</h5>
|
||||
<p>
|
||||
<b>Fresh Overhauled</b> IO-470K @ 225 hp<br>
|
||||
Airframe 4810 Total Time<br>
|
||||
</p>
|
||||
<h5 class="h5 text-white">Avionics</h5>
|
||||
<p>
|
||||
PMA6000B Audio Panel<br>
|
||||
Garmin 430W Nav/Com1 GPS<br>
|
||||
Narco 12D Nav/Com2<br>
|
||||
<b>NEW</b> JPI EDM 830 Engine Monitor<br>
|
||||
Bendix King KT74 Transponder - ADS-B Out<br>
|
||||
ASPEN EFD1000 Pro<br>
|
||||
BF Goodrich WX-900 Stormscope<br>
|
||||
STEC 40 Autopilot Coupled to ASPEN (GPSS)<br>
|
||||
ACK Model E-04 406MHz ELT<br>
|
||||
</p>
|
||||
<h5 class="h5 text-white">Other Equipment</h5>
|
||||
<p>
|
||||
BAS Shoulder Harness<br>
|
||||
New Side Glass 2015<br>
|
||||
Dual Ram’s Horn Yokes<br>
|
||||
LED Navigation and Recognition Lighting<br>
|
||||
Four Place Wired for Ship Powered Headsets
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {}
|
||||
</script>
|
132
src/components/Contact-Us.vue
Normal file
@@ -0,0 +1,132 @@
|
||||
<template>
|
||||
<div id="contact_form" v-if="!success">
|
||||
<span class="section-subTitle">please contact us</span>
|
||||
<label class="sr-only" for="name">name</label>
|
||||
<div class="input-group mb-2 mr-sm-2">
|
||||
<div class="input-group-prepend">
|
||||
<div class="input-group-text"><i class="far fa-user"></i></div>
|
||||
</div>
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
id="name"
|
||||
:class="validation && nameValid ? 'error': ''"
|
||||
placeholder="name"
|
||||
v-model="formData.name"
|
||||
>
|
||||
</div>
|
||||
|
||||
<label class="sr-only" for="email">email</label>
|
||||
<div class="input-group mb-2 mr-sm-2">
|
||||
<div class="input-group-prepend">
|
||||
<div class="input-group-text">@</div>
|
||||
</div>
|
||||
<input type="text"
|
||||
class="form-control"
|
||||
:class="validation && emailValid ? 'error': ''"
|
||||
id="email"
|
||||
placeholder="email"
|
||||
v-model="formData.email"
|
||||
>
|
||||
</div>
|
||||
|
||||
<label class="sr-only" for="phone">phone</label>
|
||||
<div class="input-group mb-2 mr-sm-2">
|
||||
<div class="input-group-prepend">
|
||||
<div class="input-group-text"><i class="fas fa-phone"></i></div>
|
||||
</div>
|
||||
<input maxlength="12" type="text"
|
||||
class="form-control" id="phone" placeholder="phone" v-model="formData.phone">
|
||||
</div>
|
||||
|
||||
<label class="sr-only" for="message">message</label>
|
||||
<div class="input-group mb-2 mr-sm-2">
|
||||
<div class="input-group-prepend">
|
||||
<div class="input-group-text"><i class="far fa-comment"></i></div>
|
||||
</div>
|
||||
<textarea type="text" class="form-control" id="message" placeholder="message"
|
||||
v-model="formData.message"></textarea>
|
||||
</div>
|
||||
|
||||
<div style="margin-bottom: 10px;">
|
||||
If you would like to know more about the club please fill out the contact form below.
|
||||
Let us know a little bit about yourself, and your interest. We will get back to you by
|
||||
email or phone.
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button class="btn btn-lg btn-primary"
|
||||
:class="loading ? 'disabled' : ''"
|
||||
:disabled="loading"
|
||||
@click="sendRequest()"
|
||||
v-html="btnTxt"
|
||||
>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div id="contact_success" v-else class="text-center">
|
||||
<h1>Request Sent!</h1>
|
||||
<h4>
|
||||
<i class="fas fa-check fa-5x text-success"></i>
|
||||
</h4>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import axios from 'axios'
|
||||
export default {
|
||||
data: () => ({
|
||||
loading: false,
|
||||
success: false,
|
||||
validation: false,
|
||||
formData: {
|
||||
name: '',
|
||||
email: '',
|
||||
phone: '',
|
||||
message: ''
|
||||
}
|
||||
}),
|
||||
computed: {
|
||||
btnTxt() {
|
||||
if (this.loading) {
|
||||
return '<i class="fa-solid fa-gear fa-spin"></i>'
|
||||
}
|
||||
return '<i class="far fa-envelope"></i> Send'
|
||||
},
|
||||
nameValid() {
|
||||
return this.formData.name === ''
|
||||
},
|
||||
emailValid() {
|
||||
return !String(this.formData.email)
|
||||
.toLowerCase()
|
||||
.match(
|
||||
/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|.(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
|
||||
)
|
||||
},
|
||||
|
||||
isValid() {
|
||||
return !this.nameValid && !this.emailValid
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
sendRequest() {
|
||||
this.validation = true
|
||||
if (!this.isValid) {
|
||||
return
|
||||
}
|
||||
this.loading = true
|
||||
axios.post(import.meta.env.VITE_API_URL + '/email-request', this.formData)
|
||||
.then(() => {
|
||||
this.success = true
|
||||
})
|
||||
.finally(() => {
|
||||
this.loading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
.disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
</style>
|
38
src/components/Footer.vue
Normal file
@@ -0,0 +1,38 @@
|
||||
<template>
|
||||
<footer class='footer'>
|
||||
<div class='container'>
|
||||
<div class='row'>
|
||||
<div class='col-md-6'>
|
||||
<div class='clearfix socials'>
|
||||
<a href="https://www.facebook.com/BACFrederick/" target="_blank"
|
||||
class="social-icon si-border si-facebook">
|
||||
<i class="fab fa-facebook-f" style="color: black"></i>
|
||||
</a>
|
||||
<a href="https://twitter.com/BeechAero" target="_blank"
|
||||
class="social-icon si-border si-twitter">
|
||||
<i class="fab fa-twitter"></i>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class='col-md-6 text-md-right text-center'>
|
||||
<span>Content <i class="far fa-copyright"></i> {{ year }} Beech Aero Club of Frederick</span><br>
|
||||
<span>Web Hosting and Design <i
|
||||
class="far fa-copyright"></i> {{ year }} Siteworx Professionals, LLC</span><br>
|
||||
<span>Build {{ build }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
computed: {
|
||||
build() {
|
||||
return import.meta.env.VITE_BUILD ?? 'Development'
|
||||
},
|
||||
year() {
|
||||
return (new Date()).getUTCFullYear()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
77
src/components/Membership.vue
Normal file
@@ -0,0 +1,77 @@
|
||||
<template>
|
||||
<section id="membership" class="bg-faded pt90 pb50">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-6 ml-auto mr-auto text-center mb30">
|
||||
<div class="section-title">
|
||||
<span class="section-subTitle">Ready to Join?</span>
|
||||
<h3 class="mb0">Membership</h3>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row" style="margin-bottom: 20px;">
|
||||
<div class="col text-center mb-3">
|
||||
<h4 v-if="!membershipsAvailable">
|
||||
While there are no open memberships at this time, please contact us to join our
|
||||
wait-list.
|
||||
</h4>
|
||||
<h4 v-else>
|
||||
Memberships are available! Contact us today to find out more!
|
||||
</h4>
|
||||
<a class="btn btn-dark" data-scroll href="#about">Contact us</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-6">
|
||||
<h4>Monthly Dues based on number of members</h4>
|
||||
<h5>${{ costPerMonth }} Per Month</h5>
|
||||
<p>
|
||||
With 5 Members monthly fixed costs are ${{ costPerMonth }} per month. This covers all fixed costs including
|
||||
insurance, hangar and database fees.
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<h4>Hourly Rate to Fly</h4>
|
||||
<h5>only ${{ perHour }} Per Hour Dry</h5>
|
||||
<p>
|
||||
The cost to fly is ${{ perHour }}/hr billed from the tach at a dry rate.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-4">
|
||||
<h4>Minimum Pilot Requirements</h4>
|
||||
<p>
|
||||
Private Pilot Certificate SEL<br>
|
||||
with an Instrument Rating<br>
|
||||
A Minimum Amount Retract Time Required<br>
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<h4>Beechcraft Flying Club Information</h4>
|
||||
<p>
|
||||
BAC of Frederick is a Flying Club of 5 members, each having equal access to a
|
||||
high-performance aircraft for local and cross country flying. We invite potential members to
|
||||
request more information and apply for one of our open positions.
|
||||
</p>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<h4>Beechcraft Flying Club Information</h4>
|
||||
<p>
|
||||
The club is formed as an equity club. In an equity club each member buys a share of the club
|
||||
including the aircraft and all other assets, the buy-in can be financed through the club.
|
||||
Contact us for more information on how this works. </p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data: () => ({
|
||||
membershipsAvailable: false,
|
||||
costPerMonth: 350,
|
||||
perHour: 125
|
||||
})
|
||||
}
|
||||
</script>
|
62
src/components/Navbar.vue
Normal file
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<nav class="navbar navbar-expand-lg navbar-light bg-white sticky-nav" :class="stuck ? 'is-stuck' : ''">
|
||||
<div class="container">
|
||||
<button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse"
|
||||
data-target="#navbarsspy" aria-controls="navbarsspy" aria-expanded="false"
|
||||
aria-label="Toggle navigation">
|
||||
<span class="navbar-toggler-icon"></span>
|
||||
</button>
|
||||
<a class="navbar-brand" data-scroll href="#home">
|
||||
<img class="img-fluid" src="https://i.siteworxpro.com/VnRbpfvE4AodnHHrq0-DmmbDJwxUwrl9cJZIIdUv8uk/h:50/czM6Ly9pbWFnZXMuc2l0ZXdvcnhwcm8uY29tL0xVQm0wLnBuZw" alt=""></a>
|
||||
|
||||
<div class="collapse navbar-collapse" id="navbarsspy">
|
||||
<ul class="navbar-nav ml-auto">
|
||||
<li class="nav-item"><a data-scroll class="nav-link active" href="#home">home</a></li>
|
||||
<li class="nav-item"><a data-scroll class="nav-link" href="#about">About</a></li>
|
||||
<li class="nav-item"><a data-scroll class="nav-link" href="#airplane">The Airplane</a></li>
|
||||
<li class="nav-item"><a data-scroll class="nav-link" href="#membership">Membership</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import {defineComponent} from "vue";
|
||||
|
||||
export default defineComponent({
|
||||
data: () => ({
|
||||
stuck: false
|
||||
}),
|
||||
mounted() {
|
||||
window.addEventListener('scroll', () => {
|
||||
const height = $('#home').height()
|
||||
const scroll = window.scrollY
|
||||
|
||||
if (!height) {
|
||||
return
|
||||
}
|
||||
|
||||
const dist = scroll - height
|
||||
this.stuck = dist > 0
|
||||
})
|
||||
},
|
||||
watch: {
|
||||
stuck: (val) => {
|
||||
if (val) {
|
||||
$('body').css('margin-top', '69px')
|
||||
} else {
|
||||
$('body').css('margin-top', '0')
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<style scoped>
|
||||
.is-stuck {
|
||||
transition: box-shadow 500ms;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
box-shadow: 0 5px 15px #9a9a9a;
|
||||
}
|
||||
</style>
|
40
src/components/Video.vue
Normal file
@@ -0,0 +1,40 @@
|
||||
<template>
|
||||
<section id="home" class="bg-parallax fullscreen parallax-overlay"
|
||||
style="height: 100vh;"
|
||||
>
|
||||
<video
|
||||
autoplay
|
||||
muted
|
||||
style="z-index: 0; position: relative; top: 0; height: 100%; width: 100%; object-fit: cover;"
|
||||
>
|
||||
<source src="/video/27128760_492610754487667_4824731412490851473_n.mp4" type="video/mp4" />
|
||||
<source src="/video/27128760_492610754487667_4824731412490851473_n.webm" type="video/webm" />
|
||||
</video>
|
||||
<div class="content-table" style="z-index: 1; position: absolute; top: 0;">
|
||||
<div class="content-middle pt80 ">
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-lg-12 col-md-12 ml-auto mr-auto text-center">
|
||||
<h2 class="hero-big-text text-white">
|
||||
<img src="/images/logo_white.png" class="img-fluid" alt="logo">
|
||||
</h2>
|
||||
<p class="lead text-white-gray">
|
||||
Affordable Flying for Beechcraft Enthusiasts
|
||||
</p>
|
||||
<div class="circle-button">
|
||||
<a href="#about" data-scroll class="btn btn-white-outline btn-lg btn-rounded">Learn
|
||||
More</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mouse-down"><a data-scroll href="#about"><i class="fa fa-angle-down fa-3x"></i></a></div>
|
||||
</section>
|
||||
</template>
|
||||
<script lang="ts">
|
||||
import {defineComponent} from "vue";
|
||||
|
||||
export default defineComponent({})
|
||||
</script>
|
13
src/main.ts
Normal file
@@ -0,0 +1,13 @@
|
||||
import { createApp } from 'vue'
|
||||
import './styles/style.scss'
|
||||
import App from './App.vue'
|
||||
|
||||
import $ from 'jquery';
|
||||
//@ts-ignore
|
||||
window.jQuery = $;
|
||||
//@ts-ignore
|
||||
window.$ = $;
|
||||
|
||||
let app = createApp(App)
|
||||
|
||||
app.mount('#app')
|
80
src/style.css
Normal file
@@ -0,0 +1,80 @@
|
||||
:root {
|
||||
font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
|
||||
line-height: 1.5;
|
||||
font-weight: 400;
|
||||
|
||||
color-scheme: light dark;
|
||||
color: rgba(255, 255, 255, 0.87);
|
||||
background-color: #242424;
|
||||
|
||||
font-synthesis: none;
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
-webkit-text-size-adjust: 100%;
|
||||
}
|
||||
|
||||
a {
|
||||
font-weight: 500;
|
||||
color: #646cff;
|
||||
text-decoration: inherit;
|
||||
}
|
||||
a:hover {
|
||||
color: #535bf2;
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
display: flex;
|
||||
place-items: center;
|
||||
min-width: 320px;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: 3.2em;
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
button {
|
||||
border-radius: 8px;
|
||||
border: 1px solid transparent;
|
||||
padding: 0.6em 1.2em;
|
||||
font-size: 1em;
|
||||
font-weight: 500;
|
||||
font-family: inherit;
|
||||
background-color: #1a1a1a;
|
||||
cursor: pointer;
|
||||
transition: border-color 0.25s;
|
||||
}
|
||||
button:hover {
|
||||
border-color: #646cff;
|
||||
}
|
||||
button:focus,
|
||||
button:focus-visible {
|
||||
outline: 4px auto -webkit-focus-ring-color;
|
||||
}
|
||||
|
||||
.card {
|
||||
padding: 2em;
|
||||
}
|
||||
|
||||
#app {
|
||||
max-width: 1280px;
|
||||
margin: 0 auto;
|
||||
padding: 2rem;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: light) {
|
||||
:root {
|
||||
color: #213547;
|
||||
background-color: #ffffff;
|
||||
}
|
||||
a:hover {
|
||||
color: #747bff;
|
||||
}
|
||||
button {
|
||||
background-color: #f9f9f9;
|
||||
}
|
||||
}
|
572
src/styles/_base.scss
Executable file
@@ -0,0 +1,572 @@
|
||||
/*
|
||||
Basic of template
|
||||
*/
|
||||
html,body,.fullScreen{
|
||||
height: 100%;
|
||||
}
|
||||
body{
|
||||
font-size: 14px;
|
||||
font-weight: 400;
|
||||
color: #999;
|
||||
line-height: 1.6;
|
||||
letter-spacing: 0em;
|
||||
font-family: $base-font;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
button, input, optgroup, select, textarea{
|
||||
font-family: $base-font;
|
||||
}
|
||||
button{
|
||||
&:focus{
|
||||
outline: 0!important;
|
||||
}
|
||||
}
|
||||
a,.simple-hover img,button,.btn{
|
||||
transition: all 0.3s;
|
||||
-webkit-transition: all 0.3s;
|
||||
}
|
||||
a{
|
||||
color:$primary-color;
|
||||
text-decoration:none;
|
||||
&:hover,&:focus{
|
||||
text-decoration: none;
|
||||
outline: 0!important;
|
||||
color:#666;
|
||||
}
|
||||
}
|
||||
.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
|
||||
margin-bottom: .5rem;
|
||||
font-family: $base-font;
|
||||
font-weight: 400;
|
||||
line-height: 1.3;
|
||||
color: #111;
|
||||
}
|
||||
h4,.h4{
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
h5,.h5{
|
||||
font-size: 1rem;
|
||||
}
|
||||
hr {
|
||||
margin-top: 1rem;
|
||||
border: 0;
|
||||
border-top: 1px solid rgba(0,0,0,.1)
|
||||
}
|
||||
|
||||
.small,small {
|
||||
font-size: 80%;
|
||||
font-weight: 400
|
||||
}
|
||||
ul, ol{
|
||||
margin: 0 0 1.5em 0;
|
||||
}
|
||||
.tritary-font{
|
||||
font-family:$styled-font;
|
||||
font-weight:400;
|
||||
font-style: italic;
|
||||
}
|
||||
.base-font{
|
||||
font-family: $base-font;
|
||||
font-weight: 400;
|
||||
}
|
||||
.font300{
|
||||
font-weight: 300!important;
|
||||
}
|
||||
.font400{
|
||||
font-weight: 400!important;
|
||||
}
|
||||
.font500{
|
||||
font-weight: 500!important;
|
||||
}
|
||||
.font700{
|
||||
font-weight: 700!important;
|
||||
}
|
||||
.font900{
|
||||
font-weight: 700!important;
|
||||
}
|
||||
|
||||
.label{
|
||||
display: inline-block;
|
||||
padding: 1px 7px;
|
||||
border-radius: 2px;
|
||||
font-size:10px;
|
||||
}
|
||||
.bg-faded{
|
||||
background:#F9F9F9;
|
||||
}
|
||||
.badge-primary{
|
||||
background: $primary-color!important;
|
||||
}
|
||||
.bg-primary{
|
||||
background: $primary-color!important;
|
||||
border-color:$primary-color;
|
||||
}
|
||||
.bg-success{
|
||||
background: $success-color!important;
|
||||
border-color:$success-color;
|
||||
}
|
||||
.bg-warning{
|
||||
background: $warning-color;
|
||||
border-color:$warning-color;
|
||||
}
|
||||
.bg-info{
|
||||
background-color: $info-color;
|
||||
border-color:$info-color;
|
||||
}
|
||||
.bg-danger{
|
||||
background-color: $danger-color;
|
||||
border-color:$danger-color;
|
||||
}
|
||||
.bg-dark{
|
||||
border-color:$dark-color;
|
||||
background-color:$dark-color!important;
|
||||
}
|
||||
.bg-white{
|
||||
background: #fff;
|
||||
}
|
||||
.text-primary{
|
||||
color: $primary-color!important;
|
||||
}
|
||||
.text-danger{
|
||||
color: $danger-color!important;
|
||||
}
|
||||
.text-success{
|
||||
color: $success-color!important;
|
||||
}
|
||||
.text-warning{
|
||||
color: $warning-color!important;
|
||||
}
|
||||
.text-info{
|
||||
color: $info-color!important;
|
||||
}
|
||||
.text-white{
|
||||
color:rgba(#fff,1)!important;
|
||||
}
|
||||
.text-dark{
|
||||
color:rgba(#222,1)!important;
|
||||
}
|
||||
.text-white-gray{
|
||||
color:rgba(#fff,.8)!important;
|
||||
}
|
||||
.border-round{
|
||||
border-radius: 6px;
|
||||
-webkit-border-radius: 6px;
|
||||
}
|
||||
.pos-relative{
|
||||
position:relative;
|
||||
}
|
||||
|
||||
.lead{
|
||||
font-weight: 300;
|
||||
}
|
||||
strong,b{
|
||||
font-weight: 700;
|
||||
}
|
||||
.fWidth{
|
||||
width: 100%!important;
|
||||
}
|
||||
.oHidden{
|
||||
overflow: hidden!important;;
|
||||
}
|
||||
strong,b{
|
||||
font-weight: 700;
|
||||
}
|
||||
.mr0{
|
||||
margin-right:0px!important;
|
||||
}
|
||||
.pt0{
|
||||
padding-top: 0!important;
|
||||
}
|
||||
.pt10{
|
||||
padding-top: 10px!important;;
|
||||
}
|
||||
.pt20{
|
||||
padding-top: 20px!important;;
|
||||
}
|
||||
.pt30{
|
||||
padding-top: 30px!important;;
|
||||
}
|
||||
.pt40{
|
||||
padding-top: 40px!important;;
|
||||
}
|
||||
.pt50{
|
||||
padding-top: 50px!important;;
|
||||
}
|
||||
.pt60{
|
||||
padding-top: 60px!important;;
|
||||
}
|
||||
.pt70{
|
||||
padding-top: 70px!important;;
|
||||
}
|
||||
.pt80{
|
||||
padding-top: 80px!important;;
|
||||
}
|
||||
.pt90{
|
||||
padding-top: 90px!important;;
|
||||
}
|
||||
.pt100{
|
||||
padding-top: 100px!important;;
|
||||
}
|
||||
.pb0{
|
||||
padding-bottom: 0!important;
|
||||
}
|
||||
.pb10{
|
||||
padding-bottom: 10px!important;
|
||||
}
|
||||
.pb15{
|
||||
padding-bottom: 15px!important;
|
||||
}
|
||||
.pb20{
|
||||
padding-bottom: 20px!important;
|
||||
}
|
||||
.pb30{
|
||||
padding-bottom: 30px!important;
|
||||
}
|
||||
.pb40{
|
||||
padding-bottom: 40px!important;
|
||||
}
|
||||
.pb50{
|
||||
padding-bottom: 50px!important;
|
||||
}
|
||||
.pb60{
|
||||
padding-bottom: 60px!important;
|
||||
}
|
||||
.pb70{
|
||||
padding-bottom: 70px!important;
|
||||
}
|
||||
.pb80{
|
||||
padding-bottom: 80px!important;
|
||||
}
|
||||
.pb90{
|
||||
padding-bottom: 90px!important;
|
||||
}
|
||||
.pb100{
|
||||
padding-bottom: 100px!important;
|
||||
}
|
||||
.mb0{
|
||||
margin-bottom: 0!important;
|
||||
}
|
||||
.mb5{
|
||||
margin-bottom: 5px!important;
|
||||
}
|
||||
.mb10{
|
||||
margin-bottom: 10px!important;
|
||||
}
|
||||
.mb20{
|
||||
margin-bottom: 20px!important;
|
||||
}
|
||||
.mb30{
|
||||
margin-bottom: 30px!important;
|
||||
}
|
||||
.mb40{
|
||||
margin-bottom: 40px!important;
|
||||
}
|
||||
.mb50{
|
||||
margin-bottom: 50px!important;
|
||||
}
|
||||
.mb60{
|
||||
margin-bottom: 60px!important;
|
||||
}
|
||||
.mb70{
|
||||
margin-bottom: 70px!important;
|
||||
}
|
||||
.mb80{
|
||||
margin-bottom: 80px!important;
|
||||
}
|
||||
.mb90{
|
||||
margin-bottom: 90px!important;
|
||||
}
|
||||
.mb100{
|
||||
margin-bottom: 100px!important;
|
||||
}
|
||||
.mt5{
|
||||
margin-top:5px!important;
|
||||
}
|
||||
.mt10{
|
||||
margin-top:10px!important;
|
||||
}
|
||||
.mt20{
|
||||
margin-top:20px!important;
|
||||
}
|
||||
.mt30{
|
||||
margin-top:30px!important;
|
||||
}
|
||||
.mt40{
|
||||
margin-top:40px!important;
|
||||
}
|
||||
.mt50{
|
||||
margin-top:50px!important;
|
||||
}
|
||||
.mt60{
|
||||
margin-top:60px!important;
|
||||
}
|
||||
.mt70{
|
||||
margin-top:70px!important;
|
||||
}
|
||||
.mt80{
|
||||
margin-top:80px!important;
|
||||
}
|
||||
.mt90{
|
||||
margin-top:90px!important;
|
||||
}
|
||||
.mt100{
|
||||
margin-top:100px!important;
|
||||
}
|
||||
.bg-default{
|
||||
background-color: $default-color!important;
|
||||
}
|
||||
.bg-gray{
|
||||
background-color: #fbfbfb;
|
||||
}
|
||||
.pd-card{
|
||||
padding: 40px 20px;
|
||||
}
|
||||
|
||||
.back-to-top{
|
||||
position: fixed;
|
||||
display: block;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border-radius: 50%;
|
||||
-webkit-border-radius: 50%;
|
||||
bottom: 10px;
|
||||
left:10px;
|
||||
background: #f5f5f5;
|
||||
color: #333;
|
||||
line-height: 50px;
|
||||
opacity:0;
|
||||
visibility: hidden;
|
||||
z-index:9;
|
||||
-webkit-transition: -webkit-transform 0.2s ease-out;
|
||||
-moz-transition: -moz-transform 0.2s ease-out;
|
||||
transition: transform 0.2s ease-out;
|
||||
transform: translate3d(0,15px, 0);
|
||||
-webkit-transform: translate3d(0,15px, 0);
|
||||
i{
|
||||
display: block;
|
||||
font-size: 25px;
|
||||
line-height: 50px;
|
||||
text-align: center;
|
||||
}
|
||||
&:hover{
|
||||
box-shadow: 0px 3px 20px rgba(0,0,0,0.2);
|
||||
color:#333;
|
||||
}
|
||||
&.show{
|
||||
opacity:1;
|
||||
visibility: visible;
|
||||
transform: translate3d(0, 0px, 0);
|
||||
-webkit-transform: translate3d(0, 0px, 0);
|
||||
}
|
||||
}
|
||||
|
||||
/**preloader**/
|
||||
.loader,
|
||||
.loader:before,
|
||||
.loader:after {
|
||||
border-radius: 50%;
|
||||
width: 2.5em;
|
||||
height: 2.5em;
|
||||
-webkit-animation-fill-mode: both;
|
||||
animation-fill-mode: both;
|
||||
-webkit-animation: load7 1.8s infinite ease-in-out;
|
||||
animation: load7 1.8s infinite ease-in-out;
|
||||
}
|
||||
.no-margin{
|
||||
margin: 0!important;
|
||||
}
|
||||
.no-padding{
|
||||
padding-left:0!important;
|
||||
padding-right:0!important;
|
||||
}
|
||||
.content-table{
|
||||
display:table;
|
||||
width:100%;
|
||||
height:100%;
|
||||
.content-middle{
|
||||
display:table-cell;
|
||||
vertical-align: middle;
|
||||
width:100%;
|
||||
}
|
||||
.content-bottom{
|
||||
display:table-cell;
|
||||
vertical-align: bottom;
|
||||
width:100%;
|
||||
}
|
||||
}
|
||||
.section-title{
|
||||
padding-bottom:0px;
|
||||
position:relative;
|
||||
h3{
|
||||
font-size: 2.5rem;
|
||||
letter-spacing: -3px;
|
||||
position: relative;
|
||||
padding-top: 20px;
|
||||
text-transform:capitalize;
|
||||
font-weight:800;
|
||||
&:before{
|
||||
content: "";
|
||||
width:40px;
|
||||
height:5px;
|
||||
position: absolute;
|
||||
top:0;
|
||||
left:50%;
|
||||
background-color: $primary-color;
|
||||
margin-left:-20px;
|
||||
}
|
||||
}
|
||||
&.title-left{
|
||||
h3{
|
||||
&:before{
|
||||
left:0;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.section-subTitle{
|
||||
color:#666;
|
||||
font-size:.89rem;
|
||||
text-transform: uppercase;
|
||||
display:block;
|
||||
margin-bottom: 15px;
|
||||
font-weight: 400;
|
||||
}
|
||||
.center-img{
|
||||
display:block;
|
||||
margin:0 auto;
|
||||
}
|
||||
.shadow-card{
|
||||
box-shadow: 0px 0px 28px rgba(0,0,0,0.1);
|
||||
border-radius:5px;
|
||||
}
|
||||
|
||||
/***angle style**/
|
||||
.angle-top,.angle-bottom{
|
||||
overflow: visible;
|
||||
position:relative;
|
||||
|
||||
}
|
||||
.angle-top{
|
||||
&:before{
|
||||
background: none repeat scroll 0 0 #fff;
|
||||
content: "";
|
||||
margin-top: -149px;
|
||||
min-height: 100px;
|
||||
position: absolute;
|
||||
-webkit-transform: skewY(-2deg);
|
||||
-moz-transform: skewY(-2deg);
|
||||
-ms-transform: skewY(-2deg);
|
||||
-o-transform: skewY(-2deg);
|
||||
transform: skewY(-2deg);
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
&.bg-dark:before{
|
||||
background-color: $dark-color;
|
||||
}
|
||||
&.bg-primary:before{
|
||||
background-color: $primary-color;
|
||||
}
|
||||
&.bg-info:before{
|
||||
background-color: $info-color;
|
||||
}
|
||||
&.bg-success:before{
|
||||
background-color: $success-color;
|
||||
}
|
||||
&.bg-warning:before{
|
||||
background-color: $warning-color;
|
||||
}
|
||||
&.bg-white:before{
|
||||
background-color: #fff;
|
||||
}
|
||||
}
|
||||
.bg-parallax{
|
||||
background-attachment: fixed;
|
||||
background-position: center center;
|
||||
position:relative;
|
||||
overflow: hidden;
|
||||
}
|
||||
.parallax-overlay{
|
||||
&:after{
|
||||
content: "";
|
||||
width:100%;
|
||||
height:100%;
|
||||
position: absolute;
|
||||
z-index: 0;
|
||||
background-color: rgba(0,0,0,0.5);
|
||||
left:0;
|
||||
top:0;
|
||||
}
|
||||
.container{
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
&.overlay-primary{
|
||||
&:after{
|
||||
background-color:rgba($primary-color,0.75);
|
||||
}
|
||||
}
|
||||
}
|
||||
/*
|
||||
Responsive Utilites Style (This css is removed from beta version)
|
||||
*/
|
||||
.hidden-xs-up {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 575px) {
|
||||
.hidden-xs-down {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 576px) {
|
||||
.hidden-sm-up {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.hidden-sm-down {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 768px) {
|
||||
.hidden-md-up {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 991px) {
|
||||
.hidden-md-down {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.hidden-lg-up {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 1199px) {
|
||||
.hidden-lg-down {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 1200px) {
|
||||
.hidden-xl-up {
|
||||
display: none !important;
|
||||
}
|
||||
}
|
||||
|
||||
.hidden-xl-down {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.visible-print-block {
|
||||
display: none !important;
|
||||
}
|
536
src/styles/_buttons.scss
Executable file
@@ -0,0 +1,536 @@
|
||||
/*
|
||||
Buttons
|
||||
*/
|
||||
.form-control-lg, .input-group-lg>.form-control, .input-group-lg>.input-group-addon, .input-group-lg>.input-group-btn>.btn{
|
||||
font-size:.8rem;
|
||||
}
|
||||
.btn,.button{
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
z-index:1;
|
||||
border-radius:2px;
|
||||
cursor:pointer;
|
||||
font-weight:600!important;
|
||||
letter-spacing: 0px;
|
||||
font-size:.8rem;
|
||||
font-family:$base-font;
|
||||
padding:10px 30px 10px!important;
|
||||
text-transform:uppercase;
|
||||
i{
|
||||
display: inline-block;
|
||||
margin-right:8px;
|
||||
}
|
||||
&.btn-rounded{
|
||||
border-radius:100px;
|
||||
}
|
||||
&:before{
|
||||
content:"";
|
||||
position:absolute;
|
||||
left:0;
|
||||
top:0;
|
||||
width:0%;
|
||||
height:100%;
|
||||
z-index: -1;
|
||||
transition: all .3s;
|
||||
}
|
||||
&:hover,&:focus{
|
||||
box-shadow:none;
|
||||
outline:0!important;
|
||||
&:before{
|
||||
transition: all .3s;
|
||||
z-index: -1;
|
||||
}
|
||||
}
|
||||
&.btn-link{
|
||||
border:0px;
|
||||
padding:0px!important;
|
||||
}
|
||||
&.btn-sm{
|
||||
padding:9px 15px 9px!important;
|
||||
font-size:.6rem;
|
||||
}
|
||||
&.btn-lg{
|
||||
padding:14px 40px 14px!important;
|
||||
font-size:.95rem;
|
||||
}
|
||||
&.btn-link{
|
||||
color:$primary-color;
|
||||
text-transform:capitalize;
|
||||
&:after{
|
||||
font-family: 'FontAwesome';
|
||||
content: "\f101";
|
||||
margin-left:5px;
|
||||
font-size:12px;
|
||||
}
|
||||
&:hover{
|
||||
text-decoration:none;
|
||||
color:#999;
|
||||
}
|
||||
}
|
||||
}
|
||||
.btn-white{
|
||||
background-color:#fff;
|
||||
color:#333;
|
||||
}
|
||||
.btn-white-outline{
|
||||
border:2px solid #fff;
|
||||
background-color:transparent;
|
||||
color:#fff;
|
||||
&:hover,&:focus{
|
||||
&:before{
|
||||
width:100%;
|
||||
background-color:#fff;
|
||||
}
|
||||
color:#333;
|
||||
border-color:#fff;
|
||||
}
|
||||
}
|
||||
.btn-outline-primary{
|
||||
border:2px solid $primary-color;
|
||||
background-color:transparent;
|
||||
color:$primary-color!important;
|
||||
&:hover,&:focus,&:active{
|
||||
&:before{
|
||||
width:100%;
|
||||
background-color:$primary-color;
|
||||
}
|
||||
color:#fff!important;;
|
||||
border-color:$primary-color;
|
||||
background-color:transparent;
|
||||
}
|
||||
}
|
||||
.btn-outline-info{
|
||||
border:2px solid $info-color;
|
||||
background-color:transparent;
|
||||
color:$info-color;
|
||||
&:hover,&:focus,&:active{
|
||||
&:before{
|
||||
width:100%;
|
||||
background-color:$info-color;
|
||||
}
|
||||
color:#fff;
|
||||
border-color:$info-color;
|
||||
background-color:transparent;
|
||||
}
|
||||
}
|
||||
.btn-outline-info{
|
||||
border:2px solid $info-color;
|
||||
background-color:transparent;
|
||||
color:$info-color;
|
||||
&:hover,&:focus,&:active{
|
||||
&:before{
|
||||
width:100%;
|
||||
background-color:$info-color;
|
||||
}
|
||||
color:#fff;
|
||||
border-color:$info-color;
|
||||
background-color:transparent;
|
||||
}
|
||||
}
|
||||
.btn-outline-success{
|
||||
border:2px solid $success-color;
|
||||
background-color:transparent;
|
||||
color:$success-color;
|
||||
&:hover,&:focus,&:active{
|
||||
&:before{
|
||||
width:100%;
|
||||
background-color:$success-color;
|
||||
}
|
||||
color:#fff;
|
||||
border-color:$success-color;
|
||||
background-color:transparent;
|
||||
}
|
||||
}
|
||||
.btn-outline-danger{
|
||||
border:2px solid $danger-color;
|
||||
background-color:transparent;
|
||||
color:$danger-color;
|
||||
&:hover,&:focus,&:active{
|
||||
&:before{
|
||||
width:100%;
|
||||
background-color:$danger-color;
|
||||
}
|
||||
color:#fff;
|
||||
border-color:$danger-color;
|
||||
background-color:transparent;
|
||||
}
|
||||
}
|
||||
.btn-outline-warning{
|
||||
border:2px solid $warning-color;
|
||||
background-color:transparent;
|
||||
color:$warning-color;
|
||||
&:hover,&:focus,&:active{
|
||||
&:before{
|
||||
width:100%;
|
||||
background-color:$warning-color;
|
||||
}
|
||||
color:#fff;
|
||||
border-color:$warning-color;
|
||||
background-color:transparent;
|
||||
}
|
||||
}
|
||||
.btn-outline-secondary{
|
||||
border:2px solid #ccc;
|
||||
background-color:transparent;
|
||||
color:#ccc;
|
||||
&:hover,&:focus,&:active{
|
||||
&:before{
|
||||
width:100%;
|
||||
background-color:#ccc;
|
||||
}
|
||||
color:#fff;
|
||||
border-color:#ccc;
|
||||
background-color:transparent;
|
||||
}
|
||||
}
|
||||
/**fill buttons**/
|
||||
.btn-primary,.btn-success,.btn-warning,.btn-danger,.btn-info,.btn-secondary,.btn-dark{
|
||||
box-shadow: 0 0.05em 0.1em rgba(0,0,0,0.18);
|
||||
border:0px;
|
||||
&:hover{
|
||||
border:0px;
|
||||
box-shadow: 0 0.05em 1em rgba(0,0,0,0.18);
|
||||
}
|
||||
}
|
||||
.btn-secondary{
|
||||
background: #f5f5f5;
|
||||
box-shadow:none;
|
||||
&:hover,&:focus,&:active{
|
||||
border:0px;
|
||||
color:#333;
|
||||
box-shadow:none;
|
||||
}
|
||||
}
|
||||
.btn-primary{
|
||||
background: $primary-color;
|
||||
color:#fff!important;
|
||||
&:hover,&:focus,&:active{
|
||||
background: $primary-color;
|
||||
color:#fff;
|
||||
}
|
||||
}
|
||||
.btn-dark{
|
||||
background: #222;
|
||||
color:#fff;
|
||||
&:hover,&:focus,&:active{
|
||||
background: #222;
|
||||
color:#fff;
|
||||
}
|
||||
}
|
||||
.btn-circle{
|
||||
width:80px;
|
||||
height:80px;
|
||||
border-radius: 50%;
|
||||
line-height: 80px;
|
||||
text-align:center;
|
||||
i{
|
||||
display:block;
|
||||
line-height: 80px;
|
||||
margin:0 auto;
|
||||
font-size:35px;
|
||||
}
|
||||
.btn-primary,.btn-success,.btn-warning,.btn-danger,.btn-info{
|
||||
i{
|
||||
color:#fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.icon-sm-rounded{
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
line-height: 32px;
|
||||
display: inline-block!important;
|
||||
text-align: center;
|
||||
border-radius: 50%;
|
||||
background: $primary-color;
|
||||
color: #fff;
|
||||
}
|
||||
/****************
|
||||
|
||||
SOCIAL BUTTONS
|
||||
|
||||
**********************/
|
||||
/**social icons default size**/
|
||||
.social-icon {
|
||||
margin: 0 5px 5px 0;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
font-size: 20px;
|
||||
line-height: 40px !important;
|
||||
color: #555;
|
||||
text-shadow: none;
|
||||
border-radius: 3px;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
float: left;
|
||||
text-align: center;
|
||||
border: 1px solid #AAA;
|
||||
}
|
||||
.social-icon:hover {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.social-icon i {
|
||||
display: block;
|
||||
-moz-transition: all 0.3s ease;
|
||||
-o-transition: all 0.3s ease;
|
||||
-webkit-transition: all 0.3s ease;
|
||||
transition: all 0.3s ease;
|
||||
line-height: 40px;
|
||||
position: relative;
|
||||
}
|
||||
.social-icon i:last-child {
|
||||
color: #2f2424 !important;
|
||||
}
|
||||
|
||||
.social-icon:hover i:first-child {
|
||||
//margin-top: -40px;
|
||||
color: #f3f3f3 !important;
|
||||
}
|
||||
|
||||
/***social icons lg (big)***/
|
||||
.social-icon-lg {
|
||||
margin: 0 5px 5px 0;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
font-size: 30px;
|
||||
line-height: 60px !important;
|
||||
color: #555;
|
||||
text-shadow: none;
|
||||
border-radius: 3px;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
float: left;
|
||||
text-align: center;
|
||||
border: 1px solid #AAA;
|
||||
}
|
||||
.social-icon-lg:hover {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.social-icon-lg i {
|
||||
display: block;
|
||||
-moz-transition: all 0.3s ease;
|
||||
-o-transition: all 0.3s ease;
|
||||
-webkit-transition: all 0.3s ease;
|
||||
transition: all 0.3s ease;
|
||||
line-height: 60px;
|
||||
position: relative;
|
||||
}
|
||||
.social-icon-lg i:last-child {
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
.social-icon-lg:hover i:first-child {
|
||||
margin-top: -60px;
|
||||
}
|
||||
|
||||
/***social icons small***/
|
||||
.social-icon-sm {
|
||||
margin: 0 5px 5px 0;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
font-size: 18px;
|
||||
line-height: 30px !important;
|
||||
color: #555;
|
||||
text-shadow: none;
|
||||
border-radius: 3px;
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
float: left;
|
||||
text-align: center;
|
||||
border: 1px solid #AAA;
|
||||
}
|
||||
.social-icon-sm:hover {
|
||||
border-color: transparent;
|
||||
}
|
||||
|
||||
.social-icon-sm i {
|
||||
display: block;
|
||||
-moz-transition: all 0.3s ease;
|
||||
-o-transition: all 0.3s ease;
|
||||
-webkit-transition: all 0.3s ease;
|
||||
transition: all 0.3s ease;
|
||||
line-height: 30px;
|
||||
position: relative;
|
||||
}
|
||||
.social-icon-sm i:last-child {
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
.social-icon-sm:hover i:first-child {
|
||||
margin-top: -30px;
|
||||
}
|
||||
|
||||
si-border {
|
||||
border: 1px solid #AAA !important;
|
||||
}
|
||||
|
||||
.si-border-round {
|
||||
-webkit-border-radius: 50%;
|
||||
-moz-border-radius: 50%;
|
||||
-ms-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.si-dark-round {
|
||||
-webkit-border-radius: 50%;
|
||||
-moz-border-radius: 50%;
|
||||
-ms-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.si-gray-round {
|
||||
-webkit-border-radius: 50%;
|
||||
-moz-border-radius: 50%;
|
||||
-ms-border-radius: 50%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.si-gray {
|
||||
background: #f3f3f3;
|
||||
border: 0px;
|
||||
}
|
||||
|
||||
.si-dark {
|
||||
background-color: #333;
|
||||
border: 0px !important;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
/**icons hover colored**/
|
||||
.si-colored-facebook, .si-facebook:hover {
|
||||
background-color: #3B5998 !important;
|
||||
}
|
||||
|
||||
.si-colored-twitter, .si-twitter:hover {
|
||||
background-color: #00ACEE !important;
|
||||
}
|
||||
|
||||
.si-colored-google-plus, .si-g-plus:hover {
|
||||
background-color: #DD4B39 !important;
|
||||
}
|
||||
|
||||
.si-colored-skype, .si-skype:hover {
|
||||
background-color: #00AFF0 !important;
|
||||
}
|
||||
|
||||
.si-linkedin:hover, .si-colored-linkedin {
|
||||
background-color: #0E76A8 !important;
|
||||
}
|
||||
|
||||
.si-pin:hover, .si-colored-pinterest {
|
||||
background-color: #C8232C !important;
|
||||
}
|
||||
|
||||
.si-rss:hover, .si-colored-rss {
|
||||
background-color: #EE802F !important;
|
||||
}
|
||||
|
||||
.si-pinterest:hover, .si-colored-pinterest {
|
||||
background-color: #C8232C !important;
|
||||
}
|
||||
|
||||
.si-tumblr:hover, .si-colored-tumblr {
|
||||
background-color: #34526F !important;
|
||||
}
|
||||
|
||||
.si-vimeo:hover, .si-colored-vimeo {
|
||||
background-color: #86C9EF !important;
|
||||
}
|
||||
|
||||
.si-digg:hover, .si-colored-digg {
|
||||
background-color: #191919 !important;
|
||||
}
|
||||
|
||||
.si-instagram:hover, .si-colored-instagram {
|
||||
background-color: #3F729B !important;
|
||||
}
|
||||
|
||||
.si-flickr:hover, .si-colored-flickr {
|
||||
background-color: #FF0084 !important;
|
||||
}
|
||||
|
||||
.si-paypal:hover, .si-colored-paypal {
|
||||
background-color: #00588B !important;
|
||||
}
|
||||
|
||||
.si-yahoo:hover, .si-colored-yahoo {
|
||||
background-color: #720E9E !important;
|
||||
}
|
||||
|
||||
.si-android:hover, .si-colored-andriod {
|
||||
background-color: #A4C639 !important;
|
||||
}
|
||||
|
||||
.si-appstore:hover, .si-colored-apple {
|
||||
background-color: #000 !important;
|
||||
}
|
||||
|
||||
.si-dropbox:hover {
|
||||
background-color: #3D9AE8 !important;
|
||||
}
|
||||
|
||||
.si-dribbble:hover, .si-colored-dribbble {
|
||||
background-color: #EA4C89 !important;
|
||||
}
|
||||
|
||||
.si-soundcloud:hover, .si-colored-soundcoloud {
|
||||
background-color: #F70 !important;
|
||||
}
|
||||
|
||||
.si-xing:hover, .si-colored-xing {
|
||||
background-color: #126567 !important;
|
||||
}
|
||||
|
||||
.si-phone:hover, .si-colored-phone {
|
||||
background-color: #444 !important;
|
||||
}
|
||||
|
||||
.si-behance:hover, .si-colored-behance {
|
||||
background-color: #053eff !important;
|
||||
}
|
||||
|
||||
.si-github:hover, .si-colored-github {
|
||||
background-color: #171515 !important;
|
||||
}
|
||||
|
||||
.si-stumbleupon:hover, .si-colored-stumbleupon {
|
||||
background-color: #F74425 !important;
|
||||
}
|
||||
|
||||
.si-email:hover, .si-colored-email {
|
||||
background-color: #6567A5 !important;
|
||||
}
|
||||
|
||||
.si-wordpress:hover, .si-colored-wordpress {
|
||||
background-color: #1E8CBE !important;
|
||||
}
|
||||
.circle-button{
|
||||
display:inline-block;
|
||||
vertical-align: middle;
|
||||
span{
|
||||
vertical-align: middle;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
.circle-icon-button{
|
||||
width: 3.92857rem;
|
||||
height: 3.92857rem;
|
||||
border-radius:50%;
|
||||
font-size: 1.28571rem;
|
||||
display:inline-block;
|
||||
text-align:center;
|
||||
vertical-align:middle;
|
||||
>i{
|
||||
position: relative;
|
||||
top: 50%;
|
||||
display: block;
|
||||
-webkit-transform: translateY(-50%);
|
||||
-ms-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
z-index: 2;
|
||||
padding-left: 3px;
|
||||
padding-top: 3px;
|
||||
}
|
||||
}
|
27
src/styles/_cta-parallax.scss
Executable file
@@ -0,0 +1,27 @@
|
||||
/*
|
||||
Call to action & parallax
|
||||
*/
|
||||
.contact-info{
|
||||
>li{
|
||||
padding-left:60px;
|
||||
position:relative;
|
||||
padding-bottom:30px;
|
||||
font-size:1.2rem;
|
||||
>i{
|
||||
position:absolute;
|
||||
left:0;
|
||||
top:-5px;
|
||||
width:40px;
|
||||
height:40px;
|
||||
border-radius: 50%;
|
||||
line-height: 40px;
|
||||
text-align: center;
|
||||
background-color: #eee;
|
||||
}
|
||||
a{
|
||||
color:#555;
|
||||
border-bottom: 1px dashed #eee;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
31
src/styles/_custom-smartForm.scss
Executable file
@@ -0,0 +1,31 @@
|
||||
/*
|
||||
Smart forms custom style
|
||||
*/
|
||||
.smart-wrap{
|
||||
padding:0px;
|
||||
}
|
||||
.smart-container{
|
||||
box-shadow: none;
|
||||
-webkit-box-shadow: none;
|
||||
margin-top:0px;
|
||||
margin-bottom:0px;
|
||||
}
|
||||
.smart-forms .form-body{
|
||||
padding:0px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
.smart-forms .form-footer{
|
||||
background-image: none;
|
||||
background-color: transparent;
|
||||
padding-left: 0px;
|
||||
padding-top: 0px;
|
||||
}
|
||||
.smart-forms .form-footer .button.btn-primary{
|
||||
background-color: $primary-color;
|
||||
}
|
||||
.smart-forms .form-footer .button{
|
||||
border-radius: 5px;
|
||||
}
|
||||
.smart-forms label, .smart-forms input, .smart-forms button, .smart-forms select, .smart-forms textarea{
|
||||
font-family: $base-font;
|
||||
}
|
7
src/styles/_dropdown.scss
Executable file
@@ -0,0 +1,7 @@
|
||||
.dropdown-menu{
|
||||
.dropdown-item{
|
||||
font-size: .88rem;
|
||||
text-transform: capitalize;
|
||||
font-weight:300;
|
||||
}
|
||||
}
|
26
src/styles/_footer.scss
Executable file
@@ -0,0 +1,26 @@
|
||||
/*
|
||||
Footer style
|
||||
*/
|
||||
.footer{
|
||||
padding-top: 80px;
|
||||
padding-bottom: 60px;
|
||||
}
|
||||
.footer-nav{
|
||||
>li{
|
||||
padding:0px .5em;
|
||||
a{
|
||||
color:#666;
|
||||
&:hover{
|
||||
color:$primary-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
@media(max-width:767px){
|
||||
.footer .socials{
|
||||
display: inline-block;
|
||||
}
|
||||
.footer{
|
||||
text-align: center;
|
||||
}
|
||||
}
|
112
src/styles/_header-left.scss
Executable file
@@ -0,0 +1,112 @@
|
||||
/*
|
||||
Left header style
|
||||
*/
|
||||
.nav-link{
|
||||
font-size:.9rem;
|
||||
font-weight:400;
|
||||
text-transform: capitalize;
|
||||
font-family:$base-font;
|
||||
letter-spacing:0;
|
||||
border-right: 3px solid transparent;
|
||||
display: block;
|
||||
padding: 10px 10px;
|
||||
text-align:center;
|
||||
&.active{
|
||||
border-right-color: $primary-color;
|
||||
color:$primary-color;
|
||||
}
|
||||
}
|
||||
.navbar.navbar-light.bg-white{
|
||||
.navbar-nav .nav-link{
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
@media(min-width:992px){
|
||||
.navbar-brand{
|
||||
margin: 20px auto;
|
||||
}
|
||||
.navbar-toggleable-md .navbar-nav .nav-link{
|
||||
padding-left: 0;
|
||||
|
||||
}
|
||||
.navbar.navbar-dark.bg-dark {
|
||||
.nav-link{
|
||||
border-top: 1px solid rgba(#fff,.1);
|
||||
&:active,&:hover,&:focus{
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.navbar.navbar-light.bg-white {
|
||||
.nav-link{
|
||||
border-top: 1px solid rgba(#000,.03);
|
||||
}
|
||||
}
|
||||
.navbar-expand-lg .navbar-nav{
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
|
||||
}
|
||||
body.push-left{
|
||||
padding-left: 250px;
|
||||
|
||||
.container{
|
||||
width:100%;
|
||||
padding: 0px 30px;
|
||||
}
|
||||
}
|
||||
.navbar.navbar-left.fixed-top{
|
||||
|
||||
position: fixed;
|
||||
height: 100%;
|
||||
left:0;
|
||||
width:250px;
|
||||
top:0;
|
||||
display:block;
|
||||
padding:0px;
|
||||
box-shadow:0px 0px 20px rgba(0,0,0,.1);
|
||||
.navbar-nav{
|
||||
display: block;
|
||||
width:100%;
|
||||
>.nav-item{
|
||||
display: block;
|
||||
width:100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
.navbar-toggleable-md .navbar-collapse{
|
||||
display: block!important;
|
||||
}
|
||||
.navbar-brand{
|
||||
display: block;
|
||||
width:100%;
|
||||
text-align:center;
|
||||
}
|
||||
.socials-nav{
|
||||
span{
|
||||
display: inline-block;
|
||||
}
|
||||
padding-top: 1.5em;
|
||||
padding-left: 1.5em;
|
||||
}
|
||||
}
|
||||
@media(max-width:991px){
|
||||
.navbar-expand-lg .navbar-toggler{
|
||||
position:absolute;
|
||||
right:15px;
|
||||
top:9px;
|
||||
border:0px;
|
||||
}
|
||||
h2.display-4{
|
||||
font-size: 3rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
h2.display-4{
|
||||
font-size: 1.8rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
.nav-link{
|
||||
text-align: left;
|
||||
border-right: 0px;
|
||||
}
|
||||
}
|
88
src/styles/_header.scss
Executable file
@@ -0,0 +1,88 @@
|
||||
.navbar .navbar-nav .nav-link,.navbar .btn{
|
||||
font-size:.9rem;
|
||||
font-weight:400;
|
||||
text-transform: capitalize;
|
||||
font-family:$base-font;
|
||||
letter-spacing:0;
|
||||
}
|
||||
.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .nav-link.open, .navbar-light .navbar-nav .open>.nav-link {
|
||||
color: $primary-color;
|
||||
}
|
||||
|
||||
.sticky-wrapper.is-sticky .navbar.sticky-nav{
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.08);
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.08);
|
||||
}
|
||||
.navbar-light.sticky-nav{
|
||||
z-index: 9999!important;
|
||||
}
|
||||
@media (min-width: 992px){
|
||||
.navbar-expand-lg .navbar-nav .nav-link {
|
||||
padding-right: .9rem;
|
||||
padding-left: .9rem;
|
||||
}
|
||||
.navbar-expand-lg.navbar .container{
|
||||
position: relative;
|
||||
}
|
||||
.navbar-light.navbar.bg-white.navbar-transparent{
|
||||
background-color: transparent!important;
|
||||
position:absolute;
|
||||
left:0;
|
||||
top:0;
|
||||
width:100%;
|
||||
z-index:9999;
|
||||
padding:1rem 1rem;
|
||||
.navbar-nav .nav-link{
|
||||
color: #fff;
|
||||
&.active,&:hover,&:focus{
|
||||
color: $primary-color;
|
||||
}
|
||||
}
|
||||
.navbar-brand img{
|
||||
position: absolute;
|
||||
left: 15px;
|
||||
top: 10px;
|
||||
&.logo-dark{
|
||||
visibility: hidden;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
&.fixed-top{
|
||||
position: fixed;
|
||||
animation: fadeInDown .5s;
|
||||
-webkit-animation: fadeInDown .5s;
|
||||
background-color: #fff!important;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.08);
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.08);
|
||||
.navbar-brand img{
|
||||
&.logo-dark{
|
||||
opacity: 1;
|
||||
visibility: visible;
|
||||
}
|
||||
&.logo-light{
|
||||
opacity: 0;
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
.navbar-nav .nav-link{
|
||||
color: #111;
|
||||
&.active,&:hover,&:focus{
|
||||
color: $primary-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.navbar .navbar-nav .nav-link{
|
||||
color: #111;
|
||||
}
|
||||
@media(max-width:991px){
|
||||
.navbar.navbar-light.navbar-transparent{
|
||||
background-color: #fff!important;
|
||||
box-shadow: 0 1px 3px rgba(0,0,0,0.08);
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.08);
|
||||
.navbar-brand .logo-light{
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
26
src/styles/_hero.scss
Executable file
@@ -0,0 +1,26 @@
|
||||
/********Template hero styles***/
|
||||
.fullscreen{
|
||||
height:100%;
|
||||
position:relative;
|
||||
overflow:hidden;
|
||||
}
|
||||
.mouse-down{
|
||||
position: absolute!important;
|
||||
left:0;
|
||||
width:100%;
|
||||
bottom:0;
|
||||
text-align: center;
|
||||
z-index:1;
|
||||
}
|
||||
.hero-big-text{
|
||||
font-family: $base-font;
|
||||
font-weight: 600;
|
||||
}
|
||||
@media(min-width:768px){
|
||||
.hero-big-text{
|
||||
font-size: 4.5rem;
|
||||
line-height: 1.1;
|
||||
letter-spacing: -1px;
|
||||
text-transform:capitalize;
|
||||
}
|
||||
}
|
65
src/styles/_link-hovers.scss
Executable file
@@ -0,0 +1,65 @@
|
||||
/*
|
||||
Link hover styles
|
||||
*/
|
||||
.hover-me1{
|
||||
display: inline-block;
|
||||
position: relative;
|
||||
padding: 0 20px;
|
||||
height: 45px;
|
||||
line-height: 45px;
|
||||
color:#fff;
|
||||
text-transform:uppercase;
|
||||
font-weight:600;
|
||||
&:before,&:after{
|
||||
position: absolute;
|
||||
width: 45px;
|
||||
height: 2px;
|
||||
background: #fff;
|
||||
content: '';
|
||||
opacity: 0.2;
|
||||
-webkit-transition: all 0.3s;
|
||||
-moz-transition: all 0.3s;
|
||||
transition: all 0.3s;
|
||||
pointer-events: none;
|
||||
}
|
||||
&:before {
|
||||
top: 0;
|
||||
left: 0;
|
||||
-webkit-transform: rotate(90deg);
|
||||
-moz-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
-webkit-transform-origin: 0 0;
|
||||
-moz-transform-origin: 0 0;
|
||||
transform-origin: 0 0;
|
||||
}
|
||||
&:after {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
-webkit-transform: rotate(90deg);
|
||||
-moz-transform: rotate(90deg);
|
||||
transform: rotate(90deg);
|
||||
-webkit-transform-origin: 100% 0;
|
||||
-moz-transform-origin: 100% 0;
|
||||
transform-origin: 100% 0;
|
||||
}
|
||||
&:hover,&:focus{
|
||||
outline: none;
|
||||
color:#fff;
|
||||
&:before{
|
||||
left: 50%;
|
||||
-webkit-transform: rotate(0deg) translateX(-50%);
|
||||
-moz-transform: rotate(0deg) translateX(-50%);
|
||||
transform: rotate(0deg) translateX(-50%);
|
||||
}
|
||||
&:after {
|
||||
right: 50%;
|
||||
-webkit-transform: rotate(0deg) translateX(50%);
|
||||
-moz-transform: rotate(0deg) translateX(50%);
|
||||
transform: rotate(0deg) translateX(50%);
|
||||
}
|
||||
}
|
||||
&:hover:before,&:focus:before,&:hover:after,&:focus:after{
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
17
src/styles/_portfolio.scss
Executable file
@@ -0,0 +1,17 @@
|
||||
/*
|
||||
Portfolio
|
||||
*/
|
||||
.cbp-l-grid-agency-title{
|
||||
font-family: $title-font;
|
||||
font-weight:700;
|
||||
color:#111;
|
||||
letter-spacing: 0px;
|
||||
text-transform: uppercase;
|
||||
font-size: 14px;
|
||||
}
|
||||
.cbp-l-grid-agency-desc{
|
||||
font-family: $base-font;
|
||||
}
|
||||
.cbp-l-filters-text .cbp-filter-item{
|
||||
font-family: $title-font;
|
||||
}
|
53
src/styles/_preloader.scss
Executable file
@@ -0,0 +1,53 @@
|
||||
/*
|
||||
Preloader style
|
||||
*/
|
||||
#preloader {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: #fff;
|
||||
z-index: 99999; }
|
||||
|
||||
#preloader-inner {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
font-size: 5px;
|
||||
width: 5em;
|
||||
height: 5em;
|
||||
margin: -25px 0 0 -25px;
|
||||
text-indent: -9999em;
|
||||
border-top: 0.5em solid $primary-color;
|
||||
border-right: 0.5em solid rgba(245, 245, 245, 0.5);
|
||||
border-bottom: 0.5em solid rgba(245, 245, 245, 0.5);
|
||||
border-left: 0.5em solid rgba(245, 245, 245, 0.5);
|
||||
-webkit-transform: translateZ(0);
|
||||
-ms-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
-webkit-animation: load8 1.1s infinite linear;
|
||||
animation: load8 1.1s infinite linear; }
|
||||
|
||||
#preloader-inner,
|
||||
#preloader-inner:after {
|
||||
border-radius: 50%;
|
||||
width: 10em;
|
||||
height: 10em; }
|
||||
|
||||
@-webkit-keyframes load8 {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg); }
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg); } }
|
||||
|
||||
@keyframes load8 {
|
||||
0% {
|
||||
-webkit-transform: rotate(0deg);
|
||||
transform: rotate(0deg); }
|
||||
100% {
|
||||
-webkit-transform: rotate(360deg);
|
||||
transform: rotate(360deg); } }
|
||||
|
82
src/styles/_pricing.scss
Executable file
@@ -0,0 +1,82 @@
|
||||
/*
|
||||
Pricing tables
|
||||
*/
|
||||
|
||||
.pricing-card{
|
||||
|
||||
border-radius: 6px;
|
||||
-webkit-border-radius: 6px;
|
||||
transition: all .3s;
|
||||
-webkit-transition: all .3s;
|
||||
-moz-transition: all .3s;
|
||||
background-color: #fff;
|
||||
border-top:5px solid #ddd;
|
||||
.pricing-header{
|
||||
line-height:2rem;
|
||||
padding: 30px 20px;
|
||||
.price{
|
||||
font-size: 2rem;
|
||||
font-weight:600;
|
||||
color:#000;
|
||||
sup{
|
||||
color:#999;
|
||||
font-size: .9rem;
|
||||
font-weight:400;
|
||||
top:10px;
|
||||
vertical-align:top;
|
||||
}
|
||||
sub{
|
||||
color:#999;
|
||||
font-size: .9rem;
|
||||
font-weight:400;
|
||||
}
|
||||
}
|
||||
.price-title{
|
||||
font-size: 1.5rem;
|
||||
text-transform: capitalize;
|
||||
font-family: $title-font;
|
||||
}
|
||||
}
|
||||
&.active{
|
||||
border-top: 5px solid $primary-color;
|
||||
background-color: $primary-color;
|
||||
color:#fff;
|
||||
box-shadow: 0px 0px 25px rgba(0,0,0,0.1);
|
||||
.pricing-features{
|
||||
background-color: rgba(255,255,255,.1);
|
||||
}
|
||||
.price{
|
||||
color:#fff;
|
||||
sup,sub{
|
||||
color: rgba(255,255,255,.7);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.pricing-features{
|
||||
padding: 30px 20px;
|
||||
background-color:#fbfbfb;
|
||||
ul{
|
||||
margin-bottom: 0px;
|
||||
li{
|
||||
position: relative;
|
||||
padding-left: 30px;
|
||||
margin-bottom:10px;
|
||||
font-size:1rem;
|
||||
text-transform:capitalize;
|
||||
&:before{
|
||||
position:absolute;
|
||||
left:0;
|
||||
top:0;
|
||||
font-family: "FontAwesome";
|
||||
content: "\f00c";
|
||||
}
|
||||
&:last-child{
|
||||
margin-bottom:0px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.pricing-footer{
|
||||
padding: 20px;
|
||||
}
|
101
src/styles/_team.scss
Executable file
@@ -0,0 +1,101 @@
|
||||
/*
|
||||
Team style
|
||||
*/
|
||||
.team-card{
|
||||
position:relative;
|
||||
overflow:hidden;
|
||||
h4{
|
||||
color:#fff;
|
||||
}
|
||||
.team-overlay{
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-flex-wrap: wrap;
|
||||
-ms-flex-wrap: wrap;
|
||||
flex-wrap: wrap;
|
||||
position:absolute;
|
||||
width:100%;
|
||||
height:100%;
|
||||
background-color:rgba(#000,.8);
|
||||
left:0;
|
||||
top:0;
|
||||
opacity:0;
|
||||
-webkit-transition:all 350ms;
|
||||
-moz-transition:all 350ms;
|
||||
-o-transition:all 350ms;
|
||||
transition:all 350ms;
|
||||
.team-detail{
|
||||
-webkit-transform: scale(0.9);
|
||||
-moz-transform: scale(0.9);
|
||||
-o-transform: scale(0.9);
|
||||
-ms-transform: scale(0.9);
|
||||
transform: scale(0.9);
|
||||
-webkit-transition:all 250ms;
|
||||
-moz-transition:all 250ms;
|
||||
-o-transition:all 250ms;
|
||||
transition:all 250ms;
|
||||
text-align:center;
|
||||
width:100%;
|
||||
h4{
|
||||
color:#fff;
|
||||
text-transform: uppercase;
|
||||
margin-bottom:0px;
|
||||
}
|
||||
span{
|
||||
color:rgba(#fff,.8);
|
||||
display:block;
|
||||
font-size:13px;
|
||||
font-style:italic;
|
||||
}
|
||||
.seprator-overlay{
|
||||
width:80px;
|
||||
height:1px;
|
||||
margin:10px auto;
|
||||
background:rgba(#fff,.8);
|
||||
}
|
||||
ul{
|
||||
li{
|
||||
a{
|
||||
color:#fff;
|
||||
&:hover{
|
||||
color:$primary-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&:hover{
|
||||
.team-overlay{
|
||||
opacity:1;
|
||||
.team-detail{
|
||||
-webkit-transform: scale(1);
|
||||
-moz-transform: scale(1);
|
||||
-o-transform: scale(1);
|
||||
-ms-transform: scale(1);
|
||||
transform: scale(1);
|
||||
-webkit-transition:all 250ms;
|
||||
-moz-transition:all 250ms;
|
||||
-o-transition:all 250ms;
|
||||
transition:all 250ms;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.team-card-default{
|
||||
ul li {
|
||||
&+li{
|
||||
margin-left:5px;
|
||||
}
|
||||
a{
|
||||
color: #999;
|
||||
font-size: 20px;
|
||||
&:hover{
|
||||
color: $primary-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
16
src/styles/_testimonials.scss
Executable file
@@ -0,0 +1,16 @@
|
||||
/*
|
||||
Testimonials
|
||||
*/
|
||||
.cbp-l-slider-testimonials-wrap{
|
||||
background-color: transparent;
|
||||
border:0px;
|
||||
}
|
||||
.cbp-l-grid-slider-testimonials-body{
|
||||
font-family: $base-font;
|
||||
}
|
||||
.cbp-l-grid-slider-testimonials-footer{
|
||||
font-family: $title-font;
|
||||
}
|
||||
.cbp-l-slider-testimonials-wrap{
|
||||
padding-top: 30px;
|
||||
}
|
10
src/styles/_variables.scss
Executable file
@@ -0,0 +1,10 @@
|
||||
$title-font:'Open Sans', sans-serif;
|
||||
$styled-font:'Playfair Display', serif;
|
||||
$base-font:'Open Sans', sans-serif;
|
||||
$primary-color:#4683df;
|
||||
$danger-color:#c9302c;
|
||||
$success-color:#5cb85c;
|
||||
$warning-color:#f0ad4e;
|
||||
$default-color:#f7f7f7;
|
||||
$dark-color:#333;
|
||||
$info-color:#5bc0de;
|
41
src/styles/style-leftNavbar.scss
Executable file
@@ -0,0 +1,41 @@
|
||||
/*
|
||||
Assan onepage style file
|
||||
Version- 3.8
|
||||
author - design_mylife
|
||||
support - mylifedesign143@gmail.com
|
||||
*/
|
||||
|
||||
@font-face {
|
||||
font-family: 'FontAwesome';
|
||||
src: url("../bower_components/font-awesome/fonts/fontawesome-webfont.eot?v=4.7.0");
|
||||
src: url("../bower_components/font-awesome/fonts/fontawesome-webfont.eot?#iefix&v=4.7.0") format('embedded-opentype'),url("../bower_components/font-awesome/fonts/fontawesome-webfont.woff2?v=4.7.0") format('woff2'),url("../bower_components/font-awesome/fonts/fontawesome-webfont.woff?v=4.7.0") format('woff'),url("../bower_components/font-awesome/fonts/fontawesome-webfont.ttf?v=4.7.0") format('truetype'),url("../bower_components/font-awesome/fonts/fontawesome-webfont.svg?v=4.7.0#fontawesomeregular") format('svg');
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
/**et line icons**/
|
||||
@font-face {
|
||||
font-family: 'et-line';
|
||||
src: url("../et-line-font/fonts/et-line.eot");
|
||||
src: url("../et-line-font/fonts/et-line.eot?#iefix") format("embedded-opentype"), url("../et-line-font/fonts/et-line.woff") format("woff"), url("../et-line-font/fonts/et-line.ttf") format("truetype"), url("../et-line-font/fonts/et-line.svg#et-line") format("svg");
|
||||
font-weight: normal;
|
||||
font-style: normal; }
|
||||
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700,800');
|
||||
@import url('https://fonts.googleapis.com/css?family=Dosis:300,400,500,600');
|
||||
@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700,700i');
|
||||
@import "src/styles/variables";
|
||||
@import "src/styles/base";
|
||||
@import "src/styles/preloader";
|
||||
@import "src/styles/buttons";
|
||||
@import "src/styles/header-left";
|
||||
@import "src/styles/dropdown";
|
||||
@import "src/styles/hero";
|
||||
@import "src/styles/link-hovers";
|
||||
@import "src/styles/portfolio";
|
||||
@import "src/styles/pricing";
|
||||
@import "src/styles/team";
|
||||
@import "src/styles/cta-parallax";
|
||||
@import "src/styles/testimonials";
|
||||
@import "src/styles/custom-smartForm";
|
||||
@import "src/styles/footer";
|
||||
|
||||
|
69
src/styles/style.scss
Executable file
@@ -0,0 +1,69 @@
|
||||
/*
|
||||
Assan onepage style file
|
||||
Version- 3.8
|
||||
author - design_mylife
|
||||
support - mylifedesign143@gmail.com
|
||||
*/
|
||||
|
||||
@import "bootstrap/dist/css/bootstrap.css";
|
||||
@import "animate.css";
|
||||
|
||||
@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,400,400i,600,700,800');
|
||||
@import url('https://fonts.googleapis.com/css?family=Dosis:300,400,500,600');
|
||||
@import url('https://fonts.googleapis.com/css?family=Playfair+Display:400,400i,700,700i');
|
||||
@import "src/styles/variables";
|
||||
@import "src/styles/base";
|
||||
@import "src/styles/preloader";
|
||||
@import "src/styles/buttons";
|
||||
@import "src/styles/header";
|
||||
@import "src/styles/dropdown";
|
||||
@import "src/styles/hero";
|
||||
@import "src/styles/link-hovers";
|
||||
@import "src/styles/portfolio";
|
||||
@import "src/styles/pricing";
|
||||
@import "src/styles/team";
|
||||
@import "src/styles/cta-parallax";
|
||||
@import "src/styles/testimonials";
|
||||
@import "src/styles/custom-smartForm";
|
||||
@import "src/styles/footer";
|
||||
|
||||
.alert {
|
||||
z-index: 9999 !important;
|
||||
}
|
||||
|
||||
/******************
|
||||
|
||||
Template responsive css
|
||||
|
||||
*******************/
|
||||
@media(max-width:991px){
|
||||
.navbar .container{
|
||||
position: relative;
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
.navbar-expand-lg .navbar-toggler{
|
||||
position:absolute;
|
||||
right:15px;
|
||||
border:0px;
|
||||
top:3px;
|
||||
}
|
||||
h2.display-4{
|
||||
font-size: 3rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
}
|
||||
@media(max-width:991px){
|
||||
h2.display-4{
|
||||
font-size: 1.8rem;
|
||||
line-height: 1.2;
|
||||
}
|
||||
}
|
||||
|
||||
.form-control,select.form-control {
|
||||
&.error{
|
||||
border-color: $danger-color;
|
||||
background-color:rgba($danger-color,.1);
|
||||
box-shadow:0px 0px 5px 2px rgba($danger-color,.15);
|
||||
}
|
||||
}
|
1
src/vite-env.d.ts
vendored
Normal file
@@ -0,0 +1 @@
|
||||
/// <reference types="vite/client" />
|
26
tsconfig.json
Normal file
@@ -0,0 +1,26 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"allowJs": true,
|
||||
"target": "ES2020",
|
||||
"useDefineForClassFields": true,
|
||||
"module": "ESNext",
|
||||
"lib": ["ES2020", "DOM", "DOM.Iterable"],
|
||||
"skipLibCheck": true,
|
||||
|
||||
/* Bundler mode */
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "preserve",
|
||||
|
||||
/* Linting */
|
||||
"strict": true,
|
||||
"noUnusedLocals": true,
|
||||
"noUnusedParameters": true,
|
||||
"noFallthroughCasesInSwitch": true
|
||||
},
|
||||
"include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
|
||||
"references": [{ "path": "./tsconfig.node.json" }]
|
||||
}
|
10
tsconfig.node.json
Normal file
@@ -0,0 +1,10 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"skipLibCheck": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"allowSyntheticDefaultImports": true
|
||||
},
|
||||
"include": ["vite.config.ts"]
|
||||
}
|
7
vite.config.ts
Normal file
@@ -0,0 +1,7 @@
|
||||
import { defineConfig } from 'vite'
|
||||
import vue from '@vitejs/plugin-vue'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [vue()],
|
||||
})
|