diff --git a/ .eslintrc.js b/ .eslintrc.js new file mode 100644 index 0000000..f8f7df6 --- /dev/null +++ b/ .eslintrc.js @@ -0,0 +1,12 @@ +module.exports = { + extends: [ + // add more generic rulesets here, such as: + // 'eslint:recommended', + 'plugin:vue/vue3-recommended', + // 'plugin:vue/recommended' // Use this if you are using Vue.js 2.x. + ], + rules: { + // override/add rules settings here, such as: + // 'vue/no-unused-vars': 'error' + } + } \ No newline at end of file diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..97008e5 --- /dev/null +++ b/.gitignore @@ -0,0 +1,2 @@ +node_modules +yarn.lock \ No newline at end of file diff --git a/README.md b/README.md index ae4b1c2..7b46e45 100644 --- a/README.md +++ b/README.md @@ -1 +1,24 @@ -# ocelot-website-hire \ No newline at end of file +# ocelot-website-hire + +## Project setup +``` +yarn +``` + +### Compiles and hot-reloads for development +``` +yarn dev +``` + +### Compiles and minifies for production +``` +yarn build +``` + +### Lints and fixes files +``` +yarn lint +``` + +### Customize configuration +See [Configuration Reference](https://cli.vuejs.org/config/). diff --git a/package.json b/package.json new file mode 100644 index 0000000..b5d5758 --- /dev/null +++ b/package.json @@ -0,0 +1,29 @@ +{ + "name": "vite-vue3", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite", + "build": "vite build", + "preview": "vite preview", + "lint": "eslint . --ext .vue,.js,.jsx,.cjs,.mjs --fix --ignore-path .gitignore", + "fix": "npm run lint -- --fix", + "test": "npm run build && npm run lint" + }, + "dependencies": { + "@popperjs/core": "^2.11.7", + "bootstrap": "^5.3.0", + "vue": "^3.2.47", + "vue-router": "4" + }, + "devDependencies": { + "@vitejs/plugin-vue": "^4.1.0", + "eslint": "^8.44.0", + "eslint-plugin-vue": "^9.15.1", + "sass": "^1.63.6", + "sass-loader": "^13.3.2", + "vite": "^4.3.9", + "vue-loader": "^17.2.2" + } +} diff --git a/public/bootstrap.svg b/public/bootstrap.svg new file mode 100644 index 0000000..8f07cfe --- /dev/null +++ b/public/bootstrap.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 0000000..df36fcf Binary files /dev/null and b/public/favicon.ico differ diff --git a/public/index.html b/public/index.html new file mode 100644 index 0000000..3e5a139 --- /dev/null +++ b/public/index.html @@ -0,0 +1,17 @@ + + + + + + + + <%= htmlWebpackPlugin.options.title %> + + + +
+ + + diff --git a/public/ocelots/ocelot1.png b/public/ocelots/ocelot1.png new file mode 100644 index 0000000..d683510 Binary files /dev/null and b/public/ocelots/ocelot1.png differ diff --git a/public/ocelots/ocelot10.png b/public/ocelots/ocelot10.png new file mode 100644 index 0000000..3acc9d7 Binary files /dev/null and b/public/ocelots/ocelot10.png differ diff --git a/public/ocelots/ocelot11.png b/public/ocelots/ocelot11.png new file mode 100644 index 0000000..b343c8c Binary files /dev/null and b/public/ocelots/ocelot11.png differ diff --git a/public/ocelots/ocelot12.png b/public/ocelots/ocelot12.png new file mode 100644 index 0000000..fb3173d Binary files /dev/null and b/public/ocelots/ocelot12.png differ diff --git a/public/ocelots/ocelot13.png b/public/ocelots/ocelot13.png new file mode 100644 index 0000000..e431d4f Binary files /dev/null and b/public/ocelots/ocelot13.png differ diff --git a/public/ocelots/ocelot14.png b/public/ocelots/ocelot14.png new file mode 100644 index 0000000..5f234b7 Binary files /dev/null and b/public/ocelots/ocelot14.png differ diff --git a/public/ocelots/ocelot15.png b/public/ocelots/ocelot15.png new file mode 100644 index 0000000..689e8e2 Binary files /dev/null and b/public/ocelots/ocelot15.png differ diff --git a/public/ocelots/ocelot16.png b/public/ocelots/ocelot16.png new file mode 100644 index 0000000..6607ec5 Binary files /dev/null and b/public/ocelots/ocelot16.png differ diff --git a/public/ocelots/ocelot17.png b/public/ocelots/ocelot17.png new file mode 100644 index 0000000..13fab66 Binary files /dev/null and b/public/ocelots/ocelot17.png differ diff --git a/public/ocelots/ocelot18.png b/public/ocelots/ocelot18.png new file mode 100644 index 0000000..d2e4c13 Binary files /dev/null and b/public/ocelots/ocelot18.png differ diff --git a/public/ocelots/ocelot19.png b/public/ocelots/ocelot19.png new file mode 100644 index 0000000..9a3fc6e Binary files /dev/null and b/public/ocelots/ocelot19.png differ diff --git a/public/ocelots/ocelot2.png b/public/ocelots/ocelot2.png new file mode 100644 index 0000000..866561e Binary files /dev/null and b/public/ocelots/ocelot2.png differ diff --git a/public/ocelots/ocelot20.png b/public/ocelots/ocelot20.png new file mode 100644 index 0000000..fae2e62 Binary files /dev/null and b/public/ocelots/ocelot20.png differ diff --git a/public/ocelots/ocelot21.png b/public/ocelots/ocelot21.png new file mode 100644 index 0000000..dcfe052 Binary files /dev/null and b/public/ocelots/ocelot21.png differ diff --git a/public/ocelots/ocelot22.png b/public/ocelots/ocelot22.png new file mode 100644 index 0000000..ac945cf Binary files /dev/null and b/public/ocelots/ocelot22.png differ diff --git a/public/ocelots/ocelot23.png b/public/ocelots/ocelot23.png new file mode 100644 index 0000000..d5db63f Binary files /dev/null and b/public/ocelots/ocelot23.png differ diff --git a/public/ocelots/ocelot24.png b/public/ocelots/ocelot24.png new file mode 100644 index 0000000..17fbe90 Binary files /dev/null and b/public/ocelots/ocelot24.png differ diff --git a/public/ocelots/ocelot25.png b/public/ocelots/ocelot25.png new file mode 100644 index 0000000..20db9d6 Binary files /dev/null and b/public/ocelots/ocelot25.png differ diff --git a/public/ocelots/ocelot26.png b/public/ocelots/ocelot26.png new file mode 100644 index 0000000..44def0d Binary files /dev/null and b/public/ocelots/ocelot26.png differ diff --git a/public/ocelots/ocelot27.png b/public/ocelots/ocelot27.png new file mode 100644 index 0000000..8a0bbba Binary files /dev/null and b/public/ocelots/ocelot27.png differ diff --git a/public/ocelots/ocelot28.jpg b/public/ocelots/ocelot28.jpg new file mode 100644 index 0000000..9322cc9 Binary files /dev/null and b/public/ocelots/ocelot28.jpg differ diff --git a/public/ocelots/ocelot29.png b/public/ocelots/ocelot29.png new file mode 100644 index 0000000..41e395b Binary files /dev/null and b/public/ocelots/ocelot29.png differ diff --git a/public/ocelots/ocelot3.jpeg b/public/ocelots/ocelot3.jpeg new file mode 100644 index 0000000..d8a0499 Binary files /dev/null and b/public/ocelots/ocelot3.jpeg differ diff --git a/public/ocelots/ocelot30.png b/public/ocelots/ocelot30.png new file mode 100644 index 0000000..668ffaa Binary files /dev/null and b/public/ocelots/ocelot30.png differ diff --git a/public/ocelots/ocelot4.jpeg b/public/ocelots/ocelot4.jpeg new file mode 100644 index 0000000..67f2a17 Binary files /dev/null and b/public/ocelots/ocelot4.jpeg differ diff --git a/public/ocelots/ocelot5.jpeg b/public/ocelots/ocelot5.jpeg new file mode 100644 index 0000000..0658dae Binary files /dev/null and b/public/ocelots/ocelot5.jpeg differ diff --git a/public/ocelots/ocelot6.jpeg b/public/ocelots/ocelot6.jpeg new file mode 100644 index 0000000..3ce5c3d Binary files /dev/null and b/public/ocelots/ocelot6.jpeg differ diff --git a/public/ocelots/ocelot7.jpeg b/public/ocelots/ocelot7.jpeg new file mode 100644 index 0000000..8423ad1 Binary files /dev/null and b/public/ocelots/ocelot7.jpeg differ diff --git a/public/ocelots/ocelot8.jpeg b/public/ocelots/ocelot8.jpeg new file mode 100644 index 0000000..198bb7b Binary files /dev/null and b/public/ocelots/ocelot8.jpeg differ diff --git a/public/ocelots/ocelot9.png b/public/ocelots/ocelot9.png new file mode 100644 index 0000000..c82c2bb Binary files /dev/null and b/public/ocelots/ocelot9.png differ diff --git a/public/vite.svg b/public/vite.svg new file mode 100644 index 0000000..e7b8dfb --- /dev/null +++ b/public/vite.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/App.vue b/src/App.vue new file mode 100644 index 0000000..61512a4 --- /dev/null +++ b/src/App.vue @@ -0,0 +1,13 @@ + + + + diff --git a/src/assets/logo.png b/src/assets/logo.png new file mode 100644 index 0000000..f3d2503 Binary files /dev/null and b/src/assets/logo.png differ diff --git a/src/assets/vue.svg b/src/assets/vue.svg new file mode 100644 index 0000000..770e9d3 --- /dev/null +++ b/src/assets/vue.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/src/components/HelloWorld.vue b/src/components/HelloWorld.vue new file mode 100644 index 0000000..f5e4f53 --- /dev/null +++ b/src/components/HelloWorld.vue @@ -0,0 +1,40 @@ + + + + + diff --git a/src/components/NavbarTop.vue b/src/components/NavbarTop.vue new file mode 100644 index 0000000..faf768c --- /dev/null +++ b/src/components/NavbarTop.vue @@ -0,0 +1,35 @@ + \ No newline at end of file diff --git a/src/main.js b/src/main.js new file mode 100644 index 0000000..ac3a9b3 --- /dev/null +++ b/src/main.js @@ -0,0 +1,9 @@ +import "bootstrap/dist/css/bootstrap.min.css" +import { createApp } from 'vue' +import router from './router' +import './style.css' +import App from './App.vue' + +createApp(App).use(router).mount('#app') + +import "bootstrap/dist/js/bootstrap.js" \ No newline at end of file diff --git a/src/router/index.js b/src/router/index.js new file mode 100644 index 0000000..c9d09b7 --- /dev/null +++ b/src/router/index.js @@ -0,0 +1,40 @@ +import { createWebHistory, createRouter } from "vue-router"; +import Home from "../views/Home.vue"; +import About from "../views/About.vue"; +import Features from "../views/Features.vue"; +import Pricing from "../views/Pricing.vue"; +import NotFound from "../views/NotFound.vue"; + +const routes = [ + { + path: "/", + name: "Home", + component: Home, + }, + { + path: "/about", + name: "About", + component: About, + }, + { + path: "/features", + name: "Features", + component: Features, + }, + { + path: "/pricing", + name: "Pricing", + component: Pricing, + }, + { + path: "/:catchAll(.*)", + component: NotFound, + }, +]; + +const router = createRouter({ + history: createWebHistory(), + routes, +}); + +export default router; \ No newline at end of file diff --git a/src/store/index.js b/src/store/index.js new file mode 100644 index 0000000..9e1c7d3 --- /dev/null +++ b/src/store/index.js @@ -0,0 +1,8 @@ +import { createStore } from "vuex"; + +export default createStore({ + state: {}, + mutations: {}, + actions: {}, + modules: {}, +}); diff --git a/src/style.css b/src/style.css new file mode 100644 index 0000000..84a0050 --- /dev/null +++ b/src/style.css @@ -0,0 +1,89 @@ +: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; +} + +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; + } +} diff --git a/src/style.scss b/src/style.scss new file mode 100644 index 0000000..429e8ec --- /dev/null +++ b/src/style.scss @@ -0,0 +1,547 @@ +/* +* Orson http://en.orson.io , autreplanete http://www.autreplanete.com/ +* +**/ + + +// Brand Colors +$blue: #007bff; +$indigo: #6610f2; +$purple: #6f42c1; +$pink: #e83e8c; +$red: #dc3545; +$orange: #fd7e14; +$yellow: #ffc107; +$green: #28a745; +$teal: #20c997; +$cyan: #17a2b8; +$white: #fff; +$gray-100: #f8f9fa; +$gray-200: #e9ecef; +$gray-300: #dee2e6; +$gray-400: #ced4da; +$gray-500: #adb5bd; +$gray-600: #868e96; +$gray-700: #495057; +$gray-800: #343a40; +$gray-900: #212529; +$black: #000; +$grays: (100: $gray-100, 200: $gray-200, 300: $gray-300, 400: $gray-400, 500: $gray-500, 600: $gray-600, 700: $gray-700, 800: $gray-800, 900: $gray-900); +$theme-colors: (primary: $blue, secondary: $gray-600, success: $green, info: $cyan, warning: $yellow, danger: $red, light: $gray-100, dark: $gray-800); +$colors: (blue: $blue, indigo: $indigo, purple: $purple, pink: $pink, red: $red, orange: $orange, yellow: $yellow, green: $green, teal: $teal, cyan: $cyan, white: $white, gray: $gray-600,gray-dark: $gray-800); +$theme-color-interval: 8%; + + +// Spacing +$spacer: 1rem; +$spacers: (0: 0, 1: ($spacer * 0.25), 2: ($spacer * 0.5), 3: $spacer, 4: ($spacer * 1.5), 5: ($spacer * 3)); +$sizes: (25: 25%, 50: 50%, 75: 75%, 100: 100%); + + +// Options +$enable-rounded: true; +$enable-shadows: false; +$enable-gradients: false; +$enable-transitions: true; +$enable-hover-media-query: false; +$enable-grid-classes: true; +$enable-print-styles: true; + + +// Body +$body-bg: #000000; +$body-color: #ffffff; + + +// Links +$link-color: theme-color('primary'); +$link-decoration: none; +$link-hover-color: darken($link-color, 15%); +$link-hover-decoration: underline; + + +// Grid +$grid-breakpoints: (xs: 0, sm: 576px, md: 768px, lg: 992px, xl: 1200px); +$container-max-widths: (sm: 540px, md: 720px, lg: 960px, xl: 1140px); +$grid-columns: 12; +$grid-gutter-width: 30px; + + +// Components +$line-height-lg: 1.5; +$line-height-sm: 1.5; +$border-width: 1px; +$border-radius: 0.25rem; +$border-radius-lg: 0.3rem; +$border-radius-sm: 0.2rem; +$component-active-color: $white; +$component-active-bg: theme-color('primary'); +$caret-width: 0.3em; +$transition-base: all 0.2s ease-in-out; +$transition-fade: opacity 0.15s linear; +$transition-collapse: height 0.35s ease; + + +// Fonts +$font-family-sans-serif: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; +$font-family-monospace: Menlo, Monaco, Consolas, 'Liberation Mono', 'Courier New', monospace; +$font-family-base: $font-family-sans-serif; +$font-size-base: 1rem; +$font-size-lg: 1.25rem; +$font-size-sm: 0.875rem; +$font-weight-normal: normal; +$font-weight-bold: bold; +$font-weight-base: $font-weight-normal; +$line-height-base: 1.5; +$h1-font-size: 2.5rem; +$h2-font-size: 2rem; +$h3-font-size: 1.75rem; +$h4-font-size: 1.5rem; +$h5-font-size: 1.25rem; +$h6-font-size: 1rem; +$headings-margin-bottom: ($spacer / 2); +$headings-font-family: inherit; +$headings-font-weight: 500; +$headings-line-height: 1.1; +$headings-color: inherit; +$display1-size: 6rem; +$display2-size: 5.5rem; +$display3-size: 4.5rem; +$display4-size: 3.5rem; +$display1-weight: 300; +$display2-weight: 300; +$display3-weight: 300; +$display4-weight: 300; +$display-line-height: $headings-line-height; +$lead-font-size: 1.25rem; +$lead-font-weight: 300; +$small-font-size: 80%; +$text-muted: $gray-600; +$blockquote-small-color: $gray-600; +$blockquote-font-size: ($font-size-base * 1.25); +$hr-border-color: rgba($black, 0.1); +$hr-border-width: $border-width; +$mark-padding: 0.2em; +$dt-font-weight: $font-weight-bold; +$kbd-box-shadow: inset 0 -0.1rem 0 rgba($black, 0.25); +$nested-kbd-font-weight: $font-weight-bold; +$list-inline-padding: 5px; +$mark-bg: #fcf8e3; + + +// Buttons +$input-btn-padding-y: 0.5rem; +$input-btn-padding-x: 0.75rem; +$input-btn-line-height: 1.25; +$input-btn-padding-y-sm: 0.25rem; +$input-btn-padding-x-sm: 0.5rem; +$input-btn-line-height-sm: 1.5; +$input-btn-padding-y-lg: 0.5rem; +$input-btn-padding-x-lg: 1rem; +$input-btn-line-height-lg: 1.5; +$btn-font-weight: $font-weight-normal; +$btn-box-shadow: inset 0 1px 0 rgba($white, 0.15), 0 1px 1px rgba($black, 0.075); +$btn-focus-box-shadow: 0 0 0 3px rgba(theme-color('primary'), 0.25); +$btn-active-box-shadow: inset 0 3px 5px rgba($black, 0.125); +$btn-link-disabled-color: $gray-600; +$btn-block-spacing-y: 0.5rem; +$btn-border-radius: $border-radius; +$btn-border-radius-lg: $border-radius-lg; +$btn-border-radius-sm: $border-radius-sm; +$btn-transition: all 0.15s ease-in-out; + + +// Forms +$input-bg: $white; +$input-disabled-bg: $gray-200; +$input-color: $gray-700; +$input-border-color: rgba($black, 0.15); +$input-btn-border-width: $border-width; +$input-box-shadow: inset 0 1px 1px rgba($black, 0.075); +$input-border-radius: $border-radius; +$input-border-radius-lg: $border-radius-lg; +$input-border-radius-sm: $border-radius-sm; +$input-focus-bg: $input-bg; +$input-focus-border-color: lighten(theme-color('primary'), 25%); +$input-focus-box-shadow: $input-box-shadow, $btn-focus-box-shadow; +$input-focus-color: $input-color; +$input-placeholder-color: $gray-600; +$input-height-border: $input-btn-border-width * 2; +$input-height-inner: ($font-size-base * $input-btn-line-height) + ($input-btn-padding-y * 2); +$input-height: calc(#{$input-height-inner} + #{$input-height-border}); +$input-height-inner-sm: ($font-size-sm * $input-btn-line-height-sm) + ($input-btn-padding-y-sm * 2); +$input-height-sm: calc(#{$input-height-inner-sm} + #{$input-height-border}); +$input-height-inner-lg: ($font-size-sm * $input-btn-line-height-lg) + ($input-btn-padding-y-lg * 2); +$input-height-lg: calc(#{$input-height-inner-lg} + #{$input-height-border}); +$input-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s; +$form-text-margin-top: 0.25rem; +$form-check-margin-bottom: 0.5rem; +$form-check-input-gutter: 1.25rem; +$form-check-input-margin-y: 0.25rem; +$form-check-input-margin-x: 0.25rem; +$form-check-inline-margin-x: 0.75rem; +$form-group-margin-bottom: 1rem; +$input-group-addon-bg: $gray-200; +$input-group-addon-border-color: $input-border-color; +$custom-control-gutter: 1.5rem; +$custom-control-spacer-y: 0.25rem; +$custom-control-spacer-x: 1rem; +$custom-control-indicator-size: 1rem; +$custom-control-indicator-bg: #ddd; +$custom-control-indicator-bg-size: 50% 50%; +$custom-control-indicator-box-shadow: inset 0 0.25rem 0.25rem rgba($black, 0.1); +$custom-control-indicator-disabled-bg: $gray-200; +$custom-control-description-disabled-color: $gray-600; +$custom-control-indicator-checked-color: $white; +$custom-control-indicator-checked-bg: theme-color('primary'); +$custom-control-indicator-checked-box-shadow: none; +$custom-control-indicator-focus-box-shadow: 0 0 0 1px $body-bg, 0 0 0 3px theme-color('primary'); +$custom-control-indicator-active-color: $white; +$custom-control-indicator-active-bg: lighten(theme-color('primary'), 35%); +$custom-control-indicator-active-box-shadow: none; +$custom-checkbox-indicator-border-radius: $border-radius; +$custom-checkbox-indicator-indeterminate-bg: theme-color('primary'); +$custom-checkbox-indicator-indeterminate-color: $custom-control-indicator-checked-color; +$custom-checkbox-indicator-indeterminate-box-shadow: none; +$custom-radio-indicator-border-radius: 50%; +$custom-select-padding-y: 0.375rem; +$custom-select-padding-x: 0.75rem; +$custom-select-height: $input-height; +$custom-select-indicator-padding: 1rem; +$custom-select-line-height: $input-btn-line-height; +$custom-select-color: $input-color; +$custom-select-disabled-color: $gray-600; +$custom-select-bg: $white; +$custom-select-disabled-bg: $gray-200; +$custom-select-bg-size: 8px 10px; +$custom-select-indicator-color: #333; +$custom-select-border-width: $input-btn-border-width; +$custom-select-border-color: $input-border-color; +$custom-select-border-radius: $border-radius; +$custom-select-focus-border-color: lighten(theme-color('primary'), 25%); +$custom-select-focus-box-shadow: inset 0 1px 2px rgba($black, 0.075), 0 0 5px rgba($custom-select-focus-border-color, 0.5); +$custom-select-font-size-sm: 75%; +$custom-select-height-sm: $input-height-sm; +$custom-file-height: 2.5rem; +$custom-file-width: 14rem; +$custom-file-focus-box-shadow: 0 0 0 0.075rem $white, 0 0 0 0.2rem theme-color('primary'); +$custom-file-padding-y: 1rem; +$custom-file-padding-x: 0.5rem; +$custom-file-line-height: 1.5; +$custom-file-color: $gray-700; +$custom-file-bg: $white; +$custom-file-border-width: $border-width; +$custom-file-border-color: $input-border-color; +$custom-file-border-radius: $border-radius; +$custom-file-box-shadow: inset 0 0.2rem 0.4rem rgba($black, 0.05); +$custom-file-button-color: $custom-file-color; +$custom-file-button-bg: $gray-200; +$custom-file-text: (placeholder: (en: 'Choose file...'), button-label: (en: 'Browse')); +$form-feedback-valid-color: theme-color('success'); +$form-feedback-invalid-color: theme-color('danger'); + + +// Dropdown +$dropdown-min-width: 10rem; +$dropdown-padding-y: 0.5rem; +$dropdown-spacer: 0.125rem; +$dropdown-bg: $white; +$dropdown-border-color: rgba($black, 0.15); +$dropdown-border-width: $border-width; +$dropdown-divider-bg: $gray-200; +$dropdown-box-shadow: 0 0.5rem 1rem rgba($black, 0.175); +$dropdown-link-color: $gray-900; +$dropdown-link-hover-color: darken($gray-900, 5%); +$dropdown-link-hover-bg: $gray-100; +$dropdown-link-active-color: $component-active-color; +$dropdown-link-active-bg: $component-active-bg; +$dropdown-link-disabled-color: $gray-600; +$dropdown-item-padding-y: 0.25rem; +$dropdown-item-padding-x: 1.5rem; +$dropdown-header-color: $gray-600; + + +// Navs +$nav-link-padding-y: 0.5rem; +$nav-link-padding-x: 1rem; +$nav-link-disabled-color: $gray-600; +$nav-tabs-border-color: #ddd; +$nav-tabs-border-width: $border-width; +$nav-tabs-border-radius: $border-radius; +$nav-tabs-link-hover-border-color: $gray-200; +$nav-tabs-link-active-color: $gray-700; +$nav-tabs-link-active-bg: $body-bg; +$nav-tabs-link-active-border-color: #ddd; +$nav-pills-border-radius: $border-radius; +$nav-pills-link-active-color: $component-active-color; +$nav-pills-link-active-bg: $component-active-bg; + + +// Navbar +$navbar-padding-y: ($spacer / 2); +$navbar-padding-x: $spacer; +$navbar-brand-font-size: $font-size-lg; +$nav-link-height: $navbar-brand-font-size * $line-height-base; +$navbar-brand-height: ($font-size-base * $line-height-base + $nav-link-padding-y * 2); +$navbar-brand-padding-y: ($navbar-brand-height - $nav-link-height) / 2; +$navbar-toggler-padding-y: 0.25rem; +$navbar-toggler-padding-x: 0.75rem; +$navbar-toggler-font-size: $font-size-lg; +$navbar-toggler-border-radius: $btn-border-radius; +$navbar-dark-color: rgba($white, 0.5); +$navbar-dark-hover-color: rgba($white, 0.75); +$navbar-dark-active-color: rgba($white, 1); +$navbar-dark-disabled-color: rgba($white, 0.25); +$navbar-dark-toggler-border-color: rgba($white, 0.1); +$navbar-light-color: rgba($black, 0.5); +$navbar-light-hover-color: rgba($black, 0.7); +$navbar-light-active-color: rgba($black, 0.9); +$navbar-light-disabled-color: rgba($black, 0.3); +$navbar-light-toggler-border-color: rgba($black, 0.1); + + +// Tables +$table-cell-padding: 0.75rem; +$table-cell-padding-sm: 0.3rem; +$table-bg: transparent; +$table-accent-bg: rgba($black, 0.05); +$table-hover-bg: rgba($black, 0.075); +$table-active-bg: $table-hover-bg; +$table-border-width: $border-width; +$table-border-color: $gray-200; +$table-head-bg: $gray-200; +$table-head-color: #fff5f5; +$table-inverse-bg: $gray-900; +$table-inverse-accent-bg: rgba($white, 0.05); +$table-inverse-hover-bg: rgba($white, 0.075); +$table-inverse-border-color: lighten($gray-900, 7.5%); +$table-inverse-color: $body-bg; + + +// Z Index +$zindex-dropdown: 1000; +$zindex-sticky: 1020; +$zindex-fixed: 1030; +$zindex-modal-backdrop: 1040; +$zindex-modal: 1050; +$zindex-popover: 1060; +$zindex-tooltip: 1070; + + +// Pagination +$pagination-padding-y: 0.5rem; +$pagination-padding-x: 0.75rem; +$pagination-padding-y-sm: 0.25rem; +$pagination-padding-x-sm: 0.5rem; +$pagination-padding-y-lg: 0.75rem; +$pagination-padding-x-lg: 1.5rem; +$pagination-line-height: 1.25; +$pagination-color: $link-color; +$pagination-bg: $white; +$pagination-border-width: $border-width; +$pagination-border-color: #ddd; +$pagination-hover-color: $link-hover-color; +$pagination-hover-bg: $gray-200; +$pagination-hover-border-color: #ddd; +$pagination-active-color: $white; +$pagination-active-bg: theme-color('primary'); +$pagination-active-border-color: theme-color('primary'); +$pagination-disabled-color: $gray-600; +$pagination-disabled-bg: $white; +$pagination-disabled-border-color: #ddd; + + +// Jumbotron +$jumbotron-padding: 2rem; +$jumbotron-bg: $gray-200; + + +// Cards +$card-spacer-y: 0.75rem; +$card-spacer-x: 1.25rem; +$card-border-width: 1px; +$card-border-radius: $border-radius; +$card-border-color: rgba($black, 0.125); +$card-inner-border-radius: calc(#{$card-border-radius} - #{$card-border-width}); +$card-cap-bg: rgba($black, 0.03); +$card-bg: $white; +$card-img-overlay-padding: 1.25rem; +$card-deck-margin: ($grid-gutter-width / 2); +$card-columns-count: 3; +$card-columns-gap: 1.25rem; +$card-columns-margin: $card-spacer-y; + + +// Tooltip +$tooltip-max-width: 200px; +$tooltip-color: $white; +$tooltip-bg: $black; +$tooltip-opacity: 0.9; +$tooltip-padding-y: 3px; +$tooltip-padding-x: 8px; +$tooltip-margin: 0; +$tooltip-arrow-width: 5px; +$tooltip-arrow-height: 5px; +$tooltip-arrow-color: $tooltip-bg; + + +// Popovers +$popover-inner-padding: 1px; +$popover-bg: $white; +$popover-max-width: 276px; +$popover-border-width: $border-width; +$popover-border-color: rgba($black, 0.2); +$popover-box-shadow: 0 5px 10px rgba($black, 0.2); +$popover-header-bg: darken($popover-bg, 3%); +$popover-header-color: $headings-color; +$popover-header-padding-y: 8px; +$popover-header-padding-x: 14px; +$popover-body-color: $body-color; +$popover-body-padding-y: 9px; +$popover-body-padding-x: 14px; +$popover-arrow-width: 10px; +$popover-arrow-height: 5px; +$popover-arrow-color: $popover-bg; +$popover-arrow-outer-width: ($popover-arrow-width + 1px); +$popover-arrow-outer-color: fade-in($popover-border-color, 0.05); + + +// Badges +$badge-color: $white; +$badge-font-size: 75%; +$badge-font-weight: $font-weight-bold; +$badge-padding-y: 0.25em; +$badge-padding-x: 0.4em; +$badge-pill-padding-x: 0.6em; +$badge-pill-border-radius: 10rem; + + +// Modals +$modal-inner-padding: 15px; +$modal-dialog-margin: 10px; +$modal-dialog-margin-y-sm-up: 30px; +$modal-title-line-height: $line-height-base; +$modal-content-bg: $white; +$modal-content-border-color: rgba($black, 0.2); +$modal-content-border-width: $border-width; +$modal-content-box-shadow-xs: 0 3px 9px rgba($black, 0.5); +$modal-content-box-shadow-sm-up: 0 5px 15px rgba($black, 0.5); +$modal-backdrop-bg: $black; +$modal-backdrop-opacity: 0.5; +$modal-header-border-color: $gray-200; +$modal-footer-border-color: $modal-header-border-color; +$modal-header-border-width: $modal-content-border-width; +$modal-footer-border-width: $modal-header-border-width; +$modal-header-padding: 15px; +$modal-lg: 800px; +$modal-md: 500px; +$modal-sm: 300px; +$modal-transition: transform 0.3s ease-out; + + +// Alerts +$alert-padding-y: 0.75rem; +$alert-padding-x: 1.25rem; +$alert-margin-bottom: 1rem; +$alert-border-radius: $border-radius; +$alert-link-font-weight: $font-weight-bold; +$alert-border-width: $border-width; + + +// Progress bars +$progress-height: 1rem; +$progress-font-size: 0.75rem; +$progress-bg: $gray-200; +$progress-border-radius: $border-radius; +$progress-box-shadow: inset 0 0.1rem 0.1rem rgba($black, 0.1); +$progress-bar-color: $white; +$progress-bar-bg: theme-color('primary'); +$progress-bar-animation-timing: 1s linear infinite; +$progress-bar-transition: width 0.6s ease; + + +// List group +$list-group-bg: $white; +$list-group-border-color: rgba($black, 0.125); +$list-group-border-width: $border-width; +$list-group-border-radius: $border-radius; +$list-group-item-padding-y: 0.75rem; +$list-group-item-padding-x: 1.25rem; +$list-group-hover-bg: $gray-100; +$list-group-active-color: $component-active-color; +$list-group-active-bg: $component-active-bg; +$list-group-active-border-color: $list-group-active-bg; +$list-group-disabled-color: $gray-600; +$list-group-disabled-bg: $list-group-bg; +$list-group-action-color: $gray-700; +$list-group-action-hover-color: $list-group-action-color; +$list-group-action-active-color: $body-color; +$list-group-action-active-bg: $gray-200; + + +// Image thumbnails +$thumbnail-padding: 0.25rem; +$thumbnail-bg: $body-bg; +$thumbnail-border-width: $border-width; +$thumbnail-border-color: #ddd; +$thumbnail-border-radius: $border-radius; +$thumbnail-box-shadow: 0 1px 2px rgba($black, 0.075); +$thumbnail-transition: all 0.2s ease-in-out; + + +// Figures +$figure-caption-font-size: 90%; +$figure-caption-color: $gray-600; + + +// Breadcrumbs +$breadcrumb-padding-y: 0.75rem; +$breadcrumb-padding-x: 1rem; +$breadcrumb-item-padding: 0.5rem; +$breadcrumb-bg: $gray-200; +$breadcrumb-divider-color: $gray-600; +$breadcrumb-active-color: $gray-600; +$breadcrumb-divider: '/'; + + +// Carousel +$carousel-control-color: $white; +$carousel-control-width: 15%; +$carousel-control-opacity: 0.5; +$carousel-indicator-width: 30px; +$carousel-indicator-height: 3px; +$carousel-indicator-spacer: 3px; +$carousel-indicator-active-bg: $white; +$carousel-caption-width: 70%; +$carousel-caption-color: $white; +$carousel-control-icon-width: 20px; +$carousel-transition: transform 0.6s ease; + + +// Close +$close-font-size: $font-size-base * 1.5; +$close-font-weight: $font-weight-bold; +$close-color: $black; +$close-text-shadow: 0 1px 0 $white; + + +// Code +$code-font-size: 90%; +$code-padding-y: 0.2rem; +$code-padding-x: 0.4rem; +$code-color: #bd4147; +$code-bg: $gray-100; +$kbd-color: $white; +$kbd-bg: $gray-900; +$pre-color: $gray-900; +$pre-scrollable-max-height: 340px; + + +// Options +$enable-rounded: true; +$enable-shadows: false; +$enable-gradients: false; +$enable-transitions: true; +$enable-hover-media-query: false; +$enable-grid-classes: true; +$enable-print-styles: true; diff --git a/src/views/About.vue b/src/views/About.vue new file mode 100644 index 0000000..ed4a17a --- /dev/null +++ b/src/views/About.vue @@ -0,0 +1,89 @@ + + \ No newline at end of file diff --git a/src/views/Features.vue b/src/views/Features.vue new file mode 100644 index 0000000..669a7f4 --- /dev/null +++ b/src/views/Features.vue @@ -0,0 +1,278 @@ + + \ No newline at end of file diff --git a/src/views/Home.vue b/src/views/Home.vue new file mode 100644 index 0000000..47e938e --- /dev/null +++ b/src/views/Home.vue @@ -0,0 +1,365 @@ + + + \ No newline at end of file diff --git a/src/views/NotFound.vue b/src/views/NotFound.vue new file mode 100644 index 0000000..bd06f27 --- /dev/null +++ b/src/views/NotFound.vue @@ -0,0 +1,3 @@ + \ No newline at end of file diff --git a/src/views/Pricing.vue b/src/views/Pricing.vue new file mode 100644 index 0000000..4355190 --- /dev/null +++ b/src/views/Pricing.vue @@ -0,0 +1,663 @@ + + + \ No newline at end of file diff --git a/vite.config.js b/vite.config.js new file mode 100644 index 0000000..05c1740 --- /dev/null +++ b/vite.config.js @@ -0,0 +1,7 @@ +import { defineConfig } from 'vite' +import vue from '@vitejs/plugin-vue' + +// https://vitejs.dev/config/ +export default defineConfig({ + plugins: [vue()], +})