diff --git a/apps/docs/.editorconfig b/apps/docs/.editorconfig new file mode 100644 index 0000000..0de5001 --- /dev/null +++ b/apps/docs/.editorconfig @@ -0,0 +1,10 @@ +[*] +charset = utf-8 +indent_style = space +indent_size = 2 +end_of_line = lf +insert_final_newline = true +trim_trailing_whitespace = true + +[*.md] +trim_trailing_whitespace = false diff --git a/apps/docs/.github/FUNDING.yml b/apps/docs/.github/FUNDING.yml new file mode 100644 index 0000000..16bf7a0 --- /dev/null +++ b/apps/docs/.github/FUNDING.yml @@ -0,0 +1,4 @@ +# These are supported funding model platforms + +open_collective: leaf +github: leafsphp diff --git a/apps/docs/.github/contributing/oxford-comma.jpg b/apps/docs/.github/contributing/oxford-comma.jpg new file mode 100644 index 0000000..1f57614 Binary files /dev/null and b/apps/docs/.github/contributing/oxford-comma.jpg differ diff --git a/apps/docs/.github/contributing/writing-guide.md b/apps/docs/.github/contributing/writing-guide.md new file mode 100644 index 0000000..0ea38d9 --- /dev/null +++ b/apps/docs/.github/contributing/writing-guide.md @@ -0,0 +1,111 @@ +# Vue Docs Writing Guide + +Writing documentation is an exercise in empathy. We're not describing an objective reality - the source code already does that. Our job is to help shape the relationship between users and the Vue ecosystem. This ever-evolving guide provides some rules and recommendations on how to do that consistently within the Vue ecosystem. + +## Principles + +- **A feature doesn't exist until it's well documented.** +- **Respect users' cognitive capacity (i.e. brain power).** When a user starts reading, they begin with a certain amount of limited brain power and when they run out, they stop learning. + - Cognitive capacity is **depleted faster** by complex sentences, having to learn more than one concept at a time, and abstract examples that don't directly relate to a user's work. + - Cognitive capacity is **depleted more slowly** when we help them feel consistently smart, powerful, and curious. Breaking things down into digestible pieces and minding the flow of the document can help keep them in this state. +- **Always try to see from the user's perspective.** When we understand something thoroughly, it becomes obvious to us. This is called _the curse of knowledge_. In order to write good documentation, try to remember what you first needed to know when learning this concept. What jargon did you need to learn? What did you misunderstand? What took a long time to really grasp? Good documentation meets users where they are. It can be helpful to practice explaining the concept to people in person before. +- **Describe the _problem_ first, then the solution.** Before showing how a feature works, it's important to explain why it exists. Otherwise, users won't have the context to know if this information is important to them (is it a problem they experience?) or what prior knowledge/experience to connect it to. +- **While writing, don't be afraid to ask questions**, _especially_ if you're afraid they might be "dumb". Being vulnerable is hard, but it's the only way for us to more fully understand what we need to explain. +- **Be involved in feature discussions.** The best APIs come from documentation-driven development, where we build features that are easy to explain, rather than trying to figure out how to explain them later. Asking questions (especially "dumb" questions) earlier often helps reveal confusions, inconsistencies, and problematic behavior before a breaking change would be required to fix them. + +## Organization + +- **Installation/Integration**: Provide a thorough overview of how to integrate the software into as many different kinds of projects as necessary. +- **Introduction/Getting Started**: + - Provide a less than 10 minute overview of the problems the project solves and why it exists. + - Provide a less than 30 minute overview of the problems the project solves and how, including when and why to use the project and some simple code examples. At the end, link to both to Installation page and the beginning of the Essentials Guide. +- **Guide**: Make users feel smart, powerful, and curious, then maintain this state so that users maintain the motivation and cognitive capacity to keep learning more. Guide pages are meant to be read sequentially, so should generally be ordered from the highest to lowest power/effort ratio. + - **Essentials**: It should take no longer than 5 hours to read the Essentials, though shorter is better. Its goal is to provide the 20% of knowledge that will help users handle 80% of use cases. Essentials can link to more advanced guides and the API, though, in most cases, you should avoid such links. When they are provided, you need also provide a context so users are aware if they should follow this link on their first reading. Otherwise, many users end up exhausting their cognitive capacity link-hopping, trying to fully learn every aspect of a feature before moving on, and as a result, never finish that first read-through of the Essentials. Remember that a smooth read is more important than being thorough. We want to give people the information they need to avoid a frustrating experience, but they can always come back and read further, or Google a less common problem when they encounter it. + - **Advanced**: While the Essentials helps people handle ~80% of use cases, subsequent guides help get users to 95% of use cases, plus more detailed information on non-essential features (e.g. transitions, animations), more complex convenience features (e.g. mixins, custom directives), and dev experience improvements (e.g. JSX, plugins). The final 5% of use cases that are more niche, complex, and/or prone to abuse will be left to the cookbook and API reference, which can be linked to from these advanced guides. +- **Reference/API**: Provide a complete list of features, including type information, descriptions of the problem each solves, examples of every combination of options, and links to guides, cookbook recipes, and other internal resources providing more detail. Unlike other pages, this one is not meant to be read top-to-bottom, so plenty of detail can be provided. These references must also be more easily skimmable than the guides, so the format should be closer to dictionary entries than the story-telling format of the guides. +- **Migrations**: + - **Versions**: When important changes are made, it's useful to include a full list of changes, including a detailed explanation of why the change was made and how to migrate their projects. + - **From other projects**: How does this software compare to similar software? This is important to help users understand what additional problems we might solve or create for them, and to what extent they can transfer knowledge they already have. +- **Style Guide**: There are necessarily some key pieces in development that need a decision, but are not core to the API. The style guide provides educated, opinionated recommendations to help guide these decisions. They shouldn't be followed blindly, but can help teams save time by being aligned on smaller details. +- **Cookbook**: Recipes in the cookbook are written with some assumption of familiarity with Vue and its ecosystem. Each is a highly structured document that walks through some common implementation details that a Vue dev might encounter. + +## Writing & Grammar + +### Style + +- **Headings should describe problems**, not solutions. For example, a less effective heading might be "Using props", because it describes a solution. A better heading might be "Passing Data to Child Components with Props", because it provides the context of the problem props solve. Users won't really start paying attention to the explanation of a feature until they have some idea of why/when they'd use it. +- **When you assume knowledge, declare it** at the beginning and link to resources for less common knowledge that you're expecting. +- **Introduce only one new concept at a time whenever possible** (including both text and code examples). Even if many people are able to understand when you introduce more than one, there are also many who will become lost - and even those who don't become lost will have depleted more of their cognitive capacity. +- **Avoid special content blocks for tips and caveats when possible.** It's generally preferable to blend these more naturally into the main content, e.g. by building on examples to demonstrate an edge case. +- **Don't include more than two interwoven tips and caveats per page.** If you find that more than two tips are needed in a page, consider adding a caveats section to address these issues. The guide is meant to be read straight through, and tips and caveats can be overwhelming or distracting to someone trying to understand the base concepts. +- **Avoid appeals to authority** (e.g. "you should do X, because that's a best practice" or "X is best because it gives you full separation of concerns"). Instead, demonstrate with examples the specific human problems caused and/or solved by a pattern. +- **When deciding what to teach first, think of what knowledge will provide the best power/effort ratio.** That means teaching whatever will help users solve the greatest pains or greatest number of problems, with the relatively least effort to learn. This helps learners feel smart, powerful, and curious, so their cognitive capacity will drain more slowly. +- **Unless the context assumes a string template or build system, only write code that works in any environment by the software (e.g. Vue, Vuex, etc).** +- **Show, don't tell.** For example, "To use Vue on a page, you can add this to your HTML" (then show the script tag), instead of "To use Vue on a page, you can add a script element with a src attribute, the value of which should be a link to Vue's compiled source". +- **Almost always avoid humor (for English docs)**, especially sarcasm and pop culture references, as it doesn't translate well across cultures. +- **Never assume a more advanced context than you have to.** +- **In most cases, prefer links between sections of the docs over repeating the same content in multiple sections.** Some repetition in content is unavoidable and even essential for learning. However, too much repetition also makes the docs more difficult to maintain, because a change in the API will require changes in many places and it's easy to miss something. This is a difficult balance to strike. +- **Specific is better than generic.** For example, a `` component example is better than ``. +- **Relatable is better than obscure.** For example, a `` component example is better than ``. +- **Be emotionally relevant.** Explanations and examples that relate to something people have experience with and care about will always be more effective. +- **Always prefer simpler, plainer language over complex or jargony language.** For example: + - "you can use Vue with a script element" instead of "in order to initiate the usage of Vue, one possible option is to actually inject it via a script HTML element" + - "function that returns a function" instead of "higher order function" +- **Avoid language that invalidate struggle**, such as "easy", "just", "obviously", etc. For reference, see [Words To Avoid in Educational Writing](https://css-tricks.com/words-avoid-educational-writing/). + +### Grammar + +- **Avoid abbreviations** in writing and code examples (e.g. `attribute` is better than `attr`, `message` is better than `msg`), unless you are specifically referencing an abbreviation in an API (e.g. `$attrs`). Abbreviation symbols included on standard keyboards (e.g. `@`, `#`, `&`) are OK. +- **When referencing a directly following example, use a colon (`:`) to end a sentence**, rather than a period (`.`). +- **Use the Oxford comma** (e.g. "a, b, and c" instead of "a, b and c"). ![Why the Oxford comma is important](./oxford-comma.jpg) + - Source: [The Serial (Oxford) Comma: When and Why To Use It](https://www.inkonhand.com/2015/10/the-serial-oxford-comma-when-and-why-to-use-it/) +- **When referencing the name of a project, use the name that project refers to itself as.** For example, "webpack" and "npm" should both use lowercase as that's how their documentation refers to them. +- **Use Title Case for headings** - at least for now, since it's what we use through the rest of the docs. There's research suggesting that sentence case (only first word of the heading starts with a capital) is actually superior for legibility and also reduces the cognitive overhead for documentation writers, since they don't have to try to remember whether to capitalize words like "and", "with", and "about". +- **Don't use emojis (except in discussions).** Emojis are cute and friendly, but they can be a distraction in documentation and some emoji even convey different meanings in different cultures. + +## Iteration & Communication + +- **Excellence comes from iteration.** First drafts are always bad, but writing them is a vital part of the process. It's extremely difficult to avoid the slow progression of Bad -> OK -> Good -> Great -> Inspiring -> Transcendent. +- **Only wait until something is "Good" before publishing.** The community will help you push it further down the chain. +- **Try not to get defensive when receiving feedback.** Our writing can be very personal to us, but if we get upset with the people who help us make it better, they will either stop giving feedback or start limiting the kind of feedback they give. +- **Proof-read your own work before showing it to others.** If you show someone work with a lot of spelling/grammar mistakes, you'll get feedback about spelling grammar/mistakes instead of more valuable notes about whether the writing is achieving your goals. +- **When you ask people for feedback, tell reviewers what:** + - **you're trying to do** + - **your fears are** + - **balances you're trying to strike** +- **When someone reports a problem, there is almost always a problem**, even if the solution they proposed isn't quite right. Keep asking follow-up questions to learn more. +- People need to feel safe asking questions when contributing/reviewing content. Here's how you can do that: + - **Thank people for their contributions/reviews, even if you're feeling grumpy.** For example: + - "Great question!" + - "Thanks for taking the time to explain. 🙂" + - "This is actually intentional, but thanks for taking the time to contribute. 😊" + - **Listen to what people are saying and mirror if you're not sure you're understanding correctly.** This can help validate people's feelings and experiences, while also understanding if _you're_ understanding _them_ correctly. + - **Use a lot of positive and empathetic emojis.** It's always better to seem a little strange than mean or impatient. + - **Kindly communicate rules/boundaries.** If someone behaves in a way that's abusive/inappropriate, respond only with kindness and maturity, but also make it clear that this behavior is not acceptable and what will happen (according to the code of conduct) if they continue behaving poorly. + +### Tips, Callouts, Alerts, and Line Highlights + +We have some dedicated styles to denote something that's worth highlighting in a particular way. These are captured [on this page](https://vitepress.vuejs.org/guide/markdown.html#custom-containers). **They are to be used sparingly.** + +There is a certain temptation to abuse these styles, as one can simply add a change inside a callout. However, this breaks up the flow of reading for the user, and thus, should only be used in special circumstances. Wherever possible, we should attempt to create a narrative and flow within the page to respect the readers cognitive load. + +Under no circumstances should 2 alerts be used next to one another, it's a sign that we're not able to explain context well enough. + +### Contributing + +We appreciate small, focused PRs. If you'd like to make an extremely large change, please communicate with team members prior to a pull request. Here's a [writeup that details why this is so critical](https://www.netlify.com/blog/2020/03/31/how-to-scope-down-prs/) for us to work well on this team. Please understand that though we always appreciate contributions, ultimately we have to prioritize what works best for the project as a whole. + +## Resources + +### Software + +- [Grammarly](https://www.grammarly.com/): Desktop app and browser extension for checking spelling and grammar (though grammar checking doesn't catch everything and occasionally shows a false positive). +- [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker): An extension for VS Code to help you check spelling within markdown and code examples. + +### Books + +- [On Writing Well](https://www.amazon.com/Writing-Well-30th-Anniversary-Nonfiction-ebook/dp/B0090RVGW0) (see [popular quotes](https://www.goodreads.com/work/quotes/1139032-on-writing-well-the-classic-guide-to-writing-nonfiction)) +- [Bird by Bird](https://www.amazon.com/Bird-Some-Instructions-Writing-Life/dp/0385480016) (see [popular quotes](https://www.goodreads.com/work/quotes/841198-bird-by-bird-some-instructions-on-writing-and-life)) +- [Cognitive Load Theory](https://www.amazon.com/Cognitive-Explorations-Instructional-Performance-Technologies/dp/144198125X/) + +**Adapted from the Vue JS writing guide.** diff --git a/apps/docs/.github/dependabot.yml b/apps/docs/.github/dependabot.yml new file mode 100644 index 0000000..8a60805 --- /dev/null +++ b/apps/docs/.github/dependabot.yml @@ -0,0 +1,16 @@ +version: 2 +updates: + # Enable version updates for npm + - package-ecosystem: 'npm' + # Look for `package.json` and `lock` files in the `root` directory + directory: '/' + # Check the npm registry for updates every day (weekdays) + schedule: + interval: 'daily' + open-pull-requests-limit: 10 + versioning-strategy: lockfile-only + allow: + - dependency-name: 'vue' + - dependency-name: 'vitepress' + - dependency-name: '@vue/theme' + - dependency-name: '@vue/repl' diff --git a/apps/docs/.github/pull_request_template.md b/apps/docs/.github/pull_request_template.md new file mode 100644 index 0000000..6286de1 --- /dev/null +++ b/apps/docs/.github/pull_request_template.md @@ -0,0 +1,5 @@ +## Description of Problem + +## Proposed Solution + +## Additional Information diff --git a/apps/docs/.github/workflows/automerge.yml b/apps/docs/.github/workflows/automerge.yml new file mode 100644 index 0000000..554d20f --- /dev/null +++ b/apps/docs/.github/workflows/automerge.yml @@ -0,0 +1,23 @@ +name: Dependabot auto-merge +on: pull_request + +permissions: + pull-requests: write + contents: write + +jobs: + dependabot: + runs-on: ubuntu-latest + if: ${{ github.actor == 'dependabot[bot]' }} + steps: + - name: Dependabot metadata + id: metadata + uses: dependabot/fetch-metadata@v1.1.1 + with: + github-token: '${{ secrets.GITHUB_TOKEN }}' + - name: Enable auto-merge for theme + if: ${{contains(steps.metadata.outputs.dependency-names, '@leafphp/docs-theme') && steps.metadata.outputs.update-type != 'version-update:semver-major'}} + run: gh pr merge --auto --merge "$PR_URL" + env: + PR_URL: ${{github.event.pull_request.html_url}} + GITHUB_TOKEN: ${{secrets.GITHUB_TOKEN}} diff --git a/apps/docs/.gitignore b/apps/docs/.gitignore new file mode 100644 index 0000000..f71b876 --- /dev/null +++ b/apps/docs/.gitignore @@ -0,0 +1,113 @@ +### OSX ### +# General +.DS_Store +.AppleDouble +.LSOverride + +# Thumbnails +._* + +# Files that might appear in the root of a volume +.DocumentRevisions-V100 +.fseventsd +.Spotlight-V100 +.TemporaryItems +.Trashes +.VolumeIcon.icns +.com.apple.timemachine.donotpresent + +# Directories potentially created on remote AFP share +.AppleDB +.AppleDesktop +Network Trash Folder +Temporary Items +.apdisk + +### Node ### +# Logs +logs +*.log +npm-debug.log* +yarn-debug.log* +yarn-error.log* +lerna-debug.log* + +# Diagnostic reports (https://nodejs.org/api/report.html) +report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json + +# Runtime data +pids +*.pid +*.seed +*.pid.lock + +# Directory for instrumented libs generated by jscoverage/JSCover +lib-cov + +# Coverage directory used by tools like istanbul +coverage +*.lcov + +# nyc test coverage +.nyc_output + +# node-waf configuration +.lock-wscript + +# Compiled binary addons (https://nodejs.org/api/addons.html) +build/Release + +# Dependency directories +node_modules/ +jspm_packages/ + +# TypeScript v1 declaration files +typings/ + +# TypeScript cache +*.tsbuildinfo + +# Optional npm cache directory +.npm + +# Optional eslint cache +.eslintcache + +# Optional REPL history +.node_repl_history + +# Output of 'npm pack' +*.tgz + +# Yarn Integrity file +.yarn-integrity + +# pnpm link folder +pnpm-global + +# dotenv environment variables file +.env +.env.test + +# parcel-bundler cache (https://parceljs.org/) +.cache + +# rollup.js default build output +dist/ + +# vuepress build output +.vuepress/dist + +# Serverless directories +.serverless/ + +# Temporary folders +tmp/ +temp/ +TODOs.md +src/api/index.json +src/examples/data.json +src/tutorial/data.json +draft.md + +.idea/ diff --git a/apps/docs/.prettierrc b/apps/docs/.prettierrc new file mode 100644 index 0000000..2ecc4f4 --- /dev/null +++ b/apps/docs/.prettierrc @@ -0,0 +1,6 @@ +{ + "semi": false, + "singleQuote": true, + "trailingComma": "none", + "printWidth": 75 +} diff --git a/apps/docs/.vitepress/config.ts b/apps/docs/.vitepress/config.ts new file mode 100644 index 0000000..e9db813 --- /dev/null +++ b/apps/docs/.vitepress/config.ts @@ -0,0 +1,703 @@ +import fs from 'fs' +import path from 'path' +import { defineConfigWithTheme } from 'vitepress' +import type { Config as ThemeConfig } from '@leafphp/docs-theme' +import baseConfig from '@leafphp/docs-theme/config' +import { headerPlugin } from './headerMdPlugin' + +const nav = [ + { + text: 'Docs', + activeMatch: `^/(docs|style-guide|examples|tutorial)/`, + items: [ + { text: 'Guide', link: '/docs/introduction/' }, + { text: 'Tutorial', link: '/tutorial/' }, + { text: 'Online Playground', link: 'https://sandbox.leafphp.dev/' }, + { + text: 'Leaf Modules', + link: '/modules/' + }, + { + text: 'Migration from Leaf 2', + link: '/docs/migration/introduction' + }, + { + text: 'Leaf 2 Docs', + link: 'https://archive.leafphp.dev' + }, + { + text: 'Changelog', + link: '/changes' + } + ] + }, + { + text: 'Ecosystem', + activeMatch: `^/ecosystem/`, + items: [ + { + text: 'Core Projects', + items: [ + { + text: 'Leaf MVC', + link: 'https://mvc.leafphp.dev/' + }, + { + text: 'Leaf API', + link: 'https://api.leafphp.dev/' + }, + { + text: 'Leaf Skeleton', + link: 'https://skeleton.leafphp.dev/' + } + ] + }, + { + text: 'Tooling', + ariaLabel: 'Tooling Menu', + items: [ + { + text: 'Aloe CLI', + link: '/aloe-cli/' + }, + { + text: 'Leaf CLI', + link: '/docs/cli/' + }, + { + text: 'Leaf UI', + link: 'https://ui.leafphp.dev/' + } + ] + }, + { + text: 'Resources', + ariaLabel: 'Resources Menu', + items: [ + { + text: 'Project Showcase', + link: '/ecosystem/showcase' + }, + { + text: 'Codelabs', + link: '/codelabs/' + } + ] + } + ] + }, + { + text: 'Community', + activeMatch: `^/(about|community)/`, + items: [ + { + text: 'Community', + ariaLabel: 'Community Menu', + items: [ + { + text: 'Contribute to Leaf', + link: '/community/contributing/' + }, + { + text: 'Contribute to docs', + link: '/community/contributing/writing-guide' + }, + { + text: 'Blog', + link: 'https://blog.leafphp.dev' + }, + { + text: 'Events', + link: '/events/' + }, + { + text: 'Team', + link: '/community/team' + }, + { + text: 'Join', + link: '/community/join' + }, + { + text: 'FAQ', + link: '/community/faq' + } + ] + }, + { + text: 'Help', + ariaLabel: 'Help Menu', + items: [ + { + text: 'Leaf Forum', + link: 'https://github.com/leafsphp/leaf/discussions/37' + }, + { + text: 'YouTube', + link: 'https://www.youtube.com/channel/UCllE-GsYy10RkxBUK0HIffw' + }, + { + text: 'Discord', + link: 'https://discord.gg/Pkrm9NJPE3' + }, + { + text: 'GitHub', + link: 'https://github.com/leafsphp/leaf' + } + ] + } + ] + }, + { + text: 'Support Leaf', + link: '/support/' + } + // { + // text: 'Partners', + // link: '/partners/', + // activeMatch: `^/partners/` + // } +] + +const mainSidebar = [ + { + text: 'Quick Start', + collapsible: true, + collapsed: true, + items: [ + { text: 'Introduction', link: '/docs/introduction/' }, + { text: 'Why Leaf?', link: '/docs/introduction/why' }, + { text: 'Installation', link: '/docs/introduction/installation' }, + { text: 'Leaf + MVC', link: '/docs/mvc/' }, + { text: 'Using Docker', link: '/docs/introduction/docker' }, + { text: 'Migration Guide', link: '/docs/migration/other' }, + ] + }, + { + text: 'Introduction', + collapsible: true, + collapsed: true, + items: [ + { text: 'Leaf CLI', link: '/docs/cli/' }, + { text: 'Modules', link: '/modules/' }, + { text: 'Functional Mode', link: '/docs/tooling/functions' }, + { text: 'Leaf tutorial', link: '/tutorial/' }, + { text: 'Your first app', link: '/docs/introduction/first-app' }, + { text: 'Leaf Devtools', link: '/modules/devtools/' }, + { text: 'Testing', link: '/docs/tooling/testing' }, + { text: 'Deployment', link: '/docs/tooling/deployment' } + ] + }, + { + text: 'Config', + collapsible: true, + collapsed: true, + items: [ + { text: 'Overview', link: '/docs/config/' }, + { text: 'App settings', link: '/docs/config/settings' }, + { text: 'Application Env', link: '/docs/config/nsm' }, + { text: 'URL Rewriting', link: '/docs/introduction/url-rewriting' }, + { text: 'Dependency Injection', link: '/docs/tooling/container' }, + ] + }, + { + text: 'The basics', + collapsible: true, + collapsed: true, + items: [ + { text: 'Request', link: '/modules/http/v/2/request' }, + { text: 'Response', link: '/modules/http/v/2/response' }, + { text: 'Headers', link: '/modules/http/v/2/headers' }, + { text: 'CORS', link: '/modules/cors/' }, + { text: 'Session', link: '/modules/session/' }, + { text: 'Session Flash', link: '/modules/session/flash' }, + { text: 'Cookies', link: '/modules/cookies/' }, + { text: 'Leaf View', link: '/docs/tooling/view' }, + { text: 'Middleware', link: '/docs/routing/middleware' }, + { text: 'Error Handling', link: '/docs/routing/errors' } + ] + }, + { + text: 'Routing', + collapsible: true, + collapsed: true, + items: [ + { text: 'Basic Routing', link: '/docs/routing/' }, + { text: 'MVC Support', link: '/docs/routing/mvc' }, + { text: 'Route Groups', link: '/docs/routing/sub-routing' }, + { text: 'Dynamic routing', link: '/docs/routing/dynamic' }, + { + text: 'Optional Route sub-patterns', + link: '/docs/routing/sub-patterns' + }, + { text: 'Subfolder support', link: '/docs/routing/sub-folder' }, + { text: 'Using controllers', link: '/docs/routing/controller' } + ] + }, + { + text: 'Database', + collapsible: true, + collapsed: true, + items: [ + { text: 'Introduction', link: '/modules/db/' }, + { text: 'MVC Support', link: '/modules/db/mvc' }, + { text: 'Query Builder', link: '/modules/db/v/2/builder' }, + { text: 'Leaf Redis', link: '/modules/redis/' } + ] + }, + { + text: 'Authentication', + collapsible: true, + collapsed: true, + items: [ + { text: 'Introduction', link: '/modules/auth/' }, + { text: 'MVC Support', link: '/modules/auth/mvc' }, + { text: 'Auth Config', link: '/modules/auth/config' }, + { text: 'User Login', link: '/modules/auth/login' }, + { text: 'User Sign Up', link: '/modules/auth/signup' }, + { text: 'Auth Session', link: '/modules/auth/session' }, + { + text: 'Protecting your Routes', + link: '/modules/auth/protecting-your-routes' + }, + { text: 'Updating logged-in user', link: '/modules/auth/update' }, + { text: 'Helper methods', link: '/modules/auth/helpers' } + ] + }, + { + text: 'Utilities', + collapsible: true, + collapsed: true, + items: [ + { text: 'Validation', link: '/modules/forms/v/2/' }, + { text: 'Leaf Password', link: '/modules/password/' }, + { text: 'Leaf Anchor', link: '/modules/anchor/' }, + { text: 'Date/Time', link: '/modules/date/' }, + { text: 'Data Fetching', link: '/modules/fetch/' }, + { text: 'Logging', link: '/docs/tooling/logging' } + ] + }, + { + text: 'Digging Deeper', + collapsible: true, + collapsed: true, + items: [ + { text: 'CSRF', link: '/modules/anchor/csrf/' }, + { text: 'HTTP Cache', link: '/modules/http/v/2/cache' }, + { text: 'Eien Server', link: '/modules/eien/' }, + { text: 'Leaf Mail', link: '/modules/mail/' }, + { text: 'File System', link: '/modules/fs/' }, + { text: 'Queues/Jobs', link: '/modules/queues/' }, + ] + }, + { + text: 'Frontend', + collapsible: true, + collapsed: true, + items: [ + { text: 'Introduction', link: '/modules/views/' }, + { text: 'Bare UI', link: '/modules/views/bareui/' }, + { text: 'Leaf Blade', link: '/modules/views/blade/' }, + { text: 'Leaf Veins', link: '/modules/views/veins/' }, + { text: 'Other Engines', link: '/modules/views/third-party/' }, + { text: 'Vite JS', link: '/modules/views/vite/' }, + { text: 'Inertia JS', link: '/modules/views/inertia/' }, + { text: 'Viewi PHP', link: '/modules/views/viewi/' }, + { text: 'Leaf UI', link: '/modules/views/leaf-ui/' }, + ] + }, + { + text: 'MVC Integrations', + collapsible: true, + collapsed: true, + items: [ + { text: 'Leaf MVC', link: '/docs/leafmvc/' }, + { text: 'Leaf API', link: '/docs/leafapi/' }, + { text: 'Skeleton', link: '/docs/skeleton/' }, + { text: 'MVC Config', link: '/docs/mvc/config' }, + { text: 'Controllers', link: '/docs/mvc/controllers' }, + { text: 'Views', link: '/docs/mvc/views' }, + { text: 'Models', link: '/docs/mvc/models' }, + { text: 'Migrations', link: '/docs/mvc/migrations' }, + { text: 'Schema', link: '/docs/mvc/schema' }, + { text: 'Seeders', link: '/docs/mvc/seeds' }, + { text: 'Factories', link: '/modules/mvc-core/factories' }, + { text: 'Writing Commands', link: '/docs/mvc/commands' }, + { text: 'Mailing', link: '/docs/mvc/mail' }, + { text: 'MVC Helpers', link: '/docs/mvc/globals' }, + { text: 'Custom Libraries', link: '/docs/mvc/libraries' }, + { text: 'MVC Console Tool', link: '/docs/mvc/console' }, + ] + }, + { + text: 'Codelabs', + collapsible: true, + collapsed: true, + items: [ + { text: 'Intro', link: '/codelabs/' }, + { text: 'Contributing', link: '/codelabs/contributing' }, + { text: 'Deployment', link: '/codelabs/experiments/deployment/' } + // { text: 'Authentication', link: '/codelabs/experiments/auth/' }, + ] + } + // { + // text: 'Archive', + // collapsible: true, + // collapsed: true, + // items: [ + // { text: 'Leaf Http', link: '/modules/http/' }, + // { text: 'Leaf Http v1', link: '/modules/http/v/1/' } + // ] + // } +] + +const communitySidebar = [ + { + text: 'Community', + collapsible: true, + items: [ + { text: 'History', link: '/community/history' }, + { text: 'FAQ', link: '/community/faq' }, + { text: 'Blog', link: 'https://blog.leafphp.dev' }, + { text: 'Meet the Team', link: '/community/team' }, + { text: 'Our Community', link: '/community/join' }, + { text: 'Code of Conduct', link: '/coc/' }, + { text: 'Contribution Guide', link: '/community/contributing/' }, + { + text: 'Writing Guide', + link: '/community/contributing/writing-guide' + }, + { text: 'Support Leaf', link: '/support/' }, + { text: 'Twitter', link: 'https://twitter.com/leafphp' }, + { text: 'Discord', link: 'https://discord.gg/Pkrm9NJPE3' }, + { + text: 'YouTube', + link: 'https://www.youtube.com/channel/UCllE-GsYy10RkxBUK0HIffw' + } + ] + } +] + +export const sidebar = { + '/docs/': mainSidebar, + '/modules/': mainSidebar, + '/codelabs/': mainSidebar, + '/aloe-cli/': [ + { + text: 'Aloe CLI', + collapsible: true, + items: [ + { text: 'Home', link: '/aloe-cli/' }, + { + text: 'Getting Started', + link: '/aloe-cli/v/1.2.3/getting-started/' + } + ] + }, + { + text: 'Default Commands', + collapsible: true, + items: [ + { + text: 'Misc Commands', + link: '/aloe-cli/v/1.2.3/commands/misc-commands' + }, + { + text: '"Generate" Commands', + link: '/aloe-cli/v/1.2.3/commands/g-commands' + }, + { + text: '"Delete" Commands', + link: '/aloe-cli/v/1.2.3/commands/d-commands' + }, + { + text: '"DB" Commands', + link: '/aloe-cli/v/1.2.3/commands/db-commands' + } + ] + }, + { + text: 'Aloe CLI', + collapsible: true, + items: [ + { + text: 'Custom Commands', + link: '/aloe-cli/v/1.2.3/commands/custom' + }, + { + text: 'Command IO', + link: '/aloe-cli/v/1.2.3/commands/io' + } + ] + }, + { + text: 'Aloe Misc', + collapsible: true, + items: [ + { text: 'Aloe Libraries', link: '/aloe-cli/v/1.2.3/libraries' }, + { text: 'Aloe Installer', link: '/aloe-cli/v/1.2.3/installer' } + ] + } + ], + '/community/': communitySidebar, + '/coc/': communitySidebar, + '/style-guide/': [ + { + text: 'Style Guide', + items: [ + { + text: 'Overview', + link: '/style-guide/' + }, + { + text: 'A - Essential', + link: '/style-guide/rules-essential' + }, + { + text: 'B - Strongly Recommended', + link: '/style-guide/rules-strongly-recommended' + }, + { + text: 'C - Recommended', + link: '/style-guide/rules-recommended' + }, + { + text: 'D - Use with Caution', + link: '/style-guide/rules-use-with-caution' + } + ] + } + ] +} + +export default defineConfigWithTheme({ + logo: '/logo-circle.png', + extends: baseConfig, + lang: 'en-US', + title: 'Leaf PHP', + description: 'Leaf PHP - Simple and elegant PHP', + srcDir: 'src', + srcExclude: ['tutorial/**/description.md'], + scrollOffset: 'header', + + head: [ + ['meta', { name: 'twitter:site', content: '@leafphp' }], + ['meta', { name: 'twitter:card', content: 'summary' }], + [ + 'meta', + { + name: 'twitter:image', + content: + 'https://repository-images.githubusercontent.com/214705101/0ff19323-d2c5-46f5-a582-0b1f3a6eabcc' + } + ], + [ + 'meta', + { + name: 'og:image', + content: + 'https://repository-images.githubusercontent.com/214705101/0ff19323-d2c5-46f5-a582-0b1f3a6eabcc' + } + ], + [ + 'link', + { + rel: 'preload', + as: 'style', + href: '/global.css' + } + ], + [ + 'link', + { + rel: 'stylesheet', + href: '/global.css' + } + ], + [ + 'link', + { + rel: 'preload', + as: 'style', + href: '/449.css' + } + ], + [ + 'link', + { + rel: 'stylesheet', + href: '/449.css' + } + ], + [ + 'link', + { + rel: 'icon', + href: '/logo-circle.png' + } + ], + ['link', { rel: 'manifest', href: '/manifest.json' }], + [ + 'meta', + { + name: 'background_color', + content: '#001e26' + } + ], + [ + 'meta', + { + name: 'theme-color', + content: '#001e26' + } + ], + ['meta', { name: 'apple-mobile-web-app-capable', content: 'yes' }], + [ + 'meta', + { + name: 'viewport', + content: 'width=device-width, initial-scale=1.0' + } + ], + [ + 'meta', + { name: 'apple-mobile-web-app-status-bar-style', content: 'black' } + ], + [ + 'link', + { + rel: 'apple-touch-icon', + href: '/images/icons/apple-icon-152x152.png' + } + ], + [ + 'meta', + { + name: 'msapplication-TileImage', + content: '/images/icons/ms-icon-144x144.png' + } + ], + ['meta', { name: 'msapplication-TileColor', content: '#000000' }], + [ + 'link', + { + href: 'https://fonts.googleapis.com/icon?family=Material+Icons', + rel: 'stylesheet' + } + ], + [ + 'link', + { + href: 'https://fonts.googleapis.com/css?family=DM+Mono:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500|DM+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700|Inter:300,400,500,600|Open+Sans:400,600;display=swap', + rel: 'stylesheet' + } + ], + [ + 'script', + {}, + fs.readFileSync( + path.resolve(__dirname, './inlined-scripts/restorePreference.js'), + 'utf-8' + ) + ], + [ + 'script', + { + async: '', + src: 'https://www.googletagmanager.com/gtag/js?id=G-QGZVHHLK12' + } + ], + [ + 'script', + {}, + ` + window.dataLayer = window.dataLayer || []; + function gtag(){dataLayer.push(arguments);} + gtag('js', new Date()); + + gtag('config', 'G-QGZVHHLK12'); + ` + ], + [ + 'script', + { + src: 'https://cdn.usefathom.com/script.js', + 'data-site': 'XNOLWPLB', + 'data-spa': 'auto', + defer: '' + } + ] + ], + + themeConfig: { + nav, + sidebar, + algolia: { + appId: 'Q38TT8XUN9', + indexName: 'leafphp', + apiKey: '87b4b8d90960f7a326dfd4c8781a5a74' + }, + + socialLinks: [ + { icon: 'languages', link: '/translations/' }, + { icon: 'github', link: 'https://github.com/leafsphp/leaf' }, + { icon: 'twitter', link: 'https://twitter.com/leafphp' }, + { icon: 'discord', link: 'https://discord.gg/Pkrm9NJPE3' } + // { + // icon: 'youtube', + // link: 'https://www.youtube.com/channel/UCllE-GsYy10RkxBUK0HIffw' + // } + ], + + editLink: { + repo: 'leafsphp/docs#master', + text: 'Edit this page on GitHub' + }, + + footer: { + license: { + text: 'MIT License', + link: 'https://github.com/leafsphp/leaf/blob/v3.x/LICENSE' + }, + copyright: `Copyright © 2019-${new Date().getFullYear()} Michael Darko-Duodu` + } + }, + + markdown: { + config(md) { + md.use(headerPlugin) + } + }, + + vite: { + define: { + __VUE_OPTIONS_API__: false + }, + optimizeDeps: { + include: ['gsap', 'dynamics.js'], + exclude: ['@vue/repl', '@leafphp/docs-theme'] + }, + // @ts-ignore + ssr: { + external: ['@vue/repl'] + }, + server: { + host: true, + fs: { + // for when developing with locally linked theme + allow: ['../..'] + } + }, + build: { + minify: 'terser', + chunkSizeWarningLimit: Infinity + }, + json: { + stringify: true + } + }, + + vue: { + reactivityTransform: true + } +}) diff --git a/apps/docs/.vitepress/headerMdPlugin.ts b/apps/docs/.vitepress/headerMdPlugin.ts new file mode 100644 index 0000000..677b9c8 --- /dev/null +++ b/apps/docs/.vitepress/headerMdPlugin.ts @@ -0,0 +1,49 @@ +/** + * A markdown-it plugin to support custom header metadata + * Headers that end with * are Options API only + * Headers that end with ** are Composition API only + * This plugin strips the markers and augments the extracted header data, + * which can be then used by the theme to filter headers. + * + * TODO: we will likely also need special syntax for preserving the same anchor + * links across translations similar to the one at + * https://github.com/vitejs/docs-cn/tree/main/.vitepress/markdown-it-custom-anchor + */ + +import MarkdownIt from 'markdown-it' +import { MarkdownRenderer } from 'vitepress' + +declare module 'vitepress' { + interface Header { + compositionOnly?: boolean + optionsOnly?: boolean + } +} + +export const headerPlugin = (md: MarkdownIt) => { + const originalOpen = md.renderer.rules.heading_open! + md.renderer.rules.heading_open = (tokens, i, ...rest) => { + for (const child of tokens[i + 1].children!) { + if (child.type === 'text' && child.content.endsWith('*')) { + child.content = child.content.replace(/\s*\*+$/, '') + } + } + return originalOpen.call(null, tokens, i, ...rest) + } + + md.renderer.rules.heading_close = (tokens, i, options, _env, self) => { + const headers = (md as MarkdownRenderer).__data?.headers + if (headers) { + const last = headers[headers.length - 1] + if (last.title.endsWith('*')) { + if (last.title.endsWith('**')) { + last.compositionOnly = true + } else { + last.optionsOnly = true + } + last.title = last.title.replace(/\s*\*+$/, '') + } + } + return self.renderToken(tokens, i, options) + } +} diff --git a/apps/docs/.vitepress/inlined-scripts/restorePreference.js b/apps/docs/.vitepress/inlined-scripts/restorePreference.js new file mode 100644 index 0000000..e8313f6 --- /dev/null +++ b/apps/docs/.vitepress/inlined-scripts/restorePreference.js @@ -0,0 +1,13 @@ +;(() => { + const restore = (key, cls, def = false) => { + const saved = localStorage.getItem(key) + if (saved ? saved !== 'false' : def) { + document.documentElement.classList.add(cls) + } + } + restore('vue-docs-prefer-functional', 'prefer-functional') + restore('vue-docs-prefer-sfc', 'prefer-sfc', true) + + window.__VUE_BANNER_ID__ = 'wip' + restore(`vue-docs-banner-${__VUE_BANNER_ID__}`, 'banner-dismissed') +})() diff --git a/apps/docs/.vitepress/theme/components/Banner.vue b/apps/docs/.vitepress/theme/components/Banner.vue new file mode 100644 index 0000000..8d4c697 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/Banner.vue @@ -0,0 +1,59 @@ + + + + + + + diff --git a/apps/docs/.vitepress/theme/components/BlogSection.vue b/apps/docs/.vitepress/theme/components/BlogSection.vue new file mode 100644 index 0000000..901f1d7 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/BlogSection.vue @@ -0,0 +1,246 @@ + + + + + diff --git a/apps/docs/.vitepress/theme/components/Footer.vue b/apps/docs/.vitepress/theme/components/Footer.vue new file mode 100644 index 0000000..42d6b39 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/Footer.vue @@ -0,0 +1,119 @@ + + + diff --git a/apps/docs/.vitepress/theme/components/Hero.vue b/apps/docs/.vitepress/theme/components/Hero.vue new file mode 100644 index 0000000..dbfcbff --- /dev/null +++ b/apps/docs/.vitepress/theme/components/Hero.vue @@ -0,0 +1,118 @@ + + + + + diff --git a/apps/docs/.vitepress/theme/components/Home.vue b/apps/docs/.vitepress/theme/components/Home.vue new file mode 100644 index 0000000..24f5072 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/Home.vue @@ -0,0 +1,336 @@ + + + + + diff --git a/apps/docs/.vitepress/theme/components/NewsLetterSubstack.vue b/apps/docs/.vitepress/theme/components/NewsLetterSubstack.vue new file mode 100644 index 0000000..df0827d --- /dev/null +++ b/apps/docs/.vitepress/theme/components/NewsLetterSubstack.vue @@ -0,0 +1,127 @@ + + + + + diff --git a/apps/docs/.vitepress/theme/components/NewsLetterTinyLetter.vue b/apps/docs/.vitepress/theme/components/NewsLetterTinyLetter.vue new file mode 100644 index 0000000..0a35e11 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/NewsLetterTinyLetter.vue @@ -0,0 +1,201 @@ + + + + + diff --git a/apps/docs/.vitepress/theme/components/PreferenceSwitch.vue b/apps/docs/.vitepress/theme/components/PreferenceSwitch.vue new file mode 100644 index 0000000..dfd0ab7 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/PreferenceSwitch.vue @@ -0,0 +1,248 @@ + + + + + + + diff --git a/apps/docs/.vitepress/theme/components/ReplLoading.vue b/apps/docs/.vitepress/theme/components/ReplLoading.vue new file mode 100644 index 0000000..39233b8 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/ReplLoading.vue @@ -0,0 +1,59 @@ + + + diff --git a/apps/docs/.vitepress/theme/components/Speak.vue b/apps/docs/.vitepress/theme/components/Speak.vue new file mode 100644 index 0000000..b00b8d8 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/Speak.vue @@ -0,0 +1,163 @@ + + + diff --git a/apps/docs/.vitepress/theme/components/SponsorsAside.vue b/apps/docs/.vitepress/theme/components/SponsorsAside.vue new file mode 100644 index 0000000..c53f946 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/SponsorsAside.vue @@ -0,0 +1,25 @@ + + + + + diff --git a/apps/docs/.vitepress/theme/components/SponsorsGroup.vue b/apps/docs/.vitepress/theme/components/SponsorsGroup.vue new file mode 100644 index 0000000..75be0cb --- /dev/null +++ b/apps/docs/.vitepress/theme/components/SponsorsGroup.vue @@ -0,0 +1,229 @@ + + + + + + + diff --git a/apps/docs/.vitepress/theme/components/Testimonials.vue b/apps/docs/.vitepress/theme/components/Testimonials.vue new file mode 100644 index 0000000..ececc3f --- /dev/null +++ b/apps/docs/.vitepress/theme/components/Testimonials.vue @@ -0,0 +1,209 @@ + + + + + diff --git a/apps/docs/.vitepress/theme/components/VideoDocs.vue b/apps/docs/.vitepress/theme/components/VideoDocs.vue new file mode 100644 index 0000000..3dbadb7 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/VideoDocs.vue @@ -0,0 +1,143 @@ + + + + + diff --git a/apps/docs/.vitepress/theme/components/VueJobs.vue b/apps/docs/.vitepress/theme/components/VueJobs.vue new file mode 100644 index 0000000..96568d2 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/VueJobs.vue @@ -0,0 +1,106 @@ + + + + + + + diff --git a/apps/docs/.vitepress/theme/components/VueMasteryModal.vue b/apps/docs/.vitepress/theme/components/VueMasteryModal.vue new file mode 100644 index 0000000..5e5dfd0 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/VueMasteryModal.vue @@ -0,0 +1,158 @@ + + + + + diff --git a/apps/docs/.vitepress/theme/components/VueSchoolLink.vue b/apps/docs/.vitepress/theme/components/VueSchoolLink.vue new file mode 100644 index 0000000..fe6bdf7 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/VueSchoolLink.vue @@ -0,0 +1,59 @@ + + + diff --git a/apps/docs/.vitepress/theme/components/preferences.ts b/apps/docs/.vitepress/theme/components/preferences.ts new file mode 100644 index 0000000..eb3e4b3 --- /dev/null +++ b/apps/docs/.vitepress/theme/components/preferences.ts @@ -0,0 +1,18 @@ +import { Header } from 'vitepress' +import { ref } from 'vue' + +const hasStorage = typeof localStorage !== 'undefined' +const get = (key: string, defaultValue = false): boolean => + hasStorage + ? JSON.parse(localStorage.getItem(key) || String(defaultValue)) + : defaultValue + +export const preferFunctionalKey = 'vue-docs-prefer-functional' +export const preferFunctional = ref(get(preferFunctionalKey)) + +export const preferSFCKey = 'vue-docs-prefer-sfc' +export const preferSFC = ref(get(preferSFCKey, true)) + +export function filterHeadersByPreference(h: Header) { + return preferFunctional.value ? !h.optionsOnly : !h.compositionOnly +} diff --git a/apps/docs/.vitepress/theme/index.ts b/apps/docs/.vitepress/theme/index.ts new file mode 100644 index 0000000..5387e63 --- /dev/null +++ b/apps/docs/.vitepress/theme/index.ts @@ -0,0 +1,32 @@ +import './styles/index.css' +import { h, App } from 'vue' +import { VPTheme } from '@leafphp/docs-theme' +import PreferenceSwitch from './components/PreferenceSwitch.vue' +import { + preferFunctional, + preferSFC, + filterHeadersByPreference +} from './components/preferences' +import SponsorsAside from './components/SponsorsAside.vue' +import VueSchoolLink from './components/VueSchoolLink.vue' +// import VueJobs from './components/VueJobs.vue' +// import Banner from './components/Banner.vue' + +export default Object.assign({}, VPTheme, { + Layout: () => { + return h(VPTheme.Layout, null, { + // banner: () => h('div', {}, [ + // h(Banner), + // ]), + 'sidebar-top': () => h(PreferenceSwitch), + 'aside-mid': () => h(SponsorsAside), + // 'aside-bottom': () => h(VueJobs) + }) + }, + enhanceApp({ app }: { app: App }) { + app.provide('prefer-functional', preferFunctional) + app.provide('prefer-sfc', preferSFC) + app.provide('filter-headers', filterHeadersByPreference) + app.component('VueSchoolLink', VueSchoolLink) + } +}) diff --git a/apps/docs/.vitepress/theme/styles/badges.css b/apps/docs/.vitepress/theme/styles/badges.css new file mode 100644 index 0000000..df66ff6 --- /dev/null +++ b/apps/docs/.vitepress/theme/styles/badges.css @@ -0,0 +1,28 @@ +.vt-badge.wip:before { + content: 'WIP'; +} + +.vt-badge.ts { + background-color: #3178c6; +} +.vt-badge.ts:before { + content: 'TS'; +} + +.vt-badge.dev-only, +.vt-badge.experimental { + color: var(--vt-c-text-light-1); + background-color: var(--vt-c-yellow); +} + +.vt-badge.dev-only:before { + content: 'Dev only'; +} + +.vt-badge.experimental:before { + content: 'Experimental'; +} + +.vt-badge[data-text]:before { + content: attr(data-text); +} diff --git a/apps/docs/.vitepress/theme/styles/index.css b/apps/docs/.vitepress/theme/styles/index.css new file mode 100644 index 0000000..2632413 --- /dev/null +++ b/apps/docs/.vitepress/theme/styles/index.css @@ -0,0 +1,6 @@ +@import "./pages.css"; +@import "./badges.css"; +@import "./options-boxes.css"; +@import "./inline-demo.css"; +@import "./utilities.css"; +@import "./style-guide.css"; diff --git a/apps/docs/.vitepress/theme/styles/inline-demo.css b/apps/docs/.vitepress/theme/styles/inline-demo.css new file mode 100644 index 0000000..02bded8 --- /dev/null +++ b/apps/docs/.vitepress/theme/styles/inline-demo.css @@ -0,0 +1,90 @@ +.vt-doc a[href^="https://sfc.vuejs.org"]:before +{ + content: '▶'; + width: 20px; + height: 20px; + display: inline-block; + border-radius: 10px; + vertical-align: middle; + position: relative; + top: -2px; + color: var(--vt-c-green); + border: 2px solid var(--vt-c-green); + margin-right: 8px; + margin-left: 4px; + line-height: 15px; + padding-left: 4.5px; + font-size: 11px; +} + +.demo { + padding: 22px 24px; + border-radius: 8px; + box-shadow: var(--vt-shadow-2); + margin-bottom: 1.2em; + transition: background-color 0.5s ease; +} + +.dark .demo { + background-color: var(--vt-c-bg-soft); +} + +.demo p { + margin: 0; +} + +.demo button { + background-color: var(--vt-c-bg-mute); + transition: background-color 0.5s; + padding: 5px 12px; + border: 1px solid var(--vt-c-divider); + border-radius: 8px; + font-size: 0.9em; + font-weight: 600; +} + +.demo button + button { + margin-left: 1em; +} + +.demo input, +.demo textarea, +.demo select { + border: 1px solid var(--vt-c-divider); + border-radius: 4px; + padding: 0.2em 0.6em; + margin-top: 10px; + background: transparent; + transition: background-color 0.5s; +} + +.dark .demo select { + background: var(--vt-c-bg-soft); +} + +.dark .demo select option { + background: transparent; +} + +.demo input:not([type]):focus, +.demo textarea:focus, +.demo select:focus { + outline: 1px solid blue; +} + +.demo select { + /* this was set by normalize.css */ + -webkit-appearance: listbox; +} + +.demo label { + margin: 0 1em 0 0.4em; +} + +.demo select[multiple] { + width: 100px; +} + +.demo h1 { + margin: 10px 0 0; +} diff --git a/apps/docs/.vitepress/theme/styles/options-boxes.css b/apps/docs/.vitepress/theme/styles/options-boxes.css new file mode 100644 index 0000000..69e6296 --- /dev/null +++ b/apps/docs/.vitepress/theme/styles/options-boxes.css @@ -0,0 +1,27 @@ +.next-steps { + margin-top: 3rem; +} + +.next-steps .vt-box { + border: 1px solid var(--vt-c-bg-soft); +} + +.next-steps .vt-box:hover { + border-color: var(--vt-c-green-light); + transition: border-color 0.3s cubic-bezier(0.25, 0.8, 0.25, 1); +} + +.vt-doc .next-steps-link { + font-size: 20px; + line-height: 1.4; + letter-spacing: -0.02em; + margin-bottom: 0.75em; + display: block; + color: var(--vt-c-green); +} + +.vt-doc .next-steps-caption { + margin-bottom: 0; + color: var(--vt-c-text-2); + transition: color 0.5s; +} diff --git a/apps/docs/.vitepress/theme/styles/pages.css b/apps/docs/.vitepress/theme/styles/pages.css new file mode 100644 index 0000000..2d807ec --- /dev/null +++ b/apps/docs/.vitepress/theme/styles/pages.css @@ -0,0 +1,34 @@ +/* always show anchors on /api/ and /style-guide/ pages */ +.vt-doc.api h2 .header-anchor, +.vt-doc.style-guide h2 .header-anchor { + opacity: 1; +} + +.vt-doc.sponsor h3 { + text-align: center; + padding-bottom: 1em; + border-bottom: 1px solid var(--vt-c-divider-light); +} + +.vt-doc.sponsor h3 .header-anchor { + display: none; +} + +.vt-grid-list { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); + grid-gap: 1rem; +} + +.dark .custom-block [class*='language-'] pre { + background-color: var(--vt-c-theme-plain); +} + +.dark .custom-block .custom-block { + background-color: var(--vt-c-theme-plain) !important; + border-left: none !important; +} + +.details.custom-block::before { + content: none !important; +} diff --git a/apps/docs/.vitepress/theme/styles/style-guide.css b/apps/docs/.vitepress/theme/styles/style-guide.css new file mode 100644 index 0000000..0d249c8 --- /dev/null +++ b/apps/docs/.vitepress/theme/styles/style-guide.css @@ -0,0 +1,65 @@ +.style-example { + border-radius: 8px 8px 12px 12px; + margin: 1.6em 0; + padding: 1.6em 1.6em 0.1px; + position: relative; + border: 1px solid transparent; + transition: background-color 0.25s ease, border-color 0.25s ease; +} + +.vt-doc .style-example h3 { + margin: 0; + font-size: 1.1em; +} + +.style-example-bad { + background: #f7e8e8; +} +.dark .style-example-bad { + background: transparent; + border-color: var(--vt-c-red); +} + +.style-example-bad h3 { + color: var(--vt-c-red); +} + +.style-example-good { + background: #ecfaf7; +} +.dark .style-example-good { + background: transparent; + border-color: var(--vt-c-green); +} + +.style-example-good h3 { + color: var(--vt-c-green); +} + +.details summary { + font-weight: bold !important; +} + +.style-verb { + font-size: 0.6em; + display: inline-block; + border-radius: 6px; + font-size: 0.65em; + line-height: 1; + font-weight: 600; + padding: 0.35em 0.4em 0.3em; + position: relative; + top: -0.15em; + margin-right: 0.5em; + color: var(--vt-c-bg); + transition: color 0.5s; + background-color: var(--vt-c-brand); +} + +.style-verb.avoid { + background-color: var(--vt-c-red); +} + +div[class~=language-php] .token.variable { + color: #fff !important; +} diff --git a/apps/docs/.vitepress/theme/styles/utilities.css b/apps/docs/.vitepress/theme/styles/utilities.css new file mode 100644 index 0000000..f9e054b --- /dev/null +++ b/apps/docs/.vitepress/theme/styles/utilities.css @@ -0,0 +1,14 @@ +.nowrap { + white-space: nowrap; +} + +.sr-only { + position: absolute; + width: 1px; + height: 1px; + padding: 0; + margin: -1px; + overflow: hidden; + clip: rect(0, 0, 0, 0); + border: 0; +} diff --git a/apps/docs/.vitepress/theme/styles/vue-mastery.css b/apps/docs/.vitepress/theme/styles/vue-mastery.css new file mode 100644 index 0000000..34f2bd6 --- /dev/null +++ b/apps/docs/.vitepress/theme/styles/vue-mastery.css @@ -0,0 +1,65 @@ +.vue-mastery-link { + background-color: var(--vt-c-bg-soft); + border-radius: 8px; + padding: 8px 16px 8px 8px; + transition: color 0.5s, background-color 0.5s; +} + +.vue-mastery-link a { + display: flex; + align-items: center; +} + +.vue-mastery-link .banner { + background-color: var(--vt-c-white-soft); + border-radius: 4px; + width:96px; + height:56px; + object-fit: cover; +} + +.vue-mastery-link .description { + flex: 1; + font-weight: 500; + font-size: 14px; + line-height: 20px; + color: var(--vt-c-text-1); + margin: 0 0 0 16px; + transition: color 0.5s; +} + +.vue-mastery-link .description span { + color: var(--vt-c-brand); +} + +.vue-mastery-link .logo-wrapper { + position: relative; + width: 48px; + height: 48px; + border-radius: 50%; + background-color: var(--vt-c-white); + display: flex; + justify-content: center; + align-items: center; +} + +.vue-mastery-link .logo-wrapper img { + width: 25px; + object-fit: contain; +} + +@media (max-width: 576px) { + .vue-mastery-link .banner { + width:56px; + } + + .vue-mastery-link .description { + font-size: 12px; + line-height: 18px; + } + .vue-mastery-link .logo-wrapper { + position: relative; + width: 32px; + height: 32px; + } +} diff --git a/apps/docs/LICENSE b/apps/docs/LICENSE new file mode 100644 index 0000000..55b818a --- /dev/null +++ b/apps/docs/LICENSE @@ -0,0 +1,29 @@ +MIT License + +Copyright (c) 2023 Michael Darko-Duodu + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. + +-------------------------------------------------------------------------------- +Third party licenses are below +-------------------------------------------------------------------------------- + +Parts of this project's code was based on code from the below repositories: + +- LICENSE.VUEJS https://github.com/vuejs/docs diff --git a/apps/docs/LICENSE.VUEJS b/apps/docs/LICENSE.VUEJS new file mode 100644 index 0000000..8944fd0 --- /dev/null +++ b/apps/docs/LICENSE.VUEJS @@ -0,0 +1,21 @@ +MIT License + +Copyright (c) 2019 vuejs + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. diff --git a/apps/docs/README.md b/apps/docs/README.md new file mode 100644 index 0000000..e35957f --- /dev/null +++ b/apps/docs/README.md @@ -0,0 +1,20 @@ +# Leaf 3 + +## Contributing + +This site is built with [VitePress](https://github.com/vuejs/vitepress) and depends on [@leafphp/docs-theme](https://github.com/leafsphp/leaf-docs-theme). Site content is written in Markdown format located in `src`. For simple edits, you can directly edit the file on GitHub and generate a Pull Request. + +For local development, [pnpm](https://pnpm.io/) is preferred as package manager: + +```bash +pnpm i +pnpm run dev +``` + +This project requires Node.js to be `v14.0.0` or higher, because we use new JavaScript features in our code, such as optional chaining. + +## Working on the content + +- See VitePress docs on supported [Markdown Extensions](https://vitepress.vuejs.org/guide/markdown.html) and the ability to [use Vue syntax inside markdown](https://vitepress.vuejs.org/guide/using-vue.html). + +- See the [Writing Guide](http://localhost:3000/community/contributing/writing-guide.html) for our rules and recommendations on writing and maintaining documentation content. diff --git a/apps/docs/env.d.ts b/apps/docs/env.d.ts new file mode 100644 index 0000000..615c851 --- /dev/null +++ b/apps/docs/env.d.ts @@ -0,0 +1,13 @@ +/// +/// + +declare module '@leafphp/docs-theme/config' { + import { UserConfig } from 'vitepress' + const config: () => Promise + export default config +} + +declare module '@leafphp/docs-theme/highlight' { + const createHighlighter: () => Promise<(input: string) => string> + export default createHighlighter +} diff --git a/apps/docs/netlify.toml b/apps/docs/netlify.toml new file mode 100644 index 0000000..8690fdf --- /dev/null +++ b/apps/docs/netlify.toml @@ -0,0 +1,11 @@ +[[redirects]] + from = "/aloe-cli/" + to = "/docs/mvc/console" + +[build.environment] + NODE_VERSION = "16" + NPM_FLAGS = "--version" # prevent Netlify npm install + +[build] + publish = ".vitepress/dist" + command = "npx pnpm i --store=node_modules/.pnpm-store && npm run build" diff --git a/apps/docs/package.json b/apps/docs/package.json new file mode 100644 index 0000000..7b38243 --- /dev/null +++ b/apps/docs/package.json @@ -0,0 +1,37 @@ +{ + "engines": { + "node": ">=14.0.0" + }, + "scripts": { + "dev": "vitepress", + "build": "vitepress build", + "serve": "vitepress serve", + "preinstall": "npx only-allow pnpm" + }, + "dependencies": { + "449.css": "^1.3.0", + "@codemirror/lang-php": "^6.0.0", + "@leafphp/docs-theme": "0.1.2", + "@vue/repl": "^1.2.4", + "axios": "^0.27.2", + "dynamics.js": "^1.1.5", + "gsap": "^3.9.0", + "vitepress": "^0.22.4", + "vue": "^3.2.37" + }, + "devDependencies": { + "@types/markdown-it": "^12.2.3", + "@types/node": "^16.9.1" + }, + "pnpm": { + "peerDependencyRules": { + "ignoreMissing": [ + "@algolia/client-search", + "react", + "react-dom", + "@types/react", + "search-insights" + ] + } + } +} diff --git a/apps/docs/src/aloe-cli/index.md b/apps/docs/src/aloe-cli/index.md new file mode 100755 index 0000000..d9eb856 --- /dev/null +++ b/apps/docs/src/aloe-cli/index.md @@ -0,0 +1,60 @@ +# Aloe CLI + +Aloe is a simple but powerful console service that makes building your leaf apps just a simple walk in the park. Aloe CLI ships with the default Leaf console tool in the newer versions of Leaf API, Leaf MVC and Skeleton. + +Aloe comes with a predefined set of commands which provide project scaffolding, database and app management right from the console. It also introduces a much simpler and cleaner way to write your commands. + +## Aloe List + +```bash +ALOE + +Usage: + command [options] [arguments] + +Options: + -h, --help Display this help message + -q, --quiet Do not output any message + -V, --version Display this application version + --ansi Force ANSI output + --no-ansi Disable ANSI output + -n, --no-interaction Do not ask any interactive question + -v|vv|vvv, --verbose Increase the verbosity of messages: 1 for normal output, 2 for more verbose output and 3 for debug + +Available commands: + example example command's description + help Displays help for a command + interact Interact with your application + list Lists commands + serve Start the leaf development server + aloe + aloe:config Install aloe config + app + app:down Place app in maintenance mode + app:up Remove app from maintenance mode + d + d:command Delete a console command + d:controller Delete a controller + d:factory Delete a model factory + d:migration Delete a migration + d:model Delete a model + d:seed Delete a model seeder + db + db:install Create new database from .env variables + db:migrate Run the database migrations + db:rollback Rollback all database migrations + db:seed Seed the database with records + env + env:generate Generate .env file + g + g:command Create a new console command + g:controller Create a new controller class + g:factory Create a new model factory + g:helper Create a new helper class + g:migration Create a new migration file + g:model Create a new model class + g:seed Create a new seed file + g:template Create a new view file + scaffold + scaffold:auth Scaffold basic app authentication +``` diff --git a/apps/docs/src/aloe-cli/v/1.2.3/commands/custom.md b/apps/docs/src/aloe-cli/v/1.2.3/commands/custom.md new file mode 100755 index 0000000..14c45a3 --- /dev/null +++ b/apps/docs/src/aloe-cli/v/1.2.3/commands/custom.md @@ -0,0 +1,107 @@ +# Aloe CLI: Custom Commands + +This section talks about creating custom commands using Aloe CLI. These commands would be called through the CLI. + +To get started, aloe CLI provides `g:command` which scaffolds a basic command for you and even registers it, so you can go straight into working on the command's logic. The new command will be created in the default commands directory. + +The default directory for commands for Leaf API and Leaf MVC is `App\Console`, with skeleton, you're free to decide where to place your commands. + +```bash +php leaf g:command SendMail +``` + +Aloe can also generate namespaced commands directly for you. You don't have to manually set namespaces as done with other CLI tools. + +```bash +php leaf g:command mail:send +``` + +If you want to, you can even generate the command by it's name instead of it's class. Aloe is smart enough to differentiate them. + +```bash +php leaf g:command shutdown +``` + +## Command Structure + +After generating your command, you should start writing what to execute once the command is called. Aloe smartly generates a command name for you, even if you create the command using the class name, however, if it doesn't match what you need, you can always change it. + +With the `mail:send` example above, Aloe wil generate `App\Console\MailSendCommand`, in this file, we'll have something that looks like this: + +```php +comment("mail:send command's output"); + } +} +``` + +We can add an argument to find the user to send the email to, and output a message while sending the email. +These can be done in the `config` and `handle` methods respectively. [Read more](/aloe-cli/v/1.2.3/commands/io) here. + +```php +public function config() +{ + $this->setArgument("user", "required"); +} + +public function handle() +{ + $user = $this->argument('user'); + + $this->comment("Sending email to $user"); + + $success = CustomEmailHandler::send($user); + + if ($success) { + $this->info("Email sent successfully"); + } else { + $this->error("Couldn't send email, pls try again"); + } +} +``` + +## Registering Commands + +By default, aloe cli registers all commands generated, however, if you have a command you want to register manually, or commands from a package which need to use Aloe, you can also add them pretty easily. + +Simply locate the `leaf` file in the root directory of your project, open it up and find a commented section talking about custom commands. + +```php +/* +|-------------------------------------------------------------------------- +| Add custom command +|-------------------------------------------------------------------------- +| +| If you have a new command to add to Leaf +| +*/ +$console->register(\App\Console\ExampleCommand::class); +``` + +An example command has already been registered, so you can follow this example. Simply call the `register` method. You can also pass in an array of commands to register, as such, a custom package with a couple of commands to register can simply return an array of all those commands. + +```php +$console->register([ + \App\Console\AppCommand::class, + CustomPackage::commands(), +]); +``` + +## Next Steps + +- [Commands IO](/aloe-cli/v/1.2.3/commands/io) +- [libraries](/aloe-cli/v/1.2.3/libraries) +- [G Commands](/aloe-cli/v/1.2.3/commands/g-commands) +- [DB commands](/aloe-cli/v/1.2.3/commands/db-commands) diff --git a/apps/docs/src/aloe-cli/v/1.2.3/commands/d-commands.md b/apps/docs/src/aloe-cli/v/1.2.3/commands/d-commands.md new file mode 100755 index 0000000..251169d --- /dev/null +++ b/apps/docs/src/aloe-cli/v/1.2.3/commands/d-commands.md @@ -0,0 +1,90 @@ +# Aloe CLI: d commands + +d technically stands for delete. Aloe CLI d commands technically delete some sort of file or class. + +## d:command + +This command is used to delete and unregister a custom command + +```bash +Description: + Delete a console command + +Usage: + d:command + +Arguments: + file The name of the console file +``` + +## d:controller + +```bash +Description: + Delete a controller + +Usage: + d:controller + +Arguments: + controller controller name +``` + +## d:factory + +```bash +Description: + Delete a model factory + +Usage: + d:factory + +Arguments: + factory factory name +``` + +## d:migration + +```bash +Description: + Delete a migration + +Usage: + d:migration + +Arguments: + file File to delete +``` + +## d:model + +```bash +Description: + Delete a model + +Usage: + d:model + +Arguments: + model model name +``` + +## d:seed + +```bash +Description: + Delete a model seeder + +Usage: + d:seed + +Arguments: + seed seeder name +``` + +## Next Steps + +- [DB Commands](/aloe-cli/v/1.2.3/commands/db-commands) +- [Custom commands](/aloe-cli/v/1.2.3/commands/custom) +- [Commands IO](/aloe-cli/v/1.2.3/commands/io) +- [Creating Libraries](/aloe-cli/v/1.2.3/libraries) diff --git a/apps/docs/src/aloe-cli/v/1.2.3/commands/db-commands.md b/apps/docs/src/aloe-cli/v/1.2.3/commands/db-commands.md new file mode 100755 index 0000000..f5852a9 --- /dev/null +++ b/apps/docs/src/aloe-cli/v/1.2.3/commands/db-commands.md @@ -0,0 +1,61 @@ +# Aloe CLI: DB Commands + +These commands help you manage and interact with your database. + +## db:install + +Create the database in your .env variables if it doesn't already exist. + +```bash +Description: + Create new database from .env variables + +Usage: + db:install +``` + +## db:migrate + +```bash +Description: + Run the database migrations + +Usage: + db:migrate [options] + +Options: + -f, --file[=FILE] Rollback a particular file + -s, --seed Run seeds after migration +``` + +## db:rollback + +```bash +Description: + Rollback database migrations + +Usage: + db:rollback [options] + +Options: + -s, --step[=STEP] The batch to rollback [default: "all"] + -f, --file[=FILE] Rollback a particular file +``` + +Dont use -f and -s together + +## db:seed + +```bash +Description: + Seed the database with records + +Usage: + db:seed +``` + +## Next Steps + +- [Custom commands](/aloe-cli/v/1.2.3/commands/custom) +- [Commands IO](/aloe-cli/v/1.2.3/commands/io) +- [Creating Libraries](/aloe-cli/v/1.2.3/libraries) diff --git a/apps/docs/src/aloe-cli/v/1.2.3/commands/g-commands.md b/apps/docs/src/aloe-cli/v/1.2.3/commands/g-commands.md new file mode 100755 index 0000000..6466a0b --- /dev/null +++ b/apps/docs/src/aloe-cli/v/1.2.3/commands/g-commands.md @@ -0,0 +1,117 @@ +# Aloe CLI: g commands + +These commands generate something. + +## g:command + +```bash +Description: + Create a new console command + +Usage: + g:command + +Arguments: + consoleCommand command name +``` + +## g:controller + +```bash +Description: + Create a new controller class + +Usage: + g:controller [options] [--] + +Arguments: + controller controller name + +Options: + -a, --all Create a model and migration for controller + -m, --model Create a model for controller + -r, --resource Create a resource controller + -w, --web Create a web(ordinary) controller + --api Create a web(ordinary) controller + -ar, --api-resource Create an API resource controller + -wr, --web-resource Create a web resource controller +``` + +## g:factory + +```bash +Description: + Create a new model factory + +Usage: + g:factory + +Arguments: + factory factory name +``` + +## g:helper + +```bash +Description: + Create a new helper class + +Usage: + g:helper + +Arguments: + helper helper name +``` + +## g:migration + +```bash +Description: + Create a new migration file + +Usage: + g:migration + +Arguments: + migration migration file name +``` + +## g:model + +```bash +Description: + Create a new model class + +Usage: + g:model [options] [--] + +Arguments: + model model file name + +Options: + -m, --migration Create a migration for model +``` + +## g:seed + +```bash +Description: + Create a new seed file + +Usage: + g:seed [options] [--] [] + +Arguments: + model model name (optional) + name seed name + +Options: + -f, --factory Create a factory for seeder +``` + +## Next Steps + +- [d Commands](/aloe-cli/v/1.2.3/commands/d-commands) +- [Custom commands](/aloe-cli/v/1.2.3/commands/custom) +- [Commands IO](/aloe-cli/v/1.2.3/commands/io) +- [Creating Libraries](/aloe-cli/v/1.2.3/libraries) diff --git a/apps/docs/src/aloe-cli/v/1.2.3/commands/io.md b/apps/docs/src/aloe-cli/v/1.2.3/commands/io.md new file mode 100755 index 0000000..d425992 --- /dev/null +++ b/apps/docs/src/aloe-cli/v/1.2.3/commands/io.md @@ -0,0 +1,328 @@ +# Aloe CLI: Command IO + +Command IO deals with how info flows in and out of your command. Aloe provides very simple ways to deal with both input and output from your commands. + +## Command Input + +Aloe provides a bunch of methods that allow users to make some form of input into the command. Just like the rest of Leaf, aloe prioritizes simplicity, and so, you can do almost anything you need in 1 line of code. All of these methods are already available once you extend the Aloe Command class and will be accessible on `$this`. Let's look at these methods. + +### input + +This method can return an input argument or the whole symfony console input object. + +```php +public function handle() +{ + // returns the name argument + $name = $this->input("name"); + + // returns the whole whole input object + $input = $this->input(); + + // so you can do this + $name = $input->getArgument("name"); +} +``` + +### setArgument + +This method tells Aloe that your command is expecting an argument, it's typically used inside the `config` method. + +It typically follows the same convention as symfony console's `addArgument` except that instead of passing in `InputArgument::state`, you just pass in the state as a string. + +Instead of `InputArgument::REQUIRED`, you just pass in `"required"`, any case is supported. + +```php +public function config() +{ + $this->setArgument("name", "required"); +} +``` + +### argument + +This method returns the value for a given argument passed into the command. + +```php +$name = $this->argument("name"); +``` + +### arguments + +This method returns all the given arguments merged with the default values. + +```php +$name = $this->arguments("name"); +``` + +### setOption + +This method tells Aloe that your command is expecting an inoput option, it's typically used inside the `config` method. + +It typically follows the same convention as symfony console's `addOption` except that instead of passing in `InputOption::state`, you just pass in the state as a string. + +Instead of `InputOption::VALUE_REQUIRED`, you just pass in `"required"`, any case is supported. + +```php +public function config() +{ + $this->setOption("name", "n", "required"); +} +``` + +### option + +This method returns the value for a given option passed into the command. + +```php +$name = $this->option("name"); +``` + +### options + +This method returns all the given options merged with the default values. + +```php +$name = $this->options("name"); +``` + +### ask + +This method displays some output and returns a value from the expected input, in short, it asks a question and returns the users answer. + +```php +// default value yes +$shouldDelete = $this->ask("Delete file?", "yes"); + +if ($shouldDelete === "yes") { + // delete file +} +``` + +### askRaw + +This method displays some output and returns a value from the expected input as is, in short, it asks a question and returns the exact unformatted answer. + +```php +// default value yes +$shouldDelete = $this->ask("Delete file?", "yes"); + +if ($shouldDelete === "yes") { + // delete file +} +``` + +### autoComplete + +Ask a question but provide auto completion for possible answers. + +```php +// possible answers are an array of +// auto complete values +$answers = [ + "answer 1", + "answer 2" +]; +$answer = $this->autoComplete($question, $answers, $default); + +// example +$job = $this->autoComplete("what's your job?", [ + "lawyer", + "doctor" +]); +``` + +### choice + +Ask a question where 1 answer must be selected from a bunch of possible answers. + +```php +$answers = [ + "answer 1", + "answer 2" +]; +$answer = $this->choice($question, $answers, $errorMessage, $default); + +// example +$answer = $this->choice("What fruit do you like?", [ + "fruit 1", + "fruit 2" +]); +``` + +### multiChoice + +Ask a question where multiple answers can be selected from a bunch of possible answers. + +```php +$answers = [ + "answer 1", + "answer 2" +]; +$answer = $this->multiChoice($question, $answers, $errorMessage, $default); + +// example +$answer = $this->multiChoice("What fruit do you like?", [ + "fruit 1", + "fruit 2" +]); +``` + +### secret + +This method prompts a user for input, but hides the keystrokes + +```php +$password = $this->secret("Confirm your password"); +``` + +### confirm + +Prompts the user for confirmation (y/n) + +```php +if ($this->confirm("Send cash?")) { + // send money +} else { + // cancel +} +``` + +## Command Output + +Just like input methods, there are a bunch of output methods and helpers that help you output information from your command. Let's look at these methods. + +### output + +This method can output some info or return the whole symfony console output object. + +```php +public function handle() +{ + // outputs some data + $this->output("This is output"); + + // returns the whole whole output object + $output = $this->output(); + + // so you can do this + $name = $output->writeln("This is output"); +} +``` + +### write + +Writes a message to the output. + +```php +$this->write("This is some output"); +``` + +### writeln + +Writes a message to the output and adds a newline at the end. + +```php +$this->writeln("This is some output"); +``` + +### comment + +Writes a comment styled message to the output and adds a newline at the end. + +```php +$this->comment("This is some output"); +``` + +### info + +Writes a info styled message to the output and adds a newline at the end. + +```php +$this->info("This is some output"); +``` + +### error + +Writes a error styled message to the output and adds a newline at the end. + +```php +$this->error("This is some output"); +``` + +### question + +Writes a question styled message to the output and adds a newline at the end. + +```php +$this->question("This is some output"); +``` + +### link + +Writes a link to the output and adds a newline at the end. + +```php +$this->link("https://mychi.netlify.app", "Mychi"); +``` + +## IO Helper Methods + +These are helper methods that can be called inside your commands anywhere. These methods typically give option to your input or output. + +### asQuestion + +asQuestion does pretty much the same thing as `question` above, except that `asQuestion` simply returns the `question` styles for text. + +```php +$this->writeln("Question: " . asQuestion(" ...?")); +``` + +This allows you to use the question output style for only a section of your output. + +### asComment + +asComment does pretty much the same thing as `comment` above, except that `asComment` simply returns the `comment` styles for text. + +```php +$this->writeln("Comment: " . asComment(" ...")); +``` + +This allows you to use the comment output style for only a section of your output. + +### asInfo + +asInfo does pretty much the same thing as `info` above, except that `asInfo` simply returns the `info` styles for text. + +```php +$this->writeln("Info: " . asInfo(" ...")); +``` + +This allows you to use the info output style for only a section of your output. + +### asError + +asError does pretty much the same thing as `error` above, except that `asError` simply returns the `error` styles for text. + +```php +$this->writeln("Error: " . asError(" ...")); +``` + +This allows you to use the error output style for only a section of your output. + +### asLink + +asLink does pretty much the same thing as `link` above, except that `asLink` simply returns the `link` option for text. + +```php +$this->writeln("link: " . asLink("https://...", "display text")); +``` + +This allows you to display a link on only part of your output. + +## Next Steps + +- [G Commands](/aloe-cli/v/1.2.3/commands/g-commands) +- [Custom commands](/aloe-cli/v/1.2.3/commands/custom) +- [Commands IO](/aloe-cli/v/1.2.3/commands/io) +- [DB commands](/aloe-cli/v/1.2.3/commands/db-commands) diff --git a/apps/docs/src/aloe-cli/v/1.2.3/commands/misc-commands.md b/apps/docs/src/aloe-cli/v/1.2.3/commands/misc-commands.md new file mode 100755 index 0000000..581ba6c --- /dev/null +++ b/apps/docs/src/aloe-cli/v/1.2.3/commands/misc-commands.md @@ -0,0 +1,50 @@ +# Aloe CLI: Misc Commands + +## Serve command + +This command allows you to run your Leaf app using PHP's built in server. + +```bash +Description: + Start the leaf development server + +Usage: + serve [options] [--] [] + +Arguments: + path Path to your app (in case you changed it) + +Options: + -p, --port[=PORT] Port to run Leaf app on [default: 5500] +``` + +## Scaffolding + +Scaffolding is a feature that allows you to generate big blocks of code and full features without writing a single line of code. For now, auth scaffolding is the only type of scffolding available in Aloe CLI, however, it comes ready built for both APIs and web apps. + +### auth scaffolding + +This will generate views, controllers, routes and models required for authentication and provide your app with working authentication in only one command. + +```bash +$ php leaf scaffold:auth + +Description: + Scaffold basic app authentication + +Usage: + scaffold:auth [options] + +Options: + -s, --session Use session/session + JWT instead of just JWT + -a, --api Use JWT for authentication +``` + +**Note that aloe will automatically use the session version on Leaf MVC and the api version on Leaf API.** + +## Next Steps + +- [DB Commands](/aloe-cli/v/1.2.3/commands/db-commands) +- [Custom commands](/aloe-cli/v/1.2.3/commands/custom) +- [Commands IO](/aloe-cli/v/1.2.3/commands/io) +- [Creating Libraries](/aloe-cli/v/1.2.3/libraries) diff --git a/apps/docs/src/aloe-cli/v/1.2.3/getting-started/index.md b/apps/docs/src/aloe-cli/v/1.2.3/getting-started/index.md new file mode 100755 index 0000000..bcd7fe8 --- /dev/null +++ b/apps/docs/src/aloe-cli/v/1.2.3/getting-started/index.md @@ -0,0 +1,171 @@ +# Aloe CLI: Getting Started + +::: tip Note +If you're using Leaf MVC or Leaf API, you can skip this page. +::: + +Aloe CLI is a smart CLI that takes care of a lot of a whole lot of time consuming tasks during your development, allowing you to focus only on important stuff. + +**Aloe is based on the symfony console, with that, all symfony commands are also valid aloe commands and can be called through the aloe cli.** + +*Currently, Aloe is only fully supported by Leaf MVC and Leaf API, as some commands may not work on other setups.* + +For better support if you're not using Leaf MVC or Leaf API, you'll need to install Leaf MVC Core which contains all of Leaf's MVC utilities including a special autoloader and configuration... + +```bash +leaf install mvc-core +``` + +Or with composer: + +```bash +composer require leafs/mvc-core +``` + +## Installation + +After installing MVC Core, you can install Aloe with leaf CLI. + +```bash +leaf install aloe +``` + +Or with composer: + +```bash +composer require leafs/aloe +``` + +## Setup + +After installing aloe, you need to set it up so you can run commands like `php leaf ...`. To do this, simply create a file with the name you want to run in your console. eg: To run commands using `php console ...`, you'll need to create a file named `console`. With Leaf API and Leaf MVC, this file is named `leaf` which is the reason you run commmands with `php leaf ...`. We'll name this file `poison` which means we'll run commands like `php poison serve` + +In the `poison` file, we need to do a couple of things: + +- Bring in composer's autoloader +- Bring in a custom autoloader to dynamically require your migrations, seeds and other files when they're directly initialized in the CLI. +- Bring in our env variables +- Finally, load up aloe and it's commands + +The setup used in Leaf MVC looks like this: + +```php +#!/usr/bin/env php + 'app/controllers', + 'modelsPath' => 'app/models', + 'migrationsPath' => 'app/database/migrations', + 'seedsPath' => 'app/database/seeds', + 'factoriesPath' => 'app/database/factories', + 'helpersPath' => 'app/helpers', + 'viewsPath' => 'app/views', + 'configPath' => 'config', + 'storagePath' => 'storage', + 'commandsPath' => 'app/console', + 'routesPath' => 'app/routes', + 'libPath' => 'lib', + 'publicPath' => 'public', + 'databaseStoragePath' => 'storage/app/db' +]); +``` + +This config tells aloe where to find everything it needs to get going. Under the hood, any work needed will be done for you. From here, it's simply a matter of adding our env, initializing our database and aloe. + +```php +/* +|-------------------------------------------------------------------------- +| Bring in (env) +|-------------------------------------------------------------------------- +| +| Quickly use our environment variables +| +*/ +try { + \Dotenv\Dotenv::createUnsafeImmutable(__DIR__)->load(); +} catch (\Throwable $th) { + trigger_error($th); +} + +/* +|-------------------------------------------------------------------------- +| Additional Leaf Database Config +|-------------------------------------------------------------------------- +| +| Load leaf database configuration +| +*/ +Leaf\Database::config(DatabaseConfig()); +Leaf\Database::connect(); + +/* +|-------------------------------------------------------------------------- +| Initialise Leaf CMD +|-------------------------------------------------------------------------- +| +| Initialise aloe CLI +| +*/ +$console = new \Aloe\Console("Leaf MVC", "v3.0"); + +/* +|-------------------------------------------------------------------------- +| Add commands +|-------------------------------------------------------------------------- +| +| Add custom commands +| +*/ +$console->register(\App\Console\ExampleCommand::class); + +/* +|-------------------------------------------------------------------------- +| Run The console Application +|-------------------------------------------------------------------------- +| +| Transport water and dissolved substances to the rest of Leaf😂 +| +*/ +$console->run(); +``` + +Leaf API's config includes a little twist which lets Aloe run in API first mode. Which means aloe will run the API centered version of commands if available. + +```php +\Aloe\Command\Config::$env = "API"; +``` + +So depending on your use case, the API commands may be of more use. + +## Next Steps + +- [DB Commands](/aloe-cli/v/1.2.3/commands/db-commands) +- [Custom commands](/aloe-cli/v/1.2.3/commands/custom) +- [Commands IO](/aloe-cli/v/1.2.3/commands/io) +- [Creating Libraries](/aloe-cli/v/1.2.3/libraries) diff --git a/apps/docs/src/aloe-cli/v/1.2.3/index.md b/apps/docs/src/aloe-cli/v/1.2.3/index.md new file mode 100644 index 0000000..b62439b --- /dev/null +++ b/apps/docs/src/aloe-cli/v/1.2.3/index.md @@ -0,0 +1,113 @@ +# Sunset Aloe (BETA) + +v1.1 beta is the secomd release of Aloe CLI which introduces full support for Leaf MVC, new features, better support for custom libraries and so much more. Sunset Aloe also introduces integrations with Leaf Auth, creating a scaffold option to make authentication available in your app with only 1 command. + +## What's new + +### Better Leaf MVC support + +Sunset Aloe is the first version of Aloe integrated out of the box with Leaf MVC. As such, it ships a tight integration with Leaf MVC and the already made integrations that come with Leaf API. So now, your Leaf MVC CLI is powered by aloe. + +### Auth Scaffolding + +Sunset also includes auth scaffolding which simply allows you to add basic session based auth (login, signup, update profile and guards) to your app by simply running one command. + +```bash +php leaf scaffold:auth +``` + +### Updated Stubs + +These are basic templates generated when you run commands like `g:controller`. These templates have been updated to keep you up to date with both internal and external updates from Leaf API and Leaf MVC. + +### Aloe Installer Class + +Another major update to Aloe is the inclusion of Aloe Installer which basically takes the stress out of making libraries which need to install files/routes in the working directory. + +```php +use Aloe\Installer; + +Installer::magicCopy($folderToInstall); +Installer::installRoutes("$folderToInstall/routefiles/"); +``` + +**Installer currently only supports Leaf MVC and Leaf API.** + +### Updated Packages + +All dependencies of Aloe have been updated. This includes security patches and a bunch of updates to keep aloe up to date. Also, the core library behind aloe, symfony console has been updated as well, however, we do our best to maintain Aloe CLI's syntax, structure and config, so despite all the updates and external changes, the Aloe you know never changes. + +### Protected command methods + +To match the symfony console, Aloe also uses protected command methods in this version. + +```php +protected function config() +{ + $this + ->setArgument("argument", "optional", "argument description") + ->setOption("option", "o", "required", "option description"); +} + +protected function handle() +{ + $this->comment( + "example command's output {$this->argument('argument')} {$this->option('option')}" + ); +} +``` + +## Aloe List + +```bash +Leaf MVC v2.0 + +Usage: + command [options] [arguments] + +Options: + -h, --help Display help for the given command. When no command is given display help for the list command + -q, --quiet Do not output any message + -V, --version Display this application version + --ansi Force ANSI output + --no-ansi Disable ANSI output + -n, --no-interaction Do not ask any interactive question + -v|vv|vvv, --verbose Increase the verbosity of messages: 1 for normal output, 2 for more verbose output and 3 for debug + +Available commands: + example example command's description + help Displays help for a command + interact Interact with your application + list Lists commands + serve Start the leaf development server + aloe + aloe:config Install aloe config + app + app:down Place app in maintenance mode + app:up Remove app from maintenance mode + d + d:command Delete a console command + d:controller Delete a controller + d:factory Delete a model factory + d:migration Delete a migration + d:model Delete a model + d:seed Delete a model seeder + db + db:install Create new database from .env variables + db:migrate Run the database migrations + db:rollback Rollback all database migrations + db:seed Seed the database with records + env + env:generate Generate .env file + g + g:command Create a new console command + g:controller Create a new controller class + g:factory Create a new model factory + g:helper Create a new helper class + g:migration Create a new migration file + g:model Create a new model class + g:seed Create a new seed file + g:template Create a new view file + scaffold + scaffold:auth Scaffold basic app authentication +``` diff --git a/apps/docs/src/aloe-cli/v/1.2.3/installer.md b/apps/docs/src/aloe-cli/v/1.2.3/installer.md new file mode 100644 index 0000000..d2147d2 --- /dev/null +++ b/apps/docs/src/aloe-cli/v/1.2.3/installer.md @@ -0,0 +1,56 @@ +# Aloe Installer + +Aloe installer allows you to quickly install files and routes from your library into the working directory. Aloe installer currently only suports Leaf MVC and Leaf API. + +To get started with Aloe installer, just import the package into your app or directly use the method you want to use directly. + +```php +use Aloe\Installer; + +// or + +Aloe\Installer::method(); +``` + +## Magic Copy + +This method allows you to auto-magically copy all files and folders from a specified folder into Leaf workspace. + +```php +Aloe\Installer::magicCopy("package/to/install"); +``` + +Consider the following directory structure: + +```bash +C:. +└───Auth + ├───Controllers + ├───Routes + └───Views +``` + +To copy our controllers, routes and views, we simply need to point `magicCopy` to the auth directory. + +```php +Aloe\Installer::magicCopy("package/Auth"); +``` + +This will copy the sub directories in Auth to the `App` folder in the working directory. + +## Install Routes + +Similarly, you can also automatically install routes from your package routes in your app after you've copied them into the working routes directory. + +Installing routes involves referencing routes files in the main route file. + +```php +Aloe\Installer::installRoutes("package/Auth/Routes"); +``` + +## Next Steps + +- [g Commands](/aloe-cli/v/1.2.3/commands/g-commands) +- [Custom commands](/aloe-cli/v/1.2.3/commands/custom) +- [Commands IO](/aloe-cli/v/1.2.3/commands/io) +- [db commands](/aloe-cli/v/1.2.3/commands/db-commands) diff --git a/apps/docs/src/aloe-cli/v/1.2.3/libraries.md b/apps/docs/src/aloe-cli/v/1.2.3/libraries.md new file mode 100755 index 0000000..bb11a86 --- /dev/null +++ b/apps/docs/src/aloe-cli/v/1.2.3/libraries.md @@ -0,0 +1,22 @@ +# Aloe CLI: Libraries + +This section talks about using and creating libraries for Aloe CLI, as well as some best practices in terms of custom libraries. + +## Plugging in libraries + +As seen in [registering commands](/aloe-cli/v/1.2.3/commands/custom?id=registering-commands), Aloe provides a neat `register` method which allows you to extend aloe's command range. Aloe libraries usually take advantage of this to return an array instead of manually returning commands one by one. + +```php +$console->register(\Aloe\UI::commands()); +``` + +## Creating your own libraries + +Aloe libraries simply serve a bunch of commands to the Aloe CLI. ALoe CLI has full support for Symfony console commands, so all symfony commands can also be run through Aloe CLI. After defining all your commands, you can simply return all their classes as an array to be registered. + +## Next Steps + +- [Installer](/aloe-cli/v/1.2.3/installer) +- [Custom commands](/aloe-cli/v/1.2.3/commands/custom) +- [Commands IO](/aloe-cli/v/1.2.3/commands/io) +- [db commands](/aloe-cli/v/1.2.3/commands/db-commands) diff --git a/apps/docs/src/changes.md b/apps/docs/src/changes.md new file mode 100644 index 0000000..e5f49ed --- /dev/null +++ b/apps/docs/src/changes.md @@ -0,0 +1,929 @@ + +# Changelog + +## v3.4.0 - 🥀 Hello Darkness - 19 May 2023 + +### Added + +- Added support for library scripts +- Added Eien config +- Added support for named middleware + +### Changed + +- Moved ALL error handling responsibilities to `\Leaf\Exception` + +### Removed + +- Moved module initializers to scripts + +## v3.3.1 - 🌺 Midnight Wine '1' - 11 Mar 2023 + +### Fixed + +- Patched up `app` config resetting after new values are added +- Improved performance of application config setting on first instance + +## v3.3.0 - 🌺 Midnight Wine - 27 Feb 2023 + +### Added + +- Added support for Eien websockets + +### Fixed + +- Hard set status on CSRF error +- Fixed non-static methods error + +### Changed + +### Removed + +- Removed obsolete code + + + +## v3.2.2-beta - 🌺 Viola “Black Delight” [Eien Compat Build 2] - 25 Dec 2022 + +### Added + +- Added support for Eien websockets + +### Fixed + +- Fixed non-static methods error +- Fixed issue with CSRF error + +### Removed + +- Removed obsolete code + +## v3.2.0 - 🌺 Viola “Black Delight” - 3 Oct 2022 + +### Added + +- Made leaf config reactive + +### Fixed + +- Fixed issue [`debug = false` not working as expected](https://github.com/leafsphp/leaf/issues/152) +- Fixed issue with setRequestClass +- Updated references to renamed methods + +### Changed + +- Updated leaf modules +- Removed version constraints from modules +- Updated tests + +### Removed + +- Removed obsolete methods + +## v3.1.1 - 🌷 Cantor Black '1' - 10 Sep 2022 + +### Fixed + +- [Fix error: Cannot use Container as array](https://github.com/leafsphp/leaf/commit/9d51e6bfc8a246d688ad8848f17cdf7eddaaf8e5) + +### Changed + +- Updated Leaf Http + +## v3.1.0 - 🌷 Cantor Black - 11 Aug 2022 + +### Added + +- Allow custom response object +- Allow custom request object + +## v3.0 - 👸🏼 Queen Of The Night - 15 Apr, 2022 + +### Added + +- Added support for global functions +- Added unit tests +- Added pestphp +- Added more support for configuring with env variables. +- Added `script` method on `app` to handle modes. +- Added automatic loading for major modules. +- Added CSRF handler. +- Added autoloading for the CSRF module +- Added CORS handler for `leafs/cors` +- Updated error pages +- Added `.env` precedence over local config +- Added support for recursive config +- Added support for nested config +- Added support for custom setting groups +- Switched to leaf exceptions + +### Fixed + +- Fixed PHP 7.3 unsupported types +- Created a standard for functional mode +- Revamped error pages +- Fixed potential type errors +- Fixed malformed JWT error on auth module +- Added single state for container settings and leaf config +- Fixed breaks in PHP 8+ + +### Changed + +- You no longer need to initialize Leaf. +- Moved `Leaf\Http` namespace to HTTP module +- Moved base controller, model, database and to `mvc-core` module +- Disabled logging by default +- Moved bareui, fs, auth, form, cookies, session, db and date into modules +- Moved `Leaf\Router` into installable modules. +- Changed leaf router `add` to `use` +- Tied leaf router directly to `Leaf\App` +- Upgraded all dependencies +- Added strict types + +### Removed + +- Removed unused dependencies +- Removed experimental features +- Removed unused initializers +- Removed `evadeCors` method on leaf +- Removed `Leaf\Router::getRequestMethod` +- Removed unnecessary code to improve performance +- Removed app instance on middleware +- Removed unused helper functions +- Removed leftover files from clean up + +## v3.0 (Release Candidate 2) - 👸🏼 Queen Of The Night (RC 2) - 27 Jan, 2022 + +### Added + +- Added support for global functions +- Added unit tests +- Added pestphp +- Added more support for configuring with env variables. +- Added `script` method on app to handle modes. +- Added automatic loading for major modules. +- Added CSRF handler. +- Added autoloading for CSRF module +- Added CORS handler for `leafs/cors` +- Updated error pages +- Added `.env` precedence over local config +- Added support for recursive config +- Added support for nested config +- Added support for custom setting groups +- Switched to leaf exceptions + +### Fixed + +- Fixed PHP 7.3 unsupported types +- Created a standard for functional mode +- Revamped error pages +- Fixed potential type errors +- Fixed malformed JWT error on auth module +- Added single state for container settings and leaf config +- Fixed breaks in PHP 8+ + +### Changed + +- You no longer need to initialize Leaf. +- Moved `Leaf\Http` namespace to Http module +- Moved base controller, model, database and to mvc-core module +- Disabled logging by default +- Moved bareui, fs, auth, form, cookies, session, db and date into modules +- Moved `Leaf\Router` into installable module. +- Changed leaf router `add` to `use` +- Tied leaf router directly to `Leaf\App` +- Upgraded all dependencies +- Added strict types + +### Removed + +- Removed unused dependencies +- Removed experimental features +- Removed unused initializers +- Removed `evadeCors` method on leaf +- Removed `Leaf\Router::getRequestMethod` +- Removed unnecessary code to improve performance +- Removed app instance on middleware +- Removed unused helper functions +- Removed left over files from clean up + +## v3.0 (Beta) - 27 November + +### Added + +- Added support for global functions +- Added more support for configuring with env variables. +- Added `script` method on app to handle modes. +- Added automatic loading for major modules. +- Added CSRF handler. +- Added autoloading for CSRF module +- Added CORS handler for `leafs/cors` +- Updated error pages +- Added `.env` precedence over local config + +### Fixed + +- Fixed PHP 7.3 unsupported types +- Created a standard for functional mode +- Revamped error pages +- Fixed potential type errors + +### Changed + +- You no longer need to initialize Leaf. +- Moved `Leaf\Http` namespace to Http module +- Moved base controller, model, database and to mvc-core module +- Disabled logging by default +- Moved bareui, fs, auth, form, cookies, session, db and date into modules +- Moved `Leaf\Router` into installable module. +- Changed leaf router `add` to `use` +- Tied leaf router directly to `Leaf\App` +- Upgraded all dependencies + +### Removed + +- Removed unused dependencies +- Removed experimental features +- Removed unused initializers +- Removed `evadeCors` method on leaf +- Removed `Leaf\Router::getRequestMethod` +- Removed unnecessary code to improve performance +- Removed app instance on middleware +- Removed unused helper functions + +## v3.0 (Alpha) - 👸🏼 Queen Of The Night + +### Added + +- Added support for global functions +- Added more support for configuring with env variables. +- Added `script` method on app to handle modes. +- Added automatic loading for major modules. +- Added CSRF handler. +- Added autoloading for CSRF module +- Added CORS handler for `leafs/cors` +- Updated error pages +- Added `.env` precedence over local config + +### Fixed + +- Fixed PHP 7.3 unsupported types +- Created a standard for functional mode +- Revamped error pages +- Fixed potential type errors + +### Changed + +- You no longer need to initialize Leaf. +- Moved `Leaf\Http` namespace to Http module +- Moved base controller, model, database and to mvc-core module +- Disabled logging by default +- Moved bareui, fs, auth, form, cookies, session, db and date into modules +- Moved `Leaf\Router` into installable module. +- Changed leaf router `add` to `use` +- Tied leaf router directly to `Leaf\App` +- Upgraded all dependencies + +### Removed + +- Removed unused dependencies +- Removed experimental features +- Removed unused initializers +- Removed `evadeCors` method on leaf +- Removed `Leaf\Router::getRequestMethod` +- Removed unnecessary code to improve performance +- Removed app instance on middleware +- Removed unused helper functions + +## v2.6.0 - ⚰️ The Goodbye Flower - 20th September, 2021 + +### Added + +- Added UUID support to Leaf Auth +- Added support for custom id keys in Leaf Auth + +### Fixed + +- Fixed Request::getUrl +- Fixed issue [#53](https://github.com/leafsphp/leaf/issues/53) +- Fixed Database + +### Removed + +- Removed Leaf blade component + +## v2.5.1 - 💠 Lilac - 30th May, 2021 + +### Fixed + +- Fixed PHP 7.3 unsupported types +- Fixed server base path on router +- Fixed bare UI config method +- Fixed faker namespace + +### Changed + +- Removed BETA flag from Leaf password helper + +### Removed + +- Removed Leaf blade component + +## v2.5.0 - 💠 Gladiolus - 27th April, 2021 + +### Added + +- Leaf debug now controls error reporting (you don't want nasty errors showing in production) +- Added `Request::try` +- Added `app.down` config +- Added Leaf app instance on `Config` +- Added grouped namespaces to router +- Added single route namespaces +- Added named routes to router +- Added router `push` for switching between pages +- Added more customizations on `Leaf\Database` +- Added simple flash messaging with `Leaf\Flash` +- Added `flash` method to session +- Added HTTP caching on `Leaf\Http\Headers` + +### Fixed + +- Fixed inverted condition for showing default development/production error pages. +- Fixed router hooks +- Added proper types on `App` and `Router` +- Added proper controller and missing method warnings +- Fixed incorrect method labeling +- Fixed HTTP caching issues +- Fixed app logger and app log writer +- Fixed app break after non-existent middlware call + +### Changed + +- Switched debugging controls from `mode` to `debug` +- Default 404 page now automatically loaded +- Router middleware `App` instance now automatically loaded +- Added null response for unset session variables +- Leaf error handler now loads on `App` init +- Default error 500 handler now automatically loaded +- Updated leaf container + +### Removed + +- Removed unnecessary code from `App` +- Removed app name +- Removed `view` method on app and router +- Removed previous hook support on app +- Removed unused router config +- Removed Leaf environment class +- Removed unused default middleware +- `Leaf\Blade` no longer comes with Leaf by default. +- Removed `status` and `contentType` on Leaf\App + +## v2.5.0-beta - 💠 Gladiolus (BETA) - 16th April, 2021 + +### Added + +- Added `app.down` config +- Added Leaf app instance on `Config` +- Added grouped namespaces to router +- Added named routes to router +- Added router group prefixes +- Added router `push` for switching between pages +- Added more customizations on `Leaf\Database` +- Added simple flash messaging with `Leaf\Flash` +- Added `flash` method to session +- Added HTTP caching on `Leaf\Http\Headers` + +### Fixed + +- Fixed router hooks +- Added proper types on `App` and `Router` +- Added proper controller and missing method warnings +- Fixed incorrect method labeling +- Fixed HTTP caching issues +- Fixed app logger and app log writer +- Fixed app break after non-existent middlware call + +### Changed + +- Default 404 page now automatically loaded +- Router middleware `App` instance now automatically loaded +- Added null response for unset session variables +- Leaf error handler now loads on `App` init +- Default error 500 handler now automatically loaded +- Updated leaf container + +### Removed + +- Removed unnecessary code from `App` +- Removed app name +- Removed `view` method on app and router +- Removed previous hook support on app +- Removed unused router config +- Removed Leaf environment class +- Removed unused default middleware +- `Leaf\Blade` no longer comes with Leaf by default. +- Removed `status` and `contentType` on Leaf\App + +## v2.4.4 - 🎋 Common Reed - 23rd March 2021 + +### Added + +- Added `Leaf\Config` for easier configuration +- Added new leaf config options +- Added `Leaf\View` +- Added support for multiple template engines concurrently +- Added BareUI templating engine + +### Fixed + +- Internal code improvements on App + +### Changed + +- No renames, restructures, ... + +### Removed + +- No removals + +## v2.4.3 - 🎋 Giant Cane Grass - 26th February 2021 + +### Added + +- Updated `Leaf\Db` and `Leaf\Auth` to throw dev errors to Leaf's error handler for better error reporting + +### Fixed + +- Organized methods in `Leaf\FS` + +### Changed + +- Made `Leaf\Http\Response` static +- Made `Leaf\Http\Request` static + +### Removed + +- No removals + +## v2.4.2 - 🥬 Desert Wishbone-bush - 3rd February 2021 + +This version of Leaf continues the goal of making Leaf features more flexible and increasing usability. + +### Added + +- Added option to turn off experimental method warnings + +- Added `Form::rule` which allows you to create your own rules for form validation. + +```php +Form::rule("max", function ($field, $value, $params) { + if (strlen($value) > $params) { + Form::addError($field, "$field can't be more than $params characters"); + return false; + } +}); +``` + +- Added internal `Leaf\Form` feature which allows you to pass parameters to validation rules. + +```php +$validation = Form::validate([ + // To pass a param to a rule, just use : + "username" => "max:3", +]); +``` + +- Added `Form::addError` which allows you to add errors to be returned in `Form::errors()` + +```php +Form::addError($field, "$field can't be more than $params characters"); +``` + +- Added max and min rules by default + +```php +$validation = Form::validate([ + "username" => "max:1", + "password" => "min:81", +]); +``` + +- Guards can be used even in API mode. This will alert you if you're not eligible to view a particular page. + +### Fixed + +- Updated dependencies with security patches + +- Fixed multiple validation break from v2.4.2 beta. + +### Changed + +- Made `Leaf\Form` methods static. They can now be called from anywhere within your Leaf app. + +### Removed + +- No removals + +## v2.4.2 [BETA] - 🥬 Desert Wishbone-bush (Beta) - 20th January 2021 + +This release mainly focuses on security patches for all Leaf based libraries. It contains updated dependencies and internal code patches to make your apps even more secure. + +### Added + +- No additions + +### Fixed + +- Updated dependencies with security patches + +### Changed + +- Made `Leaf\Auth` methods static. They can now be called from anywhere within your Leaf app. + +### Removed + +- No removals + +## v2.4.1 - 🍁 Marvel-of-peru - 12th January 2020 + +v2.4.1 continues the usability reforms from the previous versions. It also contains fixes for all bugs discovered in previous versions as well as new features. + +**Please update from v2.4.0 to v2.4.1 to fix any issues you encountered with the system. Any inconveniences are deeply regretted🙏.** + +### Added + +- Added support for session based authenticatication instead of just JWT +- Added `Route::view` + +### Fixed + +- Fixed all known bugs from previous versions + +### Changed + +- Separated Router module from app module +- Made all `Leaf\Http\Session` methods static + +### Removed + +- Removed app down feature + +## v2.4.0 - Christmas Tree🎄 - 18th December 2020 ***DELETED*** + +**Please update from v2.4.0 to v2.4.1 to fix any issues you encountered with this version. Any inconveniences are deeply regretted🙏. This release has officially been deleted.** + +Christmas tree follows up on the previous beta release, fixes up all bugs found during the beta testing phase and packs in newer extensions that make Leaf even more usable. + +### Added + +- Added base factory class for Leaf MVC, Leaf API and Skeleton +- Added new auth setting options + +### Fixed + +- Fixed `Leaf\Db` callstack not clearing +- Fixed `Auth::update` db errors +- Fixed `Auth::update` including current user in uniques check +- Fixed password verify method params + +### Changed + +- Switched default password encryption to `PASSWORD_DEFAULT` (bcrypt by default) +- Auth now relies on Leaf password helper for everything password related +- Standardized all `where` type methods on `Leaf\Db` +- Seperated password encoding and password verifying settings in `Leaf\Auth` +- Switched password helper methods to camelCase +- Switched password `salt` with `spice` to add additional security to passwords + +### Removed + +- Removed unnecessary methods from password helper + +## v2.4.0 - BETA - 30th November, 2020 + +Unlike previous versions, this version of Leaf is focusing on improving the use of existing features, rather than just pumping new magic into Leaf. It has a lot of bug fixes, standardization of method names and overall upgrades. + +### Added + +- Added `App::evadeCors` +- Added `App::routes` to preview all routes +- Added `Db::first()` +- Leaf DB can now detect query type even when `query` +- Added `orWhere`, `whereLike`, `orWhereLike` `like`, `orLike`, `orderBy`, `all` `limit` and LIKE helpers to Leaf Db +- Added new format to `Date::now` +- Added `Auth::update` +- Added custom token lifetime support on `Auth` + +### Fixed + +- Fixed login bug with `Auth::currentUser` +- Fixed Leaf DB same value bug +- Minor fixes on `Auth::login` and `Auth::register` + +### Changed + +- Switched methods to camel case +- Renamed `Auth::useToken` to `Auth::id` +- Renamed `Auth::currentUser` to `Auth::user` +- Made `Helpers\JWT` and `Helpers\Authentication` methods static + +### Removed + +- Removed `Form::isEmpty` and `Form::isNull` +- Removed deprecated methods from `Response` +- Removed deprecated methods from `Date` + +## v2.3.0 - Lucky Charm🍀 - Aug 15, 2020 + +### Added + +- Added Leaf\Auth::useToken +- Added Leaf\FS::upload_file +- Added manual init to Leaf\Session +- Added option for status code messages +- Added callable utils +- Added session encoding/decoding +- Leaf\Http\Request now catches files passed into request +- Added Leaf\Http\Request::typeIs +- Leaf\Http\Request::get can now return multiple request data at once +- Added Leaf\Http\Request::files +- New Leaf\Http\Headers package +- More untracked additions + +### Fixed + +- fixed Leaf\Http\Headers +- Fixed response http status codes bug +- Fixed header integration with response +- Fixed header reliance on Set +- Fixed throwErr code error +- Fixed Leaf\Session package +- Fixed response redirect +- Fixed Leaf\Http\Request::body bugs +- Sessions return false instead of throwing errors (Fix for web apps) +- FS returns false instead of throwing errors +- Fixed up Leaf\Http\Request::params +- Fixed up Leaf\Http\Request::hasHeader +- Fixed up header related methods on Leaf\Http\Request +- Fixed bugs on Leaf\Environment +- More untracked fixes + +### Changed + +- Switched Leaf\Session to native PHP sessions +- Switched session package in Leaf\App +- Changed controller file uploads to Leaf\FS +- Leaf\Date methods can now be called static-ly +- Switched Leaf\Date methods to camel case, but- with backward compatability for snake_case +- Made all Leaf\FS methods static + +### Removed + +- Removed old session code +- Removed setEncryptedCookie and getEncryptedCookie- on Leaf\App +- Slashed unnecessary code from Leaf\Http\Request +- Slashed unnecessary code from Leaf\Http\Session +- Slashed unnecessary code from Leaf\Http\Cookie +- Slashed unnecessary code from Leaf\Http\Response +- Removed all method type tests from Leaf\Http\Request + +## v2.2.0 - Angel's Trumpet - Jul 7, 2020 + +### Added + +- Added `Leaf\Auth::currentUser` +- Added new cookies package relying on PHP's setcookie + +### Fixed + +- fixed hidden fields on Leaf\Auth::login +- Fixed multiple-request type data on get and body at Leaf\Http\Request + +### Changed + +- Switched cookies package in Leaf\Http\Response +- Switched cookies package in Leaf\App + +### Removed + +- Removed old cookies package and all it's methods +- Removed setEncryptedCookie and getEncryptedCookie on Leaf\App +- Slashed unnecessary code from Leaf\Http\Request + +## v2.1.0 - Elderberry - 19th June, 2020 + +### Added + +- Added `Leaf\Auth::auto_connect` +- Added default bypass for CORS errors +- Added `Mysqli::auto_connect` +- Added optional `db_type` option to `Leaf\Db\PDO` connection +- Added `PDO::auto_connect` +- Added deprecation warning for `Leaf\Db\PDO` + +### Fixed + +### Changed + +### Removed + +- Removed Leaf\Wynter + +## v2.1.0 - alpha - 24th May, 2020 + +### Added + +- Added Route::resource +- Added Session::retrieve + +### Fixed + +### Changed + +- Seperated Leaf Veins from Leaf Package +- Renamed Session::getBody to Session::body + +### Removed + +- Removed Leaf\View + +## v2.0 - official - 21st April, 2020 + +### Added + +- Added Leaf Mail +- Added Date::days_ago +- Added Date::months_ago +- Added Date::years_ago +- Added Date::day +- Added Date::month +- Added Date::year +- Added Auth::setSecretKey +- Added Auth::getSecretKey +- Added Auth::validate +- Added Leaf JS Scripts [BETA] +- Added Leaf Envryption Helper [BETA] +- Added Leaf Password Helper [BETA] +- Added secret key for token encryption in Leaf Authentication + +### Fixed + +- Fixed Request::params +- Fixed Request::getBody +- Fixed Request Method Tests +- Fixes to Auth::validateToken +- Fixed bugs with Leaf DB packages +- Fixed bugs on Auth::login and register +- Fixed base64 security issues on Leaf Token [BETA] +- Fixes on Form::isEmpty and isNull + +### Changed + +- Renamed Request `getBody` to `body` +- Switched all `Date` methods to `snake_case` +- Switched `FS` methods to `snake_case` +- Shortened `Date` method names (Find out more in the [docs](https://leafphp.netlify.com/)) +- Made Leaf Authentication a helper (Leaf\Helper\Authentication) + +### Removed + +- Removed Response::count +- Removed Response::getIterator +- Removed Response header offeset methods + +## v2.0 - beta - 11th March, 2020 + +### Added + +- Added DB->choose +- Added DB->add +- Added Auth->login +- Added Auth->register +- Added Session->unset +- Added custom constructor to response +- Added Response->messages(Http codes) +- Added Response->setStatus/getStatus/status +- Added Response->setHeader/getHeader/header +- Added Response->setCookie/deleteCookie +- Added Response->redirect +- Added Request type checks +- Added Request->cookies +- Added Request->headers +- Added Response Helpers +- Added Leaf\Headers +- Added Leaf\Cookies +- Added ContentTypes Middleware +- Added Flash messaging Middleware +- Added PrettyExceptions Middleware +- Added Logwriter and Log +- Added Leaf View +- Merged the Leaf Veins Templating engine and Leaf Core +- Added Support for blade templating with Leaf Blade +- Added support for more request types on Leaf::Request +- Added Form::validateField +- Provided security against XSS +- Added Form::submit + +### Fixed + +- Fixed SESSION->id +- Fixed headers bug with Response->respondWithCode +- Fixed headers bug with Response->throwErr + +### Changed + +- Changed Leaf\Core namespace to Leaf +- Changed Session->remove to Session->unset + +### Removed + +- Removed Auth->basicLogin +- Removed Auth->emailLogin +- Removed Auth->basicRegister + +## v1.5.0 - 11th December, 2019 + +### Added + +- Added FS->deleteFolder +- Added FS->deleteFile +- Added Form->validate😅 +- Added Form->validate and return errors to base controllers +- Added Leaf\Core\Str: equivalent of Illuminate\Support\Str with added methods +- Added Leaf Mysqli🤔 +- Added Leaf PDO🤔 +- Added Leaf\Core\Auth: simple login and signup + +### Fixed + +- Fixed FS->deleteFile +- Fixed FS->listDir +- Fixed Leaf DB +- Fixed init bug with session + +### Changed + +- Renamed Veins->renderTemplate to render +- Rename veins->assign to set() +- Renamed mkdir to createFolder +- Renamed mkdirInBase to createFolderInBase +- Renamed renameDir to renameFolder +- Changed vein file extension from .vein to .vein.html +- Split Leaf\Config\Db between Leaf\Core\Db\Mysqli and Leaf\Core\Db\PDO +- Changed `renderHtml` to `renderPage` +- Changed all `getParam`s to `get` + +### Removed + +Nothing was removed + +## v1.4.2 - 13th November, 2019 + +### Added + +- Added FileSystem module +- Added `mysqliQuery` method to `leaf\config\db` +- Added a bunch of handy session methods +- Added leaf token +- Added leaf form + +### Fixed + +- Fixed a few problems with `leaf\config\db`; +- Fixed tiny bug with `response->throwErr` + +### Changed + +- Changed `leaf\config\db`: connection variables and connection type are set on db init. `$db = new db($host, $user, $password, $dbname, "PDO")` +- Renamed renderHtmlPage to renderHtml + +### Removed + +- Leaf\Config\DB has been depricated for now + +## v1.4.1 - 1st November, 2019 + +### Added + +- Added base Leaf Controller `Leaf\Core\Controller` +- Added base controller for APIs: `Leaf\Core\ApiController` +- Added base Leaf Model `Leaf\Core\Model` +- Added support for full MVC app +- Added [Leaf Veins](https://github.com/leafsphp/veins) in default Leaf package +- Added Error Handling for development and production +- Added a base database layer connected with custom environment variables + +### Fixed + +- Fixed bug with `Response::renderHtmlPage()` +- Fixed the HTTP code rendering in the browser from `Response::respondWithCode` + +### Changed + +- Changed `Validation` to `Form` + +### Removed + +- Removed Leaf `Exceptions` +- Removed Middleware interfaces diff --git a/apps/docs/src/coc/index.md b/apps/docs/src/coc/index.md new file mode 100644 index 0000000..14e64a8 --- /dev/null +++ b/apps/docs/src/coc/index.md @@ -0,0 +1,45 @@ +# Code Of Conduct + +## Our Pledge + +In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, sex characteristics, gender identity and expression, level of experience, education, socio-economic status, nationality, personal appearance, race, religion, political party, or sexual identity and orientation. Note, however, that religion, political party, or other ideological affiliation provide no exemptions for the behavior we outline as unacceptable in this Code of Conduct. + +## Our Standards + +Examples of behavior that contributes to creating a positive environment include: + +- Using welcoming and inclusive language +- Being respectful of differing viewpoints and experiences +- Gracefully accepting constructive criticism +- Focusing on what is best for the community +- Showing empathy towards other community members + +Examples of unacceptable behavior by participants include: + +- The use of sexualized language or imagery and unwelcome sexual attention or advances +- Trolling, insulting/derogatory comments, and personal or political attacks +- Public or private harassment +- Publishing others' private information, such as a physical or electronic address, without explicit permission +- Other conduct which could reasonably be considered inappropriate in a professional setting + +## Our Responsibilities + +Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior. + +Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful. + +## Scope + +This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers. + +## Enforcement + +Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at mychi@leafphp.dev. All complaints will be reviewed and investigated and will result in a response that is deemed necessary and appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately. + +Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership. + +## Attribution + +This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html + +[homepage]: https://www.contributor-covenant.org diff --git a/apps/docs/src/codelabs/contributing.md b/apps/docs/src/codelabs/contributing.md new file mode 100644 index 0000000..8c7e3de --- /dev/null +++ b/apps/docs/src/codelabs/contributing.md @@ -0,0 +1,94 @@ + + +# Contributing + +## What we are looking for + +The Codelab section gives developers examples to work off of that both cover common or interesting use cases, and also progressively explain more complex detail. Our goal is to move beyond a simple introductory example, and demonstrate concepts that are more widely applicable, as well as some caveats to the approach. + +If you're interested in contributing, please initiate collaboration by filing an issue under the tag **`codelabs experiment`** with your concept so that we can help guide you to a successful pull request. After your idea has been approved, please follow the template below as much as possible. Some sections are required, and some are optional. Following the numerical order is strongly suggested, but not required. + +Experiments should generally: + +- Solve a specific, common problem +- Start with the simplest possible example +- Introduce complexities one at a time +- Link to other docs, rather than re-explaining concepts +- Describe the problem, rather than assuming familiarity +- Explain the process, rather than just the end result +- Explain the pros and cons of your strategy, including when it is and isn't appropriate +- Mention alternative solutions, if relevant, but leave in-depth explorations to a separate experiment + +We request that you follow the structure below. We understand, however, that there are times when you may necessarily need to deviate for clarity or flow. + +### What Are We Building? required + +1. Define the problem you are trying to solve in a few sentences. +2. Explain the simplest possible solution in a sentence or two. +3. Show a small code sample. + +### Pre-requisites required + +1. List any pre-requisites for this pattern to work. +2. Be sure to link the relevant documentation. + +### Setup for the tutorial required + +Demonstrate how to setup a project for your experiment. This is required for every experiment. + +### Cautions optional + +It's extremely helpful to write add a section about any potential pitfalls or gotchas. This is especially important for more advanced experiments. If you're not sure what to write here, you can leave it out. + +### What to avoid optional + +PHP is a language with many ways to solve a problem, and it's important to explain why you've chosen the approach you have. This section should be used to explain why other approaches are not recommended. This section is not required, but heavily recommended. + +### Custom titles optional + +You can use custom titles for your sections if you feel it helps the flow of your experiment. This is not required, but can be helpful. + +## Template + +We've provided a template below that you can copy and paste into a new file. You can add the details in the sections as you see fit. If you have any questions, please file an issue and we'll be happy to help. If you have an idea for a codelab, please file an issue with the tag **`codelabs experiment`**. + +```md +# Experiment Title + +::: warning Version support +Version support. You should also add if it requires a particular PHP version. +::: + +## What Are We Building? + +You can give an overview followed by a real world example of what you will be doing and how it helps. + +::: details (For beginners) +You can add beginner info in collapsible blocks like this so advanced users don't have to read everything. +::: + +## Pre-requisites + +You need to know this and that to follow this tutorial. +You need to have this and that installed. + +## Setup for the Tutorial + +Add this section only if this tutorial requires a special setup. + +## Cautions (if any) + +Remember to link any relevant document or resource. + +## (Your title for body) + +You can use subtitles and anything you need to convey your tutorial effectively to the user. + +
+ +Experiment by **Name** +``` + +## Thank you + +It takes time to contribute to documentation, and if you spend the time to submit a PR to this section of our docs, you do so with our gratitude. diff --git a/apps/docs/src/codelabs/experiments/auth/api/index.md b/apps/docs/src/codelabs/experiments/auth/api/index.md new file mode 100755 index 0000000..de1675a --- /dev/null +++ b/apps/docs/src/codelabs/experiments/auth/api/index.md @@ -0,0 +1,345 @@ +# API Auth + +::: warning Version support +This experiment supports `v3.0` upwards. +::: + +## What Are We Building? + +Modern web app conventions have led to a lot of web apps relying on AJAX requests to a backend (API) using libraries like [axios](https://github.com/axios/axios). These backend APIs take in json encoded data from the frontend, perform some operations and send back a response. + +In this experiment, we'll be looking at how to create logins, signups and user updates with Leaf v3.0 +. We'll have various requests in JSON form, and some with headers which we'll be using for this experiment. + +::: details Detailed Explanation: A quick look at APIs +*If you know what an API is, you can skip this part* + +***What is an API?*** + +> An Application Programming Interface (API) allows two systems to communicate with one another. - smartbear.com + +For our use case, we can say that our API is the backend of whatever application we are building. Our frontend handles user interactions, however, if the frontend needs to perform an operation that needs data from our database for instance, it sends a request to our backend (API) which then checks and returns a response to our frontend. The frontend then performs an action based on whatever response the API returns. +::: + +::: details Detailed Explanation: JWT Auth Concept +*If you know how JWTs work, you can skip this part* + +***What is a JWT?*** + +> JSON Web Token (JWT) is an open standard (RFC 7519) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object. This information can be verified and trusted because it is digitally signed. - jwt.io + +Basically, you can see this as hashed token containing some specified information token locked with a secret key. JWTs also have expiration times, which means that you can issue a token for a particular timeframe. + +***JWTs in user authentication*** + +- A user's information will be submited to our API +- We check to the credentials against our database and return the user +- We take the encode some unique user info into the JWT and return that to the frontend + +These steps will be explained into details below. You can check the [JWT spec](https://jwt.io/introduction) for more info. +::: + +## Prerequisites + +- To get started with this tutorial, you will first need to set up a leaf 3 application. The easiest way to do this is to use the [Leaf CLI](https://cli.leafphp.dev). + +```sh +leaf create test-app --basic --v3 +``` + +This will generate a simple leaf 3 app with an `index.php` file as well. + +- You will also need basic knowledge on [leaf's router](https://leafphp.dev/docs/routing/) + +## Building Our Login + +Our authentication flow starts with a user entering their credentials on the frontend of an app. This is parsed and sent to the backend (our API) through an [API endpoint](https://smartbear.com/learn/performance-monitoring/api-endpoints/) or route. This means that our first task is to set up a route to handle the data passed into our API. + +We'll use [leaf's core router](https://leafphp.dev/docs/routing/) for this. + +```php +require __DIR__ . "/vendor/autoload.php"; + +app()->post("/login", function () { + // login stuff here +}); + +app()->run(); +``` + +Before we move on, let's give our data from the frontend a structure so we know exactly what we are working with. This app will take in a username and a password defined in this way. + +```js +{ + "username": "mychi", + "password": "password" +} +``` + +Our next task is to get the data passed into our app and cross-check it with the data in our database. If the user credentials are found and match those in our database, we will generate a JWT and attach it to the response along with the user, otherwise, we throw an error. + +We can retrieve the `username` and `password` passed into our app using the leaf request object. + +```php +$data = request()->get(["username", "password"]); +``` + +This grabs the username and password from the request and saves them in the `$data` variable. + +Now, we need to tackle the part that checks the database for the current credentials and generates a JWT if the user is found. Leaf provides an auth module to simply and quickly tackle this. To proceed, we will need to install the auth module. + +Composer: + +```sh +composer require leafs/auth +``` + +Or with leaf CLI: + +```sh +leaf install auth +``` + +After this, we should automatically have access to the `auth()` global. + +::: tip Using leaf auth +When using Leaf auth in a leaf app, you don't need to work with classes and namespaces at all since all of the auth functionality is available on the `auth()` method. You don't even need to initialize it. +::: + +Now, we have our auth module installed, but we still need to connect to our database before we can work with authentication: + +```php +auth()->connect("host", "user", "password", "dbName"); +``` + +eg: + +```php +auth()->connect("127.0.0.1", "root", "", "appDB"); +``` + +Now that we're done with that, let's check our database and generate our token. As usual, leaf provides a simple way of doing this. + +```php +$res = auth()->login("users", $data); +``` + +This single line of code checks for a user in our database, prepares an error if authentication fails, and finally returns the user with a generated JWT if the authentication is successful. + +When the authentication is successful, the `$res` variable above will have the user and the generated JWT. But what happens when authentication fails? When authentication fails, the `$res` variable will be `null`. But how do we know what exactly went wrong? Simple! We can use the `errors` method on leaf auth: + +```php +$res = auth()->login("users", $data); + +if ($res === null) { + response()->throwErr([ + "status" => "failed", + "data" => auth()->errors(), + ], 401); +} +``` + +We are using `response()->throwErr` to break the app with a specified response. This will make sure that the code below it doesn't run just like adding a `return` statement does. + +This handles the error response, but if the authentication is successful, the `$res` variable will contain the user and the generated JWT as mentioned above. + +```php +$res = auth()->login("users", $data); + +if ($res === null) { + response()->throwErr([ + "status" => "failed", + "data" => auth()->errors(), + ], 401); +} + +response()->json([ + "status" => "success", + "data" => $res, +]); +``` + +So, putting all of this together, we'll have something like this: + +```php +connect("host", "user", "password", "dbName"); +auth()->config("PASSWORD_ENCODE", function($password) { + return \CustomPasswordHash::create($password); +}); + +app()->post("/login", function () { + $data = request()->get(["username", "password"]); + $res = auth()->login("users", $data); + + if ($res === null) { + response()->throwErr([ + "status" => "failed", + "data" => auth()->errors(), + ]); + } + + response()->json([ + "status" => "success", + "data" => $res, + ]); +}); + +app()->run(); +``` + +The output will look like this: + +```js +{ + "user": { + "username": "mychi", + "email": "mickdd22@gmail.com", + "created_at": "2019-09-20 13:47:48" + }, + "token": "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE1NzYxMzUzMjgsImlzcyI6ImxvY2FsaG9zdCIsImV4cCI6MTU3NjEzNjIyOCwidXNlcklkIjoxfQ.7FODXGGJKioGQVX4ic0DJLoMIQTVUlsd4zFAJA4DAkg" +} +``` + +## Using our login + +After creating our login handler, we just need to plug this into our frontend. We can do this using any library for handling network requests. For this example, we will use [axios](https://github.com/axios/axios) + +::: tip Note +For this demonstration, we will be using axios with promises. Take a look at ES6 if you are not familiar with promises. +::: + +```js +axios.post('/login', { + username: 'mcyhi', + password: 'password', +}).then((res) => { + // success login instance + if (res.data.status === "success") { + localStorage["user"] = res.data.data.user; + localStorage["token"] = res.data.data.token; + } +}).catch((err) => { + if (err?.response && err?.response?.data?.status) { + // a toast library + toast.error(err?.response?.data?.auth); + } +}); +``` + +## Building Our Register + +It's this easy to create and use logins, so what about registrations? Even easier! Registration involves saving the user in the database, if the user is returned immedietely, a token needs to be created as well. Since we've already configured Leaf Auth, let's just jump right into the code. + +```php{3} +app()->post("/register", function () { + $data = request()->get(["username", "email", "password"]); + $res = auth()->register("users", $data, ["username", "email"]); + + if ($res === null) { + response()->throwErr([ + "status" => "failed", + "data" => auth()->errors(), + ]); + } + + response()->json([ + "status" => "success", + "data" => $res, + ]); +}); +``` + +The third line calls the `register` function which is responsible for registering the user. Unlike `login` above, we passed in a third parameter: an array of items which need to be unique in the database. In this case, leaf auth will make sure that there is no same `username` or `email` in the database before saving the user's credentials. + +## Building Our Update User + +To edit a user, we have to find the user we want to edit. This means that the user should be logged in. Since we're using JWT, we'll need to pass the token into the request as a bearer token in the authorization header. + +An example of this with axios will look like this: + +```js{7} +import axios from "axios"; + +axios({ + url: `${API_URL}/update`, + method: "POST", + headers: { + Authorization: `Bearer ${token}`, + }, + ... +}) +``` + +Back on our system, we'll have to detect the token, grab and decode it, find the data encoded into it and retrieve the user id. Sounds complex, but again, one line of code with Leaf. + +```php +$userId = auth()->id() ?? response()->throwErr([ + "status" => "failed", + "data" => auth()->errors(), +]); +``` + +Based on this id, we can create a condition to find the user we want to update. This condition will be passed together with our params into the `update` method, which will look like this: + +```php +$data = request()->get(["username", "email"]); + +// credentials to find user by +$where = ["id" => auth()->id() ?? response()->throwErr(auth()->errors())]; + +// unique data +$uniques = ["username", "email"]; + +$user = auth()->update("users", $data, $where, $uniques); +``` + +## Putting it all together + +```php +connect("host", "user", "password", "dbName"); +auth()->config("PASSWORD_ENCODE", function ($password) { + return \CustomPasswordHash::create($password); +}); + +app()->post("/login", function () { + $data = request()->get(["username", "password"]); + $res = auth()->login("users", $data); + + if (!$res) { + response()->throwErr(auth()->errors()); + } + + response()->json($res); +}); + +app()->post("/register", function () { + $data = request()->get(["username", "email", "password"]); + $res = auth()->register("users", $data, ["username", "email"]); + + if (!$res) { + response()->throwErr(auth()->errors()); + } + + response()->json($res); +}); + +app()->post("/update", function () { + $data = $request->get(["username", "email"]); + $where = ["id" => auth()->id() ?? response()->throwErr(auth()->errors())]; + + $user = auth()->update("users", $data, $where, ["username", "email"]); +}); + +app()->run(); +``` + +
+ +Experiment by Mychi Darko diff --git a/apps/docs/src/codelabs/experiments/auth/index.md b/apps/docs/src/codelabs/experiments/auth/index.md new file mode 100644 index 0000000..53c81b4 --- /dev/null +++ b/apps/docs/src/codelabs/experiments/auth/index.md @@ -0,0 +1,12 @@ +--- +aside: none +--- + +# Authentication + +This is a collection of codelab experiments related to web/API authentication across different platforms. Since there are multiple setups of leaf, along with Leaf MVC and Leaf API, this page will contain variations to give you the best experience for the version you're using. + +| Topic | Description | +| :------------------------------------------------- | :----------------------------------------------------------------- | +| [API auth](/codelabs/experiments/auth/api/) | API authentication with base Leaf 3 | +| [Session auth](/codelabs/experiments/auth/session/) | Session authentication with base Leaf 3 | diff --git a/apps/docs/src/codelabs/experiments/auth/session/index.md b/apps/docs/src/codelabs/experiments/auth/session/index.md new file mode 100755 index 0000000..d6d9ab4 --- /dev/null +++ b/apps/docs/src/codelabs/experiments/auth/session/index.md @@ -0,0 +1,266 @@ +# Session Auth + +::: warning Version support +This experiment supports `v3.0` upwards. +::: + +## What are we building? + +Although most web apps mostly rely on APIs and token/OAuth, the practice of using built in sessions for authentication certainly hasn't faded out. + +In this experiment, we'll be looking at how to create logins, signups and user updates with Leaf v3. We'll be relying on session support in the auth package and we'll also be using blade for our templating. + +::: details Detailed Explanation: Session authentication +Session based authentication is one in which the user state is stored on the server’s memory. + +Read the full article [here](https://dev.to/thecodearcher/what-really-is-the-difference-between-session-and-token-based-authentication-2o39) +::: + +::: details Detailed Explanation: Templating engines +For the sake of our tutorial, let's say that templating engines are a way of outputting code which allows us separate our logic from our views. There are many template engines out there, blade, twig, smarty and more. + +According to expressjs.com: + +> a template engine enables you to use static template files in your application. At runtime, the template engine replaces variables in a template file with actual values, and transforms the template into an HTML file sent to the client. This approach makes it easier to design an HTML page. +::: + +## Building Our Login + +First of all, we need a route to handle our login screen. We'll use leaf's core router for this. To get started, we'll need to install leaf auth and leaf blade. We can do this with composer: + +```sh +composer require leafs/auth +composer require leafs/blade +``` + +or with leaf CLI: + +```sh +leaf install auth +leaf install blade +``` + +After this, we can create our `index.php` file: + +```php +require __DIR__ . "/vendor/autoload.php"; + +// show login page +app()->get("/auth/login", function() { + echo app()->blade->render("login"); +}); + +// login logic +app()->post("/auth/login", function() { + // logic here +}); + +app()->run(); +``` + +Next we'll define our blade view, `login.blade.php`: + +```php +
+

Login

+

+ Sign into Leaf APP +

+
+
+
+ + {{ $errors['username'] ?? $errors['auth'] ?? null }} +
+
+ + {{ $errors['password'] ?? null }} +
+ +
+``` + +Before we jump into the code, let's talk about the processes involved. When a user logs in, a new session is created for them. This session holds the user and the session tracker logs assigned by Leaf Auth. We can check the user's logged in state to load a page or redirect. + +To set all this up with Leaf, all we need to do is to tell leaf auth to use sessions instead of just JWTs. + +```php +auth()->useSession(); +``` + +or + +```php +auth()->config("USE_SESSION", true); +``` + +::: tip Functional Mode ⚡️ +Note that the `auth` function we are using above comes from the auth package extending leaf 3's functional mode. +::: + +```php +require __DIR__ . "/vendor/autoload.php"; + +auth()->useSession(); + +app()->get("/auth/login", function() { + app()->blade->render("login"); +}); + +app()->post("/auth/login", function() { + // logic here +}); +``` + +Now we can focus on the login logic. If you've used auth before in previous versions, adding session support literally changed nothing about the syntax, so you can still comfortably create your logins in the very same way. + +```php +auth()->login("users", [ + "username" => $username, + "password" => $password +]); +``` + +Even the error handling works the same way too: + +```php +$user = auth()->login("users", [ + "username" => $username, + "password" => $password +]); + +if (!$user) { + // an error happened here, you can display + // them on your template. The errors can be + // grabbed with auth()->errors() +} +``` + +On a successful login, `login` will redirect the user to `GUARD_HOME` which is simply the homepage route. This route can be configured using the config method. + +```php +auth()->config("GUARD_HOME", "/dashboard"); +``` + +Putting it all together, we can have something like this: + +```php +// get username and password submitted from login form +list($username, $password) = array_values(request(["username", "email"])); + +auth()->config("GUARD_HOME", "/dashboard"); + +// attempt a login +$user = auth()->login("users", [ + "username" => $username, + "password" => $password +]); + +// if there's a problem with credentials or system +if (!$user) { + // render login page + return app()->blade->render("login", [ + // pass in errors and credentials + "errors" => auth()->errors(), + "username" => $username, + "password" => $password, + ]); +} +``` + +As you can see nothing has changed in the login implementation even though a ton of new features have been added. Restructuring the code, we'll have something like this. There's one last thing though. When an already logged in user tries to go to the login page, we want to redirect to `GUARD_HOME`. + +This means we have to check the session to find if the user is logged in or not, redirect if the user is logged in and maintain the page if the user isn't. Leaf makes this simple as well as it provides a `guard` method. + +```php +auth()->guard("guest"); +``` + +This tells leaf that the page is a guest page and should not be accesible when the user is logged in. Putting all what we've discussed together should look like this: + +```php +require __DIR__ . "/vendor/autoload.php"; + +// connect to db. You can use autoConnect too +auth()->connect("host", "user", "password", "dbName"); +auth()->config("GUARD_HOME", "/dashboard"); + +app()->get("/auth/login", function() { + auth()->guard("guest"); + + app()->blade->render("login"); +}); + +app()->post("/auth/login", function() { + auth()->guard("guest"); + + list($username, $password) = array_values(app()->request()->get(["username", "email"])); + + // attempt a login + $user = auth()->login("users", [ + "username" => $username, + "password" => $password + ]); + + // if there's a problem with credentials or system + if (!$user) { + // render login page + return app()->blade->render("login", [ + // pass in errors and credentials + "errors" => auth()->errors(), + "username" => $username, + "password" => $password, + ]); + } +}); +``` + +## Building Our Register + +Registration involves saving the user in the database. From there we can immedietely initialize a session or go to the `GUARD_LOGIN` page so the user signs in. Since we've already configured Leaf Auth, let's just jump right into the code. + +```php +app()->post("/auth/register", function() { + auth()->guard("guest"); + + $credentials = request()->get(["username", "email", "password"]); + + // automatically login immedietely the user is created + auth()->config("SESSION_ON_REGISTER", true); + + $user = auth()->register("users", $credentials, [ + "username", "email" + ]); + + if (!$user) { + return app()->blade->render("register", array_merge( + ["errors" => array_merge(is()->auth->errors()], + request(["username", "email", "password"])) + ); + } +}); +``` + +Here, we're creating a handler for our register method, getting the request data we need and saving it in the database using `register`. You might have noticed the 3rd parameter, `["username", "email"]`. This just makes sure that the same username and email don't already exist in the database. Leaf literally does everything for you. We can have a template like this: + +```php +
+
+ +

{{ $errors['username'] ?? $errors['auth'] ?? null }}

+
+
+ +

{{ $errors['email'] ?? $errors['auth'] ?? null }}

+
+
+ +

{{ $errors['password'] ?? null }}

+
+ +
+``` + +And with this we've successfully created our register functionality. Read the auth docs for more info on session auth. + +Experiment by Mychi Darko diff --git a/apps/docs/src/codelabs/experiments/caching/index.md b/apps/docs/src/codelabs/experiments/caching/index.md new file mode 100644 index 0000000..d78866d --- /dev/null +++ b/apps/docs/src/codelabs/experiments/caching/index.md @@ -0,0 +1,7 @@ +--- +aside: none +--- + +# Caching + +This is a collection of codelab experiments related to caching across different platforms. diff --git a/apps/docs/src/codelabs/experiments/deployment/digitalocean/index.md b/apps/docs/src/codelabs/experiments/deployment/digitalocean/index.md new file mode 100644 index 0000000..5f4c847 --- /dev/null +++ b/apps/docs/src/codelabs/experiments/deployment/digitalocean/index.md @@ -0,0 +1,152 @@ +# Deploying a LeafMVC Application to Digital Ocean + +::: warning Version support +Version support. This tutorial assumes use of LeafPHP >= 3.0 and PHP >=7.0. +::: + +## What Are We Building + +This experiment will guide you deploying your first LeafMVC application to Digital Ocean. A majority +of the same steps apply to Leaf v3 core as well. + +::: details (New to Digital Ocean?) +Digital Ocean is a cloud service provider that offers great introductory pricing for virtual private +servers (VPS). Create an account, tether a credit card, and prepare to build. +::: + +## Prerequisites + +Before continuing, it is important to determine if you would like to purhcase or point a domain name +to the VPS you are about to spin up. $DOMAIN will be shown several times throughout this experiment +and should be replaced by either your domain name (example.com) or the Droplet's public IP address. You +can grab the public IP address from the Digital Ocean control panel. + +For instructions on how to setup a domain with Digital Ocean, [click here](https://docs.digitalocean.com/products/networking/dns/how-to/add-domains/). + +## 1. Create a new droplet + +From the control panel, click the green "Create" button and select droplet. We will create a VPS with the +following options selected: + +* Ubuntu: 20.04 (LTS) +* Plan: Basic +* CPU Options: Premium AMD or Regular Intel +* $6/mo package + +::: tip Scaling ⚡️ +Should your application grow in requirements or traffic, you can always come back and increase your package selection. +::: + +### Authentication + +It is highly recommended that your utilize SSH-based authentication. Select an existing key, or [generate a new key](https://docs.github.com/en/authentication/connecting-to-github-with-ssh/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent), then add it. + +## 2. Initial droplet setup + +After your droplet has been created, you will need to login, secure it, and install required software. The first task will +be to create an admin user, then utilie that account for future SSH connections. + +```bash +ssh root@$DOMAIN +adduser username +usermod -aG sudo username +rsync --archive --chown=username:username ~/.ssh /home/username +``` + +Test the admin account: ``su - username``. If the command executes, you can terminal the SSH session and log +back in with your new user account (recommended). + +### Setup firewall + +Next we will setup UFW - Ubuntu Firewall. We will allow communication on ports: 22 (SSH), 80 (HTTP), and 443 (SSL). + +```bash +sudo ufw allow 22 +sudo ufw allow 80 +sudo ufw allow 443 +sudo ufw enable +``` + +After creating the firewall's rules and enabling UFW, you can view firewall status by ``sudo ufw status``. + +### Install required software + +It is now time install all of the needed software to enable LeafPHP to run. First, we need to update all system software: + +```bash +sudo apt update +sudo apt upgrade +``` + +Be sure to respond **Y** when asked to continue. Now we can intall NGINX, PHP, MySQL, and curl. + +```bash +sudo apt install nginx php-fpm php-mysql php-curl +``` + +Once complete, follow the +[NGINX instructions](https://www.digitalocean.com/community/tutorials/how-to-install-linux-nginx-mysql-php-lemp-stack-ubuntu-18-04#step-3-%E2%80%93-installing-php-and-configuring-nginx-to-use-the-php-processor). +Ensure that your directory is set as such: `` root /var/www/$DOMAIN/public;`` Below is an example sites-available file. + +```nginx +server { + server_name itsglint.com www.itsglint.com 147.182.136.153; + root /var/www/itsglint.com/public; + + index index.html index.htm index.php; + + location / { + try_files $uri /index.php?$query_string; + } + + location ~ \.php$ { + include snippets/fastcgi-php.conf; + fastcgi_pass unix:/var/run/php/php7.4-fpm.sock; + } +} +``` + +::: warning Leaf Router and .htaccess support +It is important to mirror the location blocks as-in. Otherwise, LeafRouter will not work properly or at all. +::: + +Next, we will install Mysql. Follow the [install instructions](https://www.digitalocean.com/community/tutorials/how-to-install-linux-nginx-mysql-php-lemp-stack-ubuntu-18-04#step-2-%E2%80%93-installing-mysql-to-manage-site-data). + +```bash +sudo apt install mysql-server +``` + +### Install your Leaf🍁 application + +Next, we will download and install our application with all dependencies. Clone your repository from Github, +or any source, and place your Leaf project in ``/var/www/$DOMAIN``. Afterwards, install required dependencies +and perform initial Leaf tasks: + +```bash +composer install +php leaf db:install +php leaf db:migrate +``` + +You also may seed the database if required: `php leaf db:seed`. + +Congratulations 🎉, you now have a fully working production server, and should be able to reach your application at $DOMAIN. + +::: details Recommended: Complete SSL Setup +If your Leaf applications is more than a hobbyist adventure and serving actual clients or visitors, it is +strongly recommended to complete the SSL setup. SSL encrypts traffic between a browser and server. Replace +example.com with $DOMAIN. + +``` +sudo apt install certbot python3-certbot-nginx +sudo systemctl reload nginx +sudo certbot --nginx -d example.com -d www.example.com +``` + +When prompted for HTTPS redirction, select **Option 2**, forcing HTTPS traffic. + +::: + +
+ +Experiment by **[Matthew Reichardt](https://github.com/matthewjamesr)** diff --git a/apps/docs/src/codelabs/experiments/deployment/heroku/index.md b/apps/docs/src/codelabs/experiments/deployment/heroku/index.md new file mode 100644 index 0000000..5687048 --- /dev/null +++ b/apps/docs/src/codelabs/experiments/deployment/heroku/index.md @@ -0,0 +1,61 @@ +# Deploying a Leaf Application to Heroku + +::: warning Version support +Version support. This tutorial assumes use of Leaf CLI >= 2.2.0 (🍊 Yomi Yomi no Mi). +::: + +## What Are We Building? + +This experiment will guide you deploying your first Leaf application to Heroku. The same steps apply to Leaf MVC, Leaf API and Skeleton. + +::: details (New to Heroku?) +Heroku is a platform as a service (PaaS) that enables developers to build, run, and operate applications entirely in the cloud. Create an account, tether a credit card, and prepare to build. +::: + +## Prerequisites + +This tutorial assumes you have the following: + +- A Leaf application +- A Heroku account +- The Heroku CLI installed + +## 1. Create a new heroku app + +From the dashboard, select create new app. Give your app a name, and select a region. The region should be the closest to your location. + +image + +**Note that per Heroku's new terms, you should have a payment method connected.** + +Clicking on create app, should take you to an empty new app page. From here, you can select the deploy tab, and connect your Github repository. + +image + +## 2. Initializing your app + +For most use-cases, you would usually push your project to GitHub, then connect your repository to Heroku. However, for this experiment, we will be pushing your app to Heroku directly using the Leaf CLI. + +To get started, you will need to make sure you are logged in to Heroku. You can do this by running `heroku login`. You will be prompted to login in your browser. Once you have logged in, you can proceed. + +Heroku uses git to deploy your application, so you will need to initialize git in your repository. You can do this by running `git init` in your project directory. After initializing git, you can add your files to the staging area by running `git add .`. Once you have added your files, you can commit them by running `git commit -m "commit message"`. + +## 3. Deploying your app + +Now for the interesting part. We can deploy our application using Leaf CLI's `deploy` command. + +```bash +leaf deploy --to heroku --project your-project-name +``` + +For this example, our command would look like this: + +```bash +leaf deploy --to heroku --project leafcodelabs +``` + +This command will setup the Heroku remote, build your app and push it to your Heroku project. Once the command is complete, you should see your deploy in the `Deploys` tab on the heroku dashboard. + +
+ +Experiment by **[Michael Darko](https://github.com/mychidarko)** diff --git a/apps/docs/src/codelabs/experiments/deployment/index.md b/apps/docs/src/codelabs/experiments/deployment/index.md new file mode 100644 index 0000000..8c0ffd9 --- /dev/null +++ b/apps/docs/src/codelabs/experiments/deployment/index.md @@ -0,0 +1,8 @@ +# Deployment + +This is a collection of codelab experiments related to deployment across different platforms. + +| Provider | Description | +| :-------------------------------------------------------------- | :----------------------------------------------------------------- | +| [Digital Ocean](/codelabs/experiments/deployment/digitalocean/) | Deploying LeafMVC projects to a new Digital Ocean droplet | +| [Heroku](/codelabs/experiments/deployment/heroku/) | Deploying a base Leaf project to Heroku using the Leaf CLI | diff --git a/apps/docs/src/codelabs/experiments/index.md b/apps/docs/src/codelabs/experiments/index.md new file mode 100644 index 0000000..1a08d3c --- /dev/null +++ b/apps/docs/src/codelabs/experiments/index.md @@ -0,0 +1,26 @@ +--- +aside: none +--- + +# Experiments + +A codelab experiment is a single tutorial that focuses on a particular topic. It is interactive and in-depth covering what is needed in full. + +Below is a list of experiment topics. + +## Topics + +| Topic | Description | +| :------------------------------------ | :----------------------------------------------------------------- | +| [Hosting](/codelabs/experiments/deployment/) | Experiments related to web/API hosting | +| [Auth](/codelabs/experiments/auth/) | Experiments related to web/API authentication | + + + +## Contributing + +If you don't find your topic here, you can simply create a pull request with your experiment in the topic folder you need. Find the full contribution guide [here](/codelabs/contributing) diff --git a/apps/docs/src/codelabs/experiments/javascript/index.md b/apps/docs/src/codelabs/experiments/javascript/index.md new file mode 100644 index 0000000..c024842 --- /dev/null +++ b/apps/docs/src/codelabs/experiments/javascript/index.md @@ -0,0 +1,7 @@ +--- +aside: none +--- + +# JavaScript + +This is a collection of codelab experiments related to JavaScript across different platforms. diff --git a/apps/docs/src/codelabs/experiments/mail/dynamic-mail-templating/README.md b/apps/docs/src/codelabs/experiments/mail/dynamic-mail-templating/README.md new file mode 100755 index 0000000..bbc6d91 --- /dev/null +++ b/apps/docs/src/codelabs/experiments/mail/dynamic-mail-templating/README.md @@ -0,0 +1,105 @@ +# Dynamic Emails With Templating + +## Base Example + +Writing and designing mails everytime you want to send a message to a user can be a major pain. One solution to this is to have an HTML or PHP script written as an email body, but of course this is very messy and unpractical. + +In this codelab experiment, we'll be using Leaf Mail, leaf's mail managing package in addition to Leaf Blade templating engine to send dynamic emails. + +So first we'll to prepare our system, initialise any needed package before we continue. + +```php + + + + + + {{ $title }} + + +
+

Dear {{ $name }},

+

+ We are glad to announce that you have been employed as {{ $position }} at Leaf PHP +

+

+ Love, The Leaf Team. +

+
+ + +``` + +### The System + +Basically, we've created a view which takes in a `$title`, `$name` and `$position`. So, back to our main system, we have to fill these fields and save the whole view into our mail body. Let's see how that works. + +**Be sure to read Leaf Blade docs and Leaf Mail docs.** + +```php +smtp_connect("host", 0000, true, "username", "password"); + +$mail->Subject = "Subject"; +$mail->Body = "BLADE VIEW HERE"; +``` + +So as you can see, all we have to do is to load the blade view into the `Body` section. That's actually all there is to it. Now let's work with blade a bit. We'll have to configure the directories for our blade views, and their compiled files too, after that, we render and pass in the required variables. + +Note that rendering blade views doesn't output that view, it just returns it, to actually output the view, we have to explicitly use `echo` or Leaf's `renderMarkup`. Thus, we're taking advantage of this. + +```php +$app->blade->configure("app/pages", "app/pages/cache"); +$body = $app->blade->render("mail", [ + "title" => "Employment", + "name" => "Michael", + "position" => "maintainer" +]); +``` + +Now, our complete view is saved in the `$body` variable, simple right? Now let's patch all what we've done together and send our email. + +```php +blade->configure("app/pages", "app/pages/cache"); +$mail->smtp_connect("host", 0000, true, "username", "password"); + +$mail->Subject = "Subject"; +$mail->Body = $app->blade->render("mail", [ + "title" => "Employment", + "name" => "Michael", + "position" => "maintainer" +]); +// other mail fields go here +$mail->send(); +``` + +Dont forget to check Leaf Mail's documentation + +
+ +Experiment by Mychi Darko diff --git a/apps/docs/src/codelabs/experiments/mail/index.md b/apps/docs/src/codelabs/experiments/mail/index.md new file mode 100644 index 0000000..2e1f1e3 --- /dev/null +++ b/apps/docs/src/codelabs/experiments/mail/index.md @@ -0,0 +1,7 @@ +--- +aside: none +--- + +# Mailing + +This is a collection of codelab experiments related to mailing. diff --git a/apps/docs/src/codelabs/experiments/websocket/index.md b/apps/docs/src/codelabs/experiments/websocket/index.md new file mode 100644 index 0000000..4e8caed --- /dev/null +++ b/apps/docs/src/codelabs/experiments/websocket/index.md @@ -0,0 +1,7 @@ +--- +aside: none +--- + +# Websockets + +This is a collection of codelab experiments related to websockets across different platforms. diff --git a/apps/docs/src/codelabs/index.md b/apps/docs/src/codelabs/index.md new file mode 100644 index 0000000..fa8d14d --- /dev/null +++ b/apps/docs/src/codelabs/index.md @@ -0,0 +1,38 @@ +# Leaf Codelabs + +Codelabs is a space we created to give interactive tutorials on Leaf, PHP and JS concepts that help you achieve specific results in your apps. Codelabs takes one topic or "how-to" and dives deep into it, giving you all the information you need to successfully complete the tutorial yourself while also explaining useful concepts along the way. + +## Codelabs vs the Docs + +How is `codelabs` different from the rest of our documentation? Why is this necessary? + +- **Greater Focus**: In the docs, we're essentially telling a story. Each section builds on and assumes knowledge from each previous section. In the codelabs section, each experiment can and should stand on its own. This means experiments can focus on one specific aspect of Leaf, rather than having to give a general overview. + +- **Greater Depth**: To avoid making the docs too long, we try to include only the simplest possible examples to help you understand each feature. Then we move on. In the codelabs section, we can include more complex examples, combining features in interesting ways. Each experiment can also be as long and detailed as it needs to be, in order to fully explore its niche. + +- **Teaching PHP/JS**: Although our docs are beginner friendly, we still assume basic familiarity with PHP concepts as we do not go over them into details in the docs. For example, we won't explain how forms and network requests work and how data is read. **In codelabs however**, essential PHP/JS features and concepts can be explored and explained in the context of how they help us build better Leaf apps. + +- **Hands-on**: Codelabs, unlike the docs packs in interactive hands-on tutorials which you can follow step-by-step. Each tutorial is specially crafted to help you "learn by doing" and is complementary to the docs. For this reason, you will always find links back to leaf, a module or a particular package. + +## Experiments + +A codelab experiment is a single tutorial that focuses on a particular topic. It is interactive and in-depth, covering what is needed in full. + +Below is a list of experiment topics. + +| Topic | Description | +| :------------------------------------------------------ | :------------------------------------------------------------- | +| [Hosting/Deployment](/codelabs/experiments/deployment/) | Experiments related to web/API deployment | + + + + + + + + +**We are migrating from codelabs.leafphp.dev to leafphp.dev/codelabs. Please bear with us as we move all the experiments here.** + +## Contributing + +If you don't find your topic here, you can simply create a pull request with your experiment in the topic folder you need. Find the full contribution guide [here](/codelabs/contributing) diff --git a/apps/docs/src/community/coc.md b/apps/docs/src/community/coc.md new file mode 100644 index 0000000..fd53230 --- /dev/null +++ b/apps/docs/src/community/coc.md @@ -0,0 +1,45 @@ +# Code Of Conduct + +## Our Pledge + +In the interest of fostering an open and welcoming environment, we as contributors and maintainers pledge to making participation in our project and our community a harassment-free experience for everyone, regardless of age, body size, disability, ethnicity, sex characteristics, gender identity and expression, level of experience, education, socio-economic status, nationality, personal appearance, race, religion, political party, or sexual identity and orientation. Note, however, that religion, political party, or other ideological affiliation provide no exemptions for the behavior we outline as unacceptable in this Code of Conduct. + +## Our Standards + +Examples of behavior that contributes to creating a positive environment include: + +- Using welcoming and inclusive language +- Being respectful of differing viewpoints and experiences +- Gracefully accepting constructive criticism +- Focusing on what is best for the community +- Showing empathy towards other community members + +Examples of unacceptable behavior by participants include: + +- The use of sexualized language or imagery and unwelcome sexual attention or advances +- Trolling, insulting/derogatory comments, and personal or political attacks +- Public or private harassment +- Publishing others' private information, such as a physical or electronic address, without explicit permission +- Other conduct which could reasonably be considered inappropriate in a professional setting + +## Our Responsibilities + +Project maintainers are responsible for clarifying the standards of acceptable behavior and are expected to take appropriate and fair corrective action in response to any instances of unacceptable behavior. + +Project maintainers have the right and responsibility to remove, edit, or reject comments, commits, code, wiki edits, issues, and other contributions that are not aligned to this Code of Conduct, or to ban temporarily or permanently any contributor for other behaviors that they deem inappropriate, threatening, offensive, or harmful. + +## Scope + +This Code of Conduct applies both within project spaces and in public spaces when an individual is representing the project or its community. Examples of representing a project or community include using an official project e-mail address, posting via an official social media account, or acting as an appointed representative at an online or offline event. Representation of a project may be further defined and clarified by project maintainers. + +## Enforcement + +Instances of abusive, harassing, or otherwise unacceptable behavior may be reported by contacting the project team at community@vuejs.org. All complaints will be reviewed and investigated and will result in a response that is deemed necessary and appropriate to the circumstances. The project team is obligated to maintain confidentiality with regard to the reporter of an incident. Further details of specific enforcement policies may be posted separately. + +Project maintainers who do not follow or enforce the Code of Conduct in good faith may face temporary or permanent repercussions as determined by other members of the project's leadership. + +## Attribution + +This Code of Conduct is adapted from the [Contributor Covenant][homepage], version 1.4, available at https://www.contributor-covenant.org/version/1/4/code-of-conduct.html + +[homepage]: https://www.contributor-covenant.org diff --git a/apps/docs/src/community/community-guide.md b/apps/docs/src/community/community-guide.md new file mode 100644 index 0000000..dbeaa05 --- /dev/null +++ b/apps/docs/src/community/community-guide.md @@ -0,0 +1,83 @@ +--- +outline: deep +--- + +# Community Guide + +Vue's community is growing incredibly fast and if you're reading this, there's a good chance you're ready to join it. So... welcome! + +Now we'll answer both what the community can do for you and what you can do for the community. + +## Resources + +### Code of Conduct + +Our is a guide to make it easier to enrich all of us and the technical communities in which we participate. + +### Stay in the Know + +- Follow our [official Twitter account](https://twitter.com/vuejs). +- Follow our [team members](./team) on Twitter or GitHub. +- Follow the [RFC discussions](https://github.com/vuejs/rfcs). +- Subscribe to the [official blog](https://blog.vuejs.org/). + +### Get Support + +- [Discord Chat](https://chat.vuejs.org/): A place for Vue devs to meet and chat in real time. +- [Forum](https://forum.vuejs.org/): The best place to ask questions and get answers about Vue and its ecosystem. +- [DEV Community](https://dev.to/t/vue): Share and discuss Vue related topics on Dev.to. +- [Meetups](https://events.vuejs.org/meetups): Want to find local Vue enthusiasts like yourself? Interested in becoming a community leader? We have the help and support you need right here! +- [GitHub](https://github.com/vuejs): If you have a bug to report or feature to request, that's what the GitHub issues are for. Please respect the rules specified in each repository's issue template. +- [Twitter Community (unofficial)](https://twitter.com/i/communities/1516368750634840064): A Twitter community, where you can meet other Vue enthusiasts, get help, or just chat about Vue. + +### Explore the Ecosystem + +- [The Awesome Vue Page](https://github.com/vuejs/awesome-vue): See what other awesome resources have been published by other awesome people. +- [Vue Telescope Explorer](https://vuetelescope.com/explore): Explore websites made with Vue, with insights on what framework / libraries they use. +- [Made with Vue.js](https://madewithvuejs.com/): showcases of projects and libraries made with Vue. +- [The "Show and Tell" Subforum](https://forum.vuejs.org/c/show-and-tell): Another great place to check out what others have built with and for the growing Vue ecosystem. + +## What You Can Do + +### Help Fellow Users + +Code contribution is not the only form of contribution to the Vue community. Answering a question for a fellow Vue user on Discord or the forum is also considered a valuable contribution. + +### Help Triage Issues + +Triaging an issue means gathering missing information, running the reproduction, verifying the issue's validity, and investigating the cause of the issue. + +We receive many issues in [our repositories on GitHub](https://github.com/vuejs) every single day. Our bandwidth is limited compared to the amount of users we have, so issue triaging alone can take an enormous amount of effort from the team. By helping us triage the issues, you are helping us become more efficient, allowing us to spend time on higher priority work. + +You don't have to triage an issue with the goal of fixing it (although that would be nice too). Sharing the result of your investigation, for example the commit that led to the bug, can already save us a ton of time. + +### Contribute Code + +Contributing bug fixes or new features is the most direct form of contribution you can make. + +The Vue core repository provides a [contributing guide](https://github.com/vuejs/core/blob/main/.github/contributing.md), which contains pull request guidelines and information regarding build setup and high-level architecture. Other sub-project repositories may also contain its own contribution guide - please make sure to read them before submitting pull requests. + +Bug fixes are welcome at any time. For new features, it is best to discuss the use case and implementation details first in the [RFC repo](https://github.com/vuejs/rfcs/discussions). + +### Share (and Build) Your Experience + +Apart from answering questions and sharing resources in the forum and chat, there are a few other less obvious ways to share and expand what you know: + +- **Develop learning materials.** It's often said that the best way to learn is to teach. If there's something interesting you're doing with Vue, strengthen your expertise by writing a blog post, developing a workshop, or even publishing a gist that you share on social media. +- **Watch a repo you care about.** This will send you notifications whenever there's activity in that repository, giving you insider knowledge about ongoing discussions and upcoming features. It's a fantastic way to build expertise so that you're eventually able to help address issues and pull requests. + +### Translate Docs + +I hope that right now, you're reading this sentence in your preferred language. If not, would you like to help us get there? + +See the [Translations guide](/translations/) for more details on how you can get involved. + +### Become a Community Leader + +There's a lot you can do to help Vue grow in your community: + +- **Present at your local meetup.** Whether it's giving a talk or running a workshop, you can bring a lot of value to your community by helping both new and experienced Vue developers continue to grow. +- **Start your own meetup.** If there's not already a Vue meetup in your area, you can start your own! Use the [resources at events.vuejs.org](https://events.vuejs.org/resources/#getting-started) to help you succeed! +- **Help meetup organizers.** There can never be too much help when it comes to running an event, so offer a hand to help out local organizers to help make every event a success. + +If you have any questions on how you can get more involved with your local Vue community, reach out on Twitter at [@vuejs_events](https://www.twitter.com/vuejs_events)! diff --git a/apps/docs/src/community/contributing/doc-style-guide.md b/apps/docs/src/community/contributing/doc-style-guide.md new file mode 100644 index 0000000..fe553a8 --- /dev/null +++ b/apps/docs/src/community/contributing/doc-style-guide.md @@ -0,0 +1,152 @@ +# Documentation Style Guide + +This guide will provide an overview of different design elements that are available for your use in creating documentation. + +## Alerts + +vuepress provides a custom container plugin to create alert boxes. There are four types: + +- **Info**: Provide information that is neutral +- **Tip**: Provide information that is positive and encouraged +- **Warning**: Provide information that users should be aware of as there is a low to moderate +- **Danger**: Provide information that is negative and has a high risk to the user + +**Markdown Examples** + +``` +::: tip +You can find more information at this site. +::: + +::: tip +This is a great tip to remember! +::: + +::: warning +This is something to be cautious of. +::: + +::: danger DANGER +This is something we do not recommend. Use at your own risk. +::: +``` + +**Rendered Markdown** + +::: tip +You can find more information at this site. +::: + +::: tip +This is a great tip to remember! +::: + +::: warning +This is something to be cautious of. +::: + +::: danger DANGER +This is something we do not recommend. Use at your own risk. +::: + +## Code Blocks + +vuepress uses Prism to provide language syntax highlighting by appending the language to the beginning backticks of a code block: + +**Markdown Example** + +```` +```js +export default { + name: 'MyComponent' +} +``` +```` + +**Rendered Output** + +```js +export default { + name: 'MyComponent' +} +``` + +### Line Highlighting + +To add line highlighting to your code blocks, you need to append the line number in curly braces. + +#### Single Line + +**Markdown Example** + +```` +```js{2} +export default { + name: 'MyComponent', + props: { + type: String, + item: Object + } +} +``` +```` + +**Rendered Markdown** + +```js{2} +export default { + name: 'MyComponent', + props: { + type: String, + item: Object + } +} +``` + +#### Group of Lines + +```` +```js{4-5} +export default { + name: 'MyComponent', + props: { + type: String, + item: Object + } +} +``` +```` + +```js{4-5} +export default { + name: 'MyComponent', + props: { + type: String, + item: Object + } +} +``` + +#### Multiple Sections + +```` +```js{2,4-5} +export default { + name: 'MyComponent', + props: { + type: String, + item: Object + } +} +``` +```` + +```js{2,4-5} +export default { + name: 'MyComponent', + props: { + type: String, + item: Object + } +} +``` diff --git a/apps/docs/src/community/contributing/index.md b/apps/docs/src/community/contributing/index.md new file mode 100644 index 0000000..c7fae46 --- /dev/null +++ b/apps/docs/src/community/contributing/index.md @@ -0,0 +1,78 @@ +# Contribution Guide + + + +Hi! We're really excited that you are interested in contributing to Leaf. Before submitting your contribution, please make sure to take a moment and read through the following guidelines: + +- [Development Setup](#development-setup) +- [Pull Request Guidelines](#pull-request-guidelines) +- [Project Structure](#project-structure) + +## Development Setup + +You will need PHP 7.4 + and [composer](https://getcomposer.org). + +After cloning the repo, run: + +```bash +leaf install +``` + +Or with composer: + +```bash +composer install +``` + +## Pull Request Guidelines + +We encourage contributions through pull requests on our repositories. Pull requests are usually of 2 types: bug fixes and feature additions. You can open a "draft" pull request to let the community keep track of work you're doing, however, pull requests will only be evaluated if they are marked as "ready for review" and all tests for new features are passing. Any inactive pull requests left in the "draft" state for an extended period will be closed. The following guidelines should be followed when submitting a pull request: + +- The `master` branch is just a snapshot of the latest stable release. All development should be done in dedicated branches. **Do not submit PRs against the `master` branch.** + +- Checkout a topic branch from the relevant branch, e.g. `v3.x`, and merge back against that branch. + +- It's OK to have multiple small commits as you work on the PR - GitHub will automatically squash it before merging. + +- If adding a new feature: + + - Add accompanying test case. + - Provide a convincing reason to add this feature. Ideally, you should open a suggestion issue first with the `suggestion` or `feature request` tag and have it approved before working on it. + +- If fixing bug: + - If you are resolving a special issue, add `(fix #xxxx[,#xxxx])` (#xxxx is the issue id) in your PR title for a better release log, e.g. `update entities encoding/decoding (fix #3899)`. + - Provide a detailed description of the bug in the PR. + +## Project Structure + +- **`src`**: contains the source code. + + - **`Exception/`**: contains code for the general leaf exceptions. + + This contains default error states and screens for errors, down-times and the like. It also contains extensible mark-up and logging to keep track of errors. Basically, anything relating to errors. + + - **`Helpers/`**: contains default leaf utilities like the container (DI container). + + - **`App.php`**: contains initializers and main leaf code. + + - **`Config.php`**: class for configuring how leaf behaves. + + - **`functions.php`**: Base functions for functional mode. + + - **`Middleware.php`**: base class for creating leaf middleware. + + - **`View.php`**: view config for leaf. + +## Financial Contribution + +As a pure community-driven project without any corporate backing, we also welcome financial contributions via OpenCollective. + +- [Checkout our sponsor page](/support/) + +## Credits + +Thank you to all the people who have already code to Leaf! + + diff --git a/apps/docs/src/community/contributing/writing-guide.md b/apps/docs/src/community/contributing/writing-guide.md new file mode 100644 index 0000000..782c458 --- /dev/null +++ b/apps/docs/src/community/contributing/writing-guide.md @@ -0,0 +1,111 @@ +# Leaf Docs Writing Guide + +Writing documentation is an exercise in empathy. We're not describing an objective reality - the source code already does that. Our job is to help shape the relationship between users and the Leaf ecosystem. This ever-evolving guide provides some rules and recommendations on how to do that consistently within the Leaf ecosystem. + +## Principles + +- **A feature doesn't exist until it's well documented.** +- **Respect users' cognitive capacity (i.e. brain power).** When a user starts reading, they begin with a certain amount of limited brain power and when they run out, they stop learning. + - Cognitive capacity is **depleted faster** by complex sentences, having to learn more than one concept at a time, and abstract examples that don't directly relate to a user's work. + - Cognitive capacity is **depleted more slowly** when we help them feel consistently smart, powerful, and curious. Breaking things down into digestible pieces and minding the flow of the document can help keep them in this state. +- **Always try to see from the user's perspective.** When we understand something thoroughly, it becomes obvious to us. This is called _the curse of knowledge_. In order to write good documentation, try to remember what you first needed to know when learning this concept. What jargon did you need to learn? What did you misunderstand? What took a long time to really grasp? Good documentation meets users where they are. It can be helpful to practice explaining the concept to people in person before. +- **Describe the _problem_ first, then the solution.** Before showing how a feature works, it's important to explain why it exists. Otherwise, users won't have the context to know if this information is important to them (is it a problem they experience?) or what prior knowledge/experience to connect it to. +- **While writing, don't be afraid to ask questions**, _especially_ if you're afraid they might be "dumb". Being vulnerable is hard, but it's the only way for us to more fully understand what we need to explain. +- **Be involved in feature discussions.** The best APIs come from documentation-driven development, where we build features that are easy to explain, rather than trying to figure out how to explain them later. Asking questions (especially "dumb" questions) earlier often helps reveal confusions, inconsistencies, and problematic behavior before a breaking change would be required to fix them. + +## Organization + +- **Installation/Integration**: Provide a thorough overview of how to integrate the software into as many different kinds of projects as necessary. +- **Introduction/Getting Started**: + - Provide a less than 10 minute overview of the problems the project solves and why it exists. + - Provide a less than 30 minute overview of the problems the project solves and how, including when and why to use the project and some simple code examples. At the end, link to both to Installation page and the beginning of the Essentials Guide. +- **Guide**: Make users feel smart, powerful, and curious, then maintain this state so that users maintain the motivation and cognitive capacity to keep learning more. Guide pages are meant to be read sequentially, so should generally be ordered from the highest to lowest power/effort ratio. + - **Essentials**: It should take no longer than 5 hours to read the Essentials, though shorter is better. Its goal is to provide the 20% of knowledge that will help users handle 80% of use cases. Essentials can link to more advanced guides and the API, though, in most cases, you should avoid such links. When they are provided, you need also provide a context so users are aware if they should follow this link on their first reading. Otherwise, many users end up exhausting their cognitive capacity link-hopping, trying to fully learn every aspect of a feature before moving on, and as a result, never finish that first read-through of the Essentials. Remember that a smooth read is more important than being thorough. We want to give people the information they need to avoid a frustrating experience, but they can always come back and read further, or Google a less common problem when they encounter it. + - **Advanced**: While the Essentials helps people handle ~80% of use cases, subsequent guides help get users to 95% of use cases, plus more detailed information on non-essential features (e.g. transitions, animations), more complex convenience features (e.g. mixins, custom directives), and dev experience improvements (e.g. JSX, plugins). The final 5% of use cases that are more niche, complex, and/or prone to abuse will be left to the cookbook and API reference, which can be linked to from these advanced guides. +- **Reference/API**: Provide a complete list of features, including type information, descriptions of the problem each solves, examples of every combination of options, and links to guides, cookbook recipes, and other internal resources providing more detail. Unlike other pages, this one is not meant to be read top-to-bottom, so plenty of detail can be provided. These references must also be more easily skimmable than the guides, so the format should be closer to dictionary entries than the story-telling format of the guides. +- **Migrations**: + - **Versions**: When important changes are made, it's useful to include a full list of changes, including a detailed explanation of why the change was made and how to migrate their projects. + - **From other projects**: How does this software compare to similar software? This is important to help users understand what additional problems we might solve or create for them, and to what extent they can transfer knowledge they already have. +- **Style Guide**: There are necessarily some key pieces in development that need a decision, but are not core to the API. The style guide provides educated, opinionated recommendations to help guide these decisions. They shouldn't be followed blindly, but can help teams save time by being aligned on smaller details. +- **Cookbook**: Recipes in the cookbook are written with some assumption of familiarity with Leaf and its ecosystem. Each is a highly structured document that walks through some common implementation details that a Leaf dev might encounter. + +## Writing & Grammar + +### Style + +- **Headings should describe problems**, not solutions. For example, a less effective heading might be "Using props", because it describes a solution. A better heading might be "Passing Data to Child Components with Props", because it provides the context of the problem props solve. Users won't really start paying attention to the explanation of a feature until they have some idea of why/when they'd use it. +- **When you assume knowledge, declare it** at the beginning and link to resources for less common knowledge that you're expecting. +- **Introduce only one new concept at a time whenever possible** (including both text and code examples). Even if many people are able to understand when you introduce more than one, there are also many who will become lost - and even those who don't become lost will have depleted more of their cognitive capacity. +- **Avoid special content blocks for tips and caveats when possible.** It's generally preferable to blend these more naturally into the main content, e.g. by building on examples to demonstrate an edge case. +- **Don't include more than two interwoven tips and caveats per page.** If you find that more than two tips are needed in a page, consider adding a caveats section to address these issues. The guide is meant to be read straight through, and tips and caveats can be overwhelming or distracting to someone trying to understand the base concepts. +- **Avoid appeals to authority** (e.g. "you should do X, because that's a best practice" or "X is best because it gives you full separation of concerns"). Instead, demonstrate with examples the specific human problems caused and/or solved by a pattern. +- **When deciding what to teach first, think of what knowledge will provide the best power/effort ratio.** That means teaching whatever will help users solve the greatest pains or greatest number of problems, with the relatively least effort to learn. This helps learners feel smart, powerful, and curious, so their cognitive capacity will drain more slowly. +- **Unless the context assumes a string template or build system, only write code that works in any environment by the software (e.g. Leaf, Leafx, etc).** +- **Show, don't tell.** For example, "To use Leaf on a page, you can add this to your HTML" (then show the script tag), instead of "To use Leaf on a page, you can add a script element with a src attribute, the value of which should be a link to Leaf's compiled source". +- **Almost always avoid humor (for English docs)**, especially sarcasm and pop culture references, as it doesn't translate well across cultures. +- **Never assume a more advanced context than you have to.** +- **In most cases, prefer links between sections of the docs over repeating the same content in multiple sections.** Some repetition in content is unavoidable and even essential for learning. However, too much repetition also makes the docs more difficult to maintain, because a change in the API will require changes in many places and it's easy to miss something. This is a difficult balance to strike. +- **Specific is better than generic.** For example, a `` component example is better than ``. +- **Relatable is better than obscure.** For example, a `` component example is better than ``. +- **Be emotionally relevant.** Explanations and examples that relate to something people have experience with and care about will always be more effective. +- **Always prefer simpler, plainer language over complex or jargony language.** For example: + - "you can use Leaf with a script element" instead of "in order to initiate the usage of Leaf, one possible option is to actually inject it via a script HTML element" + - "function that returns a function" instead of "higher order function" +- **Avoid language that invalidate struggle**, such as "easy", "just", "obviously", etc. For reference, see [Words To Avoid in Educational Writing](https://css-tricks.com/words-avoid-educational-writing/). + +### Grammar + +- **Avoid abbreviations** in writing and code examples (e.g. `attribute` is better than `attr`, `message` is better than `msg`), unless you are specifically referencing an abbreviation in an API (e.g. `$attrs`). Abbreviation symbols included on standard keyboards (e.g. `@`, `#`, `&`) are OK. +- **When referencing a directly following example, use a colon (`:`) to end a sentence**, rather than a period (`.`). +- **Use the Oxford comma** (e.g. "a, b, and c" instead of "a, b and c"). ![Why the Oxford comma is important](/images/oxford-comma.jpg) + - Source: [The Serial (Oxford) Comma: When and Why To Use It](https://www.inkonhand.com/2015/10/the-serial-oxford-comma-when-and-why-to-use-it/) +- **When referencing the name of a project, use the name that project refers to itself as.** For example, "webpack" and "npm" should both use lowercase as that's how their documentation refers to them. +- **Use Title Case for headings** - at least for now, since it's what we use through the rest of the docs. There's research suggesting that sentence case (only first word of the heading starts with a capital) is actually superior for legibility and also reduces the cognitive overhead for documentation writers, since they don't have to try to remember whether to capitalize words like "and", "with", and "about". +- **Don't use emojis (except in discussions).** Emojis are cute and friendly, but they can be a distraction in documentation and some emoji even convey different meanings in different cultures. + +## Iteration & Communication + +- **Excellence comes from iteration.** First drafts are always bad, but writing them is a vital part of the process. It's extremely difficult to avoid the slow progression of Bad -> OK -> Good -> Great -> Inspiring -> Transcendent. +- **Only wait until something is "Good" before publishing.** The community will help you push it further down the chain. +- **Try not to get defensive when receiving feedback.** Our writing can be very personal to us, but if we get upset with the people who help us make it better, they will either stop giving feedback or start limiting the kind of feedback they give. +- **Proof-read your own work before showing it to others.** If you show someone work with a lot of spelling/grammar mistakes, you'll get feedback about spelling grammar/mistakes instead of more valuable notes about whether the writing is achieving your goals. +- **When you ask people for feedback, tell reviewers what:** + - **you're trying to do** + - **your fears are** + - **balances you're trying to strike** +- **When someone reports a problem, there is almost always a problem**, even if the solution they proposed isn't quite right. Keep asking follow-up questions to learn more. +- People need to feel safe asking questions when contributing/reviewing content. Here's how you can do that: + - **Thank people for their contributions/reviews, even if you're feeling grumpy.** For example: + - "Great question!" + - "Thanks for taking the time to explain. 🙂" + - "This is actually intentional, but thanks for taking the time to contribute. 😊" + - **Listen to what people are saying and mirror if you're not sure you're understanding correctly.** This can help validate people's feelings and experiences, while also understanding if _you're_ understanding _them_ correctly. + - **Use a lot of positive and empathetic emojis.** It's always better to seem a little strange than mean or impatient. + - **Kindly communicate rules/boundaries.** If someone behaves in a way that's abusive/inappropriate, respond only with kindness and maturity, but also make it clear that this behavior is not acceptable and what will happen (according to the code of conduct) if they continue behaving poorly. + +### Tips, Callouts, Alerts, and Line Highlights + +We have some dedicated styles to denote something that's worth highlighting in a particular way. These are captured [on this page](https://v3.leafphp.dev/docs/doc-style-guide.html#alerts). **They are to be used sparingly.** + +There is a certain temptation to abuse these styles, as one can simply add a change inside a callout. However, this breaks up the flow of reading for the user, and thus, should only be used in special circumstances. Wherever possible, we should attempt to create a narrative and flow within the page to respect the readers cognitive load. + +Under no circumstances should 2 alerts be used next to one another, it's a sign that we're not able to explain context well enough. + +### Contributing + +We appreciate small, focused PRs. If you'd like to make an extremely large change, please communicate with team members prior to a pull request. Here's a [writeup that details why this is so critical](https://www.netlify.com/blog/2020/03/31/how-to-scope-down-prs/) for us to work well on this team. Please understand that though we always appreciate contributions, ultimately we have to prioritize what works best for the project as a whole. + +## Resources + +### Software + +- [Grammarly](https://www.grammarly.com/): Desktop app and browser extension for checking spelling and grammar (though grammar checking doesn't catch everything and occasionally shows a false positive). +- [Code Spell Checker](https://marketplace.visualstudio.com/items?itemName=streetsidesoftware.code-spell-checker): An extension for VS Code to help you check spelling within markdown and code examples. + +### Books + +- [On Writing Well](https://www.amazon.com/Writing-Well-30th-Anniversary-Nonfiction-ebook/dp/B0090RVGW0) (see [popular quotes](https://www.goodreads.com/work/quotes/1139032-on-writing-well-the-classic-guide-to-writing-nonfiction)) +- [Bird by Bird](https://www.amazon.com/Bird-Some-Instructions-Writing-Life/dp/0385480016) (see [popular quotes](https://www.goodreads.com/work/quotes/841198-bird-by-bird-some-instructions-on-writing-and-life)) +- [Cognitive Load Theory](https://www.amazon.com/Cognitive-Explorations-Instructional-Performance-Technologies/dp/144198125X/) + +**Adapted from the Vue JS writing guide.** diff --git a/apps/docs/src/community/faq.md b/apps/docs/src/community/faq.md new file mode 100644 index 0000000..f90fc68 --- /dev/null +++ b/apps/docs/src/community/faq.md @@ -0,0 +1,65 @@ +# Frequently Asked Questions + +## Who maintains Leaf? + +Leaf is an independent, community-driven project. It was created by [Michael Darko](https://github.com/mychidarko) in 2019 as a personal side project. Today, Leaf is actively maintained by [a team of both full-time and volunteer members from all around the world](/community/team), where Michael serves as the project lead. You can find Leaf's history [here](/community/history). + +Leaf's development is primarily funded through sponsorships and personal contributions from Michael and friends. If you or your business benefit from Leaf, consider [sponsoring us](/support/) to support Leaf's development! + +## What license does Leaf use? + +Leaf is a free and open source project released under the [MIT License](https://opensource.org/licenses/MIT). + +## Is Leaf reliable? + +After going through 2 major versions over the past 2 years, Leaf is now a battle-tested framework suitable for just about any PHP project. It is also one of the most popular lightweight PHP micro-frameworks and even has it's variant - Leaf API being a very popular framework. + +Leaf is used by individuals for large and personal projects, as well as by companies all over the world. + +## Is Leaf fast? + +Leaf 3 is one of the most performant and lightweight PHP frameworks today. It is also 100% compatible with standard PHP libraries and servers, which means there's almost no need for configurations and manual optimizations. + +In sample benchmarks, Leaf even out-performs frameworks like Slim PHP which was considered the most lightweight PHP micro-framework with blazing speed. + +## Is Leaf lightweight? + +As mentioned above, Leaf 3 is one of the most lightweight PHP frameworks with a source of about 30kb. With Leaf 3's functional mode, a hello world application can be prepared in just 10 lines of code, including spaces and PHP initializers. + +## What's the difference between Leaf 2 and Leaf 3? + +Leaf 3 is the current, latest major version of Leaf. It contains new features that are not present in Leaf 2 (most notably functional mode and modules), and also contains a few breaking changes that makes it incompatible with Leaf 2. Despite the differences, the majority of Leaf APIs are shared between the two major versions, so almost all of your Leaf 2 knowledge will continue to work in Leaf 3. + +In general, Leaf 3 provides smaller bundle sizes, better performance, better scalability, and better IDE support. If you are starting a new project today, Leaf 3 is the recommended choice. The only reason for you to consider Leaf 2 as of now is if you feel Leaf 3 is too modular, of course this is solved if you use Leaf 3 with Leaf MVC or Leaf API. + +Since both Leaf 2 and 3 are wired to accept any PHP code, all external libraries usable in Leaf 2 will still work perfectly with Leaf 3. If you intend to migrate an existing Leaf 2 app to Leaf 3, consult the dedicated Leaf 3 Migration Guide. + +Leaf 2 will receive a final minor release (2.7) in 2022. This minor release will backport a selected subset of new features from Leaf 3. After that, Leaf 2 will enter maintenance mode: it will no longer ship new features, but will continue to receive critical bug fixes and security updates. + +## Does Leaf scale? + +Yes. Despite a common misconception that Leaf is only suitable for simple use cases, Leaf is perfectly capable of handling large scale applications: + +- [Skeleton](https://skeleton.leafphp.dev) provides a base setup which holds your hand through separation of concerns. It provides a partial MVC setup which allows for incremental adoption. + + ::: warning Remember + This is not a framework. + ::: + +- [Leaf API](https://api.leafphp.dev) is an MVC framework bootstrapped with Leaf at it's core. It uses the [MVC architecture](https://towardsdatascience.com/everything-you-need-to-know-about-mvc-architecture-3c827930b4c1) to ensure separation of concerns. Leaf API is specially crafted to aid rapid developement of powerful but scalable APIs. + +- [Leaf MVC](https://mvc.leafphp.dev) just like Leaf API is a framework built with leaf that relies on the MVC architecture. The main difference is leaf MVC comes with tools which aid in building fullstack web apps/APIs. This makes Leaf MVC more general purpose, compared to the one-track API machine: Leaf API. + +As you see above, all of these setups/frameworks are built using leaf as their core. Leaf can fit into any environment depending on how you use it. + +## How do I contribute to Leaf? + +We appreciate your interest! Please check out our [Contribution Guide](/community/contributing/). + + + + + + diff --git a/apps/docs/src/community/history.md b/apps/docs/src/community/history.md new file mode 100644 index 0000000..cb90457 --- /dev/null +++ b/apps/docs/src/community/history.md @@ -0,0 +1,23 @@ +--- +aside: none +--- + +# History + +Leaf was started in October 2019 as a simple frameworkless boilerplate for developing APIs. The idea was to create a powerful, but fairly simple boilerplate which could just be cloned and used as a starter for projects. + +![Leaf PHP boilerplate](https://user-images.githubusercontent.com/26604242/145728756-4b3908af-4cf1-4be6-8250-f39f4155489d.png) + +Along the way, leaf's features got bundled and shipped as a library which people started calling a micro-framework. It was later published on [product hunt](https://www.producthunt.com/posts/leaf-php) and got a whole lot of people interested in it. Leaf even earned one of the top products of the day spots ⚡️ + +![image](https://user-images.githubusercontent.com/26604242/145728962-60179763-62c6-4f88-97b9-6d24bccc9f36.png) + +After this, leaf went on to introduce many amazing features like leaf db, leaf auth and more. But after a long run with version 1, we decided to completely re-write leaf in order to add a few more features like middleware on a core level. + +The first commit to v2 was on 4 Mar 2020. This was the first commit since the v1.5 release a couple of months earlier. The stable v2 was released only a month later on 22 Apr 2020, and brought in a whole lot of upgrades to leaf, leaf MVC, leaf API and the creation of Skeleton. + +A year down the line, leaf 2 was featured in a lot of top 10s and upcoming/lightweight framework reviews. It was adopted in both professional workscapes and by hobbyists all over the world. You could say leaf 2 was really doing well, but then it started getting features that a lot of developers were not using in their apps. And that's when the idea of modules was born. + +We could ship leaf's features as installable plugins which developers will manually handpick for their apps, and the community agreed with us. We started working towards this, and discovered "functional mode" along the way. We also rebranded leaf to match our new goal of giving developers the best PHP experience and improving our usability. + +Today, v3 is almost stable and we've published over 30 modules on packagist. v3 has proven to be lighter than just about every framework out there, with a source of about 30kb and even faster than frameworks like Slim PHP. diff --git a/apps/docs/src/community/images/ben-hong.jpeg b/apps/docs/src/community/images/ben-hong.jpeg new file mode 100644 index 0000000..5589197 Binary files /dev/null and b/apps/docs/src/community/images/ben-hong.jpeg differ diff --git a/apps/docs/src/community/images/evan-you.jpeg b/apps/docs/src/community/images/evan-you.jpeg new file mode 100644 index 0000000..388b889 Binary files /dev/null and b/apps/docs/src/community/images/evan-you.jpeg differ diff --git a/apps/docs/src/community/join.md b/apps/docs/src/community/join.md new file mode 100644 index 0000000..5a74d01 --- /dev/null +++ b/apps/docs/src/community/join.md @@ -0,0 +1,58 @@ +--- +title: "Our Community" +--- + +# Join the Leaf PHP Community! + +Leaf's community is growing incredibly fast and if you're reading this, there's a good chance you're ready to join it. So... welcome! + +Now we'll answer both what the community can do for you and what you can do for the community. + +## Resources + +### Code of Conduct + +Our [Code of Conduct](/coc/) is a guide to make it easier to enrich all of us and the technical communities in which we participate. + +### Get Support + +- [Forum](https://github.com/leafsphp/leaf/discussions/37): The best place to ask questions and get answers about Leaf and its ecosystem. +- [GitHub](https://github.com/leafsphp/leaf): If you have a bug to report or feature to request, that's what the GitHub issues are for. We also welcome pull requests! +- [Discord server](https://discord.gg/Pkrm9NJPE3): A place for Leaf devs to meet and chat in real time. + + + +## What You Can Do + +### Contribute Code + +As with any project, there are rules to contributing. To ensure that we can help you or accept your pull request as quickly as possible, please read [the contributing guide](/community/contributing/). + +After that, you'll be ready to contribute to Leaf's core repositories: + +- [Leaf](https://github.com/leafsphp/leaf): the core library +- [Leaf MVC](https://github.com/leafsphp/leafMVC): MVC powered wrapper around Leaf PHP +- [Leaf API](https://github.com/leafsphp/leafAPI): MVC powered wrapper specialized for building APIs. + +...as well as many smaller official [companion libraries](https://github.com/leafsphp). + +### Share (and Build) Your Experience + +Apart from answering questions and sharing resources in the forum and chat, there are a few other less obvious ways to share and expand what you know: + +- **Develop learning materials.** It's often said that the best way to learn is to teach. If there's something interesting you're doing with Leaf, strengthen your expertise by writing a blog post, developing a workshop, or even publishing a gist that you share on social media. +- **Watch a repo you care about.** This will send you notifications whenever there's activity in that repository, giving you insider knowledge about ongoing discussions and upcoming features. It's a fantastic way to build expertise so that you're eventually able to help address issues and pull requests. + +### Help manage our Community + +With the growth of Leaf, we need more hands to moderate activities on our discord chat, keep up with our documentation, GitHub discussions, twitter and the like. + +If you want to help with any of these, kindly reach out on twitter [@leafphp](https://twitter.com/leafphp) or email [mychi@leafphp.dev](mailto:mychi@leafphp.dev) + +## Updates + +- [Youtube](https://twitter.com/leafphp): Get online streams, talks and tutorials on leaf and community packages. + +- [Twitter](https://twitter.com/leafphp): Get timely updates on everything that happens in the leaf PHP ecosystem. + + diff --git a/apps/docs/src/community/releases.md b/apps/docs/src/community/releases.md new file mode 100644 index 0000000..e43c677 --- /dev/null +++ b/apps/docs/src/community/releases.md @@ -0,0 +1,77 @@ +--- +outline: deep +--- + + + +# Releases + +

+The current latest stable version of Vue is {{ version }}. +

+

+Checking latest version... +

+ +A full changelog of past releases is available on [GitHub](https://github.com/vuejs/core/blob/main/CHANGELOG.md). + +## Release Cycle + +Vue does not have a fixed release cycle. + +- Patch releases are released as needed. + +- Minor releases always contain new features, with a typical time frame of 3~6 months in between. Minor releases always go through a beta pre-release phase. + +- Major releases will be announced ahead of time, and will go through an early discussion phase and alpha / beta pre-release phases. + +## Semantic Versioning Edge Cases + +Vue releases follow [Semantic Versioning](https://semver.org/) with a few edge cases. + +### TypeScript Definitions + +We may ship incompatible changes to TypeScript definitions between **minor** versions. This is because: + +1. Sometimes TypeScript itself ships incompatible changes between minor versions, and we may have to adjust types to support newer versions of TypeScript. + +2. Occasionally we may need to adopt features that are only available in a newer version of TypeScript, raising the minimum required version of TypeScript. + +If you are using TypeScript, you can use a semver range that locks the current minor and manually upgrade when a new minor version of Vue is released. + +### Compiled Code Compatibility with Older Runtime + +A newer **minor** version of Vue compiler may generate code that isn't compatible with the Vue runtime from an older minor version. For example, code generated by Vue 3.2 compiler may not be fully compatible if consumed by the runtime from Vue 3.1. + +This is only a concern for library authors, because in applications, the compiler version and the runtime version is always the same. A version mismatch can only happen if you ship pre-compiled Vue component code as a package, and a consumer uses it in a project using an older version of Vue. As a result, your package may need to explicit declare a minimum required minor version of Vue. + +## Pre Releases + +Minor releases typically go through a non-fixed number of beta releases. Major releases will go through an alpha phase and a beta phase. + +Pre-releases are meant for integration / stability testing, and for early adopters to provide feedback for unstable features. Do not use pre-releases in production. All pre-releases are considered unstable and may ship breaking changes in between, so always pin to exact versions when using pre-releases. + +## Deprecations + +We may periodically deprecate features that have new, better replacements in minor releases. Deprecated features will continue to work, and will be removed in the next major release after it entered deprecated status. + +## RFCs + +New features with substantial API surface and major changes to Vue will go through the **Request for Comments** (RFC) process. The RFC process is intended to provide a consistent and controlled path for new features to enter the framework, and give the users an opportunity to participate and offer feedback in the design process. + +The RFC process is conducted in the [vuejs/rfcs](https://github.com/vuejs/rfcs) repo on GitHub. + +## Experimental Features + +Some features are shipped and documented in a stable version of Vue, but marked as experimental. Experimental features are typically features that have an associated RFC discussion with most of the design problems resolved on paper, but still lacking feedback from real world usage. + +The goal of experimental features is to allow users to provide feedback for them by testing them in a production setting, without having to use an unstable version of Vue. Experimental features themselves are considered unstable, and should only be used in a controlled manner, with the expectation that the feature may change between any release types. diff --git a/apps/docs/src/community/team.md b/apps/docs/src/community/team.md new file mode 100644 index 0000000..dbde9c8 --- /dev/null +++ b/apps/docs/src/community/team.md @@ -0,0 +1,11 @@ +--- +page: true +title: Meet the Team +sidebar: false +--- + + + + diff --git a/apps/docs/src/community/team/Member.ts b/apps/docs/src/community/team/Member.ts new file mode 100644 index 0000000..9ad76d8 --- /dev/null +++ b/apps/docs/src/community/team/Member.ts @@ -0,0 +1,27 @@ +export interface Member { + name: string + avatarPic?: string + title: string + company?: string + companyLink?: string + projects: Link[] + location: string + languages: string[] + website?: Link + socials: Socials + sponsor?: boolean | string + reposPersonal?: string[] +} + +export interface Link { + label: string + url: string +} + +export interface Socials { + github: string + twitter?: string + codepen?: string + instagram?: string + linkedin?: string +} diff --git a/apps/docs/src/community/team/TeamHero.vue b/apps/docs/src/community/team/TeamHero.vue new file mode 100644 index 0000000..0ad0f91 --- /dev/null +++ b/apps/docs/src/community/team/TeamHero.vue @@ -0,0 +1,75 @@ + + + diff --git a/apps/docs/src/community/team/TeamList.vue b/apps/docs/src/community/team/TeamList.vue new file mode 100644 index 0000000..95aaa1d --- /dev/null +++ b/apps/docs/src/community/team/TeamList.vue @@ -0,0 +1,117 @@ + + + + + diff --git a/apps/docs/src/community/team/TeamMember.vue b/apps/docs/src/community/team/TeamMember.vue new file mode 100644 index 0000000..70e11d8 --- /dev/null +++ b/apps/docs/src/community/team/TeamMember.vue @@ -0,0 +1,395 @@ + + + + + diff --git a/apps/docs/src/community/team/TeamPage.vue b/apps/docs/src/community/team/TeamPage.vue new file mode 100644 index 0000000..12b89dd --- /dev/null +++ b/apps/docs/src/community/team/TeamPage.vue @@ -0,0 +1,79 @@ + + + + + + + diff --git a/apps/docs/src/community/team/members-core.json b/apps/docs/src/community/team/members-core.json new file mode 100644 index 0000000..4d3bc5a --- /dev/null +++ b/apps/docs/src/community/team/members-core.json @@ -0,0 +1,57 @@ +[ + { + "name": "Michael Darko", + "title": "Creator/Maintainer", + "company": "Leaf PHP", + "projects": [ + { + "label": "leafsphp/*", + "url": "https://www.github.com/leafsphp" + } + ], + "location": "Ghana", + "languages": ["English"], + "socials": { + "github": "mychidarko", + "twitter": "mychidarko" + }, + "sponsor": false + }, + { + "name": "André Rosa", + "title": "Developer", + "company": "Leaf PHP", + "projects": [ + { + "label": "leafsphp/*", + "url": "https://www.github.com/leafsphp" + } + ], + "location": "Portugal", + "languages": ["Portuguese", "English"], + "socials": { + "github": "crosa7", + "twitter": "andre_crosa" + }, + "sponsor": false + }, + { + "name": "Ashley Nyanteh", + "title": "Community Manager", + "avatarPic": "https://user-images.githubusercontent.com/26604242/221550910-1a711f42-9589-4981-96e0-d0de19778e7a.png", + "company": "Leaf PHP", + "projects": [ + { + "label": "Leaf PHP Community", + "url": "https://bento.me/leafphp" + } + ], + "location": "Ghana", + "languages": ["English"], + "socials": { + "twitter": "ashleybruwaa", + "linkedin": "ashley-bruwah-nyanteh-1811691b4" + }, + "sponsor": false + } +] diff --git a/apps/docs/src/community/team/members-emeriti.json b/apps/docs/src/community/team/members-emeriti.json new file mode 100644 index 0000000..6208166 --- /dev/null +++ b/apps/docs/src/community/team/members-emeriti.json @@ -0,0 +1,241 @@ +[ + { + "name": "Sarah Drasner", + "title": "Director of Engineering, Core Developer Web", + "company": "Google", + "companyLink": "https://google.com", + "projects": [ + { + "label": "vuejs.org", + "url": "https://github.com/vuejs/vuejs.org" + }, + { + "label": "vue-vscode-snippets", + "url": "https://github.com/sdras/vue-vscode-snippets" + }, + { + "label": "intro-to-vue", + "url": "https://github.com/sdras/intro-to-vue" + }, + { + "label": "vue-vscode-extensionpack", + "url": "https://github.com/sdras/vue-vscode-extensionpack" + }, + { + "label": "ecommerce-netlify", + "url": "https://github.com/sdras/ecommerce-netlify" + } + ], + "location": "Denver, CO, USA", + "languages": ["English"], + "website": { + "label": "sarah.dev", + "url": "https://sarah.dev/" + }, + "socials": { + "github": "sdras", + "twitter": "sarah_edo", + "codepen": "sdras" + } + }, + { + "name": "Chris Fritz", + "title": "Educator & Consultant", + "location": "Durham, NC, USA", + "languages": ["English", "German"], + "socials": { + "github": "chrisvfritz", + "twitter": "chrisvfritz" + }, + "reposPersonal": ["vue-enterprise-boilerplate"] + }, + { + "name": "Blake Newman", + "title": "Performance Specializer & Code Deleter", + "location": "London, UK", + "languages": ["English"], + "socials": { + "github": "blake-newman", + "twitter": "blakenewman" + } + }, + { + "name": "kingwl", + "title": "Software Development Engineer", + "company": "Chaitin", + "companyLink": "https://chaitin.cn/", + "projects": [ + { + "label": "vue", + "url": "https://github.com/vuejs/vue" + } + ], + "location": "Beijing, China", + "languages": ["Chinese"], + "socials": { + "github": "kingwl" + } + }, + { + "name": "Alan Song", + "title": "Cofounder", + "company": "Futurenda", + "companyLink": "https://www.futurenda.com/", + "projects": [ + { + "label": "vue-router", + "url": "https://github.com/vuejs/vue-router" + } + ], + "location": "Hangzhou, China", + "languages": ["Chinese", "English"], + "socials": { + "github": "fnlctrl" + } + }, + { + "name": "defcc", + "title": "Details Deity & Bug Surgeon", + "company": "zbj.com", + "companyLink": "http://www.zbj.com/", + "location": "Chongqing, China", + "languages": ["Chinese", "English"], + "socials": { + "github": "defcc" + } + }, + { + "name": "gebilaoxiong", + "title": "Issue Annihilator", + "company": "zbj.com", + "companyLink": "http://www.zbj.com/", + "location": "Chongqing, China", + "languages": ["Chinese", "English"], + "socials": { + "github": "gebilaoxiong" + } + }, + { + "name": "Denis Karabaza", + "title": "Software Engineer", + "company": "Neolant", + "companyLink": "http://neolant.ru/", + "location": "Dubna, Russia", + "languages": ["Russian", "English"], + "socials": { + "github": "simplesmiler", + "twitter": "simplesmiler" + } + }, + { + "name": "Edd Yerburgh", + "title": "Full Stack Developer", + "projects": [ + { + "label": "vue-test-utils", + "url": "https://github.com/vuejs/vue-test-utils" + }, + { + "label": "avoriaz", + "url": "https://github.com/avoriaz" + } + ], + "location": "London, UK", + "languages": ["English"], + "socials": { + "github": "eddyerburgh", + "twitter": "EddYerburgh" + }, + "website": { + "label": "www.eddyerburgh.me", + "url": "https://www.eddyerburgh.me" + } + }, + { + "name": "Pine Wu", + "title": "Nomad", + "projects": [ + { + "label": "vetur", + "url": "https://github.com/vuejs/vetur" + } + ], + "location": "Shanghai, China", + "languages": ["Chinese", "English", "Japanese"], + "socials": { + "github": "octref", + "twitter": "octref" + } + }, + { + "name": "ULIVZ", + "title": "Senior Frontend Developer", + "company": "AntFinancial", + "companyLink": "https://www.antfin.com", + "projects": [ + { + "label": "vuepress", + "url": "https://www.github.com/vuejs/vuepress" + } + ], + "location": "Hangzhou, China", + "languages": ["Chinese", "English"], + "socials": { "github": "ulivz", "twitter": "_ulivz" } + }, + { + "name": "Katashin", + "title": "Software Engineer", + "company": "ClassDo", + "companyLink": "https://classdo.com", + "projects": [ + { + "label": "vuex", + "url": "https://github.com/vuejs/vuex" + }, + { + "label": "vue-class-component", + "url": "https://github.com/vuejs/vue-class-component" + }, + { + "label": "vue-designer", + "url": "https://github.com/ktsn/vue-designer" + } + ], + "location": "Singapore", + "languages": ["Japanese", "English"], + "socials": { + "github": "ktsn", + "twitter": "ktsn" + } + }, + { + "name": "Michał Sajnóg", + "title": "Senior Frontend Developer / Team Leader", + "company": "Netguru", + "companyLink": "https://netguru.co/", + "location": "Poznań, Poland", + "languages": ["Polish", "English"], + "projects": [ + { + "label": "eslint-plugin-vue", + "url": "https://github.com/vuejs/eslint-plugin-vue" + }, + { + "label": "vue-devtools", + "url": "https://github.com/vuejs/devtools" + }, + { + "label": "vue-computed-helpers", + "url": "https://github.com/michalsnik/vue-computed-helpers" + }, + { + "label": "vue-content-placeholders", + "url": "https://github.com/michalsnik/vue-content-placeholders" + } + ], + "socials": { + "github": "michalsnik", + "twitter": "michalsnik" + } + } +] diff --git a/apps/docs/src/community/team/members-partner.json b/apps/docs/src/community/team/members-partner.json new file mode 100644 index 0000000..d28634b --- /dev/null +++ b/apps/docs/src/community/team/members-partner.json @@ -0,0 +1,651 @@ +[ + { + "name": "Maria Lamardo", + "title": "Front End Engineer", + "company": "Pendo", + "projects": [ + { + "label": "vuejs/events", + "url": "https://github.com/vuejs/events" + } + ], + "location": "Raleigh, NC, USA", + "languages": ["English", "Spanish"], + "socials": { + "github": "mlama007", + "twitter": "MariaLamardo" + } + }, + { + "name": "Daniel Roe", + "title": "Framework Architect", + "company": "Nuxt", + "projects": [ + { + "label": "nuxt", + "url": "https://github.com/nuxt" + }, + { + "label": "typed-vuex", + "url": "https://github.com/danielroe/typed-vuex" + } + ], + "location": "United Kingdom", + "languages": ["English"], + "socials": { + "github": "danielroe", + "twitter": "danielcroe", + "linkedin": "daniel-roe" + } + }, + { + "name": "Pratik Patel", + "avatarPic": "https://pbs.twimg.com/profile_images/1541624512/profile-pic-09-11-2011_400x400.png", + "title": "Organizer", + "company": "VueConf US", + "projects": [ + { + "label": "us.vuejs.org", + "url": "https://us.vuejs.org/" + } + ], + "location": "Atlanta, GA, USA", + "languages": ["English"], + "socials": { + "twitter": "prpatel" + } + }, + { + "name": "Vincent Mayers", + "avatarPic": "https://pbs.twimg.com/profile_images/916531463905992706/MNvTkO5K_400x400.jpg", + "title": "Organizer", + "company": "VueConf US", + "projects": [ + { + "label": "us.vuejs.org", + "url": "https://us.vuejs.org/" + } + ], + "location": "Atlanta, GA, USA", + "languages": ["English"], + "socials": { + "twitter": "vincentmayers" + } + }, + { + "name": "Luke Thomas", + "avatarPic": "https://pbs.twimg.com/profile_images/1123492769299877888/aviXE_M5_400x400.jpg", + "title": "Creator", + "company": "Vue.js Amsterdam", + "projects": [ + { + "label": "vuejs.amsterdam", + "url": "https://vuejs.amsterdam" + } + ], + "location": "Amsterdam, Netherlands", + "languages": ["Dutch", "English", "German"], + "socials": { + "twitter": "lukevscostas", + "linkedin": "luke-kenneth-thomas-578b3916a" + } + }, + { + "name": "Jos Gerards", + "avatarPic": "https://pbs.twimg.com/profile_images/1110510517951627269/LDzDyd4N_400x400.jpg", + "title": "Event Manager", + "company": "Vue.js Amsterdam", + "projects": [ + { + "label": "vuejs.amsterdam", + "url": "https://vuejs.amsterdam" + } + ], + "location": "Amsterdam, Netherlands", + "languages": ["Dutch", "English", "German"], + "socials": { + "twitter": "josgerards88", + "linkedin": "josgerards" + } + }, + { + "name": "Jen Looper", + "title": "CEO", + "company": "Vue Vixens", + "projects": [ + { + "label": "vuevixens.org", + "url": "https://vuevixens.org/" + }, + { + "label": "nativescript-vue.org", + "url": "https://nativescript-vue.org/" + } + ], + "location": "Boston, MA, USA", + "languages": ["English", "French"], + "socials": { + "github": "jlooper", + "twitter": "jenlooper" + } + }, + { + "name": "Alex Jover", + "title": "Web, PWA and Performance Consultant", + "company": "Freelance", + "projects": [ + { + "label": "v-runtime-template", + "url": "https://github.com/alexjoverm/v-runtime-template" + }, + { + "label": "v-lazy-image", + "url": "https://github.com/alexjoverm/v-lazy-image" + }, + { + "label": "vue-testing-series", + "url": "https://github.com/alexjoverm/vue-testing-series" + } + ], + "location": "Alicante, Spain", + "languages": ["Spanish", "English"], + "website": { + "label": "alexjover.com", + "url": "https://alexjover.com" + }, + "socials": { + "github": "alexjoverm", + "twitter": "alexjoverm" + } + }, + { + "name": "Sebastien Chopin", + "title": "#1 Nuxt Brother", + "company": "NuxtJS", + "companyLink": "https://nuxtjs.org", + "location": "Bordeaux, France", + "languages": ["French", "English"], + "projects": [ + { + "label": "nuxt/*", + "url": "https://github.com/nuxt" + }, + { + "label": "nuxt-community/*", + "url": "https://github.com/nuxt-community" + }, + { + "label": "nuxt/vue-meta", + "url": "https://github.com/nuxt/vue-meta" + } + ], + "socials": { + "github": "Atinux", + "twitter": "Atinux" + } + }, + { + "name": "Alexandre Chopin", + "title": "#1 Nuxt Brother", + "company": "NuxtJS", + "companyLink": "https://nuxtjs.org", + "location": "Bordeaux, France", + "languages": ["French", "English"], + "projects": [ + { + "label": "nuxt/*", + "url": "https://github.com/nuxt" + }, + { + "label": "nuxt-community/*", + "url": "https://github.com/nuxt-community" + }, + { + "label": "vue-flexboxgrid", + "url": "https://github.com/alexchopin/vue-flexboxgrid" + } + ], + "socials": { + "github": "alexchopin", + "twitter": "iamnuxt" + } + }, + { + "name": "Khary Sharpe", + "title": "Viral Newscaster", + "location": "Kingston, Jamaica", + "languages": ["English"], + "projects": [ + { + "label": "VueJsNews", + "url": "https://twitter.com/VueJsNews" + } + ], + "website": { + "label": "www.kharysharpe.com", + "url": "http://www.kharysharpe.com/" + }, + "socials": { + "github": "kharysharpe", + "twitter": "kharysharpe" + } + }, + { + "name": "Pooya Parsa", + "title": "Technical Advisor", + "company": "Fandogh (AUT University)", + "companyLink": "https://fandogh.org", + "location": "Tehran, Iran", + "languages": ["Persian", "English"], + "projects": [ + { + "label": "nuxt/*", + "url": "https://github.com/nuxt" + }, + { + "label": "nuxt-community/*", + "url": "https://github.com/nuxt-community" + }, + { + "label": "bootstrap-vue/*", + "url": "https://github.com/bootstrap-vue" + } + ], + "socials": { + "github": "pi0", + "twitter": "_pi0_" + } + }, + { + "name": "Xin Du", + "title": "Nuxpert", + "location": "Dublin, Ireland", + "languages": ["Chinese", "English"], + "projects": [ + { + "label": "nuxt/*", + "url": "https://github/com/nuxt" + }, + { + "label": "nuxt-community/*", + "url": "https://github/com/nuxt-community" + } + ], + "socials": { + "github": "clarkdo", + "twitter": "ClarkDu_" + } + }, + { + "name": "Yi Yang", + "title": "Interface Elementologist", + "company": "ele.me", + "companyLink": "https://www.ele.me", + "location": "Shanghai, China", + "languages": ["Chinese", "English"], + "projects": [ + { + "label": "elemefe/element", + "url": "https://github.com/elemefe/element" + }, + { + "label": "elemefe/mint-ui", + "url": "https://github.com/elemefe/mint-ui" + } + ], + "socials": { + "github": "Leopoldthecoder" + } + }, + { + "name": "Bruno Lesieur", + "title": "Cofounder", + "company": "Orchard ID", + "companyLink": "https://www.orchard-id.com/", + "projects": [ + { + "label": "vuejs-fr/*", + "url": "https://vuejs-fr" + }, + { + "label": "vuejs-fr/*", + "url": "https://Haeresis/node-atlas-hello-vue" + }, + { + "label": "https://node-atlas.js.org/", + "url": "https://node-atlas.js.org/" + } + ], + "location": "Annecy, France", + "languages": ["French", "English"], + "website": { + "label": "blog.lesieur.name/", + "url": "https://blog.lesieur.name/" + }, + "socials": { + "github": "Haeresis", + "twitter": "ZetesEthique" + } + }, + { + "name": "ChangJoo Park", + "title": "Vuenthusiastic Korean Community Organizer", + "location": "Seoul, South Korea", + "languages": ["Korean", "English"], + "projects": [ + { + "label": "vuejs-kr/kr.vuejs.org", + "url": "https://github.com/vuejs-kr/kr.vuejs.org" + }, + { + "label": "ChangJoo-Park/vue-component-generator", + "url": "https://github.com/ChangJoo-Park/vue-component-generator" + }, + { + "label": "vuejs-kr.github.io", + "url": "https://vuejs-kr.github.io" + } + ], + "socials": { + "github": "changjoo-park", + "twitter": "pcjpcj2" + } + }, + { + "name": "Erick Petrucelli", + "title": "Head of Engineering", + "company": "Airbank", + "companyLink": "https://www.joinairbank.com/", + "location": "João Pessoa, Brazil", + "languages": ["Portuguese", "English"], + "projects": [ + { + "label": "vuejs-br", + "url": "https://github.com/vuejs-br" + } + ], + "socials": { + "github": "ErickPetru", + "linkedin": "erick-petrucelli", + "twitter": "erickpetru" + } + }, + { + "name": "Razvan Stoenescu", + "title": "Deep Space Quasar Creator", + "company": "Quasar Framework", + "companyLink": "https://quasar.dev/", + "location": "Bucharest, Romania", + "languages": ["Romanian", "English"], + "projects": [ + { + "label": "quasarframework/quasar", + "url": "https://github.com/quasarframework/quasar" + }, + { + "label": "quasarframework", + "url": "https://github.com/quasarframework" + } + ], + "socials": { + "github": "rstoenescu", + "twitter": "quasarframework" + } + }, + { + "name": "Jilson Thomas", + "title": "Senior Frontend Developer", + "company": "Nominator", + "companyLink": "https://nominator.com/", + "projects": [ + { + "label": "vuejobs.com", + "url": "https://vuejobs.com" + } + ], + "location": "Toronto, Canada", + "languages": ["English"], + "socials": { + "github": "JillzTom", + "twitter": "jilsonthomas" + } + }, + { + "name": "Israel Ortuño", + "title": "Full Stack Web Developer", + "company": "Freelance", + "projects": [ + { + "label": "vuejobs.com", + "url": "https://vuejobs.com" + } + ], + "location": "Alicante, Spain", + "languages": ["Spanish", "English"], + "socials": { + "github": "IsraelOrtuno", + "twitter": "IsraelOrtuno" + } + }, + { + "name": "John Leider", + "title": "CEO", + "company": "Vuetify LLC", + "companyLink": "https://vuetifyjs.com", + "location": "Fort Worth, TX, USA", + "languages": ["English"], + "projects": [ + { + "label": "vuetifyjs/vuetify", + "url": "https://github.com/vuetifyjs/vuetify" + } + ], + "socials": { + "github": "vuetifyjs", + "twitter": "vuetifyjs" + } + }, + { + "name": "Grigoriy Beziuk", + "title": "Full Stack Web Developer", + "company": "Self Employed", + "companyLink": "http://gbezyuk.ru", + "location": "Moscow, Russia", + "languages": ["Russian", "German", "English"], + "projects": [ + { + "label": "translation-gang/ru.vuejs.org", + "url": "https://github.com/translation-gang/ru.vuejs.org" + } + ], + "socials": { + "github": "gbezyuk" + } + }, + { + "name": "Alexander Sokolov", + "title": "Russian Translation Sharp Eye", + "location": "Krasnodar, Russia", + "languages": ["Russian", "English"], + "projects": [ + { + "label": "translation-gang/ru.vuejs.org", + "url": "https://github.com/translation-gang/ru.vuejs.org" + } + ], + "socials": { "github": "Alex-Sokolov" } + }, + { + "name": "Anthony Gore", + "title": "Author", + "company": "Vue.js Developers", + "companyLink": "https://vuejsdevelopers.com/", + "location": "Sydney, Australia", + "languages": ["English"], + "website": { + "label": "vuejsdevelopers.com", + "url": "https://vuejsdevelopers.com" + }, + "socials": { "github": "anthonygore", "twitter": "anthonygore" } + }, + { + "name": "EGOIST", + "title": "Build Tool Simplificator", + "location": "Chengdu, China", + "projects": [ + { + "label": "poi", + "url": "https://github.com/egoist/poi" + }, + { + "label": "ream", + "url": "https://github.com/egoist/ream" + }, + { + "label": "vue-play", + "url": "https://github.com/egoist/vue-play" + } + ], + "languages": ["Chinese", "English"], + "socials": { "github": "egoist", "twitter": "_egoistlily" } + }, + { + "name": "Alex Kyriakidis", + "title": "Consultant / Author", + "location": "Thessaloniki, Greece", + "languages": ["el", "English"], + "socials": { "github": "hootlex", "twitter": "hootlex" }, + "projects": [ + { + "label": "vuejs-paginator", + "url": "https://github.com/hootlex/vuejs-paginator" + }, + { + "label": "vuedo/vuedo", + "url": "https://github.com/vuedo/vuedo" + }, + { + "label": "the-majesty-of-vuejs-2", + "url": "https://github.com/hootlex/the-majesty-of-vuejs-2" + }, + { + "label": "vuejsfeed.com", + "url": "https://vuejsfeed.com/" + }, + { + "label": "vueschool.io", + "url": "https://vueschool.io/" + } + ] + }, + { + "name": "Rolf Haug", + "title": "Educator & Consultant", + "company": "Vue School", + "companyLink": "https://vueschool.io/", + "location": "Oslo, Norway", + "languages": ["English"], + "projects": [ + { + "label": "vueschool.io", + "url": "https://vueschool.io/" + } + ], + "website": { + "label": "rah.no", + "url": "https://rah.no" + }, + "socials": { "github": "rahaug", "twitter": "rahaug" } + }, + { + "name": "Andrew Tomaka", + "title": "The Server Server", + "company": "Michigan State University", + "companyLink": "https://msu.edu/", + "location": "East Lansing, MI, USA", + "languages": ["English"], + "projects": [ + { + "label": "vuejs/*", + "url": "https://www.github.com/vuejs" + } + ], + "socials": { "github": "atomaka", "twitter": "atomaka" }, + "website": { + "label": "atomaka.com", + "url": "https://atomaka.com/" + } + }, + { + "name": "Blake Newman", + "title": "Software Engineer", + "company": "Attest", + "companyLink": "https://www.askattest.com/", + "location": "London, UK", + "languages": ["English"], + "projects": [ + { + "label": "vuejs.london", + "url": "https://vuejs.london" + } + ], + "socials": { "github": "blake-newman", "twitter": "blakenewman" } + }, + { + "name": "Filip Rakowski", + "title": "Co-founder of Vue Storefront", + "company": "Divante", + "companyLink": "https://divante.co/", + "location": "Wrocław, Poland", + "languages": ["Polish", "English"], + "projects": [ + { + "label": "DivanteLtd/vue-storefront", + "url": "https://vuestorefront.io" + }, + { + "label": "DivanteLtd/storefront-ui", + "url": "https://storefrontui.io" + } + ], + "socials": { "github": "filrak", "twitter": "filrakowski" } + }, + { + "name": "Gregg Pollack", + "title": "Vue Instructor", + "company": "Vue Mastery", + "companyLink": "https://www.vuemastery.com/", + "location": "Orlando, FL, USA", + "languages": ["English"], + "projects": [ + { + "label": "www.vuemastery.com", + "url": "https://www.vuemastery.com" + }, + { + "label": "news.vuejs.org/", + "url": "https://news.vuejs.org/" + } + ], + "socials": { "github": "gregg", "twitter": "greggpollack" } + }, + { + "name": "Adam Jahr", + "title": "Vue Instructor", + "company": "Vue Mastery", + "companyLink": "https://www.vuemastery.com/", + "location": "Orlando, FL, USA", + "languages": ["English"], + "projects": [ + { + "label": "www.vuemastery.com", + "url": "https://www.vuemastery.com" + }, + { + "label": "news.vuejs.org/", + "url": "https://news.vuejs.org/" + } + ], + "socials": { "github": "atomjar", "twitter": "adamjahr" } + } +] diff --git a/apps/docs/src/community/team/members-translation.json b/apps/docs/src/community/team/members-translation.json new file mode 100644 index 0000000..852fcb8 --- /dev/null +++ b/apps/docs/src/community/team/members-translation.json @@ -0,0 +1,39 @@ +[ + { + "name": "Michael Darko", + "title": "Creator/Maintainer", + "company": "Leaf PHP", + "projects": [ + { + "label": "leafsphp/*", + "url": "https://www.github.com/leafsphp" + } + ], + "location": "Ghana", + "languages": ["English"], + "socials": { + "github": "mychidarko", + "twitter": "mychidarko" + }, + "sponsor": false + }, + { + "name": "Ashley Nyanteh", + "title": "Community Manager", + "avatarPic": "https://user-images.githubusercontent.com/26604242/221550910-1a711f42-9589-4981-96e0-d0de19778e7a.png", + "company": "Leaf PHP", + "projects": [ + { + "label": "Leaf PHP Community", + "url": "https://bento.me/leafphp" + } + ], + "location": "Ghana", + "languages": ["English"], + "socials": { + "instagram": "bruwaaaa", + "twitter": "ashleybruwaa" + }, + "sponsor": false + } +] diff --git a/apps/docs/src/docs/cli/index.md b/apps/docs/src/docs/cli/index.md new file mode 100644 index 0000000..eaa0da7 --- /dev/null +++ b/apps/docs/src/docs/cli/index.md @@ -0,0 +1,432 @@ +# Leaf CLI + + + + + +

+ + +

+ +Leaf CLI is a simple command line tool for creating and interacting with your Leaf applications. It gives you the options to create projects, install dependencies, run scripts, scaffold items and much more. + +## Installation + + + +You can install the leaf cli using composer. Composer is a dependency manager for PHP. You can follow the instructions on [getcomposer.org](https://getcomposer.org) to install composer on your system. From there, you should have access to the `composer` command from anywhere on your system. + +```bash +composer --version +``` + +You should then be able to get the Leaf CLI up and and running on your system using composer: + +```bash +composer global require leafs/cli +``` + +After that, you should have access to the `leaf` command from anywhere on your system. + +```bash +leaf --version +``` + +## command not found: leaf + +If you get a `command not found: leaf` error, it means your composer bin is not in your system path. + +You need to make sure that Composer's system-wide vendor bin directory is in your system `$PATH` so the leaf executable can be located by your system. This directory exists in different locations based on your operating system; however, some common locations include: + +- Windows: `%USERPROFILE%\AppData\Roaming\Composer\vendor\bin` +- macOS: `$HOME/.composer/vendor/bin` +- GNU / Linux Distributions: `$HOME/.config/composer/vendor/bin` or `$HOME/.composer/vendor/bin` + +You could also find the composer's global installation path by running `composer global about` and looking up from the first line. + +## Adding composer bin to path + +Once you find your composer global installation path, you can add it to your path. **There are some examples below which you can copy and paste in your terminal.** + +Eg (Adding composer bin to path linux): + +```bash +export PATH=$PATH:$HOME/.config/composer/vendor/bin +``` + +Eg (Adding composer bin to path mac): + +```bash +export PATH=$PATH:$HOME/.composer/vendor/bin +echo $PATH +``` + +::: tip NOTE +To get leaf cli installed permanently, you will need to add your composer bin your `.bashrc` or `.zshrc` file on mac and linux. + +**zsh:** + +```bash +echo 'export PATH="$PATH:$HOME/.composer/vendor/bin"' >> ~/.zshrc +source ~/.zshrc +``` + +**bash:** + +```bash +echo 'export PATH="$PATH:$HOME/.composer/vendor/bin"' >> ~/.bashrc +source ~/.bashrc +``` + +::: + +## Creating a leaf app + + + +To start a new project, open up your terminal and move into a directory you want to generate your projects in. From there, you can use the `leaf create` command to set up a new Leaf app in that directory: + +```bash +leaf create +``` + +This will prompt you to select a preset. Presets are quick ways to get your project up and running as quickly as possible. You can select a preset from the list of presets displayed to you: + +```bash +? What kind of app do you want to create? [leaf] + [0] leaf + [1] leaf mvc + [2] leaf api + > +``` + +*You can select a number or type in the preset you prefer.* + +A leaf app will be generated based on the associated preset. As you can see, there are 3 presets: + +- **Leaf**: a bare Leaf project +- **Leaf MVC**: a Leaf project with leaf mvc +- **Leaf API**: a Leaf project with leaf api + +The Leaf CLI will automatically install the dependencies for the preset you selected and set up your project using Leaf 3. From there, you can `cd` into your project and start building. + +```bash +cd +leaf serve +``` + +### Custom installation New + +The Leaf CLI also comes with a custom installation option. This allows you to customize your project to your liking. You can select the features you want to add to your project and the Leaf CLI will set it up for you. + +```bash +leaf create --custom +``` + +This will prompt you to select the features you want to add to your project. You can select the features you want to add to your project from the list of features displayed to you: + +```bash +? What modules would you like to add? [none] eg: 1,2,7 + [0] None + [1] Database + [2] Authentication + [3] Session support + [4] Cookie support + [5] CSRF protection + [6] CORS support + [7] Leaf Date + [8] Leaf Fetch + > +``` + +For Leaf MVC, you can also select things like the View engine you prefer to use: + +```bash +? What view engine would you like to use? [Blade] + [0] Blade + [1] Bare UI + [2] React/Vue + > +``` + +Whether to add a bundler for your frontend assets: + +```bash +? Do you want to add Vite to bundle your assets? [Yes] +``` + +And whether to add a testing framework: + +```bash +? What testing framework would you like to use? [none] + [0] none + [1] pest + [2] phpunit + > +``` + +### GUI New + +These new options are quite a lot to take in, so we've also added a GUI to help you select the features you want to add to your project. The GUI allows you to select different structures and features you want to add to your project. The GUI can also install and setup frontend systems like React, Vue, Tailwind and more. + +You can get started with the following command: + +```bash +leaf ui +``` + + + +### Quick presets + +Leaf CLI also provides a quicker way to initialize your project without having to go through the interactive installer. You can use the `--mvc`, `--api`, and `--basic` options to generate your project based on a specific presets. These generate the following: + +- `--basic`: a bare Leaf project +- `--mvc`: a Leaf project with leaf mvc +- `--api`: a Leaf project with leaf api + +```bash +leaf create --mvc +``` + +### Adding Tests + +The Leaf CLI by default will generate your project without any testing framework. However, you will be prompted to add a testing framework if you select the `--custom` option. + +```bash +leaf create --custom +``` + +You can still add a testing framework without using the `--custom` option by using either the `--pest` for Pest PHP tests: + +```bash +leaf create --pest +``` + +Or the `--phpunit` option for PHPUnit tests: + +```bash +leaf create --phpunit +``` + +### Using docker + +Leaf CLI also provides a way to generate your project with docker. You can use the `--docker` option to add all the necessary files to your project to run it with docker. + +```bash +leaf create --docker +``` + +If you are using the `--custom` option, you will be asked if you want to add docker to your project. For the full docker guide, you can check out the [docker guide](/docs/introduction/docker). + +## Running your leaf apps + +After generating your leaf app, you can `cd` into the directory and spin up a local dev server using leaf cli's `serve` command. + +```bash +cd backend-api +leaf serve +``` + +You can also specify the port to run your leaf app on using the `--port` or `-p` options. + +```bash +leaf serve -p 3000 +``` + +### File watching + +In v2.1, you can also start the leaf server with hot module watching. This reloads your application anytime a change is made to your application code. To get started, simply start the leaf server with the `--watch` flag. + +```bash +leaf serve --port 8000 --watch +``` + +### Dependency Management + +The serve command will also try to install dependencies for your project if it doesn't detect a `vendor` folder present in the current working directory. + + + +## Testing your Leaf apps + +Testing helps prevent bugs in your app which you may not catch until you publish your app to production. Leaf introduced a test runner which helps you initialize testing and run tests in your app without needing any config first. Alchemy has also been integrated into the Leaf CLI and so you can use it's functionality directly. + +### Setting up tests + +If you already have a project and want to setup tests, you can use the `test:setup`. It will automatically detect the testing framework you are using and setup tests for you. It also supports Pest PHP and PHPUnit, so you can use either of them using the `--phpunit` or `--pest` options. + +```bash +# pest +leaf test:setup --pest + +# phpunit +leaf test:setup --phpunit +``` + +This will create a `tests` folder in your project and add example tests to it based on the testing framework you are using. + +### Running tests + +To run tests you've setup or created, you can use the `test` command. + +```bash +leaf test +``` + +## Installing packages + +This cli tool also adds a feature to install leaf packages from composer. + +```bash +leaf install leafs/ui +``` + +If you are installing a leaf module or package, you can leave out the `leafs/` part. + +```bash +leaf install ui +``` + +You can also pass in a bunch of packages to install at once. + +```bash +leaf install ui db illuminate/support +``` + +***Versioning*** + +Leaf CLI also allows you to install a particular version of any package using `@` + +```bash +leaf install ui@1.0 illuminate/support@9.0.2 +``` + +## Interactive Shell + +You can also use the interactive shell to interact with your app. + +```bash +$ leaf interact +... +>>> $user = new User; +... +>>> $user->name = "Mychi"; +... +>>> $user->save(); +``` + +## Updating leaf cli + +Leaf CLI keeps getting better with every release, and by default, it checks for updates every time you run a command. However, you can also manually update your leaf cli using the `update` command. + +```bash +leaf update +``` + +If this doesn't work, or you want to hard reset the Leaf CLI to clear cache, you can re-install it via composer: + +```bash +composer global remove leafs/cli +composer global require leafs/cli +``` + +## View commands New + +Leaf CLI also allows you to create and interact with frontend setups using the `view` commands. You can scaffold frontend setups like React, Vue, templating engines, build tools, and more. + +### Scaffolding views + +Leaf CLI ships with a `view:install` command that allows you to setup React, Vue, and templating engines like Blade and BareUI. You can use the `--react`, `--vue`, `--blade`, and `--bareui` options to scaffold your frontend setup. + +```bash +leaf view:install --react +``` + +You can also use the `--vite` and `--tailwind` options to scaffold Vite and Tailwind respectively. + +### Running frontend setups + +Since Leaf CLI is a backend tool, it doesn't come with a frontend server. However, you can use the `view:dev` command to run your frontend setup which may include in a dev server for your frontend. + +```bash +leaf view:dev +``` + +### Building frontend setups + +You can also use the `view:build` command to build your frontend setup for production. + +```bash +leaf view:build +``` + +## Running Scripts + +Leaf CLI also now allows you run scripts defined in your `composer.json` file. For example, if you have this in your composer.json: + +![image](https://user-images.githubusercontent.com/26604242/166419297-225b0b00-c979-4096-a23d-4f7858def8fb.png) + +You can run the test script like this: + +```bash +leaf run test +``` + +## Usage Guide + +```bash + _ __ ___ _ ___ +| | ___ __ _ / _| / __| | |_ v2.8.3 +| |__/ -_) _` | _| | (__| |__ | | +|____\___\__,_|_| \___|____|___| + + +Usage: + command [options] [arguments] + +Options: + -h, --help Display help for the given command. When no command is given display help for the list command + -q, --quiet Do not output any message + -V, --version Display this application version + --ansi|--no-ansi Force (or disable --no-ansi) ANSI output + -n, --no-interaction Do not ask any interactive question + -v|vv|vvv, --verbose Increase the verbosity of messages: 1 for normal output, 2 for more verbose output and 3 for debug + +Available commands: + completion Dump the shell completion script + create [init|new] Create a new Leaf PHP project + deploy [publish] Deploy your leaf project + help Display help for a command + install Add a new package to your leaf app + interact Interact with your application + list List commands + run Run a script in your composer.json + serve Run your Leaf app + test Test your leaf application through leaf alchemy + uninstall Uninstall a package + update Update leaf cli to the latest version + test + test:setup Add tests to your application + view + view:build Run your frontend dev server + view:dev Run your frontend dev server + view:install Run a script in your composer.json +``` + +This is the full list of commands available with Leaf CLI 2. A new update command has been added to allow you seamlessly update leaf CLI without having to run a bunch of commands. You don't even need to run this manually since leaf cli will automatically check for updates and upgrade to the latest stable release. diff --git a/apps/docs/src/docs/config/index.md b/apps/docs/src/docs/config/index.md new file mode 100755 index 0000000..396dd8d --- /dev/null +++ b/apps/docs/src/docs/config/index.md @@ -0,0 +1,148 @@ +# Overview + + + + + +Unlike other frameworks, Leaf requires no configuration out of the box. However, Leaf provides options for those who want to customize the framework to their needs. + +## Applying Config + +There are 32 main ways to apply config to your Leaf application. Although they achieve the same result, each method has its own advantages and disadvantages. Let's take a look: + +
+ +- **Passing config during instantiation** + + To define settings upon instantiation, pass an associative array into the Leaf constructor. The array keys are the setting names and the array values are the setting values. This is the most performant way to define settings for Leaf, and we'll recommend this if you're using class mode. + + ```php + $app = new Leaf\App([ + 'debug' => true + ]); + ``` + +- **Using the `config()` method** + + This method is the most common way to apply config to your Leaf application. It's also the most flexible way to apply config. You can apply config at any point in your application, and you can apply multiple config at once. *Note that the config will only be applied to code that comes after the config method.* + + ```php + $app = new Leaf\App; + $app->config([ + 'debug' => true, + 'views.path' => '../views' + ]); + ``` + +
+
+ +- **Using the `config()` method** + + The `config()` method is the recommended way to apply config to your Leaf application. It allows you to set and get config values at any point in your application, and you can apply multiple config at once. *Note that the config will only be applied to code that comes after the config method.* + + ```php + app()->config([ + 'debug' => true, + 'views.path' => '../views' + ]); + ``` + +
+ +- **Using the `Leaf\Config` class** + + The Config class is the central point for all of Leaf's config. It allows you to set and get config from anywhere in your app. However, it is best to set config before initializing Leaf. + + ```php + Leaf\Config::set([ + 'views.path' => 'views', + 'views.cachePath' => 'views/cache' + ]); + + // your leaf app after this + ``` + +## Nested Config + +Leaf allows you to nest config into groups. This means that you can group config into arrays. This is especially useful when you're scoping features based on some configuration. + +For example, you can group all your server config into a `server` array: + +
+ +```php +$app = new Leaf\App([ + 'server' => [ + 'host' => 'localhost', + 'port' => 8080 + ] +]); +``` + +
+
+ +```php +app()->config([ + 'server' => [ + 'host' => 'localhost', + 'port' => 8080 + ] +]); +``` + +
+ +You can then access the config using the `config()` method: + +
+ +```php +$app->config('server.host'); // localhost +``` + +
+
+ +```php +app()->config('server.host'); // localhost +``` + +
+ +You can also retrieve the entire config group by passing the group name: + +
+ +```php +$app->config('server'); // ['host' => 'localhost', 'port' => 8080] +``` + +
+
+ +```php +app()->config('server'); // ['host' => 'localhost', 'port' => 8080] +``` + +
+ +This isn't limited to only retrieving config. You can also set config using the same method: + +
+ +```php +$app->config('server.host', '127.0.0.1'); +``` + +
+
+ +```php +app()->config('server.host', '127.0.0.1'); +``` + +
diff --git a/apps/docs/src/docs/config/nsm.md b/apps/docs/src/docs/config/nsm.md new file mode 100755 index 0000000..baa1e91 --- /dev/null +++ b/apps/docs/src/docs/config/nsm.md @@ -0,0 +1,99 @@ +# Application Environment + + + + + +When building an application, it is helpful to distinguish between what is "running locally" versus what is "running in production". For example, you may have a different database running locally than you do on your production server. + +To make this a breeze, Leaf provides robust support for environment based configuration, allowing you to conveniently handle configuration values for different environments. + +## Environment variables + +In a sense of your applications, environment variables are dynamic values that affect the way your applications behave. They are part of the environment in which a process runs. For example, your app can use the value of the TEMP environment variable to discover a suitable location to store temporary files. Environment variables are easy to change between environments, such as development, staging, and production. + + + +## Loading env variables + +Leaf doesn't come with an env loader out of the box, but you can add one yourself. Env loaders allow you to load environment variables from a `.env` file into PHP's `$_ENV` and `$_SERVER` globals. You can then access these variables using the `_env()` helper function that Leaf provides. Here's a list of some of the most popular env loaders: + +- [vlucas/phpdotenv](https://github.com/vlucas/phpdotenv) +- [symfony/dotenv](https://github.com/symfony/dotenv) + +## Using env variables + +After loading your env variables, you can access them using the `_env()` helper function. The `_env()` function takes in a key and a default value. If the key is found, the value is returned, otherwise the default value is returned. + +```php +$serverEnvironment = _env('APP_ENV', 'development'); +``` + +## Application Modes + +Using the concept of environments like `development`, `testing`, and `production` is a common way to prepare an application to behave correctly in each environment. Leaf takes this concept one step further and introduces the concept of application modes. Application modes allow you to configure your application for a specific purpose. + +For example, you may want to enable debugging in “development” mode but not in “production” mode. The examples below demonstrate how to configure Leaf differently for a given mode. + +### Setting your application mode + +Leaf will automatically set the application mode based on the value of the `APP_ENV` environment variable. If the `APP_ENV` environment variable is not set, Leaf will set the application mode to `development`. This is because Leaf assumes you are developing your application locally when no environment is set. + +You can also set the application mode manually using the `mode` setting in your application settings. + +
+ +```php +$app->config([ + 'mode' => 'production' +]); +``` + +
+
+ +```php +app()->config([ + 'mode' => 'production' +]); +``` + +
+ +### Using your application mode + +The Leaf instance provides a `script()` method that allows you to register a callable that will be invoked when the application mode matches the given mode. The `script()` method accepts two arguments: the mode and a callable. + +
+ +```php +$app->script('production', function () use ($app) { + $app->config([ + 'log.enable' => true, + 'debug' => false + ]); +}); +``` + +
+
+ +```php +app()->script('production', function () { + app()->config([ + 'log.enable' => true, + 'debug' => false + ]); +}); +``` + +
+ +The above example will enable logging and disable debugging when the application mode is set to `production`. diff --git a/apps/docs/src/docs/config/settings.md b/apps/docs/src/docs/config/settings.md new file mode 100755 index 0000000..37bba91 --- /dev/null +++ b/apps/docs/src/docs/config/settings.md @@ -0,0 +1,128 @@ +# App Settings + + + +Leaf has lots of configurations which can be used to determine the way Leaf behaves in your application. You can check the [config page](/docs/config/) for more information on how to set and get configs. This page will show you all the configs available in Leaf. Note that we will only cover the user-facing configs, configs that are used internally by Leaf will not be covered here. + +## app.down + +This configuration tells Leaf whether to place your app in a maintenance like state. By default, this is set to `false`, but you can set it to `true` to place your app in a maintenance like state. + +```php +'app.down' => true +``` + +When your app is in a maintenance like state, Leaf will automatically load the `down` screen. You can customize this screen using Leaf's `setDown` method. + +```php +$app->setDown(function () { + echo 'Custom Down Handler!'; +}); +``` + +**You can read more about the down screen [here](/docs/routing/errors#application-down).** + +## debug + +By default, Leaf will display all errors and warnings you encounter while developing your app. However, when you're ready to deploy your app, you should turn off debugging to prevent users from seeing errors. You can do this by setting the `debug` config to `false`. + +```php +'debug' => false +``` + +Note that when you set `debug` to `false`, Leaf will automatically turn off error reporting and display a custom error page to users. You can customize this page using Leaf's `setError` method. + +```php +$app->setError(function () { + echo "Custom Error Handler!"; +}); +``` + +## Logging + +Leaf has a built-in logger that can be used to log errors and other messages. You can check the [logging page](/docs/tooling/logging) for more information on how to use Leaf's logger. This page will show you all the configs available for Leaf's logger. + +To get started, make sure you have the [logger module](/docs/tooling/logging) installed. Once installed, you should have access to a `logger()` method on the Leaf instance. You can use this method to access Leaf's logger if you want to manually log messages. + +```php +$app->logger()->info('Hello World!'); +``` + +Below are all the configs available for Leaf's logger: + +### log.enabled + +This enables or disables Leaf’s logger. You need to set this to `true` to enable logging. + +```php +'log.enabled' => true +``` + +Note that if `log.enabled` is set to `false`. Leaf will skip initializing anything related to logs, as such, you won't have access to `$app->logger()`, `$app->log` or `$app->logWriter`. + +### log.dir + +This tells leaf which directory to save and look for logs. + +```php +'log.dir' => __DIR__ . '/logs/' +``` + +### log.file + +This setting tells leaf which file to write logs to. + +```php +'log.file' => 'crashes.log' +``` + +*By default, Leaf will write logs to a file named `log.txt`.* + +### log.level + +Leaf has these log levels: + +- \Leaf\Log::EMERGENCY +- \Leaf\Log::ALERT +- \Leaf\Log::CRITICAL +- \Leaf\Log::ERROR +- \Leaf\Log::WARN +- \Leaf\Log::NOTICE +- \Leaf\Log::INFO +- \Leaf\Log::DEBUG + +The `log.level` application setting determines which logged messages will be honored and which will be ignored. For example, if the `log.level` setting is `\Leaf\Log::INFO`, debug messages will be ignored while info, warn, error, and fatal messages will be logged. + +### log.open + +This option takes in a boolean and determines whether Leaf should create the specified log file if it doesn't exist. + +### log.writer + +Use a custom log writer to direct logged messages to the appropriate output destination. By default, Leaf’s logger will write logged messages to `STDERR`. If you use a custom log writer, it must implement this interface: + +```php +public write(mixed $message, int $level); +``` + +The `write()` method is responsible for sending the logged message (not necessarily a string) to the appropriate output destination (e.g. a text file, a database, or a remote web service). The `$level` argument is one of the log levels listed above. + +```php +'log.writer' => new \My\LogWriter() +``` + +## views.path + +The relative or absolute path to the filesystem directory that contains your Leaf application’s view files. + +```php +'views.path' => './views' +``` + +## views.cachePath + +When using a view engine, this config tells Leaf where to store cached views. + +```php +'views.cachePath' => './views/cache' +``` diff --git a/apps/docs/src/docs/introduction/docker.md b/apps/docs/src/docs/introduction/docker.md new file mode 100644 index 0000000..5440efc --- /dev/null +++ b/apps/docs/src/docs/introduction/docker.md @@ -0,0 +1,130 @@ +# Using Docker + + + +Docker allows developers to package their applications and dependencies into lightweight and portable containers, which can be easily deployed and run on any environment, making it easier to develop and deploy applications consistently. This means you don't have to worry about configuring or setting up complicated development tools such as web servers and databases on your local machine. + + + +This guide will walk you through how to set up your Leaf application using Docker from scratch. To get started, you need to install [Docker Desktop](https://www.docker.com/products/docker-desktop/). After this, you can either use the Leaf CLI or manually create your application. + +## Using the Leaf CLI + +The Leaf CLI provides a simple way to get started with Docker in your Leaf applications. To create a new Dockerized Leaf app using the Leaf CLI, you need to add the `--docker` option to the `leaf create` command: + +```bash +leaf create my-app --docker +``` + +This will setup a new Leaf application with Docker support. Although your app is dockerized, Leaf CLI still allows you to use the `serve` command to start your application. This command will automatically start your application using Docker instead of the built-in server. + +```bash +leaf serve +``` + +### Docker Files + +You will notice a bunch of docker related files in your project. These are added by the Leaf CLI since you used the `--docker` option. You can always customize these files to suit your specific needs. + +```bash +├── docker +│ ├── 000-default.conf +│ ├── Dockerfile +│ └── php.ini +├── docker-compose.yml +``` + +- `000-default.conf` is the Apache configuration file that will be used by the Docker container. +- `Dockerfile` is the Dockerfile that will be used to build the Docker image. +- `php.ini` is the PHP configuration file that will be used by the Docker container. +- `docker-compose.yml` is the Docker Compose file that will be used to start the Docker container. + +## Adding to existing projects + +If you already have an existing Leaf application and you want to add Docker support to it, you will need to do so manually. We have provided a sample below that you can use as a reference. + +**Dockerfile:** + +```dockerfile +FROM php:8.1-apache + +COPY 000-default.conf /etc/apache2/sites-available/000-default.conf + +RUN a2enmod rewrite + +RUN apt-get update && apt-get install -y --no-install-recommends \ + libzip-dev \ + wget \ + git \ + unzip + +RUN docker-php-ext-install zip pdo pdo_mysql + +RUN curl -sS https://getcomposer.org/installer | php -- --install-dir=/usr/local/bin --filename=composer + +RUN composer global require leafs/cli + +RUN ln -s /root/.composer/vendor/bin/leaf /usr/local/bin/leaf + +# If you have a custom PHP ini file you can uncomment this line +# COPY ./php.ini /usr/local/etc/php/php.ini + +RUN apt-get purge -y g++ \ + && apt-get autoremove -y \ + && rm -rf /var/lib/apt/lists/* \ + && rm -rf /tmp/* + +WORKDIR /var/www + +RUN chown -R www-data:www-data /var/www + +CMD ["apache2-foreground"] +``` + +**docker-compose.yml:** + +```yaml +version: '3.1' +services: + application: + build: ./docker + image: leafphp/docker + ports: + - '8080:80' + volumes: + - .:/var/www +``` + +**000-default.conf:** + +```apacheconf + + ServerAdmin webmaster@localhost + DocumentRoot /var/www + + + Options Indexes FollowSymLinks + AllowOverride All + Require all granted + + +``` + +After adding these files, you can start your application using Docker by running the following command: + +```bash +leaf serve +``` + +Or with the docker compose command: + +```bash +docker compose up +``` diff --git a/apps/docs/src/docs/introduction/features.md b/apps/docs/src/docs/introduction/features.md new file mode 100644 index 0000000..6b052b2 --- /dev/null +++ b/apps/docs/src/docs/introduction/features.md @@ -0,0 +1,39 @@ +--- +aside: none +--- + +# Features + +Leaf has a ton of features which help provide the best developer experience without sacrificing any power. Leaf 3 makes these features even more usable. These are some of leaf's features: + +## Low barrier to entry + +Leaf is the easiest framework to learn with PHP newbies building powerful leaf apps in a few minutes of reading the docs/watching out tutorial videos. All you truly need to get started with Leaf is basic PHP knowledge and optional but recommended knowledge on some backend concepts like JWT auth and more. + +## Lightweight + +Leaf 2 was lightweight and fast enough to be considered one of the most lightweight but powerful frameworks around, and Leaf 3 makes leaf 2 look like a joke. Leaf 3 can now be considered the most lightweight PHP framework with a source of about 30kb and allows you to build full apps and APIs which end up less than 20mb including user dependencies (leaf api). This is a big haul compared to other frameworks which require dependencies and tons of files which end up more than 100mb. + +![image](https://user-images.githubusercontent.com/26604242/146754044-4c71c4ec-7b37-4c85-9c8b-56e8c2b54831.png) + +> a comparism with slim - slim (left) - leaf (right) + +## Enables high developer productivity + +A whole lot of research and testing has been done to build amazing features which allow developers to focus on only what they need: their apps. Leaf 3 has put tons of strategies together to create the best developer experience known to PHP. From things like removing class initializers and creating global functions which allow you call classes from anywhere in your application, modules and other amazing leaf features. + +## Powered by [modules](/modules/) + +Leaf 3 and its ecosystem are heavily powered by modules, which are simply pieces of leaf's functionality shipped into independently installable libraries. Modules help make leaf even more lightweight and help developers only deal with features which they need in their applications. This means that you only install what you need. + +## Easy to use features + +As mentioned above, a lot of research has gone into the developer experience for leaf 3 and one aspect was to make our existing features more performant and easier to use. We employed various strategies like modeling some features after popular libraries in other languages and frameworks. For instance, the API for leaf cors is almost an exact replica of the expressjs cors middleware. + +## Library/Framework compatibility + +Since the beginning of Leaf, we've set out to create code which could easily be integrated with other libraries and frameworks. No matter how powerful leaf is, we try to base of everything we do on simple concepts as opposed to other frameworks which need things like providers in order to access framework features in libraries. + +## Scalability + +One of the most beautiful things about leaf is that, no matter what package you're using with leaf, if it works in development, it will definitely work in production with near zero config, unless you want some special features. Leaf provides a core and other frameworks/libraries that build around leaf. This makes leaf appropriate for almost any project no matter it's size. diff --git a/apps/docs/src/docs/introduction/first-app.md b/apps/docs/src/docs/introduction/first-app.md new file mode 100644 index 0000000..6c48606 --- /dev/null +++ b/apps/docs/src/docs/introduction/first-app.md @@ -0,0 +1,469 @@ +# Your first app + +::: tip Pre-requisites + +- Basic PHP knowledge + +::: + +This is an interactive tutorial to help you get started with leaf, right from installation to building your first leaf 3 app. This tutorial will require basic PHP knowledge with an optional knowledge on APIs. + +## Getting started + +::: tip Leaf CLI +We recommend using the [Leaf CLI](/docs/cli/) for creating and managing your Leaf projects. +::: + +To get started, we will need to generate a leaf application. We can do this simply with Leaf CLI: + +```bash +leaf create --basic +``` + + + +Or with composer: + +```bash +composer require leafs/leaf +``` + +After this, you will need to create an `index.php` file. *This is already done for you if you used Leaf CLI.* + +## Your app starter + +Now that leaf is installed, you will need a file which will serve as the root of your project. Leaf uses a single root file, to which all routes are sent to. Leaf then takes the route and calls the related handler for it. You can read more in the [routing docs](/docs/routing/). + +Your starter file will import leaf and hold your routes. + +```php + + +Let's define a dummy route. + +```php{3-5} +$app = new Leaf\App(); + +$app->get('/', function () { + echo 'something'; +}); + +// don't forget to call `run` +$app->run(); +``` + + + +
+ +We would normally need to initialize leaf, however, with with the introduction of functional mode, we don't need to do this. We can go straight to building our app. + +Let's define a dummy route. + +```php{1-3} +app()->get('/', function () { + echo 'something'; +}); + +// don't forget to call `run` +app()->run(); +``` + +
+ +Defining a route is that simple with leaf. In this case, we just defined the `GET /` route. We can simply run this with `leaf serve` if you use the leaf CLI or `php -S localhost:[PORT]`. + +## Our app + +Now that we've gotten our hello world setup complete, we can get started with our application. We will build a simple note taking app which will allow us create and fetch notes from a database. + +## Modules + +Modules are pieces of leaf's functionality which are served as installable plugins. They were created in an attempt to stop leaf from bloating like other frameworks. This means that you can have only what you need in your app, and always extend Leaf's power on demand. + +As you will see, modules are installed using the Leaf CLI or composer. For this app, we'll be using the `db` module to access our database. + +## Getting our notes + +### Creating our route + +To get started with this step, we need to create a GET route which will return all the notes in our database. Since we already know how to create routes like the one above, this step is pretty simple. + +
+ +```php +$app->get('/notes', function () { + // fetch all notes from the database + // output notes as JSON + echo 'all notes'; +}); +``` + +
+ +
+ +```php +app()->get('/notes', function () { + // fetch all notes from the database + // output notes as JSON + echo 'all notes'; +}); +``` + +
+ +### Fetching notes + +As mentioned above, we will use the db module to access our database. Leaf DB has made database operations really simple and accessible to everyone. You don't even need knowledge on SQL to use Leaf DB. + +#### Installing leaf db + +To install the db module, we can use the Leaf CLI. + +```bash +leaf install db +``` + +You can also use composer: + +```bash +composer require leafs/db +``` + +#### Connecting to our db + +From there, we can head back inside our app and connect to our database. + +
+ +```php +$db = new Leaf\Db; +$db->connect('127.0.0.1', 'dbname', 'username', 'password'); +``` + +
+ +
+ +```php +db()->connect('127.0.0.1', 'dbname', 'username', 'password'); +``` + +
+ +We can place this before before our routes so we can use the `$db` variable everywhere. + +#### Using the db module + +
Back in our route, we can pass the `$db` variable into scope and get started with it. You can check the [db module docs](/modules/db/) for more info.
+ +What we want to do here is retrieve all the data from our notes table, we can do this simply using `select`. This is a method provided by leaf db which allows us run the SQL `Select` command. + +
+ +```php +$app = new Leaf\App; +$db = new Leaf\Db; + +$db->connect('127.0.0.1', 'dbname', 'username', 'password'); + +// pass db into the callback using `use` +$app->get('/notes', function () use($db) { + // fetch all notes from the database + $notes = $db->select('notes')->all(); + + // output notes as JSON + echo 'all notes'; +}); +``` + +
+ +
+ +```php +db()->connect('127.0.0.1', 'dbname', 'username', 'password'); + +app()->get('/notes', function () { + // fetch all notes from the database + $notes = db()->select('notes')->all(); + + // output notes as JSON + echo 'all notes'; +}); +``` + +
+ +Now that we've been able to retrieve our data from the database, let's see how we can output this data. + +### The response object + +The response object is leaf's library for handling the way data flows out of your application. It has a very simple and easy to use interface , and with functional mode, it can be used from anywhere in your app without initilaizing it. + +In the lines above, we retrieved our data from the database. Now all that's left is to output this data as JSON. We can do this simply by calling `json` on the response object. + +
+ +```php +$app->get('/notes', function () use($app, $db) { + $notes = $db->select('notes')->all(); + + $app->response()->json([ + 'status' => 'success', + 'data' => $notes, + ]); +}); +``` + +
+
+ +```php +app()->get('/notes', function () { + $notes = db()->select('notes')->all(); + + response()->json([ + 'status' => 'success', + 'data' => $notes, + ]); +}); +``` + +
+ +This will output JSON + +```json +{ + "status": "success", + "data": [...] +} +``` + +## Saving our notes + +We need to create another route to handle adding new notes. In this case, we will create a POST route, meaning you will need to create a POST request to access it. This can be done using an HTTP client of some sort. + +This new route will take some data into our application and then select only what we need to be saved in the database, and finally return a message. + +
+ +```php +$app->post('/notes/new', function () use($db) { + // get data from request + // save items + // return success message +}); +``` + +
+
+ +```php +app()->post('/notes/new', function () { + // get data from request + // save items + // return success message +}); +``` + +
+ +### The request object + +Just as we saw with the response object, Leaf also provides a request object which allows us to quickly and securely get data which flows into our application. + +
+ +```php +$item = $app->request()->get('item'); +``` + +
+
+ +```php +$item = request()->get('item'); +``` + +
+ +This line will get data with the key `item` passed into the app from a form, url or any other data and save it in the `$item` variable. In this case, our app will accept `title`, `body` and `date` which we will save in the database. + +To do this, we can retrieve them one by one as we did above, but leaf provides an easier way. + +
+ +```php +$data = $app->request()->get(['title', 'body', 'date']); +``` + +
+
+ +```php +$data = request()->get(['title', 'body', 'date']); +``` + +
+ +With this, all other data passed in our app will be ignored, but will still be available for use. + +### Saving data in the db + +To save the data in the database, we will use leaf db as we did above. This time, the `insert` method instead. + +
+ +```php +$db->insert('notes')->params($data)->execute(); +``` + +
+
+ +```php +db()->insert('notes')->params($data)->execute(); +``` + +
+ +`execute` is used on commands which don't return any value like `insert` and `update`. + +Putting it all together, we'll have this: + +
+ +```php +$app->post('/notes/new', function () use($app, $db) { + // get data from request + $data = $app->request()->get(['title', 'body', 'date']); + + // save items + $db->insert('notes')->params($data)->execute(); + + // return success message + $app->response()->json([ + 'status' => 'success', + 'message' => 'Notes saved' + ]); +}); +``` + +
+
+ +```php +app()->post('/notes/new', function () { + // get data from request + $data = request()->get(['title', 'body', 'date']); + + // save items + db()->insert('notes')->params($data)->execute(); + + // return success message + response()->json([ + 'status' => 'success', + 'message' => 'Notes saved' + ]); +}); +``` + +
+ +## Putting it all together + +
+ +```php +connect('127.0.0.1', 'dbname', 'username', 'password'); + +$app->get('/notes', function () use($app, $db) { + $notes = $db->select('notes')->all(); + + $app->response()->json([ + 'status' => 'success', + 'data' => $notes, + ]); +}); + +$app->post('/notes/new', function () use($app, $db) { + $data = $app->request()->get(['title', 'body', 'date']); + + $db->insert('notes')->params($data)->execute(); + + $app->response()->json([ + 'status' => 'success', + 'message' => 'Notes saved' + ]); +}); + +$app->run(); +``` + +
+
+ +```php +connect('127.0.0.1', 'dbname', 'username', 'password'); + +app()->get('/notes', function () { + $notes = db()->select('notes')->all(); + + response()->json([ + 'status' => 'success', + 'data' => $notes, + ]); +}); + +app()->post('/notes/new', function () { + $data = request()->get(['title', 'body', 'date']); + + db()->insert('notes')->params($data)->execute(); + + response()->json([ + 'status' => 'success', + 'message' => 'Notes saved' + ]); +}); + +app()->run(); +``` + +
+ +Building is this simple with leaf, as you can see, we've built a note taking app in less than 30 lines of code. diff --git a/apps/docs/src/docs/introduction/index.md b/apps/docs/src/docs/introduction/index.md new file mode 100644 index 0000000..2bcc10b --- /dev/null +++ b/apps/docs/src/docs/introduction/index.md @@ -0,0 +1,156 @@ +# Introduction + + + + + +Leaf is a slim and lightweight PHP framework focused on developer experience, usability, and high-performance code. It is a modern PHP framework built to be simple and elegant, yet extremely powerful. + +Here's an example: + +```php +get('/', function () { + response()->json(['message' => 'Hello World!']); +}); + +app()->run(); +``` + +## Features + +Leaf has a ton of features that make it a great choice for building your next project. Here are some of the features that make Leaf stand out: + +- Lightweight +- Super performant +- Easy to learn +- Easy to use + +For an in-depth look at Leaf's features, check out the [features page](/docs/introduction/why.html). + +## Getting Started + +The official guide assumes **basic** level knowledge of PHP. + +::: tip Down to the basics + +
+😵‍💫 Don't know PHP? +If you are not familiar with PHP, we recommend that you check out the W3Schools PHP Tutorial before continuing or use the video below. This is because you will basically be writing PHP code when using Leaf (or any other framework). + + +
+ +
+What's a PHP Framework? +If you are not familiar with the concept of PHP frameworks, you can check out the video below by Kinsta. + + +
+ +::: + +### Installation + + + +To quickly get started with Leaf, check out our [installation guide](/docs/introduction/installation.html). This gives you an in-depth explanation of how to set up leaf using various methods. + +## Classes vs Functions + +Leaf supports two different ways of writing your code: + +- Using functional mode which you saw above +- Using class mode which is building your app using Leaf's classes + +### Class Mode + +If you are familiar with PHP frameworks, you've probably spent a lot of time writing code using classes. Leaf comes with a ton of powerful classes that you can use to build your app. Let's take a look at the code above in class mode. + +```php +get('/', function () use ($app) { + $app->response()->json(['message' => 'Hello World!']); +}); + +$app->run(); +``` + +### Functional Mode + +Classes can become annoying and very repetitive, especially because of namespaces. You also sometimes need to worry about variable scoping and re-initializing classes. + +For these and many more reasons, Leaf allows you to build your apps entirely using functions. Let's take a look at the code above in functional mode. + +```php +get('/', function () { + response()->json(['message' => 'Hello World!']); +}); + +app()->run(); +``` + +Besides the benefits functional mode gives you on a surface level, it also does a lot of work behind the scenes to make your code more efficient and faster. + +## Modes in the docs + +The docs are written in both functional and class mode. You can switch between the two modes using the switcher at the top of the page. + +![Switcher](https://user-images.githubusercontent.com/26604242/178108346-c9c22a19-6a82-4786-ac3e-00cbfe69cba8.png) + +## Leaf modules + +Modules are pieces of Leaf's functionality that are available as separate packages. These packages can be installed and used with Leaf to extend its functionality. Most modules are framework agnostic and can be used with other frameworks and libraries, but they are built to work best with Leaf. + +You can check out the [modules page](/modules/) to see a list of all the modules available for Leaf. + +## Ready for More? + +We've briefly introduced the most basic features of Leaf 3 - the rest of this guide will cover them and other advanced features in much finer detail, so make sure to read through it! + +## Next Steps + +If you are new to Leaf, we strongly recommend reading this page before moving on to the rest of the documentation. It will provide you with a solid foundation on which to build your Leaf knowledge. If you are already familiar with Leaf, feel free to check out the rest of the documentation. + + diff --git a/apps/docs/src/docs/introduction/installation.md b/apps/docs/src/docs/introduction/installation.md new file mode 100644 index 0000000..efb9509 --- /dev/null +++ b/apps/docs/src/docs/introduction/installation.md @@ -0,0 +1,199 @@ +# Installation + + + + + +Leaf 3 is built by design to be incrementally adoptable. This means that it can be integrated into a project multiple ways depending on the requirements. + +There are four primary ways of adding Leaf PHP to a project: + +1. [Use the Leaf CLI to scaffold a project [RECOMMENDED]](#leaf-cli). +2. [Download leaf through composer](#composer) +3. [Scaffold a Leaf MVC or Leaf API project](#mvc-setup) + +## Technical Requirements + +Before creating your first Leaf application you must: + +- Install PHP 7.4 or higher and these PHP extensions (which are installed and enabled by default in most PHP installations): json, zip; +- [Install Composer](https://getcomposer.org/download/), which is used to install PHP packages. +- Optionally, you can also install [Leaf CLI](/docs/cli/). This provides all the tools you need to create and manage your Leaf application locally. This is optional but highly recommended. + +
+Not sure where to start? + +- Laravel released an amazing tool called [Laravel Herd](https://herd.laravel.com/) that provides a quick and easy way to set up a local PHP development environment for Mac. It's a great way to get started with PHP and Leaf. + +- On Windows and Mac, you can use [Xampp](https://www.apachefriends.org/), which is a free and open-source cross-platform web server solution stack package developed by Apache Friends, consisting mainly of the Apache HTTP Server, MariaDB database, and interpreters for scripts written in the PHP and Perl programming languages. + +
+ +## Leaf CLI + + + +Leaf provides an [official CLI](https://github.com/leafsphp/cli) for quickly creating and managing your Leaf applications. It takes just a few seconds to get up and running with your leaf app. See [the Leaf CLI docs](/docs/cli/) for more details. + +Using the CLI, you can quickly scaffold a new Leaf 3 project with: + +```bash +leaf create +``` + +Besides the core of the framework, Leaf also ships with a ton of installable functionality. We call these independent libraries modules. You can install modules using the `install` command: + +```bash +leaf install +``` + +The CLI also allows you to completely customize the installation you wish to create. You can choose different features like database, authentication, etc. This is done using the `--custom` flag: + +```bash +leaf create --custom +``` + +You can then run your app using the `serve` command: + +```bash +leaf serve +``` + +## Composer + + + +Leaf also allows a more traditional approach to installation. You can install leaf through composer. You can use this method if you don't want to use the leaf cli or if you want to use leaf as a dependency in your project. The disadvantage of this method is that you don't get a quick-start setup like you do with the leaf cli. + +```bash +composer require leafs/leaf +``` + +After insalling Leaf, you need to create your index.php file which will be the entry point to your application. + +
+ +```php +get('/', function () use($app) { + $app->response()->json(['message' => 'Hello World!']); +}); + +$app->run(); +``` + +
+ +
+ +```php +get('/', function () { + response()->json(['message' => 'Hello World!']); +}); + +app()->run(); +``` + +
+ +When hosting your application on a webserver, all requests coming into your app must be routed through Leaf. It is really simple to do, and all needed instructions can be found @ [URL rewriting](/docs/introduction/url-rewriting.html). + +## MVC Setup + +Although Leaf allows you to select exactly what you want to install, some applications go beyond the basic setup. Leaf MVC is a full but ridiculously light-weight MVC framework that allows you to build complex applications with Leaf. It comes with a lot of features like authentication, database, http related functionality and a powerful CLI. To get started with Leaf's MVC setup, you can check out the [MVC docs](/docs/mvc/). + +## Hello world example + +Below is a "hello world" example which takes you through the core of Leaf. Other parts of the docs cover deeper examples. You can also refer to our [codelab experiments](/codelabs/) for real world examples and use-cases. + +A base Leaf app that outputs hello world in your browser looks like this: + +
+ +```php +get('/', function () { + echo 'Hello world'; +}); + +$app->run(); +``` + +
+ +
+ +```php +get('/', function () { + echo 'Hello world'; +}); + +app()->run(); +``` + +
+ +You might have noticed that we used `echo` to output our data. Using `echo` is not a bad thing, but it can be confusing when you're trying to output data of a different type. For example, if we wanted to output JSON data, we would have to use `echo json_encode($data)`. This can be confusing because we're not sure if the content type is set to JSON or not. + +To simplify this, Leaf comes with a `Response` object that automatically handles content the right way for us. Let's look at an example below. + +
+ +```php +get('/', function () use($app) { + $app->response()->markup('Hello world'); +}); + +$app->run(); +``` + +
+
+ +```php +get('/', function () { + response()->markup('Hello world'); +}); + +app()->run(); +``` + +
diff --git a/apps/docs/src/docs/introduction/url-rewriting.md b/apps/docs/src/docs/introduction/url-rewriting.md new file mode 100755 index 0000000..61012de --- /dev/null +++ b/apps/docs/src/docs/introduction/url-rewriting.md @@ -0,0 +1,43 @@ + + +# URL Rewriting + + + +Basically, we're trying to push all the requests made to the server to a single root file, so a request made to `/home.php` will be directed to the root file of our choice....usually `index.php`. + +This complex sounding feature can be achieved by adding a web server configuration depending on your server of choice. + + + +## Apache - .htaccess + +This is a basic example of an htaccess file. It basically re-routes all requests to our index.php file. + +```htaccess +RewriteEngine on +RewriteCond %{REQUEST_FILENAME} !-d +RewriteCond %{REQUEST_FILENAME} !-f +RewriteRule . index.php [L] +``` + +Save as `.htaccess` in your the same directory as your "root file" + +## Nginx - nginx.conf + +A basic example with nginx web server + +```nginx +try_files $uri /index.php; +``` + +You can read below for an overview of url rewriting. + +- [Intro to URL rewriting](https://www.smashingmagazine.com/2011/11/introduction-to-url-rewriting/) +- [.htaccess and nginx.conf variations](https://gist.github.com/bramus/5332525) diff --git a/apps/docs/src/docs/introduction/why.md b/apps/docs/src/docs/introduction/why.md new file mode 100644 index 0000000..fa00d0f --- /dev/null +++ b/apps/docs/src/docs/introduction/why.md @@ -0,0 +1,55 @@ +# Why Leaf + +When it comes to building web applications, there are numerous tools and frameworks at your disposal. Nevertheless, we are convinced that Leaf is the optimal selection for developing powerful, web applications and APIs. + +## The problems + +While PHP frameworks can make web development faster and more efficient, there are some potential challenges or drawbacks to using them, including: + +- ***Learning curve***: Most PHP frameworks have a steep learning curve, especially for developers who are new to the language or the framework's conventions. + +- ***Performance overhead***: Some PHP frameworks can add unnecessary performance overhead, due to the additional abstraction layers and features they provide. + +- ***Code maintenance***: Most frameworks require adhering to specific coding standards and conventions, which can make maintenance and updates more challenging if you are not already familiar with those standards. + +- ***Limited flexibility***: PHP frameworks can be more rigid than writing code from scratch, as they may require you to adhere to specific coding standards and conventions. This can limit your flexibility in terms of how you structure your code and handle specific use cases. + +- ***Compatibility with other systems***: Most PHP frameworks are bound to a particular ecosystem and make it difficult to randomly pick and use packages which don't have support for the framework you are using. + +- ***Packing a ton of unused code/packages***: Just about every PHP framework out there adds a ton of complexity to your applications in the form of unused code, classes and packages. This in turn leads to bloat and ultimately a drop in performance + +## How Leaf tackles these + +Leaf 3 provides a bunch of features that aim to tackle these common problems found in just about every PHP framework out there. + +### Low barrier to entry + +Leaf is the easiest framework to learn with PHP newbies building powerful leaf apps in a few minutes of reading the docs/watching out tutorial videos. All you truly need to get started with Leaf is basic PHP knowledge and optional but recommended knowledge on some backend concepts like JWT auth and more. + +### Lightweight + +Leaf 2 was lightweight and fast enough to be considered one of the most lightweight but powerful frameworks around, and Leaf 3 makes leaf 2 look like a joke. Leaf 3 can now be considered the most lightweight PHP framework with a source of about 30kb and allows you to build full apps and APIs which end up less than 20mb including user dependencies (leaf api). This is a big haul compared to other frameworks which require dependencies and tons of files which end up more than 100mb. + +![image](https://user-images.githubusercontent.com/26604242/146754044-4c71c4ec-7b37-4c85-9c8b-56e8c2b54831.png) + +> a comparison with slim - slim (left) - leaf (right) + +### Enables high developer productivity + +A whole lot of research and testing has been done to build amazing features which allow developers to focus on only what they need: their apps. Leaf 3 has put tons of strategies together to create the best developer experience known to PHP. From things like removing class initializers and creating global functions which allow you call classes from anywhere in your application, modules and other amazing leaf features. + +### Powered by [modules](/modules/) + +Leaf 3 and its ecosystem are heavily powered by modules, which are simply pieces of leaf's functionality shipped into independently installable libraries. Modules help make leaf even more lightweight and help developers only deal with features which they need in their applications. This means that you only install what you need. + +### Easy to use features + +As mentioned above, a lot of research has gone into the developer experience for leaf 3 and one aspect was to make our existing features more performant and easier to use. We employed various strategies like modeling some features after popular libraries in other languages and frameworks. For instance, the API for leaf cors is almost an exact replica of the expressjs cors middleware. + +### Library/Framework compatibility + +Since the beginning of Leaf, we've set out to create code which could easily be integrated with other libraries and frameworks. No matter how powerful leaf is, we try to base of everything we do on simple concepts as opposed to other frameworks which need things like providers in order to access framework features in libraries. + +### Scalability + +One of the most beautiful things about leaf is that, no matter what package you're using with leaf, if it works in development, it will definitely work in production with near zero config, unless you want some special features. Leaf provides a core and other frameworks/libraries that build around leaf. This makes leaf appropriate for almost any project no matter it's size. diff --git a/apps/docs/src/docs/leafapi/index.md b/apps/docs/src/docs/leafapi/index.md new file mode 100644 index 0000000..28158c8 --- /dev/null +++ b/apps/docs/src/docs/leafapi/index.md @@ -0,0 +1,121 @@ +# Leaf API + + + +Leaf API is a minimal but powerful PHP MVC framework. It's designed to be simple, fast and easy to use. Leaf by default doesn't give you a lot of structure, and that's where Leaf API comes in. + +Leaf API is a setup that gives you a good starting point for building APIs using the MVC pattern. It's built on top of Leaf, and comes with additional tooling that make building with Leaf even faster. + +## Installation + +The easiest way to setup Leaf MVC is to use the [Leaf CLI](/docs/cli/): + +```bash +leaf create --api +``` + +You can also setup a Leaf API app by using [Composer](https://getcomposer.org/): + +```bash +composer create-project leafs/api +``` + +This command will set up a Leaf API app in the `` directory. You can then run the app using the Leaf CLI: + +```bash +cd +leaf serve +``` + +Or the [built-in PHP server](https://www.php.net/manual/en/features.commandline.webserver.php): + +```bash +cd +php -S localhost:8000 +``` + +You should then see the welcome page in your browser. + +![Leaf API Welcome Page](https://user-images.githubusercontent.com/26604242/224507412-4cb10731-84f2-49a6-a6b8-b9ab5ca7c7b8.png) + +## Directory Structure + +The Leaf API directory structure is inspired by [Ruby on Rails](https://rubyonrails.org/) and [Laravel](https://laravel.com/). It takes a lot of inspiration from these frameworks, but it's not a clone of either of them. It is meant to be a starting point for building your own applications, and is fully customizable. You can completely change the directory structure to suit your needs, just be sure to update the paths in the `config.php` file. + +For a fresh Leaf API app, the directory structure looks like this: + +```bash +C:. +├───app +│   ├── console +│   ├── controllers +│   ├── database +│   │   ├── factories +│   │   ├── migrations +│   │   ├── schema +│   │   └── seeds +│   ├── helpers +│   ├── models +│   ├── routes +│   └── views +├───config +├───public +├───storage +│ ├───app +│ │ └───public +│ ├───framework +│ │ └───views +│ └───logs +└───vendor +``` + +- ### The `app` directory + + The `app` directory contains the core code of your application. It's divided into a few sub-directories: + + - `console` - Contains the console commands for your application. These are used to perform tasks on the command line. + - `controllers` - Contains the controllers for your application. These are used to handle HTTP requests. + - `database` - Contains the database related code for your application. This includes migrations, seeds, factories and schema. + - `helpers` - Contains the helper functions for your application. + - `models` - Contains the models for your application. These are used to interact with the database. + - `routes` - Contains the routes for your application. These are used to map HTTP requests to controllers. + - `views` - Contains the views for your application. These are used to render HTML responses. + +- ### The `config` directory + + The `config` directory contains the configuration files for your application. These are used to configure how Leaf and it's modules interact with your application. You can find more information about the configuration files in the [Configuration](/docs/mvc/config) section. + +- ### The `public` directory + + The `public` directory contains the entry point for your application, and it's also used to serve static assets. The `index.php` file is the entry point for your application. All requests are routed through this file by the web server. This file doesn't contain any application logic, but it does load the Composer autoloader, the application config and all your routes. + +- ### The `storage` directory + + The `storage` directory contains the compiled views, logs and other files generated by your application. It's divided into a few sub-directories: + + - `app` - Contains the files generated by your application. This includes the compiled views and the files uploaded by users. + - `framework` - Contains the framework generated files for your application. + - `logs` - Contains the log files generated by your application. + +- ### The `vendor` directory + + The `vendor` directory contains all the dependencies installed by Composer. It's automatically generated when you install the dependencies using Composer. + +## Next Steps + +Follow along with the next steps to learn more about Leaf API. + + diff --git a/apps/docs/src/docs/leafmvc/index.md b/apps/docs/src/docs/leafmvc/index.md new file mode 100644 index 0000000..4cbaf7c --- /dev/null +++ b/apps/docs/src/docs/leafmvc/index.md @@ -0,0 +1,127 @@ +# Leaf MVC + + + +Leaf MVC is a minimal but powerful PHP MVC framework. It's designed to be simple, fast and easy to use. Leaf by default doesn't give you a lot of structure, and that's where Leaf MVC comes in. + +Leaf MVC is a setup that gives you a good starting point for building applications using the MVC pattern. It's built on top of Leaf, and comes with additional tooling that make building with Leaf even faster. + +## Installation + +The easiest way to setup Leaf MVC is to use the [Leaf CLI](/docs/cli/): + +```bash +leaf create --mvc +``` + +You can also setup a Leaf MVC app by using [Composer](https://getcomposer.org/): + +```bash +composer create-project leafs/mvc +``` + +This command will set up a Leaf MVC app in the `` directory. You can then run the app using the Leaf CLI: + +```bash +cd +leaf serve +``` + +Or the [built-in PHP server](https://www.php.net/manual/en/features.commandline.webserver.php): + +```bash +cd +php -S localhost:8000 +``` + +You should then see the welcome page in your browser. + +![Leaf MVC Welcome Page](https://user-images.githubusercontent.com/26604242/223189921-d5da1555-bc29-4f99-a3ec-d6cbfdc5350b.png) + +## Directory Structure + +The Leaf MVC directory structure is inspired by [Ruby on Rails](https://rubyonrails.org/) and [Laravel](https://laravel.com/). It takes a lot of inspiration from these frameworks, but it's not a clone of either of them. It is meant to be a starting point for building your own applications, and is fully customizable. You can completely change the directory structure to suit your needs, just be sure to update the paths in the `config.php` file. + +For a fresh Leaf MVC app, the directory structure looks like this: + +```bash +C:. +├───app +│   ├── console +│   ├── controllers +│   ├── database +│   │   ├── factories +│   │   ├── migrations +│   │   ├── schema +│   │   └── seeds +│   ├── helpers +│   ├── models +│   ├── routes +│   └── views +│   └── errors +├───config +├───public +│ └───assets +│   ├── css +│   └── img +├───storage +│ ├───app +│ │ └───public +│ ├───framework +│ │ └───views +│ └───logs +└───vendor +``` + +- ### The `app` directory + + The `app` directory contains the core code of your application. It's divided into a few sub-directories: + + - `console` - Contains the console commands for your application. These are used to perform tasks on the command line. + - `controllers` - Contains the controllers for your application. These are used to handle HTTP requests. + - `database` - Contains the database related code for your application. This includes migrations, seeds, factories and schema. + - `helpers` - Contains the helper functions for your application. + - `models` - Contains the models for your application. These are used to interact with the database. + - `routes` - Contains the routes for your application. These are used to map HTTP requests to controllers. + - `views` - Contains the views for your application. These are used to render HTML responses. + +- ### The `config` directory + + The `config` directory contains the configuration files for your application. These are used to configure how Leaf and it's modules interact with your application. You can find more information about the configuration files in the [Configuration](/docs/mvc/config) section. + +- ### The `public` directory + + The `public` directory contains the entry point for your application, and it's also used to serve static assets. The `index.php` file is the entry point for your application. All requests are routed through this file by the web server. This file doesn't contain any application logic, but it does load the Composer autoloader, the application config and all your routes. + + There is also an `assets` directory found in the `public` directory. It contains the static assets for your application. These are served by the web server and are accessible to users. + +- ### The `storage` directory + + The `storage` directory contains the compiled views, logs and other files generated by your application. It's divided into a few sub-directories: + + - `app` - Contains the files generated by your application. This includes the compiled views and the files uploaded by users. + - `framework` - Contains the framework generated files for your application. + - `logs` - Contains the log files generated by your application. + +- ### The `vendor` directory + + The `vendor` directory contains all the dependencies installed by Composer. It's automatically generated when you install the dependencies using Composer. + +## Next Steps + +Follow along with the next steps to learn more about Leaf MVC. + + diff --git a/apps/docs/src/docs/migration/introduction.md b/apps/docs/src/docs/migration/introduction.md new file mode 100644 index 0000000..86fa8a2 --- /dev/null +++ b/apps/docs/src/docs/migration/introduction.md @@ -0,0 +1,209 @@ +# Migration Guide + + + + + +This guide is primarily for users with prior Leaf 2 experience who want to learn about the new features and changes in Leaf 3. **This is not something you have to read from top to bottom before trying out Leaf 3.** While it looks like a lot has changed, a lot of what you know and love about Leaf is still the same; but we wanted to be as thorough as possible and provide detailed explanations and examples for every documented change. + +::: warning Coming from another library +Migrating from another framework? [READ THIS](/docs/migration/other) to get started. +::: + +- [Quickstart](#quickstart) +- [Breaking Changes](#breaking-changes) +- [Notable New Features](#notable-new-features) + + + + +## Quickstart + +If you want to quickly try out Leaf 3 in a new project, create a folder and run: + +```bash +composer require leafs/leaf +``` + +This will quickly setup a leaf 3 with the default modules. From there, create your `index.php` file and add this quickstart. + +
+ +When using functional mode: + +```php +get("/", function () { + response()->json(["name" => "Leaf"]); +}); + +app()->run(); +``` + +
+
+ +When using classes: + +```php +get("/", function () use($app) { + $app->response()->json(["name" => "Leaf"]); +}); + +$app->run(); +``` + +
+ +You can run this with the built in php server + +```bash +php -S localhost:5500 +``` + +Alternatively, you can use the Leaf CLI: + +```bash +leaf create +``` + +And run the sample app with: + +```bash +leaf serve +``` + +### Migrating from leaf 2 + +As mentioned before, we've made leaf 3 as backwards compatible with Leaf 2.5+ as possible. This means that moving from v2 to v3 will be a breeze or close. + +- Install leaf 3 + +```bash +composer require leafs/leaf +``` + +Or with leaf CLI + +```bash +leaf install leaf +``` + +::: tip Watch out +You should probably delete your `vendor` folder and `package-lock.json` before running the command above to make sure that all the dependencies are accurately reinstalled. +::: + +- After this, it's just a matter of installing the modules required in your project. +For example, if you use `Leaf\Auth`, you will need to install the auth module. This can be done with: + +```bash +leaf install auth +``` + +Or with composer: + +```bash +composer require leafs/auth +``` + +Just do this for all other modules in your project. And your app should be back online, working even faster than before. + +## Breaking Changes + +The following consists a list of breaking changes from 2.x: + +### Modules + +Leaf 3 only retains the core of the framework with a few utilities, all other features were packaged as modules. This means that you will have errors if you try to use some packages like `Leaf\Auth` or `Leaf\Flash` without installing them first. + +This is not really a problem since installing the module will automatically fix any problems that came along with it's abscence. + +### CORS + +In v2, some basic cors configuration was available on the Leaf object, however, this has been discontinued and replaced with the Cors module. This module contains both basic and advanced CORS configurations and is inspired by the ExpressJS cors package. So if you have any experience with that library, you will have no problems using the leaf cors module. + +To fix any problems with cors in your Leaf 2 app, follow these steps: + +- Install the cors module + +```bash +composer require leafs/cors +``` + +- Replace the original cors configuration with the cors module. (This is done under the hood for you, all you need to do now call the cors method on your leaf app) + +
+ +Replace this: + +```php +$app = new Leaf\App; + +$app->evadeCors(true); + +// ... +``` + +with... + +```php +$app = new Leaf\App; + +$app->cors(); + +// ... +``` + +
+
+ +Replace this: + +```php +app()->evadeCors(true); + +// ... +``` + +with... + +```php +app()->cors(); + +// ... +``` + +
+ +The cors method is automatically linked to the cors module by Leaf and so, no extra configuration is needed to make it work. Cors takes in some optional configuration, checkout the [cors module docs](/modules/cors/). Also cors is no longer available on the response object. + +### Router + +`Leaf\Router::getRequestMethod` has been been moved to `Leaf\Http\Request::getMethod`. This is used in Leaf's core and should not be an issue, but if you do have references to this function, changing it to `Leaf\Http\Request::getMethod` will fix any errors. + +## Notable New Features + +Some of the new features to keep an eye on in Leaf 3 include: + +- [Global functions](/docs/tooling/functions) +- [CORS module](/modules/cors/) diff --git a/apps/docs/src/docs/migration/leafapi.md b/apps/docs/src/docs/migration/leafapi.md new file mode 100644 index 0000000..152e818 --- /dev/null +++ b/apps/docs/src/docs/migration/leafapi.md @@ -0,0 +1,130 @@ +# Introduction + +::: tip +Leaf 3 is not yet available with Leaf 3. This means that you need to add Leaf 3 to your project manually. +::: + +This guide is primarily for Leaf API users with prior Leaf 2 experience who want to learn about the new features and changes in Leaf 3. + +- [Quickstart](#quickstart) +- [Breaking Changes](#breaking-changes) +- [Notable New Features](#notable-new-features) +- [Supporting Libraries](#supporting-libraries) + + + +## Quickstart + +If you want to quickly try out Leaf 3 in a new project: + +```bash +composer require leafs/leaf v3.x-dev +``` + +This will quickly setup leaf 3 with the default modules. From there, create your `index.php` file and add this quickstart. + +```php +get("/", function () { + app()->response(["name" => "Leaf"]); +}); + +app()->run(); +``` + +You can run this with the built in php server + +```bash +php -S localhost:5500 +``` + +### Migrating from leaf 2 + +As mentioned before, we've made leaf 3 as backwards compatible with Leaf 2.5+ as possible. This means that moving from v2 to v3 will be a breeze or close. + +::: warning +Note that leaf 3 is still under active development. We don't recommend switching to Leaf 3 yet for production ready apps. You can go ahead if it's a personal project or just want to try out leaf 3. +::: + +- Install leaf 3 + +```bash +composer require leafs/leaf v3.x-dev +``` + +> You can delete your vendor folder before running the command above to make sure that all the dependencies are accurately reinstalled. + +- After this, it's just a matter of installing the modules required in your project. +For example, if you use `Leaf\Auth`, you will need to install the auth module. This can be done with: + +```bash +composer require leafs/auth +``` + +Just do this for all other modules in your project. And your app should be back online, working even faster than before. + +## Breaking Changes + +The following consists a list of breaking changes from 2.x: + +### Modules + +Leaf 3 only retains the core of the framework with a few utilities, all other features were packaged as modules. This means that you will have errors if you try to use some packages like `Leaf\Auth` or `Leaf\Flash` without installing them first. + +This is not really a problem since installing the module will automatically fix any problems that came along with it's abscence. + +### CORS + +In v2, some basic cors configuration was available on the Leaf object, however, this has been discontinued and replaced with the Cors module. This module contains both basic and advanced CORS configurations and is inspired by the ExpressJS cors package. So if you have any experience with that library, you will have no problems using the leaf cors module. + +To fix any problems with cors in your Leaf 2 app, follow these steps: + +- Install the cors module + +```bash +composer require leafs/cors +``` + +- Replace the original cors configuration with the cors module. (This is done under the hood for you, all you need to do now call the cors method on your leaf app) + +Replace this: + +```php +$app = new Leaf\App; + +$app->evadeCors(true); + +// ... +``` + +with... + +```php +$app = new Leaf\App; + +$app->cors(); + +// ... +``` + +The cors method is automatically linked to the cors module by Leaf and so, no extra configuration is needed to make it work. Cors takes in some optional configuration, checkout the [cors module docs](/modules/cors/). Also cors is no longer available on the response object. + +### Router + +`Leaf\Router::getRequestMethod` has been been moved to `Leaf\Http\Request::getMethod`. This is used in Leaf's core and should not be an issue, but if you do have references to this function, changing it to `Leaf\Http\Request::getMethod` will fix any errors. + +## Notable New Features + +Some of the new features to keep an eye on in Leaf 3 include: + + + +- [CORS module](/modules/cors/) diff --git a/apps/docs/src/docs/migration/leafmvc.md b/apps/docs/src/docs/migration/leafmvc.md new file mode 100644 index 0000000..e69de29 diff --git a/apps/docs/src/docs/migration/other.md b/apps/docs/src/docs/migration/other.md new file mode 100644 index 0000000..8fed725 --- /dev/null +++ b/apps/docs/src/docs/migration/other.md @@ -0,0 +1,118 @@ +--- +aside: none +--- + +# Migrating from other frameworks + + + +This page is for developers who have a working application in another framework and want to port over to Leaf. As far-fetched as this sounds, Leaf 3 makes it super easy to sprinkle pieces of Leaf into any existing application, gradually rewriting it without breaking any code. Leaf has always allowed users to integrate other libraries seamlessly into their leaf apps with no conflicts or complexities, now Leaf 3 allows you to go the other way: **integrating Leaf seamlessly into any application no matter which libraries or frameworks it was built with.** + + + +## Quickstart + +All of Leaf's features are now available as modules, this means that if there's a particular feature of Leaf you will love to try out, there's no need to pack the whole framework anymore. Just find that feature you want and install it. + +Below is a [Slim PHP 4](https://www.slimframework.com/) application which we want to use Leaf 3 in: + +```php +get('/', function (Request $request, Response $response, $args) { + $name = $args['name']; + $response->getBody()->write("Hello, $name"); + return $response; +}); + +$app->run(); +``` + +We can start off by swapping out the Slim request and response objects with Leaf's. We can achieve this by replacing only lines 11-13 with Leaf. + +```php{2-3,11-13} +get('/', function (Request $request, Response $response, $args) { + $name = $args['name']; + $response->getBody()->write("Hello, $name"); + return $response; +}); + +$app->run(); +``` + +All we have to do now is to install the leaf http module. + +```bash +composer require leafs/http +``` + +Now, we replace Slim's http handlers with Leaf's. + +
+ +```php{8,11-12} +get('/', function () use($leaf) { + $name = $leaf->request()->get('name'); + $leaf->response()->markup("Hello, $name"); +}); + +$app->run(); +``` + +
+
+ +```php{9-10} +get('/', function () { + $name = request()->get('name'); + response()->markup("Hello, $name"); +}); + +$app->run(); +``` + +
+ +In all aspects, this is still a slim 4 app, only using the Leaf request and response objects. Just as with the example above, you can use any Leaf module or Leaf 3 itself with any framework or library. To test the app above, we can use the built in php server + +```bash +php -S localhost:5500 +``` diff --git a/apps/docs/src/docs/migration/skeleton.md b/apps/docs/src/docs/migration/skeleton.md new file mode 100644 index 0000000..e69de29 diff --git a/apps/docs/src/docs/mvc/commands.md b/apps/docs/src/docs/mvc/commands.md new file mode 100644 index 0000000..6382aa8 --- /dev/null +++ b/apps/docs/src/docs/mvc/commands.md @@ -0,0 +1,400 @@ +# Writing Commands + +Leaf MVC and Leaf API come with a [built-in command line](/docs/mvc/console) interface named Aloe. This CLI is used to run commands and perform tasks like creating controllers, models, migrations, seeds, etc. + +In addition to the built-in commands, you can also create your own commands. This is useful if you want to create a command that performs a specific task in your application. + +## Generating a command + +The easiest way to create a command is to use the `g:command` command. This command will create a new command class in your `app/console` directory. + +```bash +php leaf g:command CachePurge +``` + +This will create a `CachePurgeCommand` in the `app/console` directory. Instead of using the class name, you can also create commands using the command you want to run in your console like this: + +```bash +php leaf g:command cache:purge +``` + +This will create a `CachePurgeCommand` in the `app/console` directory. + +Using the `g:command` command also registers the commands in Aloe. This means you can run the command immediately after creating it. + +## Manually writing a command + +If you don't use the `g:command` command, you can create a command manually. To do this, create a new class in your `app/console` directory and extend the `Aloe\Command` class. The class should also have `$defaultName` and `$description` properties. + +The `$defaultName` property is the name of the command that will be used to run the command in the console. The `$description` property is a short description of what the command does. + +The class should have a `handle()`. This method is called when the command is run in the console. The `handle` method should return `0` if the command was successful and `1` if it failed. + +```php +setArgument('argument', 'optional', 'argument description') + ->setOption('option', 'o', 'required', 'option description'); + } + + protected function handle() + { + $this->comment( + "example command's output {$this->argument('argument')} {$this->option('option')}" + ); + + return 0; + } +} +``` + +Both Leaf MVC and Leaf API ship with an example command. You can find it in the `app/console` directory. + +::: tip Symfony Console +Aloe is built on top of Symfony Console. This means you can use all of the features of Symfony Console in your commands. You can read more about Symfony Console [here](https://symfony.com/doc/current/components/console.html). +::: + +## Registering Commands + +By default, aloe cli registers all generated commands, however, if you create a command manually, you'll have to register it manually. There are also situations where a package might need you to register a command, it can also be done using same method. + +To add your commands, open up the `leaf` file in the root directory of your project. You'll find a commented section talking about custom commands. + +```php +/* +|-------------------------------------------------------------------------- +| Add custom command +|-------------------------------------------------------------------------- +| +| If you have a new command to add to Leaf +| +*/ +$console->register(\App\Console\ExampleCommand::class); +``` + +An example command has already been registered, so you can follow this example. You can call the `register` method on the `$console` variable. The `register` method takes in the command class as a parameter. + +```php +$console->register(\App\Console\YourCommand::class); +``` + +You can also pass in an array of commands to register, as such, a custom package with a couple of commands to register can simply return an array of all those commands. + +```php +$console->register([ + \App\Console\AppCommand::class, + \App\Console\AppCommand2::class, +]); + +$console->register(CustomPackage::commands()); +``` + +## Command Arguments + +Command arguments are values that are passed to the command when it is run in the console. For example, if you have a command named `example` and you run it like this: + +```bash +php leaf example argument +``` + +The `argument` value is an argument that is passed to the command. You can access the argument in the `config()` method using the `setArgument()` method. It typically follows the same convention as symfony console's `addArgument` except that instead of passing in `InputArgument::state`, you just pass in the state as a string. For example, instead of `InputArgument::REQUIRED`, you just pass in `"required"`, any case is supported. + +```php +protected function config() +{ + $this->setArgument('argument', 'required', 'argument description'); +} +``` + +You can access the argument in the `handle()` method using the `argument()` method. + +```php +protected function handle() +{ + $this->comment("example command's output {$this->argument('argument')}"); +} +``` + +## Command Options + +Command options are values that are passed to the command when it is run in the console. For example, if you have a command named `example` and you run it like this: + +```bash +php leaf example --option=value +``` + +To add an option to your command, you can use the `setOption()` method in the `config()` method. It typically follows the same convention as symfony console's `addOption` except that instead of passing in `InputOption::state`, you just pass in the state as a string. For example, instead of `InputOption::VALUE_REQUIRED`, you just pass in `"required"`, any case is supported. + +```php +protected function config() +{ + $this->setOption('option', 'o', 'required', 'option description'); +} +``` + +You can access the option in the `handle()` method using the `option()` method. + +```php +protected function handle() +{ + $this->comment("example command's output {$this->option('option')}"); +} +``` + +## Command Input + +Aloe makes it easier to grab the Symfony input object from anywhere in your command. This means that you don't have to pass in the `$input` variable to the `handle()` method. Instead, you can use the `input()` method. + +```php +public function handle() +{ + $input = $this->input(); + $name = $input->getArgument('name'); +} +``` + +## Command Output + +Aloe makes it easier to grab and output text to the console from anywhere in your command. Unlike with symfony console, you don't have to pass in the `$output` variable to the `handle()` method. Instead, you can use `ouput()`, `write()`, `writeln()`, `comment()`, `info()`, `error()`, `question()` and `link()` methods. + +### output() + +This method either outputs text in your console or returns the Symfony output object. If a value is passed into `output()`, it will write the value to the console. + +```php +public function handle() +{ + $this->output('Hello World'); +} +``` + +If no value is passed into `output()`, it will return the Symfony output object. + +```php +public function handle() +{ + $output = $this->output(); + $output->writeln('This is output'); +} +``` + +### write() + +This method writes text to the console. It is the same as the `output()->write()` method. + +```php +public function handle() +{ + $this->write('Hello World'); +} +``` + +### writeln() + +This method writes text to the console and adds a new line. It is the same as the `output()->writeln()` method. + +```php +public function handle() +{ + $this->writeln('Hello World'); +} +``` + +### comment() + +This method writes a comment styled message to the console and adds a new line. It is the same as the `output()->writeln()` method with the `SymfonyStyle::COMMENT` style. + +```php +public function handle() +{ + $this->comment('Hello World'); +} +``` + +### info() + +This method writes an info styled message to the console and adds a new line. It is the same as the `output()->writeln()` method with the `SymfonyStyle::INFO` style. + +```php +public function handle() +{ + $this->info('Hello World'); +} +``` + +### error() + +This method writes an error styled message to the console and adds a new line. It is the same as the `output()->writeln()` method with the `SymfonyStyle::ERROR` style. + +```php +public function handle() +{ + $this->error('Hello World'); +} +``` + +### question() + +This method writes a question styled message to the console and adds a new line. It is the same as the `output()->writeln()` method with the `SymfonyStyle::QUESTION` style. + +```php +public function handle() +{ + $this->question('Hello World'); +} +``` + +### link() + +This method writes a link to the console and adds a new line. + +```php +public function handle() +{ + $this->link('https://leafphp.dev', 'Leaf PHP'); +} +``` + +## Command Questions + +Aloe makes it easier to ask questions in your command. You can use the `ask()`, `confirm()`, `askRaw()`, `autoComplete()`, `choice()` and `multiChoice()` methods. + +### ask() + +This method asks a question and returns the answer. It takes in 2 parameters: + +- the question to ask +- the default answer (optional) + +```php +public function handle() +{ + $name = $this->ask('What is your name?', 'Leaf'); +} +``` + +### askRaw() + +This is the same as the `ask()` method above, except that it does not trim the results that the user enters. Whatever the user enters is returned as is. + +```php +public function handle() +{ + $name = $this->askRaw('What is your name?', 'Leaf'); +} +``` + +### autoComplete() + +This method allows you to ask a question and provide a list of values that the user can choose from. The user's answer will be auto-completed as they type if it matches one of the values in the list. It takes in 3 parameters: + +- the question to ask +- the list of values to choose from +- the default answer (optional) + +```php +public function handle() +{ + $name = $this->autoComplete('What is your name?', ['Leaf', 'PHP'], 'Leaf'); +} +``` + +### choice() + +This method allows you to ask a question and provide a list of values that the user can choose from. The user must select one of the values in the list. It takes in 4 parameters: + +- the question to ask +- the list of values to choose from +- the error message to display if the user does not select one of the values in the list +- the default answer (optional) + +```php +public function handle() +{ + $name = $this->choice('What is your name?', ['Leaf', 'PHP'], 'Please select a name'); +} +``` + +### multiChoice() + +This method allows you to ask a question and provide a list of values that the user can choose from. The user must select one or more of the values in the list. It takes in 4 parameters: + +- the question to ask +- the list of values to choose from +- the error message to display if the user does not select one of the values in the list +- the default answer (optional) + +```php +public function handle() +{ + $name = $this->multiChoice('What is your name?', ['Leaf', 'PHP'], 'Please select a name'); +} +``` + +### confirm() + +This method asks a yes/no question and returns the answer. It takes in 2 parameters: + +- the question to ask +- the default answer (optional) + +```php +public function handle() +{ + $name = $this->confirm('Are you sure?', 'yes'); +} +``` + +### secret() + +This method asks a question but hides the keystrokes. It takes in 2 parameters: + +- the question to ask +- use hidden fallback (optional) + +```php +$password = $this->secret('Confirm your password'); +``` + +## Aloe Installer + +Aloe installer allows you to quickly install files and routes from your library into your Leaf MVC or Leaf API project's working directory. + +### Magic Copy + +This method allows you to auto-magically copy all files and folders from a specified folder into Leaf workspace. + +```php +Aloe\Installer::magicCopy("package/to/install"); +``` + +Consider the following directory structure: + +```bash +C:. +└───Auth + ├───controllers + ├───routes + └───views +``` + +To copy our controllers, routes and views, we simply need to point `magicCopy` to the auth directory. + +```php +\Aloe\Installer::magicCopy('package/Auth'); +``` + +This will copy the sub directories in Auth to the `app` folder in the working directory. This is especially useful in team projects where you want to share resources with your team. You can simply create a package with the resources you want to share and then use `magicCopy` to copy them into the working directory. diff --git a/apps/docs/src/docs/mvc/config.md b/apps/docs/src/docs/mvc/config.md new file mode 100644 index 0000000..4c2bb11 --- /dev/null +++ b/apps/docs/src/docs/mvc/config.md @@ -0,0 +1,734 @@ +# Configuration + + + +Both Leaf MVC and Leaf API try to maintain a working out-of-the-box configuration as much as possible, so, for the most part, you don't have to configure anything. However, there are some things you may want to customize to match your application's style, and this page will show you how. + +## Overview + +You can find your application in the `config` directory. This directory contains all the configuration files for you need for different features. You only need to configure the files that you need to configure. If you don't need to configure a file, you can just leave it as is. Each option is documented, so feel free to look through the files and get familiar with the options available to you. + +These configuration files allow you to configure things like your database connection information, your mail server information, as well as various other core configuration values such as your application timezone and encryption key. + +For the most part, you will only need to set the values in the `.env` file. + +## The `.env` file + +Having different configuration values based on the environment in which an application is operating is usually pretty helpful. For instance, you may need to use a different database for local development compared to your production server. + +The `.env` file allows you to define environment specific configuration values. You can define as many environment variables as you want in this file. The values in this file will be loaded into the `$_ENV` superglobal variable, and will be accessible via the `_env()` helper function. + +In a new Leaf installation, the root folder of your application will include an `.env.example` file that specifies numerous typical environment variables. As part of the Leaf installation process, this file will be automatically duplicated to `.env`. You may then modify the `.env` file to suit your needs. The `.env` file is not tracked by Git, so you can safely modify it without worrying about it being overwritten by future updates. + +::: tip Managing Environment Variables + +If you add new environment variables to a team project, be sure to add the keys to the `.env.example` file so that other developers will know what environment variables are available. + +::: + +*If you want more info on how Leaf handles your application's environment, you can check out the [environment docs](/docs/config/nsm).* + +## Application Config + +This configuration basically controls how Leaf works with your application. This file contains the following options by default: + +```php + _env('APP_DOWN', false), + + /* + |-------------------------------------------------------------------------- + | App debugging + |-------------------------------------------------------------------------- + | + | If debugging is enabled, Leaf will use its built-in error handler to + | display diagnostic information for uncaught Exceptions, else it will + | display a bare error page usable in production. You can set a + | custom error page to display using `$app->setError`. + | + | You might want to turn this off in production. + | + */ + 'debug' => _env('APP_DEBUG', true), + + /* + |-------------------------------------------------------------------------- + | Log directory + |-------------------------------------------------------------------------- + | + | This tells leaf which directory to save and look for logs. + | + */ + 'log.dir' => 'storage/logs/', + + /* + |-------------------------------------------------------------------------- + | Log Enabled + |-------------------------------------------------------------------------- + | + | This enables or disables Leaf’s logger. Note that if log.enabled is + | set to false. Leaf will skip initializing anything related to logs, + | as such, you won't have access to $app->logger(), + | $app->log or $app->logWriter. + | + */ + 'log.enabled' => true, + + /* + |-------------------------------------------------------------------------- + | Log file + |-------------------------------------------------------------------------- + | + | This setting tells leaf which file to write logs to. + | + */ + 'log.file' => 'app.log', + + /* + |-------------------------------------------------------------------------- + | Log level + |-------------------------------------------------------------------------- + | + | Leaf has these log levels: + | + | - \Leaf\Log::EMERGENCY + | - \Leaf\Log::ALERT + | - \Leaf\Log::CRITICAL + | - \Leaf\Log::ERROR + | - \Leaf\Log::WARN + | - \Leaf\Log::NOTICE + | - \Leaf\Log::INFO + | - \Leaf\Log::DEBUG + | + */ + 'log.level' => \Leaf\Log::DEBUG, + + /* + |-------------------------------------------------------------------------- + | Log open + |-------------------------------------------------------------------------- + | + | Takes in a boolean and determines whether Leaf should create + | the specified log file if it doesn't exist. + | + */ + 'log.open' => true, + + /* + |-------------------------------------------------------------------------- + | Log writer + |-------------------------------------------------------------------------- + | + | Use a custom log writer to direct logged messages + | to the appropriate output destination. + | + */ + 'log.writer' => null, + + /* + |-------------------------------------------------------------------------- + | Mode + |-------------------------------------------------------------------------- + | + | This is an identifier for the application’s current mode of operation. + | The mode does not affect a Leaf application’s internal functionality. + | + */ + 'mode' => 'development', + + /* + |-------------------------------------------------------------------------- + | Views path + |-------------------------------------------------------------------------- + | + | The relative or absolute path to the filesystem directory that + | contains your Leaf application’s view files. + | + */ + 'views.path' => ViewsPath(null, false), + + /* + |-------------------------------------------------------------------------- + | views cache path + |-------------------------------------------------------------------------- + | + | This config tells leaf where to save cached and compiled views. + | + */ + 'views.cachePath' => StoragePath('framework/views') +]; +``` + +You can find more information about these settings in the [App Config](/docs/config/settings.html) documentation. + +## Aloe CLI Config + +This configuration file is used to configure the Aloe CLI. This file basically contains a map of paths that directs Aloe where to find framework files. This file contains the following options by default: + +```php +// config for aloe CLI +return [ + 'paths' => [ + 'controllers_path' => '/app/controllers', + 'models_path' => '/app/models', + 'migrations_path' => '/app/database/migrations', + 'seeds_path' => '/app/database/seeds', + 'factories_path' => '/app/database/factories', + 'helpers_path' => '/app/helpers', + 'views_path' => '/app/views', + 'config_path' => '/app/config', + 'storage_path' => '/storage', + 'commands_path' => '/app/console', + 'routes_path' => '/app/routes', + 'lib_path' => '/lib', + ], +]; +``` + +You only need to configure this file if you want to change the default paths. + +## Auth Config + +This configuration file is used to configure [Leaf Auth](/modules/auth/). You only need to update this config if you want to switch up the way Leaf Auth works out of the box. This file contains the following options by default: + +```php +use Leaf\Helpers\Password; + +return [ + /* + |-------------------------------------------------------------------------- + | Database table + |-------------------------------------------------------------------------- + | + | This is the table that leaf auth will perform authentication + | checks on and edit/retrieve users from. + | + */ + 'DB_TABLE' => 'users', + + /* + |-------------------------------------------------------------------------- + | Use session + |-------------------------------------------------------------------------- + | + | Use session based authentication instead of the default JWT based auth. + | + */ + 'USE_SESSION' => true, + + /* + |-------------------------------------------------------------------------- + | Generate timestamps + |-------------------------------------------------------------------------- + | + | Automatically generate created_at/updated_at timestamps for register + | and update methods + | + */ + 'USE_TIMESTAMPS' => true, + + /* + |-------------------------------------------------------------------------- + | Encode password + |-------------------------------------------------------------------------- + | + | Password encode is run when leaf wants to encode passwords on register + | This exact method is used by default in Leaf, so you can set it to null + | if you want to. + | + | You can set your own implementation instead of Password::hash + | + */ + 'PASSWORD_ENCODE' => function ($password) { + return Password::hash($password); + }, + + /* + |-------------------------------------------------------------------------- + | Verify Password + |-------------------------------------------------------------------------- + | + | This function is run to verify the password. This implementation is done + | by default, so you can set it to null, and it will still work fine. + | + | You can add your own implementation instead of Password::verify + | + */ + 'PASSWORD_VERIFY' => function ($password, $hashedPassword) { + return Password::verify($password, $hashedPassword); + }, + + /* + |-------------------------------------------------------------------------- + | Password Key + |-------------------------------------------------------------------------- + | + | The default password key. Leaf will expect this key to hold passwords + | in your database. + | + */ + 'PASSWORD_KEY' => 'password', + + /* + |-------------------------------------------------------------------------- + | Hide id + |-------------------------------------------------------------------------- + | + | Hide id field from user object returned in login, register and update + | + */ + 'HIDE_ID' => true, + + /* + |-------------------------------------------------------------------------- + | Hide password + |-------------------------------------------------------------------------- + | + | Hide password from user object returned in login, register and update + | + */ + 'HIDE_PASSWORD' => true, + + /* + |-------------------------------------------------------------------------- + | Login params error + |-------------------------------------------------------------------------- + | + | Error to show when the login params aren't found in db + | + */ + 'LOGIN_PARAMS_ERROR' => 'Username not registered!', + + /* + |-------------------------------------------------------------------------- + | Password error + |-------------------------------------------------------------------------- + | + | Error to show when the login password is wrong + | + */ + 'LOGIN_PASSWORD_ERROR' => 'Password is incorrect!', + + /* + |-------------------------------------------------------------------------- + | Session on register + |-------------------------------------------------------------------------- + | + | If true, a session will be created on a successful registration, else + | you it'll be created on login rather. + | + */ + 'SESSION_ON_REGISTER' => false, + + /* + |-------------------------------------------------------------------------- + | Login page route + |-------------------------------------------------------------------------- + */ + 'GUARD_LOGIN' => '/auth/login', + + /* + |-------------------------------------------------------------------------- + | Register page route + |-------------------------------------------------------------------------- + */ + 'GUARD_REGISTER' => '/auth/register', + + /* + |-------------------------------------------------------------------------- + | Logout route + |-------------------------------------------------------------------------- + */ + 'GUARD_LOGOUT' => '/auth/logout', + + /* + |-------------------------------------------------------------------------- + | Home page route + |-------------------------------------------------------------------------- + */ + 'GUARD_HOME' => '/home', + + /* + |-------------------------------------------------------------------------- + | JWT + Session + |-------------------------------------------------------------------------- + | + | Add an auth token to the auth session? + | + */ + 'SAVE_SESSION_JWT' => false, + + /* + |-------------------------------------------------------------------------- + | JWT Token Secret + |-------------------------------------------------------------------------- + | + | Secret string to encode JWT + | + */ + 'TOKEN_SECRET' => '@_leaf$0Secret!', + + /* + |-------------------------------------------------------------------------- + | JWT Lifetime + |-------------------------------------------------------------------------- + | + | How long should JWT be valid for? + | + */ + 'TOKEN_LIFETIME' => 60 * 60 * 24 * 365 +]; +``` + +You can find more information about these settings in the [Auth Config](/modules/auth/v/2.1/config.html) documentation. + +## CORS config + +This config allows you pass options to the [Leaf CORS module](/modules/cors/). The default config looks like this: + +```php +return [ + /* + |-------------------------------------------------------------------------- + | Configure allowed origins + |-------------------------------------------------------------------------- + | + | Configures the Access-Control-Allow-Origin CORS header. Possible values: + | + | * String - set origin to a specific origin. For example if + | you set it to "http://example.com" only requests from + | "http://example.com" will be allowed. + | + | * RegExp - set origin to a regular expression pattern which will be + | used to test the request origin. If it's a match, the request origin + | will be reflected. For example the pattern /example\.com$/ will reflect + | any request that is coming from an origin ending with "example.com". + | + | * Array - set origin to an array of valid origins. Each origin can be a String + | or a RegExp. For example ["http://example1.com", /\.example2\.com$/] will + | accept any request from "http://example1.com" or from + | a subdomain of "example2.com". + | + | * Function - set origin to a function implementing some custom + | logic. The function takes the request origin as the first parameter + | and a callback (called as callback(err, origin), where origin is a + | non-function value of the origin option) as the second. + | + */ + 'origin' => '*', + + /* + |-------------------------------------------------------------------------- + | Configure allowed HTTP methods + |-------------------------------------------------------------------------- + | + | Configures the Access-Control-Allow-Methods CORS header. + | Expects a comma-delimited string (ex: 'GET,PUT,POST') or + | an array (ex: ['GET', 'PUT', 'POST']) + | + */ + 'methods' => 'GET,HEAD,PUT,PATCH,POST,DELETE', + + /* + |-------------------------------------------------------------------------- + | Configure allowed HTTP headers + |-------------------------------------------------------------------------- + | + | Configures the Access-Control-Allow-Headers CORS header. Expects a + | comma-delimited string (ex: 'Content-Type,Authorization') or + | an array (ex: ['Content-Type', 'Authorization']). If not specified, + | defaults to reflecting the headers specified in the request's + | Access-Control-Request-Headers header. + | + */ + 'allowedHeaders' => '*', + + /* + |-------------------------------------------------------------------------- + | Configure expose headers + |-------------------------------------------------------------------------- + | + | Configures the Access-Control-Expose-Headers CORS header. Expects + | a comma-delimited string (ex: 'Content-Range,X-Content-Range') + | or an array (ex: ['Content-Range', 'X-Content-Range']). + | If not specified, no custom headers are exposed. + | + */ + 'exposedHeaders' => '', + + /* + |-------------------------------------------------------------------------- + | Configure credentials + |-------------------------------------------------------------------------- + | + | Configures the Access-Control-Allow-Credentials CORS header. + | Set to true to pass the header, otherwise it is omitted. + | + */ + 'credentials' => false, + + /* + |-------------------------------------------------------------------------- + | Configure max age + |-------------------------------------------------------------------------- + | + | Configures the Access-Control-Max-Age CORS header. Set to + | an integer to pass the header, otherwise it is omitted. + | + */ + 'maxAge' => null, + + /* + |-------------------------------------------------------------------------- + | Configure preflight continue + |-------------------------------------------------------------------------- + | + | Pass the CORS preflight response to the next handler. + | + */ + 'preflightContinue' => false, + + /* + |-------------------------------------------------------------------------- + | Log open + |-------------------------------------------------------------------------- + | + | Provides a status code to use for successful OPTIONS requests, + | since some legacy browsers (IE11, various SmartTVs) choke on 204. + | + */ + 'optionsSuccessStatus' => 204, +]; +``` + +You can find more information on the configuration options on the [cors config docs](/modules/cors/#configuration-options). + +## Database config + +This config allows you to configure the database connection. The default config looks like this: + +```php +return [ + + /* + |-------------------------------------------------------------------------- + | Default Database Connection Name + |-------------------------------------------------------------------------- + | + | Here you may specify which of the database connections below you wish + | to use as your default connection for all database work. Of course + | you may use many connections at once using the Database library. + | + */ + + 'default' => _env('DB_CONNECTION', 'mysql'), + + /* + |-------------------------------------------------------------------------- + | Database Connections + |-------------------------------------------------------------------------- + | + | Here are each of the database connections setup for your application. + | Of course, examples of configuring each database platform that is + | supported by eloquent is shown below to make development simple. + | + | + | All database work in eloquent is done through the PHP PDO facilities + | so make sure you have the driver for your particular database of + | choice installed on your machine before you begin development. + | + */ + + 'connections' => [ + 'sqlite' => [ + 'driver' => 'sqlite', + 'url' => _env('DATABASE_URL'), + 'database' => _env('DB_DATABASE', DatabasePath('database.sqlite')), + 'prefix' => '', + 'foreign_key_constraints' => _env('DB_FOREIGN_KEYS', true), + ], + + 'mysql' => [ + 'driver' => 'mysql', + 'url' => _env('DATABASE_URL'), + 'host' => _env('DB_HOST', '127.0.0.1'), + 'port' => _env('DB_PORT', '3306'), + 'database' => _env('DB_DATABASE', 'forge'), + 'username' => _env('DB_USERNAME', 'forge'), + 'password' => _env('DB_PASSWORD', ''), + 'unix_socket' => _env('DB_SOCKET', ''), + 'charset' => _env('DB_CHARSET', 'utf8mb4'), + 'collation' => _env('DB_COLLATION', 'utf8mb4_unicode_ci'), + 'prefix' => '', + 'prefix_indexes' => true, + 'strict' => true, + 'engine' => null, + 'options' => extension_loaded('pdo_mysql') ? array_filter([ + PDO::MYSQL_ATTR_SSL_CA => _env('MYSQL_ATTR_SSL_CA'), + ]) : [], + ], + + 'pgsql' => [ + 'driver' => 'pgsql', + 'url' => _env('DATABASE_URL'), + 'host' => _env('DB_HOST', '127.0.0.1'), + 'port' => _env('DB_PORT', '5432'), + 'database' => _env('DB_DATABASE', 'forge'), + 'username' => _env('DB_USERNAME', 'forge'), + 'password' => _env('DB_PASSWORD', ''), + 'charset' => _env('DB_CHARSET', 'utf8'), + 'prefix' => '', + 'prefix_indexes' => true, + 'schema' => 'public', + 'sslmode' => 'prefer', + ], + + 'sqlsrv' => [ + 'driver' => 'sqlsrv', + 'url' => _env('DATABASE_URL'), + 'host' => _env('DB_HOST', 'localhost'), + 'port' => _env('DB_PORT', '1433'), + 'database' => _env('DB_DATABASE', 'forge'), + 'username' => _env('DB_USERNAME', 'forge'), + 'password' => _env('DB_PASSWORD', ''), + 'charset' => _env('DB_CHARSET', 'utf8'), + 'prefix' => '', + 'prefix_indexes' => true, + ], + ], +]; +``` + +This config has been modified to use the `_env` helper function. This helper function will check if the environment variable is set and if not, it will return the default value. This is useful for when you want to use the same config file for both development and production. Leaf will automatically use the connection details from the selected db type (`DB_CONNECTION`) in the `.env` file. + +The database config is used by your application models, Leaf DB and Leaf Auth to connect to the database. + +## Paths config + +The paths config allows you to configure the paths to your application's folders. The default config looks like this: + +```php +return [ + 'controllersPath' => 'app/controllers', + + 'modelsPath' => 'app/models', + + 'migrationsPath' => 'app/database/migrations', + + 'seedsPath' => 'app/database/seeds', + + 'factoriesPath' => 'app/database/factories', + + 'helpersPath' => 'app/helpers', + + 'viewsPath' => 'app/views', + + 'configPath' => 'config', + + 'storagePath' => 'storage', + + 'commandsPath' => 'app/console', + + 'routesPath' => 'app/routes', + + 'libPath' => 'lib', + + 'publicPath' => 'public', + + 'databaseStoragePath' => 'storage/app/db' +]; +``` + +The paths config is used by Leaf to locate your application's folders. If you want to change the default paths, you can do so in the `config/paths.php` file. + +## View Config + +The view config allows you to configure the view engine and the view cache. The default config looks like this: + +```php +use Leaf\View; + +return [ + /* + |-------------------------------------------------------------------------- + | Template Engine [EXPERIMENTAL] + |-------------------------------------------------------------------------- + | + | Leaf MVC unlike other frameworks tries to give you as much control as + | you need. As such, you can decide which view engine to use. + | + */ + 'view_engine' => \Leaf\Blade::class, + + /* + |-------------------------------------------------------------------------- + | Custom config method + |-------------------------------------------------------------------------- + | + | Configuration for your templating engine. + | + */ + 'config' => function ($config) { + View::blade()->config($config['views_path'], $config['cache_path']); + }, + + /* + |-------------------------------------------------------------------------- + | Custom render method + |-------------------------------------------------------------------------- + | + | This render method is triggered whenever render() is called + | in your app if you're using a custom view engine. + | + */ + 'render' => null, +]; +``` + +## Next Steps + +Follow along with the next steps to learn more about Leaf MVC. + + diff --git a/apps/docs/src/docs/mvc/console.md b/apps/docs/src/docs/mvc/console.md new file mode 100644 index 0000000..f4e4a82 --- /dev/null +++ b/apps/docs/src/docs/mvc/console.md @@ -0,0 +1,460 @@ +# MVC Console + + + +Leaf MVC and Leaf API come with a robust console tool to help you manage your app from the command line. We call this tool Aloe. + +Aloe comes with a predefined set of commands which provide project scaffolding, database and app management right from your terminal. To view all available commands, run `php leaf list` from your terminal. + +## Aloe CLI vs Leaf CLI + +Before we go any further, it's important to note that Aloe is not the same as Leaf CLI. + +Leaf CLI is a tool for creating and managing your Leaf applications, it is installed globally and can be used in Leaf and Leaf MVC/Leaf API applications. The Leaf CLI has a more generalized set of commands which can be used in any Leaf application. + +Aloe on the other hand is a tool for managing Leaf MVC and Leaf API applications. It is limited to the root directory of your Leaf MVC/Leaf API application and has a more specific set of commands which are only available in Leaf MVC/Leaf API applications. + +## Aloe Commands + +Aloe provides a large set of commands to ease your development process. Although they may look like a lot, we can group them into 6 categories: + +- App commands +- Scaffold commands +- Generate commands +- Delete commands +- Database commands +- View commands + +## App Commands + +App commands are commands which help you manage your Leaf MVC/Leaf API application. These commands are used to manage your app's state, interact with your app and it's dependencies and more. + +### Serve + +The `serve` command is used to start the Leaf development server. It is the same as running `php -S localhost:[PORT]` from your terminal, but it also runs your app's bootstrapping process. + +To start the Leaf development server, run `php leaf serve` from your terminal. You can also specify a port to run the server on by running `php leaf serve --port=[PORT]`. + +```bash +php leaf serve +``` + +### Interact + +The `interact` command is used to start the Leaf interactive shell. The interactive shell is a REPL (Read-Eval-Print-Loop) which allows you to interact with your app from the command line. It is powered by [PsySH](https://psysh.org/). + +```bash +php leaf interact +``` + +### Up and Down + +The `app:up` and `app:down` commands are used to put your app in maintenance mode. When your app is in maintenance mode, all requests to your app will return a 503 response. This is useful when you want to take your app down for maintenance. + +To put your app in maintenance mode, run `php leaf app:down`. To take your app out of maintenance mode, run `php leaf app:up`. + +```bash +php leaf app:down +php leaf app:up +``` + +## Scaffold Commands + +Scaffold commands are commands which help you scaffold your Leaf MVC/Leaf API application. These commands are used to create new files and folders in your app. Some of these commands even scaffold entire flows for you. + +### Auth Scaffold + +The `auth:scaffold` command is used to scaffold basic authentication for your Leaf MVC/Leaf API application. It creates required models, controllers, views and routes, migrations and everything you need to get started with authentication. Depending on your flow, you may need to make some changes to the files generated by this command. + +Note that this command will generate different files depending on whether you're using Leaf MVC or Leaf API. + +If you're building a Leaf MVC app, this command will automatically scaffold a login and registration flow for you with views and controllers, however, since Leaf API comes with the View layer disabled, this command will only scaffold the required models, controllers, routes and migrations for you. All controllers in Leaf API will return JSON responses. + +You can force the command to generate files for Leaf MVC or Leaf API by passing the `--mvc` or `--api` flag respectively. + +```bash +php leaf auth:scaffold +php leaf auth:scaffold --mvc # force Leaf MVC +php leaf auth:scaffold --api # force Leaf API +``` + +You can find the Leaf MVC authentication documentation [here](/modules/auth/mvc). + +### Mail Setup + +The `mail:setup` command is used to setup mailing in your Leaf MVC/Leaf API application. It installs the Leaf Mail package and creates a `mail.php` config file in your `config` folder as well as a demo mailer in your `app/mailers` folder. + +```bash +php leaf mail:setup +``` + +Find the MVC Mail documentation [here](/docs/mvc/mail). + +### Env Generate + +The `env:generate` command is used to generate a `.env` file in your Leaf MVC/Leaf API application. It generates a `.env` file from your `.env.example` file and fills it with the values in your `.env.example` file. + +If there is no `.env.example` file in your app, this command will generate a `.env` file from scratch. + +```bash +php leaf env:generate +``` + +### Devtools Install + +The `devtools:install` command is used to install and setup the Leaf PHP devtools in your Leaf MVC/Leaf API application. + +```bash +php leaf devtools:install +``` + +You can find the Leaf PHP devtools documentation [here](/modules/devtools/). + +### View Install + +The `view:install` command is used to install and setup the frontend of your Leaf MVC/Leaf API application. It can be used to install any frontend framework of your choice, vite, tailwind or a template engine like bare ui. You can use the `--react`, `--vue`, `--blade`, and `--bareui` options to scaffold your frontend setup. + +```bash +leaf view:install --react +``` + +You can also use the `--vite` and `--tailwind` options to scaffold Vite and Tailwind respectively. + +```bash +php leaf view:install --vite +php leaf view:install --tailwind +``` + +You can check the [frontend documentation](/modules/views/) for more information. + +## Generate Commands + +These commands are used to generate files like controllers, models, migrations, views and more directly into your app. + +### Generate Command + +The `g:command` command is used to generate a new console command in your Leaf MVC/Leaf API application. It creates a new command class in your `app/commands` folder. + +```bash +php leaf g:command [name] +``` + +### Generate Controller + +The `g:controller` command is used to generate a new controller in your Leaf MVC/Leaf API application. It creates a new controller class in your `app/controllers` folder. + +```bash +php leaf g:controller [name] +``` + +This command can also be used to generate a controller with a resource route. To generate a controller with a resource route, pass the `--resource` flag. + +```bash +php leaf g:controller [name] --resource +``` + +Resource controllers are controllers which have a route for every CRUD operation. You can find more information about resource controllers [here](/docs/mvc/controllers). + +You can also generate a controller and a model at the same time by passing the `--model` flag. + +```bash +php leaf g:controller [name] --model +``` + +You can also generate a migration and model at the same time by passing the `--all` flag, or just `-a` for short. + +```bash +php leaf g:controller [name] --all +php leaf g:controller [name] -a +``` + +### Generate Factory + +The `g:factory` command is used to generate a new model factory in your Leaf MVC/Leaf API application. It creates a new factory class in your `app/database/factories` folder. + +```bash +php leaf g:factory [name] +``` + +### Generate Helper + +The `g:helper` command is used to generate a new helper class in your Leaf MVC/Leaf API application. It creates a new helper class in your `app/helpers` folder. + +```bash +php leaf g:helper [name] +``` + +### Generate Mailer + +The `g:mailer` command is used to generate a new mailer in your Leaf MVC/Leaf API application. It creates a new mailer class in your `app/mailers` folder. + +```bash +php leaf g:mailer [name] +``` + +### Generate Migration + +The `g:migration` command is used to generate a new migration in your Leaf MVC/Leaf API application. It creates a new migration file in your `app/database/migrations` folder. + +```bash +php leaf g:migration [name] +``` + +By default, this command assumes your table name from the migration name. For example, if you run `php leaf g:migration users`, the command will assume your table name is `users`. You can override this by passing the `--table` flag. + +```bash +php leaf g:migration [name] --table=[table_name] +``` + +### Generate Model + +The `g:model` command is used to generate a new model in your Leaf MVC/Leaf API application. It creates a new model class in your `app/models` folder. + +```bash +php leaf g:model [name] +``` + +If you want to generate a model with a migration, you can pass the `--migration` flag. + +```bash +php leaf g:model [name] --migration +``` + +### Generate Seed + +The `g:seed` command is used to generate a new seed file in your Leaf MVC/Leaf API application. It creates a new seed file in your `app/database/seeds` folder. + +```bash +php leaf g:seed [name] +``` + +### Generate Template + +The `g:template` command is used to generate a new view file in your Leaf MVC/Leaf API application. It creates a new view file in your `resources/views` folder. + +```bash +php leaf g:template [name] +``` + +You can tell this command what kind of view file you want to create using the `--type` flag. The available types are `blade`, `jsx`, `vue` and `html`. + +```bash +php leaf g:template [name] --type=blade +php leaf g:template [name] --type=jsx +php leaf g:template [name] --type=vue +php leaf g:template [name] --type=html +``` + +## Delete Commands + +These commands are used to delete files like controllers, models, migrations, views and more directly from your app. + +### Delete Command + +The `d:command` command is used to delete a console command from your Leaf MVC/Leaf API application. It deletes a command class from your `app/commands` folder and automatically unregisters it from Aloe. + +```bash +php leaf d:command [name] +``` + +### Delete Controller + +The `d:controller` command is used to delete a controller from your Leaf MVC/Leaf API application. It deletes a controller class from your `app/controllers` folder. + +```bash +php leaf d:controller [name] +``` + +### Delete Factory + +The `d:factory` command is used to delete a model factory from your Leaf MVC/Leaf API application. It deletes a factory class from your `app/database/factories` folder. + +```bash +php leaf d:factory [name] +``` + +### Delete Migration + +The `d:migration` command is used to delete a migration from your Leaf MVC/Leaf API application. It deletes a migration file from your `app/database/migrations` folder. + +```bash +php leaf d:migration [name] +``` + +### Delete Model + +The `d:model` command is used to delete a model from your Leaf MVC/Leaf API application. It deletes a model class from your `app/models` folder. + +```bash +php leaf d:model [name] +``` + +### Delete Seed + +The `d:seed` command is used to delete a seed file from your Leaf MVC/Leaf API application. It deletes a seed file from your `app/database/seeds` folder. + +```bash +php leaf d:seed [name] +``` + +## Database Commands + +These commands are used to manage your database. They are used to create, migrate, seed and rollback your database. + +### Install Database + +The `db:install` command is used to create a new database from your `.env` file. It creates a new database using the credentials in your `.env` file. + +```bash +php leaf db:install +``` + +### Migrate Database + +The `db:migrate` command is used to run your database migrations. It runs all migrations in your `app/database/migrations` folder. + +```bash +php leaf db:migrate +``` + +You can also run a specific migration by passing the migration name to the `--file` flag. + +```bash +php leaf db:migrate --file=[migration_name] +php leaf db:migrate --file=users # runs the ..._create_users_table migration +``` + +You can also seed your database after running your migrations by passing the `--seed` flag. + +```bash +php leaf db:migrate --seed +``` + +### Reset Database + +The `db:reset` command is used to rollback, migrate and seed your database. It runs the `db:rollback`, `db:migrate` and `db:seed` commands in that order. + +```bash +php leaf db:reset +``` + +If you want to prevent seeding your database, you can pass the `--noSeed` flag. + +```bash +php leaf db:reset --noSeed +``` + +### Rollback Database + +The `db:rollback` command is used to rollback your database migrations. It rolls back all migrations in your `app/database/migrations` folder. + +```bash +php leaf db:rollback +``` + +You can also rollback a specific migration by passing the migration name to the `--file` flag. + +```bash +php leaf db:rollback --file=[migration_name] +php leaf db:rollback --file=users # rolls back the ..._create_users_table migration +``` + +You may also rollback a specific number of migrations by passing the number to the `--step` flag. + +```bash +php leaf db:rollback --step=[number] +php leaf db:rollback --step=2 # rolls back the last 2 migrations +``` + +### Seed Database + +The `db:seed` command is used to seed your database. It runs all seed files loading in the `app/database/seeds/DatabaseSeeder.php` file. In this file, you can specify which seed files to run. + +```bash +php leaf db:seed +``` + +## View Commands + +These commands are used to manage your frontend. They are used to build, serve and install your frontend. We already covered the `view:install` command in the Scaffold Commands section above. + +### Build Frontend + +The `view:build` command is used to build your frontend. It builds your frontend using the build command specified in your `package.json` file. + +```bash +php leaf view:build +``` + +### Serve Frontend + +The `view:serve` command is used to serve your frontend. It serves your frontend using the `dev` command specified in your `package.json` file. + +```bash +php leaf view:serve +``` + +## Command List + +This is a list of every command available in Aloe. To view this list from your terminal, run `php leaf list`. + +```bash +Leaf MVC v3.5.0 + +Usage: + command [options] [arguments] + +Options: + -h, --help Display help for the given command. When no command is given display help for the list command + -q, --quiet Do not output any message + -V, --version Display this application version + --ansi|--no-ansi Force (or disable --no-ansi) ANSI output + -n, --no-interaction Do not ask any interactive question + -v|vv|vvv, --verbose Increase the verbosity of messages: 1 for normal output, 2 for more verbose output and 3 for debug + +Available commands: + completion Dump the shell completion script + example example command's description + help Display help for a command + interact Interact with your application + list List commands + serve Start the leaf development server + app + app:down Place app in maintainance mode + app:up Remove app from maintainance mode + auth + auth:scaffold Scaffold basic app authentication + d + d:command Delete a console command + d:controller Delete a controller + d:factory Delete a model factory + d:migration Delete a migration + d:model Delete a model + d:seed Delete a model seeder + db + db:install Create new database from .env variables + db:migrate Run the database migrations + db:reset Rollback, migrate and seed database + db:rollback Rollback all database migrations + db:seed Seed the database with records + devtools + devtools:install Install the Leaf PHP devtools + env + env:generate Generate .env file + g + g:command Create a new console command + g:controller Create a new controller class + g:factory Create a new model factory + g:helper Create a new helper class + g:mailer Create a new mailer + g:migration Create a new migration file + g:model Create a new model class + g:seed Create a new seed file + g:template Create a new view file + mail + mail:setup Install leaf mail and setup mail config + view + view:build Run your frontend dev server + view:dev [view:serve] Run your frontend dev server + view:install Run a script in your composer.json +``` diff --git a/apps/docs/src/docs/mvc/controllers.md b/apps/docs/src/docs/mvc/controllers.md new file mode 100644 index 0000000..557fbbc --- /dev/null +++ b/apps/docs/src/docs/mvc/controllers.md @@ -0,0 +1,238 @@ +# Controllers + + + +Instead of using Closures in route files to define all your request handling logic, you can use controllers to organize this behavior. Controllers can group related request handling logic into a single class. For instance, you may want to group all logic that handles user account details into an `AccountsController` class: actions such as displaying, creating, updating, and deleting users. + +Controllers can also be shared among different route files, giving you a single location to define a controller that can be used in different contexts throughout your application. Leaf MVC and Leaf API controllers are stored in the `app/controllers`. Any new controller you create will be saved in this location. + +## Generating Controllers + +Leaf MVC and Leaf API come with a console helper that can generate a new controller for you. To create a new controller, use the `g:controller` command: + +```bash +php leaf g:controller users +``` + +This will create a new `UsersController` class in the `app/controllers` directory. The controller will contain a single method, `index`, that returns a simple string: + +```php +json([ + 'message' => 'UsersController@index output' + ]); + } +} +``` + +You can see that the controller extends the `App\Controllers\Controller` class. This is the base controller class provided by Leaf MVC and Leaf API. It is the parent class for all your application's controllers and serves as a place to put shared logic. + +## Defining Controllers + +The above section looked at generating a new controller using the console helper in Leaf MVC and Leaf API. If you are using Leaf Core, you can manually create a controller in any way you prefer. Controllers are basically classes that have callable actions and return responses. To add some extra functionality to your controllers, you can extend the `Leaf\Controller` class. + +For example, let's create a new controller that returns a simple string: + +```php +json('Hello World!'); + } +} +``` + +You can define a route to this controller action like so: + +
+ +```php +$app->get('/', 'HomeController@index'); +``` + +
+
+ +```php +app()->get('/', 'HomeController@index'); +``` + +
+ +## Resource Controllers + +Leaf resource routing assigns the typical create, read, update, and delete ("CRUD") routes to a controller with a single line of code. To get started, we can use the `g:controller` command's `--resource` option to quickly create a controller to handle these actions: + +```sh +php leaf g:controller Photos --resource +``` + +This command will generate a controller at `app/controllers/PhotosController.php`. The controller will contain a method for each of the available resource operations. Next, you may register a resource route that points to the controller: + +```php +app()->resource('/user/(\d+)', 'UsersController'); +``` + +The `resource` method accepts a URI and a controller name. The URI may contain route parameters, which will be passed to the controller methods. The controller name should be the fully-qualified class name of the controller. In this example, the `UsersController` class should be defined in the `app/controllers` directory. + +This single route declaration creates multiple routes to handle a variety of actions on the resource. The generated controller will already have methods stubbed for each of these actions: + +```php + -m +``` + +Create a template for your controller + +```bash +php leaf g:controller -t +``` + +Create a model and migration for your controller + +```bash +php leaf g:controller -a +``` + +### Controller Help + +```bash +Description: + Create a new controller class + +Usage: + g:controller [options] [--] + +Arguments: + controller controller name + +Options: + -a, --all Create a model and migration for controller + -m, --model Create a model for controller + -r, --resource Create a resource controller + -w, --web Create a web(ordinary) controller + -h, --help Display this help message + -q, --quiet Do not output any message + -V, --version Display this application version + --ansi Force ANSI output + --no-ansi Disable ANSI output + -n, --no-interaction Do not ask any interactive question + -v|vv|vvv, --verbose Increase the verbosity of messages: 1 for normal output, 2 for more verbose output and 3 for debu +``` + +## Next Steps + +Follow along with the next steps to learn more about Leaf MVC. + + diff --git a/apps/docs/src/docs/mvc/globals.md b/apps/docs/src/docs/mvc/globals.md new file mode 100644 index 0000000..6408e67 --- /dev/null +++ b/apps/docs/src/docs/mvc/globals.md @@ -0,0 +1,287 @@ +# MVC Helpers + +Just as Leaf has a couple of built-in helpers, Leaf MVC also ships with a bunch of helpers to make your life easier. These helpers are available throughout your application and help you with common tasks like finding files and loading paths. + +## Loading app paths + +Since Leaf MVC and Leaf API come with a robust structure out of the box, they also come with quick ways to reference files in these structures. For example, if you want to reference a file in your `public` folder, you can use the `PublicPath()` helper. + +### AppPaths() + +This returns an array of all the paths in your application. + +```php +$paths = AppPaths(); + +$controllersPath = AppPaths('controllers'); // you can do this +$controllersPath = $paths['controllers']; // or this +``` + +If the path you are looking for doesn't have a helper function, you can use the `AppPaths()` helper to get the path. Just make sure that the path is defined in your `config/paths.php` file. + +```php +AppPaths('weirdPath'); +``` + +### assets() + +This returns the path to your assets folder. You can pass in a file name to get the path to that file. + +```php +$asset = assets('css/main.css'); +// -> public/assets/css/main.css +``` + +You can configure the path to your assets folder in your `config/paths.php` file. + +```php +'assets' => 'public/assets' +``` + +### ConfigPath() + +This returns the path to your config folder. You can pass in a file name to get the path to that file. + +```php +$dbConfigFile = ConfigPath('db.php'); +// -> config/db.php +``` + +### CommandsPath() + +This returns the path to your commands folder. You can pass in a file name to get the path to that file. + +```php +$command = CommandsPath('MainCommand.php'); +// -> app/commands/MainCommand.php +``` + +### ControllersPath() + +This returns the path to your controllers folder. You can pass in a file name to get the path to that file. + +```php +$controller = ControllersPath('MainController.php'); +// -> app/controllers/MainController.php +``` + +### DatabasePath() + +This returns the path to your database folder. You can pass in a file name to get the path to that file. + +```php +$database = DatabasePath('migrations'); +// -> app/database/migrations +``` + +### FactoriesPath() + +This returns the path to your factories folder. You can pass in a file name to get the path to that file. + +```php +$factory = FactoriesPath('UserFactory.php'); +// -> app/database/factories/UserFactory.php +``` + +### HelpersPath() + +This returns the path to your helpers folder. You can pass in a file name to get the path to that file. + +```php +$helper = HelpersPath('MainHelper.php'); +// -> app/helpers/MainHelper.php +``` + +### LibPath() + +This returns the path to your lib folder. You can pass in a file name to get the path to that file. + +```php +$lib = LibPath('MainLib.php'); +// -> lib/MainLib.php +``` + +### MigrationsPath() + +This returns the path to your migrations folder. You can pass in a file name to get the path to that file. + +```php +$migration = MigrationsPath('MainMigration.php'); +// -> app/database/migrations/MainMigration.php +``` + +### ModelsPath() + +This returns the path to your models folder. You can pass in a file name to get the path to that file. + +```php +$model = ModelsPath('User.php'); +// -> app/models/User.php +``` + +### PublicPath() + +This returns the path to your public folder. You can pass in a file name to get the path to that file. + +```php +$public = PublicPath('index.php'); +// -> public/index.php +``` + +### RoutesPath() + +This returns the path to your routes folder. You can pass in a file name to get the path to that file. + +```php +$routes = RoutesPath('_auth.php'); +// -> app/routes/_auth.php +``` + +### SeedsPath() + +This returns the path to your seeds folder. You can pass in a file name to get the path to that file. + +```php +$seed = SeedsPath('MainSeed.php'); +// -> app/database/seeds/MainSeed.php +``` + +### StoragePath() + +This returns the path to your storage folder. You can pass in a file name to get the path to that file. + +```php +$storage = StoragePath('MainStorage.php'); +// -> storage/MainStorage.php +``` + +### ViewsPath() + +This returns the path to your views folder. You can pass in a file name to get the path to that file. + +```php +$view = ViewsPath('index.leaf.php'); +// -> app/views/index.leaf.php +``` + +## Loading app config + +There are some situations that may require you to load up your config files. For such situations, we've prepared a couple of helpers to help you load up your config files. + +### MvcConfig() + +This returns an array of all the config files in your application. + +```php +$configs = MvcConfig(); + +$dbConfig = MvcConfig('db'); // you can do this +$dbConfig = $configs['db']; // or this +``` + +It also allows you to load up a specific config from the config file you pass in. + +```php +$config = MvcConfig('db', 'host'); // you can do this +$config = $configs['db']['host']; // or this +``` + +### AppConfig() + +This returns an array of all the config in your `config/app.php` file. + +```php +$configs = AppConfig(); + +$debug = AppConfig('debug'); // you can do this +$debug = $configs['debug']; // or this +``` + +### AuthConfig() + +This returns an array of all the config in your `config/auth.php` file. + +```php +$configs = AuthConfig(); + +$auth = AuthConfig('auth'); // you can do this +$auth = $configs['auth']; // or this +``` + +### CorsConfig() + +This returns an array of all the config in your `config/cors.php` file. + +```php +$configs = CorsConfig(); + +$origin = CorsConfig('origin'); // you can do this +$origin = $configs['origin']; // or this +``` + +### DatabaseConfig() + +This returns an array of all the config in your `config/db.php` file. + +```php +$configs = DatabaseConfig(); + +$host = DatabaseConfig('host'); // you can do this +$host = $configs['host']; // or this +``` + +### MailConfig() + +This returns an array of all the config in your `config/mail.php` file. + +```php +$configs = MailConfig(); + +$host = MailConfig('host'); // you can do this +$host = $configs['host']; // or this +``` + +### ViewConfig() + +This returns an array of all the config in your `config/view.php` file. + +```php +$configs = ViewConfig(); + +$host = ViewConfig('viewEngine'); // you can do this +$host = $configs['viewEngine']; // or this +``` + +## View Helpers + +View helpers are in charge of outputting your views. + +### view() + +This method calls the `render()` method of whatever view engine you are using. It takes in the name of the view you want to render and an optional array of data you want to pass to the view. + +```php +view('index', [ + 'name' => 'Leaf' +]); +``` + +The only issue here is that not all view engines directly output the view. For example, Blade and Twig return the view as a string. This means that you have to echo the view. + +```php +echo view('index', [ + 'name' => 'Leaf' +]); +``` + +To make this easier, Leaf MVC ships with a `render()` method that calls the `view()` helper and echoes the view. + +### render() + +This method calls the `view()` helper and echoes the view. It takes in the name of the view you want to render and an optional array of data you want to pass to the view. + +```php +render('index', [ + 'name' => 'Leaf' +]); +``` diff --git a/apps/docs/src/docs/mvc/index.md b/apps/docs/src/docs/mvc/index.md new file mode 100644 index 0000000..42c7e9e --- /dev/null +++ b/apps/docs/src/docs/mvc/index.md @@ -0,0 +1,71 @@ + + +# Leaf + MVC + + + +Leaf is a simple PHP framework/set of libraries that can be used to build any kind of application. By default, Leaf doesn't give you a lot of structure, but it fully supports the MVC pattern without any extra configuration. + +## What is MVC? + +MVC stands for Model-View-Controller. It is a pattern that separates your application into three distinct parts: + +- Models: These are the classes that represent your data. They are responsible for interacting with your database, and for validating your data. +- Views: These are the files that are responsible for displaying your data to the user. They are usually written in HTML, but can also be written in other templating languages like [BareUI](https://leafphp.dev/modules/views/bareui/) or [Blade](https://leafphp.dev/modules/views/blade/) or frameworks like [Vue](https://vuejs.org/) or [React](https://reactjs.org/) +- Controllers: These are the classes that are responsible for handling the user's request, and for returning the appropriate response. + + + +## MVC in Leaf + +Leaf out of the box doesn't provide any structure, however, the Leaf team also provides a few setups that you can use to get started with Leaf and MVC. These setups are designed to give you a good starting point for your application, and come with additional tooling that make building with Leaf even faster. + +We provide two setups for you to choose from: + +- [Leaf MVC](/docs/leafmvc/) +- [Leaf API](/docs/leafapi/) + +### Leaf MVC vs Leaf API + +| Engine | Main use | Extra Notes | +| --------------------------- | :-------------: | :----------------------------: | +| [Leaf MVC](/docs/leafmvc/) | General purpose | - | +| [Leaf API](/docs/leafapi/) | Building APIs | View layer disabled by default | + +Leaf MVC and Leaf API pretty much support the same tooling, but Leaf API is designed to be used for building APIs. It comes with the view layer disabled by default, and comes with a few extra tools that make building APIs with Leaf even easier. + +## Leaf Skeleton + +Skeleton was designed to be a simple starting point for your application, and came with just the bare minimum to get you started. However, we have decided to deprecate Skeleton in favor of the Leaf CLI. The Leaf CLI is a command-line tool for generating Leaf projects, installing modules, and more. + +We recently released an update to the Leaf CLI that allows you to select specific features you want to include and generate a project with everything you need. This functionality is similar to what Skeleton provided but is more flexible and allows you to create projects with only the features that you need, which is why we've decided to deprecate Leaf Skeleton. + +Skeleton will still be available for download, but we won't be updating it anymore. We recommend that you generate a project with the CLI or use Leaf MVC or Leaf API instead. + +[> Leaf CLI Docs](/docs/cli/) + +## MVC Tools + +Besides the MVC setups, Leaf also provides a few tools that can help you build your own MVC setup if you want to. You can check the "MVC Tools" section in the sidebar to learn more about these tools. + + diff --git a/apps/docs/src/docs/mvc/libraries.md b/apps/docs/src/docs/mvc/libraries.md new file mode 100644 index 0000000..be9c240 --- /dev/null +++ b/apps/docs/src/docs/mvc/libraries.md @@ -0,0 +1,81 @@ +# Custom Libraries + +Sometimes you might want to write some application logic that doesn't fit into a controller, model, or helpers. It makes sense to create a custom library for this functionality. For example, you might want to create a library that calculates the distance between two points on a map. You could then use this library in any controller, helper, or view. Leaf MVC and Leaf API both come with a `lib` folder where you can store your custom libraries. + +Custom libraries are not stored in the `app` folder because they are not part of the application's core functionality. They are more like helpers, however, unlike helpers they can be full classes, functions or just data structures and also require no structured namespace. + +## Autoloading Libraries + +Leaf MVC and Leaf API will only automatically load your libraries for you if you tell it to do so. You can do this by **uncommenting** the following line in your `public/index.php` file: + +```php +// \Leaf\Core::loadLibs(); +``` + +Once you do so, you can start creating your own libraries. + +## Creating a Library + +To create a library, simply create a new file in the `lib` folder. For example, let's create a library called `Math.php`: + +```php + $sum]); + } +} +``` + +## Library Structure + +As mentioned above, libraries can be just about anything. They are completely based on your own preference. However, it is recommended that you keep your libraries as simple as possible. Below is the same `Math` library from above, but this time it is a simple function instead of a class: + +```php + $sum]); + } +} +``` diff --git a/apps/docs/src/docs/mvc/mail.md b/apps/docs/src/docs/mvc/mail.md new file mode 100644 index 0000000..6942918 --- /dev/null +++ b/apps/docs/src/docs/mvc/mail.md @@ -0,0 +1,352 @@ +# Mailing + +Leaf provides amazing support for handling mailing in your application via Leaf Mail. The documentation for the Leaf Mailer module can be found on the [Leaf Mail page](/modules/mail/). This page will only cover how to use Leaf Mail in your Leaf MVC or Leaf API application. + +If you haven't already, we recommend you read the [Leaf Mail documentation](/modules/mail/) before continuing. + +## Setting up Leaf Mail + +Leaf MVC and Leaf API provide a lean setup out of the box that comes without mailing pre-activated. To activate mailing, you can run the following command in the root of your app: + +```bash +php leaf mail:setup +``` + +This will setup everything you need to start using mailing and will also create a `mail.php` file in your `config` folder. This file contains all the configuration options for Leaf Mail. You can read more about the configuration options in the [Leaf Mail documentation](/modules/mail/#mailer-config). + +## Mail server connection + +After setting up Leaf Mail, the next thing to do is to connect to your mail server. This connection is what Leaf Mail will attempt to use whenever you initiate an email send. + +Before you can connect to your mail server, you need to have your mail server credentials. You can get these from your mail server provider. + +### Your mail provider + +If you are using a mail provider like Mailgun, Sendgrid, etc, you need to head over to your provider's dashboard and get your mail server credentials. From there, you need to update the mail host and port in your `.env` file. + +```env +MAIL_HOST=smtp.mailtrap.io +MAIL_PORT=2525 +``` + +There are different kinds of server connections you can use. The most common one is SMTP using a username and password. You can also use OAuth authentication with a provider like Google. + +### Connection with username and password + +To connect to a server using your username and password, you can head over to your `.env` file and update the following values: + +```env +MAIL_USERNAME=null +MAIL_PASSWORD=null +``` + +These are your mail server username and password respectively. **Note that these values are not set by default**. You need to set them yourself. + +### Connection with OAuth + +Some mail providers like Google require OAuth authentication. To connect to a server using OAuth, you need to add an OAuth provider like league/oauth2-google to your project. You can install this using the Leaf CLI: + +```bash +leaf install league/oauth2-google +``` + +Or with composer: + +```bash +composer require league/oauth2-google +``` + +From there, you need to update the `config/mail.php` file to work with OAuth instead of username and password. You can do this by replacing these lines: + +```php +'auth' => [ + 'username' => _env('MAIL_USERNAME'), + 'password' => _env('MAIL_PASSWORD'), +], +``` + +With the OAuth config: + +```php +use League\OAuth2\Client\Provider\Google; +use PHPMailer\PHPMailer\OAuth; + +return [ + ... + + 'auth' => new OAuth( + [ + 'userName' => _env('MAIL_USERNAME'), + 'clientSecret' => _env('MAIL_CLIENT_SECRET'), + 'clientId' => _env('MAIL_CLIENT_ID'), + 'refreshToken' => _env('MAIL_REFRESH_TOKEN'), + 'provider' => new Google( + [ + 'clientId' => _env('MAIL_CLIENT_ID'), + 'clientSecret' => _env('MAIL_CLIENT_SECRET'), + ] + ), + ] + ), + + ... +]; +``` + +Since more environment variables have been added, you need to update your `.env` file to include these variables: + +```env +MAIL_CLIENT_ID= +MAIL_CLIENT_SECRET= +MAIL_REFRESH_TOKEN= +``` + +::: tip .env.example +It is a good practice to add these variables to your `.env.example` file so that other developers can easily know what environment variables they need to set. +::: + +## Sending emails + +Before you can send emails, you need to create a mailer. You can create a mailer by running the following command in the root of your app: + +```bash +php leaf mail:create +``` + +A mailer is a class that allows you to group related emails together. Mailers have methods called "actions" which are responsible for handling a specific type of email. For instance, you can create a mailer called `UserMailer` that has a `welcome` action for sending welcome emails, a `passwordReset` action for sending password reset emails, etc. + +Using this example, we can create a `UserMailer` by running the following command: + +```bash +php leaf mail:create user +``` + +This will create a `UserMailer` class in your `app/mailers` folder. The `UserMailer` class will look like this: + +```php + 'UserMailer Test', + 'body' => 'This is a test mail from action', + 'recipientEmail' => $user->email, + 'recipientName' => $user->name, + + // next couple of lines can be skipped if you + // set defaults in the config/mail.php file + 'senderName' => _env('MAIL_SENDER_NAME'), + 'senderEmail' => _env('MAIL_SENDER_EMAIL'), + ]); + } +} +``` + +You can rename the `action` method to anything you want, in this case we will rename it to `welcome`. The method is responsible for creating and returning a new `Mail` instance. The `Mail` instance is what is used to send the email. You can read more about the `Mail` class in the [Leaf Mail documentation](/modules/mail/#mailer-config). + +```php + 'Welcome to my app', + 'body' => 'This is a test mail from action', + 'recipientEmail' => $user->email, + 'recipientName' => $user->name, + ]); + } +} +``` + +To send the welcome email, you can call the `welcome` method on the `UserMailer` class like this: + +```php +UserMailer::welcome($user)->send(); +``` + +## Setting mail defaults + +Some values like the `senderName` and `senderEmail` are repeated in every email you send although they may not change. To avoid repeating these values, we set them as defaults in the `config/mail.php` file. You can configure these in your `.env` file like this: + +```env +MAIL_SENDER_NAME= +MAIL_SENDER_EMAIL= +MAIL_REPLY_TO_NAME= +MAIL_REPLY_TO_EMAIL= +``` + +### Removing defaults + +If you don't want to set defaults, you can remove them from the `config/mail.php` file. The `.env` values will then be ignored. Your updated `config/mail.php` file will look like this: + +```php +... +'defaults' => [], +... +``` + +Removing these defaults means that you will have to set these values in every email you send. + +## Mail Debugging + +Leaf Mail by default reports all errors from your mail server. This is useful for debugging, but can be annoying when you are in production. You can disable this by setting the `MAIL_DEBUG` environment variable to `false` in your `.env` file. + +```env +MAIL_DEBUG=false +``` + +## Mail Config + +The `config/mail.php` file contains all the configuration options for Leaf Mail. You can read more about the configuration options in the [Leaf Mail documentation](/modules/mail/#mailer-config). + +```php + _env('MAIL_DRIVER', 'smtp'), + + /* + |-------------------------------------------------------------------------- + | Mailer hostname + |-------------------------------------------------------------------------- + | + | This is the hostname for your mailer + | + */ + 'host' => _env('MAIL_HOST', 'smtp.mailtrap.io'), + + /* + |-------------------------------------------------------------------------- + | Mailer port + |-------------------------------------------------------------------------- + | + | Port to use for mailer connection + | + */ + 'port' => _env('MAIL_PORT', 2525), + + /* + |-------------------------------------------------------------------------- + | Keep Alive + |-------------------------------------------------------------------------- + | + | This config is used to keep the connection to your mail server alive. + | This is useful if you are sending multiple emails. It takes in a boolean. + | + */ + 'keepAlive' => true, + + /* + |-------------------------------------------------------------------------- + | Mailer Debug + |-------------------------------------------------------------------------- + | + | Enable or disable debug mode. Supported values are: + | 'SERVER', false or any value supported by PHPMailer's + | SMTPDebug config + | + */ + 'debug' => _env('MAIL_DEBUG', 'SERVER'), + + /* + |-------------------------------------------------------------------------- + | Mailer Encryption + |-------------------------------------------------------------------------- + | + | This is the encryption used for your mailer. Supported values are: + | 'STARTTLS' or any value supported by PHPMailer's SMTPSecure config + | + */ + 'security' => _env('MAIL_ENCRYPTION', 'STARTTLS'), + + /* + |-------------------------------------------------------------------------- + | Auth + |-------------------------------------------------------------------------- + | + | This config handles the authentication details for your mailer. + | It supports authentication with username and password and also + | OAuth authentication. + | + | For OAuth authentication, you will need to add an OAuth + | provider like league/oauth2-google to your project. + | + | An example OAuth config is shown below: + | + | use League\OAuth2\Client\Provider\Google; + | use PHPMailer\PHPMailer\OAuth; + | + | 'auth' => new OAuth( + | [ + | 'userName' => 'mail@gmail.com', + | 'clientSecret' => 'CLIENT_SECRET', + | 'clientId' => 'CLIENT_ID', + | 'refreshToken' => 'GMAIL_REFRESH_TOKEN', + | 'provider' => new Google( + | [ + | 'clientId' => 'CLIENT_ID', + | 'clientSecret' => 'CLIENT_SECRET', + | ] + | ), + | ] + |) + */ + 'auth' => [ + 'username' => _env('MAIL_USERNAME'), + 'password' => _env('MAIL_PASSWORD'), + ], + + /* + |-------------------------------------------------------------------------- + | Default addresses + |-------------------------------------------------------------------------- + | + | This config is used to set default values for the + | `recipientEmail`, `recipientName`, + | `senderEmail`, `senderName`, + | `replyToName`, and `replyToEmail` of your emails. + | + */ + 'defaults' => [ + 'senderName' => _env('MAIL_SENDER_NAME'), + 'senderEmail' => _env('MAIL_SENDER_EMAIL'), + 'replyToName' => _env('MAIL_REPLY_TO_NAME'), + 'replyToEmail' => _env('MAIL_REPLY_TO_EMAIL'), + ], +]; +``` diff --git a/apps/docs/src/docs/mvc/migrations.md b/apps/docs/src/docs/mvc/migrations.md new file mode 100644 index 0000000..d977f1a --- /dev/null +++ b/apps/docs/src/docs/mvc/migrations.md @@ -0,0 +1,149 @@ +# Migrations + + + +Database migrations are a technique used in software development to manage changes to a database schema over time. A database schema is the structure of a database that defines the tables, columns, relationships, and constraints that make up the data model. + +When changes are made to the database schema, such as adding a new table or column, modifying an existing column's data type, or changing a relationship between tables, database migrations allow developers to update the schema and propagate those changes to all instances of the database. + +## Generating Migrations + +You can quickly generate migrations using the `g:migration` command: + +```bash +php leaf g:migration + +# example +php leaf g:migration flights +``` + +The new migration will be placed in your `app/database/migrations` directory. Each migration file name begins with a timestamp. + +## Migration Structure + +A migration class contains two methods: up and down. The up method is used to add new tables, columns, or indexes to your database, while the down method should reverse the operations performed by the up method. + +You can create and modify tables in the both of these methods. In this example, we create a posts table: + +```php +capsule::schema()->hasTable("posts")): + $this->capsule::schema()->create("posts", function (Blueprint $table) { + $table->increments('id'); + $table->string('author_id'); + $table->string('title'); + $table->text('body'); + $table->timestamps(); + }); + endif; + } + + /** + * Reverse the migrations. + * + * @return void + */ + public function down() + { + $this->capsule::schema()->dropIfExists("posts"); + } +} +``` + +::: tip Note +Instead of building your migrations from scratch, you can use Leaf's schema builder to generate migrations from JSON data. [Learn more](/docs/mvc/schema). +::: + +## Running migrations + +To run all of your outstanding migrations, execute the `db:migrate` command: + +```bash +php leaf db:migrate +``` + +You may also run seeds alongside your migrations if you wish to do so: + +```bash +php leaf db:migrate -s +# or +php leaf db:migrate --seed +``` + +You can also choose to run a specific migration file: + +```bash +php leaf db:migrate -f users +``` + +## Rolling Back Migrations + +To roll back the latest migration operation, you may use the `db:rollback` command. + +```bash +php leaf db:rollback +``` + +You may roll back a limited number of migrations by providing the `step` option to the `rollback` command. For example, the following command will roll back the last five migrations: + +```bash +php leaf db:rollback -s 2 +``` + +To roll back all migrations, you can just pass `all` as the `step` option. + +```bash +php leaf db:rollback --step all +``` + +You can also rollback a specific migration file: + +```bash +php leaf db:rollback -f users +``` + +## Refreshing Migrations + +If you would like to reset your database and re-run all of your migrations with seeds, you may use the `db:reset` command. This command will drop all tables in your database and re-run all of your migrations: + +```bash +php leaf db:reset +``` + +If you want to prevent seeds from running, you can use the `--noSeed` option: + +```bash +php leaf db:reset --noSeed +``` + +## Next Steps + +Follow along with the next steps to learn more about Leaf MVC. + + diff --git a/apps/docs/src/docs/mvc/models.md b/apps/docs/src/docs/mvc/models.md new file mode 100644 index 0000000..4094907 --- /dev/null +++ b/apps/docs/src/docs/mvc/models.md @@ -0,0 +1,281 @@ +# Models + + + +A model is a class that represents your application's data and business logic, and it is responsible for managing data storage, retrieval, and manipulation. The Model communicates with the View and the Controller to provide data and to update the application's state. + +Each database table has a corresponding "Model" which is used to interact with that table. Models allow you to query for data in your tables, as well as insert new records into the table. + +::: tip Base Model +Leaf Models are built on top of [Laravel's Eloquent ORM](https://laravel.com/docs/10.x/eloquent). This means that you can use all the features of Eloquent in your Leaf applications. You can find the documentation for Eloquent [here](https://laravel.com/docs/10.x/eloquent). +::: + +## Defining Models + +Your models can be found in the `app/models` directory in Leaf MVC and Leaf API. Your models can be created using the `php leaf g:model` command from the root of your project. + +```bash +php leaf g:model User +``` + +This will create a `User.php` file in the `app/models` directory. + +## Model Structure + +Leaf MVC and Leaf API come with a base model class. This is to give you a place to configure all your models seamlessly without having access to the `Leaf\Model` file. It also allows you to add logic that you want to be available to all your models. + +```php +class Flight extends Model +{ + // +} +``` + +## Leaf Model Conventions + +Now, let's look at an example `Flight` model, which we will use to retrieve and store information from our `flights` database table: + +```php +class Flight extends Model +{ + // +} +``` + +### Table Names + +Note that we did not tell Leaf which table to use for our `Flight` model. By convention, the "snake case", plural name of the class will be used as the table name unless another name is explicitly specified. So, in this case, Leaf will assume the `Flight` model stores records in the `flights` table. You may specify a custom `table` by defining a table property on your model: + +```php +class Flight extends Model +{ + /** + * The table associated with the model. + * + * @var string + */ + protected $table = 'my_flights'; +} +``` + +### Primary Keys + +Leaf will also assume that each table has a primary key column named id. You may define a protected `$primaryKey` property to override this convention: + +```php +class Flight extends Model +{ + /** + * The primary key associated with the table. + * + * @var string + */ + protected $primaryKey = 'flight_id'; +} +``` + +In addition, Leaf assumes that the primary key is an incrementing integer value, which means that by default the primary key will automatically be cast to an int. If you wish to use a non-incrementing or a non-numeric primary key you must set the public `$incrementing` property on your model to false: + +```php +/** +* Indicates if the IDs are auto-incrementing. +* +* @var bool +*/ +public $incrementing = false; +``` + +If your primary key is not an integer, you should set the protected `$keyType` property on your model to string: + +```php +/** +* The "type" of the auto-incrementing ID. +* +* @var string +*/ +protected $keyType = 'string'; +``` + +### Timestamps + +By default, Leaf expects `created_at` and `updated_at` columns to exist on your tables. If you do not wish to have these columns automatically managed by Leaf, set the $timestamps property on your model to false: + +```php +class Flight extends Model +{ + /** + * Indicates if the model should be timestamped. + * + * @var bool + */ + public $timestamps = false; +} +``` + +If you need to customize the format of your timestamps, set the `$dateFormat` property on your model. This property determines how date attributes are stored in the database, as well as their format when the model is serialized to an array or JSON: + +```php +/** +* The storage format of the model's date columns. +* +* @var string +*/ +protected $dateFormat = 'U'; +``` + +If you need to customize the names of the columns used to store the timestamps, you may set the `CREATED_AT` and `UPDATED_AT` constants in your model: + +```php +class Flight extends Model +{ + const CREATED_AT = 'creation_date'; + const UPDATED_AT = 'last_update'; +} +``` + +### Database Connection + +By default, all Leaf models will use the default database connection configured for your application. If you would like to specify a different connection for the model, use the `$connection` property: + +```php +class Flight extends Model +{ + /** + * The connection name for the model. + * + * @var string + */ + protected $connection = 'connection-name'; +} +``` + +## Default Attribute Values + +If you would like to define the default values for some of your model's attributes, you may define an $attributes property on your model: + +```php + false, + ]; +} +``` + +## Retrieving Models + +Once you have created a model and its associated database table, you are ready to start retrieving data from your database. Think of each Leaf model as a powerful query builder allowing you to fluently query the database table associated with the model. For example: + +```php +name; +} +``` + +### Adding Additional Constraints + +The Leaf all method will return all of the results in the model's table. Since each Leaf model serves as a query builder, you may also add constraints to queries, and then use the get method to retrieve the results: + +```php +$flights = Flight::where('active', 1)->orderBy('name', 'desc')->take(10)->get(); +``` + +> **You can check [here](https://laravel.com/docs/10.x/queries) for available queries on your models.** + +### Refreshing Models + +You can refresh models using the `fresh` and `refresh` methods. The `fresh` method will re-retrieve the model from the database. The existing model instance will not be affected: + +```php +$flight = Flight::where('number', 'FR 900')->first(); + +$freshFlight = $flight->fresh(); +``` + +The `refresh` method will re-hydrate the existing model using fresh data from the database. In addition, all of its loaded relationships will be refreshed as well: + +```php +$flight = Flight::where('number', 'FR 900')->first(); + +$flight->number = 'FR 456'; + +$flight->refresh(); + +$flight->number; // "FR 900" +``` + +## Inserting & Updating Models + +### Inserts + +To create a new record in the database, create a new model instance, set attributes on the model, then call the save method: + +```php +name = $this->request->name; + + $flight->save(); + } +} +``` + +In this example, we assign the name parameter from the incoming HTTP request to the name attribute of the `Flight` model instance. When we call the save method, a record will be inserted into the database. The created_at and updated_at timestamps will automatically be set when the save method is called, so there is no need to set them manually. + +### Updates + +The save method may also be used to update models that already exist in the database. To update a model, you should retrieve it, set any attributes you wish to update, and then call the save method. Again, the updated_at timestamp will automatically be updated, so there is no need to manually set its value: + +```php +$flight = Flight::find(1); + +$flight->name = 'New Flight Name'; + +$flight->save(); +``` + +Since Leaf Models use Eloquent, you can read more [here](https://laravel.com/docs/10.x/eloquent) to view available methods on the Eloquent object. + +## Next Steps + +Follow along with the next steps to learn more about Leaf MVC. + + diff --git a/apps/docs/src/docs/mvc/routing.md b/apps/docs/src/docs/mvc/routing.md new file mode 100644 index 0000000..036d61c --- /dev/null +++ b/apps/docs/src/docs/mvc/routing.md @@ -0,0 +1,101 @@ +# Routing + + + +Leaf MVC, Leaf API and Skeleton all rely on Leaf's powerful routing engine. The only difference is that routing the MVC way makes use of controllers instead of callable functions. Everything else works the same way. This document will cover the basics of Leaf MVC routing. + +::: tip Leaf Routing +If you're not familiar with Leaf's routing, you should read the [Leaf Routing](/docs/routing/) document first. +::: + +## The Routes Folder + +Leaf MVC, Leaf API and Skeleton all have a `routes` folder in which all your application's routes are defined. The `routes` folder is located in the `app` directory in Leaf MVC and Leaf API but is located in the root directory in Skeleton. The `routes` folder contains a single file called `index.php` which is where all your application's routes are defined. This file is automatically loaded by Leaf when your application starts. + +## Linking Controllers + +Controllers provide a way to organize your application's logic. They are a great way to keep your routes file clean and easy to read. Controllers are just classes that implement the `App\Controllers\Controller` protocol. You can find more information about controllers in the [Controllers](/docs/mvc/controllers) document. This document will focus on how to link controllers to routes. + +Leaf provides a simple interface for interacting with controllers and their methods from inside your routes. The idea is to run a method inside your controller whenever a route is matched. This is done by telling Leaf which controller to use and which method to run. Leaf will then create an instance of the controller and run the method. + +### Example + +Let's say you have a controller called `App\Controllers\HomeController` and you want to run the `index` method inside it whenever the `/` route is matched. You can do this by passing a string containing your controller name and method to your route. The string should be in the format `controllerName@methodName`. + +
+ +```php +$app->get('/', '\App\Controllers\HomeController@index'); +``` + +
+
+ +```php +app()->get('/', '\App\Controllers\HomeController@index'); +``` + +
+ +## Controller Namespaces + +In case you're using an auto loader or using leaf in another framework and you have your controllers in another directory, you can do sommething like this + +
+ +```php +app()->get('/(\d+)', '\App\Controllers\User@showProfile'); +``` + +
+
+ +```php +$app->get('/(\d+)', '\App\Controllers\User@showProfile'); +``` + +
+ +But this gets tedious if you have a lot of routes. So Leaf allows you to set a "general" namespace, you can set the default namespace to use on your router instance via `setNamespace()` + +
+ +```php +app()->setNamespace('\App\Controllers'); + +app()->get('/users/(\d+)', 'User@showProfile'); +app()->get('/cars/(\d+)', 'Car@showProfile'); +``` + +
+
+ +```php +$app->setNamespace('\App\Controllers'); + +$app->get('/users/(\d+)', 'User@showProfile'); +$app->get('/cars/(\d+)', 'Car@showProfile'); +``` + +
+ +This has already been setup for you in the root routes file of your MVC application. + +## Next Steps + +Follow along with the next steps to learn more about Leaf MVC. + + diff --git a/apps/docs/src/docs/mvc/schema.md b/apps/docs/src/docs/mvc/schema.md new file mode 100644 index 0000000..52e9149 --- /dev/null +++ b/apps/docs/src/docs/mvc/schema.md @@ -0,0 +1,260 @@ +# Schema + + + +Schema is a simple, yet powerful tool for generating database migrations from JSON data. Instead of dealing with the stress of writing your database migrations from scratch and thinking about all the types of your data, you can simply create a JSON file with sample data and let Leaf do the rest. + +## Writing your schema + +Schema can be found in the `app/database/schema` folder. To get started, create a new JSON file in the the schemas directory. You can name it anything you want, but it's best to name it after the table you're creating as that is what Leaf will expect unless you specify otherwise. + +We can start off by creating a `users.json` file. All that this file should contain is an example of what your data should look like. For example: + +```json +{ + "id": 1, + "username?": "username", + "name": "Full Name", + "created_at": "", + "updated_at": "" +} +``` + +## Using your schema + +To use your schema, you can call `Leaf\Schema::build` in your migration. It takes in the name of the schema file to build your migrations with. + +```php{12} +... +use Leaf\Schema; + +class CreateUsers extends Database { + /** + * Run the migrations. + * + * @return void + */ + public function up() + { + Schema::build("users"); + } + + /** + * Reverse the migrations. + * + * @return void + */ + public function down() + { + $this->capsule::schema()->dropIfExists("users"); + } +} +``` + +In the example above, the `users` schema will be used to generate the migration. This means that the `users` table will be created in your database with the fields specified in the schema. To actually run the migration, you can use the `db:migrate` command. + +```bash +php leaf db:migrate +``` + +Read more about [migrations](/docs/mvc/migrations). + +## Data Types + +Leaf Schema is flexible and allows you to specify the type of data you want to store in your database. For the most part, Leaf Schema will automatically detect the type of data you want to store, but you can also specify the type of data you want to store. + +### Automatic Types + +Leaf Schema will automatically detect the type of data you want to store in your database. For example, if you want to store a string in your database, you can simply specify the string in your schema. + +```json +{ + ... + "username": "username" +} +``` + +In the example above, the `username` field will be set to `$table->string` in the migration. This is the same as using `$table->string('username')` in your migration. + +Automatic types are supported for the following types of data: + +- string +- integer +- boolean +- float +- array (will be converted to `enum` in the migration) +- json (should be a stringified json object) + +### Manually Adding Types + +Leaf Schema supports all the types supported by Laravel's Schema Builder. You can specify the type of data you want to store in your database by using the type as the value of the field. + +```json +{ + ... + "username:text": "username" +} +``` + +In the example above, the `username` field will be set to `$table->text` in the migration. This is the same as using `$table->text('username')` in your migration. + + + +## Nullable Fields + +If you want to specify that a field should be nullable, you can use the `?` symbol after the field name. This is the same as using `$table->nullable()` in your migration. + +```json +{ + ... + "username?": "username" +} +``` + +### Nullable + Types + +If you want to specify that a field should be nullable and also specify the type of data you want to store, you can use the `?` symbol after the field name and also specify the type of data you want to store after the `?` symbol, using `:`. + +```json +{ + ... + "username?:string": "username" +} +``` + +## `id` + +The `id` type is used to specify that the field is an auto-incrementing primary key. This is the same as using `$table->bigIncrements('id')` in your migration. Setting a field to `id` will automatically set the field to be an auto-incrementing primary key. + +```json +{ + "id": 1, + ... +} +``` + +If you want to set a field to be an auto-incrementing primary key, but you don't want to set the field to `id`, you can use the `id` type in the key of the field using `:`. + +```json +{ + "user_id : id": 1, + ... +} +``` + +In the example above, the `user_id` field will be set to `$table->bigIncrements` in the migration. This is the same as using `$table->bigIncrements('user_id')` in your migration. Just as with the `id` type, Leaf Schema allows you to specify the name of the field with the type using `:`. + +**The spaces around the `:` are optional, so you can also use `user_id:id`.** + +## `timestamps` + +The `timestamps` type is used to specify that the table should have `created_at` and `updated_at` fields. This is the same as using `$table->timestamps()` in your migration. + +```json +{ + ... + "timestamps": "" +} +``` + +## Foreign Keys + +The `*` type is used to specify that the field should be a foreign key. This is the same as using `$table->foreignId` in your migration. + +```json +{ + ... + "user_id*": 1 +} +``` + +## Soft Deletes + +To specify that a table should have soft deletes, you can use the `softDeletes` key. This is the same as using `$table->softDeletes()` in your migration. + +```json +{ +... +"softDeletes": "" +} +``` + +## Remember Tokens + +To specify that a table should have a remember token, you can use the `rememberToken` key. This is the same as using `$table->rememberToken()` in your migration. + +```json +{ + ... + "rememberToken": "" +} +``` diff --git a/apps/docs/src/docs/mvc/seeds.md b/apps/docs/src/docs/mvc/seeds.md new file mode 100644 index 0000000..d19292e --- /dev/null +++ b/apps/docs/src/docs/mvc/seeds.md @@ -0,0 +1,120 @@ +# DB Seeders + + + +Database seeds are a way to populate a database with initial data. This initial data can be used to set up default values or pre-populate a database with test data. Database seeds typically contain small amounts of data, such as default settings, test data, or sample records. + +Seeds are often used in conjunction with database migrations. After the database schema has been updated or modified, seeds can be used to populate the new or modified tables with initial data. This can be especially useful for testing and development, as it allows developers to work with a pre-populated database without having to manually enter test data. + +## Defining Seeds + +Seeds can be found in the `app/database/seeds` directory. Each class should be defined in its own file and should extend the `Illuminate\Database\Seeder` class. The `run` method should contain the code that populates the database with data. + +Creating this manually is a bit tedious, so you can use the `g:seed` command to generate a new seed class: + +```bash +php leaf g:seed + +# example +php leaf g:seed Users +``` + +The new seed class will be placed in your `app/database/seeds` directory. The class name will be the same as the file name, with the first letter capitalized with Seeder appended to the end if it is not already there. Let's take a look at an example: + +```php +name = 'Mychi'; + $user->email = "mickdd22@gmail.com"; + $user->password = password_hash("password.demo", PASSWORD_DEFAULT); + $user->save(); + } +} +``` + +## Running Seeds + +To run your database seeds, you first need to make sure that your seeds are registered in the `DatabaseSeeder` class. This class is located in the `app/database/seeds` directory. By default, this class contains a `run` method that will execute all of the seed classes that are returned from it. You may add additional seed classes to this property as needed. + +```php +/** + * Seed the application's database. + * + * @return void + */ +public function run() : array +{ + return [ + UsersSeeder::class, + PostSeeder::class, + CommentSeeder::class, + ]; +} +``` + +Once you have added your seed classes to the `DatabaseSeeder` class, you may run the `db:seed` command to execute the seeds: + +```bash +php leaf db:seed +``` + +## Using Factories + +Manually specifying the attributes for each model seed is cumbersome. Instead, you can use factories to conveniently generate large amounts of database records. First, review the [factory documentation](/modules/mvc-core/factories) to learn how to define your factories. + +This example below uses the defined factory to create 30 random users: + +```php +create(30)->save(); + } +} +``` + +## Next Steps + +Follow along with the next steps to learn more about Leaf MVC. + + diff --git a/apps/docs/src/docs/mvc/views.md b/apps/docs/src/docs/mvc/views.md new file mode 100644 index 0000000..a3364a0 --- /dev/null +++ b/apps/docs/src/docs/mvc/views.md @@ -0,0 +1,81 @@ +# Views + + + +Views make up the 'V' in MVC. Views allow you to separate your logic from your presentation layer instead of mixing them together in a single file. This allows you to easily change the look and feel of your application without having to change any of your logic. + +## View Engines + +Leaf comes with support for 3 view engines designed by the team at Leaf: + +| Engine | Use case | +| -------------------------------- | -------------------------------------------- | +| [bareui](/modules/views/bareui/) | Blazing fast templating with no compile time | +| [veins](/modules/views/veins/) | Lightweight but powerful templating engine | +| [blade](/modules/views/blade/) | Laravel blade templating engine for leaf | + +Leaf MVC and Leaf API come with Blade already installed and configured, but of course, you can use any templating engine you prefer. These have first party support, and work amazingly well out of the box. + +***You can find more information on the [Views Docs Page](/modules/views/)*** + +## Defining Views + +Views are defined in the `app/views` directory in Leaf API and Leaf MVC. You can create subdirectories to organize your views based on your preference. For example, you might create a `layouts` directory to store your layout files. To quickly create a view, you can use the `php leaf g:template` command from the root of your project. + +```bash +php leaf g:template home +``` + +This will create a file called `home.blade.php` in the `app/views` directory. + +## Rendering Views + +Leaf ships a `view` method as an extension of functional mode. This method allows you to render a view/template found in the views directory. This method accepts two parameters: + +- The name of the view to render +- Data to pass to the view + +```php +echo view('home', ['name' => 'John Doe']); +``` + +Notice that we pass the name of the view without the file extension. This is because Leaf will automatically append the correct file extension based on the view engine you're using. + +### The `render()` method + +To make things even easier for you, Leaf also ships with a `render()` method. This method accepts the same parameters as the `view()` method but automatically outputs the views with the correct headers in place. + +```php +render('home', ['name' => 'John Doe']); +``` + +## Asset Bundling + +[Vite](https://vitejs.dev/) is a modern build tool for frontend applications. It aims to provide a faster and leaner development experience for modern web projects. Leaf allows you to bundle your CSS and JS assets using vite, using the powerful [leaf-vite](/modules/views/vite/) module. + +[> Read the docs](/modules/views/vite/) + +## Frontend Frameworks + +Leaf has support for some of the most popular frontend frameworks using [Inertia.js](https://inertiajs.com/). Inertia.js is a framework that allows you to create fully client-side rendered, single-page apps, without much of the complexity that comes with modern SPAs. It does this by leveraging Leaf's server-side rendering capabilities. + +[> Read the docs](/modules/views/inertia/) + +## Next Steps + +You can continue learning about MVC with Leaf from the sidebar or check out the view engines below: + + diff --git a/apps/docs/src/docs/routing/controller.md b/apps/docs/src/docs/routing/controller.md new file mode 100755 index 0000000..8c9bc71 --- /dev/null +++ b/apps/docs/src/docs/routing/controller.md @@ -0,0 +1,172 @@ +# Using Controllers + + +Controllers are simply classes that serve as bridges between Models and the View part of your application. Don't think too much of controllers, they're nothing but a class. + +In this section, we'll be looking at how to handle a route with a controller. So let's make an example controller: **remember it's just a php class** + +```php + + +```php +require "HomeController.php"; + +// we leave out the second parameter for now +app()->get("/home"); +``` + + +
+ +```php +$app = new Leaf\App; + +require "HomeController.php"; + +// we leave out the second parameter for now +$app->get("/home"); +``` + +
+ +When using controllers, instead of defining a closure or function as the second parameter of your route, you rather pass in a string of the controller's class name and the function you want to use. In this case, `"HomeController@index"`, so remember, it's `Class@Method` + +
+ +```php +require "HomeController.php"; + +app()->get("/home", "HomeController@index"); +``` + +
+
+ +```php +$app = new Leaf\App; + +require "HomeController.php"; + +$app->get("/home", "HomeController@index"); +``` + +
+ +## Controller Namespaces + +In case you're using an auto loader or using leaf in another framework and you have your controllers in another directory, you can do sommething like this + +
+ +```php +app()->get('/(\d+)', '\App\Controllers\User@showProfile'); +``` + +
+
+ +```php +$app->get('/(\d+)', '\App\Controllers\User@showProfile'); +``` + +
+ +But this gets tedious if you have a lot of routes. So Leaf allows you to set a "general" namespace, you can set the default namespace to use on your router instance via `setNamespace()` + +
+ +```php +app()->setNamespace('\App\Controllers'); + +app()->get('/users/(\d+)', 'User@showProfile'); +app()->get('/cars/(\d+)', 'Car@showProfile'); +``` + +
+
+ +```php +$app->setNamespace('\App\Controllers'); + +$app->get('/users/(\d+)', 'User@showProfile'); +$app->get('/cars/(\d+)', 'Car@showProfile'); +``` + +
+ +## Resource Controller + +Resource Controllers contain methods to handle CRUD functionality. + +```php +request = new Request; + } + + /** + * Display a listing of the resource. + */ + public function index() { + // + } + + /** + * Show the form for creating a new resource. + */ + public function create() { + // + } + + /** + * Store a newly created resource in storage. + */ + public function store() { + // + } + + /** + * Display the specified resource. + */ + public function show($id) { + // + } + + /** + * Show the form for editing the specified resource. + */ + public function edit($id) { + // + } + + /** + * Update the specified resource in storage. + */ + public function update($id) { + // + } + + /** + * Remove the specified resource from storage. + */ + public function destroy($id) { + // + } +} +``` diff --git a/apps/docs/src/docs/routing/dynamic.md b/apps/docs/src/docs/routing/dynamic.md new file mode 100755 index 0000000..0b76dc9 --- /dev/null +++ b/apps/docs/src/docs/routing/dynamic.md @@ -0,0 +1,147 @@ +# Dynamic Routing + + + + + + +*This guide assumes you have read [Simple Routing](/docs/routing/)* + +Dynamic routing is the idea of creating routes that can be accessed dynamically. For example, you can create a route that accepts a user id and displays the user with that id. This is useful when you want to create routes that can be accessed using dynamic information like ids, usernames, etc. + +Leaf router provides two ways to create dynamic routes: + +- [Dynamic Placeholder-based Route Patterns](#named-params) +- [PCRE-based Route Patterns](#pcre-based-params) + +## Named Params + +Dynamic Placeholder-based Route Patterns are the same as Dynamic PCRE-based Route Patterns, but with one difference: they use human readable placeholders instead of regular expressions. Placeholders are strings surrounded by curly braces, e.g. {name}. You don't need to add parens around placeholders. + +Examples + +- `/movies/{id}` +- `/profile/{username}` + +These placeholders are easier to use than PRCEs, but offer you less control as they internally get translated to a PRCE that matches any character (.*). + +
+ +```php +app()->get('/movies/{movieId}/photos/{photoId}', function ($movieId, $photoId) { + echo 'Movie #' . $movieId . ', photo #' . $photoId; +}); +``` + +
+
+ +```php +$app->get('/movies/{movieId}/photos/{photoId}', function ($movieId, $photoId) { + echo 'Movie #' . $movieId . ', photo #' . $photoId; +}); +``` + +
+ +**Note:** the name of the placeholder does not need to match with the name of the parameter that is passed into the route handling function...although it's adviced: + +
+ +```php +app()->get('/movies/{foo}/photos/{bar}', function ($movieId, $photoId) { + echo 'Movie #' . $movieId . ', photo #' . $photoId; +}); +``` + +
+
+ +```php +$app->get('/movies/{foo}/photos/{bar}', function ($movieId, $photoId) { + echo 'Movie #' . $movieId . ', photo #' . $photoId; +}); +``` + +
+ +## PCRE Based Params + +Basically, PCRE based patterns are just another way to use routes dynamically. This type of Route Patterns contain dynamic parts which can vary per request. The varying parts are named subpatterns and are defined using regular expressions. + +Examples + +- /movies/(\d+) +- /profile/(\w+) + +Commonly used PCRE-based subpatterns within Dynamic Route Patterns are: + +- \d+ = One or more digits (0-9) +- \w+ = One or more word characters (a-z 0-9 _) +- [a-z0-9_-]+ = One or more word characters (a-z 0-9 _) and the dash (-) +- .* = Any character (including /), zero or more +- [^/]+ = Any character but /, one or more + +Note: The PHP PCRE Cheat Sheet might come in handy. + +The subpatterns defined in Dynamic PCRE-based Route Patterns are converted to parameters which are passed into the route handling function. Prerequisite is that these subpatterns need to be defined as parenthesized subpatterns, which means that they should be wrapped between parens: + +
+ +```php +// Bad +app()->get('/hello/\w+', function ($name) { + echo 'Hello ' . htmlentities($name); +}); + +// Good +app()->get('/hello/(\w+)', function ($name) { + echo 'Hello ' . htmlentities($name); +}); +``` + +
+
+ +```php +// Bad +$app->get('/hello/\w+', function ($name) { + echo 'Hello ' . htmlentities($name); +}); + +// Good +$app->get('/hello/(\w+)', function ($name) { + echo 'Hello ' . htmlentities($name); +}); +``` + +
+ +**Note**: The leading `/` at the very beginning of a route pattern is not mandatory, but is recommended. + +When multiple subpatterns are defined, the resulting route handling parameters are passed into the route handling function in the order they are defined in: + +
+ +```php +app()->get('/movies/(\d+)/photos/(\d+)', function ($movieId, $photoId) { + echo 'Movie #' . $movieId . ', photo #' . $photoId; +}); +``` + +
+
+ +```php +$app->get('/movies/(\d+)/photos/(\d+)', function ($movieId, $photoId) { + echo 'Movie #' . $movieId . ', photo #' . $photoId; +}); +``` + +
diff --git a/apps/docs/src/docs/routing/errors.md b/apps/docs/src/docs/routing/errors.md new file mode 100755 index 0000000..606719d --- /dev/null +++ b/apps/docs/src/docs/routing/errors.md @@ -0,0 +1,146 @@ +# Error Handling + + + + + + + +By default Leaf has error screens which are displayed for application exceptions, 404s and production server errors, however, Leaf also gives you full control and allows you to customize what is shown when an error or exception is encountered. + +## Handling 404 + +Leaf displays a 404 screen for users, however, it may not always be appropriate, especially when you're building an API. You will probably want to return JSON instead of markup. For cases like this, Leaf has prepared a `set404` method on the Leaf instance. + +This method allows you to customize what a user sees when they visit a route that doesn't exist in your application. It takes in one parameter, a callable in the form of a function or an array. + +The example below displays a custom 404 page. + +
+ +```php +app()->set404(function () { + response()->page('./pages/404.html'); +}); +``` + +
+
+ +```php +$app->set404(function () use($app) { + $app->response()->page('./pages/404.html'); +}); +``` + +
+ +## Handling 500 + +Server errors are a bit more complicated because there are 2 states displayed to the user. The first is a general error state used in development. That screen gives you details on errors that occur during development. If you've ever run into an error during development, you've probably come across a nice looking page that gives you information about your error, line numbers and all that. + +The second screen is shown when debugging is turned off. This screen is intended to not give any details on the error, but rather log out issues in the background. To get a preview of this screen locally, you can configure Leaf's `debug` to `false`. + +
+ +```php +app()->config('debug', false); +``` + +
+
+ +```php +$app = new \Leaf\App('debug', false); +``` + +
+ +You'll have an error page which doesn't give details on the error, however, if logs are enabled, all the errors are saved to a log file in the background. + +### Setting your own error screen + +Although Leaf handles both debug and production cases, you may want to display your own error/exception screens instead of going with the Leaf defaults. For cases like this, you should use the `setErrorHandler` method on the Leaf instance. + +This method takes in a callable in the form of a function or an array. You can take a look at the exaples below: + +
+ +```php +// use an error handler from a package +$app->setErrorHandler(['\Leaf\Exception\General', 'defaultError']); + +// use a custom function +$app->setErrorHandler(function () use($app) { + $app->response()->page('./pages/500.html'); +}); +``` + +
+
+ +```php +// use an error handler from a package +app()->setErrorHandler(['\Leaf\Exception\General', 'defaultError']); + +// use a custom function +app()->setErrorHandler(function () { + response()->page('./pages/500.html'); +}); +``` + +
+ +## Application Down + +Leaf is also able to dynamically handle placing your application in maintenance mode using leaf config. We have a `down` config which you can set to `true` to place your application in maintenance mode. + +
+ +```php +app()->config('app.down', true); +``` + +
+
+ +```php +$app->config('app.down', true); +``` + +
+ +Alternatively, you could also place your application in maintenance mode by setting the `APP_DOWN` environment variable to true. Since `.env` variables are given more priority than router config, the router config will be ignored as long as the env is set. If you decide to use the env variable, you will have to manually load your `.env` file. Check out the [env docs](/docs/config/nsm) for more info. + +::: tip Loading your env +Your environment variables are automatically loaded into your application if you are using Leaf MVC, Leaf API or Skeleton. +::: + +### Custom Down Handler + +Leaf comes with a beautiful application down handler which you can use in production. However, it might not match your theme, or you might have a maintenance screen designed by someone which needs to match that design. Leaf gives you the flexibility to display a custom maintenance error page using the `setDown` method. + +
+ +```php +app()->setDown(function () { + echo "Down for maintenance"; +}); +``` + +
+
+ +```php +$app->setDown(function () { + echo "Down for maintenance"; +}); +``` + +
diff --git a/apps/docs/src/docs/routing/index.md b/apps/docs/src/docs/routing/index.md new file mode 100755 index 0000000..51aaeba --- /dev/null +++ b/apps/docs/src/docs/routing/index.md @@ -0,0 +1,733 @@ + +# Basic Routing + + + +::: tip +Leaf router is now separated from Leaf and is now available as an installable module via composer or the leaf cli. + +
+Using Leaf router outside leaf + +To use Leaf router outside of a leaf app, simply install the leaf router module: + +```bash +composer require leafs/router +``` + +or + +```bash +leaf install router +``` + +After this, you can use all of leaf router's functionality with the router class below. + +## Router class + +The router class is the interface you interact with to perform any routing actions in your app. Leaf core directly integrates with the router class, which means that there is no need to use this class directly, if however, you are using leaf router outside of leaf, you will need to use the router class itself. + +```php +use Leaf\Router; + +Router::get('/', 'PagesController@index'); + +Router::run(); +``` + +
+::: + +Leaf router uses a single root file, to which all the server requests are redirected, it then takes these requests and matches them to rules you have defined. The results are then displayed to the user. Then entire routing process is actually based on this simple concept. + +To make things simpler, we tied leaf router directly to the leaf instance, so once you initialize leaf, you can use routing. + +
+ +```php +get('/', function () { + response()->json(['name' => 'Leaf']); +}); + +app()->run(); +``` + +
+
+ +```php +get('/', function () use($app) { + $app->response()->json(['name' => 'Leaf']); +}); + +$app->run(); +``` + +
+ + + +## Using a different router in Leaf + +Although Leaf integrates leaf router directly, you are free to import and use any router you want. + +1. Install whatever you want + +```bash +composer require imaginary/router +``` + +2. Import and use it in your project + +
+ +```php +// initialise imaginary router +$imr = new Imaginary\Router(); + +$imr->get('/', function () { + // you can still use leaf modules + response()->json(['title' => 'hello']); +}); +``` + +
+
+ +```php +// initialise imaginary router +$imr = new Imaginary\Router(); +$response = new Leaf\Http\Response(); + +$imr->get('/', function () use($response) { + // you can still use leaf modules + $response->json(['title' => 'hello']); +}); +``` + +
+ +## Creating Routes + +::: warning IMPORTANT +From this point onwards, we will assume that you are using Leaf router inside a leaf app, as such, we will use the app syntax: + +
+ +```php +app()->get('/', function () {...}); +``` + +
+
+ +```php +$app->get('/', function () {...}); +``` + +
+ +If however, you are using leaf router outside leaf, simply change `app()`/`$app` to the router class: + +```php +Router::get('/', function () {...}); +``` + +::: + +You can define application routes using proxy methods on the Leaf\App instance. Leaf supports different types of requests, let's look at them. + +### GET + +You can add a route that handles only GET HTTP requests with the Leaf router's get() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +
+ +```php +app()->get('/home', function () { + // your code +}); +``` + +
+
+ +```php +$app->get('/home', function () { + // your code +}); +``` + +
+ +### POST + +You can add a route that handles only POST HTTP requests with the Leaf router's post() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +
+ +```php +app()->post('/users/add', function () { + $user = request()->get('user'); + // create a new user +}); +``` + +
+
+ +```php +$app->post('/users/add', function () use($request) { + $user = $request->get('user'); + // create a new user +}); +``` + +
+ +Using Post Params +View [Request](/modules/http/v/2/request) for more info on handling params + +### PUT requests + +You can add a route that handles only PUT HTTP requests with the Leaf router’s put() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +
+ +```php +app()->put('/book/edit/{id}', function ($id) { + // your code +}); +``` + +
+
+ +```php +$app->put('/book/edit/{id}', function ($id) { + // your code +}); +``` + +
+ +### DELETE requests + +You can add a route that handles only DELETE HTTP requests with the Leaf router's delete() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +
+ +```php +app()->delete('/quotes/{id}', function ($id) { + // delete quote +}); +``` + +
+
+ +```php +$app->delete('/quotes/{id}', function ($id) { + // delete quote +}); +``` + +
+ +### OPTIONS requests + +You can add a route that handles only OPTIONS HTTP requests with the Leaf router's options() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +
+ +```php +app()->options('/quotes/{id}', function ($id) { + // return headers +}); +``` + +
+
+ +```php +$app->options('/quotes/{id}', function ($id) { + // return headers +}); +``` + +
+ +### PATCH requests + +You can add a route that handles only PATCH HTTP requests with the Leaf router's patch() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +
+ +```php +app()->patch('/post/{id}', function ($id) { + // your code +}); +``` + +
+
+ +```php +$app->patch('/post/{id}', function ($id) { + // your code +}); +``` + +
+ +### ALL requests + +You can add a route that handles all HTTP requests with the Leaf router's all() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +
+ +```php +app()->all('/post/{id}', function ($id) { + // your code +}); +``` + +
+
+ +```php +$app->all('/post/{id}', function ($id) { + // your code +}); +``` + +
+ +### Resource Routes + +This section assumes you've read [working with controllers](/docs/routing/controller). In an MVC application, controllers play a major role as they're the bridge between your view and your model. + +A resource route simply creates all the routes needed to successfully handle a particular feature. This sounds a bit bleak, let's look at an example. + +
+ +```php +app()->resource('/posts', 'PostsController'); + +app()->run(); +``` + +
+
+ +```php +$app->resource('/posts', 'PostsController'); + +$app->run(); +``` + +
+ +The code above is equivalent to this: + +
+ +```php +app()->match('GET|HEAD', '/posts', "$controller@index"); +app()->post('/posts', "$controller@store"); +app()->match('GET|HEAD', '/posts/create', "$controller@create"); +app()->match('POST|DELETE', '/posts/{id}/delete', "$controller@destroy"); +app()->match('POST|PUT|PATCH', '/posts/{id}/edit', "$controller@update"); +app()->match('GET|HEAD', '/posts/{id}/edit', "$controller@edit"); +app()->match('GET|HEAD', '/posts/{id}', "$controller@show"); + +app()->run(); +``` + +
+
+ +```php +$app->match('GET|HEAD', '/posts', "$controller@index"); +$app->post('/posts', "$controller@store"); +$app->match('GET|HEAD', '/posts/create', "$controller@create"); +$app->match('POST|DELETE', '/posts/{id}/delete', "$controller@destroy"); +$app->match('POST|PUT|PATCH', '/posts/{id}/edit', "$controller@update"); +$app->match('GET|HEAD', '/posts/{id}/edit', "$controller@edit"); +$app->match('GET|HEAD', '/posts/{id}', "$controller@show"); + +$app->run(); +``` + +
+ +Resource routes are handled by a [resource controller](/docs/routing/controller?id=resource-controller). + +## Route "Hooking" + +You can add a route that handles a couple of HTTP methods with the Leaf router's match() method. It accepts three arguments: + +- The HTTP method(s) seperated by `|` +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +
+ +```php +app()->match('GET|POST', '/people', function () { + // your code +}); +``` + +
+
+ +```php +$app->match('GET|POST', '/people', function () { + // your code +}); +``` + +
+ +## Running your routes + +After setting all the routes, you'll need to dispatch the routes. This is achieved through Leaf's run() method. + +
+ +```php +app()->run(); +``` + +
+
+ +```php +$app->run(); +``` + +
+ +## Route options + +Route options simply allow you to configure the way groups and individual routes by passing in additional parameters. In actual sense, all new features were generated as a result of this single feature. Let's see how it works. + +Leaf route handlers are usually callable functions like this: + +
+ +```php +app()->get("/home", function () { + echo 'User Home'; +}); +``` + +
+
+ +```php +$app->get("/home", function () { + echo 'User Home'; +}); +``` + +
+ +Or sometimes controllers, like this: + +
+ +```php +app()->get('/home', 'HomeController@index'); +``` + +
+
+ +```php +$app->get('/home', 'HomeController@index'); +``` + +
+ +This means there was no space to chain additional items to the route, this is solved by route options. + +
+ +```php +app()->get('/home', ['name' => 'home', function () { + echo 'User Home'; +}]); +``` + +
+
+ +```php +$app->get('/home', ['name' => 'home', function () { + echo 'User Home'; +}]); +``` + +
+ +When an array is passed into a leaf route as the handler, leaf will take all `key => value` as options for that route, the first non key-value `function` or `controller` in the array is taken as the handler. + +
+ +```php +app()->get('/form', ['name' => 'userForm', 'FormsController@index']); +``` + +
+
+ +```php +$app->get('/form', ['name' => 'userForm', 'FormsController@index']); +``` + +
+ +As mentioned before, this feature is also available on groups: + +
+ +```php +app()->group('/user', ['namespace' => '\\', function () { + // ... +}]); +``` + +
+
+ +```php +$app->group('/user', ['namespace' => '\\', function () { + // ... +}]); +``` + +
+ +**This doesn't mean that you should always pass in an array, if you don't need the other options, you can pass in your function or controller directly as you've always done.** + +## Naming your routes + +You can give names to your routes which allows you to use your route names for navigation instead of your route paths. This feature is heavily inspired by vue-router. + +
+ +```php +app()->get('/home', ['name' => 'home', function () { + echo 'User Home'; +}]); +``` + +
+
+ +```php +$app->get('/home', ['name' => 'home', function () { + echo 'User Home'; +}]); +``` + +
+ +### Getting a route by its name + +You can also get the route path by its name. + +
+ +```php +app()->route('home'); // Would return: /home +``` + +
+
+ +```php +$app->route('home'); // Would return: /home +``` + +
+ +Also, if you have routes with named parameters, you can do as follows: + +Route 1: + +
+ +```php +app()->get('/movies/{movieId}', ['name' => 'movies', function () { + echo 'User Movies'; +}]); + +app()->route('movies', 'my-movie') // Would return: /movies/my-movie +``` + +
+
+ +```php +$app->get('/movies/{movieId}', ['name' => 'movies', function () { + echo 'User Movies'; +}]); + +$app->route('movies', 'my-movie') // Would return: /movies/my-movie +``` + +
+ +Route 2: + +
+ +```php +app()->get('/movies/{movieId}/photos/{photoId}', ['name' => 'moviesAndPhotos', function () { + echo 'User Movies and Photos'; +}]); + +app()->route('moviesAndPhotos', ['movieId' => 'my-movie', 'photoId' => 'my-photo']); + +// Would return: /movies/my-movie/photos/my-photo +``` + +
+
+ +```php +$app->get('/movies/{movieId}/photos/{photoId}', ['name' => 'moviesAndPhotos', function () { + echo 'User Movies and Photos'; +}]); + +$app->route('moviesAndPhotos', ['movieId' => 'my-movie', 'photoId' => 'my-photo']); + +// Would return: /movies/my-movie/photos/my-photo +``` + +
+ +### Pushing to a route + +This is simply redirecting to a route and can be done using `push`. `push` also allows you to reference the route by it's name instead of it's path. + +
+ +```php +app()->push('/home'); +``` + +
+
+ +```php +$app->push('/home'); +``` + +
+ +When an array is passed into push, Leaf will search for a route name matching the string in the array and redirect to that route: + +
+ +```php +// home was defined above +app()->push(['home']); +``` + +
+
+ +```php +// home was defined above +$app->push(['home']); +``` + +
+ +## Getting the current route + +There are times when you need to get information about the current route from within one of your route handlers, views or controllers. For example, you may wish to generate a URL for the current route or redirect to the current route. You may also need to access the route's parameters. You may do all of this using the `Router::getRoute()` method: + +
+ +```php +app()->get('/home', ['name' => 'home', function () { + $route = app()->getRoute(); + echo $route['name']; +}]); +``` + +
+
+ +```php +$app->get('/home', ['name' => 'home', function () use ($app) { + $route = $app->getRoute(); + echo $route['name']; +}]); +``` + +
+ +The output of `getRoute()` looks something like this: + +```json +{ + "pattern": "/users/(.*?)", + "path": "/users/1", + "method": "GET", + "name": "mycontroller", + "handler": "MyNamespace\\Controller@index", + "params": [ + "1" + ] +} +``` + +- `pattern` is the route pattern +- `path` is the current route path +- `method` is the current route method +- `name` is the current route name +- `handler` is the current route handler (custom function or controller) +- `params` is an array of the current route's parameters (dynamic values) diff --git a/apps/docs/src/docs/routing/middleware.md b/apps/docs/src/docs/routing/middleware.md new file mode 100755 index 0000000..463c6d8 --- /dev/null +++ b/apps/docs/src/docs/routing/middleware.md @@ -0,0 +1,492 @@ + +# Middleware + + + + + +## What is middleware? + +In simple terms, middleware is a piece of code that runs before your application runs. It can be used to perform various tasks like authentication, error handling, logging, etc. It can also help to optimize the performance of an application by caching data, compressing responses, or distributing load across multiple servers, although those are more advanced use-cases. It's a great way to keep your code clean and organized. + +::: tip Note +Leaf has modules that can be used to perform some of the tasks middleware can do. For example, Leaf has [Leaf Auth](/modules/auth/v/2.1/) which can be used to handle authentication, a [logger module](/docs/tooling/logging) and many more useful [modules](/modules/). This means you don't need to use middleware to perform these tasks. However, middleware can be used to perform tasks that Leaf modules don't cover. +::: + +## How does middleware work? + +Middleware is a concept that is used in many frameworks, and they have different ways of implementing it. Leaf's implementation is based on the concept of middleware stacks. A middleware stack is a list of middleware that are executed in a specific order. The order is important because each middleware can perform a task and pass the request to the next middleware in the stack. This is how middleware works in Leaf. + +When a request is made to your application, Leaf will run through the middleware stack and execute each middleware. After the middleware stack is done, Leaf will then execute the route handling function. This is a rough overview of how middleware works in Leaf, however, for a more in-depth explanation, you can check out the video by [Codecourse](https://www.codecourse.com). + + + +## Middleware in Leaf + +Leaf provides 2 interfaces for middleware: application middleware and router hooks. + +- Router hooks basically hook into the runtime of the Leaf router and allow you to run code before a route/multiple routes are invoked. +- Application middleware on the other hand is a more structured way to define and use middleware in your apps. It allows you to define middleware classes as done in other frameworks like Laravel. This fits right in if you intend to build MVC applications. + +## Application middleware + +As mentioned above, application middleware gives you a more structured way to define and use middleware in your apps. It allows you to define middleware as classes instead of using functions. + +### Defining application middleware + +Leaf provides a `Middleware` class that you can extend to define your application middleware. The `Middleware` class has a `call` method that you can override to define your middleware logic. In the `call` method, you can perform any task you want and then call `$this->next()` to pass the request to the next middleware in the stack or even return a response if you want to break the execution of your application. The example below checks if a request key is set, if it's not, the user is redirected to another route. + +```php +class TestMiddleware extends Leaf\Middleware +{ + public function call() + { + if (!request()->get('key')) { + return Custom::redirect('/login'); + } + + return $this->next(); + } +} +``` + +One thing to note is you should always call `$this->next()`. The `$this->next()` method forwards the incoming request to the next middleware or your application if there's no other middleware. + +### Using your application middleware + +After defining the middleware, the next step is to tell Leaf to actually run your middleware. You can do this by calling the `use` method on the Leaf instance. + +
+ +```php +$app = new Leaf\App(); + +$app->use(new TestMiddleware); + +// ... your routes here +``` + +
+
+ +```php +app()->use(new TestMiddleware); + +// ... your routes here +``` + +
+ +## Before Route Middlewares + +This is a type of router hook that runs before a particular route is invoked. It is technically just a callable/function that holds whatever code you want to execute before the route is executed. To actually create and register the before route middleware, you need to pass the function into the `before` method of the Leaf instance. + +The `before` method takes 3 arguments: + +- The HTTP method: This can be a single method or a pipe-separated list of methods. +- The route pattern +- The middleware function + +This example below shows how to create a before route middleware that checks if a user is logged in before allowing access to the admin dashboard. Note that we're using `/admin/.*` as the route pattern. This means that the middleware will be executed for all routes that start with `/admin/`. + +
+ +```php +$app->before('GET|POST', '/admin/.*', function () { + if (!isset($_SESSION['user'])) { + header('location: /auth/login'); + exit(); + } +}); +``` + +
+
+ +```php +app()->before('GET|POST', '/admin/.*', function () { + if (!isset($_SESSION['user'])) { + header('location: /auth/login'); + exit(); + } +}); +``` + +
+ +### Matching multiple middleware + +Unlike route handling functions, more than one before route middleware is executed when more than one route match is found. + +
+ +```php +$app->before('GET|POST', '/admin/.*', function () { + if (!isset($_SESSION['user'])) { + header('location: /auth/login'); + exit(); + } +}); + +$app->before('GET|POST', '/admin/.*', function () { + if (!isset($_SESSION['user_secret'])) { + header('location: /auth/login'); + exit(); + } +}); +``` + +
+
+ +```php +app()->before('GET|POST', '/admin/.*', function () { + if (!isset($_SESSION['user'])) { + header('location: /auth/login'); + exit(); + } +}); + +app()->before('GET|POST', '/admin/.*', function () { + if (!isset($_SESSION['user_secret'])) { + header('location: /auth/login'); + exit(); + } +}); +``` + +
+ +Using this same concept, you can run your middleware on every route. We call this before router middleware. + +## Before Router Middlewares + +Before route middlewares are route specific. Using a general route pattern (viz. all URLs), they can become Before Router Middlewares (in other projects sometimes referred to as before app middlewares) which are always executed, no matter what the requested URL is. + +
+ +```php +$app->before('GET', '/.*', function () { + // ... this will always be executed +}); +``` + +
+
+ +```php +app()->before('GET', '/.*', function () { + // ... this will always be executed +}); +``` + +
+ +As you can see, the only difference between before route and before router middleware is the route pattern. + +## Middleware route option + +This is a new way to quickly setup middleware for a particular route. Leaf has the before method which allows you to set a route specific middleware, but that means defining the same route twice, not to mention, you may mistake the middleware for the main route as they have the same syntax. This problem is solved by the middleware option. **If your prefer using `before`, you can always do so.** + +Let's take this function which we're using as our middleware: + +```php +$midfn = function () { + echo 'Home middleware'; +}; +``` + +We can use this middleware directly on our route like this: + +
+ +```php +$app->get('/home', ['middleware' => $midfn, function () { + echo 'User Home'; +}]); +``` + +
+
+ +```php +app()->get('/home', ['middleware' => $midfn, function () { + echo 'User Home'; +}]); +``` + +
+ +## Named Middleware Route Options New + +You can name your middleware and use it on multiple routes. This is useful when you have a lot of routes that use the same middleware. You can name your middleware like this: + +
+ +```php +$app->registerMiddleware('home', function () { + echo 'Home middleware'; +}); + +$app->get('/home', ['middleware' => 'home', function () { ... }]); +$app->get('/home/about', ['middleware' => 'home', function () { ... }]); +``` + +
+ +
+ +```php +app()->registerMiddleware('home', function () { + echo 'Home middleware'; +}); + +app()->get('/home', ['middleware' => 'home', function () { ... }]); +app()->get('/home/about', ['middleware' => 'home', function () { ... }]); +``` + +
+ +Named middleware can also be used with route groups: + +
+ +```php +$app->registerMiddleware('home', function () { + echo 'Home middleware'; +}); + +$app->group('/group', ['middleware' => 'home', function () use ($app) { + $app->get('/home', function () { ... }); + $app->get('/home/about', function () { ... }); +}]); +``` + +
+ +
+ +```php +app()->registerMiddleware('home', function () { + echo 'Home middleware'; +}); + +app()->group('/group', ['middleware' => 'home', function () { + app()->get('/home', function () { ... }); + app()->get('/home/about', function () { ... }); +}]); +``` + +
+ +## Router Hooks + +Hooks basically allow you to hook into Leaf router and execute a callback at a given time. For instance, you can execute a function just before Leaf fires off routes. You can also execute a callback before the main middleware executes or even after Leaf has completely executed a route. + +There are 6 hooks that you can now use with Leaf router listed below in execution order: + +**It doesn't matter the order in which you define hooks. Leaf router will run them in the correct order.** + +### `router.before` + +This hook runs before Leaf router begins any operations, even before app middleware are triggered. + +
+ +```php +$app->hook('router.before', function () { + // do something +}); +``` + +
+
+ +```php +app()->hook('router.before', function () { + // do something +}); +``` + +
+ +### `router.before.route` + +This hook runs just after the app middleware have run, just before the route specific middleware. + +
+ +```php +$app->hook('router.before.route', function () { + // do something +}); +``` + +
+
+ +```php +app()->hook('router.before.route', function () { + // do something +}); +``` + +
+ +### `router.before.dispatch` + +This hook runs just before routes are dispatched. + +
+ +```php +$app->hook('router.before.dispatch', function () { + // do something +}); +``` + +
+
+ +```php +app()->hook('router.before.dispatch', function () { + // do something +}); +``` + +
+ +### `router.after.dispatch` + +This hook runs just after routes are dispatched. + +
+ +```php +$app->hook('router.after.dispatch', function () { + // do something +}); +``` + +
+
+ +```php +app()->hook('router.after.dispatch', function () { + // do something +}); +``` + +
+ +### `router.after.route` + +This hook runs after Leaf router has finished up with routing and cleaning up, just before the execution of internal code. + +
+ +```php +$app->hook('router.after.route', function () { + // do something +}); +``` + +
+
+ +```php +app()->hook('router.after.route', function () { + // do something +}); +``` + +
+ +### `router.after` + +This hook runs when leaf completely finishes route execution and cleans up on the internal code as well. This is the last thing Leaf router does before exiting. + +
+ +```php +$app->hook('router.after', function () { + // do something +}); +``` + +
+
+ +```php +app()->hook('router.after', function () { + // do something +}); +``` + +
+ +::: tip Note +Unlike the above hooks, `router.after` can be directly assigned by passing a function into Leaf router's `run` method. + +
+ +```php +$app = new Leaf\App; + +// define routes + +$app->run(function () { + echo "Final thing to run"; +}); +``` + +
+
+ +```php +// define routes + +app()->run(function () { + echo "Final thing to run"; +}); +``` + +
+ +Also note that the final function may return a value for further use if need be. + +
+ +```php +$time = $app->run(function () { + return Leaf\Date::now(); +}); + +saveToLogs("app finished executing", $time); +``` + +
+
+ +```php +$time = app()->run(function () { + return Leaf\Date::now(); +}); + +saveToLogs("app finished executing", $time); +``` + +
+ +::: diff --git a/apps/docs/src/docs/routing/mvc.md b/apps/docs/src/docs/routing/mvc.md new file mode 100644 index 0000000..d90e327 --- /dev/null +++ b/apps/docs/src/docs/routing/mvc.md @@ -0,0 +1,103 @@ +# Usage with Leaf MVC + +Leaf MVC and Leaf API use a routing system based on the [Leaf Core](/docs/routing/) router. This means you can use all of Leaf Core's routing methods on your Leaf MVC and Leaf API apps. You can find the full docs [here](/docs/routing/). + +## Adding Routes + +Leaf MVC and Leaf API come with an `app/routes` folder. This folder contains all your route files. The `app/routes/index.php` file is the entry point for all your routes and is where you can add all your routes. + +## Route Partials + +New versions of Leaf MVC and Leaf API come with a new feature called route partials. Route partials allow you to split your routes into multiple files. This is useful if you have a lot of routes and you want to split them into multiple files. To use route partials, you can create a new file in your `app/routes` folder and add your routes to it. + +All files in your `app/routes` folder that start with `_` are automatically loaded by Leaf MVC and Leaf API. This means that you can create a file called `app/routes/_auth.php` and add all your auth routes to it. This file will be automatically loaded by Leaf MVC and Leaf API, and all the routes in it will be available in your app. + +If you don't want a file to be automatically loaded, create a file that doesn't start with `_`. For example, you can create a file called `app/routes/auth.php` and add all your auth routes to it. This file will **NOT** be automatically loaded by Leaf MVC and Leaf API, and you'll have to load it manually. + +## Linking Controllers + +Controllers provide a way to organize your application's logic. They are a great way to keep your routes file clean and easy to read. Controllers are just classes that implement the `App\Controllers\Controller` class. You can find more information about controllers in the [Controllers](/docs/mvc/controllers) document. This document will focus on how to link controllers to routes. + +Leaf provides a simple interface for interacting with controllers and their methods from inside your routes. The idea is to run a method inside your controller whenever a route is matched. This is done by telling Leaf which controller to use and which method to run. Leaf will then create an instance of the controller and run the method. + +### Example + +Let's say you have a controller called `App\Controllers\HomeController` and you want to run the `index` method inside it whenever the `/` route is matched. You can do this by passing a string containing your controller name and method to your route. The string should be in the format `controllerName@methodName`. + +
+ +```php +$app->get('/', '\App\Controllers\HomeController@index'); +``` + +
+
+ +```php +app()->get('/', '\App\Controllers\HomeController@index'); +``` + +
+ +## Controller Namespaces + +***This has already been setup for you in the root routes file of your MVC application.*** + +In case you're using an auto loader or using leaf in another framework and you have your controllers in another directory, you can do sommething like this + +
+ +```php +app()->get('/(\d+)', '\App\Controllers\User@showProfile'); +``` + +
+
+ +```php +$app->get('/(\d+)', '\App\Controllers\User@showProfile'); +``` + +
+ +But this gets tedious if you have a lot of routes. So Leaf allows you to set a "general" namespace, you can set the default namespace to use on your router instance via `setNamespace()` + +
+ +```php +app()->setNamespace('\App\Controllers'); + +app()->get('/users/(\d+)', 'User@showProfile'); +app()->get('/cars/(\d+)', 'Car@showProfile'); +``` + +
+
+ +```php +$app->setNamespace('\App\Controllers'); + +$app->get('/users/(\d+)', 'User@showProfile'); +$app->get('/cars/(\d+)', 'Car@showProfile'); +``` + +
+ +## Next Steps + +Follow along with the next steps to learn more about Leaf MVC. + + diff --git a/apps/docs/src/docs/routing/sub-folder.md b/apps/docs/src/docs/routing/sub-folder.md new file mode 100755 index 0000000..5ef3c93 --- /dev/null +++ b/apps/docs/src/docs/routing/sub-folder.md @@ -0,0 +1,62 @@ +# Sub-folder support + + +## Overview + +Out-of-the box Leaf's Core router will run in any (sub)folder you place it into … no adjustments to your code are needed. You can freely move your entry script index.php around, and the router will automatically adapt itself to work relatively from the current folder's path by mounting all routes onto that basePath. + +Say you have a server hosting the domain www.example.org using public_html/ as its document root, with this little entry script index.php: + +
+ +```php +app()->get('/', function () { echo 'Index'; }); +app()->get('/hello', function () { echo 'Hello!'; }); +``` + +
+
+ +```php +$app->get('/', function () { echo 'Index'; }); +$app->get('/hello', function () { echo 'Hello!'; }); +``` + +
+ +- If your were to place this file (along with its accompanying .htaccess file or the like) at the document root level (e.g. public_html/index.php), Leaf's Core router will mount all routes onto the domain root (e.g. /) and thus respond to [https://www.example.org/](https://www.example.org/) and [https://www.example.org/hello](https://www.example.org/hello). + +- If you were to move this file (along with its accompanying .htaccess file or the like) into a subfolder (e.g. public_html/demo/index.php), Leaf's Core router will mount all routes onto the current path (e.g. /demo) and thus repsond to [https://www.example.org/demo](https://www.example.org/demo) and [https://www.example.org/demo/hello](https://www.example.org/demo/hello). There's no need for `$app->mount(…)` in this case. + +## Disabling subfolder support + +In case you don't want Leaf's Core router to automatically adapt itself to the folder its being placed in, it's possible to manually override the basePath by calling `setBasePath()`. This is necessary in the (uncommon) situation where your entry script and your entry URLs are not tightly coupled (e.g. when the entry script is placed into a subfolder that does not need be part of the URLs it responds to).. + +
+ +```php +// Override auto base path detection +app()->setBasePath('/'); + +app()->get('/', function () { echo 'Index'; }); +app()->get('/hello', function () { echo 'Hello!'; }); + +app()->run(); +``` + +
+
+ +```php +// Override auto base path detection +$app->setBasePath('/'); + +$app->get('/', function () { echo 'Index'; }); +$app->get('/hello', function () { echo 'Hello!'; }); + +$app->run(); +``` + +
+ +If you were to place this file into a subfolder (e.g. public_html/some/sub/folder/index.php), it will still mount the routes onto the domain root (e.g. /) and thus respond to [https://www.example.org/](https://www.example.org/) and [https://www.example.org/hello](https://www.example.org/hello) (given that your .htaccess file – placed at the document root level – rewrites requests to it) diff --git a/apps/docs/src/docs/routing/sub-patterns.md b/apps/docs/src/docs/routing/sub-patterns.md new file mode 100755 index 0000000..8a577a0 --- /dev/null +++ b/apps/docs/src/docs/routing/sub-patterns.md @@ -0,0 +1,82 @@ +# Optional Route Subpatterns + + + +*This guide assumes you have read [Simple Routing](/docs/routing/) and [dynamic routing](/docs/routing/dynamic)* + +Route subpatterns can be made optional by making the subpatterns optional by adding a ? after them. Think of blog URLs in the form of /blog(/year)(/month)(/day)(/slug): + +
+ +```php +app()->get('/blog(/\d+)?(/\d+)?(/\d+)?(/[a-z0-9_-]+)?', function ($year = null, $month = null, $day = null, $slug = null) { + if (!$year) { echo 'Blog overview'; return; } + if (!$month) { echo 'Blog year overview'; return; } + if (!$day) { echo 'Blog month overview'; return; } + if (!$slug) { echo 'Blog day overview'; return; } + echo 'Blogpost ' . htmlentities($slug) . ' detail'; +}); +``` + +
+
+ +```php +$app->get('/blog(/\d+)?(/\d+)?(/\d+)?(/[a-z0-9_-]+)?', function ($year = null, $month = null, $day = null, $slug = null) { + if (!$year) { echo 'Blog overview'; return; } + if (!$month) { echo 'Blog year overview'; return; } + if (!$day) { echo 'Blog month overview'; return; } + if (!$slug) { echo 'Blog day overview'; return; } + echo 'Blogpost ' . htmlentities($slug) . ' detail'; +}); +``` + +
+ +The code snippet above responds to the URLs /blog, /blog/year, /blog/year/month, /blog/year/month/day, and /blog/year/month/day/slug. + +**Note**: With optional parameters it is important that the leading / of the subpatterns is put inside the subpattern itself. Don't forget to set default values for the optional parameters. + +The code snipped above unfortunately also responds to URLs like /blog/foo and states that the overview needs to be shown - which is incorrect. Optional subpatterns can be made successive by extending the parenthesized subpatterns so that they contain the other optional subpatterns: The pattern should resemble /blog(/year(/month(/day(/slug)))) instead of the previous /blog(/year)(/month)(/day)(/slug): + +
+ +```php +app()->get('/blog(/\d+(/\d+(/\d+(/[a-z0-9_-]+)?)?)?)?', function ($year = null, $month = null, $day = null, $slug = null) { + // ... +}); +``` + +
+
+ +```php +$app->get('/blog(/\d+(/\d+(/\d+(/[a-z0-9_-]+)?)?)?)?', function ($year = null, $month = null, $day = null, $slug = null) { + // ... +}); +``` + +
+ +**Note**: It is highly recommended to always define successive optional parameters. + +To make things complete use [quantifiers](http://www.php.net/manual/en/regexp.reference.repetition.php) to require the correct amount of numbers in the URL: + +
+ +```php +app()->get('/blog(/\d{4}(/\d{2}(/\d{2}(/[a-z0-9_-]+)?)?)?)?', function ($year = null, $month = null, $day = null, $slug = null) { + // ... +}); +``` + +
+
+ +```php +$app->get('/blog(/\d{4}(/\d{2}(/\d{2}(/[a-z0-9_-]+)?)?)?)?', function ($year = null, $month = null, $day = null, $slug = null) { + // ... +}); +``` + +
diff --git a/apps/docs/src/docs/routing/sub-routing.md b/apps/docs/src/docs/routing/sub-routing.md new file mode 100755 index 0000000..7a7a1a3 --- /dev/null +++ b/apps/docs/src/docs/routing/sub-routing.md @@ -0,0 +1,240 @@ +# Sub-routing + + +Sub-routing is the idea of grouping your routes into smaller groups. This is useful when you want to group your routes into different sections. For example, you can group all your admin routes into a group called `admin` and all your user routes into a group called `user`. + +There are many benefits to this, one of which is that you can easily prefix your routes with a path. For example, you can prefix all your admin routes with `/admin` and all your user routes with `/user`. You can also add shared middleware to a group of routes. + +## Creating a route group + +Leaf router provides a `group()` method which allows you to create a group of routes. The `group` method accepts two parameters, the first is the path to the group and the second is a callback function which contains all the routes in the group. + +The path to the group is the prefix that will be added to all the routes in the group. For example, if you create a group with the path `/admin`, all the routes in the group will be prefixed with `/admin`. **If you want to opt out of the prefix for a route group, you can set the group path to `/`.** + +
+ +```php +app()->group('/movies', function () { + // will result in '/movies/' + app()->get('/', function () { + echo 'movies overview'; + }); + + // will result in '/movies/id' + app()->get('/(\d+)', function ($id) { + echo 'movie id ' . htmlentities($id); + }); +}); +``` + +
+
+ +```php +$app->group('/movies', function () use($app) { + // will result in '/movies/' + $app->get('/', function () { + echo 'movies overview'; + }); + + // will result in '/movies/id' + $app->get('/(\d+)', function ($id) { + echo 'movie id ' . htmlentities($id); + }); +}); +``` + +
+ +## Nesting Groups + +Nesting of subroutes is possible, just define a second `group()` in the callback function that's already contained within a preceding `group()`. + +
+ +```php{2,12} +// parent group +app()->group('/user', function () { + app()->get('/', function () { + response()->markup('no user id'); + }); + + app()->get('/(\d+)', function ($id) { + response()->markup("user $id"); + }); + + // sub group here + app()->group('/settings', function () { + // will result in '/user/settings/privacy' + app()->get('/privacy', function () { + response()->markup('Privacy Settings'); + }); + + app()->get('/notifications', function () { + response()->markup("Notification Settings"); + }); + }); +}); +``` + +
+
+ +```php{2,12} +// parent group +$app->group('/user', function () use($app) { + $app->get('/', function () use($app) { + $app->response()->markup('no user id'); + }); + + $app->get('/(\d+)', function ($id) use($app) { + $app->response()->markup("user $id"); + }); + + // sub group here + $app->mount('/settings', function () use($app) { + // will result in '/user/settings/privacy' + $app->get('/privacy', function () use($app) { + $app->response()->markup('Privacy Settings'); + }); + + $app->get('/notifications', function () use($app) { + $app->response()->markup('Notification Settings'); + }); + }); +}); +``` + +
+ +## Group Namespaces + +When using controllers, Leaf allows you to set a global namespace for all your controllers. The problem with this is that you can't have different namespaces for different groups of routes, and that's where group namespaces come in. + +Leaf allows you to set a namespace for a group of routes. This means that all controllers in that group will be prefixed with the namespace you set for that group **instead of the global namespace**. This is useful when you want to have different namespaces for different groups of routes. + +
+ +```php +app()->setNamespace('App\Controllers'); + + +app()->group('/user', ['namespace' => 'App\Controllers\Users', function () { + // controller here will be App\Controllers\Users\FormsController + app()->get('/form', 'FormsController@index'); +}]); + + +app()->group('/admin', ['namespace' => 'App\Controllers\Admins', function () { + // controller here will be App\Controllers\Admins\FormsController + app()->get('/form', 'FormsController@index'); +}]); + + +// controller here will be App\Controllers\FormsController +app()->get('/form', 'FormsController@index'); +``` + +
+
+ +```php +$app->setNamespace('App\Controllers'); + + +$app->group('/user', ['namespace' => 'App\Controllers\Users', function () use($app) { + // controller here will be App\Controllers\Users\FormsController + $app->get('/form', 'FormsController@index'); +}]); + + +$app->group('/admin', ['namespace' => 'App\Controllers\Admins', function () use($app) { + // controller here will be App\Controllers\Admins\FormsController + $app->get('/form', 'FormsController@index'); +}]); + + +// controller here will be App\Controllers\FormsController +$app->get('/form', 'FormsController@index'); +``` + +
+ +For more info on controllers, you can [check out the controller docs](/docs/routing/controller). + +## Group Middleware + +You can also add middleware to a group of routes. This means that all routes in that group will be passed through the middleware you set for that group. This is useful when you want to add middleware to a group of routes. + +
+ +```php +$middleware = function () { + // some middleware operation here +}; + +app()->group('/user', ['middleware' => $middleware, function () { + app()->get('/', function () { + response()->markup('no user id'); + }); + + app()->get('/(\d+)', function ($id) { + response()->markup("user $id"); + }); +}]); +``` + +
+
+ +```php +$middleware = function () { + // some middleware operation here +}; + +$app->group('/user', ['middleware' => $middleware, function () use($app) { + $app->get('/', function () use($app) { + $app->response()->markup('no user id'); + }); + + $app->get('/(\d+)', function ($id) use($app) { + $app->response()->markup("user $id"); + }); +}]); +``` + +
+ +You can also use named middleware in a group of routes. This means that all routes in that group will be passed through the named middleware you set for that group. This is useful when you want to add named middleware to a group of routes. + +
+ +```php +app()->group('/user', ['middleware' => 'auth', function () { + app()->get('/', function () { + response()->markup('no user id'); + }); + + app()->get('/(\d+)', function ($id) { + response()->markup("user $id"); + }); +}]); +``` + +
+ +
+ +```php +$app->group('/user', ['middleware' => 'auth', function () use($app) { + $app->get('/', function () use($app) { + $app->response()->markup('no user id'); + }); + + $app->get('/(\d+)', function ($id) use($app) { + $app->response()->markup("user $id"); + }); +}]); +``` + +
diff --git a/apps/docs/src/docs/skeleton/index.md b/apps/docs/src/docs/skeleton/index.md new file mode 100644 index 0000000..dca1222 --- /dev/null +++ b/apps/docs/src/docs/skeleton/index.md @@ -0,0 +1,93 @@ + + +# Skeleton + +Skeleton was designed to be a simple starting point for your application, and came with just the bare minimum to get you started. However, we have decided to deprecate Skeleton in favor of the Leaf CLI. The Leaf CLI is a command-line tool for generating Leaf projects, installing modules, and more. + +## Discontinuing Skeleton + +We recently released an update to the Leaf CLI that allows you to select specific features you want to include and generate a project with everything you need. This functionality is similar to what Skeleton provided but is more flexible and allows you to create projects with only the features that you need, which is why we've decided to deprecate Leaf Skeleton. + +Skeleton will still be available for download, but we won't be updating it anymore. We recommend that you generate a project with the CLI or use Leaf MVC or Leaf API instead. + +## Updating from Skeleton + +The beauty of this update is that you don't have to change anything in your existing Skeleton project. This is because Skeleton, unlike Leaf MVC and Leaf API is not a framework. It's just a starting point for your project. So, you can continue to use your Skeleton project and update specific features using the Leaf CLI or Composer. + +If you are starting a fresh project however, we recommend that you use the Leaf CLI to generate your project. If you want to use Composer, you can install Leaf MVC or Leaf API instead. + +**The Skeleton docs will still be available here, but we won't be updating it anymore.** + +## Directory Structure + +The Skeleton directory structure is setup to be straighforward and understandable at a glance. You can completely change the directory structure to suit your needs, just be sure to update the paths in the `config.php` file. + +For a fresh Skeleton app, the directory structure looks like this: + +```bash +C:. +├── config +├── controllers +├── models +├── pages +│   └── components +├── routes +├── storage +│   ├── app +│   │   └── public +│   ├── framework +│   │   └── views +│   └── logs +└── vendor +``` + +- ### The `config` directory + + The `config` directory contains the configuration files for your application. These are used to configure how Leaf and it's modules interact with your application. You can find more information about the configuration files in the [Configuration](/docs/mvc/config) section. + +- ### The `controllers` directory + + The `controllers` directory contains the controllers for your application. These are used to handle HTTP requests. You can find more information about the controllers in the [Controllers](/docs/mvc/controllers) section. + +- ### The `models` directory + + The `models` directory contains the models for your application. These are used to interact with the database. You can find more information about the models in the [Models](/docs/mvc/models) section. + +- ### The `pages` directory + + The `pages` directory contains the views and frontend assets for your Leaf application. + +- ### The `routes` directory + + The `routes` directory contains routes for your application. These are used to map HTTP requests to controllers. You can find more information about the routes in the [Routing](/docs/mvc/routing) section. + +- ### The `storage` directory + + The `storage` directory contains the compiled views, logs and other files generated by your application. It's divided into a few sub-directories: + + - `app` - Contains the files generated by your application. This includes the compiled views and the files uploaded by users. + - `framework` - Contains the framework generated files for your application. + - `logs` - Contains the log files generated by your application. + +- ### The `vendor` directory + + The `vendor` directory contains all the dependencies installed by Composer. It's automatically generated when you install the dependencies using Composer. + +## Next Steps + +Follow along with the next steps to learn more about Skeleton. + + diff --git a/apps/docs/src/docs/tooling/app.md b/apps/docs/src/docs/tooling/app.md new file mode 100644 index 0000000..f3c3011 --- /dev/null +++ b/apps/docs/src/docs/tooling/app.md @@ -0,0 +1,116 @@ +# Production Deployment + +::: tip +Most of the tips below are enabled by default if you are using [Leaf CLI](/docs/cli/). This section is only relevant if you are using a custom build setup. +::: + +## Turn on Production Mode + +During development, Leaf provides a lot of warnings to help you with common errors and pitfalls. However, these warning strings become useless in production and bloat your app's payload size. In addition, some of these warning checks have small runtime costs that can be avoided in production mode. + +### Without Build Tools + +If you are using the full build, i.e. directly including Leaf via a script tag without a build tool, make sure to use the minified version for production. This can be found in the [Installation guide](/docs/introduction/installation.html#cdn). + +### With Build Tools + +When using a build tool like Webpack or Browserify, the production mode will be determined by `process.env.NODE_ENV` inside Leaf's source code, and it will be in development mode by default. Both build tools provide ways to overwrite this variable to enable Leaf's production mode, and warnings will be stripped by minifiers during the build. Leaf CLI has this pre-configured for you, but it would be beneficial to know how it is done: + +#### Webpack + +In Webpack 4+, you can use the `mode` option: + +```js +module.exports = { + mode: 'production' +} +``` + +#### Browserify + +- Run your bundling command with the actual `NODE_ENV` environment variable set to `"production"`. This tells `Leafify` to avoid including hot-reload and development related code. + +- Apply a global [envify](https://github.com/hughsk/envify) transform to your bundle. This allows the minifier to strip out all the warnings in Leaf's source code wrapped in env variable conditional blocks. For example: + + ```bash + NODE_ENV=production browserify -g envify -e main.js | uglifyjs -c -m > build.js + ``` + +- Or, using [envify](https://github.com/hughsk/envify) with Gulp: + + ```js + // Use the envify custom module to specify environment variables + const envify = require('envify/custom') + + browserify(browserifyOptions) + .transform(Leafify) + .transform( + // Required in order to process node_modules files + { global: true }, + envify({ NODE_ENV: 'production' }) + ) + .bundle() + ``` + +- Or, using [envify](https://github.com/hughsk/envify) with Grunt and [grunt-browserify](https://github.com/jmreidy/grunt-browserify): + + ```js + // Use the envify custom module to specify environment variables + const envify = require('envify/custom') + + browserify: { + dist: { + options: { + // Function to deviate from grunt-browserify's default order + configure: (b) => + b + .transform('Leafify') + .transform( + // Required in order to process node_modules files + { global: true }, + envify({ NODE_ENV: 'production' }) + ) + .bundle() + } + } + } + ``` + +#### Rollup + +Use [@rollup/plugin-replace](https://github.com/rollup/plugins/tree/master/packages/replace): + +```js +const replace = require('@rollup/plugin-replace') + +rollup({ + // ... + plugins: [ + replace({ + 'process.env.NODE_ENV': JSON.stringify( 'production' ) + }) + ] +}).then(...) +``` + +## Pre-Compiling Templates + +When using in-DOM templates or in-JavaScript template strings, the template-to-render-function compilation is performed on the fly. This is usually fast enough in most cases, but is best avoided if your application is performance-sensitive. + + + +If you are using Webpack, and prefer separating JavaScript and template files, you can use [Leaf-template-loader](https://github.com/ktsn/Leaf-template-loader), which also transforms the template files into JavaScript render functions during the build step. + +## Extracting Component CSS + +When using Single-File Components, the CSS inside components are injected dynamically as ` diff --git a/apps/docs/src/ecosystem/themes/ThemeHero.vue b/apps/docs/src/ecosystem/themes/ThemeHero.vue new file mode 100644 index 0000000..df9ec0e --- /dev/null +++ b/apps/docs/src/ecosystem/themes/ThemeHero.vue @@ -0,0 +1,64 @@ + + + diff --git a/apps/docs/src/ecosystem/themes/ThemeList.vue b/apps/docs/src/ecosystem/themes/ThemeList.vue new file mode 100644 index 0000000..16afa5b --- /dev/null +++ b/apps/docs/src/ecosystem/themes/ThemeList.vue @@ -0,0 +1,41 @@ + + + + + diff --git a/apps/docs/src/ecosystem/themes/ThemeListItem.vue b/apps/docs/src/ecosystem/themes/ThemeListItem.vue new file mode 100644 index 0000000..b904217 --- /dev/null +++ b/apps/docs/src/ecosystem/themes/ThemeListItem.vue @@ -0,0 +1,153 @@ + + + + + diff --git a/apps/docs/src/ecosystem/themes/ThemePage.vue b/apps/docs/src/ecosystem/themes/ThemePage.vue new file mode 100644 index 0000000..d4e43c8 --- /dev/null +++ b/apps/docs/src/ecosystem/themes/ThemePage.vue @@ -0,0 +1,23 @@ + + + diff --git a/apps/docs/src/ecosystem/themes/ThemeProduct.vue b/apps/docs/src/ecosystem/themes/ThemeProduct.vue new file mode 100644 index 0000000..175952f --- /dev/null +++ b/apps/docs/src/ecosystem/themes/ThemeProduct.vue @@ -0,0 +1,97 @@ + + + + + diff --git a/apps/docs/src/ecosystem/themes/themes.json b/apps/docs/src/ecosystem/themes/themes.json new file mode 100644 index 0000000..6db97d0 --- /dev/null +++ b/apps/docs/src/ecosystem/themes/themes.json @@ -0,0 +1,38 @@ +[ + { + "name": "Leaf 3 Core", + "description": "These are projects built using a basic Leaf 3 scaffold.", + "products": [ + { + "name": "[WIP] Complete authentication API", + "price": 0, + "description": "This project is a complete authentication system built with Leaf 3. It includes a full user registration system, OTP verification, password reset, and more.", + "url": "https://github.com/leafsphp/demos/tree/main/leaf/auth", + "image": "https://repository-images.githubusercontent.com/214705101/0ff19323-d2c5-46f5-a582-0b1f3a6eabcc", + "tags": ["basic"] + }, + { + "name": "[WIP] Complete authentication API (Dockerized)", + "price": 0, + "description": "This project is a complete authentication system built with Leaf 3 and docker. It includes a full user registration system, OTP verification, password reset, and more.", + "url": "https://github.com/leafsphp/demos/tree/main/leaf/docker-auth", + "image": "https://repository-images.githubusercontent.com/214705101/0ff19323-d2c5-46f5-a582-0b1f3a6eabcc", + "tags": ["basic", "docker"] + } + ] + }, + { + "name": "Leaf API v3", + "description": "These are projects built using the Leaf API v3 scaffold.", + "products": [ + { + "name": "[WIP] Complete authentication API", + "price": 0, + "description": "This project is a complete authentication system built with Leaf 3. It includes a full user registration system, OTP verification, password reset, and more.", + "url": "https://github.com/leafsphp/demos/tree/main/leafAPI/auth", + "image": "https://repository-images.githubusercontent.com/214705101/0ff19323-d2c5-46f5-a582-0b1f3a6eabcc", + "tags": ["leafAPI", "leaf3"] + } + ] + } +] diff --git a/apps/docs/src/events/components/EventList.vue b/apps/docs/src/events/components/EventList.vue new file mode 100644 index 0000000..e37ab0e --- /dev/null +++ b/apps/docs/src/events/components/EventList.vue @@ -0,0 +1,28 @@ + + + + + diff --git a/apps/docs/src/events/components/EventsHero.vue b/apps/docs/src/events/components/EventsHero.vue new file mode 100644 index 0000000..8c5d18e --- /dev/null +++ b/apps/docs/src/events/components/EventsHero.vue @@ -0,0 +1,63 @@ + + + diff --git a/apps/docs/src/events/components/EventsPage.vue b/apps/docs/src/events/components/EventsPage.vue new file mode 100644 index 0000000..112a52e --- /dev/null +++ b/apps/docs/src/events/components/EventsPage.vue @@ -0,0 +1,60 @@ + + + + + diff --git a/apps/docs/src/events/components/PartnerCard.vue b/apps/docs/src/events/components/PartnerCard.vue new file mode 100644 index 0000000..24c14bc --- /dev/null +++ b/apps/docs/src/events/components/PartnerCard.vue @@ -0,0 +1,187 @@ + + + + + diff --git a/apps/docs/src/events/components/PartnerLanding.vue b/apps/docs/src/events/components/PartnerLanding.vue new file mode 100644 index 0000000..3a6eea1 --- /dev/null +++ b/apps/docs/src/events/components/PartnerLanding.vue @@ -0,0 +1,90 @@ + + + + + diff --git a/apps/docs/src/events/components/PartnerPage.vue b/apps/docs/src/events/components/PartnerPage.vue new file mode 100644 index 0000000..b224955 --- /dev/null +++ b/apps/docs/src/events/components/PartnerPage.vue @@ -0,0 +1,161 @@ + + + + + diff --git a/apps/docs/src/events/components/Speak.vue b/apps/docs/src/events/components/Speak.vue new file mode 100644 index 0000000..606eab0 --- /dev/null +++ b/apps/docs/src/events/components/Speak.vue @@ -0,0 +1,76 @@ + + + diff --git a/apps/docs/src/events/components/type.ts b/apps/docs/src/events/components/type.ts new file mode 100644 index 0000000..600d04b --- /dev/null +++ b/apps/docs/src/events/components/type.ts @@ -0,0 +1,15 @@ +export interface Event { + name: string; + flyer: string; + intro: string; + date: string; + description: string[]; + topics: string[]; + region: string[]; + location: string[]; + website: { + text: string; + url: string; + } + contact: string; +} diff --git a/apps/docs/src/events/components/utils.ts b/apps/docs/src/events/components/utils.ts new file mode 100644 index 0000000..7a257a1 --- /dev/null +++ b/apps/docs/src/events/components/utils.ts @@ -0,0 +1,12 @@ +export function normalizeName(name: string) { + return name.toLowerCase().replace(/\s+/g, '') +} + +export function getHero(name: string) { + return `/images/partners/${normalizeName(name)}-hero.jpg` +} + +export function getLogo(img: string, flip = false) { + if (flip) img = img.replace(/(\.\w+$)/, '-dark$1') + return `/images/partners/${img}` +} diff --git a/apps/docs/src/events/events copy.json b/apps/docs/src/events/events copy.json new file mode 100644 index 0000000..df22d34 --- /dev/null +++ b/apps/docs/src/events/events copy.json @@ -0,0 +1,19 @@ +[ + { + "name": "Build First Conference", + "flyer": "https://img.evbuc.com/https%3A%2F%2Fcdn.evbuc.com%2Fimages%2F468748639%2F197503707544%2F1%2Foriginal.20230314-170300?w=940&auto=format%2Ccompress&q=75&sharp=10&rect=0%2C0%2C2160%2C1080&s=796bdd67b113076902ad39c1a5a4894b", + "intro": "Product/developer centric conference for tech enthusiasts, beginners and experts alike to network and harness modern ways and best practice.", + "date": "2023-03-25T09:30:00.000Z", + "description": [ + "Product/developer centric conference for tech enthusiasts, beginners and experts alike to network and harness modern ways and best practice." + ], + "topics": ["React", "Leaf PHP", "NextJS", "Laravel"], + "region": ["Accra"], + "location": ["Accra Technical University"], + "website": { + "text": "Eventbrite", + "url": "https://www.eventbrite.com/e/build-first-conference-tickets-561581494367" + }, + "contact": "dawoodiddris@gmail.com" + } +] diff --git a/apps/docs/src/events/events.json b/apps/docs/src/events/events.json new file mode 100644 index 0000000..377136c --- /dev/null +++ b/apps/docs/src/events/events.json @@ -0,0 +1,19 @@ +[ + { + "name": "Building Scalable APIs: Exploring the Power of Leaf PHP Framework", + "flyer": "https://pbs.twimg.com/media/F2haAZpWUAI5hb1?format=png&name=900x900", + "intro": "Join us for a Twitter space hosted by @DevCongress \"Building Scalable APIs with LeafPHP's Framework - Unleash Scalability and Efficiency.\" Don't miss this opportunity to accelerate your development journey!", + "date": "2023-08-14T19:00:00.000Z", + "description": [ + "Join us for a Twitter space hosted by @DevCongress \"Building Scalable APIs with LeafPHP's Framework - Unleash Scalability and Efficiency.\" Don't miss this opportunity to accelerate your development journey!" + ], + "topics": ["Leaf PHP", "PHP", "Twitter"], + "region": ["Twitter"], + "location": ["Online"], + "website": { + "text": "Twitter", + "url": "https://twitter.com/i/spaces/1rmxPkMeOyZJN?s=20" + }, + "contact": "ashley@leafphp.dev" + } +] diff --git a/apps/docs/src/events/example.md b/apps/docs/src/events/example.md new file mode 100644 index 0000000..b5f0abd --- /dev/null +++ b/apps/docs/src/events/example.md @@ -0,0 +1,12 @@ +--- +page: true +footer: false +--- + + + +Hello diff --git a/apps/docs/src/events/index.md b/apps/docs/src/events/index.md new file mode 100644 index 0000000..f21ba47 --- /dev/null +++ b/apps/docs/src/events/index.md @@ -0,0 +1,10 @@ +--- +page: true +footer: false +--- + + + + diff --git a/apps/docs/src/index.md b/apps/docs/src/index.md new file mode 100644 index 0000000..fddd2ec --- /dev/null +++ b/apps/docs/src/index.md @@ -0,0 +1,10 @@ +--- +page: true +title: Leaf PHP - Simple and elegant PHP +--- + + + + diff --git a/apps/docs/src/modules/anchor/csrf/index.md b/apps/docs/src/modules/anchor/csrf/index.md new file mode 100644 index 0000000..44acedc --- /dev/null +++ b/apps/docs/src/modules/anchor/csrf/index.md @@ -0,0 +1,116 @@ +# Leaf CSRF Beta + +
+ +[![Latest Stable Version](https://poser.pugx.org/leafs/csrf/v/stable)](https://packagist.org/packages/leafs/csrf) + +[![Total Downloads](https://poser.pugx.org/leafs/csrf/downloads)](https://packagist.org/packages/leafs/csrf) + +[![License](https://poser.pugx.org/leafs/csrf/license)](https://packagist.org/packages/leafs/csrf) + +
+ +This package is leaf's implementation of CSRF default protection with leaf anchor. It comes separated from leaf anchor because it is not needed in every project you may build. + +## Installation + +You can easily install Leaf CSRF using [Composer](https://getcomposer.org/). + +```bash +composer require leafs/csrf +``` + +or with leaf CLI + +```bash +leaf install csrf +``` + +## Basic Usage + +After installing leaf CSRF, leaf automatically loads the CSRF package for you, so you don't need to do anything unless you want to configure the CSRF module to match your application requirements. + +### Using CSRF outside of leaf + +Most leaf modules can be used outside of leaf. This module is one of these global modules. If you decide to use the CSRF module outside of leaf, you will need to manually initialize the package. + +```php +Leaf\Anchor\CSRF::init(); +``` + +This function generates a token with a secret and a random hash and saves that in a session. If no session exists, the CSRF module will create a session for your app and save the token in that session, + +### Config + +Just like every other leaf module, this module also allows you to customize it to behave in any way you want it to behave. Also, since this module is built on the Anchor module, the config object is shared with Anchor. To set any configuration, simply call the `config` method. + +**Available config:** + +- **SECRET_KEY** - This is the key with which the token is saved and used in your leaf app. If this is not specified, leaf uses the name `_token` as done in other frameworks like Laravel. + +- **SECRET** - This is the secret key used to encrypt the token. Leaf also has a default secret key set for you. Note that the secret key is attached to a set of unique numbers that not even leaf knows. + +- **EXCEPT** - This is an array of routes that you want to exclude from the CSRF protection. + +- **METHODS** - This is an array of HTTP methods to apply CSRF protection to. By default, leaf uses `["POST", "PUT", "PATCH", "DELETE"]` + +```php +use Leaf\Anchor\CSRF; + +CSRF::config([ + "METHODS" => ["GET"], + "EXCEPT" => ["/"], +]); +``` + +## Token + +A token is generated under the hood for your application, you can get this token to submit in forms using the `token` method. + +```php +$csrfToken = Leaf\Anchor\CSRF::token(); + +>> ["_token" => "TOKEN VALUE"] +``` + +To make things a bit easier, `token` returns associative array holding the token key name and the token itself. This is an example JSON represenation. + +```json +{"_token": "TOKEN VALUE"} +``` + +## Form + +You would usually want to append a hidden input field holding the token to a form so it doesn't fail the CSRF check. Although you can use the `token` method above to do just that, the `form` method makes it a lot easier as it renders the input field and populates it with the token. + +```php +
+ + ... +
+``` + +## Functional Mode + +Just as with other modules, leaf csrf also ships with global functions that make development a lot easier. + +### _token + +This method returns the CSRF token just as done with the `token` method above. + +```php +$csrfToken = _token(); + +>> ["_token" => "TOKEN VALUE"] +``` + +### _csrfField + +This directly renders the form field for the CSRF token generated. + +```php +
+ + ... +
+``` diff --git a/apps/docs/src/modules/anchor/index.md b/apps/docs/src/modules/anchor/index.md new file mode 100644 index 0000000..08bad4f --- /dev/null +++ b/apps/docs/src/modules/anchor/index.md @@ -0,0 +1,67 @@ +# Leaf Anchor + + +
+ +[![Latest Stable Version](https://poser.pugx.org/leafs/anchor/v/stable)](https://packagist.org/packages/leafs/anchor) + +[![Total Downloads](https://poser.pugx.org/leafs/anchor/downloads)](https://packagist.org/packages/leafs/anchor) + +[![License](https://poser.pugx.org/leafs/anchor/license)](https://packagist.org/packages/leafs/anchor) + +
+ +Leaf anchor is a new module which contains basic security features for the leaf framework. This module is actively being developed and will be updated whenever a security vulnerability is discovered. + +::: danger NOTE +The whole of leaf 3 and some of it's modules rely on this particular module. In case of updates, you **might** need to update the packages that rely on this module to receive the security updates. +::: + +## Installation + +::: warning +There is no need to manually add the anchor module if you're using Leaf 3 since this is done for you automatically. +::: + +You can quickly and simply install Leaf anchor through composer or the leaf cli. + +```bash +composer require leafs/anchor +``` + +or with the leaf cli: + +```bash +leaf install anchor +``` + +From there you can use the `Leaf\Anchor` class. + +## Base XSS protection + +Attackers pass executable scripts into your application through input fields, urls, ... These scripts are then executed and perform whatever action the attacker needs. To prevent this, you will need to sanitize your data to make sure PHP treats them as nothing more than text. + +The `sanitize` on leaf anchor handles all of this for you so you don't have to worry about escaping them. + +```php + +# 🧨 Leaf Authentication + +Authentication provides simple methods to help with manual authentication and working with tokens. In v2, Authentication has been added to Leaf Heplers, so it's now just an authentication helper. If you want a much simpler way, you can check out [Simple Auth](/modules/auth/). + +## Working with tokens + +Leaf provides you with the `JWT` object which includes various methods for creating and parsing token data....but we do not advice directly using the `JWT` object. For this reason, this object has been created to work with all the `JWT` data. + +```php +use Leaf\Helpers\Authentication as Auth; + +$token = Auth::generateSimpleToken(...); +``` + +The examples below will all use `Auth::` pointing the example above. + +## Authentication methods + +Here are the methods you can use on `Authentication` + +### generateSimpleToken() + +This method generates a new JSON Web Token. It takes 2 arguments. check out JWT for more info on JWT params + +- (int) - A user id to encode +- (string) - A secret phrase to encode with the token + +```php +$token = Auth::generateSimpleToken(24', 'LEAF PHP SECRET CODE 1442'); +``` + +### generateToken() + +This method generates a new JSON Web Token: the same as `generateSimpleToken`, the only difference is that this method gives you more control over the token i.e. expiry time and custom fields. This method takes in 2 params, the entire `payload` of your JWT and a secret phrase. check out JWT for more info on JWT payload params. + +- (array) - JWT payload +- (string) - A secret phrase to encode with the token + +```php +$payload = [ + 'iat' => time(), + 'iss' => 'localhost', + 'exp' => time() + (15*60), + 'userId' => $user_id, + 'username' => $username +]; + +$token = Auth::generateToken($payload, "secret phrase"); +``` + +### validateToken() + +This method is used to confirm the identity of a token from an authorization header. + +```php +$payload = Auth::validateToken("SECRET PHRASE"); +``` + +If the token is valid, it returns the decoded `payload`. So if we encode a payload: + +```php +$payload = [ + 'iat' => time(), + 'iss' => 'localhost', + 'exp' => time() + (15*60), + 'userId' => $user_id, + 'username' => $username +]; +``` + +We can retrieve this payload by calling + +```php +$payload = Auth::validateToken("SECRET PHRASE"); + +$username = $payload["username"]; +``` + +If the validation fails, it returns `null`, you can get any error by calling the `errors` method. + +```php +$payload = Auth::validateToken("SECRET PHRASE"); // returns null if failed + +if (!$payload) { + $response->exit(Auth::errors()); +} +``` + +### validate() + +This method is used to confirm the identity of a token. Unlike `validateToken`, the token to validate is directly passed into it. Just like `validateToken`, it returns the token's `payload` + +```php +$payload = Auth::validate($token, "SECRET PHRASE"); + +$username = $payload["username"]; +``` + +If the validation fails, it returns `null`, you can get any error by calling the `errors` method. + +```php +$payload = Auth::validate($token, "SECRET PHRASE"); // returns null if failed + +if (!$payload) { + $response->exit(Auth::errors()); +} +``` + +### getBearerToken() + +This method is used to get the bearer token from an authorization header. It returns `false` if there's no token. You can then use the `errors` method to retrieve any errors. + +```php +$token = Auth::getBearerToken(); + +// if there are any errors +if (!$token) { + echo Auth::errors(); +} +``` + +### getAuthorizationHeader() + +This method is used to an authorization header. Returns `null` if anything goes wrong. + +```php +$authHeader = Auth::getAuthorizationHeader(); +``` diff --git a/apps/docs/src/modules/auth/config.md b/apps/docs/src/modules/auth/config.md new file mode 100755 index 0000000..a68d297 --- /dev/null +++ b/apps/docs/src/modules/auth/config.md @@ -0,0 +1,366 @@ +# Auth Config + + + +Auth Config was added to give you more control over how leaf handles authentication in your apps. Leaf Auth has been configured perfectly for most apps, but not all use cases are the same, hence, this brilliant addition. + +This includes various configurations for doing things like: + +- Configuring tokens +- Hiding/Showing user fields +- Adding/removing default timestamps +- Changing the default password key +- Password encoding and verification +- Adding custom validation messages + +## Setting config values + +To set a config variable, you can simply call the `config` method. + +
+ +```php +$auth = new Leaf\Auth; +$auth->config('item', 'value'); +``` + +
+ +
+ +```php +auth()->config('item', 'value'); +``` + +
+ +You can also pass in an array to set multiple configs at once: + +
+ +```php +$auth->config([ + 'item' => 'value', + 'item2' => 'value' +]); +``` + +
+ +
+ +```php +auth()->config([ + 'item' => 'value', + 'item2' => 'value' +]); +``` + +
+ +## Database Config + +Leaf Auth uses a database to store and retrieve users. It has been configured to work with common setups, but you can change the database config to suit your needs. + +### DB_TABLE + +The `DB_TABLE` config allows you to set a particular table which leaf auth will perform operations on. Leaf auth will use this database table for storing and retrieving users. By default, it is set to `users`. This allows you to login, signup, update and fetch users without explicitly adding a table each time. + +### USE_TIMESTAMPS + +This determines whether Leaf should add the default `created_at` and `updated_at` timestamps on register and update. Default is `true`. + +### TIMESTAMP_FORMAT + +If you set `USE_TIMESTAMPS` to `true` you can then use this property to specify the format that you want your timestamps to be saved in. +Be aware that `auth` uses the `leafs/date` module, so the accepted formats are listed [here](/modules/date/#display) + +### PASSWORD_KEY + +This allows you to change the password field name, maybe yours is passcode? This tells leaf to look for a user's password in that field. The example below tells leaf to search for passwords in the `passcode` column. (the default field is password) + +
+ +```php +auth()->config('PASSWORD_KEY', 'passcode'); +``` + +
+ +
+ +```php +auth()->config('PASSWORD_KEY', 'passcode'); +``` + +
+ +### ID_KEY + +`ID_KEY` allows you to set your primary key name. For instance, you might have used `_id` instead of `id`. This setting allows you to quickly and effectively switch your key name. + +
+ +```php +$auth->config('ID_KEY', '_id'); +``` + +
+
+ +```php +auth()->config('ID_KEY', '_id'); +``` + +
+ +### USE_UUID + +This simply allows you to set the value for user ids on your own. This is done in order to add support for UUIDs in your registrations and not go with the default SQL increments. + +
+ +```php +$auth->config('USE_UUID', UUID::v4()); +``` + +
+
+ +```php +auth()->config('USE_UUID', UUID::v4()); +``` + +
+ +## Password Encoding + +These configuration options control how Leaf Auth encodes and verifies passwords. Leaf Auth uses `PASSWORD_DEFAULT` to encode passwords and `PASSWORD_VERIFY` to verify passwords. + +### PASSWORD_ENCODE + +This setting is used when leaf wants to encode a password. It uses the `Leaf\Helpers\Password::hash` method by default, but you can change this to suit your needs. It accepts these values: + +- `false` - This turns off password encoding +- `null` - This uses the default encoding method (Leaf\Helpers\Password::hash) +- `Password::MD5` - This uses md5. We're still keeping support for md5 :-) (Leaf\Helpers\Password::MD5) +- `function` - This uses a custom method. The method should accept a password and return the encoded password. + +
+ +```php +$auth->config('PASSWORD_ENCODE', false); + +$auth->config('PASSWORD_ENCODE', null); + +$auth->config('PASSWORD_ENCODE', Password::MD5); + +$auth->config('PASSWORD_ENCODE', function ($password) { + return Password::hash($password); +}); +``` + +
+ +
+ +```php +auth()->config('PASSWORD_ENCODE', false); + +auth()->config('PASSWORD_ENCODE', null); + +auth()->config('PASSWORD_ENCODE', Password::MD5); + +auth()->config('PASSWORD_ENCODE', function ($password) { + return Password::hash($password); +}); +``` + +
+ +### PASSWORD_VERIFY + +This setting is used by Leaf Auth to verify whether a password is correct. It uses the `Leaf\Helpers\Password::verify` method by default, but you can change this to suit your needs. It accepts these values: + +- `false` - This turns off password verification +- `null` - This uses the default verification method (Leaf\Helpers\Password::verify) +- `Password::MD5` - This uses md5. We're still keeping support for md5 :-) (Leaf\Helpers\Password::MD5) +- `function` - This uses a custom method. The method should accept a password and return the encoded password. + +This setting is called when Leaf tries to verify a password. It works just like `PASSWORD_ENCODE` above. + +
+ +```php +$auth->config('PASSWORD_VERIFY', false); + +$auth->config('PASSWORD_VERIFY', null); + +$auth->config('PASSWORD_VERIFY', Password::MD5); + +$auth->config('PASSWORD_VERIFY', function ($password) { + return Password::verify($password); +}); +``` + +
+ +
+ +```php +auth()->config('PASSWORD_VERIFY', false); + +auth()->config('PASSWORD_VERIFY', null); + +auth()->config('PASSWORD_VERIFY', Password::MD5); + +auth()->config('PASSWORD_VERIFY', function ($password) { + return Password::verify($password); +}); +``` + +
+ +## Special Config + +These configuration options control special features of Leaf Auth. + +### HIDE_ID + +This is a boolean which determines whether to hide the id in the user object returned on login/register. Default is `true`. + +### AUTH_NO_PASS + +This allows you to _manually_ tell leaf auth that no password is required for authentication. When this is set to true, leaf auth will assume there is no password and act accordingly. If there is no password field set in the credentials passed into the `login` or `register` methods, leaf auth will automatically set this to `true`. + +### HIDE_PASSWORD + +Just as the name implies, allows you to hide or show the password in the final results returned from auth. Default is `true`. + +## Error Message Config + +These configuration options control the error messages returned by Leaf Auth. You can change these to suit your needs. + +### LOGIN_PARAMS_ERROR + +This is the error to show if there's an error with any parameter which isn't the password eg: username: + +
+ +```php +$auth->config('LOGIN_PARAMS_ERROR', 'Username is incorrect!'); +``` + +
+
+ +```php +auth()->config('LOGIN_PARAMS_ERROR', 'Username is incorrect!'); +``` + +
+ +Default is `Incorrect credentials!`. + +### LOGIN_PASSWORD_ERROR + +This is the error to show if there's an error with the password. + +Default is `Password is incorrect!`. + +
+ +```php +$auth->config('LOGIN_PASSWORD_ERROR', 'Password is incorrect!'); +``` + +
+ +
+ +```php +auth()->config('LOGIN_PASSWORD_ERROR', 'Password is incorrect!'); +``` + +
+ +## Session Config + +These configuration options control how Leaf Auth handles sessions. You can change these to suit your needs. + +### USE_SESSION + +Use session based authentication instead of the default JWT based auth. Without this setting enbled, you can't use any of the session methods below. Default is `false`. + +### SESSION_ON_REGISTER + +If set to `true`, a session will be created on a successful registration. If set to `false`, sessions will only be created when a user successfully logs into their account. The default value for this config is `false`. + +### SESSION_REDIRECT_ON_LOGIN + +This configuration option determins whether to redirect to a page after login. When set to `true`, the options set in `GUARD_LOGIN`, `GUARD_REGISTER` and `GUARD_HOME` will be used to redirect the user to the right page based on their state. Default is `true`. + +### GUARD_LOGIN + +The page route. Default is `/auth/login`. + +### GUARD_REGISTER + +The register page route. Default is `/auth/register`. + +### GUARD_LOGOUT + +Logout route handler. Default is `/auth/logout`. + +### GUARD_HOME + +Home page route. Default is `/home`. + +### SESSION_LIFETIME + +This option allows you to set the lifetime of the session. After this time, the session will expire and the user will have to login again. Default is `1 day`. You can also set `SESSION_LIFETIME` to `0` to disable session expiration. + +### SESSION_COOKIE_PARAMS + +This option allows you to set the cookie params for the session. These are the defaults set for you: + +```php +[ + 'secure' => true, + 'httponly' => true, + 'samesite' => 'lax' +] +``` + +### SAVE_SESSION_JWT + +Add an auth token to the auth session? This allows you save a generated JWT to the session. You might want to use this if you want to extend your app into an API. Default is `false`. + +## Token Config + +These configuration options control how Leaf Auth handles tokens. You can change these to suit your needs. + +### TOKEN_LIFETIME + +How long the token can be used before it expires. Default is 1 day. + +### TOKEN_SECRET + +This is the secret key used to generate tokens for users on signup and register. + +## Next Steps + + diff --git a/apps/docs/src/modules/auth/helpers.md b/apps/docs/src/modules/auth/helpers.md new file mode 100644 index 0000000..ccbcc31 --- /dev/null +++ b/apps/docs/src/modules/auth/helpers.md @@ -0,0 +1,137 @@ +# Helper Methods + +Leaf Auth already has methods that cater for most of your authentication use-cases, however, you may have a flow that is more complex than what Leaf Auth offers, for this reason, Leaf Auth provides low-level helper methods that allow you build auth flows from the ground up. + +## Working with JWTs + +According to the [JWT docs](https://jwt.io/introduction), JSON Web Token (JWT) is an open standard (RFC 7519) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object. This information can be verified and trusted because it is digitally signed. JWTs can be signed using a secret (with the HMAC algorithm) or a public/private key pair using RSA or ECDSA. + +In authentication, you can use JWTs as an identifier that a user has successfully logged in. The JWT usually also contains information about the authenticated user, usually the user's id. Leaf auth has helpers for interacting with JWTs. We'll take a look at them in this document. + +## Generating JWTs + +Leaf provides multiple ways for generating JWTs. + +- ### Using the `generateSimpleToken` method + + The simplest method is to use the `generateSimpleToken` method on the `Leaf\Helpers\Authentication` class. This method takes in 3 parameters: + + - The user id of the currently authenticated user + - The jwt secret string + - The jwt expiry time in seconds + + ```php + use Leaf\Helpers\Authentication; + + // ... your application code + + Authentication::generateSimpleToken( + $userId, + 'MY_JWT_SECRET_STRING', + time() + 3600 + ); + ``` + +- ### Using the `generateToken` method + + The `generateToken` method on the `Leaf\Helpers\Authentication` class is a more advanced method for generating JWTs. It takes in 2 parameters: + + - An array of claims to be added to the JWT + - The JWT secret string + + ```php + use Leaf\Helpers\Authentication; + + // ... your application code + + Authentication::generateToken( + [ + 'user_id' => $userId, + 'iat' => time(), + 'iss' => 'localhost', + 'exp' => time() + 3600, + ], + 'MY_JWT_SECRET_STRING' + ); + ``` + +## Getting JWTs from the request + +Tokens from authenticated requests are usually sent in the `Authorization` header. Leaf Auth provides helpers that allow you directly pull in tokens from the request header. + +### Using the `getAuthorizationHeader` method + +Leaf Auth provides the `getAuthorizationHeader` helper method for getting the token from the request header. It returns null if no authorization header is found. + +```php +use Leaf\Helpers\Authentication; + +$header = Authentication::getAuthorizationHeader(); +``` + +### Using the `getBearerToken` method + +Leaf Auth provides the `getBearerToken` helper method for getting the token from the request header. It returns null if no bearer token is found. + +```php +use Leaf\Helpers\Authentication; + +$token = Authentication::getBearerToken(); +``` + +## Verifying JWTs + +Verifying JWTs is a very important step in the authentication process. Tokens can be tampered with, they can also expire, or be issued by an untrusted source. For this reason, you should always verify the token before using it. + +Leaf Auth provides 2 methods for verifying JWTs. + +- ### Using the `validateToken` method + +This method automatically checks if there is a token in the request header, and if there is, it verifies the token. It returns the decoded token if the token is valid, and returns false if the token is invalid. + +It takes in a single parameter, which is the JWT secret string. This secret string should be the same as the one used to generate the token. + +```php +use Leaf\Helpers\Authentication; + +$data = Authentication::validateToken($secret); +``` + +Note that this method will automatically return false if there is no token in the request header. You can use the `errors` method to get the error message which is why the token validation failed. + +```php +use Leaf\Helpers\Authentication; + +$data = Authentication::validateToken($secret); + +if (!$data) { + $errors = Authentication::errors(); +} +``` + +- ### Using the `validate` method + +Unlike the `validateToken` method, this method does not automatically check for a token in the request header. It takes in 2 parameters: + +- The token to be validated +- The JWT secret string + +```php +use Leaf\Helpers\Authentication; + +$token = Authentication::getBearerToken(); +$data = Authentication::validate($token, $secret); +``` + +Just like the `validateToken` method, this method returns the decoded token if the token is valid, and returns false if the token is invalid. You can use the `errors` method to get the error message which is why the token validation failed. + +```php +use Leaf\Helpers\Authentication; + +$token = Authentication::getBearerToken(); +$data = Authentication::validate($token, $secret); + +if (!$data) { + $errors = Authentication::errors(); +} +``` diff --git a/apps/docs/src/modules/auth/index.md b/apps/docs/src/modules/auth/index.md new file mode 100755 index 0000000..4547944 --- /dev/null +++ b/apps/docs/src/modules/auth/index.md @@ -0,0 +1,265 @@ +# Authentication + + + +Numerous web applications offer their users a means to authenticate and access the application by "logging in." Adding this functionality to web applications can be a challenging and potentially dangerous task. For this reason, Leaf provides a lightweight but very powerful authentication system known as Leaf Auth. + +Leaf Auth gives you clean and simple functions to handle complex authentication flows in a few lines of code. It is customizable to the core and allows for a bunch of configuration options that determine how it handles authentication in general. + +You can still handle authentication without using Leaf Auth, however, Leaf Auth is a more secure and reliable way to handle authentication in your apps. + +## Installing Leaf Auth + +You can install Leaf Auth using the Leaf CLI: + +```bash +leaf install auth +``` + +Or with composer: + +```bash +composer require leafs/auth +``` + +From there, you can link your database and start writing some awesome queries. + +## Database Considerations + +Leaf Auth doesn't give you any structure for your database, with that, you can structure your database in any way you prefer. However, there are some things you should note: + +### Database primary key + +By default, Leaf Auth assumes that your database primary key is `id`. If however, you have a database where you are using another field, say `admin_id` as the primary key, you will need to tell Leaf Auth the name of your primary key. You can do this using the `ID_KEY` config: + +
+ +```php +$auth = new Leaf\Auth; +$auth->config('ID_KEY', 'admin_id'); + +... +``` + +
+ +
+ +```php +auth()->config('ID_KEY', 'admin_id'); +``` + +
+ +### Database table + +By default, Leaf Auth assumes that you will save your users in a database table named `users`, this might however not be the case for your application. If you want to use a different table, you can configure Leaf Auth using `DB_TABLE`: + +
+ +```php +$auth = new Leaf\Auth; +$auth->config('DB_TABLE', 'admins'); + +... +``` + +
+ +
+ +```php +auth()->config('DB_TABLE', 'admins'); +``` + +
+ +## Database Connection + +After installing leaf auth, you would need to connect to a database. Leaf auth will search for users and add/update users in this database when a login/register or update operation is called. There are a couple of ways to connect to a database with leaf auth. + +### Manual Connection + +Leaf Auth provides a `connect()` method that allows you to connect to your database by passing in your database connection parameters. This is the most basic and straightforward way to connect to your database. + +
+ +```php +$auth = new \Leaf\Auth; + +// syntax +$auth->connect( + $host = '', + string $dbname = '', + string $user = '', + string $password = '' +); + +// example +$auth->connect('127.0.0.1', 'dbname', 'root', ''); +``` + +
+ +
+ +```php +// syntax +auth()->connect( + $host = '', + string $dbname = '', + string $user = '', + string $password = '' +); + +// example +auth()->connect('127.0.0.1', 'dbname', 'root', ''); +``` + +
+ +### Auto Connect + +Leaf Auth comes with an `autoConnect()` method that allows you to connect to your database using your environment variables. Most MVC frameworks and other libraries rely on a `.env` file for a lot of configuration including the database. With `autoConnect`, you can directly pick up these configs and create a connection from them. + +**example env:** + +```env +DB_CONNECTION=mysql +DB_HOST=127.0.0.1 +DB_PORT=3306 +DB_DATABASE=LeafMVC +DB_USERNAME=root +DB_PASSWORD= +``` + +Based on the example above, you can connect to your database using: + +
+ +```php +$auth = new Leaf\Auth; +$auth->autoConnect(); +``` + +
+ +
+ +```php +auth()->autoConnect(); +``` + +
+ +### PDO connection + +Leaf Auth also allows you to skip the entire connection process and share an existing PDO instance with leaf db. This allows you to gradually rewrite your existing apps with Leaf Auth without having multiple db connections and doing so at your own pace. + +
+ +```php +$db = new PDO('mysql:dbname=test;host=127.0.0.1', 'root', ''); +$auth = new Leaf\Auth; + +$auth->dbConnection($db); + +// you can use leaf auth the same way you always have +``` + +
+ +
+ +```php +$db = new PDO('mysql:dbname=test;host=127.0.0.1', 'root', ''); + +auth()->dbConnection($db); + +// you can use leaf auth the same way you always have +``` + +
+ +Leaf Db has been rewritten based on PDO, this also means that you can pass your leaf db connection into leaf auth directly. + +
+ +```php +$auth->dbConnection($db->connection()); +``` + +
+ +
+ +```php +auth()->dbConnection(db()->connection()); +``` + +### Leaf db (auth v2 + leaf 3 only) + +If you are using leaf auth in a leaf 3 app, you will have access to the auth global as shown in some of the above connections. Along with this, if you already have a leaf db connection, you no longer need to explicitly connect to your database. Leaf auth searches for a leaf db instance and connects to it automatically. + +```php +connect('127.0.0.1', 'dbname', 'username', 'password'); + +// you can use auth straight away without any connect +auth()->login(...); +``` + +## Functional Mode + +If you are using leaf auth v2 in a leaf 3 app, you will have access to the `auth` global which allows you to use Leaf Auth from anywhere in your entire application. You simply need to call `auth()` and leaf 3 will create and maintain a shared instance of Leaf auth which you can call from anywhere. + +This also means that you don't need to initialize leaf auth anymore. + +```php +autoConnect(); + +app()->get("/", function () { + // auth can be used here + // auth()->... +}); + +app()->run(); +``` + +Functional mode also makes the `guard`, `hasAuth` and `sessionUser` globals available to you from anywhere. + +### guard + +The guard method is a shortcut method for `Auth::guard()`. You can find the guards documentation [here](/modules/auth/session.html#guard). + +### hasAuth + +`hasAuth` returns a boolean which is whether there's an active user session or not. + +### sessionUser + +This method returns the active session user or null if there's no session user. + +
+ +## Next Steps + + diff --git a/apps/docs/src/modules/auth/login.md b/apps/docs/src/modules/auth/login.md new file mode 100644 index 0000000..45d1260 --- /dev/null +++ b/apps/docs/src/modules/auth/login.md @@ -0,0 +1,387 @@ +# Login + + + + +Building a login system is one of the most common tasks in web development, it can also be one of the most tedious. Leaf Auth provides a flexible and secure authentication system for your web apps and APIs that is simple and easy to use. + +## Auth Systems + +Leaf Auth provides two authentication systems: + +- Token based authentication +- Session based authentication + +These two systems are very similar, the only difference is that token based authentication uses tokens to authenticate users while session based authentication uses sessions to authenticate users. *Token based auth is used by default, but you can switch to session based authentication using the [Auth Config](/modules/auth/config#use-session).* + +### Token based authentication + +Token based authentication is a system where a user is given a token upon login. This token is then used to authenticate the user on every request. This is the most common authentication system for APIs. + +
+ New to Token Authentication? + +
+ +### Session based authentication + +Session based authentication is a system where a user is given a session upon login. This session is then used to authenticate the user on every request. This is the most common authentication system for web apps. + +
+ New to Session Authentication? + +
+ +## The login method + +Leaf auth provides a `login()` method used to authenticate users and create a session or token for them. The `login()` method takes in an array of data you want to use to authenticate the user. This data is usually the user's email and password. + +
+ +```php +$auth = new Leaf\Auth; +$auth->login([ + 'email' => 'm@example.com', + 'password' => 'password' +]); +``` + +
+
+ +```php +auth()->login([ + 'email' => 'm@example.com', + 'password' => 'password' +]); +``` + +
+ +This example uses the user's email and password to authenticate them. + +If the user is authenticated, a session or token is created for them and the user is returned. If the user is not authenticated, `null` is returned instead. You can use this to check if the user is authenticated or not. + +
+ +```php +$auth = new Leaf\Auth; +$data = $auth->login([ + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated +} else { + // user is not authenticated +} +``` + +
+ +
+ +```php +$data = auth()->login([ + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated +} else { + // user is not authenticated +} +``` + +
+ +To get the reason why the user is not authenticated, you can use the `errors()` method. This returns an array of errors that occured during authentication. + +
+ +```php{11} +$auth = new Leaf\Auth; +$data = $auth->login([ + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated +} else { + // user is not authenticated + $errors = $auth->errors(); +} +``` + +
+ +
+ +```php{10} +$data = auth()->login([ + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated +} else { + // user is not authenticated + $errors = auth()->errors(); +} +``` + +
+ +If the authentication was successful, the user is returned. You can use this to get the user's data. + +
+ +```php{9,10} +$auth = new Leaf\Auth; +$data = $auth->login([ + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated + $token = $data['token']; + $user = $data['user']; +} else { + // user is not authenticated + $errors = $auth->errors(); +} +``` + +
+ +
+ +```php{8,9} +$data = auth()->login([ + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated + $token = $data['token']; + $user = $data['user']; +} else { + // user is not authenticated + $errors = auth()->errors(); +} +``` + +
+ +## Normalizing user data + +The data from a successful login looks something like this: + +```php +[ + 'user' => [ + 'username' => 'mychi.darko', + 'email' => 'mychi@leafphp.dev', + 'created_at' => '2019-09-20 13:47:48' + ], + 'token' => 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE1NzYxMzUzMjgsImlzcyI6ImxvY2FsaG9zdCIsImV4cCI6MTU3NjEzNjIyOCwidXNlcklkIjoxfQ.7FODXGGJKioGQVX4ic0DJLoMIQTVUlsd4zFAJA4DAkg' +] +``` + +Even without knowing what our database look like, you can tell that the user ID and password are not included in the data. This is because Leaf Auth does not return sensitive data like passwords and user IDs. This is done to prevent sensitive data from being exposed. + +In some cases, you might need the user id returned at login. To do this, you need to configure Leaf Auth to expose the user id. You can do this by setting the `HIDE_ID` config to `false`. + +
+ +```php +$auth = new Leaf\Auth; + +$auth->config('HIDE_ID', false); + +... +``` + +
+ +
+ +```php +auth()->config('HIDE_ID', false); + +... +``` + +
+ +## Session based auth + +Leaf Auth uses token based authentication by default, but allows you to seamlessly switch to session based authentication by setting the `USE_SESSION` config to `true` or by using the `useSession()` method. + +
+ +```php +$auth = new Leaf\Auth; + +$auth->useSession(); + +... +``` + +
+ +
+ +```php +auth()->useSession(); + +... +``` + +
+ +Just like with token based authentication, you can use the `login()` method to authenticate users. The only difference is that the `login()` method creates a session for your user instead of just returning the user info and a token. It also automatically redirects you to a route defined as `GUARD_HOME` if you have the `SESSION_REDIRECT_ON_LOGIN` config set to `true`. + +
+ +```php +$auth = new Leaf\Auth; + +$auth->useSession(); +$auth->config('GUARD_HOME', '/home'); + +// will automatically redirect to /home if successful +$data = $auth->login([ + 'email' => $email, + 'password' => $password, +]); + +if (!$data) { + // you can pass the auth errors into a view + return $template->render('pages.auth.login', [ + 'errors' => auth()->errors(), + 'email' => $email, + 'password' => $password, + ]); +} +``` + +
+ +
+ +```php +auth()->useSession(); +auth()->config('GUARD_HOME', '/home'); + +// will automatically redirect to /home if successful +$user = auth()->login([ + 'email' => $email, + 'password' => $password +]); + +if (!$user) { + // you can pass the auth errors into a view + return $template->render('pages.auth.login', [ + 'errors' => auth()->errors(), + 'email' => $email, + 'password' => $password, + ]); +} +``` + +
+ +For more information on session based authentication, check out the [session based authentication](/modules/auth/session) page. + +## Session lifetime + +Session lifetime is the amount of time a session is valid for. This is usually set to a few minutes or hours. Leaf Auth allows you to set the session lifetime using the `SESSION_LIFETIME` config. This config is set to `1 day` by default. + +You can set the session lifetime using seconds or a string that can be parsed by the [PHP `strtotime()`](https://www.php.net/manual/en/function.strtotime.php) function. + +
+ +```php +$auth = new Leaf\Auth; + +$auth->config('SESSION_LIFETIME', '1 hour'); +$auth->config('SESSION_LIFETIME', 3600); +``` + +
+ +
+ +```php +auth()->config('SESSION_LIFETIME', '1 hour'); +auth()->config('SESSION_LIFETIME', 3600); +``` + +
+ +If you set the session lifetime to `0`, the session will never expire. + +
+ +```php +$auth = new Leaf\Auth; + +$auth->config('SESSION_LIFETIME', 0); +``` + +
+ +
+ +```php +auth()->config('SESSION_LIFETIME', 0); +``` + +
+ +## Token lifetime + +Token lifetime is the amount of time a token is valid for. This is usually set to a few minutes or hours. Leaf Auth allows you to set the token lifetime using the `TOKEN_LIFETIME` config. + +
+ +```php +$auth = new Leaf\Auth; + +$auth->config('TOKEN_LIFETIME', 3600); +``` + +
+ +
+ +```php +auth()->config('TOKEN_LIFETIME', 3600); +``` + +
+ +## Password Encoding + +Leaf Auth uses the [Leaf Password Helper](/modules/password/) to encode passwords. It supports the most popular password encoding algorithms including `bcrypt`, `argon2i` and `md5`. You can still use your own password encoder by updating the [`PASSWORD_VERIFY`](/modules/auth/config.html#password-verify) config. + +::: tip Custom Password Encoder +In case you want to use your own password verification method, your method must return `true` if the password is correct and `false` if the password is incorrect. +::: diff --git a/apps/docs/src/modules/auth/mvc.md b/apps/docs/src/modules/auth/mvc.md new file mode 100644 index 0000000..d58865c --- /dev/null +++ b/apps/docs/src/modules/auth/mvc.md @@ -0,0 +1,17 @@ +# Usage with Leaf MVC + +Leaf MVC and Leaf API both come with built-in support for Leaf Auth. This means you can skip the initial setup and get right into using Leaf Auth. To get started, head over to your `public/index.php` file and uncomment the following line: + +```php +\Leaf\Database::initDb(); +``` + +This will allow Leaf Auth to use your database connection set up in your `.env` file. If you don't have a database connection set up, you can set one up by following the [Leaf MVC Database docs](/docs/leafmvc/). + +## Auth config + +Once your database connection is set up, you can pretty much start using Leaf Auth. However, you can also set up your auth config in your `config/auth.php` file. This allows you to control Leaf Auth's behaviour. You can find a list of all available config options [here](/modules/auth/config). + +## Usage + +From this point on, you can use Leaf Auth as you would normally. You can find the full docs [here](/modules/auth/). diff --git a/apps/docs/src/modules/auth/protecting-your-routes.md b/apps/docs/src/modules/auth/protecting-your-routes.md new file mode 100644 index 0000000..fa854ab --- /dev/null +++ b/apps/docs/src/modules/auth/protecting-your-routes.md @@ -0,0 +1,297 @@ +# Protected Routes + +One of the most common use cases for authentication is protecting certain routes from being accessed by unauthorized users. Most authentication systems use a "guard" to authenticate and authorize users. While this is good, Leaf tries as much as possible to make your life easier by providing a simpler way to deal with protected routes in your app. + +## The `user` method + +The `user()` method is a simple way to check if a user is logged in. It returns the currently logged in user if an authenticated user is found and `null` if a user is not logged in. + +This works for both session and token based authentication. In case of token based authentication, Leaf Auth will also check if the token is valid. If it is, the user is returned, if not, `null` is returned. You can get the reason for the authentication failure by calling the `errors()` method. + +
+ +```php{3,8} +$auth = new Leaf\Auth; + +$user = $auth->user(); + +if ($user) { + // user is logged in +} else { + // user is not logged in + $errors = $auth->errors(); +} +``` + +
+ +
+ +```php{1,7} +$user = auth()->user(); + +if ($user) { + // user is logged in +} else { + // user is not logged in + $errors = auth()->errors(); +} +``` + +
+ +Using this method, you can easily protect your routes by checking if a user is logged in. If a user is not logged in, you can redirect them to the login page or return a 401 error. Here's an example: + +
+ +```php +$app->get('/protected', function () use($app, $auth) { + $user = $auth->user(); + + if ($user) { + // user is logged in + } else { + // user is not logged in + $app->response()->redirect('/login'); + } +}); +``` + +
+ +
+ +```php +app()->get('/protected', function () { + $user = auth()->user(); + + if ($user) { + // user is logged in + } else { + // user is not logged in + response()->redirect('/login'); + } +}); +``` + +
+ +For API routes, you can return a 401 error if a user is not logged in. + +
+ +```php +$app->get('/protected', function () use($app, $auth) { + $user = $auth->user(); + + if ($user) { + // user is logged in + } else { + // user is not logged in + $app->response()->json([ + "error" => "Unauthorized", + "data" => $auth->errors(), + ], 401); + } +}); +``` + +
+ +
+ +```php +app()->get('/protected', function () { + $user = auth()->user(); + + if ($user) { + // user is logged in + } else { + // user is not logged in + response()->json([ + "error" => "Unauthorized", + "data" => auth()->errors(), + ], 401); + } +}); +``` + +
+ +## The `id` method + +The `id()` method returns the id of the currently logged in user. This is useful when you need to get the id of the currently logged in user. + +It works exactly like the `user()` method above, except it returns the id of the user instead of the user object. + +
+ +```php +$app->get('/protected', function () use($app, $auth) { + $id = $auth->id(); + + if ($id) { + // user is logged in + } else { + // user is not logged in + $app->response()->redirect('/login'); + } +}); +``` + +
+ +
+ +```php +app()->get('/protected', function () { + $id = auth()->id(); + + if ($id) { + // user is logged in + } else { + // user is not logged in + response()->redirect('/login'); + } +}); +``` + +
+ +## Using middleware + +Leaf allows you to define behaviour for your routes using middleware. The latest update to the Leaf Router allows you to define named middleware. This means you can define a middleware once and use it on multiple routes. + +Using named middleware, you can easily protect your routes by defining a middleware that checks if a user is logged in and use it on the routes/groups you want to protect. + +
+ +```php +$app->registerMiddleware('auth', function () use($app, $auth) { + $user = $auth->user(); + + if (!$user) { + // user is not logged in + $app->response()->exit([ + 'error' => 'Unauthorized', + 'data' => $auth->errors(), + ], 401); + } +}); + +$app->get('/protected', ['middleware' => 'auth', function () use($app, $auth) { + // user is logged in +}]); + +$app->group(['middleware' => 'auth', function () use($app, $auth) { + $app->get('/protected', function () use($app, $auth) { + // user is logged in + }); + + $app->get('/protected2', function () use($app, $auth) { + // user is logged in + }); +}]); +``` + +
+ +
+ +```php +app()->registerMiddleware('auth', function () { + $user = auth()->user(); + + if (!$user) { + // user is not logged in + response()->exit([ + 'error' => 'Unauthorized', + 'data' => auth()->errors(), + ], 401); + } +}); + +app()->get('/protected', ['middleware' => 'auth', function () { + // user is logged in +}]); + +app()->group('/group', ['middleware' => 'auth', function () { + app()->get('/protected', function () { + // user is logged in + }); + + app()->get('/protected2', function () { + // user is logged in + }); +}]); +``` + +
+ +Using this method, you can easily define custom behaviour for your protected routes without having to repeat yourself. + +## Session Guard + +All the methods above work for both session and token based authentication. However, Leaf Auth also provides a session guard that automatically handles redirects and other session based authentication behaviour. + +The `guard()` method has 2 middleware provided automatically: `guest` and `auth`. + +The `guest` middleware checks if a user is logged in. If a user is logged in, they are redirected to the `GUARD_HOME` page. If a user is not logged in, they are allowed to continue. + +The `auth` middleware checks if a user is logged in. If a user is logged in, they are allowed to continue. If a user is not logged in, they are redirected to the `GUARD_LOGIN` page. + +
+ +```php +$auth = new Leaf\Auth; + +$auth->config([ + 'GUARD_HOME' => '/dashboard', + 'GUARD_LOGIN' => '/login', +]); + +$app->get('/protected', function () use($app, $auth) { + // will redirect to /login if user is not logged in + $auth->guard('auth'); + + // user is logged in +}); + +$app->get('/login', function () use($app, $auth) { + // will redirect to /dashboard if user is logged in + $auth->guard('guest'); + + // user is not logged in +}); +``` + +
+ +
+ +```php +auth()->config([ + 'GUARD_HOME' => '/dashboard', + 'GUARD_LOGIN' => '/login', +]); + +app()->get('/protected', function () { + // will redirect to /login if user is not logged in + auth()->guard('auth'); + + // user is logged in +}); + +app()->get('/login', function () { + // will redirect to /dashboard if user is logged in + auth()->guard('guest'); + + // user is not logged in +}); +``` + +
+ +## Next Steps + +There are still a few more useful session based authentication methods that Leaf Auth provides. You can check them out in the [Leaf Auth Session docs](/modules/auth/session). diff --git a/apps/docs/src/modules/auth/session.md b/apps/docs/src/modules/auth/session.md new file mode 100644 index 0000000..6de48fe --- /dev/null +++ b/apps/docs/src/modules/auth/session.md @@ -0,0 +1,104 @@ +# Session support + + + +We've covered session support and it's use in various techniques like login, register, etc. But there are still a bunch of session auth methods that we haven't covered yet. Let's get into them. + +## Enabling sessions + +To get started with session support, just set the `USE_SESSION` config to true. + +```php +auth()->config('USE_SESSION', true); +``` + +A much simpler way would be to simply call the `useSession` method. + +```php +auth()->useSession(); +``` + +## guard + +We covered guards in-depth in the [protecting your routes](/modules/auth/protecting-your-routes) section. You can use guards to check if a user is logged in or not. + +```php +auth()->guard('auth'); + +// or + +Leaf\Auth::guard('auth'); + +// guest route redirects to home +// route if you're logged in +Leaf\Auth::guard('guest'); +``` + +::: tip The guard method +You can directly run a guard on the `guard` method. + +```php +guard('guest'); +``` + +::: + +## length + +With `length()`, you can get how long a user has been logged in. You can save the session time logs to your database in order to track users' login logs. The available logs are `SESSION_STARTED_AT` and `SESSION_LAST_ACTIVITY` which are automatically tracked by Leaf. + +```php +$sessionDuration = auth()->length(); +``` + +## lastActive + +`lastActive` allows you to get how much time has passed since the last session activity. + +```php +$userLastSeen = auth()->lastActive(); +``` + +## refresh + +As the name implies, you can refresh the session with this method. Refreshing sort of restarts the session, but you can keep the user's old session data if you wish to. + +```php +if ($newAccountAdded) { + // will delete old session data + Leaf\Auth::refresh(); +} else { + // will keep session data + auth()->refresh(false);s +} +``` + +## status + +::: danger Deprecated +This method is deprecated and will be removed in the next major release. Use `user()` instead. +::: + +`status` checks whether a user session is ongoing by looking for keys specific to Leaf session auth so it doesn't confuse a Leaf auth session with user defined sessions. Returns the user if a session is found and false if there's no session found. + +```php +if (auth()->status()) { + return 'logged in'; +} else { + return 'guest mode'; +} +``` + +## logout + +Of course we'll need a method to logout/end our session. This is just the method for that. + +```php +auth()->logout(); +``` + +You can also pass in a route to redirect to after logging out. + +```php +auth()->logout('/home'); +``` diff --git a/apps/docs/src/modules/auth/signup.md b/apps/docs/src/modules/auth/signup.md new file mode 100644 index 0000000..7f4f4ee --- /dev/null +++ b/apps/docs/src/modules/auth/signup.md @@ -0,0 +1,421 @@ +# Register + + + + +Leaf Auth provides a flexible and secure authentication system for your web apps and APIs that is simple and easy to use. It allows you to quickly create a complete signup system for your app. + +## Auth Systems + +Leaf Auth provides two authentication systems: + +- Token based authentication +- Session based authentication + +These two systems are very similar, the only difference is that token based authentication uses tokens to authenticate users while session based authentication uses sessions to authenticate users. *Token based auth is used by default, but you can switch to session based authentication using the [Auth Config](/modules/auth/config#use-session).* + +### Token based authentication + +Token based authentication is a system where a user is given a token upon login. This token is then used to authenticate the user on every request. This is the most common authentication system for APIs. + +
+ New to Token Authentication? + +
+ +### Session based authentication + +Session based authentication is a system where a user is given a session upon login. This session is then used to authenticate the user on every request. This is the most common authentication system for web apps. + +
+ New to Session Authentication? + +
+ +::: tip Defaults +Token based auth is used by default, but you can switch to session based authentication using the [Auth Config](/modules/auth/config#use-session). +::: + +## The register method + +Leaf auth provides a `register()` method used to sign users up and create a session or token for them. The `register()` method takes in an array of data you want to use to authenticate the user and a list of items that should be unique to users, like email and username. + +
+ +```php +$auth = new Leaf\Auth; +$auth->register([ + 'username' => 'example', + 'email' => 'm@example.com', + 'password' => 'password' +]); +``` + +
+
+ +```php +auth()->register([ + 'username' => 'example', + 'email' => 'm@example.com', + 'password' => 'password' +]); +``` + +
+ +This example creates a new user with the username `example`, email `m@example.com` and password `password` in your database. The `register()` method then returns the user's data or session if the registration was successful. If the registration was not successful, `null` is returned instead. + +
+ +```php +$auth = new Leaf\Auth; +$data = $auth->register([ + 'username' => 'example', + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated +} else { + // user is not authenticated +} +``` + +
+ +
+ +```php +$data = auth()->register([ + 'username' => 'example', + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated +} else { + // user is not authenticated +} +``` + +
+ +To get the reason why the user is not authenticated, you can use the `errors()` method. This returns an array of errors that occured during authentication. + +
+ +```php{12} +$auth = new Leaf\Auth; +$data = $auth->register([ + 'username' => 'example', + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated +} else { + // user is not authenticated + $errors = $auth->errors(); +} +``` + +
+ +
+ +```php{11} +$data = auth()->register([ + 'username' => 'example', + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated +} else { + // user is not authenticated + $errors = auth()->errors(); +} +``` + +
+ +If the authentication was successful, the user is returned. You can use this to get the user's data. + +
+ +```php{10,11} +$auth = new Leaf\Auth; +$data = $auth->register([ + 'username' => 'example', + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated + $token = $data['token']; + $user = $data['user']; +} else { + // user is not authenticated + $errors = $auth->errors(); +} +``` + +
+ +
+ +```php{9,10} +$data = auth()->register([ + 'username' => 'example', + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if ($data) { + // user is authenticated + $token = $data['token']; + $user = $data['user']; +} else { + // user is not authenticated + $errors = auth()->errors(); +} +``` + +
+ +## Unique items + +The `register()` method takes in a list of items that should be unique to users. This is used to check if the user already exists in the database. If the user already exists, the `register()` method returns `null` and the reason why the user is not authenticated can be gotten using the `errors()` method. + +
+ +```php{12} +$auth = new Leaf\Auth; +$data = $auth->register([ + 'username' => 'example', + 'email' => 'm@example.com', + 'password' => 'password' +], ['username', 'email']); + +if ($data) { + // user is authenticated +} else { + // user is not authenticated + $errors = $auth->errors(); +} +``` + +
+ +
+ +```php{11} +$data = auth()->register([ + 'username' => 'example', + 'email' => 'm@example.com', + 'password' => 'password' +], ['username', 'email']); + +if ($data) { + // user is authenticated +} else { + // user is not authenticated + $errors = auth()->errors(); +} +``` + +
+ +The code above checks if someone with the username `example` or email `m@example.com` already exists in the database. If they do, the `register()` method returns `null` and the reason why the user is not authenticated can be gotten using the `errors()` method. + +## Normalizing user data + +The data from a successful sign up looks something like this: + +```php +[ + 'user' => [ + 'username' => 'example', + 'email' => 'm@example.com', + 'created_at' => '2019-09-20 13:47:48' + ], + 'token' => 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE1NzYxMzUzMjgsImlzcyI6ImxvY2FsaG9zdCIsImV4cCI6MTU3NjEzNjIyOCwidXNlcklkIjoxfQ.7FODXGGJKioGQVX4ic0DJLoMIQTVUlsd4zFAJA4DAkg' +] +``` + +The user ID and password are not included in the data. This is because Leaf Auth does not return sensitive data like passwords and user IDs. This is done to prevent sensitive data from being exposed. + +In some cases, you might need the user id returned at sign up. To do this, you need to configure Leaf Auth to expose the user id. You can do this by setting the `HIDE_ID` config to `false`. + +
+ +```php +$auth = new Leaf\Auth; + +$auth->config('HIDE_ID', false); + +... +``` + +
+ +
+ +```php +auth()->config('HIDE_ID', false); + +... +``` + +
+ +## Password Encoding + +Leaf Auth uses the [Leaf Password Helper](/modules/password/) to encode passwords. It supports the most popular password encoding algorithms including `bcrypt`, `argon2i` and `md5`. You can still use your own password encoder by updating the [`PASSWORD_ENCODE`](/modules/auth/config.html#password-encode) config. + +::: tip Custom Password Encoder +In case you want to use your own password encoder, your method must return the encoded password. +::: + +## Session based auth + +Leaf Auth uses token based authentication by default, but allows you to seamlessly switch to session based authentication by setting the `USE_SESSION` config to `true` or by using the `useSession()` method. + +
+ +```php +$auth = new Leaf\Auth; + +$auth->useSession(); + +... +``` + +
+ +
+ +```php +auth()->useSession(); + +... +``` + +
+ +Just like with token based authentication, you can use the `register()` method to authenticate users. The only difference is that the `register()` method redirects you to a route defined as `GUARD_HOME` with a new session or redirects to `GUARD_LOGIN` if you have the `SESSION_ON_REGISTER` config set to `false`. + +
+ +```php +$auth = new Leaf\Auth; + +$auth->useSession(); +$auth->config('GUARD_HOME', '/home'); + +// will automatically redirect to /home if successful +$user = $auth->register([ + 'username' => 'example', + 'email' => 'm@example.com', + 'password' => 'password' +]); + +if (!$user) { + // you can pass the auth errors into a view + return $template->render('pages.auth.login', [ + 'errors' => auth()->errors(), + 'username' => $username, + 'password' => $password, + ]); +} +``` + +
+ +
+ +```php +auth()->useSession(); +auth()->config('GUARD_HOME', '/home'); + +// will automatically redirect to /home if successful +$user = auth()->register([ + 'username' => $username, + 'email' => $email, + 'password' => $password +]); + +if (!$user) { + // you can pass the auth errors into a view + return $template->render('pages.auth.register', [ + 'errors' => auth()->errors(), + 'username' => $username, + 'email' => $email, + 'password' => $password, + ]); +} +``` + +
+ +## Session on register + +Some authentication systems require you to log in right after creating an account. This means that you won't start a session until the user logs in. You can implement this by setting the `SESSION_ON_REGISTER` config to `false`. + +
+ +```php +$auth = new Leaf\Auth; + +$auth->useSession(); + +// set your login route...default is /auth/login +$auth->config('GUARD_LOGIN', '/login'); + +// set your home route...default is /home +$auth->config('GUARD_HOME', '/dashboard'); + +// Redirect to GUARD_LOGIN after auth +$auth->config('SESSION_ON_REGISTER', false); + +// Login automatically after registration and redirect to GUARD_HOME +$auth->config('SESSION_ON_REGISTER', true); +``` + +
+ +
+ +```php +auth()->useSession(); + +// set your login route...default is /auth/login +auth()->config('GUARD_LOGIN', '/login'); + +// set your home route...default is /home +auth()->config('GUARD_HOME', '/dashboard'); + +// Redirect to GUARD_LOGIN after auth +auth()->config('SESSION_ON_REGISTER', false); + +// Login automatically after registration and redirect to GUARD_HOME +auth()->config('SESSION_ON_REGISTER', true); +``` + +
diff --git a/apps/docs/src/modules/auth/update.md b/apps/docs/src/modules/auth/update.md new file mode 100755 index 0000000..94f8556 --- /dev/null +++ b/apps/docs/src/modules/auth/update.md @@ -0,0 +1,128 @@ +# User update + +In addition to the `register()` and `login()` methods, Leaf Auth also provides a `update()` method which allows you to update a user's information. This method takes in 2 parameters: + +- The data to update +- Unique values (optional) + +
+ +```php +// data to update +$data = $app->request()->get(['username', 'email']); +$user = $auth->update($data); +``` + +
+ +
+ +```php +// data to update +$data = request()->get(['username', 'email']); +$user = auth()->update($data); +``` + +
+ +The example above updates the user's username and email with the values passed in the request. Leaf Auth automatically gets the user id from the session or token and updates the user with the data passed. This means that there should be a session or token present in the request. + +If there is no session or token present in the request, the `update()` method will return `null`. You can get the errors using the `errors()` method and handle it however you want. + +
+ +```php +// data to update +$data = $app->request()->get(['username', 'email']); +$user = $auth->update($data); + +if (!$user) { + $errors = $auth->errors(); + // handle errors +} +``` + +
+ +
+ +```php +// data to update +$data = request()->get(['username', 'email']); +$user = auth()->update($data); + +if (!$user) { + $errors = auth()->errors(); + // handle errors +} +``` + +
+ +## Unique values + +Just like the `register()` method, the `update()` method also takes in a second parameter which is an array of unique values. This is used to check if the user's new credentials are unique. If the user's new credentials are not unique, the `update()` method will return `null` and you can get the errors using the `errors()` method. Note that unique values in the `update()` method exclude the current user. + +
+ +```php +// data to update +$data = $app->request()->get(['username', 'email']); + +// unique values +$uniques = ['username', 'email']; + +$user = $auth->update($data, $uniques); + +if (!$user) { + $errors = $auth->errors(); + // handle errors +} +``` + +
+ +
+ +```php +// data to update +$data = request()->get(['username', 'email']); + +// unique values +$uniques = ['username', 'email']; + +$user = auth()->update($data, $uniques); + +if (!$user) { + $errors = auth()->errors(); + // handle errors +} +``` + +
+ +## Session support + +When a user is updated in the database, the change is also reflected in the active session and the updated user is also returned. This means that you can use the `update()` method to update a user's information and also update the session with the new information. *Just be sure to turn on session based auth in the auth config.* + +
+ +```php +$auth = new Leaf\Auth; + +$auth->config("USE_SESSION", true); + +... +``` + +
+ +
+ +```php +auth()->config("USE_SESSION", true); + +... +``` + +
diff --git a/apps/docs/src/modules/auth/v/1/index.md b/apps/docs/src/modules/auth/v/1/index.md new file mode 100755 index 0000000..8ed3ead --- /dev/null +++ b/apps/docs/src/modules/auth/v/1/index.md @@ -0,0 +1,775 @@ +--- +title: "Auth v1" +--- + + +# ✨ Leaf Simple Auth + +Simple auth is a module which takes away the pain involved with anything authentication related: logins, signups, updating users, tokens, ... The main focus of simple auth is to allow you do all of the above in nothing more than one line of code (unless of course you include customizations for how these features work). + +You can install auth through composer or leaf cli. + +```bash +composer require leafs/auth v1.1.2 +``` + +or + +```bash +leaf install auth@1.1.2 +``` + +::: warning Note that +Leaf auth has gone through a complete rewrite. Although it works the same way, features like sessions are used a bit differently. Read the changes section below for more info. +::: + +## Usage + +The first thing to do is to connect to your database. Leaf Auth will need to search for users in your database to perform auth checks on. + +To connect to your database, you can add your db credentials in `connect` or use `autoConnect` if you've already configured your database in your `.env` file. + +```php +use Leaf\Auth; + +Auth::connect("host", "user", "password", "dbname"); +// or +Auth::autoConnect(); +``` + +::: tip Functional Mode ⚡️ +Just as with other leaf modules, Leaf auth is able to extend leaf 3's functional mode to allow you easily and quickly handle authentication in your apps without having to use length namespaces and classes. + +Leaf auth provides the `auth` function which we will be using in the below code. + +**Getting started:** + +To get started with functional mode in leaf auth, you simply need to call the `auth` method. + +```php +auth()->connect("127.0.0.1", "root", "", "dbName"); +``` + +From there, you can do anything you want to with the auth method. Just as with the leaf core library itself, you no longer even need to initialize leaf auth. + +::: + +## Auth Config + +Auth Config was added in v2.4.0-beta to give you more control over how leaf handles authentication in your apps. Auth has been configured perfectly for most apps, but not all use cases are the same, hence, this brilliant addition. + +This also includes various configurations for doing things like: + +- Setting custom token lifetime +- Hiding/Showing user fields +- Adding/removing default timestamps +- Changing the default password key +- Setting custom password encode methods +- Turning off password encoding totally +- Setting custom password verify methods +- Hiding/Showing password field +- Adding custom validation messages +- Turning off experimental feature warnings (NEW) +- Configuring tokens + +### config + +To set a config variable, you can simply call the `config` method. + +```php +auth()->config("item", "value"); +``` + +You can also pass in an array to set multiple configs at once: + +```php +auth()->config([ + "item" => "value", + "item2" => "value" +]); +``` + +### Settings + +Below is a list of all available settings. + +### USE_TIMESTAMPS + +This determines whether Leaf should add the default `created_at` and `updated_at` timestamps on register and update. Default is `true`. + +### PASSWORD_ENCODE + +*This setting has gone through a lot of changes since v2.4 beta, and may not work exactly the same way*. This setting is run when leaf wants to encode a password. It now uses `PASSWORD_DEFAULT` by defaullt for encryption. + +```php +// This turns off password encoding +auth()->config("PASSWORD_ENCODE", false); + +// defult encoding (Leaf\Helpers\Password::hash) +auth()->config("PASSWORD_ENCODE", null); + +// use md5. We're still keeping support for md5 :-) +auth()->config("PASSWORD_ENCODE", Password::MD5); + +// use custom method +auth()->config("PASSWORD_ENCODE", function ($password) { + return Password::hash($password); +}); +``` + +### PASSWORD_VERIFY + +This setting is called when Leaf tries to verify a password. It works just like `PASSWORD_ENCODE` above. + +```php +// This turns off password encoding +auth()->config("PASSWORD_VERIFY", false); + +// defult encoding (Leaf\Helpers\Password::hash) +auth()->config("PASSWORD_VERIFY", null); + +// use md5. We're still keeping support for md5 :-) +auth()->config("PASSWORD_VERIFY", Password::MD5); + +// use custom method +auth()->config("PASSWORD_VERIFY", function ($password) { + return Password::verify($password); +}); +``` + +### PASSWORD_KEY + +This allows you to change the password field name, maybe yours is passcode? This tells leaf to look for a user's password in that field. The example below tells leaf to search for passwords in the `passcode` column. (the default field is password) + +```php +auth()->config("PASSWORD_KEY", "passcode"); +``` + +### ID_KEY + +`ID_KEY` allows you to set your primary key name. For instance, you might have used `_id` instead of `id`. This setting allows you to quickly and effectively switch your key name. + +```php +auth()->config("ID_KEY", "_id"); +``` + +### USE_UUID + +This simply allows you to set the value for user ids on your own. This is done in order to add support for UUIDs in your registrations and not go with the default SQL increments. + +```php +auth()->config("USE_UUID", UUID::v4()); +``` + +### HIDE_ID + +This is a boolean which determines whether to hide the id in the user object returned on login/register. Default is `true`. + +### AUTH_NO_PASS + +This allows you to *manually* tell leaf auth that no password is required for authentication. When this is set to true, leaf auth will assume there is no password and act accordingly. If there is no password field set in the credentials passed into the `login` or `register` methods, leaf auth will automatically set this to `true`. + +### HIDE_PASSWORD + +Just as the name implies, allows you to hide or show the password in the final results returned from auth. Default is `true`. + +### LOGIN_PARAMS_ERROR + +This is the error to show if there's an error with any parameter which isn't the password eg: username: + +```php +auth()->config("LOGIN_PARAMS_ERROR", "Username is incorrect!"); +``` + +Default is `Incorrect credentials!`. + +### LOGIN_PASSWORD_ERROR + +This is the error to show if there's an error with the password. + +Default is `Password is incorrect!`. + +```php +auth()->config("LOGIN_PASSWORD_ERROR", "Password is incorrect!"); +``` + +### USE_SESSION + +Use session based authentication instead of the default JWT based auth. Without this setting enbled, you can't use any of the session methods below. Default is `false`. + +### SESSION_ON_REGISTER + +If true, a session will be created on a successful registration, else you it'll be created on login rather. Default is `false`. + +### GUARD_LOGIN + +The page route. Default is `/auth/login`. + +### GUARD_REGISTER + +The register page route. Default is `/auth/register`. + +### GUARD_LOGOUT + +Logout route handler. Default is `/auth/logout`. + +### GUARD_HOME + +Home page route. Default is `/home`. + +### SAVE_SESSION_JWT + +Add an auth token to the auth session? This allows you save a generated JWT to the session. You might want to use this if you want to extend your app into an API. Default is `false`. + +### EXPERIMENTAL_WARNINGS + +This option controls whether to show/hide experimental warnings from session components. Default is `true`. Turning this off allows you to use guards for JWT auth. + +### TOKEN_LIFETIME + +How long the token can be used before it expires. Default is 1 day. + +### TOKEN_SECRET + +This is the secret key used to generate tokens for users on signup and register. + +::: danger Leaf Auth Refactor 🔥 +The leaf auth module has been broken up into subclasses for easier use and performance reasons. If you only use login and signup, there's no need to include a class with tons of features that you may not use. + +This doesn't change the way leaf auth works as this was done for performance and maintainability reasons. You can still use the auth class just as done in Leaf 2, however, this has been optimized using static methods which means unnecessary code will not be run. + +```php +Leaf\Auth::session(); +``` + +::: + +## Session support + +::: tip Leaf Auth Session +Session has been moved into a sub class for easier management. To use auth session methods, you now have to use the `Leaf\Auth\Session` class. + +```php +Leaf\Auth\Session::init(); +``` + +This doesn't affect the use of the auth class, since it works just as it did in earlier versions. +::: + +Session based authentication as the name implies creates and manages a session during the authentication to manage the user's logged in state. And all of this is done in 1 or 2 lines of code to maintain the simplicity and flexibility Leaf auth has always given. + +To get started with session support, just set the `USE_SESSION` setting to true. + +```php +auth()->config("USE_SESSION", true); +``` + +A much simpler way would be to simply call the `useSession` method. + +```php +auth()->useSession(); +``` + +## Session methods + +Enabling session support allows you to use some special methods and behaviours which are not available with the regular JWT authentication. + +### guard + +The guard method works sort of like authentication middleware. It takes in a single param, an array holding the authentication state or the type of guard to load up. + +```php +Leaf\Auth\Session::guard(["hasAuth" => true]); + +// or + +Leaf\Auth\Session::guard("auth"); + +// guest route redirects to home +// route if you're logged in +Leaf\Auth\Session::guard("guest"); +``` + +This is a lot easier with functional mode + +```php +auth()->guard("guest"); +``` + +::: tip The auth function +Besides returning the auth object, you can also directly run a guard on the auth method. + +```php +auth("guest"); +``` + +::: + +### save + +This method is used to save data to the auth session. + +```php +Leaf\Auth\Session::save("rememberLogin", false); + +// You can add multiple vars +Leaf\Auth\Session::save([ + "rememberLogin" => false, + "sessionActivity" => "login" +]); +``` + +As usual, this is easier with the auth class or with functional mode + +```php +auth()->save("rememberLogin", false); +``` + +### length + +With length, you can get how long a user has been logged in. You can save the session time logs to your database in order to track users' login logs. The available logs are `SESSION_STARTED_AT` and `SESSION_LAST_ACTIVITY` which are automatically tracked by Leaf. + +```php +// LoginsDB is a user defined method to save a login log + +// ... +LoginsDB::params( + "logged_in_at", + date("D, d M Y H:i:s", Leaf\Auth\Session::length()), +); + +LoginsDB::save(); +``` + +Or with functional mode + +```php +auth()->sessionLength(); +``` + +### lastActive + +lastActive allows you to get how much time has passed since the last session activity. + +```php +$userLastSeen = Leaf\Auth\Session::lastActive(); +``` + +### refresh + +As the name implies, you can refresh the session with this method. Refreshing sort of restarts the session, but you can keep the user's old session data if you wish to. + +```php +if ($newAccountAdded) { + // will delete old session data + Leaf\Auth\Session::refresh(); +} else { + // will keep session data + Leaf\Auth\Session::refresh(false); +} +``` + +### status + +`status` checks whether a user session is ongoing by looking for keys specific to Leaf session auth so it doesn't confuse a Leaf auth session with user defined sessions. Returns true if a session is found and false if there's no session found. + +```php +if (Leaf\Auth\Session::status()) { + return "logged in"; +} else { + return "guest mode"; +} +``` + +or with functional mode + +```php +if (auth()->session()) { + return "logged in"; +} else { + return "guest mode"; +} +``` + +### end + +Of course we'll need a method to logout/end our session. This is just the method for that. + +```php +Leaf\Auth\Session::end(); +``` + +Or with functional mode + +```php +auth()->endSession(); +``` + +## Authentication methods + +### login + +Login is used to create a simple, secure user login. It takes in a table to search for users and a set of parameters for the login. + +```php +$user = Leaf\Auth::login("users", [ + "username" => "mychi.darko", + "password" => md5("test") +]); +``` + +::: tip LOGIN CLASS +Leaf auth now allows you to use logins with the new `Leaf\Auth\Login` class. This will allows you to import only the login functionality without actually going through the whole auth class. + +```php +$user = Leaf\Auth\Login::user("users", [ + "username" => "mychi.darko", + "password" => md5("test") +]); +``` + +::: + +You can also use functional mode: + +```php +$user = auth()->login("users", [ + "username" => "mychi.darko", + "password" => md5("test") +]); +``` + +If the user is successfully found, the user data is returned, if not, `null` is returned. You can get any error by calling the `errors` method. + +```php +$user = auth()->login("users", [ + "username" => "mychi.darko", + "password" => md5("test") +]); // returns null if failed + +if (!$user) { + response()->throwErr(Leaf\Auth::errors()); +} +``` + +example success response: +**Note that the password and id fields are removed**. You can control whether fields should be hidden from the returned value in the Auth settings. + +```php +[ + "user" => [ + "username" => "mychi.darko", + "email" => "mychi@leafphp.dev", + "created_at" => "2019-09-20 13:47:48" + ], + "token" => "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE1NzYxMzUzMjgsImlzcyI6ImxvY2FsaG9zdCIsImV4cCI6MTU3NjEzNjIyOCwidXNlcklkIjoxfQ.7FODXGGJKioGQVX4ic0DJLoMIQTVUlsd4zFAJA4DAkg" +] +``` + +#### session support + +Login received session support which allows login to create a session instead of returning aa JWT as done by default. To get started with session, just set the `USE_SESSION` setting or call the `init` method on auth session. + +```php +Leaf\Auth\Session::init(); + +Leaf\Auth::login("users", [ + "username" => $username, + "password" => $password +]); +``` + +Or with functional mode: + +```php +auth()->useSession(); + +auth()->login("users", [ + "username" => $username, + "password" => $password +]); +``` + +When the login succeeds, you'll be redirected to GUARD_HOME. You can configure the GUARD_HOME route to match the needs of your app. + +In case there's something wrong and Auth can't sign the user in, it returns a falsy value. + +```php +$user = auth()->login("users", [ + "username" => $username, + "password" => $password +]); + +if (!$user) { + // you can pass the auth errors into a view + return $blade->render("pages.auth.login", [ + "errors" => auth()->errors(), + "username" => $username, + "password" => $password, + ]); +} +``` + +#### Password Encoding + +From v2.4-beta onwards, password encoding will no longer be available on the login method, you have to configure it among the Auth settings instead. + +`login` has a 3rd parameter which is an array of validation rules for login data. You can checkout the form module for all the validation rules. + +```php{1} +$rules = ["username" => "ValidUsername"]; + +$user = auth()->login("users", $loginData, $rules); +``` + +To get any errors, you need to call the `errors` method + +```php +if (!$user) { + response()->throwErr(auth()->errors()); +} +``` + +
+ +### register + +Register is a simple method used to create simple, secure user registrations. This option was `basicRegister` in earlier versions. It takes in a table to save users, the params(array) to save. + +```php +auth()->register("users", [ + "username" => "mychi.darko", + "email" => "mychi@leafphp.dev", + "field" => "value" +]); +``` + +::: tip REGISTER CLASS +Leaf auth now allows you to register users with the new `Leaf\Auth\Register` class. This will allows you to import only the register functionality without actually going through the whole auth class. + +```php +$user = auth()->register("users", [ + "username" => "mychi.darko", + "email" => "mychi@leafphp.dev", + "field" => "value" +]); +``` + +::: + +If the user is successfully saved, the user data is returned, if not, `false` is returned. You can get any error by calling the `errors` method. + +```php +$user = auth()->register("users", [ + "username" => "mychi.darko", + "email" => "mychi@leafphp.dev", + "field" => "value" +]); // returns false if failed + +if ($user == false) { + response()->throwErr(auth()->errors()); +} +``` + +#### Uniques + +Let's say you want to check whether the username a user just entered has been taken, you'd have to write a bunch of conditional code, making the code count larger and more error prone, right? + +Well, `register` solves this problem smoothly. `register` has a 3rd parameter: an array of unique values which makes sure that the same value can't be saved twice. + +```php +$db->register("users", + ["name" => "mychi", "email" => "m@m.com", "pass" => "1234"], + ["name", "email"] +); +``` + +So, we're telling `register` to alert us if someone has already registered with the name `mychi` or the email `m@m.com`. This is because we passed `["name", "email"]` as the 3rd param to `register` + +**With uniques, you can cut down on your whole app:** +For instance, if you know the exact data you'll be receiving in your app, let's say a username, email and password from a register form, you can do something like this: + +```php +app()->post("/register", function () { + auth()->register( + "users", + request()->body(), + ["username", "email"] + ); +}); +``` + +So, we pass in the entire request body, which contains the username, email and password. Simple right? + +For an even better way, you can make sure that only the data you need is going into the database. You can do this to retrieve only the fields you need. + +```php +// select only the username, email and password from the request body +$data = request()->get(["username", "email", "password"]); + +auth()->register("users", $data); +``` + +The password encode option here has also been removed. Use the auth config above instead. The final parameter is now the validate param which is an array of rules to test the params. + +```php +app()->post("/register", function () use($app) { + auth()->register( + "users", + request()->body(), + ["username", "email"], + ["email" => "email"] + ); +}); +``` + +#### register session support + +Just as with login, register now integrates with session. To turn this feature on, just set the `USE_SESSION` setting or call the `useSession` method. + +```php +auth()->useSession(); + +auth()->register("users", $credentials, [ + "username", "email" +]); +``` + +After a successful registration, you can redirect to GUARD_HOME or rather GUARD_LOGIN if you want the user to login after registration. + +```php +// set your login route...default is /auth/login +auth()->config("GUARD_LOGIN", "/login"); + +// Redirect to login after auth +auth()->config("SESSION_ON_REGISTER", false); + +// Login automatically after registration +auth()->config("SESSION_ON_REGISTER", true); +``` + +In case there's something wrong and Auth can't register the user, it returns a falsy value. + +```php +$user = auth()->register("users", $credentials, [ + "username", "email" +]); + +if (!$user) { + // you can pass the auth errors into a view + return $blade->render("pages.auth.register", [ + "errors" => auth()->errors(), + "username" => $username, + "email" => $email, + "password" => $password, + ]); +} +``` + +
+ +### update + +There's a login method, a register method, so why not a user update method? This method takes the stress out of updating a user's information. Update takes in 5 parameters: + +- The table to look for users +- The data to update +- Credentials to find user by +- Unique values (optional) +- Validation array (optional) + +```php +// data to update +$data = $request->get(["username", "email"]); + +// credentials to find user by +$where = ["id" => 2]; + +// unique data +$uniques = ["username", "email"]; + +// validation +$validation = ["username" => "ValidUsername", "email" => "email"]; + +$user = auth()->update("users", $data, $where, $uniques, $validation); +``` + +::: tip USER CLASS +Leaf auth now allows you to register users with the new `Leaf\Auth\USER` class. This will allows you to import only the update functionality without actually going through the whole auth class. + +```php +$user = Leaf\Auth\User::update("users", [ + "username" => "mychi.darko", + "email" => "mychi@leafphp.dev", + "field" => "value" +], ["id" => "1"]); +``` + +::: + +**Something little:** Uniques in `update` work a bit different from `register`, in `update`, Leaf tries to find another user which isn't the current user that has the same credentials. So if there's no other user with that same param value, the unique test passes. In short, **the current user is excluded from the users to check for same credentials** + +#### update session support + +Update also reeived session support. When a user is updated, the user is updated in the session and the updated user is also returned. + +```php +$user = auth()->update("users", $data, $where, $uniques); +``` + +
+ + + +### user + +When tokens are added inside requests, you generally have to decode the token and query your database with the id returned to get the current user. Although Leaf Auth makes it really simple, it can get even simpler; by calling a single method. It takes in one parameter, the table to look for users. + +```php +$user = auth()->user("users"); +return $user["name"]; +``` + +In v2.4 beta, the table is set to `users` by default. So you can simply do this: + +```php +$user = auth()->user(); +``` + +We can catch any errors that occur, from fetching the user, working with the token... + +```php +$user = auth()->user() ?? $request->throwErr(auth()->errors()); +``` + +`user` also takes in a second parameter, which is an array of items to hide from the user array. + +```php +$user = auth()->user("users", ["id", "password"]); +``` + +
+ +### id + +This is a method that decodes a token and returns the `user_id` field encoded in it. + +```php +$user_id = auth()->id(); +``` + +
+ + + +Leaf Auth now uses the `Leaf\Helpers\Authentication` package to provide solutions for token authentication. This provides a simple way to work with manual authentication and tokens. All methods here are now available in `Leaf\Auth`. + +```php +$payload = auth()->validate($token); +``` + + diff --git a/apps/docs/src/modules/auth/v/2.1/config.md b/apps/docs/src/modules/auth/v/2.1/config.md new file mode 100755 index 0000000..1558863 --- /dev/null +++ b/apps/docs/src/modules/auth/v/2.1/config.md @@ -0,0 +1,206 @@ +# Auth Config + +Auth Config was added to give you more control over how leaf handles authentication in your apps. Auth has been configured perfectly for most apps, but not all use cases are the same, hence, this brilliant addition. + +This also includes various configurations for doing things like: + +- Setting custom token lifetime +- Hiding/Showing user fields +- Adding/removing default timestamps +- Changing the default password key +- Setting custom password encode methods +- Turning off password encoding totally +- Setting custom password verify methods +- Hiding/Showing password field +- Adding custom validation messages +- Configuring tokens + +## config + +To set a config variable, you can simply call the `config` method. + +```php +auth()->config("item", "value"); +``` + +You can also pass in an array to set multiple configs at once: + +```php +auth()->config([ + "item" => "value", + "item2" => "value" +]); +``` + +## Settings + +Below is a list of all available settings. + +### DB_TABLE + + +The `DB_TABLE` config allows you to set a particular table which leaf auth will perform operations on. Leaf auth will use this database table for storing and retrieving users. By default, it is set to `users`. This allows you to login, signup, update and fetch users without explicitly adding a table each time. + +### USE_TIMESTAMPS + +This determines whether Leaf should add the default `created_at` and `updated_at` timestamps on register and update. Default is `true`. + +### PASSWORD_ENCODE + +*This setting has gone through a lot of changes since v2.4 beta, and may not work exactly the same way*. This setting is run when leaf wants to encode a password. It now uses `PASSWORD_DEFAULT` by defaullt for encryption. + +```php +// This turns off password encoding +auth()->config("PASSWORD_ENCODE", false); + +// defult encoding (Leaf\Helpers\Password::hash) +auth()->config("PASSWORD_ENCODE", null); + +// use md5. We're still keeping support for md5 :-) +auth()->config("PASSWORD_ENCODE", Password::MD5); + +// use custom method +auth()->config("PASSWORD_ENCODE", function ($password) { + return Password::hash($password); +}); +``` + +### PASSWORD_VERIFY + +This setting is called when Leaf tries to verify a password. It works just like `PASSWORD_ENCODE` above. + +```php +// This turns off password encoding +auth()->config("PASSWORD_VERIFY", false); + +// defult encoding (Leaf\Helpers\Password::hash) +auth()->config("PASSWORD_VERIFY", null); + +// use md5. We're still keeping support for md5 :-) +auth()->config("PASSWORD_VERIFY", Password::MD5); + +// use custom method +auth()->config("PASSWORD_VERIFY", function ($password) { + return Password::verify($password); +}); +``` + +### PASSWORD_KEY + +This allows you to change the password field name, maybe yours is passcode? This tells leaf to look for a user's password in that field. The example below tells leaf to search for passwords in the `passcode` column. (the default field is password) + +```php +auth()->config("PASSWORD_KEY", "passcode"); +``` + +### ID_KEY + +`ID_KEY` allows you to set your primary key name. For instance, you might have used `_id` instead of `id`. This setting allows you to quickly and effectively switch your key name. + +```php +auth()->config("ID_KEY", "_id"); +``` + +### USE_UUID + +This simply allows you to set the value for user ids on your own. This is done in order to add support for UUIDs in your registrations and not go with the default SQL increments. + +```php +auth()->config("USE_UUID", UUID::v4()); +``` + +### HIDE_ID + +This is a boolean which determines whether to hide the id in the user object returned on login/register. Default is `true`. + +### AUTH_NO_PASS + +This allows you to *manually* tell leaf auth that no password is required for authentication. When this is set to true, leaf auth will assume there is no password and act accordingly. If there is no password field set in the credentials passed into the `login` or `register` methods, leaf auth will automatically set this to `true`. + +### HIDE_PASSWORD + +Just as the name implies, allows you to hide or show the password in the final results returned from auth. Default is `true`. + +### LOGIN_PARAMS_ERROR + +This is the error to show if there's an error with any parameter which isn't the password eg: username: + +```php +auth()->config("LOGIN_PARAMS_ERROR", "Username is incorrect!"); +``` + +Default is `Incorrect credentials!`. + +### LOGIN_PASSWORD_ERROR + +This is the error to show if there's an error with the password. + +Default is `Password is incorrect!`. + +```php +auth()->config("LOGIN_PASSWORD_ERROR", "Password is incorrect!"); +``` + +### USE_SESSION + +Use session based authentication instead of the default JWT based auth. Without this setting enbled, you can't use any of the session methods below. Default is `false`. + +### SESSION_ON_REGISTER + +If true, a session will be created on a successful registration, else you it'll be created on login rather. Default is `false`. + +### GUARD_LOGIN + +The page route. Default is `/auth/login`. + +### GUARD_REGISTER + +The register page route. Default is `/auth/register`. + +### GUARD_LOGOUT + +Logout route handler. Default is `/auth/logout`. + +### GUARD_HOME + +Home page route. Default is `/home`. + +### SAVE_SESSION_JWT + +Add an auth token to the auth session? This allows you save a generated JWT to the session. You might want to use this if you want to extend your app into an API. Default is `false`. + +### TOKEN_LIFETIME + +How long the token can be used before it expires. Default is 1 day. + +### TOKEN_SECRET + +This is the secret key used to generate tokens for users on signup and register. + +::: danger Leaf Auth Refactor 🔥 +The leaf auth module has been broken up into subclasses for easier use and performance reasons. If you only use login and signup, there's no need to include a class with tons of features that you may not use. + +This doesn't change the way leaf auth works as this was done for performance and maintainability reasons. You can still use the auth class just as done in Leaf 2, however, this has been optimized using static methods which means unnecessary code will not be run. + +```php +Leaf\Auth::session(); +``` + +::: + + diff --git a/apps/docs/src/modules/auth/v/2.1/helpers.md b/apps/docs/src/modules/auth/v/2.1/helpers.md new file mode 100644 index 0000000..ccbcc31 --- /dev/null +++ b/apps/docs/src/modules/auth/v/2.1/helpers.md @@ -0,0 +1,137 @@ +# Helper Methods + +Leaf Auth already has methods that cater for most of your authentication use-cases, however, you may have a flow that is more complex than what Leaf Auth offers, for this reason, Leaf Auth provides low-level helper methods that allow you build auth flows from the ground up. + +## Working with JWTs + +According to the [JWT docs](https://jwt.io/introduction), JSON Web Token (JWT) is an open standard (RFC 7519) that defines a compact and self-contained way for securely transmitting information between parties as a JSON object. This information can be verified and trusted because it is digitally signed. JWTs can be signed using a secret (with the HMAC algorithm) or a public/private key pair using RSA or ECDSA. + +In authentication, you can use JWTs as an identifier that a user has successfully logged in. The JWT usually also contains information about the authenticated user, usually the user's id. Leaf auth has helpers for interacting with JWTs. We'll take a look at them in this document. + +## Generating JWTs + +Leaf provides multiple ways for generating JWTs. + +- ### Using the `generateSimpleToken` method + + The simplest method is to use the `generateSimpleToken` method on the `Leaf\Helpers\Authentication` class. This method takes in 3 parameters: + + - The user id of the currently authenticated user + - The jwt secret string + - The jwt expiry time in seconds + + ```php + use Leaf\Helpers\Authentication; + + // ... your application code + + Authentication::generateSimpleToken( + $userId, + 'MY_JWT_SECRET_STRING', + time() + 3600 + ); + ``` + +- ### Using the `generateToken` method + + The `generateToken` method on the `Leaf\Helpers\Authentication` class is a more advanced method for generating JWTs. It takes in 2 parameters: + + - An array of claims to be added to the JWT + - The JWT secret string + + ```php + use Leaf\Helpers\Authentication; + + // ... your application code + + Authentication::generateToken( + [ + 'user_id' => $userId, + 'iat' => time(), + 'iss' => 'localhost', + 'exp' => time() + 3600, + ], + 'MY_JWT_SECRET_STRING' + ); + ``` + +## Getting JWTs from the request + +Tokens from authenticated requests are usually sent in the `Authorization` header. Leaf Auth provides helpers that allow you directly pull in tokens from the request header. + +### Using the `getAuthorizationHeader` method + +Leaf Auth provides the `getAuthorizationHeader` helper method for getting the token from the request header. It returns null if no authorization header is found. + +```php +use Leaf\Helpers\Authentication; + +$header = Authentication::getAuthorizationHeader(); +``` + +### Using the `getBearerToken` method + +Leaf Auth provides the `getBearerToken` helper method for getting the token from the request header. It returns null if no bearer token is found. + +```php +use Leaf\Helpers\Authentication; + +$token = Authentication::getBearerToken(); +``` + +## Verifying JWTs + +Verifying JWTs is a very important step in the authentication process. Tokens can be tampered with, they can also expire, or be issued by an untrusted source. For this reason, you should always verify the token before using it. + +Leaf Auth provides 2 methods for verifying JWTs. + +- ### Using the `validateToken` method + +This method automatically checks if there is a token in the request header, and if there is, it verifies the token. It returns the decoded token if the token is valid, and returns false if the token is invalid. + +It takes in a single parameter, which is the JWT secret string. This secret string should be the same as the one used to generate the token. + +```php +use Leaf\Helpers\Authentication; + +$data = Authentication::validateToken($secret); +``` + +Note that this method will automatically return false if there is no token in the request header. You can use the `errors` method to get the error message which is why the token validation failed. + +```php +use Leaf\Helpers\Authentication; + +$data = Authentication::validateToken($secret); + +if (!$data) { + $errors = Authentication::errors(); +} +``` + +- ### Using the `validate` method + +Unlike the `validateToken` method, this method does not automatically check for a token in the request header. It takes in 2 parameters: + +- The token to be validated +- The JWT secret string + +```php +use Leaf\Helpers\Authentication; + +$token = Authentication::getBearerToken(); +$data = Authentication::validate($token, $secret); +``` + +Just like the `validateToken` method, this method returns the decoded token if the token is valid, and returns false if the token is invalid. You can use the `errors` method to get the error message which is why the token validation failed. + +```php +use Leaf\Helpers\Authentication; + +$token = Authentication::getBearerToken(); +$data = Authentication::validate($token, $secret); + +if (!$data) { + $errors = Authentication::errors(); +} +``` diff --git a/apps/docs/src/modules/auth/v/2.1/index.md b/apps/docs/src/modules/auth/v/2.1/index.md new file mode 100755 index 0000000..dbe826a --- /dev/null +++ b/apps/docs/src/modules/auth/v/2.1/index.md @@ -0,0 +1,158 @@ +# Leaf Auth + + +## Installation + +You can install Leaf Db with Leaf CLI: + +```bash +leaf install auth +``` + +Or with composer: + +```bash +composer require leafs/auth +``` + +From there, you can link your database and start writing some awesome queries. + + + +## Db Connection + +After installing leaf auth, you would need to connect to a database. Leaf auth will search for users and add/update users in this database when a login/register or update operation is called. There are a couple of ways to connect to a database with leaf auth. + +### connect + +The connect method allows you to pass in your database connection parameters directly to leaf auth. + +```php +$auth = new Leaf\Auth; + +// syntax +$auth->connect( + $host = '', + string $dbname = '', + string $user = '', + string $password = '' +); + +// example +$auth->connect('127.0.0.1', 'dbname', 'root', ''); +``` + +### autoConnect + +This method allows you to connect to your database from parameters in a `.env` file. Most MVC frameworks and other libraries rely on a `.env` for a lot of configurations including the database. With `autoConnect`, you can directly pick up these configs. + +**example env:** + +```env +DB_CONNECTION=mysql +DB_HOST=127.0.0.1 +DB_PORT=3306 +DB_DATABASE=LeafMVC +DB_USERNAME=root +DB_PASSWORD= +``` + +**App:** + +```php +$auth = new Leaf\Auth; +$auth->autoConnect(); +``` + +### PDO connection + +Leaf Auth also allows you to skip the entire connection process and share an existing PDO instance with leaf db. This allows you to gradually rewrite your existing apps with Leaf Auth without having multiple db connections and doing so at your own pace. + +```php +$db = new PDO('mysql:dbname=test;host=127.0.0.1', 'root', ''); + +auth()->dbConnection($db); + +// you can use leaf auth the same way you always have +``` + +Leaf Db has been rewritten based on PDO, this also means that you can pass your leaf db connection into leaf auth directly. + +```php +$auth->dbConnection(db()->connection()); +``` + +### Leaf db (auth v2 + leaf 3 only) + +If you are using leaf auth in a leaf 3 app, you will have access to the auth global as shown in some of the above connections. Along with this, if you already have a leaf db connection, you no longer need to explicitly connect to your database. Leaf auth searches for a leaf db instance and connects to it automatically. + +::: warning Note +This only works in a leaf 3 app and only if you already have a leaf db connection. +::: + +```php +connect('127.0.0.1', 'dbname', 'username', 'password'); + +// you can use auth straight away without any connect +auth()->login(...); +``` + +## Functional Mode + +If you are using leaf auth v2 in a leaf 3 app, you will have access to the `auth` global which allows you to use Leaf Auth from anywhere in your entire application. You simply need to call `auth()` and leaf 3 will create and maintain a shared instance of Leaf auth which you can call from anywhere. + +This also means that you don't need to initialize leaf auth anymore. + +```php +autoConnect(); + +app()->get("/", function () { + // auth can be used here + // auth()->... +}); + +app()->run(); +``` + +Functional mode also makes the `guard`, `hasAuth` and `sessionUser` globals available to you from anywhere. + +### guard + +The guard method is a shortcut method for `Auth::guard()`. You can find the guards documentation [here](/modules/auth/v/2.1/session.html#guard). + +### hasAuth + +`hasAuth` returns a boolean which is whether there's an active user session or not. + +### sessionUser + +This method returns the active session user or null if there's no session user. + +## Next Steps + + diff --git a/apps/docs/src/modules/auth/v/2.1/methods.md b/apps/docs/src/modules/auth/v/2.1/methods.md new file mode 100755 index 0000000..82c062c --- /dev/null +++ b/apps/docs/src/modules/auth/v/2.1/methods.md @@ -0,0 +1,303 @@ +# Authentication methods + +These are the main functionality provided by leaf auth. + +::: tip New in v2.1 +Following the addition of the [DB_TABLE](/modules/auth/v/2.1/config.html#db-table) config, the table parameter has been removed from leaf auth. This means that you can now pass in only the credentials on a user `login`, `register` or `update`. +::: + +## login + +Login is used to create a simple, secure user login. + +**It takes in a set of parameters for the login.** + +```php +$user = auth()->login([ + 'username' => 'mychi.darko', + 'password' => 'test' +]); +``` + +If the user is successfully found, the user data is returned, if not, `null` is returned. You can get any error by calling the `errors` method. + +```php +$user = auth()->login([ + 'username' => 'mychi.darko', + 'password' => 'test' +]); // returns null if failed + +if (!$user) { + response()->exit(auth()->errors()); +} +``` + +example success response: +**Note that the password and id fields are removed**. You can control whether fields should be hidden from the returned value in the Auth settings. + +```php +[ + "user" => [ + "username" => "mychi.darko", + "email" => "mychi@leafphp.dev", + "created_at" => "2019-09-20 13:47:48" + ], + "token" => "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE1NzYxMzUzMjgsImlzcyI6ImxvY2FsaG9zdCIsImV4cCI6MTU3NjEzNjIyOCwidXNlcklkIjoxfQ.7FODXGGJKioGQVX4ic0DJLoMIQTVUlsd4zFAJA4DAkg" +] +``` + +### session support + +Login now has session support which allows login to create a session instead of returning a JWT as done by default. To get started with session, just set the `USE_SESSION` setting or call the `useSession` method. + +```php +auth()->useSession(); + +auth()->login([ + 'username' => $username, + 'password' => $password +]); +``` + +When the login succeeds, you'll be redirected to `GUARD_HOME`. You can configure the `GUARD_HOME` route to match the needs of your app. + +In case there's something wrong and Auth can't sign the user in, it returns a falsy value. + +```php +auth()->useSession(); + +$user = auth()->login([ + 'username' => $username, + 'password' => $password +]); + +if (!$user) { + // you can pass the auth errors into a view + return $blade->render('pages.auth.login', [ + 'errors' => auth()->errors(), + 'username' => $username, + 'password' => $password, + ]); +} +``` + +### Password Encoding + +Leaf auth has a very simple and straightforward implementation for password encoding. You can use default password protection with the leaf password helper or use your own method for hashing. All of this can be configured with [auth settings](/modules/auth/v/2.1/config.html#password-encode) + +### Validation + +This version of leaf auth has separated validation into it's own method. This allows you to have cleaner methods which are more readable. Validation uses [leaf form](/modules/forms/) under the hood, which makes it simple and easy to use. You can find more about form rules in the [leaf form validation docs](/modules/forms/#supported-rules). + +```php{1} +$validation = auth()->validate(['firstname' => 'noSpaces']); + +if (!$validation) { + response()->exit(auth()->errors()); +} + +$user = auth()->login($loginData); + +if (!$user) { + response()->exit(auth()->errors()); +} +``` + +## register + +Register is a simple method used to create simple, secure user registrations. **It takes in the params(array) to save and any items which should be unique.** + +```php +auth()->register([ + 'username' => 'mychi.darko', + 'email' => 'mychi@leafphp.dev', + 'field' => 'value' +]); +``` + +If the user is successfully saved, the user data is returned, if not, `null` is returned. You can get any error by calling the `errors` method. + +```php +$user = auth()->register([ + 'username' => 'mychi.darko', + 'email' => 'mychi@leafphp.dev', + 'field' => 'value' +]); // returns null if failed + +if (!$user) { + response()->exit(auth()->errors()); +} +``` + +### Uniques + +Let's say you want to check whether the username a user just entered has been taken, you'd have to write a bunch of conditional code, making the code count larger and more error prone, right? + +Well, `register` solves this problem smoothly. `register` has a 2nd parameter: an array of unique values which makes sure that the same value can't be saved twice. + +```php +auth()->register( + ['name' => 'mychi', 'email' => 'm@m.com', 'pass' => '1234'], + ['name', 'email'] +); +``` + +We are telling `register` to alert us if someone has already registered with the name `mychi` or the email `m@m.com`. This is because we passed `['name', 'email']` as the 2nd param to `register`. + +**With uniques, you can cut down on your whole app:** +For instance, if you know the exact data you'll be receiving in your app, let's say a username, email and password from a register form, you can do something like this: + +```php +app()->post('/register', function () { + auth()->register(request()->body(), ['username', 'email']); +}); +``` + +So, we pass in the entire request body, which contains the username, email and password. Simple right? + +For an even better way, you can make sure that only the data you need is going into the database. You can do this to retrieve only the fields you need. + +```php +// select only the username, email and password from the request body +$data = request()->get(['username', 'email', 'password']); + +auth()->register($data); +``` + +### `register` session support + +Just as with login, register now integrates with session. To turn this feature on, just set the `USE_SESSION` setting or call the `useSession` method. + +```php +auth()->useSession(); + +auth()->register($credentials, [ + 'username', 'email' +]); +``` + +After a successful registration, you can redirect to `GUARD_HOME` or rather `GUARD_LOGIN` if you want the user to login after registration. + +```php +// set your login route...default is /auth/login +auth()->config('GUARD_LOGIN', '/login'); + +// Redirect to login after auth +auth()->config('SESSION_ON_REGISTER', false); + +// Login automatically after registration +auth()->config('SESSION_ON_REGISTER', true); +``` + +In case there's something wrong and Auth can't register the user, it returns a falsy value. + +```php +$user = auth()->register($credentials, [ + 'username', 'email' +]); + +if (!$user) { + // you can pass the auth errors into a view + return $blade->render('pages.auth.register', [ + 'errors' => auth()->errors(), + 'username' => $username, + 'email' => $email, + 'password' => $password, + ]); +} +``` + +## update + +There's a login method, a register method, so why not a user update method? This method takes the stress out of updating a user's information. Update takes in 2 parameters: + +- The data to update +- Unique values (optional) + +::: warning Changes in update +The `update` method has been rewritten completely from the ground up. The biggest change is that you no longer need to pass in a condition for locating th user to update, but it also means that there needs to be a logged in user. `update` will now search for a JWT or user session to find the user to be updated. +::: + +```php +// data to update +$data = request()->get(['username', 'email']); + +// unique data +$uniques = ['username', 'email']; + +$user = auth()->update($data, $uniques); +``` + +::: tip Something little +Uniques in `update` work a bit different from `register`, in `update`, Leaf tries to find another user which isn't the current user that has the same credentials. So if there's no other user with that same param value, the unique test passes. In short, **the current user is excluded from the users to check for same credentials** +::: + +### `update` session support + +When a user is updated, the user is updated in the session and the updated user is also returned. + +```php +$user = auth()->update($data, $uniques); +``` + + + +## user + +This is a method which allows you to get the user who is currently logged in. This method expects either a JWT or a session to exist on the request. `user` finds the user id and queries the user from the database linked to leaf auth. In the case of JWTs, it also validates the JWT and makes sure that it is valid and hasn't expired. + +```php +$user = auth()->user(); +return $user['name']; +``` + +As mentioned, `user` queries your database for the full user information. You can specify your custom table using the [DB_TABLE](/modules/auth/v/2.1/config.html#db-table) config like this: + +```php +$user = auth()->config('DB_TABLE', 'all_users'); +``` + +We can catch any errors that occur, from fetching the user, working with the token... + +```php +$user = auth()->user() ?? $request->exit(auth()->errors()); +``` + +`user` also allows you to pass an array of items to hide from the returned user array. + +```php +$user = auth()->user(['id', 'password']); +``` + +## id + +This method returns the id of the currently logged in user. In the case of JWTs, it decodes and validates the token and returns the `user_id` field encoded in it. + +```php +$userId = auth()->id(); +``` + + + + + + diff --git a/apps/docs/src/modules/auth/v/2.1/session.md b/apps/docs/src/modules/auth/v/2.1/session.md new file mode 100644 index 0000000..4f28999 --- /dev/null +++ b/apps/docs/src/modules/auth/v/2.1/session.md @@ -0,0 +1,120 @@ +# Session support + +Session based authentication as the name implies, creates and manages a session during the authentication process to track the user's logged in state. Leaf auth provides an easy and developer friendly approach to handle this. + +To get started with session support, just set the `USE_SESSION` config to true. + +```php +auth()->config('USE_SESSION', true); +``` + +A much simpler way would be to simply call the `useSession` method. + +```php +auth()->useSession(); +``` + +## Session methods + +Enabling session support allows you to use some special methods and behaviours which are not available with the regular JWT authentication. + +### guard + +The guard method works sort of like authentication middleware. It takes in a single param, an array holding the authentication state or the type of guard to load up. + +```php +auth()->guard('auth'); + +// or + +Leaf\Auth::guard('auth'); + +// guest route redirects to home +// route if you're logged in +Leaf\Auth::guard('guest'); +``` + +::: tip The guard method +You can directly run a guard on the `guard` method. + +```php +guard('guest'); +``` + +::: + + +### length + +With length, you can get how long a user has been logged in. You can save the session time logs to your database in order to track users' login logs. The available logs are `SESSION_STARTED_AT` and `SESSION_LAST_ACTIVITY` which are automatically tracked by Leaf. + +```php +$sessionDuration = auth()->length(); +``` + +### lastActive + +`lastActive` allows you to get how much time has passed since the last session activity. + +```php +$userLastSeen = auth()->lastActive(); +``` + +### refresh + +As the name implies, you can refresh the session with this method. Refreshing sort of restarts the session, but you can keep the user's old session data if you wish to. + +```php +if ($newAccountAdded) { + // will delete old session data + Leaf\Auth::refresh(); +} else { + // will keep session data + auth()->refresh(false);s +} +``` + +### status + +`status` checks whether a user session is ongoing by looking for keys specific to Leaf session auth so it doesn't confuse a Leaf auth session with user defined sessions. Returns the user if a session is found and false if there's no session found. + +```php +if (auth()->status()) { + return 'logged in'; +} else { + return 'guest mode'; +} +``` + +### logout + +Of course we'll need a method to logout/end our session. This is just the method for that. + +```php +auth()->logout(); +``` + +You can also pass in a route to redirect to after logging out. + +```php +auth()->logout('/home'); +``` diff --git a/apps/docs/src/modules/auth/v/2.1/v1-new.md b/apps/docs/src/modules/auth/v/2.1/v1-new.md new file mode 100644 index 0000000..7449df4 --- /dev/null +++ b/apps/docs/src/modules/auth/v/2.1/v1-new.md @@ -0,0 +1,3 @@ +# New in Leaf Auth + +New in leaf Auth diff --git a/apps/docs/src/modules/auth/v/2.1/v2.0-new.md b/apps/docs/src/modules/auth/v/2.1/v2.0-new.md new file mode 100644 index 0000000..7449df4 --- /dev/null +++ b/apps/docs/src/modules/auth/v/2.1/v2.0-new.md @@ -0,0 +1,3 @@ +# New in Leaf Auth + +New in leaf Auth diff --git a/apps/docs/src/modules/auth/v/2/config.md b/apps/docs/src/modules/auth/v/2/config.md new file mode 100755 index 0000000..6400c5f --- /dev/null +++ b/apps/docs/src/modules/auth/v/2/config.md @@ -0,0 +1,218 @@ +--- +aside: none +--- + +# Auth Config + +Auth Config was added to give you more control over how leaf handles authentication in your apps. Auth has been configured perfectly for most apps, but not all use cases are the same, hence, this brilliant addition. + +This also includes various configurations for doing things like: + +- Setting custom token lifetime +- Hiding/Showing user fields +- Adding/removing default timestamps +- Changing the default password key +- Setting custom password encode methods +- Turning off password encoding totally +- Setting custom password verify methods +- Hiding/Showing password field +- Adding custom validation messages +- Configuring tokens + +## config + +To set a config variable, you can simply call the `config` method. + +```php +auth()->config("item", "value"); +``` + +You can also pass in an array to set multiple configs at once: + +```php +auth()->config([ + "item" => "value", + "item2" => "value" +]); +``` + +## Settings + +Below is a list of all available settings. + +### USE_TIMESTAMPS + +This determines whether Leaf should add the default `created_at` and `updated_at` timestamps on register and update. Default is `true`. + +### PASSWORD_ENCODE + +*This setting has gone through a lot of changes since v2.4 beta, and may not work exactly the same way*. This setting is run when leaf wants to encode a password. It now uses `PASSWORD_DEFAULT` by defaullt for encryption. + +```php +// This turns off password encoding +auth()->config("PASSWORD_ENCODE", false); + +// defult encoding (Leaf\Helpers\Password::hash) +auth()->config("PASSWORD_ENCODE", null); + +// use md5. We're still keeping support for md5 :-) +auth()->config("PASSWORD_ENCODE", Password::MD5); + +// use custom method +auth()->config("PASSWORD_ENCODE", function ($password) { + return Password::hash($password); +}); +``` + +### PASSWORD_VERIFY + +This setting is called when Leaf tries to verify a password. It works just like `PASSWORD_ENCODE` above. + +```php +// This turns off password encoding +auth()->config("PASSWORD_VERIFY", false); + +// defult encoding (Leaf\Helpers\Password::hash) +auth()->config("PASSWORD_VERIFY", null); + +// use md5. We're still keeping support for md5 :-) +auth()->config("PASSWORD_VERIFY", Password::MD5); + +// use custom method +auth()->config("PASSWORD_VERIFY", function ($password) { + return Password::verify($password); +}); +``` + +### PASSWORD_KEY + +This allows you to change the password field name, maybe yours is passcode? This tells leaf to look for a user's password in that field. The example below tells leaf to search for passwords in the `passcode` column. (the default field is password) + +```php +auth()->config("PASSWORD_KEY", "passcode"); +``` + +### ID_KEY + +`ID_KEY` allows you to set your primary key name. For instance, you might have used `_id` instead of `id`. This setting allows you to quickly and effectively switch your key name. + +```php +auth()->config("ID_KEY", "_id"); +``` + +### USE_UUID + +This simply allows you to set the value for user ids on your own. This is done in order to add support for UUIDs in your registrations and not go with the default SQL increments. + +```php +auth()->config("USE_UUID", UUID::v4()); +``` + +### HIDE_ID + +This is a boolean which determines whether to hide the id in the user object returned on login/register. Default is `true`. + +### AUTH_NO_PASS + +This allows you to *manually* tell leaf auth that no password is required for authentication. When this is set to true, leaf auth will assume there is no password and act accordingly. If there is no password field set in the credentials passed into the `login` or `register` methods, leaf auth will automatically set this to `true`. + +### HIDE_PASSWORD + +Just as the name implies, allows you to hide or show the password in the final results returned from auth. Default is `true`. + +### LOGIN_PARAMS_ERROR + +This is the error to show if there's an error with any parameter which isn't the password eg: username: + +```php +auth()->config("LOGIN_PARAMS_ERROR", "Username is incorrect!"); +``` + +Default is `Incorrect credentials!`. + +### LOGIN_PASSWORD_ERROR + +This is the error to show if there's an error with the password. + +Default is `Password is incorrect!`. + +```php +auth()->config("LOGIN_PASSWORD_ERROR", "Password is incorrect!"); +``` + +### USE_SESSION + +Use session based authentication instead of the default JWT based auth. Without this setting enbled, you can't use any of the session methods below. Default is `false`. + +### SESSION_ON_REGISTER + +If true, a session will be created on a successful registration, else you it'll be created on login rather. Default is `false`. + +### GUARD_LOGIN + +The page route. Default is `/auth/login`. + +### GUARD_REGISTER + +The register page route. Default is `/auth/register`. + +### GUARD_LOGOUT + +Logout route handler. Default is `/auth/logout`. + +### GUARD_HOME + +Home page route. Default is `/home`. + +### SAVE_SESSION_JWT + +Add an auth token to the auth session? This allows you save a generated JWT to the session. You might want to use this if you want to extend your app into an API. Default is `false`. + +### TOKEN_LIFETIME + +How long the token can be used before it expires. Default is 1 day. + +### TOKEN_SECRET + +This is the secret key used to generate tokens for users on signup and register. + +::: danger Leaf Auth Refactor 🔥 +The leaf auth module has been broken up into subclasses for easier use and performance reasons. If you only use login and signup, there's no need to include a class with tons of features that you may not use. + +This doesn't change the way leaf auth works as this was done for performance and maintainability reasons. You can still use the auth class just as done in Leaf 2, however, this has been optimized using static methods which means unnecessary code will not be run. + +```php +Leaf\Auth::session(); +``` + +::: + + + +## Next Steps + + diff --git a/apps/docs/src/modules/auth/v/2/index.md b/apps/docs/src/modules/auth/v/2/index.md new file mode 100755 index 0000000..9ce3521 --- /dev/null +++ b/apps/docs/src/modules/auth/v/2/index.md @@ -0,0 +1,154 @@ +# Auth v2.0 + + +## Installation + +You can install Leaf Db with Leaf CLI: + +```bash +leaf install auth@2.0 +``` + +Or with composer: + +```bash +composer require leafs/auth v2.0 +``` + +From there, you can link your database and start writing some awesome queries. + + + +## Db Connection + +After installing leaf auth, you would need to connect to a database. Leaf auth will search for users and add/update users in this database when a login/register or update operation is called. There are a couple of ways to connect to a database with leaf auth. + +### connect + +The connect method allows you to pass in your database connection parameters directly to leaf auth. + +```php +$auth = new Leaf\Auth; + +// syntax +$auth->connect( + $host = '', + string $dbname = '', + string $user = '', + string $password = '' +); + +// example +$auth->connect('127.0.0.1', 'dbname', 'root', ''); +``` + +### autoConnect + +This method allows you to connect to your database from parameters in a `.env` file. Most MVC frameworks and other libraries rely on a `.env` for a lot of configurations including the database. With `autoConnect`, you can directly pick up these configs. + +**example env:** + +```env +DB_CONNECTION=mysql +DB_HOST=127.0.0.1 +DB_PORT=3306 +DB_DATABASE=LeafMVC +DB_USERNAME=root +DB_PASSWORD= +``` + +**App:** + +```php +$auth = new Leaf\Auth; +$auth->autoConnect(); +``` + +### PDO connection + +Leaf Auth also allows you to skip the entire connection process and share an existing PDO instance with leaf db. This allows you to gradually rewrite your existing apps with Leaf Auth without having multiple db connections and doing so at your own pace. + +```php +$db = new PDO('mysql:dbname=test;host=127.0.0.1', 'root', ''); + +auth()->dbConnection($db); + +// you can use leaf auth the same way you always have +``` + +Leaf Db has been rewritten based on PDO, this also means that you can pass your leaf db connection into leaf auth directly. + +```php +$auth->dbConnection(db()->connection()); +``` + +### Leaf db (auth v2 + leaf 3 only) + +If you are using leaf auth in a leaf 3 app, you will have access to the auth global as shown in some of the above connections. Along with this, if you already have a leaf db connection, you no longer need to explicitly connect to your database. Leaf auth searches for a leaf db instance and connects to it automatically. + +::: warning Note +This only works in a leaf 3 app and only if you already have a leaf db connection. +::: + +```php +connect('127.0.0.1', 'dbname', 'username', 'password'); + +// you can use auth straight away without any connect +auth()->login(...); +``` + +## Functional Mode + +If you are using leaf auth v2 in a leaf 3 app, you will have access to the `auth` global which allows you to use Leaf Auth from anywhere in your entire application. You simply need to call `auth()` and leaf 3 will create and maintain a shared instance of Leaf auth which you can call from anywhere. + +This also means that you don't need to initialize leaf auth anymore. + +```php +autoConnect(); + +app()->get("/", function () { + // auth can be used here + // auth()->... +}); + +app()->run(); +``` + +Functional mode also makes the `guard`, `hasAuth` and `sessionUser` globals available to you from anywhere. + +### guard + +The guard method is a shortcut method for `Auth::guard()`. You can find the guards documentation [here](/modules/auth/v/2/session.html#guard). + +### hasAuth + +`hasAuth` returns a boolean which is whether there's an active user session or not. + +### sessionUser + +This method returns the active session user or null if there's no session user. + +## Next Steps + + diff --git a/apps/docs/src/modules/auth/v/2/methods.md b/apps/docs/src/modules/auth/v/2/methods.md new file mode 100755 index 0000000..21b2ecc --- /dev/null +++ b/apps/docs/src/modules/auth/v/2/methods.md @@ -0,0 +1,309 @@ +--- +aside: none +--- + +# Authentication methods + +These are the main functionality provided by leaf auth. + +## login + +Login is used to create a simple, secure user login. + +**It takes in a table to search for users and a set of parameters for the login.** + +```php +$user = auth()->login('users', [ + 'username' => 'mychi.darko', + 'password' => 'test' +]); +``` + +If the user is successfully found, the user data is returned, if not, `null` is returned. You can get any error by calling the `errors` method. + +```php +$user = auth()->login('users', [ + 'username' => 'mychi.darko', + 'password' => 'test' +]); // returns null if failed + +if (!$user) { + response()->exit(auth()->errors()); +} +``` + +example success response: +**Note that the password and id fields are removed**. You can control whether fields should be hidden from the returned value in the Auth settings. + +```php +[ + "user" => [ + "username" => "mychi.darko", + "email" => "mychi@leafphp.dev", + "created_at" => "2019-09-20 13:47:48" + ], + "token" => "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE1NzYxMzUzMjgsImlzcyI6ImxvY2FsaG9zdCIsImV4cCI6MTU3NjEzNjIyOCwidXNlcklkIjoxfQ.7FODXGGJKioGQVX4ic0DJLoMIQTVUlsd4zFAJA4DAkg" +] +``` + +### session support + +Login now has session support which allows login to create a session instead of returning a JWT as done by default. To get started with session, just set the `USE_SESSION` setting or call the `useSession` method. + +```php +auth()->useSession(); + +auth()->login('users', [ + 'username' => $username, + 'password' => $password +]); +``` + +When the login succeeds, you'll be redirected to `GUARD_HOME`. You can configure the `GUARD_HOME` route to match the needs of your app. + +In case there's something wrong and Auth can't sign the user in, it returns a falsy value. + +```php +auth()->useSession(); + +$user = auth()->login('users', [ + 'username' => $username, + 'password' => $password +]); + +if (!$user) { + // you can pass the auth errors into a view + return $blade->render('pages.auth.login', [ + 'errors' => auth()->errors(), + 'username' => $username, + 'password' => $password, + ]); +} +``` + +### Password Encoding + +Leaf auth has a very simple and straightforward implementation for password encoding. You can use default password protection with the leaf password helper or use your own method for hashing. All of this can be configured with [auth settings](/modules/auth/v/2/config.html#password-encode) + +### Validation + +This version of leaf auth has separated validation into it's own method. This allows you to have cleaner methods which are more readable. Validation uses [leaf form](/modules/forms/) under the hood, which makes it simple and easy to use. You can find more about form rules in the [leaf form validation docs](/modules/forms/#supported-rules). + +```php{1} +$validation = auth()->validate(['username' => 'ValidUsername']); + +if (!$validation) { + response()->exit(auth()->errors()); +} + +$user = auth()->login('users', $loginData); + +if (!$user) { + response()->exit(auth()->errors()); +} +``` + +## register + +Register is a simple method used to create simple, secure user registrations. **It takes in a table to save users, the params(array) to save and any items which should be unique.** + +```php +auth()->register('users', [ + 'username' => 'mychi.darko', + 'email' => 'mychi@leafphp.dev', + 'field' => 'value' +]); +``` + +If the user is successfully saved, the user data is returned, if not, `null` is returned. You can get any error by calling the `errors` method. + +```php +$user = auth()->register('users', [ + 'username' => 'mychi.darko', + 'email' => 'mychi@leafphp.dev', + 'field' => 'value' +]); // returns null if failed + +if (!$user) { + response()->exit(auth()->errors()); +} +``` + +### Uniques + +Let's say you want to check whether the username a user just entered has been taken, you'd have to write a bunch of conditional code, making the code count larger and more error prone, right? + +Well, `register` solves this problem smoothly. `register` has a 3rd parameter: an array of unique values which makes sure that the same value can't be saved twice. + +```php +auth()->register( + 'users', + ['name' => 'mychi', 'email' => 'm@m.com', 'pass' => '1234'], + ['name', 'email'] +); +``` + +We are telling `register` to alert us if someone has already registered with the name `mychi` or the email `m@m.com`. This is because we passed `['name', 'email']` as the 3rd param to `register`. + +**With uniques, you can cut down on your whole app:** +For instance, if you know the exact data you'll be receiving in your app, let's say a username, email and password from a register form, you can do something like this: + +```php +app()->post('/register', function () { + auth()->register( + 'users', + request()->body(), + ['username', 'email'] + ); +}); +``` + +So, we pass in the entire request body, which contains the username, email and password. Simple right? + +For an even better way, you can make sure that only the data you need is going into the database. You can do this to retrieve only the fields you need. + +```php +// select only the username, email and password from the request body +$data = request()->get(['username', 'email', 'password']); + +auth()->register('users', $data); +``` + +### `register` session support + +Just as with login, register now integrates with session. To turn this feature on, just set the `USE_SESSION` setting or call the `useSession` method. + +```php +auth()->useSession(); + +auth()->register('users', $credentials, [ + 'username', 'email' +]); +``` + +After a successful registration, you can redirect to GUARD_HOME or rather GUARD_LOGIN if you want the user to login after registration. + +```php +// set your login route...default is /auth/login +auth()->config('GUARD_LOGIN', '/login'); + +// Redirect to login after auth +auth()->config('SESSION_ON_REGISTER', false); + +// Login automatically after registration +auth()->config('SESSION_ON_REGISTER', true); +``` + +In case there's something wrong and Auth can't register the user, it returns a falsy value. + +```php +$user = auth()->register('users', $credentials, [ + 'username', 'email' +]); + +if (!$user) { + // you can pass the auth errors into a view + return $blade->render('pages.auth.register', [ + 'errors' => auth()->errors(), + 'username' => $username, + 'email' => $email, + 'password' => $password, + ]); +} +``` + +## update + +There's a login method, a register method, so why not a user update method? This method takes the stress out of updating a user's information. Update takes in 3 parameters: + +- The table to look for users +- The data to update +- Unique values (optional) + +::: warning Changes in update +The `update` method has been rewritten completely from the ground up. The biggest change is that you no longer need to pass in a condition for locating th user to update, but it also means that there needs to be a logged in user. `update` will now search for a JWT or user session to find the user to be updated. +::: + +```php +// data to update +$data = request()->get(["username", "email"]); + +// unique data +$uniques = ["username", "email"]; + +$user = auth()->update("users", $data, $uniques); +``` + +::: tip Something little +Uniques in `update` work a bit different from `register`, in `update`, Leaf tries to find another user which isn't the current user that has the same credentials. So if there's no other user with that same param value, the unique test passes. In short, **the current user is excluded from the users to check for same credentials** +::: + +### `update` session support + +When a user is updated, the user is updated in the session and the updated user is also returned. + +```php +$user = auth()->update("users", $data, $uniques); +``` + + + +## user + +This is a method which allows you to get the user who is currently logged in. This method expects either a JWT or a session to exist on the request. `user` finds the user id and queries the user from the database linked to leaf auth. In the case of JWTs, it also validates the JWT and makes sure that it is valid and hasn't expired. + +```php +$user = auth()->user(); +return $user['name']; +``` + +As mentioned, `user` queries your database for the full user information. By default, the table to look for users has been set to `users`. You can pass in a table of your choice like this: + +```php +$user = auth()->user('all_users'); +``` + +We can catch any errors that occur, from fetching the user, working with the token... + +```php +$user = auth()->user() ?? $request->exit(auth()->errors()); +``` + +`user` also takes in a second parameter, which is an array of items to hide from the returned user array. + +```php +$user = auth()->user('users', ['id', 'password']); +``` + +## id + +This method returns the id of the currently logged in user. In the case of JWTs, it decodes and validates the token and returns the `user_id` field encoded in it. + +```php +$userId = auth()->id(); +``` + + + + + +## Next Steps + + diff --git a/apps/docs/src/modules/auth/v/2/new.md b/apps/docs/src/modules/auth/v/2/new.md new file mode 100644 index 0000000..7449df4 --- /dev/null +++ b/apps/docs/src/modules/auth/v/2/new.md @@ -0,0 +1,3 @@ +# New in Leaf Auth + +New in leaf Auth diff --git a/apps/docs/src/modules/auth/v/2/session.md b/apps/docs/src/modules/auth/v/2/session.md new file mode 100644 index 0000000..71cc432 --- /dev/null +++ b/apps/docs/src/modules/auth/v/2/session.md @@ -0,0 +1,137 @@ +--- +aside: none +--- + +# Session support + +Session based authentication as the name implies, creates and manages a session during the authentication process to track the user's logged in state. Leaf auth provides an easy and developer friendly approach to handle this. + +To get started with session support, just set the `USE_SESSION` config to true. + +```php +auth()->config('USE_SESSION', true); +``` + +A much simpler way would be to simply call the `useSession` method. + +```php +auth()->useSession(); +``` + +## Session methods + +Enabling session support allows you to use some special methods and behaviours which are not available with the regular JWT authentication. + +### guard + +The guard method works sort of like authentication middleware. It takes in a single param, an array holding the authentication state or the type of guard to load up. + +```php +auth()->guard('auth'); + +// or + +Leaf\Auth::guard('auth'); + +// guest route redirects to home +// route if you're logged in +Leaf\Auth::guard('guest'); +``` + +::: tip The guard method +You can directly run a guard on the `guard` method. + +```php +guard('guest'); +``` + +::: + + +### length + +With length, you can get how long a user has been logged in. You can save the session time logs to your database in order to track users' login logs. The available logs are `SESSION_STARTED_AT` and `SESSION_LAST_ACTIVITY` which are automatically tracked by Leaf. + +```php +$sessionDuration = auth()->length(); +``` + +### lastActive + +`lastActive` allows you to get how much time has passed since the last session activity. + +```php +$userLastSeen = auth()->lastActive(); +``` + +### refresh + +As the name implies, you can refresh the session with this method. Refreshing sort of restarts the session, but you can keep the user's old session data if you wish to. + +```php +if ($newAccountAdded) { + // will delete old session data + Leaf\Auth::refresh(); +} else { + // will keep session data + auth()->refresh(false);s +} +``` + +### status + +`status` checks whether a user session is ongoing by looking for keys specific to Leaf session auth so it doesn't confuse a Leaf auth session with user defined sessions. Returns the user if a session is found and false if there's no session found. + +```php +if (auth()->status()) { + return 'logged in'; +} else { + return 'guest mode'; +} +``` + +### logout + +Of course we'll need a method to logout/end our session. This is just the method for that. + +```php +auth()->logout(); +``` + +You can also pass in a route to redirect to after logging out. + +```php +auth()->logout('/home'); +``` + +## Next Steps + + diff --git a/apps/docs/src/modules/cookies/index.md b/apps/docs/src/modules/cookies/index.md new file mode 100755 index 0000000..59c11bc --- /dev/null +++ b/apps/docs/src/modules/cookies/index.md @@ -0,0 +1,320 @@ +# Leaf Cookie + + + +Cookies are small pieces of text sent to a client's browser by your application. They help your app remember information about users' visits, which can both make it easier to visit your app and make it more useful to your users. + +The cookie module helps you create, interact with and manage your cookies. + +## Installation + +You can quickly install leaf cookies with composer or leaf cli. + +```bash +leaf install cookie +``` + +or with composer: + +```bash +composer require leafs/cookie +``` + +## Usage + +
+ +Right after installing the cookie module, you can start using it on the `cookie()` method like this: + +```php +cookie()->set('name', 'Fullname'); +``` + +
+
+ +Leaf cookie provides a `Leaf\Http\Cookie` class for quickly using cookie methods: + +```php +use Leaf\Http\Cookie; + +... + +Cookie::set('name', 'Fullname'); +``` + +
+ +## Setting Cookies + +The cookie module provides 3 methods for setting cookies: + +- `set()` +- `simpleCookie()` +- `response()->withCookie` + +### Set + +This method allows you to set a cookie which should be returned with your next response to the client. It takes in 3 params: + +- cookie name (string|array) +- cookie value (optional - string) +- cookie options (optional - array) + +
+ +```php +// normal method +cookie()->set('name', 'Fullname'); + +// using array +cookie()->set(['name' => 'Fullname']); +``` + +
+
+ +```php +// normal method +Cookie::set('name', 'Fullname'); + +// using array +Cookie::set(['name' => 'Fullname']); +``` + +
+ +You can also set multiple cookies at a time + +
+ +```php +cookie()->set([ + 'name' => 'Fullname', + 'age' => '18' +]); +``` + +
+
+ +```php +Cookie::set([ + 'name' => 'Fullname', + 'age' => '18' +]); +``` + +
+ +Cookies can also be set with options. These options allow you to set the cookie's expiry time, path, domain, secure and httponly. They determine how long the cookie should last and who should have access to it. + +
+ +```php +cookie()->set('name', 'Fullname', ['expire' => 0]); +``` + +
+
+ +```php +Cookie::set('name', 'Fullname', ['expire' => 0]); +``` + +
+ +Options for cookies are: + +- expire +- path +- domain +- secure +- httponly + +### simpleCookie + +This method allows you to quickly set a cookie and it's expiry time. It takes in 3 params: + +- cookie name (string|array) +- cookie value (optional - string) +- cookie expiresAt (optional - string - default of 7 days) + +
+ +```php +cookie()->simpleCookie('name', 'Fullname', '2 days'); +``` + +
+
+ +```php +Cookie::simpleCookie('name', 'Fullname', '2 days'); +``` + +
+ +### response()->withCookie + +This method allows you to set a cookie directly on the response object. It takes in 3 params: + +- cookie name (string) +- cookie value (string) +- cookie expiresAt (optional - string - default of 7 days) + +
+ +```php +response()->withCookie('name', 'Fullname', '2 days')->json([ + 'message' => 'Cookie set' +]); +``` + +
+
+ +```php +$app + ->response + ->withCookie('name', 'Fullname', '2 days') + ->json([ + 'message' => 'Cookie set' + ]); +``` + +
+ +## Getting Cookies + +Just as you can set cookies, you can also get them from the client. The cookie module provides 2 methods for retrieve cookies: + +- `get()` +- `all()` + +### get + +`get()` returns a particular set cookie + +
+ +```php +$name = cookie()->get('name'); +``` + +
+
+ +```php +$name = Cookie::get('name'); +``` + +
+ +### all + +`all()` returns all set cookies. + +
+ +```php +$cookies = cookie()->all(); +``` + +
+
+ +```php +$cookies = Cookie::all(); +``` + +
+ +## Deleting Cookies + +The cookie module provides 3 methods for deleting cookies: + +- `response()->withoutCookie()` +- `unset()` +- `unsetAll()` + +### response()->withoutCookie + +This method allows you to delete a cookie directly on the response object. It takes in 1 param which is the cookie to delete. + +
+ +```php +response()->withoutCookie('name')->json([ + 'message' => 'Cookie deleted' +]); +``` + +
+
+ +```php +$app + ->response + ->withoutCookie('name') + ->json([ + 'message' => 'Cookie deleted' + ]); +``` + +
+ +### unset + +This method allows you to delete a cookie that was previously set. It takes in the cookie to unset. + +
+ +```php +cookie()->unset('name'); +``` + +
+
+ +```php +Cookie::unset('name'); +``` + +
+ +You can also unset multiple cookies at a time + +
+ +```php +cookie()->unset(['name', 'age']); +``` + +
+
+ +```php +Cookie::unset(['name', 'age']); +``` + +
+ +### unsetAll + +This method removes all set cookies. + +
+ +```php +cookie()->unsetAll(); +``` + +
+
+ +```php +Cookie::unsetAll(); +``` + +
diff --git a/apps/docs/src/modules/cors/index.md b/apps/docs/src/modules/cors/index.md new file mode 100755 index 0000000..4951cd5 --- /dev/null +++ b/apps/docs/src/modules/cors/index.md @@ -0,0 +1,181 @@ +# CORS + + + + + +From Wikipedia, Cross-origin resource sharing (CORS) is a mechanism that allows restricted resources on a web page to be accessed from another domain outside the domain from which the first resource was served. + +
+New to CORS? + + +
+ +## The CORS Module + +Since CORS is a common pain point for web developers, Leaf provides a simple way to deal with most CORS issues. Of course, you can always handle CORS manually, but this module just offers a more convenient and flexible way to do so. It is heavily inspired by the [ExpressJS](https://github.com/expressjs/express) [CORS package](https://github.com/expressjs/cors). + +## Installation + +You can install CORS through the Leaf CLI. + +```bash +leaf install cors +``` + +or with composer + +```bash +composer require leafs/cors +``` + +## Using the CORS Module + +After installing the cors module, Leaf automatically links it to your app, so it can be used directly on the Leaf instance as the `cors()` method. + +
+ +```php +cors(); + +// ... your app +``` + +
+
+ +```php +cors(); + +// ... your app +``` + +
+ +::: tip Usage Outside leaf +Leaf CORS can also be used without leaf's core. You simply need to reference methods on `Leaf\Http\Cors` which is the class for cors. + +```php +Leaf\Http\Cors::config([ + 'origin' => 'http://example.com', + 'optionsSuccessStatus' => 200, +]); +``` + +::: + +## Basic usage + +When you call `cors()` on your app, it enables CORS for all origins, headers and methods. This is the simplest way to enable CORS on your app. + +
+ +```php +cors(); + +$app->get('/products/{id}', function () use($app) { + $app->response()->json([ + 'message' => 'This is CORS-enabled for all origins!' + ]); +}); + +$app->run(); +``` + +
+
+ +```php +cors(); + +app()->get('/products/{id}', function () { + response()->json([ + 'message' => 'This is CORS-enabled for all origins!' + ]); +}); + +app()->run(); +``` + +
+ +However, there are times when you might want to be more restrictive by allowing only some origins to access your app. You can do this by passing in an options array to the `cors()` method. This array allows you to configure specific origins, methods, headers, etc. For example, the following code shows how to allow a single origin (http://example.com) to access your app using the `origin` option: + +
+ +```php +$app->cors([ + 'origin' => 'http://example.com', + 'optionsSuccessStatus' => 200, // some legacy browsers (IE11, various SmartTVs) choke on 204 +]); +``` + +
+
+ +```php +app()->cors([ + 'origin' => 'http://example.com', + 'optionsSuccessStatus' => 200 // some legacy browsers (IE11, various SmartTVs) choke on 204 +]); +``` + +
+ +A full list of all the options available can be found below. + +## Configuration Options + +* `origin`: Configures the **Access-Control-Allow-Origin** CORS header. Possible values: + * `String` - set `origin` to a specific origin. For example if you set it to `"http://example.com"` only requests from "http://example.com" will be allowed. + * `RegExp` - set `origin` to a regular expression pattern which will be used to test the request origin. If it's a match, the request origin will be reflected. For example the pattern `/example\.com$/` will reflect any request that is coming from an origin ending with "example.com". + * `Array` - set `origin` to an array of valid origins. Each origin can be a `String` or a `RegExp`. For example `["http://example1.com", /\.example2\.com$/]` will accept any request from "http://example1.com" or from a subdomain of "example2.com". + * `Function` - set `origin` to a function implementing some custom logic. The function takes the request origin as the first parameter and a callback (called as `callback(err, origin)`, where `origin` is a non-function value of the `origin` option) as the second. +* `methods`: Configures the **Access-Control-Allow-Methods** CORS header. Expects a comma-delimited string (ex: 'GET,PUT,POST') or an array (ex: `['GET', 'PUT', 'POST']`). +* `allowedHeaders`: Configures the **Access-Control-Allow-Headers** CORS header. Expects a comma-delimited string (ex: 'Content-Type,Authorization') or an array (ex: `['Content-Type', 'Authorization']`). If not specified, defaults to reflecting the headers specified in the request's **Access-Control-Request-Headers** header. +* `exposedHeaders`: Configures the **Access-Control-Expose-Headers** CORS header. Expects a comma-delimited string (ex: 'Content-Range,X-Content-Range') or an array (ex: `['Content-Range', 'X-Content-Range']`). If not specified, no custom headers are exposed. +* `credentials`: Configures the **Access-Control-Allow-Credentials** CORS header. Set to `true` to pass the header, otherwise it is omitted. +* `maxAge`: Configures the **Access-Control-Max-Age** CORS header. Set to an integer to pass the header, otherwise it is omitted. +* `preflightContinue`: Pass the CORS preflight response to the next handler. +* `optionsSuccessStatus`: Provides a status code to use for successful `OPTIONS` requests, since some legacy browsers (IE11, various SmartTVs) choke on `204`. + +The default configuration is the equivalent of: + +```json +{ + "origin": "*", + "methods": "GET,HEAD,PUT,PATCH,POST,DELETE", + "allowedHeaders": "*", + "exposedHeaders": "", + "credentials": false, + "maxAge": null, + "preflightContinue": false, + "optionsSuccessStatus": 204, +} +``` diff --git a/apps/docs/src/modules/date/index.md b/apps/docs/src/modules/date/index.md new file mode 100755 index 0000000..b00c616 --- /dev/null +++ b/apps/docs/src/modules/date/index.md @@ -0,0 +1,494 @@ + +# Leaf Date + +Leaf Date (now known as tick) is a minimalist PHP library that parses, validates, manipulates, and displays dates and times with a largely DayJS/MomentJS-compatible API. If you use DayJS, you already know how to use Tick. + +```php +tick()->now(); // get the current timestamp +tick()->format('YYYY-MM-DD'); // format the current timestamp +tick()->startOf('month')->add(1, 'day')->set('year', 2018)->format('YYYY-MM-DD HH:mm:ss'); +``` + +## Why Tick? + +### 3kB + +Less PHP to download, parse and execute, leaving more time for your code. + +### Simple + +Tick is a minimalist PHP library that parses, validates, manipulates, and displays dates and times a largely Day JS and Moment.js compatible API. If you use Day JS or Moment.js, you already know how to use Tick. + +## Installation + +You can install Tick through Leaf CLI: + +```bash +leaf install date +``` + +Or with composer: + +```bash +composer require leafs/date +``` + +## Date Operations + +The documentation will cover methods divided into 4 categories: + +- [Parsing](/modules/date/#parsing) +- [Manipulation](/modules/date/#manipulation) +- [Display](/modules/date/#display) +- [Querying](/modules/date/#querying) + +## Parsing + +Instead of modifying the native DateTime object, Tick creates a wrapper for the Date object. To get this wrapper object, simply call tick() with one of the supported input types. + +```php +tick('2018-01-01 12:00:00'); // create a date from a string +tick(); // will use today's date +``` + +### The `tick()` function + +Calling `tick()` without parameters returns a fresh Tick object. You can then use any of the tick methods to parse, manipulate, or display the date. + +```php +$now = tick() +``` + +This is essentially the same as calling `tick('with today\'s date')`. + +### String + +Parse the given string in ISO 8601 format (a space instead of the 'T' is allowed) and return a Tick object instance. + +```php +tick('2018-04-04T16:00:00.000Z') +tick('2018-04-13 19:18:17.040+02:00') +tick('2018-04-13 19:18') +``` + +### Date + +Create a Tick object with a pre-existing native DateTime object. + +```php +$d = new DateTime(); +tick(d); +``` + +## Get + Set + +Tick uses overloaded getters and setters, that is to say, calling these methods without parameters acts as a getter, and calling them with a parameter acts as a setter. + +These map to the corresponding function on the native DateTime object. + +```php +tick()->second(30); // set the second to 30 +tick()->second(); // get the second +``` + +### Millisecond + +Gets or sets the millisecond. + +Accepts numbers from 0 to 999. If the range is exceeded, it will bubble up to the seconds. + +```php +tick()->millisecond(); // gets current millisecond +tick()->millisecond(1); // returns new tick o->ject +``` + +### Second + +Gets or sets the second. + +Accepts numbers from 0 to 59. If the range is exceeded, it will bubble up to the minutes. + +```php +tick()->second(); // gets current second +tick()->second(1); // returns new tick object +``` + +### Minute + +Gets or sets the minutes. + +Accepts numbers from 0 to 59. If the range is exceeded, it will bubble up to the hour. + +```php +tick()->minute(); // gets current minute +tick()->minute(59); // returns new tick object +``` + +### Hour + +Gets or sets the hour. + +Accepts numbers from 0 to 23. If the range is exceeded, it will bubble up to the day. + +```php +tick()->hour(); // gets current hour +newDate = tick()->hour(12); // returns new tick object +``` + +### Date of Month + +Gets or sets the day of the month. + +Accepts numbers from 1 to 31. If the range is exceeded, it will bubble up to the months. + +```php +tick()->date(); // gets day of current month +tick()->date(1); // returns new tick object +``` + +### Day of Week + +Gets or sets the day of the week. + +Accepts numbers from 0 (Sunday) to 6 (Saturday). If the range is exceeded, it will bubble up to other weeks. + +```php +tick()->day(); // gets day of current week +tick()->day(0); // returns new tick object +``` + +### Month + +Gets or sets the month. + +Accepts numbers from 0 to 11. If the range is exceeded, it will bubble up to the year. + +```php +tick()->month(); // gets current month +tick()->month(0); // returns new tick object +``` + +### Year + +Gets or sets the year. + +```php +tick()->year(); // gets current year +tick()->year(2000); // returns new tick object +``` + +### Get + +String getter, returns the corresponding information getting from Tick object. +Units are case insensitive, short forms are case sensitive. + +```php +tick()->get('year'); +tick()->get('month'); // start 0 +tick()->get('date'); +tick()->get('hour'); +tick()->get('minute'); +tick()->get('second'); +tick()->get('millisecond'); +``` + +#### List of all available units + + +| Unit | Shorthand | Description | +| ----- | -------- | ----------- | +| date | D | Date of Month | +| day | d | Day of Week (Sunday as 0, Saturday as 6) | +| month | M | Month (January as 0, December as 11) | +| year | y | Year | +| hour | h | Hour | +| minute | m | Minute | +| second | s | Second | +| millisecond | ms | Millisecond | + +### Set + +Generic setter, accepting unit as first argument, and value as second, returns a new instance with the applied changes. + +In general: + +```php +tick()->set('date', 1); +tick()->set('month', 3); // April +tick()->set('second', 30); +``` + +For multiple set: + +```php +tick()->set('hour', 5)->set('minute', 55)->set('second', 15); +``` + +## Manipulation + +Once you have a Tick object, you may want to manipulate it in some way. + +Tick supports method chaining like this: + +```php +tick('2019-01-25')->add(1, 'day')->subtract(1, 'year')->year(2009)->toString() +``` + +### Add + +Returns a cloned Tick object with a specified amount of time added. + +```php +$a = tick(); +$b = a->add(7, 'day') + +// $a -> the original value and will not change +// $b -> the manipulation result +``` + +Units are case insensitive, short forms are case sensitive. + +#### List of all available `add` units + +| Unit | Shorthand | Description | +| ------------- | --------- | ---------------------------------------- | +| `day` | `d` | Day | +| `week` | `w` | Week | +| `month` | `M` | Month | +| `year` | `y` | Year | +| `hour` | `h` | Hour | +| `minute` | `m` | Minute | +| `second` | `s` | Second | +| `millisecond` | `ms` | Millisecond | + +### Subtract + +Returns a cloned Tick object with a specified amount of time subtracted. + +```php +tick()->subtract(7, 'year'); +``` + +Units are case insensitive, and support plural and short forms. + +[List of all available units](/modules/date/#list-of-all-available-add-units). + +### Start of Time + +Returns a cloned Tick object and set it to the start of a unit of time. + +```php +tick()->startOf('year') +``` + +Units are case insensitive, and support plural and short forms. + +#### List of all available `start` units + +| Unit | Shorthand | Description | +| ------------- | --------- | ---------------------------------------- | +| `year` | `y` | January 1st, 00:00 this year | +| `month` | `M` | the first day of this month, 00:00 | +| `week` | `w` | the first day of this week, 00:00 (locale aware) | +| `date` | `D` | 00:00 today | +| `day` | `d` | 00:00 today | +| `hour` | `h` | now, but with 0 mins, 0 secs, and 0 ms | +| `minute` | `m` | now, but with 0 seconds and 0 milliseconds | +| `second` | `s` | now, but with 0 milliseconds | + +### End of Time + +Returns a cloned Tick object and set it to the end of a unit of time. + +```php +tick()->endOf('month'); +``` + +The list of all available units is the same as [startOf](/modules/date/#list-of-all-available-start-units). + +## Display + +Once parsing and manipulation are done, you need some way to display the Tick object. + +### Format + +Get the formatted date according to the string of tokens passed in. + +To escape characters, wrap them in square brackets (e.g. [MM]). + +```php +tick()->format(); +// '2023-04-02T18:04:37+00:00' +// current date in ISO8601, without fraction seconds + +tick('2019-01-25')->format('[YYYYescape] YYYY-MM-DDTHH:mm:ssZ[Z]'); +// 'YYYYescape 2019-01-25T00:00:000Z' + +tick('2019-01-25')->format('DD/MM/YYYY'); // '25/01/2019' +``` + +#### List of all available formats + +| Format | Output | Description | +| ------ | ------ | ---------------------------------------- | +| `YY` | `70` | Two-digit year | +| `YYYY` | `1970` | Four-digit year | +| `M` | `1-12` | The month, beginning at 1 | +| `MM` | `01-12` | The month, 2-digits | +| `MMM` | `Jan-Dec` | The abbreviated month name | +| `MMMM` | `January-December` | The full month name | +| `D` | `1-31` | The day of the month | +| `DD` | `01-31` | The day of the month, 2-digits | +| `d` | `0-6` | The day of the week, with Sunday as 0 | +| `dd` | `Su-Sa` | The min name of the day of the week | +| `ddd` | `Sun-Sat` | The short name of the day of the week | +| `dddd` | `Sunday-Saturday` | The name of the day of the week | +| `H` | `0-23` | The hour | +| `HH` | `00-23` | The hour, 2-digits | +| `h` | `1-12` | The hour, 12-hour clock | +| `hh` | `01-12` | The hour, 12-hour clock, 2-digits | +| `m` | `0-59` | The minute | +| `mm` | `00-59` | The minute, 2-digits | +| `s` | `0-59` | The second | +| `ss` | `00-59` | The second, 2-digits | +| `SSS` | `000-999` | The millisecond, 3-digits | +| `Z` | `+01:00` | Offset from UTC, e.g. +01:00 | +| `ZZ` | `+0100` | Offset from UTC, e.g. +0100 | +| `A` | `AM` | AM, PM | +| `a` | `am` | am, pm | + +### Time from Now + +Returns the string of relative time from now. + +@>RelativeTime + +```php + +tick('2013-01-01')->fromNow(); // 10 years ago +``` + +If you pass true, you can get the value without the prefix/suffix. + +```php + +tick('2013-01-01')->fromNow(true); // 10 years +``` + +### Time from X + +Returns the string of relative time from X. + +```php +tick('1999-01-01')->from('2000-01-01'); // a year ago +``` + +If you pass true, you can get the value without the suffix. + +```php +tick('1999-01-01')->from('2000-01-01', true); // a year +``` + +### Time to Now + +Returns the string of relative time to now. + +```php + +tick('2033-01-01')->toNow(); // in 10 years +``` + +If you pass true, you can get the value without the prefix/suffix. + +```php + +tick('2033-01-01')->toNow(true); // 10 years +``` + +## Querying + +There are several methods to query a Tick object. + +### Is Before + +This indicates whether the Tick object is before the other supplied date-time. + +```php +tick()->isBefore('2011-01-01'); +``` + +### Is Same + +This indicates whether the Tick object is the same as the other supplied date-time. + +```php +tick()->isSame(new \DateTime('2011-01-01')); +``` + +### Is After + +This indicates whether the Tick object is after the other supplied date-time. + +```php +tick()->isAfter('2011-01-01'); +``` + +### Is Between + +This indicates whether the Tick object is between two other supplied date-time. + +```php + +tick('2010-10-20')->isBetween('2010-10-19', new \DateTime('2010-10-25')); +``` + +### Is Between Or Equal + +This indicates whether the Tick object is between two other supplied date-time or equal to one of them. + +```php + +tick('2010-10-20')->isBetweenOrEqual('2010-10-19', new \DateTime('2010-10-25')); +``` + +### Is same day + +This indicates whether the Tick object is the same day as the other supplied date-time. + +```php +tick('2010-10-20')->isSameDay('2010-10-20'); +``` + +### Is same month + +This indicates whether the Tick object is the same month as the other supplied date-time. + +```php + + +tick('2010-10-20')->isSameMonth('2010-10-20'); +``` + +### Is same year + +This indicates whether the Tick object is the same year as the other supplied date-time. + +```php +tick('2010-10-20')->isSameYear('2010-10-20'); +``` + +### Is Leap Year + +This indicates whether the Tick object's year is a leap year or not. + +```php +tick('2000-01-01')->isLeapYear(); // true +``` + +### Is DateTime + +This indicates whether the Tick object is a DateTime object or not. + +```php +tick()->isDateTime('2000-01-01'); // false +``` diff --git a/apps/docs/src/modules/db-old/index.md b/apps/docs/src/modules/db-old/index.md new file mode 100755 index 0000000..df788a1 --- /dev/null +++ b/apps/docs/src/modules/db-old/index.md @@ -0,0 +1,179 @@ +--- +title: "Leaf Db (Old)" +--- + + +# Leaf DB + +This is Leaf's simple query builder created in Leaf v1 but still maintained till date. This class provides a convenient but usual way to quickly create and run database queries. It can be used to perform most database operations in your app. It currently supports Mysqli and PDO connections, though we still recommend using Mysqli. There's no need to worry about SQL injection as parameter binding is also supported and easy to use😉💪 + +## Installation + +You can quickly install leaf db with composer or the leaf cli. + +```bash +composer require leafs/db-old +``` + +or with leaf cli: + +```bash +leaf install db-old +``` + +## Initialising Leaf DB + +Leaf DB has 2 different packages, 1 for mysqli and the other for PDO. So you can import which ever package you wish to use. **Leaf recommends using the mysqli package.** + +```php +use Leaf\Db\Mysqli; + +$db = new Mysqli(); + +use Leaf\Db\PDO; + +$db = new PDO(); +``` + +**Both DB:PDO and DB:Mysqli use the same methods, so all the code below works the same for whichever you're using. We'll alert you if something works differently.** + +
+ +## DB connection + +The first thing you need to do to use Leaf DB is to connect to your database. This can be achieved with `connect()` + +### On the leaf object + +In v2.1, the default `$app->db` object has been replaced with `Leaf\Db`, therefore, you have to initialise DB Mysqli to use it's methods. + +#### DB Mysqli + +```php +use Leaf\Db\Mysqli; + +$db = new Mysqli(); +$db->connect($host, $user, $password, $dbname); +``` + +#### DB + +```php +use Leaf\Db\PDO; + +$db = new PDO(); +$db->connect($host, $dbname, $user, $password); +``` + +This will set the connection for use within Leaf DB. + +Both packages now support `auto_connect` which allows you to connect to your database using variables set in a `.env` file. + +```php +$db->auto_connect(); +``` + +
+ +## Queries + +### Making simple queries + +Queries with with Leaf DB are much like what you're used to. Though a query builder, we wan't to maintain the flexibility of normal database queries, hence, we provided the query() method to make your normal database queries. + +```php +$db->connect($host, $user, $password, $dbname); + +$app->get('/users/all', function () use($app) { + $users = $db->query("SELECT username FROM users")->fetchAll(); + $app->response()->json($users); +}); +``` + +As normal as this seems, we take it a step further by providing you with a much simpler way to use prepared statements. + +```php +$db->connect($host, $user, $password, $dbname); + +$app->get('/users/{id}', function ($id) use($app) { + $user = $db->query("SELECT username FROM users WHERE id = ?", [$id])->fetchObj(); + $app->response()->json($user); +}); +``` + +We've looked at making queries, but then `query()` still makes you type out whatever query you need to use. It's certainly easier than raw queries, but it's nothing impressive. Below are some of Leaf DB's handy methods to make queries even easier.💪😉 + +### [Retrieving Data](/modules/db-old/select) + +Read the [select docs](/modules/db-old/select) for all the information on retrieving data from your database. + +### [Inserting Data](/modules/db-old/insert) + +Read the [insert docs](/modules/db-old/insert) for all the information on inserting data into your database. + +### Updating Data + +This operation uses UPDATE. With Leaf DB: + +```php +$db->update(); +``` + +#### Update + +We use Leaf DB's update method which takes in a "table", a "column-value" to update and "conditions". + +```php +$db->update("posts", "title = 'Post 1'", "title = 'Post One'"); +``` + +This will look for a post with the title of "Post One" and change it to "Post 1". +You can also have multiple conditions: + +```php +$db->update("posts", "title = 'Post 1' AND author = 'Mychi Darko'", "title = 'Post One'"); +``` + +##### With Parameter Binding + +```php +$db->update("posts", "title = ? AND author = ?", "title = ?", ["Post 1", "Mychi Darko", "Post One"]); +``` + +
+ +### Deleting Data + +This operation uses DELETE. With Leaf DB: + +```php +$db->delete(); +``` + +#### Delete + +We use Leaf DB's delete method which takes in a "table", and "conditions". + +```php +$db->delete("posts", "title = 'Post 1'"); +``` + +This will look for a post with the title of "Post 1" and delete it. + +## Others + +### Row Count + +Get the number of rows from select + +```php +$db->select("posts")->count(); +``` + +### Connection Close + +Close the connection + +```php +$db->close(); +``` diff --git a/apps/docs/src/modules/db-old/insert.md b/apps/docs/src/modules/db-old/insert.md new file mode 100755 index 0000000..84dad2b --- /dev/null +++ b/apps/docs/src/modules/db-old/insert.md @@ -0,0 +1,101 @@ +--- +aside: none +--- + + +# Inserting Data + +Leaf DB has provided really simple, but very helpful methods for inserting data into the database. + + + +## db insert + +### Saving data + +We user `$db->insert` to save data in the database. `insert` takes in a "table" to insert data, "column(s)" and "value(s)": + +```php +$db->insert("posts", "title", "This is post One"); +``` + +You can also add multiple columns like so: + +```php +$db->insert("posts", "title, body", "post One, This is the body of post One"); +``` + +#### Using Prepared Statements + +Prepared statements help protect against SQL injection,... + +```php +$db->insert("posts", "title, body", "?, ?", ["post One, This is the body of post One"]); +``` + +
+ +## Db add + +`add` simply offers a more consice, powerful way to retrieve data from a database. It also uses prepared statements by default, so you're safe in that respect. + +Instead of several parameters in `$db->insert`, `$db->add` takes in an array with key-value pairs to be saved in the database. + +```php +$db->add("posts", ["title" => "Post One", "body" => "This is the body"]); + +// $db->add($table, $params_to_insert); +``` + +### Uniques + +Let's say you want to check whether the username a user just entered has been taken, you'd have to write a bunch of conditional code, making the code count larger and more error prone, right? + +Well, `add` solves this problem smoothly. `add` has a 3rd parameter: an array of unique values which makes sure that the same value can't be saved twice. + +```php +$db->add("users", ["name" => "mychi", "email" => "m@m.com", "pass" => "1234"], ["name", "email"]); +``` + +So, we're telling `add` to alert us if someone has already registered with the name `mychi` or the email `m@m.com`. This is because we passed `["name", "email"]` as the 3rd param to `add` + +**With uniques, you can cut down on your whole app:** +For instance, if you know the exact data you'll be receiving in your app, let's say a username, email and password from a register form, you can do something like this: + +```php +$app->post("/register", function () use($app, $db) { + $db->add("users", $app->request->body(), ["username", "email"]); +}); +``` + +So, we pass in the entire request body, which contains the username, email and password. Simple right? + +#### Validation + +`add` also has inbuilt validation which validates parameters according to set rules. This uses the [`Leaf\Form->validate`](/modules/forms/) method. You can check it out for more information on validation. + +`add` takes in a 4th parameter which is a boolean, this is whether of not to validate the data passed into `add` using the default checks. + +By default, `add` validates values with the keys: `email`, `username` and any other field is marked as `required`. If any of the validations fail, an error is raised. You can turn this feature off: + +```php +$db->add("posts", ["title" => "Post One", "body" => "..."], ["title"], false); +``` + +#### Custom Validation + +This is the 5th parameter of `add`. These are custom rules that you set to validate. + +```php +$db->add("posts", ["title" => "Post One", "body" => "..."], ["title"], false, [ + "author" => "validUsername" +]); +``` + +Here, we're telling `add` that the **author** parameter should be a valid username. If thiscondition(rule) is not met, the application throws an error and breaks. + +You can view all validation rules [here](/modules/forms/#validation) + +```php +$db->add($table, $params, $uniques, $defaultChecks, $validation); +``` diff --git a/apps/docs/src/modules/db-old/model.md b/apps/docs/src/modules/db-old/model.md new file mode 100755 index 0000000..cbe8309 --- /dev/null +++ b/apps/docs/src/modules/db-old/model.md @@ -0,0 +1,40 @@ +# Leaf MVC Models + +In LeafMVC, we don't really have anything to do with our models: Leaf Core has taken all the trouble out of using models, so all we have to do in LeafMVC is to generate the model and include it in our controller. + +Our Models are kept in `app/models`, but we won't need to create our models manually. Leaf MVC's command line tool covers this for us. + +```bash +php leaf g:model +``` + +That's all we need to do with our model. LeafMVC's models have methods prepared which allow us to manipulate out database without doing much. + +We can create, read, update and delete without writing any code to specially access our database. + +In our controller, we can do these: + +```php +// return all rows +ModelName::all(); + +// return all rows sorted by date created +ModelName::orderBy('created_at', 'desc')->get() + +// find a database row by id +ModelName::find($id); + +// find a database row by title +ModelName::where('title', 'Title goes here')->get(); + +// create a new database row +$model = new ModelName; +$model->field = $this->request->getParam("field"); +$model->save(); + +// delete a post +$model = ModelName::find($id); +$model->delete(); +``` + +Checkout [building your first app](/docs/introduction/first-app) for more practical use cases diff --git a/apps/docs/src/modules/db-old/select.md b/apps/docs/src/modules/db-old/select.md new file mode 100755 index 0000000..a588674 --- /dev/null +++ b/apps/docs/src/modules/db-old/select.md @@ -0,0 +1,155 @@ +--- +aside: none +--- + + +# Retrieving Data + +If you're attempting to use this, you've probably seen or used `SELECT` statements before. Leaf DB has provided an even easier way to use select. + +Leaf has provided a new method to make retrieving data even simpler and more organised. `choose` + +## db select + +### Getting all rows from a table + +To do this, we use the `select()` methode. All that we have to do is to pass in the table we want to retrieve. For example, to get all users from the "users" table, we simply do: + +```php +$db->select("users"); +``` + +To actually get the results, we'll have to chain `fetchAll()` to the select method. `fetchAll()` does the same thing that `mysqli_fetch_all()` does to an mysqli result + +```php +$db->select("users")->fetchAll(); +``` + +#### Getting a column from a table + +Getting a single column, eg: getting all usernames from the users table + +```php +$db->select("users", "username")->fetchAll(); +``` + +This is like saying `SELECT username FROM users`. You can also pass in multiple options + +```php +$db->select("users", "username, email")->fetchAll(); +``` + +You can get all columns with: + +```php +$db->select("users")->fetchAll(); +// or +$db->select("users", "*")->fetchAll(); +``` + +#### Getting a particular row from a table + +Getting a particular row, eg: getting the user with the id of 1 from the users table. You acan achieve this with: + +```php +$db->select("users", "*", "id = 2")->fetchObj(); +``` + +`fetchObj` does the same thing as `mysqli_fetch_obj` and `fetch(PDO::FETCH_OBJ)` + +If you don't need the whole row, you can use: + +```php +$db->select("users", "username, email", "id = 2")->fetchObj(); +``` + +#### Limit data + +Limiting data is also very simple with Leaf DB + +```php +// get the latest 10 posts +$users = $db->select("posts ORDER BY id DESC LIMIT 10")->fetchAll(); + +// with parameters +$books = $db->select("books", "*", "author = ? ORDER BY id DESC LIMIT 5", [$author])->fetchAll(); +``` + +#### Using Prepared Statements + +Prepared statements help protect against SQL injection,... + +```php +$db->select("users", "*", "username = ? AND password = ?", [$username, $password])->fetchObj(); +``` + +
+ +## Db choose + +`choose` simply offers a more consice, powerful way to retrieve data from a database. It also uses prepared statements by default, so you're safe in that respect. + +For basic uses, we'll recommend you use `select`: + +```php +$db->select("users")->fetchAll(); + +$db->select("users", "username")->fetchAll(); + +$db->select("users", "username, email")->fetchAll(); +``` + +### Getting a particular row from a table + +Getting a particular row, eg: getting the user with the id of 2 from the users table. You acan achieve this with: + +```php +$db->choose("users", "*", ["id" => 2])->fetchObj(); +``` + +If you don't need the whole row, you can use: + +```php +$db->choose("users", "username, mobile", ["email" => "mychi@leafphp.dev"])->fetchObj(); +``` + +#### Data Options + +So unlike `select`, choose takes in an array, which is much clearner than writing partial SQL queries, also, the params you pass in are safe from SQL injection. + +Also, unlike select, you seperate data options like `LIMIT` and `ORDER` into a 4th parameter + +```php +$db->choose("books", "*", ["author" => "mychi.darko", "published" => "2019"], "LIMIT 5"); +``` + +#### Validation + +`choose` also has inbuilt validation which validates parameters according to set rules. This uses the [`Leaf\Form->validate`](/modules/forms/) method. You can check it out for more information on validation. + +`choose` takes in a fifth parameter which is a boolean, this is whether of not to validate the data passed into `choose` using the default checks. + +By default, `choose` validates values with the keys: `email`, `username` and any other field is marked as `required`. If any of the validations fail, an error is raised. You can turn this feature off: + +```php +$db->choose("books", "*", ["author" => "mychi.darko", "published" => "2019"], "LIMIT 5", false); +``` + +#### Custom Validation + +This is the sixth parameter of `choose`. These are custom rules that you set to validate. + +```php +$db->choose("books", "*", ["author" => "mychi.darko", "published" => "2019"], "LIMIT 5", false, [ + "author" => "validUsername", + "published" => "number" +]); +``` + +Here, we're telling `choose` that the **author** parameter should be a valid username, and the **published** param should contain only numbers. If any of these conditions(rules) are not met, the application throws an error and breaks. + +You can view all validation rules [here](/modules/forms/#validation) + +```php +$db->choose($table, $fields, $params, $options, $defaultChecks, $validation); +``` diff --git a/apps/docs/src/modules/db/index.md b/apps/docs/src/modules/db/index.md new file mode 100755 index 0000000..ba5a113 --- /dev/null +++ b/apps/docs/src/modules/db/index.md @@ -0,0 +1,688 @@ +# Getting Started + + + + + +Interacting with a database is a common requirement for most modern web applications. Leaf Db simplifies this process by providing a unified API that supports multiple databases. Leaf Db currently offers first-party support for five databases: + +- MariaDB +- MySQL +- PostgreSQL +- SQLite +- SQL Server + +
+Don't understand Databases? + + + + + +
+ +## Installing Leaf Db + +You can install Leaf Db with Leaf CLI: + +```bash +leaf install db +``` + +Or with composer: + +```bash +composer require leafs/db +``` + +From there, you can link your database and start writing some awesome queries. + +
+ +## Functional Mode + +If you are using leaf db v2 in a leaf 3 app, you will have access to the `db` global which allows you to use Leaf Db from anywhere in your entire application. You simply need to call `db()` and leaf 3 will create and maintain a shared instance of Leaf db which you can call from anywhere. + +This also means that you don't need to initialize leaf db anymore. + +```php +connect('127.0.0.1', 'test'); + +app()->get("/", function () { + // db can be used here + // db()->... +}); + +app()->run(); +``` + +
+ +## Db Connection + +After installing leaf db, you will need to connect to your database to get started. There are multiple ways to connect to your database using leaf db. + +
+ +### connect on init + +This method connects to the database when initializing Leaf Db. + +```php +// syntax +$db = new Leaf\Db( + $host = '', + string $dbname = '', + string $user = '', + string $password = '', + string $dbtype = 'mysql' +); + +// example +$db = new Leaf\Db('127.0.0.1', 'db_name', 'root', 'password123'); +``` + +Leaf db takes in 5 optional parameters: + +- The database host eg: localhost +- The database name +- The database username +- The database password +- The PDO database driver eg: mysql, pgsql, ... + +Alternatively, you can pass an array into the host parameter to connect to your database like this: + +```php +// syntax +$db = new Leaf\Db([ + 'dbtype' => 'mysql', + 'charset' => null, + 'port' => null, + 'unixSocket' => null, + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => '', + 'dbname' => '', +]); + +// example +$db = new Leaf\Db([ + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => 'password123', + 'dbname' => 'db name', +]); +``` + +You only need to pass the fields you want to configure. + +::: tip Example sqlite connection + +Unlike other database types, SQLite databases are contained within a single file on your filesystem. This means that you don't need to create a database before connecting to it. You can simply pass the path to the database file as the database name. + +```php +$db = new Leaf\Db([ + 'dbtype' => 'sqlite', + 'dbname' => 'db.sqlite', +]); +``` + +::: + +
+ +### Manual database connection + +Leaf DB ships with a `connect()` method which allows you to connect to your database by passing in the required parameters. + +
+ +```php +$db = new Leaf\Db; + +// syntax +$db->connect( + $host = '', + string $dbname = '', + string $user = '', + string $password = '', + string $dbtype = 'mysql', + array $pdoOptions = [] +); + +// example +$db->connect('127.0.0.1', 'dbname', 'root', ''); +``` + +Connect works the same way as the constructor, except that it accepts one more parameter: `$pdoOptions` which is a bunch of configuration specific to the PHP `PDO` class. + +
+
+ +```php +// syntax +db()->connect( + $host = '', + string $dbname = '', + string $user = '', + string $password = '', + string $dbtype = 'mysql', + array $pdoOptions = [] +); + +// example +db()->connect('127.0.0.1', 'dbname', 'root', ''); +``` + +Leaf db takes in 5 optional parameters: + +- The database host eg: localhost +- The database name +- The database username +- The database password +- The PDO database driver eg: mysql, pgsql, ... +- Configuration specific to the PHP `PDO` class + +
+ +Alternatively, you can pass an array into the host parameter to connect to your database like this: + +
+ +```php +// syntax +db()->connect([ + 'dbtype' => 'mysql', + 'charset' => null, + 'port' => null, + 'unixSocket' => null, + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => '', + 'dbname' => '', +]); + +// example +db()->connect([ + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => 'password123', + 'dbname' => 'db name', +]); +``` + +
+
+ +```php +$db = new Leaf\Db(); + +// syntax +$db->connect([ + 'dbtype' => 'mysql', + 'charset' => null, + 'port' => null, + 'unixSocket' => null, + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => '', + 'dbname' => '', +]); + +// example +$db->connect([ + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => 'password123', + 'dbname' => 'db name', +]); +``` + +
+ +You only need to pass the fields you want to configure. + +::: tip Example sqlite connection + +Unlike other database types, SQLite databases are contained within a single file on your filesystem. This means that you don't need to create a database before connecting to it. You can simply pass the path to the database file as the database name. + +
+ +```php +db()->connect([ + 'dbtype' => 'sqlite', + 'dbname' => 'db.sqlite', +]); +``` + +
+
+ +```php +$db = new Leaf\Db(); +$db->connect([ + 'dbtype' => 'sqlite', + 'dbname' => 'db.sqlite', +]); +``` + +
+ +::: + +### Auto Connect + +Leaf DB also allows you to connect to your database using the database credentials set in your environment variables. This is much easier than having to pass in the credentials every time you want to connect to your database. You can do this using the `autoConnect()` method. + +**example env:** + +```env +DB_CONNECTION=mysql +DB_HOST=127.0.0.1 +DB_PORT=3306 +DB_DATABASE=LeafMVC +DB_USERNAME=root +DB_PASSWORD= +``` + +Using the `autoConnect()` method, you can connect to your database like this: + +
+ +```php +db()->autoConnect(); +``` + +
+
+ +```php +$db = new Leaf\Db; +$db->autoConnect(); +``` + +
+ +### PDO connection + +Leaf Db also allows you to skip the entire connection process and share an existing PDO instance with leaf db. This allows you to gradually rewrite your existing apps with Leaf Db without having multiple db connections and doing so at your own pace. + +
+ +```php +$db = new PDO('mysql:dbname=test;host=127.0.0.1', 'root', ''); + +db()->connection($db); + +// you can use leaf db the same way you always have +``` + +
+
+ +```php +$pdo = new PDO('mysql:dbname=test;host=127.0.0.1', 'root', ''); + +$db = new Leaf\Db(); +$db->connection($pdo); + +// you can use leaf db the same way you always have +``` + +
+ +## Simple queries + +Leaf Db provides a ton of functionality, with a bunch of powerful tools, but at the same time gives you a great deal of customizations with the `query` method. You can write your raw SQL queries with the `query` method, however you can still use the cool features Leaf Db provides. + +
+ +```php +$users = db()->query('SELECT * FROM users')->all(); +``` + +
+
+ +```php +$users = $db->query('SELECT * FROM users')->all(); +``` + +
+ +You can also use parameter binding with `query` + +
+ +```php +db()->query('SELECT * FROM users WHERE id = ?')->bind('1')->fetchObj(); +``` + +
+
+ +```php +$db->query('SELECT * FROM users WHERE id = ?')->bind('1')->fetchObj(); +``` + +
+ +A shorter method would be to use `where` + +
+ +```php +db()->query('SELECT * FROM users')->where('id', '1')->fetchObj(); +``` + +
+
+ +```php +$db->query('SELECT * FROM users')->where('id', '1')->fetchObj(); +``` + +
+ +You don't have to worry about security, `where` uses prepared statements by default, so you're pretty good. + +You've seen all this, but guess what? There's something even shorter + +
+ +```php +db()->select('users')->where('id', '1')->fetchObj(); +``` + +
+
+ +```php +$db->select('users')->where('id', '1')->fetchObj(); +``` + +
+ +This is what Leaf Db does for you. A new way to write your Database queries without actually needing to write any real queries. Also, unlike other query builders, there's no need to create classes and models for every table you want to fetch from. Everything's accessible with one line of code. + +## Running queries + +There are different types of queries, some return values and others don't. Leaf Db provides a seamless way of handling both. + +### execute + +`execute` is a method on Leaf Db which allows you to run a query instantly. The `execute` method is used when the query is **NOT** expected to return a value. + +
+ +```php +db()->query('CREATE DATABASE dbname')->execute(); +``` + +
+
+ +```php +$db->query('CREATE DATABASE dbname')->execute(); +``` + +
+ +### fetchAll + +`fetchAll` is a method simply returns all the results of a query. Under the hood, the query is run using `execute` and the value is retrieved and returned. This method is used when there are a lot of values to return. + +
+ +```php +$users = db()->query('SELECT * FROM users')->fetchAll(); +``` + +
+
+ +```php +$users = $db->query('SELECT * FROM users')->fetchAll(); +``` + +
+ +::: tip Aliases +`fetchAll` has aliases adapted from other libraries and frameworks. Instead of `fetchAll`, you can use `all` and `get` + +
+ +```php +$users = db()->query('SELECT * FROM users')->all(); +$users = db()->query('SELECT * FROM users')->get(); +``` + +
+
+ +```php +$users = $db->query('SELECT * FROM users')->all(); +$users = $db->query('SELECT * FROM users')->get(); +``` + +
+ +::: + +In this case, the `$users` variable with contain an array of associative arrays, but if you want an array of objects, you can pass `obj` or `object` as a parameter into `fetchAll` + +
+ +```php +$users = db()->query('SELECT * FROM users')->fetchAll('obj'); +$users = db()->query('SELECT * FROM users')->all('object'); +$users = db()->query('SELECT * FROM users')->get('obj'); +``` + +
+
+ +```php +$users = $db->query('SELECT * FROM users')->fetchAll('obj'); +$users = $db->query('SELECT * FROM users')->all('object'); +$users = $db->query('SELECT * FROM users')->get('obj'); +``` + +
+ +### fetchObj + +`fetchObj` is a method that fetches the next row and returns it as an object. It returns only one object, so it should be used only on queries that return a single item. + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->fetchObj(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->fetchObj(); +``` + +
+ +::: tip Aliases +Instead of `fetchObj`, you can use `obj` + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->obj(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->obj(); +``` + +
+ +::: + +::: warning Watch out +`fetchObj` returns an object, so you can use the result like this: + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->obj(); +$user->id // not $user["id"] +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->obj(); +$user->id // not $user["id"] +``` + +
+ +::: + +### fetchAssoc + +`fetchAssoc` is a method that fetches the next row and returns it as an array. It returns only one array, so it should be used only on queries that return a single item. + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->fetchAssoc(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->fetchAssoc(); +``` + +
+ +::: tip Aliases +Instead of `fetchAssoc`, you can use `assoc` + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->assoc(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->assoc(); +``` + +
+ +::: + +::: warning Watch out +`fetchAssoc` returns an array, so you can use the result like this: + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->assoc(); +$user['id'] // not $user->id +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->assoc(); +$user['id'] // not $user->id +``` + +
+ +::: + +### first + +`first` returns the first item in the database that matches the condition given. + +
+ +```php +$user = db()->query('SELECT * FROM users')->first(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users')->first(); +``` + +
+ +Although all our users are saved in the `users` table, `first` will return only the first record. + +### last + +`last` returns the last item in the database that matches the condition given. + +
+ +```php +$user = db()->query('SELECT * FROM users')->last(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users')->last(); +``` + +
+ +Although all our users are saved in the `users` table, `last` will return only the last record. + + diff --git a/apps/docs/src/modules/db/mvc.md b/apps/docs/src/modules/db/mvc.md new file mode 100644 index 0000000..b2ca169 --- /dev/null +++ b/apps/docs/src/modules/db/mvc.md @@ -0,0 +1,19 @@ +# Usage with Leaf MVC + +Leaf MVC and Leaf API both come with built-in support for Leaf DB. This means you can skip the initial setup and get right into using Leaf DB. To get started, head over to your `public/index.php` file and uncomment the following line: + +```php +\Leaf\Database::initDb(); +``` + +This will allow Leaf DB to use your database connection set up in your `.env` file. If you don't have a database connection set up, you can set one up by following the [Leaf MVC Database docs](/docs/leafmvc/). Although you can use Leaf DB in Leaf MVC and Leaf API, they follow the MVC pattern, so we recommend using Models to interact with your database instead of writing queries with Leaf DB. Of course, you should still initialize Leaf DB if you want to use [Leaf Auth](/modules/auth/). + +## Models + +Leaf DB doesn't come with any pre-defined model classes, so for this, Leaf MVC and Leaf API use Laravel's Eloquent ORM. This means you can use all of Laravel's Eloquent methods on your models. You can find the full docs [here](https://laravel.com/docs/8.x/eloquent). + +The `initDb()` method above also syncs Leaf DB with Eloquents' database connection. Of course, you can use your models without calling `initDb()`, but you'll have to set up your Leaf DB connection manually if you want to use [Leaf Auth](/modules/auth/). + +## Usage + +From this point on, you can use Leaf DB as you would normally. You can find the full docs [here](/modules/db/). diff --git a/apps/docs/src/modules/db/v/1/index.md b/apps/docs/src/modules/db/v/1/index.md new file mode 100755 index 0000000..db4e242 --- /dev/null +++ b/apps/docs/src/modules/db/v/1/index.md @@ -0,0 +1,520 @@ +--- +title: "Leaf Db v1" +--- + +# 💽 Leaf Db + + +Leaf Db is a new lightweight but powerful query builder which allows you quickly write dynamic queries, validate and perform operations on the data in just a single line of code. + +You can install Leaf Db with Leaf CLI: + +```bash +leaf install db +``` + +Or with composer: + +```bash +composer require leafs/db +``` + +From there, you can link your database and start writing some awesome queries. + +## Db Connection + +The first thing to always do is to connect to your database. Since all db operations are performed on the database, you can't do without it. + +There are 3 ways to connect your database. + +### connect on init + +This method connects to the database when initializing Leaf Db. + +```php +$db = new Leaf\Db("db_host", "user", "password", "db_name"); +``` + +### connect + +Connect takes in 4 params just like the method above + +```php +$db = new Leaf\Db; +$db->connect("db_host", "user", "password", "db_name"); +``` + +### autoConnect + +This method allows you to connect to your database from parameters in a `.env` file. Most MVC frameworks and other libraries rely on a `.env` for a lot of configurations including the database. With `autoConnect`, you can directly pick up these configs. + +**example env:** + +```env +DB_CONNECTION=mysql +DB_HOST=127.0.0.1 +DB_PORT=3306 +DB_DATABASE=LeafMVC +DB_USERNAME=root +DB_PASSWORD= +``` + +**App:** + +```php +$db = new Leaf\Db; +$db->autoConnect(); +``` + +## Queries + +### Making simple queries + +Leaf Db provides a ton of functionality, with a bunch of powerful tools, but at the same time gives you a great deal of customizations with the `query` method. You can write your raw SQL queries with the `query` method, however you can still use the cool features Leaf Db provides. + +```php +$users = $db->query("SELECT * FROM users")->all(); +``` + +You can also use parameter binding with `query` + +```php +$db->query("SELECT * FROM users WHERE id = ?")->bind("1")->fetchObj(); +``` + +A shorter method would be to use `where` + +```php +$db->query("SELECT * FROM users")->where("id", "1")->fetchObj(); +``` + +You don't have to worry about security, `where` uses prepared statements by default, so you're pretty good. + +You've seen all this, but guess what? There's something even shorter + +```php +$db->select("users")->where("id", "1")->fetchObj(); +``` + +This is what Leaf Db does for you. A new way to write your Database queries without actually needing to write any real queries. Also, unlike other query builders, there's no need to create classes and models for every table you want to fetch from. Everything's accessible with one line of code. + +## select + +As you saw in the example above, `select` makes writing select statements really simple. + +It takes in 2 parameters: + +- The table to select items from +- The columns to include (includes all by default) + +```php +// returns all items +$items = $db->select("items")->all(); + +// returns the username & email of all buyers +$buyers = $db->select("buyers", "username, email")->fetchAll(); +``` + +### where + +The where method allows you to quickly write a where block. + +```php +$user = $db->select("users")->where("username", "mychi")->first(); +``` + +You can also pass in a bunch of params to check for: + +```php +$user = $db->select("users")->where(["username" => "mychi", "password" => "..."])->first(); +``` + +### orWhere + +`orWhere` also functions just like `where`, except that in the case of multiple parameters, `orWhere` returns results even if one of the conditions is met, but `where` only returns results if all the conditions are matched. + +```php +$users = $db->select("users")->orWhere(["username" => "mychi", "username" => "darko"])->all(); +``` + +### whereLike + +`whereLike` is technically the same as `where`, except that instead of comparing stuff "strictly equal", it finds something `like` the value, using the like operator. + +```php +$items = $db->select("items")->whereLike("title", "c%")->all(); +``` + +This finds any item with a title that starts with c. `%` can be used to modify how the `LIKE` comparism is done, however if you're not sure about the % works, leaf has Db helpers for you. + +```php +// item begins with ... +whereLike("title", Db::beginsWith("char")) + +// item ends with ... +whereLike("title", Db::endsWith("char")) + +// item includes ... +whereLike("title", Db::includes("char")) + +// item starts and ends with ... +whereLike("title", Db::word("char", "ter")) +``` + +### like + +This is an alias for `whereLike`. So you can use `like` instead of `whereLike` + +### orWhereLike + +This combines `orWhere` and `whereLike` in a sense that `orWhereLike` compares using `OR` instead of `AND`, just like `orWhere`, but instead uses the LIKE operator just as `whereLike` does. The interesting thing is that you can combine it with any other where block to make a more complex query. + +```php +$items = $db->select("items") + ->where("published", true) + ->whereLike("title", $db->beginsWith("sa")) + ->orWhereLike("description", $db->beginsWith("sa")) + ->all(); +``` + +### orLike + +This is an alias for `orWhereLike`. So you can use `orLike` instead of `orWhereLike` + +## Getting your data + +After the query is run, the data is returned to leaf db. You can use the methods below to retrieve that data. + +### fetchAll + +`fetchAll` is a method that's used together with the `select` method. This method simply returns an array consisting of a lot of objects. It is mostly used when querying multiple rows. + +```php +$items = $db->select("items")->fetchAll(); +``` + +Although the query here is `$db->select("items")`, running just this would return nothing. To actually get the result of this query, you'd need to call `execute`, `fetchObj`, `fetchAssoc` or `fetchAll` + +### all + +`all` is an alias for `fetchAll`, but is shorter and more familiar with devs who have used other packages. Don't worry, `fetchAll` isn't getting deprecated, you can use it just as you've always done. + +### first + +`first` returns the first entity of all matching results for a certain query. + +```php +function getFirstItem() +{ + // ... + return $db->select("items")->first(); +} +``` + +### last + +`last` returns the last entity of all matching results for a certain query. + +```php +function getLastItem() +{ + // ... + return $db->select("items")->last(); +} +``` + +### execute + +This method is used on queries which don't return anything like insert, update and delete queries. This method just runs the desired query and returns `void`, however, if there is a problem, it returns `null`. You can then call `$db->errors()` to get the exact error. + +From v2.4-beta up, execute takes in an **optional** parameter, the type of values passed into `bind`, `params` or `where` + +```php +$db->insert("users")->params(["username" => "mychi"])->execute("s"); +``` + +### fetchObj + +This is just like `fetchAll` except that fetchObj is used on select queries usually involving one row + +```php +$db->select("users")->where("id", "1")->fetchObj(); +``` + +If `fetchAll` is used in this case, the result would look something like this: + +```php +[ + [ + "id" => "1" + ] +] +``` + +Also, note that `fetchObj` returns an object, so you can use the result like this + +```php +$user = $db->select("users")->where("id", "1")->fetchObj(); +$user->id // not $user["id"] +``` + +### fetchAssoc + +This is just like the `fetchObj` method, except that it returns an associative array, not an object. + +```php +$user = $db->select("users")->where("id", "1")->fetchAssoc(); +$user["id"]; // not $user->id +``` + +## Table operations + +### table + +`table` sets the table pointer for the db table being used. `table` can be combined with other methods like `search`. + +```php +$db->table("items"); +``` + +### search + +Just as the name implies, you can use this method to search for a value in the database table. It is used with the `table` method. + +```php +$res = $db->table("items")->search("name", "chocola"); +``` + +This will try to find an item which has chocola in it's name field. + +## insert + +`Insert` provides a much simpler syntax for making insert queries. + +```php +$db->insert("users") // faster than $db->query("INSERT INTO users") +``` + +### params + +This method is used on `insert` and `update` just like how `where` is used on `select` and `delete`. + +```php +$db->insert("users")->params("username", "mychi"); +``` + +To actually run this query, you have to call `execute`. + +```php +$db->insert("users")->params("username", "mychi")->execute(); +``` + +This inserts a user with a username of mychi into the users table. But what if you wanted to add more params, simple! + +```php +$db->insert("users")->params([ + "username" => "mychi", + "email" => "mychi@leafphp.dev" +])->execute(); +``` + +You're free to arrange this query anyhow you see fit, it's still considered as a single chain. + +```php +$db->insert("users") + ->params([ + "username" => "mychi", + "email" => "mychi@leafphp.dev", + "password" => md5("test") + ]) + ->execute(); +``` + +What if you already registered someone with the username mychi, this tiny flaw could break your authentication system. That's where `unique` comes in🧐 + +### unique + +Just as the name implies, `unique` helps prevent duplicates in your database, fun fact, just chain one more method for this functionality🤗 + +```php +$db->insert("users") + ->params([ + "username" => "mychi", + "email" => "mychi@leafphp.dev", + "password" => md5("test") + ]) + ->unique("username", "email") + ->execute(); +``` + +If you have a 100 unique values, don't feel shy, just line them all up. + +```php +->unique("username", "email", "what-not", ...) +``` + +Alternatively, you could just pack a truck load full of uniques in an array + +```php +->unique(["username", "email", "what-not", ...]) +``` + +## update + +Quickly write an update query. + +```php +$db->update("users")->params("location", "Ghana")->where("id", "1")->execute(); +``` + +This is generally how an update looks like. Just like with insert, you can add up uniques to make sure you don't have duplicates in your database. + +**you can chain in unique here as well.** + +## delete + +Let's jump straight in for an example. + +```php +$db->delete("users")->execute();// careful now🙂 +``` + +This code above, ladies and gentlemen, will wipe all your users resulting in 7 digit loses🤞 + +```php +$db->delete("users")->where("id", "1")->execute(); +``` + +You have succesfully deleted user 1 + +## Extras + +At this point, there's still a whole lot you can do with Leaf Db. + +There are times when you have to insert data you don't know about. What happens if your user enters unsupported info. To fix this, you'll have to run a bunch of checks to find out what kind of information is being saved, but what if you could validate data before saving without writing any extensive validation? Well...prepare to be amazed🧐 + +### validate + +Validate makes sure that correct information is saved in your database. You simply need to chain the `validate` method. + +```php +$db->insert("users") + ->params([ + "username" => "mychi", + "email" => "mychi@leafphp.dev", + "password" => md5("test") + ]) + ->validate("username", "validUsername") + ->execute(); +``` + +Validate takes in 2 parameters, a field to validate and a validation rule. You can find all the validation rules and what they do [here](/modules/forms/#multiple-rule-validation). So what if you need to validate more than 1 parameter? + +```php +$db->insert("users") + ->params([ + "username" => "mychi", + "email" => "mychi@leafphp.dev", + "password" => md5("test") + ]) + ->validate([ + "username" => "validUsername", + "email" => "email" + ]) + ->execute(); +``` + +Amazing right?! + +### hidden + +Not all information which is retrieved from the database is sent over to the client side or is added to the session or cookies. Usually, some fields are left out for "security" reasons. `hidden` returns the retrieved data without the `hidden` fields. + +```php +$db->select("users")->hidden("remember_token", "reset_q_id")->fetchAll(); +``` + +```php +$db->select("users")->where("id", "1")->hidden("remember_token", "reset_q_id")->fetchObj(); +``` + +### add + +That's right, just imagine doing the opposite of `hidden`, instead of hiding fields from the query data, `add` lets you add your own fields into the query data. + +::: tip NOTE +This does not touch your database, it only appends a field into the data returned from the database. +::: + +```php +$db->select("users")->add("tx_id", gID())->fetchAll(); +``` + +This query adds a `tx_id` field with a value generated from `gID` to every user + +```php +$db->select("users")->where("id", "1")->add("tx_id", "d362d7t2366")->fetchObj(); +``` + +This is similar as the query above, except that this query is on the scale of a single user. + +### bind + +We've already seen `bind` in action, but we've not actually talked about it. This method allows you to bind parameters into your query. + +```php +$db->select("users WHERE username = ?")->bind("mychi")->fetchAssoc(); +``` + +And yet again another syntax🧐 As said above, Leaf Db is highly customizable, and allows you to write queries in a way that suits you. This statement above binds `mychi` to the username. + +```php +$db->select("users WHERE username = ? AND password = ?")->bind("mychi", "password")->fetchAssoc(); +``` + +You can just pass multiple parameters into bind, as many as satisfy your query. If you feel more comfortable with arrays, you can use arrays. + +```php +$db->select("users WHERE username = ? AND password = ?")->bind(["mychi", "password"])->fetchAssoc(); +``` + +### orderBy + +orderBy allows you to arrange the query results according to a row, in ascending (asc) or descending (desc) order. + +```php +// if second param is not provided, desc is used by default +$items = $db->select("items")->orderBy("created_at")->all(); + +... orderBy("id", "desc")->all(); +``` + +### limit + +When retrieving data from your database for use in applications, you might want to show only a specific number of values. + +```php +$itemsPerPage = 15; +$items = $db->select("items")->limit($itemsPerPage)->fetchAll(); + +// you can use limit and orderBy together +$items = $db->select("items")->orderBy("id", "desc")->limit($itemsPerPage)->fetchAll(); +``` + +### error handling + +Errors come up all the time, user errors, that is. What happens when validation fails, or if someone has already registered a username. Leaf Db provides a simple way to track these errors. + +```php +$res = $db->insert("users")->params("username", "mychi")->unique("username")->execute(); +if ($res === false) $app->response->exit($db->errors()); +``` + +Using `$db->errors()` returns an array holding any errors which caused the query to fail. eg: + +```php +[ + "email" => "email already exists", + "username" => "username can only contain characters 0-9, A-z and _" +] +``` diff --git a/apps/docs/src/modules/db/v/2/builder.md b/apps/docs/src/modules/db/v/2/builder.md new file mode 100644 index 0000000..7cadfcc --- /dev/null +++ b/apps/docs/src/modules/db/v/2/builder.md @@ -0,0 +1,820 @@ +# Building Queries + +As demonstrated [before](/modules/db/v/2/#simple-queries), Leaf Db allows you to perfectly write SQL queries, however, it also provides simpler and more convenient methods for building queries. This means that you won't need to write any SQL statements. + +## create + + +This method allows you build a query to create a database. + +
+ +```php +db()->create('dbname')->execute(); +``` + +
+
+ +```php +$db->create('dbname')->execute(); +``` + +
+ +## drop + + +This method helps you build a query to drop a database. + +
+ +```php +db()->drop('dbname')->execute(); +``` + +
+
+ +```php +$db->drop('dbname')->execute(); +``` + +
+ +## select + +This is a method for quickly building select statements. The `SELECT` statement is used to select data from a database. + +It takes in 2 parameters: + +- The table to select items from +- The columns to include (includes all by default) + +
+ +```php +// returns all items +$items = db()->select('items')->all(); + +// returns the username & email of all buyers +$buyers = db()->select("buyers", "username, email")->fetchAll(); +``` + +
+
+ +```php +// returns all items +$items = $db->select('items')->all(); + +// returns the username & email of all buyers +$buyers = $db->select("buyers", "username, email")->fetchAll(); +``` + +
+ +### where + +The where method allows you to quickly write a where block. + +
+ +```php +$user = db() + ->select("users") + ->where("username", "mychi") + ->first(); +``` + +
+
+ +```php +$user = $db + ->select("users") + ->where("username", "mychi") + ->first(); +``` + +
+ +You can also pass in a bunch of params to check for: + +
+ +```php +$user = db() + ->select("users") + ->where([ + "username" => "mychi", + "password" => "..." + ]) + ->first(); +``` + +
+
+ +```php +$user = $db + ->select("users") + ->where([ + "username" => "mychi", + "password" => "..." + ]) + ->first(); +``` + +
+ +#### Comparators + + +v2 of leaf db introduces a third parameter to the `where` and `orWhere` blocks. This allows you to check how a value compares to another using `=`, `LIKE`, `>`, ... + +
+ +```php +db() + ->select('items') + ->where('tag', 'LIKE', '%new%') + ->fetchAll(); +``` + +
+
+ +```php +$db + ->select('items') + ->where('tag', 'LIKE', '%new%') + ->fetchAll(); +``` + +
+ +### orWhere + +`orWhere` also functions just like `where`, except that in the case of multiple parameters, `orWhere` returns results even if one of the conditions is met, but `where` only returns results if all the conditions are matched. + +
+ +```php +$users = db() + ->select("users") + ->orWhere([ + "username" => "mychi", + "username" => "darko" + ]) + ->all(); +``` + +
+
+ +```php +$users = $db + ->select("users") + ->orWhere([ + "username" => "mychi", + "username" => "darko" + ]) + ->all(); +``` + +
+ +Kind of like `SELECT * FROM users WHERE username = 'mychi' OR username = 'darko'` + +::: tip Chaining +You can chain `where` and `orWhere` blocks together to make queries that use `AND` and `OR` operators. + +
+ +```php +db() + ->select('users') + ->where('username', 'mychi') + ->orWhere('username', 'darko') + ->first(); +``` + +
+
+ +```php +$db + ->select('users') + ->where('username', 'mychi') + ->orWhere('username', 'darko') + ->first(); +``` + +
+ +This query will look for a username which is either `mychi` or `darko` and return whichever it finds first. + +::: + +### find + +This method allows you to quickly perform a check for the `id` key on a table. It takes in 1 parameter which is the id of the row to get. + +
+ +```php +$user = db()->select("users")->find(1); +``` + +
+
+ +```php +$user = $db->select("users")->find(1); +``` + +
+ +::: tip Note +Find returns the value it finds immediately, so you should not use `fetchAssoc` or any other fetch method on the value returned. +::: + +## Table operations + +### table + +`table` sets the table pointer for the db table being used. `table` can be combined with other methods like `search`. + +
+ +```php +db()->table("items"); +``` + +
+
+ +```php +$db->table("items"); +``` + +
+ +### search + +Just as the name implies, you can use this method to search for a value in the database table. It is used with the `table` method. + +
+ +```php +$res = db()->table("items")->search("name", "chocola"); +``` + +
+
+ +```php +$res = $db->table("items")->search("name", "chocola"); +``` + +
+ +This will try to find an item which has chocola in it's name field. + +## insert + +`Insert` provides a much simpler syntax for making insert queries. + +
+ +```php +db()->insert("users") // faster than db()->query("INSERT INTO users") +``` + +
+
+ +```php +$db->insert("users") // faster than db()->query("INSERT INTO users") +``` + +
+ +### params + +This method is used on `insert` and `update` just like how `where` is used on `select` and `delete`. + +
+ +```php +db()->insert("users")->params(["username" => "mychi"]); +``` + +
+
+ +```php +$db->insert("users")->params(["username" => "mychi"]); +``` + +
+ +To actually run this query, you have to call `execute`. + +
+ +```php +db()->insert("users")->params(["username" => "mychi"])->execute(); +``` + +
+
+ +```php +$db->insert("users")->params(["username" => "mychi"])->execute(); +``` + +
+ +This inserts a user with a username of mychi into the users table. But what if you wanted to add more params, simple! + +
+ +```php +db() + ->insert("users") + ->params([ + "username" => "mychi", + "email" => "mychi@leafphp.dev" + ]) + ->execute(); +``` + +
+
+ +```php +$db + ->insert("users") + ->params([ + "username" => "mychi", + "email" => "mychi@leafphp.dev" + ]) + ->execute(); +``` + +
+ +You're free to arrange this query anyhow you see fit, it's still considered as a single chain. + +
+ +```php +db() + ->insert("users") + ->params([ + "username" => "mychi", + "email" => "mychi@leafphp.dev", + "password" => Leaf\Password::hash("test") + ]) + ->execute(); +``` + +
+
+ +```php +$db + ->insert("users") + ->params([ + "username" => "mychi", + "email" => "mychi@leafphp.dev", + "password" => Leaf\Password::hash("test") + ]) + ->execute(); +``` + +
+ +What if you already registered someone with the username mychi, this tiny flaw could break your authentication system. That's where `unique` comes in🧐 + +### unique + +Just as the name implies, `unique` helps prevent duplicates in your database, fun fact, just chain one more method for this functionality + +
+ +```php +db() + ->insert('users') + ->params([ + 'username' => 'mychi', + 'email' => 'mychi@leafphp.dev', + 'password' => hash('test') + ]) + ->unique('username', 'email') + ->execute(); +``` + +
+
+ +```php +$db + ->insert('users') + ->params([ + 'username' => 'mychi', + 'email' => 'mychi@leafphp.dev', + 'password' => hash('test') + ]) + ->unique('username', 'email') + ->execute(); +``` + +
+ +If you have a 100 unique values, don't feel shy, just line them all up. + +```php +->unique('username', 'email', 'what-not', ...) +``` + +Alternatively, you could just pack a truck load full of uniques in an array + +```php +->unique(['username', 'email', 'what-not', ...]) +``` + +### Getting the last inserted id + +You can get the last inserted id by calling `lastInsertId` on the db object after an insert query. + +
+ +```php +db()->insert('users')->params(['username' => 'mychi'])->execute(); +$lastId = db()->lastInsertId(); +``` + +
+
+ +```php +$db->insert('users')->params(['username' => 'mychi'])->execute(); +$lastId = $db->lastInsertId(); +``` + +
+ +## update + +Quickly write an update query. + +
+ +```php +db() + ->update("users") + ->params(["location" => "Ghana"]) + ->where("id", "1") + ->execute(); +``` + +
+
+ +```php +$db + ->update("users") + ->params(["location" => "Ghana"]) + ->where("id", "1") + ->execute(); +``` + +
+ +This is generally how an update looks like. Just like with insert, you can add up uniques to make sure you don't have duplicates in your database. + +**you can chain in unique here as well.** + +## delete + +Let's jump straight in for an example. + +
+ +```php +db()->delete("users")->execute(); // careful now 🙂 +``` + +
+
+ +```php +$db->delete("users")->execute(); // careful now 🙂 +``` + +
+ +::: danger Watch out +Be careful when running `delete` queries without a `where` block. Doing that will wipe that whole table. +::: + +
+ +```php +db()->delete("users")->where("id", "1")->execute(); +``` + +
+
+ +```php +$db->delete("users")->where("id", "1")->execute(); +``` + +
+ +You have succesfully deleted user 1 + +## Extras + +### hidden + +Not all information which is retrieved from the database is sent over to the client side or is added to the session or cookies. Usually, some fields are left out for "security" reasons. `hidden` returns the retrieved data without the `hidden` fields. + +
+ +```php +db() + ->select("users") + ->hidden("remember_token", "reset_q_id") + ->fetchAll(); +``` + +
+
+ +```php +$db + ->select("users") + ->hidden("remember_token", "reset_q_id") + ->fetchAll(); +``` + +
+ +
+ +```php +db() + ->select("users") + ->where("id", "1") + ->hidden("remember_token", "reset_q_id") + ->fetchObj(); +``` + +
+
+ +```php +$db + ->select("users") + ->where("id", "1") + ->hidden("remember_token", "reset_q_id") + ->fetchObj(); +``` + +
+ +### add + +That's right, just imagine doing the opposite of `hidden`, instead of hiding fields from the query data, `add` lets you add your own fields into the query data. + +::: tip NOTE +This does not touch your database, it only appends a field into the data returned from the database. +::: + +
+ +```php +db() + ->select("users") + ->add("tx_id", gID()) + ->fetchAll(); +``` + +
+
+ +```php +$db + ->select("users") + ->add("tx_id", gID()) + ->fetchAll(); +``` + +
+ +This query adds a `tx_id` field with a value generated from `gID` to every user + +
+ +```php +db() + ->select("users") + ->where("id", "1") + ->add("tx_id", "d362d7t2366") + ->fetchObj(); +``` + +
+
+ +```php +$db + ->select("users") + ->where("id", "1") + ->add("tx_id", "d362d7t2366") + ->fetchObj(); +``` + +
+ +This is similar as the query above, except that this query is on the scale of a single user. + +### bind + +We've already seen `bind` in action, but we've not actually talked about it. This method allows you to bind parameters into your query. + +
+ +```php +db() + ->select("users WHERE username = ?") + ->bind("mychi") + ->fetchAssoc(); +``` + +
+
+ +```php +$db + ->select("users WHERE username = ?") + ->bind("mychi") + ->fetchAssoc(); +``` + +
+ +And yet again another syntax🧐 As said above, Leaf Db is highly customizable, and allows you to write queries in a way that suits you. This statement above binds `mychi` to the username. + +
+ +```php +db() + ->select("users WHERE username = ? AND password = ?") + ->bind("mychi", "password") + ->fetchAssoc(); +``` + +
+
+ +```php +$db + ->select("users WHERE username = ? AND password = ?") + ->bind("mychi", "password") + ->fetchAssoc(); +``` + +
+ +You can just pass multiple parameters into bind, as many as satisfy your query. If you feel more comfortable with arrays, you can use arrays. + +
+ +```php +db() + ->select("users WHERE username = ? AND password = ?") + ->bind(["mychi", "password"]) + ->fetchAssoc(); +``` + +
+
+ +```php +$db + ->select("users WHERE username = ? AND password = ?") + ->bind(["mychi", "password"]) + ->fetchAssoc(); +``` + +
+ +### orderBy + +orderBy allows you to arrange the query results according to a row, in ascending (asc) or descending (desc) order. + +
+ +```php +// if second param is not provided, desc is used by default +$items = db()->select("items")->orderBy("created_at")->all(); + +... orderBy("id", "desc")->all(); +``` + +
+
+ +```php +// if second param is not provided, desc is used by default +$items = $db->select("items")->orderBy("created_at")->all(); + +... orderBy("id", "desc")->all(); +``` + +
+ +### limit + +When retrieving data from your database for use in applications, you might want to show only a specific number of values. + +
+ +```php +$itemsPerPage = 15; +$items = db()->select("items")->limit($itemsPerPage)->fetchAll(); + +// you can use limit and orderBy together +$items = db() + ->select("items") + ->orderBy("id", "desc") + ->limit($itemsPerPage) + ->fetchAll(); +``` + +
+
+ +```php +$itemsPerPage = 15; +$items = $db->select("items")->limit($itemsPerPage)->fetchAll(); + +// you can use limit and orderBy together +$items = $db + ->select("items") + ->orderBy("id", "desc") + ->limit($itemsPerPage) + ->fetchAll(); +``` + +
+ +### error handling + +Errors come up all the time, user errors, that is. What happens when validation fails, or if someone has already registered a username. Leaf Db provides a simple way to track these errors. + +
+ +```php +$res = db() + ->insert("users") + ->params("username", "mychi") + ->unique("username") + ->execute(); + +if ($res === false) { + response()->exit(db()->errors()); +} +``` + +
+
+ +```php +$res = $db + ->insert("users") + ->params("username", "mychi") + ->unique("username") + ->execute(); + +if ($res === false) { + $app->response->exit(db()->errors()); +} +``` + +
+ +Using `db()->errors()` returns an array holding any errors which caused the query to fail. eg: + +```php +[ + "email" => "email already exists", + "username" => "username can only contain characters 0-9, A-z and _" +] +``` diff --git a/apps/docs/src/modules/db/v/2/index.md b/apps/docs/src/modules/db/v/2/index.md new file mode 100755 index 0000000..a14c818 --- /dev/null +++ b/apps/docs/src/modules/db/v/2/index.md @@ -0,0 +1,619 @@ +# Getting Started + + +## Installation + +You can install Leaf Db with Leaf CLI: + +```bash +leaf install db +``` + +Or with composer: + +```bash +composer require leafs/db +``` + +From there, you can link your database and start writing some awesome queries. + +::: tip Coming from v1 +If you are coming from Leaf Db v1, we recommend checking the [changelog](/modules/db/v/2/new) +::: + +
+ +## Functional Mode + +If you are using leaf db v2 in a leaf 3 app, you will have access to the `db` global which allows you to use Leaf Db from anywhere in your entire application. You simply need to call `db()` and leaf 3 will create and maintain a shared instance of Leaf db which you can call from anywhere. + +This also means that you don't need to initialize leaf db anymore. + +```php +connect('127.0.0.1', 'test'); + +app()->get("/", function () { + // db can be used here + // db()->... +}); + +app()->run(); +``` + +
+ +## Db Connection + +After installing leaf db, you will need to connect to your database to get started. There are multiple ways to connect to your database using leaf db. + +
+ +### connect on init + +This method connects to the database when initializing Leaf Db. + +```php +// syntax +$db = new Leaf\Db( + $host = '', + string $dbname = '', + string $user = '', + string $password = '', + string $dbtype = 'mysql' +); + +// example +$db = new Leaf\Db('127.0.0.1', 'db_name', 'root', 'password123'); +``` + +Leaf db takes in 5 optional parameters: + +- The database host eg: localhost +- The database name +- The database username +- The database password +- The PDO database driver eg: mysql, pgsql, ... + +Alternatively, you can pass an array into the host parameter to connect to your database like this: + +```php +// syntax +$db = new Leaf\Db([ + 'dbtype' => 'mysql', + 'charset' => null, + 'port' => null, + 'unixSocket' => null, + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => '', + 'dbname' => '', +]); + +// example +$db = new Leaf\Db([ + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => 'password123', + 'dbname' => 'db name', +]); +``` + +You only need to pass the fields you want to configure. + +
+ +### connect + +Connect takes in 4 params just like the method above + +
+ +```php +// syntax +db()->connect( + $host = '', + string $dbname = '', + string $user = '', + string $password = '', + string $dbtype = 'mysql', + array $pdoOptions = [] +); + +// example +db()->connect('127.0.0.1', 'dbname', 'root', ''); +``` + +Leaf db takes in 5 optional parameters: + +- The database host eg: localhost +- The database name +- The database username +- The database password +- The PDO database driver eg: mysql, pgsql, ... +- Configuration specific to the PHP `PDO` class + +
+
+ +```php +$db = new Leaf\Db; + +// syntax +$db->connect( + $host = '', + string $dbname = '', + string $user = '', + string $password = '', + string $dbtype = 'mysql', + array $pdoOptions = [] +); + +// example +$db->connect('127.0.0.1', 'dbname', 'root', ''); +``` + +Connect works the same way as the constructor, except that it accepts one more parameter: `$pdoOptions` which is a bunch of configuration specific to the PHP `PDO` class. + +
+ +Alternatively, you can pass an array into the host parameter to connect to your database like this: + +
+ +```php +// syntax +db()->connect([ + 'dbtype' => 'mysql', + 'charset' => null, + 'port' => null, + 'unixSocket' => null, + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => '', + 'dbname' => '', +]); + +// example +db()->connect([ + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => 'password123', + 'dbname' => 'db name', +]); +``` + +
+
+ +```php +$db = new Leaf\Db(); + +// syntax +$db->connect([ + 'dbtype' => 'mysql', + 'charset' => null, + 'port' => null, + 'unixSocket' => null, + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => '', + 'dbname' => '', +]); + +// example +$db->connect([ + 'host' => '127.0.0.1', + 'username' => 'root', + 'password' => 'password123', + 'dbname' => 'db name', +]); +``` + +
+ +You only need to pass the fields you want to configure. + +### autoConnect + +This method allows you to connect to your database from parameters in a `.env` file. Most MVC frameworks and other libraries rely on a `.env` for a lot of configurations including the database. With `autoConnect`, you can directly pick up these configs. + +**example env:** + +```env +DB_CONNECTION=mysql +DB_HOST=127.0.0.1 +DB_PORT=3306 +DB_DATABASE=LeafMVC +DB_USERNAME=root +DB_PASSWORD= +``` + +**App:** + +
+ +```php +db()->autoConnect(); +``` + +
+
+ +```php +$db = new Leaf\Db; +$db->autoConnect(); +``` + +
+ +### PDO connection + +Leaf Db also allows you to skip the entire connection process and share an existing PDO instance with leaf db. This allows you to gradually rewrite your existing apps with Leaf Db without having multiple db connections and doing so at your own pace. + +
+ +```php +$db = new PDO('mysql:dbname=test;host=127.0.0.1', 'root', ''); + +db()->connection($db); + +// you can use leaf db the same way you always have +``` + +
+
+ +```php +$pdo = new PDO('mysql:dbname=test;host=127.0.0.1', 'root', ''); + +$db = new Leaf\Db(); +$db->connection($pdo); + +// you can use leaf db the same way you always have +``` + +
+ +## Simple queries + +Leaf Db provides a ton of functionality, with a bunch of powerful tools, but at the same time gives you a great deal of customizations with the `query` method. You can write your raw SQL queries with the `query` method, however you can still use the cool features Leaf Db provides. + +
+ +```php +$users = db()->query('SELECT * FROM users')->all(); +``` + +
+
+ +```php +$users = $db->query('SELECT * FROM users')->all(); +``` + +
+ +You can also use parameter binding with `query` + +
+ +```php +db()->query('SELECT * FROM users WHERE id = ?')->bind('1')->fetchObj(); +``` + +
+
+ +```php +$db->query('SELECT * FROM users WHERE id = ?')->bind('1')->fetchObj(); +``` + +
+ +A shorter method would be to use `where` + +
+ +```php +db()->query('SELECT * FROM users')->where('id', '1')->fetchObj(); +``` + +
+
+ +```php +$db->query('SELECT * FROM users')->where('id', '1')->fetchObj(); +``` + +
+ +You don't have to worry about security, `where` uses prepared statements by default, so you're pretty good. + +You've seen all this, but guess what? There's something even shorter + +
+ +```php +db()->select('users')->where('id', '1')->fetchObj(); +``` + +
+
+ +```php +$db->select('users')->where('id', '1')->fetchObj(); +``` + +
+ +This is what Leaf Db does for you. A new way to write your Database queries without actually needing to write any real queries. Also, unlike other query builders, there's no need to create classes and models for every table you want to fetch from. Everything's accessible with one line of code. + +## Running queries + +There are different types of queries, some return values and others don't. Leaf Db provides a seamless way of handling both. + +### execute + +`execute` is a method on Leaf Db which allows you to run a query instantly. The `execute` method is used when the query is **NOT** expected to return a value. + +
+ +```php +db()->query('CREATE DATABASE dbname')->execute(); +``` + +
+
+ +```php +$db->query('CREATE DATABASE dbname')->execute(); +``` + +
+ +### fetchAll + +`fetchAll` is a method simply returns all the results of a query. Under the hood, the query is run using `execute` and the value is retrieved and returned. This method is used when there are a lot of values to return. + +
+ +```php +$users = db()->query('SELECT * FROM users')->fetchAll(); +``` + +
+
+ +```php +$users = $db->query('SELECT * FROM users')->fetchAll(); +``` + +
+ +::: tip Aliases +`fetchAll` has aliases adapted from other libraries and frameworks. Instead of `fetchAll`, you can use `all` and `get` + +
+ +```php +$users = db()->query('SELECT * FROM users')->all(); +$users = db()->query('SELECT * FROM users')->get(); +``` + +
+
+ +```php +$users = $db->query('SELECT * FROM users')->all(); +$users = $db->query('SELECT * FROM users')->get(); +``` + +
+ +::: + +In this case, the `$users` variable with contain an array of associative arrays, but if you want an array of objects, you can pass `obj` or `object` as a parameter into `fetchAll` + +
+ +```php +$users = db()->query('SELECT * FROM users')->fetchAll('obj'); +$users = db()->query('SELECT * FROM users')->all('object'); +$users = db()->query('SELECT * FROM users')->get('obj'); +``` + +
+
+ +```php +$users = $db->query('SELECT * FROM users')->fetchAll('obj'); +$users = $db->query('SELECT * FROM users')->all('object'); +$users = $db->query('SELECT * FROM users')->get('obj'); +``` + +
+ +### fetchObj + +`fetchObj` is a method that fetches the next row and returns it as an object. It returns only one object, so it should be used only on queries that return a single item. + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->fetchObj(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->fetchObj(); +``` + +
+ +::: tip Aliases +Instead of `fetchObj`, you can use `obj` + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->obj(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->obj(); +``` + +
+ +::: + +::: warning Watch out +`fetchObj` returns an object, so you can use the result like this: + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->obj(); +$user->id // not $user["id"] +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->obj(); +$user->id // not $user["id"] +``` + +
+ +::: + +### fetchAssoc + +`fetchAssoc` is a method that fetches the next row and returns it as an array. It returns only one array, so it should be used only on queries that return a single item. + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->fetchAssoc(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->fetchAssoc(); +``` + +
+ +::: tip Aliases +Instead of `fetchAssoc`, you can use `assoc` + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->assoc(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->assoc(); +``` + +
+ +::: + +::: warning Watch out +`fetchAssoc` returns an array, so you can use the result like this: + +
+ +```php +$user = db()->query('SELECT * FROM users WHERE id = 1')->assoc(); +$user['id'] // not $user->id +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users WHERE id = 1')->assoc(); +$user['id'] // not $user->id +``` + +
+ +::: + +### first + +`first` returns the first item in the database that matches the condition given. + +
+ +```php +$user = db()->query('SELECT * FROM users')->first(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users')->first(); +``` + +
+ +Although all our users are saved in the `users` table, `first` will return only the first record. + +### last + +`last` returns the last item in the database that matches the condition given. + +
+ +```php +$user = db()->query('SELECT * FROM users')->last(); +``` + +
+
+ +```php +$user = $db->query('SELECT * FROM users')->last(); +``` + +
+ +Although all our users are saved in the `users` table, `last` will return only the last record. + + diff --git a/apps/docs/src/modules/db/v/2/new.md b/apps/docs/src/modules/db/v/2/new.md new file mode 100644 index 0000000..12b9e16 --- /dev/null +++ b/apps/docs/src/modules/db/v/2/new.md @@ -0,0 +1,344 @@ +# New in v2 + +Leaf db has gone through a complete rewrite to bring you the best experience possible in the simplest way for a db library. This page lists all the changes that have gone on in leaf db: both internal and external changes. + +## PDO rewrite + +Under the hood, Leaf DB has been rewritten to fully support PDO, both internally and user instantiated PDO instances. This makes leaf db more flexible and more compatible with most systems and applications. + +Because of this, you can pass in an existing PDO connection, and leaf db should work fine, even without initializing a leaf db connection. + +
+ +```php +connection($db); + +// you can use leaf db here with calling db()->connect +db()->select(...)..; +``` + +
+
+ +```php +connection($pdo); + +// you can use leaf db here with calling $db->connect +$db->select(...)...; +``` + +
+ +This allows you to gradually rewrite your existing applications with leaf db, one query at a time. + +## DB Support + +Rewriting leaf db with PDO now allows you to connect to different database types like SQLite and PostgreSQL. Since any valid PDO connection is a valid leaf db connection, leaf db supports all db types supported by PDO. + +## Deep syncing with leaf 3 + +Leaf DB is now detached from leaf, however, as a leaf 3 module, there's additional functionality you can get from using leaf db in a leaf 3 app. Deep syncing config, instances and functional mode all become available to you. + +This simply means that your db config becomes available on `app()->config()`, as well as functional mode seen in the examples above. + +## Performance Improvements + +Despite switching to PDO and huggling a lot of operations under the hood to provide the best user experience, we put measures in place to optimize performance. After running a bunch of benchmarks in the same app, leaf db v2 performs up to 2x better than v1. + +## Db create method + +`create` is a much requested feature which did not exist in previous versions. This method allows you to quickly and seamlessly build a query to create a database. + +
+ +```php +db()->create('dbname')->execute(); +``` + +
+
+ +```php +$db->create('dbname')->execute(); +``` + +
+ +## Db drop method + +A create method should come with a `drop` method, and this version does. This method allows you to quickly drop a database. + +
+ +```php +db()->drop('dbname')->execute(); +``` + +
+
+ +```php +$db->drop('dbname')->execute(); +``` + +
+ +## Find method + +This is a method inspired by Laravel's eloquent. This method allows you to `select` a database row using it's `id`. + +
+ +```php +db()->select('users')->find(1); +``` + +
+
+ +```php +$db->select('users')->find(1); +``` + +
+ +## Insert with multiple records + +The `insert` method now allows you to insert multiple records in your database at once. + +
+ +```php +db() + ->insert('table') + ->params([ + ['name' => 'Record 1'], + ['name' => 'Record 2'], + ]) + ->execute(); +``` + +
+
+ +```php +$db + ->insert('table') + ->params([ + ['name' => 'Record 1'], + ['name' => 'Record 2'], + ]) + ->execute(); +``` + +
+ +## `first` and `last` methods + +These methods are used to return the first and last values matching a given condition respectively. In db v1, these methods would retrieve all records matching the condition but only return the first/last value. For large pools of data, this is simply inefficient. This problem has been solved by modifying the query to fetch only the needed value directly from the database. + +## Breaking changes + +To give you the best experience, a few things had to change under the hood. This section is intended to document all changes that may lead to your application breaking after upgrading leaf db. + +### DB CONNECTION + +Although the connect method still does the same things, we shifted things up a bit to accomodate a few internal changes. The `connect` method's parameters now come in a different order. + +
+ +```php +db()->connect( + $host = '', + string $dbname = '', + string $user = '', + string $password = '', + string $dbtype = 'mysql', + array $pdoOptions = [] +); + +// example connection +db()->connect('127.0.0.1', 'dbname', 'root', ''); +``` + +
+
+ +```php +$db->connect( + $host = '', + string $dbname = '', + string $user = '', + string $password = '', + string $dbtype = 'mysql', + array $pdoOptions = [] +); + +// example connection +$db->connect('127.0.0.1', 'dbname', 'root', ''); +``` + +
+ +As you've noticed, `$pdoOptions` is a new parameter which stems from rewriting leaf db with PDO. Also, the position of the dbname has been changed to the second parameter. Quickly moving your dbname to the second parameter should solve any problems you'll encounter connecting to your database. + +
+ +This same thing applies to the leaf db constructor. + +```php +// syntax +$db = new Leaf\Db( + $host = '', + string $dbname = '', + string $user = '', + string $password = '', + string $dbtype = 'mysql' +); + +// example +$db = new Leaf\Db('127.0.0.1', 'dbname', 'root', ''); +``` + +
+ +### WHERE BLOCKS + +Leaf db v1 had a unique way of handling multiple where blocks which wasn't exactly the nicest thing to do. Look at this query for instance. + +
+ +```php +$items = db() + ->select('items') + ->where('status', 'active') + ->whereLike('name', '%something') + ->orWhereLike('identifier', 'something%') + ->all(); +``` + +
+
+ +```php +$items = $db + ->select('items') + ->where('status', 'active') + ->whereLike('name', '%something') + ->orWhereLike('identifier', 'something%') + ->all(); +``` + +
+ +You notice we use 3 different types of `where`, and some queries could require more. This significantly reduces the developer experience and adds a bit more to the learning curve. + +`where`, `whereLike`, `orWhere`, `orWhereLike` have been replaced with `where` and `orWhere` in v2. This is due to the addition of a third parameter which contains the comparator for the query. + +
+ +```php +$items = db() + ->select('items') + ->where('status', 'active') + ->where('name', 'LIKE', '%something') + ->orWhere('identifier', 'LIKE', 'something%') + ->all(); +``` + +
+
+ +```php +$items = $db + ->select('items') + ->where('status', 'active') + ->where('name', 'LIKE', '%something') + ->orWhere('identifier', 'LIKE', 'something%') + ->all(); +``` + +
+ +Besides getting rid of other `where` blocks, this also allows you to pass in a comparator of your choice like this: + +
+ +```php +$items = db() + ->select('items') + ->where('status', 'active') + ->where('name', 'NOT LIKE', '%something%') + ->orWhere('identifier', 'NOT LIKE', '%something%') + ->all(); +``` + +
+
+ +```php +$items = $db + ->select('items') + ->where('status', 'active') + ->where('name', 'NOT LIKE', '%something%') + ->orWhere('identifier', 'NOT LIKE', '%something%') + ->all(); +``` + +
+ +In this case, we are using `NOT LIKE` instead of `LIKE`. + +::: danger Where dependents +Since some `where` functions have been removed, any functions which depend on them have also been removed. This means that functions like `like` and `orLike` have also been removed. +::: + +### VALIDATE + +The validate method, originally powered by leaf forms has also been removed. You can directly use leaf forms to validate your data if you want to do so. + +### SEARCH UTILS + +The search helpers `beginsWith`, `endsWith`, `includes` and `word` have been moved to `Leaf\Db\Utils`. + +
+ +```php +use Leaf\Db\Utils; + +// ... + +$items = db() + ->select('items') + ->where('name', 'LIKE', Utils::includes('something')) + ->all(); +``` + +
+
+ +```php +use Leaf\Db\Utils; + +// ... + +$items = $db + ->select('items') + ->where('name', 'LIKE', Utils::includes('something')) + ->all(); +``` + +
diff --git a/apps/docs/src/modules/devtools/index.md b/apps/docs/src/modules/devtools/index.md new file mode 100644 index 0000000..2c57185 --- /dev/null +++ b/apps/docs/src/modules/devtools/index.md @@ -0,0 +1,127 @@ +# Leaf DevTools + +Leaf DevTools provides a set of tools for debugging and understanding your Leaf applications. At the Core, the DevTools provides a visual tool with a clean and intuitive UI holding information about your Leaf application, and a light-weight library that you can use to interact with the devtools frontend. + + + +## Installation + +You can install the Leaf DevTools using the Leaf CLI: + +```bash +leaf install devtools +``` + +Or with composer: + +```bash +composer require leafs/devtools +``` + +After installing the devtools module, you need to add the hook to your app. This will register the devtools routes and allow your Leaf app to communicate with the DevTools. You can do this by adding this line to your app root. + +
+ +```php{7} + + +
+ +```php{5} + + +## Basic Usage + +Once you have completed the process above, you can start your application and open the DevTools in your browser. You can do this by going to `http://localhost:port/leafDevTools` in your browser. + +::: tip Dev Experience +Leaf DevTools are still being developed. We're working on making the experience better and more intuitive. If you have any suggestions, please feel free to open an issue on the [GitHub repo](https://github.com/leafsphp/devtools). +::: + +## Application Insights + +Leaf DevTools has an insights tab that provides information about your Leaf app, like your application config, routes, cookies, sessions, env and more. This information is useful for debugging and understanding your app and why it behaves the way it does. + + + +## Installed Packages + +On the packages tab, you can see all the installed packages in your application. The installed packages are separated into two categories: Composer packages and Leaf packages. You can also see the version of each package, a description and a link to the package's GitHub repo. + + + +## Server Console Logs + +The server module allows you to log out data which will be displayed in the dev tools console (just like console.log). Since PHP doesn't have any real implementation of something like JavaScript's console.log, we decided to add something like that as it is useful for debugging. + +To get started, call the console method on `Leaf\DevTools` + +```php +\Leaf\DevTools::console('This data should be logged in the console'); +\Leaf\DevTools::console('This is a warning', 'warn'); +\Leaf\DevTools::console('This is an error', 'error'); +\Leaf\DevTools::console('This is an info message', 'info'); +\Leaf\DevTools::console('This is a debug message', 'log'); +``` + + + +## Application Routes + +The routes tab shows all the routes in your application. It shows the route's name, method, path, handler and middleware if available. + + + +## Extras + +Installing the devtools module also gives you access to the `dump` function from Symfony's VarDumper. You can read more about it [here](https://symfony.com/doc/current/components/var_dumper.html). + +```php +dump($data); +``` + +## Deployment + +You should note that the devtools module is meant for use ONLY IN DEVELOPMENT. You should not use it in production as it can be a security risk. For now, the only way to disable the devtools is to remove the hook from your app or uninstall it completely. + +A small workaround is to add a condition to the hook so that it only runs in development mode. You can do this using the `script` method on the `Leaf\App` class. + +
+ +```php +$app->script('development', function () { + \Leaf\DevTools::install(); +}); +``` + +
+ +
+ +```php +app()->script('development', function () { + \Leaf\DevTools::install(); +}); +``` + +
diff --git a/apps/docs/src/modules/eien/http-server.md b/apps/docs/src/modules/eien/http-server.md new file mode 100644 index 0000000..60badc2 --- /dev/null +++ b/apps/docs/src/modules/eien/http-server.md @@ -0,0 +1,135 @@ +# Http Server With Eien + +In the previous section, we saw how to get started with Eien. By default Leaf handles creating an Http server with Eien. However, you may want to build your own Eien server instead of just going with what Leaf gives you out of the box. This section will show you how to do just that. + +## Creating a Server + +Before we get started with creating the server, we need to make a little tweak to our Leaf app. We would need to remove the line which runs our Leaf app. This is because we want to run our app from our own server. + +
+ +```php +// remove this line +$app->run(); +``` + +
+
+ +```php +// remove this line +app()->run(); +``` + +
+ +Now all that we need to do is use the Eien server class to craft a beautiful server for our Leaf app. + +
+ +TO get started, you simply need to initialize the `Leaf\Eien\Server` class and pass in your Leaf app instance. + +```php +$app = new Leaf\App(); + +// your leaf routes + +$server = new Leaf\Eien\Server(); +$sever->wrap($app); +``` + +
+
+ +To get started, you simply need to call the `server` function and pass in your Leaf app instance. + +```php +// your leaf routes +server()->wrap(app()); +``` + +
+ +After wrapping your app, you can then start your server by calling the `listen` method. This will tell Eien to listen for traffic, forward your requests and return a response. + +
+ +```php +$server->listen(); +``` + +
+
+ +```php +server()->listen(); +``` + +
+ +Putting it all together, your `index.php` file should look like this: + +
+ +```php +get('/', function () { + return "Hello World"; +}); + +$server = new Leaf\Eien\Server(); +$server + ->wrap($app); + ->listen(); +``` + +
+
+ +```php +get('/', function () { + return "Hello World"; +}); + +server() + ->wrap(app()); + ->listen(); +``` + +
+ +That's how to build a simple Http server with eien. + +## Configuring Eien + +Since Eien uses Swoole under the hood, your configuration is mostly applied to Swoole. You can get started by passing in an array of configuration options to the `config` method. + +
+ +```php +$server->config([ + 'log_level' => 1, + 'log_file' => '/data/swoole.log', +]); +``` + +
+
+ +```php +server()->config([ + 'log_level' => 1, + 'log_file' => '/data/swoole.log', +]); +``` + +
diff --git a/apps/docs/src/modules/eien/index.md b/apps/docs/src/modules/eien/index.md new file mode 100644 index 0000000..5c0122f --- /dev/null +++ b/apps/docs/src/modules/eien/index.md @@ -0,0 +1,132 @@ +# Eien Server + +Eien is Leaf's implementation of a high-speed, high-performance server based on powerful tools like [Open Swoole](https://swoole.co.uk/) and [Swoole](https://github.com/swoole/swoole-src). Eien loads your app in memory and shares a state between requests to achieve amazing speeds. + +When serving Leaf apps with Eien, you gain additional performance improvements due to Leaf's lightweight and super fast nature. + +::: warning Note that +Eien runs on Swoole, so you need to have the swoole extension installed. + +- [Swoole Installation docs](https://openswoole.com/docs/get-started/installation) +- [In case you have errors installing swoole on Mac](https://parsinta.com/articles/setup-php-swoole-in-your-mac-os) +::: + +## Installation + +You can easily install Eien using the [Leaf CLI](/docs/cli/): + +```bash +leaf install eien +``` + +Or with [Composer](https://getcomposer.org/). + +```bash +composer require leafs/eien +``` + +## Prerequisites + +Eien has been configured to rely on some features available in only v3 of Leaf. This means that you can't use Eien with earlier versions of the Leaf framework. Not to worry, if you're on Leaf 2, migrating to Leaf 3 should take less than 10 minutes. You can follow this [documentation to help you migrate](/docs/migration/introduction.html) + +## Benchmarks + +
+
+ Leaf WITHOUT Eien: + IMG_0785 +
+
+ Leaf WITH Eien: + IMG_5389 +
+
+ +***From the Benchmarks above, Leaf was 76x faster when used with Eien.*** + +## Basic Usage + +Eien just like the rest of Leaf 3 was built with developer experience in mind. This means that for basic usage, which for most people will be speeding up their applications and simple http features, you don't need to make any modification to your application after installing Eien. Once Leaf detects Eien, it will automatically setup everything and get your app running faster than anything you've seen. + +::: warning Note +Eien is still in it's dev phase, we have occasional releases, but Eien has not yet been fully tested in production and we'll need your help with that. +::: + +## Serving Your Application + +You can start your application using the `php ` command. This command will start Eien which will then load your app. Since Eien loads your application to memory, any changes to your application's files will not be reflected when you refresh your browser so we don't recommend this method. You can think of it as starting your nodejs application with `node index.js`. + +What we really need in this case is to watch your files and restart them when there's any update. For this, we tweaked the `leaf serve` command from the Leaf CLI a bit. You can use the Leaf serve command to start Eien and watch for any changes. + +```bash +leaf serve +``` + +## Drawbacks + +Since Eien is tied to Leaf, it means that you can't use it with other frameworks. This is because Leaf is built with a very specific architecture that makes it very fast and efficient. This means that you can't use Eien with other frameworks like Laravel, Symfony, etc. + +Another major thing to watch out for is the use of PHP functions for responses. All your headers and cookies need to pass through Leaf directly, otherwise Eien won't be able to handle them right. This means you can't use inbuilt PHP functions like `header()` or `setcookie()`. You'll need you use Leaf's `response->withHeader()` and `response->withCookie()` functions instead. + +## WebSockets + +> A WebSocket server is a network communication protocol which supports full-duplex communication over a TCP connection. A WebSocket server usually operations on traditional HTTP ports like 80 or 443, this makes it compatible with the HTTP protocol, but you can select other ports to run on. Compared with the HTTP protocol, which is stateless, a WebSocket Server can maintain a persistent connection, making it a stateful protocol. The connection between the client and server is kept alive. + +Eien now allows you to create routes that use websockets with Leaf. Just as with all of Leaf, there's no need for any configuration. You can just create a route and start using websockets. + +::: warning Note +Since Eien's WebSocket functionality is still not fully production tested, it is only available through the beta channel. You'll need to install the beta versions of Leaf, Eien and Leaf Http to use websockets. You can do this by running the following commands: + +```bash +leaf install leaf@3.2.2-beta eien@dev-main http@dev-main +``` + +::: + +To create a websocket route, simply use the `ws` method on the leaf app. Note that under the hood, only one websocket instance is created, however, you can create as many routes as you want. These routes will share the instance and will be smartly handled automatically by Eien. + +```php +ws('/ws-route', function () { + response()->json([ + 'message' => 'Hello from websocket' + ]); +}); + +app()->run(); +``` + +As you can see, the websocket route is just like any other route. The only difference is that you use the `ws` method instead of the `get` or `post` method. You can use Leaf request, response, db and other modules just as you would in any other part of your app. + +The handler function for the websocket route is a callback function that will be called when a client sends a message to the websocket route. The callback function receives a `Swoole\WebSocket\Server` instance as it's first argument. It also receives a `Swoole\WebSocket\Frame` instance as it's second argument. The `Swoole\WebSocket\Server` instance is the websocket server instance and the `Swoole\WebSocket\Frame` instance is the message sent by the client. + +```php +ws('/ws-route', function ($server, $frame) { + $server->push($frame->fd, 'Hello from websocket'); +}); + +app()->run(); +``` + +Of course, you can use Leaf's request and response modules to handle your websocket routes which is recommended over directly using the `Swoole\WebSocket\Server` instance. + +```php +ws('/ws-route', function () { + response()->json([ + 'message' => 'Hello from websocket' + ]); +}); + +app()->run(); +``` diff --git a/apps/docs/src/modules/experiments/index.md b/apps/docs/src/modules/experiments/index.md new file mode 100755 index 0000000..aa295d1 --- /dev/null +++ b/apps/docs/src/modules/experiments/index.md @@ -0,0 +1,115 @@ + +# 🍪 Cookies + +The Leaf application provides helper methods to send cookies with the HTTP response. From version 2.2 beta, the old `Leaf\Http\Cookies` package has been replaced by `Leaf\Http\Cookie`. This change also fixes the bug which prevented use of `Leaf\Http\Cookies` inside route handlers and controllers. + +## Init + +Unlike the former `Leaf\Http\Cookies` package, you can use `Leaf\Http\Cookie` methods without initialising the class: + +```php +use Leaf\Http\Cookie; +// ... +Cookie::set("name", "Michael"); +``` + +## Set + +This method replaces the previous `setCookie` method. It takes in 3 params: + +- cookie name (string|array) +- cookie value (optional - string) +- cookie options (optional - array) + +```php +// normal method +Cookie::set("name", "Michael"); +// using array +Cookie::set(["name" => "Michael"]); +``` + +You can also set multiple cookies at a time + +```php +Cookie::set([ + "name" => "Michael", + "age" => "18" +]); +``` + +Adding cookie options + +```php +Cookie::set("name", "Michael", ["expire" => 0]); +``` + +Options for cookies are: + +- expire +- path +- domain +- secure +- httponly + +
+ +## simpleCookie + +This method allows you to quickly set a cookie and it's expiry time. It takes in 3 params: + +- cookie name (string|array) +- cookie value (optional - string) +- cookie expiresAt (optional - string - default of 7 days) + +```php +Cookie::simpleCookie("name", "Michael", "2 days"); +``` + +
+ +## all + +`all` returns all set cookies. + +```php +$cookies = Cookie::all(); +``` + +
+ +## get + +`get` returns a particular set cookie + +```php +$name = Cookie::get("name"); +``` + +
+ +## unset + +This method replaces the previous `deleteCookie` method. It takes in the cookie to unset. + +```php +// normal method +Cookie::unset("name"); +// using array +Cookie::unset(["name"]); +``` + +You can also unset multiple cookies at a time + +```php +Cookie::unset(["name", "age"]); +``` + +
+ +## unsetAll + +This method removes all set cookies. + +```php +Cookie::unsetAll(); +``` diff --git a/apps/docs/src/modules/fetch/index.md b/apps/docs/src/modules/fetch/index.md new file mode 100644 index 0000000..6231589 --- /dev/null +++ b/apps/docs/src/modules/fetch/index.md @@ -0,0 +1,352 @@ +# Leaf Fetch + +
+ Latest Stable Version + Total Downloads + License +
+ +Fetch is a clean, simple, developer friendly interface for making network requests with PHP. It provides a modern API based on [axios](https://axios-http.com/docs/intro) and uses elements from [Unirest PHP](https://github.com/Kong/unirest-php). + +## Installation + +You can install leaf fetch leaf cli: + +```bash +leaf install fetch +``` + +or with composer: + +```bash +composer require leafs/fetch +``` + +## Usage + +Leaf fetch provides different ways of interacting with the fetch library. You can use the `Leaf\fetch` function or the `Leaf\Fetch` class. Leaf fetch also supports functional mode which means that you can use the global `fetch` method. + +## fetch example + +```php +# import the fetch function from leaf +use function Leaf\fetch; + +$res = fetch("https://jsonplaceholder.typicode.com/todos/"); + +# data returned is saved in the $data property just like axios +echo json_encode($res->data); +``` + +You can also use the fetch class + +```php +use Leaf\Fetch; + +$res = Fetch::request([ + "url" => 'https://jsonplaceholder.typicode.com/todos/1', +]); + +echo json_encode($res->data); +``` + +## The `fetch` method + +Leaf fetch provides the fetch method as an easy way to make HTTP requests. This allows you to quickly make requests without bringing up the whole fetch class and without even having to build up your own request array. + +```php +// make a get request +$res = fetch("https://jsonplaceholder.typicode.com/todos/"); + +// make a post request +$res = fetch("https://jsonplaceholder.typicode.com/posts", [ + "title" => "foo", + "body" => "bar", + "userId" => 1, +]); + +// build a custom request array +$res = fetch([ + "method" => "GET", + "url" => 'https://jsonplaceholder.typicode.com/todos/1', + "data" => [ + "firstName" => 'Fred', + "lastName" => 'Flintstone' + ] +]); + +// get response body +echo json_encode($res->data); +``` + +As shown in the example above, the fetch method tries to identify what type of request is being made based on the data that is being passed into it. For instance, simply passing a URL in without any parameters will make a `get` request. + +```php +fetch("https://jsonplaceholder.typicode.com/todos/"); + +# >> GET https://jsonplaceholder.typicode.com/todos/ +``` + +If any parameters are specified, `fetch` will switch to a `POST` request. + +```php +fetch("https://jsonplaceholder.typicode.com/posts", [ + "title" => "foo", + "body" => "bar", + "userId" => 1, +]); + +# >> POST https://jsonplaceholder.typicode.com/posts/ +# >> data -> title: foo, body: bar, userId: 1 +``` + +If however, your type of request is not automatically determined by the `fetch` method, you can still manually tell fetch what to do by passing in an array of configuration data. + +```php +fetch([ + # HTTP method to send + "method" => "PUT", + # URL to hit + "url" => 'https://jsonplaceholder.typicode.com/todos/1', + # Request data to send along + "data" => [ + "firstName" => 'Fred', + "lastName" => 'Flintstone' + ] +]); +``` + +## The `Fetch` class + +The fetch class contains all the options and methods needed to make a network request. You can also use the `Fetch` class to configure how fetch handles requests. To get started, simply import the leaf fetch class. + +```php +use Leaf\Fetch; +``` + +### baseUrl + +You might have noticed that all the requests above needed us to type a long URL to make the requests, however, we can add a base url so we don't have to type it over and over again. + +```php +Fetch::baseUrl("https://jsonplaceholder.typicode.com"); +``` + +And from there you can make requests like this: + +```php +// make a get request +$res = fetch("/todos"); + +// make a post request +$res = fetch("/posts", [ + "title" => "foo", + "body" => "bar", + "userId" => 1, +]); + +// use the get shortcut method +$res = Fetch::get("/todos/10"); + +// echo response +echo json_encode($res); +``` + +As you noticed, configuration made on the fetch class also applies to the `fetch` method. + +### shortcut methods + +The fetch class comes with shortcut methods named after http methods `get`, `post`, `put`, `patch`, ... + +```php +$res = Fetch::post("/posts", [ + "title" => "foo", + "body" => "bar", + "userId" => 2, +]); + +$res = Fetch::get("/todos/10"); + +Fetch::delete("/todos/10"); + +// ... +``` + +### request + +As you've seen earlier, the fetch class also provides a `request` method which is also used under the hood by the `fetch` method. `request` allows you to manually build up your request object with whatever data you need. + +```php +use Leaf\Fetch; + +$res = Fetch::request([ + "method" => "GET", + "url" => "https://jsonplaceholder.typicode.com/todos", +]); + +echo json_encode($res->data); +``` + +### Request object + +This is the array which is used to construct the request to be sent. The available fields are: + +```php +[ + // `url` is the server URL that will be used for the request + "url" => null, + + // `method` is the request method to be used when making the request + "method" => "GET", // default + + // `baseURL` will be prepended to `url` unless `url` is absolute. + // It can be convenient to set `baseURL` for an instance of axios to pass relative URLs + // to methods of that instance. + "baseUrl" => "", + + // `transformRequest` allows changes to the request data before it is sent to the server + // This is only applicable for request methods 'PUT', 'POST', 'PATCH' and 'DELETE' + // The last function in the array must return a string or an instance of Buffer, ArrayBuffer, + // FormData or Stream + // You may modify the headers object. + // "transformRequest" => function ($data, $headers) { + // // Do whatever you want to transform the data + + // return $data; + // }, + + // `transformResponse` allows changes to the response data to be made before + // it is passed to then/catch + // "transformResponse" => function ($data) { + // // Do whatever you want to transform the data + + // return $data; + // }, + + // `headers` are custom headers to be sent + "headers" => [], + + // `params` are the URL parameters to be sent with the request + // Must be a plain object or a URLSearchParams object + "params" => [], + + // `paramsSerializer` is an optional function in charge of serializing `params` + // (e.g. https://www.npmjs.com/package/qs, http://api.jquery.com/jquery.param/) + // "paramsSerializer" => function ($params) { + // return Qs.stringify($params, ["arrayFormat" => "brackets"]); + // }, + + // `data` is the data to be sent as the request body + // Only applicable for request methods 'PUT', 'POST', 'DELETE , and 'PATCH' + // When no `transformRequest` is set, must be of one of the following types: + // - string, plain object, ArrayBuffer, ArrayBufferView, URLSearchParams + // - Browser "only" => FormData, File, Blob + // - Node "only" => Stream, Buffer + "data" => [], + + // `timeout` specifies the number of milliseconds before the request times out. + // If the request takes longer than `timeout`, the request will be aborted. + "timeout" => 0, // default is `0` (no timeout) + + // `withCredentials` indicates whether or not cross-site Access-Control requests + // should be made using credentials + "withCredentials" => false, // default + + // `adapter` allows custom handling of requests which makes testing easier. + // Return a promise and supply a valid response (see lib/adapters/README.md). + // "adapter" => function ($config) { + // /* ... */ + // }, + + // `auth` indicates that HTTP Basic auth should be used, and supplies credentials. + // This will set an `Authorization` header, overwriting any existing + // `Authorization` custom headers you have set using `headers`. + // Please note that only HTTP Basic auth is configurable through this parameter. + // For Bearer tokens and such, use `Authorization` custom headers instead. + "auth" => [], + + // `responseType` indicates the type of data that the server will respond with + // options "are" => 'arraybuffer', 'document', 'json', 'text', 'stream' + // browser "only" => 'blob' + "responseType" => "json", // default + + // `responseEncoding` indicates encoding to use for decoding responses (Node.js only) + // "Note" => Ignored for `responseType` of 'stream' or client-side requests + "responseEncoding" => "utf8", // default + + // `xsrfCookieName` is the name of the cookie to use as a value for xsrf token + "xsrfCookieName" => "XSRF-TOKEN", // default + + // `xsrfHeaderName` is the name of the http header that carries the xsrf token value + "xsrfHeaderName" => "X-XSRF-TOKEN", // default + + // `onUploadProgress` allows handling of progress events for uploads + // browser only + // "onUploadProgress" => function ($progressEvent) { + // // Do whatever you want with the native progress event + // }, + + // `onDownloadProgress` allows handling of progress events for downloads + // browser only + // "onDownloadProgress" => function ($progressEvent) { + // // Do whatever you want with the native progress event + // }, + + // `maxContentLength` defines the max size of the http response content in bytes allowed in node.js + "maxContentLength" => 2000, + + // `maxBodyLength` (Node only option) defines the max size of the http request content in bytes allowed + "maxBodyLength" => 2000, + + // `validateStatus` defines whether to resolve or reject the promise for a given + // HTTP response status code. If `validateStatus` returns `true` (or is set to `null` + // or `undefined`), the promise will be resolved; otherwise, the promise will be + // rejected. + // "validateStatus" => function ($status) { + // return $status >= 200 && $status < 300; // default + // }, + + // `maxRedirects` defines the maximum number of redirects to follow in node.js. + // If set to 0, no redirects will be followed. + "maxRedirects" => 5, // default + + // `socketPath` defines a UNIX Socket to be used in node.js. + // e.g. '/var/run/docker.sock' to send requests to the docker daemon. + // Only either `socketPath` or `proxy` can be specified. + // If both are specified, `socketPath` is used. + "socketPath" => null, // default + + // `proxy` defines the hostname, port, and protocol of the proxy server. + // You can also define your proxy using the conventional `http_proxy` and + // `https_proxy` environment variables. If you are using environment variables + // for your proxy configuration, you can also define a `no_proxy` environment + // variable as a comma-separated list of domains that should not be proxied. + // Use `false` to disable proxies, ignoring environment variables. + // `auth` indicates that HTTP Basic auth should be used to connect to the proxy, and + // supplies credentials. + // This will set an `Proxy-Authorization` header, overwriting any existing + // `Proxy-Authorization` custom headers you have set using `headers`. + // If the proxy server uses HTTPS, then you must set the protocol to `https`. + "proxy" => [], + + // `decompress` indicates whether or not the response body should be decompressed + // automatically. If set to `true` will also remove the 'content-encoding' header + // from the responses objects of all decompressed responses + // - Node only (XHR cannot turn off decompression) + "decompress" => true, // default + + // If false, fetch will try to parse json responses + "rawResponse" => false, + + // CURLOPT_SSL_VERIFYHOST accepts only 0 (false) or 2 (true). + // Future versions of libcurl will treat values 1 and 2 as equals + "verifyHost" => true, // default + + "verifyPeer" => true, // default + + // Set additional options for curl. + "curl" => [], +]; +``` + +Built with ❤ by [**Mychi Darko**](https://mychi.netlify.app) diff --git a/apps/docs/src/modules/forms/index.md b/apps/docs/src/modules/forms/index.md new file mode 100755 index 0000000..8dedc1e --- /dev/null +++ b/apps/docs/src/modules/forms/index.md @@ -0,0 +1,31 @@ +# Intro + +Leaf Form contains methods to simply and quickly handle input from the user. + +## Installation + +You can quickly install leaf forms using the leaf cli: + +```bash +leaf install form +``` + +Or via composer: + +```bash +composer require leafs/form +``` + +## Versions + +There are currently two versions of leaf forms. Click on your version of choice to view it's docs. + +- [version 2](/modules/forms/v/2/) +- [version 1.2](/modules/forms/v/1.2/) +- [version 1](/modules/forms/v/1/) + +**If you are not already using leaf forms, it is recommended that you use version 2.** + +## Upgrading + +You can quickly upgrade by running the installation command above. diff --git a/apps/docs/src/modules/forms/v/1.2/index.md b/apps/docs/src/modules/forms/v/1.2/index.md new file mode 100755 index 0000000..24873e6 --- /dev/null +++ b/apps/docs/src/modules/forms/v/1.2/index.md @@ -0,0 +1,497 @@ +--- +title: "Forms v1.2" +--- + + +# Leaf Forms + +Leaf Form contains methods to simply and quickly handle input from the user. + +## Installation + +You can quickly install leaf forms using the following composer or the leaf cli. + +```bash +leaf install form +``` + +or with composer + +```bash +composer require leafs/form +``` + +
+ +## Functional Mode + + +Leaf form now supports leaf 3's functional mode which allows you to simply call the `form` method from anywhere in your code. This returns an instance of the `Leaf\Form` class, so in case you can't use functional mode, simply call your method on `Leaf\Form`. + +```php +form()->sanitizeInput(...); +``` + +
+
+ +## Form class + +Leaf form can be used by initializing the leaf form class. + +```php +$form = new Leaf\Form; +$form->sanitizeInput(...); +``` + +
+ +## sanitizeInput + +sanitizeInput offers basic security for input data, i.e. sanitizing input against SQL injection. + +
+ +```php +$username = form()->sanitizeInput($username); +``` + +
+
+ +```php +$username = $form->sanitizeInput($username); +``` + +
+ +If you however need better sanitizing, you can check out the [anchor module](/modules/anchor/) + +## Form Submit + +This creates a form and submits it. You can call it a virtual form. It takes in 3 parameters, the request type, the form action and the form data. Currently, it only supports GET and POST requests. + +
+ +```php +form()->submit("POST", "/book/create", [ + "title" => "Book One", + "author" => "Mychi" +]); +``` + +
+
+ +```php +$form->submit("POST", "/book/create", [ + "title" => "Book One", + "author" => "Mychi" +]); +``` + +
+ +## isEmail + +This checks if a field contains an email or not. + +
+ +```php +if (form()->isEmail($field)) { + echo "This is an email"; +} +``` + +
+
+ +```php +if ($form->isEmail($field)) { + echo "This is an email"; +} +``` + +
+ +## body + +This returns all fields passed into a request as an array. + +
+ +```php +$data = form()->body(); +``` + +
+
+ +```php +$data = $form->body(); +``` + +
+ +## Validation + +Validation is one of the most important features used in many different types of projects. Leaf Forms provides a very simple way to validate fields returned from forms, json data and even urls and files. + +### Validate + +Validate simply makes sure that the selected parameters pass these validation tests. + +Parameters which fail the form validation are saved in the form's errors which can be accessed with `errors()`. So In case the validation fails, `validate` returns false, else true. + +
+ +```php +$validatorSuccess = form()->validate([ + "username" => "username", + "email" => "email", + "password" => "required" +]); + +if (!$validatorSuccess) { + response()->exit(form()->errors()); +} +``` + +
+
+ +```php +$validatorSuccess = $form->validate([ + "username" => "username", + "email" => "email", + "password" => "required" +]); + +if (!$validatorSuccess) { + response()->exit($form->errors()); +} +``` + +
+ +#### Inline validate + + +For single rules, using an array takes up a few more lines and looks a bit clustered. For those cases, you can run your validation rules inline: + +
+ +```php +$validation = form()->validate('firstname', 'nospaces'); + +if (!$validation) { + response()->exit(form()->errors()); +} +``` + +
+
+ +```php +$validation = $form->validate('firstname', 'nospaces'); + +if (!$validation) { + response()->exit($form->errors()); +} +``` + +
+ +### validateData + +validateData works pretty much the same way as `validate` except that instead of passing the name of the field you want to validate, you validate the data itself. + +
+ +```php +form()->validateData([ + "mychi.darko" => "validUsername", + "mychi@leafphp.dev" => "email" +]); +``` + +
+
+ +```php +$form->validateData([ + "mychi.darko" => "validUsername", + "mychi@leafphp.dev" => "email" +]); +``` + +
+ +### validateField + +This method also allows you validate data, but compared, to the method above, this is much faster. + +
+ +```php +form()->validateField("username", "michael", "validUsername"); +``` + +
+
+ +```php +$form->validateField("username", "michael", "validUsername"); +``` + +
+ +### Multiple Rule Validation + +You can also pass an array as the rule parameter. If there's more than one rule, both of them will apply. Also, be sure not to use contradictory rules like `number` and `textOnly` or `username` and `email`. + +
+ +```php +form()->validate([ + "username" => "validUsername", + "email" => "email", + "password" => ["required", "noSpaces"] +]); + +form()->validate('username', 'validUsername'); +``` + +
+
+ +```php +$form->validate([ + "username" => "validUsername", + "email" => "email", + "password" => ["required", "noSpaces"] +]); + +$form->validate('username', 'validUsername'); +``` + +
+ +### Supported rules + +This is a list of all supported validate rules + +- `required`: field is required +- `number`: must only contain numbers +- `text` : must only contain text and spaces +- `textOnly`: should be text **only**, no spaces allowed +- `validUsername`: must only contain characters 0-9, A-Z and _ +- `username`: alias for validUsername +- `email`: must be a valid email +- `noSpaces`: can't contain any spaces +- `max`: max length of a string (requires arguments) +- `min`: min length of a string (requires arguments) +- `date`: string should be a valid date + + +**Note that these rules aren't case-sensitive, so you can type them anyway you prefer, as long as the spelling is the same.** + +### Custom Error Messages + + +This has been one of the most sought after features in leaf form, and now it comes pre-packaged in this version. Using custom error messages, you can take your app a step further and define custom error messages in your language of choice. You can do this using the `messages` method. + +
+ +```php +form()->messages('nospaces', '{field} no puede contener espacios'); +``` + +
+
+ +```php +$form->messages('nospaces', '{field} no puede contener espacios'); +``` + +
+ +or + +
+ +```php +form()->messages('min', '{field} doit comporter au moins 8 caractères'); +``` + +
+
+ +```php +$form->messages('min', '{field} doit comporter au moins 8 caractères'); +``` + +
+ +Note the use of `{field}`. This is a mini template that tells leaf to replace {field} with the current field. So in this case: + +
+ +```php +$validation = form()->validate('password', 'min:8'); +``` + +
+
+ +```php +$validation = $form->validate('password', 'min:8'); +``` + +
+ +`{field}` will be replaced with `password`. Leaf form also supports `{value}` and `{params}` which are basically the value of the field being checked and parameters passed into the current rule if any. + +In the example above, `{value}` will be the value of `password` which the user passes into request, and `{params}` will be `8`: that's the parameter passed to the `min` rule. + +::: warning Note +This only works for in-built rules, for custom rules, you can set your own error message using the `addError` method as done below. +::: + +### Create your own rules + +Not every project is the same, as such, you might need validation rules which are not available by default in leaf. As such, the `rule` method has been created to give you leeway to write your own validation rules. + +*You will need to use `addError` to save error messages when the validation fails.* + +
+ +```php +form()->rule("max", function ($field, $value, $params) { + if (strlen($value) > $params) { + form()->addError($field, "$field can't be more than $params characters"); + return false; + } +}); +``` + +
+
+ +```php +$form->rule("max", function ($field, $value, $params) use($form) { + if (strlen($value) > $params) { + $form->addError($field, "$field can't be more than $params characters"); + return false; + } +}); +``` + +
+ +This is an example rule that makes sure that a string isn't longer than it should be. It takes in a `$params` value which is the max length of the string. + +To use this rule, you can simply call max and pass a value into the `$params` field using `:`. + +
+ +```php +form()->validate([ + "username" => "max:10", + ... +``` + +
+
+ +```php +$form->validate([ + "username" => "max:10", + ... +``` + +
+ +Adding the params field is not compulsory, you can create a rule that doesn't take a params field like this: + +
+ +```php +form()->rule("required", function ($field, $value) { + if (($value == "" || $value == null)) { + form()->addError($field, "$field is required"); + return false; + } +}); +``` + +
+
+ +```php +$form->rule("required", function ($field, $value) use($form) { + if (($value == "" || $value == null)) { + $form->addError($field, "$field is required"); + return false; + } +}); +``` + +
+ +This example doesn't take in any parameters. + +### supportedRules + +You can also get all the supported rules. This includes custom rules you've created. + +
+ +```php +$formRules = form()->supportedRules(); +``` + +
+
+ +```php +$formRules = $form->supportedRules(); +``` + +
+ +### errors + +Remember we talked about Leaf Form errors? Leaf Form holds errors for all failed tests, you get all these errors back with `errors()` + +
+ +```php +$validation = form()->validate([ + "username" => "validUsername", + "email" => "email", + "password" => ["required", "noSpaces"] +]); + +if (!$validation) { + return form()->errors(); +} +``` + +
+
+ +```php +$validation = $form->validate([ + "username" => "validUsername", + "email" => "email", + "password" => ["required", "noSpaces"] +]); + +if (!$validation) { + return $form->errors(); +} +``` + +
diff --git a/apps/docs/src/modules/forms/v/1/index.md b/apps/docs/src/modules/forms/v/1/index.md new file mode 100755 index 0000000..b9cc0d9 --- /dev/null +++ b/apps/docs/src/modules/forms/v/1/index.md @@ -0,0 +1,191 @@ +--- +title: "Forms v1" +--- + + +# 🎢 Leaf Forms + +Leaf Form contains methods to simply and quickly handle input from the user. + +## Installation + +You can quickly install leaf forms using the following composer or the leaf cli. + +```bash +composer require leafs/form v1.1 +``` + +or + +```bash +leaf install form@1.1 +``` + +## sanitizeInput + +sanitizeInput offers basic security for input data, i.e. sanitizing input against SQL injection. + +```php +$username = Form::sanitizeInput($username); +``` + +If you however need better sanitizing, you can check out the [anchor module](/modules/anchor/) + +## Form Submit + +This creates a form and submits it. You can call it a virtual form. It takes in 3 parameters, the request type, the form action and the form data. Currently, it only supports GET and POST requests. + +```php +Form::submit("POST", "/book/create", [ + "title" => "Book One", + "author" => "Mychi" +]); +``` + +## isEmail + +This checks if a field contains an email or not. + +```php +if (Form::isEmail($field)) { + echo "This is an email"; +} +``` + +## body + +This returns all fields passed into a request as an array. + +```php +$data = Form::body(); +``` + +## Validation + +Validation is one of the most important features used in many different types of projects. Leaf Forms provides a very simple way to validate fields returned from forms, json data and even urls and files. + +### Validate + +Validate simply makes sure that the selected parameters pass these validation tests. + +Parameters which fail the form validation are saved in the form's errors which can be accessed with `errors()`. So In case the validation fails, `validate` returns false, else true. + +```php +$validatorSuccess = Form::validate([ + "username" => "username", + "email" => "email", + "password" => "required" +]); + +if (!$validatorSuccess) { + response()->exit(Form::errors()); +} +``` + +### validateData + +validateData works pretty much the same way as `validate` except that instead of passing the name of the field you want to validate, you validate the data itself. + +```php +Form::validateData([ + "mychi.darko" => "validUsername", + "mychi@leafphp.dev" => "email" +]); +``` + +### validateField + +This method also allows you validate data, but compared, to the method above, this is much faster. + +```php +Form::validateField("username", "michael", "validUsername"); +``` + +### Multiple Rule Validation + +You can also pass an array as the rule parameter. If there's more than one rule, both of them will apply. Also, be sure not to use contradictory rules like `number` and `textOnly` or `username` and `email`. + +```php +Form::validate([ + "username" => "validUsername", + "email" => "email", + "password" => ["required", "noSpaces"] +]); +``` + +### Supported rules + +This is a list of all supported validate rules + +- `required`: field is required +- `number`: must only contain numbers +- `text` : must only contain text and spaces +- `textOnly`: should be text **only**, no spaces allowed +- `validUsername`: must only contain characters 0-9, A-Z and _ +- `username`: alias for validUsername +- `email`: must be a valid email +- `noSpaces`: can't contain any spaces +- `max`: max length of a string (require arguments) +- `min`: min length of a string (require arguments) + +**Note that these rules aren't case-sensitive, so you can type them anyway you prefer, as long as the spelling is the same.** + +### Create your own rules + +Not every project is the same, as such, you might need validation rules which are not available by default in leaf. As such, the `rule` method has been created to give you leeway to write your own validation rules. + +*You will need to use `addError` to save error messages when the validation fails.* + +```php +Form::rule("max", function ($field, $value, $params) { + if (strlen($value) > $params) { + Form::addError($field, "$field can't be more than $params characters"); + return false; + } +}); +``` + +This is an example rule that makes sure that a string isn't longer than it should be. It takes in a `$params` value which is the max length of the string. + +To use this rule, you can simply call max and pass a value into the `$params` field using `:`. + +```php +Form::validate([ + "username" => "max:10", + ... +``` + +Adding the params field is not compulsory, you can create a rule that doesn't take a params field like this: + +```php +Form::rule("required", function ($field, $value) { + if (($value == "" || $value == null)) { + Form::addError($field, "$field is required"); + return false; + } +}); +``` + +This example doesn't take in any parameters. + +### supportedRules + +You can also get all the supported rules. This includes custom rules you've created. + +```php +$formRules = Form::supportedRules(); +``` + +### errors + +Remember we talked about Leaf Form errors? Leaf Form holds errors for all failed tests, you get all these errors back with `errors()` + +```php +$validation = Form::validate([ + "username" => "validUsername", + "email" => "email", + "password" => ["required", "noSpaces"] +]); + +if (!$validation) return Form::errors(); +``` diff --git a/apps/docs/src/modules/forms/v/2/index.md b/apps/docs/src/modules/forms/v/2/index.md new file mode 100644 index 0000000..2d32162 --- /dev/null +++ b/apps/docs/src/modules/forms/v/2/index.md @@ -0,0 +1,488 @@ +# Leaf Form + +During development, you often come across data that should meet some expectations. For example, a user's email address should be a valid email address. Or a user's password should be at least 8 characters long. Unfortunately, you can't always trust the data you deal with, especially when it comes from the user; that's why you need to validate it. + +Leaf provides a clean and simple interface to validate and use incoming data. We call this Leaf Form. It's not a form builder, it's not a form renderer, it's just a simple data validation library. + +## Installation + +You can quickly install Leaf Form using the [Leaf CLI](/docs/cli/): + +```bash +leaf install form +``` + +Or via composer: + +```bash +composer require leafs/form +``` + +## Validating data + +Leaf Form comes with a very handy `validate()` method that allows you to validate data. It takes in two arguments: + +- An array of the data to validate +- The rules to validate the data against + +If the validation fails, the `validate()` method will return `false`. Otherwise, it will return the validated data. + +
+ +```php{11-15} + 'Full Name', + 'email' => 'mail@example.com', + 'password' => 'password', +]; + +$validated = Form::validate($data, [ + 'name' => 'text', + 'email' => 'email', + 'password' => 'min:8', +]); + +if ($validated) { + // data is valid + $email = $validated['email']; +} else { + // data is invalid +} +``` + +
+
+ +```php{9-13} + 'Full Name', + 'email' => 'mail@example.com', + 'password' => 'password', +]; + +$validated = form()->validate($data, [ + 'name' => 'text', + 'email' => 'email', + 'password' => 'min:8', +]); + + +if ($validated) { + // data is valid + $email = $validated['email']; +} else { + // data is invalid +} +``` + +
+ +If the data is invalid, you can return the reason why the validation failed using the `errors()` method. + +
+ +```php{16} + 'text', + 'email' => 'email', + 'password' => 'min:8', +]); + +if ($validated) { + // data is valid +} else { + $errors = Form::errors(); + // data is invalid +} +``` + +
+
+ +```php{12} +validate($data, [ + 'name' => 'text', + 'email' => 'email', + 'password' => 'min:8', +]); + +if ($validated) { + // data is valid +} else { + $errors = form()->errors(); + // data is invalid +} +``` + +
+ +## Request Validation + +Leaf allows you to validate request data directly on the request object. Using this method, you will interface with Leaf's request object instead of Leaf form which means you can use it without manually installing Leaf Form. To get started, all you need to do is call `validate()` on the request object. + +
+ +```php{8-12} +post('/register', function() use($app) { + $validatedData = $app->request()->validate([ + 'name' => 'text', + 'email' => 'email', + 'password' => 'min:8', + ]); + + if (!$validatedData) { + $errors = $app->request()->errors(); + } +}); +``` + +
+
+ +```php{4-8} +post('/register', function() { + $validatedData = request()->validate([ + 'name' => 'text', + 'email' => 'email', + 'password' => 'min:8', + ]); + + if (!$validatedData) { + $errors = request()->errors(); + } +}); +``` + +
+ +Note that you don't need to pass in the data to validate. The request object will automatically get the data from the request. + +## Optional Fields + +By default, all fields are required. If you want to make a field optional, you can add the `optional` rule to the field. Once a field is optional, it will only be validated if it is present in the data and not null. + +
+ +```php{2} +Form::validate($data, [ + 'bio' => 'optional|text', +]); +``` + +
+
+ +```php{2} +form()->validate($data, [ + 'bio' => 'optional|text', +]); +``` + +
+ +## Available Rules + +Leaf Form comes with a number of built-in rules that you can use to validate data. Here's a list of all the available rules: + +| Rule | Description | +| --- | --- | +| `required` | The field under validation must be present in the input data and not empty. | +| `email` | The field under validation must be formatted as an e-mail address. | +| `text` | The field under validation must contain only alphabetic characters and spaces. | +| `textOnly` | The field under validation must contain only alphabetic characters (no-spaces). | +| `alpha` | The field under validation must contain only alphabetic characters. | +| `alphaNum` | The field under validation must contain only alpha-numeric characters. | +| `alphaDash` | The field under validation must contain only alpha-numeric characters, underscores, and dashes. | +| `username` | The field under validation must contain only alpha-numeric characters and underscores. | +| `number` | The field under validation must contain only numeric characters. | +| `float` | The field under validation must contain only float values. | +| `date` | The field under validation must be a valid date. | +| `min` | The field under validation must have a minimum value. | +| `max` | The field under validation must have a maximum value. | +| `between` | The field under validation must be between two values in length. | +| `match` | The field under validation must match a value. | +| `contains` | The field under validation must contain a value. | +| `in` | The field under validation must be included in a given list of values. | +| `ip` | The field under validation must be a valid IP address. | +| `ipv4` | The field under validation must be a valid IPv4 address. | +| `ipv6` | The field under validation must be a valid IPv6 address. | +| `url` | The field under validation must be a valid URL. | +| `domain` | The field under validation must be a valid domain. | +| `creditCard` | The field under validation must be a valid credit card number. | +| `phone` | The field under validation must be a valid phone number. | +| `uuid` | The field under validation must be a valid UUID. | +| `slug` | The field under validation must be a valid slug. | +| `json` | The field under validation must be a valid JSON string. | +| `regex` | The field under validation must match a given regular expression. | + +## Passing Parameters To Rules + +Some rules like `min`, `max`, `between`, `match`, `contains`, `in` and `regex` require additional parameters. You can pass these parameters to the rules by separating them with a colon (`:`). + +
+ +```php{2} +Form::validate($data, [ + 'bio' => 'min:10', +]); +``` + +
+
+ +```php{2} +form()->validate($data, [ + 'bio' => 'min:10', +]); +``` + +
+ +Some rules like `between` and `in` require multiple parameters. You can pass these parameters by using an array. + +
+ +```php{2} +Form::validate($data, [ + 'bio' => 'between:[18,30]', +]); +``` + +
+
+ +```php{2} +form()->validate($data, [ + 'bio' => 'between:[18,30]', +]); +``` + +
+ +## Array Validation + +Leaf provides easy ways to validate arrays of data. You can validate an array of data using the `array()` validator. You can also validate the items in an array using the dot notation. + +### `array()` + +The `array()` validator allows you to validate an array of data. This checks if the data is an array and if it contains the specified rules. + +
+ +```php{2} +Form::validate($data, [ + 'users' => 'array()', +]); +``` + +
+
+ +```php{2} +form()->validate($data, [ + 'id_numbers' => 'array()', +]); +``` + +
+ +The example above will check if the `users` field is an array. Let's say you want to check if the array contains only numeric values. You can do that by passing in the rules to the `array()` validator. + +
+ +```php{2} +Form::validate($data, [ + 'id_numbers' => 'array(number)', +]); +``` + +
+
+ +```php{2} +form()->validate($data, [ + 'id_numbers' => 'array(number)', +]); +``` + +
+ +**The `array()` method should not be used on arrays with key => value pairs.** + +### Dot Notation + +You can also validate the items in an array using the dot notation. This allows you to validate arrays with key => value pairs. For example, let's say you have an array holding a user with a name and an email address: + +```php +$data = [ + 'user' => [ + 'name' => 'John Doe', + 'email' => 'john@example.com', + ], +]; +``` + +You can validate the user's name and email address like this: + +
+ +```php{2,3} +Form::validate($data, [ + 'user.name' => 'text', + 'user.email' => 'email', +]); +``` + +
+
+ +```php{2,3} +form()->validate($data, [ + 'user.name' => 'text', + 'user.email' => 'email', +]); +``` + +
+ +## Custom Rules + +You can create your own rules using the `addRule()` method or it's alias `rule()`. It takes in three arguments: + +- The name of the rule +- The rule's handler +- The rule's error message + +**Note:** The rule's handler must be either a regular expression or a callable that returns a boolean value. + +
+ +```php{1,3-8} +Form::addRule('isEven', '/^\d*[02468]$/', 'The :attribute must be an even number.'); + +Form::rule('superTest', function ($value) { + // in functions, you can also add the error messages like this + Form::message('superTest', '{field} should be superTest!'); + + return $value === 'superTest'; +}); + +... + + +Form::validate($data, [ + 'age' => 'isEven', +]); +``` + +
+
+ +```php{1,3-8} +form()->rule('isEven', '/^\d*[02468]$/', 'The {field} must be an even number.'); + +form()->rule('superTest', function ($value) { + // in functions, you can also add the error messages like this + form()->message('superTest', '{field} should be superTest!'); + + return $value === 'superTest'; +}); + +... + + +form()->validate($data, [ + 'age' => 'isEven', +]); +``` + +
+ +## Custom Error Messages + +You can customize the error messages for each rule by passing in an array of the rules and their error messages to the `message()` method. The keys of the array should be the names of the rules and the values should be the error messages. + +
+ +```php +Form::message([ + 'required' => '{field} is required', + 'email' => '{field} must be a valid email address', +]); +``` + +
+
+ +```php +form()->message([ + 'required' => '{field} is required', + 'email' => '{field} must be a valid email address', +]); +``` + +
+ +You can also customize the error messages for any rule by passing in the rule's name and the error message to the `message()` method. + +
+ +```php +Form::message('required', '{field} is required'); +``` + +
+
+ +```php +form()->message('required', '{field} is required'); +``` + +
+ +Note the use of `{field}`. This is a mini template that tells leaf to replace `{field}` with the current field. So in this case: + +
+ +```php +Form::message('required', '{field} is required'); +Form::validate($data, [ + 'name' => 'required', +]); +``` + +
+
+ +```php +form()->message('required', '{field} is required'); +form()->validate($data, [ + 'name' => 'required', +]); +``` + +
+ +The error message will be `name is required`. You can also use `{Field}` instead of `{field}` to get the field name with the first letter capitalized. You can also use `{value}` to get the value of the field. diff --git a/apps/docs/src/modules/fs/index.md b/apps/docs/src/modules/fs/index.md new file mode 100755 index 0000000..c1aab68 --- /dev/null +++ b/apps/docs/src/modules/fs/index.md @@ -0,0 +1,353 @@ +--- +title: "Leaf FileSystem" +--- + + +# Leaf FS + +This is a simple functionality inspired by node js' FileSystem(fs) module. Leaf FS aims to make directory and file management much simpler than what you're currently used to, so as to speed up and ease the dev process. + +Leaf FS allows you to read/write to file, create, rename, copy and paste files/directories all with just a few lines of code. All this is performed while maintaining Leaf's simplicity. + +## Installation + +You can install leaf fs through composer: + +```bash +composer require leafs/fs +``` + +or with leaf cli: + +```bash +leaf install fs +``` + +## FS Directory Methods + +### createFolder + +This will create a new directory in the `current directory` + +Let's take this directory structure below, we initialise Leaf FS in our index.php file. + +```bash +├───logs +├───index.php +``` + +In our index.php file: + +```php +FS::createFolder("new_logs"); +``` + +After running this code, this is our new directory structure + +```bash +├───logs +├───new_logs +├───index.php +``` + +### renameFolder + +renameFolder is used to rename a directory. It takes in two parameters: the directory you want to rename and it's new name/path. + +```php +FS::renameFolder("new"); +FS::renameFolder("home/new", "home/items"); +``` + +### deleteFolder + +deleteFolder is used to delete a directory. It takes in two parameters: the directory you want to delete. + +```php +FS::deleteFolder("new", "items"); +FS::deleteFolder("home/new", "home/items"); +``` + +### listDir + +listDir returns an array of all the files/folders in a directory. It takes in the directory to list and a search pattern eg: `*.php`. Also note that all folders end with a '/' + +```php +FS::listDir("new"); +FS::listDir("home/new", "*.txt"); +``` + +### listFolders + +This method lists all the folders in a particular directory. + +```php +FS::listDir("folder"); +``` + +## FS File Methods + +### createFile + +`createFile` is used to create a new file in the `current directory`. It takes in the filename or path+filename. If the file already exists, it gives the new file a different name. + +```php +FS::createFile("items.txt"); +FS::createFile("home/items.txt"); +``` + +### writeFile + +`writeFile` is used to add content to a file, if the file already has content, all the content in there is replaced with the new content. Also, if the file doesn't exist, it will be created and all the content will be added to it. It takes in 2 parameters, the name/path+name of the file and the content; + +```php +FS::writeFile("items.txt", "Hello"); +FS::writeFile("items.txt", [ + "name" => "Item 1" +]); +FS::writeFile("items.txt", 1); +``` + +### append + +append is almost exactly the same as writeFile, except that instead of replacing the content in a file, it adds to the end of it. + +```php +$data = FS::append("items.txt", "Item name"); +``` + +### prepend + +prepend is almost exactly the same as writeFile, except that instead of replacing the content in a file, it adds to the begining. + +```php +$data = FS::prepend("items.txt", "Item name"); +``` + +### readFile + +readFile returns the data found in a file. It takes 1 parameter: the file name/path+file name. + +```php +$data = FS::readFile("./home/items.txt"); +``` + +### renameFile + +renameFile renames a file. It takes 2 parameter: the file name/path+file name to rename and it's new name. + +```php +$data = FS::renameFile("./home/items.txt", "home/products.txt"); +``` + +### deleteFile + +deleteFile deletes a file. It takes 2 parameter: the file name/path+file name to delete. + +```php +$data = FS::deleteFile("./home/items.txt"); +``` + +### copyFile + +copyFile copies a file from the current directory to another directory. It takes in 3 parameters: the filename, the new path + filename and whether to rename the file if it exists in the new directory. The 3rd parameter is optional, if nothing is passed for the 3rd parameter, it will rename the file. Pass in true to rename the file if it already exists, false to override the file content(default is true). + +```php +$data = FS::copyFile("items.txt", "./home/"); +$data = FS::copyFile("items.txt", "./home/", false); +``` + +### deepCopy + +Recursively copy through a folder. + +```php +FS::deepCopy("source", "destination"); +``` + +### superCopy + +Copy a file, or recursively copy a folder and its contents. Based on [Aidan Lister's copyr](http://aidanlister.com/2004/04/recursively-copying-directories-in-php/) + +```php +$permissions = 0755; +FS::superCopy("source", "destination", $permissions); +``` + +### cloneFile + +cloneFile also copies a file from the current directory to another directory, but unlike copyFile, cloneFile includes the filename, and it takes in 2 parameters: the filename and the path+filename to clone to. + +```php +$data = FS::cloneFile("items.txt", "./home/products.txt"); +``` + +### moveFile + +moveFile also moves a file from the current directory to another directory, it takes in 2 parameters: the filename and the path to move to. + +```php +$data = FS::moveFile("items.txt", "./home/"); +``` + +### allFiles + +This method allows you to get all of the files from the given directory (recursive). It takes in the directory to search and whether to show hidden files or not. + +```php +$files = FS::allFiles("records", false); +``` + +### uploadFile + +
+This method was previously upload. In v2.4, uploadFile has received a lot of fixes and new features. Also the older upload method has been removed. +
+ +`uploadFile` as the name suggests is a method that makes file uploading a breeze. This is the main highlight of `Leaf\FS` in v2.4. Also unlike in earlier versions, `uploadFile` supports more type of files. + +It takes in 3 parameters: + +- The file to upload +- The path to save the file +- Config for file upload + +```php +$profilePic = $request->files("profile_pic"); + +// file upload +Leaf\FS::uploadFile($profilePic, "./images/"); +``` + +One amazing thing about FS is that it can detect the type of file you're trying to upload and handle it accordingly, so you don't need to worry about that. Below is a table of common file types which are automatically detected. + +| File Type | Common Extensions | +| :-------------- | :---------------------------------------------- | +| image | 'jpg', 'jpeg', 'png', 'gif', 'webp', 'apng', 'tif', 'tiff', 'svg', 'pjpeg', 'pjp', 'jfif', 'cur', 'ico' | +| video | 'mp4', 'webm', 'swf', 'flv' | +| audio |'wav', 'mp3', 'ogg', 'm4a' | +| text |'txt', 'log', 'xml', 'doc', 'docx', 'odt', 'wpd', 'rtf', 'tex', 'pdf' | +| presentation |'ppsx', 'pptx', 'ppt', 'pps', 'ppsm', 'key', 'odp' | +| compressed |'zip', 'rar', 'bz', 'gz', 'iso', 'tar.gz', 'tgz', 'zipx', '7z', 'dmg'| +| spreadsheet |'ods', 'xls', 'xlsx', 'xlsm' | +| application |'apk', 'bat', 'cgi', 'pl', 'com', 'exe', 'gadget', 'jar', 'msi', 'py', 'wsf' | + +You can open an issue if you think there should be a new category or if an important extension is not present here. + +**Upload Config**: + +You can configure file uploads to behave the way you want it to, and that's the 3rd parameter it takes in. + +```php +Leaf\FS::uploadFile($profilePic, "./images/", []); +``` + +Config is an array that takes in particular properties: + +```php +Leaf\FS::uploadFile($profilePic, "./images/", [ + "verify_dir" => true +]); +``` + +This is a list of config options. + +| Config Name | Description | Possible Values | +| :-------------- | :---------------------------------------------- | -----------------------: | +| unique | If `true`, a timestamp is added to filename | `true`, `false` | +| verify_dir | Add error if upload directory is invalid | `true`, `false` | +| verify_file | Add error if same filename exists | `true`, `false` | +| max_file_size | Set maximum file size in bytes, default: 10mb | integer | +| file_type | Set file type if it's not included in default list | string | +| validate | Validate file type for invalid extensions: Only works with the default extensions | `true`, `false` | + +If the file upload is successful, it returns the filename, you can perform whatever operation you need on the filename, if it fails you can access the errors through the `errors` method. Refer to error handling for this part. + +```php +$filename = FS::uploadFile($profilePic, "./images/", []); +``` + +### uploadInfo + +When the file successfully uploads, records on the file details are shelved. You can access these with the `uploadInfo` method. It takes in one optional parameter, the name of the file whose info you want to return. + +```php +// returns info on all uploaded files (associative array) +$uploadInfo = Leaf\FS::uploadInfo(); + +// returns info on only selected file +$profileInfo = FS::uploadInfo($filename); +``` + +### chmod + +Get or set UNIX mode of a file or directory. + +```php +$mode = FS::chmod("items.txt"); +FS::chmod("items.txt", ...); +``` + +### link + +Create a symlink to the target file or directory. On Windows, a hard link is created if the target is a file. + +```php +FS::link("items.txt", "items"); +``` + +### name + +Extract the file name from a file path. + +```php +$name = FS::name("works/log.txt"); +``` + +### basename + +Extract the trailing name component from a file path. + +```php +$name = FS::basename("works/log.txt"); +``` + +### dirname + +Extract the parent directory from a file path. + +```php +$dirname = FS::dirname("works/log.txt"); +``` + +### extension + +Extract the file extension from a file path. + +```php +$extension = FS::extension("works/log.txt"); +``` + +### type + +Get the file type of a given file. + +```php +$type = FS::type("works/log.txt"); +``` + +### size + +Get the file size of a given file. + +```php +$size = FS::size("works/log.txt"); +``` + +## errors + +Just like most leaf modules, fs also has an errors method which returns any errors that fs might have run into during an operation. + +```php +$errors = FS::errors(); +``` diff --git a/apps/docs/src/modules/http/index.md b/apps/docs/src/modules/http/index.md new file mode 100644 index 0000000..3a5df74 --- /dev/null +++ b/apps/docs/src/modules/http/index.md @@ -0,0 +1,74 @@ +--- +title: "Introduction" +--- + +# Http Module + +::: tip 🎊 Http v2 released +We just released Leaf Http v2. It comes with a ton of bug fixes and updated functionality for almost each class. These changes include standardization of some practices and performance upgrades. +::: + +The Leaf Http module contains a bunch of handlers for managing the kinds and methods through which data flows in and out of your application. + +
+ +The available classes in the Http module are: + +
+ +- [`Leaf\Http\Request`](/modules/http/v/2/request) +- [`Leaf\Http\Response`](/modules/http/v/2/response) +- [`Leaf\Http\Headers`](/modules/http/v/2/headers) +- [`Leaf\Http\Cache`](/modules/http/v/2/cache) +- [`Leaf\Http\Status`](/modules/http/v/2/status) + +## Installation + +You can install the http module with the [Leaf CLI](/docs/cli/): + +```bash +leaf install http +``` + +or with Composer: + +```bash +composer require leafs/http +``` + +From there you can use any of the classes above in your project. + +::: tip +Cookies and session are independent modules which are not added to the Http module. This is because, the use of session and cookies is relatively low in APIs. If you however want to use sessions and cookies, you can read their guides for information on them. +::: + +## Versions + +There are currently two versions of Leaf Http. Click on your version of choice to view its docs. + +- [v1](/modules/http/v/1/) +- [v2](/modules/http/v/2/) + +## Request + +This is a developer friendly interface which allows you to interact with data coming into your application. [Read the docs](/modules/http/v/2/request) + +## Response + +This interface allows you to output data from your application in different forms. [Read the docs](/modules/http/v/2/response) + +## Headers + +This interface allows you to manage headers in your application. [Read the docs](/modules/http/v/2/headers) + +## Cache + +This interface allows you to manage HTTP cache in your app. [Read the docs](/modules/http/v/2/cache) + +## Session (module) + +This module allows you to manage session in your application. [Read the docs](/modules/session/) + +## Cookies (module) + +This module allows you to manage cookies in your application. [Read the docs](/modules/cookies/) diff --git a/apps/docs/src/modules/http/v/1/cache.md b/apps/docs/src/modules/http/v/1/cache.md new file mode 100755 index 0000000..4f0c8d7 --- /dev/null +++ b/apps/docs/src/modules/http/v/1/cache.md @@ -0,0 +1,68 @@ +# Http Cache + + + +::: warning Watch out +Leaf http cache is a class available on the leaf http module. Check out the [http module docs](/modules/http/) for installation instructions. +::: + +Http Cache is a new class added on the http module that allows you to perform some basic caching on leaf response handlers. After installing the http module, you can use all caching methods. + +## Usage + +You can use caching via the `etag`, `lastModified`, and `expires` methods. It is best to use one of `etag` or `lastModified` - in conjunction with `expires` - per route; never use both `etag` and `lastModified` together in the same route callback. + +The `etag` and `lastModified` methods should be invoked in a route callback before other code; this allows Leaf to check conditional GET requests before processing the route callback’s remaining code. + +Both `etag` and `lastModified` instruct the HTTP client to store the resource response in a client-side cache. The `expires` method indicates to the HTTP client when the client-side cache should be considered stale. + +### etag + +An ETag is a unique identifier for a resource URI. After setting the Etag headers, the HTTP client will send an `If-None-Match` header with each subsequent HTTP request of the same resource URI. If the ETag value for the resource URI matches the `If-None-Match` HTTP request header, GET and HEAD requests will return a `304 Not Modified` HTTP response while all others return a `421 Precondition Failed` that will prompt the HTTP client to continue using its cache; this also prevents Leaf from serving the entire markup for the resource URI, saving bandwidth and response time. + +Setting an ETag with Leaf is very simple. Invoke Leaf’s etag method in your route callback, passing it a unique ID as the first and only argument. + +```php +use \Leaf\Http\Headers; + +$app->get("/", function () use ($app) { + Headers::etag("unique-tag"); + + echo "This will be cached after the initial request!"; +}); +``` + +That’s it. Make sure the ETag ID is unique for the given resource. Also make sure the ETag ID changes as your resource changes; otherwise, the HTTP client will continue serving its outdated cache. + +### expires + +Used in conjunction with the Leaf application’s etag or lastModified methods, the expires method sets an Expires header on the HTTP response informing the HTTP client when its client-side cache for the current resource should be considered stale. The HTTP client will continue serving from its client-side cache until the expiration date is reached, at which time the HTTP client will send a conditional GET request to the Leaf application. + +The expires method accepts one argument: an integer UNIX timestamp, or a string to be parsed with strtotime. + +```php +use \Leaf\Http\Headers; + +$app->get("/", function () use ($app) { + Headers::etag("unique-tag"); + Headers::expires("+1 week"); + + echo "This will be cached client-side for one week"; +}); +``` + +### lastModified + +A Leaf provides built-in support for HTTP caching using the resource’s last modified date. When you specify a last modified date, Leaf tells the HTTP client the date and time the current resource was last modified. The HTTP client will then send a If-Modified-Since header with each subsequent HTTP request for the given resource URI. If the last modification date you specify matches the If-Modified-Since HTTP request header, the Leaf will return a 304 Not Modified HTTP response that will prompt the HTTP client to use its cache; this also prevents the Leaf from serving the entire markup for the resource URI saving bandwidth and response time. + +Setting a last modified date with Leaf is very simple. You only need to invoke the Leaf’s lastModified() method in your route callback passing in a UNIX timestamp of the last modification date for the given resource. Be sure the lastModified() method’s timestamp updates along with the resource’s last modification date; otherwise, the browser client will continue serving its outdated cache. + +```php +use \Leaf\Http\Headers; + +$app->get("/", function () use ($app) { + Headers::lastModified(1617383991); + + echo "This will be cached after the initial request!"; +}); +``` diff --git a/apps/docs/src/modules/http/v/1/headers.md b/apps/docs/src/modules/http/v/1/headers.md new file mode 100755 index 0000000..dbb0cdf --- /dev/null +++ b/apps/docs/src/modules/http/v/1/headers.md @@ -0,0 +1,187 @@ +# Leaf Headers + + +::: warning Watch out +Leaf request is a class available on the leaf http module. Check out the [http module docs](/modules/http/) for installation instructions. +::: + +In previous versions of Leaf, Headers have been added to the request and response objects and could not be fully accesed directly, however, v2.4 provides a Headers object which allows you perform all header operations smoothly. Another amazing thing is that all Leaf Header methods are static, and so can be called directly without initializing the Headers object. + +
+You can still use most header methods from within the response and request objects, you can refer to those if you want to, however, this package comes with ore features and better useability. +
+ +To get started with the Headers object, you simply need to call whatever method you need on the `Leaf\Http\Headers` object. Since it's static, there's no need to initialize it. + +## Headers Methods + +Below are the methods you can use on the Headers object: + +### status + +This method sets or returns the base HTTP status of a response. Response methods allow you to directly set http status codes, however, if you want to use PHP's native output methods, you can set the status code here. + +```php +// ... +Leaf\Http\Headers::status(404); +echo "Page not found"; +``` + +You can also return the currently set status code. + +```php +$code = Leaf\Http\Headers::status(); +``` + +
+ +### resetStatus + +If for some reason, you're not able to set the status using `status`, you can always fallback to `resetStatus`. This method uses PHP's inbuilt `http_response_code`. + +```php +// ... +Leaf\Http\Headers::resetStatus(200); +echo 'Something here'; +``` + +
+ +### all + +This method returns all headers passed into your Leaf app. It takes in a single optional parameter, whether to sanitize header data or not, it is set to false by default. + +```php +// will not sanitize headers +Leaf\Http\Headers::all(); + +// will not sanitize headers +Leaf\Http\Headers::all(false); + +// will sanitize headers +Leaf\Http\Headers::all(true); +``` + +
+ +### get + +This method as the name implies returns a particular header. + +```php +$content = Leaf\Http\Headers::get("Content-Type"); +``` + +You can also get multiple headers at the same time. + +```php +$headerGroup = Leaf\Http\Headers::get(["Content-Type", "Authorization"]); +``` + +Just like `all`, you can also sanitize the information from `get`. + +```php +$data = Leaf\Http\Headers::get("header", true); +``` + +
+ +### set + +`set` allows you to set a new response header. It takes in 4 parameters: + +- The header to to set +- Value for header +- Replace similar header? +- An http status code + +```php +Leaf\Http\Headers::set("location", "/home", true, 302); +``` + +You can also set multiple values at once. + +```php +Leaf\Http\Headers::set(["location" => "/home", "something" => "here"]); +``` + +If you want multiple headers with the same name, you can set replace to `false`. This will force multiple headers of the same type. + +```php +Leaf\Http\Headers::set([ + "WWW-Authenticate" => "Negotiate", + "WWW-Authenticate" => "NTLM" +], null, false); +``` + +
+ +### remove + +This method removes previously set headers. + +```php +// single value +Leaf\Http\Headers::remove("WWW-Authenticate"); + +// multiple value +Leaf\Http\Headers::remove(["Content-Type", "WWW-Authenticate"]); +``` + +## Utility Header methods + +Some shortcut methods have been prepared for the most used headers, so you won't need to stress yourself writing a bunch of stuff for simple tasks. + +### contentPlain + +This method set's the content type of the response to `text/plain`, it also takes in an HTTP status code. + +```php +Leaf\Http\Headers::contentPlain(200); +echo "plain text here"; +``` + +### contentHtml + +This method set's the content type of the response to `text/html`, it also takes in an HTTP status code. + +```php +Leaf\Http\Headers::contentHtml(200); +echo "html here"; +``` + +### contentXml + +This method set's the content type of the response to `application/xml`, it also takes in an HTTP status code. + +```php +Leaf\Http\Headers::contentXml(200); +echo "Xml here"; +``` + +### contentJSON + +This method set's the content type of the response to `application/json`, it also takes in an HTTP status code. + +```php +Leaf\Http\Headers::contentJSON(200); +echo "json here"; +``` + +### accessControl + +This method allows you to quickly set `Access-Control` headers in your app. It takes in 3 parameters: + +- The header to set +- The value to set +- A status code (optional) + +```php +Leaf\Http\Headers::accessControl("Allow-Origin", "https://example.com", 200); +``` + +You can set mutiple access control headers at once: + +```php +Leaf\Http\Headers::accessControl(["Allow-Origin" => "*", "Allow-Headers" => "*"]); +``` diff --git a/apps/docs/src/modules/http/v/1/index.md b/apps/docs/src/modules/http/v/1/index.md new file mode 100644 index 0000000..e4d3e45 --- /dev/null +++ b/apps/docs/src/modules/http/v/1/index.md @@ -0,0 +1,69 @@ +--- +title: "Introduction" +aside: none +--- + +# Leaf Http v1 + +::: warning +There is no need to manually add the Http module if you're using Leaf 3 since this is done for you automatically. +::: + +::: tip 🎊 Http v2 released +We just released Leaf Http v2. It comes with a ton of bug fixes and updated functionality for almost each class. These changes include standardization of some practices and performance upgrades. + +[Read the docs](/modules/http/v/2/) +::: + +The Leaf Http module contains a bunch of handlers for managing the kinds and methods through which data flows in and out of your application. + +The available classes in the Http module are: + +- [`Leaf\Http\Request`](/modules/http/v/1/request) +- [`Leaf\Http\Response`](/modules/http/v/1/response) +- [`Leaf\Http\Headers`](/modules/http/v/1/headers) +- [`Leaf\Http\Cache`](/modules/http/v/1/cache) + +## Installation + +You can install the http module with the [leaf cli](/docs/cli/): + +```bash +leaf install http +``` + +or with composer: + +```bash +composer require leafs/http +``` + +From there you can use any of the classes above in your project. + +::: tip +Cookies and session are independent modules which are not added to the Http module. This is because, the use of session and cookies is relatively low in APIs. If you however want to use sessions and cookies, you can read their guides for information on them. +::: + +## Request + +This is a developer friendly interface which allows you to interact with data coming into your application. [Read the docs](/modules/http/v/1/request) + +## Response + +This interface allows you to output data from your application in different forms. [Read the docs](/modules/http/v/1/response) + +## Headers + +This interface allows you to manage headers in your application. [Read the docs](/modules/http/v/1/headers) + +## Cache + +This interface allows you to manage http cache in your app. [Read the docs](/modules/http/v/1/cache) + +## Session (module) + +This module allows you to manage session in your application. [Read the docs](/modules/session/) + +## Cookies (module) + +This module allows you to manage cookies in your application. [Read the docs](/modules/cookies/) diff --git a/apps/docs/src/modules/http/v/1/request.md b/apps/docs/src/modules/http/v/1/request.md new file mode 100755 index 0000000..a1d9f19 --- /dev/null +++ b/apps/docs/src/modules/http/v/1/request.md @@ -0,0 +1,436 @@ +# Leaf Request + + +::: warning Watch out +Leaf request is a class available on the leaf http module. Check out the [http module docs](/modules/http/) for installation instructions. +::: + +The request object is an abstraction of the current HTTP request and allows you to easily interact with any data passed into your application. + +## Request class + +The request class allows you to quickly access all the features of leaf request. + +```php +Leaf\Http\Request::get("name"); + +// or + +use Leaf\Http\Request; + +Request::get("name"); +``` + +## Request on the Leaf Instance + +If you are using request in a leaf app, leaf automatically binds the request class to the leaf instance, so you can always access the leaf request object without having to include any classes or namespaces. + +```php{4} +$app = new Leaf\App; + +$app->post("/user/change-username", function () use($app) { + echo $app->request()->get("username"); +}); +``` + +## Functional Mode + + +Request now hooks into leaf 3's functional mode and comes with global functions you can use anywhere in your app. Read the [functional mode docs](/docs/tooling/functions) for all the information on functional mode. + +```php{2} +app()->post("/items/add", function () { + echo request()->get("username"); +}); +``` + +As you noticed above, we simply call the `request` method without doing anything. Everything is taken care of for us. Also, now, you can use this feature even when you are not using Leaf in your app. + +You can also pass an array or string to the `request` method to directly retrieve information from the request body. + +```php +$name = request("name"); +``` + +## Basic Usage + +### get() + +`get()` is a general purpose method which retrieves a particular item from the request body. In simpler terms, it works like `$_POST['key']` but works for all request types. It takes in one parameter: the key of the parameter you wish to get. + +```php +$app->post('/name/add', function () use($app) { + $name = $app->request()->get('name'); +}); + +// get: linkToApp?id=1 +$id = $app->request()->get('id'); +``` + +In v2.4, `get` can also be used on files passed into the request. + +```php +$picture = $request->get("image"); +``` + +### Multiple select + +In v2.4, you can retrieve a couple of fields you want, and not just one. You can also use this as a filter to return only the data you want in your app instead of using `body` which dumps all request data. + +```php +$loginData = $request->get(["username", "password"]); +// ... do something with username +echo $loginData["username"]; +``` + +This allows you to set data you need dynamically. + +```php +list($username, $password) = array_values($request->get(["username", "password"])); +// ... do something with username +echo $username; +``` + +### Security Fixes + +`get()` has also received a bunch of security fixes which prevent maliscious scripts from being passed into your application. In v2.4, you can choose not to sanitize data coming into your application by passing in `false` as the second parameter. + +```php +// data is sanitized +$username = $request->get("username"); +// data is sanitized +$title = $request->get("title", true); +// data is not sanitized +$blog = $request->get("blogBody", false); +``` + +
+ +## try() + +`try()` works just like `get` above, except that it conditionally returns items in the request. Let's look at an example: + +```php +// get request: linkToApp?name=mychi +$data = $app->request()->try(["name", "email"]); + +// $data -> ["name" => "mychi"]; +``` + +Unlike `get` and `body`, if the parameter to find in the request is not found, it will automatically be removed from the data returned. You can also remove empty strings from the request by passing `true` as a third parameter. + +The available parameters are: + +- array - The parameters to return +- bool - Sanitize output? Default `true` +- bool - Remove empty strings from return data? Default `false` + +### Multiple select + +In v2.4, you can retrieve a couple of fields you want, and not just one. You can also use this as a filter to return only the data you want in your app instead of using `body` which dumps all request data. + +```php +$loginData = $request->get(["username", "password"]); +// ... do something with username +echo $loginData["username"]; +``` + +This allows you to set data you need dynamically. + +```php +list($username, $password) = array_values($request->get(["username", "password"])); +// ... do something with username +echo $username; +``` + +
+ +## body() + +`body()` is another general purpose method which retrieves the key => value pairs of the entire request body. In simpler terms, it works like `$_POST` but works for all request types. In v2.4, `body` can also retrieve files passed into the request. + +```php +$app->post('/name/add', function () use($app) { + $body = $app->request()->body(); +}); +``` + +### 🧐 Security Fixes + +`body()` has also received a bunch of security fixes which prevent maliscious scripts from being passed into your application. Just like with `get`, v2.4 you the option to not sanitize data coming into your application by passing in `false`. + +```php +// data is sanitized +$body = $app->request()->body(); +// data is sanitized +$body = $app->request()->body(true); +// data is not sanitized +$body = $app->request()->body(false); +``` + +
+ +## files + +Files returns an array holding key values pairs of files passed into your app. + +```php +$image = $request->files("profile_pic"); +``` + +You can also get multiple files + +```php +list($profile, $avatar) = array_values($request->files(["profile", "avatar"])); +``` + +
+ +## Cookies + +Leaf also provides a simple `cookies` method on the request object which allows you to get cookie data. + +```php +// get specific cookie +$request->cookies("name"); +// get all cookies +$request->cookies(); +``` + +
+ +## headers + +A Leaf application will automatically parse all HTTP request headers. You can access the request headers using the request object’s `headers` method. + +```php +request()->headers(); + +// Get the ACCEPT_CHARSET header +$charset = $app->request()->headers('ACCEPT_CHARSET'); +``` + +The HTTP specification states that HTTP header names may be uppercase, lowercase, or mixed-case. Leaf is smart enough to parse and return header values whether you request a header value using upper, lower, or mixed case header name, with either underscores or dashes. So use the naming convention with which you are most comfortable. + +
+ +## Request Method + +Every HTTP request has a method (e.g. GET or POST). You can obtain the current HTTP request method via the Leaf application’s request object: + +### typeIs + +In v2.4, individual request methodtype checks have been replaced with `typeIs`. So you'll no longer be seeing any of these: + +```php +$app->request()->isGet(); +$app->request()->isPost(); +$app->request()->isPut(); +$app->request()->isDelete(); +$app->request()->isHead(); +$app->request()->isOptions(); +$app->request()->isPatch(); +``` + +instead, you'll be working with: + +```php +$isGetRequest = $app->request()->typeIs("GET"); +$isPostRequest = $app->request()->typeIs("post"); +$isDeleteRequest = $app->request()->typeIs("Delete"); + +if ($isGetRequest) $response->throwErr("GET method not allowed"); +``` + +Here are some other functions you can use relating to the request method. + +```php +/** + * What is the request method? + * @return string (e.g. GET, POST, PUT, DELETE) + */ +$app->request()->getMethod(); + +/** + * Is this a XHR/AJAX request? + * @return bool + */ +$app->request()->isAjax(); +``` + +
+ +## XHR + +When using a Javascript framework like MooTools or jQuery to execute an XMLHttpRequest, the XMLHttpRequest will usually be sent with a **X-Requested-With** HTTP header. The Leaf application will detect the HTTP request’s **X-Requested-With** header and flag the request as such. If for some reason an XMLHttpRequest cannot be sent with the **X-Requested-With** HTTP header, you can force the Leaf application to assume an HTTP request is an XMLHttpRequest by setting a GET, POST, or PUT parameter in the HTTP request named “isajax” with a truthy value. + +Use the request object’s `isAjax()` or `isXhr()` method to tell if the current request is an XHR/Ajax request: + +```php +$isXHR = $app->request()->isAjax(); +$isXHR = $app->request()->isXhr(); +``` + +
+ +## Helpers + +The Leaf application’s request object provides several helper methods to fetch common HTTP request information: + +## Content Type + +Fetch the request’s content type (e.g. “application/json;charset=utf-8”): + +```php +request()->getContentType(); +``` + +## Media Type + +Fetch the request’s media type (e.g. “application/json”): + +```php +request()->getMediaType(); +``` + +## Media Type Params + +Fetch the request’s media type parameters (e.g. [charset => “utf-8”]): + +```php +request()->getMediaTypeParams(); +``` + +## Content Charset + +Fetch the request’s content character set (e.g. “utf-8”): + +```php +request()->getContentCharset(); +``` + +## Content Length + +Fetch the request’s content length: + +```php +request()->getContentLength(); +``` + +## Host + +Fetch the request’s host (e.g. “leafphp.netlify.com”): + +```php +request()->getHost(); +``` + +## Host with Port + +Fetch the request’s host with port (e.g. “leafphp.netlify.com:80”): + +```php +request()->getHostWithPort(); +``` + +## Port + +Fetch the request’s port (e.g. 80): + +```php +request()->getPort(); +``` + +## Scheme + +Fetch the request’s scheme (e.g. “http” or “https”): + +```php +request()->getScheme(); +``` + +## Path + +Fetch the request’s path (root URI + resource URI): + +```php +request()->getPath(); +``` + +## URL + +Fetch the request’s URL (scheme + host [ + port if non-standard ]): + +```php +request()->getUrl(); +``` + +## IP Address + +Fetch the request’s IP address: + +```php +request()->getIp(); +``` + +## Referer + +Fetch the request’s referrer: + +```php +request()->getReferrer(); +``` + +## User Agent + +Fetch the request’s user agent string: + +```php +request()->getUserAgent(); +``` + +
+ +## Paths + +Every HTTP request received by a Leaf application will have a root URI and a resource URI. + +## Root URI + +The root URI is the physical URL path of the directory in which the Leaf application is instantiated and run. If a Leaf application is instantiated in **index.php** within the top-most directory of the virtual host’s document root, the root URI will be an empty string. If a Leaf application is instantiated and run in **index.php** within a physical subdirectory of the virtual host’s document root, the root URI will be the path to that subdirectory with a leading slash and without a trailing slash. + +## Resource URI + +The resource URI is the virtual URI path of an application resource. The resource URI will be matched to the Leaf application’s routes. + +Assume the Leaf application is installed in a physical subdirectory **/foo** beneath your virtual host’s document root. Also assume the full HTTP request URL (what you’d see in the browser location bar) is **/foo/books/1**. The root URI is /foo (the path to the physical directory in which the Leaf application is instantiated) and the resource URI is **/books/1** (the path to the application resource). + +You can get the HTTP request’s root URI and resource URI with the request object’s `getRootUri()` and `getResourceUri()` methods: + +```php +$app = new \Leaf\App; + +//Get root URI +$rootUri = $app->request()->getScriptName(); + +//Get resource URI +$resourceUri = $app->request()->getPathInfo(); +``` diff --git a/apps/docs/src/modules/http/v/1/response.md b/apps/docs/src/modules/http/v/1/response.md new file mode 100755 index 0000000..5d31ccf --- /dev/null +++ b/apps/docs/src/modules/http/v/1/response.md @@ -0,0 +1,314 @@ +# Leaf Response + + +::: warning Watch out +Leaf response is a class available on the leaf http module. Check out the [http module docs](/modules/http/) for installation instructions. +::: + +The response object is an abstraction of your Leaf application’s HTTP response that is returned to the HTTP client. In v2, the response object has been directly bound to the main Leaf object. + +## Using Response + +### Static Response + +Response allows you to call methods statically, which means you don't need to initialize the whole package. If you are using the http module out of leaf, this is also the way to go. + +```php +Leaf\Http\Response::json(["name" => "mychi"]); + +// or + +use Leaf\Http\Response; + +Response::json(["name" => "mychi"]); +``` + +### 🎄 Response on the Leaf Instance + +Since Response is already bound to the Leaf instance, you can do this: + +```php{4} +$app = new Leaf\App; + +$app->get("/text", function () use($app) { + $app->response()->markup("This is text"); +}); +``` + +Although we've added this, we don't want to force you to do stuff in only one way, so you can still use the `v1.x` method. + +### 🎎 Initialising the Response object + +With this method, you manually initialise the Response object, and then pass it into your route. + +```php{2,6} +$app = new Leaf\App; +$response = new Leaf\Http\Response; + +$app->post("/login", function () use($response) { + // ... + $response->json(["username" => $user]); +}); +``` + +An HTTP response has three primary properties: + +- Status +- Header +- Body + +The response object provides helper methods, described next, that help you interact with these HTTP response properties. + +
+ +## throwErr + +"What of error handling?". `throwErr` is just the right method for that. It returns JSON encoded data alongside a code just like `respondWithCode`, however unlike `respondWithCode`, `throwErr` ends the application just like an exception. + +You can get more info on http status codes [here](https://www.restapitutorial.com/httpstatuscodes.html). + +```php +$app->post('/name', function () use($app) { + $name = $app->request->get("name"); + if (!$name) $app->response()->throwErr('Name is required', 500); + + // code below won't run since the app breaks on throwErr +}); +``` + +If no code is passed in, throwErr will send a default `500` status code. + +**Use message:** + +Just like with `respondWithCode`, `throwErr` also allows you to use messages instead of codes which most users don't understand. + +```php +$response->throwErr("error", 500, true); +``` + +
+ +## plain + +This method allows you to output plain text as your response. It takes in 2 parameters: + +- the data to output +- http status code with 200 default (optional) + +```json +response()->plain("hello"); +``` + +## json + +Json, a new method in v2.4, just as the name suggests allows you output json as a response. + +It takes in 4 parameters: + +- The data to output +- The https status code of the data, default 200 (optional) +- Option to show/hide the status code in response body, default `false` (optional) +- Option to use message instead of code, default `false` (optional) + +```php +$response->json("Output", 200); +``` + +**Output**: + +```json +"Output" +``` + +Showing the code in body: + +```php +$response->json("Output", 200, true); +``` + +**Output**: + +```json +{ + "data": "Output", + "code": 200 +} +``` + +Note that you can't use message and code at the same time + +```php +$response->json("Output", 200, true, true); +``` + +**Output**: + +```json +{ + "data": "Output", + "message": "200 OK" +} +``` + +## page + +This is a simple method that outputs a webpage. This method can also be used to achieve server side routing, for example: + +```php +$app->get('/homepage', function () use($response) { + $response->page('link/to/home.html'); +}); +``` + +With this, whenever the route `/homepage` is invoked, Leaf loads up `home.html` and outputs it to the user +renderMarkup() + +**Note** `page` has **NOTHING** to do with templating, it simply outputs an already defined web page. + +For templating with Leaf, [look here](/modules/views/) + +**Status Code:** + +In v2.4, you can add a status code to the page response as the second parameter. + +```php +$response->page("404.html", 404); +``` + +## markup + +This method outputs a string entered into it as markup with a content type of `text/html`: + +For instance, with this code, + +```php +$code = "

Hello

"; +``` + +We simply pass it into the response...like this + +```php +$app->get('/homepage', function () use($app) { + $app->response()->markup($code); +}); +``` + +You might be wondering why we don't just use + +```php +echo "

hello

"; +``` + +The reason is, Leaf has default headers which set the content type to JSON, in order to correctly output HTML, you need to change this....Leaf has taken care of this with a bunch of other things, all within `markup` and `page` + +## download + +In v3, you can send a response which will be downloaded on the client. Note that in this case, the response should be a valid file. + +```php +response()->download('file.zip', 'File name on client', 200); +``` + +As shown above, it takes in 3 parameters: + +- the file to send as response +- The name of the file to show to client (optional, defaults to original filename) +- Http status code (optional, defaults to 200) + +```php +response()->download('item.jpg', 'Profile Pic', 200); +``` + +## Redirect + +This feature just simply allows you to send a redirect response which redirects to a different route. + +```php +// $userHasAuth: true + +if ($userHasAuth) return $response->redirect("/home"); +``` + +## Headers + +An instance of `Leaf\Http\Headers` has been included in the response object. This allows you to quickly set response headers without including the Headers package. + +```php +$app = new \Leaf\App; +$app->response()->headers->set('Content-Type', 'application/json'); +``` + +You may also fetch `headers` from the response object’s headers property, too: + +```php +$contentType = $response->headers->get('Content-Type'); +``` + +If a header with the given name does not exist, `null` is returned. You may specify header names with upper, lower, or mixed case with dashes or underscores. Use the naming convention with which you are most comfortable. + +## Status + +::: tip Info +You can directly set status codes on responses, there's no need to use this method unless you want to use PHP's output methods like echo +::: + +The HTTP response returned to the client will have a status code indicating the response’s type (e.g. 200 OK, 400 Bad Request, or 500 Server Error). You can use the Leaf application’s response object to set the HTTP response’s status like this: + +```php +$app->response()->status(400); +``` + +You only need to set the response object’s status if you intend to return an HTTP response that does not have a 200 OK status. You can just as easily fetch the response object’s current HTTP status by invoking the same method without an argument, like this: + +```php +$status = $response->status(); +``` + +## 🍪 Cookies + +You can also add a cookie using the response object. This uses Leaf Cookies. + +### setCookie + +This method uses [Leaf Cookie's set](/modules/cookies/#set) + +```php +$app->response()->setCookie("name", "Michael"); +``` + +### simpleCookie + +This method uses [Leaf Cookie's simpleCookie](/modules/cookies/#simplecookie) + +```php +$app->response()->simpleCookie("name", "Michael", "1 day"); +``` + +### deleteCookie + +This method uses [Leaf Cookie's unset](/modules/cookies/#unset) + +```php +$app->response()->deleteCookie("name"); +``` + +## Functional Mode + + +Response also adds a new `response` global which allows you quickly use the response object from wherever you are. + +```php +response()->json([ + "status" => "success", + "data" => "Hello", +]); +``` + +You can also pass data directly to the response global. This will immediately call the `json` method above. + +```php +response([ + "status" => "success", + "data" => "Hello", +]); +``` diff --git a/apps/docs/src/modules/http/v/2/cache.md b/apps/docs/src/modules/http/v/2/cache.md new file mode 100755 index 0000000..02fda25 --- /dev/null +++ b/apps/docs/src/modules/http/v/2/cache.md @@ -0,0 +1,136 @@ +# Http Cache + + + + + +Http Cache is a new class added on the http module that allows you to perform some basic caching on leaf response handlers. After installing the http module, you can use all caching methods. + +
+ New to http caching? + +
+ +## Usage + +You can use caching via the `etag`, `lastModified`, and `expires` methods. It is best to use one of `etag` or `lastModified` - in conjunction with `expires` - per route; never use both `etag` and `lastModified` together in the same route callback. + +The `etag` and `lastModified` methods should be invoked in a route callback before other code; this allows Leaf to check conditional GET requests before processing the route callback’s remaining code. + +Both `etag` and `lastModified` instruct the HTTP client to store the resource response in a client-side cache. The `expires` method indicates to the HTTP client when the client-side cache should be considered stale. + +## `etag` + +An ETag is a unique identifier for a resource URI. After setting the Etag headers, the HTTP client will send an `If-None-Match` header with each subsequent HTTP request of the same resource URI. If the ETag value for the resource URI matches the `If-None-Match` HTTP request header, GET and HEAD requests will return a `304 Not Modified` HTTP response while all others return a `421 Precondition Failed` that will prompt the HTTP client to continue using its cache; this also prevents Leaf from serving the entire markup for the resource URI, saving bandwidth and response time. + +Setting an ETag with Leaf is very simple. Invoke Leaf’s etag method in your route callback, passing it a unique ID as the first and only argument. + +
+ +```php +use \Leaf\Http\Headers; + +app()->get("/", function () { + Headers::etag("unique-tag"); + + echo "This will be cached after the initial request!"; +}); +``` + +
+
+ +```php +use \Leaf\Http\Headers; + +$app = new Leaf\App; + +$app->get("/", function () { + Headers::etag("unique-tag"); + + echo "This will be cached after the initial request!"; +}); +``` + +
+ +That’s it. Make sure the ETag ID is unique for the given resource. Also make sure the ETag ID changes as your resource changes; otherwise, the HTTP client will continue serving its outdated cache. + +## `expires` + +Used in conjunction with the Leaf application’s etag or lastModified methods, the expires method sets an Expires header on the HTTP response informing the HTTP client when its client-side cache for the current resource should be considered stale. The HTTP client will continue serving from its client-side cache until the expiration date is reached, at which time the HTTP client will send a conditional GET request to the Leaf application. + +The expires method accepts one argument: an integer UNIX timestamp, or a string to be parsed with strtotime. + +
+ +```php +use \Leaf\Http\Headers; + +app()->get("/", function () { + Headers::etag("unique-tag"); + Headers::expires("+1 week"); + + echo "This will be cached client-side for one week"; +}); +``` + +
+
+ +```php +use \Leaf\Http\Headers; + +$app = new Leaf\App; + +$app->get("/", function () { + Headers::etag("unique-tag"); + Headers::expires("+1 week"); + + echo "This will be cached client-side for one week"; +}); +``` + +
+ +## `lastModified` + +A Leaf provides built-in support for HTTP caching using the resource’s last modified date. When you specify a last modified date, Leaf tells the HTTP client the date and time the current resource was last modified. The HTTP client will then send a If-Modified-Since header with each subsequent HTTP request for the given resource URI. If the last modification date you specify matches the If-Modified-Since HTTP request header, the Leaf will return a 304 Not Modified HTTP response that will prompt the HTTP client to use its cache; this also prevents the Leaf from serving the entire markup for the resource URI saving bandwidth and response time. + +Setting a last modified date with Leaf is very simple. You only need to invoke the Leaf’s lastModified() method in your route callback passing in a UNIX timestamp of the last modification date for the given resource. Be sure the lastModified() method’s timestamp updates along with the resource’s last modification date; otherwise, the browser client will continue serving its outdated cache. + +
+ +```php +use \Leaf\Http\Headers; + +app()->get("/", function () { + Headers::lastModified(1617383991); + + echo "This will be cached after the initial request!"; +}); +``` + +
+
+ +```php +use \Leaf\Http\Headers; + +$app = new Leaf\App; + +$app->get("/", function () { + Headers::lastModified(1617383991); + + echo "This will be cached after the initial request!"; +}); +``` + +
diff --git a/apps/docs/src/modules/http/v/2/headers.md b/apps/docs/src/modules/http/v/2/headers.md new file mode 100755 index 0000000..fb8c71a --- /dev/null +++ b/apps/docs/src/modules/http/v/2/headers.md @@ -0,0 +1,180 @@ +# Headers + + +This is a simple object which allows you to manage the way headers are used in your application. It contains methods to set and get headers in your app. + +::: tip +You can still use most header methods from within the response and request objects, you can refer to those if you want to, however, this package comes with ore features and better useability. +::: + +To get started with the Headers object, you simply need to call whatever method you need on the `Leaf\Http\Headers` object. Since it's static, there's no need to initialize it. + +## status + +This method sets or returns the base HTTP status of a response. Response methods allow you to directly set http status codes, however, if you want to use PHP's native output methods, you can set the status code here. + +```php +// ... +Leaf\Http\Headers::status(404); +echo 'Page not found'; +``` + +You can also return the currently set status code. + +```php +$code = Leaf\Http\Headers::status(); +``` + +## `resetStatus` + +If for some reason, you're not able to set the status using `status`, you can always fallback to `resetStatus`. This method uses PHP's inbuilt `http_response_code`. + +```php +// ... +Leaf\Http\Headers::resetStatus(200); +echo 'Something here'; +``` + +## `all` + +This method returns all headers passed into your Leaf app. It takes in a single optional parameter, whether to sanitize header data or not, it is set to false by default. + +```php +// will not sanitize headers +Leaf\Http\Headers::all(); + +// will not sanitize headers +Leaf\Http\Headers::all(false); + +// will sanitize headers +Leaf\Http\Headers::all(true); +``` + +## `get` + +This method as the name implies returns a particular header. + +```php +$content = Leaf\Http\Headers::get('Content-Type'); +``` + +You can also get multiple headers at the same time. + +```php +$headerGroup = Leaf\Http\Headers::get(['Content-Type', 'Authorization']); +``` + +Just like `all`, you can also sanitize the information from `get`. + +```php +$data = Leaf\Http\Headers::get('header', true); +``` + +## `set` + +`set` allows you to add a new response header. It takes in 4 parameters: + +- The header to to set +- Value for header +- Replace similar header? +- An http status code + +```php +Leaf\Http\Headers::set('location', '/home', true, 302); +``` + +You can also set multiple values at once. + +```php +Leaf\Http\Headers::set(['location' => '/home', 'something' => 'here']); +``` + +If you want multiple headers with the same name, you can set replace to `false`. This will force multiple headers of the same type. + +```php +Leaf\Http\Headers::set([ + 'WWW-Authenticate' => 'Negotiate', + 'WWW-Authenticate' => 'NTLM' +], null, false); +``` + +## `remove` + +This method removes previously set headers. + +```php +// single value +Leaf\Http\Headers::remove('WWW-Authenticate'); + +// multiple value +Leaf\Http\Headers::remove(['Content-Type', 'WWW-Authenticate']); +``` + +## `has` + + +This method allows you to check if a header has been set in the current request. It returns `true` if the header has been set and `false` otherwise. + +```php +if (Leaf\Http\Headers::has('X-SOME-HEADER')) { + // do something nice +} +``` + +## Utility Header methods + +Some shortcut methods have been prepared for the most used headers, so you won't need to stress yourself writing a bunch of stuff for simple tasks. + +### contentPlain + +This method set's the content type of the response to `text/plain`, it also takes in an HTTP status code. + +```php +Leaf\Http\Headers::contentPlain(200); +echo 'plain text here'; +``` + +### contentHtml + +This method set's the content type of the response to `text/html`, it also takes in an HTTP status code. + +```php +Leaf\Http\Headers::contentHtml(200); +echo 'html here'; +``` + +### contentXml + +This method set's the content type of the response to `application/xml`, it also takes in an HTTP status code. + +```php +Leaf\Http\Headers::contentXml(200); +echo 'Xml here'; +``` + +### contentJSON + +This method set's the content type of the response to `application/json`, it also takes in an HTTP status code. + +```php +Leaf\Http\Headers::contentJSON(200); +echo 'json here'; +``` + +### accessControl + +This method allows you to quickly set `Access-Control` headers in your app. It takes in 3 parameters: + +- The header to set +- The value to set +- A status code (optional) + +```php +Leaf\Http\Headers::accessControl('Allow-Origin', 'https://example.com', 200); +``` + +You can set mutiple access control headers at once: + +```php +Leaf\Http\Headers::accessControl(['Allow-Origin' => '*', 'Allow-Headers' => '*']); +``` diff --git a/apps/docs/src/modules/http/v/2/index.md b/apps/docs/src/modules/http/v/2/index.md new file mode 100644 index 0000000..86ab32c --- /dev/null +++ b/apps/docs/src/modules/http/v/2/index.md @@ -0,0 +1,61 @@ +# Leaf Http v2 + +::: warning +There is no need to manually add the Http module if you're using Leaf 3 since this is done for you automatically. +::: + +The Leaf Http module contains a bunch of handlers for managing the kinds and methods through which data flows in and out of your application. + +The available classes in the Http module are: + +
+ +- [`Leaf\Http\Request`](/modules/http/v/2/request) +- [`Leaf\Http\Response`](/modules/http/v/2/response) +- [`Leaf\Http\Headers`](/modules/http/v/2/headers) +- [`Leaf\Http\Cache`](/modules/http/v/2/cache) +- [`Leaf\Http\Status`](/modules/http/v/2/status) + +## Installation + +You can install the http module with the [leaf cli](/docs/cli/): + +```bash +leaf install http +``` + +or with composer: + +```bash +composer require leafs/http +``` + +From there you can use any of the classes above in your project. + +::: tip +Cookies and session are independent modules which are not added to the Http module. This is because, the use of session and cookies is relatively low in APIs. If you however want to use sessions and cookies, you can read their guides for information on them. +::: + +## Request + +This is a developer friendly interface which allows you to interact with data coming into your application. [Read the docs](/modules/http/v/2/request) + +## Response + +This interface allows you to output data from your application in different forms. [Read the docs](/modules/http/v/2/response) + +## Headers + +This interface allows you to manage headers in your application. [Read the docs](/modules/http/v/2/headers) + +## Cache + +This interface allows you to manage http cache in your app. [Read the docs](/modules/http/v/2/cache) + +## Session (module) + +This module allows you to manage session in your application. [Read the docs](/modules/session/) + +## Cookies (module) + +This module allows you to manage cookies in your application. [Read the docs](/modules/cookies/) diff --git a/apps/docs/src/modules/http/v/2/request.md b/apps/docs/src/modules/http/v/2/request.md new file mode 100755 index 0000000..c19e79b --- /dev/null +++ b/apps/docs/src/modules/http/v/2/request.md @@ -0,0 +1,962 @@ +# Request + + + + +The request object provides an interface for accessing and manipulating the current HTTP request being handled by your application, as well as retrieving input, cookies, and files that were submitted with the request. + +## Using the request object + +There are different ways you can access an instance of the Leaf request object. We've listed a couple of them below, every method below will return the active instance of Leaf request. + +
+ +### Functional Mode + + + +Request now hooks into leaf 3's functional mode and comes with global functions you can use anywhere in your app. Read the [functional mode docs](/docs/tooling/functions) for all the information on functional mode. + +```php{2} +app()->post('/items/add', function () { + echo request()->get('username'); +}); +``` + +As you noticed above, we simply call the `request` method without doing anything. Everything is taken care of for us. Also, now, you can use this feature even when you are not using Leaf in your app. + +
+
+ +### Request class + +The request class allows you to quickly access all the features of leaf request. + +```php +Leaf\Http\Request::get('name'); + +// or + +use Leaf\Http\Request; + +Request::get('name'); +``` + +
+ +### Request on the Leaf Instance + +If you are using request in a leaf app, leaf automatically binds the request class to the leaf instance, so you can always access the leaf request object without having to include any classes or namespaces. + +
+ +```php{2} +app()->post('/user/change-username', function () { + echo app()->request()->get('username'); +}); +``` + +Although you can do this, there's no need to go with this method since you have access to the `request` global. + +
+
+ +```php{4} +$app = new Leaf\App; + +$app->post('/user/change-username', function () use($app) { + echo $app->request()->get('username'); +}); +``` + +
+ +## Basic Request Information + +The request instance has several methods that allow you to inspect the HTTP request made to your application. Some useful methods include: + +### `get` + +`get()` is a general purpose method which retrieves a particular item from the request body. In simpler terms, it works like `$_POST['key']` but works for all request types. It takes in one parameter: the key of the parameter you wish to get. + +
+ +```php +$app->post('/name/add', function () use($app) { + $name = $app->request()->get('name'); +}); + +// get: linkToApp?id=1 +$id = $app->request()->get('id'); +``` + +
+
+ +```php +app()->post('/name/add', function () { + $name = request()->get('name'); +}); + +// get: linkToApp?id=1 +$id = request()->get('id'); +``` + +
+ +In v2.4, `get` can also be used on files passed into the request. + +
+ +```php +$picture = $app->request()->get('image'); +``` + +
+
+ +```php +$picture = request()->get('image'); +``` + +
+ +#### Multiple select + +In v2.4, you can retrieve a couple of fields you want, and not just one. You can also use this as a filter to return only the data you want in your app instead of using `body` which dumps all request data. + +
+ +```php +$loginData = $app->request()->get(['username', 'password']); +// ... do something with username +echo $loginData['username']; +``` + +
+
+ +```php +$loginData = request()->get(['username', 'password']); +// ... do something with username +echo $loginData['username']; +``` + +
+ +This allows you to set data you need dynamically. + +
+ +```php +list($username, $password) = array_values($app->request()->get(['username', 'password'])); +// ... do something with username +echo $username; +``` + +
+
+ +```php +list($username, $password) = array_values(request()->get(['username', 'password'])); +// ... do something with username +echo $username; +``` + +
+ +#### Security Fixes + +`get()` has also received a bunch of security fixes which prevent malicious scripts from being passed into your application. In v2.4, you can choose not to sanitize data coming into your application by passing in `false` as the second parameter. + +
+ +```php +// data is sanitized +$username = $app->request()->get('username'); +// data is sanitized +$title = $app->request()->get('title', true); +// data is not sanitized +$blog = $app->request()->get('blogBody', false); +``` + +
+
+ +```php +// data is sanitized +$username = request()->get('username'); +// data is sanitized +$title = request()->get('title', true); +// data is not sanitized +$blog = request()->get('blogBody', false); +``` + +
+ +### `try` + +`try()` works just like `get` above, except that it conditionally returns items in the request. Let's look at an example: + +
+ +```php +// get request: linkToApp?name=mychi +$data = $app->request()->try(['name', 'email']); + +// $data -> ['name' => 'mychi']; +``` + +
+
+ +```php +// get request: linkToApp?name=mychi +$data = request()->try(['name', 'email']); + +// $data -> ['name' => 'mychi']; +``` + +
+ +Unlike `get` and `body`, if the parameter to find in the request is not found, it will automatically be removed from the data returned. You can also remove empty strings from the request by passing `true` as a third parameter. + +The available parameters are: + +- array - The parameters to return +- bool - Sanitize output? Default `true` +- bool - Remove empty strings from return data? Default `false` + +### `params` + +Params is another method which works just like the `get` method above, however, unlike `get` and `try` above, it allows you to specify defaults for items in case they are not found. It also does NOT support multiple select. + +
+ +```php +$app->request()->params('description', 'No Description'); +``` + +
+
+ +```php +request()->params('description', 'No Description'); +``` + +
+ +In case `description` was not passed into the request above, Leaf will return `No Description` instead of an null field. + +### `body` + +`body()` is another general purpose method which retrieves the key => value pairs of the entire request body. In simpler terms, it works like `$_POST` but works for all request types. In v2.4, `body` can also retrieve files passed into the request. + +
+ +```php +$app->post('/name/add', function () use($app) { + $body = $app->request()->body(); +}); +``` + +
+
+ +```php +app()->post('/name/add', function () { + $body = request()->body(); +}); +``` + +
+ +#### Security Fixes + +`body` has also received a bunch of security fixes which prevent maliscious scripts from being passed into your application. It accepts a boolean option which determines if the data coming into your application is sanitized or not. This means that you can turn off the sanitization in case you trust the source of data. By default, this option is enabled. + +
+ +```php +// data is sanitized +$body = $app->request()->body(); + +// data is sanitized +$body = $app->request()->body(true); + +// data is not sanitized +$body = $app->request()->body(false); +``` + +
+
+ +```php +// data is sanitized +$body = request()->body(); + +// data is sanitized +$body = request()->body(true); + +// data is not sanitized +$body = request()->body(false); +``` + +
+ +### `files` + +You may access uploaded files that are included with the request using the `files` method. This returns the raw file to you: + +
+ +```php +$image = $app->request()->files("profile_pic"); +``` + +
+
+ +```php +$image = request()->files('profile_pic'); +``` + +
+ +You can also get multiple files + +
+ +```php +list($profile, $avatar) = array_values($app->request()->files(['profile', 'avatar'])); +``` + +
+
+ +```php +list($profile, $avatar) = array_values(request()->files(['profile', 'avatar'])); +``` + +
+ +### `rawData` + +This method allows you to access the raw PHP input stream only. This works with requests like JSON and xml-http requests. It takes in a string or array of the data you want to retrieve and the default if that data isn't found. + +
+ +```php +$app->request()->rawData('description', 'No Description'); +``` + +
+
+ +```php +request()->rawData('description', 'No Description'); +``` + +
+ +### `urlData` + +This method allows you to access GET request data only. It takes in a string or array of the data you want to retrieve and the default if that data isn't found. + +
+ +```php +$app->request()->urlData('item', 'default'); +``` + +
+
+ +```php +request()->urlData('item', 'default'); +``` + +
+ +### `postData` + +This method allows you to access the post request data only. It takes in a string or array of the data you want to retrieve and the default if that data isn't found. + +
+ +```php +$app->request()->postData('description', 'No Description'); +``` + +
+
+ +```php +request()->postData('description', 'No Description'); +``` + +
+ +## Validating Request Data new + +Leaf Request now comes with a built-in validator which allows you to validate request data directly on the request object. You don't need to install or configure anything. To get started, all you need to do is call `validate()` on the request object. + +
+ +```php{8-12} +post('/register', function() use($app) { + $success = $app->request()->validate([ + 'name' => 'text', + 'email' => 'email', + 'password' => 'min:8', + ]); + + if (!$success) { + $errors = $app->request()->errors(); + } +}); +``` + +
+
+ +```php{4-8} +post('/register', function() { + $success = request()->validate([ + 'name' => 'text', + 'email' => 'email', + 'password' => 'min:8', + ]); + + if (!$success) { + $errors = request()->errors(); + } +}); +``` + +
+ +## Request Headers and Cookies + +The request instance also contains methods which allow you retrieve headers and cookies from the incoming request. + +### Headers + +A Leaf application will automatically parse all HTTP request headers. You can access the request headers using the request object's `headers` method. + +
+ +```php +// Get request headers as associative array +$headers = $app->request()->headers(); + +// Get the ACCEPT_CHARSET header +$charset = $app->request()->headers('ACCEPT_CHARSET'); + +// Get some specific headers as an array +$headers = $app->request()->headers(['ACCEPT_CHARSET', 'X-Header-Name']); +``` + +
+
+ +```php +// Get request headers as associative array +$headers = request()->headers(); + +// Get the ACCEPT_CHARSET header +$charset = request()->headers('ACCEPT_CHARSET'); + +// Get some specific headers as an array +$headers = request()->headers(['ACCEPT_CHARSET', 'X-Header-Name']); +``` + +
+ +Note that Leaf will automatically sanitize the headers that come into your application. This means that you don't have to worry about malicious scripts being passed into your application. If you however want to disable this feature, you can pass in a boolean option to the second field of the `headers` method. By default, this option is enabled. + +
+ +```php +$charset = $app->request()->headers('ACCEPT_CHARSET', false); +``` + +
+
+ +```php +$charset = request()->headers('ACCEPT_CHARSET', false); +``` + +
+ +Also, the `hasHeader` method may be used to determine if the request contains a given header: + +
+ +```php +if ($app->request()->hasHeader('X-Header-Name')) { + // +} +``` + +
+
+ +```php +if (request()->hasHeader('X-Header-Name')) { + // +} +``` + +
+ +The HTTP specification states that HTTP header names may be uppercase, lowercase, or mixed-case. Leaf is smart enough to parse and return header values whether you request a header value using upper, lower, or mixed case header name, with either underscores or dashes. So use the naming convention with which you are most comfortable. + +### Cookies + +Leaf also provides a `cookies` method on the request object which allows you to get cookie data. + +
+ +```php +// get specific cookie +$app->request()->cookies('name'); + +// get all cookies +$app->request()->cookies(); +``` + +
+
+ +```php +// get specific cookie +request()->cookies('name'); + +// get all cookies +request()->cookies(); +``` + +
+ +## Request Method functions + +Every HTTP request has a method (e.g. GET or POST). You can obtain the current HTTP request method via the Leaf application's request object: + +### `typeIs` + +This method allows you to check what method type a request uses. + +
+ +```php +$isGetRequest = $app->request()->typeIs('GET'); +$isPostRequest = $app->request()->typeIs('post'); +$isDeleteRequest = $app->request()->typeIs('Delete'); + +if ($isGetRequest) $app->response()->exit('GET method not allowed'); +``` + +
+
+ +```php +$isGetRequest = request()->typeIs('GET'); +$isPostRequest = request()->typeIs('post'); +$isDeleteRequest = request()->typeIs('Delete'); + +if ($isGetRequest) response()->exit('GET method not allowed'); +``` + +
+ +Here are some other functions you can use relating to the request method. + +
+ +```php +/** + * What is the request method? + * @return string (e.g. GET, POST, PUT, DELETE) + */ +$app->request()->getMethod(); +``` + +
+
+ +```php +/** + * What is the request method? + * @return string (e.g. GET, POST, PUT, DELETE) + */ +request()->getMethod(); +``` + +
+ +### XHR + +When using a Javascript framework like MooTools or jQuery to execute an XMLHttpRequest, the XMLHttpRequest will usually be sent with a **`X-Requested-With`** HTTP header. The Leaf application will detect the HTTP request’s **`X-Requested-With`** header and flag the request as such. If for some reason an XMLHttpRequest cannot be sent with the **`X-Requested-With`** HTTP header, you can force the Leaf application to assume an HTTP request is an XMLHttpRequest by setting a GET, POST, or PUT parameter in the HTTP request named “isajax” with a truthy value. + +Use the request object’s `isAjax()` or `isXhr()` method to tell if the current request is an XHR/Ajax request: + +
+ +```php +$isXHR = $app->request()->isAjax(); +$isXHR = $app->request()->isXhr(); +``` + +
+
+ +```php +$isXHR = request()->isAjax(); +$isXHR = request()->isXhr(); +``` + +
+ +### `isFormData` + +This method allows you to check if the request body contains parsed form data, or if the request is a form data request. + +
+ +```php +$isXHR = $app->request()->isFormData(); +``` + +
+
+ +```php +$isXHR = request()->isFormData(); +``` + +
+ +## Request Path, Host & Client + +This section contains methods which allow you to retrieve information about the request path, host and client. + +### Host + +Fetch the request’s host (e.g. “leafphp.dev”): + +
+ +```php +request()->getHost(); +``` + +
+
+ +```php +$app->request()->getHost(); +``` + +
+ +### Host with Port + +Fetch the request’s host with port (e.g. “leafphp.dev:80”): + +
+ +```php +$app->request()->getHostWithPort(); +``` + +
+
+ +```php +request()->getHostWithPort(); +``` + +
+ +### Port + +Fetch the request’s port (e.g. 80): + +
+ +```php +$app->request()->getPort(); +``` + +
+
+ +```php +request()->getPort(); +``` + +
+ +### Scheme + +Fetch the request’s scheme (e.g. “http” or “https”): + +
+ +```php +$app->request()->getScheme(); +``` + +
+
+ +```php +request()->getScheme(); +``` + +
+ +### Path + +Fetch the request’s path (root URI + resource URI): + +
+ +```php +$app->request()->getPath(); +``` + +
+
+ +```php +request()->getPath(); +``` + +
+ +### URL + +Fetch the request’s URL (scheme + host [ + port if non-standard ]): + +
+ +```php +$app->request()->getUrl(); +``` + +
+
+ +```php +request()->getUrl(); +``` + +
+ +### IP Address + +Fetch the request’s IP address: + +
+ +```php +$app->request()->getIp(); +``` + +
+
+ +```php +request()->getIp(); +``` + +
+ +### Referer + +Fetch the request’s referrer: + +
+ +```php +$app->request()->getReferrer(); +``` + +
+
+ +```php +request()->getReferrer(); +``` + +
+ +### User Agent + +Fetch the request’s user agent string: + +
+ +```php +$app->request()->getUserAgent(); +``` + +
+
+ +```php +request()->getUserAgent(); +``` + +
+ +### Paths + +Every HTTP request received by a Leaf application will have a root URI and a resource URI. + +#### Root URI + +The root URI is the physical URL path of the directory in which the Leaf application is instantiated and run. If a Leaf application is instantiated in **index.php** within the top-most directory of the virtual host’s document root, the root URI will be an empty string. If a Leaf application is instantiated and run in **index.php** within a physical subdirectory of the virtual host’s document root, the root URI will be the path to that subdirectory with a leading slash and without a trailing slash. + +#### Resource URI + +The resource URI is the virtual URI path of an application resource. The resource URI will be matched to the Leaf application’s routes. + +Assume the Leaf application is installed in a physical subdirectory **/foo** beneath your virtual host’s document root. Also assume the full HTTP request URL (what you’d see in the browser location bar) is **/foo/books/1**. The root URI is /foo (the path to the physical directory in which the Leaf application is instantiated) and the resource URI is **/books/1** (the path to the application resource). + +You can get the HTTP request’s root URI and resource URI with the request object’s `getScriptName()` and `getPathInfo()` methods: + +
+ +```php +$app = new \Leaf\App; + +//Get root URI +$rootUri = $app->request()->getScriptName(); + +//Get resource URI +$resourceUri = $app->request()->getPathInfo(); +``` + +
+
+ +```php +//Get root URI +$rootUri = request()->getScriptName(); + +//Get resource URI +$resourceUri = request()->getPathInfo(); +``` + +
+ +## Content Type Methods + +The Leaf application’s request object provides several helper methods for inspecting the content type of the current HTTP request. + +### Content Type + +Fetch the request’s content type (e.g. “application/json;charset=utf-8”): + +
+ +```php +$app->request()->getContentType(); +``` + +
+
+ +```php +request()->getContentType(); +``` + +
+ +### Media Type + +Fetch the request’s media type (e.g. “application/json”): + +
+ +```php +$app->request()->getMediaType(); +``` + +
+
+ +```php +request()->getMediaType(); +``` + +
+ +### Media Type Params + +Fetch the request’s media type parameters (e.g. [charset => “utf-8”]): + +
+ +```php +$app->request()->getMediaTypeParams(); +``` + +
+
+ +```php +request()->getMediaTypeParams(); +``` + +
+ +### Content Charset + +Fetch the request’s content character set (e.g. “utf-8”): + +
+ +```php +$app->request()->getContentCharset(); +``` + +
+
+ +```php +request()->getContentCharset(); +``` + +
+ +### Content Length + +Fetch the request’s content length: + +
+ +```php +$app->request()->getContentLength(); +``` + +
+
+ +```php +request()->getContentLength(); +``` + +
diff --git a/apps/docs/src/modules/http/v/2/response.md b/apps/docs/src/modules/http/v/2/response.md new file mode 100755 index 0000000..a35999e --- /dev/null +++ b/apps/docs/src/modules/http/v/2/response.md @@ -0,0 +1,638 @@ +# Response + + +The response object is an abstraction of your Leaf application’s HTTP response that is returned to the HTTP client. + +## Using the Response object + +Leaf offers a couple of ways to use the response object in your application. + +### Response on the Leaf Instance + +Since Response is already bound to the Leaf instance, you can do this: + +
+ +```php{4} +$app = new Leaf\App; + +$app->get("/text", function () use($app) { + $app->response()->markup("This is text"); +}); +``` + +
+
+ +```php{2} +app()->get('/text', function () { + app()->response()->markup('This is text'); +}); +``` + +
+ +Although we've added this, we don't want to force you to do stuff in only one way, so you can still use the `v1.x` method. + +
+ +### Initialising the Response object + +With this method, you manually initialise the Response object, and then pass it into your route. + +```php{2,6} +$app = new Leaf\App; +$response = new Leaf\Http\Response; + +$app->post('/login', function () use($response) { + // ... + $response->json(['username' => $user]); +}); +``` + +
+
+ +### Functional Mode + +Response also takes advantage of Leaf 3's functional mode with the `response` global which allows you quickly use the response object from wherever you are. + +```php +response()->json([ + 'status' => 'success', + 'data' => 'Hello', +]); +``` + +
+ +An HTTP response has three primary properties: + +- Status +- Header +- Body + +The response object provides helper methods, described next, that help you interact with these HTTP response properties. + +## Method Chaining + +Method chaining allows you to be more expressive with your code and basically fit everything better. There's just a single rule you need to follow here: ***the method you want to output should be the last thing you call.*** + +If you want to output some JSON with a header `something`, you should always set the header before calling the JSON method. + +
+ +```php +// ☑️ CORRECT +$app->response()->withHeader('something', 'value')->json('data'); + +// ❌ HEADER ERROR +$app->response()->json('data')->withHeader('something', 'value'); +``` + +
+
+ +```php +// ☑️ CORRECT +response()->withHeader('something', 'value')->json('data'); + +// ❌ HEADER ERROR +response()->json('data')->withHeader('something', 'value'); +``` + +
+ +## Response Methods + +This section covers all methods provided in the response object which allow you to output some kind of data. + +### `plain` + +This method allows you to output plain text as your response. It takes in 2 parameters: + +- the data to output +- http status code with 200 default (optional) + +
+ +```php +$app->response()->plain('hello'); +``` + +
+
+ +```php +response()->plain('hello'); +``` + +
+ +### `xml` + +This method allows you to output xml as your response. It takes in 2 parameters: + +- the data to output +- http status code with 200 default (optional) + +
+ +```php +$app->response()->xml( + '' +); +``` + +
+
+ +```php +response()->xml( + '' +); +``` + +
+ +### `json` + +This method allows you output json as a response. + +It takes in 3 parameters: + +- The data to output +- The https status code of the data, default 200 (optional) +- Option to show/hide the status code in response body, default `false` (optional) + +
+ +```php +$app->response()->json('Output', 200); +``` + +
+
+ +```php +response()->json('Output', 200); +``` + +
+ +**Output**: + +```json +"Output" +``` + +Showing the code in body: + +
+ +```php +$app->response()->json('Output', 200, true); +``` + +
+
+ +```php +response()->json('Output', 200, true); +``` + +
+ +**Output**: + +```json +{ + "data": "Output", + "status": { + "code": 200, + "message": "OK" + } +} +``` + +### `page` + +This is a method that outputs an HTML/PHP file. This method can also be used to achieve server side routing, for example: + +
+ +```php +$app->get('/homepage', function () use($app) { + $app->response()->page('link/to/home.html'); +}); +``` + +
+
+ +```php +app()->get('/homepage', function () { + response()->page('link/to/home.html'); +}); +``` + +
+ +With this, whenever the route `/homepage` is invoked, Leaf loads up `home.html` and outputs it to the user. + +**Note** The `page` method has **NOTHING** to do with templating, it simply outputs an already defined web page. + +For templating with Leaf, [look here](/modules/views/) + +**Status Code:** + +It takes in a status code as the second parameter. + +
+ +```php +$app->response()->page('404.html', 404); +``` + +
+
+ +```php +response()->page('404.html', 404); +``` + +
+ +### `markup` + +This method outputs some HTML/PHP: + +
+ +```php +$app->get('/homepage', function () use($app) { + $app->response()->markup('

Hello

'); +}); +``` + +
+
+ +```php +app()->get('/homepage', function () { + response()->markup('

Hello

'); +}); +``` + +
+ +You might be wondering why we don't just use + +```php +echo '

hello

'; +``` + +The reason is, Leaf has default headers which set the content type to JSON, in order to correctly output HTML, you need to change this.... Leaf has taken care of this with a bunch of other things, all within `markup` and `page`. + +You can also specify a status code: + +
+ +```php +$app->response()->markup('

Hello

', 201); +``` + +
+
+ +```php +response()->markup('

Hello

', 201); +``` + +
+ +### `download` + +In v3, you can send a response which will be downloaded on the client. Note that in this case, the response should be a valid file. + +
+ +```php +// using defaults +$app->response()->download('path/to/file.zip'); + +// syntax +$app->response()->download('path/to/file.zip', 'File name on client', 200); +``` + +
+
+ +```php +// using defaults +response()->download('path/to/file.zip'); + +// syntax +response()->download('path/to/file.zip', 'File name on client', 200); +``` + +
+ +As shown above, it takes in 3 parameters: + +- the file to send as response +- The name of the file to show to client (optional, defaults to original filename) +- Http status code (optional, defaults to 200) + +
+ +```php +$app->response()->download('item.jpg', 'Profile Pic', 200); + +// to skip setting a name +$app->response()->download('item.jpg', null, 201); + +// PHP 8 +$app->response()->download( + file: 'item.jpg', + code: 201 +); +``` + +
+
+ +```php +response()->download('item.jpg', 'Profile Pic', 200); + +// to skip setting a name +response()->download('item.jpg', null, 201); + +// PHP 8 +response()->download( + file: 'item.jpg', + code: 201 +); +``` + +
+ +### `noContent` + +The HTTP 204 No Content success status response code indicates that a request has succeeded, but that the client doesn't need to navigate away from its current page. This method allows you to quickly create a 204 response. + +
+ +```php +$app->response()->noContent(); +``` + +
+
+ +```php +response()->noContent(); +``` + +
+ +### `redirect` + +This feature just simply allows you to send a redirect response which redirects to a different route. + +
+ +```php +$userHasAuth = true; + +if ($userHasAuth) { + return $app->response()->redirect('/home'); +} +``` + +
+
+ +```php +$userHasAuth = true; + +if ($userHasAuth) { + return response()->redirect('/home'); +} +``` + +
+ +You can also specify a status code: + +
+ +```php +$app->response()->redirect('/home', 307); +``` + +
+
+ +```php +response()->redirect('/home', 307); +``` + +
+ +### `exit` + +This is a new method which allows you to output some data and close your app right after. This means that it acts as a sort of early-return for your app, so right after outputting some data, it quits and makes sure that no other code is executed from your app until the next request comes through. + +It takes in 2 parameters: the data to output and the http status code (default: 500). + +
+ +```php +$app->response()->exit('This will be output as markup'); + +// code below won't run +``` + +
+
+ +```php +response()->exit('This will be output as markup'); + +// code below won't run +``` + +
+ +You can also output JSON. + +
+ +```php +$app->response()->exit(['data' => 'This will be output as JSON'], 500); +``` + +
+
+ +```php +response()->exit(['data' => 'This will be output as JSON'], 500); +``` + +
+ +## Headers + +Headers are a way for your server to send additional information along with your request. This information can be anything from the type of content you're sending back, to the status code of your response, to the type of server you're using. + +Leaf allows you to set headers for your response directly from the response object using the `withHeader()` method. It takes in 4 parameters: + +- The header name or an array of headers (key-value pairs) +- The header value if header key is a string +- A boolean on whether to replace the header if it's already set +- An Http status code to associate to header. + +
+ +```php +$app + ->response() + ->withHeader('something', 'something') + ->withHeader('somethingAgain', 'something', true, 200) + ->withHeader(['somethingElse' => 'another']); +``` + +
+
+ +```php +response() + ->withHeader('something', 'something') + ->withHeader('somethingAgain', 'something', true, 200) + ->withHeader(['somethingElse' => 'another']); +``` + +
+ +## Cookies + +Cookies are small pieces of data that are stored on the client's computer by the web browser while browsing a website. Cookies were designed to be a reliable mechanism for websites to remember stateful information or to record the user's browsing activity. + +Leaf allows you to set cookies for your response using the `withCookie()` method. It takes in 3 parameters: + +- The name of the cookie +- The value of cookie +- When the cookie expires. Default: 7 days + +
+ +```php +$app->response()->withCookie("name", "Michael", "1 day")->json('...'); +``` + +
+
+ +```php +response() + ->withCookie("name", "Michael", "1 day") + ->json('...'); +``` + +
+ +### `withoutCookie()` + +This method allows you to remove existing cookies from your response. So you're basically returning a response without selected cookies. + +
+ +```php +$app->response()->withoutCookie("name")->json('...'); + +// cookie array +$app->response()->withoutCookie(["name", "something"])->json('...'); +``` + +
+
+ +```php +response()->withoutCookie("name")->json('...'); + +// cookie array +response()->withoutCookie(["name", "something"])->json('...'); +``` + +
+ +## Flash messaging + +Flash messages are a way to keep a message around for a single request. They're helpful for displaying status messages like "Item deleted successfully" or "Your changes have been saved." + +Leaf allows you to set flash messages for your response using the `withFlash()` method. It takes in 2 parameters: + +- The name of the flash message +- The value of the flash message + +
+ +```php +$app->response()->withFlash('message', 'something')->redirect('/somewhere'); +``` + +
+
+ +```php +response()->withFlash('message', 'something')->redirect('/somewhere'); +``` + +
+ +## Status + +::: tip Info +You can directly set status codes on responses, however, you can use this method to declaratively set a status code for you Leaf responses or if you want to use PHP's output methods like echo +::: + +The HTTP response returned to the client will have a status code indicating the response’s type (e.g. 200 OK, 400 Bad Request, or 500 Server Error). You can use the Leaf application’s response object to set the HTTP response’s status like this: + +
+ +```php +$app->response()->status(400)->json(['message' => 'home']); +``` + +
+
+ +```php +response()->status(400)->json(['message' => 'home']); +``` + +
+ +Or with a native PHP response: + +
+ +```php +$app->response()->status(400); + +echo 'This is the main output'; +``` + +
+
+ +```php +response()->status(400); + +echo 'This is the main output'; +``` + +
+ +You only need to set the response object’s status if you intend to return an HTTP response that does not have a 200 OK status. diff --git a/apps/docs/src/modules/http/v/2/status.md b/apps/docs/src/modules/http/v/2/status.md new file mode 100755 index 0000000..9fdad3b --- /dev/null +++ b/apps/docs/src/modules/http/v/2/status.md @@ -0,0 +1,156 @@ +# Http Status Helper + + + +This is an http status code helper created in attempt to refactor the response object a bit and speed up the whole Http module flow. It provides various constants and messages for various status codes. + +## List of constants + +**Usage:** + +```php +use Leaf\Http\Status; + +echo Status::HTTP_CONTINUE; // 100 +``` + +```php +public const HTTP_CONTINUE = 100; +public const HTTP_SWITCHING_PROTOCOLS = 101; +public const HTTP_PROCESSING = 102; // RFC2518 +public const HTTP_EARLY_HINTS = 103; // RFC8297 +public const HTTP_OK = 200; +public const HTTP_CREATED = 201; +public const HTTP_ACCEPTED = 202; +public const HTTP_NON_AUTHORITATIVE_INFORMATION = 203; +public const HTTP_NO_CONTENT = 204; +public const HTTP_RESET_CONTENT = 205; +public const HTTP_PARTIAL_CONTENT = 206; +public const HTTP_MULTI_STATUS = 207; // RFC4918 +public const HTTP_ALREADY_REPORTED = 208; // RFC5842 +public const HTTP_IM_USED = 226; // RFC3229 +public const HTTP_MULTIPLE_CHOICES = 300; +public const HTTP_MOVED_PERMANENTLY = 301; +public const HTTP_FOUND = 302; +public const HTTP_SEE_OTHER = 303; +public const HTTP_NOT_MODIFIED = 304; +public const HTTP_USE_PROXY = 305; +public const HTTP_RESERVED = 306; +public const HTTP_TEMPORARY_REDIRECT = 307; +public const HTTP_PERMANENTLY_REDIRECT = 308; // RFC7238 +public const HTTP_BAD_REQUEST = 400; +public const HTTP_UNAUTHORIZED = 401; +public const HTTP_PAYMENT_REQUIRED = 402; +public const HTTP_FORBIDDEN = 403; +public const HTTP_NOT_FOUND = 404; +public const HTTP_METHOD_NOT_ALLOWED = 405; +public const HTTP_NOT_ACCEPTABLE = 406; +public const HTTP_PROXY_AUTHENTICATION_REQUIRED = 407; +public const HTTP_REQUEST_TIMEOUT = 408; +public const HTTP_CONFLICT = 409; +public const HTTP_GONE = 410; +public const HTTP_LENGTH_REQUIRED = 411; +public const HTTP_PRECONDITION_FAILED = 412; +public const HTTP_REQUEST_ENTITY_TOO_LARGE = 413; +public const HTTP_REQUEST_URI_TOO_LONG = 414; +public const HTTP_UNSUPPORTED_MEDIA_TYPE = 415; +public const HTTP_REQUESTED_RANGE_NOT_SATISFIABLE = 416; +public const HTTP_EXPECTATION_FAILED = 417; +public const HTTP_I_AM_A_TEAPOT = 418; // RFC2324 +public const HTTP_MISDIRECTED_REQUEST = 421; // RFC7540 +public const HTTP_UNPROCESSABLE_ENTITY = 422; // RFC4918 +public const HTTP_LOCKED = 423; // RFC4918 +public const HTTP_FAILED_DEPENDENCY = 424; // RFC4918 +public const HTTP_TOO_EARLY = 425; // RFC-ietf-httpbis-replay-04 +public const HTTP_UPGRADE_REQUIRED = 426; // RFC2817 +public const HTTP_PRECONDITION_REQUIRED = 428; // RFC6585 +public const HTTP_TOO_MANY_REQUESTS = 429; // RFC6585 +public const HTTP_REQUEST_HEADER_FIELDS_TOO_LARGE = 431; // RFC6585 +public const HTTP_UNAVAILABLE_FOR_LEGAL_REASONS = 451; +public const HTTP_INTERNAL_SERVER_ERROR = 500; +public const HTTP_NOT_IMPLEMENTED = 501; +public const HTTP_BAD_GATEWAY = 502; +public const HTTP_SERVICE_UNAVAILABLE = 503; +public const HTTP_GATEWAY_TIMEOUT = 504; +public const HTTP_VERSION_NOT_SUPPORTED = 505; +public const HTTP_VARIANT_ALSO_NEGOTIATES_EXPERIMENTAL = 506; // RFC2295 +public const HTTP_INSUFFICIENT_STORAGE = 507; // RFC4918 +public const HTTP_LOOP_DETECTED = 508; // RFC5842 +public const HTTP_NOT_EXTENDED = 510; // RFC2774 +public const HTTP_NETWORK_AUTHENTICATION_REQUIRED = 511; // RFC6585 +``` + +## List of Status Texts + +**Usage:** + +```php +use Leaf\Http\Status; + +echo Status::$statusTexts[200]; // OK +``` + +```php +100 => 'Continue', +101 => 'Switching Protocols', +102 => 'Processing', // RFC2518 +103 => 'Early Hints', +200 => 'OK', +201 => 'Created', +202 => 'Accepted', +203 => 'Non-Authoritative Information', +204 => 'No Content', +205 => 'Reset Content', +206 => 'Partial Content', +207 => 'Multi-Status', // RFC4918 +208 => 'Already Reported', // RFC5842 +226 => 'IM Used', // RFC3229 +300 => 'Multiple Choices', +301 => 'Moved Permanently', +302 => 'Found', +303 => 'See Other', +304 => 'Not Modified', +305 => 'Use Proxy', +307 => 'Temporary Redirect', +308 => 'Permanent Redirect', // RFC7238 +400 => 'Bad Request', +401 => 'Unauthorized', +402 => 'Payment Required', +403 => 'Forbidden', +404 => 'Not Found', +405 => 'Method Not Allowed', +406 => 'Not Acceptable', +407 => 'Proxy Authentication Required', +408 => 'Request Timeout', +409 => 'Conflict', +410 => 'Gone', +411 => 'Length Required', +412 => 'Precondition Failed', +413 => 'Content Too Large', // RFC-ietf-httpbis-semantics +414 => 'URI Too Long', +415 => 'Unsupported Media Type', +416 => 'Range Not Satisfiable', +417 => 'Expectation Failed', +418 => 'I\'m a teapot', // RFC2324 +421 => 'Misdirected Request', // RFC7540 +422 => 'Unprocessable Content', // RFC-ietf-httpbis-semantics +423 => 'Locked', // RFC4918 +424 => 'Failed Dependency', // RFC4918 +425 => 'Too Early', // RFC-ietf-httpbis-replay-04 +426 => 'Upgrade Required', // RFC2817 +428 => 'Precondition Required', // RFC6585 +429 => 'Too Many Requests', // RFC6585 +431 => 'Request Header Fields Too Large', // RFC6585 +451 => 'Unavailable For Legal Reasons', // RFC7725 +500 => 'Internal Server Error', +501 => 'Not Implemented', +502 => 'Bad Gateway', +503 => 'Service Unavailable', +504 => 'Gateway Timeout', +505 => 'HTTP Version Not Supported', +506 => 'Variant Also Negotiates', // RFC2295 +507 => 'Insufficient Storage', // RFC4918 +508 => 'Loop Detected', // RFC5842 +510 => 'Not Extended', // RFC2774 +511 => 'Network Authentication Required', // RFC6585 +``` diff --git a/apps/docs/src/modules/index.md b/apps/docs/src/modules/index.md new file mode 100644 index 0000000..167376e --- /dev/null +++ b/apps/docs/src/modules/index.md @@ -0,0 +1,80 @@ +# Introduction + + + + + +Modules are the pieces of Leaf's functionality that are individually available as packages. They can be used in a wide variety of projects, and are one of the primary ways that Leaf is extended with additional functionality. + +Most modules are framework/library agnostic, which means that they'll work just about everywhere with zero config just as with Leaf itself. You can easily install them with composer or the leaf cli. + +## Why modules? + +We have a ton of reasons for switching to modules that we covered in [this blog post](https://blog.leafphp.dev/posts/leaf3.html). However, here are a few of the main reasons: + +- Modules are easier to update and maintain +- Modules allow you to use only the parts of Leaf you need +- Modules allow you to incrementally upgrade your Leaf apps +- Modules allow you to use Leaf with other frameworks + +## Installing modules + + + +You can quickly install any module with the Leaf CLI: + +```bash +leaf install +``` + +Or with composer: + +```bash +composer require leafs/ +``` + +## List of available modules + +*We update this list whenever we add new modules, you can keep checking for updates.* + +| Project | Status | Description | +| ---------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------------------------------------------------------------- | +| [alchemy](/docs/tooling/testing) | [![Latest Stable Version](https://poser.pugx.org/leafs/alchemy/v/stable)](https://packagist.org/packages/leafs/alchemy) [![Total Downloads](https://poser.pugx.org/leafs/alchemy/downloads)](https://packagist.org/packages/leafs/alchemy) | Simpler tests for your PHP apps | +| [aloe](/aloe-cli/) | [![Latest Stable Version](https://poser.pugx.org/leafs/aloe/v/stable)](https://packagist.org/packages/leafs/aloe) [![Total Downloads](https://poser.pugx.org/leafs/aloe/downloads)](https://packagist.org/packages/leafs/aloe) | Smart console helper for leaf mvc, leaf api and skeleton | +| [anchor](/modules/anchor/) | [![Latest Stable Version](https://poser.pugx.org/leafs/anchor/v/stable)](https://packagist.org/packages/leafs/anchor) [![Total Downloads](https://poser.pugx.org/leafs/anchor/downloads)](https://packagist.org/packages/leafs/anchor) | Basic security tools | +| [auth](/modules/auth/) | [![Latest Stable Version](https://poser.pugx.org/leafs/auth/v/stable)](https://packagist.org/packages/leafs/auth) [![Total Downloads](https://poser.pugx.org/leafs/auth/downloads)](https://packagist.org/packages/leafs/auth) | Simple but powerful authentication system for your apps | +| [bareui](/modules/views/bareui/) | [![Latest Stable Version](https://poser.pugx.org/leafs/bareui/v/stable)](https://packagist.org/packages/leafs/bareui) [![Total Downloads](https://poser.pugx.org/leafs/bareui/downloads)](https://packagist.org/packages/leafs/bareui) | Dead simple templating engine with no compilation (blazing speed) | +| [blade](/modules/views/blade/) | [![Latest Stable Version](https://poser.pugx.org/leafs/blade/v/stable)](https://packagist.org/packages/leafs/blade) [![Total Downloads](https://poser.pugx.org/leafs/blade/downloads)](https://packagist.org/packages/leafs/blade) | Laravel blade templating port for leaf | +| [cookie](/modules/cookies/) | [![Latest Stable Version](https://poser.pugx.org/leafs/cookie/v/stable)](https://packagist.org/packages/leafs/cookie) [![Total Downloads](https://poser.pugx.org/leafs/cookie/downloads)](https://packagist.org/packages/leafs/cookie) | Cookie management without the tears | +| [cors](/modules/cors/) | [![Latest Stable Version](https://poser.pugx.org/leafs/cors/v/stable)](https://packagist.org/packages/leafs/cors) [![Total Downloads](https://poser.pugx.org/leafs/cors/downloads)](https://packagist.org/packages/leafs/cors) | CORS operations made simple | +| [csrf](/modules/anchor/csrf/) | [![Latest Stable Version](https://poser.pugx.org/leafs/csrf/v/stable)](https://packagist.org/packages/leafs/csrf) [![Total Downloads](https://poser.pugx.org/leafs/csrf/downloads)](https://packagist.org/packages/leafs/csrf) | Basic CSRF protection | +| [date](/modules/date/) | [![Latest Stable Version](https://poser.pugx.org/leafs/date/v/stable)](https://packagist.org/packages/leafs/date) [![Total Downloads](https://poser.pugx.org/leafs/date/downloads)](https://packagist.org/packages/leafs/date) | PHP dates for humans | +| [db](/modules/db/) | [![Latest Stable Version](https://poser.pugx.org/leafs/db/v/stable)](https://packagist.org/packages/leafs/db) [![Total Downloads](https://poser.pugx.org/leafs/db/downloads)](https://packagist.org/packages/leafs/db) | Leaf Db from v2 (actively maintained) | +| [db-old](/modules/db-old/) | [![Latest Stable Version](https://poser.pugx.org/leafs/db-old/v/stable)](https://packagist.org/packages/leafs/db-old) [![Total Downloads](https://poser.pugx.org/leafs/db-old/downloads)](https://packagist.org/packages/leafs/db-old) | Leaf Db from v1 (still maintained) | +| [devtools](/modules/devtools/) | [![Latest Stable Version](https://poser.pugx.org/leafs/devtools/v/stable)](https://packagist.org/packages/leafs/devtools) [![Total Downloads](https://poser.pugx.org/leafs/devtools/downloads)](https://packagist.org/packages/leafs/devtools) | Developer tools for Leaf PHP | +| [eien](/modules/eien/) | [![Latest Stable Version](https://poser.pugx.org/leafs/eien/v/stable)](https://packagist.org/packages/leafs/eien) [![Total Downloads](https://poser.pugx.org/leafs/eien/downloads)](https://packagist.org/packages/leafs/eien) | High-speed, high-performance server for leaf | +| [exception](https://github.com/leafsphp/exceptions) | [![Latest Stable Version](https://poser.pugx.org/leafs/exception/v/stable)](https://packagist.org/packages/leafs/exception) [![Total Downloads](https://poser.pugx.org/leafs/exception/downloads)](https://packagist.org/packages/leafs/exception) | Leaf's exception wrapper (fork of whoops) | +| [fetch](/modules/fetch/) | [![Latest Stable Version](https://poser.pugx.org/leafs/fetch/v/stable)](https://packagist.org/packages/leafs/fetch) [![Total Downloads](https://poser.pugx.org/leafs/fetch/downloads)](https://packagist.org/packages/leafs/fetch) | HTTP requests made simple | +| [form](/modules/forms/) | [![Latest Stable Version](https://poser.pugx.org/leafs/form/v/stable)](https://packagist.org/packages/leafs/form) [![Total Downloads](https://poser.pugx.org/leafs/form/downloads)](https://packagist.org/packages/leafs/form) | Form processes and validation | +| [fs](/modules/fs/) | [![Latest Stable Version](https://poser.pugx.org/leafs/fs/v/stable)](https://packagist.org/packages/leafs/fs) [![Total Downloads](https://poser.pugx.org/leafs/fs/downloads)](https://packagist.org/packages/leafs/fs) | Awesome filesystem operations + file uploads | +| [http](/modules/http/) | [![Latest Stable Version](https://poser.pugx.org/leafs/http/v/stable)](https://packagist.org/packages/leafs/http) [![Total Downloads](https://poser.pugx.org/leafs/http/downloads)](https://packagist.org/packages/leafs/http) | Http operations made simple (request, response, ...) | +| [inertia](/modules/views/inertia/) | [![Latest Stable Version](https://poser.pugx.org/leafs/inertia/v/stable)](https://packagist.org/packages/leafs/inertia) [![Total Downloads](https://poser.pugx.org/leafs/inertia/downloads)](https://packagist.org/packages/leafs/inertia) | Leaf adapter for inertia JS | +| [logger](/modules/logger/) | [![Latest Stable Version](https://poser.pugx.org/leafs/logger/v/stable)](https://packagist.org/packages/leafs/logger) [![Total Downloads](https://poser.pugx.org/leafs/logger/downloads)](https://packagist.org/packages/leafs/logger) | leaf logger module | +| [mail](/modules/mail/) | [![Latest Stable Version](https://poser.pugx.org/leafs/mail/v/stable)](https://packagist.org/packages/leafs/mail) [![Total Downloads](https://poser.pugx.org/leafs/mail/downloads)](https://packagist.org/packages/leafs/mail) | Mailing made easy with leaf | +| [mvc-core](/modules/mvc-core/) | [![Latest Stable Version](https://poser.pugx.org/leafs/mvc-core/v/stable)](https://packagist.org/packages/leafs/mvc-core) [![Total Downloads](https://poser.pugx.org/leafs/mvc-core/downloads)](https://packagist.org/packages/leafs/mvc-core) | Core MVC tools powering our MVC wrappers | +| [password](/modules/password/) | [![Latest Stable Version](https://poser.pugx.org/leafs/password/v/stable)](https://packagist.org/packages/leafs/password) [![Total Downloads](https://poser.pugx.org/leafs/password/downloads)](https://packagist.org/packages/leafs/password) | Password encryption/validation/hashing in one box | +| [redis](/modules/redis/) | [![Latest Stable Version](https://poser.pugx.org/leafs/redis/v/stable)](https://packagist.org/packages/leafs/redis) [![Total Downloads](https://poser.pugx.org/leafs/redis/downloads)](https://packagist.org/packages/leafs/redis) | Redis module | +| [router](/docs/routing/) | [![Latest Stable Version](https://poser.pugx.org/leafs/router/v/stable)](https://packagist.org/packages/leafs/router) [![Total Downloads](https://poser.pugx.org/leafs/router/downloads)](https://packagist.org/packages/leafs/router) | Default router for leaf php | +| [session](/modules/session/) | [![Latest Stable Version](https://poser.pugx.org/leafs/session/v/stable)](https://packagist.org/packages/leafs/session) [![Total Downloads](https://poser.pugx.org/leafs/session/downloads)](https://packagist.org/packages/leafs/session) | PHP sessions made simple | +| [tilly (WIP)](https://archive.leafphp.dev/#/tilly/) | [![Latest Stable Version](https://poser.pugx.org/leafs/tilly/v/stable)](https://packagist.org/packages/leafs/tilly) [![Total Downloads](https://poser.pugx.org/leafs/tilly/downloads)](https://packagist.org/packages/leafs/tilly) | Simple utility 'toolkit' for PHP applications | +| [veins](/modules/views/veins/) | [![Latest Stable Version](https://poser.pugx.org/leafs/veins/v/stable)](https://packagist.org/packages/leafs/veins) [![Total Downloads](https://poser.pugx.org/leafs/veins/downloads)](https://packagist.org/packages/leafs/veins) | Leaf veins templating engine | +| [viewi](/modules/views/viewi/) | [![Latest Stable Version](https://poser.pugx.org/leafs/viewi/v/stable)](https://packagist.org/packages/leafs/viewi) [![Total Downloads](https://poser.pugx.org/leafs/viewi/downloads)](https://packagist.org/packages/leafs/viewi) | Leaf integration with Viewi PHP | +| [vite](/modules/views/vite/) | [![Latest Stable Version](https://poser.pugx.org/leafs/vite/v/stable)](https://packagist.org/packages/leafs/vite) [![Total Downloads](https://poser.pugx.org/leafs/vite/downloads)](https://packagist.org/packages/leafs/vite) | Leaf server component for Vite | + + diff --git a/apps/docs/src/modules/logger/index.md b/apps/docs/src/modules/logger/index.md new file mode 100644 index 0000000..6d21e7a --- /dev/null +++ b/apps/docs/src/modules/logger/index.md @@ -0,0 +1,63 @@ +# Logger + + +Leaf now provides very well defined logging support for your apps. A sample log looks like this: + +```log +[2021-03-31 22:44:53] +ERROR - ErrorException: Trying to access array offset on value of type int in /home/mychi/Projects/leafphp/leaf/src/Experimental/Cache.php:83 +Stack trace: +#0 /home/mychi/Projects/leafphp/leaf/src/Experimental/Cache.php(83): Leaf\Exception\General::handleErrors() +#1 /home/mychi/Projects/leafphp/leaf/test/index.php(45): Leaf\Experimental\Cache::get() +#2 [internal function]: {closure}() +#3 /home/mychi/Projects/leafphp/leaf/src/Router.php(337): call_user_func_array() +#4 /home/mychi/Projects/leafphp/leaf/src/Router.php(392): Leaf\Router::invoke() +#5 /home/mychi/Projects/leafphp/leaf/src/Router.php(443): Leaf\Router::handle() +#6 /home/mychi/Projects/leafphp/leaf/src/App.php(863): Leaf\Router::run() +#7 /home/mychi/Projects/leafphp/leaf/test/index.php(52): Leaf\App->run() +#8 {main} +``` + +A Leaf provides a log object that writes data to a specific output. The actual writing of data is delegated to a log writer. + +**You need to configure the log directory so that Leaf knows where to place your files.** + +```php + __DIR__ . "/logs/", +]); +``` + +or + +```php +logger(); +``` + +The log object provides the following PSR-3 interface + +```php +$app->logger()->debug(mixed $object); +$app->logger()->info(mixed $object); +$app->logger()->notice(mixed $object); +$app->logger()->warning(mixed $object); +$app->logger()->error(mixed $object); +$app->logger()->critical(mixed $object); +$app->logger()->alert(mixed $object); +$app->logger()->emergency(mixed $object); +``` + +Each log object method accepts one mixed argument. The argument is usually a string, but the argument can be anything. The log object will pass the argument to its log writer. It is the log writer’s responsibility to write arbitrary input to the appropriate destination. diff --git a/apps/docs/src/modules/mail/index.md b/apps/docs/src/modules/mail/index.md new file mode 100755 index 0000000..b27092f --- /dev/null +++ b/apps/docs/src/modules/mail/index.md @@ -0,0 +1,274 @@ +# Leaf Mail + + + +Mailing in PHP apps has always been seen as a daunting task. Leaf Mail provides a simple, straightforward and efficient email API that is built on the widely used [PHPMailer Library](https://github.com/PHPMailer/PHPMailer) component. + +With Leaf Mail, you can easily send emails using various drivers and services such as SMTP, Mailgun, SendGrid, Amazon SES, and sendmail. This flexibility enables you to swiftly begin sending emails through a preferred local or cloud-based service. + +## Installation + +You can install leaf mail using the leaf cli: + +```bash +leaf install mail +``` + +or with composer: + +```bash +composer require leafs/mail +``` + +## Setting Up + +Leaf Mail provides a `Mailer` class that is responsible for validating and sending emails. This class handles the connection to your mail server, the configuration for how to send your emails and the actual sending of emails. + +
+ +It also provides a `Mail` class that is responsible for creating and formatting emails. Most of the time, you'll be using the `Mail` class to create and send emails. + +
+
+ +It also provides a `mailer()` method that is responsible for creating and formatting emails. Most of the time, you'll be using the `mailer()` method to create and send emails. + +
+ +***Note that you need to setup the connection to your mail server using the `Leaf\Mail\Mailer` class before sending your emails.*** + +## Mail Server Connection + +The `Leaf\Mail\Mailer` class is responsible for connecting to your mail server and handling the sending emails. It provides a `connect()` method that you can use to connect to your mail server. + +The `connect()` method takes in an array of configuration options that you can use to configure your mail server connection. The configuration options are: + +| Param | Use case | +| -------- | -------------------------------------------- | +| host | Hostname for your mail server | +| port | Port for your mail server | +| security | Any encryption supported by PHPMailer | +| auth | Auth for your mail server | + +### Gmail connection example + +Gmail is one of the most popular mail servers. Unfortunately, a connection with your email and password is no longer supported, so you will need to use OAuth. You will need to add an OAuth provider like [league/oauth2-google](https://github.com/thephpleague/oauth2-google) to your project. + +```bash +leaf install league/oauth2-google + +# or with composer + +composer require league/oauth2-google +``` + +From there you can create your connection like this: + +```php +use Leaf\Mail\Mailer; +use League\OAuth2\Client\Provider\Google; +use PHPMailer\PHPMailer\OAuth; +use PHPMailer\PHPMailer\PHPMailer; + +... + +Mailer::connect([ + 'host' => 'smtp.gmail.com', + 'port' => 465, + 'security' => PHPMailer::ENCRYPTION_SMTPS, + 'auth' => new OAuth( + [ + 'userName' => 'mail@gmail.com', + 'clientSecret' => 'CLIENT_SECRET', + 'clientId' => 'CLIENT_ID', + 'refreshToken' => 'GMAIL_REFRESH_TOKEN', + 'provider' => new Google( + [ + 'clientId' => 'CLIENT_ID', + 'clientSecret' => 'CLIENT_SECRET', + ] + ), + ] + ) +]); +``` + +### SMTP connection example + +The example above uses OAuth, however, some mail servers also support using a username/password for connections. Here's an example of connecting to Mailtrap using SMTP: + +```php +use Leaf\Mail\Mailer; +use PHPMailer\PHPMailer\PHPMailer; + +... + +Mailer::connect([ + 'host' => 'smtp.mailtrap.io', + 'port' => 2525, + 'security' => PHPMailer::ENCRYPTION_STARTTLS, + 'auth' => [ + 'username' => 'MAILTRAP_USERNAME', + 'password' => 'MAILTRAP_PASSWORD' + ] +]); +``` + +## Mailer config + +The `Mailer` class provides a `config()` method that you can use to configure your mail server connection. The configuration options are: + +| Param | Use case | +| -------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------- | +| debug | Enable or disable debug mode. Supported values are 'SERVER', `false` or any value supported by PHPMailer's `SMTPDebug` config | +| defaults | This config is used to set default values for the `recipientEmail`, `recipientName`, `senderEmail`, `senderName`, `replyToName`, and `replyToEmail` of your emails. | +| keepAlive | This config is used to keep the connection to your mail server alive. This is useful if you are sending multiple emails. It takes in a boolean. | + +```php +Mailer::config([ + 'keepAlive' => true, + 'debug' => 'SERVER', + 'defaults' => [ + 'recipientEmail' => 'name@mail.com', + 'recipientName' => 'First Last', + 'senderName' => 'Leaf Mail', + 'senderEmail' => 'mychi@leafphp.dev', + ], +]); +``` + +*Setting your defaults allows you to send your mails without having to configure sender/receiver mails for every mail.* + +## Your first mail + +Now that we've gotten all the annoying config out of the way, all that's left is the easy part: sending your mails. + +
+ +To send your first mail, you'll need to create a new instance of the `Leaf\Mail` class. It takes in an array used to create your email: + +```php +$mail = new \Leaf\Mail([ + 'subject' => 'Leaf Mail Test', + 'body' => 'This is a test mail from Leaf Mail using gmail', + + // next couple of lines can be skipped if you + // set defaults in the Mailer config + 'recipientEmail' => 'name@mail.com', + 'recipientName' => 'First Last', + 'senderName' => 'Leaf Mail', + 'senderEmail' => 'mychi@leafphp.dev', +]); + +// Send your mail +$mail->send(); +``` + +You can also use the `create()` method to create your mail: + +```php +$mail = \Leaf\Mail::create([ + 'subject' => 'Leaf Mail Test', + 'body' => 'This is a test mail from Leaf Mail using gmail', + + // next couple of lines can be skipped if you + // set defaults in the Mailer config + 'recipientEmail' => 'name@mail.com', + 'recipientName' => 'First Last', + 'senderName' => 'Leaf Mail', + 'senderEmail' => 'mychi@leafphp.dev', +]); + +// Send your mail +$mail->send(); +``` + +
+
+ +To send your first mail, you'll need to call the `create()` method returned from `mailer()`. It takes in an array used to create your email: + +```php +mailer() + ->create([ + 'subject' => 'Leaf Mail Test', + 'body' => 'This is a test mail from Leaf Mail using gmail', + + // next couple of lines can be skipped if you + // set defaults in the Mailer config + 'recipientEmail' => 'name@mail.com', + 'recipientName' => 'First Last', + 'senderName' => 'Leaf Mail', + 'senderEmail' => 'mychi@leafphp.dev', + ]) + ->send(); +``` + +
+ +This is a full list of the parameters you can use to create your mail: + +| Param | Use case | +| :-------------- | :--------------------------------------------------------------------------------------------- | +| subject | The subject of your email | +| body | The body of your email | +| recipientEmail | The email of the person you're sending the mail to | +| recipientName | The name of the person you're sending the mail to | +| senderName | The name of the person sending the mail | +| senderEmail | The email of the person sending the mail | +| replyToName | Add a name for your "Reply-To" address | +| replyToEmail | Add a "Reply-To" address | +| cc | The email of the person you want to carbon copy | +| bcc | The email of the person you want to blank carbon copy | +| isHTML | A boolean value that determines if your mail is HTML or not | +| altBody | This body can be read by mail clients that do not have HTML email capability such as mutt & Eudora. Clients that can read HTML will view the normal Body | + +## Adding Attachments + +You can add attachments to your mail using the `attach()` method. It takes in an array of attachment data or just a string containing a single attachment. The attachment data is an array containing the following keys: + +
+ +```php +$mail = new \Leaf\Mail([ + 'subject' => 'Leaf Mail Test', + 'body' => 'This is a test mail from Leaf Mail using gmail', +]); + +$mail->attach('./attachment.txt'); +$mail->attach([ + './file1.txt', + './file2.txt' +]); + +$mail->send(); +``` + +
+
+ +```php +mailer() + ->create([ + 'subject' => 'Leaf Mail Test', + 'body' => 'This is a test mail from Leaf Mail using gmail', + ]) + ->attach('./attachment.txt') + ->attach([ + './file1.txt', + './file2.txt' + ]) + ->send(); +``` + +
+ +## Error handling + +In order not to flood your application with logs and errors, Leaf Mail gathers all errors thrown by the mail server, and saves them internally. You can return all errors with `$mail->errors()` + +```php +if (!$mail->send(...)) { + return $mail->errors(); +} +``` diff --git a/apps/docs/src/modules/mvc-core/api-controller.md b/apps/docs/src/modules/mvc-core/api-controller.md new file mode 100755 index 0000000..37e2323 --- /dev/null +++ b/apps/docs/src/modules/mvc-core/api-controller.md @@ -0,0 +1,100 @@ + +# Core API Controller + +Instead of defining all of your request handling logic as Closures in route files, you may wish to organize this behavior using Controller classes. Controllers can group related request handling logic into a single class. This particular base controller is made specially for APIs, it's been stripped of anything that would not be used in an API. + +## Defining API Controllers + +Below is an example of a basic API controller class. Note that the controller extends the base controller class included with Leaf(`Leaf\APIController`). The base class provides a few convenience methods + + +```php +respond($user); + } +} +``` + +You can define a route to this controller action like so: + +```php +$app->get('user/{id}', 'UserController@show'); +``` + +Now, when a request matches the specified route URI, the `show` method on the `UserController` class will be executed. The route parameters will also be passed to the method. + +> Controllers are **not** required to extend a base class. However, you will not have access to convenient features provided by Leaf Model + + +## Base Controller Features + +### Responses + +Leaf Core controller contains methods to appropriately return data to the user. + +**respond:** + +```php +use Leaf\Controller; + +class NameController extends Controller { + public function index() { + $this->respond([ + 'message' => 'hello' + ]); + } +} +``` + +You can view more on responses [here](/modules/http/v/2/response) + +### file_upload + +file_upload is for simple file uploads. It takes in 3 parameters, the path to save the file, the file and the file type(optional). It returns an array `[true, $filename]` if successful and `[false, $error]` if the upload fails. + +```php +use Leaf\Controller; + +class NameController extends Controller { + public function index() { + $profilePic = $_FILES['profile_pic']; + // file upload + $this->file_upload('./images/', $profilePic); + // file upload with file type + $this->file_upload('./images/', $profilePic, 'image'); + } +} +``` + +### Forms + +The base controller also gives you a simple way to handle form data + +```php +public function index() { + $name = $this->form->get('name'); + + $this->validate([ + 'name' => 'text' + ]); +} +``` + +Read more on Leaf Forms [here](/modules/forms/) diff --git a/apps/docs/src/modules/mvc-core/controller.md b/apps/docs/src/modules/mvc-core/controller.md new file mode 100755 index 0000000..534cd05 --- /dev/null +++ b/apps/docs/src/modules/mvc-core/controller.md @@ -0,0 +1,129 @@ + +# Core Controller + +Instead of defining all of your request handling logic as Closures in route files, you may wish to organize this behavior using Controller classes. Controllers can group related request handling logic into a single class. + +## Defining Controllers + +Below is an example of a basic controller class. Note that the controller extends the base controller class included with Leaf(`Leaf\Controller`). The base class provides a few convenience methods + + +```php +set('user', User::findOrFail($id)); + $this->render('profile'); + } +} +``` + +You can define a route to this controller action like so: + +```php +$app->get('user/{id}', 'UserController@show'); +``` + +Now, when a request matches the specified route URI, the `show` method on the `UserController` class will be executed. The route parameters will also be passed to the method. + +> Controllers are **not** required to extend a base class. However, you will not have access to convenient features provided by Leaf Model + + +## Base Controller Features + +### Default Templating + +Using the core controller, you already have access to templating with [Leaf Veins](/modules/views/veins/). You can simply configure and render your template whenever you want to. + +```php +use Leaf\Controller; + +class NameController extends Controller { + // configure as soon as controller is invoked + public function __construct() { + $this->veins->configure([ + 'veins_dir' => 'app/views/', + 'cache_dir' => 'app/views/build/' + ]); + } + + public function index() { + // set template data + $this->set([ + 'name' => 'Mychi' + ]); + // render your template + $this->render('index'); // refers to index.vein in the veins_dir + } +} +``` + +You can view more info on Veins [here](/modules/views/veins/) + +### Responses + +Leaf Core controller contains methods to appropriately return data to the user. + +**respond:** + +```php +use Leaf\Controller; + +class NameController extends Controller { + public function index() { + $this->respond([ + 'message' => 'hello' + ]); + } +} +``` + +You can view more on responses [here](/modules/http/v/2/response) + +### file_upload + +file_upload is for simple file uploads. It takes in 3 parameters, the path to save the file, the file and the file type(optional). It returns an array `[true, $filename]` if successful and `[false, $error]` if the upload fails. + +```php +use Leaf\Controller; + +class NameController extends Controller { + public function index() { + $profilePic = $_FILES['profile_pic']; + // file upload + $this->file_upload('./images/', $profilePic); + // file upload with file type + $this->file_upload('./images/', $profilePic, 'image'); + } +} +``` + +### Forms + +The base controller also gives you a simple way to handle form data + +```php +public function index() { + $name = $this->form->get('name'); + + $this->validate([ + 'name' => 'text' + ]); +} +``` + +Read more on Leaf Forms [here](/modules/forms/) diff --git a/apps/docs/src/modules/mvc-core/factories.md b/apps/docs/src/modules/mvc-core/factories.md new file mode 100755 index 0000000..b062a1d --- /dev/null +++ b/apps/docs/src/modules/mvc-core/factories.md @@ -0,0 +1,91 @@ + +# Core Factory + +## Overview + +Instead of defining 100 dummy rows in your database 1 by 1, you can quickly populate your database with dummy but structured data using Factories. + +This version of Leaf comes with a nice integration with your models that allows you to create all the data you need in just a few lines of code. + +## Working with factories + +Just like with other Leaf modules, we try to make working with factories as simple as possible. A regular factory file looks something like this: + +```php + strtolower($this->faker->firstName), + 'name' => $this->faker->name, + 'email' => $this->faker->unique()->safeEmail, + 'email_verified_at' => \Leaf\Date::now(), + 'password' => '$2y$10$92IXUNpkjO0rOQ5byMi.Ye4oKoEa3Ro9llC/.og/at2.uheWG/igi', // password + 'remember_token' => 'random string', + ]; + } +} + +``` + +As you can see, in their most basic form, factories are classes that extend Leaf's base factory class and define a `model` property and `definition` method. The `definition` method returns the default set of attribute values that should be applied when creating a model using the factory. + +As a side note, if the `model` property isn't defined, Leaf tries to determine the model class name from the factory name, if however, that doesn't work, an error would be thrown, and the seeding process halted. + +Via the `faker` property, factories have access to the [Faker PHP library](https://github.com/FakerPHP/Faker), which allows you to conveniently generate various kinds of random data for testing. + +## Running your factories + +Factories are used in your seeds, so to use a factory, head over to it's corresponding Seed, eg: `UserFactory` would be used by the `UsersSeeder`. From there, you just need to initialize the Factory in the `run` method of your seeder. This is in 3 simple parts: + +```php +(new UserFactory)->create(20)->save(); +``` + +The `(new UserFactory)` part initializes the factory, `create()` takes in a number which defines how many dummy records to generate, finally `save()` instantiates model instances and persists them to the database using Eloquent's save method: + +```php +// Create a single App\Models\User instance... +(new UserFactory)->save(); + +// Create three App\Models\User instances... +(new UserFactory)->create(3)->save(); +``` + +To see the results of this, you just need to seed your database with the `db:seed` command. + +You may override the factory's default model attributes by passing an array of attributes to the create method: + +```php +(new UserFactory)->save([ + 'name' => 'Mychi', +]); +``` + +**Note that if you're creating multiple records, they'll all have the same data passed into `save`, so it's not recommended to override save when using multiple records.** + +In some cases, for whatever reason, you may want to return the users generated instead of saving them in the database directly. You can do this with the `get` method: + +```php +$randomUsers = (new UserFactory)->create(3)->get(); +``` diff --git a/apps/docs/src/modules/mvc-core/index.md b/apps/docs/src/modules/mvc-core/index.md new file mode 100644 index 0000000..3daff7c --- /dev/null +++ b/apps/docs/src/modules/mvc-core/index.md @@ -0,0 +1,246 @@ +# MVC Core + +MVC core is a module that contains components for transforming leaf into a full-blown MVC framework. MVC Core is used in Leaf MVC and Leaf API. It comes with features like controllers, models, eloquent from laravel, factories and more. + +## Installation + +You can quickly install MVC core using composer or leaf cli. + +```bash +composer require leafs/mvc-core +``` + +Or with leaf CLI: + +```bash +leaf install mvc-core +``` + +## Config + +Leaf MVC and Leaf API are already configured out of the box. If you are using any of these setups, you can skip to the documentation for the component you need. + +## Autoloader + +MVC core comes with an autoloader that uses the class names and namespaces of classes you use in your code to dynamically load classes. This saves you the trouble of having to require every file you create in your application. This is done for you by default and there's no need to initialize any class or function. + +## Controllers + +Leaf MVC Core comes in with two (2) controller classes. `Leaf\Controller` for creating controllers in web projects and `Leaf\ApiController` for creating controllers geared towards API development. + +## Models + +Leaf MVC Core comes with a base model from which all models in your leaf API and leaf MVC apps are created. This model is directly built unto [laravel's eloquent](https://laravel.com/docs/10.x/eloquent) and so we'll recommend checking out laravel models for detailed documentation. Models in your app will look something like this: + +```php + strtolower($this->faker->firstName), + 'name' => $this->faker->name, + 'email' => $this->faker->unique()->safeEmail, + 'email_verified_at' => \Leaf\Date::now(), + 'password' => '$2y$10$92IXUNpkjO0rOQ5byMi.Ye4oKoEa3Ro9llC/.og/at2.uheWG/igi', // password + 'remember_token' => Str::random(10), + ]; + } +} +``` + +The `definition` method returns the default set of attribute values that should be applied when creating a model using the factory. + +As a side note, if the `model` property isn't defined, Leaf tries to determine the model class name from the factory name, if however, that doesn't work, an error would be thrown, and the seeding process halted. + +Via the `faker` property, factories have access to the [Faker PHP library](https://github.com/FakerPHP/Faker), which allows you to conveniently generate various kinds of random data for testing. + +### Running your factories + +Factories are used in your seeds, so to use a factory, head over to it's corresponding Seed, eg: `UserFactory` would be used by the `UsersSeeder`. From there, you just need to initialize the Factory in the `run` method of your seeder. This is in 3 simple parts: + +```php +(new UserFactory)->create(20)->save(); +``` + +The `(new UserFactory)` part initializes the factory, `create()` takes in a number which defines how many dummy records to generate, finally `save()` instantiates model instances and persists them to the database using Eloquent's save method: + +```php +// Create a single App\Models\User instance... +(new UserFactory)->save(); + +// Create three App\Models\User instances... +(new UserFactory)->create(3)->save(); +``` + +To see the results of this, you just need to seed your database with the `db:seed` command. + +You may override the factory's default model attributes by passing an array of attributes to the create method: + +```php +(new UserFactory)->save([ + 'name' => 'Mychi', +]); +``` + +**Note that if you're creating multiple records, they'll all have the same data passed into `save`, so it's not recommended to override save when using multiple records.** + +In some cases, for whatever reason, you may want to return the users generated instead of saving them in the database directly. You can do this with the `get` method: + +```php +$randomUsers = (new UserFactory)->create(3)->get(); +``` + +## Schema + +Schema is a new way to create database migrations. Typing code for migrations the regular way is quite annoying: thinking of the types of data, setting default values and other items. `Schema` allows you to create migration schemas based on example JSON output. + +```json +{ + "id": 1, + "username?": "mychi.darko", + "name": "Mychi Darko", + "email?": "mychi@leafphp.dev", + "email_verified_at?": "2021-07-23T16:18:35.947712157Z", + "password": "poekojdenwjwiojweojojweoijoewoj", + "remember_token?": "deiwoj", + "timestamps": "" +} +``` + +This will generate a migration equivalent to this: + +```php +$table->increments('id'); +$table->string('username')->nullable(); +$table->string('name'); +$table->string('email')->nullable(); +$table->timestamp('email_verified_at')->nullable(); +$table->string('password'); +$table->string('remember_token')->nullable(); +$table->timestamps(); +``` + +Schema takes care of all the work involved and generates a migration based on sample data. This means that if you have an idea of what your database should look like, leaf will take care of the rest. + +### Using leaf schema + +To get started with leaf schema, simply call `Leaf\Schema::build` in your migration. It takes in the capsule to build your migrations with and the json schema to build. + +Using the example above (users.json): + +```json +{ + "id": 1, + "username?": "mychi.darko", + "name": "Mychi Darko", + "email?": "mychi@leafphp.dev", + "email_verified_at?": "2021-07-23T16:18:35.947712157Z", + "password": "poekojdenwjwiojweojojweoijoewoj", + "remember_token?": "deiwoj", + "timestamps": "" +} +``` + +user_migration.php + +```php +... +use Leaf\Schema; + +class CreateUsers extends Database { + /** + * Run the migrations. + * + * @return void + */ + public function up() { + Schema::build("users"); + } + ... +``` + +In this case leaf will generate a migration to the users table since our filename is `users.json`. Note that leaf schema will always use the filename as the table name. + +## Globals + +Leaf MVC core comes with the most global functions in all of leaf. This includes functions for configurations, paths and other essentials in MVC applications. + +- **AppPaths**: This is a function which holds all of the paths in your application. This is usually used by leaf, as you will be using some of the functions below. + +```php +$paths = AppPaths(); +``` + +- **ConfigPath**: This global returns the path to your configuration folder in Leaf MVC and Leaf API. + +```php +$dbConfigFile = ConfigPath("db.php"); +// -> Config/db.php +``` + +- **CommandsPath**: This returns the path to your commands defined. + +```php +$command = CommandsPath("MainCommand.php"); +// -> App/Commands/MainCommand.php +``` + +- **ControllersPath**: Path to your controllers + +- **DatabasePath**: Path to your database files (migrations, schema, factories...) + +- **FactoriesPath**: Path to your model factories + +- **HelpersPath**: Path to your helpers + +- **LibPath**: Path to your lib folder if it exists. + +- **MigrationsPath**: Path to your mirations + +- **ModelsPath**: Path to your models + +- **RoutesPath**: Path to your routes + +- **SeedsPath**: Path to your seed files + +- **StoragePath**: Path to storage directory + +- **ViewsPath**: Path to your view files diff --git a/apps/docs/src/modules/mvc-core/model.md b/apps/docs/src/modules/mvc-core/model.md new file mode 100755 index 0000000..d8d9a5e --- /dev/null +++ b/apps/docs/src/modules/mvc-core/model.md @@ -0,0 +1,277 @@ + +# 📕 Core Model + +## Overview + +Leaf has provided a very simple core model for use in your applications. This core model is powered by the `Leaf ORM` and so all it's features are available for use in Leaf. + +This **model** provides a beautiful, simple ActiveRecord implementation for working with your database. Each database table has a corresponding "Model" which is used to interact with that table. Models allow you to query for data in your tables, as well as insert new records into the table. + +## Defining Models + +To get started, let's create a simple model. If you are not using a Leaf framework like [Leaf MVC](https://leafmvc.netlify.com) or [Leaf API](https://github.com/leafsphp/leafAPI), you can create directory to hold all your application models. All your models should extend `Leaf\Model` class. + +Before getting started, be sure to configure a database connection with a `.env` file. You can take a look at this [example env file](https://gist.github.com/mr-phlames/cbc85b7e4fa8ce5474aea0aec277c7f6). + +## Leaf Model Conventions + +Now, let's look at an example `Flight` model, which we will use to retrieve and store information from our `flights` database table: + +```php + + +## Default Attribute Values + +If you would like to define the default values for some of your model's attributes, you may define an $attributes property on your model: + +```php + false, + ]; +} +``` + +
+ +## Retrieving Models + +Once you have created a model and its associated database table, you are ready to start retrieving data from your database. Think of each Leaf model as a powerful query builder allowing you to fluently query the database table associated with the model. For example: + +```php +name; +} +``` + +### Adding Additional Constraints + +The Leaf all method will return all of the results in the model's table. Since each Leaf model serves as a query builder, you may also add constraints to queries, and then use the get method to retrieve the results: + +```php +$flights = Flight::where('active', 1)->orderBy('name', 'desc')->take(10)->get(); +``` + +> **You can check [here](https://laravel.com/docs/5.8/queries) for available queries on your models.** + +### Refreshing Models + +You can refresh models using the `fresh` and `refresh` methods. The `fresh` method will re-retrieve the model from the database. The existing model instance will not be affected: + +```php +$flight = Flight::where('number', 'FR 900')->first(); + +$freshFlight = $flight->fresh(); +``` + +The `refresh` method will re-hydrate the existing model using fresh data from the database. In addition, all of its loaded relationships will be refreshed as well: + +```php +$flight = Flight::where('number', 'FR 900')->first(); + +$flight->number = 'FR 456'; + +$flight->refresh(); + +$flight->number; // "FR 900" +``` + +
+ +## Inserting & Updating Models + +### Inserts + +To create a new record in the database, create a new model instance, set attributes on the model, then call the save method: + +```php +name = $this->request->name; + + $flight->save(); + } +} +``` + +In this example, we assign the name parameter from the incoming HTTP request to the name attribute of the `Flight` model instance. When we call the save method, a record will be inserted into the database. The created_at and updated_at timestamps will automatically be set when the save method is called, so there is no need to set them manually. + +### Updates + +The save method may also be used to update models that already exist in the database. To update a model, you should retrieve it, set any attributes you wish to update, and then call the save method. Again, the updated_at timestamp will automatically be updated, so there is no need to manually set its value: + +```php +$flight = Flight::find(1); + +$flight->name = 'New Flight Name'; + +$flight->save(); +``` + +
+ +Since Leaf Models use Eloquent, you can read more [here](https://laravel.com/docs/5.8/eloquent) to view available methods on the Eloquent object. + +**Just remember, your models should extend `Leaf\Model` not `Eloquent`** diff --git a/apps/docs/src/modules/password/index.md b/apps/docs/src/modules/password/index.md new file mode 100755 index 0000000..184bdb1 --- /dev/null +++ b/apps/docs/src/modules/password/index.md @@ -0,0 +1,127 @@ +# Leaf Password + + + +Password encoding and verification are one of the most important parts of any application. This usually involves a lot of security concerns and can be a pain to implement. Leaf makes this process a lot easier with the password helper. + +This module simply helps create and manage passwords, encrypt and verify without any security concerns. It is fully static, as such, can be used from anywhere in your application. + +## Installation + +You can quickly install a password helper through the leaf cli: + +```bash +leaf install password +``` + +or you can install it via composer: + +```bash +composer require leafs/password +``` + +## spice + +Just as the name implies, spice adds a little "spice" to users' passwords. They help make even weak passwords a pain for systems to crack by chaining additional characters to the password before encoding or decoding. + +A weak password like `password123` when spiced can become `@X$p0#f&password123` without pressing the user to stick to "Your password should contain numbers, letters and ...". + +The `spice` method can both be used to set and get the password spice. + +This sets the password spice which will be encrypted based on the hash you set: + +```php +use Leaf\Helpers\Password; + +Password::spice('#@%7g0!&'); +``` + +**The next examples will assume you've added `use Leaf\Helpers\Password`** + +This returns the password spice: + +```php +$spice = Password::spice(); +``` + +**Spices are automaticatically chained to all password related stuff, so after setting your spice, you don't need to worry about it.** + +## `Password::hash()` + +This method basically creates a password hash. It takes in 3 parameters: + +- The password to encrypt +- The encryption hash (optional) +- An array of options for the password hash (optional) + +```php +$hash = Password::hash('USER_PASSWORD', Password::BCRYPT); +``` + +The default encryption hash used if none is provided is `Password::DEFAULT` which is `PASSWORD_DEFAULT`. + +Also, the most commonly used hashes, BCRYPT and Argon2 are accessible on the Password Helper object as `Password::BCRYPT` and `Password::ARGON2`. + +The final options array differs based on the hash you're using. See the [password algorithm constants](https://secure.php.net/manual/en/password.constants.php) for documentation on the supported options for each algorithm. + +## `Password::verify()` + +Verifying a user’s password has been made really simple thanks to the `verify()` method. Simply pass the plaintext password supplied by the user and compare it to the stored hash, like so: + +```php +if (Password::verify($password, $hashedPassword)) { + // handle user login here +} +``` + +verify returns true on success and false on failure. + +`$hashedPassword` in the following examples refers to the stored hashed password. + +## argon 2 + +Argon2 is one encryption method heavily used by a lot of developers. Although creating and verifying passwords with argon2 is nothing difficult, Leaf makes it even simpler with methods targetting only argon. + +### `argon2()` + +This is a simply method used to create an Argon2 hash for your password. It takes in 2 parameters, the password to encrypt and the options for the hashing. + +```php +$hash = Password::argon2($password, $options); +``` + +The options parameter is optional, but in case you want to set your own options, see the [password algorithm constants](https://secure.php.net/manual/en/password.constants.php) for documentation on the supported options for Argon2. + +### `argon2Verify()` + +This method simply checks the validity of an Argon2 hash. + +```php +if (Password::argon2Verify($password, $hashedPassword)) { + // handle user login here +} +``` + +## BCRYPT + +BCRYPT is another hash used widely by a lot of developers, especially since support with BCRYPT has been on longer than other hashes like Argon 2. We just make hashing with BCRYPT even easier than it currently is. + +### `bcrypt()` + +This is a simply method used to create an BCRYPT hash for your password. It takes in 2 parameters, the password to encrypt and the options for the hashing. + +```php +$hash = Password::bcrypt($password, $options); +``` + +The options parameter is optional, but in case you want to set your own options, see the [password algorithm constants](https://secure.php.net/manual/en/password.constants.php) for documentation on the supported options for BCRYPT. + +### `brcyptVerify()` + +This method simply checks the validity of an BCRYPT hash. + +```php +if (Password::brcyptVerify($password, $hashedPassword)) { + // handle user login here +} +``` diff --git a/apps/docs/src/modules/queues/index.md b/apps/docs/src/modules/queues/index.md new file mode 100644 index 0000000..2bb9e3e --- /dev/null +++ b/apps/docs/src/modules/queues/index.md @@ -0,0 +1,217 @@ +# Queues + + + + + +During the development of your web application, there are tasks that can be time-consuming, such as parsing and storing a CSV file that has been uploaded. However, with Leaf, you have the advantage of easily creating queued jobs that can be processed in the background. By offloading these intensive tasks to a queue, your Leaf application can swiftly respond to web requests, resulting in improved speed and a better user experience for your customers. + + + +## Queues in Leaf + +Implementing a queuing system from scratch can be a daunting task, and can take a lot of time. For this reason, Leaf provides a unified API for using queues across a variety of different backends, such as Redis or your database. + + + +::: warning Compatibility Note +Queues are only supported by Leaf MVC and Leaf API applications. We plan to add support for Leaf Core in the near future. +::: + +## Installation + +To get started with Queues in Leaf, you need to install the `leaf/queue` package: + +```bash +leaf install queue +``` + +Or you can install it via composer: + +```bash +composer require leafs/queue +``` + +After installing the package, you need to register the Leaf Queue commands in Aloe CLI. You can do this by adding the following line to your `leaf` file in the root of your Leaf MVC or Leaf API application: + +```php +$console->register(\Leaf\Queue::commands()); +``` + +This should give you access to the following commands: + +- `php leaf g:job` - Generate a job class. +- `php leaf d:job` - Delete a job class. +- `php leaf queue:config` - Generate a queue configuration file. +- `php leaf queue:install` - Generate and run a migration file for the queue table. +- `php leaf queue:run` - Start the queue worker. + +## Configuration + +After installing the leaf queue package, you need to setup your queue configuration. Leaf provides a unified API for using queues across a variety of different backends, such Redis or your database, with plans to add support for Amazon SQS, BeanStalk, and others in the future. In your Leaf MVC and Leaf API applications, the queue configuration file is located at `config/queue.php`. This file allows you to configure all of your queue connections. By default, this file is not present in your application, so you need to create it using the following command: + +```bash +php leaf queue:config +``` + +This will generate a `queue.php` file in your `config` directory. The file contains examples for configuring each queue driver that is supported by Leaf. Make sure to read the comments in the file and configure a queue connection before using the queue API. + +## Configuration options + +There are several configuration options available to you in the `config/queue.php` configuration file. These options are used to determine the connection information for your queues, as well as various other options such as queue retry settings, queue logging, queue worker sleep durations, and more. + +### Adapter + +The `adapter` option specifies the system that will be used to run your queues. Leaf supports `redis` and `db` as queue adapters. The `redis` adapter uses Redis as a queue backend, while the `db` adapter uses your database as a queue backend. + +### Default + +The `default` option specifies which of the queue connections found in your config should be used as the default connection for all queue operations. Leaf supports `redis`, `sqlite`, `mysql`, `pgsql`, and `sqlsrv` as queue connections. You can also specify a custom connection by providing the name of a connection that is defined in the `connections` array of your `config/queue.php` file. + +### Connections + +The `connections` option contains an array of all of the queue connections defined for your application. Each connection corresponds to a queue adapter supported by Leaf. For example, the following configuration defines a connection named `redis` that uses the `redis` adapter to connect to a Redis server: + +```php +'connections' => [ + 'redis' => [ + 'host' => _env('REDIS_HOST', '127.0.0.1'), + 'port' => _env('REDIS_PORT', '6379'), + 'password' => _env('REDIS_PASSWORD', ''), + 'dbname' => _env('REDIS_DB', 0), + ], + + ... +``` + +### Queue table + +If you are using the `db` adapter, you will need to configure a database table to store your jobs. You can use the `table` option to specify the name of the table. By default, Leaf will use the `leafphp_main_jobs` table that is already included with your application. If you would like to use a different table, you should create the table and specify its name in your `config/queue.php` configuration file: + +```php +'table' => 'leafphp_jobs', +``` + +### Worker Config + +Worker config includes the default settings used by your worker when executing a job. These settings can be specified when dispatching a job, but if not specified, the worker will use these settings instead. + +- delay: The number of seconds to wait before processing a job. +- delayBeforeRetry: The number of seconds to wait before retrying a job that has failed. +- expire: The number of seconds to wait before archiving a job that has not yet been processed. +- force: Whether to force the worker to process the job, even if it has expired or has reached its maximum number of retries. +- memory: The maximum amount of memory the worker may consume. +- quitOnEmpty: Whether the worker should quit when the queue is empty. +- sleep: The number of seconds to wait before polling the queue for new jobs. +- timeout: The number of seconds a child process can run before being killed. +- tries: The maximum number of times a job may be attempted. + +## Connecting to your queue + +As mentioned above, Leaf queue only supports `redis` and `db` as queue adapters. To connect to your queue, you need to specify the adapter and connection you want to use. You can do this by specifying the adapter and connection in the `config/queue.php` file: + +```php +'adapter' => 'redis', +'default' => 'redis', +``` + +If you are using the `db` adapter, you will need to configure a database table to store your jobs. Leaf queue comes with a command to generate and run a migration file for the queue table. You can generate the migration file using the following command: + +```bash +php leaf queue:install +``` + +Don't forget to change the `default` option in your `config/queue.php` file to the name of the connection you want to use. + +After this is done, you can start adding jobs to your queue. + +## Creating a job + +Jobs are the tasks that you want to run in the background. For example, you may want to send an email to a user after they have registered for your application. Instead of sending the email directly from your controller, you can create a job that sends the email, and then dispatch the job to the queue. This way, the user will not have to wait for the email to be sent before they can continue using your application. + +You can create a job using the `g:job` command: + +```bash +php leaf g:job SendEmail +``` + +This will generate a `SendEmailJob` class in your `app/Jobs` directory. The class will contain a `handle` method that will be called when the job is processed by the queue. You can add any code you want to this method. For example, if you want to send an email, you can use the custom created `UserMailer` class to send the email: + +```php +send(); + } +} +``` + +## Dispatching a job + +After creating a job, you can dispatch it to the queue using the `dispatch()` method: + +```php +\App\Jobs\SendEmailJob::dispatch(); +``` + +Some jobs like the send email job above may require some data to be passed to the job. You can pass data to the job using the `with()` method: + +```php +\App\Jobs\SendEmailJob::with($userId)->dispatch(); +``` + +You can also pass an array of data to the `with()` method: + +```php +\App\Jobs\SendEmailJob::with(['userId' => $userId])->dispatch(); +``` + +## Specifying options for a job + +In the config file, you can specify default options for your jobs. However, you can also specify options for a job when dispatching it to the queue. For example, if you want to delay a job for 5 minutes, you can do so by passing the `delay` option to the `dispatch()` method: + +```php +\App\Jobs\SendEmailJob::with($userId)->dispatch(['delay' => 5]); +``` + +The available options are: + +- delay: The number of seconds to wait before processing a job. +- delayBeforeRetry: The number of seconds to wait before retrying a job that has failed. +- expire: The number of seconds to wait before archiving a job that has not yet been processed. +- force: Whether to force the worker to process the job, even if it has expired or has reached its maximum number of retries. +- memory: The maximum amount of memory the worker may consume. +- timeout: The number of seconds a child process can run before being killed. +- tries: The maximum number of times a job may be attempted. + +## Running the queue worker + +After dispatching a job to the queue, you need to run the queue worker to process the job. You can do this by running the following command: + +```bash +php leaf queue:run +``` + +This will start the queue worker and process any jobs that have been dispatched to the queue. + + diff --git a/apps/docs/src/modules/redis/index.md b/apps/docs/src/modules/redis/index.md new file mode 100644 index 0000000..af7b8ae --- /dev/null +++ b/apps/docs/src/modules/redis/index.md @@ -0,0 +1,236 @@ +# Leaf Redis + + + + + + +According to the [Redis docs](https://redis.io/), Redis is an open source (BSD licensed), in-memory data structure store used as a database, cache, message broker, and streaming engine. Redis provides data structures such as strings, hashes, lists, sets, sorted sets with range queries, bitmaps, hyperloglogs, geospatial indexes, and streams. Redis has built-in replication, Lua scripting, LRU eviction, transactions, and different levels of on-disk persistence, and provides high availability via Redis Sentinel and automatic partitioning with Redis Cluster. + +In simpler terms, Redis is a fast, open source, in-memory key-value store that can be used as a database, cache, and message broker. As a database, Redis allows you to store and retrieve data quickly by keeping it in memory rather than on disk, which makes it ideal for applications that require high-speed access to data. As a cache, Redis can help speed up web applications by storing frequently accessed data in memory, reducing the number of times the application needs to access a slower database. + +Leaf includes a Redis module that allows you to easily integrate Redis into your Leaf application. + +
+New to Redis? + +We've included some resources to help you get started with Redis. + + + +
+ +## Installation + +You can quickly and simply install Leaf Redis through composer or the leaf cli. + +```bash +composer require leafs/redis +``` + +or with the leaf cli: + +```bash +leaf install redis +``` + +## Getting Started + +To get started with Leaf Redis, you simply need to call the `init` method and pass in any configuration you need. + +```php +Leaf\Redis::init(); +``` + +This will initialize a new redis connection, from there, you can call any function you need to call. + +### Aloe CLI + +::: warning Note + +You only need to use this section if you're using Leaf MVC or Leaf API. + +::: + +Although Leaf Redis can be used outside the Leaf environment, there's more support for Leaf based frameworks. Leaf Redis comes with out of the box support for Aloe CLI which is used in Leaf MVC and Leaf API. To get started, head over to the `leaf` file in the root directory of your Leaf API/Leaf MVC app or wherever aloe CLI is registered and register a new command. + +```php +$console->register(\Leaf\Redis::commands()); +``` + +From there you should have access to a bunch of new commands from Leaf redis. The available commands are: + +```bash +redis + redis:install Create leaf redis config and .env variables + redis:server Start redis server +``` + +From there, you can run `php leaf redis:install` to install the redis config and environment variables. You can then run `php leaf redis:server` to start the redis server. + +## Config + +As mentioned above, the `init` method takes in an array for configuration. Below is the default config for `init`. + +```php +/* +|-------------------------------------------------------------------------- +| Redis host +|-------------------------------------------------------------------------- +| +| Set the host for redis connection +| +*/ +"host" => "127.0.0.1", + +/* +|-------------------------------------------------------------------------- +| Redis host port +|-------------------------------------------------------------------------- +| +| Set the port for redis host +| +*/ +"port" => 6379, + +/* +|-------------------------------------------------------------------------- +| Redis auth +|-------------------------------------------------------------------------- +| +| Set the password for redis connection +| +*/ +"password" => null, + +/* +|-------------------------------------------------------------------------- +| Redis session handler +|-------------------------------------------------------------------------- +| +| Set redis as session save handler +| +*/ +"session" => false, + +/* +|-------------------------------------------------------------------------- +| Redis connection timeout +|-------------------------------------------------------------------------- +| +| Value in seconds (optional, default is 0.0 meaning unlimited) +| +*/ +"connection.timeout" => 0.0, + +/* +|-------------------------------------------------------------------------- +| Redis connection reserved +|-------------------------------------------------------------------------- +| +| should be null if $retryInterval is specified +| +*/ +"connection.reserved" => null, + +/* +|-------------------------------------------------------------------------- +| Redis session handler +|-------------------------------------------------------------------------- +| +| Connection retry interval in milliseconds. +| +*/ +"connection.retryInterval" => 0, + +/* +|-------------------------------------------------------------------------- +| Redis connection read timeout +|-------------------------------------------------------------------------- +| +| Value in seconds (optional, default is 0 meaning unlimited +| +*/ +"connection.readTimeout" => 0.0, + +/* +|-------------------------------------------------------------------------- +| Redis session save_path +|-------------------------------------------------------------------------- +| +| Save path for redis session. Leave null to automatically +| generate the session save path. You can also use multiple save urls +| by passing in an array. +| +*/ +"session.savePath" => null, + +/* +|-------------------------------------------------------------------------- +| Redis session save_path options +|-------------------------------------------------------------------------- +| +| Options for session save path. You can pass in multiple options in +| the order of the save path above. +| +*/ +"session.saveOptions" => [], +``` + +```php +use Leaf\Redis; + +Redis::init([ + // you can use multiple hosts + "session.savePath" => ["tcp://host1:6379", "tcp://host2:6379"], + + // the first array is for the first host, second for the second host + "session.saveOptions" => [["weight" => 1], ["weight" => 2]], +]); +``` + +## Available Methods + +### set + +This allows you to set a redis entry. + +```php +Leaf\Redis::set("key", "value"); + +// you can also use arrays to set multiple values at once + +Leaf\Redis::set(["key" => "value", "key2" => "value"]); +``` + +### get + +This returns a saved redis entry. + +```php +$value = Leaf\Redis::get("key"); + +// You can also get multiple entries at once + +$data = Leaf\Redis::get(["key", "key2"]); + +// $data => [key => value, key2 => value] +``` + +### ping + +Ping the redis server + +```php +Leaf\Redis::ping(); +``` + diff --git a/apps/docs/src/modules/router/controller.md b/apps/docs/src/modules/router/controller.md new file mode 100755 index 0000000..13d27eb --- /dev/null +++ b/apps/docs/src/modules/router/controller.md @@ -0,0 +1,124 @@ +--- +title: "Using Controllers" +--- + +# Using Controllers + + +Controllers are simply classes that serve as bridges between Models and the View part of your application. Don't think too much of controllers, they're nothing but a class. + +In this section, we'll be looking at how to handle a route with a controller. So let's make an example controller: **remember it's just a php class** + +```php +get("/home"); +``` + +When using controllers, instead of defining a closure or function as the second parameter of your route, you rather pass in a string of the controller's class name and the function you want to use. In this case, `"HomeController@index"`, so remember, it's `Class@Method` + +```php +$app = new Leaf\App; + +require "HomeController.php"; + +$app->get("/home", "HomeController@index"); +``` + +## Controller Namespaces + +In case you're using an auto loader or using leaf in another framework and you have your controllers in another directory, you can do sommething like this + +```php +$app->get('/(\d+)', '\App\Controllers\User@showProfile'); +``` + +But this gets tedious if you have a lot of routes. So Leaf allows you to set a "general" namespace, you can set the default namespace to use on your router instance via `setNamespace()` + +```php +$app->setNamespace('\App\Controllers'); + +$app->get('/users/(\d+)', 'User@showProfile'); +$app->get('/cars/(\d+)', 'Car@showProfile'); +``` + +## Resource Controller + +Resource Controllers contain methods to handle CRUD functionality. + +```php +request = new Request; + } + + /** + * Display a listing of the resource. + */ + public function index() { + // + } + + /** + * Show the form for creating a new resource. + */ + public function create() { + // + } + + /** + * Store a newly created resource in storage. + */ + public function store() { + // + } + + /** + * Display the specified resource. + */ + public function show($id) { + // + } + + /** + * Show the form for editing the specified resource. + */ + public function edit($id) { + // + } + + /** + * Update the specified resource in storage. + */ + public function update($id) { + // + } + + /** + * Remove the specified resource from storage. + */ + public function destroy($id) { + // + } +} +``` diff --git a/apps/docs/src/modules/router/dynamic.md b/apps/docs/src/modules/router/dynamic.md new file mode 100755 index 0000000..937622c --- /dev/null +++ b/apps/docs/src/modules/router/dynamic.md @@ -0,0 +1,76 @@ +--- +title: "Dynamic Routing" +--- + +# Dynamic Routing + + +## Named Params + +*This guide assumes you have read [Simple Routing](/modules/router/)* + +Basically, Dynamic Placeholder-based Route Patterns are just another way to use routes dynamically. This type of Route Patterns are the same as Dynamic PCRE-based Route Patterns, but with one difference: they don't use regexes to do the pattern matching but they use the more easy placeholders instead. Placeholders are strings surrounded by curly braces, e.g. {name}. You don't need to add parens around placeholders. + +Examples + +- /movies/{id} +- /profile/{username} + +Placeholders are easier to use than PRCEs, but offer you less control as they internally get translated to a PRCE that matches any character (.*). + +```php +app()->get('/movies/{movieId}/photos/{photoId}', function ($movieId, $photoId) { + echo 'Movie #' . $movieId . ', photo #' . $photoId); +}); +``` + +**Note:** the name of the placeholder does not need to match with the name of the parameter that is passed into the route handling function...although it's adviced: + +```php +app()->get('/movies/{foo}/photos/{bar}', function ($movieId, $photoId) { + echo 'Movie #' . $movieId . ', photo #' . $photoId); +}); +``` + +## PCRE Based Params + +Basically, PCRE based patterns are just another way to use routes dynamically. This type of Route Patterns contain dynamic parts which can vary per request. The varying parts are named subpatterns and are defined using regular expressions. + +Examples + +- /movies/(\d+) +- /profile/(\w+) + +Commonly used PCRE-based subpatterns within Dynamic Route Patterns are: + +- \d+ = One or more digits (0-9) +- \w+ = One or more word characters (a-z 0-9 _) +- [a-z0-9_-]+ = One or more word characters (a-z 0-9 _) and the dash (-) +- .* = Any character (including /), zero or more +- [^/]+ = Any character but /, one or more + +Note: The PHP PCRE Cheat Sheet might come in handy. + +The subpatterns defined in Dynamic PCRE-based Route Patterns are converted to parameters which are passed into the route handling function. Prerequisite is that these subpatterns need to be defined as parenthesized subpatterns, which means that they should be wrapped between parens: + +```php +// Bad +app()->get('/hello/\w+', function ($name) { + echo 'Hello ' . htmlentities($name); +}); + +// Good +app()->get('/hello/(\w+)', function ($name) { + echo 'Hello ' . htmlentities($name); +}); +``` + +**Note**: The leading `/` at the very beginning of a route pattern is not mandatory, but is recommended. + +When multiple subpatterns are defined, the resulting route handling parameters are passed into the route handling function in the order they are defined in: + +```php +app()->get('/movies/(\d+)/photos/(\d+)', function ($movieId, $photoId) { + echo 'Movie #' . $movieId . ', photo #' . $photoId); +}); +``` diff --git a/apps/docs/src/modules/router/errors.md b/apps/docs/src/modules/router/errors.md new file mode 100755 index 0000000..fb9ca3e --- /dev/null +++ b/apps/docs/src/modules/router/errors.md @@ -0,0 +1,41 @@ +# Error Handling + +By default Leaf has error screens which are displayed for application exceptions, 404s and production server errors, however, Leaf also gives you full control and allows you to customize what is shown when an error or exception is encountered. + +## Handling 404 + +Leaf displays a 404 screen for users, however, it may not always be appropriate, especially when you're building an API. You will probably want to return JSON instead of markup. For cases like this, Leaf has prepared a `set404` method on the Leaf instance. + +This method allows you to customize what a user sees when they visit a route that doesn't exist in your application. It takes in one parameter, a callable in the form of a function or an array. + +The example below displays a custom 404 page. + +```php +Router::set404(function () use($app) { + response()->page("./pages/404.html"); +}); +``` + +## Application Down + +Leaf router is also able to dynamically handle placing your application in maintenance mode using the `configure` method. + +```php +Router::configure([ + "app.down" => true, +]); +``` + +Alternatively, you could also place your application in maintenance mode by setting the `APP_DOWN` environment variable to true. Since `.env` variables are given more priority than router config, the router config will be ignored as long as the env is set. + +::: warning Note that +Leaf router expects you to manually load your `.env` file and will not be responsible for this. You can use [vlucas/phpdotenv](https://packagist.org/packages/vlucas/phpdotenv) to do this. After loading your `.env` variables into your app, leaf router will automatically pick them up. +::: + +Along with this, we have prepared a simple method to display a custom maintenance error page: `setDown`. + +```php +Router::setDown(function () { + echo "Down for maintenance"; +}); +``` diff --git a/apps/docs/src/modules/router/index.md b/apps/docs/src/modules/router/index.md new file mode 100755 index 0000000..4922df7 --- /dev/null +++ b/apps/docs/src/modules/router/index.md @@ -0,0 +1,273 @@ +--- +title: "Basic routing" +--- + +# Routing + + +::: tip +Leaf router is now separated from Leaf and is now available as an installable module via composer or the leaf cli. +::: + +Leaf router uses a single root file, to which all the server requests are redirected, it then takes these requests and matches them to rules you have defined. The results are then displayed to the user. It's actually a very simple concept. + +::: warning Note +Leaf router is automatically installed and attached to your leaf apps, so you don't need to manually install it. This guide focuses on leaf router and a general application of it. If you want the leaf routing guide with leaf router, check out [routing](/docs/routing/) instead. +::: + +You can install the leaf router with composer: + +```bash +composer require leafs/router +``` + +or with leaf CLI: + +```bash +leaf install router +``` + +After this, you can use all of leaf router's functionality with the router class below. + +## Router class + +The router class is the interface you interact with to perform any routing actions in your app. Leaf core directly integrates with the router class, which means that there is no need to use this class directly, if however, you are using leaf router outside of leaf, you will need to use the router class itself. + +```php +use Leaf\Router; + +Router::get("/", "PagesController@index"); + +Router::run(); +``` + +## Creating Routes + +::: warning IMPORTANT +From this point onwards, we will assume that you are using Leaf router outside a leaf app, as such, we will use the router class syntax: + +```php +Router::get('/', function () {...}); +``` + +Check out the [routing guide](/docs/routing/) for an application tailored for leaf apps. + +::: + +You can define application routes using proxy methods on the Leaf\App instance. Leaf supports different types of requests, let's look at them. + +### GET + +You can add a route that handles only GET HTTP requests with the Leaf router's get() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +```php +Router::get('/home', function () { + // your code +}); +``` + +### POST + +You can add a route that handles only POST HTTP requests with the Leaf router's post() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +```php +Router::post('/users/add', function () use($request) { + $user = $request->get('user'); + // create a new user +}); +``` + +Using Post Params +View [Request](/modules/http/v/2/request) for more info on handling params + +### PUT requests + +You can add a route that handles only PUT HTTP requests with the Leaf router’s put() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +```php +Router::put('/book/edit/{id}', function ($id) { + // your code +}); +``` + +### DELETE requests + +You can add a route that handles only DELETE HTTP requests with the Leaf router's delete() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +```php +Router::delete('/quotes/{id}', function ($id) { + // delete quote +}); +``` + +### OPTIONS requests + +You can add a route that handles only OPTIONS HTTP requests with the Leaf router's options() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +```php +Router::options('/quotes/{id}', function ($id) { + // return headers +}); +``` + +### PATCH requests + +You can add a route that handles only PATCH HTTP requests with the Leaf router's patch() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +```php +Router::patch('/post/{id}', function ($id) { + // your code +}); +``` + +### ALL requests + +You can add a route that handles all HTTP requests with the Leaf router's all() method. It accepts two arguments: + +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +```php +Router::all('/post/{id}', function ($id) { + // your code +}); +``` + +### View + +**`view` is no longer supported, as Leaf Blade is no longer default in Leaf. You'll have to manually show your views using `get`** + +### Resource Routes + +This section assumes you've read [working with controllers](/docs/routing/controller). In an MVC application, controllers play a major role as they're the bridge between your view and your model. + +A resource route simply creates all the routes needed to successfully handle a particular feature. This sounds a bit bleak, let's look at an example. + +```php +Router::resource("/posts", "PostsController"); + +Router::run(); +``` + +The code above is equivalent to this: + +```php +Router::match("GET|HEAD", "/posts", "$controller@index"); +Router::post("/posts", "$controller@store"); +Router::match("GET|HEAD", "/posts/create", "$controller@create"); +Router::match("POST|DELETE", "/posts/{id}/delete", "$controller@destroy"); +Router::match("POST|PUT|PATCH", "/posts/{id}/edit", "$controller@update"); +Router::match("GET|HEAD", "/posts/{id}/edit", "$controller@edit"); +Router::match("GET|HEAD", "/posts/{id}", "$controller@show"); + +Router::run(); +``` + +Resource routes are handled by a [resource controller](/docs/routing/controller?id=resource-controller). + +### Route "Hooking" + +You can add a route that handles a couple of HTTP methods with the Leaf router's match() method. It accepts three arguments: + +- The HTTP method(s) seperated by | +- The route pattern (with optional named placeholders or PCRE based patterns) +- The route callback + +```php +Router::match('GET|POST', '/people', function () { + // your code +}); +``` + +### Running your routes + +After setting all the routes, you'll need to dispatch the routes. This is achieved through Leaf's run() method. + +```php +Router::run(); +``` + +### Route options + +This is the biggest change Leaf router has seen over the period of a year. Route options simply allow you to configure the way groups and individual routes by passing in additional parameters. In actual sense, all new features were generated as a result of this single feature. Let's see how it works. + +Leaf route handlers are usually callable functions like this: + +```php +Router::get("/home", function () { + echo "User Home"; +}); +``` + +Or sometimes controllers, like this: + +```php +Router::get("/home", "HomeController@index"); +``` + +This means there was no space to chain additional items to the route, this is solved by route options. + +```php +Router::get("/home", ["name" => "home", function () { + echo "User Home"; +}]); +``` + +When an array is passed into a leaf route as the handler, leaf will take all `key => value` as options for that route, the first non key-value `function` or `controller` in the array is taken as the handler. + +```php +Router::get("/form", ["name" => "userForm", "FormsController@index"]); +``` + +As mentioned before, this feature is also available on groups: + +```php +Router::group("/user", ["namespace" => "\\", function () { + // ... +}]); +``` + +**This doesn't mean that you should always pass in an array, if you don't need the other options, you can pass in your function or controller directly as you've always done.** + +### Naming your routes + +From v2.5.0 of Leaf, you can give route names which you can call them with instead of using the path (Inspired by vue-router). + +```php +Router::get("/home", ["name" => "home", function () { + echo "User Home"; +}]); +``` + +### Pushing to a route + +This is simply redirecting to a route and can be done using `push`. `push` also allows you to reference the route by it's name instead of it's path. + +```php +Router::push("/home"); +``` + +When an array is passed into push, Leaf will search for a route name matching the string in the array and redirect to that route: + +```php +// home was defined above +Router::push(["home"]); +``` diff --git a/apps/docs/src/modules/router/middleware.md b/apps/docs/src/modules/router/middleware.md new file mode 100755 index 0000000..554ee5a --- /dev/null +++ b/apps/docs/src/modules/router/middleware.md @@ -0,0 +1,137 @@ +# Middleware + + +Middleware are just methods that run before your code runs, be it a particular route or your whole application. Unlike many other frameworks and systems, Leaf gives you the opportunity to set global middleware that run before any and every route. + +## ⏳ Before Route Middlewares + +Leaf's Core router supports Before Route Middlewares, which are executed before the route handling is processed. + +Like route handling functions, you hook a handling function to a combination of one or more HTTP request methods and a specific route pattern. + +```php +$app->before('GET|POST', '/admin/.*', function () { + if (!isset($_SESSION['user'])) { + header('location: /auth/login'); + exit(); + } +}); +``` + +## Middleware route option + +This is a new way to quickly setup middleware for a particular route. Leaf has the before method which allows you to set a route specific middleware, but that means defining the same route twice, not to mention, you may mistake the middleware for the main route as they have the same syntax. This problem is solved by the middleware option. **If your prefer using `before`, you can always do so.** + +```php +// you can define it in a different file +$homeMiddleware = function () { + echo "Home middleware"; +}; + +$app->get("/home", ["middleware" => $homeMiddleware, function () { + echo "User Home"; +}]); +``` + +Unlike route handling functions, more than one before route middleware is executed when more than one route match is found. + +## ✨ Before Router Middlewares + +Before route middlewares are route specific. Using a general route pattern (viz. all URLs), they can become Before Router Middlewares (in other projects sometimes referred to as before app middlewares) which are always executed, no matter what the requested URL is. + +```php +$app->before('GET', '/.*', function () { + // ... this will always be executed +}); +``` + +### Router Hooks + +Hooks basically allow you to hook into Leaf router and execute a callback at a given time. For instance, you can execute a function just before Leaf fires off routes. You can also execute a callback before the main middleware executes or even after Leaf has completely executed a route. + +There are 6 hooks that you can now use with Leaf router listed below in execution order: + +#### `router.before` + +This hook runs before Leaf router begins any operations, even before app middleware are triggered. + +#### `router.before.route` + +This hook runs just after the app middleware have run, just before the route specific middleware. + +#### `router.before.dispatch` + +This hook runs just before routes are dispatched. + +#### `router.after.dispatch` + +This hook runs just after routes are dispatched. + +#### `router.after.route` + +This hook runs after Leaf router has finished up with routing and cleaning up, just before the execution of internal code. + +#### `router.after` + +This hook runs when leaf completely finishes route execution and cleans up on the internal code as well. This is the last thing Leaf router does before exiting. + +**Note** Unlike the above hooks, `router.after` can be directly assigned by passing a function into Leaf router's `run` method. + +```php +$app = new Leaf\App; + +$app->run(function () { + echo "Final thing to run"; +}); +``` + +Also note that the final function may return a value for further use if need be. + +```php +$time = Leaf\Router::run(function () { + return Leaf\Date::now(); +}); + +saveToLogs("app finished executing", $time); +``` + +To get started with hooks, simply use the `hook` method to define the hook you want to use. + +**It doesn't matter the order in which you define hooks. Leaf router will run them in the correct order.** + +```php +$app->hook("router.before", function () { + Leaf\Http\Headers::resetStatus(202); +}); +``` + +The example above makes sure that every response gets sent with a `202 Accepted` https status instead of the original status code. As you can see, `hook` takes in the hook you wish to set and a callable/callback to execute. + +### App middleware + +::: warning +If you are using leaf router outside of leaf, we suggest you use router hooks or before router middleware above. +::: + +App middleware which are created using `Leaf\Middleware` have also received a lot of fixes which make them easier and faster to use. + +::: danger NOTE +Router `add` has been renamed to `use`. This means that you will be using `use` to load your middleware instead. +::: + +```php{14} +// usually in a different file +class Test extends Leaf\Middleware +{ + public function call() + { + echo "my test middleware"; + + $this->next(); + } +} + +$app = new Leaf\App; + +$app->use(new Test); +``` diff --git a/apps/docs/src/modules/router/sub-folder.md b/apps/docs/src/modules/router/sub-folder.md new file mode 100755 index 0000000..7f12c18 --- /dev/null +++ b/apps/docs/src/modules/router/sub-folder.md @@ -0,0 +1,37 @@ +--- +title: "Sub-folder support" +--- + +# Sub-folder support + + +## 📖 Overview + +Out-of-the box Leaf's Core router will run in any (sub)folder you place it into … no adjustments to your code are needed. You can freely move your entry script index.php around, and the router will automatically adapt itself to work relatively from the current folder's path by mounting all routes onto that basePath. + +Say you have a server hosting the domain www.example.org using public_html/ as its document root, with this little entry script index.php: + +```php +$app->get('/', function () { echo 'Index'; }); +$app->get('/hello', function () { echo 'Hello!'; }); +``` + +- If your were to place this file (along with its accompanying .htaccess file or the like) at the document root level (e.g. public_html/index.php), Leaf's Core router will mount all routes onto the domain root (e.g. /) and thus respond to [https://www.example.org/](https://www.example.org/) and [https://www.example.org/hello](https://www.example.org/hello). + +- If you were to move this file (along with its accompanying .htaccess file or the like) into a subfolder (e.g. public_html/demo/index.php), Leaf's Core router will mount all routes onto the current path (e.g. /demo) and thus repsond to [https://www.example.org/demo](https://www.example.org/demo) and [https://www.example.org/demo/hello](https://www.example.org/demo/hello). There's no need for `$app->mount(…)` in this case. + +## Disabling subfolder support + +In case you don't want Leaf's Core router to automatically adapt itself to the folder its being placed in, it's possible to manually override the basePath by calling `setBasePath()`. This is necessary in the (uncommon) situation where your entry script and your entry URLs are not tightly coupled (e.g. when the entry script is placed into a subfolder that does not need be part of the URLs it responds to).. + +```php +// Override auto base path detection +$app->setBasePath('/'); + +$app->get('/', function () { echo 'Index'; }); +$app->get('/hello', function () { echo 'Hello!'; }); + +$app->run(); +``` + +If you were to place this file into a subfolder (e.g. public_html/some/sub/folder/index.php), it will still mount the routes onto the domain root (e.g. /) and thus respond to [https://www.example.org/](https://www.example.org/) and [https://www.example.org/hello](https://www.example.org/hello) (given that your .htaccess file – placed at the document root level – rewrites requests to it) diff --git a/apps/docs/src/modules/router/sub-patterns.md b/apps/docs/src/modules/router/sub-patterns.md new file mode 100755 index 0000000..d34add4 --- /dev/null +++ b/apps/docs/src/modules/router/sub-patterns.md @@ -0,0 +1,41 @@ +--- +title: "Optional Route Subpatterns" +--- + + + +*This guide assumes you have read [Simple Routing](/docs/routing/) and [dynamic routing](/docs/routing/dynamic)* + +Route subpatterns can be made optional by making the subpatterns optional by adding a ? after them. Think of blog URLs in the form of /blog(/year)(/month)(/day)(/slug): + +```php +$app->get('/blog(/\d+)?(/\d+)?(/\d+)?(/[a-z0-9_-]+)?', function ($year = null, $month = null, $day = null, $slug = null) { + if (!$year) { echo 'Blog overview'; return; } + if (!$month) { echo 'Blog year overview'; return; } + if (!$day) { echo 'Blog month overview'; return; } + if (!$slug) { echo 'Blog day overview'; return; } + echo 'Blogpost ' . htmlentities($slug) . ' detail'; +}); +``` + +The code snippet above responds to the URLs /blog, /blog/year, /blog/year/month, /blog/year/month/day, and /blog/year/month/day/slug. + +**Note**: With optional parameters it is important that the leading / of the subpatterns is put inside the subpattern itself. Don't forget to set default values for the optional parameters. + +The code snipped above unfortunately also responds to URLs like /blog/foo and states that the overview needs to be shown - which is incorrect. Optional subpatterns can be made successive by extending the parenthesized subpatterns so that they contain the other optional subpatterns: The pattern should resemble /blog(/year(/month(/day(/slug)))) instead of the previous /blog(/year)(/month)(/day)(/slug): + +```php +$app->get('/blog(/\d+(/\d+(/\d+(/[a-z0-9_-]+)?)?)?)?', function ($year = null, $month = null, $day = null, $slug = null) { + // ... +}); +``` + +**Note**: It is highly recommended to always define successive optional parameters. + +To make things complete use [quantifiers](http://www.php.net/manual/en/regexp.reference.repetition.php) to require the correct amount of numbers in the URL: + +```php +$app->get('/blog(/\d{4}(/\d{2}(/\d{2}(/[a-z0-9_-]+)?)?)?)?', function ($year = null, $month = null, $day = null, $slug = null) { + // ... +}); +``` diff --git a/apps/docs/src/modules/router/sub-routing.md b/apps/docs/src/modules/router/sub-routing.md new file mode 100755 index 0000000..7d752e8 --- /dev/null +++ b/apps/docs/src/modules/router/sub-routing.md @@ -0,0 +1,58 @@ +# Sub-routing + + +Use `app()->mount($baseroute, $fn)` or `app()->group` to mount a collection of routes onto a subroute pattern. The subroute pattern is prefixed onto all following routes defined in the scope. e.g. Mounting a callback $fn onto `/movies` will prefix `/movies` onto all following routes. + +```php +app()->mount('/movies', function () { + // will result in '/movies/' + app()->get('/', function () { + echo 'movies overview'; + }); + + // will result in '/movies/id' + app()->get('/(\d+)', function ($id) { + echo 'movie id ' . htmlentities($id); + }); +}); +``` + +Nesting of subroutes is possible, just define a second `app()->mount()` in the callback function that's already contained within a preceding `app()->mount()`. Also, Note that nested subroutes currently don't support dynamic url patterns, so, you can only do something like this. + +```php +app()->group('/user', function () { + app()->get('/', function () { + response()->markup('no user id'); + }); + + app()->get('/(\d+)', function ($id) { + response()->markup("user $id"); + }); + + app()->mount('/settings', function () { + app()->get('/privacy', function () { + response()->markup('Privacy Settings'); + }); + + app()->get('/notification', function () { + response()->markup("Notification Settings"); + }); + }); +}); +``` + +## Group Namespaces + +You can now select namespaces for individual groups of routes. Usually, a namespace is given to all your routes, however, a group may need a different namespace for it's controllers and that is what Leaf gives you. + +```php +app()->setNamespace("App\Controllers"); + +app()->group("/user", ["namespace" => "Lib\Controllers", function () { + // controller here will be Lib\Controllers\FormsController + app()->get("/form", "FormsController@index"); +}]); + +// controller here will be App\Controllers\FormsController +app()->get("/form", "FormsController@index"); +``` diff --git a/apps/docs/src/modules/session/flash.md b/apps/docs/src/modules/session/flash.md new file mode 100755 index 0000000..20b54e1 --- /dev/null +++ b/apps/docs/src/modules/session/flash.md @@ -0,0 +1,211 @@ + +# Leaf Flash + +Session flash messages are temporary messages that are stored in the session and displayed to the user for a short duration, usually just until they are shown once. These messages are commonly used to provide feedback or notifications to the user after a specific action or event, such as successfully completing a form submission, encountering an error, or performing a specific operation. + +Leaf session provides a simple interface for creating and managing flash messages. Flash messages are stored in the session and can be retrieved and displayed in the view. + +## Config + +Leaf Flash comes with a default configuration that works out of the box. However, you can change the configuration to suit your needs. You can skip this section if you're using the default configuration. + +Using the `config()` method, you can change where Leaf stores flash messages in session, the keys for messages and saved content. The available options are: + +- key: The key to save flash array in session. Default: `leaf.flash`, +- default: The key for default flash messages. Default: `message`, +- saved: The key for saved flash messages. Default: `leaf.flashSaved`, + +
+ +```php +flash()->config([ + 'key' => 'my_flash_items' +]); + +flash()->set('This is my message'); + +// logging $_SESSION +=> ['my_flash_items' => ['message' => 'This is my message']] +``` + +
+
+ +```php +use Leaf\Flash; + +Flash::config([ + 'key' => 'my_flash_items' +]); + +Flash::set('This is my message'); + +// logging $_SESSION +=> ['my_flash_items' => ['message' => 'This is my message']] +``` + +
+ +**Flash searches for an existing session and creates one if there's no active session.** + +## Adding a new flash + +Leaf Flash provides a `set()` method for adding new flash messages to the session. The `set()` method accepts two arguments: + +- The item to flash +- The key to save it under. The key is optional and defaults to `message`. + +
+ +```php +flash()->set('This is my message'); +flash()->set('This is my message', 'info'); + +// accepts different types of data +flash()->set($userObject); +flash()->set($userArray); +flash()->set($userString); +flash()->set($userInt); +``` + +
+
+ +```php +Leaf\Flash::set('This is my message'); +Leaf\Flash::set('This is my message', 'info'); + +// accepts different types of data +Leaf\Flash::set($userObject); +Leaf\Flash::set($userArray); +Leaf\Flash::set($userString); +Leaf\Flash::set($userInt); +``` + +
+ +Leaf flash allows you to keep multiple flash messages at the same time. They won't be removed until you show them. To do this, you will need to set different keys for each flash message. + +
+ +```php +flash()->set('This is my message', 'info'); +flash()->set('This is my message', 'error'); +flash()->set('This is my message', 'success'); +``` + +
+
+ +```php +Leaf\Flash::set('This is my message', 'info'); +Leaf\Flash::set('This is my message', 'error'); +Leaf\Flash::set('This is my message', 'success'); +``` + +
+ +## Displaying a flash message + +Leaf Flash provides a `display()` method that you can use to retrieve your session flash. As soon as the flash message is retrieved, it is removed from the session which means it won't show on the next load. + +
+ +```php +flash()->set('message 1'); +flash()->set('message 2', 'info'); + +echo flash()->display(); // message 1 +echo flash()->display('info'); // message 2 +``` + +
+
+ +```php +Leaf\Flash::set('message 1'); +Leaf\Flash::set('message 2', 'info'); + +echo Leaf\Flash::display(); // message 1 +echo Leaf\Flash::display('info'); // message 2 +``` + +
+ +## Remove a flash message + +The `unset()` method allows you to remove a flash message. Note that flash messages are automatically removed when you display them, so you might never need to use this method. + +
+ +```php +flash()->unset(); +flash()->unset('info'); // unset a specific flash message +``` + +
+
+ +```php +Leaf\Flash::unset(); +Leaf\Flash::unset('info'); // unset a specific flash message +``` + +
+ +## Permanent flash messages + +Flash also allows you to create a message that stays in session till it is manually removed. You can add permanently stored flash data using the `save()` method. Note that unlike regular flashes, there can be only one saved flash message. + +
+ +```php +flash()->save('This is my message'); +``` + +
+
+ +```php +Leaf\Flash::save('This is my message'); +``` + +
+ +## Removing saved flash messages + +You can use the `clearSaved()` method to remove saved flash messages. + +
+ +```php +flash()->clearSaved(); +``` + +
+
+ +```php +Leaf\Flash::clearSaved(); +``` + +
+ +## Displaying saved flash messages + +You can use the `displaySaved()` method to display saved flash messages. + +
+ +```php +echo flash()->displaySaved(); +``` + +
+
+ +```php +echo Leaf\Flash::displaySaved(); +``` + +
diff --git a/apps/docs/src/modules/session/index.md b/apps/docs/src/modules/session/index.md new file mode 100755 index 0000000..75dd700 --- /dev/null +++ b/apps/docs/src/modules/session/index.md @@ -0,0 +1,649 @@ + +# Leaf Session + +Given that HTTP-driven applications lack statefulness, sessions offer a means of retaining user-related data throughout multiple requests. Usually, this user information is stored in some sort of persistent storage so it can be accessed on subsequent requests. + +Although using sessions in PHP is fairly straightforward, it can be a bit cumbersome at times. Leaf session aims to make working with sessions in PHP much easier, more enjoyable, and more testable. For that reason, Leaf provides the session module to help you manage sessions in your Leaf apps. *Leaf session is 100% compatible with native PHP sessions.* + +## Installation + +You can install leaf session with the Leaf CLI tool: + +```bash +leaf install session +``` + +or with composer: + +```bash +composer require leafs/session +``` + +## Functional Mode + +When using Leaf session in a Leaf 3 app, you can use the functional mode. This allows you to use the session module without having to initialize it. This gives you access to the `session()` and [`flash()`](/modules/session/flash#functional-mode) helper functions. + +## Starting a new session + +Leaf's session module smartly handles session initialization. It checks if a session has already been started and starts a new one if it hasn't. This means you don't have to worry about starting a session before using it. Note that Leaf will not start a session until you actually use it. This is to prevent unnecessary session initialization. + +You also don't have to worry about messing up your sessions since Leaf session is 100% compatible with native PHP sessions. + +### Manually starting a session + +If you want to manually start a session, you can use the `start()` method. + +
+ +```php +$session = new Leaf\Http\Session; + +... + +$session->start(); +``` + +
+
+ +```php +session()->start(); +``` + +
+ +## Retrieving session data + +Leaf session provides 3 ways to retrieve session data: + +- The `get()` method +- The `retrieve()` method +- The `body()` method + +### The `get()` method + +`get()` is a simple method that returns a session value. It takes in 3 parameters: + +- The name of the value to return. It works just like how `$_SESSION['key']` does. +- The default value to use if it doesn't exist. +- A boolean value indicating whether to sanitize the value or not. It has a default value of true. + +
+ +```php +$session = new Leaf\Http\Session; + +... + +$item = $session->get('item'); +$item = $session->get('item', 'default value'); +$item = $session->get('item', 'default value', false); +``` + +
+
+ +```php +$item = session()->get('item'); +$item = session()->get('item', 'default value'); +$item = session()->get('item', 'default value', false); +``` + +
+ +You can also return many fields at once from the session by passing an array of keys: + +
+ +```php{5} +$session = new Leaf\Http\Session; + +... + +$user = $session->get(['username', 'email']); + +... + +echo $user['username']; +``` + +
+
+ +```php{1} +$user = session()->get(['username', 'email']); + +... + +echo $user['username']; +``` + +
+ +### The `retrieve()` method + +`retrieve()` returns the requested value just like `get()` above **and then immediately removes it from the session**, so it can only be retrieved once. + +It takes in three parameters: + +- The name of the value to return. It works just like how `$_SESSION['key']` does. +- The default value to use if it doesn't exist. +- A boolean value indicating whether to sanitize the value or not. It has a default value of true. + +
+ +```php +$session = new Leaf\Http\Session; + +... + +$item = $session->retrieve('item'); +$item = $session->retrieve('item', 'default value'); +$item = $session->retrieve('item', 'default value', false); +``` + +
+
+ +```php +$item = session()->retrieve('item'); +$item = session()->retrieve('item', 'default value'); +$item = session()->retrieve('item', 'default value', false); +``` + +
+ +### The `body()` method + +This method returns the {key => value} pairs of all the session data including any CSRF data as an associative array. + +
+ +```php +$session = new Leaf\Http\Session; + +... + +$body = $session->body(); +``` + +
+
+ +```php +$body = session()->body(); +``` + +
+ +## Check if a session value exists + +You can check if a session value exists with the `has()` method. It takes in the name of the value to check for and returns a boolean value. + +
+ +```php +$session = new Leaf\Http\Session; + +... + +if ($session->has('item')) { + // do something +} +``` + +
+
+ +```php +if (session()->has('item')) { + // do something +} +``` + +
+ +By default, `has()` will return `true` **ONLY if the value exists and is NOT empty**. You can change this behaviour by passing in `false` as the second parameter. This boolean value indicates whether to check if the value is empty or not. It has a default value of true. + +
+ +```php +$session = new Leaf\Http\Session; + +... + +if ($session->has('item', false)) { + // do something +} +``` + +
+
+ +```php +if (session()->has('item', false)) { + // do something +} +``` + +
+ +## Setting session data + +The session module provides a simple way to set session data using the `set()` method. It takes in two parameters: + +- The name of the value to set. +- The value to set. + +
+ +```php +$session = new Leaf\Http\Session; + +... + +$session->set('item', 'value'); +``` + +
+
+ +```php +session()->set('item', 'value'); +``` + +
+ +You can also set multiple values at once by passing in an array: + +
+ +```php +$session = new Leaf\Http\Session; + +... + +$session->set([ + 'item1' => 'value1', + 'item2' => 'value2' +]); +``` + +
+
+ +```php +session()->set([ + 'item1' => 'value1', + 'item2' => 'value2' +]); +``` + +
+ +## Removing session data + +Leaf provides a simple `unset()` method to remove session data. It takes in the name of the value to remove. + +
+ +```php +$session = new Leaf\Http\Session; + +... + +// remove single item +$session->unset('email'); + +// remove multiple items +$session->unset(['name', 'email']); +``` + +
+
+ +```php +// remove single item +session()->unset('email'); + +// remove multiple items +session()->unset(['name', 'email']); +``` + +
+ +We also added the `delete()` method as an alias for `unset()`. They both do the same thing. + +
+ +```php +$session = new Leaf\Http\Session; + +... + +// remove single item +$session->delete('email'); + +// remove multiple items +$session->delete(['name', 'email']); +``` + +
+
+ +```php +// remove single item +session()->delete('email'); + +// remove multiple items +session()->delete(['name', 'email']); +``` + +
+ +## Wiping session data + +Leaf Session allows you to wipe all session data with the `clear()` method. This method completely deletes all session information, but does not destroy the session itself. + +
+ +```php +$session = new Leaf\Http\Session; + +... + +$session->clear(); + +echo json_encode($_SESSION); // {} +``` + +
+
+ +```php +session()->clear(); + +echo json_encode($_SESSION); // {} +``` + +
+ +## Working with Arrays + +Leaf session allows you to neatly handle working with arrays in session. You can set, retrieve and validate session values from arrays by using the dot notation: + +
+ +```php +$session = new Leaf\Http\Session; + +... + +// $user = ['username' => 'leaf', 'email' => 'leaf@example']; + +$username = $session->get('user.username'); +$email = $session->get('user.email'); +``` + +
+
+ +```php +// $user = ['username' => 'leaf', 'email' => 'leaf@example']; + +$username = session()->get('user.username'); +$email = session()->get('user.email'); +``` + +
+ +This works for `retrieve()`, `has()`, `set()` and `unset()` as well. + +**has:** + +
+ +```php +$session = new Leaf\Http\Session; + +... + +if ($session->has('user.username')) { + // do something +} + +// allow empty values +if ($session->has('user.username', false)) { + // do something +} +``` + +
+
+ +```php +if (session()->has('user.username')) { + // do something +} + +// allow empty values +if (session()->has('user.username', false)) { + // do something +} +``` + +
+ +**Set:** + +
+ +```php +$session = new Leaf\Http\Session; + +... + +$session->set('user.username', 'leaf'); +``` + +
+
+ +```php +session()->set('user.username', 'leaf'); +``` + +
+ +**Unset:** + +
+ +```php +$session = new Leaf\Http\Session; + +... + +$session->unset('user.username'); +``` + +
+
+ +```php +session()->unset('user.username'); +``` + +
+ +## Session flash + +Leaf session also provides built-in support for flash messages. Flash messages are temporary messages that are displayed to the user after an action has been performed. They are usually used to display success or error messages to the user. + +
+ +```php +$session = new Leaf\Http\Session; + +$session->flash("my flash message"); + +echo $session->flash(); // my flash message +``` + +
+
+ +```php +session()->flash("my flash message"); + +echo session()->flash(); // my flash message +``` + +
+ +For more advanced uses of flash messages, you can check out the [Flash Session docs](/modules/session/flash). + +## Session Internals + +Leaf session provides a few methods to help you manage sessions. These methods are: + +### reset() + +You can use the `reset()` method to re-initialize a session. + +
+ +```php +$app->post('/session/reset', function () use($session) { + $session->reset(); +}); +``` + +
+
+ +```php +app()->post('/session/reset', function () { + session()->reset(); +}); +``` + +
+ +### id() + +`id()` sets and/or returns the current session id. It takes in an **optional** parameter: the ID to overwrite the session id. + +
+ +```php +$id = $session->id(); +``` + +
+
+ +```php +$id = session()->id(); +``` + +
+ +If the session id is not set, this will generate and return a new session id. However, if the session id is already set, it will just return it. + +You can also set your own session id with this syntax below. It will be returned as well, so you can keep it in a variable. + +
+ +```php +$id = $session->id("new session id"); +``` + +
+
+ +```php +$id = session()->id("new session id"); +``` + +
+ +### regenerate() + +This method generates a new session id. It takes in a boolean parameter which indicates whether to delete all session data or not (has a default of false) + +
+ +```php +$session->regenerate(); +$session->regenerate(false); +$session->regenerate(true); // will clear all session data +``` + +
+
+ +```php +session()->regenerate(); +session()->regenerate(false); +session()->regenerate(true); // will clear all session data +``` + +
+ +### destroy() + +You can end a session with `destroy`. + +
+ +```php +$session->destroy(); +``` + +
+
+ +```php +session()->destroy(); +``` + +
+ +### encode() + +This feature allows you to encode the current session data as a string. + +
+ +```php +$sessionString = $session->encode(); +``` + +
+
+ +```php +$sessionString = session()->encode(); +``` + +
+ +### decode() + +You can also decode a serialized session using the `decode()` method. It takes in the string to decode and returns true on success, false on failure. + +
+ +```php +$success = $session->decode($sessionString); +``` + +
+
+ +```php +$success = session()->decode($sessionString); +``` + +
diff --git a/apps/docs/src/modules/views/bareui/index.md b/apps/docs/src/modules/views/bareui/index.md new file mode 100644 index 0000000..7b8d0c5 --- /dev/null +++ b/apps/docs/src/modules/views/bareui/index.md @@ -0,0 +1,281 @@ +# BareUI + + + + + +Most templating engines out there ship with a nice syntax, handy ways to use expressions, layouts and code blocks, however, there's one problem: speed! Bare UI is here to solve that. Bare UI is a barebones templating engine focused on speed, speed and more speed! It lacks all the syntactic sugar added in other engines like blade, but it also requires no compiling, no caching, just speed! + +
+New to template engines? + +Watch this video by Dave Hollingworth as an introduction to template engines. + + +
+ +## Installation + +You can always install BareUI with the Leaf CLI: + +```bash +leaf install bareui +``` + +Or with composer: + +```bash +composer require leafs/bareui +``` + +## Usage with Leaf MVC + +Leaf MVC and Leaf API come with [Leaf Blade](/modules/views/blade/) out of the box, however, since Leaf is modular at it's core, Leaf MVC and Leaf API allow you easily swap out the blade engine for BareUI (or any other view engine). To do this, you need to swap out the blade engine in your `public/index.php`: + +```php +// public/index.php +Leaf\View::attach(\Leaf\Blade::class); // remove this +Leaf\View::attach(\Leaf\BareUI::class); // add this +``` + +After this, you will also need to change the config in `config/view.php`: + +```php + \Leaf\BareUI::class, + + /* + |-------------------------------------------------------------------------- + | Custom config method + |-------------------------------------------------------------------------- + | + | Configuration for your templating engine. + | + */ + 'config' => function ($config) { + View::bareui()->config($config['views']); + }, + + /* + |-------------------------------------------------------------------------- + | Custom render method + |-------------------------------------------------------------------------- + | + | This render method is triggered whenever render() is called + | in your app if you're using a custom view engine. + | + */ + 'render' => function ($view, $data = []) { + return View::bareui()->render($view, $data); + }, +]; +``` + +This will tell Leaf how to work with BareUI. + +## Introduction + +BareUI takes a fully static approach which means you can use all of it's methods without having to initilaize the package first. Also, there are only 2 things you need to keep in mind about Bare UI + +::: tip Quick Tip +BareUI has deep integrations with Leaf core by default. This means that if you're using BareUI in leaf, it will always be available on the leaf instance as `template`. + +
+ +```php +app()->template->config('path', './views'); +``` + +
+
+ +```php +$app->template->config('path', './views'); +``` + +
+ +::: + +### config + +This method allows you to configure bare ui. + +```php +Leaf\BareUI::config('path', './templates'); + +// or + +Leaf\BareUI::config(['path' => './templates', ...]); +``` + +#### Available options + +There are currently only 2 options to configure. + +- path (string): This tells leaf where to look for templates. +- params (array): These are a bunch of base parameters that will be available in all of your templates. + +
+ +```php +// app() will be available in all templates +app()->template->config('params', ['app' => function () { + // do something + return app(); +}]); +``` + +
+
+ +```php +// app() will be available in all templates +$app->template->config('params', ['app' => function () use ($app) { + // do something + return $app; +}]); +``` + +
+ +`template.view.php` + +
+ +```php +template->render('error'); +} +``` + +
+
+ +```php +template->render('error'); +} +``` + +
+ +### render + +As the name implies, this method allows you to return an bare ui. It takes in the UI to render. + +::: tip NOTE +BareUI files end with `.view.php`. This allows you easily distinguish them from the rest of your files. +::: + +Let's look at a simple template: + +`welcome.view.php` + +```php + + + + + + + Document + + + + + +``` + +We can render this from where we want the UI to show: + +
+ +```php +echo app()->template->render("welcome", [ + "var" => "Something", +]); +``` + +
+
+ +```php +echo $app->template->render('welcome', [ + 'var' => 'Something', +]); +``` + +
+ +Since bare UI templates are just raw PHP, you can do stuff like this: + +
+ +```php +echo app()->template->render('app', [ + 'items' => ['i1', 'i2'], +]); +``` + +
+
+ +```php +echo $app->template->render('app', [ + 'items' => ['i1', 'i2'], +]); +``` + +
+ +`app.view.php` + +```php + + + + + + + Document + + + 0) : ?> +
    + +
  • + +
+ +

There are no items

+ + + +``` diff --git a/apps/docs/src/modules/views/blade/index.md b/apps/docs/src/modules/views/blade/index.md new file mode 100755 index 0000000..1bbd30f --- /dev/null +++ b/apps/docs/src/modules/views/blade/index.md @@ -0,0 +1,116 @@ +# Leaf Blade + + + + + +[Blade](https://laravel.com/docs/10.x/blade#introduction) is the simple, yet powerful templating engine that is included with Laravel. Unlike some PHP templating engines, Blade does not restrict you from using plain PHP code in your templates. In fact, all Blade templates are compiled into plain PHP code and cached until they are modified, meaning Blade adds essentially zero overhead to your application. Blade template files use the `.blade.php` file extension. + +Leaf Blade is a port of the [jenssegers/blade](https://github.com/jenssegers/blade) package that allows you to use blade templates in your Leaf PHP projects. + + + +## Usage with Leaf MVC + +Leaf MVC and Leaf API come with blade support out of the box. You can use blade templates in your Leaf MVC and Leaf API projects without any extra configuration. + +All you need to do is create a new blade file in your `app/views` folder and you're good to go! You can also create sub-folders in your `app/views` folder to organize your blade files into multiple sections. + +You can skip the installation and setup sections if you're using Leaf MVC or Leaf API. + +## Usage with Leaf Core + +Since Leaf's core doesn't give you any structure, you'll have to set up blade yourself. Don't worry, it's pretty easy. All you need to do is install blade, configure it to match your project's setup and you're good to go. + +You can install leaf blade with the Leaf CLI: + +```bash +leaf install blade +``` + +Or with composer: + +```bash +composer require leafs/blade +``` + +After this, you simply need to initialize blade: + +```php +$blade = new Leaf\Blade(); +``` + +## The Blade class + +The Blade class takes two parameters on initialization. The first is the path to your view files, and the second is the path to your cached files. + +```php +use Leaf\Blade; + +$blade = new Blade('views', 'storage/cache'); +``` + +If you want to initialize the package with the default settings, you can simply do: + +```php +$blade = new Leaf\Blade(); +``` + +And then configure it later using the `configure()` method: + +```php +$blade->configure('app/views', 'app/views/cache'); +``` + +## Rendering a blade view + +Once you have pointed Blade to the location of your view files, you may easily render them using the `make` method. The `make` method accepts the name of the view file as its first argument, and an array of data as its second argument. The data array will be extracted into variables that may be used within the view file: + +```php +echo $blade->make('index', ['name' => 'Michael Darko'])->render(); +``` + +Alternatively you can use the shorthand `render()` method: + +```php +echo $blade->render('index', ['name' => 'Michael Darko']); +``` + +The examples above will look for an `index.blade.php` file in the `views` directory. Within the view, you can access the `name` variable like so: + +```html + + + + {{ $name }} + + +
{{ $name }}
+ + +``` + +## Extending Blade + +Blade allows you to define custom directives using the `directive()` method. When the Blade compiler encounters the custom directive, it will call the provided callback with the expression that the directive contains. The callback is free to return the value of its contents however you like: + +```php +$blade->directive('datetime', function ($expression) { + return "format('F d, Y g:i a'); ?>"; +}); +``` + +Which allows you to use the following in your blade template: + +```html +Current date: @datetime($date) +``` + +The Blade instance passes all methods to the internal view factory. So methods such as exists, file, share, composer and creator are available as well. Check out the [original documentation](http://laravel.com/docs/5.8/blade) for more information. diff --git a/apps/docs/src/modules/views/index.md b/apps/docs/src/modules/views/index.md new file mode 100644 index 0000000..e9cbfde --- /dev/null +++ b/apps/docs/src/modules/views/index.md @@ -0,0 +1,46 @@ +# Frontend + +As a backend inclined framework, leaf has always focused on tooling for building APIs and backend applications. However, as frontend frameworks and libraries have become more popular, leaf has also evolved to support some modern frontend tooling which can be used to build amazing full-stack applications. + +This section of the docs will cover all the frontend tooling leaf has to offer. + +## Templating Engines + +Over the years, leaf has had suport for many built-in templating engines. All of these templating engines have first class support in leaf and can be used to build amazing frontend applications. These engines are available as separate packages and can be installed using composer, which means you can use them outside leaf apps as well. + +Depending on your needs, you may want to go with a particular templating engine. + +| Engine | Use case | +| -------------------------------- | -------------------------------------------- | +| [bareui](/modules/views/bareui/) | Blazing fast templating with no compile time | +| [veins](/modules/views/veins/) | Lightweight but powerful templating engine | +| [blade](/modules/views/blade/) | Laravel blade templating engine for leaf | + +### BareUI vs Veins vs Blade + +| Engine | Speed | Cool Magic | Lightweight | Editor Support | +| -------------------------------- | :-----: | :----------: | :-----------: | :------------: | +| [bareui](/modules/views/bareui/) | ⚡️ | ❌ | ⚡️ | ⚡️ | +| [veins](/modules/views/veins/) | 🔥 | 🔥 | 🔥 | 🔥 | +| [blade](/modules/views/blade/) | ❌ | ⚡️ | 🔥 | ⚡️ | + +### Third Party Templating Engines + +Although Leaf has some preferred templating engines, you can use any templating engine you want with leaf. Here are some of the most popular templating engines you can use with leaf: + +- [Twig](https://twig.symfony.com/) +- [Smarty](https://www.smarty.net/) + +You can check out the [third party templating engines](/modules/views/third-party/) section of the docs to learn how to use any templating engine with leaf. + +## Asset Bundling + +[Vite](https://vitejs.dev/) is a modern build tool for frontend applications. It aims to provide a faster and leaner development experience for modern web projects. Leaf allows you to bundle your CSS and JS assets using vite, using the powerful [leaf-vite](/modules/views/vite/) module. + +[> Read the docs](/modules/views/vite/) + +## Frontend Frameworks + +Leaf has support for some of the most popular frontend frameworks using [Inertia.js](https://inertiajs.com/). Inertia.js is a framework that allows you to create fully client-side rendered, single-page apps, without much of the complexity that comes with modern SPAs. It does this by leveraging Leaf's server-side rendering capabilities. + +[> Read the docs](/modules/views/inertia/) diff --git a/apps/docs/src/modules/views/inertia/index.md b/apps/docs/src/modules/views/inertia/index.md new file mode 100644 index 0000000..02d7aa3 --- /dev/null +++ b/apps/docs/src/modules/views/inertia/index.md @@ -0,0 +1,332 @@ +# Inertia JS + +[Inertia](https://inertiajs.com/) is a new approach to building classic server-driven web apps. It allows you to create fully client-side rendered, single-page apps, without the complexity that comes with modern SPAs. It does this by leveraging existing server-side patterns that you already love. + +## Usage with Leaf MVC + +Leaf MVC and Leaf API come with built-in support for Inertia.js. This means you can build amazing frontend applications using Inertia.js and Leaf right out of the box without any extra configuration. + +Leaf CLI comes with a `view:install` command to help you get on your way as fast as possible. Since inertia provides support for a variety of frontend frameworks, this command will help you install and setup inertia for your preferred frontend framework. + +To get started, run: + +```bash +php leaf view:install +``` + +Or with the Leaf CLI: + +```bash +leaf view:install +``` + +This will prompt you to select your preferred frontend framework. You can choose from Vue, React, and Svelte. There is also support for styling with Tailwind/Bootstrap. After selecting your preferred framework, Leaf will automatically install and setup inertia for you, including examples for you to get started with. + +::: tip view:install +If you know the specific frontend framework you want to use, you can pass the `--{framework}` flag to the `view:install` command. For example, to install inertia for Vue, you can run: + +```bash +php leaf view:install --vue +``` + +::: + +To run your app, you should start the server for both your frontend and backend. To start the backend server, run: + +```bash +php leaf serve + +# or with the Leaf CLI + +leaf serve +``` + +To start the frontend server, run: + +```bash +npm run dev + +# or with the Leaf CLI + +php leaf view:dev +leaf view:dev +``` + +## Usage with Leaf Core + +Inertia has been fine-tuned to work with Leaf MVC and Leaf API. However, you can still use inertia with Leaf Core, however, you'll need to install and setup inertia yourself. There are 2 ways to do this: + +- [Using the Leaf CLI](#using-the-leaf-cli) +- [Manually setting up inertia](#manually-setting-up-inertia) + +::: tip This guide +This guide also applies to using Inertia outside of Leaf applications. You can use this guide to setup inertia for any PHP application. +::: + +### Using the Leaf CLI + +The Leaf CLI comes with a `view:install` command to help you get on your way as fast as possible. Since inertia provides support for a variety of frontend frameworks, this command will help you install and setup inertia for your preferred frontend framework. + +To get started, run: + +```bash +leaf view:install +``` + +This will prompt you to select your preferred frontend framework. You can choose from Vue, React, and Svelte. There is also support for styling with Tailwind/Bootstrap. After selecting your preferred framework, Leaf will automatically install and setup inertia for you, including examples for you to get started with. + +::: tip view:install +If you know the specific frontend framework you want to use, you can pass the `--{framework}` flag to the `view:install` command. For example, to install inertia for Vue, you can run: + +```bash +leaf view:install --vue +``` + +::: + +Using this will install and setup Vite and inertia for you, however, depending on your own setup, you might need to make some changes to the setup. For example, you might need to change the entry-point for Vite. You can do this by changing the `input` option in your vite config file. + +```js +leaf({ + input: ['js/app.jsx'], + ... +}), +``` + +Read more about setting up Vite [here](/modules/views/vite/#vite-config). + +To run your app, you should start the server for both your frontend and backend. To start the backend server, run: + +```bash +leaf serve +``` + +To start the frontend server, run: + +```bash +npm run dev +``` + +### Manually setting up inertia + +If you don't want to use the Leaf CLI, you can manually setup inertia. This guide will show you how to setup inertia with Vite and React. You can use this guide to setup inertia with any frontend framework. + +### Setting up Vite + +To get started, you need to setup Vite. We have a Leaf plugin that takes care of a lot of the heavy lifting for you. We have a detailed guide on how to setup vite with Leaf [here](/modules/views/vite/#usage-with-leaf-core). + +```bash +npm i -D vite @leafphp/vite-plugin +leaf install vite +``` + +### Vite Config + +The [Leaf Vite docs](/modules/views/vite/#vite-config) have a detailed guide on how to setup vite config files. You should however note that for the best developer experience, you should point Vite to your view directory so you can enjoy hot module reloading. + +```js +... + +export default defineConfig({ + plugins: [ + leaf({ + ... + refresh: ['yourviews/**'], + }), + ], +}); +``` + +Also note that your entry-point should be your base JavaScript file. For the best experience, CSS and other assets should be imported from your base JavaScript file. + +```js +leaf({ + input: ['js/app.jsx'], + ... +}), +``` + +### Setting up Inertia + +To setup inertia, you need to install the inertia package for whatever frontend framework you want to use, together with the Vite plugin for that framework. For example, if you want to use React, you should install the Inertia React package, React Vite plugin as well as React itself: + +```bash +npm i react react-dom @inertiajs/react @vitejs/plugin-react +``` + +You should also install the Leaf Inertia PHP adapter: + +```bash +leaf install inertia +``` + +Or with composer: + +```bash +composer require leafs/inertia +``` + +After adding the React Vite plugin, you should add it to your vite config file: + +```js{3,10} +import { defineConfig } from 'vite'; +import leaf from '@leafphp/vite-plugin'; +import react from '@vitejs/plugin-react'; + +export default defineConfig({ + plugins: [ + leaf({ + ... + }), + react(), + ], +}); +``` + +### Setting up your base JavaScript file + +You should create a base JavaScript file that will be used to mount your app. This file should import your CSS and other assets. For example, if you're using React, your base JavaScript file should look like this: + +```jsx +import { createRoot } from 'react-dom/client'; +import { createInertiaApp } from '@inertiajs/react'; +import { resolvePageComponent } from '@leafphp/vite-plugin/inertia-helpers'; + +const appName = import.meta.env.VITE_APP_NAME || 'Leaf PHP'; + +createInertiaApp({ + title: (title) => `${title} - ${appName}`, + resolve: (name) => + resolvePageComponent( + `./DIRECTORYFORCOMPONENTS/${name}.jsx`, + import.meta.glob('./DIRECTORYFORCOMPONENTS/**/*.jsx') + ), + setup({ el, App, props }) { + createRoot(el).render(); + }, +}); +``` + +`DIRECTORYFORCOMPONENTS` is the directory where your React pages are located. You can change this to whatever you want. You should also change the `setup` function to match your frontend framework. For example, if you're using Vue, you should change the `setup` function to: + +```js +setup({ el, App, props }) { + createApp({ + render: () => h(App, props), + }).mount(el); +}, +``` + +### Setting up your base PHP file + +You should create a base PHP file that will be used to render your app. By default, the Leaf Inertia PHP adapter will look for a file named `_inertia.view.php` in your views directory. You can change this by passing the path to your base PHP file to the `Inertia::setRoot` method. + +```php +Inertia::setRoot('myfiles/_base'); +``` + +Since the Leaf Inertia PHP adapter is built using the [Bare UI engine](/modules/views/bareui/), your base file needs to maintain the `.view.php` extension. For example, if you're using React, your base PHP file should look like this: + +```php + + + + + + + Document + + + dispatch($page); + } + + if ($__inertiaSsrResponse) { + echo $__inertiaSsrResponse->head; + } + ?> + + + + dispatch($page); + } + + if ($__inertiaSsrResponse) { + echo $__inertiaSsrResponse->body; + } else { + echo '
'; + } + ?> + + + +``` + +This might look pretty ugly, but you'll never have to touch this file again. You can also use the Leaf CLI to generate this file for you: + +```bash +leaf view:install --inertia +``` + +### Setting up your frontend framework + +In the setup above, we told Inertia to look for our frontend framework files in `./DIRECTORYFORCOMPONENTS/`. You should create this directory and add your frontend framework files to it. For example, if you're using React, you should create a file named `Home.jsx` in this directory: + +```jsx +const Home = () => { + return ( +
+

Hello World

+
+ ); +}; + +export default Home; +``` + +## Setting up your routes + +Your routing does not change when using Inertia. You can use the same routing you use for your backend. For example, if you're using Leaf, define your routes the same way: + +```php +app()->get('/', function () { + echo 'This is a route'; +}); +``` + +The only difference is that you need to return an Inertia response instead of a normal response. You can do this by using the `Inertia::render` method: + +```php +app()->get('/', function () { + Inertia::render('Home'); +}); +``` + +The `Home` argument is the name of the file you created in `./DIRECTORYFORCOMPONENTS/`. You can also pass data to your frontend framework by passing an array as the second argument to the `Inertia::render` method: + +```php +app()->get('/', function () { + return Inertia::render('Home', [ + 'name' => 'Leaf', + ]); +}); +``` + +You can then access this data in your frontend framework as props. For example, if you're using React, you can access the `name` prop like this: + +```jsx +const Home = ({ name }) => { + return ( +
+

Hello {name}

+
+ ); +}; + +export default Home; +``` diff --git a/apps/docs/src/modules/views/leaf-ui/index.md b/apps/docs/src/modules/views/leaf-ui/index.md new file mode 100644 index 0000000..b87def5 --- /dev/null +++ b/apps/docs/src/modules/views/leaf-ui/index.md @@ -0,0 +1,122 @@ + + +# Leaf UI Beta + +Leaf UI is a PHP library that allows you to build modern web apps and scaffold dynamic and interactive UIs using the same PHP you already know and love. It's fast, easy, and fun. Leaf UI follows the component-based UI paradigm, which makes it simple to build reusable components that sync with the DOM automatically. + + + +This guide only covers how to use Leaf UI in your Leaf apps. For a more detailed explanation of how Leaf UI works, including explanations of its core principles and concepts, check out the [Leaf UI documentation](https://ui.leafphp.dev). + +## Installation + +You can quickly install Leaf UI with the Leaf CLI: + +```bash +leaf install ui +``` + +Or with composer: + +```bash +composer require leafs/ui +``` + +## Getting Started + +To get started, you need to create a new Leaf UI component. A component is a reusable piece of your website or app's UI, such as a header, sidebar, or button. A component includes HTML markup and the business logic needed to make that markup interactive. You can think of a component as a self-contained module that encapsulates its own functionality, which can then be reused throughout your website or app. You can also pass data into a component, making it more dynamic and reusable. Check out the [Leaf UI documentation](https://ui.leafphp.dev/docs/essentials/components.html) for more information on components. + +To create a new component, we need to add a new class. Let's create a new component called `HelloWorld`: + +```php + +

Hello World!

+ + HTML; + } +} +``` + +We can make this component more dynamic by passing data into our view. Let's add a `greeting` property and a `sayHello()` method to our component and use it in our markup: + +```php +greeting = 'Hi World!'; + } + + public function render() + { + return << +

{{ $greeting }}

+ + + HTML; + } +} +``` + +## Rendering Components + +Now that we have our component, we can use it in our Leaf app. Let's create a new route and return our component. We can do this by calling `render()` on the `UI` class and passing in our component: + +
+ +```php +get('/', function() { + UI::render(new HelloWorld()); +}); + +$app->run(); +``` + +
+ +
+ +```php +get('/', function() { + UI::render(new HelloWorld()); +}); + +app()->run(); +``` + +
diff --git a/apps/docs/src/modules/views/third-party/index.md b/apps/docs/src/modules/views/third-party/index.md new file mode 100644 index 0000000..8e76250 --- /dev/null +++ b/apps/docs/src/modules/views/third-party/index.md @@ -0,0 +1,126 @@ +# Using third-party templates + +In the [previous section](/modules/views/), we talked about the template engines that Leaf supports as modules. However, you can use any template engine you want with the framework. In this section, we will show you how to use the [Smarty](https://www.smarty.net/) template engine with Leaf. + +## Install your engine + +To install Smarty, run the following command in your terminal: + +```bash +composer require smarty/smarty +``` + +## Usage with Leaf Core + +Usage with Leaf's core is as straightforward as it gets. All you need to do is create a new instance of Smarty and use it as you would normally use it. + +```php +setTemplateDir('/some/template/dir'); +$smarty->setConfigDir('/some/config/dir'); +$smarty->setCompileDir('/some/compile/dir'); +$smarty->setCacheDir('/some/cache/dir'); + +// where you want to display the template +$smarty->assign('name', 'Ned'); +$smarty->display('index.tpl'); +``` + +## Attaching your engine to Leaf + +Leaf comes with a view manager, that makes Leaf aware of any template engine you want to use. To attach Smarty to Leaf, you need to call the `attach` method on the view manager. You can do this in your `index.php` file: + +```php +assign('name', 'Ned'); +\Leaf\View::smarty()->display('index.tpl'); +``` + +## Using with Leaf MVC + +When using Leaf MVC and Leaf API, you can attach Smarty to Leaf in your `public/index.php` file. This step is important because Leaf MVC and Leaf API come with a `view()` helper that you can use to render your templates. Registering Smarty with Leaf will make the `view()` helper aware of Smarty. + +```php +\Leaf\View::attach(Smarty::class); +``` + +Now that you have Smarty attached to Leaf, all you need to do is head over to our view config file and replace the default template engine with Smarty. We can do this by changing the `engine` key in the `views` array to `smarty`: + +```php + Smarty::class, + + /* + |-------------------------------------------------------------------------- + | Custom config method + |-------------------------------------------------------------------------- + | + | Configuration for your templating engine. + | + */ + 'config' => function ($config) { + View::smarty()->setTemplateDir($config['views']); + View::smarty()->setConfigDir('/some/config/dir'); + View::smarty()->setCompileDir('/some/compile/dir'); + View::smarty()->setCacheDir($config['cache']); + }, + + /* + |-------------------------------------------------------------------------- + | Custom render method + |-------------------------------------------------------------------------- + | + | This render method is triggered whenever render() is called + | in your app if you're using a custom view engine. + | + */ + 'render' => function ($view, $data) { + foreach ($data as $key => $value) { + View::smarty()->assign($key, $value); + } + + View::smarty()->display($view); + }), +]; +``` + +From the Smarty docs: + +> Smarty requires four directories which are by default named templates, configs, templates_c and cache relative to the current working directory. + +This is why we set the `setTemplateDir` and `setCacheDir` to the `views` and `cache` directories respectively. + +The function passed to the `render` key is called whenever the `render()` or `view()` helpers are called. This function is responsible for rendering the template. In this case, we are assigning the data passed to the `render()` or `view()` helper to the template and then displaying the template. diff --git a/apps/docs/src/modules/views/veins/index.md b/apps/docs/src/modules/views/veins/index.md new file mode 100755 index 0000000..c698d1c --- /dev/null +++ b/apps/docs/src/modules/views/veins/index.md @@ -0,0 +1,213 @@ +# Leaf Veins + + + + + +Veins is a view engine shipped with Leaf v1. It has a perfect balance of simplicity and power as well as speed and flexibility. For those who have used **Smarty** before, this will be really easy to get used to. + +
+New to template engines? + +Watch this video by Dave Hollingworth as an introduction to template engines. + + +
+ +## Installation + +To add veins to your project simply run the command: + +```bash +leaf install veins +``` + +Or with composer: + +```bash +composer require leafs/veins +``` + +## Usage with Leaf + +To use veins in a Leaf app, you need to attach veins to the Leaf view handler. This is done by adding the following code to your `app.php` file. + +```php +Leaf\View::attach(Leaf\Veins::class); +``` + +From there, you can use the `veins` property on the `app` object to render your veins files. + +```php +app()->veins->render('home'); +``` + +## Usage without Leaf + +To use veins outside of a Leaf app, you need to initialize the `Leaf\Veins` class after installing it. + +```php +$veins = new Leaf\Veins(); +``` + +You can then call any of the methods on the `Leaf\Veins` class to render your veins files. + +```php +$veins->render('home'); +``` + +## Configuration + +Veins has a few configuration options that you can set. You can set these options using the `configure` method. The options are: + +- `charset` - The character set for your templates, default: `UTF-8` +- `debug` - Show debug errors, default: `false` +- `templateDir` - Directory to look for Vein templates, default: `views/` +- `cacheDir` - Directory to hold compiled templates, default: `cache/` +- `phpEnabled` - Whether to allow raw PHP in templates, default: `false` +- `autoEscape` - Whether to sanitize variables or not, default: `true` +- `removeComments` - Whether to html comments or not, default: `false` + +```php +$app->veins->configure([ + 'templateDir' => 'views/', + 'cacheDir' => 'views/cache/' +]); +``` + +## Creating your views + +In the config above, we set the `templateDir` to `views/`. This means that Veins will look for all your views in the `views/` directory. So if we want to create a view called `homepage`, we'd create a file called `homepage.vein.html` in the `views/` directory. + +Note that Veins uses a `.vein.html` file extension for it's views. + +```html + + + + + Veins + + +

Hello, {$name}!

+ + +``` + +**Note the `{$name}` variable in the view.** We'll get to that in a bit. + +## Rendering your views + +To render your views, you can use the `render` method. The `render` method takes in the name of the view to render and an optional array of variables to pass to the view. + +```php +$app->veins->render('homepage', ['name' => 'Leaf User']); +``` + +This will render the view and pass the `name` variable to the view. The `name` variable can then be used in the view. So basically, you can pass variables to your views using the `render` method. + +## Vein Template Syntax + +Veins uses a simple syntax for it's views. The syntax is similar to that of Smarty. Let's look at some of the syntaxes. + +### Variables + +```html +{$variable} +{$object->key} +{$array.key} +{$array['key']} +``` + +### Constants + +```html +{#constant#} +``` + +### Function + +```html +{function="function"} +``` + +### Include + +```html +{include="templateName"} +``` + +### No parse + +Commenting in Vein + +```html +{noparse} + code +{/noparse} +``` + +### Loops + +```html +{loop="$items" as $item} +
+

{$item->title}

+

{$item->body}

+
+{/loop} +``` + +Or + +```html +{loop="$items"} +
+

{$value->title}

+

{$value->body}

+
+{/loop} +``` + +### If + +```html +{if="count($posts) > 0"} + All Posts +{/if} +``` + +### If else + +```html +{if="count($posts) > 0"} + All Posts +{else} + There are no posts +{/if} +``` + +### AutoEscape + +This has a lot of uses, but the most common use case is for rendering raw HTML + +```php +$app->veins->set([ + "post" => [ + "body" => "

This is the body

" + ] +]); +``` + +```html +{autoescape="off"} + {$post.body} +{/autoescape} +``` diff --git a/apps/docs/src/modules/views/viewi/index.md b/apps/docs/src/modules/views/viewi/index.md new file mode 100644 index 0000000..1414489 --- /dev/null +++ b/apps/docs/src/modules/views/viewi/index.md @@ -0,0 +1,395 @@ +# Viewi Integration + + + +When developing a web application, you either use a javascript framework or go with a backend template engine and lose reactivity. To get both at the same time requires some complex manipulations, and it's not always efficient. + +Viewi allows you to create reactive web applications using PHP. It converts your code into native javascript code to run it in the browser. This way, you get a perfectly rendered HTML page on the first load, and at the same time, your page will remain reactive without requesting each next page on link clicks, etc. + +It's a new approach to writing web applications that target both sides: server and browser. Do not sacrifice one for another. + +[Read the Viewi docs for more info](https://viewi.net/). + +To start using Viewi in your Leaf apps, you simply need to install the Leaf Viewi module. This module has everything you need to quickly and easily setup and build your Viewi app with Leaf. + +## Installation + +You can install the Viewi module with the Leaf CLI: + +```bash +leaf install viewi +``` + +Or with composer: + +```bash +composer require leafs/viewi +``` + +## Introduction + +::: tip How does Viewi work? +Viewi takes your components with templates and converts them into special HTML tokens and JavaScript code. This way you don't need to duplicate your logic twice. And it keeps to be SEO friendly and fully dynamic out of the box. + +Viewi is not bound to specific framework and has its own template engine which is so simple to use. It also has built in Router and renders new pages without interaction with the server. +::: + +After installing the Viewi module, you need to initialize viewi and let both Viewi and Leaf know about each other's prescence. Your approach changes based on whether you're using functional mode or class mode. + +
+ +```php{5} +init(); + +app()->get('/route', function () { + echo 'This is a leaf route'; +}); + +app()->run(); +``` + +
+
+ +```php{7-9} +setLeafInstance($app); +$viewi->init(); + +$app->get('/route', function () { + echo 'This is a leaf route'; +}); + +$app->run(); +``` + +
+ +## Your first Viewi component + +After setting up the viewi module, all you need to do is to add your Viewi components and register them to routes. So all we need to do is create the folders described in the [Viewi docs installation](https://viewi.net/docs/installation#manual). + +Create the following folders: + +- `viewi-app/` +- `viewi-app/build` for compiled server-side components +- `viewi-app/Components` for your front-end application (templates, services, models) + +::: tip Autoloading your components +One neat trick to help you avoid manually importing your Viewi components is to set them up with composer's autoloader. We can do this by heading over to our `composer.json` file and adding the `viewi-app/Components` folder to our `composer.json` file. + +```json +... +"autoload": { + "psr-4": { + "Components\\": "viewi-app/Components/" + } +} +``` + +RUN THE `composer update` COMMAND TO UPDATE THE COMPOSER AUTOLOADER. +::: + +With this, we can call our components on the `Components` namespace. In our little example, we'll be creating the counter example found on the Viewi docs. To start, we'll create our `viewi-app/Components/Views/Counter/Counter.php` file: + +```php +count++; + } + + public function decrement() + { + $this->count--; + } +} +``` + +Now all that is left is to create an HTML view for this component. We'll do this in a new `viewi-app/Components/Views/Counter/Counter.html` file: + +```html + + + + + + + Viewi App + + + + $count + + + + + +``` + +With this, our component has been created successfully. Now, we need to add a route and link this component to that route. + +## Adding your Viewi routes + +Adding viewi routes has been made simpler with the Viewi module. All you need to do is call whatever request method you need on the `viewi()` method`$viewi` object. + +
+ +```php +// get request +viewi()->get('/', Components\Views\Counter\Counter::class); + +// post request +viewi()->post('/post', Components\Views\Counter\Counter::class); +``` + +Or: + +```php +use Components\Views\Counter\Counter; + +// get request +viewi()->get('/', Counter::class); + +// post request +viewi()->post('/post', Counter::class); +``` + +
+
+ +```php +// get request +$viewi->get('/', Components\Views\Counter\Counter::class); + +// post request +$viewi->post('/post', Components\Views\Counter\Counter::class); +``` + +Or: + +```php +use Components\Views\Counter\Counter; + +// get request +$viewi->get('/', Counter::class); + +// post request +$viewi->post('/post', Counter::class); +``` + +
+ +## Putting it together + +
+ +```php +init(); + +viewi()->get('/', Counter::class); + +app()->get('/route', function () { + echo 'This is a leaf route'; +}); + +app()->run(); +``` + +
+
+ +```php +setLeafInstance($app); +$viewi->init(); + +$viewi->get('/', Counter::class); + +$app->get('/route', function () { + echo 'This is a leaf route'; +}); + +$app->run(); +``` + +
+ +## Configuring Viewi + +Viewi takes in a bunch of configuration options which can be found on [their documentation](https://viewi.net/docs/configuration). This allows you to customize the way Viewi behaves. Since we're using the Leaf Viewi module, your configuration will be passed through the `init` method we saw above. + +
+ +```php +init([ + PageEngine::SOURCE_DIR => __DIR__ . '/Components', + PageEngine::SERVER_BUILD_DIR => __DIR__ . '/build', + PageEngine::PUBLIC_ROOT_DIR => __DIR__ . '/../public', + PageEngine::PUBLIC_BUILD_DIR => '/viewi-build', + PageEngine::DEV_MODE => true, + PageEngine::RETURN_OUTPUT => true, + PageEngine::COMBINE_JS => false, + PageEngine::MINIFY => false +]); + +viewi()->get('/', Counter::class); + +app()->get('/route', function () { + echo 'This is a leaf route'; +}); + +app()->run(); +``` + +
+
+ +```php +setLeafInstance($app); +$viewi->init([ + PageEngine::SOURCE_DIR => __DIR__ . '/Components', + PageEngine::SERVER_BUILD_DIR => __DIR__ . '/build', + PageEngine::PUBLIC_ROOT_DIR => __DIR__ . '/../public', + PageEngine::PUBLIC_BUILD_DIR => '/viewi-build', + PageEngine::DEV_MODE => true, + PageEngine::RETURN_OUTPUT => true, + PageEngine::COMBINE_JS => false, + PageEngine::MINIFY => false +]); + +$viewi->get('/', Counter::class); + +$app->get('/route', function () { + echo 'This is a leaf route'; +}); + +$app->run(); +``` + +
+ +One thing to note is that you can pick only the options you need and configure those. You don't need to pass in the entire Viewi configuration. + +## Deployment + +To make your application production ready you need to make these steps: + +- Ensure that `PageEngine::DEV_MODE` is set to `false` +- Recommended (but not required) to set `PageEngine::MINIFY` to `true` +- Optionally you can set `PageEngine::COMBINE_JS` to `true` + +Then you need to build your app: + +
+ +```php{8-12,17} +init([ + PageEngine::DEV_MODE => false, + PageEngine::MINIFY => true, + PageEngine::COMBINE_JS => true +]); + +viewi()->get('/', Counter::class); + +// after your viewi routes +viewi()->compile(); + +app()->get('/route', function () { + echo 'This is a leaf route'; +}); + +app()->run(); +``` + +
+
+ +```php{12-16,21} +setLeafInstance($app); +$viewi->init([ + PageEngine::DEV_MODE => false, + PageEngine::MINIFY => true, + PageEngine::COMBINE_JS => true +]); + +$viewi->get('/', Counter::class); + +// after your viewi routes +$viewi->compile(); + +$app->get('/route', function () { + echo 'This is a leaf route'; +}); + +$app->run(); +``` + +
diff --git a/apps/docs/src/modules/views/vite/index.md b/apps/docs/src/modules/views/vite/index.md new file mode 100644 index 0000000..db7fe0f --- /dev/null +++ b/apps/docs/src/modules/views/vite/index.md @@ -0,0 +1,201 @@ +# Asset Bundling + + + +Vite is a modern build tool for frontend applications. It aims to provide a faster and leaner development experience for modern web projects. Using the Vite module, you can seamlessly bundle your CSS and JS assets using vite. + +
+ New to bundling? +

+ Check out these articles from SitePoint and Next JS: +

+

+
+ +## Usage with Leaf MVC + +Leaf MVC comes with built-in support for Vite, this means you can use Vite to bundle your assets without installing any extra packages. All you need to do is to start your Vite server. You can do this by running: + +```bash +leaf view:dev +``` + +Or with npm/pnpm/yarn: + +```bash +npm i && npm run dev +... +pnpm i && pnpm run dev +... +yarn && yarn dev +``` + +From inside your views, you can use the `vite()` helper to load your assets. For example, to load a CSS file, you can do: + +```php + +``` + +You can also use the path relative to your views directory since vite will automatically look for files in your views directory. For example, if you have a file at `app/views/assets/css/app.css`, you can do: + +```php + +``` + +## Usage with Leaf Core + +Since Leaf's core comes with no prior setup or configuration, you'll need to install and setup the vite module yourself. There are 2 ways to do this: + +- Using the Leaf CLI's `view:install` command +- Manually installing and configuring vite + +### Using the Leaf CLI + +The Leaf CLI comes with a `view:install` command that can be used to install and configure vite. You can do this by running: + +```bash +leaf view:install --vite +``` + +This will install vite and the vite-leaf plugin, and will also install the vite module which will be used to load your assets on the server side. It will also create a vite config file at the root of your project. This config file can be used to configure vite, add plugins and more. You can learn more about vite config files [here](#vite-config). + +From there, you can start your vite server by running: + +```bash +leaf view:dev +``` + +### Manually installing vite + +First, install vite and the vite-leaf plugin: + +```bash +npm i -D vite @leafphp/vite-plugin +``` + +We will also need to install the vite module which will be used to load our assets on the server side: + +```bash +leaf install vite +``` + +Or with composer: + +```bash +composer require leafs/vite +``` + +## Vite Config + +Vite will automatically try to resolve a config file named `vite.config.js` at the project root level. This config file can be used to configure vite, add plugins and more. You can learn more about vite config files [here](https://vitejs.dev/config/). + +The Leaf Vite plugin requires an array of entry points for your application. These may be JavaScript or CSS files, and include preprocessed languages such as TypeScript, JSX, and Sass. + +```js{6-12} +import { defineConfig } from 'vite'; +import leaf from '@leafphp/vite-plugin'; + +export default defineConfig({ + plugins: [ + leaf({ + input: [ + 'path/to/entrypoint.css', + 'path/to/entrypoint.js' + ], + refresh: true + }) + ] +}); +``` + +## Running Vite + +If you're using a Leaf MVC app or you installed Vite using the `view:install` command, you can start your vite server without any extra configuration. You can do this by running: + +```bash +leaf view:dev +``` + +If you installed vite manually, you'll need to add a script to your `package.json` file to run vite. You can do this by adding the following to your `package.json` file: + +```json +{ + "scripts": { + "dev": "vite", + "build": "vite build" + } +} +``` + +You can then start your vite server using the `view:dev` command above. + +## Loading your assets + +The vite module comes with a helper function that can be used to load your assets. This helper function is available as `vite()` and can be used to load your scripts and styles. It takes in 2 parameters: + +- The path to the asset +- The folder to load the asset from (optional, defaults to the assets path in leaf config or `app/views` if not set) + +For example, to load a CSS file, you can do: + +```php + +``` + +To load assets from a folder, you can do: + +```php + +``` + +You can also load multiple assets at once by passing in an array of assets: + +```php + +``` + +The `vite()` helper function will automatically load the correct assets depending on the environment. In development, it will load the assets from the vite server with Hot Module Replacement, while in production, it will load the assets from the build folder. + +## Aliases + +Vite allows you to set up aliases for your assets. This can be done by adding an `alias` key to your vite config. For example, to set up an alias for the `@` symbol, you can do: + +```js{14-18} +import { defineConfig } from 'vite'; +import leaf from '@leafphp/vite-plugin'; + +export default defineConfig({ + plugins: [ + leaf({ + input: [ + 'path/to/entrypoint.css', + 'path/to/entrypoint.js' + ], + refresh: true + }) + ], + resolve: { + alias: { + '@': '/path/to/folder', + } + } +}); +``` + +## Vite + other frameworks + +Vite can be used with any framework. You can learn more about using vite with other frameworks [here](https://vitejs.dev/guide/#scaffolding-your-first-vite-project). We've included in-depth guides on using vite with some of the most popular frameworks: + + diff --git a/apps/docs/src/public/449.css b/apps/docs/src/public/449.css new file mode 100644 index 0000000..37a17ee --- /dev/null +++ b/apps/docs/src/public/449.css @@ -0,0 +1,78745 @@ +/*! + * 449 CSS + * ----------- + * Enjoy! + * Licensed under MIT + */ +/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */ +/* Document + ========================================================================== */ +/** + * 1. Correct the line height in all browsers. + * 2. Prevent adjustments of font size after orientation changes in iOS. + */ +html { + line-height: 1.15; + /* 1 */ + -webkit-text-size-adjust: 100%; + /* 2 */ +} + +/** + * 1. Remove default margin from all elements + * 2. Remove default padding from all elements + */ +* { + margin: 0; + padding: 0; +} + +/* Sections + ========================================================================== */ +/** + * Remove the margin in all browsers. + */ +body { + margin: 0; +} + +/** + * Render the `main` element consistently in IE. + */ +main { + display: block; +} + +/** + * Correct the font size and margin on `h1` elements within `section` and + * `article` contexts in Chrome, Firefox, and Safari. + */ +h1 { + font-size: 2em; + margin: 0.67em 0; +} + +/* Grouping content + ========================================================================== */ +/** + * 1. Add the correct box sizing in Firefox. + * 2. Show the overflow in Edge and IE. + */ +hr { + box-sizing: content-box; + /* 1 */ + height: 0; + /* 1 */ + overflow: visible; + /* 2 */ +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ +pre { + font-family: monospace, monospace; + /* 1 */ + font-size: 1em; + /* 2 */ +} + +/* Text-level semantics + ========================================================================== */ +/** + * Remove the gray background on active links in IE 10. + */ +a { + background-color: transparent; +} + +/** + * 1. Remove the bottom border in Chrome 57- + * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. + */ +abbr[title] { + border-bottom: none; + /* 1 */ + text-decoration: underline; + /* 2 */ + text-decoration: underline dotted; + /* 2 */ +} + +/** + * Add the correct font weight in Chrome, Edge, and Safari. + */ +b, +strong { + font-weight: bolder; +} + +/** + * 1. Correct the inheritance and scaling of font size in all browsers. + * 2. Correct the odd `em` font sizing in all browsers. + */ +code, +kbd, +samp { + font-family: monospace, monospace; + /* 1 */ + font-size: 1em; + /* 2 */ +} + +/** + * Add the correct font size in all browsers. + */ +small { + font-size: 80%; +} + +/** + * Prevent `sub` and `sup` elements from affecting the line height in + * all browsers. + */ +sub, +sup { + font-size: 75%; + line-height: 0; + position: relative; + vertical-align: baseline; +} + +sub { + bottom: -0.25em; +} + +sup { + top: -0.5em; +} + +/* Embedded content + ========================================================================== */ +/** + * Remove the border on images inside links in IE 10. + */ +img { + border-style: none; +} + +/* Forms + ========================================================================== */ +/** + * 1. Change the font styles in all browsers. + * 2. Remove the margin in Firefox and Safari. + */ +button, +input, +optgroup, +select, +textarea { + font-family: inherit; + /* 1 */ + font-size: 100%; + /* 1 */ + line-height: 1.15; + /* 1 */ + margin: 0; + /* 2 */ +} + +/** + * Show the overflow in IE. + * 1. Show the overflow in Edge. + */ +button, +input { + /* 1 */ + overflow: visible; +} + +/** + * Remove the inheritance of text transform in Edge, Firefox, and IE. + * 1. Remove the inheritance of text transform in Firefox. + */ +button, +select { + /* 1 */ + text-transform: none; +} + +/** + * Correct the inability to style clickable types in iOS and Safari. + */ +button, +[type=button], +[type=reset], +[type=submit] { + -webkit-appearance: button; +} + +/** + * Remove the inner border and padding in Firefox. + */ +button::-moz-focus-inner, +[type=button]::-moz-focus-inner, +[type=reset]::-moz-focus-inner, +[type=submit]::-moz-focus-inner { + border-style: none; + padding: 0; +} + +/** + * Restore the focus styles unset by the previous rule. + */ +button:-moz-focusring, +[type=button]:-moz-focusring, +[type=reset]:-moz-focusring, +[type=submit]:-moz-focusring { + outline: 1px dotted ButtonText; +} + +/** + * Correct the padding in Firefox. + */ +fieldset { + padding: 0.35em 0.75em 0.625em; +} + +/** + * 1. Correct the text wrapping in Edge and IE. + * 2. Correct the color inheritance from `fieldset` elements in IE. + * 3. Remove the padding so developers are not caught out when they zero out + * `fieldset` elements in all browsers. + */ +legend { + box-sizing: border-box; + /* 1 */ + color: inherit; + /* 2 */ + display: table; + /* 1 */ + max-width: 100%; + /* 1 */ + padding: 0; + /* 3 */ + white-space: normal; + /* 1 */ +} + +/** + * Add the correct vertical alignment in Chrome, Firefox, and Opera. + */ +progress { + vertical-align: baseline; +} + +/** + * Remove the default vertical scrollbar in IE 10+. + */ +textarea { + overflow: auto; +} + +/** + * 1. Add the correct box sizing in IE 10. + * 2. Remove the padding in IE 10. + */ +[type=checkbox], +[type=radio] { + box-sizing: border-box; + /* 1 */ + padding: 0; + /* 2 */ +} + +/** + * Correct the cursor style of increment and decrement buttons in Chrome. + */ +[type=number]::-webkit-inner-spin-button, +[type=number]::-webkit-outer-spin-button { + height: auto; +} + +/** + * 1. Correct the odd appearance in Chrome and Safari. + * 2. Correct the outline style in Safari. + */ +[type=search] { + -webkit-appearance: textfield; + /* 1 */ + outline-offset: -2px; + /* 2 */ +} + +/** + * Remove the inner padding in Chrome and Safari on macOS. + */ +[type=search]::-webkit-search-decoration { + -webkit-appearance: none; +} + +/** + * 1. Correct the inability to style clickable types in iOS and Safari. + * 2. Change font properties to `inherit` in Safari. + */ +::-webkit-file-upload-button { + -webkit-appearance: button; + /* 1 */ + font: inherit; + /* 2 */ +} + +/* Interactive + ========================================================================== */ +/* + * Add the correct display in Edge, IE 10+, and Firefox. + */ +details { + display: block; +} + +/* + * Add the correct display in all browsers. + */ +summary { + display: list-item; +} + +/* Misc + ========================================================================== */ +/** + * Add the correct display in IE 10+. + */ +template { + display: none; +} + +/** + * Add the correct display in IE 10. + */ +[hidden] { + display: none; +} + +/* Other resets + ========================================================================== */ +/* clears the 'X' from Internet Explorer */ +input[type=search]::-ms-clear, +input[type=search]::-ms-reveal { + display: none; + width: 0; + height: 0; +} + +/* clears the 'X' from Chrome */ +input[type=search]::-webkit-search-decoration, +input[type=search]::-webkit-search-cancel-button, +input[type=search]::-webkit-search-results-button, +input[type=search]::-webkit-search-results-decoration { + display: none; +} + +.bg\:blue { + background-color: #007bff !important; +} + +.text\:blue { + color: #007bff !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:blue { + background-color: #007bff !important; + } + + .text-xs\:blue { + color: #007bff !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:blue { + background-color: #007bff !important; + } + + .text-sm-down\:blue { + color: #007bff !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:blue { + background-color: #007bff !important; + } + + .text-sm\:blue { + color: #007bff !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:blue { + background-color: #007bff !important; + } + + .text-sm-up\:blue { + color: #007bff !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:blue { + background-color: #007bff !important; + } + + .text-md-down\:blue { + color: #007bff !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:blue { + background-color: #007bff !important; + } + + .text-md\:blue { + color: #007bff !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:blue { + background-color: #007bff !important; + } + + .text-md-up\:blue { + color: #007bff !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:blue { + background-color: #007bff !important; + } + + .text-lg-down\:blue { + color: #007bff !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:blue { + background-color: #007bff !important; + } + + .text-lg\:blue { + color: #007bff !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:blue { + background-color: #007bff !important; + } + + .text-lg-up\:blue { + color: #007bff !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:blue { + background-color: #007bff !important; + } + + .text-xl-down\:blue { + color: #007bff !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:blue { + background-color: #007bff !important; + } + + .text-xl\:blue { + color: #007bff !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:blue { + background-color: #007bff !important; + } + + .text-xl-up\:blue { + color: #007bff !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:blue { + background-color: #007bff !important; + } + + .text-xxl\:blue { + color: #007bff !important; + } +} +.bg\:indigo { + background-color: #6610f2 !important; +} + +.text\:indigo { + color: #6610f2 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:indigo { + background-color: #6610f2 !important; + } + + .text-xs\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:indigo { + background-color: #6610f2 !important; + } + + .text-sm-down\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:indigo { + background-color: #6610f2 !important; + } + + .text-sm\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:indigo { + background-color: #6610f2 !important; + } + + .text-sm-up\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:indigo { + background-color: #6610f2 !important; + } + + .text-md-down\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:indigo { + background-color: #6610f2 !important; + } + + .text-md\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:indigo { + background-color: #6610f2 !important; + } + + .text-md-up\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:indigo { + background-color: #6610f2 !important; + } + + .text-lg-down\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:indigo { + background-color: #6610f2 !important; + } + + .text-lg\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:indigo { + background-color: #6610f2 !important; + } + + .text-lg-up\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:indigo { + background-color: #6610f2 !important; + } + + .text-xl-down\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:indigo { + background-color: #6610f2 !important; + } + + .text-xl\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:indigo { + background-color: #6610f2 !important; + } + + .text-xl-up\:indigo { + color: #6610f2 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:indigo { + background-color: #6610f2 !important; + } + + .text-xxl\:indigo { + color: #6610f2 !important; + } +} +.bg\:purple { + background-color: #6f42c1 !important; +} + +.text\:purple { + color: #6f42c1 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:purple { + background-color: #6f42c1 !important; + } + + .text-xs\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:purple { + background-color: #6f42c1 !important; + } + + .text-sm-down\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:purple { + background-color: #6f42c1 !important; + } + + .text-sm\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:purple { + background-color: #6f42c1 !important; + } + + .text-sm-up\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:purple { + background-color: #6f42c1 !important; + } + + .text-md-down\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:purple { + background-color: #6f42c1 !important; + } + + .text-md\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:purple { + background-color: #6f42c1 !important; + } + + .text-md-up\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:purple { + background-color: #6f42c1 !important; + } + + .text-lg-down\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:purple { + background-color: #6f42c1 !important; + } + + .text-lg\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:purple { + background-color: #6f42c1 !important; + } + + .text-lg-up\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:purple { + background-color: #6f42c1 !important; + } + + .text-xl-down\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:purple { + background-color: #6f42c1 !important; + } + + .text-xl\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:purple { + background-color: #6f42c1 !important; + } + + .text-xl-up\:purple { + color: #6f42c1 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:purple { + background-color: #6f42c1 !important; + } + + .text-xxl\:purple { + color: #6f42c1 !important; + } +} +.bg\:pink { + background-color: #e83e8c !important; +} + +.text\:pink { + color: #e83e8c !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:pink { + background-color: #e83e8c !important; + } + + .text-xs\:pink { + color: #e83e8c !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:pink { + background-color: #e83e8c !important; + } + + .text-sm-down\:pink { + color: #e83e8c !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:pink { + background-color: #e83e8c !important; + } + + .text-sm\:pink { + color: #e83e8c !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:pink { + background-color: #e83e8c !important; + } + + .text-sm-up\:pink { + color: #e83e8c !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:pink { + background-color: #e83e8c !important; + } + + .text-md-down\:pink { + color: #e83e8c !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:pink { + background-color: #e83e8c !important; + } + + .text-md\:pink { + color: #e83e8c !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:pink { + background-color: #e83e8c !important; + } + + .text-md-up\:pink { + color: #e83e8c !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:pink { + background-color: #e83e8c !important; + } + + .text-lg-down\:pink { + color: #e83e8c !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:pink { + background-color: #e83e8c !important; + } + + .text-lg\:pink { + color: #e83e8c !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:pink { + background-color: #e83e8c !important; + } + + .text-lg-up\:pink { + color: #e83e8c !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:pink { + background-color: #e83e8c !important; + } + + .text-xl-down\:pink { + color: #e83e8c !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:pink { + background-color: #e83e8c !important; + } + + .text-xl\:pink { + color: #e83e8c !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:pink { + background-color: #e83e8c !important; + } + + .text-xl-up\:pink { + color: #e83e8c !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:pink { + background-color: #e83e8c !important; + } + + .text-xxl\:pink { + color: #e83e8c !important; + } +} +.bg\:red { + background-color: #dc3545 !important; +} + +.text\:red { + color: #dc3545 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:red { + background-color: #dc3545 !important; + } + + .text-xs\:red { + color: #dc3545 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:red { + background-color: #dc3545 !important; + } + + .text-sm-down\:red { + color: #dc3545 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:red { + background-color: #dc3545 !important; + } + + .text-sm\:red { + color: #dc3545 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:red { + background-color: #dc3545 !important; + } + + .text-sm-up\:red { + color: #dc3545 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:red { + background-color: #dc3545 !important; + } + + .text-md-down\:red { + color: #dc3545 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:red { + background-color: #dc3545 !important; + } + + .text-md\:red { + color: #dc3545 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:red { + background-color: #dc3545 !important; + } + + .text-md-up\:red { + color: #dc3545 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:red { + background-color: #dc3545 !important; + } + + .text-lg-down\:red { + color: #dc3545 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:red { + background-color: #dc3545 !important; + } + + .text-lg\:red { + color: #dc3545 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:red { + background-color: #dc3545 !important; + } + + .text-lg-up\:red { + color: #dc3545 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:red { + background-color: #dc3545 !important; + } + + .text-xl-down\:red { + color: #dc3545 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:red { + background-color: #dc3545 !important; + } + + .text-xl\:red { + color: #dc3545 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:red { + background-color: #dc3545 !important; + } + + .text-xl-up\:red { + color: #dc3545 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:red { + background-color: #dc3545 !important; + } + + .text-xxl\:red { + color: #dc3545 !important; + } +} +.bg\:orange { + background-color: #fd7e14 !important; +} + +.text\:orange { + color: #fd7e14 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:orange { + background-color: #fd7e14 !important; + } + + .text-xs\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:orange { + background-color: #fd7e14 !important; + } + + .text-sm-down\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:orange { + background-color: #fd7e14 !important; + } + + .text-sm\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:orange { + background-color: #fd7e14 !important; + } + + .text-sm-up\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:orange { + background-color: #fd7e14 !important; + } + + .text-md-down\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:orange { + background-color: #fd7e14 !important; + } + + .text-md\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:orange { + background-color: #fd7e14 !important; + } + + .text-md-up\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:orange { + background-color: #fd7e14 !important; + } + + .text-lg-down\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:orange { + background-color: #fd7e14 !important; + } + + .text-lg\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:orange { + background-color: #fd7e14 !important; + } + + .text-lg-up\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:orange { + background-color: #fd7e14 !important; + } + + .text-xl-down\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:orange { + background-color: #fd7e14 !important; + } + + .text-xl\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:orange { + background-color: #fd7e14 !important; + } + + .text-xl-up\:orange { + color: #fd7e14 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:orange { + background-color: #fd7e14 !important; + } + + .text-xxl\:orange { + color: #fd7e14 !important; + } +} +.bg\:yellow { + background-color: #ffc107 !important; +} + +.text\:yellow { + color: #ffc107 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:yellow { + background-color: #ffc107 !important; + } + + .text-xs\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:yellow { + background-color: #ffc107 !important; + } + + .text-sm-down\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:yellow { + background-color: #ffc107 !important; + } + + .text-sm\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:yellow { + background-color: #ffc107 !important; + } + + .text-sm-up\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:yellow { + background-color: #ffc107 !important; + } + + .text-md-down\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:yellow { + background-color: #ffc107 !important; + } + + .text-md\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:yellow { + background-color: #ffc107 !important; + } + + .text-md-up\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:yellow { + background-color: #ffc107 !important; + } + + .text-lg-down\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:yellow { + background-color: #ffc107 !important; + } + + .text-lg\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:yellow { + background-color: #ffc107 !important; + } + + .text-lg-up\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:yellow { + background-color: #ffc107 !important; + } + + .text-xl-down\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:yellow { + background-color: #ffc107 !important; + } + + .text-xl\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:yellow { + background-color: #ffc107 !important; + } + + .text-xl-up\:yellow { + color: #ffc107 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:yellow { + background-color: #ffc107 !important; + } + + .text-xxl\:yellow { + color: #ffc107 !important; + } +} +.bg\:green { + background-color: #28a745 !important; +} + +.text\:green { + color: #28a745 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:green { + background-color: #28a745 !important; + } + + .text-xs\:green { + color: #28a745 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:green { + background-color: #28a745 !important; + } + + .text-sm-down\:green { + color: #28a745 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:green { + background-color: #28a745 !important; + } + + .text-sm\:green { + color: #28a745 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:green { + background-color: #28a745 !important; + } + + .text-sm-up\:green { + color: #28a745 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:green { + background-color: #28a745 !important; + } + + .text-md-down\:green { + color: #28a745 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:green { + background-color: #28a745 !important; + } + + .text-md\:green { + color: #28a745 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:green { + background-color: #28a745 !important; + } + + .text-md-up\:green { + color: #28a745 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:green { + background-color: #28a745 !important; + } + + .text-lg-down\:green { + color: #28a745 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:green { + background-color: #28a745 !important; + } + + .text-lg\:green { + color: #28a745 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:green { + background-color: #28a745 !important; + } + + .text-lg-up\:green { + color: #28a745 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:green { + background-color: #28a745 !important; + } + + .text-xl-down\:green { + color: #28a745 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:green { + background-color: #28a745 !important; + } + + .text-xl\:green { + color: #28a745 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:green { + background-color: #28a745 !important; + } + + .text-xl-up\:green { + color: #28a745 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:green { + background-color: #28a745 !important; + } + + .text-xxl\:green { + color: #28a745 !important; + } +} +.bg\:teal { + background-color: #20c997 !important; +} + +.text\:teal { + color: #20c997 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:teal { + background-color: #20c997 !important; + } + + .text-xs\:teal { + color: #20c997 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:teal { + background-color: #20c997 !important; + } + + .text-sm-down\:teal { + color: #20c997 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:teal { + background-color: #20c997 !important; + } + + .text-sm\:teal { + color: #20c997 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:teal { + background-color: #20c997 !important; + } + + .text-sm-up\:teal { + color: #20c997 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:teal { + background-color: #20c997 !important; + } + + .text-md-down\:teal { + color: #20c997 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:teal { + background-color: #20c997 !important; + } + + .text-md\:teal { + color: #20c997 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:teal { + background-color: #20c997 !important; + } + + .text-md-up\:teal { + color: #20c997 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:teal { + background-color: #20c997 !important; + } + + .text-lg-down\:teal { + color: #20c997 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:teal { + background-color: #20c997 !important; + } + + .text-lg\:teal { + color: #20c997 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:teal { + background-color: #20c997 !important; + } + + .text-lg-up\:teal { + color: #20c997 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:teal { + background-color: #20c997 !important; + } + + .text-xl-down\:teal { + color: #20c997 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:teal { + background-color: #20c997 !important; + } + + .text-xl\:teal { + color: #20c997 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:teal { + background-color: #20c997 !important; + } + + .text-xl-up\:teal { + color: #20c997 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:teal { + background-color: #20c997 !important; + } + + .text-xxl\:teal { + color: #20c997 !important; + } +} +.bg\:cyan { + background-color: #17a2b8 !important; +} + +.text\:cyan { + color: #17a2b8 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:cyan { + background-color: #17a2b8 !important; + } + + .text-xs\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:cyan { + background-color: #17a2b8 !important; + } + + .text-sm-down\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:cyan { + background-color: #17a2b8 !important; + } + + .text-sm\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:cyan { + background-color: #17a2b8 !important; + } + + .text-sm-up\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:cyan { + background-color: #17a2b8 !important; + } + + .text-md-down\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:cyan { + background-color: #17a2b8 !important; + } + + .text-md\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:cyan { + background-color: #17a2b8 !important; + } + + .text-md-up\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:cyan { + background-color: #17a2b8 !important; + } + + .text-lg-down\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:cyan { + background-color: #17a2b8 !important; + } + + .text-lg\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:cyan { + background-color: #17a2b8 !important; + } + + .text-lg-up\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:cyan { + background-color: #17a2b8 !important; + } + + .text-xl-down\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:cyan { + background-color: #17a2b8 !important; + } + + .text-xl\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:cyan { + background-color: #17a2b8 !important; + } + + .text-xl-up\:cyan { + color: #17a2b8 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:cyan { + background-color: #17a2b8 !important; + } + + .text-xxl\:cyan { + color: #17a2b8 !important; + } +} +.bg\:white { + background-color: #fff !important; +} + +.text\:white { + color: #fff !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:white { + background-color: #fff !important; + } + + .text-xs\:white { + color: #fff !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:white { + background-color: #fff !important; + } + + .text-sm-down\:white { + color: #fff !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:white { + background-color: #fff !important; + } + + .text-sm\:white { + color: #fff !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:white { + background-color: #fff !important; + } + + .text-sm-up\:white { + color: #fff !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:white { + background-color: #fff !important; + } + + .text-md-down\:white { + color: #fff !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:white { + background-color: #fff !important; + } + + .text-md\:white { + color: #fff !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:white { + background-color: #fff !important; + } + + .text-md-up\:white { + color: #fff !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:white { + background-color: #fff !important; + } + + .text-lg-down\:white { + color: #fff !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:white { + background-color: #fff !important; + } + + .text-lg\:white { + color: #fff !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:white { + background-color: #fff !important; + } + + .text-lg-up\:white { + color: #fff !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:white { + background-color: #fff !important; + } + + .text-xl-down\:white { + color: #fff !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:white { + background-color: #fff !important; + } + + .text-xl\:white { + color: #fff !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:white { + background-color: #fff !important; + } + + .text-xl-up\:white { + color: #fff !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:white { + background-color: #fff !important; + } + + .text-xxl\:white { + color: #fff !important; + } +} +.bg\:gray { + background-color: #6c757d !important; +} + +.text\:gray { + color: #6c757d !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:gray { + background-color: #6c757d !important; + } + + .text-xs\:gray { + color: #6c757d !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:gray { + background-color: #6c757d !important; + } + + .text-sm-down\:gray { + color: #6c757d !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:gray { + background-color: #6c757d !important; + } + + .text-sm\:gray { + color: #6c757d !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:gray { + background-color: #6c757d !important; + } + + .text-sm-up\:gray { + color: #6c757d !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:gray { + background-color: #6c757d !important; + } + + .text-md-down\:gray { + color: #6c757d !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:gray { + background-color: #6c757d !important; + } + + .text-md\:gray { + color: #6c757d !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:gray { + background-color: #6c757d !important; + } + + .text-md-up\:gray { + color: #6c757d !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:gray { + background-color: #6c757d !important; + } + + .text-lg-down\:gray { + color: #6c757d !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:gray { + background-color: #6c757d !important; + } + + .text-lg\:gray { + color: #6c757d !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:gray { + background-color: #6c757d !important; + } + + .text-lg-up\:gray { + color: #6c757d !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:gray { + background-color: #6c757d !important; + } + + .text-xl-down\:gray { + color: #6c757d !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:gray { + background-color: #6c757d !important; + } + + .text-xl\:gray { + color: #6c757d !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:gray { + background-color: #6c757d !important; + } + + .text-xl-up\:gray { + color: #6c757d !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:gray { + background-color: #6c757d !important; + } + + .text-xxl\:gray { + color: #6c757d !important; + } +} +.bg\:gray-dark { + background-color: #343a40 !important; +} + +.text\:gray-dark { + color: #343a40 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:gray-dark { + background-color: #343a40 !important; + } + + .text-xs\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:gray-dark { + background-color: #343a40 !important; + } + + .text-sm-down\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:gray-dark { + background-color: #343a40 !important; + } + + .text-sm\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:gray-dark { + background-color: #343a40 !important; + } + + .text-sm-up\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:gray-dark { + background-color: #343a40 !important; + } + + .text-md-down\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:gray-dark { + background-color: #343a40 !important; + } + + .text-md\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:gray-dark { + background-color: #343a40 !important; + } + + .text-md-up\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:gray-dark { + background-color: #343a40 !important; + } + + .text-lg-down\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:gray-dark { + background-color: #343a40 !important; + } + + .text-lg\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:gray-dark { + background-color: #343a40 !important; + } + + .text-lg-up\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:gray-dark { + background-color: #343a40 !important; + } + + .text-xl-down\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:gray-dark { + background-color: #343a40 !important; + } + + .text-xl\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:gray-dark { + background-color: #343a40 !important; + } + + .text-xl-up\:gray-dark { + color: #343a40 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:gray-dark { + background-color: #343a40 !important; + } + + .text-xxl\:gray-dark { + color: #343a40 !important; + } +} +.bg\:gray-100 { + background-color: #f8f9fa !important; +} + +.text\:gray-100 { + color: #f8f9fa !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-xs\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-sm-down\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-sm\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-sm-up\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-md-down\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-md\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-md-up\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-lg-down\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-lg\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-lg-up\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-xl-down\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-xl\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-xl-up\:gray-100 { + color: #f8f9fa !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:gray-100 { + background-color: #f8f9fa !important; + } + + .text-xxl\:gray-100 { + color: #f8f9fa !important; + } +} +.bg\:gray-200 { + background-color: #e9ecef !important; +} + +.text\:gray-200 { + color: #e9ecef !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:gray-200 { + background-color: #e9ecef !important; + } + + .text-xs\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:gray-200 { + background-color: #e9ecef !important; + } + + .text-sm-down\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:gray-200 { + background-color: #e9ecef !important; + } + + .text-sm\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:gray-200 { + background-color: #e9ecef !important; + } + + .text-sm-up\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:gray-200 { + background-color: #e9ecef !important; + } + + .text-md-down\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:gray-200 { + background-color: #e9ecef !important; + } + + .text-md\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:gray-200 { + background-color: #e9ecef !important; + } + + .text-md-up\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:gray-200 { + background-color: #e9ecef !important; + } + + .text-lg-down\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:gray-200 { + background-color: #e9ecef !important; + } + + .text-lg\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:gray-200 { + background-color: #e9ecef !important; + } + + .text-lg-up\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:gray-200 { + background-color: #e9ecef !important; + } + + .text-xl-down\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:gray-200 { + background-color: #e9ecef !important; + } + + .text-xl\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:gray-200 { + background-color: #e9ecef !important; + } + + .text-xl-up\:gray-200 { + color: #e9ecef !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:gray-200 { + background-color: #e9ecef !important; + } + + .text-xxl\:gray-200 { + color: #e9ecef !important; + } +} +.bg\:gray-300 { + background-color: #dee2e6 !important; +} + +.text\:gray-300 { + color: #dee2e6 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-xs\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-sm-down\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-sm\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-sm-up\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-md-down\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-md\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-md-up\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-lg-down\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-lg\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-lg-up\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-xl-down\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-xl\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-xl-up\:gray-300 { + color: #dee2e6 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:gray-300 { + background-color: #dee2e6 !important; + } + + .text-xxl\:gray-300 { + color: #dee2e6 !important; + } +} +.bg\:gray-400 { + background-color: #ced4da !important; +} + +.text\:gray-400 { + color: #ced4da !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:gray-400 { + background-color: #ced4da !important; + } + + .text-xs\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:gray-400 { + background-color: #ced4da !important; + } + + .text-sm-down\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:gray-400 { + background-color: #ced4da !important; + } + + .text-sm\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:gray-400 { + background-color: #ced4da !important; + } + + .text-sm-up\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:gray-400 { + background-color: #ced4da !important; + } + + .text-md-down\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:gray-400 { + background-color: #ced4da !important; + } + + .text-md\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:gray-400 { + background-color: #ced4da !important; + } + + .text-md-up\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:gray-400 { + background-color: #ced4da !important; + } + + .text-lg-down\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:gray-400 { + background-color: #ced4da !important; + } + + .text-lg\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:gray-400 { + background-color: #ced4da !important; + } + + .text-lg-up\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:gray-400 { + background-color: #ced4da !important; + } + + .text-xl-down\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:gray-400 { + background-color: #ced4da !important; + } + + .text-xl\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:gray-400 { + background-color: #ced4da !important; + } + + .text-xl-up\:gray-400 { + color: #ced4da !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:gray-400 { + background-color: #ced4da !important; + } + + .text-xxl\:gray-400 { + color: #ced4da !important; + } +} +.bg\:gray-500 { + background-color: #adb5bd !important; +} + +.text\:gray-500 { + color: #adb5bd !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:gray-500 { + background-color: #adb5bd !important; + } + + .text-xs\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:gray-500 { + background-color: #adb5bd !important; + } + + .text-sm-down\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:gray-500 { + background-color: #adb5bd !important; + } + + .text-sm\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:gray-500 { + background-color: #adb5bd !important; + } + + .text-sm-up\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:gray-500 { + background-color: #adb5bd !important; + } + + .text-md-down\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:gray-500 { + background-color: #adb5bd !important; + } + + .text-md\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:gray-500 { + background-color: #adb5bd !important; + } + + .text-md-up\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:gray-500 { + background-color: #adb5bd !important; + } + + .text-lg-down\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:gray-500 { + background-color: #adb5bd !important; + } + + .text-lg\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:gray-500 { + background-color: #adb5bd !important; + } + + .text-lg-up\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:gray-500 { + background-color: #adb5bd !important; + } + + .text-xl-down\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:gray-500 { + background-color: #adb5bd !important; + } + + .text-xl\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:gray-500 { + background-color: #adb5bd !important; + } + + .text-xl-up\:gray-500 { + color: #adb5bd !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:gray-500 { + background-color: #adb5bd !important; + } + + .text-xxl\:gray-500 { + color: #adb5bd !important; + } +} +.bg\:gray-600 { + background-color: #6c757d !important; +} + +.text\:gray-600 { + color: #6c757d !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:gray-600 { + background-color: #6c757d !important; + } + + .text-xs\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:gray-600 { + background-color: #6c757d !important; + } + + .text-sm-down\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:gray-600 { + background-color: #6c757d !important; + } + + .text-sm\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:gray-600 { + background-color: #6c757d !important; + } + + .text-sm-up\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:gray-600 { + background-color: #6c757d !important; + } + + .text-md-down\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:gray-600 { + background-color: #6c757d !important; + } + + .text-md\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:gray-600 { + background-color: #6c757d !important; + } + + .text-md-up\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:gray-600 { + background-color: #6c757d !important; + } + + .text-lg-down\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:gray-600 { + background-color: #6c757d !important; + } + + .text-lg\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:gray-600 { + background-color: #6c757d !important; + } + + .text-lg-up\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:gray-600 { + background-color: #6c757d !important; + } + + .text-xl-down\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:gray-600 { + background-color: #6c757d !important; + } + + .text-xl\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:gray-600 { + background-color: #6c757d !important; + } + + .text-xl-up\:gray-600 { + color: #6c757d !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:gray-600 { + background-color: #6c757d !important; + } + + .text-xxl\:gray-600 { + color: #6c757d !important; + } +} +.bg\:gray-700 { + background-color: #495057 !important; +} + +.text\:gray-700 { + color: #495057 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:gray-700 { + background-color: #495057 !important; + } + + .text-xs\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:gray-700 { + background-color: #495057 !important; + } + + .text-sm-down\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:gray-700 { + background-color: #495057 !important; + } + + .text-sm\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:gray-700 { + background-color: #495057 !important; + } + + .text-sm-up\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:gray-700 { + background-color: #495057 !important; + } + + .text-md-down\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:gray-700 { + background-color: #495057 !important; + } + + .text-md\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:gray-700 { + background-color: #495057 !important; + } + + .text-md-up\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:gray-700 { + background-color: #495057 !important; + } + + .text-lg-down\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:gray-700 { + background-color: #495057 !important; + } + + .text-lg\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:gray-700 { + background-color: #495057 !important; + } + + .text-lg-up\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:gray-700 { + background-color: #495057 !important; + } + + .text-xl-down\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:gray-700 { + background-color: #495057 !important; + } + + .text-xl\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:gray-700 { + background-color: #495057 !important; + } + + .text-xl-up\:gray-700 { + color: #495057 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:gray-700 { + background-color: #495057 !important; + } + + .text-xxl\:gray-700 { + color: #495057 !important; + } +} +.bg\:gray-800 { + background-color: #343a40 !important; +} + +.text\:gray-800 { + color: #343a40 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:gray-800 { + background-color: #343a40 !important; + } + + .text-xs\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:gray-800 { + background-color: #343a40 !important; + } + + .text-sm-down\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:gray-800 { + background-color: #343a40 !important; + } + + .text-sm\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:gray-800 { + background-color: #343a40 !important; + } + + .text-sm-up\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:gray-800 { + background-color: #343a40 !important; + } + + .text-md-down\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:gray-800 { + background-color: #343a40 !important; + } + + .text-md\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:gray-800 { + background-color: #343a40 !important; + } + + .text-md-up\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:gray-800 { + background-color: #343a40 !important; + } + + .text-lg-down\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:gray-800 { + background-color: #343a40 !important; + } + + .text-lg\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:gray-800 { + background-color: #343a40 !important; + } + + .text-lg-up\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:gray-800 { + background-color: #343a40 !important; + } + + .text-xl-down\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:gray-800 { + background-color: #343a40 !important; + } + + .text-xl\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:gray-800 { + background-color: #343a40 !important; + } + + .text-xl-up\:gray-800 { + color: #343a40 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:gray-800 { + background-color: #343a40 !important; + } + + .text-xxl\:gray-800 { + color: #343a40 !important; + } +} +.bg\:gray-900 { + background-color: #212529 !important; +} + +.text\:gray-900 { + color: #212529 !important; +} + +@media only screen and (max-width: 576px) { + .bg-xs\:gray-900 { + background-color: #212529 !important; + } + + .text-xs\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (max-width: 768px) { + .bg-sm-down\:gray-900 { + background-color: #212529 !important; + } + + .text-sm-down\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .bg-sm\:gray-900 { + background-color: #212529 !important; + } + + .text-sm\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (min-width: 577px) { + .bg-sm-up\:gray-900 { + background-color: #212529 !important; + } + + .text-sm-up\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (max-width: 992px) { + .bg-md-down\:gray-900 { + background-color: #212529 !important; + } + + .text-md-down\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .bg-md\:gray-900 { + background-color: #212529 !important; + } + + .text-md\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (min-width: 769px) { + .bg-md-up\:gray-900 { + background-color: #212529 !important; + } + + .text-md-up\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (max-width: 1200px) { + .bg-lg-down\:gray-900 { + background-color: #212529 !important; + } + + .text-lg-down\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .bg-lg\:gray-900 { + background-color: #212529 !important; + } + + .text-lg\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (min-width: 993px) { + .bg-lg-up\:gray-900 { + background-color: #212529 !important; + } + + .text-lg-up\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (max-width: 1400px) { + .bg-xl-down\:gray-900 { + background-color: #212529 !important; + } + + .text-xl-down\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .bg-xl\:gray-900 { + background-color: #212529 !important; + } + + .text-xl\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (min-width: 1201px) { + .bg-xl-up\:gray-900 { + background-color: #212529 !important; + } + + .text-xl-up\:gray-900 { + color: #212529 !important; + } +} +@media only screen and (min-width: 1401px) { + .bg-xxl\:gray-900 { + background-color: #212529 !important; + } + + .text-xxl\:gray-900 { + color: #212529 !important; + } +} +.text-decoration\:none { + text-decoration: none; +} + +.text-decoration\:underline { + text-decoration: underline; +} + +.text-overflow\:wrap { + white-space: pre-wrap; + word-wrap: break-word; +} + +.text-overflow\:wrap { + white-space: nowrap; +} + +.m\:-1 { + margin: -10px !important; +} + +.mx\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; +} + +.my\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; +} + +.mt\:-1 { + margin-top: -10px !important; +} + +.mb\:-1 { + margin-bottom: -10px !important; +} + +.ml\:-1 { + margin-left: -10px !important; +} + +.mr\:-1 { + margin-right: -10px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:-1 { + margin: -10px !important; + } + + .mx-xs\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-xs\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-xs\:-1 { + margin-top: -10px !important; + } + + .mb-xs\:-1 { + margin-bottom: -10px !important; + } + + .ml-xs\:-1 { + margin-left: -10px !important; + } + + .mr-xs\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:-1 { + margin: -10px !important; + } + + .mx-sm\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-sm\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-sm\:-1 { + margin-top: -10px !important; + } + + .mb-sm\:-1 { + margin-bottom: -10px !important; + } + + .ml-sm\:-1 { + margin-left: -10px !important; + } + + .mr-sm\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:-1 { + margin: -10px !important; + } + + .mx-md\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-md\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-md\:-1 { + margin-top: -10px !important; + } + + .mb-md\:-1 { + margin-bottom: -10px !important; + } + + .ml-md\:-1 { + margin-left: -10px !important; + } + + .mr-md\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:-1 { + margin: -10px !important; + } + + .mx-lg\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-lg\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-lg\:-1 { + margin-top: -10px !important; + } + + .mb-lg\:-1 { + margin-bottom: -10px !important; + } + + .ml-lg\:-1 { + margin-left: -10px !important; + } + + .mr-lg\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:-1 { + margin: -10px !important; + } + + .mx-xl\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-xl\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-xl\:-1 { + margin-top: -10px !important; + } + + .mb-xl\:-1 { + margin-bottom: -10px !important; + } + + .ml-xl\:-1 { + margin-left: -10px !important; + } + + .mr-xl\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:-1 { + margin: -10px !important; + } + + .mx-xxl\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-xxl\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-xxl\:-1 { + margin-top: -10px !important; + } + + .mb-xxl\:-1 { + margin-bottom: -10px !important; + } + + .ml-xxl\:-1 { + margin-left: -10px !important; + } + + .mr-xxl\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:-1 { + margin: -10px !important; + } + + .mx-sm-up\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-sm-up\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-sm-up\:-1 { + margin-top: -10px !important; + } + + .mb-sm-up\:-1 { + margin-bottom: -10px !important; + } + + .ml-sm-up\:-1 { + margin-left: -10px !important; + } + + .mr-sm-up\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:-1 { + margin: -10px !important; + } + + .mx-md-up\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-md-up\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-md-up\:-1 { + margin-top: -10px !important; + } + + .mb-md-up\:-1 { + margin-bottom: -10px !important; + } + + .ml-md-up\:-1 { + margin-left: -10px !important; + } + + .mr-md-up\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:-1 { + margin: -10px !important; + } + + .mx-lg-up\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-lg-up\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-lg-up\:-1 { + margin-top: -10px !important; + } + + .mb-lg-up\:-1 { + margin-bottom: -10px !important; + } + + .ml-lg-up\:-1 { + margin-left: -10px !important; + } + + .mr-lg-up\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:-1 { + margin: -10px !important; + } + + .mx-xl-up\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-xl-up\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-xl-up\:-1 { + margin-top: -10px !important; + } + + .mb-xl-up\:-1 { + margin-bottom: -10px !important; + } + + .ml-xl-up\:-1 { + margin-left: -10px !important; + } + + .mr-xl-up\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:-1 { + margin: -10px !important; + } + + .mx-sm-down\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-sm-down\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-sm-down\:-1 { + margin-top: -10px !important; + } + + .mb-sm-down\:-1 { + margin-bottom: -10px !important; + } + + .ml-sm-down\:-1 { + margin-left: -10px !important; + } + + .mr-sm-down\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:-1 { + margin: -10px !important; + } + + .mx-md-down\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-md-down\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-md-down\:-1 { + margin-top: -10px !important; + } + + .mb-md-down\:-1 { + margin-bottom: -10px !important; + } + + .ml-md-down\:-1 { + margin-left: -10px !important; + } + + .mr-md-down\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:-1 { + margin: -10px !important; + } + + .mx-lg-down\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-lg-down\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-lg-down\:-1 { + margin-top: -10px !important; + } + + .mb-lg-down\:-1 { + margin-bottom: -10px !important; + } + + .ml-lg-down\:-1 { + margin-left: -10px !important; + } + + .mr-lg-down\:-1 { + margin-right: -10px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:-1 { + margin: -10px !important; + } + + .mx-xl-down\:-1 { + margin-left: -10px !important; + margin-right: -10px !important; + } + + .my-xl-down\:-1 { + margin-top: -10px !important; + margin-bottom: -10px !important; + } + + .mt-xl-down\:-1 { + margin-top: -10px !important; + } + + .mb-xl-down\:-1 { + margin-bottom: -10px !important; + } + + .ml-xl-down\:-1 { + margin-left: -10px !important; + } + + .mr-xl-down\:-1 { + margin-right: -10px !important; + } +} +.m\:-2 { + margin: -20px !important; +} + +.mx\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; +} + +.my\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; +} + +.mt\:-2 { + margin-top: -20px !important; +} + +.mb\:-2 { + margin-bottom: -20px !important; +} + +.ml\:-2 { + margin-left: -20px !important; +} + +.mr\:-2 { + margin-right: -20px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:-2 { + margin: -20px !important; + } + + .mx-xs\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-xs\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-xs\:-2 { + margin-top: -20px !important; + } + + .mb-xs\:-2 { + margin-bottom: -20px !important; + } + + .ml-xs\:-2 { + margin-left: -20px !important; + } + + .mr-xs\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:-2 { + margin: -20px !important; + } + + .mx-sm\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-sm\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-sm\:-2 { + margin-top: -20px !important; + } + + .mb-sm\:-2 { + margin-bottom: -20px !important; + } + + .ml-sm\:-2 { + margin-left: -20px !important; + } + + .mr-sm\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:-2 { + margin: -20px !important; + } + + .mx-md\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-md\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-md\:-2 { + margin-top: -20px !important; + } + + .mb-md\:-2 { + margin-bottom: -20px !important; + } + + .ml-md\:-2 { + margin-left: -20px !important; + } + + .mr-md\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:-2 { + margin: -20px !important; + } + + .mx-lg\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-lg\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-lg\:-2 { + margin-top: -20px !important; + } + + .mb-lg\:-2 { + margin-bottom: -20px !important; + } + + .ml-lg\:-2 { + margin-left: -20px !important; + } + + .mr-lg\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:-2 { + margin: -20px !important; + } + + .mx-xl\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-xl\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-xl\:-2 { + margin-top: -20px !important; + } + + .mb-xl\:-2 { + margin-bottom: -20px !important; + } + + .ml-xl\:-2 { + margin-left: -20px !important; + } + + .mr-xl\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:-2 { + margin: -20px !important; + } + + .mx-xxl\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-xxl\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-xxl\:-2 { + margin-top: -20px !important; + } + + .mb-xxl\:-2 { + margin-bottom: -20px !important; + } + + .ml-xxl\:-2 { + margin-left: -20px !important; + } + + .mr-xxl\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:-2 { + margin: -20px !important; + } + + .mx-sm-up\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-sm-up\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-sm-up\:-2 { + margin-top: -20px !important; + } + + .mb-sm-up\:-2 { + margin-bottom: -20px !important; + } + + .ml-sm-up\:-2 { + margin-left: -20px !important; + } + + .mr-sm-up\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:-2 { + margin: -20px !important; + } + + .mx-md-up\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-md-up\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-md-up\:-2 { + margin-top: -20px !important; + } + + .mb-md-up\:-2 { + margin-bottom: -20px !important; + } + + .ml-md-up\:-2 { + margin-left: -20px !important; + } + + .mr-md-up\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:-2 { + margin: -20px !important; + } + + .mx-lg-up\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-lg-up\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-lg-up\:-2 { + margin-top: -20px !important; + } + + .mb-lg-up\:-2 { + margin-bottom: -20px !important; + } + + .ml-lg-up\:-2 { + margin-left: -20px !important; + } + + .mr-lg-up\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:-2 { + margin: -20px !important; + } + + .mx-xl-up\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-xl-up\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-xl-up\:-2 { + margin-top: -20px !important; + } + + .mb-xl-up\:-2 { + margin-bottom: -20px !important; + } + + .ml-xl-up\:-2 { + margin-left: -20px !important; + } + + .mr-xl-up\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:-2 { + margin: -20px !important; + } + + .mx-sm-down\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-sm-down\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-sm-down\:-2 { + margin-top: -20px !important; + } + + .mb-sm-down\:-2 { + margin-bottom: -20px !important; + } + + .ml-sm-down\:-2 { + margin-left: -20px !important; + } + + .mr-sm-down\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:-2 { + margin: -20px !important; + } + + .mx-md-down\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-md-down\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-md-down\:-2 { + margin-top: -20px !important; + } + + .mb-md-down\:-2 { + margin-bottom: -20px !important; + } + + .ml-md-down\:-2 { + margin-left: -20px !important; + } + + .mr-md-down\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:-2 { + margin: -20px !important; + } + + .mx-lg-down\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-lg-down\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-lg-down\:-2 { + margin-top: -20px !important; + } + + .mb-lg-down\:-2 { + margin-bottom: -20px !important; + } + + .ml-lg-down\:-2 { + margin-left: -20px !important; + } + + .mr-lg-down\:-2 { + margin-right: -20px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:-2 { + margin: -20px !important; + } + + .mx-xl-down\:-2 { + margin-left: -20px !important; + margin-right: -20px !important; + } + + .my-xl-down\:-2 { + margin-top: -20px !important; + margin-bottom: -20px !important; + } + + .mt-xl-down\:-2 { + margin-top: -20px !important; + } + + .mb-xl-down\:-2 { + margin-bottom: -20px !important; + } + + .ml-xl-down\:-2 { + margin-left: -20px !important; + } + + .mr-xl-down\:-2 { + margin-right: -20px !important; + } +} +.m\:-3 { + margin: -30px !important; +} + +.mx\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; +} + +.my\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; +} + +.mt\:-3 { + margin-top: -30px !important; +} + +.mb\:-3 { + margin-bottom: -30px !important; +} + +.ml\:-3 { + margin-left: -30px !important; +} + +.mr\:-3 { + margin-right: -30px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:-3 { + margin: -30px !important; + } + + .mx-xs\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-xs\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-xs\:-3 { + margin-top: -30px !important; + } + + .mb-xs\:-3 { + margin-bottom: -30px !important; + } + + .ml-xs\:-3 { + margin-left: -30px !important; + } + + .mr-xs\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:-3 { + margin: -30px !important; + } + + .mx-sm\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-sm\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-sm\:-3 { + margin-top: -30px !important; + } + + .mb-sm\:-3 { + margin-bottom: -30px !important; + } + + .ml-sm\:-3 { + margin-left: -30px !important; + } + + .mr-sm\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:-3 { + margin: -30px !important; + } + + .mx-md\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-md\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-md\:-3 { + margin-top: -30px !important; + } + + .mb-md\:-3 { + margin-bottom: -30px !important; + } + + .ml-md\:-3 { + margin-left: -30px !important; + } + + .mr-md\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:-3 { + margin: -30px !important; + } + + .mx-lg\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-lg\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-lg\:-3 { + margin-top: -30px !important; + } + + .mb-lg\:-3 { + margin-bottom: -30px !important; + } + + .ml-lg\:-3 { + margin-left: -30px !important; + } + + .mr-lg\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:-3 { + margin: -30px !important; + } + + .mx-xl\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-xl\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-xl\:-3 { + margin-top: -30px !important; + } + + .mb-xl\:-3 { + margin-bottom: -30px !important; + } + + .ml-xl\:-3 { + margin-left: -30px !important; + } + + .mr-xl\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:-3 { + margin: -30px !important; + } + + .mx-xxl\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-xxl\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-xxl\:-3 { + margin-top: -30px !important; + } + + .mb-xxl\:-3 { + margin-bottom: -30px !important; + } + + .ml-xxl\:-3 { + margin-left: -30px !important; + } + + .mr-xxl\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:-3 { + margin: -30px !important; + } + + .mx-sm-up\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-sm-up\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-sm-up\:-3 { + margin-top: -30px !important; + } + + .mb-sm-up\:-3 { + margin-bottom: -30px !important; + } + + .ml-sm-up\:-3 { + margin-left: -30px !important; + } + + .mr-sm-up\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:-3 { + margin: -30px !important; + } + + .mx-md-up\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-md-up\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-md-up\:-3 { + margin-top: -30px !important; + } + + .mb-md-up\:-3 { + margin-bottom: -30px !important; + } + + .ml-md-up\:-3 { + margin-left: -30px !important; + } + + .mr-md-up\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:-3 { + margin: -30px !important; + } + + .mx-lg-up\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-lg-up\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-lg-up\:-3 { + margin-top: -30px !important; + } + + .mb-lg-up\:-3 { + margin-bottom: -30px !important; + } + + .ml-lg-up\:-3 { + margin-left: -30px !important; + } + + .mr-lg-up\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:-3 { + margin: -30px !important; + } + + .mx-xl-up\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-xl-up\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-xl-up\:-3 { + margin-top: -30px !important; + } + + .mb-xl-up\:-3 { + margin-bottom: -30px !important; + } + + .ml-xl-up\:-3 { + margin-left: -30px !important; + } + + .mr-xl-up\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:-3 { + margin: -30px !important; + } + + .mx-sm-down\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-sm-down\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-sm-down\:-3 { + margin-top: -30px !important; + } + + .mb-sm-down\:-3 { + margin-bottom: -30px !important; + } + + .ml-sm-down\:-3 { + margin-left: -30px !important; + } + + .mr-sm-down\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:-3 { + margin: -30px !important; + } + + .mx-md-down\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-md-down\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-md-down\:-3 { + margin-top: -30px !important; + } + + .mb-md-down\:-3 { + margin-bottom: -30px !important; + } + + .ml-md-down\:-3 { + margin-left: -30px !important; + } + + .mr-md-down\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:-3 { + margin: -30px !important; + } + + .mx-lg-down\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-lg-down\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-lg-down\:-3 { + margin-top: -30px !important; + } + + .mb-lg-down\:-3 { + margin-bottom: -30px !important; + } + + .ml-lg-down\:-3 { + margin-left: -30px !important; + } + + .mr-lg-down\:-3 { + margin-right: -30px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:-3 { + margin: -30px !important; + } + + .mx-xl-down\:-3 { + margin-left: -30px !important; + margin-right: -30px !important; + } + + .my-xl-down\:-3 { + margin-top: -30px !important; + margin-bottom: -30px !important; + } + + .mt-xl-down\:-3 { + margin-top: -30px !important; + } + + .mb-xl-down\:-3 { + margin-bottom: -30px !important; + } + + .ml-xl-down\:-3 { + margin-left: -30px !important; + } + + .mr-xl-down\:-3 { + margin-right: -30px !important; + } +} +.m\:-4 { + margin: -40px !important; +} + +.mx\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; +} + +.my\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; +} + +.mt\:-4 { + margin-top: -40px !important; +} + +.mb\:-4 { + margin-bottom: -40px !important; +} + +.ml\:-4 { + margin-left: -40px !important; +} + +.mr\:-4 { + margin-right: -40px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:-4 { + margin: -40px !important; + } + + .mx-xs\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-xs\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-xs\:-4 { + margin-top: -40px !important; + } + + .mb-xs\:-4 { + margin-bottom: -40px !important; + } + + .ml-xs\:-4 { + margin-left: -40px !important; + } + + .mr-xs\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:-4 { + margin: -40px !important; + } + + .mx-sm\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-sm\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-sm\:-4 { + margin-top: -40px !important; + } + + .mb-sm\:-4 { + margin-bottom: -40px !important; + } + + .ml-sm\:-4 { + margin-left: -40px !important; + } + + .mr-sm\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:-4 { + margin: -40px !important; + } + + .mx-md\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-md\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-md\:-4 { + margin-top: -40px !important; + } + + .mb-md\:-4 { + margin-bottom: -40px !important; + } + + .ml-md\:-4 { + margin-left: -40px !important; + } + + .mr-md\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:-4 { + margin: -40px !important; + } + + .mx-lg\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-lg\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-lg\:-4 { + margin-top: -40px !important; + } + + .mb-lg\:-4 { + margin-bottom: -40px !important; + } + + .ml-lg\:-4 { + margin-left: -40px !important; + } + + .mr-lg\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:-4 { + margin: -40px !important; + } + + .mx-xl\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-xl\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-xl\:-4 { + margin-top: -40px !important; + } + + .mb-xl\:-4 { + margin-bottom: -40px !important; + } + + .ml-xl\:-4 { + margin-left: -40px !important; + } + + .mr-xl\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:-4 { + margin: -40px !important; + } + + .mx-xxl\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-xxl\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-xxl\:-4 { + margin-top: -40px !important; + } + + .mb-xxl\:-4 { + margin-bottom: -40px !important; + } + + .ml-xxl\:-4 { + margin-left: -40px !important; + } + + .mr-xxl\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:-4 { + margin: -40px !important; + } + + .mx-sm-up\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-sm-up\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-sm-up\:-4 { + margin-top: -40px !important; + } + + .mb-sm-up\:-4 { + margin-bottom: -40px !important; + } + + .ml-sm-up\:-4 { + margin-left: -40px !important; + } + + .mr-sm-up\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:-4 { + margin: -40px !important; + } + + .mx-md-up\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-md-up\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-md-up\:-4 { + margin-top: -40px !important; + } + + .mb-md-up\:-4 { + margin-bottom: -40px !important; + } + + .ml-md-up\:-4 { + margin-left: -40px !important; + } + + .mr-md-up\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:-4 { + margin: -40px !important; + } + + .mx-lg-up\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-lg-up\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-lg-up\:-4 { + margin-top: -40px !important; + } + + .mb-lg-up\:-4 { + margin-bottom: -40px !important; + } + + .ml-lg-up\:-4 { + margin-left: -40px !important; + } + + .mr-lg-up\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:-4 { + margin: -40px !important; + } + + .mx-xl-up\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-xl-up\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-xl-up\:-4 { + margin-top: -40px !important; + } + + .mb-xl-up\:-4 { + margin-bottom: -40px !important; + } + + .ml-xl-up\:-4 { + margin-left: -40px !important; + } + + .mr-xl-up\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:-4 { + margin: -40px !important; + } + + .mx-sm-down\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-sm-down\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-sm-down\:-4 { + margin-top: -40px !important; + } + + .mb-sm-down\:-4 { + margin-bottom: -40px !important; + } + + .ml-sm-down\:-4 { + margin-left: -40px !important; + } + + .mr-sm-down\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:-4 { + margin: -40px !important; + } + + .mx-md-down\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-md-down\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-md-down\:-4 { + margin-top: -40px !important; + } + + .mb-md-down\:-4 { + margin-bottom: -40px !important; + } + + .ml-md-down\:-4 { + margin-left: -40px !important; + } + + .mr-md-down\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:-4 { + margin: -40px !important; + } + + .mx-lg-down\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-lg-down\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-lg-down\:-4 { + margin-top: -40px !important; + } + + .mb-lg-down\:-4 { + margin-bottom: -40px !important; + } + + .ml-lg-down\:-4 { + margin-left: -40px !important; + } + + .mr-lg-down\:-4 { + margin-right: -40px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:-4 { + margin: -40px !important; + } + + .mx-xl-down\:-4 { + margin-left: -40px !important; + margin-right: -40px !important; + } + + .my-xl-down\:-4 { + margin-top: -40px !important; + margin-bottom: -40px !important; + } + + .mt-xl-down\:-4 { + margin-top: -40px !important; + } + + .mb-xl-down\:-4 { + margin-bottom: -40px !important; + } + + .ml-xl-down\:-4 { + margin-left: -40px !important; + } + + .mr-xl-down\:-4 { + margin-right: -40px !important; + } +} +.m\:-5 { + margin: -50px !important; +} + +.mx\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; +} + +.my\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; +} + +.mt\:-5 { + margin-top: -50px !important; +} + +.mb\:-5 { + margin-bottom: -50px !important; +} + +.ml\:-5 { + margin-left: -50px !important; +} + +.mr\:-5 { + margin-right: -50px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:-5 { + margin: -50px !important; + } + + .mx-xs\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-xs\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-xs\:-5 { + margin-top: -50px !important; + } + + .mb-xs\:-5 { + margin-bottom: -50px !important; + } + + .ml-xs\:-5 { + margin-left: -50px !important; + } + + .mr-xs\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:-5 { + margin: -50px !important; + } + + .mx-sm\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-sm\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-sm\:-5 { + margin-top: -50px !important; + } + + .mb-sm\:-5 { + margin-bottom: -50px !important; + } + + .ml-sm\:-5 { + margin-left: -50px !important; + } + + .mr-sm\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:-5 { + margin: -50px !important; + } + + .mx-md\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-md\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-md\:-5 { + margin-top: -50px !important; + } + + .mb-md\:-5 { + margin-bottom: -50px !important; + } + + .ml-md\:-5 { + margin-left: -50px !important; + } + + .mr-md\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:-5 { + margin: -50px !important; + } + + .mx-lg\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-lg\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-lg\:-5 { + margin-top: -50px !important; + } + + .mb-lg\:-5 { + margin-bottom: -50px !important; + } + + .ml-lg\:-5 { + margin-left: -50px !important; + } + + .mr-lg\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:-5 { + margin: -50px !important; + } + + .mx-xl\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-xl\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-xl\:-5 { + margin-top: -50px !important; + } + + .mb-xl\:-5 { + margin-bottom: -50px !important; + } + + .ml-xl\:-5 { + margin-left: -50px !important; + } + + .mr-xl\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:-5 { + margin: -50px !important; + } + + .mx-xxl\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-xxl\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-xxl\:-5 { + margin-top: -50px !important; + } + + .mb-xxl\:-5 { + margin-bottom: -50px !important; + } + + .ml-xxl\:-5 { + margin-left: -50px !important; + } + + .mr-xxl\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:-5 { + margin: -50px !important; + } + + .mx-sm-up\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-sm-up\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-sm-up\:-5 { + margin-top: -50px !important; + } + + .mb-sm-up\:-5 { + margin-bottom: -50px !important; + } + + .ml-sm-up\:-5 { + margin-left: -50px !important; + } + + .mr-sm-up\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:-5 { + margin: -50px !important; + } + + .mx-md-up\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-md-up\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-md-up\:-5 { + margin-top: -50px !important; + } + + .mb-md-up\:-5 { + margin-bottom: -50px !important; + } + + .ml-md-up\:-5 { + margin-left: -50px !important; + } + + .mr-md-up\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:-5 { + margin: -50px !important; + } + + .mx-lg-up\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-lg-up\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-lg-up\:-5 { + margin-top: -50px !important; + } + + .mb-lg-up\:-5 { + margin-bottom: -50px !important; + } + + .ml-lg-up\:-5 { + margin-left: -50px !important; + } + + .mr-lg-up\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:-5 { + margin: -50px !important; + } + + .mx-xl-up\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-xl-up\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-xl-up\:-5 { + margin-top: -50px !important; + } + + .mb-xl-up\:-5 { + margin-bottom: -50px !important; + } + + .ml-xl-up\:-5 { + margin-left: -50px !important; + } + + .mr-xl-up\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:-5 { + margin: -50px !important; + } + + .mx-sm-down\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-sm-down\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-sm-down\:-5 { + margin-top: -50px !important; + } + + .mb-sm-down\:-5 { + margin-bottom: -50px !important; + } + + .ml-sm-down\:-5 { + margin-left: -50px !important; + } + + .mr-sm-down\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:-5 { + margin: -50px !important; + } + + .mx-md-down\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-md-down\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-md-down\:-5 { + margin-top: -50px !important; + } + + .mb-md-down\:-5 { + margin-bottom: -50px !important; + } + + .ml-md-down\:-5 { + margin-left: -50px !important; + } + + .mr-md-down\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:-5 { + margin: -50px !important; + } + + .mx-lg-down\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-lg-down\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-lg-down\:-5 { + margin-top: -50px !important; + } + + .mb-lg-down\:-5 { + margin-bottom: -50px !important; + } + + .ml-lg-down\:-5 { + margin-left: -50px !important; + } + + .mr-lg-down\:-5 { + margin-right: -50px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:-5 { + margin: -50px !important; + } + + .mx-xl-down\:-5 { + margin-left: -50px !important; + margin-right: -50px !important; + } + + .my-xl-down\:-5 { + margin-top: -50px !important; + margin-bottom: -50px !important; + } + + .mt-xl-down\:-5 { + margin-top: -50px !important; + } + + .mb-xl-down\:-5 { + margin-bottom: -50px !important; + } + + .ml-xl-down\:-5 { + margin-left: -50px !important; + } + + .mr-xl-down\:-5 { + margin-right: -50px !important; + } +} +.m\:-6 { + margin: -60px !important; +} + +.mx\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; +} + +.my\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; +} + +.mt\:-6 { + margin-top: -60px !important; +} + +.mb\:-6 { + margin-bottom: -60px !important; +} + +.ml\:-6 { + margin-left: -60px !important; +} + +.mr\:-6 { + margin-right: -60px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:-6 { + margin: -60px !important; + } + + .mx-xs\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-xs\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-xs\:-6 { + margin-top: -60px !important; + } + + .mb-xs\:-6 { + margin-bottom: -60px !important; + } + + .ml-xs\:-6 { + margin-left: -60px !important; + } + + .mr-xs\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:-6 { + margin: -60px !important; + } + + .mx-sm\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-sm\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-sm\:-6 { + margin-top: -60px !important; + } + + .mb-sm\:-6 { + margin-bottom: -60px !important; + } + + .ml-sm\:-6 { + margin-left: -60px !important; + } + + .mr-sm\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:-6 { + margin: -60px !important; + } + + .mx-md\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-md\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-md\:-6 { + margin-top: -60px !important; + } + + .mb-md\:-6 { + margin-bottom: -60px !important; + } + + .ml-md\:-6 { + margin-left: -60px !important; + } + + .mr-md\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:-6 { + margin: -60px !important; + } + + .mx-lg\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-lg\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-lg\:-6 { + margin-top: -60px !important; + } + + .mb-lg\:-6 { + margin-bottom: -60px !important; + } + + .ml-lg\:-6 { + margin-left: -60px !important; + } + + .mr-lg\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:-6 { + margin: -60px !important; + } + + .mx-xl\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-xl\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-xl\:-6 { + margin-top: -60px !important; + } + + .mb-xl\:-6 { + margin-bottom: -60px !important; + } + + .ml-xl\:-6 { + margin-left: -60px !important; + } + + .mr-xl\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:-6 { + margin: -60px !important; + } + + .mx-xxl\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-xxl\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-xxl\:-6 { + margin-top: -60px !important; + } + + .mb-xxl\:-6 { + margin-bottom: -60px !important; + } + + .ml-xxl\:-6 { + margin-left: -60px !important; + } + + .mr-xxl\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:-6 { + margin: -60px !important; + } + + .mx-sm-up\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-sm-up\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-sm-up\:-6 { + margin-top: -60px !important; + } + + .mb-sm-up\:-6 { + margin-bottom: -60px !important; + } + + .ml-sm-up\:-6 { + margin-left: -60px !important; + } + + .mr-sm-up\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:-6 { + margin: -60px !important; + } + + .mx-md-up\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-md-up\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-md-up\:-6 { + margin-top: -60px !important; + } + + .mb-md-up\:-6 { + margin-bottom: -60px !important; + } + + .ml-md-up\:-6 { + margin-left: -60px !important; + } + + .mr-md-up\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:-6 { + margin: -60px !important; + } + + .mx-lg-up\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-lg-up\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-lg-up\:-6 { + margin-top: -60px !important; + } + + .mb-lg-up\:-6 { + margin-bottom: -60px !important; + } + + .ml-lg-up\:-6 { + margin-left: -60px !important; + } + + .mr-lg-up\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:-6 { + margin: -60px !important; + } + + .mx-xl-up\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-xl-up\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-xl-up\:-6 { + margin-top: -60px !important; + } + + .mb-xl-up\:-6 { + margin-bottom: -60px !important; + } + + .ml-xl-up\:-6 { + margin-left: -60px !important; + } + + .mr-xl-up\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:-6 { + margin: -60px !important; + } + + .mx-sm-down\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-sm-down\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-sm-down\:-6 { + margin-top: -60px !important; + } + + .mb-sm-down\:-6 { + margin-bottom: -60px !important; + } + + .ml-sm-down\:-6 { + margin-left: -60px !important; + } + + .mr-sm-down\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:-6 { + margin: -60px !important; + } + + .mx-md-down\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-md-down\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-md-down\:-6 { + margin-top: -60px !important; + } + + .mb-md-down\:-6 { + margin-bottom: -60px !important; + } + + .ml-md-down\:-6 { + margin-left: -60px !important; + } + + .mr-md-down\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:-6 { + margin: -60px !important; + } + + .mx-lg-down\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-lg-down\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-lg-down\:-6 { + margin-top: -60px !important; + } + + .mb-lg-down\:-6 { + margin-bottom: -60px !important; + } + + .ml-lg-down\:-6 { + margin-left: -60px !important; + } + + .mr-lg-down\:-6 { + margin-right: -60px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:-6 { + margin: -60px !important; + } + + .mx-xl-down\:-6 { + margin-left: -60px !important; + margin-right: -60px !important; + } + + .my-xl-down\:-6 { + margin-top: -60px !important; + margin-bottom: -60px !important; + } + + .mt-xl-down\:-6 { + margin-top: -60px !important; + } + + .mb-xl-down\:-6 { + margin-bottom: -60px !important; + } + + .ml-xl-down\:-6 { + margin-left: -60px !important; + } + + .mr-xl-down\:-6 { + margin-right: -60px !important; + } +} +.m\:-7 { + margin: -70px !important; +} + +.mx\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; +} + +.my\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; +} + +.mt\:-7 { + margin-top: -70px !important; +} + +.mb\:-7 { + margin-bottom: -70px !important; +} + +.ml\:-7 { + margin-left: -70px !important; +} + +.mr\:-7 { + margin-right: -70px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:-7 { + margin: -70px !important; + } + + .mx-xs\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-xs\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-xs\:-7 { + margin-top: -70px !important; + } + + .mb-xs\:-7 { + margin-bottom: -70px !important; + } + + .ml-xs\:-7 { + margin-left: -70px !important; + } + + .mr-xs\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:-7 { + margin: -70px !important; + } + + .mx-sm\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-sm\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-sm\:-7 { + margin-top: -70px !important; + } + + .mb-sm\:-7 { + margin-bottom: -70px !important; + } + + .ml-sm\:-7 { + margin-left: -70px !important; + } + + .mr-sm\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:-7 { + margin: -70px !important; + } + + .mx-md\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-md\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-md\:-7 { + margin-top: -70px !important; + } + + .mb-md\:-7 { + margin-bottom: -70px !important; + } + + .ml-md\:-7 { + margin-left: -70px !important; + } + + .mr-md\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:-7 { + margin: -70px !important; + } + + .mx-lg\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-lg\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-lg\:-7 { + margin-top: -70px !important; + } + + .mb-lg\:-7 { + margin-bottom: -70px !important; + } + + .ml-lg\:-7 { + margin-left: -70px !important; + } + + .mr-lg\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:-7 { + margin: -70px !important; + } + + .mx-xl\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-xl\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-xl\:-7 { + margin-top: -70px !important; + } + + .mb-xl\:-7 { + margin-bottom: -70px !important; + } + + .ml-xl\:-7 { + margin-left: -70px !important; + } + + .mr-xl\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:-7 { + margin: -70px !important; + } + + .mx-xxl\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-xxl\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-xxl\:-7 { + margin-top: -70px !important; + } + + .mb-xxl\:-7 { + margin-bottom: -70px !important; + } + + .ml-xxl\:-7 { + margin-left: -70px !important; + } + + .mr-xxl\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:-7 { + margin: -70px !important; + } + + .mx-sm-up\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-sm-up\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-sm-up\:-7 { + margin-top: -70px !important; + } + + .mb-sm-up\:-7 { + margin-bottom: -70px !important; + } + + .ml-sm-up\:-7 { + margin-left: -70px !important; + } + + .mr-sm-up\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:-7 { + margin: -70px !important; + } + + .mx-md-up\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-md-up\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-md-up\:-7 { + margin-top: -70px !important; + } + + .mb-md-up\:-7 { + margin-bottom: -70px !important; + } + + .ml-md-up\:-7 { + margin-left: -70px !important; + } + + .mr-md-up\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:-7 { + margin: -70px !important; + } + + .mx-lg-up\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-lg-up\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-lg-up\:-7 { + margin-top: -70px !important; + } + + .mb-lg-up\:-7 { + margin-bottom: -70px !important; + } + + .ml-lg-up\:-7 { + margin-left: -70px !important; + } + + .mr-lg-up\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:-7 { + margin: -70px !important; + } + + .mx-xl-up\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-xl-up\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-xl-up\:-7 { + margin-top: -70px !important; + } + + .mb-xl-up\:-7 { + margin-bottom: -70px !important; + } + + .ml-xl-up\:-7 { + margin-left: -70px !important; + } + + .mr-xl-up\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:-7 { + margin: -70px !important; + } + + .mx-sm-down\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-sm-down\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-sm-down\:-7 { + margin-top: -70px !important; + } + + .mb-sm-down\:-7 { + margin-bottom: -70px !important; + } + + .ml-sm-down\:-7 { + margin-left: -70px !important; + } + + .mr-sm-down\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:-7 { + margin: -70px !important; + } + + .mx-md-down\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-md-down\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-md-down\:-7 { + margin-top: -70px !important; + } + + .mb-md-down\:-7 { + margin-bottom: -70px !important; + } + + .ml-md-down\:-7 { + margin-left: -70px !important; + } + + .mr-md-down\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:-7 { + margin: -70px !important; + } + + .mx-lg-down\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-lg-down\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-lg-down\:-7 { + margin-top: -70px !important; + } + + .mb-lg-down\:-7 { + margin-bottom: -70px !important; + } + + .ml-lg-down\:-7 { + margin-left: -70px !important; + } + + .mr-lg-down\:-7 { + margin-right: -70px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:-7 { + margin: -70px !important; + } + + .mx-xl-down\:-7 { + margin-left: -70px !important; + margin-right: -70px !important; + } + + .my-xl-down\:-7 { + margin-top: -70px !important; + margin-bottom: -70px !important; + } + + .mt-xl-down\:-7 { + margin-top: -70px !important; + } + + .mb-xl-down\:-7 { + margin-bottom: -70px !important; + } + + .ml-xl-down\:-7 { + margin-left: -70px !important; + } + + .mr-xl-down\:-7 { + margin-right: -70px !important; + } +} +.m\:-8 { + margin: -80px !important; +} + +.mx\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; +} + +.my\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; +} + +.mt\:-8 { + margin-top: -80px !important; +} + +.mb\:-8 { + margin-bottom: -80px !important; +} + +.ml\:-8 { + margin-left: -80px !important; +} + +.mr\:-8 { + margin-right: -80px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:-8 { + margin: -80px !important; + } + + .mx-xs\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-xs\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-xs\:-8 { + margin-top: -80px !important; + } + + .mb-xs\:-8 { + margin-bottom: -80px !important; + } + + .ml-xs\:-8 { + margin-left: -80px !important; + } + + .mr-xs\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:-8 { + margin: -80px !important; + } + + .mx-sm\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-sm\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-sm\:-8 { + margin-top: -80px !important; + } + + .mb-sm\:-8 { + margin-bottom: -80px !important; + } + + .ml-sm\:-8 { + margin-left: -80px !important; + } + + .mr-sm\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:-8 { + margin: -80px !important; + } + + .mx-md\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-md\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-md\:-8 { + margin-top: -80px !important; + } + + .mb-md\:-8 { + margin-bottom: -80px !important; + } + + .ml-md\:-8 { + margin-left: -80px !important; + } + + .mr-md\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:-8 { + margin: -80px !important; + } + + .mx-lg\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-lg\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-lg\:-8 { + margin-top: -80px !important; + } + + .mb-lg\:-8 { + margin-bottom: -80px !important; + } + + .ml-lg\:-8 { + margin-left: -80px !important; + } + + .mr-lg\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:-8 { + margin: -80px !important; + } + + .mx-xl\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-xl\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-xl\:-8 { + margin-top: -80px !important; + } + + .mb-xl\:-8 { + margin-bottom: -80px !important; + } + + .ml-xl\:-8 { + margin-left: -80px !important; + } + + .mr-xl\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:-8 { + margin: -80px !important; + } + + .mx-xxl\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-xxl\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-xxl\:-8 { + margin-top: -80px !important; + } + + .mb-xxl\:-8 { + margin-bottom: -80px !important; + } + + .ml-xxl\:-8 { + margin-left: -80px !important; + } + + .mr-xxl\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:-8 { + margin: -80px !important; + } + + .mx-sm-up\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-sm-up\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-sm-up\:-8 { + margin-top: -80px !important; + } + + .mb-sm-up\:-8 { + margin-bottom: -80px !important; + } + + .ml-sm-up\:-8 { + margin-left: -80px !important; + } + + .mr-sm-up\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:-8 { + margin: -80px !important; + } + + .mx-md-up\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-md-up\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-md-up\:-8 { + margin-top: -80px !important; + } + + .mb-md-up\:-8 { + margin-bottom: -80px !important; + } + + .ml-md-up\:-8 { + margin-left: -80px !important; + } + + .mr-md-up\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:-8 { + margin: -80px !important; + } + + .mx-lg-up\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-lg-up\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-lg-up\:-8 { + margin-top: -80px !important; + } + + .mb-lg-up\:-8 { + margin-bottom: -80px !important; + } + + .ml-lg-up\:-8 { + margin-left: -80px !important; + } + + .mr-lg-up\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:-8 { + margin: -80px !important; + } + + .mx-xl-up\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-xl-up\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-xl-up\:-8 { + margin-top: -80px !important; + } + + .mb-xl-up\:-8 { + margin-bottom: -80px !important; + } + + .ml-xl-up\:-8 { + margin-left: -80px !important; + } + + .mr-xl-up\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:-8 { + margin: -80px !important; + } + + .mx-sm-down\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-sm-down\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-sm-down\:-8 { + margin-top: -80px !important; + } + + .mb-sm-down\:-8 { + margin-bottom: -80px !important; + } + + .ml-sm-down\:-8 { + margin-left: -80px !important; + } + + .mr-sm-down\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:-8 { + margin: -80px !important; + } + + .mx-md-down\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-md-down\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-md-down\:-8 { + margin-top: -80px !important; + } + + .mb-md-down\:-8 { + margin-bottom: -80px !important; + } + + .ml-md-down\:-8 { + margin-left: -80px !important; + } + + .mr-md-down\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:-8 { + margin: -80px !important; + } + + .mx-lg-down\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-lg-down\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-lg-down\:-8 { + margin-top: -80px !important; + } + + .mb-lg-down\:-8 { + margin-bottom: -80px !important; + } + + .ml-lg-down\:-8 { + margin-left: -80px !important; + } + + .mr-lg-down\:-8 { + margin-right: -80px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:-8 { + margin: -80px !important; + } + + .mx-xl-down\:-8 { + margin-left: -80px !important; + margin-right: -80px !important; + } + + .my-xl-down\:-8 { + margin-top: -80px !important; + margin-bottom: -80px !important; + } + + .mt-xl-down\:-8 { + margin-top: -80px !important; + } + + .mb-xl-down\:-8 { + margin-bottom: -80px !important; + } + + .ml-xl-down\:-8 { + margin-left: -80px !important; + } + + .mr-xl-down\:-8 { + margin-right: -80px !important; + } +} +.m\:-9 { + margin: -90px !important; +} + +.mx\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; +} + +.my\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; +} + +.mt\:-9 { + margin-top: -90px !important; +} + +.mb\:-9 { + margin-bottom: -90px !important; +} + +.ml\:-9 { + margin-left: -90px !important; +} + +.mr\:-9 { + margin-right: -90px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:-9 { + margin: -90px !important; + } + + .mx-xs\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-xs\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-xs\:-9 { + margin-top: -90px !important; + } + + .mb-xs\:-9 { + margin-bottom: -90px !important; + } + + .ml-xs\:-9 { + margin-left: -90px !important; + } + + .mr-xs\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:-9 { + margin: -90px !important; + } + + .mx-sm\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-sm\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-sm\:-9 { + margin-top: -90px !important; + } + + .mb-sm\:-9 { + margin-bottom: -90px !important; + } + + .ml-sm\:-9 { + margin-left: -90px !important; + } + + .mr-sm\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:-9 { + margin: -90px !important; + } + + .mx-md\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-md\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-md\:-9 { + margin-top: -90px !important; + } + + .mb-md\:-9 { + margin-bottom: -90px !important; + } + + .ml-md\:-9 { + margin-left: -90px !important; + } + + .mr-md\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:-9 { + margin: -90px !important; + } + + .mx-lg\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-lg\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-lg\:-9 { + margin-top: -90px !important; + } + + .mb-lg\:-9 { + margin-bottom: -90px !important; + } + + .ml-lg\:-9 { + margin-left: -90px !important; + } + + .mr-lg\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:-9 { + margin: -90px !important; + } + + .mx-xl\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-xl\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-xl\:-9 { + margin-top: -90px !important; + } + + .mb-xl\:-9 { + margin-bottom: -90px !important; + } + + .ml-xl\:-9 { + margin-left: -90px !important; + } + + .mr-xl\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:-9 { + margin: -90px !important; + } + + .mx-xxl\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-xxl\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-xxl\:-9 { + margin-top: -90px !important; + } + + .mb-xxl\:-9 { + margin-bottom: -90px !important; + } + + .ml-xxl\:-9 { + margin-left: -90px !important; + } + + .mr-xxl\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:-9 { + margin: -90px !important; + } + + .mx-sm-up\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-sm-up\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-sm-up\:-9 { + margin-top: -90px !important; + } + + .mb-sm-up\:-9 { + margin-bottom: -90px !important; + } + + .ml-sm-up\:-9 { + margin-left: -90px !important; + } + + .mr-sm-up\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:-9 { + margin: -90px !important; + } + + .mx-md-up\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-md-up\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-md-up\:-9 { + margin-top: -90px !important; + } + + .mb-md-up\:-9 { + margin-bottom: -90px !important; + } + + .ml-md-up\:-9 { + margin-left: -90px !important; + } + + .mr-md-up\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:-9 { + margin: -90px !important; + } + + .mx-lg-up\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-lg-up\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-lg-up\:-9 { + margin-top: -90px !important; + } + + .mb-lg-up\:-9 { + margin-bottom: -90px !important; + } + + .ml-lg-up\:-9 { + margin-left: -90px !important; + } + + .mr-lg-up\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:-9 { + margin: -90px !important; + } + + .mx-xl-up\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-xl-up\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-xl-up\:-9 { + margin-top: -90px !important; + } + + .mb-xl-up\:-9 { + margin-bottom: -90px !important; + } + + .ml-xl-up\:-9 { + margin-left: -90px !important; + } + + .mr-xl-up\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:-9 { + margin: -90px !important; + } + + .mx-sm-down\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-sm-down\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-sm-down\:-9 { + margin-top: -90px !important; + } + + .mb-sm-down\:-9 { + margin-bottom: -90px !important; + } + + .ml-sm-down\:-9 { + margin-left: -90px !important; + } + + .mr-sm-down\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:-9 { + margin: -90px !important; + } + + .mx-md-down\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-md-down\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-md-down\:-9 { + margin-top: -90px !important; + } + + .mb-md-down\:-9 { + margin-bottom: -90px !important; + } + + .ml-md-down\:-9 { + margin-left: -90px !important; + } + + .mr-md-down\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:-9 { + margin: -90px !important; + } + + .mx-lg-down\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-lg-down\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-lg-down\:-9 { + margin-top: -90px !important; + } + + .mb-lg-down\:-9 { + margin-bottom: -90px !important; + } + + .ml-lg-down\:-9 { + margin-left: -90px !important; + } + + .mr-lg-down\:-9 { + margin-right: -90px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:-9 { + margin: -90px !important; + } + + .mx-xl-down\:-9 { + margin-left: -90px !important; + margin-right: -90px !important; + } + + .my-xl-down\:-9 { + margin-top: -90px !important; + margin-bottom: -90px !important; + } + + .mt-xl-down\:-9 { + margin-top: -90px !important; + } + + .mb-xl-down\:-9 { + margin-bottom: -90px !important; + } + + .ml-xl-down\:-9 { + margin-left: -90px !important; + } + + .mr-xl-down\:-9 { + margin-right: -90px !important; + } +} +.m\:-10 { + margin: -100px !important; +} + +.mx\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; +} + +.my\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; +} + +.mt\:-10 { + margin-top: -100px !important; +} + +.mb\:-10 { + margin-bottom: -100px !important; +} + +.ml\:-10 { + margin-left: -100px !important; +} + +.mr\:-10 { + margin-right: -100px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:-10 { + margin: -100px !important; + } + + .mx-xs\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-xs\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-xs\:-10 { + margin-top: -100px !important; + } + + .mb-xs\:-10 { + margin-bottom: -100px !important; + } + + .ml-xs\:-10 { + margin-left: -100px !important; + } + + .mr-xs\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:-10 { + margin: -100px !important; + } + + .mx-sm\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-sm\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-sm\:-10 { + margin-top: -100px !important; + } + + .mb-sm\:-10 { + margin-bottom: -100px !important; + } + + .ml-sm\:-10 { + margin-left: -100px !important; + } + + .mr-sm\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:-10 { + margin: -100px !important; + } + + .mx-md\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-md\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-md\:-10 { + margin-top: -100px !important; + } + + .mb-md\:-10 { + margin-bottom: -100px !important; + } + + .ml-md\:-10 { + margin-left: -100px !important; + } + + .mr-md\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:-10 { + margin: -100px !important; + } + + .mx-lg\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-lg\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-lg\:-10 { + margin-top: -100px !important; + } + + .mb-lg\:-10 { + margin-bottom: -100px !important; + } + + .ml-lg\:-10 { + margin-left: -100px !important; + } + + .mr-lg\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:-10 { + margin: -100px !important; + } + + .mx-xl\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-xl\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-xl\:-10 { + margin-top: -100px !important; + } + + .mb-xl\:-10 { + margin-bottom: -100px !important; + } + + .ml-xl\:-10 { + margin-left: -100px !important; + } + + .mr-xl\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:-10 { + margin: -100px !important; + } + + .mx-xxl\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-xxl\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-xxl\:-10 { + margin-top: -100px !important; + } + + .mb-xxl\:-10 { + margin-bottom: -100px !important; + } + + .ml-xxl\:-10 { + margin-left: -100px !important; + } + + .mr-xxl\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:-10 { + margin: -100px !important; + } + + .mx-sm-up\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-sm-up\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-sm-up\:-10 { + margin-top: -100px !important; + } + + .mb-sm-up\:-10 { + margin-bottom: -100px !important; + } + + .ml-sm-up\:-10 { + margin-left: -100px !important; + } + + .mr-sm-up\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:-10 { + margin: -100px !important; + } + + .mx-md-up\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-md-up\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-md-up\:-10 { + margin-top: -100px !important; + } + + .mb-md-up\:-10 { + margin-bottom: -100px !important; + } + + .ml-md-up\:-10 { + margin-left: -100px !important; + } + + .mr-md-up\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:-10 { + margin: -100px !important; + } + + .mx-lg-up\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-lg-up\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-lg-up\:-10 { + margin-top: -100px !important; + } + + .mb-lg-up\:-10 { + margin-bottom: -100px !important; + } + + .ml-lg-up\:-10 { + margin-left: -100px !important; + } + + .mr-lg-up\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:-10 { + margin: -100px !important; + } + + .mx-xl-up\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-xl-up\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-xl-up\:-10 { + margin-top: -100px !important; + } + + .mb-xl-up\:-10 { + margin-bottom: -100px !important; + } + + .ml-xl-up\:-10 { + margin-left: -100px !important; + } + + .mr-xl-up\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:-10 { + margin: -100px !important; + } + + .mx-sm-down\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-sm-down\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-sm-down\:-10 { + margin-top: -100px !important; + } + + .mb-sm-down\:-10 { + margin-bottom: -100px !important; + } + + .ml-sm-down\:-10 { + margin-left: -100px !important; + } + + .mr-sm-down\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:-10 { + margin: -100px !important; + } + + .mx-md-down\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-md-down\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-md-down\:-10 { + margin-top: -100px !important; + } + + .mb-md-down\:-10 { + margin-bottom: -100px !important; + } + + .ml-md-down\:-10 { + margin-left: -100px !important; + } + + .mr-md-down\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:-10 { + margin: -100px !important; + } + + .mx-lg-down\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-lg-down\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-lg-down\:-10 { + margin-top: -100px !important; + } + + .mb-lg-down\:-10 { + margin-bottom: -100px !important; + } + + .ml-lg-down\:-10 { + margin-left: -100px !important; + } + + .mr-lg-down\:-10 { + margin-right: -100px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:-10 { + margin: -100px !important; + } + + .mx-xl-down\:-10 { + margin-left: -100px !important; + margin-right: -100px !important; + } + + .my-xl-down\:-10 { + margin-top: -100px !important; + margin-bottom: -100px !important; + } + + .mt-xl-down\:-10 { + margin-top: -100px !important; + } + + .mb-xl-down\:-10 { + margin-bottom: -100px !important; + } + + .ml-xl-down\:-10 { + margin-left: -100px !important; + } + + .mr-xl-down\:-10 { + margin-right: -100px !important; + } +} +.m\:0 { + margin: 0 !important; +} + +.mx\:0 { + margin-left: 0 !important; + margin-right: 0 !important; +} + +.my\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; +} + +.mt\:0 { + margin-top: 0 !important; +} + +.mb\:0 { + margin-bottom: 0 !important; +} + +.ml\:0 { + margin-left: 0 !important; +} + +.mr\:0 { + margin-right: 0 !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:0 { + margin: 0 !important; + } + + .mx-xs\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-xs\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-xs\:0 { + margin-top: 0 !important; + } + + .mb-xs\:0 { + margin-bottom: 0 !important; + } + + .ml-xs\:0 { + margin-left: 0 !important; + } + + .mr-xs\:0 { + margin-right: 0 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:0 { + margin: 0 !important; + } + + .mx-sm\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-sm\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-sm\:0 { + margin-top: 0 !important; + } + + .mb-sm\:0 { + margin-bottom: 0 !important; + } + + .ml-sm\:0 { + margin-left: 0 !important; + } + + .mr-sm\:0 { + margin-right: 0 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:0 { + margin: 0 !important; + } + + .mx-md\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-md\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-md\:0 { + margin-top: 0 !important; + } + + .mb-md\:0 { + margin-bottom: 0 !important; + } + + .ml-md\:0 { + margin-left: 0 !important; + } + + .mr-md\:0 { + margin-right: 0 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:0 { + margin: 0 !important; + } + + .mx-lg\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-lg\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-lg\:0 { + margin-top: 0 !important; + } + + .mb-lg\:0 { + margin-bottom: 0 !important; + } + + .ml-lg\:0 { + margin-left: 0 !important; + } + + .mr-lg\:0 { + margin-right: 0 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:0 { + margin: 0 !important; + } + + .mx-xl\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-xl\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-xl\:0 { + margin-top: 0 !important; + } + + .mb-xl\:0 { + margin-bottom: 0 !important; + } + + .ml-xl\:0 { + margin-left: 0 !important; + } + + .mr-xl\:0 { + margin-right: 0 !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:0 { + margin: 0 !important; + } + + .mx-xxl\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-xxl\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-xxl\:0 { + margin-top: 0 !important; + } + + .mb-xxl\:0 { + margin-bottom: 0 !important; + } + + .ml-xxl\:0 { + margin-left: 0 !important; + } + + .mr-xxl\:0 { + margin-right: 0 !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:0 { + margin: 0 !important; + } + + .mx-sm-up\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-sm-up\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-sm-up\:0 { + margin-top: 0 !important; + } + + .mb-sm-up\:0 { + margin-bottom: 0 !important; + } + + .ml-sm-up\:0 { + margin-left: 0 !important; + } + + .mr-sm-up\:0 { + margin-right: 0 !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:0 { + margin: 0 !important; + } + + .mx-md-up\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-md-up\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-md-up\:0 { + margin-top: 0 !important; + } + + .mb-md-up\:0 { + margin-bottom: 0 !important; + } + + .ml-md-up\:0 { + margin-left: 0 !important; + } + + .mr-md-up\:0 { + margin-right: 0 !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:0 { + margin: 0 !important; + } + + .mx-lg-up\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-lg-up\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-lg-up\:0 { + margin-top: 0 !important; + } + + .mb-lg-up\:0 { + margin-bottom: 0 !important; + } + + .ml-lg-up\:0 { + margin-left: 0 !important; + } + + .mr-lg-up\:0 { + margin-right: 0 !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:0 { + margin: 0 !important; + } + + .mx-xl-up\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-xl-up\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-xl-up\:0 { + margin-top: 0 !important; + } + + .mb-xl-up\:0 { + margin-bottom: 0 !important; + } + + .ml-xl-up\:0 { + margin-left: 0 !important; + } + + .mr-xl-up\:0 { + margin-right: 0 !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:0 { + margin: 0 !important; + } + + .mx-sm-down\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-sm-down\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-sm-down\:0 { + margin-top: 0 !important; + } + + .mb-sm-down\:0 { + margin-bottom: 0 !important; + } + + .ml-sm-down\:0 { + margin-left: 0 !important; + } + + .mr-sm-down\:0 { + margin-right: 0 !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:0 { + margin: 0 !important; + } + + .mx-md-down\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-md-down\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-md-down\:0 { + margin-top: 0 !important; + } + + .mb-md-down\:0 { + margin-bottom: 0 !important; + } + + .ml-md-down\:0 { + margin-left: 0 !important; + } + + .mr-md-down\:0 { + margin-right: 0 !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:0 { + margin: 0 !important; + } + + .mx-lg-down\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-lg-down\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-lg-down\:0 { + margin-top: 0 !important; + } + + .mb-lg-down\:0 { + margin-bottom: 0 !important; + } + + .ml-lg-down\:0 { + margin-left: 0 !important; + } + + .mr-lg-down\:0 { + margin-right: 0 !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:0 { + margin: 0 !important; + } + + .mx-xl-down\:0 { + margin-left: 0 !important; + margin-right: 0 !important; + } + + .my-xl-down\:0 { + margin-top: 0 !important; + margin-bottom: 0 !important; + } + + .mt-xl-down\:0 { + margin-top: 0 !important; + } + + .mb-xl-down\:0 { + margin-bottom: 0 !important; + } + + .ml-xl-down\:0 { + margin-left: 0 !important; + } + + .mr-xl-down\:0 { + margin-right: 0 !important; + } +} +.m\:_1 { + margin: 10px !important; +} + +.mx\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; +} + +.my\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; +} + +.mt\:_1 { + margin-top: 10px !important; +} + +.mb\:_1 { + margin-bottom: 10px !important; +} + +.ml\:_1 { + margin-left: 10px !important; +} + +.mr\:_1 { + margin-right: 10px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:_1 { + margin: 10px !important; + } + + .mx-xs\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-xs\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-xs\:_1 { + margin-top: 10px !important; + } + + .mb-xs\:_1 { + margin-bottom: 10px !important; + } + + .ml-xs\:_1 { + margin-left: 10px !important; + } + + .mr-xs\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:_1 { + margin: 10px !important; + } + + .mx-sm\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-sm\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-sm\:_1 { + margin-top: 10px !important; + } + + .mb-sm\:_1 { + margin-bottom: 10px !important; + } + + .ml-sm\:_1 { + margin-left: 10px !important; + } + + .mr-sm\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:_1 { + margin: 10px !important; + } + + .mx-md\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-md\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-md\:_1 { + margin-top: 10px !important; + } + + .mb-md\:_1 { + margin-bottom: 10px !important; + } + + .ml-md\:_1 { + margin-left: 10px !important; + } + + .mr-md\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:_1 { + margin: 10px !important; + } + + .mx-lg\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-lg\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-lg\:_1 { + margin-top: 10px !important; + } + + .mb-lg\:_1 { + margin-bottom: 10px !important; + } + + .ml-lg\:_1 { + margin-left: 10px !important; + } + + .mr-lg\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:_1 { + margin: 10px !important; + } + + .mx-xl\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-xl\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-xl\:_1 { + margin-top: 10px !important; + } + + .mb-xl\:_1 { + margin-bottom: 10px !important; + } + + .ml-xl\:_1 { + margin-left: 10px !important; + } + + .mr-xl\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:_1 { + margin: 10px !important; + } + + .mx-xxl\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-xxl\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-xxl\:_1 { + margin-top: 10px !important; + } + + .mb-xxl\:_1 { + margin-bottom: 10px !important; + } + + .ml-xxl\:_1 { + margin-left: 10px !important; + } + + .mr-xxl\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:_1 { + margin: 10px !important; + } + + .mx-sm-up\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-sm-up\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-sm-up\:_1 { + margin-top: 10px !important; + } + + .mb-sm-up\:_1 { + margin-bottom: 10px !important; + } + + .ml-sm-up\:_1 { + margin-left: 10px !important; + } + + .mr-sm-up\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:_1 { + margin: 10px !important; + } + + .mx-md-up\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-md-up\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-md-up\:_1 { + margin-top: 10px !important; + } + + .mb-md-up\:_1 { + margin-bottom: 10px !important; + } + + .ml-md-up\:_1 { + margin-left: 10px !important; + } + + .mr-md-up\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:_1 { + margin: 10px !important; + } + + .mx-lg-up\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-lg-up\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-lg-up\:_1 { + margin-top: 10px !important; + } + + .mb-lg-up\:_1 { + margin-bottom: 10px !important; + } + + .ml-lg-up\:_1 { + margin-left: 10px !important; + } + + .mr-lg-up\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:_1 { + margin: 10px !important; + } + + .mx-xl-up\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-xl-up\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-xl-up\:_1 { + margin-top: 10px !important; + } + + .mb-xl-up\:_1 { + margin-bottom: 10px !important; + } + + .ml-xl-up\:_1 { + margin-left: 10px !important; + } + + .mr-xl-up\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:_1 { + margin: 10px !important; + } + + .mx-sm-down\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-sm-down\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-sm-down\:_1 { + margin-top: 10px !important; + } + + .mb-sm-down\:_1 { + margin-bottom: 10px !important; + } + + .ml-sm-down\:_1 { + margin-left: 10px !important; + } + + .mr-sm-down\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:_1 { + margin: 10px !important; + } + + .mx-md-down\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-md-down\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-md-down\:_1 { + margin-top: 10px !important; + } + + .mb-md-down\:_1 { + margin-bottom: 10px !important; + } + + .ml-md-down\:_1 { + margin-left: 10px !important; + } + + .mr-md-down\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:_1 { + margin: 10px !important; + } + + .mx-lg-down\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-lg-down\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-lg-down\:_1 { + margin-top: 10px !important; + } + + .mb-lg-down\:_1 { + margin-bottom: 10px !important; + } + + .ml-lg-down\:_1 { + margin-left: 10px !important; + } + + .mr-lg-down\:_1 { + margin-right: 10px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:_1 { + margin: 10px !important; + } + + .mx-xl-down\:_1 { + margin-left: 10px !important; + margin-right: 10px !important; + } + + .my-xl-down\:_1 { + margin-top: 10px !important; + margin-bottom: 10px !important; + } + + .mt-xl-down\:_1 { + margin-top: 10px !important; + } + + .mb-xl-down\:_1 { + margin-bottom: 10px !important; + } + + .ml-xl-down\:_1 { + margin-left: 10px !important; + } + + .mr-xl-down\:_1 { + margin-right: 10px !important; + } +} +.m\:_2 { + margin: 20px !important; +} + +.mx\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; +} + +.my\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; +} + +.mt\:_2 { + margin-top: 20px !important; +} + +.mb\:_2 { + margin-bottom: 20px !important; +} + +.ml\:_2 { + margin-left: 20px !important; +} + +.mr\:_2 { + margin-right: 20px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:_2 { + margin: 20px !important; + } + + .mx-xs\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-xs\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-xs\:_2 { + margin-top: 20px !important; + } + + .mb-xs\:_2 { + margin-bottom: 20px !important; + } + + .ml-xs\:_2 { + margin-left: 20px !important; + } + + .mr-xs\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:_2 { + margin: 20px !important; + } + + .mx-sm\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-sm\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-sm\:_2 { + margin-top: 20px !important; + } + + .mb-sm\:_2 { + margin-bottom: 20px !important; + } + + .ml-sm\:_2 { + margin-left: 20px !important; + } + + .mr-sm\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:_2 { + margin: 20px !important; + } + + .mx-md\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-md\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-md\:_2 { + margin-top: 20px !important; + } + + .mb-md\:_2 { + margin-bottom: 20px !important; + } + + .ml-md\:_2 { + margin-left: 20px !important; + } + + .mr-md\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:_2 { + margin: 20px !important; + } + + .mx-lg\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-lg\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-lg\:_2 { + margin-top: 20px !important; + } + + .mb-lg\:_2 { + margin-bottom: 20px !important; + } + + .ml-lg\:_2 { + margin-left: 20px !important; + } + + .mr-lg\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:_2 { + margin: 20px !important; + } + + .mx-xl\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-xl\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-xl\:_2 { + margin-top: 20px !important; + } + + .mb-xl\:_2 { + margin-bottom: 20px !important; + } + + .ml-xl\:_2 { + margin-left: 20px !important; + } + + .mr-xl\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:_2 { + margin: 20px !important; + } + + .mx-xxl\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-xxl\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-xxl\:_2 { + margin-top: 20px !important; + } + + .mb-xxl\:_2 { + margin-bottom: 20px !important; + } + + .ml-xxl\:_2 { + margin-left: 20px !important; + } + + .mr-xxl\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:_2 { + margin: 20px !important; + } + + .mx-sm-up\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-sm-up\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-sm-up\:_2 { + margin-top: 20px !important; + } + + .mb-sm-up\:_2 { + margin-bottom: 20px !important; + } + + .ml-sm-up\:_2 { + margin-left: 20px !important; + } + + .mr-sm-up\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:_2 { + margin: 20px !important; + } + + .mx-md-up\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-md-up\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-md-up\:_2 { + margin-top: 20px !important; + } + + .mb-md-up\:_2 { + margin-bottom: 20px !important; + } + + .ml-md-up\:_2 { + margin-left: 20px !important; + } + + .mr-md-up\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:_2 { + margin: 20px !important; + } + + .mx-lg-up\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-lg-up\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-lg-up\:_2 { + margin-top: 20px !important; + } + + .mb-lg-up\:_2 { + margin-bottom: 20px !important; + } + + .ml-lg-up\:_2 { + margin-left: 20px !important; + } + + .mr-lg-up\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:_2 { + margin: 20px !important; + } + + .mx-xl-up\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-xl-up\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-xl-up\:_2 { + margin-top: 20px !important; + } + + .mb-xl-up\:_2 { + margin-bottom: 20px !important; + } + + .ml-xl-up\:_2 { + margin-left: 20px !important; + } + + .mr-xl-up\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:_2 { + margin: 20px !important; + } + + .mx-sm-down\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-sm-down\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-sm-down\:_2 { + margin-top: 20px !important; + } + + .mb-sm-down\:_2 { + margin-bottom: 20px !important; + } + + .ml-sm-down\:_2 { + margin-left: 20px !important; + } + + .mr-sm-down\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:_2 { + margin: 20px !important; + } + + .mx-md-down\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-md-down\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-md-down\:_2 { + margin-top: 20px !important; + } + + .mb-md-down\:_2 { + margin-bottom: 20px !important; + } + + .ml-md-down\:_2 { + margin-left: 20px !important; + } + + .mr-md-down\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:_2 { + margin: 20px !important; + } + + .mx-lg-down\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-lg-down\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-lg-down\:_2 { + margin-top: 20px !important; + } + + .mb-lg-down\:_2 { + margin-bottom: 20px !important; + } + + .ml-lg-down\:_2 { + margin-left: 20px !important; + } + + .mr-lg-down\:_2 { + margin-right: 20px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:_2 { + margin: 20px !important; + } + + .mx-xl-down\:_2 { + margin-left: 20px !important; + margin-right: 20px !important; + } + + .my-xl-down\:_2 { + margin-top: 20px !important; + margin-bottom: 20px !important; + } + + .mt-xl-down\:_2 { + margin-top: 20px !important; + } + + .mb-xl-down\:_2 { + margin-bottom: 20px !important; + } + + .ml-xl-down\:_2 { + margin-left: 20px !important; + } + + .mr-xl-down\:_2 { + margin-right: 20px !important; + } +} +.m\:_3 { + margin: 30px !important; +} + +.mx\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; +} + +.my\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; +} + +.mt\:_3 { + margin-top: 30px !important; +} + +.mb\:_3 { + margin-bottom: 30px !important; +} + +.ml\:_3 { + margin-left: 30px !important; +} + +.mr\:_3 { + margin-right: 30px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:_3 { + margin: 30px !important; + } + + .mx-xs\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-xs\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-xs\:_3 { + margin-top: 30px !important; + } + + .mb-xs\:_3 { + margin-bottom: 30px !important; + } + + .ml-xs\:_3 { + margin-left: 30px !important; + } + + .mr-xs\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:_3 { + margin: 30px !important; + } + + .mx-sm\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-sm\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-sm\:_3 { + margin-top: 30px !important; + } + + .mb-sm\:_3 { + margin-bottom: 30px !important; + } + + .ml-sm\:_3 { + margin-left: 30px !important; + } + + .mr-sm\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:_3 { + margin: 30px !important; + } + + .mx-md\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-md\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-md\:_3 { + margin-top: 30px !important; + } + + .mb-md\:_3 { + margin-bottom: 30px !important; + } + + .ml-md\:_3 { + margin-left: 30px !important; + } + + .mr-md\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:_3 { + margin: 30px !important; + } + + .mx-lg\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-lg\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-lg\:_3 { + margin-top: 30px !important; + } + + .mb-lg\:_3 { + margin-bottom: 30px !important; + } + + .ml-lg\:_3 { + margin-left: 30px !important; + } + + .mr-lg\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:_3 { + margin: 30px !important; + } + + .mx-xl\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-xl\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-xl\:_3 { + margin-top: 30px !important; + } + + .mb-xl\:_3 { + margin-bottom: 30px !important; + } + + .ml-xl\:_3 { + margin-left: 30px !important; + } + + .mr-xl\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:_3 { + margin: 30px !important; + } + + .mx-xxl\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-xxl\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-xxl\:_3 { + margin-top: 30px !important; + } + + .mb-xxl\:_3 { + margin-bottom: 30px !important; + } + + .ml-xxl\:_3 { + margin-left: 30px !important; + } + + .mr-xxl\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:_3 { + margin: 30px !important; + } + + .mx-sm-up\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-sm-up\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-sm-up\:_3 { + margin-top: 30px !important; + } + + .mb-sm-up\:_3 { + margin-bottom: 30px !important; + } + + .ml-sm-up\:_3 { + margin-left: 30px !important; + } + + .mr-sm-up\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:_3 { + margin: 30px !important; + } + + .mx-md-up\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-md-up\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-md-up\:_3 { + margin-top: 30px !important; + } + + .mb-md-up\:_3 { + margin-bottom: 30px !important; + } + + .ml-md-up\:_3 { + margin-left: 30px !important; + } + + .mr-md-up\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:_3 { + margin: 30px !important; + } + + .mx-lg-up\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-lg-up\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-lg-up\:_3 { + margin-top: 30px !important; + } + + .mb-lg-up\:_3 { + margin-bottom: 30px !important; + } + + .ml-lg-up\:_3 { + margin-left: 30px !important; + } + + .mr-lg-up\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:_3 { + margin: 30px !important; + } + + .mx-xl-up\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-xl-up\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-xl-up\:_3 { + margin-top: 30px !important; + } + + .mb-xl-up\:_3 { + margin-bottom: 30px !important; + } + + .ml-xl-up\:_3 { + margin-left: 30px !important; + } + + .mr-xl-up\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:_3 { + margin: 30px !important; + } + + .mx-sm-down\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-sm-down\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-sm-down\:_3 { + margin-top: 30px !important; + } + + .mb-sm-down\:_3 { + margin-bottom: 30px !important; + } + + .ml-sm-down\:_3 { + margin-left: 30px !important; + } + + .mr-sm-down\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:_3 { + margin: 30px !important; + } + + .mx-md-down\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-md-down\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-md-down\:_3 { + margin-top: 30px !important; + } + + .mb-md-down\:_3 { + margin-bottom: 30px !important; + } + + .ml-md-down\:_3 { + margin-left: 30px !important; + } + + .mr-md-down\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:_3 { + margin: 30px !important; + } + + .mx-lg-down\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-lg-down\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-lg-down\:_3 { + margin-top: 30px !important; + } + + .mb-lg-down\:_3 { + margin-bottom: 30px !important; + } + + .ml-lg-down\:_3 { + margin-left: 30px !important; + } + + .mr-lg-down\:_3 { + margin-right: 30px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:_3 { + margin: 30px !important; + } + + .mx-xl-down\:_3 { + margin-left: 30px !important; + margin-right: 30px !important; + } + + .my-xl-down\:_3 { + margin-top: 30px !important; + margin-bottom: 30px !important; + } + + .mt-xl-down\:_3 { + margin-top: 30px !important; + } + + .mb-xl-down\:_3 { + margin-bottom: 30px !important; + } + + .ml-xl-down\:_3 { + margin-left: 30px !important; + } + + .mr-xl-down\:_3 { + margin-right: 30px !important; + } +} +.m\:_4 { + margin: 40px !important; +} + +.mx\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; +} + +.my\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; +} + +.mt\:_4 { + margin-top: 40px !important; +} + +.mb\:_4 { + margin-bottom: 40px !important; +} + +.ml\:_4 { + margin-left: 40px !important; +} + +.mr\:_4 { + margin-right: 40px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:_4 { + margin: 40px !important; + } + + .mx-xs\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-xs\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-xs\:_4 { + margin-top: 40px !important; + } + + .mb-xs\:_4 { + margin-bottom: 40px !important; + } + + .ml-xs\:_4 { + margin-left: 40px !important; + } + + .mr-xs\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:_4 { + margin: 40px !important; + } + + .mx-sm\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-sm\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-sm\:_4 { + margin-top: 40px !important; + } + + .mb-sm\:_4 { + margin-bottom: 40px !important; + } + + .ml-sm\:_4 { + margin-left: 40px !important; + } + + .mr-sm\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:_4 { + margin: 40px !important; + } + + .mx-md\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-md\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-md\:_4 { + margin-top: 40px !important; + } + + .mb-md\:_4 { + margin-bottom: 40px !important; + } + + .ml-md\:_4 { + margin-left: 40px !important; + } + + .mr-md\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:_4 { + margin: 40px !important; + } + + .mx-lg\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-lg\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-lg\:_4 { + margin-top: 40px !important; + } + + .mb-lg\:_4 { + margin-bottom: 40px !important; + } + + .ml-lg\:_4 { + margin-left: 40px !important; + } + + .mr-lg\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:_4 { + margin: 40px !important; + } + + .mx-xl\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-xl\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-xl\:_4 { + margin-top: 40px !important; + } + + .mb-xl\:_4 { + margin-bottom: 40px !important; + } + + .ml-xl\:_4 { + margin-left: 40px !important; + } + + .mr-xl\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:_4 { + margin: 40px !important; + } + + .mx-xxl\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-xxl\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-xxl\:_4 { + margin-top: 40px !important; + } + + .mb-xxl\:_4 { + margin-bottom: 40px !important; + } + + .ml-xxl\:_4 { + margin-left: 40px !important; + } + + .mr-xxl\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:_4 { + margin: 40px !important; + } + + .mx-sm-up\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-sm-up\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-sm-up\:_4 { + margin-top: 40px !important; + } + + .mb-sm-up\:_4 { + margin-bottom: 40px !important; + } + + .ml-sm-up\:_4 { + margin-left: 40px !important; + } + + .mr-sm-up\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:_4 { + margin: 40px !important; + } + + .mx-md-up\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-md-up\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-md-up\:_4 { + margin-top: 40px !important; + } + + .mb-md-up\:_4 { + margin-bottom: 40px !important; + } + + .ml-md-up\:_4 { + margin-left: 40px !important; + } + + .mr-md-up\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:_4 { + margin: 40px !important; + } + + .mx-lg-up\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-lg-up\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-lg-up\:_4 { + margin-top: 40px !important; + } + + .mb-lg-up\:_4 { + margin-bottom: 40px !important; + } + + .ml-lg-up\:_4 { + margin-left: 40px !important; + } + + .mr-lg-up\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:_4 { + margin: 40px !important; + } + + .mx-xl-up\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-xl-up\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-xl-up\:_4 { + margin-top: 40px !important; + } + + .mb-xl-up\:_4 { + margin-bottom: 40px !important; + } + + .ml-xl-up\:_4 { + margin-left: 40px !important; + } + + .mr-xl-up\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:_4 { + margin: 40px !important; + } + + .mx-sm-down\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-sm-down\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-sm-down\:_4 { + margin-top: 40px !important; + } + + .mb-sm-down\:_4 { + margin-bottom: 40px !important; + } + + .ml-sm-down\:_4 { + margin-left: 40px !important; + } + + .mr-sm-down\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:_4 { + margin: 40px !important; + } + + .mx-md-down\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-md-down\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-md-down\:_4 { + margin-top: 40px !important; + } + + .mb-md-down\:_4 { + margin-bottom: 40px !important; + } + + .ml-md-down\:_4 { + margin-left: 40px !important; + } + + .mr-md-down\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:_4 { + margin: 40px !important; + } + + .mx-lg-down\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-lg-down\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-lg-down\:_4 { + margin-top: 40px !important; + } + + .mb-lg-down\:_4 { + margin-bottom: 40px !important; + } + + .ml-lg-down\:_4 { + margin-left: 40px !important; + } + + .mr-lg-down\:_4 { + margin-right: 40px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:_4 { + margin: 40px !important; + } + + .mx-xl-down\:_4 { + margin-left: 40px !important; + margin-right: 40px !important; + } + + .my-xl-down\:_4 { + margin-top: 40px !important; + margin-bottom: 40px !important; + } + + .mt-xl-down\:_4 { + margin-top: 40px !important; + } + + .mb-xl-down\:_4 { + margin-bottom: 40px !important; + } + + .ml-xl-down\:_4 { + margin-left: 40px !important; + } + + .mr-xl-down\:_4 { + margin-right: 40px !important; + } +} +.m\:_5 { + margin: 50px !important; +} + +.mx\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; +} + +.my\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; +} + +.mt\:_5 { + margin-top: 50px !important; +} + +.mb\:_5 { + margin-bottom: 50px !important; +} + +.ml\:_5 { + margin-left: 50px !important; +} + +.mr\:_5 { + margin-right: 50px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:_5 { + margin: 50px !important; + } + + .mx-xs\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-xs\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-xs\:_5 { + margin-top: 50px !important; + } + + .mb-xs\:_5 { + margin-bottom: 50px !important; + } + + .ml-xs\:_5 { + margin-left: 50px !important; + } + + .mr-xs\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:_5 { + margin: 50px !important; + } + + .mx-sm\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-sm\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-sm\:_5 { + margin-top: 50px !important; + } + + .mb-sm\:_5 { + margin-bottom: 50px !important; + } + + .ml-sm\:_5 { + margin-left: 50px !important; + } + + .mr-sm\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:_5 { + margin: 50px !important; + } + + .mx-md\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-md\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-md\:_5 { + margin-top: 50px !important; + } + + .mb-md\:_5 { + margin-bottom: 50px !important; + } + + .ml-md\:_5 { + margin-left: 50px !important; + } + + .mr-md\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:_5 { + margin: 50px !important; + } + + .mx-lg\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-lg\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-lg\:_5 { + margin-top: 50px !important; + } + + .mb-lg\:_5 { + margin-bottom: 50px !important; + } + + .ml-lg\:_5 { + margin-left: 50px !important; + } + + .mr-lg\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:_5 { + margin: 50px !important; + } + + .mx-xl\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-xl\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-xl\:_5 { + margin-top: 50px !important; + } + + .mb-xl\:_5 { + margin-bottom: 50px !important; + } + + .ml-xl\:_5 { + margin-left: 50px !important; + } + + .mr-xl\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:_5 { + margin: 50px !important; + } + + .mx-xxl\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-xxl\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-xxl\:_5 { + margin-top: 50px !important; + } + + .mb-xxl\:_5 { + margin-bottom: 50px !important; + } + + .ml-xxl\:_5 { + margin-left: 50px !important; + } + + .mr-xxl\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:_5 { + margin: 50px !important; + } + + .mx-sm-up\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-sm-up\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-sm-up\:_5 { + margin-top: 50px !important; + } + + .mb-sm-up\:_5 { + margin-bottom: 50px !important; + } + + .ml-sm-up\:_5 { + margin-left: 50px !important; + } + + .mr-sm-up\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:_5 { + margin: 50px !important; + } + + .mx-md-up\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-md-up\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-md-up\:_5 { + margin-top: 50px !important; + } + + .mb-md-up\:_5 { + margin-bottom: 50px !important; + } + + .ml-md-up\:_5 { + margin-left: 50px !important; + } + + .mr-md-up\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:_5 { + margin: 50px !important; + } + + .mx-lg-up\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-lg-up\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-lg-up\:_5 { + margin-top: 50px !important; + } + + .mb-lg-up\:_5 { + margin-bottom: 50px !important; + } + + .ml-lg-up\:_5 { + margin-left: 50px !important; + } + + .mr-lg-up\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:_5 { + margin: 50px !important; + } + + .mx-xl-up\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-xl-up\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-xl-up\:_5 { + margin-top: 50px !important; + } + + .mb-xl-up\:_5 { + margin-bottom: 50px !important; + } + + .ml-xl-up\:_5 { + margin-left: 50px !important; + } + + .mr-xl-up\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:_5 { + margin: 50px !important; + } + + .mx-sm-down\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-sm-down\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-sm-down\:_5 { + margin-top: 50px !important; + } + + .mb-sm-down\:_5 { + margin-bottom: 50px !important; + } + + .ml-sm-down\:_5 { + margin-left: 50px !important; + } + + .mr-sm-down\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:_5 { + margin: 50px !important; + } + + .mx-md-down\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-md-down\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-md-down\:_5 { + margin-top: 50px !important; + } + + .mb-md-down\:_5 { + margin-bottom: 50px !important; + } + + .ml-md-down\:_5 { + margin-left: 50px !important; + } + + .mr-md-down\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:_5 { + margin: 50px !important; + } + + .mx-lg-down\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-lg-down\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-lg-down\:_5 { + margin-top: 50px !important; + } + + .mb-lg-down\:_5 { + margin-bottom: 50px !important; + } + + .ml-lg-down\:_5 { + margin-left: 50px !important; + } + + .mr-lg-down\:_5 { + margin-right: 50px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:_5 { + margin: 50px !important; + } + + .mx-xl-down\:_5 { + margin-left: 50px !important; + margin-right: 50px !important; + } + + .my-xl-down\:_5 { + margin-top: 50px !important; + margin-bottom: 50px !important; + } + + .mt-xl-down\:_5 { + margin-top: 50px !important; + } + + .mb-xl-down\:_5 { + margin-bottom: 50px !important; + } + + .ml-xl-down\:_5 { + margin-left: 50px !important; + } + + .mr-xl-down\:_5 { + margin-right: 50px !important; + } +} +.m\:_6 { + margin: 60px !important; +} + +.mx\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; +} + +.my\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; +} + +.mt\:_6 { + margin-top: 60px !important; +} + +.mb\:_6 { + margin-bottom: 60px !important; +} + +.ml\:_6 { + margin-left: 60px !important; +} + +.mr\:_6 { + margin-right: 60px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:_6 { + margin: 60px !important; + } + + .mx-xs\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-xs\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-xs\:_6 { + margin-top: 60px !important; + } + + .mb-xs\:_6 { + margin-bottom: 60px !important; + } + + .ml-xs\:_6 { + margin-left: 60px !important; + } + + .mr-xs\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:_6 { + margin: 60px !important; + } + + .mx-sm\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-sm\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-sm\:_6 { + margin-top: 60px !important; + } + + .mb-sm\:_6 { + margin-bottom: 60px !important; + } + + .ml-sm\:_6 { + margin-left: 60px !important; + } + + .mr-sm\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:_6 { + margin: 60px !important; + } + + .mx-md\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-md\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-md\:_6 { + margin-top: 60px !important; + } + + .mb-md\:_6 { + margin-bottom: 60px !important; + } + + .ml-md\:_6 { + margin-left: 60px !important; + } + + .mr-md\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:_6 { + margin: 60px !important; + } + + .mx-lg\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-lg\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-lg\:_6 { + margin-top: 60px !important; + } + + .mb-lg\:_6 { + margin-bottom: 60px !important; + } + + .ml-lg\:_6 { + margin-left: 60px !important; + } + + .mr-lg\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:_6 { + margin: 60px !important; + } + + .mx-xl\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-xl\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-xl\:_6 { + margin-top: 60px !important; + } + + .mb-xl\:_6 { + margin-bottom: 60px !important; + } + + .ml-xl\:_6 { + margin-left: 60px !important; + } + + .mr-xl\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:_6 { + margin: 60px !important; + } + + .mx-xxl\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-xxl\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-xxl\:_6 { + margin-top: 60px !important; + } + + .mb-xxl\:_6 { + margin-bottom: 60px !important; + } + + .ml-xxl\:_6 { + margin-left: 60px !important; + } + + .mr-xxl\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:_6 { + margin: 60px !important; + } + + .mx-sm-up\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-sm-up\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-sm-up\:_6 { + margin-top: 60px !important; + } + + .mb-sm-up\:_6 { + margin-bottom: 60px !important; + } + + .ml-sm-up\:_6 { + margin-left: 60px !important; + } + + .mr-sm-up\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:_6 { + margin: 60px !important; + } + + .mx-md-up\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-md-up\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-md-up\:_6 { + margin-top: 60px !important; + } + + .mb-md-up\:_6 { + margin-bottom: 60px !important; + } + + .ml-md-up\:_6 { + margin-left: 60px !important; + } + + .mr-md-up\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:_6 { + margin: 60px !important; + } + + .mx-lg-up\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-lg-up\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-lg-up\:_6 { + margin-top: 60px !important; + } + + .mb-lg-up\:_6 { + margin-bottom: 60px !important; + } + + .ml-lg-up\:_6 { + margin-left: 60px !important; + } + + .mr-lg-up\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:_6 { + margin: 60px !important; + } + + .mx-xl-up\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-xl-up\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-xl-up\:_6 { + margin-top: 60px !important; + } + + .mb-xl-up\:_6 { + margin-bottom: 60px !important; + } + + .ml-xl-up\:_6 { + margin-left: 60px !important; + } + + .mr-xl-up\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:_6 { + margin: 60px !important; + } + + .mx-sm-down\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-sm-down\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-sm-down\:_6 { + margin-top: 60px !important; + } + + .mb-sm-down\:_6 { + margin-bottom: 60px !important; + } + + .ml-sm-down\:_6 { + margin-left: 60px !important; + } + + .mr-sm-down\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:_6 { + margin: 60px !important; + } + + .mx-md-down\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-md-down\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-md-down\:_6 { + margin-top: 60px !important; + } + + .mb-md-down\:_6 { + margin-bottom: 60px !important; + } + + .ml-md-down\:_6 { + margin-left: 60px !important; + } + + .mr-md-down\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:_6 { + margin: 60px !important; + } + + .mx-lg-down\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-lg-down\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-lg-down\:_6 { + margin-top: 60px !important; + } + + .mb-lg-down\:_6 { + margin-bottom: 60px !important; + } + + .ml-lg-down\:_6 { + margin-left: 60px !important; + } + + .mr-lg-down\:_6 { + margin-right: 60px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:_6 { + margin: 60px !important; + } + + .mx-xl-down\:_6 { + margin-left: 60px !important; + margin-right: 60px !important; + } + + .my-xl-down\:_6 { + margin-top: 60px !important; + margin-bottom: 60px !important; + } + + .mt-xl-down\:_6 { + margin-top: 60px !important; + } + + .mb-xl-down\:_6 { + margin-bottom: 60px !important; + } + + .ml-xl-down\:_6 { + margin-left: 60px !important; + } + + .mr-xl-down\:_6 { + margin-right: 60px !important; + } +} +.m\:_7 { + margin: 70px !important; +} + +.mx\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; +} + +.my\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; +} + +.mt\:_7 { + margin-top: 70px !important; +} + +.mb\:_7 { + margin-bottom: 70px !important; +} + +.ml\:_7 { + margin-left: 70px !important; +} + +.mr\:_7 { + margin-right: 70px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:_7 { + margin: 70px !important; + } + + .mx-xs\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-xs\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-xs\:_7 { + margin-top: 70px !important; + } + + .mb-xs\:_7 { + margin-bottom: 70px !important; + } + + .ml-xs\:_7 { + margin-left: 70px !important; + } + + .mr-xs\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:_7 { + margin: 70px !important; + } + + .mx-sm\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-sm\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-sm\:_7 { + margin-top: 70px !important; + } + + .mb-sm\:_7 { + margin-bottom: 70px !important; + } + + .ml-sm\:_7 { + margin-left: 70px !important; + } + + .mr-sm\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:_7 { + margin: 70px !important; + } + + .mx-md\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-md\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-md\:_7 { + margin-top: 70px !important; + } + + .mb-md\:_7 { + margin-bottom: 70px !important; + } + + .ml-md\:_7 { + margin-left: 70px !important; + } + + .mr-md\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:_7 { + margin: 70px !important; + } + + .mx-lg\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-lg\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-lg\:_7 { + margin-top: 70px !important; + } + + .mb-lg\:_7 { + margin-bottom: 70px !important; + } + + .ml-lg\:_7 { + margin-left: 70px !important; + } + + .mr-lg\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:_7 { + margin: 70px !important; + } + + .mx-xl\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-xl\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-xl\:_7 { + margin-top: 70px !important; + } + + .mb-xl\:_7 { + margin-bottom: 70px !important; + } + + .ml-xl\:_7 { + margin-left: 70px !important; + } + + .mr-xl\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:_7 { + margin: 70px !important; + } + + .mx-xxl\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-xxl\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-xxl\:_7 { + margin-top: 70px !important; + } + + .mb-xxl\:_7 { + margin-bottom: 70px !important; + } + + .ml-xxl\:_7 { + margin-left: 70px !important; + } + + .mr-xxl\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:_7 { + margin: 70px !important; + } + + .mx-sm-up\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-sm-up\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-sm-up\:_7 { + margin-top: 70px !important; + } + + .mb-sm-up\:_7 { + margin-bottom: 70px !important; + } + + .ml-sm-up\:_7 { + margin-left: 70px !important; + } + + .mr-sm-up\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:_7 { + margin: 70px !important; + } + + .mx-md-up\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-md-up\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-md-up\:_7 { + margin-top: 70px !important; + } + + .mb-md-up\:_7 { + margin-bottom: 70px !important; + } + + .ml-md-up\:_7 { + margin-left: 70px !important; + } + + .mr-md-up\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:_7 { + margin: 70px !important; + } + + .mx-lg-up\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-lg-up\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-lg-up\:_7 { + margin-top: 70px !important; + } + + .mb-lg-up\:_7 { + margin-bottom: 70px !important; + } + + .ml-lg-up\:_7 { + margin-left: 70px !important; + } + + .mr-lg-up\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:_7 { + margin: 70px !important; + } + + .mx-xl-up\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-xl-up\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-xl-up\:_7 { + margin-top: 70px !important; + } + + .mb-xl-up\:_7 { + margin-bottom: 70px !important; + } + + .ml-xl-up\:_7 { + margin-left: 70px !important; + } + + .mr-xl-up\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:_7 { + margin: 70px !important; + } + + .mx-sm-down\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-sm-down\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-sm-down\:_7 { + margin-top: 70px !important; + } + + .mb-sm-down\:_7 { + margin-bottom: 70px !important; + } + + .ml-sm-down\:_7 { + margin-left: 70px !important; + } + + .mr-sm-down\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:_7 { + margin: 70px !important; + } + + .mx-md-down\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-md-down\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-md-down\:_7 { + margin-top: 70px !important; + } + + .mb-md-down\:_7 { + margin-bottom: 70px !important; + } + + .ml-md-down\:_7 { + margin-left: 70px !important; + } + + .mr-md-down\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:_7 { + margin: 70px !important; + } + + .mx-lg-down\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-lg-down\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-lg-down\:_7 { + margin-top: 70px !important; + } + + .mb-lg-down\:_7 { + margin-bottom: 70px !important; + } + + .ml-lg-down\:_7 { + margin-left: 70px !important; + } + + .mr-lg-down\:_7 { + margin-right: 70px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:_7 { + margin: 70px !important; + } + + .mx-xl-down\:_7 { + margin-left: 70px !important; + margin-right: 70px !important; + } + + .my-xl-down\:_7 { + margin-top: 70px !important; + margin-bottom: 70px !important; + } + + .mt-xl-down\:_7 { + margin-top: 70px !important; + } + + .mb-xl-down\:_7 { + margin-bottom: 70px !important; + } + + .ml-xl-down\:_7 { + margin-left: 70px !important; + } + + .mr-xl-down\:_7 { + margin-right: 70px !important; + } +} +.m\:_8 { + margin: 80px !important; +} + +.mx\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; +} + +.my\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; +} + +.mt\:_8 { + margin-top: 80px !important; +} + +.mb\:_8 { + margin-bottom: 80px !important; +} + +.ml\:_8 { + margin-left: 80px !important; +} + +.mr\:_8 { + margin-right: 80px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:_8 { + margin: 80px !important; + } + + .mx-xs\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-xs\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-xs\:_8 { + margin-top: 80px !important; + } + + .mb-xs\:_8 { + margin-bottom: 80px !important; + } + + .ml-xs\:_8 { + margin-left: 80px !important; + } + + .mr-xs\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:_8 { + margin: 80px !important; + } + + .mx-sm\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-sm\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-sm\:_8 { + margin-top: 80px !important; + } + + .mb-sm\:_8 { + margin-bottom: 80px !important; + } + + .ml-sm\:_8 { + margin-left: 80px !important; + } + + .mr-sm\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:_8 { + margin: 80px !important; + } + + .mx-md\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-md\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-md\:_8 { + margin-top: 80px !important; + } + + .mb-md\:_8 { + margin-bottom: 80px !important; + } + + .ml-md\:_8 { + margin-left: 80px !important; + } + + .mr-md\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:_8 { + margin: 80px !important; + } + + .mx-lg\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-lg\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-lg\:_8 { + margin-top: 80px !important; + } + + .mb-lg\:_8 { + margin-bottom: 80px !important; + } + + .ml-lg\:_8 { + margin-left: 80px !important; + } + + .mr-lg\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:_8 { + margin: 80px !important; + } + + .mx-xl\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-xl\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-xl\:_8 { + margin-top: 80px !important; + } + + .mb-xl\:_8 { + margin-bottom: 80px !important; + } + + .ml-xl\:_8 { + margin-left: 80px !important; + } + + .mr-xl\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:_8 { + margin: 80px !important; + } + + .mx-xxl\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-xxl\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-xxl\:_8 { + margin-top: 80px !important; + } + + .mb-xxl\:_8 { + margin-bottom: 80px !important; + } + + .ml-xxl\:_8 { + margin-left: 80px !important; + } + + .mr-xxl\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:_8 { + margin: 80px !important; + } + + .mx-sm-up\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-sm-up\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-sm-up\:_8 { + margin-top: 80px !important; + } + + .mb-sm-up\:_8 { + margin-bottom: 80px !important; + } + + .ml-sm-up\:_8 { + margin-left: 80px !important; + } + + .mr-sm-up\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:_8 { + margin: 80px !important; + } + + .mx-md-up\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-md-up\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-md-up\:_8 { + margin-top: 80px !important; + } + + .mb-md-up\:_8 { + margin-bottom: 80px !important; + } + + .ml-md-up\:_8 { + margin-left: 80px !important; + } + + .mr-md-up\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:_8 { + margin: 80px !important; + } + + .mx-lg-up\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-lg-up\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-lg-up\:_8 { + margin-top: 80px !important; + } + + .mb-lg-up\:_8 { + margin-bottom: 80px !important; + } + + .ml-lg-up\:_8 { + margin-left: 80px !important; + } + + .mr-lg-up\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:_8 { + margin: 80px !important; + } + + .mx-xl-up\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-xl-up\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-xl-up\:_8 { + margin-top: 80px !important; + } + + .mb-xl-up\:_8 { + margin-bottom: 80px !important; + } + + .ml-xl-up\:_8 { + margin-left: 80px !important; + } + + .mr-xl-up\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:_8 { + margin: 80px !important; + } + + .mx-sm-down\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-sm-down\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-sm-down\:_8 { + margin-top: 80px !important; + } + + .mb-sm-down\:_8 { + margin-bottom: 80px !important; + } + + .ml-sm-down\:_8 { + margin-left: 80px !important; + } + + .mr-sm-down\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:_8 { + margin: 80px !important; + } + + .mx-md-down\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-md-down\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-md-down\:_8 { + margin-top: 80px !important; + } + + .mb-md-down\:_8 { + margin-bottom: 80px !important; + } + + .ml-md-down\:_8 { + margin-left: 80px !important; + } + + .mr-md-down\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:_8 { + margin: 80px !important; + } + + .mx-lg-down\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-lg-down\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-lg-down\:_8 { + margin-top: 80px !important; + } + + .mb-lg-down\:_8 { + margin-bottom: 80px !important; + } + + .ml-lg-down\:_8 { + margin-left: 80px !important; + } + + .mr-lg-down\:_8 { + margin-right: 80px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:_8 { + margin: 80px !important; + } + + .mx-xl-down\:_8 { + margin-left: 80px !important; + margin-right: 80px !important; + } + + .my-xl-down\:_8 { + margin-top: 80px !important; + margin-bottom: 80px !important; + } + + .mt-xl-down\:_8 { + margin-top: 80px !important; + } + + .mb-xl-down\:_8 { + margin-bottom: 80px !important; + } + + .ml-xl-down\:_8 { + margin-left: 80px !important; + } + + .mr-xl-down\:_8 { + margin-right: 80px !important; + } +} +.m\:_9 { + margin: 90px !important; +} + +.mx\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; +} + +.my\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; +} + +.mt\:_9 { + margin-top: 90px !important; +} + +.mb\:_9 { + margin-bottom: 90px !important; +} + +.ml\:_9 { + margin-left: 90px !important; +} + +.mr\:_9 { + margin-right: 90px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:_9 { + margin: 90px !important; + } + + .mx-xs\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-xs\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-xs\:_9 { + margin-top: 90px !important; + } + + .mb-xs\:_9 { + margin-bottom: 90px !important; + } + + .ml-xs\:_9 { + margin-left: 90px !important; + } + + .mr-xs\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:_9 { + margin: 90px !important; + } + + .mx-sm\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-sm\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-sm\:_9 { + margin-top: 90px !important; + } + + .mb-sm\:_9 { + margin-bottom: 90px !important; + } + + .ml-sm\:_9 { + margin-left: 90px !important; + } + + .mr-sm\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:_9 { + margin: 90px !important; + } + + .mx-md\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-md\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-md\:_9 { + margin-top: 90px !important; + } + + .mb-md\:_9 { + margin-bottom: 90px !important; + } + + .ml-md\:_9 { + margin-left: 90px !important; + } + + .mr-md\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:_9 { + margin: 90px !important; + } + + .mx-lg\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-lg\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-lg\:_9 { + margin-top: 90px !important; + } + + .mb-lg\:_9 { + margin-bottom: 90px !important; + } + + .ml-lg\:_9 { + margin-left: 90px !important; + } + + .mr-lg\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:_9 { + margin: 90px !important; + } + + .mx-xl\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-xl\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-xl\:_9 { + margin-top: 90px !important; + } + + .mb-xl\:_9 { + margin-bottom: 90px !important; + } + + .ml-xl\:_9 { + margin-left: 90px !important; + } + + .mr-xl\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:_9 { + margin: 90px !important; + } + + .mx-xxl\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-xxl\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-xxl\:_9 { + margin-top: 90px !important; + } + + .mb-xxl\:_9 { + margin-bottom: 90px !important; + } + + .ml-xxl\:_9 { + margin-left: 90px !important; + } + + .mr-xxl\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:_9 { + margin: 90px !important; + } + + .mx-sm-up\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-sm-up\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-sm-up\:_9 { + margin-top: 90px !important; + } + + .mb-sm-up\:_9 { + margin-bottom: 90px !important; + } + + .ml-sm-up\:_9 { + margin-left: 90px !important; + } + + .mr-sm-up\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:_9 { + margin: 90px !important; + } + + .mx-md-up\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-md-up\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-md-up\:_9 { + margin-top: 90px !important; + } + + .mb-md-up\:_9 { + margin-bottom: 90px !important; + } + + .ml-md-up\:_9 { + margin-left: 90px !important; + } + + .mr-md-up\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:_9 { + margin: 90px !important; + } + + .mx-lg-up\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-lg-up\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-lg-up\:_9 { + margin-top: 90px !important; + } + + .mb-lg-up\:_9 { + margin-bottom: 90px !important; + } + + .ml-lg-up\:_9 { + margin-left: 90px !important; + } + + .mr-lg-up\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:_9 { + margin: 90px !important; + } + + .mx-xl-up\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-xl-up\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-xl-up\:_9 { + margin-top: 90px !important; + } + + .mb-xl-up\:_9 { + margin-bottom: 90px !important; + } + + .ml-xl-up\:_9 { + margin-left: 90px !important; + } + + .mr-xl-up\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:_9 { + margin: 90px !important; + } + + .mx-sm-down\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-sm-down\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-sm-down\:_9 { + margin-top: 90px !important; + } + + .mb-sm-down\:_9 { + margin-bottom: 90px !important; + } + + .ml-sm-down\:_9 { + margin-left: 90px !important; + } + + .mr-sm-down\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:_9 { + margin: 90px !important; + } + + .mx-md-down\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-md-down\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-md-down\:_9 { + margin-top: 90px !important; + } + + .mb-md-down\:_9 { + margin-bottom: 90px !important; + } + + .ml-md-down\:_9 { + margin-left: 90px !important; + } + + .mr-md-down\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:_9 { + margin: 90px !important; + } + + .mx-lg-down\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-lg-down\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-lg-down\:_9 { + margin-top: 90px !important; + } + + .mb-lg-down\:_9 { + margin-bottom: 90px !important; + } + + .ml-lg-down\:_9 { + margin-left: 90px !important; + } + + .mr-lg-down\:_9 { + margin-right: 90px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:_9 { + margin: 90px !important; + } + + .mx-xl-down\:_9 { + margin-left: 90px !important; + margin-right: 90px !important; + } + + .my-xl-down\:_9 { + margin-top: 90px !important; + margin-bottom: 90px !important; + } + + .mt-xl-down\:_9 { + margin-top: 90px !important; + } + + .mb-xl-down\:_9 { + margin-bottom: 90px !important; + } + + .ml-xl-down\:_9 { + margin-left: 90px !important; + } + + .mr-xl-down\:_9 { + margin-right: 90px !important; + } +} +.m\:_10 { + margin: 100px !important; +} + +.mx\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; +} + +.my\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; +} + +.mt\:_10 { + margin-top: 100px !important; +} + +.mb\:_10 { + margin-bottom: 100px !important; +} + +.ml\:_10 { + margin-left: 100px !important; +} + +.mr\:_10 { + margin-right: 100px !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:_10 { + margin: 100px !important; + } + + .mx-xs\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-xs\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-xs\:_10 { + margin-top: 100px !important; + } + + .mb-xs\:_10 { + margin-bottom: 100px !important; + } + + .ml-xs\:_10 { + margin-left: 100px !important; + } + + .mr-xs\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:_10 { + margin: 100px !important; + } + + .mx-sm\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-sm\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-sm\:_10 { + margin-top: 100px !important; + } + + .mb-sm\:_10 { + margin-bottom: 100px !important; + } + + .ml-sm\:_10 { + margin-left: 100px !important; + } + + .mr-sm\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:_10 { + margin: 100px !important; + } + + .mx-md\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-md\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-md\:_10 { + margin-top: 100px !important; + } + + .mb-md\:_10 { + margin-bottom: 100px !important; + } + + .ml-md\:_10 { + margin-left: 100px !important; + } + + .mr-md\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:_10 { + margin: 100px !important; + } + + .mx-lg\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-lg\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-lg\:_10 { + margin-top: 100px !important; + } + + .mb-lg\:_10 { + margin-bottom: 100px !important; + } + + .ml-lg\:_10 { + margin-left: 100px !important; + } + + .mr-lg\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:_10 { + margin: 100px !important; + } + + .mx-xl\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-xl\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-xl\:_10 { + margin-top: 100px !important; + } + + .mb-xl\:_10 { + margin-bottom: 100px !important; + } + + .ml-xl\:_10 { + margin-left: 100px !important; + } + + .mr-xl\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:_10 { + margin: 100px !important; + } + + .mx-xxl\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-xxl\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-xxl\:_10 { + margin-top: 100px !important; + } + + .mb-xxl\:_10 { + margin-bottom: 100px !important; + } + + .ml-xxl\:_10 { + margin-left: 100px !important; + } + + .mr-xxl\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:_10 { + margin: 100px !important; + } + + .mx-sm-up\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-sm-up\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-sm-up\:_10 { + margin-top: 100px !important; + } + + .mb-sm-up\:_10 { + margin-bottom: 100px !important; + } + + .ml-sm-up\:_10 { + margin-left: 100px !important; + } + + .mr-sm-up\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:_10 { + margin: 100px !important; + } + + .mx-md-up\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-md-up\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-md-up\:_10 { + margin-top: 100px !important; + } + + .mb-md-up\:_10 { + margin-bottom: 100px !important; + } + + .ml-md-up\:_10 { + margin-left: 100px !important; + } + + .mr-md-up\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:_10 { + margin: 100px !important; + } + + .mx-lg-up\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-lg-up\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-lg-up\:_10 { + margin-top: 100px !important; + } + + .mb-lg-up\:_10 { + margin-bottom: 100px !important; + } + + .ml-lg-up\:_10 { + margin-left: 100px !important; + } + + .mr-lg-up\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:_10 { + margin: 100px !important; + } + + .mx-xl-up\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-xl-up\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-xl-up\:_10 { + margin-top: 100px !important; + } + + .mb-xl-up\:_10 { + margin-bottom: 100px !important; + } + + .ml-xl-up\:_10 { + margin-left: 100px !important; + } + + .mr-xl-up\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:_10 { + margin: 100px !important; + } + + .mx-sm-down\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-sm-down\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-sm-down\:_10 { + margin-top: 100px !important; + } + + .mb-sm-down\:_10 { + margin-bottom: 100px !important; + } + + .ml-sm-down\:_10 { + margin-left: 100px !important; + } + + .mr-sm-down\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:_10 { + margin: 100px !important; + } + + .mx-md-down\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-md-down\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-md-down\:_10 { + margin-top: 100px !important; + } + + .mb-md-down\:_10 { + margin-bottom: 100px !important; + } + + .ml-md-down\:_10 { + margin-left: 100px !important; + } + + .mr-md-down\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:_10 { + margin: 100px !important; + } + + .mx-lg-down\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-lg-down\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-lg-down\:_10 { + margin-top: 100px !important; + } + + .mb-lg-down\:_10 { + margin-bottom: 100px !important; + } + + .ml-lg-down\:_10 { + margin-left: 100px !important; + } + + .mr-lg-down\:_10 { + margin-right: 100px !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:_10 { + margin: 100px !important; + } + + .mx-xl-down\:_10 { + margin-left: 100px !important; + margin-right: 100px !important; + } + + .my-xl-down\:_10 { + margin-top: 100px !important; + margin-bottom: 100px !important; + } + + .mt-xl-down\:_10 { + margin-top: 100px !important; + } + + .mb-xl-down\:_10 { + margin-bottom: 100px !important; + } + + .ml-xl-down\:_10 { + margin-left: 100px !important; + } + + .mr-xl-down\:_10 { + margin-right: 100px !important; + } +} +.m\:auto { + margin: auto !important; +} + +.mx\:auto { + margin-left: auto !important; + margin-right: auto !important; +} + +.my\:auto { + margin-top: auto !important; + margin-bottom: auto !important; +} + +.mt\:auto { + margin-top: auto !important; +} + +.mb\:auto { + margin-bottom: auto !important; +} + +.ml\:auto { + margin-left: auto !important; +} + +.mr\:auto { + margin-right: auto !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:auto { + margin: auto !important; + } + + .mx-xs\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-xs\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-xs\:auto { + margin-top: auto !important; + } + + .mb-xs\:auto { + margin-bottom: auto !important; + } + + .ml-xs\:auto { + margin-left: auto !important; + } + + .mr-xs\:auto { + margin-right: auto !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:auto { + margin: auto !important; + } + + .mx-sm\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-sm\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-sm\:auto { + margin-top: auto !important; + } + + .mb-sm\:auto { + margin-bottom: auto !important; + } + + .ml-sm\:auto { + margin-left: auto !important; + } + + .mr-sm\:auto { + margin-right: auto !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:auto { + margin: auto !important; + } + + .mx-md\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-md\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-md\:auto { + margin-top: auto !important; + } + + .mb-md\:auto { + margin-bottom: auto !important; + } + + .ml-md\:auto { + margin-left: auto !important; + } + + .mr-md\:auto { + margin-right: auto !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:auto { + margin: auto !important; + } + + .mx-lg\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-lg\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-lg\:auto { + margin-top: auto !important; + } + + .mb-lg\:auto { + margin-bottom: auto !important; + } + + .ml-lg\:auto { + margin-left: auto !important; + } + + .mr-lg\:auto { + margin-right: auto !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:auto { + margin: auto !important; + } + + .mx-xl\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-xl\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-xl\:auto { + margin-top: auto !important; + } + + .mb-xl\:auto { + margin-bottom: auto !important; + } + + .ml-xl\:auto { + margin-left: auto !important; + } + + .mr-xl\:auto { + margin-right: auto !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:auto { + margin: auto !important; + } + + .mx-xxl\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-xxl\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-xxl\:auto { + margin-top: auto !important; + } + + .mb-xxl\:auto { + margin-bottom: auto !important; + } + + .ml-xxl\:auto { + margin-left: auto !important; + } + + .mr-xxl\:auto { + margin-right: auto !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:auto { + margin: auto !important; + } + + .mx-sm-up\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-sm-up\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-sm-up\:auto { + margin-top: auto !important; + } + + .mb-sm-up\:auto { + margin-bottom: auto !important; + } + + .ml-sm-up\:auto { + margin-left: auto !important; + } + + .mr-sm-up\:auto { + margin-right: auto !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:auto { + margin: auto !important; + } + + .mx-md-up\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-md-up\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-md-up\:auto { + margin-top: auto !important; + } + + .mb-md-up\:auto { + margin-bottom: auto !important; + } + + .ml-md-up\:auto { + margin-left: auto !important; + } + + .mr-md-up\:auto { + margin-right: auto !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:auto { + margin: auto !important; + } + + .mx-lg-up\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-lg-up\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-lg-up\:auto { + margin-top: auto !important; + } + + .mb-lg-up\:auto { + margin-bottom: auto !important; + } + + .ml-lg-up\:auto { + margin-left: auto !important; + } + + .mr-lg-up\:auto { + margin-right: auto !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:auto { + margin: auto !important; + } + + .mx-xl-up\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-xl-up\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-xl-up\:auto { + margin-top: auto !important; + } + + .mb-xl-up\:auto { + margin-bottom: auto !important; + } + + .ml-xl-up\:auto { + margin-left: auto !important; + } + + .mr-xl-up\:auto { + margin-right: auto !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:auto { + margin: auto !important; + } + + .mx-sm-down\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-sm-down\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-sm-down\:auto { + margin-top: auto !important; + } + + .mb-sm-down\:auto { + margin-bottom: auto !important; + } + + .ml-sm-down\:auto { + margin-left: auto !important; + } + + .mr-sm-down\:auto { + margin-right: auto !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:auto { + margin: auto !important; + } + + .mx-md-down\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-md-down\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-md-down\:auto { + margin-top: auto !important; + } + + .mb-md-down\:auto { + margin-bottom: auto !important; + } + + .ml-md-down\:auto { + margin-left: auto !important; + } + + .mr-md-down\:auto { + margin-right: auto !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:auto { + margin: auto !important; + } + + .mx-lg-down\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-lg-down\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-lg-down\:auto { + margin-top: auto !important; + } + + .mb-lg-down\:auto { + margin-bottom: auto !important; + } + + .ml-lg-down\:auto { + margin-left: auto !important; + } + + .mr-lg-down\:auto { + margin-right: auto !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:auto { + margin: auto !important; + } + + .mx-xl-down\:auto { + margin-left: auto !important; + margin-right: auto !important; + } + + .my-xl-down\:auto { + margin-top: auto !important; + margin-bottom: auto !important; + } + + .mt-xl-down\:auto { + margin-top: auto !important; + } + + .mb-xl-down\:auto { + margin-bottom: auto !important; + } + + .ml-xl-down\:auto { + margin-left: auto !important; + } + + .mr-xl-down\:auto { + margin-right: auto !important; + } +} +.m\:10 { + margin: 10% !important; +} + +.mx\:10 { + margin-left: 10% !important; + margin-right: 10% !important; +} + +.my\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; +} + +.mt\:10 { + margin-top: 10% !important; +} + +.mb\:10 { + margin-bottom: 10% !important; +} + +.ml\:10 { + margin-left: 10% !important; +} + +.mr\:10 { + margin-right: 10% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:10 { + margin: 10% !important; + } + + .mx-xs\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-xs\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-xs\:10 { + margin-top: 10% !important; + } + + .mb-xs\:10 { + margin-bottom: 10% !important; + } + + .ml-xs\:10 { + margin-left: 10% !important; + } + + .mr-xs\:10 { + margin-right: 10% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:10 { + margin: 10% !important; + } + + .mx-sm\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-sm\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-sm\:10 { + margin-top: 10% !important; + } + + .mb-sm\:10 { + margin-bottom: 10% !important; + } + + .ml-sm\:10 { + margin-left: 10% !important; + } + + .mr-sm\:10 { + margin-right: 10% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:10 { + margin: 10% !important; + } + + .mx-md\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-md\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-md\:10 { + margin-top: 10% !important; + } + + .mb-md\:10 { + margin-bottom: 10% !important; + } + + .ml-md\:10 { + margin-left: 10% !important; + } + + .mr-md\:10 { + margin-right: 10% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:10 { + margin: 10% !important; + } + + .mx-lg\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-lg\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-lg\:10 { + margin-top: 10% !important; + } + + .mb-lg\:10 { + margin-bottom: 10% !important; + } + + .ml-lg\:10 { + margin-left: 10% !important; + } + + .mr-lg\:10 { + margin-right: 10% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:10 { + margin: 10% !important; + } + + .mx-xl\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-xl\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-xl\:10 { + margin-top: 10% !important; + } + + .mb-xl\:10 { + margin-bottom: 10% !important; + } + + .ml-xl\:10 { + margin-left: 10% !important; + } + + .mr-xl\:10 { + margin-right: 10% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:10 { + margin: 10% !important; + } + + .mx-xxl\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-xxl\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-xxl\:10 { + margin-top: 10% !important; + } + + .mb-xxl\:10 { + margin-bottom: 10% !important; + } + + .ml-xxl\:10 { + margin-left: 10% !important; + } + + .mr-xxl\:10 { + margin-right: 10% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:10 { + margin: 10% !important; + } + + .mx-sm-up\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-sm-up\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-sm-up\:10 { + margin-top: 10% !important; + } + + .mb-sm-up\:10 { + margin-bottom: 10% !important; + } + + .ml-sm-up\:10 { + margin-left: 10% !important; + } + + .mr-sm-up\:10 { + margin-right: 10% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:10 { + margin: 10% !important; + } + + .mx-md-up\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-md-up\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-md-up\:10 { + margin-top: 10% !important; + } + + .mb-md-up\:10 { + margin-bottom: 10% !important; + } + + .ml-md-up\:10 { + margin-left: 10% !important; + } + + .mr-md-up\:10 { + margin-right: 10% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:10 { + margin: 10% !important; + } + + .mx-lg-up\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-lg-up\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-lg-up\:10 { + margin-top: 10% !important; + } + + .mb-lg-up\:10 { + margin-bottom: 10% !important; + } + + .ml-lg-up\:10 { + margin-left: 10% !important; + } + + .mr-lg-up\:10 { + margin-right: 10% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:10 { + margin: 10% !important; + } + + .mx-xl-up\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-xl-up\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-xl-up\:10 { + margin-top: 10% !important; + } + + .mb-xl-up\:10 { + margin-bottom: 10% !important; + } + + .ml-xl-up\:10 { + margin-left: 10% !important; + } + + .mr-xl-up\:10 { + margin-right: 10% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:10 { + margin: 10% !important; + } + + .mx-sm-down\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-sm-down\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-sm-down\:10 { + margin-top: 10% !important; + } + + .mb-sm-down\:10 { + margin-bottom: 10% !important; + } + + .ml-sm-down\:10 { + margin-left: 10% !important; + } + + .mr-sm-down\:10 { + margin-right: 10% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:10 { + margin: 10% !important; + } + + .mx-md-down\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-md-down\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-md-down\:10 { + margin-top: 10% !important; + } + + .mb-md-down\:10 { + margin-bottom: 10% !important; + } + + .ml-md-down\:10 { + margin-left: 10% !important; + } + + .mr-md-down\:10 { + margin-right: 10% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:10 { + margin: 10% !important; + } + + .mx-lg-down\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-lg-down\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-lg-down\:10 { + margin-top: 10% !important; + } + + .mb-lg-down\:10 { + margin-bottom: 10% !important; + } + + .ml-lg-down\:10 { + margin-left: 10% !important; + } + + .mr-lg-down\:10 { + margin-right: 10% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:10 { + margin: 10% !important; + } + + .mx-xl-down\:10 { + margin-left: 10% !important; + margin-right: 10% !important; + } + + .my-xl-down\:10 { + margin-top: 10% !important; + margin-bottom: 10% !important; + } + + .mt-xl-down\:10 { + margin-top: 10% !important; + } + + .mb-xl-down\:10 { + margin-bottom: 10% !important; + } + + .ml-xl-down\:10 { + margin-left: 10% !important; + } + + .mr-xl-down\:10 { + margin-right: 10% !important; + } +} +.m\:20 { + margin: 20% !important; +} + +.mx\:20 { + margin-left: 20% !important; + margin-right: 20% !important; +} + +.my\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; +} + +.mt\:20 { + margin-top: 20% !important; +} + +.mb\:20 { + margin-bottom: 20% !important; +} + +.ml\:20 { + margin-left: 20% !important; +} + +.mr\:20 { + margin-right: 20% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:20 { + margin: 20% !important; + } + + .mx-xs\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-xs\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-xs\:20 { + margin-top: 20% !important; + } + + .mb-xs\:20 { + margin-bottom: 20% !important; + } + + .ml-xs\:20 { + margin-left: 20% !important; + } + + .mr-xs\:20 { + margin-right: 20% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:20 { + margin: 20% !important; + } + + .mx-sm\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-sm\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-sm\:20 { + margin-top: 20% !important; + } + + .mb-sm\:20 { + margin-bottom: 20% !important; + } + + .ml-sm\:20 { + margin-left: 20% !important; + } + + .mr-sm\:20 { + margin-right: 20% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:20 { + margin: 20% !important; + } + + .mx-md\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-md\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-md\:20 { + margin-top: 20% !important; + } + + .mb-md\:20 { + margin-bottom: 20% !important; + } + + .ml-md\:20 { + margin-left: 20% !important; + } + + .mr-md\:20 { + margin-right: 20% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:20 { + margin: 20% !important; + } + + .mx-lg\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-lg\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-lg\:20 { + margin-top: 20% !important; + } + + .mb-lg\:20 { + margin-bottom: 20% !important; + } + + .ml-lg\:20 { + margin-left: 20% !important; + } + + .mr-lg\:20 { + margin-right: 20% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:20 { + margin: 20% !important; + } + + .mx-xl\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-xl\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-xl\:20 { + margin-top: 20% !important; + } + + .mb-xl\:20 { + margin-bottom: 20% !important; + } + + .ml-xl\:20 { + margin-left: 20% !important; + } + + .mr-xl\:20 { + margin-right: 20% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:20 { + margin: 20% !important; + } + + .mx-xxl\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-xxl\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-xxl\:20 { + margin-top: 20% !important; + } + + .mb-xxl\:20 { + margin-bottom: 20% !important; + } + + .ml-xxl\:20 { + margin-left: 20% !important; + } + + .mr-xxl\:20 { + margin-right: 20% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:20 { + margin: 20% !important; + } + + .mx-sm-up\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-sm-up\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-sm-up\:20 { + margin-top: 20% !important; + } + + .mb-sm-up\:20 { + margin-bottom: 20% !important; + } + + .ml-sm-up\:20 { + margin-left: 20% !important; + } + + .mr-sm-up\:20 { + margin-right: 20% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:20 { + margin: 20% !important; + } + + .mx-md-up\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-md-up\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-md-up\:20 { + margin-top: 20% !important; + } + + .mb-md-up\:20 { + margin-bottom: 20% !important; + } + + .ml-md-up\:20 { + margin-left: 20% !important; + } + + .mr-md-up\:20 { + margin-right: 20% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:20 { + margin: 20% !important; + } + + .mx-lg-up\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-lg-up\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-lg-up\:20 { + margin-top: 20% !important; + } + + .mb-lg-up\:20 { + margin-bottom: 20% !important; + } + + .ml-lg-up\:20 { + margin-left: 20% !important; + } + + .mr-lg-up\:20 { + margin-right: 20% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:20 { + margin: 20% !important; + } + + .mx-xl-up\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-xl-up\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-xl-up\:20 { + margin-top: 20% !important; + } + + .mb-xl-up\:20 { + margin-bottom: 20% !important; + } + + .ml-xl-up\:20 { + margin-left: 20% !important; + } + + .mr-xl-up\:20 { + margin-right: 20% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:20 { + margin: 20% !important; + } + + .mx-sm-down\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-sm-down\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-sm-down\:20 { + margin-top: 20% !important; + } + + .mb-sm-down\:20 { + margin-bottom: 20% !important; + } + + .ml-sm-down\:20 { + margin-left: 20% !important; + } + + .mr-sm-down\:20 { + margin-right: 20% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:20 { + margin: 20% !important; + } + + .mx-md-down\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-md-down\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-md-down\:20 { + margin-top: 20% !important; + } + + .mb-md-down\:20 { + margin-bottom: 20% !important; + } + + .ml-md-down\:20 { + margin-left: 20% !important; + } + + .mr-md-down\:20 { + margin-right: 20% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:20 { + margin: 20% !important; + } + + .mx-lg-down\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-lg-down\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-lg-down\:20 { + margin-top: 20% !important; + } + + .mb-lg-down\:20 { + margin-bottom: 20% !important; + } + + .ml-lg-down\:20 { + margin-left: 20% !important; + } + + .mr-lg-down\:20 { + margin-right: 20% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:20 { + margin: 20% !important; + } + + .mx-xl-down\:20 { + margin-left: 20% !important; + margin-right: 20% !important; + } + + .my-xl-down\:20 { + margin-top: 20% !important; + margin-bottom: 20% !important; + } + + .mt-xl-down\:20 { + margin-top: 20% !important; + } + + .mb-xl-down\:20 { + margin-bottom: 20% !important; + } + + .ml-xl-down\:20 { + margin-left: 20% !important; + } + + .mr-xl-down\:20 { + margin-right: 20% !important; + } +} +.m\:25 { + margin: 25% !important; +} + +.mx\:25 { + margin-left: 25% !important; + margin-right: 25% !important; +} + +.my\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; +} + +.mt\:25 { + margin-top: 25% !important; +} + +.mb\:25 { + margin-bottom: 25% !important; +} + +.ml\:25 { + margin-left: 25% !important; +} + +.mr\:25 { + margin-right: 25% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:25 { + margin: 25% !important; + } + + .mx-xs\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-xs\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-xs\:25 { + margin-top: 25% !important; + } + + .mb-xs\:25 { + margin-bottom: 25% !important; + } + + .ml-xs\:25 { + margin-left: 25% !important; + } + + .mr-xs\:25 { + margin-right: 25% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:25 { + margin: 25% !important; + } + + .mx-sm\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-sm\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-sm\:25 { + margin-top: 25% !important; + } + + .mb-sm\:25 { + margin-bottom: 25% !important; + } + + .ml-sm\:25 { + margin-left: 25% !important; + } + + .mr-sm\:25 { + margin-right: 25% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:25 { + margin: 25% !important; + } + + .mx-md\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-md\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-md\:25 { + margin-top: 25% !important; + } + + .mb-md\:25 { + margin-bottom: 25% !important; + } + + .ml-md\:25 { + margin-left: 25% !important; + } + + .mr-md\:25 { + margin-right: 25% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:25 { + margin: 25% !important; + } + + .mx-lg\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-lg\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-lg\:25 { + margin-top: 25% !important; + } + + .mb-lg\:25 { + margin-bottom: 25% !important; + } + + .ml-lg\:25 { + margin-left: 25% !important; + } + + .mr-lg\:25 { + margin-right: 25% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:25 { + margin: 25% !important; + } + + .mx-xl\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-xl\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-xl\:25 { + margin-top: 25% !important; + } + + .mb-xl\:25 { + margin-bottom: 25% !important; + } + + .ml-xl\:25 { + margin-left: 25% !important; + } + + .mr-xl\:25 { + margin-right: 25% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:25 { + margin: 25% !important; + } + + .mx-xxl\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-xxl\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-xxl\:25 { + margin-top: 25% !important; + } + + .mb-xxl\:25 { + margin-bottom: 25% !important; + } + + .ml-xxl\:25 { + margin-left: 25% !important; + } + + .mr-xxl\:25 { + margin-right: 25% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:25 { + margin: 25% !important; + } + + .mx-sm-up\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-sm-up\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-sm-up\:25 { + margin-top: 25% !important; + } + + .mb-sm-up\:25 { + margin-bottom: 25% !important; + } + + .ml-sm-up\:25 { + margin-left: 25% !important; + } + + .mr-sm-up\:25 { + margin-right: 25% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:25 { + margin: 25% !important; + } + + .mx-md-up\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-md-up\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-md-up\:25 { + margin-top: 25% !important; + } + + .mb-md-up\:25 { + margin-bottom: 25% !important; + } + + .ml-md-up\:25 { + margin-left: 25% !important; + } + + .mr-md-up\:25 { + margin-right: 25% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:25 { + margin: 25% !important; + } + + .mx-lg-up\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-lg-up\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-lg-up\:25 { + margin-top: 25% !important; + } + + .mb-lg-up\:25 { + margin-bottom: 25% !important; + } + + .ml-lg-up\:25 { + margin-left: 25% !important; + } + + .mr-lg-up\:25 { + margin-right: 25% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:25 { + margin: 25% !important; + } + + .mx-xl-up\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-xl-up\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-xl-up\:25 { + margin-top: 25% !important; + } + + .mb-xl-up\:25 { + margin-bottom: 25% !important; + } + + .ml-xl-up\:25 { + margin-left: 25% !important; + } + + .mr-xl-up\:25 { + margin-right: 25% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:25 { + margin: 25% !important; + } + + .mx-sm-down\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-sm-down\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-sm-down\:25 { + margin-top: 25% !important; + } + + .mb-sm-down\:25 { + margin-bottom: 25% !important; + } + + .ml-sm-down\:25 { + margin-left: 25% !important; + } + + .mr-sm-down\:25 { + margin-right: 25% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:25 { + margin: 25% !important; + } + + .mx-md-down\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-md-down\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-md-down\:25 { + margin-top: 25% !important; + } + + .mb-md-down\:25 { + margin-bottom: 25% !important; + } + + .ml-md-down\:25 { + margin-left: 25% !important; + } + + .mr-md-down\:25 { + margin-right: 25% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:25 { + margin: 25% !important; + } + + .mx-lg-down\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-lg-down\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-lg-down\:25 { + margin-top: 25% !important; + } + + .mb-lg-down\:25 { + margin-bottom: 25% !important; + } + + .ml-lg-down\:25 { + margin-left: 25% !important; + } + + .mr-lg-down\:25 { + margin-right: 25% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:25 { + margin: 25% !important; + } + + .mx-xl-down\:25 { + margin-left: 25% !important; + margin-right: 25% !important; + } + + .my-xl-down\:25 { + margin-top: 25% !important; + margin-bottom: 25% !important; + } + + .mt-xl-down\:25 { + margin-top: 25% !important; + } + + .mb-xl-down\:25 { + margin-bottom: 25% !important; + } + + .ml-xl-down\:25 { + margin-left: 25% !important; + } + + .mr-xl-down\:25 { + margin-right: 25% !important; + } +} +.m\:30 { + margin: 30% !important; +} + +.mx\:30 { + margin-left: 30% !important; + margin-right: 30% !important; +} + +.my\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; +} + +.mt\:30 { + margin-top: 30% !important; +} + +.mb\:30 { + margin-bottom: 30% !important; +} + +.ml\:30 { + margin-left: 30% !important; +} + +.mr\:30 { + margin-right: 30% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:30 { + margin: 30% !important; + } + + .mx-xs\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-xs\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-xs\:30 { + margin-top: 30% !important; + } + + .mb-xs\:30 { + margin-bottom: 30% !important; + } + + .ml-xs\:30 { + margin-left: 30% !important; + } + + .mr-xs\:30 { + margin-right: 30% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:30 { + margin: 30% !important; + } + + .mx-sm\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-sm\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-sm\:30 { + margin-top: 30% !important; + } + + .mb-sm\:30 { + margin-bottom: 30% !important; + } + + .ml-sm\:30 { + margin-left: 30% !important; + } + + .mr-sm\:30 { + margin-right: 30% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:30 { + margin: 30% !important; + } + + .mx-md\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-md\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-md\:30 { + margin-top: 30% !important; + } + + .mb-md\:30 { + margin-bottom: 30% !important; + } + + .ml-md\:30 { + margin-left: 30% !important; + } + + .mr-md\:30 { + margin-right: 30% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:30 { + margin: 30% !important; + } + + .mx-lg\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-lg\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-lg\:30 { + margin-top: 30% !important; + } + + .mb-lg\:30 { + margin-bottom: 30% !important; + } + + .ml-lg\:30 { + margin-left: 30% !important; + } + + .mr-lg\:30 { + margin-right: 30% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:30 { + margin: 30% !important; + } + + .mx-xl\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-xl\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-xl\:30 { + margin-top: 30% !important; + } + + .mb-xl\:30 { + margin-bottom: 30% !important; + } + + .ml-xl\:30 { + margin-left: 30% !important; + } + + .mr-xl\:30 { + margin-right: 30% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:30 { + margin: 30% !important; + } + + .mx-xxl\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-xxl\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-xxl\:30 { + margin-top: 30% !important; + } + + .mb-xxl\:30 { + margin-bottom: 30% !important; + } + + .ml-xxl\:30 { + margin-left: 30% !important; + } + + .mr-xxl\:30 { + margin-right: 30% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:30 { + margin: 30% !important; + } + + .mx-sm-up\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-sm-up\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-sm-up\:30 { + margin-top: 30% !important; + } + + .mb-sm-up\:30 { + margin-bottom: 30% !important; + } + + .ml-sm-up\:30 { + margin-left: 30% !important; + } + + .mr-sm-up\:30 { + margin-right: 30% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:30 { + margin: 30% !important; + } + + .mx-md-up\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-md-up\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-md-up\:30 { + margin-top: 30% !important; + } + + .mb-md-up\:30 { + margin-bottom: 30% !important; + } + + .ml-md-up\:30 { + margin-left: 30% !important; + } + + .mr-md-up\:30 { + margin-right: 30% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:30 { + margin: 30% !important; + } + + .mx-lg-up\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-lg-up\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-lg-up\:30 { + margin-top: 30% !important; + } + + .mb-lg-up\:30 { + margin-bottom: 30% !important; + } + + .ml-lg-up\:30 { + margin-left: 30% !important; + } + + .mr-lg-up\:30 { + margin-right: 30% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:30 { + margin: 30% !important; + } + + .mx-xl-up\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-xl-up\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-xl-up\:30 { + margin-top: 30% !important; + } + + .mb-xl-up\:30 { + margin-bottom: 30% !important; + } + + .ml-xl-up\:30 { + margin-left: 30% !important; + } + + .mr-xl-up\:30 { + margin-right: 30% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:30 { + margin: 30% !important; + } + + .mx-sm-down\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-sm-down\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-sm-down\:30 { + margin-top: 30% !important; + } + + .mb-sm-down\:30 { + margin-bottom: 30% !important; + } + + .ml-sm-down\:30 { + margin-left: 30% !important; + } + + .mr-sm-down\:30 { + margin-right: 30% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:30 { + margin: 30% !important; + } + + .mx-md-down\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-md-down\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-md-down\:30 { + margin-top: 30% !important; + } + + .mb-md-down\:30 { + margin-bottom: 30% !important; + } + + .ml-md-down\:30 { + margin-left: 30% !important; + } + + .mr-md-down\:30 { + margin-right: 30% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:30 { + margin: 30% !important; + } + + .mx-lg-down\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-lg-down\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-lg-down\:30 { + margin-top: 30% !important; + } + + .mb-lg-down\:30 { + margin-bottom: 30% !important; + } + + .ml-lg-down\:30 { + margin-left: 30% !important; + } + + .mr-lg-down\:30 { + margin-right: 30% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:30 { + margin: 30% !important; + } + + .mx-xl-down\:30 { + margin-left: 30% !important; + margin-right: 30% !important; + } + + .my-xl-down\:30 { + margin-top: 30% !important; + margin-bottom: 30% !important; + } + + .mt-xl-down\:30 { + margin-top: 30% !important; + } + + .mb-xl-down\:30 { + margin-bottom: 30% !important; + } + + .ml-xl-down\:30 { + margin-left: 30% !important; + } + + .mr-xl-down\:30 { + margin-right: 30% !important; + } +} +.m\:33 { + margin: 33.33% !important; +} + +.mx\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; +} + +.my\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; +} + +.mt\:33 { + margin-top: 33.33% !important; +} + +.mb\:33 { + margin-bottom: 33.33% !important; +} + +.ml\:33 { + margin-left: 33.33% !important; +} + +.mr\:33 { + margin-right: 33.33% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:33 { + margin: 33.33% !important; + } + + .mx-xs\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-xs\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-xs\:33 { + margin-top: 33.33% !important; + } + + .mb-xs\:33 { + margin-bottom: 33.33% !important; + } + + .ml-xs\:33 { + margin-left: 33.33% !important; + } + + .mr-xs\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:33 { + margin: 33.33% !important; + } + + .mx-sm\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-sm\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-sm\:33 { + margin-top: 33.33% !important; + } + + .mb-sm\:33 { + margin-bottom: 33.33% !important; + } + + .ml-sm\:33 { + margin-left: 33.33% !important; + } + + .mr-sm\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:33 { + margin: 33.33% !important; + } + + .mx-md\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-md\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-md\:33 { + margin-top: 33.33% !important; + } + + .mb-md\:33 { + margin-bottom: 33.33% !important; + } + + .ml-md\:33 { + margin-left: 33.33% !important; + } + + .mr-md\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:33 { + margin: 33.33% !important; + } + + .mx-lg\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-lg\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-lg\:33 { + margin-top: 33.33% !important; + } + + .mb-lg\:33 { + margin-bottom: 33.33% !important; + } + + .ml-lg\:33 { + margin-left: 33.33% !important; + } + + .mr-lg\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:33 { + margin: 33.33% !important; + } + + .mx-xl\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-xl\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-xl\:33 { + margin-top: 33.33% !important; + } + + .mb-xl\:33 { + margin-bottom: 33.33% !important; + } + + .ml-xl\:33 { + margin-left: 33.33% !important; + } + + .mr-xl\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:33 { + margin: 33.33% !important; + } + + .mx-xxl\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-xxl\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-xxl\:33 { + margin-top: 33.33% !important; + } + + .mb-xxl\:33 { + margin-bottom: 33.33% !important; + } + + .ml-xxl\:33 { + margin-left: 33.33% !important; + } + + .mr-xxl\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:33 { + margin: 33.33% !important; + } + + .mx-sm-up\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-sm-up\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-sm-up\:33 { + margin-top: 33.33% !important; + } + + .mb-sm-up\:33 { + margin-bottom: 33.33% !important; + } + + .ml-sm-up\:33 { + margin-left: 33.33% !important; + } + + .mr-sm-up\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:33 { + margin: 33.33% !important; + } + + .mx-md-up\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-md-up\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-md-up\:33 { + margin-top: 33.33% !important; + } + + .mb-md-up\:33 { + margin-bottom: 33.33% !important; + } + + .ml-md-up\:33 { + margin-left: 33.33% !important; + } + + .mr-md-up\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:33 { + margin: 33.33% !important; + } + + .mx-lg-up\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-lg-up\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-lg-up\:33 { + margin-top: 33.33% !important; + } + + .mb-lg-up\:33 { + margin-bottom: 33.33% !important; + } + + .ml-lg-up\:33 { + margin-left: 33.33% !important; + } + + .mr-lg-up\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:33 { + margin: 33.33% !important; + } + + .mx-xl-up\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-xl-up\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-xl-up\:33 { + margin-top: 33.33% !important; + } + + .mb-xl-up\:33 { + margin-bottom: 33.33% !important; + } + + .ml-xl-up\:33 { + margin-left: 33.33% !important; + } + + .mr-xl-up\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:33 { + margin: 33.33% !important; + } + + .mx-sm-down\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-sm-down\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-sm-down\:33 { + margin-top: 33.33% !important; + } + + .mb-sm-down\:33 { + margin-bottom: 33.33% !important; + } + + .ml-sm-down\:33 { + margin-left: 33.33% !important; + } + + .mr-sm-down\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:33 { + margin: 33.33% !important; + } + + .mx-md-down\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-md-down\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-md-down\:33 { + margin-top: 33.33% !important; + } + + .mb-md-down\:33 { + margin-bottom: 33.33% !important; + } + + .ml-md-down\:33 { + margin-left: 33.33% !important; + } + + .mr-md-down\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:33 { + margin: 33.33% !important; + } + + .mx-lg-down\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-lg-down\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-lg-down\:33 { + margin-top: 33.33% !important; + } + + .mb-lg-down\:33 { + margin-bottom: 33.33% !important; + } + + .ml-lg-down\:33 { + margin-left: 33.33% !important; + } + + .mr-lg-down\:33 { + margin-right: 33.33% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:33 { + margin: 33.33% !important; + } + + .mx-xl-down\:33 { + margin-left: 33.33% !important; + margin-right: 33.33% !important; + } + + .my-xl-down\:33 { + margin-top: 33.33% !important; + margin-bottom: 33.33% !important; + } + + .mt-xl-down\:33 { + margin-top: 33.33% !important; + } + + .mb-xl-down\:33 { + margin-bottom: 33.33% !important; + } + + .ml-xl-down\:33 { + margin-left: 33.33% !important; + } + + .mr-xl-down\:33 { + margin-right: 33.33% !important; + } +} +.m\:40 { + margin: 40% !important; +} + +.mx\:40 { + margin-left: 40% !important; + margin-right: 40% !important; +} + +.my\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; +} + +.mt\:40 { + margin-top: 40% !important; +} + +.mb\:40 { + margin-bottom: 40% !important; +} + +.ml\:40 { + margin-left: 40% !important; +} + +.mr\:40 { + margin-right: 40% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:40 { + margin: 40% !important; + } + + .mx-xs\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-xs\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-xs\:40 { + margin-top: 40% !important; + } + + .mb-xs\:40 { + margin-bottom: 40% !important; + } + + .ml-xs\:40 { + margin-left: 40% !important; + } + + .mr-xs\:40 { + margin-right: 40% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:40 { + margin: 40% !important; + } + + .mx-sm\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-sm\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-sm\:40 { + margin-top: 40% !important; + } + + .mb-sm\:40 { + margin-bottom: 40% !important; + } + + .ml-sm\:40 { + margin-left: 40% !important; + } + + .mr-sm\:40 { + margin-right: 40% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:40 { + margin: 40% !important; + } + + .mx-md\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-md\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-md\:40 { + margin-top: 40% !important; + } + + .mb-md\:40 { + margin-bottom: 40% !important; + } + + .ml-md\:40 { + margin-left: 40% !important; + } + + .mr-md\:40 { + margin-right: 40% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:40 { + margin: 40% !important; + } + + .mx-lg\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-lg\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-lg\:40 { + margin-top: 40% !important; + } + + .mb-lg\:40 { + margin-bottom: 40% !important; + } + + .ml-lg\:40 { + margin-left: 40% !important; + } + + .mr-lg\:40 { + margin-right: 40% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:40 { + margin: 40% !important; + } + + .mx-xl\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-xl\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-xl\:40 { + margin-top: 40% !important; + } + + .mb-xl\:40 { + margin-bottom: 40% !important; + } + + .ml-xl\:40 { + margin-left: 40% !important; + } + + .mr-xl\:40 { + margin-right: 40% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:40 { + margin: 40% !important; + } + + .mx-xxl\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-xxl\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-xxl\:40 { + margin-top: 40% !important; + } + + .mb-xxl\:40 { + margin-bottom: 40% !important; + } + + .ml-xxl\:40 { + margin-left: 40% !important; + } + + .mr-xxl\:40 { + margin-right: 40% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:40 { + margin: 40% !important; + } + + .mx-sm-up\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-sm-up\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-sm-up\:40 { + margin-top: 40% !important; + } + + .mb-sm-up\:40 { + margin-bottom: 40% !important; + } + + .ml-sm-up\:40 { + margin-left: 40% !important; + } + + .mr-sm-up\:40 { + margin-right: 40% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:40 { + margin: 40% !important; + } + + .mx-md-up\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-md-up\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-md-up\:40 { + margin-top: 40% !important; + } + + .mb-md-up\:40 { + margin-bottom: 40% !important; + } + + .ml-md-up\:40 { + margin-left: 40% !important; + } + + .mr-md-up\:40 { + margin-right: 40% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:40 { + margin: 40% !important; + } + + .mx-lg-up\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-lg-up\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-lg-up\:40 { + margin-top: 40% !important; + } + + .mb-lg-up\:40 { + margin-bottom: 40% !important; + } + + .ml-lg-up\:40 { + margin-left: 40% !important; + } + + .mr-lg-up\:40 { + margin-right: 40% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:40 { + margin: 40% !important; + } + + .mx-xl-up\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-xl-up\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-xl-up\:40 { + margin-top: 40% !important; + } + + .mb-xl-up\:40 { + margin-bottom: 40% !important; + } + + .ml-xl-up\:40 { + margin-left: 40% !important; + } + + .mr-xl-up\:40 { + margin-right: 40% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:40 { + margin: 40% !important; + } + + .mx-sm-down\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-sm-down\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-sm-down\:40 { + margin-top: 40% !important; + } + + .mb-sm-down\:40 { + margin-bottom: 40% !important; + } + + .ml-sm-down\:40 { + margin-left: 40% !important; + } + + .mr-sm-down\:40 { + margin-right: 40% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:40 { + margin: 40% !important; + } + + .mx-md-down\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-md-down\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-md-down\:40 { + margin-top: 40% !important; + } + + .mb-md-down\:40 { + margin-bottom: 40% !important; + } + + .ml-md-down\:40 { + margin-left: 40% !important; + } + + .mr-md-down\:40 { + margin-right: 40% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:40 { + margin: 40% !important; + } + + .mx-lg-down\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-lg-down\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-lg-down\:40 { + margin-top: 40% !important; + } + + .mb-lg-down\:40 { + margin-bottom: 40% !important; + } + + .ml-lg-down\:40 { + margin-left: 40% !important; + } + + .mr-lg-down\:40 { + margin-right: 40% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:40 { + margin: 40% !important; + } + + .mx-xl-down\:40 { + margin-left: 40% !important; + margin-right: 40% !important; + } + + .my-xl-down\:40 { + margin-top: 40% !important; + margin-bottom: 40% !important; + } + + .mt-xl-down\:40 { + margin-top: 40% !important; + } + + .mb-xl-down\:40 { + margin-bottom: 40% !important; + } + + .ml-xl-down\:40 { + margin-left: 40% !important; + } + + .mr-xl-down\:40 { + margin-right: 40% !important; + } +} +.m\:45 { + margin: 45% !important; +} + +.mx\:45 { + margin-left: 45% !important; + margin-right: 45% !important; +} + +.my\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; +} + +.mt\:45 { + margin-top: 45% !important; +} + +.mb\:45 { + margin-bottom: 45% !important; +} + +.ml\:45 { + margin-left: 45% !important; +} + +.mr\:45 { + margin-right: 45% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:45 { + margin: 45% !important; + } + + .mx-xs\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-xs\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-xs\:45 { + margin-top: 45% !important; + } + + .mb-xs\:45 { + margin-bottom: 45% !important; + } + + .ml-xs\:45 { + margin-left: 45% !important; + } + + .mr-xs\:45 { + margin-right: 45% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:45 { + margin: 45% !important; + } + + .mx-sm\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-sm\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-sm\:45 { + margin-top: 45% !important; + } + + .mb-sm\:45 { + margin-bottom: 45% !important; + } + + .ml-sm\:45 { + margin-left: 45% !important; + } + + .mr-sm\:45 { + margin-right: 45% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:45 { + margin: 45% !important; + } + + .mx-md\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-md\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-md\:45 { + margin-top: 45% !important; + } + + .mb-md\:45 { + margin-bottom: 45% !important; + } + + .ml-md\:45 { + margin-left: 45% !important; + } + + .mr-md\:45 { + margin-right: 45% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:45 { + margin: 45% !important; + } + + .mx-lg\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-lg\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-lg\:45 { + margin-top: 45% !important; + } + + .mb-lg\:45 { + margin-bottom: 45% !important; + } + + .ml-lg\:45 { + margin-left: 45% !important; + } + + .mr-lg\:45 { + margin-right: 45% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:45 { + margin: 45% !important; + } + + .mx-xl\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-xl\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-xl\:45 { + margin-top: 45% !important; + } + + .mb-xl\:45 { + margin-bottom: 45% !important; + } + + .ml-xl\:45 { + margin-left: 45% !important; + } + + .mr-xl\:45 { + margin-right: 45% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:45 { + margin: 45% !important; + } + + .mx-xxl\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-xxl\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-xxl\:45 { + margin-top: 45% !important; + } + + .mb-xxl\:45 { + margin-bottom: 45% !important; + } + + .ml-xxl\:45 { + margin-left: 45% !important; + } + + .mr-xxl\:45 { + margin-right: 45% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:45 { + margin: 45% !important; + } + + .mx-sm-up\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-sm-up\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-sm-up\:45 { + margin-top: 45% !important; + } + + .mb-sm-up\:45 { + margin-bottom: 45% !important; + } + + .ml-sm-up\:45 { + margin-left: 45% !important; + } + + .mr-sm-up\:45 { + margin-right: 45% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:45 { + margin: 45% !important; + } + + .mx-md-up\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-md-up\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-md-up\:45 { + margin-top: 45% !important; + } + + .mb-md-up\:45 { + margin-bottom: 45% !important; + } + + .ml-md-up\:45 { + margin-left: 45% !important; + } + + .mr-md-up\:45 { + margin-right: 45% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:45 { + margin: 45% !important; + } + + .mx-lg-up\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-lg-up\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-lg-up\:45 { + margin-top: 45% !important; + } + + .mb-lg-up\:45 { + margin-bottom: 45% !important; + } + + .ml-lg-up\:45 { + margin-left: 45% !important; + } + + .mr-lg-up\:45 { + margin-right: 45% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:45 { + margin: 45% !important; + } + + .mx-xl-up\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-xl-up\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-xl-up\:45 { + margin-top: 45% !important; + } + + .mb-xl-up\:45 { + margin-bottom: 45% !important; + } + + .ml-xl-up\:45 { + margin-left: 45% !important; + } + + .mr-xl-up\:45 { + margin-right: 45% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:45 { + margin: 45% !important; + } + + .mx-sm-down\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-sm-down\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-sm-down\:45 { + margin-top: 45% !important; + } + + .mb-sm-down\:45 { + margin-bottom: 45% !important; + } + + .ml-sm-down\:45 { + margin-left: 45% !important; + } + + .mr-sm-down\:45 { + margin-right: 45% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:45 { + margin: 45% !important; + } + + .mx-md-down\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-md-down\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-md-down\:45 { + margin-top: 45% !important; + } + + .mb-md-down\:45 { + margin-bottom: 45% !important; + } + + .ml-md-down\:45 { + margin-left: 45% !important; + } + + .mr-md-down\:45 { + margin-right: 45% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:45 { + margin: 45% !important; + } + + .mx-lg-down\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-lg-down\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-lg-down\:45 { + margin-top: 45% !important; + } + + .mb-lg-down\:45 { + margin-bottom: 45% !important; + } + + .ml-lg-down\:45 { + margin-left: 45% !important; + } + + .mr-lg-down\:45 { + margin-right: 45% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:45 { + margin: 45% !important; + } + + .mx-xl-down\:45 { + margin-left: 45% !important; + margin-right: 45% !important; + } + + .my-xl-down\:45 { + margin-top: 45% !important; + margin-bottom: 45% !important; + } + + .mt-xl-down\:45 { + margin-top: 45% !important; + } + + .mb-xl-down\:45 { + margin-bottom: 45% !important; + } + + .ml-xl-down\:45 { + margin-left: 45% !important; + } + + .mr-xl-down\:45 { + margin-right: 45% !important; + } +} +.m\:50 { + margin: 50% !important; +} + +.mx\:50 { + margin-left: 50% !important; + margin-right: 50% !important; +} + +.my\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; +} + +.mt\:50 { + margin-top: 50% !important; +} + +.mb\:50 { + margin-bottom: 50% !important; +} + +.ml\:50 { + margin-left: 50% !important; +} + +.mr\:50 { + margin-right: 50% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:50 { + margin: 50% !important; + } + + .mx-xs\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-xs\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-xs\:50 { + margin-top: 50% !important; + } + + .mb-xs\:50 { + margin-bottom: 50% !important; + } + + .ml-xs\:50 { + margin-left: 50% !important; + } + + .mr-xs\:50 { + margin-right: 50% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:50 { + margin: 50% !important; + } + + .mx-sm\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-sm\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-sm\:50 { + margin-top: 50% !important; + } + + .mb-sm\:50 { + margin-bottom: 50% !important; + } + + .ml-sm\:50 { + margin-left: 50% !important; + } + + .mr-sm\:50 { + margin-right: 50% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:50 { + margin: 50% !important; + } + + .mx-md\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-md\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-md\:50 { + margin-top: 50% !important; + } + + .mb-md\:50 { + margin-bottom: 50% !important; + } + + .ml-md\:50 { + margin-left: 50% !important; + } + + .mr-md\:50 { + margin-right: 50% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:50 { + margin: 50% !important; + } + + .mx-lg\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-lg\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-lg\:50 { + margin-top: 50% !important; + } + + .mb-lg\:50 { + margin-bottom: 50% !important; + } + + .ml-lg\:50 { + margin-left: 50% !important; + } + + .mr-lg\:50 { + margin-right: 50% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:50 { + margin: 50% !important; + } + + .mx-xl\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-xl\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-xl\:50 { + margin-top: 50% !important; + } + + .mb-xl\:50 { + margin-bottom: 50% !important; + } + + .ml-xl\:50 { + margin-left: 50% !important; + } + + .mr-xl\:50 { + margin-right: 50% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:50 { + margin: 50% !important; + } + + .mx-xxl\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-xxl\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-xxl\:50 { + margin-top: 50% !important; + } + + .mb-xxl\:50 { + margin-bottom: 50% !important; + } + + .ml-xxl\:50 { + margin-left: 50% !important; + } + + .mr-xxl\:50 { + margin-right: 50% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:50 { + margin: 50% !important; + } + + .mx-sm-up\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-sm-up\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-sm-up\:50 { + margin-top: 50% !important; + } + + .mb-sm-up\:50 { + margin-bottom: 50% !important; + } + + .ml-sm-up\:50 { + margin-left: 50% !important; + } + + .mr-sm-up\:50 { + margin-right: 50% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:50 { + margin: 50% !important; + } + + .mx-md-up\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-md-up\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-md-up\:50 { + margin-top: 50% !important; + } + + .mb-md-up\:50 { + margin-bottom: 50% !important; + } + + .ml-md-up\:50 { + margin-left: 50% !important; + } + + .mr-md-up\:50 { + margin-right: 50% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:50 { + margin: 50% !important; + } + + .mx-lg-up\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-lg-up\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-lg-up\:50 { + margin-top: 50% !important; + } + + .mb-lg-up\:50 { + margin-bottom: 50% !important; + } + + .ml-lg-up\:50 { + margin-left: 50% !important; + } + + .mr-lg-up\:50 { + margin-right: 50% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:50 { + margin: 50% !important; + } + + .mx-xl-up\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-xl-up\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-xl-up\:50 { + margin-top: 50% !important; + } + + .mb-xl-up\:50 { + margin-bottom: 50% !important; + } + + .ml-xl-up\:50 { + margin-left: 50% !important; + } + + .mr-xl-up\:50 { + margin-right: 50% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:50 { + margin: 50% !important; + } + + .mx-sm-down\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-sm-down\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-sm-down\:50 { + margin-top: 50% !important; + } + + .mb-sm-down\:50 { + margin-bottom: 50% !important; + } + + .ml-sm-down\:50 { + margin-left: 50% !important; + } + + .mr-sm-down\:50 { + margin-right: 50% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:50 { + margin: 50% !important; + } + + .mx-md-down\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-md-down\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-md-down\:50 { + margin-top: 50% !important; + } + + .mb-md-down\:50 { + margin-bottom: 50% !important; + } + + .ml-md-down\:50 { + margin-left: 50% !important; + } + + .mr-md-down\:50 { + margin-right: 50% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:50 { + margin: 50% !important; + } + + .mx-lg-down\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-lg-down\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-lg-down\:50 { + margin-top: 50% !important; + } + + .mb-lg-down\:50 { + margin-bottom: 50% !important; + } + + .ml-lg-down\:50 { + margin-left: 50% !important; + } + + .mr-lg-down\:50 { + margin-right: 50% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:50 { + margin: 50% !important; + } + + .mx-xl-down\:50 { + margin-left: 50% !important; + margin-right: 50% !important; + } + + .my-xl-down\:50 { + margin-top: 50% !important; + margin-bottom: 50% !important; + } + + .mt-xl-down\:50 { + margin-top: 50% !important; + } + + .mb-xl-down\:50 { + margin-bottom: 50% !important; + } + + .ml-xl-down\:50 { + margin-left: 50% !important; + } + + .mr-xl-down\:50 { + margin-right: 50% !important; + } +} +.m\:60 { + margin: 60% !important; +} + +.mx\:60 { + margin-left: 60% !important; + margin-right: 60% !important; +} + +.my\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; +} + +.mt\:60 { + margin-top: 60% !important; +} + +.mb\:60 { + margin-bottom: 60% !important; +} + +.ml\:60 { + margin-left: 60% !important; +} + +.mr\:60 { + margin-right: 60% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:60 { + margin: 60% !important; + } + + .mx-xs\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-xs\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-xs\:60 { + margin-top: 60% !important; + } + + .mb-xs\:60 { + margin-bottom: 60% !important; + } + + .ml-xs\:60 { + margin-left: 60% !important; + } + + .mr-xs\:60 { + margin-right: 60% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:60 { + margin: 60% !important; + } + + .mx-sm\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-sm\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-sm\:60 { + margin-top: 60% !important; + } + + .mb-sm\:60 { + margin-bottom: 60% !important; + } + + .ml-sm\:60 { + margin-left: 60% !important; + } + + .mr-sm\:60 { + margin-right: 60% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:60 { + margin: 60% !important; + } + + .mx-md\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-md\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-md\:60 { + margin-top: 60% !important; + } + + .mb-md\:60 { + margin-bottom: 60% !important; + } + + .ml-md\:60 { + margin-left: 60% !important; + } + + .mr-md\:60 { + margin-right: 60% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:60 { + margin: 60% !important; + } + + .mx-lg\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-lg\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-lg\:60 { + margin-top: 60% !important; + } + + .mb-lg\:60 { + margin-bottom: 60% !important; + } + + .ml-lg\:60 { + margin-left: 60% !important; + } + + .mr-lg\:60 { + margin-right: 60% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:60 { + margin: 60% !important; + } + + .mx-xl\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-xl\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-xl\:60 { + margin-top: 60% !important; + } + + .mb-xl\:60 { + margin-bottom: 60% !important; + } + + .ml-xl\:60 { + margin-left: 60% !important; + } + + .mr-xl\:60 { + margin-right: 60% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:60 { + margin: 60% !important; + } + + .mx-xxl\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-xxl\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-xxl\:60 { + margin-top: 60% !important; + } + + .mb-xxl\:60 { + margin-bottom: 60% !important; + } + + .ml-xxl\:60 { + margin-left: 60% !important; + } + + .mr-xxl\:60 { + margin-right: 60% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:60 { + margin: 60% !important; + } + + .mx-sm-up\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-sm-up\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-sm-up\:60 { + margin-top: 60% !important; + } + + .mb-sm-up\:60 { + margin-bottom: 60% !important; + } + + .ml-sm-up\:60 { + margin-left: 60% !important; + } + + .mr-sm-up\:60 { + margin-right: 60% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:60 { + margin: 60% !important; + } + + .mx-md-up\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-md-up\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-md-up\:60 { + margin-top: 60% !important; + } + + .mb-md-up\:60 { + margin-bottom: 60% !important; + } + + .ml-md-up\:60 { + margin-left: 60% !important; + } + + .mr-md-up\:60 { + margin-right: 60% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:60 { + margin: 60% !important; + } + + .mx-lg-up\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-lg-up\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-lg-up\:60 { + margin-top: 60% !important; + } + + .mb-lg-up\:60 { + margin-bottom: 60% !important; + } + + .ml-lg-up\:60 { + margin-left: 60% !important; + } + + .mr-lg-up\:60 { + margin-right: 60% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:60 { + margin: 60% !important; + } + + .mx-xl-up\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-xl-up\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-xl-up\:60 { + margin-top: 60% !important; + } + + .mb-xl-up\:60 { + margin-bottom: 60% !important; + } + + .ml-xl-up\:60 { + margin-left: 60% !important; + } + + .mr-xl-up\:60 { + margin-right: 60% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:60 { + margin: 60% !important; + } + + .mx-sm-down\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-sm-down\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-sm-down\:60 { + margin-top: 60% !important; + } + + .mb-sm-down\:60 { + margin-bottom: 60% !important; + } + + .ml-sm-down\:60 { + margin-left: 60% !important; + } + + .mr-sm-down\:60 { + margin-right: 60% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:60 { + margin: 60% !important; + } + + .mx-md-down\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-md-down\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-md-down\:60 { + margin-top: 60% !important; + } + + .mb-md-down\:60 { + margin-bottom: 60% !important; + } + + .ml-md-down\:60 { + margin-left: 60% !important; + } + + .mr-md-down\:60 { + margin-right: 60% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:60 { + margin: 60% !important; + } + + .mx-lg-down\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-lg-down\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-lg-down\:60 { + margin-top: 60% !important; + } + + .mb-lg-down\:60 { + margin-bottom: 60% !important; + } + + .ml-lg-down\:60 { + margin-left: 60% !important; + } + + .mr-lg-down\:60 { + margin-right: 60% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:60 { + margin: 60% !important; + } + + .mx-xl-down\:60 { + margin-left: 60% !important; + margin-right: 60% !important; + } + + .my-xl-down\:60 { + margin-top: 60% !important; + margin-bottom: 60% !important; + } + + .mt-xl-down\:60 { + margin-top: 60% !important; + } + + .mb-xl-down\:60 { + margin-bottom: 60% !important; + } + + .ml-xl-down\:60 { + margin-left: 60% !important; + } + + .mr-xl-down\:60 { + margin-right: 60% !important; + } +} +.m\:66 { + margin: 66.66% !important; +} + +.mx\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; +} + +.my\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; +} + +.mt\:66 { + margin-top: 66.66% !important; +} + +.mb\:66 { + margin-bottom: 66.66% !important; +} + +.ml\:66 { + margin-left: 66.66% !important; +} + +.mr\:66 { + margin-right: 66.66% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:66 { + margin: 66.66% !important; + } + + .mx-xs\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-xs\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-xs\:66 { + margin-top: 66.66% !important; + } + + .mb-xs\:66 { + margin-bottom: 66.66% !important; + } + + .ml-xs\:66 { + margin-left: 66.66% !important; + } + + .mr-xs\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:66 { + margin: 66.66% !important; + } + + .mx-sm\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-sm\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-sm\:66 { + margin-top: 66.66% !important; + } + + .mb-sm\:66 { + margin-bottom: 66.66% !important; + } + + .ml-sm\:66 { + margin-left: 66.66% !important; + } + + .mr-sm\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:66 { + margin: 66.66% !important; + } + + .mx-md\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-md\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-md\:66 { + margin-top: 66.66% !important; + } + + .mb-md\:66 { + margin-bottom: 66.66% !important; + } + + .ml-md\:66 { + margin-left: 66.66% !important; + } + + .mr-md\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:66 { + margin: 66.66% !important; + } + + .mx-lg\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-lg\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-lg\:66 { + margin-top: 66.66% !important; + } + + .mb-lg\:66 { + margin-bottom: 66.66% !important; + } + + .ml-lg\:66 { + margin-left: 66.66% !important; + } + + .mr-lg\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:66 { + margin: 66.66% !important; + } + + .mx-xl\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-xl\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-xl\:66 { + margin-top: 66.66% !important; + } + + .mb-xl\:66 { + margin-bottom: 66.66% !important; + } + + .ml-xl\:66 { + margin-left: 66.66% !important; + } + + .mr-xl\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:66 { + margin: 66.66% !important; + } + + .mx-xxl\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-xxl\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-xxl\:66 { + margin-top: 66.66% !important; + } + + .mb-xxl\:66 { + margin-bottom: 66.66% !important; + } + + .ml-xxl\:66 { + margin-left: 66.66% !important; + } + + .mr-xxl\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:66 { + margin: 66.66% !important; + } + + .mx-sm-up\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-sm-up\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-sm-up\:66 { + margin-top: 66.66% !important; + } + + .mb-sm-up\:66 { + margin-bottom: 66.66% !important; + } + + .ml-sm-up\:66 { + margin-left: 66.66% !important; + } + + .mr-sm-up\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:66 { + margin: 66.66% !important; + } + + .mx-md-up\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-md-up\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-md-up\:66 { + margin-top: 66.66% !important; + } + + .mb-md-up\:66 { + margin-bottom: 66.66% !important; + } + + .ml-md-up\:66 { + margin-left: 66.66% !important; + } + + .mr-md-up\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:66 { + margin: 66.66% !important; + } + + .mx-lg-up\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-lg-up\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-lg-up\:66 { + margin-top: 66.66% !important; + } + + .mb-lg-up\:66 { + margin-bottom: 66.66% !important; + } + + .ml-lg-up\:66 { + margin-left: 66.66% !important; + } + + .mr-lg-up\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:66 { + margin: 66.66% !important; + } + + .mx-xl-up\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-xl-up\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-xl-up\:66 { + margin-top: 66.66% !important; + } + + .mb-xl-up\:66 { + margin-bottom: 66.66% !important; + } + + .ml-xl-up\:66 { + margin-left: 66.66% !important; + } + + .mr-xl-up\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:66 { + margin: 66.66% !important; + } + + .mx-sm-down\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-sm-down\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-sm-down\:66 { + margin-top: 66.66% !important; + } + + .mb-sm-down\:66 { + margin-bottom: 66.66% !important; + } + + .ml-sm-down\:66 { + margin-left: 66.66% !important; + } + + .mr-sm-down\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:66 { + margin: 66.66% !important; + } + + .mx-md-down\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-md-down\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-md-down\:66 { + margin-top: 66.66% !important; + } + + .mb-md-down\:66 { + margin-bottom: 66.66% !important; + } + + .ml-md-down\:66 { + margin-left: 66.66% !important; + } + + .mr-md-down\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:66 { + margin: 66.66% !important; + } + + .mx-lg-down\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-lg-down\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-lg-down\:66 { + margin-top: 66.66% !important; + } + + .mb-lg-down\:66 { + margin-bottom: 66.66% !important; + } + + .ml-lg-down\:66 { + margin-left: 66.66% !important; + } + + .mr-lg-down\:66 { + margin-right: 66.66% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:66 { + margin: 66.66% !important; + } + + .mx-xl-down\:66 { + margin-left: 66.66% !important; + margin-right: 66.66% !important; + } + + .my-xl-down\:66 { + margin-top: 66.66% !important; + margin-bottom: 66.66% !important; + } + + .mt-xl-down\:66 { + margin-top: 66.66% !important; + } + + .mb-xl-down\:66 { + margin-bottom: 66.66% !important; + } + + .ml-xl-down\:66 { + margin-left: 66.66% !important; + } + + .mr-xl-down\:66 { + margin-right: 66.66% !important; + } +} +.m\:70 { + margin: 70% !important; +} + +.mx\:70 { + margin-left: 70% !important; + margin-right: 70% !important; +} + +.my\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; +} + +.mt\:70 { + margin-top: 70% !important; +} + +.mb\:70 { + margin-bottom: 70% !important; +} + +.ml\:70 { + margin-left: 70% !important; +} + +.mr\:70 { + margin-right: 70% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:70 { + margin: 70% !important; + } + + .mx-xs\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-xs\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-xs\:70 { + margin-top: 70% !important; + } + + .mb-xs\:70 { + margin-bottom: 70% !important; + } + + .ml-xs\:70 { + margin-left: 70% !important; + } + + .mr-xs\:70 { + margin-right: 70% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:70 { + margin: 70% !important; + } + + .mx-sm\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-sm\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-sm\:70 { + margin-top: 70% !important; + } + + .mb-sm\:70 { + margin-bottom: 70% !important; + } + + .ml-sm\:70 { + margin-left: 70% !important; + } + + .mr-sm\:70 { + margin-right: 70% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:70 { + margin: 70% !important; + } + + .mx-md\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-md\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-md\:70 { + margin-top: 70% !important; + } + + .mb-md\:70 { + margin-bottom: 70% !important; + } + + .ml-md\:70 { + margin-left: 70% !important; + } + + .mr-md\:70 { + margin-right: 70% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:70 { + margin: 70% !important; + } + + .mx-lg\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-lg\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-lg\:70 { + margin-top: 70% !important; + } + + .mb-lg\:70 { + margin-bottom: 70% !important; + } + + .ml-lg\:70 { + margin-left: 70% !important; + } + + .mr-lg\:70 { + margin-right: 70% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:70 { + margin: 70% !important; + } + + .mx-xl\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-xl\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-xl\:70 { + margin-top: 70% !important; + } + + .mb-xl\:70 { + margin-bottom: 70% !important; + } + + .ml-xl\:70 { + margin-left: 70% !important; + } + + .mr-xl\:70 { + margin-right: 70% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:70 { + margin: 70% !important; + } + + .mx-xxl\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-xxl\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-xxl\:70 { + margin-top: 70% !important; + } + + .mb-xxl\:70 { + margin-bottom: 70% !important; + } + + .ml-xxl\:70 { + margin-left: 70% !important; + } + + .mr-xxl\:70 { + margin-right: 70% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:70 { + margin: 70% !important; + } + + .mx-sm-up\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-sm-up\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-sm-up\:70 { + margin-top: 70% !important; + } + + .mb-sm-up\:70 { + margin-bottom: 70% !important; + } + + .ml-sm-up\:70 { + margin-left: 70% !important; + } + + .mr-sm-up\:70 { + margin-right: 70% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:70 { + margin: 70% !important; + } + + .mx-md-up\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-md-up\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-md-up\:70 { + margin-top: 70% !important; + } + + .mb-md-up\:70 { + margin-bottom: 70% !important; + } + + .ml-md-up\:70 { + margin-left: 70% !important; + } + + .mr-md-up\:70 { + margin-right: 70% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:70 { + margin: 70% !important; + } + + .mx-lg-up\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-lg-up\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-lg-up\:70 { + margin-top: 70% !important; + } + + .mb-lg-up\:70 { + margin-bottom: 70% !important; + } + + .ml-lg-up\:70 { + margin-left: 70% !important; + } + + .mr-lg-up\:70 { + margin-right: 70% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:70 { + margin: 70% !important; + } + + .mx-xl-up\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-xl-up\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-xl-up\:70 { + margin-top: 70% !important; + } + + .mb-xl-up\:70 { + margin-bottom: 70% !important; + } + + .ml-xl-up\:70 { + margin-left: 70% !important; + } + + .mr-xl-up\:70 { + margin-right: 70% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:70 { + margin: 70% !important; + } + + .mx-sm-down\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-sm-down\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-sm-down\:70 { + margin-top: 70% !important; + } + + .mb-sm-down\:70 { + margin-bottom: 70% !important; + } + + .ml-sm-down\:70 { + margin-left: 70% !important; + } + + .mr-sm-down\:70 { + margin-right: 70% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:70 { + margin: 70% !important; + } + + .mx-md-down\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-md-down\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-md-down\:70 { + margin-top: 70% !important; + } + + .mb-md-down\:70 { + margin-bottom: 70% !important; + } + + .ml-md-down\:70 { + margin-left: 70% !important; + } + + .mr-md-down\:70 { + margin-right: 70% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:70 { + margin: 70% !important; + } + + .mx-lg-down\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-lg-down\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-lg-down\:70 { + margin-top: 70% !important; + } + + .mb-lg-down\:70 { + margin-bottom: 70% !important; + } + + .ml-lg-down\:70 { + margin-left: 70% !important; + } + + .mr-lg-down\:70 { + margin-right: 70% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:70 { + margin: 70% !important; + } + + .mx-xl-down\:70 { + margin-left: 70% !important; + margin-right: 70% !important; + } + + .my-xl-down\:70 { + margin-top: 70% !important; + margin-bottom: 70% !important; + } + + .mt-xl-down\:70 { + margin-top: 70% !important; + } + + .mb-xl-down\:70 { + margin-bottom: 70% !important; + } + + .ml-xl-down\:70 { + margin-left: 70% !important; + } + + .mr-xl-down\:70 { + margin-right: 70% !important; + } +} +.m\:75 { + margin: 75% !important; +} + +.mx\:75 { + margin-left: 75% !important; + margin-right: 75% !important; +} + +.my\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; +} + +.mt\:75 { + margin-top: 75% !important; +} + +.mb\:75 { + margin-bottom: 75% !important; +} + +.ml\:75 { + margin-left: 75% !important; +} + +.mr\:75 { + margin-right: 75% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:75 { + margin: 75% !important; + } + + .mx-xs\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-xs\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-xs\:75 { + margin-top: 75% !important; + } + + .mb-xs\:75 { + margin-bottom: 75% !important; + } + + .ml-xs\:75 { + margin-left: 75% !important; + } + + .mr-xs\:75 { + margin-right: 75% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:75 { + margin: 75% !important; + } + + .mx-sm\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-sm\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-sm\:75 { + margin-top: 75% !important; + } + + .mb-sm\:75 { + margin-bottom: 75% !important; + } + + .ml-sm\:75 { + margin-left: 75% !important; + } + + .mr-sm\:75 { + margin-right: 75% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:75 { + margin: 75% !important; + } + + .mx-md\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-md\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-md\:75 { + margin-top: 75% !important; + } + + .mb-md\:75 { + margin-bottom: 75% !important; + } + + .ml-md\:75 { + margin-left: 75% !important; + } + + .mr-md\:75 { + margin-right: 75% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:75 { + margin: 75% !important; + } + + .mx-lg\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-lg\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-lg\:75 { + margin-top: 75% !important; + } + + .mb-lg\:75 { + margin-bottom: 75% !important; + } + + .ml-lg\:75 { + margin-left: 75% !important; + } + + .mr-lg\:75 { + margin-right: 75% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:75 { + margin: 75% !important; + } + + .mx-xl\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-xl\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-xl\:75 { + margin-top: 75% !important; + } + + .mb-xl\:75 { + margin-bottom: 75% !important; + } + + .ml-xl\:75 { + margin-left: 75% !important; + } + + .mr-xl\:75 { + margin-right: 75% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:75 { + margin: 75% !important; + } + + .mx-xxl\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-xxl\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-xxl\:75 { + margin-top: 75% !important; + } + + .mb-xxl\:75 { + margin-bottom: 75% !important; + } + + .ml-xxl\:75 { + margin-left: 75% !important; + } + + .mr-xxl\:75 { + margin-right: 75% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:75 { + margin: 75% !important; + } + + .mx-sm-up\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-sm-up\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-sm-up\:75 { + margin-top: 75% !important; + } + + .mb-sm-up\:75 { + margin-bottom: 75% !important; + } + + .ml-sm-up\:75 { + margin-left: 75% !important; + } + + .mr-sm-up\:75 { + margin-right: 75% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:75 { + margin: 75% !important; + } + + .mx-md-up\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-md-up\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-md-up\:75 { + margin-top: 75% !important; + } + + .mb-md-up\:75 { + margin-bottom: 75% !important; + } + + .ml-md-up\:75 { + margin-left: 75% !important; + } + + .mr-md-up\:75 { + margin-right: 75% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:75 { + margin: 75% !important; + } + + .mx-lg-up\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-lg-up\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-lg-up\:75 { + margin-top: 75% !important; + } + + .mb-lg-up\:75 { + margin-bottom: 75% !important; + } + + .ml-lg-up\:75 { + margin-left: 75% !important; + } + + .mr-lg-up\:75 { + margin-right: 75% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:75 { + margin: 75% !important; + } + + .mx-xl-up\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-xl-up\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-xl-up\:75 { + margin-top: 75% !important; + } + + .mb-xl-up\:75 { + margin-bottom: 75% !important; + } + + .ml-xl-up\:75 { + margin-left: 75% !important; + } + + .mr-xl-up\:75 { + margin-right: 75% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:75 { + margin: 75% !important; + } + + .mx-sm-down\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-sm-down\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-sm-down\:75 { + margin-top: 75% !important; + } + + .mb-sm-down\:75 { + margin-bottom: 75% !important; + } + + .ml-sm-down\:75 { + margin-left: 75% !important; + } + + .mr-sm-down\:75 { + margin-right: 75% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:75 { + margin: 75% !important; + } + + .mx-md-down\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-md-down\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-md-down\:75 { + margin-top: 75% !important; + } + + .mb-md-down\:75 { + margin-bottom: 75% !important; + } + + .ml-md-down\:75 { + margin-left: 75% !important; + } + + .mr-md-down\:75 { + margin-right: 75% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:75 { + margin: 75% !important; + } + + .mx-lg-down\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-lg-down\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-lg-down\:75 { + margin-top: 75% !important; + } + + .mb-lg-down\:75 { + margin-bottom: 75% !important; + } + + .ml-lg-down\:75 { + margin-left: 75% !important; + } + + .mr-lg-down\:75 { + margin-right: 75% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:75 { + margin: 75% !important; + } + + .mx-xl-down\:75 { + margin-left: 75% !important; + margin-right: 75% !important; + } + + .my-xl-down\:75 { + margin-top: 75% !important; + margin-bottom: 75% !important; + } + + .mt-xl-down\:75 { + margin-top: 75% !important; + } + + .mb-xl-down\:75 { + margin-bottom: 75% !important; + } + + .ml-xl-down\:75 { + margin-left: 75% !important; + } + + .mr-xl-down\:75 { + margin-right: 75% !important; + } +} +.m\:80 { + margin: 80% !important; +} + +.mx\:80 { + margin-left: 80% !important; + margin-right: 80% !important; +} + +.my\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; +} + +.mt\:80 { + margin-top: 80% !important; +} + +.mb\:80 { + margin-bottom: 80% !important; +} + +.ml\:80 { + margin-left: 80% !important; +} + +.mr\:80 { + margin-right: 80% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:80 { + margin: 80% !important; + } + + .mx-xs\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-xs\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-xs\:80 { + margin-top: 80% !important; + } + + .mb-xs\:80 { + margin-bottom: 80% !important; + } + + .ml-xs\:80 { + margin-left: 80% !important; + } + + .mr-xs\:80 { + margin-right: 80% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:80 { + margin: 80% !important; + } + + .mx-sm\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-sm\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-sm\:80 { + margin-top: 80% !important; + } + + .mb-sm\:80 { + margin-bottom: 80% !important; + } + + .ml-sm\:80 { + margin-left: 80% !important; + } + + .mr-sm\:80 { + margin-right: 80% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:80 { + margin: 80% !important; + } + + .mx-md\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-md\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-md\:80 { + margin-top: 80% !important; + } + + .mb-md\:80 { + margin-bottom: 80% !important; + } + + .ml-md\:80 { + margin-left: 80% !important; + } + + .mr-md\:80 { + margin-right: 80% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:80 { + margin: 80% !important; + } + + .mx-lg\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-lg\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-lg\:80 { + margin-top: 80% !important; + } + + .mb-lg\:80 { + margin-bottom: 80% !important; + } + + .ml-lg\:80 { + margin-left: 80% !important; + } + + .mr-lg\:80 { + margin-right: 80% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:80 { + margin: 80% !important; + } + + .mx-xl\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-xl\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-xl\:80 { + margin-top: 80% !important; + } + + .mb-xl\:80 { + margin-bottom: 80% !important; + } + + .ml-xl\:80 { + margin-left: 80% !important; + } + + .mr-xl\:80 { + margin-right: 80% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:80 { + margin: 80% !important; + } + + .mx-xxl\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-xxl\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-xxl\:80 { + margin-top: 80% !important; + } + + .mb-xxl\:80 { + margin-bottom: 80% !important; + } + + .ml-xxl\:80 { + margin-left: 80% !important; + } + + .mr-xxl\:80 { + margin-right: 80% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:80 { + margin: 80% !important; + } + + .mx-sm-up\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-sm-up\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-sm-up\:80 { + margin-top: 80% !important; + } + + .mb-sm-up\:80 { + margin-bottom: 80% !important; + } + + .ml-sm-up\:80 { + margin-left: 80% !important; + } + + .mr-sm-up\:80 { + margin-right: 80% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:80 { + margin: 80% !important; + } + + .mx-md-up\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-md-up\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-md-up\:80 { + margin-top: 80% !important; + } + + .mb-md-up\:80 { + margin-bottom: 80% !important; + } + + .ml-md-up\:80 { + margin-left: 80% !important; + } + + .mr-md-up\:80 { + margin-right: 80% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:80 { + margin: 80% !important; + } + + .mx-lg-up\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-lg-up\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-lg-up\:80 { + margin-top: 80% !important; + } + + .mb-lg-up\:80 { + margin-bottom: 80% !important; + } + + .ml-lg-up\:80 { + margin-left: 80% !important; + } + + .mr-lg-up\:80 { + margin-right: 80% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:80 { + margin: 80% !important; + } + + .mx-xl-up\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-xl-up\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-xl-up\:80 { + margin-top: 80% !important; + } + + .mb-xl-up\:80 { + margin-bottom: 80% !important; + } + + .ml-xl-up\:80 { + margin-left: 80% !important; + } + + .mr-xl-up\:80 { + margin-right: 80% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:80 { + margin: 80% !important; + } + + .mx-sm-down\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-sm-down\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-sm-down\:80 { + margin-top: 80% !important; + } + + .mb-sm-down\:80 { + margin-bottom: 80% !important; + } + + .ml-sm-down\:80 { + margin-left: 80% !important; + } + + .mr-sm-down\:80 { + margin-right: 80% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:80 { + margin: 80% !important; + } + + .mx-md-down\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-md-down\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-md-down\:80 { + margin-top: 80% !important; + } + + .mb-md-down\:80 { + margin-bottom: 80% !important; + } + + .ml-md-down\:80 { + margin-left: 80% !important; + } + + .mr-md-down\:80 { + margin-right: 80% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:80 { + margin: 80% !important; + } + + .mx-lg-down\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-lg-down\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-lg-down\:80 { + margin-top: 80% !important; + } + + .mb-lg-down\:80 { + margin-bottom: 80% !important; + } + + .ml-lg-down\:80 { + margin-left: 80% !important; + } + + .mr-lg-down\:80 { + margin-right: 80% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:80 { + margin: 80% !important; + } + + .mx-xl-down\:80 { + margin-left: 80% !important; + margin-right: 80% !important; + } + + .my-xl-down\:80 { + margin-top: 80% !important; + margin-bottom: 80% !important; + } + + .mt-xl-down\:80 { + margin-top: 80% !important; + } + + .mb-xl-down\:80 { + margin-bottom: 80% !important; + } + + .ml-xl-down\:80 { + margin-left: 80% !important; + } + + .mr-xl-down\:80 { + margin-right: 80% !important; + } +} +.m\:90 { + margin: 90% !important; +} + +.mx\:90 { + margin-left: 90% !important; + margin-right: 90% !important; +} + +.my\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; +} + +.mt\:90 { + margin-top: 90% !important; +} + +.mb\:90 { + margin-bottom: 90% !important; +} + +.ml\:90 { + margin-left: 90% !important; +} + +.mr\:90 { + margin-right: 90% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:90 { + margin: 90% !important; + } + + .mx-xs\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-xs\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-xs\:90 { + margin-top: 90% !important; + } + + .mb-xs\:90 { + margin-bottom: 90% !important; + } + + .ml-xs\:90 { + margin-left: 90% !important; + } + + .mr-xs\:90 { + margin-right: 90% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:90 { + margin: 90% !important; + } + + .mx-sm\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-sm\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-sm\:90 { + margin-top: 90% !important; + } + + .mb-sm\:90 { + margin-bottom: 90% !important; + } + + .ml-sm\:90 { + margin-left: 90% !important; + } + + .mr-sm\:90 { + margin-right: 90% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:90 { + margin: 90% !important; + } + + .mx-md\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-md\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-md\:90 { + margin-top: 90% !important; + } + + .mb-md\:90 { + margin-bottom: 90% !important; + } + + .ml-md\:90 { + margin-left: 90% !important; + } + + .mr-md\:90 { + margin-right: 90% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:90 { + margin: 90% !important; + } + + .mx-lg\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-lg\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-lg\:90 { + margin-top: 90% !important; + } + + .mb-lg\:90 { + margin-bottom: 90% !important; + } + + .ml-lg\:90 { + margin-left: 90% !important; + } + + .mr-lg\:90 { + margin-right: 90% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:90 { + margin: 90% !important; + } + + .mx-xl\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-xl\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-xl\:90 { + margin-top: 90% !important; + } + + .mb-xl\:90 { + margin-bottom: 90% !important; + } + + .ml-xl\:90 { + margin-left: 90% !important; + } + + .mr-xl\:90 { + margin-right: 90% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:90 { + margin: 90% !important; + } + + .mx-xxl\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-xxl\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-xxl\:90 { + margin-top: 90% !important; + } + + .mb-xxl\:90 { + margin-bottom: 90% !important; + } + + .ml-xxl\:90 { + margin-left: 90% !important; + } + + .mr-xxl\:90 { + margin-right: 90% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:90 { + margin: 90% !important; + } + + .mx-sm-up\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-sm-up\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-sm-up\:90 { + margin-top: 90% !important; + } + + .mb-sm-up\:90 { + margin-bottom: 90% !important; + } + + .ml-sm-up\:90 { + margin-left: 90% !important; + } + + .mr-sm-up\:90 { + margin-right: 90% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:90 { + margin: 90% !important; + } + + .mx-md-up\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-md-up\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-md-up\:90 { + margin-top: 90% !important; + } + + .mb-md-up\:90 { + margin-bottom: 90% !important; + } + + .ml-md-up\:90 { + margin-left: 90% !important; + } + + .mr-md-up\:90 { + margin-right: 90% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:90 { + margin: 90% !important; + } + + .mx-lg-up\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-lg-up\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-lg-up\:90 { + margin-top: 90% !important; + } + + .mb-lg-up\:90 { + margin-bottom: 90% !important; + } + + .ml-lg-up\:90 { + margin-left: 90% !important; + } + + .mr-lg-up\:90 { + margin-right: 90% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:90 { + margin: 90% !important; + } + + .mx-xl-up\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-xl-up\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-xl-up\:90 { + margin-top: 90% !important; + } + + .mb-xl-up\:90 { + margin-bottom: 90% !important; + } + + .ml-xl-up\:90 { + margin-left: 90% !important; + } + + .mr-xl-up\:90 { + margin-right: 90% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:90 { + margin: 90% !important; + } + + .mx-sm-down\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-sm-down\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-sm-down\:90 { + margin-top: 90% !important; + } + + .mb-sm-down\:90 { + margin-bottom: 90% !important; + } + + .ml-sm-down\:90 { + margin-left: 90% !important; + } + + .mr-sm-down\:90 { + margin-right: 90% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:90 { + margin: 90% !important; + } + + .mx-md-down\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-md-down\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-md-down\:90 { + margin-top: 90% !important; + } + + .mb-md-down\:90 { + margin-bottom: 90% !important; + } + + .ml-md-down\:90 { + margin-left: 90% !important; + } + + .mr-md-down\:90 { + margin-right: 90% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:90 { + margin: 90% !important; + } + + .mx-lg-down\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-lg-down\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-lg-down\:90 { + margin-top: 90% !important; + } + + .mb-lg-down\:90 { + margin-bottom: 90% !important; + } + + .ml-lg-down\:90 { + margin-left: 90% !important; + } + + .mr-lg-down\:90 { + margin-right: 90% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:90 { + margin: 90% !important; + } + + .mx-xl-down\:90 { + margin-left: 90% !important; + margin-right: 90% !important; + } + + .my-xl-down\:90 { + margin-top: 90% !important; + margin-bottom: 90% !important; + } + + .mt-xl-down\:90 { + margin-top: 90% !important; + } + + .mb-xl-down\:90 { + margin-bottom: 90% !important; + } + + .ml-xl-down\:90 { + margin-left: 90% !important; + } + + .mr-xl-down\:90 { + margin-right: 90% !important; + } +} +.m\:100 { + margin: 100% !important; +} + +.mx\:100 { + margin-left: 100% !important; + margin-right: 100% !important; +} + +.my\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; +} + +.mt\:100 { + margin-top: 100% !important; +} + +.mb\:100 { + margin-bottom: 100% !important; +} + +.ml\:100 { + margin-left: 100% !important; +} + +.mr\:100 { + margin-right: 100% !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:100 { + margin: 100% !important; + } + + .mx-xs\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-xs\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-xs\:100 { + margin-top: 100% !important; + } + + .mb-xs\:100 { + margin-bottom: 100% !important; + } + + .ml-xs\:100 { + margin-left: 100% !important; + } + + .mr-xs\:100 { + margin-right: 100% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:100 { + margin: 100% !important; + } + + .mx-sm\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-sm\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-sm\:100 { + margin-top: 100% !important; + } + + .mb-sm\:100 { + margin-bottom: 100% !important; + } + + .ml-sm\:100 { + margin-left: 100% !important; + } + + .mr-sm\:100 { + margin-right: 100% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:100 { + margin: 100% !important; + } + + .mx-md\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-md\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-md\:100 { + margin-top: 100% !important; + } + + .mb-md\:100 { + margin-bottom: 100% !important; + } + + .ml-md\:100 { + margin-left: 100% !important; + } + + .mr-md\:100 { + margin-right: 100% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:100 { + margin: 100% !important; + } + + .mx-lg\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-lg\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-lg\:100 { + margin-top: 100% !important; + } + + .mb-lg\:100 { + margin-bottom: 100% !important; + } + + .ml-lg\:100 { + margin-left: 100% !important; + } + + .mr-lg\:100 { + margin-right: 100% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:100 { + margin: 100% !important; + } + + .mx-xl\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-xl\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-xl\:100 { + margin-top: 100% !important; + } + + .mb-xl\:100 { + margin-bottom: 100% !important; + } + + .ml-xl\:100 { + margin-left: 100% !important; + } + + .mr-xl\:100 { + margin-right: 100% !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:100 { + margin: 100% !important; + } + + .mx-xxl\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-xxl\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-xxl\:100 { + margin-top: 100% !important; + } + + .mb-xxl\:100 { + margin-bottom: 100% !important; + } + + .ml-xxl\:100 { + margin-left: 100% !important; + } + + .mr-xxl\:100 { + margin-right: 100% !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:100 { + margin: 100% !important; + } + + .mx-sm-up\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-sm-up\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-sm-up\:100 { + margin-top: 100% !important; + } + + .mb-sm-up\:100 { + margin-bottom: 100% !important; + } + + .ml-sm-up\:100 { + margin-left: 100% !important; + } + + .mr-sm-up\:100 { + margin-right: 100% !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:100 { + margin: 100% !important; + } + + .mx-md-up\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-md-up\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-md-up\:100 { + margin-top: 100% !important; + } + + .mb-md-up\:100 { + margin-bottom: 100% !important; + } + + .ml-md-up\:100 { + margin-left: 100% !important; + } + + .mr-md-up\:100 { + margin-right: 100% !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:100 { + margin: 100% !important; + } + + .mx-lg-up\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-lg-up\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-lg-up\:100 { + margin-top: 100% !important; + } + + .mb-lg-up\:100 { + margin-bottom: 100% !important; + } + + .ml-lg-up\:100 { + margin-left: 100% !important; + } + + .mr-lg-up\:100 { + margin-right: 100% !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:100 { + margin: 100% !important; + } + + .mx-xl-up\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-xl-up\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-xl-up\:100 { + margin-top: 100% !important; + } + + .mb-xl-up\:100 { + margin-bottom: 100% !important; + } + + .ml-xl-up\:100 { + margin-left: 100% !important; + } + + .mr-xl-up\:100 { + margin-right: 100% !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:100 { + margin: 100% !important; + } + + .mx-sm-down\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-sm-down\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-sm-down\:100 { + margin-top: 100% !important; + } + + .mb-sm-down\:100 { + margin-bottom: 100% !important; + } + + .ml-sm-down\:100 { + margin-left: 100% !important; + } + + .mr-sm-down\:100 { + margin-right: 100% !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:100 { + margin: 100% !important; + } + + .mx-md-down\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-md-down\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-md-down\:100 { + margin-top: 100% !important; + } + + .mb-md-down\:100 { + margin-bottom: 100% !important; + } + + .ml-md-down\:100 { + margin-left: 100% !important; + } + + .mr-md-down\:100 { + margin-right: 100% !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:100 { + margin: 100% !important; + } + + .mx-lg-down\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-lg-down\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-lg-down\:100 { + margin-top: 100% !important; + } + + .mb-lg-down\:100 { + margin-bottom: 100% !important; + } + + .ml-lg-down\:100 { + margin-left: 100% !important; + } + + .mr-lg-down\:100 { + margin-right: 100% !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:100 { + margin: 100% !important; + } + + .mx-xl-down\:100 { + margin-left: 100% !important; + margin-right: 100% !important; + } + + .my-xl-down\:100 { + margin-top: 100% !important; + margin-bottom: 100% !important; + } + + .mt-xl-down\:100 { + margin-top: 100% !important; + } + + .mb-xl-down\:100 { + margin-bottom: 100% !important; + } + + .ml-xl-down\:100 { + margin-left: 100% !important; + } + + .mr-xl-down\:100 { + margin-right: 100% !important; + } +} +.m\:10vh { + margin: 10vh !important; +} + +.mx\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; +} + +.my\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; +} + +.mt\:10vh { + margin-top: 10vh !important; +} + +.mb\:10vh { + margin-bottom: 10vh !important; +} + +.ml\:10vh { + margin-left: 10vh !important; +} + +.mr\:10vh { + margin-right: 10vh !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:10vh { + margin: 10vh !important; + } + + .mx-xs\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-xs\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-xs\:10vh { + margin-top: 10vh !important; + } + + .mb-xs\:10vh { + margin-bottom: 10vh !important; + } + + .ml-xs\:10vh { + margin-left: 10vh !important; + } + + .mr-xs\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:10vh { + margin: 10vh !important; + } + + .mx-sm\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-sm\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-sm\:10vh { + margin-top: 10vh !important; + } + + .mb-sm\:10vh { + margin-bottom: 10vh !important; + } + + .ml-sm\:10vh { + margin-left: 10vh !important; + } + + .mr-sm\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:10vh { + margin: 10vh !important; + } + + .mx-md\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-md\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-md\:10vh { + margin-top: 10vh !important; + } + + .mb-md\:10vh { + margin-bottom: 10vh !important; + } + + .ml-md\:10vh { + margin-left: 10vh !important; + } + + .mr-md\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:10vh { + margin: 10vh !important; + } + + .mx-lg\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-lg\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-lg\:10vh { + margin-top: 10vh !important; + } + + .mb-lg\:10vh { + margin-bottom: 10vh !important; + } + + .ml-lg\:10vh { + margin-left: 10vh !important; + } + + .mr-lg\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:10vh { + margin: 10vh !important; + } + + .mx-xl\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-xl\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-xl\:10vh { + margin-top: 10vh !important; + } + + .mb-xl\:10vh { + margin-bottom: 10vh !important; + } + + .ml-xl\:10vh { + margin-left: 10vh !important; + } + + .mr-xl\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:10vh { + margin: 10vh !important; + } + + .mx-xxl\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-xxl\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-xxl\:10vh { + margin-top: 10vh !important; + } + + .mb-xxl\:10vh { + margin-bottom: 10vh !important; + } + + .ml-xxl\:10vh { + margin-left: 10vh !important; + } + + .mr-xxl\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:10vh { + margin: 10vh !important; + } + + .mx-sm-up\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-sm-up\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-sm-up\:10vh { + margin-top: 10vh !important; + } + + .mb-sm-up\:10vh { + margin-bottom: 10vh !important; + } + + .ml-sm-up\:10vh { + margin-left: 10vh !important; + } + + .mr-sm-up\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:10vh { + margin: 10vh !important; + } + + .mx-md-up\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-md-up\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-md-up\:10vh { + margin-top: 10vh !important; + } + + .mb-md-up\:10vh { + margin-bottom: 10vh !important; + } + + .ml-md-up\:10vh { + margin-left: 10vh !important; + } + + .mr-md-up\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:10vh { + margin: 10vh !important; + } + + .mx-lg-up\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-lg-up\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-lg-up\:10vh { + margin-top: 10vh !important; + } + + .mb-lg-up\:10vh { + margin-bottom: 10vh !important; + } + + .ml-lg-up\:10vh { + margin-left: 10vh !important; + } + + .mr-lg-up\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:10vh { + margin: 10vh !important; + } + + .mx-xl-up\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-xl-up\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-xl-up\:10vh { + margin-top: 10vh !important; + } + + .mb-xl-up\:10vh { + margin-bottom: 10vh !important; + } + + .ml-xl-up\:10vh { + margin-left: 10vh !important; + } + + .mr-xl-up\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:10vh { + margin: 10vh !important; + } + + .mx-sm-down\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-sm-down\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-sm-down\:10vh { + margin-top: 10vh !important; + } + + .mb-sm-down\:10vh { + margin-bottom: 10vh !important; + } + + .ml-sm-down\:10vh { + margin-left: 10vh !important; + } + + .mr-sm-down\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:10vh { + margin: 10vh !important; + } + + .mx-md-down\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-md-down\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-md-down\:10vh { + margin-top: 10vh !important; + } + + .mb-md-down\:10vh { + margin-bottom: 10vh !important; + } + + .ml-md-down\:10vh { + margin-left: 10vh !important; + } + + .mr-md-down\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:10vh { + margin: 10vh !important; + } + + .mx-lg-down\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-lg-down\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-lg-down\:10vh { + margin-top: 10vh !important; + } + + .mb-lg-down\:10vh { + margin-bottom: 10vh !important; + } + + .ml-lg-down\:10vh { + margin-left: 10vh !important; + } + + .mr-lg-down\:10vh { + margin-right: 10vh !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:10vh { + margin: 10vh !important; + } + + .mx-xl-down\:10vh { + margin-left: 10vh !important; + margin-right: 10vh !important; + } + + .my-xl-down\:10vh { + margin-top: 10vh !important; + margin-bottom: 10vh !important; + } + + .mt-xl-down\:10vh { + margin-top: 10vh !important; + } + + .mb-xl-down\:10vh { + margin-bottom: 10vh !important; + } + + .ml-xl-down\:10vh { + margin-left: 10vh !important; + } + + .mr-xl-down\:10vh { + margin-right: 10vh !important; + } +} +.m\:25vh { + margin: 25vh !important; +} + +.mx\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; +} + +.my\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; +} + +.mt\:25vh { + margin-top: 25vh !important; +} + +.mb\:25vh { + margin-bottom: 25vh !important; +} + +.ml\:25vh { + margin-left: 25vh !important; +} + +.mr\:25vh { + margin-right: 25vh !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:25vh { + margin: 25vh !important; + } + + .mx-xs\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-xs\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-xs\:25vh { + margin-top: 25vh !important; + } + + .mb-xs\:25vh { + margin-bottom: 25vh !important; + } + + .ml-xs\:25vh { + margin-left: 25vh !important; + } + + .mr-xs\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:25vh { + margin: 25vh !important; + } + + .mx-sm\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-sm\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-sm\:25vh { + margin-top: 25vh !important; + } + + .mb-sm\:25vh { + margin-bottom: 25vh !important; + } + + .ml-sm\:25vh { + margin-left: 25vh !important; + } + + .mr-sm\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:25vh { + margin: 25vh !important; + } + + .mx-md\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-md\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-md\:25vh { + margin-top: 25vh !important; + } + + .mb-md\:25vh { + margin-bottom: 25vh !important; + } + + .ml-md\:25vh { + margin-left: 25vh !important; + } + + .mr-md\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:25vh { + margin: 25vh !important; + } + + .mx-lg\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-lg\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-lg\:25vh { + margin-top: 25vh !important; + } + + .mb-lg\:25vh { + margin-bottom: 25vh !important; + } + + .ml-lg\:25vh { + margin-left: 25vh !important; + } + + .mr-lg\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:25vh { + margin: 25vh !important; + } + + .mx-xl\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-xl\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-xl\:25vh { + margin-top: 25vh !important; + } + + .mb-xl\:25vh { + margin-bottom: 25vh !important; + } + + .ml-xl\:25vh { + margin-left: 25vh !important; + } + + .mr-xl\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:25vh { + margin: 25vh !important; + } + + .mx-xxl\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-xxl\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-xxl\:25vh { + margin-top: 25vh !important; + } + + .mb-xxl\:25vh { + margin-bottom: 25vh !important; + } + + .ml-xxl\:25vh { + margin-left: 25vh !important; + } + + .mr-xxl\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:25vh { + margin: 25vh !important; + } + + .mx-sm-up\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-sm-up\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-sm-up\:25vh { + margin-top: 25vh !important; + } + + .mb-sm-up\:25vh { + margin-bottom: 25vh !important; + } + + .ml-sm-up\:25vh { + margin-left: 25vh !important; + } + + .mr-sm-up\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:25vh { + margin: 25vh !important; + } + + .mx-md-up\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-md-up\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-md-up\:25vh { + margin-top: 25vh !important; + } + + .mb-md-up\:25vh { + margin-bottom: 25vh !important; + } + + .ml-md-up\:25vh { + margin-left: 25vh !important; + } + + .mr-md-up\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:25vh { + margin: 25vh !important; + } + + .mx-lg-up\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-lg-up\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-lg-up\:25vh { + margin-top: 25vh !important; + } + + .mb-lg-up\:25vh { + margin-bottom: 25vh !important; + } + + .ml-lg-up\:25vh { + margin-left: 25vh !important; + } + + .mr-lg-up\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:25vh { + margin: 25vh !important; + } + + .mx-xl-up\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-xl-up\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-xl-up\:25vh { + margin-top: 25vh !important; + } + + .mb-xl-up\:25vh { + margin-bottom: 25vh !important; + } + + .ml-xl-up\:25vh { + margin-left: 25vh !important; + } + + .mr-xl-up\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:25vh { + margin: 25vh !important; + } + + .mx-sm-down\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-sm-down\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-sm-down\:25vh { + margin-top: 25vh !important; + } + + .mb-sm-down\:25vh { + margin-bottom: 25vh !important; + } + + .ml-sm-down\:25vh { + margin-left: 25vh !important; + } + + .mr-sm-down\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:25vh { + margin: 25vh !important; + } + + .mx-md-down\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-md-down\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-md-down\:25vh { + margin-top: 25vh !important; + } + + .mb-md-down\:25vh { + margin-bottom: 25vh !important; + } + + .ml-md-down\:25vh { + margin-left: 25vh !important; + } + + .mr-md-down\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:25vh { + margin: 25vh !important; + } + + .mx-lg-down\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-lg-down\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-lg-down\:25vh { + margin-top: 25vh !important; + } + + .mb-lg-down\:25vh { + margin-bottom: 25vh !important; + } + + .ml-lg-down\:25vh { + margin-left: 25vh !important; + } + + .mr-lg-down\:25vh { + margin-right: 25vh !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:25vh { + margin: 25vh !important; + } + + .mx-xl-down\:25vh { + margin-left: 25vh !important; + margin-right: 25vh !important; + } + + .my-xl-down\:25vh { + margin-top: 25vh !important; + margin-bottom: 25vh !important; + } + + .mt-xl-down\:25vh { + margin-top: 25vh !important; + } + + .mb-xl-down\:25vh { + margin-bottom: 25vh !important; + } + + .ml-xl-down\:25vh { + margin-left: 25vh !important; + } + + .mr-xl-down\:25vh { + margin-right: 25vh !important; + } +} +.m\:50vh { + margin: 50vh !important; +} + +.mx\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; +} + +.my\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; +} + +.mt\:50vh { + margin-top: 50vh !important; +} + +.mb\:50vh { + margin-bottom: 50vh !important; +} + +.ml\:50vh { + margin-left: 50vh !important; +} + +.mr\:50vh { + margin-right: 50vh !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:50vh { + margin: 50vh !important; + } + + .mx-xs\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-xs\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-xs\:50vh { + margin-top: 50vh !important; + } + + .mb-xs\:50vh { + margin-bottom: 50vh !important; + } + + .ml-xs\:50vh { + margin-left: 50vh !important; + } + + .mr-xs\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:50vh { + margin: 50vh !important; + } + + .mx-sm\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-sm\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-sm\:50vh { + margin-top: 50vh !important; + } + + .mb-sm\:50vh { + margin-bottom: 50vh !important; + } + + .ml-sm\:50vh { + margin-left: 50vh !important; + } + + .mr-sm\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:50vh { + margin: 50vh !important; + } + + .mx-md\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-md\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-md\:50vh { + margin-top: 50vh !important; + } + + .mb-md\:50vh { + margin-bottom: 50vh !important; + } + + .ml-md\:50vh { + margin-left: 50vh !important; + } + + .mr-md\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:50vh { + margin: 50vh !important; + } + + .mx-lg\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-lg\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-lg\:50vh { + margin-top: 50vh !important; + } + + .mb-lg\:50vh { + margin-bottom: 50vh !important; + } + + .ml-lg\:50vh { + margin-left: 50vh !important; + } + + .mr-lg\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:50vh { + margin: 50vh !important; + } + + .mx-xl\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-xl\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-xl\:50vh { + margin-top: 50vh !important; + } + + .mb-xl\:50vh { + margin-bottom: 50vh !important; + } + + .ml-xl\:50vh { + margin-left: 50vh !important; + } + + .mr-xl\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:50vh { + margin: 50vh !important; + } + + .mx-xxl\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-xxl\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-xxl\:50vh { + margin-top: 50vh !important; + } + + .mb-xxl\:50vh { + margin-bottom: 50vh !important; + } + + .ml-xxl\:50vh { + margin-left: 50vh !important; + } + + .mr-xxl\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:50vh { + margin: 50vh !important; + } + + .mx-sm-up\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-sm-up\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-sm-up\:50vh { + margin-top: 50vh !important; + } + + .mb-sm-up\:50vh { + margin-bottom: 50vh !important; + } + + .ml-sm-up\:50vh { + margin-left: 50vh !important; + } + + .mr-sm-up\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:50vh { + margin: 50vh !important; + } + + .mx-md-up\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-md-up\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-md-up\:50vh { + margin-top: 50vh !important; + } + + .mb-md-up\:50vh { + margin-bottom: 50vh !important; + } + + .ml-md-up\:50vh { + margin-left: 50vh !important; + } + + .mr-md-up\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:50vh { + margin: 50vh !important; + } + + .mx-lg-up\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-lg-up\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-lg-up\:50vh { + margin-top: 50vh !important; + } + + .mb-lg-up\:50vh { + margin-bottom: 50vh !important; + } + + .ml-lg-up\:50vh { + margin-left: 50vh !important; + } + + .mr-lg-up\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:50vh { + margin: 50vh !important; + } + + .mx-xl-up\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-xl-up\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-xl-up\:50vh { + margin-top: 50vh !important; + } + + .mb-xl-up\:50vh { + margin-bottom: 50vh !important; + } + + .ml-xl-up\:50vh { + margin-left: 50vh !important; + } + + .mr-xl-up\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:50vh { + margin: 50vh !important; + } + + .mx-sm-down\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-sm-down\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-sm-down\:50vh { + margin-top: 50vh !important; + } + + .mb-sm-down\:50vh { + margin-bottom: 50vh !important; + } + + .ml-sm-down\:50vh { + margin-left: 50vh !important; + } + + .mr-sm-down\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:50vh { + margin: 50vh !important; + } + + .mx-md-down\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-md-down\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-md-down\:50vh { + margin-top: 50vh !important; + } + + .mb-md-down\:50vh { + margin-bottom: 50vh !important; + } + + .ml-md-down\:50vh { + margin-left: 50vh !important; + } + + .mr-md-down\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:50vh { + margin: 50vh !important; + } + + .mx-lg-down\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-lg-down\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-lg-down\:50vh { + margin-top: 50vh !important; + } + + .mb-lg-down\:50vh { + margin-bottom: 50vh !important; + } + + .ml-lg-down\:50vh { + margin-left: 50vh !important; + } + + .mr-lg-down\:50vh { + margin-right: 50vh !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:50vh { + margin: 50vh !important; + } + + .mx-xl-down\:50vh { + margin-left: 50vh !important; + margin-right: 50vh !important; + } + + .my-xl-down\:50vh { + margin-top: 50vh !important; + margin-bottom: 50vh !important; + } + + .mt-xl-down\:50vh { + margin-top: 50vh !important; + } + + .mb-xl-down\:50vh { + margin-bottom: 50vh !important; + } + + .ml-xl-down\:50vh { + margin-left: 50vh !important; + } + + .mr-xl-down\:50vh { + margin-right: 50vh !important; + } +} +.m\:75vh { + margin: 75vh !important; +} + +.mx\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; +} + +.my\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; +} + +.mt\:75vh { + margin-top: 75vh !important; +} + +.mb\:75vh { + margin-bottom: 75vh !important; +} + +.ml\:75vh { + margin-left: 75vh !important; +} + +.mr\:75vh { + margin-right: 75vh !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:75vh { + margin: 75vh !important; + } + + .mx-xs\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-xs\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-xs\:75vh { + margin-top: 75vh !important; + } + + .mb-xs\:75vh { + margin-bottom: 75vh !important; + } + + .ml-xs\:75vh { + margin-left: 75vh !important; + } + + .mr-xs\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:75vh { + margin: 75vh !important; + } + + .mx-sm\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-sm\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-sm\:75vh { + margin-top: 75vh !important; + } + + .mb-sm\:75vh { + margin-bottom: 75vh !important; + } + + .ml-sm\:75vh { + margin-left: 75vh !important; + } + + .mr-sm\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:75vh { + margin: 75vh !important; + } + + .mx-md\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-md\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-md\:75vh { + margin-top: 75vh !important; + } + + .mb-md\:75vh { + margin-bottom: 75vh !important; + } + + .ml-md\:75vh { + margin-left: 75vh !important; + } + + .mr-md\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:75vh { + margin: 75vh !important; + } + + .mx-lg\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-lg\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-lg\:75vh { + margin-top: 75vh !important; + } + + .mb-lg\:75vh { + margin-bottom: 75vh !important; + } + + .ml-lg\:75vh { + margin-left: 75vh !important; + } + + .mr-lg\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:75vh { + margin: 75vh !important; + } + + .mx-xl\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-xl\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-xl\:75vh { + margin-top: 75vh !important; + } + + .mb-xl\:75vh { + margin-bottom: 75vh !important; + } + + .ml-xl\:75vh { + margin-left: 75vh !important; + } + + .mr-xl\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:75vh { + margin: 75vh !important; + } + + .mx-xxl\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-xxl\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-xxl\:75vh { + margin-top: 75vh !important; + } + + .mb-xxl\:75vh { + margin-bottom: 75vh !important; + } + + .ml-xxl\:75vh { + margin-left: 75vh !important; + } + + .mr-xxl\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:75vh { + margin: 75vh !important; + } + + .mx-sm-up\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-sm-up\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-sm-up\:75vh { + margin-top: 75vh !important; + } + + .mb-sm-up\:75vh { + margin-bottom: 75vh !important; + } + + .ml-sm-up\:75vh { + margin-left: 75vh !important; + } + + .mr-sm-up\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:75vh { + margin: 75vh !important; + } + + .mx-md-up\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-md-up\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-md-up\:75vh { + margin-top: 75vh !important; + } + + .mb-md-up\:75vh { + margin-bottom: 75vh !important; + } + + .ml-md-up\:75vh { + margin-left: 75vh !important; + } + + .mr-md-up\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:75vh { + margin: 75vh !important; + } + + .mx-lg-up\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-lg-up\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-lg-up\:75vh { + margin-top: 75vh !important; + } + + .mb-lg-up\:75vh { + margin-bottom: 75vh !important; + } + + .ml-lg-up\:75vh { + margin-left: 75vh !important; + } + + .mr-lg-up\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:75vh { + margin: 75vh !important; + } + + .mx-xl-up\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-xl-up\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-xl-up\:75vh { + margin-top: 75vh !important; + } + + .mb-xl-up\:75vh { + margin-bottom: 75vh !important; + } + + .ml-xl-up\:75vh { + margin-left: 75vh !important; + } + + .mr-xl-up\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:75vh { + margin: 75vh !important; + } + + .mx-sm-down\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-sm-down\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-sm-down\:75vh { + margin-top: 75vh !important; + } + + .mb-sm-down\:75vh { + margin-bottom: 75vh !important; + } + + .ml-sm-down\:75vh { + margin-left: 75vh !important; + } + + .mr-sm-down\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:75vh { + margin: 75vh !important; + } + + .mx-md-down\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-md-down\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-md-down\:75vh { + margin-top: 75vh !important; + } + + .mb-md-down\:75vh { + margin-bottom: 75vh !important; + } + + .ml-md-down\:75vh { + margin-left: 75vh !important; + } + + .mr-md-down\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:75vh { + margin: 75vh !important; + } + + .mx-lg-down\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-lg-down\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-lg-down\:75vh { + margin-top: 75vh !important; + } + + .mb-lg-down\:75vh { + margin-bottom: 75vh !important; + } + + .ml-lg-down\:75vh { + margin-left: 75vh !important; + } + + .mr-lg-down\:75vh { + margin-right: 75vh !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:75vh { + margin: 75vh !important; + } + + .mx-xl-down\:75vh { + margin-left: 75vh !important; + margin-right: 75vh !important; + } + + .my-xl-down\:75vh { + margin-top: 75vh !important; + margin-bottom: 75vh !important; + } + + .mt-xl-down\:75vh { + margin-top: 75vh !important; + } + + .mb-xl-down\:75vh { + margin-bottom: 75vh !important; + } + + .ml-xl-down\:75vh { + margin-left: 75vh !important; + } + + .mr-xl-down\:75vh { + margin-right: 75vh !important; + } +} +.m\:100vh { + margin: 100vh !important; +} + +.mx\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; +} + +.my\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; +} + +.mt\:100vh { + margin-top: 100vh !important; +} + +.mb\:100vh { + margin-bottom: 100vh !important; +} + +.ml\:100vh { + margin-left: 100vh !important; +} + +.mr\:100vh { + margin-right: 100vh !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:100vh { + margin: 100vh !important; + } + + .mx-xs\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-xs\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-xs\:100vh { + margin-top: 100vh !important; + } + + .mb-xs\:100vh { + margin-bottom: 100vh !important; + } + + .ml-xs\:100vh { + margin-left: 100vh !important; + } + + .mr-xs\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:100vh { + margin: 100vh !important; + } + + .mx-sm\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-sm\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-sm\:100vh { + margin-top: 100vh !important; + } + + .mb-sm\:100vh { + margin-bottom: 100vh !important; + } + + .ml-sm\:100vh { + margin-left: 100vh !important; + } + + .mr-sm\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:100vh { + margin: 100vh !important; + } + + .mx-md\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-md\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-md\:100vh { + margin-top: 100vh !important; + } + + .mb-md\:100vh { + margin-bottom: 100vh !important; + } + + .ml-md\:100vh { + margin-left: 100vh !important; + } + + .mr-md\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:100vh { + margin: 100vh !important; + } + + .mx-lg\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-lg\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-lg\:100vh { + margin-top: 100vh !important; + } + + .mb-lg\:100vh { + margin-bottom: 100vh !important; + } + + .ml-lg\:100vh { + margin-left: 100vh !important; + } + + .mr-lg\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:100vh { + margin: 100vh !important; + } + + .mx-xl\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-xl\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-xl\:100vh { + margin-top: 100vh !important; + } + + .mb-xl\:100vh { + margin-bottom: 100vh !important; + } + + .ml-xl\:100vh { + margin-left: 100vh !important; + } + + .mr-xl\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:100vh { + margin: 100vh !important; + } + + .mx-xxl\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-xxl\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-xxl\:100vh { + margin-top: 100vh !important; + } + + .mb-xxl\:100vh { + margin-bottom: 100vh !important; + } + + .ml-xxl\:100vh { + margin-left: 100vh !important; + } + + .mr-xxl\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:100vh { + margin: 100vh !important; + } + + .mx-sm-up\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-sm-up\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-sm-up\:100vh { + margin-top: 100vh !important; + } + + .mb-sm-up\:100vh { + margin-bottom: 100vh !important; + } + + .ml-sm-up\:100vh { + margin-left: 100vh !important; + } + + .mr-sm-up\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:100vh { + margin: 100vh !important; + } + + .mx-md-up\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-md-up\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-md-up\:100vh { + margin-top: 100vh !important; + } + + .mb-md-up\:100vh { + margin-bottom: 100vh !important; + } + + .ml-md-up\:100vh { + margin-left: 100vh !important; + } + + .mr-md-up\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:100vh { + margin: 100vh !important; + } + + .mx-lg-up\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-lg-up\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-lg-up\:100vh { + margin-top: 100vh !important; + } + + .mb-lg-up\:100vh { + margin-bottom: 100vh !important; + } + + .ml-lg-up\:100vh { + margin-left: 100vh !important; + } + + .mr-lg-up\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:100vh { + margin: 100vh !important; + } + + .mx-xl-up\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-xl-up\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-xl-up\:100vh { + margin-top: 100vh !important; + } + + .mb-xl-up\:100vh { + margin-bottom: 100vh !important; + } + + .ml-xl-up\:100vh { + margin-left: 100vh !important; + } + + .mr-xl-up\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:100vh { + margin: 100vh !important; + } + + .mx-sm-down\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-sm-down\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-sm-down\:100vh { + margin-top: 100vh !important; + } + + .mb-sm-down\:100vh { + margin-bottom: 100vh !important; + } + + .ml-sm-down\:100vh { + margin-left: 100vh !important; + } + + .mr-sm-down\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:100vh { + margin: 100vh !important; + } + + .mx-md-down\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-md-down\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-md-down\:100vh { + margin-top: 100vh !important; + } + + .mb-md-down\:100vh { + margin-bottom: 100vh !important; + } + + .ml-md-down\:100vh { + margin-left: 100vh !important; + } + + .mr-md-down\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:100vh { + margin: 100vh !important; + } + + .mx-lg-down\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-lg-down\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-lg-down\:100vh { + margin-top: 100vh !important; + } + + .mb-lg-down\:100vh { + margin-bottom: 100vh !important; + } + + .ml-lg-down\:100vh { + margin-left: 100vh !important; + } + + .mr-lg-down\:100vh { + margin-right: 100vh !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:100vh { + margin: 100vh !important; + } + + .mx-xl-down\:100vh { + margin-left: 100vh !important; + margin-right: 100vh !important; + } + + .my-xl-down\:100vh { + margin-top: 100vh !important; + margin-bottom: 100vh !important; + } + + .mt-xl-down\:100vh { + margin-top: 100vh !important; + } + + .mb-xl-down\:100vh { + margin-bottom: 100vh !important; + } + + .ml-xl-down\:100vh { + margin-left: 100vh !important; + } + + .mr-xl-down\:100vh { + margin-right: 100vh !important; + } +} +.m\:10vw { + margin: 10vw !important; +} + +.mx\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; +} + +.my\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; +} + +.mt\:10vw { + margin-top: 10vw !important; +} + +.mb\:10vw { + margin-bottom: 10vw !important; +} + +.ml\:10vw { + margin-left: 10vw !important; +} + +.mr\:10vw { + margin-right: 10vw !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:10vw { + margin: 10vw !important; + } + + .mx-xs\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-xs\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-xs\:10vw { + margin-top: 10vw !important; + } + + .mb-xs\:10vw { + margin-bottom: 10vw !important; + } + + .ml-xs\:10vw { + margin-left: 10vw !important; + } + + .mr-xs\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:10vw { + margin: 10vw !important; + } + + .mx-sm\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-sm\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-sm\:10vw { + margin-top: 10vw !important; + } + + .mb-sm\:10vw { + margin-bottom: 10vw !important; + } + + .ml-sm\:10vw { + margin-left: 10vw !important; + } + + .mr-sm\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:10vw { + margin: 10vw !important; + } + + .mx-md\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-md\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-md\:10vw { + margin-top: 10vw !important; + } + + .mb-md\:10vw { + margin-bottom: 10vw !important; + } + + .ml-md\:10vw { + margin-left: 10vw !important; + } + + .mr-md\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:10vw { + margin: 10vw !important; + } + + .mx-lg\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-lg\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-lg\:10vw { + margin-top: 10vw !important; + } + + .mb-lg\:10vw { + margin-bottom: 10vw !important; + } + + .ml-lg\:10vw { + margin-left: 10vw !important; + } + + .mr-lg\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:10vw { + margin: 10vw !important; + } + + .mx-xl\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-xl\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-xl\:10vw { + margin-top: 10vw !important; + } + + .mb-xl\:10vw { + margin-bottom: 10vw !important; + } + + .ml-xl\:10vw { + margin-left: 10vw !important; + } + + .mr-xl\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:10vw { + margin: 10vw !important; + } + + .mx-xxl\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-xxl\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-xxl\:10vw { + margin-top: 10vw !important; + } + + .mb-xxl\:10vw { + margin-bottom: 10vw !important; + } + + .ml-xxl\:10vw { + margin-left: 10vw !important; + } + + .mr-xxl\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:10vw { + margin: 10vw !important; + } + + .mx-sm-up\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-sm-up\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-sm-up\:10vw { + margin-top: 10vw !important; + } + + .mb-sm-up\:10vw { + margin-bottom: 10vw !important; + } + + .ml-sm-up\:10vw { + margin-left: 10vw !important; + } + + .mr-sm-up\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:10vw { + margin: 10vw !important; + } + + .mx-md-up\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-md-up\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-md-up\:10vw { + margin-top: 10vw !important; + } + + .mb-md-up\:10vw { + margin-bottom: 10vw !important; + } + + .ml-md-up\:10vw { + margin-left: 10vw !important; + } + + .mr-md-up\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:10vw { + margin: 10vw !important; + } + + .mx-lg-up\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-lg-up\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-lg-up\:10vw { + margin-top: 10vw !important; + } + + .mb-lg-up\:10vw { + margin-bottom: 10vw !important; + } + + .ml-lg-up\:10vw { + margin-left: 10vw !important; + } + + .mr-lg-up\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:10vw { + margin: 10vw !important; + } + + .mx-xl-up\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-xl-up\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-xl-up\:10vw { + margin-top: 10vw !important; + } + + .mb-xl-up\:10vw { + margin-bottom: 10vw !important; + } + + .ml-xl-up\:10vw { + margin-left: 10vw !important; + } + + .mr-xl-up\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:10vw { + margin: 10vw !important; + } + + .mx-sm-down\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-sm-down\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-sm-down\:10vw { + margin-top: 10vw !important; + } + + .mb-sm-down\:10vw { + margin-bottom: 10vw !important; + } + + .ml-sm-down\:10vw { + margin-left: 10vw !important; + } + + .mr-sm-down\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:10vw { + margin: 10vw !important; + } + + .mx-md-down\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-md-down\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-md-down\:10vw { + margin-top: 10vw !important; + } + + .mb-md-down\:10vw { + margin-bottom: 10vw !important; + } + + .ml-md-down\:10vw { + margin-left: 10vw !important; + } + + .mr-md-down\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:10vw { + margin: 10vw !important; + } + + .mx-lg-down\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-lg-down\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-lg-down\:10vw { + margin-top: 10vw !important; + } + + .mb-lg-down\:10vw { + margin-bottom: 10vw !important; + } + + .ml-lg-down\:10vw { + margin-left: 10vw !important; + } + + .mr-lg-down\:10vw { + margin-right: 10vw !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:10vw { + margin: 10vw !important; + } + + .mx-xl-down\:10vw { + margin-left: 10vw !important; + margin-right: 10vw !important; + } + + .my-xl-down\:10vw { + margin-top: 10vw !important; + margin-bottom: 10vw !important; + } + + .mt-xl-down\:10vw { + margin-top: 10vw !important; + } + + .mb-xl-down\:10vw { + margin-bottom: 10vw !important; + } + + .ml-xl-down\:10vw { + margin-left: 10vw !important; + } + + .mr-xl-down\:10vw { + margin-right: 10vw !important; + } +} +.m\:25vw { + margin: 25vw !important; +} + +.mx\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; +} + +.my\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; +} + +.mt\:25vw { + margin-top: 25vw !important; +} + +.mb\:25vw { + margin-bottom: 25vw !important; +} + +.ml\:25vw { + margin-left: 25vw !important; +} + +.mr\:25vw { + margin-right: 25vw !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:25vw { + margin: 25vw !important; + } + + .mx-xs\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-xs\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-xs\:25vw { + margin-top: 25vw !important; + } + + .mb-xs\:25vw { + margin-bottom: 25vw !important; + } + + .ml-xs\:25vw { + margin-left: 25vw !important; + } + + .mr-xs\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:25vw { + margin: 25vw !important; + } + + .mx-sm\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-sm\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-sm\:25vw { + margin-top: 25vw !important; + } + + .mb-sm\:25vw { + margin-bottom: 25vw !important; + } + + .ml-sm\:25vw { + margin-left: 25vw !important; + } + + .mr-sm\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:25vw { + margin: 25vw !important; + } + + .mx-md\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-md\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-md\:25vw { + margin-top: 25vw !important; + } + + .mb-md\:25vw { + margin-bottom: 25vw !important; + } + + .ml-md\:25vw { + margin-left: 25vw !important; + } + + .mr-md\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:25vw { + margin: 25vw !important; + } + + .mx-lg\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-lg\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-lg\:25vw { + margin-top: 25vw !important; + } + + .mb-lg\:25vw { + margin-bottom: 25vw !important; + } + + .ml-lg\:25vw { + margin-left: 25vw !important; + } + + .mr-lg\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:25vw { + margin: 25vw !important; + } + + .mx-xl\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-xl\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-xl\:25vw { + margin-top: 25vw !important; + } + + .mb-xl\:25vw { + margin-bottom: 25vw !important; + } + + .ml-xl\:25vw { + margin-left: 25vw !important; + } + + .mr-xl\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:25vw { + margin: 25vw !important; + } + + .mx-xxl\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-xxl\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-xxl\:25vw { + margin-top: 25vw !important; + } + + .mb-xxl\:25vw { + margin-bottom: 25vw !important; + } + + .ml-xxl\:25vw { + margin-left: 25vw !important; + } + + .mr-xxl\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:25vw { + margin: 25vw !important; + } + + .mx-sm-up\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-sm-up\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-sm-up\:25vw { + margin-top: 25vw !important; + } + + .mb-sm-up\:25vw { + margin-bottom: 25vw !important; + } + + .ml-sm-up\:25vw { + margin-left: 25vw !important; + } + + .mr-sm-up\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:25vw { + margin: 25vw !important; + } + + .mx-md-up\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-md-up\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-md-up\:25vw { + margin-top: 25vw !important; + } + + .mb-md-up\:25vw { + margin-bottom: 25vw !important; + } + + .ml-md-up\:25vw { + margin-left: 25vw !important; + } + + .mr-md-up\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:25vw { + margin: 25vw !important; + } + + .mx-lg-up\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-lg-up\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-lg-up\:25vw { + margin-top: 25vw !important; + } + + .mb-lg-up\:25vw { + margin-bottom: 25vw !important; + } + + .ml-lg-up\:25vw { + margin-left: 25vw !important; + } + + .mr-lg-up\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:25vw { + margin: 25vw !important; + } + + .mx-xl-up\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-xl-up\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-xl-up\:25vw { + margin-top: 25vw !important; + } + + .mb-xl-up\:25vw { + margin-bottom: 25vw !important; + } + + .ml-xl-up\:25vw { + margin-left: 25vw !important; + } + + .mr-xl-up\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:25vw { + margin: 25vw !important; + } + + .mx-sm-down\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-sm-down\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-sm-down\:25vw { + margin-top: 25vw !important; + } + + .mb-sm-down\:25vw { + margin-bottom: 25vw !important; + } + + .ml-sm-down\:25vw { + margin-left: 25vw !important; + } + + .mr-sm-down\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:25vw { + margin: 25vw !important; + } + + .mx-md-down\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-md-down\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-md-down\:25vw { + margin-top: 25vw !important; + } + + .mb-md-down\:25vw { + margin-bottom: 25vw !important; + } + + .ml-md-down\:25vw { + margin-left: 25vw !important; + } + + .mr-md-down\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:25vw { + margin: 25vw !important; + } + + .mx-lg-down\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-lg-down\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-lg-down\:25vw { + margin-top: 25vw !important; + } + + .mb-lg-down\:25vw { + margin-bottom: 25vw !important; + } + + .ml-lg-down\:25vw { + margin-left: 25vw !important; + } + + .mr-lg-down\:25vw { + margin-right: 25vw !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:25vw { + margin: 25vw !important; + } + + .mx-xl-down\:25vw { + margin-left: 25vw !important; + margin-right: 25vw !important; + } + + .my-xl-down\:25vw { + margin-top: 25vw !important; + margin-bottom: 25vw !important; + } + + .mt-xl-down\:25vw { + margin-top: 25vw !important; + } + + .mb-xl-down\:25vw { + margin-bottom: 25vw !important; + } + + .ml-xl-down\:25vw { + margin-left: 25vw !important; + } + + .mr-xl-down\:25vw { + margin-right: 25vw !important; + } +} +.m\:50vw { + margin: 50vw !important; +} + +.mx\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; +} + +.my\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; +} + +.mt\:50vw { + margin-top: 50vw !important; +} + +.mb\:50vw { + margin-bottom: 50vw !important; +} + +.ml\:50vw { + margin-left: 50vw !important; +} + +.mr\:50vw { + margin-right: 50vw !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:50vw { + margin: 50vw !important; + } + + .mx-xs\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-xs\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-xs\:50vw { + margin-top: 50vw !important; + } + + .mb-xs\:50vw { + margin-bottom: 50vw !important; + } + + .ml-xs\:50vw { + margin-left: 50vw !important; + } + + .mr-xs\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:50vw { + margin: 50vw !important; + } + + .mx-sm\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-sm\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-sm\:50vw { + margin-top: 50vw !important; + } + + .mb-sm\:50vw { + margin-bottom: 50vw !important; + } + + .ml-sm\:50vw { + margin-left: 50vw !important; + } + + .mr-sm\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:50vw { + margin: 50vw !important; + } + + .mx-md\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-md\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-md\:50vw { + margin-top: 50vw !important; + } + + .mb-md\:50vw { + margin-bottom: 50vw !important; + } + + .ml-md\:50vw { + margin-left: 50vw !important; + } + + .mr-md\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:50vw { + margin: 50vw !important; + } + + .mx-lg\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-lg\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-lg\:50vw { + margin-top: 50vw !important; + } + + .mb-lg\:50vw { + margin-bottom: 50vw !important; + } + + .ml-lg\:50vw { + margin-left: 50vw !important; + } + + .mr-lg\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:50vw { + margin: 50vw !important; + } + + .mx-xl\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-xl\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-xl\:50vw { + margin-top: 50vw !important; + } + + .mb-xl\:50vw { + margin-bottom: 50vw !important; + } + + .ml-xl\:50vw { + margin-left: 50vw !important; + } + + .mr-xl\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:50vw { + margin: 50vw !important; + } + + .mx-xxl\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-xxl\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-xxl\:50vw { + margin-top: 50vw !important; + } + + .mb-xxl\:50vw { + margin-bottom: 50vw !important; + } + + .ml-xxl\:50vw { + margin-left: 50vw !important; + } + + .mr-xxl\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:50vw { + margin: 50vw !important; + } + + .mx-sm-up\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-sm-up\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-sm-up\:50vw { + margin-top: 50vw !important; + } + + .mb-sm-up\:50vw { + margin-bottom: 50vw !important; + } + + .ml-sm-up\:50vw { + margin-left: 50vw !important; + } + + .mr-sm-up\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:50vw { + margin: 50vw !important; + } + + .mx-md-up\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-md-up\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-md-up\:50vw { + margin-top: 50vw !important; + } + + .mb-md-up\:50vw { + margin-bottom: 50vw !important; + } + + .ml-md-up\:50vw { + margin-left: 50vw !important; + } + + .mr-md-up\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:50vw { + margin: 50vw !important; + } + + .mx-lg-up\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-lg-up\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-lg-up\:50vw { + margin-top: 50vw !important; + } + + .mb-lg-up\:50vw { + margin-bottom: 50vw !important; + } + + .ml-lg-up\:50vw { + margin-left: 50vw !important; + } + + .mr-lg-up\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:50vw { + margin: 50vw !important; + } + + .mx-xl-up\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-xl-up\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-xl-up\:50vw { + margin-top: 50vw !important; + } + + .mb-xl-up\:50vw { + margin-bottom: 50vw !important; + } + + .ml-xl-up\:50vw { + margin-left: 50vw !important; + } + + .mr-xl-up\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:50vw { + margin: 50vw !important; + } + + .mx-sm-down\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-sm-down\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-sm-down\:50vw { + margin-top: 50vw !important; + } + + .mb-sm-down\:50vw { + margin-bottom: 50vw !important; + } + + .ml-sm-down\:50vw { + margin-left: 50vw !important; + } + + .mr-sm-down\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:50vw { + margin: 50vw !important; + } + + .mx-md-down\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-md-down\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-md-down\:50vw { + margin-top: 50vw !important; + } + + .mb-md-down\:50vw { + margin-bottom: 50vw !important; + } + + .ml-md-down\:50vw { + margin-left: 50vw !important; + } + + .mr-md-down\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:50vw { + margin: 50vw !important; + } + + .mx-lg-down\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-lg-down\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-lg-down\:50vw { + margin-top: 50vw !important; + } + + .mb-lg-down\:50vw { + margin-bottom: 50vw !important; + } + + .ml-lg-down\:50vw { + margin-left: 50vw !important; + } + + .mr-lg-down\:50vw { + margin-right: 50vw !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:50vw { + margin: 50vw !important; + } + + .mx-xl-down\:50vw { + margin-left: 50vw !important; + margin-right: 50vw !important; + } + + .my-xl-down\:50vw { + margin-top: 50vw !important; + margin-bottom: 50vw !important; + } + + .mt-xl-down\:50vw { + margin-top: 50vw !important; + } + + .mb-xl-down\:50vw { + margin-bottom: 50vw !important; + } + + .ml-xl-down\:50vw { + margin-left: 50vw !important; + } + + .mr-xl-down\:50vw { + margin-right: 50vw !important; + } +} +.m\:75vw { + margin: 75vw !important; +} + +.mx\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; +} + +.my\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; +} + +.mt\:75vw { + margin-top: 75vw !important; +} + +.mb\:75vw { + margin-bottom: 75vw !important; +} + +.ml\:75vw { + margin-left: 75vw !important; +} + +.mr\:75vw { + margin-right: 75vw !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:75vw { + margin: 75vw !important; + } + + .mx-xs\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-xs\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-xs\:75vw { + margin-top: 75vw !important; + } + + .mb-xs\:75vw { + margin-bottom: 75vw !important; + } + + .ml-xs\:75vw { + margin-left: 75vw !important; + } + + .mr-xs\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:75vw { + margin: 75vw !important; + } + + .mx-sm\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-sm\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-sm\:75vw { + margin-top: 75vw !important; + } + + .mb-sm\:75vw { + margin-bottom: 75vw !important; + } + + .ml-sm\:75vw { + margin-left: 75vw !important; + } + + .mr-sm\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:75vw { + margin: 75vw !important; + } + + .mx-md\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-md\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-md\:75vw { + margin-top: 75vw !important; + } + + .mb-md\:75vw { + margin-bottom: 75vw !important; + } + + .ml-md\:75vw { + margin-left: 75vw !important; + } + + .mr-md\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:75vw { + margin: 75vw !important; + } + + .mx-lg\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-lg\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-lg\:75vw { + margin-top: 75vw !important; + } + + .mb-lg\:75vw { + margin-bottom: 75vw !important; + } + + .ml-lg\:75vw { + margin-left: 75vw !important; + } + + .mr-lg\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:75vw { + margin: 75vw !important; + } + + .mx-xl\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-xl\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-xl\:75vw { + margin-top: 75vw !important; + } + + .mb-xl\:75vw { + margin-bottom: 75vw !important; + } + + .ml-xl\:75vw { + margin-left: 75vw !important; + } + + .mr-xl\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:75vw { + margin: 75vw !important; + } + + .mx-xxl\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-xxl\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-xxl\:75vw { + margin-top: 75vw !important; + } + + .mb-xxl\:75vw { + margin-bottom: 75vw !important; + } + + .ml-xxl\:75vw { + margin-left: 75vw !important; + } + + .mr-xxl\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:75vw { + margin: 75vw !important; + } + + .mx-sm-up\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-sm-up\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-sm-up\:75vw { + margin-top: 75vw !important; + } + + .mb-sm-up\:75vw { + margin-bottom: 75vw !important; + } + + .ml-sm-up\:75vw { + margin-left: 75vw !important; + } + + .mr-sm-up\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:75vw { + margin: 75vw !important; + } + + .mx-md-up\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-md-up\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-md-up\:75vw { + margin-top: 75vw !important; + } + + .mb-md-up\:75vw { + margin-bottom: 75vw !important; + } + + .ml-md-up\:75vw { + margin-left: 75vw !important; + } + + .mr-md-up\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:75vw { + margin: 75vw !important; + } + + .mx-lg-up\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-lg-up\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-lg-up\:75vw { + margin-top: 75vw !important; + } + + .mb-lg-up\:75vw { + margin-bottom: 75vw !important; + } + + .ml-lg-up\:75vw { + margin-left: 75vw !important; + } + + .mr-lg-up\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:75vw { + margin: 75vw !important; + } + + .mx-xl-up\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-xl-up\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-xl-up\:75vw { + margin-top: 75vw !important; + } + + .mb-xl-up\:75vw { + margin-bottom: 75vw !important; + } + + .ml-xl-up\:75vw { + margin-left: 75vw !important; + } + + .mr-xl-up\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:75vw { + margin: 75vw !important; + } + + .mx-sm-down\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-sm-down\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-sm-down\:75vw { + margin-top: 75vw !important; + } + + .mb-sm-down\:75vw { + margin-bottom: 75vw !important; + } + + .ml-sm-down\:75vw { + margin-left: 75vw !important; + } + + .mr-sm-down\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:75vw { + margin: 75vw !important; + } + + .mx-md-down\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-md-down\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-md-down\:75vw { + margin-top: 75vw !important; + } + + .mb-md-down\:75vw { + margin-bottom: 75vw !important; + } + + .ml-md-down\:75vw { + margin-left: 75vw !important; + } + + .mr-md-down\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:75vw { + margin: 75vw !important; + } + + .mx-lg-down\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-lg-down\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-lg-down\:75vw { + margin-top: 75vw !important; + } + + .mb-lg-down\:75vw { + margin-bottom: 75vw !important; + } + + .ml-lg-down\:75vw { + margin-left: 75vw !important; + } + + .mr-lg-down\:75vw { + margin-right: 75vw !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:75vw { + margin: 75vw !important; + } + + .mx-xl-down\:75vw { + margin-left: 75vw !important; + margin-right: 75vw !important; + } + + .my-xl-down\:75vw { + margin-top: 75vw !important; + margin-bottom: 75vw !important; + } + + .mt-xl-down\:75vw { + margin-top: 75vw !important; + } + + .mb-xl-down\:75vw { + margin-bottom: 75vw !important; + } + + .ml-xl-down\:75vw { + margin-left: 75vw !important; + } + + .mr-xl-down\:75vw { + margin-right: 75vw !important; + } +} +.m\:100vw { + margin: 100vw !important; +} + +.mx\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; +} + +.my\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; +} + +.mt\:100vw { + margin-top: 100vw !important; +} + +.mb\:100vw { + margin-bottom: 100vw !important; +} + +.ml\:100vw { + margin-left: 100vw !important; +} + +.mr\:100vw { + margin-right: 100vw !important; +} + +@media only screen and (max-width: 576px) { + .m-xs\:100vw { + margin: 100vw !important; + } + + .mx-xs\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-xs\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-xs\:100vw { + margin-top: 100vw !important; + } + + .mb-xs\:100vw { + margin-bottom: 100vw !important; + } + + .ml-xs\:100vw { + margin-left: 100vw !important; + } + + .mr-xs\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .m-sm\:100vw { + margin: 100vw !important; + } + + .mx-sm\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-sm\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-sm\:100vw { + margin-top: 100vw !important; + } + + .mb-sm\:100vw { + margin-bottom: 100vw !important; + } + + .ml-sm\:100vw { + margin-left: 100vw !important; + } + + .mr-sm\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .m-md\:100vw { + margin: 100vw !important; + } + + .mx-md\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-md\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-md\:100vw { + margin-top: 100vw !important; + } + + .mb-md\:100vw { + margin-bottom: 100vw !important; + } + + .ml-md\:100vw { + margin-left: 100vw !important; + } + + .mr-md\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .m-lg\:100vw { + margin: 100vw !important; + } + + .mx-lg\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-lg\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-lg\:100vw { + margin-top: 100vw !important; + } + + .mb-lg\:100vw { + margin-bottom: 100vw !important; + } + + .ml-lg\:100vw { + margin-left: 100vw !important; + } + + .mr-lg\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .m-xl\:100vw { + margin: 100vw !important; + } + + .mx-xl\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-xl\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-xl\:100vw { + margin-top: 100vw !important; + } + + .mb-xl\:100vw { + margin-bottom: 100vw !important; + } + + .ml-xl\:100vw { + margin-left: 100vw !important; + } + + .mr-xl\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (min-width: 1401px) { + .m-xxl\:100vw { + margin: 100vw !important; + } + + .mx-xxl\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-xxl\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-xxl\:100vw { + margin-top: 100vw !important; + } + + .mb-xxl\:100vw { + margin-bottom: 100vw !important; + } + + .ml-xxl\:100vw { + margin-left: 100vw !important; + } + + .mr-xxl\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (min-width: 577px) { + .m-sm-up\:100vw { + margin: 100vw !important; + } + + .mx-sm-up\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-sm-up\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-sm-up\:100vw { + margin-top: 100vw !important; + } + + .mb-sm-up\:100vw { + margin-bottom: 100vw !important; + } + + .ml-sm-up\:100vw { + margin-left: 100vw !important; + } + + .mr-sm-up\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (min-width: 769px) { + .m-md-up\:100vw { + margin: 100vw !important; + } + + .mx-md-up\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-md-up\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-md-up\:100vw { + margin-top: 100vw !important; + } + + .mb-md-up\:100vw { + margin-bottom: 100vw !important; + } + + .ml-md-up\:100vw { + margin-left: 100vw !important; + } + + .mr-md-up\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (min-width: 993px) { + .m-lg-up\:100vw { + margin: 100vw !important; + } + + .mx-lg-up\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-lg-up\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-lg-up\:100vw { + margin-top: 100vw !important; + } + + .mb-lg-up\:100vw { + margin-bottom: 100vw !important; + } + + .ml-lg-up\:100vw { + margin-left: 100vw !important; + } + + .mr-lg-up\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (min-width: 1201px) { + .m-xl-up\:100vw { + margin: 100vw !important; + } + + .mx-xl-up\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-xl-up\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-xl-up\:100vw { + margin-top: 100vw !important; + } + + .mb-xl-up\:100vw { + margin-bottom: 100vw !important; + } + + .ml-xl-up\:100vw { + margin-left: 100vw !important; + } + + .mr-xl-up\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (max-width: 768px) { + .m-sm-down\:100vw { + margin: 100vw !important; + } + + .mx-sm-down\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-sm-down\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-sm-down\:100vw { + margin-top: 100vw !important; + } + + .mb-sm-down\:100vw { + margin-bottom: 100vw !important; + } + + .ml-sm-down\:100vw { + margin-left: 100vw !important; + } + + .mr-sm-down\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (max-width: 992px) { + .m-md-down\:100vw { + margin: 100vw !important; + } + + .mx-md-down\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-md-down\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-md-down\:100vw { + margin-top: 100vw !important; + } + + .mb-md-down\:100vw { + margin-bottom: 100vw !important; + } + + .ml-md-down\:100vw { + margin-left: 100vw !important; + } + + .mr-md-down\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (max-width: 1200px) { + .m-lg-down\:100vw { + margin: 100vw !important; + } + + .mx-lg-down\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-lg-down\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-lg-down\:100vw { + margin-top: 100vw !important; + } + + .mb-lg-down\:100vw { + margin-bottom: 100vw !important; + } + + .ml-lg-down\:100vw { + margin-left: 100vw !important; + } + + .mr-lg-down\:100vw { + margin-right: 100vw !important; + } +} +@media only screen and (max-width: 1400px) { + .m-xl-down\:100vw { + margin: 100vw !important; + } + + .mx-xl-down\:100vw { + margin-left: 100vw !important; + margin-right: 100vw !important; + } + + .my-xl-down\:100vw { + margin-top: 100vw !important; + margin-bottom: 100vw !important; + } + + .mt-xl-down\:100vw { + margin-top: 100vw !important; + } + + .mb-xl-down\:100vw { + margin-bottom: 100vw !important; + } + + .ml-xl-down\:100vw { + margin-left: 100vw !important; + } + + .mr-xl-down\:100vw { + margin-right: 100vw !important; + } +} +.p\:-1 { + padding: -10px !important; +} + +.px\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; +} + +.py\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; +} + +.pt\:-1 { + padding-top: -10px !important; +} + +.pb\:-1 { + padding-bottom: -10px !important; +} + +.pl\:-1 { + padding-left: -10px !important; +} + +.pr\:-1 { + padding-right: -10px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:-1 { + padding: -10px !important; + } + + .px-xs\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-xs\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-xs\:-1 { + padding-top: -10px !important; + } + + .pb-xs\:-1 { + padding-bottom: -10px !important; + } + + .pl-xs\:-1 { + padding-left: -10px !important; + } + + .pr-xs\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:-1 { + padding: -10px !important; + } + + .px-sm-down\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-sm-down\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-sm-down\:-1 { + padding-top: -10px !important; + } + + .pb-sm-down\:-1 { + padding-bottom: -10px !important; + } + + .pl-sm-down\:-1 { + padding-left: -10px !important; + } + + .pr-sm-down\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:-1 { + padding: -10px !important; + } + + .px-sm\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-sm\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-sm\:-1 { + padding-top: -10px !important; + } + + .pb-sm\:-1 { + padding-bottom: -10px !important; + } + + .pl-sm\:-1 { + padding-left: -10px !important; + } + + .pr-sm\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:-1 { + padding: -10px !important; + } + + .px-sm-up\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-sm-up\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-sm-up\:-1 { + padding-top: -10px !important; + } + + .pb-sm-up\:-1 { + padding-bottom: -10px !important; + } + + .pl-sm-up\:-1 { + padding-left: -10px !important; + } + + .pr-sm-up\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:-1 { + padding: -10px !important; + } + + .px-md-down\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-md-down\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-md-down\:-1 { + padding-top: -10px !important; + } + + .pb-md-down\:-1 { + padding-bottom: -10px !important; + } + + .pl-md-down\:-1 { + padding-left: -10px !important; + } + + .pr-md-down\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:-1 { + padding: -10px !important; + } + + .px-md\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-md\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-md\:-1 { + padding-top: -10px !important; + } + + .pb-md\:-1 { + padding-bottom: -10px !important; + } + + .pl-md\:-1 { + padding-left: -10px !important; + } + + .pr-md\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:-1 { + padding: -10px !important; + } + + .px-md-up\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-md-up\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-md-up\:-1 { + padding-top: -10px !important; + } + + .pb-md-up\:-1 { + padding-bottom: -10px !important; + } + + .pl-md-up\:-1 { + padding-left: -10px !important; + } + + .pr-md-up\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:-1 { + padding: -10px !important; + } + + .px-lg-down\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-lg-down\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-lg-down\:-1 { + padding-top: -10px !important; + } + + .pb-lg-down\:-1 { + padding-bottom: -10px !important; + } + + .pl-lg-down\:-1 { + padding-left: -10px !important; + } + + .pr-lg-down\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:-1 { + padding: -10px !important; + } + + .px-lg\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-lg\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-lg\:-1 { + padding-top: -10px !important; + } + + .pb-lg\:-1 { + padding-bottom: -10px !important; + } + + .pl-lg\:-1 { + padding-left: -10px !important; + } + + .pr-lg\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:-1 { + padding: -10px !important; + } + + .px-lg-up\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-lg-up\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-lg-up\:-1 { + padding-top: -10px !important; + } + + .pb-lg-up\:-1 { + padding-bottom: -10px !important; + } + + .pl-lg-up\:-1 { + padding-left: -10px !important; + } + + .pr-lg-up\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:-1 { + padding: -10px !important; + } + + .px-xl-down\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-xl-down\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-xl-down\:-1 { + padding-top: -10px !important; + } + + .pb-xl-down\:-1 { + padding-bottom: -10px !important; + } + + .pl-xl-down\:-1 { + padding-left: -10px !important; + } + + .pr-xl-down\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:-1 { + padding: -10px !important; + } + + .px-xl\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-xl\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-xl\:-1 { + padding-top: -10px !important; + } + + .pb-xl\:-1 { + padding-bottom: -10px !important; + } + + .pl-xl\:-1 { + padding-left: -10px !important; + } + + .pr-xl\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:-1 { + padding: -10px !important; + } + + .px-xl-up\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-xl-up\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-xl-up\:-1 { + padding-top: -10px !important; + } + + .pb-xl-up\:-1 { + padding-bottom: -10px !important; + } + + .pl-xl-up\:-1 { + padding-left: -10px !important; + } + + .pr-xl-up\:-1 { + padding-right: -10px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:-1 { + padding: -10px !important; + } + + .px-xxl\:-1 { + padding-left: -10px !important; + padding-right: -10px !important; + } + + .py-xxl\:-1 { + padding-top: -10px !important; + padding-bottom: -10px !important; + } + + .pt-xxl\:-1 { + padding-top: -10px !important; + } + + .pb-xxl\:-1 { + padding-bottom: -10px !important; + } + + .pl-xxl\:-1 { + padding-left: -10px !important; + } + + .pr-xxl\:-1 { + padding-right: -10px !important; + } +} +.p\:-2 { + padding: -20px !important; +} + +.px\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; +} + +.py\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; +} + +.pt\:-2 { + padding-top: -20px !important; +} + +.pb\:-2 { + padding-bottom: -20px !important; +} + +.pl\:-2 { + padding-left: -20px !important; +} + +.pr\:-2 { + padding-right: -20px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:-2 { + padding: -20px !important; + } + + .px-xs\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-xs\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-xs\:-2 { + padding-top: -20px !important; + } + + .pb-xs\:-2 { + padding-bottom: -20px !important; + } + + .pl-xs\:-2 { + padding-left: -20px !important; + } + + .pr-xs\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:-2 { + padding: -20px !important; + } + + .px-sm-down\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-sm-down\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-sm-down\:-2 { + padding-top: -20px !important; + } + + .pb-sm-down\:-2 { + padding-bottom: -20px !important; + } + + .pl-sm-down\:-2 { + padding-left: -20px !important; + } + + .pr-sm-down\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:-2 { + padding: -20px !important; + } + + .px-sm\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-sm\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-sm\:-2 { + padding-top: -20px !important; + } + + .pb-sm\:-2 { + padding-bottom: -20px !important; + } + + .pl-sm\:-2 { + padding-left: -20px !important; + } + + .pr-sm\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:-2 { + padding: -20px !important; + } + + .px-sm-up\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-sm-up\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-sm-up\:-2 { + padding-top: -20px !important; + } + + .pb-sm-up\:-2 { + padding-bottom: -20px !important; + } + + .pl-sm-up\:-2 { + padding-left: -20px !important; + } + + .pr-sm-up\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:-2 { + padding: -20px !important; + } + + .px-md-down\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-md-down\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-md-down\:-2 { + padding-top: -20px !important; + } + + .pb-md-down\:-2 { + padding-bottom: -20px !important; + } + + .pl-md-down\:-2 { + padding-left: -20px !important; + } + + .pr-md-down\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:-2 { + padding: -20px !important; + } + + .px-md\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-md\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-md\:-2 { + padding-top: -20px !important; + } + + .pb-md\:-2 { + padding-bottom: -20px !important; + } + + .pl-md\:-2 { + padding-left: -20px !important; + } + + .pr-md\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:-2 { + padding: -20px !important; + } + + .px-md-up\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-md-up\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-md-up\:-2 { + padding-top: -20px !important; + } + + .pb-md-up\:-2 { + padding-bottom: -20px !important; + } + + .pl-md-up\:-2 { + padding-left: -20px !important; + } + + .pr-md-up\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:-2 { + padding: -20px !important; + } + + .px-lg-down\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-lg-down\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-lg-down\:-2 { + padding-top: -20px !important; + } + + .pb-lg-down\:-2 { + padding-bottom: -20px !important; + } + + .pl-lg-down\:-2 { + padding-left: -20px !important; + } + + .pr-lg-down\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:-2 { + padding: -20px !important; + } + + .px-lg\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-lg\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-lg\:-2 { + padding-top: -20px !important; + } + + .pb-lg\:-2 { + padding-bottom: -20px !important; + } + + .pl-lg\:-2 { + padding-left: -20px !important; + } + + .pr-lg\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:-2 { + padding: -20px !important; + } + + .px-lg-up\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-lg-up\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-lg-up\:-2 { + padding-top: -20px !important; + } + + .pb-lg-up\:-2 { + padding-bottom: -20px !important; + } + + .pl-lg-up\:-2 { + padding-left: -20px !important; + } + + .pr-lg-up\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:-2 { + padding: -20px !important; + } + + .px-xl-down\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-xl-down\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-xl-down\:-2 { + padding-top: -20px !important; + } + + .pb-xl-down\:-2 { + padding-bottom: -20px !important; + } + + .pl-xl-down\:-2 { + padding-left: -20px !important; + } + + .pr-xl-down\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:-2 { + padding: -20px !important; + } + + .px-xl\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-xl\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-xl\:-2 { + padding-top: -20px !important; + } + + .pb-xl\:-2 { + padding-bottom: -20px !important; + } + + .pl-xl\:-2 { + padding-left: -20px !important; + } + + .pr-xl\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:-2 { + padding: -20px !important; + } + + .px-xl-up\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-xl-up\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-xl-up\:-2 { + padding-top: -20px !important; + } + + .pb-xl-up\:-2 { + padding-bottom: -20px !important; + } + + .pl-xl-up\:-2 { + padding-left: -20px !important; + } + + .pr-xl-up\:-2 { + padding-right: -20px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:-2 { + padding: -20px !important; + } + + .px-xxl\:-2 { + padding-left: -20px !important; + padding-right: -20px !important; + } + + .py-xxl\:-2 { + padding-top: -20px !important; + padding-bottom: -20px !important; + } + + .pt-xxl\:-2 { + padding-top: -20px !important; + } + + .pb-xxl\:-2 { + padding-bottom: -20px !important; + } + + .pl-xxl\:-2 { + padding-left: -20px !important; + } + + .pr-xxl\:-2 { + padding-right: -20px !important; + } +} +.p\:-3 { + padding: -30px !important; +} + +.px\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; +} + +.py\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; +} + +.pt\:-3 { + padding-top: -30px !important; +} + +.pb\:-3 { + padding-bottom: -30px !important; +} + +.pl\:-3 { + padding-left: -30px !important; +} + +.pr\:-3 { + padding-right: -30px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:-3 { + padding: -30px !important; + } + + .px-xs\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-xs\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-xs\:-3 { + padding-top: -30px !important; + } + + .pb-xs\:-3 { + padding-bottom: -30px !important; + } + + .pl-xs\:-3 { + padding-left: -30px !important; + } + + .pr-xs\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:-3 { + padding: -30px !important; + } + + .px-sm-down\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-sm-down\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-sm-down\:-3 { + padding-top: -30px !important; + } + + .pb-sm-down\:-3 { + padding-bottom: -30px !important; + } + + .pl-sm-down\:-3 { + padding-left: -30px !important; + } + + .pr-sm-down\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:-3 { + padding: -30px !important; + } + + .px-sm\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-sm\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-sm\:-3 { + padding-top: -30px !important; + } + + .pb-sm\:-3 { + padding-bottom: -30px !important; + } + + .pl-sm\:-3 { + padding-left: -30px !important; + } + + .pr-sm\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:-3 { + padding: -30px !important; + } + + .px-sm-up\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-sm-up\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-sm-up\:-3 { + padding-top: -30px !important; + } + + .pb-sm-up\:-3 { + padding-bottom: -30px !important; + } + + .pl-sm-up\:-3 { + padding-left: -30px !important; + } + + .pr-sm-up\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:-3 { + padding: -30px !important; + } + + .px-md-down\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-md-down\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-md-down\:-3 { + padding-top: -30px !important; + } + + .pb-md-down\:-3 { + padding-bottom: -30px !important; + } + + .pl-md-down\:-3 { + padding-left: -30px !important; + } + + .pr-md-down\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:-3 { + padding: -30px !important; + } + + .px-md\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-md\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-md\:-3 { + padding-top: -30px !important; + } + + .pb-md\:-3 { + padding-bottom: -30px !important; + } + + .pl-md\:-3 { + padding-left: -30px !important; + } + + .pr-md\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:-3 { + padding: -30px !important; + } + + .px-md-up\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-md-up\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-md-up\:-3 { + padding-top: -30px !important; + } + + .pb-md-up\:-3 { + padding-bottom: -30px !important; + } + + .pl-md-up\:-3 { + padding-left: -30px !important; + } + + .pr-md-up\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:-3 { + padding: -30px !important; + } + + .px-lg-down\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-lg-down\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-lg-down\:-3 { + padding-top: -30px !important; + } + + .pb-lg-down\:-3 { + padding-bottom: -30px !important; + } + + .pl-lg-down\:-3 { + padding-left: -30px !important; + } + + .pr-lg-down\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:-3 { + padding: -30px !important; + } + + .px-lg\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-lg\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-lg\:-3 { + padding-top: -30px !important; + } + + .pb-lg\:-3 { + padding-bottom: -30px !important; + } + + .pl-lg\:-3 { + padding-left: -30px !important; + } + + .pr-lg\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:-3 { + padding: -30px !important; + } + + .px-lg-up\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-lg-up\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-lg-up\:-3 { + padding-top: -30px !important; + } + + .pb-lg-up\:-3 { + padding-bottom: -30px !important; + } + + .pl-lg-up\:-3 { + padding-left: -30px !important; + } + + .pr-lg-up\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:-3 { + padding: -30px !important; + } + + .px-xl-down\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-xl-down\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-xl-down\:-3 { + padding-top: -30px !important; + } + + .pb-xl-down\:-3 { + padding-bottom: -30px !important; + } + + .pl-xl-down\:-3 { + padding-left: -30px !important; + } + + .pr-xl-down\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:-3 { + padding: -30px !important; + } + + .px-xl\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-xl\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-xl\:-3 { + padding-top: -30px !important; + } + + .pb-xl\:-3 { + padding-bottom: -30px !important; + } + + .pl-xl\:-3 { + padding-left: -30px !important; + } + + .pr-xl\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:-3 { + padding: -30px !important; + } + + .px-xl-up\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-xl-up\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-xl-up\:-3 { + padding-top: -30px !important; + } + + .pb-xl-up\:-3 { + padding-bottom: -30px !important; + } + + .pl-xl-up\:-3 { + padding-left: -30px !important; + } + + .pr-xl-up\:-3 { + padding-right: -30px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:-3 { + padding: -30px !important; + } + + .px-xxl\:-3 { + padding-left: -30px !important; + padding-right: -30px !important; + } + + .py-xxl\:-3 { + padding-top: -30px !important; + padding-bottom: -30px !important; + } + + .pt-xxl\:-3 { + padding-top: -30px !important; + } + + .pb-xxl\:-3 { + padding-bottom: -30px !important; + } + + .pl-xxl\:-3 { + padding-left: -30px !important; + } + + .pr-xxl\:-3 { + padding-right: -30px !important; + } +} +.p\:-4 { + padding: -40px !important; +} + +.px\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; +} + +.py\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; +} + +.pt\:-4 { + padding-top: -40px !important; +} + +.pb\:-4 { + padding-bottom: -40px !important; +} + +.pl\:-4 { + padding-left: -40px !important; +} + +.pr\:-4 { + padding-right: -40px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:-4 { + padding: -40px !important; + } + + .px-xs\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-xs\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-xs\:-4 { + padding-top: -40px !important; + } + + .pb-xs\:-4 { + padding-bottom: -40px !important; + } + + .pl-xs\:-4 { + padding-left: -40px !important; + } + + .pr-xs\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:-4 { + padding: -40px !important; + } + + .px-sm-down\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-sm-down\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-sm-down\:-4 { + padding-top: -40px !important; + } + + .pb-sm-down\:-4 { + padding-bottom: -40px !important; + } + + .pl-sm-down\:-4 { + padding-left: -40px !important; + } + + .pr-sm-down\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:-4 { + padding: -40px !important; + } + + .px-sm\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-sm\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-sm\:-4 { + padding-top: -40px !important; + } + + .pb-sm\:-4 { + padding-bottom: -40px !important; + } + + .pl-sm\:-4 { + padding-left: -40px !important; + } + + .pr-sm\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:-4 { + padding: -40px !important; + } + + .px-sm-up\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-sm-up\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-sm-up\:-4 { + padding-top: -40px !important; + } + + .pb-sm-up\:-4 { + padding-bottom: -40px !important; + } + + .pl-sm-up\:-4 { + padding-left: -40px !important; + } + + .pr-sm-up\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:-4 { + padding: -40px !important; + } + + .px-md-down\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-md-down\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-md-down\:-4 { + padding-top: -40px !important; + } + + .pb-md-down\:-4 { + padding-bottom: -40px !important; + } + + .pl-md-down\:-4 { + padding-left: -40px !important; + } + + .pr-md-down\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:-4 { + padding: -40px !important; + } + + .px-md\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-md\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-md\:-4 { + padding-top: -40px !important; + } + + .pb-md\:-4 { + padding-bottom: -40px !important; + } + + .pl-md\:-4 { + padding-left: -40px !important; + } + + .pr-md\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:-4 { + padding: -40px !important; + } + + .px-md-up\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-md-up\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-md-up\:-4 { + padding-top: -40px !important; + } + + .pb-md-up\:-4 { + padding-bottom: -40px !important; + } + + .pl-md-up\:-4 { + padding-left: -40px !important; + } + + .pr-md-up\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:-4 { + padding: -40px !important; + } + + .px-lg-down\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-lg-down\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-lg-down\:-4 { + padding-top: -40px !important; + } + + .pb-lg-down\:-4 { + padding-bottom: -40px !important; + } + + .pl-lg-down\:-4 { + padding-left: -40px !important; + } + + .pr-lg-down\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:-4 { + padding: -40px !important; + } + + .px-lg\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-lg\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-lg\:-4 { + padding-top: -40px !important; + } + + .pb-lg\:-4 { + padding-bottom: -40px !important; + } + + .pl-lg\:-4 { + padding-left: -40px !important; + } + + .pr-lg\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:-4 { + padding: -40px !important; + } + + .px-lg-up\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-lg-up\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-lg-up\:-4 { + padding-top: -40px !important; + } + + .pb-lg-up\:-4 { + padding-bottom: -40px !important; + } + + .pl-lg-up\:-4 { + padding-left: -40px !important; + } + + .pr-lg-up\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:-4 { + padding: -40px !important; + } + + .px-xl-down\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-xl-down\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-xl-down\:-4 { + padding-top: -40px !important; + } + + .pb-xl-down\:-4 { + padding-bottom: -40px !important; + } + + .pl-xl-down\:-4 { + padding-left: -40px !important; + } + + .pr-xl-down\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:-4 { + padding: -40px !important; + } + + .px-xl\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-xl\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-xl\:-4 { + padding-top: -40px !important; + } + + .pb-xl\:-4 { + padding-bottom: -40px !important; + } + + .pl-xl\:-4 { + padding-left: -40px !important; + } + + .pr-xl\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:-4 { + padding: -40px !important; + } + + .px-xl-up\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-xl-up\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-xl-up\:-4 { + padding-top: -40px !important; + } + + .pb-xl-up\:-4 { + padding-bottom: -40px !important; + } + + .pl-xl-up\:-4 { + padding-left: -40px !important; + } + + .pr-xl-up\:-4 { + padding-right: -40px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:-4 { + padding: -40px !important; + } + + .px-xxl\:-4 { + padding-left: -40px !important; + padding-right: -40px !important; + } + + .py-xxl\:-4 { + padding-top: -40px !important; + padding-bottom: -40px !important; + } + + .pt-xxl\:-4 { + padding-top: -40px !important; + } + + .pb-xxl\:-4 { + padding-bottom: -40px !important; + } + + .pl-xxl\:-4 { + padding-left: -40px !important; + } + + .pr-xxl\:-4 { + padding-right: -40px !important; + } +} +.p\:-5 { + padding: -50px !important; +} + +.px\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; +} + +.py\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; +} + +.pt\:-5 { + padding-top: -50px !important; +} + +.pb\:-5 { + padding-bottom: -50px !important; +} + +.pl\:-5 { + padding-left: -50px !important; +} + +.pr\:-5 { + padding-right: -50px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:-5 { + padding: -50px !important; + } + + .px-xs\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-xs\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-xs\:-5 { + padding-top: -50px !important; + } + + .pb-xs\:-5 { + padding-bottom: -50px !important; + } + + .pl-xs\:-5 { + padding-left: -50px !important; + } + + .pr-xs\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:-5 { + padding: -50px !important; + } + + .px-sm-down\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-sm-down\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-sm-down\:-5 { + padding-top: -50px !important; + } + + .pb-sm-down\:-5 { + padding-bottom: -50px !important; + } + + .pl-sm-down\:-5 { + padding-left: -50px !important; + } + + .pr-sm-down\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:-5 { + padding: -50px !important; + } + + .px-sm\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-sm\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-sm\:-5 { + padding-top: -50px !important; + } + + .pb-sm\:-5 { + padding-bottom: -50px !important; + } + + .pl-sm\:-5 { + padding-left: -50px !important; + } + + .pr-sm\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:-5 { + padding: -50px !important; + } + + .px-sm-up\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-sm-up\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-sm-up\:-5 { + padding-top: -50px !important; + } + + .pb-sm-up\:-5 { + padding-bottom: -50px !important; + } + + .pl-sm-up\:-5 { + padding-left: -50px !important; + } + + .pr-sm-up\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:-5 { + padding: -50px !important; + } + + .px-md-down\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-md-down\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-md-down\:-5 { + padding-top: -50px !important; + } + + .pb-md-down\:-5 { + padding-bottom: -50px !important; + } + + .pl-md-down\:-5 { + padding-left: -50px !important; + } + + .pr-md-down\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:-5 { + padding: -50px !important; + } + + .px-md\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-md\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-md\:-5 { + padding-top: -50px !important; + } + + .pb-md\:-5 { + padding-bottom: -50px !important; + } + + .pl-md\:-5 { + padding-left: -50px !important; + } + + .pr-md\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:-5 { + padding: -50px !important; + } + + .px-md-up\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-md-up\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-md-up\:-5 { + padding-top: -50px !important; + } + + .pb-md-up\:-5 { + padding-bottom: -50px !important; + } + + .pl-md-up\:-5 { + padding-left: -50px !important; + } + + .pr-md-up\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:-5 { + padding: -50px !important; + } + + .px-lg-down\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-lg-down\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-lg-down\:-5 { + padding-top: -50px !important; + } + + .pb-lg-down\:-5 { + padding-bottom: -50px !important; + } + + .pl-lg-down\:-5 { + padding-left: -50px !important; + } + + .pr-lg-down\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:-5 { + padding: -50px !important; + } + + .px-lg\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-lg\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-lg\:-5 { + padding-top: -50px !important; + } + + .pb-lg\:-5 { + padding-bottom: -50px !important; + } + + .pl-lg\:-5 { + padding-left: -50px !important; + } + + .pr-lg\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:-5 { + padding: -50px !important; + } + + .px-lg-up\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-lg-up\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-lg-up\:-5 { + padding-top: -50px !important; + } + + .pb-lg-up\:-5 { + padding-bottom: -50px !important; + } + + .pl-lg-up\:-5 { + padding-left: -50px !important; + } + + .pr-lg-up\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:-5 { + padding: -50px !important; + } + + .px-xl-down\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-xl-down\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-xl-down\:-5 { + padding-top: -50px !important; + } + + .pb-xl-down\:-5 { + padding-bottom: -50px !important; + } + + .pl-xl-down\:-5 { + padding-left: -50px !important; + } + + .pr-xl-down\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:-5 { + padding: -50px !important; + } + + .px-xl\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-xl\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-xl\:-5 { + padding-top: -50px !important; + } + + .pb-xl\:-5 { + padding-bottom: -50px !important; + } + + .pl-xl\:-5 { + padding-left: -50px !important; + } + + .pr-xl\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:-5 { + padding: -50px !important; + } + + .px-xl-up\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-xl-up\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-xl-up\:-5 { + padding-top: -50px !important; + } + + .pb-xl-up\:-5 { + padding-bottom: -50px !important; + } + + .pl-xl-up\:-5 { + padding-left: -50px !important; + } + + .pr-xl-up\:-5 { + padding-right: -50px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:-5 { + padding: -50px !important; + } + + .px-xxl\:-5 { + padding-left: -50px !important; + padding-right: -50px !important; + } + + .py-xxl\:-5 { + padding-top: -50px !important; + padding-bottom: -50px !important; + } + + .pt-xxl\:-5 { + padding-top: -50px !important; + } + + .pb-xxl\:-5 { + padding-bottom: -50px !important; + } + + .pl-xxl\:-5 { + padding-left: -50px !important; + } + + .pr-xxl\:-5 { + padding-right: -50px !important; + } +} +.p\:-6 { + padding: -60px !important; +} + +.px\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; +} + +.py\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; +} + +.pt\:-6 { + padding-top: -60px !important; +} + +.pb\:-6 { + padding-bottom: -60px !important; +} + +.pl\:-6 { + padding-left: -60px !important; +} + +.pr\:-6 { + padding-right: -60px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:-6 { + padding: -60px !important; + } + + .px-xs\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-xs\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-xs\:-6 { + padding-top: -60px !important; + } + + .pb-xs\:-6 { + padding-bottom: -60px !important; + } + + .pl-xs\:-6 { + padding-left: -60px !important; + } + + .pr-xs\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:-6 { + padding: -60px !important; + } + + .px-sm-down\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-sm-down\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-sm-down\:-6 { + padding-top: -60px !important; + } + + .pb-sm-down\:-6 { + padding-bottom: -60px !important; + } + + .pl-sm-down\:-6 { + padding-left: -60px !important; + } + + .pr-sm-down\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:-6 { + padding: -60px !important; + } + + .px-sm\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-sm\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-sm\:-6 { + padding-top: -60px !important; + } + + .pb-sm\:-6 { + padding-bottom: -60px !important; + } + + .pl-sm\:-6 { + padding-left: -60px !important; + } + + .pr-sm\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:-6 { + padding: -60px !important; + } + + .px-sm-up\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-sm-up\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-sm-up\:-6 { + padding-top: -60px !important; + } + + .pb-sm-up\:-6 { + padding-bottom: -60px !important; + } + + .pl-sm-up\:-6 { + padding-left: -60px !important; + } + + .pr-sm-up\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:-6 { + padding: -60px !important; + } + + .px-md-down\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-md-down\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-md-down\:-6 { + padding-top: -60px !important; + } + + .pb-md-down\:-6 { + padding-bottom: -60px !important; + } + + .pl-md-down\:-6 { + padding-left: -60px !important; + } + + .pr-md-down\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:-6 { + padding: -60px !important; + } + + .px-md\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-md\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-md\:-6 { + padding-top: -60px !important; + } + + .pb-md\:-6 { + padding-bottom: -60px !important; + } + + .pl-md\:-6 { + padding-left: -60px !important; + } + + .pr-md\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:-6 { + padding: -60px !important; + } + + .px-md-up\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-md-up\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-md-up\:-6 { + padding-top: -60px !important; + } + + .pb-md-up\:-6 { + padding-bottom: -60px !important; + } + + .pl-md-up\:-6 { + padding-left: -60px !important; + } + + .pr-md-up\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:-6 { + padding: -60px !important; + } + + .px-lg-down\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-lg-down\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-lg-down\:-6 { + padding-top: -60px !important; + } + + .pb-lg-down\:-6 { + padding-bottom: -60px !important; + } + + .pl-lg-down\:-6 { + padding-left: -60px !important; + } + + .pr-lg-down\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:-6 { + padding: -60px !important; + } + + .px-lg\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-lg\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-lg\:-6 { + padding-top: -60px !important; + } + + .pb-lg\:-6 { + padding-bottom: -60px !important; + } + + .pl-lg\:-6 { + padding-left: -60px !important; + } + + .pr-lg\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:-6 { + padding: -60px !important; + } + + .px-lg-up\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-lg-up\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-lg-up\:-6 { + padding-top: -60px !important; + } + + .pb-lg-up\:-6 { + padding-bottom: -60px !important; + } + + .pl-lg-up\:-6 { + padding-left: -60px !important; + } + + .pr-lg-up\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:-6 { + padding: -60px !important; + } + + .px-xl-down\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-xl-down\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-xl-down\:-6 { + padding-top: -60px !important; + } + + .pb-xl-down\:-6 { + padding-bottom: -60px !important; + } + + .pl-xl-down\:-6 { + padding-left: -60px !important; + } + + .pr-xl-down\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:-6 { + padding: -60px !important; + } + + .px-xl\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-xl\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-xl\:-6 { + padding-top: -60px !important; + } + + .pb-xl\:-6 { + padding-bottom: -60px !important; + } + + .pl-xl\:-6 { + padding-left: -60px !important; + } + + .pr-xl\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:-6 { + padding: -60px !important; + } + + .px-xl-up\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-xl-up\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-xl-up\:-6 { + padding-top: -60px !important; + } + + .pb-xl-up\:-6 { + padding-bottom: -60px !important; + } + + .pl-xl-up\:-6 { + padding-left: -60px !important; + } + + .pr-xl-up\:-6 { + padding-right: -60px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:-6 { + padding: -60px !important; + } + + .px-xxl\:-6 { + padding-left: -60px !important; + padding-right: -60px !important; + } + + .py-xxl\:-6 { + padding-top: -60px !important; + padding-bottom: -60px !important; + } + + .pt-xxl\:-6 { + padding-top: -60px !important; + } + + .pb-xxl\:-6 { + padding-bottom: -60px !important; + } + + .pl-xxl\:-6 { + padding-left: -60px !important; + } + + .pr-xxl\:-6 { + padding-right: -60px !important; + } +} +.p\:-7 { + padding: -70px !important; +} + +.px\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; +} + +.py\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; +} + +.pt\:-7 { + padding-top: -70px !important; +} + +.pb\:-7 { + padding-bottom: -70px !important; +} + +.pl\:-7 { + padding-left: -70px !important; +} + +.pr\:-7 { + padding-right: -70px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:-7 { + padding: -70px !important; + } + + .px-xs\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-xs\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-xs\:-7 { + padding-top: -70px !important; + } + + .pb-xs\:-7 { + padding-bottom: -70px !important; + } + + .pl-xs\:-7 { + padding-left: -70px !important; + } + + .pr-xs\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:-7 { + padding: -70px !important; + } + + .px-sm-down\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-sm-down\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-sm-down\:-7 { + padding-top: -70px !important; + } + + .pb-sm-down\:-7 { + padding-bottom: -70px !important; + } + + .pl-sm-down\:-7 { + padding-left: -70px !important; + } + + .pr-sm-down\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:-7 { + padding: -70px !important; + } + + .px-sm\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-sm\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-sm\:-7 { + padding-top: -70px !important; + } + + .pb-sm\:-7 { + padding-bottom: -70px !important; + } + + .pl-sm\:-7 { + padding-left: -70px !important; + } + + .pr-sm\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:-7 { + padding: -70px !important; + } + + .px-sm-up\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-sm-up\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-sm-up\:-7 { + padding-top: -70px !important; + } + + .pb-sm-up\:-7 { + padding-bottom: -70px !important; + } + + .pl-sm-up\:-7 { + padding-left: -70px !important; + } + + .pr-sm-up\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:-7 { + padding: -70px !important; + } + + .px-md-down\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-md-down\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-md-down\:-7 { + padding-top: -70px !important; + } + + .pb-md-down\:-7 { + padding-bottom: -70px !important; + } + + .pl-md-down\:-7 { + padding-left: -70px !important; + } + + .pr-md-down\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:-7 { + padding: -70px !important; + } + + .px-md\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-md\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-md\:-7 { + padding-top: -70px !important; + } + + .pb-md\:-7 { + padding-bottom: -70px !important; + } + + .pl-md\:-7 { + padding-left: -70px !important; + } + + .pr-md\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:-7 { + padding: -70px !important; + } + + .px-md-up\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-md-up\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-md-up\:-7 { + padding-top: -70px !important; + } + + .pb-md-up\:-7 { + padding-bottom: -70px !important; + } + + .pl-md-up\:-7 { + padding-left: -70px !important; + } + + .pr-md-up\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:-7 { + padding: -70px !important; + } + + .px-lg-down\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-lg-down\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-lg-down\:-7 { + padding-top: -70px !important; + } + + .pb-lg-down\:-7 { + padding-bottom: -70px !important; + } + + .pl-lg-down\:-7 { + padding-left: -70px !important; + } + + .pr-lg-down\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:-7 { + padding: -70px !important; + } + + .px-lg\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-lg\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-lg\:-7 { + padding-top: -70px !important; + } + + .pb-lg\:-7 { + padding-bottom: -70px !important; + } + + .pl-lg\:-7 { + padding-left: -70px !important; + } + + .pr-lg\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:-7 { + padding: -70px !important; + } + + .px-lg-up\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-lg-up\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-lg-up\:-7 { + padding-top: -70px !important; + } + + .pb-lg-up\:-7 { + padding-bottom: -70px !important; + } + + .pl-lg-up\:-7 { + padding-left: -70px !important; + } + + .pr-lg-up\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:-7 { + padding: -70px !important; + } + + .px-xl-down\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-xl-down\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-xl-down\:-7 { + padding-top: -70px !important; + } + + .pb-xl-down\:-7 { + padding-bottom: -70px !important; + } + + .pl-xl-down\:-7 { + padding-left: -70px !important; + } + + .pr-xl-down\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:-7 { + padding: -70px !important; + } + + .px-xl\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-xl\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-xl\:-7 { + padding-top: -70px !important; + } + + .pb-xl\:-7 { + padding-bottom: -70px !important; + } + + .pl-xl\:-7 { + padding-left: -70px !important; + } + + .pr-xl\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:-7 { + padding: -70px !important; + } + + .px-xl-up\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-xl-up\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-xl-up\:-7 { + padding-top: -70px !important; + } + + .pb-xl-up\:-7 { + padding-bottom: -70px !important; + } + + .pl-xl-up\:-7 { + padding-left: -70px !important; + } + + .pr-xl-up\:-7 { + padding-right: -70px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:-7 { + padding: -70px !important; + } + + .px-xxl\:-7 { + padding-left: -70px !important; + padding-right: -70px !important; + } + + .py-xxl\:-7 { + padding-top: -70px !important; + padding-bottom: -70px !important; + } + + .pt-xxl\:-7 { + padding-top: -70px !important; + } + + .pb-xxl\:-7 { + padding-bottom: -70px !important; + } + + .pl-xxl\:-7 { + padding-left: -70px !important; + } + + .pr-xxl\:-7 { + padding-right: -70px !important; + } +} +.p\:-8 { + padding: -80px !important; +} + +.px\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; +} + +.py\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; +} + +.pt\:-8 { + padding-top: -80px !important; +} + +.pb\:-8 { + padding-bottom: -80px !important; +} + +.pl\:-8 { + padding-left: -80px !important; +} + +.pr\:-8 { + padding-right: -80px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:-8 { + padding: -80px !important; + } + + .px-xs\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-xs\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-xs\:-8 { + padding-top: -80px !important; + } + + .pb-xs\:-8 { + padding-bottom: -80px !important; + } + + .pl-xs\:-8 { + padding-left: -80px !important; + } + + .pr-xs\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:-8 { + padding: -80px !important; + } + + .px-sm-down\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-sm-down\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-sm-down\:-8 { + padding-top: -80px !important; + } + + .pb-sm-down\:-8 { + padding-bottom: -80px !important; + } + + .pl-sm-down\:-8 { + padding-left: -80px !important; + } + + .pr-sm-down\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:-8 { + padding: -80px !important; + } + + .px-sm\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-sm\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-sm\:-8 { + padding-top: -80px !important; + } + + .pb-sm\:-8 { + padding-bottom: -80px !important; + } + + .pl-sm\:-8 { + padding-left: -80px !important; + } + + .pr-sm\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:-8 { + padding: -80px !important; + } + + .px-sm-up\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-sm-up\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-sm-up\:-8 { + padding-top: -80px !important; + } + + .pb-sm-up\:-8 { + padding-bottom: -80px !important; + } + + .pl-sm-up\:-8 { + padding-left: -80px !important; + } + + .pr-sm-up\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:-8 { + padding: -80px !important; + } + + .px-md-down\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-md-down\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-md-down\:-8 { + padding-top: -80px !important; + } + + .pb-md-down\:-8 { + padding-bottom: -80px !important; + } + + .pl-md-down\:-8 { + padding-left: -80px !important; + } + + .pr-md-down\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:-8 { + padding: -80px !important; + } + + .px-md\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-md\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-md\:-8 { + padding-top: -80px !important; + } + + .pb-md\:-8 { + padding-bottom: -80px !important; + } + + .pl-md\:-8 { + padding-left: -80px !important; + } + + .pr-md\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:-8 { + padding: -80px !important; + } + + .px-md-up\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-md-up\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-md-up\:-8 { + padding-top: -80px !important; + } + + .pb-md-up\:-8 { + padding-bottom: -80px !important; + } + + .pl-md-up\:-8 { + padding-left: -80px !important; + } + + .pr-md-up\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:-8 { + padding: -80px !important; + } + + .px-lg-down\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-lg-down\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-lg-down\:-8 { + padding-top: -80px !important; + } + + .pb-lg-down\:-8 { + padding-bottom: -80px !important; + } + + .pl-lg-down\:-8 { + padding-left: -80px !important; + } + + .pr-lg-down\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:-8 { + padding: -80px !important; + } + + .px-lg\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-lg\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-lg\:-8 { + padding-top: -80px !important; + } + + .pb-lg\:-8 { + padding-bottom: -80px !important; + } + + .pl-lg\:-8 { + padding-left: -80px !important; + } + + .pr-lg\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:-8 { + padding: -80px !important; + } + + .px-lg-up\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-lg-up\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-lg-up\:-8 { + padding-top: -80px !important; + } + + .pb-lg-up\:-8 { + padding-bottom: -80px !important; + } + + .pl-lg-up\:-8 { + padding-left: -80px !important; + } + + .pr-lg-up\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:-8 { + padding: -80px !important; + } + + .px-xl-down\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-xl-down\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-xl-down\:-8 { + padding-top: -80px !important; + } + + .pb-xl-down\:-8 { + padding-bottom: -80px !important; + } + + .pl-xl-down\:-8 { + padding-left: -80px !important; + } + + .pr-xl-down\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:-8 { + padding: -80px !important; + } + + .px-xl\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-xl\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-xl\:-8 { + padding-top: -80px !important; + } + + .pb-xl\:-8 { + padding-bottom: -80px !important; + } + + .pl-xl\:-8 { + padding-left: -80px !important; + } + + .pr-xl\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:-8 { + padding: -80px !important; + } + + .px-xl-up\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-xl-up\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-xl-up\:-8 { + padding-top: -80px !important; + } + + .pb-xl-up\:-8 { + padding-bottom: -80px !important; + } + + .pl-xl-up\:-8 { + padding-left: -80px !important; + } + + .pr-xl-up\:-8 { + padding-right: -80px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:-8 { + padding: -80px !important; + } + + .px-xxl\:-8 { + padding-left: -80px !important; + padding-right: -80px !important; + } + + .py-xxl\:-8 { + padding-top: -80px !important; + padding-bottom: -80px !important; + } + + .pt-xxl\:-8 { + padding-top: -80px !important; + } + + .pb-xxl\:-8 { + padding-bottom: -80px !important; + } + + .pl-xxl\:-8 { + padding-left: -80px !important; + } + + .pr-xxl\:-8 { + padding-right: -80px !important; + } +} +.p\:-9 { + padding: -90px !important; +} + +.px\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; +} + +.py\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; +} + +.pt\:-9 { + padding-top: -90px !important; +} + +.pb\:-9 { + padding-bottom: -90px !important; +} + +.pl\:-9 { + padding-left: -90px !important; +} + +.pr\:-9 { + padding-right: -90px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:-9 { + padding: -90px !important; + } + + .px-xs\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-xs\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-xs\:-9 { + padding-top: -90px !important; + } + + .pb-xs\:-9 { + padding-bottom: -90px !important; + } + + .pl-xs\:-9 { + padding-left: -90px !important; + } + + .pr-xs\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:-9 { + padding: -90px !important; + } + + .px-sm-down\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-sm-down\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-sm-down\:-9 { + padding-top: -90px !important; + } + + .pb-sm-down\:-9 { + padding-bottom: -90px !important; + } + + .pl-sm-down\:-9 { + padding-left: -90px !important; + } + + .pr-sm-down\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:-9 { + padding: -90px !important; + } + + .px-sm\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-sm\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-sm\:-9 { + padding-top: -90px !important; + } + + .pb-sm\:-9 { + padding-bottom: -90px !important; + } + + .pl-sm\:-9 { + padding-left: -90px !important; + } + + .pr-sm\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:-9 { + padding: -90px !important; + } + + .px-sm-up\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-sm-up\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-sm-up\:-9 { + padding-top: -90px !important; + } + + .pb-sm-up\:-9 { + padding-bottom: -90px !important; + } + + .pl-sm-up\:-9 { + padding-left: -90px !important; + } + + .pr-sm-up\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:-9 { + padding: -90px !important; + } + + .px-md-down\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-md-down\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-md-down\:-9 { + padding-top: -90px !important; + } + + .pb-md-down\:-9 { + padding-bottom: -90px !important; + } + + .pl-md-down\:-9 { + padding-left: -90px !important; + } + + .pr-md-down\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:-9 { + padding: -90px !important; + } + + .px-md\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-md\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-md\:-9 { + padding-top: -90px !important; + } + + .pb-md\:-9 { + padding-bottom: -90px !important; + } + + .pl-md\:-9 { + padding-left: -90px !important; + } + + .pr-md\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:-9 { + padding: -90px !important; + } + + .px-md-up\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-md-up\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-md-up\:-9 { + padding-top: -90px !important; + } + + .pb-md-up\:-9 { + padding-bottom: -90px !important; + } + + .pl-md-up\:-9 { + padding-left: -90px !important; + } + + .pr-md-up\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:-9 { + padding: -90px !important; + } + + .px-lg-down\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-lg-down\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-lg-down\:-9 { + padding-top: -90px !important; + } + + .pb-lg-down\:-9 { + padding-bottom: -90px !important; + } + + .pl-lg-down\:-9 { + padding-left: -90px !important; + } + + .pr-lg-down\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:-9 { + padding: -90px !important; + } + + .px-lg\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-lg\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-lg\:-9 { + padding-top: -90px !important; + } + + .pb-lg\:-9 { + padding-bottom: -90px !important; + } + + .pl-lg\:-9 { + padding-left: -90px !important; + } + + .pr-lg\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:-9 { + padding: -90px !important; + } + + .px-lg-up\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-lg-up\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-lg-up\:-9 { + padding-top: -90px !important; + } + + .pb-lg-up\:-9 { + padding-bottom: -90px !important; + } + + .pl-lg-up\:-9 { + padding-left: -90px !important; + } + + .pr-lg-up\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:-9 { + padding: -90px !important; + } + + .px-xl-down\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-xl-down\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-xl-down\:-9 { + padding-top: -90px !important; + } + + .pb-xl-down\:-9 { + padding-bottom: -90px !important; + } + + .pl-xl-down\:-9 { + padding-left: -90px !important; + } + + .pr-xl-down\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:-9 { + padding: -90px !important; + } + + .px-xl\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-xl\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-xl\:-9 { + padding-top: -90px !important; + } + + .pb-xl\:-9 { + padding-bottom: -90px !important; + } + + .pl-xl\:-9 { + padding-left: -90px !important; + } + + .pr-xl\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:-9 { + padding: -90px !important; + } + + .px-xl-up\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-xl-up\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-xl-up\:-9 { + padding-top: -90px !important; + } + + .pb-xl-up\:-9 { + padding-bottom: -90px !important; + } + + .pl-xl-up\:-9 { + padding-left: -90px !important; + } + + .pr-xl-up\:-9 { + padding-right: -90px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:-9 { + padding: -90px !important; + } + + .px-xxl\:-9 { + padding-left: -90px !important; + padding-right: -90px !important; + } + + .py-xxl\:-9 { + padding-top: -90px !important; + padding-bottom: -90px !important; + } + + .pt-xxl\:-9 { + padding-top: -90px !important; + } + + .pb-xxl\:-9 { + padding-bottom: -90px !important; + } + + .pl-xxl\:-9 { + padding-left: -90px !important; + } + + .pr-xxl\:-9 { + padding-right: -90px !important; + } +} +.p\:-10 { + padding: -100px !important; +} + +.px\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; +} + +.py\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; +} + +.pt\:-10 { + padding-top: -100px !important; +} + +.pb\:-10 { + padding-bottom: -100px !important; +} + +.pl\:-10 { + padding-left: -100px !important; +} + +.pr\:-10 { + padding-right: -100px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:-10 { + padding: -100px !important; + } + + .px-xs\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-xs\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-xs\:-10 { + padding-top: -100px !important; + } + + .pb-xs\:-10 { + padding-bottom: -100px !important; + } + + .pl-xs\:-10 { + padding-left: -100px !important; + } + + .pr-xs\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:-10 { + padding: -100px !important; + } + + .px-sm-down\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-sm-down\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-sm-down\:-10 { + padding-top: -100px !important; + } + + .pb-sm-down\:-10 { + padding-bottom: -100px !important; + } + + .pl-sm-down\:-10 { + padding-left: -100px !important; + } + + .pr-sm-down\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:-10 { + padding: -100px !important; + } + + .px-sm\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-sm\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-sm\:-10 { + padding-top: -100px !important; + } + + .pb-sm\:-10 { + padding-bottom: -100px !important; + } + + .pl-sm\:-10 { + padding-left: -100px !important; + } + + .pr-sm\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:-10 { + padding: -100px !important; + } + + .px-sm-up\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-sm-up\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-sm-up\:-10 { + padding-top: -100px !important; + } + + .pb-sm-up\:-10 { + padding-bottom: -100px !important; + } + + .pl-sm-up\:-10 { + padding-left: -100px !important; + } + + .pr-sm-up\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:-10 { + padding: -100px !important; + } + + .px-md-down\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-md-down\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-md-down\:-10 { + padding-top: -100px !important; + } + + .pb-md-down\:-10 { + padding-bottom: -100px !important; + } + + .pl-md-down\:-10 { + padding-left: -100px !important; + } + + .pr-md-down\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:-10 { + padding: -100px !important; + } + + .px-md\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-md\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-md\:-10 { + padding-top: -100px !important; + } + + .pb-md\:-10 { + padding-bottom: -100px !important; + } + + .pl-md\:-10 { + padding-left: -100px !important; + } + + .pr-md\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:-10 { + padding: -100px !important; + } + + .px-md-up\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-md-up\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-md-up\:-10 { + padding-top: -100px !important; + } + + .pb-md-up\:-10 { + padding-bottom: -100px !important; + } + + .pl-md-up\:-10 { + padding-left: -100px !important; + } + + .pr-md-up\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:-10 { + padding: -100px !important; + } + + .px-lg-down\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-lg-down\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-lg-down\:-10 { + padding-top: -100px !important; + } + + .pb-lg-down\:-10 { + padding-bottom: -100px !important; + } + + .pl-lg-down\:-10 { + padding-left: -100px !important; + } + + .pr-lg-down\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:-10 { + padding: -100px !important; + } + + .px-lg\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-lg\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-lg\:-10 { + padding-top: -100px !important; + } + + .pb-lg\:-10 { + padding-bottom: -100px !important; + } + + .pl-lg\:-10 { + padding-left: -100px !important; + } + + .pr-lg\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:-10 { + padding: -100px !important; + } + + .px-lg-up\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-lg-up\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-lg-up\:-10 { + padding-top: -100px !important; + } + + .pb-lg-up\:-10 { + padding-bottom: -100px !important; + } + + .pl-lg-up\:-10 { + padding-left: -100px !important; + } + + .pr-lg-up\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:-10 { + padding: -100px !important; + } + + .px-xl-down\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-xl-down\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-xl-down\:-10 { + padding-top: -100px !important; + } + + .pb-xl-down\:-10 { + padding-bottom: -100px !important; + } + + .pl-xl-down\:-10 { + padding-left: -100px !important; + } + + .pr-xl-down\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:-10 { + padding: -100px !important; + } + + .px-xl\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-xl\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-xl\:-10 { + padding-top: -100px !important; + } + + .pb-xl\:-10 { + padding-bottom: -100px !important; + } + + .pl-xl\:-10 { + padding-left: -100px !important; + } + + .pr-xl\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:-10 { + padding: -100px !important; + } + + .px-xl-up\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-xl-up\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-xl-up\:-10 { + padding-top: -100px !important; + } + + .pb-xl-up\:-10 { + padding-bottom: -100px !important; + } + + .pl-xl-up\:-10 { + padding-left: -100px !important; + } + + .pr-xl-up\:-10 { + padding-right: -100px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:-10 { + padding: -100px !important; + } + + .px-xxl\:-10 { + padding-left: -100px !important; + padding-right: -100px !important; + } + + .py-xxl\:-10 { + padding-top: -100px !important; + padding-bottom: -100px !important; + } + + .pt-xxl\:-10 { + padding-top: -100px !important; + } + + .pb-xxl\:-10 { + padding-bottom: -100px !important; + } + + .pl-xxl\:-10 { + padding-left: -100px !important; + } + + .pr-xxl\:-10 { + padding-right: -100px !important; + } +} +.p\:0 { + padding: 0 !important; +} + +.px\:0 { + padding-left: 0 !important; + padding-right: 0 !important; +} + +.py\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; +} + +.pt\:0 { + padding-top: 0 !important; +} + +.pb\:0 { + padding-bottom: 0 !important; +} + +.pl\:0 { + padding-left: 0 !important; +} + +.pr\:0 { + padding-right: 0 !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:0 { + padding: 0 !important; + } + + .px-xs\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-xs\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-xs\:0 { + padding-top: 0 !important; + } + + .pb-xs\:0 { + padding-bottom: 0 !important; + } + + .pl-xs\:0 { + padding-left: 0 !important; + } + + .pr-xs\:0 { + padding-right: 0 !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:0 { + padding: 0 !important; + } + + .px-sm-down\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-sm-down\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-sm-down\:0 { + padding-top: 0 !important; + } + + .pb-sm-down\:0 { + padding-bottom: 0 !important; + } + + .pl-sm-down\:0 { + padding-left: 0 !important; + } + + .pr-sm-down\:0 { + padding-right: 0 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:0 { + padding: 0 !important; + } + + .px-sm\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-sm\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-sm\:0 { + padding-top: 0 !important; + } + + .pb-sm\:0 { + padding-bottom: 0 !important; + } + + .pl-sm\:0 { + padding-left: 0 !important; + } + + .pr-sm\:0 { + padding-right: 0 !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:0 { + padding: 0 !important; + } + + .px-sm-up\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-sm-up\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-sm-up\:0 { + padding-top: 0 !important; + } + + .pb-sm-up\:0 { + padding-bottom: 0 !important; + } + + .pl-sm-up\:0 { + padding-left: 0 !important; + } + + .pr-sm-up\:0 { + padding-right: 0 !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:0 { + padding: 0 !important; + } + + .px-md-down\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-md-down\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-md-down\:0 { + padding-top: 0 !important; + } + + .pb-md-down\:0 { + padding-bottom: 0 !important; + } + + .pl-md-down\:0 { + padding-left: 0 !important; + } + + .pr-md-down\:0 { + padding-right: 0 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:0 { + padding: 0 !important; + } + + .px-md\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-md\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-md\:0 { + padding-top: 0 !important; + } + + .pb-md\:0 { + padding-bottom: 0 !important; + } + + .pl-md\:0 { + padding-left: 0 !important; + } + + .pr-md\:0 { + padding-right: 0 !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:0 { + padding: 0 !important; + } + + .px-md-up\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-md-up\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-md-up\:0 { + padding-top: 0 !important; + } + + .pb-md-up\:0 { + padding-bottom: 0 !important; + } + + .pl-md-up\:0 { + padding-left: 0 !important; + } + + .pr-md-up\:0 { + padding-right: 0 !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:0 { + padding: 0 !important; + } + + .px-lg-down\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-lg-down\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-lg-down\:0 { + padding-top: 0 !important; + } + + .pb-lg-down\:0 { + padding-bottom: 0 !important; + } + + .pl-lg-down\:0 { + padding-left: 0 !important; + } + + .pr-lg-down\:0 { + padding-right: 0 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:0 { + padding: 0 !important; + } + + .px-lg\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-lg\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-lg\:0 { + padding-top: 0 !important; + } + + .pb-lg\:0 { + padding-bottom: 0 !important; + } + + .pl-lg\:0 { + padding-left: 0 !important; + } + + .pr-lg\:0 { + padding-right: 0 !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:0 { + padding: 0 !important; + } + + .px-lg-up\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-lg-up\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-lg-up\:0 { + padding-top: 0 !important; + } + + .pb-lg-up\:0 { + padding-bottom: 0 !important; + } + + .pl-lg-up\:0 { + padding-left: 0 !important; + } + + .pr-lg-up\:0 { + padding-right: 0 !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:0 { + padding: 0 !important; + } + + .px-xl-down\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-xl-down\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-xl-down\:0 { + padding-top: 0 !important; + } + + .pb-xl-down\:0 { + padding-bottom: 0 !important; + } + + .pl-xl-down\:0 { + padding-left: 0 !important; + } + + .pr-xl-down\:0 { + padding-right: 0 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:0 { + padding: 0 !important; + } + + .px-xl\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-xl\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-xl\:0 { + padding-top: 0 !important; + } + + .pb-xl\:0 { + padding-bottom: 0 !important; + } + + .pl-xl\:0 { + padding-left: 0 !important; + } + + .pr-xl\:0 { + padding-right: 0 !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:0 { + padding: 0 !important; + } + + .px-xl-up\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-xl-up\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-xl-up\:0 { + padding-top: 0 !important; + } + + .pb-xl-up\:0 { + padding-bottom: 0 !important; + } + + .pl-xl-up\:0 { + padding-left: 0 !important; + } + + .pr-xl-up\:0 { + padding-right: 0 !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:0 { + padding: 0 !important; + } + + .px-xxl\:0 { + padding-left: 0 !important; + padding-right: 0 !important; + } + + .py-xxl\:0 { + padding-top: 0 !important; + padding-bottom: 0 !important; + } + + .pt-xxl\:0 { + padding-top: 0 !important; + } + + .pb-xxl\:0 { + padding-bottom: 0 !important; + } + + .pl-xxl\:0 { + padding-left: 0 !important; + } + + .pr-xxl\:0 { + padding-right: 0 !important; + } +} +.p\:_1 { + padding: 10px !important; +} + +.px\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; +} + +.py\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; +} + +.pt\:_1 { + padding-top: 10px !important; +} + +.pb\:_1 { + padding-bottom: 10px !important; +} + +.pl\:_1 { + padding-left: 10px !important; +} + +.pr\:_1 { + padding-right: 10px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:_1 { + padding: 10px !important; + } + + .px-xs\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-xs\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-xs\:_1 { + padding-top: 10px !important; + } + + .pb-xs\:_1 { + padding-bottom: 10px !important; + } + + .pl-xs\:_1 { + padding-left: 10px !important; + } + + .pr-xs\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:_1 { + padding: 10px !important; + } + + .px-sm-down\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-sm-down\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-sm-down\:_1 { + padding-top: 10px !important; + } + + .pb-sm-down\:_1 { + padding-bottom: 10px !important; + } + + .pl-sm-down\:_1 { + padding-left: 10px !important; + } + + .pr-sm-down\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:_1 { + padding: 10px !important; + } + + .px-sm\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-sm\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-sm\:_1 { + padding-top: 10px !important; + } + + .pb-sm\:_1 { + padding-bottom: 10px !important; + } + + .pl-sm\:_1 { + padding-left: 10px !important; + } + + .pr-sm\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:_1 { + padding: 10px !important; + } + + .px-sm-up\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-sm-up\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-sm-up\:_1 { + padding-top: 10px !important; + } + + .pb-sm-up\:_1 { + padding-bottom: 10px !important; + } + + .pl-sm-up\:_1 { + padding-left: 10px !important; + } + + .pr-sm-up\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:_1 { + padding: 10px !important; + } + + .px-md-down\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-md-down\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-md-down\:_1 { + padding-top: 10px !important; + } + + .pb-md-down\:_1 { + padding-bottom: 10px !important; + } + + .pl-md-down\:_1 { + padding-left: 10px !important; + } + + .pr-md-down\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:_1 { + padding: 10px !important; + } + + .px-md\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-md\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-md\:_1 { + padding-top: 10px !important; + } + + .pb-md\:_1 { + padding-bottom: 10px !important; + } + + .pl-md\:_1 { + padding-left: 10px !important; + } + + .pr-md\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:_1 { + padding: 10px !important; + } + + .px-md-up\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-md-up\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-md-up\:_1 { + padding-top: 10px !important; + } + + .pb-md-up\:_1 { + padding-bottom: 10px !important; + } + + .pl-md-up\:_1 { + padding-left: 10px !important; + } + + .pr-md-up\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:_1 { + padding: 10px !important; + } + + .px-lg-down\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-lg-down\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-lg-down\:_1 { + padding-top: 10px !important; + } + + .pb-lg-down\:_1 { + padding-bottom: 10px !important; + } + + .pl-lg-down\:_1 { + padding-left: 10px !important; + } + + .pr-lg-down\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:_1 { + padding: 10px !important; + } + + .px-lg\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-lg\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-lg\:_1 { + padding-top: 10px !important; + } + + .pb-lg\:_1 { + padding-bottom: 10px !important; + } + + .pl-lg\:_1 { + padding-left: 10px !important; + } + + .pr-lg\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:_1 { + padding: 10px !important; + } + + .px-lg-up\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-lg-up\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-lg-up\:_1 { + padding-top: 10px !important; + } + + .pb-lg-up\:_1 { + padding-bottom: 10px !important; + } + + .pl-lg-up\:_1 { + padding-left: 10px !important; + } + + .pr-lg-up\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:_1 { + padding: 10px !important; + } + + .px-xl-down\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-xl-down\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-xl-down\:_1 { + padding-top: 10px !important; + } + + .pb-xl-down\:_1 { + padding-bottom: 10px !important; + } + + .pl-xl-down\:_1 { + padding-left: 10px !important; + } + + .pr-xl-down\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:_1 { + padding: 10px !important; + } + + .px-xl\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-xl\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-xl\:_1 { + padding-top: 10px !important; + } + + .pb-xl\:_1 { + padding-bottom: 10px !important; + } + + .pl-xl\:_1 { + padding-left: 10px !important; + } + + .pr-xl\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:_1 { + padding: 10px !important; + } + + .px-xl-up\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-xl-up\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-xl-up\:_1 { + padding-top: 10px !important; + } + + .pb-xl-up\:_1 { + padding-bottom: 10px !important; + } + + .pl-xl-up\:_1 { + padding-left: 10px !important; + } + + .pr-xl-up\:_1 { + padding-right: 10px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:_1 { + padding: 10px !important; + } + + .px-xxl\:_1 { + padding-left: 10px !important; + padding-right: 10px !important; + } + + .py-xxl\:_1 { + padding-top: 10px !important; + padding-bottom: 10px !important; + } + + .pt-xxl\:_1 { + padding-top: 10px !important; + } + + .pb-xxl\:_1 { + padding-bottom: 10px !important; + } + + .pl-xxl\:_1 { + padding-left: 10px !important; + } + + .pr-xxl\:_1 { + padding-right: 10px !important; + } +} +.p\:_2 { + padding: 20px !important; +} + +.px\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; +} + +.py\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; +} + +.pt\:_2 { + padding-top: 20px !important; +} + +.pb\:_2 { + padding-bottom: 20px !important; +} + +.pl\:_2 { + padding-left: 20px !important; +} + +.pr\:_2 { + padding-right: 20px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:_2 { + padding: 20px !important; + } + + .px-xs\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-xs\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-xs\:_2 { + padding-top: 20px !important; + } + + .pb-xs\:_2 { + padding-bottom: 20px !important; + } + + .pl-xs\:_2 { + padding-left: 20px !important; + } + + .pr-xs\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:_2 { + padding: 20px !important; + } + + .px-sm-down\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-sm-down\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-sm-down\:_2 { + padding-top: 20px !important; + } + + .pb-sm-down\:_2 { + padding-bottom: 20px !important; + } + + .pl-sm-down\:_2 { + padding-left: 20px !important; + } + + .pr-sm-down\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:_2 { + padding: 20px !important; + } + + .px-sm\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-sm\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-sm\:_2 { + padding-top: 20px !important; + } + + .pb-sm\:_2 { + padding-bottom: 20px !important; + } + + .pl-sm\:_2 { + padding-left: 20px !important; + } + + .pr-sm\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:_2 { + padding: 20px !important; + } + + .px-sm-up\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-sm-up\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-sm-up\:_2 { + padding-top: 20px !important; + } + + .pb-sm-up\:_2 { + padding-bottom: 20px !important; + } + + .pl-sm-up\:_2 { + padding-left: 20px !important; + } + + .pr-sm-up\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:_2 { + padding: 20px !important; + } + + .px-md-down\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-md-down\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-md-down\:_2 { + padding-top: 20px !important; + } + + .pb-md-down\:_2 { + padding-bottom: 20px !important; + } + + .pl-md-down\:_2 { + padding-left: 20px !important; + } + + .pr-md-down\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:_2 { + padding: 20px !important; + } + + .px-md\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-md\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-md\:_2 { + padding-top: 20px !important; + } + + .pb-md\:_2 { + padding-bottom: 20px !important; + } + + .pl-md\:_2 { + padding-left: 20px !important; + } + + .pr-md\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:_2 { + padding: 20px !important; + } + + .px-md-up\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-md-up\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-md-up\:_2 { + padding-top: 20px !important; + } + + .pb-md-up\:_2 { + padding-bottom: 20px !important; + } + + .pl-md-up\:_2 { + padding-left: 20px !important; + } + + .pr-md-up\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:_2 { + padding: 20px !important; + } + + .px-lg-down\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-lg-down\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-lg-down\:_2 { + padding-top: 20px !important; + } + + .pb-lg-down\:_2 { + padding-bottom: 20px !important; + } + + .pl-lg-down\:_2 { + padding-left: 20px !important; + } + + .pr-lg-down\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:_2 { + padding: 20px !important; + } + + .px-lg\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-lg\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-lg\:_2 { + padding-top: 20px !important; + } + + .pb-lg\:_2 { + padding-bottom: 20px !important; + } + + .pl-lg\:_2 { + padding-left: 20px !important; + } + + .pr-lg\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:_2 { + padding: 20px !important; + } + + .px-lg-up\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-lg-up\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-lg-up\:_2 { + padding-top: 20px !important; + } + + .pb-lg-up\:_2 { + padding-bottom: 20px !important; + } + + .pl-lg-up\:_2 { + padding-left: 20px !important; + } + + .pr-lg-up\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:_2 { + padding: 20px !important; + } + + .px-xl-down\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-xl-down\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-xl-down\:_2 { + padding-top: 20px !important; + } + + .pb-xl-down\:_2 { + padding-bottom: 20px !important; + } + + .pl-xl-down\:_2 { + padding-left: 20px !important; + } + + .pr-xl-down\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:_2 { + padding: 20px !important; + } + + .px-xl\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-xl\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-xl\:_2 { + padding-top: 20px !important; + } + + .pb-xl\:_2 { + padding-bottom: 20px !important; + } + + .pl-xl\:_2 { + padding-left: 20px !important; + } + + .pr-xl\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:_2 { + padding: 20px !important; + } + + .px-xl-up\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-xl-up\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-xl-up\:_2 { + padding-top: 20px !important; + } + + .pb-xl-up\:_2 { + padding-bottom: 20px !important; + } + + .pl-xl-up\:_2 { + padding-left: 20px !important; + } + + .pr-xl-up\:_2 { + padding-right: 20px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:_2 { + padding: 20px !important; + } + + .px-xxl\:_2 { + padding-left: 20px !important; + padding-right: 20px !important; + } + + .py-xxl\:_2 { + padding-top: 20px !important; + padding-bottom: 20px !important; + } + + .pt-xxl\:_2 { + padding-top: 20px !important; + } + + .pb-xxl\:_2 { + padding-bottom: 20px !important; + } + + .pl-xxl\:_2 { + padding-left: 20px !important; + } + + .pr-xxl\:_2 { + padding-right: 20px !important; + } +} +.p\:_3 { + padding: 30px !important; +} + +.px\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; +} + +.py\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; +} + +.pt\:_3 { + padding-top: 30px !important; +} + +.pb\:_3 { + padding-bottom: 30px !important; +} + +.pl\:_3 { + padding-left: 30px !important; +} + +.pr\:_3 { + padding-right: 30px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:_3 { + padding: 30px !important; + } + + .px-xs\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-xs\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-xs\:_3 { + padding-top: 30px !important; + } + + .pb-xs\:_3 { + padding-bottom: 30px !important; + } + + .pl-xs\:_3 { + padding-left: 30px !important; + } + + .pr-xs\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:_3 { + padding: 30px !important; + } + + .px-sm-down\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-sm-down\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-sm-down\:_3 { + padding-top: 30px !important; + } + + .pb-sm-down\:_3 { + padding-bottom: 30px !important; + } + + .pl-sm-down\:_3 { + padding-left: 30px !important; + } + + .pr-sm-down\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:_3 { + padding: 30px !important; + } + + .px-sm\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-sm\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-sm\:_3 { + padding-top: 30px !important; + } + + .pb-sm\:_3 { + padding-bottom: 30px !important; + } + + .pl-sm\:_3 { + padding-left: 30px !important; + } + + .pr-sm\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:_3 { + padding: 30px !important; + } + + .px-sm-up\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-sm-up\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-sm-up\:_3 { + padding-top: 30px !important; + } + + .pb-sm-up\:_3 { + padding-bottom: 30px !important; + } + + .pl-sm-up\:_3 { + padding-left: 30px !important; + } + + .pr-sm-up\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:_3 { + padding: 30px !important; + } + + .px-md-down\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-md-down\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-md-down\:_3 { + padding-top: 30px !important; + } + + .pb-md-down\:_3 { + padding-bottom: 30px !important; + } + + .pl-md-down\:_3 { + padding-left: 30px !important; + } + + .pr-md-down\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:_3 { + padding: 30px !important; + } + + .px-md\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-md\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-md\:_3 { + padding-top: 30px !important; + } + + .pb-md\:_3 { + padding-bottom: 30px !important; + } + + .pl-md\:_3 { + padding-left: 30px !important; + } + + .pr-md\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:_3 { + padding: 30px !important; + } + + .px-md-up\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-md-up\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-md-up\:_3 { + padding-top: 30px !important; + } + + .pb-md-up\:_3 { + padding-bottom: 30px !important; + } + + .pl-md-up\:_3 { + padding-left: 30px !important; + } + + .pr-md-up\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:_3 { + padding: 30px !important; + } + + .px-lg-down\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-lg-down\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-lg-down\:_3 { + padding-top: 30px !important; + } + + .pb-lg-down\:_3 { + padding-bottom: 30px !important; + } + + .pl-lg-down\:_3 { + padding-left: 30px !important; + } + + .pr-lg-down\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:_3 { + padding: 30px !important; + } + + .px-lg\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-lg\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-lg\:_3 { + padding-top: 30px !important; + } + + .pb-lg\:_3 { + padding-bottom: 30px !important; + } + + .pl-lg\:_3 { + padding-left: 30px !important; + } + + .pr-lg\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:_3 { + padding: 30px !important; + } + + .px-lg-up\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-lg-up\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-lg-up\:_3 { + padding-top: 30px !important; + } + + .pb-lg-up\:_3 { + padding-bottom: 30px !important; + } + + .pl-lg-up\:_3 { + padding-left: 30px !important; + } + + .pr-lg-up\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:_3 { + padding: 30px !important; + } + + .px-xl-down\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-xl-down\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-xl-down\:_3 { + padding-top: 30px !important; + } + + .pb-xl-down\:_3 { + padding-bottom: 30px !important; + } + + .pl-xl-down\:_3 { + padding-left: 30px !important; + } + + .pr-xl-down\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:_3 { + padding: 30px !important; + } + + .px-xl\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-xl\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-xl\:_3 { + padding-top: 30px !important; + } + + .pb-xl\:_3 { + padding-bottom: 30px !important; + } + + .pl-xl\:_3 { + padding-left: 30px !important; + } + + .pr-xl\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:_3 { + padding: 30px !important; + } + + .px-xl-up\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-xl-up\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-xl-up\:_3 { + padding-top: 30px !important; + } + + .pb-xl-up\:_3 { + padding-bottom: 30px !important; + } + + .pl-xl-up\:_3 { + padding-left: 30px !important; + } + + .pr-xl-up\:_3 { + padding-right: 30px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:_3 { + padding: 30px !important; + } + + .px-xxl\:_3 { + padding-left: 30px !important; + padding-right: 30px !important; + } + + .py-xxl\:_3 { + padding-top: 30px !important; + padding-bottom: 30px !important; + } + + .pt-xxl\:_3 { + padding-top: 30px !important; + } + + .pb-xxl\:_3 { + padding-bottom: 30px !important; + } + + .pl-xxl\:_3 { + padding-left: 30px !important; + } + + .pr-xxl\:_3 { + padding-right: 30px !important; + } +} +.p\:_4 { + padding: 40px !important; +} + +.px\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; +} + +.py\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; +} + +.pt\:_4 { + padding-top: 40px !important; +} + +.pb\:_4 { + padding-bottom: 40px !important; +} + +.pl\:_4 { + padding-left: 40px !important; +} + +.pr\:_4 { + padding-right: 40px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:_4 { + padding: 40px !important; + } + + .px-xs\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-xs\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-xs\:_4 { + padding-top: 40px !important; + } + + .pb-xs\:_4 { + padding-bottom: 40px !important; + } + + .pl-xs\:_4 { + padding-left: 40px !important; + } + + .pr-xs\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:_4 { + padding: 40px !important; + } + + .px-sm-down\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-sm-down\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-sm-down\:_4 { + padding-top: 40px !important; + } + + .pb-sm-down\:_4 { + padding-bottom: 40px !important; + } + + .pl-sm-down\:_4 { + padding-left: 40px !important; + } + + .pr-sm-down\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:_4 { + padding: 40px !important; + } + + .px-sm\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-sm\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-sm\:_4 { + padding-top: 40px !important; + } + + .pb-sm\:_4 { + padding-bottom: 40px !important; + } + + .pl-sm\:_4 { + padding-left: 40px !important; + } + + .pr-sm\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:_4 { + padding: 40px !important; + } + + .px-sm-up\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-sm-up\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-sm-up\:_4 { + padding-top: 40px !important; + } + + .pb-sm-up\:_4 { + padding-bottom: 40px !important; + } + + .pl-sm-up\:_4 { + padding-left: 40px !important; + } + + .pr-sm-up\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:_4 { + padding: 40px !important; + } + + .px-md-down\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-md-down\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-md-down\:_4 { + padding-top: 40px !important; + } + + .pb-md-down\:_4 { + padding-bottom: 40px !important; + } + + .pl-md-down\:_4 { + padding-left: 40px !important; + } + + .pr-md-down\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:_4 { + padding: 40px !important; + } + + .px-md\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-md\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-md\:_4 { + padding-top: 40px !important; + } + + .pb-md\:_4 { + padding-bottom: 40px !important; + } + + .pl-md\:_4 { + padding-left: 40px !important; + } + + .pr-md\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:_4 { + padding: 40px !important; + } + + .px-md-up\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-md-up\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-md-up\:_4 { + padding-top: 40px !important; + } + + .pb-md-up\:_4 { + padding-bottom: 40px !important; + } + + .pl-md-up\:_4 { + padding-left: 40px !important; + } + + .pr-md-up\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:_4 { + padding: 40px !important; + } + + .px-lg-down\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-lg-down\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-lg-down\:_4 { + padding-top: 40px !important; + } + + .pb-lg-down\:_4 { + padding-bottom: 40px !important; + } + + .pl-lg-down\:_4 { + padding-left: 40px !important; + } + + .pr-lg-down\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:_4 { + padding: 40px !important; + } + + .px-lg\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-lg\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-lg\:_4 { + padding-top: 40px !important; + } + + .pb-lg\:_4 { + padding-bottom: 40px !important; + } + + .pl-lg\:_4 { + padding-left: 40px !important; + } + + .pr-lg\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:_4 { + padding: 40px !important; + } + + .px-lg-up\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-lg-up\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-lg-up\:_4 { + padding-top: 40px !important; + } + + .pb-lg-up\:_4 { + padding-bottom: 40px !important; + } + + .pl-lg-up\:_4 { + padding-left: 40px !important; + } + + .pr-lg-up\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:_4 { + padding: 40px !important; + } + + .px-xl-down\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-xl-down\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-xl-down\:_4 { + padding-top: 40px !important; + } + + .pb-xl-down\:_4 { + padding-bottom: 40px !important; + } + + .pl-xl-down\:_4 { + padding-left: 40px !important; + } + + .pr-xl-down\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:_4 { + padding: 40px !important; + } + + .px-xl\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-xl\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-xl\:_4 { + padding-top: 40px !important; + } + + .pb-xl\:_4 { + padding-bottom: 40px !important; + } + + .pl-xl\:_4 { + padding-left: 40px !important; + } + + .pr-xl\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:_4 { + padding: 40px !important; + } + + .px-xl-up\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-xl-up\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-xl-up\:_4 { + padding-top: 40px !important; + } + + .pb-xl-up\:_4 { + padding-bottom: 40px !important; + } + + .pl-xl-up\:_4 { + padding-left: 40px !important; + } + + .pr-xl-up\:_4 { + padding-right: 40px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:_4 { + padding: 40px !important; + } + + .px-xxl\:_4 { + padding-left: 40px !important; + padding-right: 40px !important; + } + + .py-xxl\:_4 { + padding-top: 40px !important; + padding-bottom: 40px !important; + } + + .pt-xxl\:_4 { + padding-top: 40px !important; + } + + .pb-xxl\:_4 { + padding-bottom: 40px !important; + } + + .pl-xxl\:_4 { + padding-left: 40px !important; + } + + .pr-xxl\:_4 { + padding-right: 40px !important; + } +} +.p\:_5 { + padding: 50px !important; +} + +.px\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; +} + +.py\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; +} + +.pt\:_5 { + padding-top: 50px !important; +} + +.pb\:_5 { + padding-bottom: 50px !important; +} + +.pl\:_5 { + padding-left: 50px !important; +} + +.pr\:_5 { + padding-right: 50px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:_5 { + padding: 50px !important; + } + + .px-xs\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-xs\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-xs\:_5 { + padding-top: 50px !important; + } + + .pb-xs\:_5 { + padding-bottom: 50px !important; + } + + .pl-xs\:_5 { + padding-left: 50px !important; + } + + .pr-xs\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:_5 { + padding: 50px !important; + } + + .px-sm-down\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-sm-down\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-sm-down\:_5 { + padding-top: 50px !important; + } + + .pb-sm-down\:_5 { + padding-bottom: 50px !important; + } + + .pl-sm-down\:_5 { + padding-left: 50px !important; + } + + .pr-sm-down\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:_5 { + padding: 50px !important; + } + + .px-sm\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-sm\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-sm\:_5 { + padding-top: 50px !important; + } + + .pb-sm\:_5 { + padding-bottom: 50px !important; + } + + .pl-sm\:_5 { + padding-left: 50px !important; + } + + .pr-sm\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:_5 { + padding: 50px !important; + } + + .px-sm-up\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-sm-up\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-sm-up\:_5 { + padding-top: 50px !important; + } + + .pb-sm-up\:_5 { + padding-bottom: 50px !important; + } + + .pl-sm-up\:_5 { + padding-left: 50px !important; + } + + .pr-sm-up\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:_5 { + padding: 50px !important; + } + + .px-md-down\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-md-down\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-md-down\:_5 { + padding-top: 50px !important; + } + + .pb-md-down\:_5 { + padding-bottom: 50px !important; + } + + .pl-md-down\:_5 { + padding-left: 50px !important; + } + + .pr-md-down\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:_5 { + padding: 50px !important; + } + + .px-md\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-md\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-md\:_5 { + padding-top: 50px !important; + } + + .pb-md\:_5 { + padding-bottom: 50px !important; + } + + .pl-md\:_5 { + padding-left: 50px !important; + } + + .pr-md\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:_5 { + padding: 50px !important; + } + + .px-md-up\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-md-up\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-md-up\:_5 { + padding-top: 50px !important; + } + + .pb-md-up\:_5 { + padding-bottom: 50px !important; + } + + .pl-md-up\:_5 { + padding-left: 50px !important; + } + + .pr-md-up\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:_5 { + padding: 50px !important; + } + + .px-lg-down\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-lg-down\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-lg-down\:_5 { + padding-top: 50px !important; + } + + .pb-lg-down\:_5 { + padding-bottom: 50px !important; + } + + .pl-lg-down\:_5 { + padding-left: 50px !important; + } + + .pr-lg-down\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:_5 { + padding: 50px !important; + } + + .px-lg\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-lg\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-lg\:_5 { + padding-top: 50px !important; + } + + .pb-lg\:_5 { + padding-bottom: 50px !important; + } + + .pl-lg\:_5 { + padding-left: 50px !important; + } + + .pr-lg\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:_5 { + padding: 50px !important; + } + + .px-lg-up\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-lg-up\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-lg-up\:_5 { + padding-top: 50px !important; + } + + .pb-lg-up\:_5 { + padding-bottom: 50px !important; + } + + .pl-lg-up\:_5 { + padding-left: 50px !important; + } + + .pr-lg-up\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:_5 { + padding: 50px !important; + } + + .px-xl-down\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-xl-down\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-xl-down\:_5 { + padding-top: 50px !important; + } + + .pb-xl-down\:_5 { + padding-bottom: 50px !important; + } + + .pl-xl-down\:_5 { + padding-left: 50px !important; + } + + .pr-xl-down\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:_5 { + padding: 50px !important; + } + + .px-xl\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-xl\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-xl\:_5 { + padding-top: 50px !important; + } + + .pb-xl\:_5 { + padding-bottom: 50px !important; + } + + .pl-xl\:_5 { + padding-left: 50px !important; + } + + .pr-xl\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:_5 { + padding: 50px !important; + } + + .px-xl-up\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-xl-up\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-xl-up\:_5 { + padding-top: 50px !important; + } + + .pb-xl-up\:_5 { + padding-bottom: 50px !important; + } + + .pl-xl-up\:_5 { + padding-left: 50px !important; + } + + .pr-xl-up\:_5 { + padding-right: 50px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:_5 { + padding: 50px !important; + } + + .px-xxl\:_5 { + padding-left: 50px !important; + padding-right: 50px !important; + } + + .py-xxl\:_5 { + padding-top: 50px !important; + padding-bottom: 50px !important; + } + + .pt-xxl\:_5 { + padding-top: 50px !important; + } + + .pb-xxl\:_5 { + padding-bottom: 50px !important; + } + + .pl-xxl\:_5 { + padding-left: 50px !important; + } + + .pr-xxl\:_5 { + padding-right: 50px !important; + } +} +.p\:_6 { + padding: 60px !important; +} + +.px\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; +} + +.py\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; +} + +.pt\:_6 { + padding-top: 60px !important; +} + +.pb\:_6 { + padding-bottom: 60px !important; +} + +.pl\:_6 { + padding-left: 60px !important; +} + +.pr\:_6 { + padding-right: 60px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:_6 { + padding: 60px !important; + } + + .px-xs\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-xs\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-xs\:_6 { + padding-top: 60px !important; + } + + .pb-xs\:_6 { + padding-bottom: 60px !important; + } + + .pl-xs\:_6 { + padding-left: 60px !important; + } + + .pr-xs\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:_6 { + padding: 60px !important; + } + + .px-sm-down\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-sm-down\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-sm-down\:_6 { + padding-top: 60px !important; + } + + .pb-sm-down\:_6 { + padding-bottom: 60px !important; + } + + .pl-sm-down\:_6 { + padding-left: 60px !important; + } + + .pr-sm-down\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:_6 { + padding: 60px !important; + } + + .px-sm\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-sm\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-sm\:_6 { + padding-top: 60px !important; + } + + .pb-sm\:_6 { + padding-bottom: 60px !important; + } + + .pl-sm\:_6 { + padding-left: 60px !important; + } + + .pr-sm\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:_6 { + padding: 60px !important; + } + + .px-sm-up\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-sm-up\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-sm-up\:_6 { + padding-top: 60px !important; + } + + .pb-sm-up\:_6 { + padding-bottom: 60px !important; + } + + .pl-sm-up\:_6 { + padding-left: 60px !important; + } + + .pr-sm-up\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:_6 { + padding: 60px !important; + } + + .px-md-down\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-md-down\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-md-down\:_6 { + padding-top: 60px !important; + } + + .pb-md-down\:_6 { + padding-bottom: 60px !important; + } + + .pl-md-down\:_6 { + padding-left: 60px !important; + } + + .pr-md-down\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:_6 { + padding: 60px !important; + } + + .px-md\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-md\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-md\:_6 { + padding-top: 60px !important; + } + + .pb-md\:_6 { + padding-bottom: 60px !important; + } + + .pl-md\:_6 { + padding-left: 60px !important; + } + + .pr-md\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:_6 { + padding: 60px !important; + } + + .px-md-up\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-md-up\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-md-up\:_6 { + padding-top: 60px !important; + } + + .pb-md-up\:_6 { + padding-bottom: 60px !important; + } + + .pl-md-up\:_6 { + padding-left: 60px !important; + } + + .pr-md-up\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:_6 { + padding: 60px !important; + } + + .px-lg-down\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-lg-down\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-lg-down\:_6 { + padding-top: 60px !important; + } + + .pb-lg-down\:_6 { + padding-bottom: 60px !important; + } + + .pl-lg-down\:_6 { + padding-left: 60px !important; + } + + .pr-lg-down\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:_6 { + padding: 60px !important; + } + + .px-lg\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-lg\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-lg\:_6 { + padding-top: 60px !important; + } + + .pb-lg\:_6 { + padding-bottom: 60px !important; + } + + .pl-lg\:_6 { + padding-left: 60px !important; + } + + .pr-lg\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:_6 { + padding: 60px !important; + } + + .px-lg-up\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-lg-up\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-lg-up\:_6 { + padding-top: 60px !important; + } + + .pb-lg-up\:_6 { + padding-bottom: 60px !important; + } + + .pl-lg-up\:_6 { + padding-left: 60px !important; + } + + .pr-lg-up\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:_6 { + padding: 60px !important; + } + + .px-xl-down\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-xl-down\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-xl-down\:_6 { + padding-top: 60px !important; + } + + .pb-xl-down\:_6 { + padding-bottom: 60px !important; + } + + .pl-xl-down\:_6 { + padding-left: 60px !important; + } + + .pr-xl-down\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:_6 { + padding: 60px !important; + } + + .px-xl\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-xl\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-xl\:_6 { + padding-top: 60px !important; + } + + .pb-xl\:_6 { + padding-bottom: 60px !important; + } + + .pl-xl\:_6 { + padding-left: 60px !important; + } + + .pr-xl\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:_6 { + padding: 60px !important; + } + + .px-xl-up\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-xl-up\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-xl-up\:_6 { + padding-top: 60px !important; + } + + .pb-xl-up\:_6 { + padding-bottom: 60px !important; + } + + .pl-xl-up\:_6 { + padding-left: 60px !important; + } + + .pr-xl-up\:_6 { + padding-right: 60px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:_6 { + padding: 60px !important; + } + + .px-xxl\:_6 { + padding-left: 60px !important; + padding-right: 60px !important; + } + + .py-xxl\:_6 { + padding-top: 60px !important; + padding-bottom: 60px !important; + } + + .pt-xxl\:_6 { + padding-top: 60px !important; + } + + .pb-xxl\:_6 { + padding-bottom: 60px !important; + } + + .pl-xxl\:_6 { + padding-left: 60px !important; + } + + .pr-xxl\:_6 { + padding-right: 60px !important; + } +} +.p\:_7 { + padding: 70px !important; +} + +.px\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; +} + +.py\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; +} + +.pt\:_7 { + padding-top: 70px !important; +} + +.pb\:_7 { + padding-bottom: 70px !important; +} + +.pl\:_7 { + padding-left: 70px !important; +} + +.pr\:_7 { + padding-right: 70px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:_7 { + padding: 70px !important; + } + + .px-xs\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-xs\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-xs\:_7 { + padding-top: 70px !important; + } + + .pb-xs\:_7 { + padding-bottom: 70px !important; + } + + .pl-xs\:_7 { + padding-left: 70px !important; + } + + .pr-xs\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:_7 { + padding: 70px !important; + } + + .px-sm-down\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-sm-down\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-sm-down\:_7 { + padding-top: 70px !important; + } + + .pb-sm-down\:_7 { + padding-bottom: 70px !important; + } + + .pl-sm-down\:_7 { + padding-left: 70px !important; + } + + .pr-sm-down\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:_7 { + padding: 70px !important; + } + + .px-sm\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-sm\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-sm\:_7 { + padding-top: 70px !important; + } + + .pb-sm\:_7 { + padding-bottom: 70px !important; + } + + .pl-sm\:_7 { + padding-left: 70px !important; + } + + .pr-sm\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:_7 { + padding: 70px !important; + } + + .px-sm-up\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-sm-up\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-sm-up\:_7 { + padding-top: 70px !important; + } + + .pb-sm-up\:_7 { + padding-bottom: 70px !important; + } + + .pl-sm-up\:_7 { + padding-left: 70px !important; + } + + .pr-sm-up\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:_7 { + padding: 70px !important; + } + + .px-md-down\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-md-down\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-md-down\:_7 { + padding-top: 70px !important; + } + + .pb-md-down\:_7 { + padding-bottom: 70px !important; + } + + .pl-md-down\:_7 { + padding-left: 70px !important; + } + + .pr-md-down\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:_7 { + padding: 70px !important; + } + + .px-md\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-md\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-md\:_7 { + padding-top: 70px !important; + } + + .pb-md\:_7 { + padding-bottom: 70px !important; + } + + .pl-md\:_7 { + padding-left: 70px !important; + } + + .pr-md\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:_7 { + padding: 70px !important; + } + + .px-md-up\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-md-up\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-md-up\:_7 { + padding-top: 70px !important; + } + + .pb-md-up\:_7 { + padding-bottom: 70px !important; + } + + .pl-md-up\:_7 { + padding-left: 70px !important; + } + + .pr-md-up\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:_7 { + padding: 70px !important; + } + + .px-lg-down\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-lg-down\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-lg-down\:_7 { + padding-top: 70px !important; + } + + .pb-lg-down\:_7 { + padding-bottom: 70px !important; + } + + .pl-lg-down\:_7 { + padding-left: 70px !important; + } + + .pr-lg-down\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:_7 { + padding: 70px !important; + } + + .px-lg\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-lg\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-lg\:_7 { + padding-top: 70px !important; + } + + .pb-lg\:_7 { + padding-bottom: 70px !important; + } + + .pl-lg\:_7 { + padding-left: 70px !important; + } + + .pr-lg\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:_7 { + padding: 70px !important; + } + + .px-lg-up\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-lg-up\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-lg-up\:_7 { + padding-top: 70px !important; + } + + .pb-lg-up\:_7 { + padding-bottom: 70px !important; + } + + .pl-lg-up\:_7 { + padding-left: 70px !important; + } + + .pr-lg-up\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:_7 { + padding: 70px !important; + } + + .px-xl-down\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-xl-down\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-xl-down\:_7 { + padding-top: 70px !important; + } + + .pb-xl-down\:_7 { + padding-bottom: 70px !important; + } + + .pl-xl-down\:_7 { + padding-left: 70px !important; + } + + .pr-xl-down\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:_7 { + padding: 70px !important; + } + + .px-xl\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-xl\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-xl\:_7 { + padding-top: 70px !important; + } + + .pb-xl\:_7 { + padding-bottom: 70px !important; + } + + .pl-xl\:_7 { + padding-left: 70px !important; + } + + .pr-xl\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:_7 { + padding: 70px !important; + } + + .px-xl-up\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-xl-up\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-xl-up\:_7 { + padding-top: 70px !important; + } + + .pb-xl-up\:_7 { + padding-bottom: 70px !important; + } + + .pl-xl-up\:_7 { + padding-left: 70px !important; + } + + .pr-xl-up\:_7 { + padding-right: 70px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:_7 { + padding: 70px !important; + } + + .px-xxl\:_7 { + padding-left: 70px !important; + padding-right: 70px !important; + } + + .py-xxl\:_7 { + padding-top: 70px !important; + padding-bottom: 70px !important; + } + + .pt-xxl\:_7 { + padding-top: 70px !important; + } + + .pb-xxl\:_7 { + padding-bottom: 70px !important; + } + + .pl-xxl\:_7 { + padding-left: 70px !important; + } + + .pr-xxl\:_7 { + padding-right: 70px !important; + } +} +.p\:_8 { + padding: 80px !important; +} + +.px\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; +} + +.py\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; +} + +.pt\:_8 { + padding-top: 80px !important; +} + +.pb\:_8 { + padding-bottom: 80px !important; +} + +.pl\:_8 { + padding-left: 80px !important; +} + +.pr\:_8 { + padding-right: 80px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:_8 { + padding: 80px !important; + } + + .px-xs\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-xs\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-xs\:_8 { + padding-top: 80px !important; + } + + .pb-xs\:_8 { + padding-bottom: 80px !important; + } + + .pl-xs\:_8 { + padding-left: 80px !important; + } + + .pr-xs\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:_8 { + padding: 80px !important; + } + + .px-sm-down\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-sm-down\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-sm-down\:_8 { + padding-top: 80px !important; + } + + .pb-sm-down\:_8 { + padding-bottom: 80px !important; + } + + .pl-sm-down\:_8 { + padding-left: 80px !important; + } + + .pr-sm-down\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:_8 { + padding: 80px !important; + } + + .px-sm\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-sm\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-sm\:_8 { + padding-top: 80px !important; + } + + .pb-sm\:_8 { + padding-bottom: 80px !important; + } + + .pl-sm\:_8 { + padding-left: 80px !important; + } + + .pr-sm\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:_8 { + padding: 80px !important; + } + + .px-sm-up\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-sm-up\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-sm-up\:_8 { + padding-top: 80px !important; + } + + .pb-sm-up\:_8 { + padding-bottom: 80px !important; + } + + .pl-sm-up\:_8 { + padding-left: 80px !important; + } + + .pr-sm-up\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:_8 { + padding: 80px !important; + } + + .px-md-down\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-md-down\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-md-down\:_8 { + padding-top: 80px !important; + } + + .pb-md-down\:_8 { + padding-bottom: 80px !important; + } + + .pl-md-down\:_8 { + padding-left: 80px !important; + } + + .pr-md-down\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:_8 { + padding: 80px !important; + } + + .px-md\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-md\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-md\:_8 { + padding-top: 80px !important; + } + + .pb-md\:_8 { + padding-bottom: 80px !important; + } + + .pl-md\:_8 { + padding-left: 80px !important; + } + + .pr-md\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:_8 { + padding: 80px !important; + } + + .px-md-up\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-md-up\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-md-up\:_8 { + padding-top: 80px !important; + } + + .pb-md-up\:_8 { + padding-bottom: 80px !important; + } + + .pl-md-up\:_8 { + padding-left: 80px !important; + } + + .pr-md-up\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:_8 { + padding: 80px !important; + } + + .px-lg-down\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-lg-down\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-lg-down\:_8 { + padding-top: 80px !important; + } + + .pb-lg-down\:_8 { + padding-bottom: 80px !important; + } + + .pl-lg-down\:_8 { + padding-left: 80px !important; + } + + .pr-lg-down\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:_8 { + padding: 80px !important; + } + + .px-lg\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-lg\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-lg\:_8 { + padding-top: 80px !important; + } + + .pb-lg\:_8 { + padding-bottom: 80px !important; + } + + .pl-lg\:_8 { + padding-left: 80px !important; + } + + .pr-lg\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:_8 { + padding: 80px !important; + } + + .px-lg-up\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-lg-up\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-lg-up\:_8 { + padding-top: 80px !important; + } + + .pb-lg-up\:_8 { + padding-bottom: 80px !important; + } + + .pl-lg-up\:_8 { + padding-left: 80px !important; + } + + .pr-lg-up\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:_8 { + padding: 80px !important; + } + + .px-xl-down\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-xl-down\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-xl-down\:_8 { + padding-top: 80px !important; + } + + .pb-xl-down\:_8 { + padding-bottom: 80px !important; + } + + .pl-xl-down\:_8 { + padding-left: 80px !important; + } + + .pr-xl-down\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:_8 { + padding: 80px !important; + } + + .px-xl\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-xl\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-xl\:_8 { + padding-top: 80px !important; + } + + .pb-xl\:_8 { + padding-bottom: 80px !important; + } + + .pl-xl\:_8 { + padding-left: 80px !important; + } + + .pr-xl\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:_8 { + padding: 80px !important; + } + + .px-xl-up\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-xl-up\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-xl-up\:_8 { + padding-top: 80px !important; + } + + .pb-xl-up\:_8 { + padding-bottom: 80px !important; + } + + .pl-xl-up\:_8 { + padding-left: 80px !important; + } + + .pr-xl-up\:_8 { + padding-right: 80px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:_8 { + padding: 80px !important; + } + + .px-xxl\:_8 { + padding-left: 80px !important; + padding-right: 80px !important; + } + + .py-xxl\:_8 { + padding-top: 80px !important; + padding-bottom: 80px !important; + } + + .pt-xxl\:_8 { + padding-top: 80px !important; + } + + .pb-xxl\:_8 { + padding-bottom: 80px !important; + } + + .pl-xxl\:_8 { + padding-left: 80px !important; + } + + .pr-xxl\:_8 { + padding-right: 80px !important; + } +} +.p\:_9 { + padding: 90px !important; +} + +.px\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; +} + +.py\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; +} + +.pt\:_9 { + padding-top: 90px !important; +} + +.pb\:_9 { + padding-bottom: 90px !important; +} + +.pl\:_9 { + padding-left: 90px !important; +} + +.pr\:_9 { + padding-right: 90px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:_9 { + padding: 90px !important; + } + + .px-xs\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-xs\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-xs\:_9 { + padding-top: 90px !important; + } + + .pb-xs\:_9 { + padding-bottom: 90px !important; + } + + .pl-xs\:_9 { + padding-left: 90px !important; + } + + .pr-xs\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:_9 { + padding: 90px !important; + } + + .px-sm-down\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-sm-down\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-sm-down\:_9 { + padding-top: 90px !important; + } + + .pb-sm-down\:_9 { + padding-bottom: 90px !important; + } + + .pl-sm-down\:_9 { + padding-left: 90px !important; + } + + .pr-sm-down\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:_9 { + padding: 90px !important; + } + + .px-sm\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-sm\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-sm\:_9 { + padding-top: 90px !important; + } + + .pb-sm\:_9 { + padding-bottom: 90px !important; + } + + .pl-sm\:_9 { + padding-left: 90px !important; + } + + .pr-sm\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:_9 { + padding: 90px !important; + } + + .px-sm-up\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-sm-up\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-sm-up\:_9 { + padding-top: 90px !important; + } + + .pb-sm-up\:_9 { + padding-bottom: 90px !important; + } + + .pl-sm-up\:_9 { + padding-left: 90px !important; + } + + .pr-sm-up\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:_9 { + padding: 90px !important; + } + + .px-md-down\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-md-down\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-md-down\:_9 { + padding-top: 90px !important; + } + + .pb-md-down\:_9 { + padding-bottom: 90px !important; + } + + .pl-md-down\:_9 { + padding-left: 90px !important; + } + + .pr-md-down\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:_9 { + padding: 90px !important; + } + + .px-md\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-md\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-md\:_9 { + padding-top: 90px !important; + } + + .pb-md\:_9 { + padding-bottom: 90px !important; + } + + .pl-md\:_9 { + padding-left: 90px !important; + } + + .pr-md\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:_9 { + padding: 90px !important; + } + + .px-md-up\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-md-up\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-md-up\:_9 { + padding-top: 90px !important; + } + + .pb-md-up\:_9 { + padding-bottom: 90px !important; + } + + .pl-md-up\:_9 { + padding-left: 90px !important; + } + + .pr-md-up\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:_9 { + padding: 90px !important; + } + + .px-lg-down\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-lg-down\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-lg-down\:_9 { + padding-top: 90px !important; + } + + .pb-lg-down\:_9 { + padding-bottom: 90px !important; + } + + .pl-lg-down\:_9 { + padding-left: 90px !important; + } + + .pr-lg-down\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:_9 { + padding: 90px !important; + } + + .px-lg\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-lg\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-lg\:_9 { + padding-top: 90px !important; + } + + .pb-lg\:_9 { + padding-bottom: 90px !important; + } + + .pl-lg\:_9 { + padding-left: 90px !important; + } + + .pr-lg\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:_9 { + padding: 90px !important; + } + + .px-lg-up\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-lg-up\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-lg-up\:_9 { + padding-top: 90px !important; + } + + .pb-lg-up\:_9 { + padding-bottom: 90px !important; + } + + .pl-lg-up\:_9 { + padding-left: 90px !important; + } + + .pr-lg-up\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:_9 { + padding: 90px !important; + } + + .px-xl-down\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-xl-down\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-xl-down\:_9 { + padding-top: 90px !important; + } + + .pb-xl-down\:_9 { + padding-bottom: 90px !important; + } + + .pl-xl-down\:_9 { + padding-left: 90px !important; + } + + .pr-xl-down\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:_9 { + padding: 90px !important; + } + + .px-xl\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-xl\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-xl\:_9 { + padding-top: 90px !important; + } + + .pb-xl\:_9 { + padding-bottom: 90px !important; + } + + .pl-xl\:_9 { + padding-left: 90px !important; + } + + .pr-xl\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:_9 { + padding: 90px !important; + } + + .px-xl-up\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-xl-up\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-xl-up\:_9 { + padding-top: 90px !important; + } + + .pb-xl-up\:_9 { + padding-bottom: 90px !important; + } + + .pl-xl-up\:_9 { + padding-left: 90px !important; + } + + .pr-xl-up\:_9 { + padding-right: 90px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:_9 { + padding: 90px !important; + } + + .px-xxl\:_9 { + padding-left: 90px !important; + padding-right: 90px !important; + } + + .py-xxl\:_9 { + padding-top: 90px !important; + padding-bottom: 90px !important; + } + + .pt-xxl\:_9 { + padding-top: 90px !important; + } + + .pb-xxl\:_9 { + padding-bottom: 90px !important; + } + + .pl-xxl\:_9 { + padding-left: 90px !important; + } + + .pr-xxl\:_9 { + padding-right: 90px !important; + } +} +.p\:_10 { + padding: 100px !important; +} + +.px\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; +} + +.py\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; +} + +.pt\:_10 { + padding-top: 100px !important; +} + +.pb\:_10 { + padding-bottom: 100px !important; +} + +.pl\:_10 { + padding-left: 100px !important; +} + +.pr\:_10 { + padding-right: 100px !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:_10 { + padding: 100px !important; + } + + .px-xs\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-xs\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-xs\:_10 { + padding-top: 100px !important; + } + + .pb-xs\:_10 { + padding-bottom: 100px !important; + } + + .pl-xs\:_10 { + padding-left: 100px !important; + } + + .pr-xs\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:_10 { + padding: 100px !important; + } + + .px-sm-down\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-sm-down\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-sm-down\:_10 { + padding-top: 100px !important; + } + + .pb-sm-down\:_10 { + padding-bottom: 100px !important; + } + + .pl-sm-down\:_10 { + padding-left: 100px !important; + } + + .pr-sm-down\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:_10 { + padding: 100px !important; + } + + .px-sm\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-sm\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-sm\:_10 { + padding-top: 100px !important; + } + + .pb-sm\:_10 { + padding-bottom: 100px !important; + } + + .pl-sm\:_10 { + padding-left: 100px !important; + } + + .pr-sm\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:_10 { + padding: 100px !important; + } + + .px-sm-up\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-sm-up\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-sm-up\:_10 { + padding-top: 100px !important; + } + + .pb-sm-up\:_10 { + padding-bottom: 100px !important; + } + + .pl-sm-up\:_10 { + padding-left: 100px !important; + } + + .pr-sm-up\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:_10 { + padding: 100px !important; + } + + .px-md-down\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-md-down\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-md-down\:_10 { + padding-top: 100px !important; + } + + .pb-md-down\:_10 { + padding-bottom: 100px !important; + } + + .pl-md-down\:_10 { + padding-left: 100px !important; + } + + .pr-md-down\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:_10 { + padding: 100px !important; + } + + .px-md\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-md\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-md\:_10 { + padding-top: 100px !important; + } + + .pb-md\:_10 { + padding-bottom: 100px !important; + } + + .pl-md\:_10 { + padding-left: 100px !important; + } + + .pr-md\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:_10 { + padding: 100px !important; + } + + .px-md-up\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-md-up\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-md-up\:_10 { + padding-top: 100px !important; + } + + .pb-md-up\:_10 { + padding-bottom: 100px !important; + } + + .pl-md-up\:_10 { + padding-left: 100px !important; + } + + .pr-md-up\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:_10 { + padding: 100px !important; + } + + .px-lg-down\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-lg-down\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-lg-down\:_10 { + padding-top: 100px !important; + } + + .pb-lg-down\:_10 { + padding-bottom: 100px !important; + } + + .pl-lg-down\:_10 { + padding-left: 100px !important; + } + + .pr-lg-down\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:_10 { + padding: 100px !important; + } + + .px-lg\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-lg\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-lg\:_10 { + padding-top: 100px !important; + } + + .pb-lg\:_10 { + padding-bottom: 100px !important; + } + + .pl-lg\:_10 { + padding-left: 100px !important; + } + + .pr-lg\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:_10 { + padding: 100px !important; + } + + .px-lg-up\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-lg-up\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-lg-up\:_10 { + padding-top: 100px !important; + } + + .pb-lg-up\:_10 { + padding-bottom: 100px !important; + } + + .pl-lg-up\:_10 { + padding-left: 100px !important; + } + + .pr-lg-up\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:_10 { + padding: 100px !important; + } + + .px-xl-down\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-xl-down\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-xl-down\:_10 { + padding-top: 100px !important; + } + + .pb-xl-down\:_10 { + padding-bottom: 100px !important; + } + + .pl-xl-down\:_10 { + padding-left: 100px !important; + } + + .pr-xl-down\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:_10 { + padding: 100px !important; + } + + .px-xl\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-xl\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-xl\:_10 { + padding-top: 100px !important; + } + + .pb-xl\:_10 { + padding-bottom: 100px !important; + } + + .pl-xl\:_10 { + padding-left: 100px !important; + } + + .pr-xl\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:_10 { + padding: 100px !important; + } + + .px-xl-up\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-xl-up\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-xl-up\:_10 { + padding-top: 100px !important; + } + + .pb-xl-up\:_10 { + padding-bottom: 100px !important; + } + + .pl-xl-up\:_10 { + padding-left: 100px !important; + } + + .pr-xl-up\:_10 { + padding-right: 100px !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:_10 { + padding: 100px !important; + } + + .px-xxl\:_10 { + padding-left: 100px !important; + padding-right: 100px !important; + } + + .py-xxl\:_10 { + padding-top: 100px !important; + padding-bottom: 100px !important; + } + + .pt-xxl\:_10 { + padding-top: 100px !important; + } + + .pb-xxl\:_10 { + padding-bottom: 100px !important; + } + + .pl-xxl\:_10 { + padding-left: 100px !important; + } + + .pr-xxl\:_10 { + padding-right: 100px !important; + } +} +.p\:auto { + padding: auto !important; +} + +.px\:auto { + padding-left: auto !important; + padding-right: auto !important; +} + +.py\:auto { + padding-top: auto !important; + padding-bottom: auto !important; +} + +.pt\:auto { + padding-top: auto !important; +} + +.pb\:auto { + padding-bottom: auto !important; +} + +.pl\:auto { + padding-left: auto !important; +} + +.pr\:auto { + padding-right: auto !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:auto { + padding: auto !important; + } + + .px-xs\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-xs\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-xs\:auto { + padding-top: auto !important; + } + + .pb-xs\:auto { + padding-bottom: auto !important; + } + + .pl-xs\:auto { + padding-left: auto !important; + } + + .pr-xs\:auto { + padding-right: auto !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:auto { + padding: auto !important; + } + + .px-sm-down\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-sm-down\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-sm-down\:auto { + padding-top: auto !important; + } + + .pb-sm-down\:auto { + padding-bottom: auto !important; + } + + .pl-sm-down\:auto { + padding-left: auto !important; + } + + .pr-sm-down\:auto { + padding-right: auto !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:auto { + padding: auto !important; + } + + .px-sm\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-sm\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-sm\:auto { + padding-top: auto !important; + } + + .pb-sm\:auto { + padding-bottom: auto !important; + } + + .pl-sm\:auto { + padding-left: auto !important; + } + + .pr-sm\:auto { + padding-right: auto !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:auto { + padding: auto !important; + } + + .px-sm-up\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-sm-up\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-sm-up\:auto { + padding-top: auto !important; + } + + .pb-sm-up\:auto { + padding-bottom: auto !important; + } + + .pl-sm-up\:auto { + padding-left: auto !important; + } + + .pr-sm-up\:auto { + padding-right: auto !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:auto { + padding: auto !important; + } + + .px-md-down\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-md-down\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-md-down\:auto { + padding-top: auto !important; + } + + .pb-md-down\:auto { + padding-bottom: auto !important; + } + + .pl-md-down\:auto { + padding-left: auto !important; + } + + .pr-md-down\:auto { + padding-right: auto !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:auto { + padding: auto !important; + } + + .px-md\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-md\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-md\:auto { + padding-top: auto !important; + } + + .pb-md\:auto { + padding-bottom: auto !important; + } + + .pl-md\:auto { + padding-left: auto !important; + } + + .pr-md\:auto { + padding-right: auto !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:auto { + padding: auto !important; + } + + .px-md-up\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-md-up\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-md-up\:auto { + padding-top: auto !important; + } + + .pb-md-up\:auto { + padding-bottom: auto !important; + } + + .pl-md-up\:auto { + padding-left: auto !important; + } + + .pr-md-up\:auto { + padding-right: auto !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:auto { + padding: auto !important; + } + + .px-lg-down\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-lg-down\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-lg-down\:auto { + padding-top: auto !important; + } + + .pb-lg-down\:auto { + padding-bottom: auto !important; + } + + .pl-lg-down\:auto { + padding-left: auto !important; + } + + .pr-lg-down\:auto { + padding-right: auto !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:auto { + padding: auto !important; + } + + .px-lg\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-lg\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-lg\:auto { + padding-top: auto !important; + } + + .pb-lg\:auto { + padding-bottom: auto !important; + } + + .pl-lg\:auto { + padding-left: auto !important; + } + + .pr-lg\:auto { + padding-right: auto !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:auto { + padding: auto !important; + } + + .px-lg-up\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-lg-up\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-lg-up\:auto { + padding-top: auto !important; + } + + .pb-lg-up\:auto { + padding-bottom: auto !important; + } + + .pl-lg-up\:auto { + padding-left: auto !important; + } + + .pr-lg-up\:auto { + padding-right: auto !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:auto { + padding: auto !important; + } + + .px-xl-down\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-xl-down\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-xl-down\:auto { + padding-top: auto !important; + } + + .pb-xl-down\:auto { + padding-bottom: auto !important; + } + + .pl-xl-down\:auto { + padding-left: auto !important; + } + + .pr-xl-down\:auto { + padding-right: auto !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:auto { + padding: auto !important; + } + + .px-xl\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-xl\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-xl\:auto { + padding-top: auto !important; + } + + .pb-xl\:auto { + padding-bottom: auto !important; + } + + .pl-xl\:auto { + padding-left: auto !important; + } + + .pr-xl\:auto { + padding-right: auto !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:auto { + padding: auto !important; + } + + .px-xl-up\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-xl-up\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-xl-up\:auto { + padding-top: auto !important; + } + + .pb-xl-up\:auto { + padding-bottom: auto !important; + } + + .pl-xl-up\:auto { + padding-left: auto !important; + } + + .pr-xl-up\:auto { + padding-right: auto !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:auto { + padding: auto !important; + } + + .px-xxl\:auto { + padding-left: auto !important; + padding-right: auto !important; + } + + .py-xxl\:auto { + padding-top: auto !important; + padding-bottom: auto !important; + } + + .pt-xxl\:auto { + padding-top: auto !important; + } + + .pb-xxl\:auto { + padding-bottom: auto !important; + } + + .pl-xxl\:auto { + padding-left: auto !important; + } + + .pr-xxl\:auto { + padding-right: auto !important; + } +} +.p\:10 { + padding: 10% !important; +} + +.px\:10 { + padding-left: 10% !important; + padding-right: 10% !important; +} + +.py\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; +} + +.pt\:10 { + padding-top: 10% !important; +} + +.pb\:10 { + padding-bottom: 10% !important; +} + +.pl\:10 { + padding-left: 10% !important; +} + +.pr\:10 { + padding-right: 10% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:10 { + padding: 10% !important; + } + + .px-xs\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-xs\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-xs\:10 { + padding-top: 10% !important; + } + + .pb-xs\:10 { + padding-bottom: 10% !important; + } + + .pl-xs\:10 { + padding-left: 10% !important; + } + + .pr-xs\:10 { + padding-right: 10% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:10 { + padding: 10% !important; + } + + .px-sm-down\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-sm-down\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-sm-down\:10 { + padding-top: 10% !important; + } + + .pb-sm-down\:10 { + padding-bottom: 10% !important; + } + + .pl-sm-down\:10 { + padding-left: 10% !important; + } + + .pr-sm-down\:10 { + padding-right: 10% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:10 { + padding: 10% !important; + } + + .px-sm\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-sm\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-sm\:10 { + padding-top: 10% !important; + } + + .pb-sm\:10 { + padding-bottom: 10% !important; + } + + .pl-sm\:10 { + padding-left: 10% !important; + } + + .pr-sm\:10 { + padding-right: 10% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:10 { + padding: 10% !important; + } + + .px-sm-up\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-sm-up\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-sm-up\:10 { + padding-top: 10% !important; + } + + .pb-sm-up\:10 { + padding-bottom: 10% !important; + } + + .pl-sm-up\:10 { + padding-left: 10% !important; + } + + .pr-sm-up\:10 { + padding-right: 10% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:10 { + padding: 10% !important; + } + + .px-md-down\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-md-down\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-md-down\:10 { + padding-top: 10% !important; + } + + .pb-md-down\:10 { + padding-bottom: 10% !important; + } + + .pl-md-down\:10 { + padding-left: 10% !important; + } + + .pr-md-down\:10 { + padding-right: 10% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:10 { + padding: 10% !important; + } + + .px-md\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-md\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-md\:10 { + padding-top: 10% !important; + } + + .pb-md\:10 { + padding-bottom: 10% !important; + } + + .pl-md\:10 { + padding-left: 10% !important; + } + + .pr-md\:10 { + padding-right: 10% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:10 { + padding: 10% !important; + } + + .px-md-up\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-md-up\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-md-up\:10 { + padding-top: 10% !important; + } + + .pb-md-up\:10 { + padding-bottom: 10% !important; + } + + .pl-md-up\:10 { + padding-left: 10% !important; + } + + .pr-md-up\:10 { + padding-right: 10% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:10 { + padding: 10% !important; + } + + .px-lg-down\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-lg-down\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-lg-down\:10 { + padding-top: 10% !important; + } + + .pb-lg-down\:10 { + padding-bottom: 10% !important; + } + + .pl-lg-down\:10 { + padding-left: 10% !important; + } + + .pr-lg-down\:10 { + padding-right: 10% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:10 { + padding: 10% !important; + } + + .px-lg\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-lg\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-lg\:10 { + padding-top: 10% !important; + } + + .pb-lg\:10 { + padding-bottom: 10% !important; + } + + .pl-lg\:10 { + padding-left: 10% !important; + } + + .pr-lg\:10 { + padding-right: 10% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:10 { + padding: 10% !important; + } + + .px-lg-up\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-lg-up\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-lg-up\:10 { + padding-top: 10% !important; + } + + .pb-lg-up\:10 { + padding-bottom: 10% !important; + } + + .pl-lg-up\:10 { + padding-left: 10% !important; + } + + .pr-lg-up\:10 { + padding-right: 10% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:10 { + padding: 10% !important; + } + + .px-xl-down\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-xl-down\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-xl-down\:10 { + padding-top: 10% !important; + } + + .pb-xl-down\:10 { + padding-bottom: 10% !important; + } + + .pl-xl-down\:10 { + padding-left: 10% !important; + } + + .pr-xl-down\:10 { + padding-right: 10% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:10 { + padding: 10% !important; + } + + .px-xl\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-xl\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-xl\:10 { + padding-top: 10% !important; + } + + .pb-xl\:10 { + padding-bottom: 10% !important; + } + + .pl-xl\:10 { + padding-left: 10% !important; + } + + .pr-xl\:10 { + padding-right: 10% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:10 { + padding: 10% !important; + } + + .px-xl-up\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-xl-up\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-xl-up\:10 { + padding-top: 10% !important; + } + + .pb-xl-up\:10 { + padding-bottom: 10% !important; + } + + .pl-xl-up\:10 { + padding-left: 10% !important; + } + + .pr-xl-up\:10 { + padding-right: 10% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:10 { + padding: 10% !important; + } + + .px-xxl\:10 { + padding-left: 10% !important; + padding-right: 10% !important; + } + + .py-xxl\:10 { + padding-top: 10% !important; + padding-bottom: 10% !important; + } + + .pt-xxl\:10 { + padding-top: 10% !important; + } + + .pb-xxl\:10 { + padding-bottom: 10% !important; + } + + .pl-xxl\:10 { + padding-left: 10% !important; + } + + .pr-xxl\:10 { + padding-right: 10% !important; + } +} +.p\:20 { + padding: 20% !important; +} + +.px\:20 { + padding-left: 20% !important; + padding-right: 20% !important; +} + +.py\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; +} + +.pt\:20 { + padding-top: 20% !important; +} + +.pb\:20 { + padding-bottom: 20% !important; +} + +.pl\:20 { + padding-left: 20% !important; +} + +.pr\:20 { + padding-right: 20% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:20 { + padding: 20% !important; + } + + .px-xs\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-xs\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-xs\:20 { + padding-top: 20% !important; + } + + .pb-xs\:20 { + padding-bottom: 20% !important; + } + + .pl-xs\:20 { + padding-left: 20% !important; + } + + .pr-xs\:20 { + padding-right: 20% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:20 { + padding: 20% !important; + } + + .px-sm-down\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-sm-down\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-sm-down\:20 { + padding-top: 20% !important; + } + + .pb-sm-down\:20 { + padding-bottom: 20% !important; + } + + .pl-sm-down\:20 { + padding-left: 20% !important; + } + + .pr-sm-down\:20 { + padding-right: 20% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:20 { + padding: 20% !important; + } + + .px-sm\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-sm\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-sm\:20 { + padding-top: 20% !important; + } + + .pb-sm\:20 { + padding-bottom: 20% !important; + } + + .pl-sm\:20 { + padding-left: 20% !important; + } + + .pr-sm\:20 { + padding-right: 20% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:20 { + padding: 20% !important; + } + + .px-sm-up\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-sm-up\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-sm-up\:20 { + padding-top: 20% !important; + } + + .pb-sm-up\:20 { + padding-bottom: 20% !important; + } + + .pl-sm-up\:20 { + padding-left: 20% !important; + } + + .pr-sm-up\:20 { + padding-right: 20% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:20 { + padding: 20% !important; + } + + .px-md-down\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-md-down\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-md-down\:20 { + padding-top: 20% !important; + } + + .pb-md-down\:20 { + padding-bottom: 20% !important; + } + + .pl-md-down\:20 { + padding-left: 20% !important; + } + + .pr-md-down\:20 { + padding-right: 20% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:20 { + padding: 20% !important; + } + + .px-md\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-md\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-md\:20 { + padding-top: 20% !important; + } + + .pb-md\:20 { + padding-bottom: 20% !important; + } + + .pl-md\:20 { + padding-left: 20% !important; + } + + .pr-md\:20 { + padding-right: 20% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:20 { + padding: 20% !important; + } + + .px-md-up\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-md-up\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-md-up\:20 { + padding-top: 20% !important; + } + + .pb-md-up\:20 { + padding-bottom: 20% !important; + } + + .pl-md-up\:20 { + padding-left: 20% !important; + } + + .pr-md-up\:20 { + padding-right: 20% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:20 { + padding: 20% !important; + } + + .px-lg-down\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-lg-down\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-lg-down\:20 { + padding-top: 20% !important; + } + + .pb-lg-down\:20 { + padding-bottom: 20% !important; + } + + .pl-lg-down\:20 { + padding-left: 20% !important; + } + + .pr-lg-down\:20 { + padding-right: 20% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:20 { + padding: 20% !important; + } + + .px-lg\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-lg\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-lg\:20 { + padding-top: 20% !important; + } + + .pb-lg\:20 { + padding-bottom: 20% !important; + } + + .pl-lg\:20 { + padding-left: 20% !important; + } + + .pr-lg\:20 { + padding-right: 20% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:20 { + padding: 20% !important; + } + + .px-lg-up\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-lg-up\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-lg-up\:20 { + padding-top: 20% !important; + } + + .pb-lg-up\:20 { + padding-bottom: 20% !important; + } + + .pl-lg-up\:20 { + padding-left: 20% !important; + } + + .pr-lg-up\:20 { + padding-right: 20% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:20 { + padding: 20% !important; + } + + .px-xl-down\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-xl-down\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-xl-down\:20 { + padding-top: 20% !important; + } + + .pb-xl-down\:20 { + padding-bottom: 20% !important; + } + + .pl-xl-down\:20 { + padding-left: 20% !important; + } + + .pr-xl-down\:20 { + padding-right: 20% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:20 { + padding: 20% !important; + } + + .px-xl\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-xl\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-xl\:20 { + padding-top: 20% !important; + } + + .pb-xl\:20 { + padding-bottom: 20% !important; + } + + .pl-xl\:20 { + padding-left: 20% !important; + } + + .pr-xl\:20 { + padding-right: 20% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:20 { + padding: 20% !important; + } + + .px-xl-up\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-xl-up\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-xl-up\:20 { + padding-top: 20% !important; + } + + .pb-xl-up\:20 { + padding-bottom: 20% !important; + } + + .pl-xl-up\:20 { + padding-left: 20% !important; + } + + .pr-xl-up\:20 { + padding-right: 20% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:20 { + padding: 20% !important; + } + + .px-xxl\:20 { + padding-left: 20% !important; + padding-right: 20% !important; + } + + .py-xxl\:20 { + padding-top: 20% !important; + padding-bottom: 20% !important; + } + + .pt-xxl\:20 { + padding-top: 20% !important; + } + + .pb-xxl\:20 { + padding-bottom: 20% !important; + } + + .pl-xxl\:20 { + padding-left: 20% !important; + } + + .pr-xxl\:20 { + padding-right: 20% !important; + } +} +.p\:25 { + padding: 25% !important; +} + +.px\:25 { + padding-left: 25% !important; + padding-right: 25% !important; +} + +.py\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; +} + +.pt\:25 { + padding-top: 25% !important; +} + +.pb\:25 { + padding-bottom: 25% !important; +} + +.pl\:25 { + padding-left: 25% !important; +} + +.pr\:25 { + padding-right: 25% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:25 { + padding: 25% !important; + } + + .px-xs\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-xs\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-xs\:25 { + padding-top: 25% !important; + } + + .pb-xs\:25 { + padding-bottom: 25% !important; + } + + .pl-xs\:25 { + padding-left: 25% !important; + } + + .pr-xs\:25 { + padding-right: 25% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:25 { + padding: 25% !important; + } + + .px-sm-down\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-sm-down\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-sm-down\:25 { + padding-top: 25% !important; + } + + .pb-sm-down\:25 { + padding-bottom: 25% !important; + } + + .pl-sm-down\:25 { + padding-left: 25% !important; + } + + .pr-sm-down\:25 { + padding-right: 25% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:25 { + padding: 25% !important; + } + + .px-sm\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-sm\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-sm\:25 { + padding-top: 25% !important; + } + + .pb-sm\:25 { + padding-bottom: 25% !important; + } + + .pl-sm\:25 { + padding-left: 25% !important; + } + + .pr-sm\:25 { + padding-right: 25% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:25 { + padding: 25% !important; + } + + .px-sm-up\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-sm-up\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-sm-up\:25 { + padding-top: 25% !important; + } + + .pb-sm-up\:25 { + padding-bottom: 25% !important; + } + + .pl-sm-up\:25 { + padding-left: 25% !important; + } + + .pr-sm-up\:25 { + padding-right: 25% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:25 { + padding: 25% !important; + } + + .px-md-down\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-md-down\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-md-down\:25 { + padding-top: 25% !important; + } + + .pb-md-down\:25 { + padding-bottom: 25% !important; + } + + .pl-md-down\:25 { + padding-left: 25% !important; + } + + .pr-md-down\:25 { + padding-right: 25% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:25 { + padding: 25% !important; + } + + .px-md\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-md\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-md\:25 { + padding-top: 25% !important; + } + + .pb-md\:25 { + padding-bottom: 25% !important; + } + + .pl-md\:25 { + padding-left: 25% !important; + } + + .pr-md\:25 { + padding-right: 25% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:25 { + padding: 25% !important; + } + + .px-md-up\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-md-up\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-md-up\:25 { + padding-top: 25% !important; + } + + .pb-md-up\:25 { + padding-bottom: 25% !important; + } + + .pl-md-up\:25 { + padding-left: 25% !important; + } + + .pr-md-up\:25 { + padding-right: 25% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:25 { + padding: 25% !important; + } + + .px-lg-down\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-lg-down\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-lg-down\:25 { + padding-top: 25% !important; + } + + .pb-lg-down\:25 { + padding-bottom: 25% !important; + } + + .pl-lg-down\:25 { + padding-left: 25% !important; + } + + .pr-lg-down\:25 { + padding-right: 25% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:25 { + padding: 25% !important; + } + + .px-lg\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-lg\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-lg\:25 { + padding-top: 25% !important; + } + + .pb-lg\:25 { + padding-bottom: 25% !important; + } + + .pl-lg\:25 { + padding-left: 25% !important; + } + + .pr-lg\:25 { + padding-right: 25% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:25 { + padding: 25% !important; + } + + .px-lg-up\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-lg-up\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-lg-up\:25 { + padding-top: 25% !important; + } + + .pb-lg-up\:25 { + padding-bottom: 25% !important; + } + + .pl-lg-up\:25 { + padding-left: 25% !important; + } + + .pr-lg-up\:25 { + padding-right: 25% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:25 { + padding: 25% !important; + } + + .px-xl-down\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-xl-down\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-xl-down\:25 { + padding-top: 25% !important; + } + + .pb-xl-down\:25 { + padding-bottom: 25% !important; + } + + .pl-xl-down\:25 { + padding-left: 25% !important; + } + + .pr-xl-down\:25 { + padding-right: 25% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:25 { + padding: 25% !important; + } + + .px-xl\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-xl\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-xl\:25 { + padding-top: 25% !important; + } + + .pb-xl\:25 { + padding-bottom: 25% !important; + } + + .pl-xl\:25 { + padding-left: 25% !important; + } + + .pr-xl\:25 { + padding-right: 25% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:25 { + padding: 25% !important; + } + + .px-xl-up\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-xl-up\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-xl-up\:25 { + padding-top: 25% !important; + } + + .pb-xl-up\:25 { + padding-bottom: 25% !important; + } + + .pl-xl-up\:25 { + padding-left: 25% !important; + } + + .pr-xl-up\:25 { + padding-right: 25% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:25 { + padding: 25% !important; + } + + .px-xxl\:25 { + padding-left: 25% !important; + padding-right: 25% !important; + } + + .py-xxl\:25 { + padding-top: 25% !important; + padding-bottom: 25% !important; + } + + .pt-xxl\:25 { + padding-top: 25% !important; + } + + .pb-xxl\:25 { + padding-bottom: 25% !important; + } + + .pl-xxl\:25 { + padding-left: 25% !important; + } + + .pr-xxl\:25 { + padding-right: 25% !important; + } +} +.p\:30 { + padding: 30% !important; +} + +.px\:30 { + padding-left: 30% !important; + padding-right: 30% !important; +} + +.py\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; +} + +.pt\:30 { + padding-top: 30% !important; +} + +.pb\:30 { + padding-bottom: 30% !important; +} + +.pl\:30 { + padding-left: 30% !important; +} + +.pr\:30 { + padding-right: 30% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:30 { + padding: 30% !important; + } + + .px-xs\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-xs\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-xs\:30 { + padding-top: 30% !important; + } + + .pb-xs\:30 { + padding-bottom: 30% !important; + } + + .pl-xs\:30 { + padding-left: 30% !important; + } + + .pr-xs\:30 { + padding-right: 30% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:30 { + padding: 30% !important; + } + + .px-sm-down\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-sm-down\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-sm-down\:30 { + padding-top: 30% !important; + } + + .pb-sm-down\:30 { + padding-bottom: 30% !important; + } + + .pl-sm-down\:30 { + padding-left: 30% !important; + } + + .pr-sm-down\:30 { + padding-right: 30% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:30 { + padding: 30% !important; + } + + .px-sm\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-sm\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-sm\:30 { + padding-top: 30% !important; + } + + .pb-sm\:30 { + padding-bottom: 30% !important; + } + + .pl-sm\:30 { + padding-left: 30% !important; + } + + .pr-sm\:30 { + padding-right: 30% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:30 { + padding: 30% !important; + } + + .px-sm-up\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-sm-up\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-sm-up\:30 { + padding-top: 30% !important; + } + + .pb-sm-up\:30 { + padding-bottom: 30% !important; + } + + .pl-sm-up\:30 { + padding-left: 30% !important; + } + + .pr-sm-up\:30 { + padding-right: 30% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:30 { + padding: 30% !important; + } + + .px-md-down\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-md-down\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-md-down\:30 { + padding-top: 30% !important; + } + + .pb-md-down\:30 { + padding-bottom: 30% !important; + } + + .pl-md-down\:30 { + padding-left: 30% !important; + } + + .pr-md-down\:30 { + padding-right: 30% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:30 { + padding: 30% !important; + } + + .px-md\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-md\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-md\:30 { + padding-top: 30% !important; + } + + .pb-md\:30 { + padding-bottom: 30% !important; + } + + .pl-md\:30 { + padding-left: 30% !important; + } + + .pr-md\:30 { + padding-right: 30% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:30 { + padding: 30% !important; + } + + .px-md-up\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-md-up\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-md-up\:30 { + padding-top: 30% !important; + } + + .pb-md-up\:30 { + padding-bottom: 30% !important; + } + + .pl-md-up\:30 { + padding-left: 30% !important; + } + + .pr-md-up\:30 { + padding-right: 30% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:30 { + padding: 30% !important; + } + + .px-lg-down\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-lg-down\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-lg-down\:30 { + padding-top: 30% !important; + } + + .pb-lg-down\:30 { + padding-bottom: 30% !important; + } + + .pl-lg-down\:30 { + padding-left: 30% !important; + } + + .pr-lg-down\:30 { + padding-right: 30% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:30 { + padding: 30% !important; + } + + .px-lg\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-lg\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-lg\:30 { + padding-top: 30% !important; + } + + .pb-lg\:30 { + padding-bottom: 30% !important; + } + + .pl-lg\:30 { + padding-left: 30% !important; + } + + .pr-lg\:30 { + padding-right: 30% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:30 { + padding: 30% !important; + } + + .px-lg-up\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-lg-up\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-lg-up\:30 { + padding-top: 30% !important; + } + + .pb-lg-up\:30 { + padding-bottom: 30% !important; + } + + .pl-lg-up\:30 { + padding-left: 30% !important; + } + + .pr-lg-up\:30 { + padding-right: 30% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:30 { + padding: 30% !important; + } + + .px-xl-down\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-xl-down\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-xl-down\:30 { + padding-top: 30% !important; + } + + .pb-xl-down\:30 { + padding-bottom: 30% !important; + } + + .pl-xl-down\:30 { + padding-left: 30% !important; + } + + .pr-xl-down\:30 { + padding-right: 30% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:30 { + padding: 30% !important; + } + + .px-xl\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-xl\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-xl\:30 { + padding-top: 30% !important; + } + + .pb-xl\:30 { + padding-bottom: 30% !important; + } + + .pl-xl\:30 { + padding-left: 30% !important; + } + + .pr-xl\:30 { + padding-right: 30% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:30 { + padding: 30% !important; + } + + .px-xl-up\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-xl-up\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-xl-up\:30 { + padding-top: 30% !important; + } + + .pb-xl-up\:30 { + padding-bottom: 30% !important; + } + + .pl-xl-up\:30 { + padding-left: 30% !important; + } + + .pr-xl-up\:30 { + padding-right: 30% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:30 { + padding: 30% !important; + } + + .px-xxl\:30 { + padding-left: 30% !important; + padding-right: 30% !important; + } + + .py-xxl\:30 { + padding-top: 30% !important; + padding-bottom: 30% !important; + } + + .pt-xxl\:30 { + padding-top: 30% !important; + } + + .pb-xxl\:30 { + padding-bottom: 30% !important; + } + + .pl-xxl\:30 { + padding-left: 30% !important; + } + + .pr-xxl\:30 { + padding-right: 30% !important; + } +} +.p\:33 { + padding: 33.33% !important; +} + +.px\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; +} + +.py\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; +} + +.pt\:33 { + padding-top: 33.33% !important; +} + +.pb\:33 { + padding-bottom: 33.33% !important; +} + +.pl\:33 { + padding-left: 33.33% !important; +} + +.pr\:33 { + padding-right: 33.33% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:33 { + padding: 33.33% !important; + } + + .px-xs\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-xs\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-xs\:33 { + padding-top: 33.33% !important; + } + + .pb-xs\:33 { + padding-bottom: 33.33% !important; + } + + .pl-xs\:33 { + padding-left: 33.33% !important; + } + + .pr-xs\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:33 { + padding: 33.33% !important; + } + + .px-sm-down\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-sm-down\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-sm-down\:33 { + padding-top: 33.33% !important; + } + + .pb-sm-down\:33 { + padding-bottom: 33.33% !important; + } + + .pl-sm-down\:33 { + padding-left: 33.33% !important; + } + + .pr-sm-down\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:33 { + padding: 33.33% !important; + } + + .px-sm\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-sm\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-sm\:33 { + padding-top: 33.33% !important; + } + + .pb-sm\:33 { + padding-bottom: 33.33% !important; + } + + .pl-sm\:33 { + padding-left: 33.33% !important; + } + + .pr-sm\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:33 { + padding: 33.33% !important; + } + + .px-sm-up\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-sm-up\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-sm-up\:33 { + padding-top: 33.33% !important; + } + + .pb-sm-up\:33 { + padding-bottom: 33.33% !important; + } + + .pl-sm-up\:33 { + padding-left: 33.33% !important; + } + + .pr-sm-up\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:33 { + padding: 33.33% !important; + } + + .px-md-down\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-md-down\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-md-down\:33 { + padding-top: 33.33% !important; + } + + .pb-md-down\:33 { + padding-bottom: 33.33% !important; + } + + .pl-md-down\:33 { + padding-left: 33.33% !important; + } + + .pr-md-down\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:33 { + padding: 33.33% !important; + } + + .px-md\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-md\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-md\:33 { + padding-top: 33.33% !important; + } + + .pb-md\:33 { + padding-bottom: 33.33% !important; + } + + .pl-md\:33 { + padding-left: 33.33% !important; + } + + .pr-md\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:33 { + padding: 33.33% !important; + } + + .px-md-up\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-md-up\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-md-up\:33 { + padding-top: 33.33% !important; + } + + .pb-md-up\:33 { + padding-bottom: 33.33% !important; + } + + .pl-md-up\:33 { + padding-left: 33.33% !important; + } + + .pr-md-up\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:33 { + padding: 33.33% !important; + } + + .px-lg-down\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-lg-down\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-lg-down\:33 { + padding-top: 33.33% !important; + } + + .pb-lg-down\:33 { + padding-bottom: 33.33% !important; + } + + .pl-lg-down\:33 { + padding-left: 33.33% !important; + } + + .pr-lg-down\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:33 { + padding: 33.33% !important; + } + + .px-lg\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-lg\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-lg\:33 { + padding-top: 33.33% !important; + } + + .pb-lg\:33 { + padding-bottom: 33.33% !important; + } + + .pl-lg\:33 { + padding-left: 33.33% !important; + } + + .pr-lg\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:33 { + padding: 33.33% !important; + } + + .px-lg-up\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-lg-up\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-lg-up\:33 { + padding-top: 33.33% !important; + } + + .pb-lg-up\:33 { + padding-bottom: 33.33% !important; + } + + .pl-lg-up\:33 { + padding-left: 33.33% !important; + } + + .pr-lg-up\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:33 { + padding: 33.33% !important; + } + + .px-xl-down\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-xl-down\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-xl-down\:33 { + padding-top: 33.33% !important; + } + + .pb-xl-down\:33 { + padding-bottom: 33.33% !important; + } + + .pl-xl-down\:33 { + padding-left: 33.33% !important; + } + + .pr-xl-down\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:33 { + padding: 33.33% !important; + } + + .px-xl\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-xl\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-xl\:33 { + padding-top: 33.33% !important; + } + + .pb-xl\:33 { + padding-bottom: 33.33% !important; + } + + .pl-xl\:33 { + padding-left: 33.33% !important; + } + + .pr-xl\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:33 { + padding: 33.33% !important; + } + + .px-xl-up\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-xl-up\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-xl-up\:33 { + padding-top: 33.33% !important; + } + + .pb-xl-up\:33 { + padding-bottom: 33.33% !important; + } + + .pl-xl-up\:33 { + padding-left: 33.33% !important; + } + + .pr-xl-up\:33 { + padding-right: 33.33% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:33 { + padding: 33.33% !important; + } + + .px-xxl\:33 { + padding-left: 33.33% !important; + padding-right: 33.33% !important; + } + + .py-xxl\:33 { + padding-top: 33.33% !important; + padding-bottom: 33.33% !important; + } + + .pt-xxl\:33 { + padding-top: 33.33% !important; + } + + .pb-xxl\:33 { + padding-bottom: 33.33% !important; + } + + .pl-xxl\:33 { + padding-left: 33.33% !important; + } + + .pr-xxl\:33 { + padding-right: 33.33% !important; + } +} +.p\:40 { + padding: 40% !important; +} + +.px\:40 { + padding-left: 40% !important; + padding-right: 40% !important; +} + +.py\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; +} + +.pt\:40 { + padding-top: 40% !important; +} + +.pb\:40 { + padding-bottom: 40% !important; +} + +.pl\:40 { + padding-left: 40% !important; +} + +.pr\:40 { + padding-right: 40% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:40 { + padding: 40% !important; + } + + .px-xs\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-xs\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-xs\:40 { + padding-top: 40% !important; + } + + .pb-xs\:40 { + padding-bottom: 40% !important; + } + + .pl-xs\:40 { + padding-left: 40% !important; + } + + .pr-xs\:40 { + padding-right: 40% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:40 { + padding: 40% !important; + } + + .px-sm-down\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-sm-down\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-sm-down\:40 { + padding-top: 40% !important; + } + + .pb-sm-down\:40 { + padding-bottom: 40% !important; + } + + .pl-sm-down\:40 { + padding-left: 40% !important; + } + + .pr-sm-down\:40 { + padding-right: 40% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:40 { + padding: 40% !important; + } + + .px-sm\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-sm\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-sm\:40 { + padding-top: 40% !important; + } + + .pb-sm\:40 { + padding-bottom: 40% !important; + } + + .pl-sm\:40 { + padding-left: 40% !important; + } + + .pr-sm\:40 { + padding-right: 40% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:40 { + padding: 40% !important; + } + + .px-sm-up\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-sm-up\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-sm-up\:40 { + padding-top: 40% !important; + } + + .pb-sm-up\:40 { + padding-bottom: 40% !important; + } + + .pl-sm-up\:40 { + padding-left: 40% !important; + } + + .pr-sm-up\:40 { + padding-right: 40% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:40 { + padding: 40% !important; + } + + .px-md-down\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-md-down\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-md-down\:40 { + padding-top: 40% !important; + } + + .pb-md-down\:40 { + padding-bottom: 40% !important; + } + + .pl-md-down\:40 { + padding-left: 40% !important; + } + + .pr-md-down\:40 { + padding-right: 40% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:40 { + padding: 40% !important; + } + + .px-md\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-md\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-md\:40 { + padding-top: 40% !important; + } + + .pb-md\:40 { + padding-bottom: 40% !important; + } + + .pl-md\:40 { + padding-left: 40% !important; + } + + .pr-md\:40 { + padding-right: 40% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:40 { + padding: 40% !important; + } + + .px-md-up\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-md-up\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-md-up\:40 { + padding-top: 40% !important; + } + + .pb-md-up\:40 { + padding-bottom: 40% !important; + } + + .pl-md-up\:40 { + padding-left: 40% !important; + } + + .pr-md-up\:40 { + padding-right: 40% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:40 { + padding: 40% !important; + } + + .px-lg-down\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-lg-down\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-lg-down\:40 { + padding-top: 40% !important; + } + + .pb-lg-down\:40 { + padding-bottom: 40% !important; + } + + .pl-lg-down\:40 { + padding-left: 40% !important; + } + + .pr-lg-down\:40 { + padding-right: 40% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:40 { + padding: 40% !important; + } + + .px-lg\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-lg\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-lg\:40 { + padding-top: 40% !important; + } + + .pb-lg\:40 { + padding-bottom: 40% !important; + } + + .pl-lg\:40 { + padding-left: 40% !important; + } + + .pr-lg\:40 { + padding-right: 40% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:40 { + padding: 40% !important; + } + + .px-lg-up\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-lg-up\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-lg-up\:40 { + padding-top: 40% !important; + } + + .pb-lg-up\:40 { + padding-bottom: 40% !important; + } + + .pl-lg-up\:40 { + padding-left: 40% !important; + } + + .pr-lg-up\:40 { + padding-right: 40% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:40 { + padding: 40% !important; + } + + .px-xl-down\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-xl-down\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-xl-down\:40 { + padding-top: 40% !important; + } + + .pb-xl-down\:40 { + padding-bottom: 40% !important; + } + + .pl-xl-down\:40 { + padding-left: 40% !important; + } + + .pr-xl-down\:40 { + padding-right: 40% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:40 { + padding: 40% !important; + } + + .px-xl\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-xl\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-xl\:40 { + padding-top: 40% !important; + } + + .pb-xl\:40 { + padding-bottom: 40% !important; + } + + .pl-xl\:40 { + padding-left: 40% !important; + } + + .pr-xl\:40 { + padding-right: 40% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:40 { + padding: 40% !important; + } + + .px-xl-up\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-xl-up\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-xl-up\:40 { + padding-top: 40% !important; + } + + .pb-xl-up\:40 { + padding-bottom: 40% !important; + } + + .pl-xl-up\:40 { + padding-left: 40% !important; + } + + .pr-xl-up\:40 { + padding-right: 40% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:40 { + padding: 40% !important; + } + + .px-xxl\:40 { + padding-left: 40% !important; + padding-right: 40% !important; + } + + .py-xxl\:40 { + padding-top: 40% !important; + padding-bottom: 40% !important; + } + + .pt-xxl\:40 { + padding-top: 40% !important; + } + + .pb-xxl\:40 { + padding-bottom: 40% !important; + } + + .pl-xxl\:40 { + padding-left: 40% !important; + } + + .pr-xxl\:40 { + padding-right: 40% !important; + } +} +.p\:45 { + padding: 45% !important; +} + +.px\:45 { + padding-left: 45% !important; + padding-right: 45% !important; +} + +.py\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; +} + +.pt\:45 { + padding-top: 45% !important; +} + +.pb\:45 { + padding-bottom: 45% !important; +} + +.pl\:45 { + padding-left: 45% !important; +} + +.pr\:45 { + padding-right: 45% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:45 { + padding: 45% !important; + } + + .px-xs\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-xs\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-xs\:45 { + padding-top: 45% !important; + } + + .pb-xs\:45 { + padding-bottom: 45% !important; + } + + .pl-xs\:45 { + padding-left: 45% !important; + } + + .pr-xs\:45 { + padding-right: 45% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:45 { + padding: 45% !important; + } + + .px-sm-down\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-sm-down\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-sm-down\:45 { + padding-top: 45% !important; + } + + .pb-sm-down\:45 { + padding-bottom: 45% !important; + } + + .pl-sm-down\:45 { + padding-left: 45% !important; + } + + .pr-sm-down\:45 { + padding-right: 45% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:45 { + padding: 45% !important; + } + + .px-sm\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-sm\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-sm\:45 { + padding-top: 45% !important; + } + + .pb-sm\:45 { + padding-bottom: 45% !important; + } + + .pl-sm\:45 { + padding-left: 45% !important; + } + + .pr-sm\:45 { + padding-right: 45% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:45 { + padding: 45% !important; + } + + .px-sm-up\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-sm-up\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-sm-up\:45 { + padding-top: 45% !important; + } + + .pb-sm-up\:45 { + padding-bottom: 45% !important; + } + + .pl-sm-up\:45 { + padding-left: 45% !important; + } + + .pr-sm-up\:45 { + padding-right: 45% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:45 { + padding: 45% !important; + } + + .px-md-down\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-md-down\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-md-down\:45 { + padding-top: 45% !important; + } + + .pb-md-down\:45 { + padding-bottom: 45% !important; + } + + .pl-md-down\:45 { + padding-left: 45% !important; + } + + .pr-md-down\:45 { + padding-right: 45% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:45 { + padding: 45% !important; + } + + .px-md\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-md\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-md\:45 { + padding-top: 45% !important; + } + + .pb-md\:45 { + padding-bottom: 45% !important; + } + + .pl-md\:45 { + padding-left: 45% !important; + } + + .pr-md\:45 { + padding-right: 45% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:45 { + padding: 45% !important; + } + + .px-md-up\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-md-up\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-md-up\:45 { + padding-top: 45% !important; + } + + .pb-md-up\:45 { + padding-bottom: 45% !important; + } + + .pl-md-up\:45 { + padding-left: 45% !important; + } + + .pr-md-up\:45 { + padding-right: 45% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:45 { + padding: 45% !important; + } + + .px-lg-down\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-lg-down\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-lg-down\:45 { + padding-top: 45% !important; + } + + .pb-lg-down\:45 { + padding-bottom: 45% !important; + } + + .pl-lg-down\:45 { + padding-left: 45% !important; + } + + .pr-lg-down\:45 { + padding-right: 45% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:45 { + padding: 45% !important; + } + + .px-lg\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-lg\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-lg\:45 { + padding-top: 45% !important; + } + + .pb-lg\:45 { + padding-bottom: 45% !important; + } + + .pl-lg\:45 { + padding-left: 45% !important; + } + + .pr-lg\:45 { + padding-right: 45% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:45 { + padding: 45% !important; + } + + .px-lg-up\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-lg-up\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-lg-up\:45 { + padding-top: 45% !important; + } + + .pb-lg-up\:45 { + padding-bottom: 45% !important; + } + + .pl-lg-up\:45 { + padding-left: 45% !important; + } + + .pr-lg-up\:45 { + padding-right: 45% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:45 { + padding: 45% !important; + } + + .px-xl-down\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-xl-down\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-xl-down\:45 { + padding-top: 45% !important; + } + + .pb-xl-down\:45 { + padding-bottom: 45% !important; + } + + .pl-xl-down\:45 { + padding-left: 45% !important; + } + + .pr-xl-down\:45 { + padding-right: 45% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:45 { + padding: 45% !important; + } + + .px-xl\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-xl\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-xl\:45 { + padding-top: 45% !important; + } + + .pb-xl\:45 { + padding-bottom: 45% !important; + } + + .pl-xl\:45 { + padding-left: 45% !important; + } + + .pr-xl\:45 { + padding-right: 45% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:45 { + padding: 45% !important; + } + + .px-xl-up\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-xl-up\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-xl-up\:45 { + padding-top: 45% !important; + } + + .pb-xl-up\:45 { + padding-bottom: 45% !important; + } + + .pl-xl-up\:45 { + padding-left: 45% !important; + } + + .pr-xl-up\:45 { + padding-right: 45% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:45 { + padding: 45% !important; + } + + .px-xxl\:45 { + padding-left: 45% !important; + padding-right: 45% !important; + } + + .py-xxl\:45 { + padding-top: 45% !important; + padding-bottom: 45% !important; + } + + .pt-xxl\:45 { + padding-top: 45% !important; + } + + .pb-xxl\:45 { + padding-bottom: 45% !important; + } + + .pl-xxl\:45 { + padding-left: 45% !important; + } + + .pr-xxl\:45 { + padding-right: 45% !important; + } +} +.p\:50 { + padding: 50% !important; +} + +.px\:50 { + padding-left: 50% !important; + padding-right: 50% !important; +} + +.py\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; +} + +.pt\:50 { + padding-top: 50% !important; +} + +.pb\:50 { + padding-bottom: 50% !important; +} + +.pl\:50 { + padding-left: 50% !important; +} + +.pr\:50 { + padding-right: 50% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:50 { + padding: 50% !important; + } + + .px-xs\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-xs\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-xs\:50 { + padding-top: 50% !important; + } + + .pb-xs\:50 { + padding-bottom: 50% !important; + } + + .pl-xs\:50 { + padding-left: 50% !important; + } + + .pr-xs\:50 { + padding-right: 50% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:50 { + padding: 50% !important; + } + + .px-sm-down\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-sm-down\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-sm-down\:50 { + padding-top: 50% !important; + } + + .pb-sm-down\:50 { + padding-bottom: 50% !important; + } + + .pl-sm-down\:50 { + padding-left: 50% !important; + } + + .pr-sm-down\:50 { + padding-right: 50% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:50 { + padding: 50% !important; + } + + .px-sm\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-sm\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-sm\:50 { + padding-top: 50% !important; + } + + .pb-sm\:50 { + padding-bottom: 50% !important; + } + + .pl-sm\:50 { + padding-left: 50% !important; + } + + .pr-sm\:50 { + padding-right: 50% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:50 { + padding: 50% !important; + } + + .px-sm-up\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-sm-up\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-sm-up\:50 { + padding-top: 50% !important; + } + + .pb-sm-up\:50 { + padding-bottom: 50% !important; + } + + .pl-sm-up\:50 { + padding-left: 50% !important; + } + + .pr-sm-up\:50 { + padding-right: 50% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:50 { + padding: 50% !important; + } + + .px-md-down\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-md-down\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-md-down\:50 { + padding-top: 50% !important; + } + + .pb-md-down\:50 { + padding-bottom: 50% !important; + } + + .pl-md-down\:50 { + padding-left: 50% !important; + } + + .pr-md-down\:50 { + padding-right: 50% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:50 { + padding: 50% !important; + } + + .px-md\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-md\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-md\:50 { + padding-top: 50% !important; + } + + .pb-md\:50 { + padding-bottom: 50% !important; + } + + .pl-md\:50 { + padding-left: 50% !important; + } + + .pr-md\:50 { + padding-right: 50% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:50 { + padding: 50% !important; + } + + .px-md-up\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-md-up\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-md-up\:50 { + padding-top: 50% !important; + } + + .pb-md-up\:50 { + padding-bottom: 50% !important; + } + + .pl-md-up\:50 { + padding-left: 50% !important; + } + + .pr-md-up\:50 { + padding-right: 50% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:50 { + padding: 50% !important; + } + + .px-lg-down\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-lg-down\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-lg-down\:50 { + padding-top: 50% !important; + } + + .pb-lg-down\:50 { + padding-bottom: 50% !important; + } + + .pl-lg-down\:50 { + padding-left: 50% !important; + } + + .pr-lg-down\:50 { + padding-right: 50% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:50 { + padding: 50% !important; + } + + .px-lg\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-lg\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-lg\:50 { + padding-top: 50% !important; + } + + .pb-lg\:50 { + padding-bottom: 50% !important; + } + + .pl-lg\:50 { + padding-left: 50% !important; + } + + .pr-lg\:50 { + padding-right: 50% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:50 { + padding: 50% !important; + } + + .px-lg-up\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-lg-up\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-lg-up\:50 { + padding-top: 50% !important; + } + + .pb-lg-up\:50 { + padding-bottom: 50% !important; + } + + .pl-lg-up\:50 { + padding-left: 50% !important; + } + + .pr-lg-up\:50 { + padding-right: 50% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:50 { + padding: 50% !important; + } + + .px-xl-down\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-xl-down\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-xl-down\:50 { + padding-top: 50% !important; + } + + .pb-xl-down\:50 { + padding-bottom: 50% !important; + } + + .pl-xl-down\:50 { + padding-left: 50% !important; + } + + .pr-xl-down\:50 { + padding-right: 50% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:50 { + padding: 50% !important; + } + + .px-xl\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-xl\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-xl\:50 { + padding-top: 50% !important; + } + + .pb-xl\:50 { + padding-bottom: 50% !important; + } + + .pl-xl\:50 { + padding-left: 50% !important; + } + + .pr-xl\:50 { + padding-right: 50% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:50 { + padding: 50% !important; + } + + .px-xl-up\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-xl-up\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-xl-up\:50 { + padding-top: 50% !important; + } + + .pb-xl-up\:50 { + padding-bottom: 50% !important; + } + + .pl-xl-up\:50 { + padding-left: 50% !important; + } + + .pr-xl-up\:50 { + padding-right: 50% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:50 { + padding: 50% !important; + } + + .px-xxl\:50 { + padding-left: 50% !important; + padding-right: 50% !important; + } + + .py-xxl\:50 { + padding-top: 50% !important; + padding-bottom: 50% !important; + } + + .pt-xxl\:50 { + padding-top: 50% !important; + } + + .pb-xxl\:50 { + padding-bottom: 50% !important; + } + + .pl-xxl\:50 { + padding-left: 50% !important; + } + + .pr-xxl\:50 { + padding-right: 50% !important; + } +} +.p\:60 { + padding: 60% !important; +} + +.px\:60 { + padding-left: 60% !important; + padding-right: 60% !important; +} + +.py\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; +} + +.pt\:60 { + padding-top: 60% !important; +} + +.pb\:60 { + padding-bottom: 60% !important; +} + +.pl\:60 { + padding-left: 60% !important; +} + +.pr\:60 { + padding-right: 60% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:60 { + padding: 60% !important; + } + + .px-xs\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-xs\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-xs\:60 { + padding-top: 60% !important; + } + + .pb-xs\:60 { + padding-bottom: 60% !important; + } + + .pl-xs\:60 { + padding-left: 60% !important; + } + + .pr-xs\:60 { + padding-right: 60% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:60 { + padding: 60% !important; + } + + .px-sm-down\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-sm-down\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-sm-down\:60 { + padding-top: 60% !important; + } + + .pb-sm-down\:60 { + padding-bottom: 60% !important; + } + + .pl-sm-down\:60 { + padding-left: 60% !important; + } + + .pr-sm-down\:60 { + padding-right: 60% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:60 { + padding: 60% !important; + } + + .px-sm\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-sm\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-sm\:60 { + padding-top: 60% !important; + } + + .pb-sm\:60 { + padding-bottom: 60% !important; + } + + .pl-sm\:60 { + padding-left: 60% !important; + } + + .pr-sm\:60 { + padding-right: 60% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:60 { + padding: 60% !important; + } + + .px-sm-up\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-sm-up\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-sm-up\:60 { + padding-top: 60% !important; + } + + .pb-sm-up\:60 { + padding-bottom: 60% !important; + } + + .pl-sm-up\:60 { + padding-left: 60% !important; + } + + .pr-sm-up\:60 { + padding-right: 60% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:60 { + padding: 60% !important; + } + + .px-md-down\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-md-down\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-md-down\:60 { + padding-top: 60% !important; + } + + .pb-md-down\:60 { + padding-bottom: 60% !important; + } + + .pl-md-down\:60 { + padding-left: 60% !important; + } + + .pr-md-down\:60 { + padding-right: 60% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:60 { + padding: 60% !important; + } + + .px-md\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-md\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-md\:60 { + padding-top: 60% !important; + } + + .pb-md\:60 { + padding-bottom: 60% !important; + } + + .pl-md\:60 { + padding-left: 60% !important; + } + + .pr-md\:60 { + padding-right: 60% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:60 { + padding: 60% !important; + } + + .px-md-up\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-md-up\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-md-up\:60 { + padding-top: 60% !important; + } + + .pb-md-up\:60 { + padding-bottom: 60% !important; + } + + .pl-md-up\:60 { + padding-left: 60% !important; + } + + .pr-md-up\:60 { + padding-right: 60% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:60 { + padding: 60% !important; + } + + .px-lg-down\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-lg-down\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-lg-down\:60 { + padding-top: 60% !important; + } + + .pb-lg-down\:60 { + padding-bottom: 60% !important; + } + + .pl-lg-down\:60 { + padding-left: 60% !important; + } + + .pr-lg-down\:60 { + padding-right: 60% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:60 { + padding: 60% !important; + } + + .px-lg\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-lg\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-lg\:60 { + padding-top: 60% !important; + } + + .pb-lg\:60 { + padding-bottom: 60% !important; + } + + .pl-lg\:60 { + padding-left: 60% !important; + } + + .pr-lg\:60 { + padding-right: 60% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:60 { + padding: 60% !important; + } + + .px-lg-up\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-lg-up\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-lg-up\:60 { + padding-top: 60% !important; + } + + .pb-lg-up\:60 { + padding-bottom: 60% !important; + } + + .pl-lg-up\:60 { + padding-left: 60% !important; + } + + .pr-lg-up\:60 { + padding-right: 60% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:60 { + padding: 60% !important; + } + + .px-xl-down\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-xl-down\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-xl-down\:60 { + padding-top: 60% !important; + } + + .pb-xl-down\:60 { + padding-bottom: 60% !important; + } + + .pl-xl-down\:60 { + padding-left: 60% !important; + } + + .pr-xl-down\:60 { + padding-right: 60% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:60 { + padding: 60% !important; + } + + .px-xl\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-xl\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-xl\:60 { + padding-top: 60% !important; + } + + .pb-xl\:60 { + padding-bottom: 60% !important; + } + + .pl-xl\:60 { + padding-left: 60% !important; + } + + .pr-xl\:60 { + padding-right: 60% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:60 { + padding: 60% !important; + } + + .px-xl-up\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-xl-up\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-xl-up\:60 { + padding-top: 60% !important; + } + + .pb-xl-up\:60 { + padding-bottom: 60% !important; + } + + .pl-xl-up\:60 { + padding-left: 60% !important; + } + + .pr-xl-up\:60 { + padding-right: 60% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:60 { + padding: 60% !important; + } + + .px-xxl\:60 { + padding-left: 60% !important; + padding-right: 60% !important; + } + + .py-xxl\:60 { + padding-top: 60% !important; + padding-bottom: 60% !important; + } + + .pt-xxl\:60 { + padding-top: 60% !important; + } + + .pb-xxl\:60 { + padding-bottom: 60% !important; + } + + .pl-xxl\:60 { + padding-left: 60% !important; + } + + .pr-xxl\:60 { + padding-right: 60% !important; + } +} +.p\:66 { + padding: 66.66% !important; +} + +.px\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; +} + +.py\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; +} + +.pt\:66 { + padding-top: 66.66% !important; +} + +.pb\:66 { + padding-bottom: 66.66% !important; +} + +.pl\:66 { + padding-left: 66.66% !important; +} + +.pr\:66 { + padding-right: 66.66% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:66 { + padding: 66.66% !important; + } + + .px-xs\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-xs\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-xs\:66 { + padding-top: 66.66% !important; + } + + .pb-xs\:66 { + padding-bottom: 66.66% !important; + } + + .pl-xs\:66 { + padding-left: 66.66% !important; + } + + .pr-xs\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:66 { + padding: 66.66% !important; + } + + .px-sm-down\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-sm-down\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-sm-down\:66 { + padding-top: 66.66% !important; + } + + .pb-sm-down\:66 { + padding-bottom: 66.66% !important; + } + + .pl-sm-down\:66 { + padding-left: 66.66% !important; + } + + .pr-sm-down\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:66 { + padding: 66.66% !important; + } + + .px-sm\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-sm\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-sm\:66 { + padding-top: 66.66% !important; + } + + .pb-sm\:66 { + padding-bottom: 66.66% !important; + } + + .pl-sm\:66 { + padding-left: 66.66% !important; + } + + .pr-sm\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:66 { + padding: 66.66% !important; + } + + .px-sm-up\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-sm-up\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-sm-up\:66 { + padding-top: 66.66% !important; + } + + .pb-sm-up\:66 { + padding-bottom: 66.66% !important; + } + + .pl-sm-up\:66 { + padding-left: 66.66% !important; + } + + .pr-sm-up\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:66 { + padding: 66.66% !important; + } + + .px-md-down\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-md-down\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-md-down\:66 { + padding-top: 66.66% !important; + } + + .pb-md-down\:66 { + padding-bottom: 66.66% !important; + } + + .pl-md-down\:66 { + padding-left: 66.66% !important; + } + + .pr-md-down\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:66 { + padding: 66.66% !important; + } + + .px-md\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-md\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-md\:66 { + padding-top: 66.66% !important; + } + + .pb-md\:66 { + padding-bottom: 66.66% !important; + } + + .pl-md\:66 { + padding-left: 66.66% !important; + } + + .pr-md\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:66 { + padding: 66.66% !important; + } + + .px-md-up\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-md-up\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-md-up\:66 { + padding-top: 66.66% !important; + } + + .pb-md-up\:66 { + padding-bottom: 66.66% !important; + } + + .pl-md-up\:66 { + padding-left: 66.66% !important; + } + + .pr-md-up\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:66 { + padding: 66.66% !important; + } + + .px-lg-down\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-lg-down\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-lg-down\:66 { + padding-top: 66.66% !important; + } + + .pb-lg-down\:66 { + padding-bottom: 66.66% !important; + } + + .pl-lg-down\:66 { + padding-left: 66.66% !important; + } + + .pr-lg-down\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:66 { + padding: 66.66% !important; + } + + .px-lg\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-lg\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-lg\:66 { + padding-top: 66.66% !important; + } + + .pb-lg\:66 { + padding-bottom: 66.66% !important; + } + + .pl-lg\:66 { + padding-left: 66.66% !important; + } + + .pr-lg\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:66 { + padding: 66.66% !important; + } + + .px-lg-up\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-lg-up\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-lg-up\:66 { + padding-top: 66.66% !important; + } + + .pb-lg-up\:66 { + padding-bottom: 66.66% !important; + } + + .pl-lg-up\:66 { + padding-left: 66.66% !important; + } + + .pr-lg-up\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:66 { + padding: 66.66% !important; + } + + .px-xl-down\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-xl-down\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-xl-down\:66 { + padding-top: 66.66% !important; + } + + .pb-xl-down\:66 { + padding-bottom: 66.66% !important; + } + + .pl-xl-down\:66 { + padding-left: 66.66% !important; + } + + .pr-xl-down\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:66 { + padding: 66.66% !important; + } + + .px-xl\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-xl\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-xl\:66 { + padding-top: 66.66% !important; + } + + .pb-xl\:66 { + padding-bottom: 66.66% !important; + } + + .pl-xl\:66 { + padding-left: 66.66% !important; + } + + .pr-xl\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:66 { + padding: 66.66% !important; + } + + .px-xl-up\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-xl-up\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-xl-up\:66 { + padding-top: 66.66% !important; + } + + .pb-xl-up\:66 { + padding-bottom: 66.66% !important; + } + + .pl-xl-up\:66 { + padding-left: 66.66% !important; + } + + .pr-xl-up\:66 { + padding-right: 66.66% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:66 { + padding: 66.66% !important; + } + + .px-xxl\:66 { + padding-left: 66.66% !important; + padding-right: 66.66% !important; + } + + .py-xxl\:66 { + padding-top: 66.66% !important; + padding-bottom: 66.66% !important; + } + + .pt-xxl\:66 { + padding-top: 66.66% !important; + } + + .pb-xxl\:66 { + padding-bottom: 66.66% !important; + } + + .pl-xxl\:66 { + padding-left: 66.66% !important; + } + + .pr-xxl\:66 { + padding-right: 66.66% !important; + } +} +.p\:70 { + padding: 70% !important; +} + +.px\:70 { + padding-left: 70% !important; + padding-right: 70% !important; +} + +.py\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; +} + +.pt\:70 { + padding-top: 70% !important; +} + +.pb\:70 { + padding-bottom: 70% !important; +} + +.pl\:70 { + padding-left: 70% !important; +} + +.pr\:70 { + padding-right: 70% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:70 { + padding: 70% !important; + } + + .px-xs\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-xs\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-xs\:70 { + padding-top: 70% !important; + } + + .pb-xs\:70 { + padding-bottom: 70% !important; + } + + .pl-xs\:70 { + padding-left: 70% !important; + } + + .pr-xs\:70 { + padding-right: 70% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:70 { + padding: 70% !important; + } + + .px-sm-down\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-sm-down\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-sm-down\:70 { + padding-top: 70% !important; + } + + .pb-sm-down\:70 { + padding-bottom: 70% !important; + } + + .pl-sm-down\:70 { + padding-left: 70% !important; + } + + .pr-sm-down\:70 { + padding-right: 70% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:70 { + padding: 70% !important; + } + + .px-sm\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-sm\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-sm\:70 { + padding-top: 70% !important; + } + + .pb-sm\:70 { + padding-bottom: 70% !important; + } + + .pl-sm\:70 { + padding-left: 70% !important; + } + + .pr-sm\:70 { + padding-right: 70% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:70 { + padding: 70% !important; + } + + .px-sm-up\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-sm-up\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-sm-up\:70 { + padding-top: 70% !important; + } + + .pb-sm-up\:70 { + padding-bottom: 70% !important; + } + + .pl-sm-up\:70 { + padding-left: 70% !important; + } + + .pr-sm-up\:70 { + padding-right: 70% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:70 { + padding: 70% !important; + } + + .px-md-down\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-md-down\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-md-down\:70 { + padding-top: 70% !important; + } + + .pb-md-down\:70 { + padding-bottom: 70% !important; + } + + .pl-md-down\:70 { + padding-left: 70% !important; + } + + .pr-md-down\:70 { + padding-right: 70% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:70 { + padding: 70% !important; + } + + .px-md\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-md\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-md\:70 { + padding-top: 70% !important; + } + + .pb-md\:70 { + padding-bottom: 70% !important; + } + + .pl-md\:70 { + padding-left: 70% !important; + } + + .pr-md\:70 { + padding-right: 70% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:70 { + padding: 70% !important; + } + + .px-md-up\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-md-up\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-md-up\:70 { + padding-top: 70% !important; + } + + .pb-md-up\:70 { + padding-bottom: 70% !important; + } + + .pl-md-up\:70 { + padding-left: 70% !important; + } + + .pr-md-up\:70 { + padding-right: 70% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:70 { + padding: 70% !important; + } + + .px-lg-down\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-lg-down\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-lg-down\:70 { + padding-top: 70% !important; + } + + .pb-lg-down\:70 { + padding-bottom: 70% !important; + } + + .pl-lg-down\:70 { + padding-left: 70% !important; + } + + .pr-lg-down\:70 { + padding-right: 70% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:70 { + padding: 70% !important; + } + + .px-lg\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-lg\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-lg\:70 { + padding-top: 70% !important; + } + + .pb-lg\:70 { + padding-bottom: 70% !important; + } + + .pl-lg\:70 { + padding-left: 70% !important; + } + + .pr-lg\:70 { + padding-right: 70% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:70 { + padding: 70% !important; + } + + .px-lg-up\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-lg-up\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-lg-up\:70 { + padding-top: 70% !important; + } + + .pb-lg-up\:70 { + padding-bottom: 70% !important; + } + + .pl-lg-up\:70 { + padding-left: 70% !important; + } + + .pr-lg-up\:70 { + padding-right: 70% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:70 { + padding: 70% !important; + } + + .px-xl-down\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-xl-down\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-xl-down\:70 { + padding-top: 70% !important; + } + + .pb-xl-down\:70 { + padding-bottom: 70% !important; + } + + .pl-xl-down\:70 { + padding-left: 70% !important; + } + + .pr-xl-down\:70 { + padding-right: 70% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:70 { + padding: 70% !important; + } + + .px-xl\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-xl\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-xl\:70 { + padding-top: 70% !important; + } + + .pb-xl\:70 { + padding-bottom: 70% !important; + } + + .pl-xl\:70 { + padding-left: 70% !important; + } + + .pr-xl\:70 { + padding-right: 70% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:70 { + padding: 70% !important; + } + + .px-xl-up\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-xl-up\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-xl-up\:70 { + padding-top: 70% !important; + } + + .pb-xl-up\:70 { + padding-bottom: 70% !important; + } + + .pl-xl-up\:70 { + padding-left: 70% !important; + } + + .pr-xl-up\:70 { + padding-right: 70% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:70 { + padding: 70% !important; + } + + .px-xxl\:70 { + padding-left: 70% !important; + padding-right: 70% !important; + } + + .py-xxl\:70 { + padding-top: 70% !important; + padding-bottom: 70% !important; + } + + .pt-xxl\:70 { + padding-top: 70% !important; + } + + .pb-xxl\:70 { + padding-bottom: 70% !important; + } + + .pl-xxl\:70 { + padding-left: 70% !important; + } + + .pr-xxl\:70 { + padding-right: 70% !important; + } +} +.p\:75 { + padding: 75% !important; +} + +.px\:75 { + padding-left: 75% !important; + padding-right: 75% !important; +} + +.py\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; +} + +.pt\:75 { + padding-top: 75% !important; +} + +.pb\:75 { + padding-bottom: 75% !important; +} + +.pl\:75 { + padding-left: 75% !important; +} + +.pr\:75 { + padding-right: 75% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:75 { + padding: 75% !important; + } + + .px-xs\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-xs\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-xs\:75 { + padding-top: 75% !important; + } + + .pb-xs\:75 { + padding-bottom: 75% !important; + } + + .pl-xs\:75 { + padding-left: 75% !important; + } + + .pr-xs\:75 { + padding-right: 75% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:75 { + padding: 75% !important; + } + + .px-sm-down\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-sm-down\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-sm-down\:75 { + padding-top: 75% !important; + } + + .pb-sm-down\:75 { + padding-bottom: 75% !important; + } + + .pl-sm-down\:75 { + padding-left: 75% !important; + } + + .pr-sm-down\:75 { + padding-right: 75% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:75 { + padding: 75% !important; + } + + .px-sm\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-sm\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-sm\:75 { + padding-top: 75% !important; + } + + .pb-sm\:75 { + padding-bottom: 75% !important; + } + + .pl-sm\:75 { + padding-left: 75% !important; + } + + .pr-sm\:75 { + padding-right: 75% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:75 { + padding: 75% !important; + } + + .px-sm-up\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-sm-up\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-sm-up\:75 { + padding-top: 75% !important; + } + + .pb-sm-up\:75 { + padding-bottom: 75% !important; + } + + .pl-sm-up\:75 { + padding-left: 75% !important; + } + + .pr-sm-up\:75 { + padding-right: 75% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:75 { + padding: 75% !important; + } + + .px-md-down\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-md-down\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-md-down\:75 { + padding-top: 75% !important; + } + + .pb-md-down\:75 { + padding-bottom: 75% !important; + } + + .pl-md-down\:75 { + padding-left: 75% !important; + } + + .pr-md-down\:75 { + padding-right: 75% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:75 { + padding: 75% !important; + } + + .px-md\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-md\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-md\:75 { + padding-top: 75% !important; + } + + .pb-md\:75 { + padding-bottom: 75% !important; + } + + .pl-md\:75 { + padding-left: 75% !important; + } + + .pr-md\:75 { + padding-right: 75% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:75 { + padding: 75% !important; + } + + .px-md-up\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-md-up\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-md-up\:75 { + padding-top: 75% !important; + } + + .pb-md-up\:75 { + padding-bottom: 75% !important; + } + + .pl-md-up\:75 { + padding-left: 75% !important; + } + + .pr-md-up\:75 { + padding-right: 75% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:75 { + padding: 75% !important; + } + + .px-lg-down\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-lg-down\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-lg-down\:75 { + padding-top: 75% !important; + } + + .pb-lg-down\:75 { + padding-bottom: 75% !important; + } + + .pl-lg-down\:75 { + padding-left: 75% !important; + } + + .pr-lg-down\:75 { + padding-right: 75% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:75 { + padding: 75% !important; + } + + .px-lg\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-lg\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-lg\:75 { + padding-top: 75% !important; + } + + .pb-lg\:75 { + padding-bottom: 75% !important; + } + + .pl-lg\:75 { + padding-left: 75% !important; + } + + .pr-lg\:75 { + padding-right: 75% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:75 { + padding: 75% !important; + } + + .px-lg-up\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-lg-up\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-lg-up\:75 { + padding-top: 75% !important; + } + + .pb-lg-up\:75 { + padding-bottom: 75% !important; + } + + .pl-lg-up\:75 { + padding-left: 75% !important; + } + + .pr-lg-up\:75 { + padding-right: 75% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:75 { + padding: 75% !important; + } + + .px-xl-down\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-xl-down\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-xl-down\:75 { + padding-top: 75% !important; + } + + .pb-xl-down\:75 { + padding-bottom: 75% !important; + } + + .pl-xl-down\:75 { + padding-left: 75% !important; + } + + .pr-xl-down\:75 { + padding-right: 75% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:75 { + padding: 75% !important; + } + + .px-xl\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-xl\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-xl\:75 { + padding-top: 75% !important; + } + + .pb-xl\:75 { + padding-bottom: 75% !important; + } + + .pl-xl\:75 { + padding-left: 75% !important; + } + + .pr-xl\:75 { + padding-right: 75% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:75 { + padding: 75% !important; + } + + .px-xl-up\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-xl-up\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-xl-up\:75 { + padding-top: 75% !important; + } + + .pb-xl-up\:75 { + padding-bottom: 75% !important; + } + + .pl-xl-up\:75 { + padding-left: 75% !important; + } + + .pr-xl-up\:75 { + padding-right: 75% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:75 { + padding: 75% !important; + } + + .px-xxl\:75 { + padding-left: 75% !important; + padding-right: 75% !important; + } + + .py-xxl\:75 { + padding-top: 75% !important; + padding-bottom: 75% !important; + } + + .pt-xxl\:75 { + padding-top: 75% !important; + } + + .pb-xxl\:75 { + padding-bottom: 75% !important; + } + + .pl-xxl\:75 { + padding-left: 75% !important; + } + + .pr-xxl\:75 { + padding-right: 75% !important; + } +} +.p\:80 { + padding: 80% !important; +} + +.px\:80 { + padding-left: 80% !important; + padding-right: 80% !important; +} + +.py\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; +} + +.pt\:80 { + padding-top: 80% !important; +} + +.pb\:80 { + padding-bottom: 80% !important; +} + +.pl\:80 { + padding-left: 80% !important; +} + +.pr\:80 { + padding-right: 80% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:80 { + padding: 80% !important; + } + + .px-xs\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-xs\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-xs\:80 { + padding-top: 80% !important; + } + + .pb-xs\:80 { + padding-bottom: 80% !important; + } + + .pl-xs\:80 { + padding-left: 80% !important; + } + + .pr-xs\:80 { + padding-right: 80% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:80 { + padding: 80% !important; + } + + .px-sm-down\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-sm-down\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-sm-down\:80 { + padding-top: 80% !important; + } + + .pb-sm-down\:80 { + padding-bottom: 80% !important; + } + + .pl-sm-down\:80 { + padding-left: 80% !important; + } + + .pr-sm-down\:80 { + padding-right: 80% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:80 { + padding: 80% !important; + } + + .px-sm\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-sm\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-sm\:80 { + padding-top: 80% !important; + } + + .pb-sm\:80 { + padding-bottom: 80% !important; + } + + .pl-sm\:80 { + padding-left: 80% !important; + } + + .pr-sm\:80 { + padding-right: 80% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:80 { + padding: 80% !important; + } + + .px-sm-up\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-sm-up\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-sm-up\:80 { + padding-top: 80% !important; + } + + .pb-sm-up\:80 { + padding-bottom: 80% !important; + } + + .pl-sm-up\:80 { + padding-left: 80% !important; + } + + .pr-sm-up\:80 { + padding-right: 80% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:80 { + padding: 80% !important; + } + + .px-md-down\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-md-down\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-md-down\:80 { + padding-top: 80% !important; + } + + .pb-md-down\:80 { + padding-bottom: 80% !important; + } + + .pl-md-down\:80 { + padding-left: 80% !important; + } + + .pr-md-down\:80 { + padding-right: 80% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:80 { + padding: 80% !important; + } + + .px-md\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-md\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-md\:80 { + padding-top: 80% !important; + } + + .pb-md\:80 { + padding-bottom: 80% !important; + } + + .pl-md\:80 { + padding-left: 80% !important; + } + + .pr-md\:80 { + padding-right: 80% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:80 { + padding: 80% !important; + } + + .px-md-up\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-md-up\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-md-up\:80 { + padding-top: 80% !important; + } + + .pb-md-up\:80 { + padding-bottom: 80% !important; + } + + .pl-md-up\:80 { + padding-left: 80% !important; + } + + .pr-md-up\:80 { + padding-right: 80% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:80 { + padding: 80% !important; + } + + .px-lg-down\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-lg-down\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-lg-down\:80 { + padding-top: 80% !important; + } + + .pb-lg-down\:80 { + padding-bottom: 80% !important; + } + + .pl-lg-down\:80 { + padding-left: 80% !important; + } + + .pr-lg-down\:80 { + padding-right: 80% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:80 { + padding: 80% !important; + } + + .px-lg\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-lg\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-lg\:80 { + padding-top: 80% !important; + } + + .pb-lg\:80 { + padding-bottom: 80% !important; + } + + .pl-lg\:80 { + padding-left: 80% !important; + } + + .pr-lg\:80 { + padding-right: 80% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:80 { + padding: 80% !important; + } + + .px-lg-up\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-lg-up\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-lg-up\:80 { + padding-top: 80% !important; + } + + .pb-lg-up\:80 { + padding-bottom: 80% !important; + } + + .pl-lg-up\:80 { + padding-left: 80% !important; + } + + .pr-lg-up\:80 { + padding-right: 80% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:80 { + padding: 80% !important; + } + + .px-xl-down\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-xl-down\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-xl-down\:80 { + padding-top: 80% !important; + } + + .pb-xl-down\:80 { + padding-bottom: 80% !important; + } + + .pl-xl-down\:80 { + padding-left: 80% !important; + } + + .pr-xl-down\:80 { + padding-right: 80% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:80 { + padding: 80% !important; + } + + .px-xl\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-xl\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-xl\:80 { + padding-top: 80% !important; + } + + .pb-xl\:80 { + padding-bottom: 80% !important; + } + + .pl-xl\:80 { + padding-left: 80% !important; + } + + .pr-xl\:80 { + padding-right: 80% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:80 { + padding: 80% !important; + } + + .px-xl-up\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-xl-up\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-xl-up\:80 { + padding-top: 80% !important; + } + + .pb-xl-up\:80 { + padding-bottom: 80% !important; + } + + .pl-xl-up\:80 { + padding-left: 80% !important; + } + + .pr-xl-up\:80 { + padding-right: 80% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:80 { + padding: 80% !important; + } + + .px-xxl\:80 { + padding-left: 80% !important; + padding-right: 80% !important; + } + + .py-xxl\:80 { + padding-top: 80% !important; + padding-bottom: 80% !important; + } + + .pt-xxl\:80 { + padding-top: 80% !important; + } + + .pb-xxl\:80 { + padding-bottom: 80% !important; + } + + .pl-xxl\:80 { + padding-left: 80% !important; + } + + .pr-xxl\:80 { + padding-right: 80% !important; + } +} +.p\:90 { + padding: 90% !important; +} + +.px\:90 { + padding-left: 90% !important; + padding-right: 90% !important; +} + +.py\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; +} + +.pt\:90 { + padding-top: 90% !important; +} + +.pb\:90 { + padding-bottom: 90% !important; +} + +.pl\:90 { + padding-left: 90% !important; +} + +.pr\:90 { + padding-right: 90% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:90 { + padding: 90% !important; + } + + .px-xs\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-xs\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-xs\:90 { + padding-top: 90% !important; + } + + .pb-xs\:90 { + padding-bottom: 90% !important; + } + + .pl-xs\:90 { + padding-left: 90% !important; + } + + .pr-xs\:90 { + padding-right: 90% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:90 { + padding: 90% !important; + } + + .px-sm-down\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-sm-down\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-sm-down\:90 { + padding-top: 90% !important; + } + + .pb-sm-down\:90 { + padding-bottom: 90% !important; + } + + .pl-sm-down\:90 { + padding-left: 90% !important; + } + + .pr-sm-down\:90 { + padding-right: 90% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:90 { + padding: 90% !important; + } + + .px-sm\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-sm\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-sm\:90 { + padding-top: 90% !important; + } + + .pb-sm\:90 { + padding-bottom: 90% !important; + } + + .pl-sm\:90 { + padding-left: 90% !important; + } + + .pr-sm\:90 { + padding-right: 90% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:90 { + padding: 90% !important; + } + + .px-sm-up\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-sm-up\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-sm-up\:90 { + padding-top: 90% !important; + } + + .pb-sm-up\:90 { + padding-bottom: 90% !important; + } + + .pl-sm-up\:90 { + padding-left: 90% !important; + } + + .pr-sm-up\:90 { + padding-right: 90% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:90 { + padding: 90% !important; + } + + .px-md-down\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-md-down\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-md-down\:90 { + padding-top: 90% !important; + } + + .pb-md-down\:90 { + padding-bottom: 90% !important; + } + + .pl-md-down\:90 { + padding-left: 90% !important; + } + + .pr-md-down\:90 { + padding-right: 90% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:90 { + padding: 90% !important; + } + + .px-md\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-md\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-md\:90 { + padding-top: 90% !important; + } + + .pb-md\:90 { + padding-bottom: 90% !important; + } + + .pl-md\:90 { + padding-left: 90% !important; + } + + .pr-md\:90 { + padding-right: 90% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:90 { + padding: 90% !important; + } + + .px-md-up\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-md-up\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-md-up\:90 { + padding-top: 90% !important; + } + + .pb-md-up\:90 { + padding-bottom: 90% !important; + } + + .pl-md-up\:90 { + padding-left: 90% !important; + } + + .pr-md-up\:90 { + padding-right: 90% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:90 { + padding: 90% !important; + } + + .px-lg-down\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-lg-down\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-lg-down\:90 { + padding-top: 90% !important; + } + + .pb-lg-down\:90 { + padding-bottom: 90% !important; + } + + .pl-lg-down\:90 { + padding-left: 90% !important; + } + + .pr-lg-down\:90 { + padding-right: 90% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:90 { + padding: 90% !important; + } + + .px-lg\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-lg\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-lg\:90 { + padding-top: 90% !important; + } + + .pb-lg\:90 { + padding-bottom: 90% !important; + } + + .pl-lg\:90 { + padding-left: 90% !important; + } + + .pr-lg\:90 { + padding-right: 90% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:90 { + padding: 90% !important; + } + + .px-lg-up\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-lg-up\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-lg-up\:90 { + padding-top: 90% !important; + } + + .pb-lg-up\:90 { + padding-bottom: 90% !important; + } + + .pl-lg-up\:90 { + padding-left: 90% !important; + } + + .pr-lg-up\:90 { + padding-right: 90% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:90 { + padding: 90% !important; + } + + .px-xl-down\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-xl-down\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-xl-down\:90 { + padding-top: 90% !important; + } + + .pb-xl-down\:90 { + padding-bottom: 90% !important; + } + + .pl-xl-down\:90 { + padding-left: 90% !important; + } + + .pr-xl-down\:90 { + padding-right: 90% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:90 { + padding: 90% !important; + } + + .px-xl\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-xl\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-xl\:90 { + padding-top: 90% !important; + } + + .pb-xl\:90 { + padding-bottom: 90% !important; + } + + .pl-xl\:90 { + padding-left: 90% !important; + } + + .pr-xl\:90 { + padding-right: 90% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:90 { + padding: 90% !important; + } + + .px-xl-up\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-xl-up\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-xl-up\:90 { + padding-top: 90% !important; + } + + .pb-xl-up\:90 { + padding-bottom: 90% !important; + } + + .pl-xl-up\:90 { + padding-left: 90% !important; + } + + .pr-xl-up\:90 { + padding-right: 90% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:90 { + padding: 90% !important; + } + + .px-xxl\:90 { + padding-left: 90% !important; + padding-right: 90% !important; + } + + .py-xxl\:90 { + padding-top: 90% !important; + padding-bottom: 90% !important; + } + + .pt-xxl\:90 { + padding-top: 90% !important; + } + + .pb-xxl\:90 { + padding-bottom: 90% !important; + } + + .pl-xxl\:90 { + padding-left: 90% !important; + } + + .pr-xxl\:90 { + padding-right: 90% !important; + } +} +.p\:100 { + padding: 100% !important; +} + +.px\:100 { + padding-left: 100% !important; + padding-right: 100% !important; +} + +.py\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; +} + +.pt\:100 { + padding-top: 100% !important; +} + +.pb\:100 { + padding-bottom: 100% !important; +} + +.pl\:100 { + padding-left: 100% !important; +} + +.pr\:100 { + padding-right: 100% !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:100 { + padding: 100% !important; + } + + .px-xs\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-xs\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-xs\:100 { + padding-top: 100% !important; + } + + .pb-xs\:100 { + padding-bottom: 100% !important; + } + + .pl-xs\:100 { + padding-left: 100% !important; + } + + .pr-xs\:100 { + padding-right: 100% !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:100 { + padding: 100% !important; + } + + .px-sm-down\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-sm-down\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-sm-down\:100 { + padding-top: 100% !important; + } + + .pb-sm-down\:100 { + padding-bottom: 100% !important; + } + + .pl-sm-down\:100 { + padding-left: 100% !important; + } + + .pr-sm-down\:100 { + padding-right: 100% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:100 { + padding: 100% !important; + } + + .px-sm\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-sm\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-sm\:100 { + padding-top: 100% !important; + } + + .pb-sm\:100 { + padding-bottom: 100% !important; + } + + .pl-sm\:100 { + padding-left: 100% !important; + } + + .pr-sm\:100 { + padding-right: 100% !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:100 { + padding: 100% !important; + } + + .px-sm-up\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-sm-up\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-sm-up\:100 { + padding-top: 100% !important; + } + + .pb-sm-up\:100 { + padding-bottom: 100% !important; + } + + .pl-sm-up\:100 { + padding-left: 100% !important; + } + + .pr-sm-up\:100 { + padding-right: 100% !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:100 { + padding: 100% !important; + } + + .px-md-down\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-md-down\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-md-down\:100 { + padding-top: 100% !important; + } + + .pb-md-down\:100 { + padding-bottom: 100% !important; + } + + .pl-md-down\:100 { + padding-left: 100% !important; + } + + .pr-md-down\:100 { + padding-right: 100% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:100 { + padding: 100% !important; + } + + .px-md\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-md\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-md\:100 { + padding-top: 100% !important; + } + + .pb-md\:100 { + padding-bottom: 100% !important; + } + + .pl-md\:100 { + padding-left: 100% !important; + } + + .pr-md\:100 { + padding-right: 100% !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:100 { + padding: 100% !important; + } + + .px-md-up\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-md-up\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-md-up\:100 { + padding-top: 100% !important; + } + + .pb-md-up\:100 { + padding-bottom: 100% !important; + } + + .pl-md-up\:100 { + padding-left: 100% !important; + } + + .pr-md-up\:100 { + padding-right: 100% !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:100 { + padding: 100% !important; + } + + .px-lg-down\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-lg-down\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-lg-down\:100 { + padding-top: 100% !important; + } + + .pb-lg-down\:100 { + padding-bottom: 100% !important; + } + + .pl-lg-down\:100 { + padding-left: 100% !important; + } + + .pr-lg-down\:100 { + padding-right: 100% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:100 { + padding: 100% !important; + } + + .px-lg\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-lg\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-lg\:100 { + padding-top: 100% !important; + } + + .pb-lg\:100 { + padding-bottom: 100% !important; + } + + .pl-lg\:100 { + padding-left: 100% !important; + } + + .pr-lg\:100 { + padding-right: 100% !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:100 { + padding: 100% !important; + } + + .px-lg-up\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-lg-up\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-lg-up\:100 { + padding-top: 100% !important; + } + + .pb-lg-up\:100 { + padding-bottom: 100% !important; + } + + .pl-lg-up\:100 { + padding-left: 100% !important; + } + + .pr-lg-up\:100 { + padding-right: 100% !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:100 { + padding: 100% !important; + } + + .px-xl-down\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-xl-down\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-xl-down\:100 { + padding-top: 100% !important; + } + + .pb-xl-down\:100 { + padding-bottom: 100% !important; + } + + .pl-xl-down\:100 { + padding-left: 100% !important; + } + + .pr-xl-down\:100 { + padding-right: 100% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:100 { + padding: 100% !important; + } + + .px-xl\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-xl\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-xl\:100 { + padding-top: 100% !important; + } + + .pb-xl\:100 { + padding-bottom: 100% !important; + } + + .pl-xl\:100 { + padding-left: 100% !important; + } + + .pr-xl\:100 { + padding-right: 100% !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:100 { + padding: 100% !important; + } + + .px-xl-up\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-xl-up\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-xl-up\:100 { + padding-top: 100% !important; + } + + .pb-xl-up\:100 { + padding-bottom: 100% !important; + } + + .pl-xl-up\:100 { + padding-left: 100% !important; + } + + .pr-xl-up\:100 { + padding-right: 100% !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:100 { + padding: 100% !important; + } + + .px-xxl\:100 { + padding-left: 100% !important; + padding-right: 100% !important; + } + + .py-xxl\:100 { + padding-top: 100% !important; + padding-bottom: 100% !important; + } + + .pt-xxl\:100 { + padding-top: 100% !important; + } + + .pb-xxl\:100 { + padding-bottom: 100% !important; + } + + .pl-xxl\:100 { + padding-left: 100% !important; + } + + .pr-xxl\:100 { + padding-right: 100% !important; + } +} +.p\:10vh { + padding: 10vh !important; +} + +.px\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; +} + +.py\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; +} + +.pt\:10vh { + padding-top: 10vh !important; +} + +.pb\:10vh { + padding-bottom: 10vh !important; +} + +.pl\:10vh { + padding-left: 10vh !important; +} + +.pr\:10vh { + padding-right: 10vh !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:10vh { + padding: 10vh !important; + } + + .px-xs\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-xs\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-xs\:10vh { + padding-top: 10vh !important; + } + + .pb-xs\:10vh { + padding-bottom: 10vh !important; + } + + .pl-xs\:10vh { + padding-left: 10vh !important; + } + + .pr-xs\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:10vh { + padding: 10vh !important; + } + + .px-sm-down\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-sm-down\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-sm-down\:10vh { + padding-top: 10vh !important; + } + + .pb-sm-down\:10vh { + padding-bottom: 10vh !important; + } + + .pl-sm-down\:10vh { + padding-left: 10vh !important; + } + + .pr-sm-down\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:10vh { + padding: 10vh !important; + } + + .px-sm\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-sm\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-sm\:10vh { + padding-top: 10vh !important; + } + + .pb-sm\:10vh { + padding-bottom: 10vh !important; + } + + .pl-sm\:10vh { + padding-left: 10vh !important; + } + + .pr-sm\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:10vh { + padding: 10vh !important; + } + + .px-sm-up\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-sm-up\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-sm-up\:10vh { + padding-top: 10vh !important; + } + + .pb-sm-up\:10vh { + padding-bottom: 10vh !important; + } + + .pl-sm-up\:10vh { + padding-left: 10vh !important; + } + + .pr-sm-up\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:10vh { + padding: 10vh !important; + } + + .px-md-down\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-md-down\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-md-down\:10vh { + padding-top: 10vh !important; + } + + .pb-md-down\:10vh { + padding-bottom: 10vh !important; + } + + .pl-md-down\:10vh { + padding-left: 10vh !important; + } + + .pr-md-down\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:10vh { + padding: 10vh !important; + } + + .px-md\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-md\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-md\:10vh { + padding-top: 10vh !important; + } + + .pb-md\:10vh { + padding-bottom: 10vh !important; + } + + .pl-md\:10vh { + padding-left: 10vh !important; + } + + .pr-md\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:10vh { + padding: 10vh !important; + } + + .px-md-up\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-md-up\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-md-up\:10vh { + padding-top: 10vh !important; + } + + .pb-md-up\:10vh { + padding-bottom: 10vh !important; + } + + .pl-md-up\:10vh { + padding-left: 10vh !important; + } + + .pr-md-up\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:10vh { + padding: 10vh !important; + } + + .px-lg-down\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-lg-down\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-lg-down\:10vh { + padding-top: 10vh !important; + } + + .pb-lg-down\:10vh { + padding-bottom: 10vh !important; + } + + .pl-lg-down\:10vh { + padding-left: 10vh !important; + } + + .pr-lg-down\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:10vh { + padding: 10vh !important; + } + + .px-lg\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-lg\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-lg\:10vh { + padding-top: 10vh !important; + } + + .pb-lg\:10vh { + padding-bottom: 10vh !important; + } + + .pl-lg\:10vh { + padding-left: 10vh !important; + } + + .pr-lg\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:10vh { + padding: 10vh !important; + } + + .px-lg-up\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-lg-up\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-lg-up\:10vh { + padding-top: 10vh !important; + } + + .pb-lg-up\:10vh { + padding-bottom: 10vh !important; + } + + .pl-lg-up\:10vh { + padding-left: 10vh !important; + } + + .pr-lg-up\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:10vh { + padding: 10vh !important; + } + + .px-xl-down\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-xl-down\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-xl-down\:10vh { + padding-top: 10vh !important; + } + + .pb-xl-down\:10vh { + padding-bottom: 10vh !important; + } + + .pl-xl-down\:10vh { + padding-left: 10vh !important; + } + + .pr-xl-down\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:10vh { + padding: 10vh !important; + } + + .px-xl\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-xl\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-xl\:10vh { + padding-top: 10vh !important; + } + + .pb-xl\:10vh { + padding-bottom: 10vh !important; + } + + .pl-xl\:10vh { + padding-left: 10vh !important; + } + + .pr-xl\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:10vh { + padding: 10vh !important; + } + + .px-xl-up\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-xl-up\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-xl-up\:10vh { + padding-top: 10vh !important; + } + + .pb-xl-up\:10vh { + padding-bottom: 10vh !important; + } + + .pl-xl-up\:10vh { + padding-left: 10vh !important; + } + + .pr-xl-up\:10vh { + padding-right: 10vh !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:10vh { + padding: 10vh !important; + } + + .px-xxl\:10vh { + padding-left: 10vh !important; + padding-right: 10vh !important; + } + + .py-xxl\:10vh { + padding-top: 10vh !important; + padding-bottom: 10vh !important; + } + + .pt-xxl\:10vh { + padding-top: 10vh !important; + } + + .pb-xxl\:10vh { + padding-bottom: 10vh !important; + } + + .pl-xxl\:10vh { + padding-left: 10vh !important; + } + + .pr-xxl\:10vh { + padding-right: 10vh !important; + } +} +.p\:25vh { + padding: 25vh !important; +} + +.px\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; +} + +.py\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; +} + +.pt\:25vh { + padding-top: 25vh !important; +} + +.pb\:25vh { + padding-bottom: 25vh !important; +} + +.pl\:25vh { + padding-left: 25vh !important; +} + +.pr\:25vh { + padding-right: 25vh !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:25vh { + padding: 25vh !important; + } + + .px-xs\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-xs\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-xs\:25vh { + padding-top: 25vh !important; + } + + .pb-xs\:25vh { + padding-bottom: 25vh !important; + } + + .pl-xs\:25vh { + padding-left: 25vh !important; + } + + .pr-xs\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:25vh { + padding: 25vh !important; + } + + .px-sm-down\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-sm-down\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-sm-down\:25vh { + padding-top: 25vh !important; + } + + .pb-sm-down\:25vh { + padding-bottom: 25vh !important; + } + + .pl-sm-down\:25vh { + padding-left: 25vh !important; + } + + .pr-sm-down\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:25vh { + padding: 25vh !important; + } + + .px-sm\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-sm\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-sm\:25vh { + padding-top: 25vh !important; + } + + .pb-sm\:25vh { + padding-bottom: 25vh !important; + } + + .pl-sm\:25vh { + padding-left: 25vh !important; + } + + .pr-sm\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:25vh { + padding: 25vh !important; + } + + .px-sm-up\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-sm-up\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-sm-up\:25vh { + padding-top: 25vh !important; + } + + .pb-sm-up\:25vh { + padding-bottom: 25vh !important; + } + + .pl-sm-up\:25vh { + padding-left: 25vh !important; + } + + .pr-sm-up\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:25vh { + padding: 25vh !important; + } + + .px-md-down\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-md-down\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-md-down\:25vh { + padding-top: 25vh !important; + } + + .pb-md-down\:25vh { + padding-bottom: 25vh !important; + } + + .pl-md-down\:25vh { + padding-left: 25vh !important; + } + + .pr-md-down\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:25vh { + padding: 25vh !important; + } + + .px-md\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-md\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-md\:25vh { + padding-top: 25vh !important; + } + + .pb-md\:25vh { + padding-bottom: 25vh !important; + } + + .pl-md\:25vh { + padding-left: 25vh !important; + } + + .pr-md\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:25vh { + padding: 25vh !important; + } + + .px-md-up\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-md-up\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-md-up\:25vh { + padding-top: 25vh !important; + } + + .pb-md-up\:25vh { + padding-bottom: 25vh !important; + } + + .pl-md-up\:25vh { + padding-left: 25vh !important; + } + + .pr-md-up\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:25vh { + padding: 25vh !important; + } + + .px-lg-down\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-lg-down\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-lg-down\:25vh { + padding-top: 25vh !important; + } + + .pb-lg-down\:25vh { + padding-bottom: 25vh !important; + } + + .pl-lg-down\:25vh { + padding-left: 25vh !important; + } + + .pr-lg-down\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:25vh { + padding: 25vh !important; + } + + .px-lg\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-lg\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-lg\:25vh { + padding-top: 25vh !important; + } + + .pb-lg\:25vh { + padding-bottom: 25vh !important; + } + + .pl-lg\:25vh { + padding-left: 25vh !important; + } + + .pr-lg\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:25vh { + padding: 25vh !important; + } + + .px-lg-up\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-lg-up\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-lg-up\:25vh { + padding-top: 25vh !important; + } + + .pb-lg-up\:25vh { + padding-bottom: 25vh !important; + } + + .pl-lg-up\:25vh { + padding-left: 25vh !important; + } + + .pr-lg-up\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:25vh { + padding: 25vh !important; + } + + .px-xl-down\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-xl-down\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-xl-down\:25vh { + padding-top: 25vh !important; + } + + .pb-xl-down\:25vh { + padding-bottom: 25vh !important; + } + + .pl-xl-down\:25vh { + padding-left: 25vh !important; + } + + .pr-xl-down\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:25vh { + padding: 25vh !important; + } + + .px-xl\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-xl\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-xl\:25vh { + padding-top: 25vh !important; + } + + .pb-xl\:25vh { + padding-bottom: 25vh !important; + } + + .pl-xl\:25vh { + padding-left: 25vh !important; + } + + .pr-xl\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:25vh { + padding: 25vh !important; + } + + .px-xl-up\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-xl-up\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-xl-up\:25vh { + padding-top: 25vh !important; + } + + .pb-xl-up\:25vh { + padding-bottom: 25vh !important; + } + + .pl-xl-up\:25vh { + padding-left: 25vh !important; + } + + .pr-xl-up\:25vh { + padding-right: 25vh !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:25vh { + padding: 25vh !important; + } + + .px-xxl\:25vh { + padding-left: 25vh !important; + padding-right: 25vh !important; + } + + .py-xxl\:25vh { + padding-top: 25vh !important; + padding-bottom: 25vh !important; + } + + .pt-xxl\:25vh { + padding-top: 25vh !important; + } + + .pb-xxl\:25vh { + padding-bottom: 25vh !important; + } + + .pl-xxl\:25vh { + padding-left: 25vh !important; + } + + .pr-xxl\:25vh { + padding-right: 25vh !important; + } +} +.p\:50vh { + padding: 50vh !important; +} + +.px\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; +} + +.py\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; +} + +.pt\:50vh { + padding-top: 50vh !important; +} + +.pb\:50vh { + padding-bottom: 50vh !important; +} + +.pl\:50vh { + padding-left: 50vh !important; +} + +.pr\:50vh { + padding-right: 50vh !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:50vh { + padding: 50vh !important; + } + + .px-xs\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-xs\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-xs\:50vh { + padding-top: 50vh !important; + } + + .pb-xs\:50vh { + padding-bottom: 50vh !important; + } + + .pl-xs\:50vh { + padding-left: 50vh !important; + } + + .pr-xs\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:50vh { + padding: 50vh !important; + } + + .px-sm-down\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-sm-down\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-sm-down\:50vh { + padding-top: 50vh !important; + } + + .pb-sm-down\:50vh { + padding-bottom: 50vh !important; + } + + .pl-sm-down\:50vh { + padding-left: 50vh !important; + } + + .pr-sm-down\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:50vh { + padding: 50vh !important; + } + + .px-sm\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-sm\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-sm\:50vh { + padding-top: 50vh !important; + } + + .pb-sm\:50vh { + padding-bottom: 50vh !important; + } + + .pl-sm\:50vh { + padding-left: 50vh !important; + } + + .pr-sm\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:50vh { + padding: 50vh !important; + } + + .px-sm-up\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-sm-up\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-sm-up\:50vh { + padding-top: 50vh !important; + } + + .pb-sm-up\:50vh { + padding-bottom: 50vh !important; + } + + .pl-sm-up\:50vh { + padding-left: 50vh !important; + } + + .pr-sm-up\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:50vh { + padding: 50vh !important; + } + + .px-md-down\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-md-down\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-md-down\:50vh { + padding-top: 50vh !important; + } + + .pb-md-down\:50vh { + padding-bottom: 50vh !important; + } + + .pl-md-down\:50vh { + padding-left: 50vh !important; + } + + .pr-md-down\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:50vh { + padding: 50vh !important; + } + + .px-md\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-md\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-md\:50vh { + padding-top: 50vh !important; + } + + .pb-md\:50vh { + padding-bottom: 50vh !important; + } + + .pl-md\:50vh { + padding-left: 50vh !important; + } + + .pr-md\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:50vh { + padding: 50vh !important; + } + + .px-md-up\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-md-up\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-md-up\:50vh { + padding-top: 50vh !important; + } + + .pb-md-up\:50vh { + padding-bottom: 50vh !important; + } + + .pl-md-up\:50vh { + padding-left: 50vh !important; + } + + .pr-md-up\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:50vh { + padding: 50vh !important; + } + + .px-lg-down\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-lg-down\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-lg-down\:50vh { + padding-top: 50vh !important; + } + + .pb-lg-down\:50vh { + padding-bottom: 50vh !important; + } + + .pl-lg-down\:50vh { + padding-left: 50vh !important; + } + + .pr-lg-down\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:50vh { + padding: 50vh !important; + } + + .px-lg\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-lg\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-lg\:50vh { + padding-top: 50vh !important; + } + + .pb-lg\:50vh { + padding-bottom: 50vh !important; + } + + .pl-lg\:50vh { + padding-left: 50vh !important; + } + + .pr-lg\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:50vh { + padding: 50vh !important; + } + + .px-lg-up\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-lg-up\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-lg-up\:50vh { + padding-top: 50vh !important; + } + + .pb-lg-up\:50vh { + padding-bottom: 50vh !important; + } + + .pl-lg-up\:50vh { + padding-left: 50vh !important; + } + + .pr-lg-up\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:50vh { + padding: 50vh !important; + } + + .px-xl-down\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-xl-down\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-xl-down\:50vh { + padding-top: 50vh !important; + } + + .pb-xl-down\:50vh { + padding-bottom: 50vh !important; + } + + .pl-xl-down\:50vh { + padding-left: 50vh !important; + } + + .pr-xl-down\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:50vh { + padding: 50vh !important; + } + + .px-xl\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-xl\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-xl\:50vh { + padding-top: 50vh !important; + } + + .pb-xl\:50vh { + padding-bottom: 50vh !important; + } + + .pl-xl\:50vh { + padding-left: 50vh !important; + } + + .pr-xl\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:50vh { + padding: 50vh !important; + } + + .px-xl-up\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-xl-up\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-xl-up\:50vh { + padding-top: 50vh !important; + } + + .pb-xl-up\:50vh { + padding-bottom: 50vh !important; + } + + .pl-xl-up\:50vh { + padding-left: 50vh !important; + } + + .pr-xl-up\:50vh { + padding-right: 50vh !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:50vh { + padding: 50vh !important; + } + + .px-xxl\:50vh { + padding-left: 50vh !important; + padding-right: 50vh !important; + } + + .py-xxl\:50vh { + padding-top: 50vh !important; + padding-bottom: 50vh !important; + } + + .pt-xxl\:50vh { + padding-top: 50vh !important; + } + + .pb-xxl\:50vh { + padding-bottom: 50vh !important; + } + + .pl-xxl\:50vh { + padding-left: 50vh !important; + } + + .pr-xxl\:50vh { + padding-right: 50vh !important; + } +} +.p\:75vh { + padding: 75vh !important; +} + +.px\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; +} + +.py\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; +} + +.pt\:75vh { + padding-top: 75vh !important; +} + +.pb\:75vh { + padding-bottom: 75vh !important; +} + +.pl\:75vh { + padding-left: 75vh !important; +} + +.pr\:75vh { + padding-right: 75vh !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:75vh { + padding: 75vh !important; + } + + .px-xs\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-xs\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-xs\:75vh { + padding-top: 75vh !important; + } + + .pb-xs\:75vh { + padding-bottom: 75vh !important; + } + + .pl-xs\:75vh { + padding-left: 75vh !important; + } + + .pr-xs\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:75vh { + padding: 75vh !important; + } + + .px-sm-down\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-sm-down\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-sm-down\:75vh { + padding-top: 75vh !important; + } + + .pb-sm-down\:75vh { + padding-bottom: 75vh !important; + } + + .pl-sm-down\:75vh { + padding-left: 75vh !important; + } + + .pr-sm-down\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:75vh { + padding: 75vh !important; + } + + .px-sm\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-sm\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-sm\:75vh { + padding-top: 75vh !important; + } + + .pb-sm\:75vh { + padding-bottom: 75vh !important; + } + + .pl-sm\:75vh { + padding-left: 75vh !important; + } + + .pr-sm\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:75vh { + padding: 75vh !important; + } + + .px-sm-up\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-sm-up\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-sm-up\:75vh { + padding-top: 75vh !important; + } + + .pb-sm-up\:75vh { + padding-bottom: 75vh !important; + } + + .pl-sm-up\:75vh { + padding-left: 75vh !important; + } + + .pr-sm-up\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:75vh { + padding: 75vh !important; + } + + .px-md-down\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-md-down\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-md-down\:75vh { + padding-top: 75vh !important; + } + + .pb-md-down\:75vh { + padding-bottom: 75vh !important; + } + + .pl-md-down\:75vh { + padding-left: 75vh !important; + } + + .pr-md-down\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:75vh { + padding: 75vh !important; + } + + .px-md\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-md\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-md\:75vh { + padding-top: 75vh !important; + } + + .pb-md\:75vh { + padding-bottom: 75vh !important; + } + + .pl-md\:75vh { + padding-left: 75vh !important; + } + + .pr-md\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:75vh { + padding: 75vh !important; + } + + .px-md-up\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-md-up\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-md-up\:75vh { + padding-top: 75vh !important; + } + + .pb-md-up\:75vh { + padding-bottom: 75vh !important; + } + + .pl-md-up\:75vh { + padding-left: 75vh !important; + } + + .pr-md-up\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:75vh { + padding: 75vh !important; + } + + .px-lg-down\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-lg-down\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-lg-down\:75vh { + padding-top: 75vh !important; + } + + .pb-lg-down\:75vh { + padding-bottom: 75vh !important; + } + + .pl-lg-down\:75vh { + padding-left: 75vh !important; + } + + .pr-lg-down\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:75vh { + padding: 75vh !important; + } + + .px-lg\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-lg\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-lg\:75vh { + padding-top: 75vh !important; + } + + .pb-lg\:75vh { + padding-bottom: 75vh !important; + } + + .pl-lg\:75vh { + padding-left: 75vh !important; + } + + .pr-lg\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:75vh { + padding: 75vh !important; + } + + .px-lg-up\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-lg-up\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-lg-up\:75vh { + padding-top: 75vh !important; + } + + .pb-lg-up\:75vh { + padding-bottom: 75vh !important; + } + + .pl-lg-up\:75vh { + padding-left: 75vh !important; + } + + .pr-lg-up\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:75vh { + padding: 75vh !important; + } + + .px-xl-down\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-xl-down\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-xl-down\:75vh { + padding-top: 75vh !important; + } + + .pb-xl-down\:75vh { + padding-bottom: 75vh !important; + } + + .pl-xl-down\:75vh { + padding-left: 75vh !important; + } + + .pr-xl-down\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:75vh { + padding: 75vh !important; + } + + .px-xl\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-xl\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-xl\:75vh { + padding-top: 75vh !important; + } + + .pb-xl\:75vh { + padding-bottom: 75vh !important; + } + + .pl-xl\:75vh { + padding-left: 75vh !important; + } + + .pr-xl\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:75vh { + padding: 75vh !important; + } + + .px-xl-up\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-xl-up\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-xl-up\:75vh { + padding-top: 75vh !important; + } + + .pb-xl-up\:75vh { + padding-bottom: 75vh !important; + } + + .pl-xl-up\:75vh { + padding-left: 75vh !important; + } + + .pr-xl-up\:75vh { + padding-right: 75vh !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:75vh { + padding: 75vh !important; + } + + .px-xxl\:75vh { + padding-left: 75vh !important; + padding-right: 75vh !important; + } + + .py-xxl\:75vh { + padding-top: 75vh !important; + padding-bottom: 75vh !important; + } + + .pt-xxl\:75vh { + padding-top: 75vh !important; + } + + .pb-xxl\:75vh { + padding-bottom: 75vh !important; + } + + .pl-xxl\:75vh { + padding-left: 75vh !important; + } + + .pr-xxl\:75vh { + padding-right: 75vh !important; + } +} +.p\:100vh { + padding: 100vh !important; +} + +.px\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; +} + +.py\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; +} + +.pt\:100vh { + padding-top: 100vh !important; +} + +.pb\:100vh { + padding-bottom: 100vh !important; +} + +.pl\:100vh { + padding-left: 100vh !important; +} + +.pr\:100vh { + padding-right: 100vh !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:100vh { + padding: 100vh !important; + } + + .px-xs\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-xs\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-xs\:100vh { + padding-top: 100vh !important; + } + + .pb-xs\:100vh { + padding-bottom: 100vh !important; + } + + .pl-xs\:100vh { + padding-left: 100vh !important; + } + + .pr-xs\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:100vh { + padding: 100vh !important; + } + + .px-sm-down\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-sm-down\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-sm-down\:100vh { + padding-top: 100vh !important; + } + + .pb-sm-down\:100vh { + padding-bottom: 100vh !important; + } + + .pl-sm-down\:100vh { + padding-left: 100vh !important; + } + + .pr-sm-down\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:100vh { + padding: 100vh !important; + } + + .px-sm\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-sm\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-sm\:100vh { + padding-top: 100vh !important; + } + + .pb-sm\:100vh { + padding-bottom: 100vh !important; + } + + .pl-sm\:100vh { + padding-left: 100vh !important; + } + + .pr-sm\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:100vh { + padding: 100vh !important; + } + + .px-sm-up\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-sm-up\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-sm-up\:100vh { + padding-top: 100vh !important; + } + + .pb-sm-up\:100vh { + padding-bottom: 100vh !important; + } + + .pl-sm-up\:100vh { + padding-left: 100vh !important; + } + + .pr-sm-up\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:100vh { + padding: 100vh !important; + } + + .px-md-down\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-md-down\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-md-down\:100vh { + padding-top: 100vh !important; + } + + .pb-md-down\:100vh { + padding-bottom: 100vh !important; + } + + .pl-md-down\:100vh { + padding-left: 100vh !important; + } + + .pr-md-down\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:100vh { + padding: 100vh !important; + } + + .px-md\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-md\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-md\:100vh { + padding-top: 100vh !important; + } + + .pb-md\:100vh { + padding-bottom: 100vh !important; + } + + .pl-md\:100vh { + padding-left: 100vh !important; + } + + .pr-md\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:100vh { + padding: 100vh !important; + } + + .px-md-up\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-md-up\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-md-up\:100vh { + padding-top: 100vh !important; + } + + .pb-md-up\:100vh { + padding-bottom: 100vh !important; + } + + .pl-md-up\:100vh { + padding-left: 100vh !important; + } + + .pr-md-up\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:100vh { + padding: 100vh !important; + } + + .px-lg-down\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-lg-down\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-lg-down\:100vh { + padding-top: 100vh !important; + } + + .pb-lg-down\:100vh { + padding-bottom: 100vh !important; + } + + .pl-lg-down\:100vh { + padding-left: 100vh !important; + } + + .pr-lg-down\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:100vh { + padding: 100vh !important; + } + + .px-lg\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-lg\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-lg\:100vh { + padding-top: 100vh !important; + } + + .pb-lg\:100vh { + padding-bottom: 100vh !important; + } + + .pl-lg\:100vh { + padding-left: 100vh !important; + } + + .pr-lg\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:100vh { + padding: 100vh !important; + } + + .px-lg-up\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-lg-up\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-lg-up\:100vh { + padding-top: 100vh !important; + } + + .pb-lg-up\:100vh { + padding-bottom: 100vh !important; + } + + .pl-lg-up\:100vh { + padding-left: 100vh !important; + } + + .pr-lg-up\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:100vh { + padding: 100vh !important; + } + + .px-xl-down\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-xl-down\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-xl-down\:100vh { + padding-top: 100vh !important; + } + + .pb-xl-down\:100vh { + padding-bottom: 100vh !important; + } + + .pl-xl-down\:100vh { + padding-left: 100vh !important; + } + + .pr-xl-down\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:100vh { + padding: 100vh !important; + } + + .px-xl\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-xl\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-xl\:100vh { + padding-top: 100vh !important; + } + + .pb-xl\:100vh { + padding-bottom: 100vh !important; + } + + .pl-xl\:100vh { + padding-left: 100vh !important; + } + + .pr-xl\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:100vh { + padding: 100vh !important; + } + + .px-xl-up\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-xl-up\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-xl-up\:100vh { + padding-top: 100vh !important; + } + + .pb-xl-up\:100vh { + padding-bottom: 100vh !important; + } + + .pl-xl-up\:100vh { + padding-left: 100vh !important; + } + + .pr-xl-up\:100vh { + padding-right: 100vh !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:100vh { + padding: 100vh !important; + } + + .px-xxl\:100vh { + padding-left: 100vh !important; + padding-right: 100vh !important; + } + + .py-xxl\:100vh { + padding-top: 100vh !important; + padding-bottom: 100vh !important; + } + + .pt-xxl\:100vh { + padding-top: 100vh !important; + } + + .pb-xxl\:100vh { + padding-bottom: 100vh !important; + } + + .pl-xxl\:100vh { + padding-left: 100vh !important; + } + + .pr-xxl\:100vh { + padding-right: 100vh !important; + } +} +.p\:10vw { + padding: 10vw !important; +} + +.px\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; +} + +.py\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; +} + +.pt\:10vw { + padding-top: 10vw !important; +} + +.pb\:10vw { + padding-bottom: 10vw !important; +} + +.pl\:10vw { + padding-left: 10vw !important; +} + +.pr\:10vw { + padding-right: 10vw !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:10vw { + padding: 10vw !important; + } + + .px-xs\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-xs\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-xs\:10vw { + padding-top: 10vw !important; + } + + .pb-xs\:10vw { + padding-bottom: 10vw !important; + } + + .pl-xs\:10vw { + padding-left: 10vw !important; + } + + .pr-xs\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:10vw { + padding: 10vw !important; + } + + .px-sm-down\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-sm-down\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-sm-down\:10vw { + padding-top: 10vw !important; + } + + .pb-sm-down\:10vw { + padding-bottom: 10vw !important; + } + + .pl-sm-down\:10vw { + padding-left: 10vw !important; + } + + .pr-sm-down\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:10vw { + padding: 10vw !important; + } + + .px-sm\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-sm\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-sm\:10vw { + padding-top: 10vw !important; + } + + .pb-sm\:10vw { + padding-bottom: 10vw !important; + } + + .pl-sm\:10vw { + padding-left: 10vw !important; + } + + .pr-sm\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:10vw { + padding: 10vw !important; + } + + .px-sm-up\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-sm-up\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-sm-up\:10vw { + padding-top: 10vw !important; + } + + .pb-sm-up\:10vw { + padding-bottom: 10vw !important; + } + + .pl-sm-up\:10vw { + padding-left: 10vw !important; + } + + .pr-sm-up\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:10vw { + padding: 10vw !important; + } + + .px-md-down\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-md-down\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-md-down\:10vw { + padding-top: 10vw !important; + } + + .pb-md-down\:10vw { + padding-bottom: 10vw !important; + } + + .pl-md-down\:10vw { + padding-left: 10vw !important; + } + + .pr-md-down\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:10vw { + padding: 10vw !important; + } + + .px-md\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-md\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-md\:10vw { + padding-top: 10vw !important; + } + + .pb-md\:10vw { + padding-bottom: 10vw !important; + } + + .pl-md\:10vw { + padding-left: 10vw !important; + } + + .pr-md\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:10vw { + padding: 10vw !important; + } + + .px-md-up\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-md-up\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-md-up\:10vw { + padding-top: 10vw !important; + } + + .pb-md-up\:10vw { + padding-bottom: 10vw !important; + } + + .pl-md-up\:10vw { + padding-left: 10vw !important; + } + + .pr-md-up\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:10vw { + padding: 10vw !important; + } + + .px-lg-down\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-lg-down\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-lg-down\:10vw { + padding-top: 10vw !important; + } + + .pb-lg-down\:10vw { + padding-bottom: 10vw !important; + } + + .pl-lg-down\:10vw { + padding-left: 10vw !important; + } + + .pr-lg-down\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:10vw { + padding: 10vw !important; + } + + .px-lg\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-lg\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-lg\:10vw { + padding-top: 10vw !important; + } + + .pb-lg\:10vw { + padding-bottom: 10vw !important; + } + + .pl-lg\:10vw { + padding-left: 10vw !important; + } + + .pr-lg\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:10vw { + padding: 10vw !important; + } + + .px-lg-up\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-lg-up\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-lg-up\:10vw { + padding-top: 10vw !important; + } + + .pb-lg-up\:10vw { + padding-bottom: 10vw !important; + } + + .pl-lg-up\:10vw { + padding-left: 10vw !important; + } + + .pr-lg-up\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:10vw { + padding: 10vw !important; + } + + .px-xl-down\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-xl-down\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-xl-down\:10vw { + padding-top: 10vw !important; + } + + .pb-xl-down\:10vw { + padding-bottom: 10vw !important; + } + + .pl-xl-down\:10vw { + padding-left: 10vw !important; + } + + .pr-xl-down\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:10vw { + padding: 10vw !important; + } + + .px-xl\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-xl\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-xl\:10vw { + padding-top: 10vw !important; + } + + .pb-xl\:10vw { + padding-bottom: 10vw !important; + } + + .pl-xl\:10vw { + padding-left: 10vw !important; + } + + .pr-xl\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:10vw { + padding: 10vw !important; + } + + .px-xl-up\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-xl-up\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-xl-up\:10vw { + padding-top: 10vw !important; + } + + .pb-xl-up\:10vw { + padding-bottom: 10vw !important; + } + + .pl-xl-up\:10vw { + padding-left: 10vw !important; + } + + .pr-xl-up\:10vw { + padding-right: 10vw !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:10vw { + padding: 10vw !important; + } + + .px-xxl\:10vw { + padding-left: 10vw !important; + padding-right: 10vw !important; + } + + .py-xxl\:10vw { + padding-top: 10vw !important; + padding-bottom: 10vw !important; + } + + .pt-xxl\:10vw { + padding-top: 10vw !important; + } + + .pb-xxl\:10vw { + padding-bottom: 10vw !important; + } + + .pl-xxl\:10vw { + padding-left: 10vw !important; + } + + .pr-xxl\:10vw { + padding-right: 10vw !important; + } +} +.p\:25vw { + padding: 25vw !important; +} + +.px\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; +} + +.py\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; +} + +.pt\:25vw { + padding-top: 25vw !important; +} + +.pb\:25vw { + padding-bottom: 25vw !important; +} + +.pl\:25vw { + padding-left: 25vw !important; +} + +.pr\:25vw { + padding-right: 25vw !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:25vw { + padding: 25vw !important; + } + + .px-xs\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-xs\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-xs\:25vw { + padding-top: 25vw !important; + } + + .pb-xs\:25vw { + padding-bottom: 25vw !important; + } + + .pl-xs\:25vw { + padding-left: 25vw !important; + } + + .pr-xs\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:25vw { + padding: 25vw !important; + } + + .px-sm-down\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-sm-down\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-sm-down\:25vw { + padding-top: 25vw !important; + } + + .pb-sm-down\:25vw { + padding-bottom: 25vw !important; + } + + .pl-sm-down\:25vw { + padding-left: 25vw !important; + } + + .pr-sm-down\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:25vw { + padding: 25vw !important; + } + + .px-sm\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-sm\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-sm\:25vw { + padding-top: 25vw !important; + } + + .pb-sm\:25vw { + padding-bottom: 25vw !important; + } + + .pl-sm\:25vw { + padding-left: 25vw !important; + } + + .pr-sm\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:25vw { + padding: 25vw !important; + } + + .px-sm-up\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-sm-up\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-sm-up\:25vw { + padding-top: 25vw !important; + } + + .pb-sm-up\:25vw { + padding-bottom: 25vw !important; + } + + .pl-sm-up\:25vw { + padding-left: 25vw !important; + } + + .pr-sm-up\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:25vw { + padding: 25vw !important; + } + + .px-md-down\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-md-down\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-md-down\:25vw { + padding-top: 25vw !important; + } + + .pb-md-down\:25vw { + padding-bottom: 25vw !important; + } + + .pl-md-down\:25vw { + padding-left: 25vw !important; + } + + .pr-md-down\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:25vw { + padding: 25vw !important; + } + + .px-md\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-md\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-md\:25vw { + padding-top: 25vw !important; + } + + .pb-md\:25vw { + padding-bottom: 25vw !important; + } + + .pl-md\:25vw { + padding-left: 25vw !important; + } + + .pr-md\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:25vw { + padding: 25vw !important; + } + + .px-md-up\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-md-up\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-md-up\:25vw { + padding-top: 25vw !important; + } + + .pb-md-up\:25vw { + padding-bottom: 25vw !important; + } + + .pl-md-up\:25vw { + padding-left: 25vw !important; + } + + .pr-md-up\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:25vw { + padding: 25vw !important; + } + + .px-lg-down\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-lg-down\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-lg-down\:25vw { + padding-top: 25vw !important; + } + + .pb-lg-down\:25vw { + padding-bottom: 25vw !important; + } + + .pl-lg-down\:25vw { + padding-left: 25vw !important; + } + + .pr-lg-down\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:25vw { + padding: 25vw !important; + } + + .px-lg\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-lg\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-lg\:25vw { + padding-top: 25vw !important; + } + + .pb-lg\:25vw { + padding-bottom: 25vw !important; + } + + .pl-lg\:25vw { + padding-left: 25vw !important; + } + + .pr-lg\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:25vw { + padding: 25vw !important; + } + + .px-lg-up\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-lg-up\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-lg-up\:25vw { + padding-top: 25vw !important; + } + + .pb-lg-up\:25vw { + padding-bottom: 25vw !important; + } + + .pl-lg-up\:25vw { + padding-left: 25vw !important; + } + + .pr-lg-up\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:25vw { + padding: 25vw !important; + } + + .px-xl-down\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-xl-down\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-xl-down\:25vw { + padding-top: 25vw !important; + } + + .pb-xl-down\:25vw { + padding-bottom: 25vw !important; + } + + .pl-xl-down\:25vw { + padding-left: 25vw !important; + } + + .pr-xl-down\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:25vw { + padding: 25vw !important; + } + + .px-xl\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-xl\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-xl\:25vw { + padding-top: 25vw !important; + } + + .pb-xl\:25vw { + padding-bottom: 25vw !important; + } + + .pl-xl\:25vw { + padding-left: 25vw !important; + } + + .pr-xl\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:25vw { + padding: 25vw !important; + } + + .px-xl-up\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-xl-up\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-xl-up\:25vw { + padding-top: 25vw !important; + } + + .pb-xl-up\:25vw { + padding-bottom: 25vw !important; + } + + .pl-xl-up\:25vw { + padding-left: 25vw !important; + } + + .pr-xl-up\:25vw { + padding-right: 25vw !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:25vw { + padding: 25vw !important; + } + + .px-xxl\:25vw { + padding-left: 25vw !important; + padding-right: 25vw !important; + } + + .py-xxl\:25vw { + padding-top: 25vw !important; + padding-bottom: 25vw !important; + } + + .pt-xxl\:25vw { + padding-top: 25vw !important; + } + + .pb-xxl\:25vw { + padding-bottom: 25vw !important; + } + + .pl-xxl\:25vw { + padding-left: 25vw !important; + } + + .pr-xxl\:25vw { + padding-right: 25vw !important; + } +} +.p\:50vw { + padding: 50vw !important; +} + +.px\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; +} + +.py\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; +} + +.pt\:50vw { + padding-top: 50vw !important; +} + +.pb\:50vw { + padding-bottom: 50vw !important; +} + +.pl\:50vw { + padding-left: 50vw !important; +} + +.pr\:50vw { + padding-right: 50vw !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:50vw { + padding: 50vw !important; + } + + .px-xs\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-xs\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-xs\:50vw { + padding-top: 50vw !important; + } + + .pb-xs\:50vw { + padding-bottom: 50vw !important; + } + + .pl-xs\:50vw { + padding-left: 50vw !important; + } + + .pr-xs\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:50vw { + padding: 50vw !important; + } + + .px-sm-down\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-sm-down\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-sm-down\:50vw { + padding-top: 50vw !important; + } + + .pb-sm-down\:50vw { + padding-bottom: 50vw !important; + } + + .pl-sm-down\:50vw { + padding-left: 50vw !important; + } + + .pr-sm-down\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:50vw { + padding: 50vw !important; + } + + .px-sm\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-sm\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-sm\:50vw { + padding-top: 50vw !important; + } + + .pb-sm\:50vw { + padding-bottom: 50vw !important; + } + + .pl-sm\:50vw { + padding-left: 50vw !important; + } + + .pr-sm\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:50vw { + padding: 50vw !important; + } + + .px-sm-up\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-sm-up\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-sm-up\:50vw { + padding-top: 50vw !important; + } + + .pb-sm-up\:50vw { + padding-bottom: 50vw !important; + } + + .pl-sm-up\:50vw { + padding-left: 50vw !important; + } + + .pr-sm-up\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:50vw { + padding: 50vw !important; + } + + .px-md-down\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-md-down\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-md-down\:50vw { + padding-top: 50vw !important; + } + + .pb-md-down\:50vw { + padding-bottom: 50vw !important; + } + + .pl-md-down\:50vw { + padding-left: 50vw !important; + } + + .pr-md-down\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:50vw { + padding: 50vw !important; + } + + .px-md\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-md\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-md\:50vw { + padding-top: 50vw !important; + } + + .pb-md\:50vw { + padding-bottom: 50vw !important; + } + + .pl-md\:50vw { + padding-left: 50vw !important; + } + + .pr-md\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:50vw { + padding: 50vw !important; + } + + .px-md-up\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-md-up\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-md-up\:50vw { + padding-top: 50vw !important; + } + + .pb-md-up\:50vw { + padding-bottom: 50vw !important; + } + + .pl-md-up\:50vw { + padding-left: 50vw !important; + } + + .pr-md-up\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:50vw { + padding: 50vw !important; + } + + .px-lg-down\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-lg-down\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-lg-down\:50vw { + padding-top: 50vw !important; + } + + .pb-lg-down\:50vw { + padding-bottom: 50vw !important; + } + + .pl-lg-down\:50vw { + padding-left: 50vw !important; + } + + .pr-lg-down\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:50vw { + padding: 50vw !important; + } + + .px-lg\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-lg\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-lg\:50vw { + padding-top: 50vw !important; + } + + .pb-lg\:50vw { + padding-bottom: 50vw !important; + } + + .pl-lg\:50vw { + padding-left: 50vw !important; + } + + .pr-lg\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:50vw { + padding: 50vw !important; + } + + .px-lg-up\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-lg-up\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-lg-up\:50vw { + padding-top: 50vw !important; + } + + .pb-lg-up\:50vw { + padding-bottom: 50vw !important; + } + + .pl-lg-up\:50vw { + padding-left: 50vw !important; + } + + .pr-lg-up\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:50vw { + padding: 50vw !important; + } + + .px-xl-down\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-xl-down\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-xl-down\:50vw { + padding-top: 50vw !important; + } + + .pb-xl-down\:50vw { + padding-bottom: 50vw !important; + } + + .pl-xl-down\:50vw { + padding-left: 50vw !important; + } + + .pr-xl-down\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:50vw { + padding: 50vw !important; + } + + .px-xl\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-xl\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-xl\:50vw { + padding-top: 50vw !important; + } + + .pb-xl\:50vw { + padding-bottom: 50vw !important; + } + + .pl-xl\:50vw { + padding-left: 50vw !important; + } + + .pr-xl\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:50vw { + padding: 50vw !important; + } + + .px-xl-up\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-xl-up\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-xl-up\:50vw { + padding-top: 50vw !important; + } + + .pb-xl-up\:50vw { + padding-bottom: 50vw !important; + } + + .pl-xl-up\:50vw { + padding-left: 50vw !important; + } + + .pr-xl-up\:50vw { + padding-right: 50vw !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:50vw { + padding: 50vw !important; + } + + .px-xxl\:50vw { + padding-left: 50vw !important; + padding-right: 50vw !important; + } + + .py-xxl\:50vw { + padding-top: 50vw !important; + padding-bottom: 50vw !important; + } + + .pt-xxl\:50vw { + padding-top: 50vw !important; + } + + .pb-xxl\:50vw { + padding-bottom: 50vw !important; + } + + .pl-xxl\:50vw { + padding-left: 50vw !important; + } + + .pr-xxl\:50vw { + padding-right: 50vw !important; + } +} +.p\:75vw { + padding: 75vw !important; +} + +.px\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; +} + +.py\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; +} + +.pt\:75vw { + padding-top: 75vw !important; +} + +.pb\:75vw { + padding-bottom: 75vw !important; +} + +.pl\:75vw { + padding-left: 75vw !important; +} + +.pr\:75vw { + padding-right: 75vw !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:75vw { + padding: 75vw !important; + } + + .px-xs\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-xs\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-xs\:75vw { + padding-top: 75vw !important; + } + + .pb-xs\:75vw { + padding-bottom: 75vw !important; + } + + .pl-xs\:75vw { + padding-left: 75vw !important; + } + + .pr-xs\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:75vw { + padding: 75vw !important; + } + + .px-sm-down\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-sm-down\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-sm-down\:75vw { + padding-top: 75vw !important; + } + + .pb-sm-down\:75vw { + padding-bottom: 75vw !important; + } + + .pl-sm-down\:75vw { + padding-left: 75vw !important; + } + + .pr-sm-down\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:75vw { + padding: 75vw !important; + } + + .px-sm\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-sm\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-sm\:75vw { + padding-top: 75vw !important; + } + + .pb-sm\:75vw { + padding-bottom: 75vw !important; + } + + .pl-sm\:75vw { + padding-left: 75vw !important; + } + + .pr-sm\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:75vw { + padding: 75vw !important; + } + + .px-sm-up\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-sm-up\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-sm-up\:75vw { + padding-top: 75vw !important; + } + + .pb-sm-up\:75vw { + padding-bottom: 75vw !important; + } + + .pl-sm-up\:75vw { + padding-left: 75vw !important; + } + + .pr-sm-up\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:75vw { + padding: 75vw !important; + } + + .px-md-down\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-md-down\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-md-down\:75vw { + padding-top: 75vw !important; + } + + .pb-md-down\:75vw { + padding-bottom: 75vw !important; + } + + .pl-md-down\:75vw { + padding-left: 75vw !important; + } + + .pr-md-down\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:75vw { + padding: 75vw !important; + } + + .px-md\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-md\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-md\:75vw { + padding-top: 75vw !important; + } + + .pb-md\:75vw { + padding-bottom: 75vw !important; + } + + .pl-md\:75vw { + padding-left: 75vw !important; + } + + .pr-md\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:75vw { + padding: 75vw !important; + } + + .px-md-up\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-md-up\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-md-up\:75vw { + padding-top: 75vw !important; + } + + .pb-md-up\:75vw { + padding-bottom: 75vw !important; + } + + .pl-md-up\:75vw { + padding-left: 75vw !important; + } + + .pr-md-up\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:75vw { + padding: 75vw !important; + } + + .px-lg-down\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-lg-down\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-lg-down\:75vw { + padding-top: 75vw !important; + } + + .pb-lg-down\:75vw { + padding-bottom: 75vw !important; + } + + .pl-lg-down\:75vw { + padding-left: 75vw !important; + } + + .pr-lg-down\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:75vw { + padding: 75vw !important; + } + + .px-lg\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-lg\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-lg\:75vw { + padding-top: 75vw !important; + } + + .pb-lg\:75vw { + padding-bottom: 75vw !important; + } + + .pl-lg\:75vw { + padding-left: 75vw !important; + } + + .pr-lg\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:75vw { + padding: 75vw !important; + } + + .px-lg-up\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-lg-up\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-lg-up\:75vw { + padding-top: 75vw !important; + } + + .pb-lg-up\:75vw { + padding-bottom: 75vw !important; + } + + .pl-lg-up\:75vw { + padding-left: 75vw !important; + } + + .pr-lg-up\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:75vw { + padding: 75vw !important; + } + + .px-xl-down\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-xl-down\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-xl-down\:75vw { + padding-top: 75vw !important; + } + + .pb-xl-down\:75vw { + padding-bottom: 75vw !important; + } + + .pl-xl-down\:75vw { + padding-left: 75vw !important; + } + + .pr-xl-down\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:75vw { + padding: 75vw !important; + } + + .px-xl\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-xl\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-xl\:75vw { + padding-top: 75vw !important; + } + + .pb-xl\:75vw { + padding-bottom: 75vw !important; + } + + .pl-xl\:75vw { + padding-left: 75vw !important; + } + + .pr-xl\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:75vw { + padding: 75vw !important; + } + + .px-xl-up\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-xl-up\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-xl-up\:75vw { + padding-top: 75vw !important; + } + + .pb-xl-up\:75vw { + padding-bottom: 75vw !important; + } + + .pl-xl-up\:75vw { + padding-left: 75vw !important; + } + + .pr-xl-up\:75vw { + padding-right: 75vw !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:75vw { + padding: 75vw !important; + } + + .px-xxl\:75vw { + padding-left: 75vw !important; + padding-right: 75vw !important; + } + + .py-xxl\:75vw { + padding-top: 75vw !important; + padding-bottom: 75vw !important; + } + + .pt-xxl\:75vw { + padding-top: 75vw !important; + } + + .pb-xxl\:75vw { + padding-bottom: 75vw !important; + } + + .pl-xxl\:75vw { + padding-left: 75vw !important; + } + + .pr-xxl\:75vw { + padding-right: 75vw !important; + } +} +.p\:100vw { + padding: 100vw !important; +} + +.px\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; +} + +.py\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; +} + +.pt\:100vw { + padding-top: 100vw !important; +} + +.pb\:100vw { + padding-bottom: 100vw !important; +} + +.pl\:100vw { + padding-left: 100vw !important; +} + +.pr\:100vw { + padding-right: 100vw !important; +} + +@media only screen and (max-width: 576px) { + .p-xs\:100vw { + padding: 100vw !important; + } + + .px-xs\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-xs\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-xs\:100vw { + padding-top: 100vw !important; + } + + .pb-xs\:100vw { + padding-bottom: 100vw !important; + } + + .pl-xs\:100vw { + padding-left: 100vw !important; + } + + .pr-xs\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (max-width: 768px) { + .p-sm-down\:100vw { + padding: 100vw !important; + } + + .px-sm-down\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-sm-down\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-sm-down\:100vw { + padding-top: 100vw !important; + } + + .pb-sm-down\:100vw { + padding-bottom: 100vw !important; + } + + .pl-sm-down\:100vw { + padding-left: 100vw !important; + } + + .pr-sm-down\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .p-sm\:100vw { + padding: 100vw !important; + } + + .px-sm\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-sm\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-sm\:100vw { + padding-top: 100vw !important; + } + + .pb-sm\:100vw { + padding-bottom: 100vw !important; + } + + .pl-sm\:100vw { + padding-left: 100vw !important; + } + + .pr-sm\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (min-width: 577px) { + .p-sm-up\:100vw { + padding: 100vw !important; + } + + .px-sm-up\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-sm-up\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-sm-up\:100vw { + padding-top: 100vw !important; + } + + .pb-sm-up\:100vw { + padding-bottom: 100vw !important; + } + + .pl-sm-up\:100vw { + padding-left: 100vw !important; + } + + .pr-sm-up\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (max-width: 992px) { + .p-md-down\:100vw { + padding: 100vw !important; + } + + .px-md-down\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-md-down\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-md-down\:100vw { + padding-top: 100vw !important; + } + + .pb-md-down\:100vw { + padding-bottom: 100vw !important; + } + + .pl-md-down\:100vw { + padding-left: 100vw !important; + } + + .pr-md-down\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .p-md\:100vw { + padding: 100vw !important; + } + + .px-md\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-md\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-md\:100vw { + padding-top: 100vw !important; + } + + .pb-md\:100vw { + padding-bottom: 100vw !important; + } + + .pl-md\:100vw { + padding-left: 100vw !important; + } + + .pr-md\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (min-width: 769px) { + .p-md-up\:100vw { + padding: 100vw !important; + } + + .px-md-up\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-md-up\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-md-up\:100vw { + padding-top: 100vw !important; + } + + .pb-md-up\:100vw { + padding-bottom: 100vw !important; + } + + .pl-md-up\:100vw { + padding-left: 100vw !important; + } + + .pr-md-up\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (max-width: 1200px) { + .p-lg-down\:100vw { + padding: 100vw !important; + } + + .px-lg-down\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-lg-down\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-lg-down\:100vw { + padding-top: 100vw !important; + } + + .pb-lg-down\:100vw { + padding-bottom: 100vw !important; + } + + .pl-lg-down\:100vw { + padding-left: 100vw !important; + } + + .pr-lg-down\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .p-lg\:100vw { + padding: 100vw !important; + } + + .px-lg\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-lg\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-lg\:100vw { + padding-top: 100vw !important; + } + + .pb-lg\:100vw { + padding-bottom: 100vw !important; + } + + .pl-lg\:100vw { + padding-left: 100vw !important; + } + + .pr-lg\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (min-width: 993px) { + .p-lg-up\:100vw { + padding: 100vw !important; + } + + .px-lg-up\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-lg-up\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-lg-up\:100vw { + padding-top: 100vw !important; + } + + .pb-lg-up\:100vw { + padding-bottom: 100vw !important; + } + + .pl-lg-up\:100vw { + padding-left: 100vw !important; + } + + .pr-lg-up\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (max-width: 1400px) { + .p-xl-down\:100vw { + padding: 100vw !important; + } + + .px-xl-down\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-xl-down\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-xl-down\:100vw { + padding-top: 100vw !important; + } + + .pb-xl-down\:100vw { + padding-bottom: 100vw !important; + } + + .pl-xl-down\:100vw { + padding-left: 100vw !important; + } + + .pr-xl-down\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .p-xl\:100vw { + padding: 100vw !important; + } + + .px-xl\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-xl\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-xl\:100vw { + padding-top: 100vw !important; + } + + .pb-xl\:100vw { + padding-bottom: 100vw !important; + } + + .pl-xl\:100vw { + padding-left: 100vw !important; + } + + .pr-xl\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (min-width: 1201px) { + .p-xl-up\:100vw { + padding: 100vw !important; + } + + .px-xl-up\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-xl-up\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-xl-up\:100vw { + padding-top: 100vw !important; + } + + .pb-xl-up\:100vw { + padding-bottom: 100vw !important; + } + + .pl-xl-up\:100vw { + padding-left: 100vw !important; + } + + .pr-xl-up\:100vw { + padding-right: 100vw !important; + } +} +@media only screen and (min-width: 1401px) { + .p-xxl\:100vw { + padding: 100vw !important; + } + + .px-xxl\:100vw { + padding-left: 100vw !important; + padding-right: 100vw !important; + } + + .py-xxl\:100vw { + padding-top: 100vw !important; + padding-bottom: 100vw !important; + } + + .pt-xxl\:100vw { + padding-top: 100vw !important; + } + + .pb-xxl\:100vw { + padding-bottom: 100vw !important; + } + + .pl-xxl\:100vw { + padding-left: 100vw !important; + } + + .pr-xxl\:100vw { + padding-right: 100vw !important; + } +} +.flex { + display: flex; +} + +.d\:none { + display: none !important; +} + +@media only screen and (max-width: 576px) { + .d-xs\:none { + display: none !important; + } +} +@media only screen and (max-width: 768px) { + .d-sm-down\:none { + display: none !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .d-sm\:none { + display: none !important; + } +} +@media only screen and (min-width: 577px) { + .d-sm-up\:none { + display: none !important; + } +} +@media only screen and (max-width: 992px) { + .d-md-down\:none { + display: none !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .d-md\:none { + display: none !important; + } +} +@media only screen and (min-width: 769px) { + .d-md-up\:none { + display: none !important; + } +} +@media only screen and (max-width: 1200px) { + .d-lg-down\:none { + display: none !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .d-lg\:none { + display: none !important; + } +} +@media only screen and (min-width: 993px) { + .d-lg-up\:none { + display: none !important; + } +} +@media only screen and (max-width: 1400px) { + .d-xl-down\:none { + display: none !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .d-xl\:none { + display: none !important; + } +} +@media only screen and (min-width: 1201px) { + .d-xl-up\:none { + display: none !important; + } +} +@media only screen and (min-width: 1401px) { + .d-xl\:none { + display: none !important; + } +} +.d\:flex { + display: flex !important; +} + +@media only screen and (max-width: 576px) { + .d-xs\:flex { + display: flex !important; + } +} +@media only screen and (max-width: 768px) { + .d-sm-down\:flex { + display: flex !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .d-sm\:flex { + display: flex !important; + } +} +@media only screen and (min-width: 577px) { + .d-sm-up\:flex { + display: flex !important; + } +} +@media only screen and (max-width: 992px) { + .d-md-down\:flex { + display: flex !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .d-md\:flex { + display: flex !important; + } +} +@media only screen and (min-width: 769px) { + .d-md-up\:flex { + display: flex !important; + } +} +@media only screen and (max-width: 1200px) { + .d-lg-down\:flex { + display: flex !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .d-lg\:flex { + display: flex !important; + } +} +@media only screen and (min-width: 993px) { + .d-lg-up\:flex { + display: flex !important; + } +} +@media only screen and (max-width: 1400px) { + .d-xl-down\:flex { + display: flex !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .d-xl\:flex { + display: flex !important; + } +} +@media only screen and (min-width: 1201px) { + .d-xl-up\:flex { + display: flex !important; + } +} +@media only screen and (min-width: 1401px) { + .d-xl\:flex { + display: flex !important; + } +} +.d\:ruby { + display: ruby !important; +} + +@media only screen and (max-width: 576px) { + .d-xs\:ruby { + display: ruby !important; + } +} +@media only screen and (max-width: 768px) { + .d-sm-down\:ruby { + display: ruby !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .d-sm\:ruby { + display: ruby !important; + } +} +@media only screen and (min-width: 577px) { + .d-sm-up\:ruby { + display: ruby !important; + } +} +@media only screen and (max-width: 992px) { + .d-md-down\:ruby { + display: ruby !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .d-md\:ruby { + display: ruby !important; + } +} +@media only screen and (min-width: 769px) { + .d-md-up\:ruby { + display: ruby !important; + } +} +@media only screen and (max-width: 1200px) { + .d-lg-down\:ruby { + display: ruby !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .d-lg\:ruby { + display: ruby !important; + } +} +@media only screen and (min-width: 993px) { + .d-lg-up\:ruby { + display: ruby !important; + } +} +@media only screen and (max-width: 1400px) { + .d-xl-down\:ruby { + display: ruby !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .d-xl\:ruby { + display: ruby !important; + } +} +@media only screen and (min-width: 1201px) { + .d-xl-up\:ruby { + display: ruby !important; + } +} +@media only screen and (min-width: 1401px) { + .d-xl\:ruby { + display: ruby !important; + } +} +.d\:block { + display: block !important; +} + +@media only screen and (max-width: 576px) { + .d-xs\:block { + display: block !important; + } +} +@media only screen and (max-width: 768px) { + .d-sm-down\:block { + display: block !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .d-sm\:block { + display: block !important; + } +} +@media only screen and (min-width: 577px) { + .d-sm-up\:block { + display: block !important; + } +} +@media only screen and (max-width: 992px) { + .d-md-down\:block { + display: block !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .d-md\:block { + display: block !important; + } +} +@media only screen and (min-width: 769px) { + .d-md-up\:block { + display: block !important; + } +} +@media only screen and (max-width: 1200px) { + .d-lg-down\:block { + display: block !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .d-lg\:block { + display: block !important; + } +} +@media only screen and (min-width: 993px) { + .d-lg-up\:block { + display: block !important; + } +} +@media only screen and (max-width: 1400px) { + .d-xl-down\:block { + display: block !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .d-xl\:block { + display: block !important; + } +} +@media only screen and (min-width: 1201px) { + .d-xl-up\:block { + display: block !important; + } +} +@media only screen and (min-width: 1401px) { + .d-xl\:block { + display: block !important; + } +} +.d\:contents { + display: contents !important; +} + +@media only screen and (max-width: 576px) { + .d-xs\:contents { + display: contents !important; + } +} +@media only screen and (max-width: 768px) { + .d-sm-down\:contents { + display: contents !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .d-sm\:contents { + display: contents !important; + } +} +@media only screen and (min-width: 577px) { + .d-sm-up\:contents { + display: contents !important; + } +} +@media only screen and (max-width: 992px) { + .d-md-down\:contents { + display: contents !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .d-md\:contents { + display: contents !important; + } +} +@media only screen and (min-width: 769px) { + .d-md-up\:contents { + display: contents !important; + } +} +@media only screen and (max-width: 1200px) { + .d-lg-down\:contents { + display: contents !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .d-lg\:contents { + display: contents !important; + } +} +@media only screen and (min-width: 993px) { + .d-lg-up\:contents { + display: contents !important; + } +} +@media only screen and (max-width: 1400px) { + .d-xl-down\:contents { + display: contents !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .d-xl\:contents { + display: contents !important; + } +} +@media only screen and (min-width: 1201px) { + .d-xl-up\:contents { + display: contents !important; + } +} +@media only screen and (min-width: 1401px) { + .d-xl\:contents { + display: contents !important; + } +} +.d\:grid { + display: grid !important; +} + +@media only screen and (max-width: 576px) { + .d-xs\:grid { + display: grid !important; + } +} +@media only screen and (max-width: 768px) { + .d-sm-down\:grid { + display: grid !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .d-sm\:grid { + display: grid !important; + } +} +@media only screen and (min-width: 577px) { + .d-sm-up\:grid { + display: grid !important; + } +} +@media only screen and (max-width: 992px) { + .d-md-down\:grid { + display: grid !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .d-md\:grid { + display: grid !important; + } +} +@media only screen and (min-width: 769px) { + .d-md-up\:grid { + display: grid !important; + } +} +@media only screen and (max-width: 1200px) { + .d-lg-down\:grid { + display: grid !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .d-lg\:grid { + display: grid !important; + } +} +@media only screen and (min-width: 993px) { + .d-lg-up\:grid { + display: grid !important; + } +} +@media only screen and (max-width: 1400px) { + .d-xl-down\:grid { + display: grid !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .d-xl\:grid { + display: grid !important; + } +} +@media only screen and (min-width: 1201px) { + .d-xl-up\:grid { + display: grid !important; + } +} +@media only screen and (min-width: 1401px) { + .d-xl\:grid { + display: grid !important; + } +} +.d\:inline { + display: inline !important; +} + +@media only screen and (max-width: 576px) { + .d-xs\:inline { + display: inline !important; + } +} +@media only screen and (max-width: 768px) { + .d-sm-down\:inline { + display: inline !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .d-sm\:inline { + display: inline !important; + } +} +@media only screen and (min-width: 577px) { + .d-sm-up\:inline { + display: inline !important; + } +} +@media only screen and (max-width: 992px) { + .d-md-down\:inline { + display: inline !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .d-md\:inline { + display: inline !important; + } +} +@media only screen and (min-width: 769px) { + .d-md-up\:inline { + display: inline !important; + } +} +@media only screen and (max-width: 1200px) { + .d-lg-down\:inline { + display: inline !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .d-lg\:inline { + display: inline !important; + } +} +@media only screen and (min-width: 993px) { + .d-lg-up\:inline { + display: inline !important; + } +} +@media only screen and (max-width: 1400px) { + .d-xl-down\:inline { + display: inline !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .d-xl\:inline { + display: inline !important; + } +} +@media only screen and (min-width: 1201px) { + .d-xl-up\:inline { + display: inline !important; + } +} +@media only screen and (min-width: 1401px) { + .d-xl\:inline { + display: inline !important; + } +} +.d\:inline-block { + display: inline-block !important; +} + +@media only screen and (max-width: 576px) { + .d-xs\:inline-block { + display: inline-block !important; + } +} +@media only screen and (max-width: 768px) { + .d-sm-down\:inline-block { + display: inline-block !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .d-sm\:inline-block { + display: inline-block !important; + } +} +@media only screen and (min-width: 577px) { + .d-sm-up\:inline-block { + display: inline-block !important; + } +} +@media only screen and (max-width: 992px) { + .d-md-down\:inline-block { + display: inline-block !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .d-md\:inline-block { + display: inline-block !important; + } +} +@media only screen and (min-width: 769px) { + .d-md-up\:inline-block { + display: inline-block !important; + } +} +@media only screen and (max-width: 1200px) { + .d-lg-down\:inline-block { + display: inline-block !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .d-lg\:inline-block { + display: inline-block !important; + } +} +@media only screen and (min-width: 993px) { + .d-lg-up\:inline-block { + display: inline-block !important; + } +} +@media only screen and (max-width: 1400px) { + .d-xl-down\:inline-block { + display: inline-block !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .d-xl\:inline-block { + display: inline-block !important; + } +} +@media only screen and (min-width: 1201px) { + .d-xl-up\:inline-block { + display: inline-block !important; + } +} +@media only screen and (min-width: 1401px) { + .d-xl\:inline-block { + display: inline-block !important; + } +} +.d\:inline-flex { + display: inline-flex !important; +} + +@media only screen and (max-width: 576px) { + .d-xs\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (max-width: 768px) { + .d-sm-down\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .d-sm\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (min-width: 577px) { + .d-sm-up\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (max-width: 992px) { + .d-md-down\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .d-md\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (min-width: 769px) { + .d-md-up\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (max-width: 1200px) { + .d-lg-down\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .d-lg\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (min-width: 993px) { + .d-lg-up\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (max-width: 1400px) { + .d-xl-down\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .d-xl\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (min-width: 1201px) { + .d-xl-up\:inline-flex { + display: inline-flex !important; + } +} +@media only screen and (min-width: 1401px) { + .d-xl\:inline-flex { + display: inline-flex !important; + } +} +.d\:table { + display: table !important; +} + +@media only screen and (max-width: 576px) { + .d-xs\:table { + display: table !important; + } +} +@media only screen and (max-width: 768px) { + .d-sm-down\:table { + display: table !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .d-sm\:table { + display: table !important; + } +} +@media only screen and (min-width: 577px) { + .d-sm-up\:table { + display: table !important; + } +} +@media only screen and (max-width: 992px) { + .d-md-down\:table { + display: table !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .d-md\:table { + display: table !important; + } +} +@media only screen and (min-width: 769px) { + .d-md-up\:table { + display: table !important; + } +} +@media only screen and (max-width: 1200px) { + .d-lg-down\:table { + display: table !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .d-lg\:table { + display: table !important; + } +} +@media only screen and (min-width: 993px) { + .d-lg-up\:table { + display: table !important; + } +} +@media only screen and (max-width: 1400px) { + .d-xl-down\:table { + display: table !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .d-xl\:table { + display: table !important; + } +} +@media only screen and (min-width: 1201px) { + .d-xl-up\:table { + display: table !important; + } +} +@media only screen and (min-width: 1401px) { + .d-xl\:table { + display: table !important; + } +} +.flex-row { + display: flex; +} + +.flex-col { + display: flex; +} + +.flex\:center-between { + align-items: center; + justify-content: space-between; +} + +.flex\:center-start { + align-items: center; + justify-content: flex-start; +} + +.flex\:center-end { + align-items: center; + justify-content: flex-end; +} + +.flex\:end-center { + align-items: flex-end; + justify-content: center; +} + +.flex\:start-all { + align-items: flex-start; + justify-content: flex-start; +} + +.flex\:end-all { + align-items: flex-end; + justify-content: flex-end; +} + +.flex\:justify-center { + justify-content: center; +} + +.flex\:justify-end { + justify-content: flex-end; +} + +.flex\:justify-start { + justify-content: flex-start; +} + +.flex\:items-center { + align-items: center; +} + +.flex\:center-all { + align-items: center; + justify-content: center; +} + +.flex-d\:col, .flex-col { + flex-direction: column; +} + +.flex-d\:row, .flex-row { + flex-direction: row; +} + +@media only screen and (max-width: 576px) { + .flex-d-xs\:col { + flex-direction: column !important; + } + + .flex-d-xs\:row { + flex-direction: row !important; + } +} +@media only screen and (max-width: 768px) { + .flex-d-sm-down\:col { + flex-direction: column !important; + } + + .flex-d-sm-down\:row { + flex-direction: row !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .flex-d-sm\:col { + flex-direction: column !important; + } + + .flex-d-sm\:row { + flex-direction: row !important; + } +} +@media only screen and (min-width: 577px) { + .flex-d-sm-up\:col { + flex-direction: column !important; + } + + .flex-d-sm-up\:row { + flex-direction: row !important; + } +} +@media only screen and (max-width: 992px) { + .flex-d-md-down\:col { + flex-direction: column !important; + } + + .flex-d-md-down\:row { + flex-direction: row !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .flex-d-md\:col { + flex-direction: column !important; + } + + .flex-d-md\:row { + flex-direction: row !important; + } +} +@media only screen and (min-width: 769px) { + .flex-d-md-up\:col { + flex-direction: column !important; + } + + .flex-d-md-up\:row { + flex-direction: row !important; + } +} +@media only screen and (max-width: 1200px) { + .flex-d-lg-down\:col { + flex-direction: column !important; + } + + .flex-d-lg-down\:row { + flex-direction: row !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .flex-d-lg\:col { + flex-direction: column !important; + } + + .flex-d-lg\:row { + flex-direction: row !important; + } +} +@media only screen and (min-width: 993px) { + .flex-d-lg-up\:col { + flex-direction: column !important; + } + + .flex-d-lg-up\:row { + flex-direction: row !important; + } +} +@media only screen and (max-width: 1400px) { + .flex-d-xl-down\:col { + flex-direction: column !important; + } + + .flex-d-xl-down\:row { + flex-direction: row !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .flex-d-xl\:col { + flex-direction: column !important; + } + + .flex-d-xl\:row { + flex-direction: row !important; + } +} +@media only screen and (min-width: 1201px) { + .flex-d-xl-up\:col { + flex-direction: column !important; + } + + .flex-d-xl-up\:row { + flex-direction: row !important; + } +} +@media only screen and (min-width: 1401px) { + .flex-d-xxl\:col { + flex-direction: column !important; + } + + .flex-d-xxl\:row { + flex-direction: row !important; + } +} +.position\:relative { + position: relative !important; +} + +@media only screen and (max-width: 576px) { + .position-xs\:relative { + position: relative !important; + } +} +@media only screen and (max-width: 768px) { + .position-sm-down\:relative { + position: relative !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .position-sm\:relative { + position: relative !important; + } +} +@media only screen and (min-width: 577px) { + .position-sm-up\:relative { + position: relative !important; + } +} +@media only screen and (max-width: 992px) { + .position-md-down\:relative { + position: relative !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .position-md\:relative { + position: relative !important; + } +} +@media only screen and (min-width: 769px) { + .position-md-up\:relative { + position: relative !important; + } +} +@media only screen and (max-width: 1200px) { + .position-lg-down\:relative { + position: relative !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .position-lg\:relative { + position: relative !important; + } +} +@media only screen and (min-width: 993px) { + .position-lg-up\:relative { + position: relative !important; + } +} +@media only screen and (max-width: 1400px) { + .position-xl-down\:relative { + position: relative !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .position-xl\:relative { + position: relative !important; + } +} +@media only screen and (min-width: 1201px) { + .position-xl-up\:relative { + position: relative !important; + } +} +@media only screen and (min-width: 1401px) { + .position-xxl\:relative { + position: relative !important; + } +} +.position\:absolute { + position: absolute !important; +} + +@media only screen and (max-width: 576px) { + .position-xs\:absolute { + position: absolute !important; + } +} +@media only screen and (max-width: 768px) { + .position-sm-down\:absolute { + position: absolute !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .position-sm\:absolute { + position: absolute !important; + } +} +@media only screen and (min-width: 577px) { + .position-sm-up\:absolute { + position: absolute !important; + } +} +@media only screen and (max-width: 992px) { + .position-md-down\:absolute { + position: absolute !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .position-md\:absolute { + position: absolute !important; + } +} +@media only screen and (min-width: 769px) { + .position-md-up\:absolute { + position: absolute !important; + } +} +@media only screen and (max-width: 1200px) { + .position-lg-down\:absolute { + position: absolute !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .position-lg\:absolute { + position: absolute !important; + } +} +@media only screen and (min-width: 993px) { + .position-lg-up\:absolute { + position: absolute !important; + } +} +@media only screen and (max-width: 1400px) { + .position-xl-down\:absolute { + position: absolute !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .position-xl\:absolute { + position: absolute !important; + } +} +@media only screen and (min-width: 1201px) { + .position-xl-up\:absolute { + position: absolute !important; + } +} +@media only screen and (min-width: 1401px) { + .position-xxl\:absolute { + position: absolute !important; + } +} +.position\:fixed { + position: fixed !important; +} + +@media only screen and (max-width: 576px) { + .position-xs\:fixed { + position: fixed !important; + } +} +@media only screen and (max-width: 768px) { + .position-sm-down\:fixed { + position: fixed !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .position-sm\:fixed { + position: fixed !important; + } +} +@media only screen and (min-width: 577px) { + .position-sm-up\:fixed { + position: fixed !important; + } +} +@media only screen and (max-width: 992px) { + .position-md-down\:fixed { + position: fixed !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .position-md\:fixed { + position: fixed !important; + } +} +@media only screen and (min-width: 769px) { + .position-md-up\:fixed { + position: fixed !important; + } +} +@media only screen and (max-width: 1200px) { + .position-lg-down\:fixed { + position: fixed !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .position-lg\:fixed { + position: fixed !important; + } +} +@media only screen and (min-width: 993px) { + .position-lg-up\:fixed { + position: fixed !important; + } +} +@media only screen and (max-width: 1400px) { + .position-xl-down\:fixed { + position: fixed !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .position-xl\:fixed { + position: fixed !important; + } +} +@media only screen and (min-width: 1201px) { + .position-xl-up\:fixed { + position: fixed !important; + } +} +@media only screen and (min-width: 1401px) { + .position-xxl\:fixed { + position: fixed !important; + } +} +.position\:sticky { + position: sticky !important; +} + +@media only screen and (max-width: 576px) { + .position-xs\:sticky { + position: sticky !important; + } +} +@media only screen and (max-width: 768px) { + .position-sm-down\:sticky { + position: sticky !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .position-sm\:sticky { + position: sticky !important; + } +} +@media only screen and (min-width: 577px) { + .position-sm-up\:sticky { + position: sticky !important; + } +} +@media only screen and (max-width: 992px) { + .position-md-down\:sticky { + position: sticky !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .position-md\:sticky { + position: sticky !important; + } +} +@media only screen and (min-width: 769px) { + .position-md-up\:sticky { + position: sticky !important; + } +} +@media only screen and (max-width: 1200px) { + .position-lg-down\:sticky { + position: sticky !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .position-lg\:sticky { + position: sticky !important; + } +} +@media only screen and (min-width: 993px) { + .position-lg-up\:sticky { + position: sticky !important; + } +} +@media only screen and (max-width: 1400px) { + .position-xl-down\:sticky { + position: sticky !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .position-xl\:sticky { + position: sticky !important; + } +} +@media only screen and (min-width: 1201px) { + .position-xl-up\:sticky { + position: sticky !important; + } +} +@media only screen and (min-width: 1401px) { + .position-xxl\:sticky { + position: sticky !important; + } +} +.top\:-1 { + top: -10px !important; +} + +.bottom\:-1 { + bottom: -10px !important; +} + +.left\:-1 { + left: -10px !important; +} + +.right\:-1 { + right: -10px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:-1 { + top: -10px !important; + } + + .bottom-xs\:-1 { + bottom: -10px !important; + } + + .left-xs\:-1 { + left: -10px !important; + } + + .right-xs\:-1 { + right: -10px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:-1 { + top: -10px !important; + } + + .bottom-sm-down\:-1 { + bottom: -10px !important; + } + + .left-sm-down\:-1 { + left: -10px !important; + } + + .right-sm-down\:-1 { + right: -10px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:-1 { + top: -10px !important; + } + + .bottom-sm\:-1 { + bottom: -10px !important; + } + + .left-sm\:-1 { + left: -10px !important; + } + + .right-sm\:-1 { + right: -10px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:-1 { + top: -10px !important; + } + + .bottom-sm-up\:-1 { + bottom: -10px !important; + } + + .left-sm-up\:-1 { + left: -10px !important; + } + + .right-sm-up\:-1 { + right: -10px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:-1 { + top: -10px !important; + } + + .bottom-md-down\:-1 { + bottom: -10px !important; + } + + .left-md-down\:-1 { + left: -10px !important; + } + + .right-md-down\:-1 { + right: -10px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:-1 { + top: -10px !important; + } + + .bottom-md\:-1 { + bottom: -10px !important; + } + + .left-md\:-1 { + left: -10px !important; + } + + .right-md\:-1 { + right: -10px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:-1 { + top: -10px !important; + } + + .bottom-md-up\:-1 { + bottom: -10px !important; + } + + .left-md-up\:-1 { + left: -10px !important; + } + + .right-md-up\:-1 { + right: -10px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:-1 { + top: -10px !important; + } + + .bottom-lg-down\:-1 { + bottom: -10px !important; + } + + .left-lg-down\:-1 { + left: -10px !important; + } + + .right-lg-down\:-1 { + right: -10px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:-1 { + top: -10px !important; + } + + .bottom-lg\:-1 { + bottom: -10px !important; + } + + .left-lg\:-1 { + left: -10px !important; + } + + .right-lg\:-1 { + right: -10px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:-1 { + top: -10px !important; + } + + .bottom-lg-up\:-1 { + bottom: -10px !important; + } + + .left-lg-up\:-1 { + left: -10px !important; + } + + .right-lg-up\:-1 { + right: -10px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:-1 { + top: -10px !important; + } + + .bottom-xl-down\:-1 { + bottom: -10px !important; + } + + .left-xl-down\:-1 { + left: -10px !important; + } + + .right-xl-down\:-1 { + right: -10px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:-1 { + top: -10px !important; + } + + .bottom-xl\:-1 { + bottom: -10px !important; + } + + .left-xl\:-1 { + left: -10px !important; + } + + .right-xl\:-1 { + right: -10px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:-1 { + top: -10px !important; + } + + .bottom-xl-up\:-1 { + bottom: -10px !important; + } + + .left-xl-up\:-1 { + left: -10px !important; + } + + .right-xl-up\:-1 { + right: -10px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:-1 { + top: -10px !important; + } + + .bottom-xxl\:-1 { + bottom: -10px !important; + } + + .left-xxl\:-1 { + left: -10px !important; + } + + .right-xxl\:-1 { + right: -10px !important; + } +} +.top\:-2 { + top: -20px !important; +} + +.bottom\:-2 { + bottom: -20px !important; +} + +.left\:-2 { + left: -20px !important; +} + +.right\:-2 { + right: -20px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:-2 { + top: -20px !important; + } + + .bottom-xs\:-2 { + bottom: -20px !important; + } + + .left-xs\:-2 { + left: -20px !important; + } + + .right-xs\:-2 { + right: -20px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:-2 { + top: -20px !important; + } + + .bottom-sm-down\:-2 { + bottom: -20px !important; + } + + .left-sm-down\:-2 { + left: -20px !important; + } + + .right-sm-down\:-2 { + right: -20px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:-2 { + top: -20px !important; + } + + .bottom-sm\:-2 { + bottom: -20px !important; + } + + .left-sm\:-2 { + left: -20px !important; + } + + .right-sm\:-2 { + right: -20px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:-2 { + top: -20px !important; + } + + .bottom-sm-up\:-2 { + bottom: -20px !important; + } + + .left-sm-up\:-2 { + left: -20px !important; + } + + .right-sm-up\:-2 { + right: -20px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:-2 { + top: -20px !important; + } + + .bottom-md-down\:-2 { + bottom: -20px !important; + } + + .left-md-down\:-2 { + left: -20px !important; + } + + .right-md-down\:-2 { + right: -20px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:-2 { + top: -20px !important; + } + + .bottom-md\:-2 { + bottom: -20px !important; + } + + .left-md\:-2 { + left: -20px !important; + } + + .right-md\:-2 { + right: -20px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:-2 { + top: -20px !important; + } + + .bottom-md-up\:-2 { + bottom: -20px !important; + } + + .left-md-up\:-2 { + left: -20px !important; + } + + .right-md-up\:-2 { + right: -20px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:-2 { + top: -20px !important; + } + + .bottom-lg-down\:-2 { + bottom: -20px !important; + } + + .left-lg-down\:-2 { + left: -20px !important; + } + + .right-lg-down\:-2 { + right: -20px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:-2 { + top: -20px !important; + } + + .bottom-lg\:-2 { + bottom: -20px !important; + } + + .left-lg\:-2 { + left: -20px !important; + } + + .right-lg\:-2 { + right: -20px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:-2 { + top: -20px !important; + } + + .bottom-lg-up\:-2 { + bottom: -20px !important; + } + + .left-lg-up\:-2 { + left: -20px !important; + } + + .right-lg-up\:-2 { + right: -20px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:-2 { + top: -20px !important; + } + + .bottom-xl-down\:-2 { + bottom: -20px !important; + } + + .left-xl-down\:-2 { + left: -20px !important; + } + + .right-xl-down\:-2 { + right: -20px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:-2 { + top: -20px !important; + } + + .bottom-xl\:-2 { + bottom: -20px !important; + } + + .left-xl\:-2 { + left: -20px !important; + } + + .right-xl\:-2 { + right: -20px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:-2 { + top: -20px !important; + } + + .bottom-xl-up\:-2 { + bottom: -20px !important; + } + + .left-xl-up\:-2 { + left: -20px !important; + } + + .right-xl-up\:-2 { + right: -20px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:-2 { + top: -20px !important; + } + + .bottom-xxl\:-2 { + bottom: -20px !important; + } + + .left-xxl\:-2 { + left: -20px !important; + } + + .right-xxl\:-2 { + right: -20px !important; + } +} +.top\:-3 { + top: -30px !important; +} + +.bottom\:-3 { + bottom: -30px !important; +} + +.left\:-3 { + left: -30px !important; +} + +.right\:-3 { + right: -30px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:-3 { + top: -30px !important; + } + + .bottom-xs\:-3 { + bottom: -30px !important; + } + + .left-xs\:-3 { + left: -30px !important; + } + + .right-xs\:-3 { + right: -30px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:-3 { + top: -30px !important; + } + + .bottom-sm-down\:-3 { + bottom: -30px !important; + } + + .left-sm-down\:-3 { + left: -30px !important; + } + + .right-sm-down\:-3 { + right: -30px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:-3 { + top: -30px !important; + } + + .bottom-sm\:-3 { + bottom: -30px !important; + } + + .left-sm\:-3 { + left: -30px !important; + } + + .right-sm\:-3 { + right: -30px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:-3 { + top: -30px !important; + } + + .bottom-sm-up\:-3 { + bottom: -30px !important; + } + + .left-sm-up\:-3 { + left: -30px !important; + } + + .right-sm-up\:-3 { + right: -30px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:-3 { + top: -30px !important; + } + + .bottom-md-down\:-3 { + bottom: -30px !important; + } + + .left-md-down\:-3 { + left: -30px !important; + } + + .right-md-down\:-3 { + right: -30px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:-3 { + top: -30px !important; + } + + .bottom-md\:-3 { + bottom: -30px !important; + } + + .left-md\:-3 { + left: -30px !important; + } + + .right-md\:-3 { + right: -30px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:-3 { + top: -30px !important; + } + + .bottom-md-up\:-3 { + bottom: -30px !important; + } + + .left-md-up\:-3 { + left: -30px !important; + } + + .right-md-up\:-3 { + right: -30px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:-3 { + top: -30px !important; + } + + .bottom-lg-down\:-3 { + bottom: -30px !important; + } + + .left-lg-down\:-3 { + left: -30px !important; + } + + .right-lg-down\:-3 { + right: -30px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:-3 { + top: -30px !important; + } + + .bottom-lg\:-3 { + bottom: -30px !important; + } + + .left-lg\:-3 { + left: -30px !important; + } + + .right-lg\:-3 { + right: -30px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:-3 { + top: -30px !important; + } + + .bottom-lg-up\:-3 { + bottom: -30px !important; + } + + .left-lg-up\:-3 { + left: -30px !important; + } + + .right-lg-up\:-3 { + right: -30px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:-3 { + top: -30px !important; + } + + .bottom-xl-down\:-3 { + bottom: -30px !important; + } + + .left-xl-down\:-3 { + left: -30px !important; + } + + .right-xl-down\:-3 { + right: -30px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:-3 { + top: -30px !important; + } + + .bottom-xl\:-3 { + bottom: -30px !important; + } + + .left-xl\:-3 { + left: -30px !important; + } + + .right-xl\:-3 { + right: -30px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:-3 { + top: -30px !important; + } + + .bottom-xl-up\:-3 { + bottom: -30px !important; + } + + .left-xl-up\:-3 { + left: -30px !important; + } + + .right-xl-up\:-3 { + right: -30px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:-3 { + top: -30px !important; + } + + .bottom-xxl\:-3 { + bottom: -30px !important; + } + + .left-xxl\:-3 { + left: -30px !important; + } + + .right-xxl\:-3 { + right: -30px !important; + } +} +.top\:-4 { + top: -40px !important; +} + +.bottom\:-4 { + bottom: -40px !important; +} + +.left\:-4 { + left: -40px !important; +} + +.right\:-4 { + right: -40px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:-4 { + top: -40px !important; + } + + .bottom-xs\:-4 { + bottom: -40px !important; + } + + .left-xs\:-4 { + left: -40px !important; + } + + .right-xs\:-4 { + right: -40px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:-4 { + top: -40px !important; + } + + .bottom-sm-down\:-4 { + bottom: -40px !important; + } + + .left-sm-down\:-4 { + left: -40px !important; + } + + .right-sm-down\:-4 { + right: -40px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:-4 { + top: -40px !important; + } + + .bottom-sm\:-4 { + bottom: -40px !important; + } + + .left-sm\:-4 { + left: -40px !important; + } + + .right-sm\:-4 { + right: -40px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:-4 { + top: -40px !important; + } + + .bottom-sm-up\:-4 { + bottom: -40px !important; + } + + .left-sm-up\:-4 { + left: -40px !important; + } + + .right-sm-up\:-4 { + right: -40px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:-4 { + top: -40px !important; + } + + .bottom-md-down\:-4 { + bottom: -40px !important; + } + + .left-md-down\:-4 { + left: -40px !important; + } + + .right-md-down\:-4 { + right: -40px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:-4 { + top: -40px !important; + } + + .bottom-md\:-4 { + bottom: -40px !important; + } + + .left-md\:-4 { + left: -40px !important; + } + + .right-md\:-4 { + right: -40px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:-4 { + top: -40px !important; + } + + .bottom-md-up\:-4 { + bottom: -40px !important; + } + + .left-md-up\:-4 { + left: -40px !important; + } + + .right-md-up\:-4 { + right: -40px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:-4 { + top: -40px !important; + } + + .bottom-lg-down\:-4 { + bottom: -40px !important; + } + + .left-lg-down\:-4 { + left: -40px !important; + } + + .right-lg-down\:-4 { + right: -40px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:-4 { + top: -40px !important; + } + + .bottom-lg\:-4 { + bottom: -40px !important; + } + + .left-lg\:-4 { + left: -40px !important; + } + + .right-lg\:-4 { + right: -40px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:-4 { + top: -40px !important; + } + + .bottom-lg-up\:-4 { + bottom: -40px !important; + } + + .left-lg-up\:-4 { + left: -40px !important; + } + + .right-lg-up\:-4 { + right: -40px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:-4 { + top: -40px !important; + } + + .bottom-xl-down\:-4 { + bottom: -40px !important; + } + + .left-xl-down\:-4 { + left: -40px !important; + } + + .right-xl-down\:-4 { + right: -40px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:-4 { + top: -40px !important; + } + + .bottom-xl\:-4 { + bottom: -40px !important; + } + + .left-xl\:-4 { + left: -40px !important; + } + + .right-xl\:-4 { + right: -40px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:-4 { + top: -40px !important; + } + + .bottom-xl-up\:-4 { + bottom: -40px !important; + } + + .left-xl-up\:-4 { + left: -40px !important; + } + + .right-xl-up\:-4 { + right: -40px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:-4 { + top: -40px !important; + } + + .bottom-xxl\:-4 { + bottom: -40px !important; + } + + .left-xxl\:-4 { + left: -40px !important; + } + + .right-xxl\:-4 { + right: -40px !important; + } +} +.top\:-5 { + top: -50px !important; +} + +.bottom\:-5 { + bottom: -50px !important; +} + +.left\:-5 { + left: -50px !important; +} + +.right\:-5 { + right: -50px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:-5 { + top: -50px !important; + } + + .bottom-xs\:-5 { + bottom: -50px !important; + } + + .left-xs\:-5 { + left: -50px !important; + } + + .right-xs\:-5 { + right: -50px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:-5 { + top: -50px !important; + } + + .bottom-sm-down\:-5 { + bottom: -50px !important; + } + + .left-sm-down\:-5 { + left: -50px !important; + } + + .right-sm-down\:-5 { + right: -50px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:-5 { + top: -50px !important; + } + + .bottom-sm\:-5 { + bottom: -50px !important; + } + + .left-sm\:-5 { + left: -50px !important; + } + + .right-sm\:-5 { + right: -50px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:-5 { + top: -50px !important; + } + + .bottom-sm-up\:-5 { + bottom: -50px !important; + } + + .left-sm-up\:-5 { + left: -50px !important; + } + + .right-sm-up\:-5 { + right: -50px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:-5 { + top: -50px !important; + } + + .bottom-md-down\:-5 { + bottom: -50px !important; + } + + .left-md-down\:-5 { + left: -50px !important; + } + + .right-md-down\:-5 { + right: -50px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:-5 { + top: -50px !important; + } + + .bottom-md\:-5 { + bottom: -50px !important; + } + + .left-md\:-5 { + left: -50px !important; + } + + .right-md\:-5 { + right: -50px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:-5 { + top: -50px !important; + } + + .bottom-md-up\:-5 { + bottom: -50px !important; + } + + .left-md-up\:-5 { + left: -50px !important; + } + + .right-md-up\:-5 { + right: -50px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:-5 { + top: -50px !important; + } + + .bottom-lg-down\:-5 { + bottom: -50px !important; + } + + .left-lg-down\:-5 { + left: -50px !important; + } + + .right-lg-down\:-5 { + right: -50px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:-5 { + top: -50px !important; + } + + .bottom-lg\:-5 { + bottom: -50px !important; + } + + .left-lg\:-5 { + left: -50px !important; + } + + .right-lg\:-5 { + right: -50px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:-5 { + top: -50px !important; + } + + .bottom-lg-up\:-5 { + bottom: -50px !important; + } + + .left-lg-up\:-5 { + left: -50px !important; + } + + .right-lg-up\:-5 { + right: -50px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:-5 { + top: -50px !important; + } + + .bottom-xl-down\:-5 { + bottom: -50px !important; + } + + .left-xl-down\:-5 { + left: -50px !important; + } + + .right-xl-down\:-5 { + right: -50px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:-5 { + top: -50px !important; + } + + .bottom-xl\:-5 { + bottom: -50px !important; + } + + .left-xl\:-5 { + left: -50px !important; + } + + .right-xl\:-5 { + right: -50px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:-5 { + top: -50px !important; + } + + .bottom-xl-up\:-5 { + bottom: -50px !important; + } + + .left-xl-up\:-5 { + left: -50px !important; + } + + .right-xl-up\:-5 { + right: -50px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:-5 { + top: -50px !important; + } + + .bottom-xxl\:-5 { + bottom: -50px !important; + } + + .left-xxl\:-5 { + left: -50px !important; + } + + .right-xxl\:-5 { + right: -50px !important; + } +} +.top\:-6 { + top: -60px !important; +} + +.bottom\:-6 { + bottom: -60px !important; +} + +.left\:-6 { + left: -60px !important; +} + +.right\:-6 { + right: -60px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:-6 { + top: -60px !important; + } + + .bottom-xs\:-6 { + bottom: -60px !important; + } + + .left-xs\:-6 { + left: -60px !important; + } + + .right-xs\:-6 { + right: -60px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:-6 { + top: -60px !important; + } + + .bottom-sm-down\:-6 { + bottom: -60px !important; + } + + .left-sm-down\:-6 { + left: -60px !important; + } + + .right-sm-down\:-6 { + right: -60px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:-6 { + top: -60px !important; + } + + .bottom-sm\:-6 { + bottom: -60px !important; + } + + .left-sm\:-6 { + left: -60px !important; + } + + .right-sm\:-6 { + right: -60px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:-6 { + top: -60px !important; + } + + .bottom-sm-up\:-6 { + bottom: -60px !important; + } + + .left-sm-up\:-6 { + left: -60px !important; + } + + .right-sm-up\:-6 { + right: -60px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:-6 { + top: -60px !important; + } + + .bottom-md-down\:-6 { + bottom: -60px !important; + } + + .left-md-down\:-6 { + left: -60px !important; + } + + .right-md-down\:-6 { + right: -60px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:-6 { + top: -60px !important; + } + + .bottom-md\:-6 { + bottom: -60px !important; + } + + .left-md\:-6 { + left: -60px !important; + } + + .right-md\:-6 { + right: -60px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:-6 { + top: -60px !important; + } + + .bottom-md-up\:-6 { + bottom: -60px !important; + } + + .left-md-up\:-6 { + left: -60px !important; + } + + .right-md-up\:-6 { + right: -60px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:-6 { + top: -60px !important; + } + + .bottom-lg-down\:-6 { + bottom: -60px !important; + } + + .left-lg-down\:-6 { + left: -60px !important; + } + + .right-lg-down\:-6 { + right: -60px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:-6 { + top: -60px !important; + } + + .bottom-lg\:-6 { + bottom: -60px !important; + } + + .left-lg\:-6 { + left: -60px !important; + } + + .right-lg\:-6 { + right: -60px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:-6 { + top: -60px !important; + } + + .bottom-lg-up\:-6 { + bottom: -60px !important; + } + + .left-lg-up\:-6 { + left: -60px !important; + } + + .right-lg-up\:-6 { + right: -60px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:-6 { + top: -60px !important; + } + + .bottom-xl-down\:-6 { + bottom: -60px !important; + } + + .left-xl-down\:-6 { + left: -60px !important; + } + + .right-xl-down\:-6 { + right: -60px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:-6 { + top: -60px !important; + } + + .bottom-xl\:-6 { + bottom: -60px !important; + } + + .left-xl\:-6 { + left: -60px !important; + } + + .right-xl\:-6 { + right: -60px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:-6 { + top: -60px !important; + } + + .bottom-xl-up\:-6 { + bottom: -60px !important; + } + + .left-xl-up\:-6 { + left: -60px !important; + } + + .right-xl-up\:-6 { + right: -60px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:-6 { + top: -60px !important; + } + + .bottom-xxl\:-6 { + bottom: -60px !important; + } + + .left-xxl\:-6 { + left: -60px !important; + } + + .right-xxl\:-6 { + right: -60px !important; + } +} +.top\:-7 { + top: -70px !important; +} + +.bottom\:-7 { + bottom: -70px !important; +} + +.left\:-7 { + left: -70px !important; +} + +.right\:-7 { + right: -70px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:-7 { + top: -70px !important; + } + + .bottom-xs\:-7 { + bottom: -70px !important; + } + + .left-xs\:-7 { + left: -70px !important; + } + + .right-xs\:-7 { + right: -70px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:-7 { + top: -70px !important; + } + + .bottom-sm-down\:-7 { + bottom: -70px !important; + } + + .left-sm-down\:-7 { + left: -70px !important; + } + + .right-sm-down\:-7 { + right: -70px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:-7 { + top: -70px !important; + } + + .bottom-sm\:-7 { + bottom: -70px !important; + } + + .left-sm\:-7 { + left: -70px !important; + } + + .right-sm\:-7 { + right: -70px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:-7 { + top: -70px !important; + } + + .bottom-sm-up\:-7 { + bottom: -70px !important; + } + + .left-sm-up\:-7 { + left: -70px !important; + } + + .right-sm-up\:-7 { + right: -70px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:-7 { + top: -70px !important; + } + + .bottom-md-down\:-7 { + bottom: -70px !important; + } + + .left-md-down\:-7 { + left: -70px !important; + } + + .right-md-down\:-7 { + right: -70px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:-7 { + top: -70px !important; + } + + .bottom-md\:-7 { + bottom: -70px !important; + } + + .left-md\:-7 { + left: -70px !important; + } + + .right-md\:-7 { + right: -70px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:-7 { + top: -70px !important; + } + + .bottom-md-up\:-7 { + bottom: -70px !important; + } + + .left-md-up\:-7 { + left: -70px !important; + } + + .right-md-up\:-7 { + right: -70px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:-7 { + top: -70px !important; + } + + .bottom-lg-down\:-7 { + bottom: -70px !important; + } + + .left-lg-down\:-7 { + left: -70px !important; + } + + .right-lg-down\:-7 { + right: -70px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:-7 { + top: -70px !important; + } + + .bottom-lg\:-7 { + bottom: -70px !important; + } + + .left-lg\:-7 { + left: -70px !important; + } + + .right-lg\:-7 { + right: -70px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:-7 { + top: -70px !important; + } + + .bottom-lg-up\:-7 { + bottom: -70px !important; + } + + .left-lg-up\:-7 { + left: -70px !important; + } + + .right-lg-up\:-7 { + right: -70px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:-7 { + top: -70px !important; + } + + .bottom-xl-down\:-7 { + bottom: -70px !important; + } + + .left-xl-down\:-7 { + left: -70px !important; + } + + .right-xl-down\:-7 { + right: -70px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:-7 { + top: -70px !important; + } + + .bottom-xl\:-7 { + bottom: -70px !important; + } + + .left-xl\:-7 { + left: -70px !important; + } + + .right-xl\:-7 { + right: -70px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:-7 { + top: -70px !important; + } + + .bottom-xl-up\:-7 { + bottom: -70px !important; + } + + .left-xl-up\:-7 { + left: -70px !important; + } + + .right-xl-up\:-7 { + right: -70px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:-7 { + top: -70px !important; + } + + .bottom-xxl\:-7 { + bottom: -70px !important; + } + + .left-xxl\:-7 { + left: -70px !important; + } + + .right-xxl\:-7 { + right: -70px !important; + } +} +.top\:-8 { + top: -80px !important; +} + +.bottom\:-8 { + bottom: -80px !important; +} + +.left\:-8 { + left: -80px !important; +} + +.right\:-8 { + right: -80px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:-8 { + top: -80px !important; + } + + .bottom-xs\:-8 { + bottom: -80px !important; + } + + .left-xs\:-8 { + left: -80px !important; + } + + .right-xs\:-8 { + right: -80px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:-8 { + top: -80px !important; + } + + .bottom-sm-down\:-8 { + bottom: -80px !important; + } + + .left-sm-down\:-8 { + left: -80px !important; + } + + .right-sm-down\:-8 { + right: -80px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:-8 { + top: -80px !important; + } + + .bottom-sm\:-8 { + bottom: -80px !important; + } + + .left-sm\:-8 { + left: -80px !important; + } + + .right-sm\:-8 { + right: -80px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:-8 { + top: -80px !important; + } + + .bottom-sm-up\:-8 { + bottom: -80px !important; + } + + .left-sm-up\:-8 { + left: -80px !important; + } + + .right-sm-up\:-8 { + right: -80px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:-8 { + top: -80px !important; + } + + .bottom-md-down\:-8 { + bottom: -80px !important; + } + + .left-md-down\:-8 { + left: -80px !important; + } + + .right-md-down\:-8 { + right: -80px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:-8 { + top: -80px !important; + } + + .bottom-md\:-8 { + bottom: -80px !important; + } + + .left-md\:-8 { + left: -80px !important; + } + + .right-md\:-8 { + right: -80px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:-8 { + top: -80px !important; + } + + .bottom-md-up\:-8 { + bottom: -80px !important; + } + + .left-md-up\:-8 { + left: -80px !important; + } + + .right-md-up\:-8 { + right: -80px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:-8 { + top: -80px !important; + } + + .bottom-lg-down\:-8 { + bottom: -80px !important; + } + + .left-lg-down\:-8 { + left: -80px !important; + } + + .right-lg-down\:-8 { + right: -80px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:-8 { + top: -80px !important; + } + + .bottom-lg\:-8 { + bottom: -80px !important; + } + + .left-lg\:-8 { + left: -80px !important; + } + + .right-lg\:-8 { + right: -80px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:-8 { + top: -80px !important; + } + + .bottom-lg-up\:-8 { + bottom: -80px !important; + } + + .left-lg-up\:-8 { + left: -80px !important; + } + + .right-lg-up\:-8 { + right: -80px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:-8 { + top: -80px !important; + } + + .bottom-xl-down\:-8 { + bottom: -80px !important; + } + + .left-xl-down\:-8 { + left: -80px !important; + } + + .right-xl-down\:-8 { + right: -80px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:-8 { + top: -80px !important; + } + + .bottom-xl\:-8 { + bottom: -80px !important; + } + + .left-xl\:-8 { + left: -80px !important; + } + + .right-xl\:-8 { + right: -80px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:-8 { + top: -80px !important; + } + + .bottom-xl-up\:-8 { + bottom: -80px !important; + } + + .left-xl-up\:-8 { + left: -80px !important; + } + + .right-xl-up\:-8 { + right: -80px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:-8 { + top: -80px !important; + } + + .bottom-xxl\:-8 { + bottom: -80px !important; + } + + .left-xxl\:-8 { + left: -80px !important; + } + + .right-xxl\:-8 { + right: -80px !important; + } +} +.top\:-9 { + top: -90px !important; +} + +.bottom\:-9 { + bottom: -90px !important; +} + +.left\:-9 { + left: -90px !important; +} + +.right\:-9 { + right: -90px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:-9 { + top: -90px !important; + } + + .bottom-xs\:-9 { + bottom: -90px !important; + } + + .left-xs\:-9 { + left: -90px !important; + } + + .right-xs\:-9 { + right: -90px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:-9 { + top: -90px !important; + } + + .bottom-sm-down\:-9 { + bottom: -90px !important; + } + + .left-sm-down\:-9 { + left: -90px !important; + } + + .right-sm-down\:-9 { + right: -90px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:-9 { + top: -90px !important; + } + + .bottom-sm\:-9 { + bottom: -90px !important; + } + + .left-sm\:-9 { + left: -90px !important; + } + + .right-sm\:-9 { + right: -90px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:-9 { + top: -90px !important; + } + + .bottom-sm-up\:-9 { + bottom: -90px !important; + } + + .left-sm-up\:-9 { + left: -90px !important; + } + + .right-sm-up\:-9 { + right: -90px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:-9 { + top: -90px !important; + } + + .bottom-md-down\:-9 { + bottom: -90px !important; + } + + .left-md-down\:-9 { + left: -90px !important; + } + + .right-md-down\:-9 { + right: -90px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:-9 { + top: -90px !important; + } + + .bottom-md\:-9 { + bottom: -90px !important; + } + + .left-md\:-9 { + left: -90px !important; + } + + .right-md\:-9 { + right: -90px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:-9 { + top: -90px !important; + } + + .bottom-md-up\:-9 { + bottom: -90px !important; + } + + .left-md-up\:-9 { + left: -90px !important; + } + + .right-md-up\:-9 { + right: -90px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:-9 { + top: -90px !important; + } + + .bottom-lg-down\:-9 { + bottom: -90px !important; + } + + .left-lg-down\:-9 { + left: -90px !important; + } + + .right-lg-down\:-9 { + right: -90px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:-9 { + top: -90px !important; + } + + .bottom-lg\:-9 { + bottom: -90px !important; + } + + .left-lg\:-9 { + left: -90px !important; + } + + .right-lg\:-9 { + right: -90px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:-9 { + top: -90px !important; + } + + .bottom-lg-up\:-9 { + bottom: -90px !important; + } + + .left-lg-up\:-9 { + left: -90px !important; + } + + .right-lg-up\:-9 { + right: -90px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:-9 { + top: -90px !important; + } + + .bottom-xl-down\:-9 { + bottom: -90px !important; + } + + .left-xl-down\:-9 { + left: -90px !important; + } + + .right-xl-down\:-9 { + right: -90px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:-9 { + top: -90px !important; + } + + .bottom-xl\:-9 { + bottom: -90px !important; + } + + .left-xl\:-9 { + left: -90px !important; + } + + .right-xl\:-9 { + right: -90px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:-9 { + top: -90px !important; + } + + .bottom-xl-up\:-9 { + bottom: -90px !important; + } + + .left-xl-up\:-9 { + left: -90px !important; + } + + .right-xl-up\:-9 { + right: -90px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:-9 { + top: -90px !important; + } + + .bottom-xxl\:-9 { + bottom: -90px !important; + } + + .left-xxl\:-9 { + left: -90px !important; + } + + .right-xxl\:-9 { + right: -90px !important; + } +} +.top\:-10 { + top: -100px !important; +} + +.bottom\:-10 { + bottom: -100px !important; +} + +.left\:-10 { + left: -100px !important; +} + +.right\:-10 { + right: -100px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:-10 { + top: -100px !important; + } + + .bottom-xs\:-10 { + bottom: -100px !important; + } + + .left-xs\:-10 { + left: -100px !important; + } + + .right-xs\:-10 { + right: -100px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:-10 { + top: -100px !important; + } + + .bottom-sm-down\:-10 { + bottom: -100px !important; + } + + .left-sm-down\:-10 { + left: -100px !important; + } + + .right-sm-down\:-10 { + right: -100px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:-10 { + top: -100px !important; + } + + .bottom-sm\:-10 { + bottom: -100px !important; + } + + .left-sm\:-10 { + left: -100px !important; + } + + .right-sm\:-10 { + right: -100px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:-10 { + top: -100px !important; + } + + .bottom-sm-up\:-10 { + bottom: -100px !important; + } + + .left-sm-up\:-10 { + left: -100px !important; + } + + .right-sm-up\:-10 { + right: -100px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:-10 { + top: -100px !important; + } + + .bottom-md-down\:-10 { + bottom: -100px !important; + } + + .left-md-down\:-10 { + left: -100px !important; + } + + .right-md-down\:-10 { + right: -100px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:-10 { + top: -100px !important; + } + + .bottom-md\:-10 { + bottom: -100px !important; + } + + .left-md\:-10 { + left: -100px !important; + } + + .right-md\:-10 { + right: -100px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:-10 { + top: -100px !important; + } + + .bottom-md-up\:-10 { + bottom: -100px !important; + } + + .left-md-up\:-10 { + left: -100px !important; + } + + .right-md-up\:-10 { + right: -100px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:-10 { + top: -100px !important; + } + + .bottom-lg-down\:-10 { + bottom: -100px !important; + } + + .left-lg-down\:-10 { + left: -100px !important; + } + + .right-lg-down\:-10 { + right: -100px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:-10 { + top: -100px !important; + } + + .bottom-lg\:-10 { + bottom: -100px !important; + } + + .left-lg\:-10 { + left: -100px !important; + } + + .right-lg\:-10 { + right: -100px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:-10 { + top: -100px !important; + } + + .bottom-lg-up\:-10 { + bottom: -100px !important; + } + + .left-lg-up\:-10 { + left: -100px !important; + } + + .right-lg-up\:-10 { + right: -100px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:-10 { + top: -100px !important; + } + + .bottom-xl-down\:-10 { + bottom: -100px !important; + } + + .left-xl-down\:-10 { + left: -100px !important; + } + + .right-xl-down\:-10 { + right: -100px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:-10 { + top: -100px !important; + } + + .bottom-xl\:-10 { + bottom: -100px !important; + } + + .left-xl\:-10 { + left: -100px !important; + } + + .right-xl\:-10 { + right: -100px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:-10 { + top: -100px !important; + } + + .bottom-xl-up\:-10 { + bottom: -100px !important; + } + + .left-xl-up\:-10 { + left: -100px !important; + } + + .right-xl-up\:-10 { + right: -100px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:-10 { + top: -100px !important; + } + + .bottom-xxl\:-10 { + bottom: -100px !important; + } + + .left-xxl\:-10 { + left: -100px !important; + } + + .right-xxl\:-10 { + right: -100px !important; + } +} +.top\:0 { + top: 0 !important; +} + +.bottom\:0 { + bottom: 0 !important; +} + +.left\:0 { + left: 0 !important; +} + +.right\:0 { + right: 0 !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:0 { + top: 0 !important; + } + + .bottom-xs\:0 { + bottom: 0 !important; + } + + .left-xs\:0 { + left: 0 !important; + } + + .right-xs\:0 { + right: 0 !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:0 { + top: 0 !important; + } + + .bottom-sm-down\:0 { + bottom: 0 !important; + } + + .left-sm-down\:0 { + left: 0 !important; + } + + .right-sm-down\:0 { + right: 0 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:0 { + top: 0 !important; + } + + .bottom-sm\:0 { + bottom: 0 !important; + } + + .left-sm\:0 { + left: 0 !important; + } + + .right-sm\:0 { + right: 0 !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:0 { + top: 0 !important; + } + + .bottom-sm-up\:0 { + bottom: 0 !important; + } + + .left-sm-up\:0 { + left: 0 !important; + } + + .right-sm-up\:0 { + right: 0 !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:0 { + top: 0 !important; + } + + .bottom-md-down\:0 { + bottom: 0 !important; + } + + .left-md-down\:0 { + left: 0 !important; + } + + .right-md-down\:0 { + right: 0 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:0 { + top: 0 !important; + } + + .bottom-md\:0 { + bottom: 0 !important; + } + + .left-md\:0 { + left: 0 !important; + } + + .right-md\:0 { + right: 0 !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:0 { + top: 0 !important; + } + + .bottom-md-up\:0 { + bottom: 0 !important; + } + + .left-md-up\:0 { + left: 0 !important; + } + + .right-md-up\:0 { + right: 0 !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:0 { + top: 0 !important; + } + + .bottom-lg-down\:0 { + bottom: 0 !important; + } + + .left-lg-down\:0 { + left: 0 !important; + } + + .right-lg-down\:0 { + right: 0 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:0 { + top: 0 !important; + } + + .bottom-lg\:0 { + bottom: 0 !important; + } + + .left-lg\:0 { + left: 0 !important; + } + + .right-lg\:0 { + right: 0 !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:0 { + top: 0 !important; + } + + .bottom-lg-up\:0 { + bottom: 0 !important; + } + + .left-lg-up\:0 { + left: 0 !important; + } + + .right-lg-up\:0 { + right: 0 !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:0 { + top: 0 !important; + } + + .bottom-xl-down\:0 { + bottom: 0 !important; + } + + .left-xl-down\:0 { + left: 0 !important; + } + + .right-xl-down\:0 { + right: 0 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:0 { + top: 0 !important; + } + + .bottom-xl\:0 { + bottom: 0 !important; + } + + .left-xl\:0 { + left: 0 !important; + } + + .right-xl\:0 { + right: 0 !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:0 { + top: 0 !important; + } + + .bottom-xl-up\:0 { + bottom: 0 !important; + } + + .left-xl-up\:0 { + left: 0 !important; + } + + .right-xl-up\:0 { + right: 0 !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:0 { + top: 0 !important; + } + + .bottom-xxl\:0 { + bottom: 0 !important; + } + + .left-xxl\:0 { + left: 0 !important; + } + + .right-xxl\:0 { + right: 0 !important; + } +} +.top\:_1 { + top: 10px !important; +} + +.bottom\:_1 { + bottom: 10px !important; +} + +.left\:_1 { + left: 10px !important; +} + +.right\:_1 { + right: 10px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:_1 { + top: 10px !important; + } + + .bottom-xs\:_1 { + bottom: 10px !important; + } + + .left-xs\:_1 { + left: 10px !important; + } + + .right-xs\:_1 { + right: 10px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:_1 { + top: 10px !important; + } + + .bottom-sm-down\:_1 { + bottom: 10px !important; + } + + .left-sm-down\:_1 { + left: 10px !important; + } + + .right-sm-down\:_1 { + right: 10px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:_1 { + top: 10px !important; + } + + .bottom-sm\:_1 { + bottom: 10px !important; + } + + .left-sm\:_1 { + left: 10px !important; + } + + .right-sm\:_1 { + right: 10px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:_1 { + top: 10px !important; + } + + .bottom-sm-up\:_1 { + bottom: 10px !important; + } + + .left-sm-up\:_1 { + left: 10px !important; + } + + .right-sm-up\:_1 { + right: 10px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:_1 { + top: 10px !important; + } + + .bottom-md-down\:_1 { + bottom: 10px !important; + } + + .left-md-down\:_1 { + left: 10px !important; + } + + .right-md-down\:_1 { + right: 10px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:_1 { + top: 10px !important; + } + + .bottom-md\:_1 { + bottom: 10px !important; + } + + .left-md\:_1 { + left: 10px !important; + } + + .right-md\:_1 { + right: 10px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:_1 { + top: 10px !important; + } + + .bottom-md-up\:_1 { + bottom: 10px !important; + } + + .left-md-up\:_1 { + left: 10px !important; + } + + .right-md-up\:_1 { + right: 10px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:_1 { + top: 10px !important; + } + + .bottom-lg-down\:_1 { + bottom: 10px !important; + } + + .left-lg-down\:_1 { + left: 10px !important; + } + + .right-lg-down\:_1 { + right: 10px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:_1 { + top: 10px !important; + } + + .bottom-lg\:_1 { + bottom: 10px !important; + } + + .left-lg\:_1 { + left: 10px !important; + } + + .right-lg\:_1 { + right: 10px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:_1 { + top: 10px !important; + } + + .bottom-lg-up\:_1 { + bottom: 10px !important; + } + + .left-lg-up\:_1 { + left: 10px !important; + } + + .right-lg-up\:_1 { + right: 10px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:_1 { + top: 10px !important; + } + + .bottom-xl-down\:_1 { + bottom: 10px !important; + } + + .left-xl-down\:_1 { + left: 10px !important; + } + + .right-xl-down\:_1 { + right: 10px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:_1 { + top: 10px !important; + } + + .bottom-xl\:_1 { + bottom: 10px !important; + } + + .left-xl\:_1 { + left: 10px !important; + } + + .right-xl\:_1 { + right: 10px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:_1 { + top: 10px !important; + } + + .bottom-xl-up\:_1 { + bottom: 10px !important; + } + + .left-xl-up\:_1 { + left: 10px !important; + } + + .right-xl-up\:_1 { + right: 10px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:_1 { + top: 10px !important; + } + + .bottom-xxl\:_1 { + bottom: 10px !important; + } + + .left-xxl\:_1 { + left: 10px !important; + } + + .right-xxl\:_1 { + right: 10px !important; + } +} +.top\:_2 { + top: 20px !important; +} + +.bottom\:_2 { + bottom: 20px !important; +} + +.left\:_2 { + left: 20px !important; +} + +.right\:_2 { + right: 20px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:_2 { + top: 20px !important; + } + + .bottom-xs\:_2 { + bottom: 20px !important; + } + + .left-xs\:_2 { + left: 20px !important; + } + + .right-xs\:_2 { + right: 20px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:_2 { + top: 20px !important; + } + + .bottom-sm-down\:_2 { + bottom: 20px !important; + } + + .left-sm-down\:_2 { + left: 20px !important; + } + + .right-sm-down\:_2 { + right: 20px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:_2 { + top: 20px !important; + } + + .bottom-sm\:_2 { + bottom: 20px !important; + } + + .left-sm\:_2 { + left: 20px !important; + } + + .right-sm\:_2 { + right: 20px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:_2 { + top: 20px !important; + } + + .bottom-sm-up\:_2 { + bottom: 20px !important; + } + + .left-sm-up\:_2 { + left: 20px !important; + } + + .right-sm-up\:_2 { + right: 20px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:_2 { + top: 20px !important; + } + + .bottom-md-down\:_2 { + bottom: 20px !important; + } + + .left-md-down\:_2 { + left: 20px !important; + } + + .right-md-down\:_2 { + right: 20px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:_2 { + top: 20px !important; + } + + .bottom-md\:_2 { + bottom: 20px !important; + } + + .left-md\:_2 { + left: 20px !important; + } + + .right-md\:_2 { + right: 20px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:_2 { + top: 20px !important; + } + + .bottom-md-up\:_2 { + bottom: 20px !important; + } + + .left-md-up\:_2 { + left: 20px !important; + } + + .right-md-up\:_2 { + right: 20px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:_2 { + top: 20px !important; + } + + .bottom-lg-down\:_2 { + bottom: 20px !important; + } + + .left-lg-down\:_2 { + left: 20px !important; + } + + .right-lg-down\:_2 { + right: 20px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:_2 { + top: 20px !important; + } + + .bottom-lg\:_2 { + bottom: 20px !important; + } + + .left-lg\:_2 { + left: 20px !important; + } + + .right-lg\:_2 { + right: 20px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:_2 { + top: 20px !important; + } + + .bottom-lg-up\:_2 { + bottom: 20px !important; + } + + .left-lg-up\:_2 { + left: 20px !important; + } + + .right-lg-up\:_2 { + right: 20px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:_2 { + top: 20px !important; + } + + .bottom-xl-down\:_2 { + bottom: 20px !important; + } + + .left-xl-down\:_2 { + left: 20px !important; + } + + .right-xl-down\:_2 { + right: 20px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:_2 { + top: 20px !important; + } + + .bottom-xl\:_2 { + bottom: 20px !important; + } + + .left-xl\:_2 { + left: 20px !important; + } + + .right-xl\:_2 { + right: 20px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:_2 { + top: 20px !important; + } + + .bottom-xl-up\:_2 { + bottom: 20px !important; + } + + .left-xl-up\:_2 { + left: 20px !important; + } + + .right-xl-up\:_2 { + right: 20px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:_2 { + top: 20px !important; + } + + .bottom-xxl\:_2 { + bottom: 20px !important; + } + + .left-xxl\:_2 { + left: 20px !important; + } + + .right-xxl\:_2 { + right: 20px !important; + } +} +.top\:_3 { + top: 30px !important; +} + +.bottom\:_3 { + bottom: 30px !important; +} + +.left\:_3 { + left: 30px !important; +} + +.right\:_3 { + right: 30px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:_3 { + top: 30px !important; + } + + .bottom-xs\:_3 { + bottom: 30px !important; + } + + .left-xs\:_3 { + left: 30px !important; + } + + .right-xs\:_3 { + right: 30px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:_3 { + top: 30px !important; + } + + .bottom-sm-down\:_3 { + bottom: 30px !important; + } + + .left-sm-down\:_3 { + left: 30px !important; + } + + .right-sm-down\:_3 { + right: 30px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:_3 { + top: 30px !important; + } + + .bottom-sm\:_3 { + bottom: 30px !important; + } + + .left-sm\:_3 { + left: 30px !important; + } + + .right-sm\:_3 { + right: 30px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:_3 { + top: 30px !important; + } + + .bottom-sm-up\:_3 { + bottom: 30px !important; + } + + .left-sm-up\:_3 { + left: 30px !important; + } + + .right-sm-up\:_3 { + right: 30px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:_3 { + top: 30px !important; + } + + .bottom-md-down\:_3 { + bottom: 30px !important; + } + + .left-md-down\:_3 { + left: 30px !important; + } + + .right-md-down\:_3 { + right: 30px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:_3 { + top: 30px !important; + } + + .bottom-md\:_3 { + bottom: 30px !important; + } + + .left-md\:_3 { + left: 30px !important; + } + + .right-md\:_3 { + right: 30px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:_3 { + top: 30px !important; + } + + .bottom-md-up\:_3 { + bottom: 30px !important; + } + + .left-md-up\:_3 { + left: 30px !important; + } + + .right-md-up\:_3 { + right: 30px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:_3 { + top: 30px !important; + } + + .bottom-lg-down\:_3 { + bottom: 30px !important; + } + + .left-lg-down\:_3 { + left: 30px !important; + } + + .right-lg-down\:_3 { + right: 30px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:_3 { + top: 30px !important; + } + + .bottom-lg\:_3 { + bottom: 30px !important; + } + + .left-lg\:_3 { + left: 30px !important; + } + + .right-lg\:_3 { + right: 30px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:_3 { + top: 30px !important; + } + + .bottom-lg-up\:_3 { + bottom: 30px !important; + } + + .left-lg-up\:_3 { + left: 30px !important; + } + + .right-lg-up\:_3 { + right: 30px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:_3 { + top: 30px !important; + } + + .bottom-xl-down\:_3 { + bottom: 30px !important; + } + + .left-xl-down\:_3 { + left: 30px !important; + } + + .right-xl-down\:_3 { + right: 30px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:_3 { + top: 30px !important; + } + + .bottom-xl\:_3 { + bottom: 30px !important; + } + + .left-xl\:_3 { + left: 30px !important; + } + + .right-xl\:_3 { + right: 30px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:_3 { + top: 30px !important; + } + + .bottom-xl-up\:_3 { + bottom: 30px !important; + } + + .left-xl-up\:_3 { + left: 30px !important; + } + + .right-xl-up\:_3 { + right: 30px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:_3 { + top: 30px !important; + } + + .bottom-xxl\:_3 { + bottom: 30px !important; + } + + .left-xxl\:_3 { + left: 30px !important; + } + + .right-xxl\:_3 { + right: 30px !important; + } +} +.top\:_4 { + top: 40px !important; +} + +.bottom\:_4 { + bottom: 40px !important; +} + +.left\:_4 { + left: 40px !important; +} + +.right\:_4 { + right: 40px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:_4 { + top: 40px !important; + } + + .bottom-xs\:_4 { + bottom: 40px !important; + } + + .left-xs\:_4 { + left: 40px !important; + } + + .right-xs\:_4 { + right: 40px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:_4 { + top: 40px !important; + } + + .bottom-sm-down\:_4 { + bottom: 40px !important; + } + + .left-sm-down\:_4 { + left: 40px !important; + } + + .right-sm-down\:_4 { + right: 40px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:_4 { + top: 40px !important; + } + + .bottom-sm\:_4 { + bottom: 40px !important; + } + + .left-sm\:_4 { + left: 40px !important; + } + + .right-sm\:_4 { + right: 40px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:_4 { + top: 40px !important; + } + + .bottom-sm-up\:_4 { + bottom: 40px !important; + } + + .left-sm-up\:_4 { + left: 40px !important; + } + + .right-sm-up\:_4 { + right: 40px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:_4 { + top: 40px !important; + } + + .bottom-md-down\:_4 { + bottom: 40px !important; + } + + .left-md-down\:_4 { + left: 40px !important; + } + + .right-md-down\:_4 { + right: 40px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:_4 { + top: 40px !important; + } + + .bottom-md\:_4 { + bottom: 40px !important; + } + + .left-md\:_4 { + left: 40px !important; + } + + .right-md\:_4 { + right: 40px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:_4 { + top: 40px !important; + } + + .bottom-md-up\:_4 { + bottom: 40px !important; + } + + .left-md-up\:_4 { + left: 40px !important; + } + + .right-md-up\:_4 { + right: 40px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:_4 { + top: 40px !important; + } + + .bottom-lg-down\:_4 { + bottom: 40px !important; + } + + .left-lg-down\:_4 { + left: 40px !important; + } + + .right-lg-down\:_4 { + right: 40px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:_4 { + top: 40px !important; + } + + .bottom-lg\:_4 { + bottom: 40px !important; + } + + .left-lg\:_4 { + left: 40px !important; + } + + .right-lg\:_4 { + right: 40px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:_4 { + top: 40px !important; + } + + .bottom-lg-up\:_4 { + bottom: 40px !important; + } + + .left-lg-up\:_4 { + left: 40px !important; + } + + .right-lg-up\:_4 { + right: 40px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:_4 { + top: 40px !important; + } + + .bottom-xl-down\:_4 { + bottom: 40px !important; + } + + .left-xl-down\:_4 { + left: 40px !important; + } + + .right-xl-down\:_4 { + right: 40px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:_4 { + top: 40px !important; + } + + .bottom-xl\:_4 { + bottom: 40px !important; + } + + .left-xl\:_4 { + left: 40px !important; + } + + .right-xl\:_4 { + right: 40px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:_4 { + top: 40px !important; + } + + .bottom-xl-up\:_4 { + bottom: 40px !important; + } + + .left-xl-up\:_4 { + left: 40px !important; + } + + .right-xl-up\:_4 { + right: 40px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:_4 { + top: 40px !important; + } + + .bottom-xxl\:_4 { + bottom: 40px !important; + } + + .left-xxl\:_4 { + left: 40px !important; + } + + .right-xxl\:_4 { + right: 40px !important; + } +} +.top\:_5 { + top: 50px !important; +} + +.bottom\:_5 { + bottom: 50px !important; +} + +.left\:_5 { + left: 50px !important; +} + +.right\:_5 { + right: 50px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:_5 { + top: 50px !important; + } + + .bottom-xs\:_5 { + bottom: 50px !important; + } + + .left-xs\:_5 { + left: 50px !important; + } + + .right-xs\:_5 { + right: 50px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:_5 { + top: 50px !important; + } + + .bottom-sm-down\:_5 { + bottom: 50px !important; + } + + .left-sm-down\:_5 { + left: 50px !important; + } + + .right-sm-down\:_5 { + right: 50px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:_5 { + top: 50px !important; + } + + .bottom-sm\:_5 { + bottom: 50px !important; + } + + .left-sm\:_5 { + left: 50px !important; + } + + .right-sm\:_5 { + right: 50px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:_5 { + top: 50px !important; + } + + .bottom-sm-up\:_5 { + bottom: 50px !important; + } + + .left-sm-up\:_5 { + left: 50px !important; + } + + .right-sm-up\:_5 { + right: 50px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:_5 { + top: 50px !important; + } + + .bottom-md-down\:_5 { + bottom: 50px !important; + } + + .left-md-down\:_5 { + left: 50px !important; + } + + .right-md-down\:_5 { + right: 50px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:_5 { + top: 50px !important; + } + + .bottom-md\:_5 { + bottom: 50px !important; + } + + .left-md\:_5 { + left: 50px !important; + } + + .right-md\:_5 { + right: 50px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:_5 { + top: 50px !important; + } + + .bottom-md-up\:_5 { + bottom: 50px !important; + } + + .left-md-up\:_5 { + left: 50px !important; + } + + .right-md-up\:_5 { + right: 50px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:_5 { + top: 50px !important; + } + + .bottom-lg-down\:_5 { + bottom: 50px !important; + } + + .left-lg-down\:_5 { + left: 50px !important; + } + + .right-lg-down\:_5 { + right: 50px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:_5 { + top: 50px !important; + } + + .bottom-lg\:_5 { + bottom: 50px !important; + } + + .left-lg\:_5 { + left: 50px !important; + } + + .right-lg\:_5 { + right: 50px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:_5 { + top: 50px !important; + } + + .bottom-lg-up\:_5 { + bottom: 50px !important; + } + + .left-lg-up\:_5 { + left: 50px !important; + } + + .right-lg-up\:_5 { + right: 50px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:_5 { + top: 50px !important; + } + + .bottom-xl-down\:_5 { + bottom: 50px !important; + } + + .left-xl-down\:_5 { + left: 50px !important; + } + + .right-xl-down\:_5 { + right: 50px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:_5 { + top: 50px !important; + } + + .bottom-xl\:_5 { + bottom: 50px !important; + } + + .left-xl\:_5 { + left: 50px !important; + } + + .right-xl\:_5 { + right: 50px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:_5 { + top: 50px !important; + } + + .bottom-xl-up\:_5 { + bottom: 50px !important; + } + + .left-xl-up\:_5 { + left: 50px !important; + } + + .right-xl-up\:_5 { + right: 50px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:_5 { + top: 50px !important; + } + + .bottom-xxl\:_5 { + bottom: 50px !important; + } + + .left-xxl\:_5 { + left: 50px !important; + } + + .right-xxl\:_5 { + right: 50px !important; + } +} +.top\:_6 { + top: 60px !important; +} + +.bottom\:_6 { + bottom: 60px !important; +} + +.left\:_6 { + left: 60px !important; +} + +.right\:_6 { + right: 60px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:_6 { + top: 60px !important; + } + + .bottom-xs\:_6 { + bottom: 60px !important; + } + + .left-xs\:_6 { + left: 60px !important; + } + + .right-xs\:_6 { + right: 60px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:_6 { + top: 60px !important; + } + + .bottom-sm-down\:_6 { + bottom: 60px !important; + } + + .left-sm-down\:_6 { + left: 60px !important; + } + + .right-sm-down\:_6 { + right: 60px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:_6 { + top: 60px !important; + } + + .bottom-sm\:_6 { + bottom: 60px !important; + } + + .left-sm\:_6 { + left: 60px !important; + } + + .right-sm\:_6 { + right: 60px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:_6 { + top: 60px !important; + } + + .bottom-sm-up\:_6 { + bottom: 60px !important; + } + + .left-sm-up\:_6 { + left: 60px !important; + } + + .right-sm-up\:_6 { + right: 60px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:_6 { + top: 60px !important; + } + + .bottom-md-down\:_6 { + bottom: 60px !important; + } + + .left-md-down\:_6 { + left: 60px !important; + } + + .right-md-down\:_6 { + right: 60px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:_6 { + top: 60px !important; + } + + .bottom-md\:_6 { + bottom: 60px !important; + } + + .left-md\:_6 { + left: 60px !important; + } + + .right-md\:_6 { + right: 60px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:_6 { + top: 60px !important; + } + + .bottom-md-up\:_6 { + bottom: 60px !important; + } + + .left-md-up\:_6 { + left: 60px !important; + } + + .right-md-up\:_6 { + right: 60px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:_6 { + top: 60px !important; + } + + .bottom-lg-down\:_6 { + bottom: 60px !important; + } + + .left-lg-down\:_6 { + left: 60px !important; + } + + .right-lg-down\:_6 { + right: 60px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:_6 { + top: 60px !important; + } + + .bottom-lg\:_6 { + bottom: 60px !important; + } + + .left-lg\:_6 { + left: 60px !important; + } + + .right-lg\:_6 { + right: 60px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:_6 { + top: 60px !important; + } + + .bottom-lg-up\:_6 { + bottom: 60px !important; + } + + .left-lg-up\:_6 { + left: 60px !important; + } + + .right-lg-up\:_6 { + right: 60px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:_6 { + top: 60px !important; + } + + .bottom-xl-down\:_6 { + bottom: 60px !important; + } + + .left-xl-down\:_6 { + left: 60px !important; + } + + .right-xl-down\:_6 { + right: 60px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:_6 { + top: 60px !important; + } + + .bottom-xl\:_6 { + bottom: 60px !important; + } + + .left-xl\:_6 { + left: 60px !important; + } + + .right-xl\:_6 { + right: 60px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:_6 { + top: 60px !important; + } + + .bottom-xl-up\:_6 { + bottom: 60px !important; + } + + .left-xl-up\:_6 { + left: 60px !important; + } + + .right-xl-up\:_6 { + right: 60px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:_6 { + top: 60px !important; + } + + .bottom-xxl\:_6 { + bottom: 60px !important; + } + + .left-xxl\:_6 { + left: 60px !important; + } + + .right-xxl\:_6 { + right: 60px !important; + } +} +.top\:_7 { + top: 70px !important; +} + +.bottom\:_7 { + bottom: 70px !important; +} + +.left\:_7 { + left: 70px !important; +} + +.right\:_7 { + right: 70px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:_7 { + top: 70px !important; + } + + .bottom-xs\:_7 { + bottom: 70px !important; + } + + .left-xs\:_7 { + left: 70px !important; + } + + .right-xs\:_7 { + right: 70px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:_7 { + top: 70px !important; + } + + .bottom-sm-down\:_7 { + bottom: 70px !important; + } + + .left-sm-down\:_7 { + left: 70px !important; + } + + .right-sm-down\:_7 { + right: 70px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:_7 { + top: 70px !important; + } + + .bottom-sm\:_7 { + bottom: 70px !important; + } + + .left-sm\:_7 { + left: 70px !important; + } + + .right-sm\:_7 { + right: 70px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:_7 { + top: 70px !important; + } + + .bottom-sm-up\:_7 { + bottom: 70px !important; + } + + .left-sm-up\:_7 { + left: 70px !important; + } + + .right-sm-up\:_7 { + right: 70px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:_7 { + top: 70px !important; + } + + .bottom-md-down\:_7 { + bottom: 70px !important; + } + + .left-md-down\:_7 { + left: 70px !important; + } + + .right-md-down\:_7 { + right: 70px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:_7 { + top: 70px !important; + } + + .bottom-md\:_7 { + bottom: 70px !important; + } + + .left-md\:_7 { + left: 70px !important; + } + + .right-md\:_7 { + right: 70px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:_7 { + top: 70px !important; + } + + .bottom-md-up\:_7 { + bottom: 70px !important; + } + + .left-md-up\:_7 { + left: 70px !important; + } + + .right-md-up\:_7 { + right: 70px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:_7 { + top: 70px !important; + } + + .bottom-lg-down\:_7 { + bottom: 70px !important; + } + + .left-lg-down\:_7 { + left: 70px !important; + } + + .right-lg-down\:_7 { + right: 70px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:_7 { + top: 70px !important; + } + + .bottom-lg\:_7 { + bottom: 70px !important; + } + + .left-lg\:_7 { + left: 70px !important; + } + + .right-lg\:_7 { + right: 70px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:_7 { + top: 70px !important; + } + + .bottom-lg-up\:_7 { + bottom: 70px !important; + } + + .left-lg-up\:_7 { + left: 70px !important; + } + + .right-lg-up\:_7 { + right: 70px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:_7 { + top: 70px !important; + } + + .bottom-xl-down\:_7 { + bottom: 70px !important; + } + + .left-xl-down\:_7 { + left: 70px !important; + } + + .right-xl-down\:_7 { + right: 70px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:_7 { + top: 70px !important; + } + + .bottom-xl\:_7 { + bottom: 70px !important; + } + + .left-xl\:_7 { + left: 70px !important; + } + + .right-xl\:_7 { + right: 70px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:_7 { + top: 70px !important; + } + + .bottom-xl-up\:_7 { + bottom: 70px !important; + } + + .left-xl-up\:_7 { + left: 70px !important; + } + + .right-xl-up\:_7 { + right: 70px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:_7 { + top: 70px !important; + } + + .bottom-xxl\:_7 { + bottom: 70px !important; + } + + .left-xxl\:_7 { + left: 70px !important; + } + + .right-xxl\:_7 { + right: 70px !important; + } +} +.top\:_8 { + top: 80px !important; +} + +.bottom\:_8 { + bottom: 80px !important; +} + +.left\:_8 { + left: 80px !important; +} + +.right\:_8 { + right: 80px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:_8 { + top: 80px !important; + } + + .bottom-xs\:_8 { + bottom: 80px !important; + } + + .left-xs\:_8 { + left: 80px !important; + } + + .right-xs\:_8 { + right: 80px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:_8 { + top: 80px !important; + } + + .bottom-sm-down\:_8 { + bottom: 80px !important; + } + + .left-sm-down\:_8 { + left: 80px !important; + } + + .right-sm-down\:_8 { + right: 80px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:_8 { + top: 80px !important; + } + + .bottom-sm\:_8 { + bottom: 80px !important; + } + + .left-sm\:_8 { + left: 80px !important; + } + + .right-sm\:_8 { + right: 80px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:_8 { + top: 80px !important; + } + + .bottom-sm-up\:_8 { + bottom: 80px !important; + } + + .left-sm-up\:_8 { + left: 80px !important; + } + + .right-sm-up\:_8 { + right: 80px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:_8 { + top: 80px !important; + } + + .bottom-md-down\:_8 { + bottom: 80px !important; + } + + .left-md-down\:_8 { + left: 80px !important; + } + + .right-md-down\:_8 { + right: 80px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:_8 { + top: 80px !important; + } + + .bottom-md\:_8 { + bottom: 80px !important; + } + + .left-md\:_8 { + left: 80px !important; + } + + .right-md\:_8 { + right: 80px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:_8 { + top: 80px !important; + } + + .bottom-md-up\:_8 { + bottom: 80px !important; + } + + .left-md-up\:_8 { + left: 80px !important; + } + + .right-md-up\:_8 { + right: 80px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:_8 { + top: 80px !important; + } + + .bottom-lg-down\:_8 { + bottom: 80px !important; + } + + .left-lg-down\:_8 { + left: 80px !important; + } + + .right-lg-down\:_8 { + right: 80px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:_8 { + top: 80px !important; + } + + .bottom-lg\:_8 { + bottom: 80px !important; + } + + .left-lg\:_8 { + left: 80px !important; + } + + .right-lg\:_8 { + right: 80px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:_8 { + top: 80px !important; + } + + .bottom-lg-up\:_8 { + bottom: 80px !important; + } + + .left-lg-up\:_8 { + left: 80px !important; + } + + .right-lg-up\:_8 { + right: 80px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:_8 { + top: 80px !important; + } + + .bottom-xl-down\:_8 { + bottom: 80px !important; + } + + .left-xl-down\:_8 { + left: 80px !important; + } + + .right-xl-down\:_8 { + right: 80px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:_8 { + top: 80px !important; + } + + .bottom-xl\:_8 { + bottom: 80px !important; + } + + .left-xl\:_8 { + left: 80px !important; + } + + .right-xl\:_8 { + right: 80px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:_8 { + top: 80px !important; + } + + .bottom-xl-up\:_8 { + bottom: 80px !important; + } + + .left-xl-up\:_8 { + left: 80px !important; + } + + .right-xl-up\:_8 { + right: 80px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:_8 { + top: 80px !important; + } + + .bottom-xxl\:_8 { + bottom: 80px !important; + } + + .left-xxl\:_8 { + left: 80px !important; + } + + .right-xxl\:_8 { + right: 80px !important; + } +} +.top\:_9 { + top: 90px !important; +} + +.bottom\:_9 { + bottom: 90px !important; +} + +.left\:_9 { + left: 90px !important; +} + +.right\:_9 { + right: 90px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:_9 { + top: 90px !important; + } + + .bottom-xs\:_9 { + bottom: 90px !important; + } + + .left-xs\:_9 { + left: 90px !important; + } + + .right-xs\:_9 { + right: 90px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:_9 { + top: 90px !important; + } + + .bottom-sm-down\:_9 { + bottom: 90px !important; + } + + .left-sm-down\:_9 { + left: 90px !important; + } + + .right-sm-down\:_9 { + right: 90px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:_9 { + top: 90px !important; + } + + .bottom-sm\:_9 { + bottom: 90px !important; + } + + .left-sm\:_9 { + left: 90px !important; + } + + .right-sm\:_9 { + right: 90px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:_9 { + top: 90px !important; + } + + .bottom-sm-up\:_9 { + bottom: 90px !important; + } + + .left-sm-up\:_9 { + left: 90px !important; + } + + .right-sm-up\:_9 { + right: 90px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:_9 { + top: 90px !important; + } + + .bottom-md-down\:_9 { + bottom: 90px !important; + } + + .left-md-down\:_9 { + left: 90px !important; + } + + .right-md-down\:_9 { + right: 90px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:_9 { + top: 90px !important; + } + + .bottom-md\:_9 { + bottom: 90px !important; + } + + .left-md\:_9 { + left: 90px !important; + } + + .right-md\:_9 { + right: 90px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:_9 { + top: 90px !important; + } + + .bottom-md-up\:_9 { + bottom: 90px !important; + } + + .left-md-up\:_9 { + left: 90px !important; + } + + .right-md-up\:_9 { + right: 90px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:_9 { + top: 90px !important; + } + + .bottom-lg-down\:_9 { + bottom: 90px !important; + } + + .left-lg-down\:_9 { + left: 90px !important; + } + + .right-lg-down\:_9 { + right: 90px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:_9 { + top: 90px !important; + } + + .bottom-lg\:_9 { + bottom: 90px !important; + } + + .left-lg\:_9 { + left: 90px !important; + } + + .right-lg\:_9 { + right: 90px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:_9 { + top: 90px !important; + } + + .bottom-lg-up\:_9 { + bottom: 90px !important; + } + + .left-lg-up\:_9 { + left: 90px !important; + } + + .right-lg-up\:_9 { + right: 90px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:_9 { + top: 90px !important; + } + + .bottom-xl-down\:_9 { + bottom: 90px !important; + } + + .left-xl-down\:_9 { + left: 90px !important; + } + + .right-xl-down\:_9 { + right: 90px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:_9 { + top: 90px !important; + } + + .bottom-xl\:_9 { + bottom: 90px !important; + } + + .left-xl\:_9 { + left: 90px !important; + } + + .right-xl\:_9 { + right: 90px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:_9 { + top: 90px !important; + } + + .bottom-xl-up\:_9 { + bottom: 90px !important; + } + + .left-xl-up\:_9 { + left: 90px !important; + } + + .right-xl-up\:_9 { + right: 90px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:_9 { + top: 90px !important; + } + + .bottom-xxl\:_9 { + bottom: 90px !important; + } + + .left-xxl\:_9 { + left: 90px !important; + } + + .right-xxl\:_9 { + right: 90px !important; + } +} +.top\:_10 { + top: 100px !important; +} + +.bottom\:_10 { + bottom: 100px !important; +} + +.left\:_10 { + left: 100px !important; +} + +.right\:_10 { + right: 100px !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:_10 { + top: 100px !important; + } + + .bottom-xs\:_10 { + bottom: 100px !important; + } + + .left-xs\:_10 { + left: 100px !important; + } + + .right-xs\:_10 { + right: 100px !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:_10 { + top: 100px !important; + } + + .bottom-sm-down\:_10 { + bottom: 100px !important; + } + + .left-sm-down\:_10 { + left: 100px !important; + } + + .right-sm-down\:_10 { + right: 100px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:_10 { + top: 100px !important; + } + + .bottom-sm\:_10 { + bottom: 100px !important; + } + + .left-sm\:_10 { + left: 100px !important; + } + + .right-sm\:_10 { + right: 100px !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:_10 { + top: 100px !important; + } + + .bottom-sm-up\:_10 { + bottom: 100px !important; + } + + .left-sm-up\:_10 { + left: 100px !important; + } + + .right-sm-up\:_10 { + right: 100px !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:_10 { + top: 100px !important; + } + + .bottom-md-down\:_10 { + bottom: 100px !important; + } + + .left-md-down\:_10 { + left: 100px !important; + } + + .right-md-down\:_10 { + right: 100px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:_10 { + top: 100px !important; + } + + .bottom-md\:_10 { + bottom: 100px !important; + } + + .left-md\:_10 { + left: 100px !important; + } + + .right-md\:_10 { + right: 100px !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:_10 { + top: 100px !important; + } + + .bottom-md-up\:_10 { + bottom: 100px !important; + } + + .left-md-up\:_10 { + left: 100px !important; + } + + .right-md-up\:_10 { + right: 100px !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:_10 { + top: 100px !important; + } + + .bottom-lg-down\:_10 { + bottom: 100px !important; + } + + .left-lg-down\:_10 { + left: 100px !important; + } + + .right-lg-down\:_10 { + right: 100px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:_10 { + top: 100px !important; + } + + .bottom-lg\:_10 { + bottom: 100px !important; + } + + .left-lg\:_10 { + left: 100px !important; + } + + .right-lg\:_10 { + right: 100px !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:_10 { + top: 100px !important; + } + + .bottom-lg-up\:_10 { + bottom: 100px !important; + } + + .left-lg-up\:_10 { + left: 100px !important; + } + + .right-lg-up\:_10 { + right: 100px !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:_10 { + top: 100px !important; + } + + .bottom-xl-down\:_10 { + bottom: 100px !important; + } + + .left-xl-down\:_10 { + left: 100px !important; + } + + .right-xl-down\:_10 { + right: 100px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:_10 { + top: 100px !important; + } + + .bottom-xl\:_10 { + bottom: 100px !important; + } + + .left-xl\:_10 { + left: 100px !important; + } + + .right-xl\:_10 { + right: 100px !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:_10 { + top: 100px !important; + } + + .bottom-xl-up\:_10 { + bottom: 100px !important; + } + + .left-xl-up\:_10 { + left: 100px !important; + } + + .right-xl-up\:_10 { + right: 100px !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:_10 { + top: 100px !important; + } + + .bottom-xxl\:_10 { + bottom: 100px !important; + } + + .left-xxl\:_10 { + left: 100px !important; + } + + .right-xxl\:_10 { + right: 100px !important; + } +} +.top\:auto { + top: auto !important; +} + +.bottom\:auto { + bottom: auto !important; +} + +.left\:auto { + left: auto !important; +} + +.right\:auto { + right: auto !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:auto { + top: auto !important; + } + + .bottom-xs\:auto { + bottom: auto !important; + } + + .left-xs\:auto { + left: auto !important; + } + + .right-xs\:auto { + right: auto !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:auto { + top: auto !important; + } + + .bottom-sm-down\:auto { + bottom: auto !important; + } + + .left-sm-down\:auto { + left: auto !important; + } + + .right-sm-down\:auto { + right: auto !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:auto { + top: auto !important; + } + + .bottom-sm\:auto { + bottom: auto !important; + } + + .left-sm\:auto { + left: auto !important; + } + + .right-sm\:auto { + right: auto !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:auto { + top: auto !important; + } + + .bottom-sm-up\:auto { + bottom: auto !important; + } + + .left-sm-up\:auto { + left: auto !important; + } + + .right-sm-up\:auto { + right: auto !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:auto { + top: auto !important; + } + + .bottom-md-down\:auto { + bottom: auto !important; + } + + .left-md-down\:auto { + left: auto !important; + } + + .right-md-down\:auto { + right: auto !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:auto { + top: auto !important; + } + + .bottom-md\:auto { + bottom: auto !important; + } + + .left-md\:auto { + left: auto !important; + } + + .right-md\:auto { + right: auto !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:auto { + top: auto !important; + } + + .bottom-md-up\:auto { + bottom: auto !important; + } + + .left-md-up\:auto { + left: auto !important; + } + + .right-md-up\:auto { + right: auto !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:auto { + top: auto !important; + } + + .bottom-lg-down\:auto { + bottom: auto !important; + } + + .left-lg-down\:auto { + left: auto !important; + } + + .right-lg-down\:auto { + right: auto !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:auto { + top: auto !important; + } + + .bottom-lg\:auto { + bottom: auto !important; + } + + .left-lg\:auto { + left: auto !important; + } + + .right-lg\:auto { + right: auto !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:auto { + top: auto !important; + } + + .bottom-lg-up\:auto { + bottom: auto !important; + } + + .left-lg-up\:auto { + left: auto !important; + } + + .right-lg-up\:auto { + right: auto !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:auto { + top: auto !important; + } + + .bottom-xl-down\:auto { + bottom: auto !important; + } + + .left-xl-down\:auto { + left: auto !important; + } + + .right-xl-down\:auto { + right: auto !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:auto { + top: auto !important; + } + + .bottom-xl\:auto { + bottom: auto !important; + } + + .left-xl\:auto { + left: auto !important; + } + + .right-xl\:auto { + right: auto !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:auto { + top: auto !important; + } + + .bottom-xl-up\:auto { + bottom: auto !important; + } + + .left-xl-up\:auto { + left: auto !important; + } + + .right-xl-up\:auto { + right: auto !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:auto { + top: auto !important; + } + + .bottom-xxl\:auto { + bottom: auto !important; + } + + .left-xxl\:auto { + left: auto !important; + } + + .right-xxl\:auto { + right: auto !important; + } +} +.top\:10 { + top: 10% !important; +} + +.bottom\:10 { + bottom: 10% !important; +} + +.left\:10 { + left: 10% !important; +} + +.right\:10 { + right: 10% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:10 { + top: 10% !important; + } + + .bottom-xs\:10 { + bottom: 10% !important; + } + + .left-xs\:10 { + left: 10% !important; + } + + .right-xs\:10 { + right: 10% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:10 { + top: 10% !important; + } + + .bottom-sm-down\:10 { + bottom: 10% !important; + } + + .left-sm-down\:10 { + left: 10% !important; + } + + .right-sm-down\:10 { + right: 10% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:10 { + top: 10% !important; + } + + .bottom-sm\:10 { + bottom: 10% !important; + } + + .left-sm\:10 { + left: 10% !important; + } + + .right-sm\:10 { + right: 10% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:10 { + top: 10% !important; + } + + .bottom-sm-up\:10 { + bottom: 10% !important; + } + + .left-sm-up\:10 { + left: 10% !important; + } + + .right-sm-up\:10 { + right: 10% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:10 { + top: 10% !important; + } + + .bottom-md-down\:10 { + bottom: 10% !important; + } + + .left-md-down\:10 { + left: 10% !important; + } + + .right-md-down\:10 { + right: 10% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:10 { + top: 10% !important; + } + + .bottom-md\:10 { + bottom: 10% !important; + } + + .left-md\:10 { + left: 10% !important; + } + + .right-md\:10 { + right: 10% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:10 { + top: 10% !important; + } + + .bottom-md-up\:10 { + bottom: 10% !important; + } + + .left-md-up\:10 { + left: 10% !important; + } + + .right-md-up\:10 { + right: 10% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:10 { + top: 10% !important; + } + + .bottom-lg-down\:10 { + bottom: 10% !important; + } + + .left-lg-down\:10 { + left: 10% !important; + } + + .right-lg-down\:10 { + right: 10% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:10 { + top: 10% !important; + } + + .bottom-lg\:10 { + bottom: 10% !important; + } + + .left-lg\:10 { + left: 10% !important; + } + + .right-lg\:10 { + right: 10% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:10 { + top: 10% !important; + } + + .bottom-lg-up\:10 { + bottom: 10% !important; + } + + .left-lg-up\:10 { + left: 10% !important; + } + + .right-lg-up\:10 { + right: 10% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:10 { + top: 10% !important; + } + + .bottom-xl-down\:10 { + bottom: 10% !important; + } + + .left-xl-down\:10 { + left: 10% !important; + } + + .right-xl-down\:10 { + right: 10% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:10 { + top: 10% !important; + } + + .bottom-xl\:10 { + bottom: 10% !important; + } + + .left-xl\:10 { + left: 10% !important; + } + + .right-xl\:10 { + right: 10% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:10 { + top: 10% !important; + } + + .bottom-xl-up\:10 { + bottom: 10% !important; + } + + .left-xl-up\:10 { + left: 10% !important; + } + + .right-xl-up\:10 { + right: 10% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:10 { + top: 10% !important; + } + + .bottom-xxl\:10 { + bottom: 10% !important; + } + + .left-xxl\:10 { + left: 10% !important; + } + + .right-xxl\:10 { + right: 10% !important; + } +} +.top\:20 { + top: 20% !important; +} + +.bottom\:20 { + bottom: 20% !important; +} + +.left\:20 { + left: 20% !important; +} + +.right\:20 { + right: 20% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:20 { + top: 20% !important; + } + + .bottom-xs\:20 { + bottom: 20% !important; + } + + .left-xs\:20 { + left: 20% !important; + } + + .right-xs\:20 { + right: 20% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:20 { + top: 20% !important; + } + + .bottom-sm-down\:20 { + bottom: 20% !important; + } + + .left-sm-down\:20 { + left: 20% !important; + } + + .right-sm-down\:20 { + right: 20% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:20 { + top: 20% !important; + } + + .bottom-sm\:20 { + bottom: 20% !important; + } + + .left-sm\:20 { + left: 20% !important; + } + + .right-sm\:20 { + right: 20% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:20 { + top: 20% !important; + } + + .bottom-sm-up\:20 { + bottom: 20% !important; + } + + .left-sm-up\:20 { + left: 20% !important; + } + + .right-sm-up\:20 { + right: 20% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:20 { + top: 20% !important; + } + + .bottom-md-down\:20 { + bottom: 20% !important; + } + + .left-md-down\:20 { + left: 20% !important; + } + + .right-md-down\:20 { + right: 20% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:20 { + top: 20% !important; + } + + .bottom-md\:20 { + bottom: 20% !important; + } + + .left-md\:20 { + left: 20% !important; + } + + .right-md\:20 { + right: 20% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:20 { + top: 20% !important; + } + + .bottom-md-up\:20 { + bottom: 20% !important; + } + + .left-md-up\:20 { + left: 20% !important; + } + + .right-md-up\:20 { + right: 20% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:20 { + top: 20% !important; + } + + .bottom-lg-down\:20 { + bottom: 20% !important; + } + + .left-lg-down\:20 { + left: 20% !important; + } + + .right-lg-down\:20 { + right: 20% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:20 { + top: 20% !important; + } + + .bottom-lg\:20 { + bottom: 20% !important; + } + + .left-lg\:20 { + left: 20% !important; + } + + .right-lg\:20 { + right: 20% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:20 { + top: 20% !important; + } + + .bottom-lg-up\:20 { + bottom: 20% !important; + } + + .left-lg-up\:20 { + left: 20% !important; + } + + .right-lg-up\:20 { + right: 20% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:20 { + top: 20% !important; + } + + .bottom-xl-down\:20 { + bottom: 20% !important; + } + + .left-xl-down\:20 { + left: 20% !important; + } + + .right-xl-down\:20 { + right: 20% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:20 { + top: 20% !important; + } + + .bottom-xl\:20 { + bottom: 20% !important; + } + + .left-xl\:20 { + left: 20% !important; + } + + .right-xl\:20 { + right: 20% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:20 { + top: 20% !important; + } + + .bottom-xl-up\:20 { + bottom: 20% !important; + } + + .left-xl-up\:20 { + left: 20% !important; + } + + .right-xl-up\:20 { + right: 20% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:20 { + top: 20% !important; + } + + .bottom-xxl\:20 { + bottom: 20% !important; + } + + .left-xxl\:20 { + left: 20% !important; + } + + .right-xxl\:20 { + right: 20% !important; + } +} +.top\:25 { + top: 25% !important; +} + +.bottom\:25 { + bottom: 25% !important; +} + +.left\:25 { + left: 25% !important; +} + +.right\:25 { + right: 25% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:25 { + top: 25% !important; + } + + .bottom-xs\:25 { + bottom: 25% !important; + } + + .left-xs\:25 { + left: 25% !important; + } + + .right-xs\:25 { + right: 25% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:25 { + top: 25% !important; + } + + .bottom-sm-down\:25 { + bottom: 25% !important; + } + + .left-sm-down\:25 { + left: 25% !important; + } + + .right-sm-down\:25 { + right: 25% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:25 { + top: 25% !important; + } + + .bottom-sm\:25 { + bottom: 25% !important; + } + + .left-sm\:25 { + left: 25% !important; + } + + .right-sm\:25 { + right: 25% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:25 { + top: 25% !important; + } + + .bottom-sm-up\:25 { + bottom: 25% !important; + } + + .left-sm-up\:25 { + left: 25% !important; + } + + .right-sm-up\:25 { + right: 25% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:25 { + top: 25% !important; + } + + .bottom-md-down\:25 { + bottom: 25% !important; + } + + .left-md-down\:25 { + left: 25% !important; + } + + .right-md-down\:25 { + right: 25% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:25 { + top: 25% !important; + } + + .bottom-md\:25 { + bottom: 25% !important; + } + + .left-md\:25 { + left: 25% !important; + } + + .right-md\:25 { + right: 25% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:25 { + top: 25% !important; + } + + .bottom-md-up\:25 { + bottom: 25% !important; + } + + .left-md-up\:25 { + left: 25% !important; + } + + .right-md-up\:25 { + right: 25% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:25 { + top: 25% !important; + } + + .bottom-lg-down\:25 { + bottom: 25% !important; + } + + .left-lg-down\:25 { + left: 25% !important; + } + + .right-lg-down\:25 { + right: 25% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:25 { + top: 25% !important; + } + + .bottom-lg\:25 { + bottom: 25% !important; + } + + .left-lg\:25 { + left: 25% !important; + } + + .right-lg\:25 { + right: 25% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:25 { + top: 25% !important; + } + + .bottom-lg-up\:25 { + bottom: 25% !important; + } + + .left-lg-up\:25 { + left: 25% !important; + } + + .right-lg-up\:25 { + right: 25% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:25 { + top: 25% !important; + } + + .bottom-xl-down\:25 { + bottom: 25% !important; + } + + .left-xl-down\:25 { + left: 25% !important; + } + + .right-xl-down\:25 { + right: 25% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:25 { + top: 25% !important; + } + + .bottom-xl\:25 { + bottom: 25% !important; + } + + .left-xl\:25 { + left: 25% !important; + } + + .right-xl\:25 { + right: 25% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:25 { + top: 25% !important; + } + + .bottom-xl-up\:25 { + bottom: 25% !important; + } + + .left-xl-up\:25 { + left: 25% !important; + } + + .right-xl-up\:25 { + right: 25% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:25 { + top: 25% !important; + } + + .bottom-xxl\:25 { + bottom: 25% !important; + } + + .left-xxl\:25 { + left: 25% !important; + } + + .right-xxl\:25 { + right: 25% !important; + } +} +.top\:30 { + top: 30% !important; +} + +.bottom\:30 { + bottom: 30% !important; +} + +.left\:30 { + left: 30% !important; +} + +.right\:30 { + right: 30% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:30 { + top: 30% !important; + } + + .bottom-xs\:30 { + bottom: 30% !important; + } + + .left-xs\:30 { + left: 30% !important; + } + + .right-xs\:30 { + right: 30% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:30 { + top: 30% !important; + } + + .bottom-sm-down\:30 { + bottom: 30% !important; + } + + .left-sm-down\:30 { + left: 30% !important; + } + + .right-sm-down\:30 { + right: 30% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:30 { + top: 30% !important; + } + + .bottom-sm\:30 { + bottom: 30% !important; + } + + .left-sm\:30 { + left: 30% !important; + } + + .right-sm\:30 { + right: 30% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:30 { + top: 30% !important; + } + + .bottom-sm-up\:30 { + bottom: 30% !important; + } + + .left-sm-up\:30 { + left: 30% !important; + } + + .right-sm-up\:30 { + right: 30% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:30 { + top: 30% !important; + } + + .bottom-md-down\:30 { + bottom: 30% !important; + } + + .left-md-down\:30 { + left: 30% !important; + } + + .right-md-down\:30 { + right: 30% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:30 { + top: 30% !important; + } + + .bottom-md\:30 { + bottom: 30% !important; + } + + .left-md\:30 { + left: 30% !important; + } + + .right-md\:30 { + right: 30% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:30 { + top: 30% !important; + } + + .bottom-md-up\:30 { + bottom: 30% !important; + } + + .left-md-up\:30 { + left: 30% !important; + } + + .right-md-up\:30 { + right: 30% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:30 { + top: 30% !important; + } + + .bottom-lg-down\:30 { + bottom: 30% !important; + } + + .left-lg-down\:30 { + left: 30% !important; + } + + .right-lg-down\:30 { + right: 30% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:30 { + top: 30% !important; + } + + .bottom-lg\:30 { + bottom: 30% !important; + } + + .left-lg\:30 { + left: 30% !important; + } + + .right-lg\:30 { + right: 30% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:30 { + top: 30% !important; + } + + .bottom-lg-up\:30 { + bottom: 30% !important; + } + + .left-lg-up\:30 { + left: 30% !important; + } + + .right-lg-up\:30 { + right: 30% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:30 { + top: 30% !important; + } + + .bottom-xl-down\:30 { + bottom: 30% !important; + } + + .left-xl-down\:30 { + left: 30% !important; + } + + .right-xl-down\:30 { + right: 30% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:30 { + top: 30% !important; + } + + .bottom-xl\:30 { + bottom: 30% !important; + } + + .left-xl\:30 { + left: 30% !important; + } + + .right-xl\:30 { + right: 30% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:30 { + top: 30% !important; + } + + .bottom-xl-up\:30 { + bottom: 30% !important; + } + + .left-xl-up\:30 { + left: 30% !important; + } + + .right-xl-up\:30 { + right: 30% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:30 { + top: 30% !important; + } + + .bottom-xxl\:30 { + bottom: 30% !important; + } + + .left-xxl\:30 { + left: 30% !important; + } + + .right-xxl\:30 { + right: 30% !important; + } +} +.top\:33 { + top: 33.33% !important; +} + +.bottom\:33 { + bottom: 33.33% !important; +} + +.left\:33 { + left: 33.33% !important; +} + +.right\:33 { + right: 33.33% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:33 { + top: 33.33% !important; + } + + .bottom-xs\:33 { + bottom: 33.33% !important; + } + + .left-xs\:33 { + left: 33.33% !important; + } + + .right-xs\:33 { + right: 33.33% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:33 { + top: 33.33% !important; + } + + .bottom-sm-down\:33 { + bottom: 33.33% !important; + } + + .left-sm-down\:33 { + left: 33.33% !important; + } + + .right-sm-down\:33 { + right: 33.33% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:33 { + top: 33.33% !important; + } + + .bottom-sm\:33 { + bottom: 33.33% !important; + } + + .left-sm\:33 { + left: 33.33% !important; + } + + .right-sm\:33 { + right: 33.33% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:33 { + top: 33.33% !important; + } + + .bottom-sm-up\:33 { + bottom: 33.33% !important; + } + + .left-sm-up\:33 { + left: 33.33% !important; + } + + .right-sm-up\:33 { + right: 33.33% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:33 { + top: 33.33% !important; + } + + .bottom-md-down\:33 { + bottom: 33.33% !important; + } + + .left-md-down\:33 { + left: 33.33% !important; + } + + .right-md-down\:33 { + right: 33.33% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:33 { + top: 33.33% !important; + } + + .bottom-md\:33 { + bottom: 33.33% !important; + } + + .left-md\:33 { + left: 33.33% !important; + } + + .right-md\:33 { + right: 33.33% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:33 { + top: 33.33% !important; + } + + .bottom-md-up\:33 { + bottom: 33.33% !important; + } + + .left-md-up\:33 { + left: 33.33% !important; + } + + .right-md-up\:33 { + right: 33.33% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:33 { + top: 33.33% !important; + } + + .bottom-lg-down\:33 { + bottom: 33.33% !important; + } + + .left-lg-down\:33 { + left: 33.33% !important; + } + + .right-lg-down\:33 { + right: 33.33% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:33 { + top: 33.33% !important; + } + + .bottom-lg\:33 { + bottom: 33.33% !important; + } + + .left-lg\:33 { + left: 33.33% !important; + } + + .right-lg\:33 { + right: 33.33% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:33 { + top: 33.33% !important; + } + + .bottom-lg-up\:33 { + bottom: 33.33% !important; + } + + .left-lg-up\:33 { + left: 33.33% !important; + } + + .right-lg-up\:33 { + right: 33.33% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:33 { + top: 33.33% !important; + } + + .bottom-xl-down\:33 { + bottom: 33.33% !important; + } + + .left-xl-down\:33 { + left: 33.33% !important; + } + + .right-xl-down\:33 { + right: 33.33% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:33 { + top: 33.33% !important; + } + + .bottom-xl\:33 { + bottom: 33.33% !important; + } + + .left-xl\:33 { + left: 33.33% !important; + } + + .right-xl\:33 { + right: 33.33% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:33 { + top: 33.33% !important; + } + + .bottom-xl-up\:33 { + bottom: 33.33% !important; + } + + .left-xl-up\:33 { + left: 33.33% !important; + } + + .right-xl-up\:33 { + right: 33.33% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:33 { + top: 33.33% !important; + } + + .bottom-xxl\:33 { + bottom: 33.33% !important; + } + + .left-xxl\:33 { + left: 33.33% !important; + } + + .right-xxl\:33 { + right: 33.33% !important; + } +} +.top\:40 { + top: 40% !important; +} + +.bottom\:40 { + bottom: 40% !important; +} + +.left\:40 { + left: 40% !important; +} + +.right\:40 { + right: 40% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:40 { + top: 40% !important; + } + + .bottom-xs\:40 { + bottom: 40% !important; + } + + .left-xs\:40 { + left: 40% !important; + } + + .right-xs\:40 { + right: 40% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:40 { + top: 40% !important; + } + + .bottom-sm-down\:40 { + bottom: 40% !important; + } + + .left-sm-down\:40 { + left: 40% !important; + } + + .right-sm-down\:40 { + right: 40% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:40 { + top: 40% !important; + } + + .bottom-sm\:40 { + bottom: 40% !important; + } + + .left-sm\:40 { + left: 40% !important; + } + + .right-sm\:40 { + right: 40% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:40 { + top: 40% !important; + } + + .bottom-sm-up\:40 { + bottom: 40% !important; + } + + .left-sm-up\:40 { + left: 40% !important; + } + + .right-sm-up\:40 { + right: 40% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:40 { + top: 40% !important; + } + + .bottom-md-down\:40 { + bottom: 40% !important; + } + + .left-md-down\:40 { + left: 40% !important; + } + + .right-md-down\:40 { + right: 40% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:40 { + top: 40% !important; + } + + .bottom-md\:40 { + bottom: 40% !important; + } + + .left-md\:40 { + left: 40% !important; + } + + .right-md\:40 { + right: 40% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:40 { + top: 40% !important; + } + + .bottom-md-up\:40 { + bottom: 40% !important; + } + + .left-md-up\:40 { + left: 40% !important; + } + + .right-md-up\:40 { + right: 40% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:40 { + top: 40% !important; + } + + .bottom-lg-down\:40 { + bottom: 40% !important; + } + + .left-lg-down\:40 { + left: 40% !important; + } + + .right-lg-down\:40 { + right: 40% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:40 { + top: 40% !important; + } + + .bottom-lg\:40 { + bottom: 40% !important; + } + + .left-lg\:40 { + left: 40% !important; + } + + .right-lg\:40 { + right: 40% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:40 { + top: 40% !important; + } + + .bottom-lg-up\:40 { + bottom: 40% !important; + } + + .left-lg-up\:40 { + left: 40% !important; + } + + .right-lg-up\:40 { + right: 40% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:40 { + top: 40% !important; + } + + .bottom-xl-down\:40 { + bottom: 40% !important; + } + + .left-xl-down\:40 { + left: 40% !important; + } + + .right-xl-down\:40 { + right: 40% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:40 { + top: 40% !important; + } + + .bottom-xl\:40 { + bottom: 40% !important; + } + + .left-xl\:40 { + left: 40% !important; + } + + .right-xl\:40 { + right: 40% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:40 { + top: 40% !important; + } + + .bottom-xl-up\:40 { + bottom: 40% !important; + } + + .left-xl-up\:40 { + left: 40% !important; + } + + .right-xl-up\:40 { + right: 40% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:40 { + top: 40% !important; + } + + .bottom-xxl\:40 { + bottom: 40% !important; + } + + .left-xxl\:40 { + left: 40% !important; + } + + .right-xxl\:40 { + right: 40% !important; + } +} +.top\:45 { + top: 45% !important; +} + +.bottom\:45 { + bottom: 45% !important; +} + +.left\:45 { + left: 45% !important; +} + +.right\:45 { + right: 45% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:45 { + top: 45% !important; + } + + .bottom-xs\:45 { + bottom: 45% !important; + } + + .left-xs\:45 { + left: 45% !important; + } + + .right-xs\:45 { + right: 45% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:45 { + top: 45% !important; + } + + .bottom-sm-down\:45 { + bottom: 45% !important; + } + + .left-sm-down\:45 { + left: 45% !important; + } + + .right-sm-down\:45 { + right: 45% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:45 { + top: 45% !important; + } + + .bottom-sm\:45 { + bottom: 45% !important; + } + + .left-sm\:45 { + left: 45% !important; + } + + .right-sm\:45 { + right: 45% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:45 { + top: 45% !important; + } + + .bottom-sm-up\:45 { + bottom: 45% !important; + } + + .left-sm-up\:45 { + left: 45% !important; + } + + .right-sm-up\:45 { + right: 45% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:45 { + top: 45% !important; + } + + .bottom-md-down\:45 { + bottom: 45% !important; + } + + .left-md-down\:45 { + left: 45% !important; + } + + .right-md-down\:45 { + right: 45% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:45 { + top: 45% !important; + } + + .bottom-md\:45 { + bottom: 45% !important; + } + + .left-md\:45 { + left: 45% !important; + } + + .right-md\:45 { + right: 45% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:45 { + top: 45% !important; + } + + .bottom-md-up\:45 { + bottom: 45% !important; + } + + .left-md-up\:45 { + left: 45% !important; + } + + .right-md-up\:45 { + right: 45% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:45 { + top: 45% !important; + } + + .bottom-lg-down\:45 { + bottom: 45% !important; + } + + .left-lg-down\:45 { + left: 45% !important; + } + + .right-lg-down\:45 { + right: 45% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:45 { + top: 45% !important; + } + + .bottom-lg\:45 { + bottom: 45% !important; + } + + .left-lg\:45 { + left: 45% !important; + } + + .right-lg\:45 { + right: 45% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:45 { + top: 45% !important; + } + + .bottom-lg-up\:45 { + bottom: 45% !important; + } + + .left-lg-up\:45 { + left: 45% !important; + } + + .right-lg-up\:45 { + right: 45% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:45 { + top: 45% !important; + } + + .bottom-xl-down\:45 { + bottom: 45% !important; + } + + .left-xl-down\:45 { + left: 45% !important; + } + + .right-xl-down\:45 { + right: 45% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:45 { + top: 45% !important; + } + + .bottom-xl\:45 { + bottom: 45% !important; + } + + .left-xl\:45 { + left: 45% !important; + } + + .right-xl\:45 { + right: 45% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:45 { + top: 45% !important; + } + + .bottom-xl-up\:45 { + bottom: 45% !important; + } + + .left-xl-up\:45 { + left: 45% !important; + } + + .right-xl-up\:45 { + right: 45% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:45 { + top: 45% !important; + } + + .bottom-xxl\:45 { + bottom: 45% !important; + } + + .left-xxl\:45 { + left: 45% !important; + } + + .right-xxl\:45 { + right: 45% !important; + } +} +.top\:50 { + top: 50% !important; +} + +.bottom\:50 { + bottom: 50% !important; +} + +.left\:50 { + left: 50% !important; +} + +.right\:50 { + right: 50% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:50 { + top: 50% !important; + } + + .bottom-xs\:50 { + bottom: 50% !important; + } + + .left-xs\:50 { + left: 50% !important; + } + + .right-xs\:50 { + right: 50% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:50 { + top: 50% !important; + } + + .bottom-sm-down\:50 { + bottom: 50% !important; + } + + .left-sm-down\:50 { + left: 50% !important; + } + + .right-sm-down\:50 { + right: 50% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:50 { + top: 50% !important; + } + + .bottom-sm\:50 { + bottom: 50% !important; + } + + .left-sm\:50 { + left: 50% !important; + } + + .right-sm\:50 { + right: 50% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:50 { + top: 50% !important; + } + + .bottom-sm-up\:50 { + bottom: 50% !important; + } + + .left-sm-up\:50 { + left: 50% !important; + } + + .right-sm-up\:50 { + right: 50% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:50 { + top: 50% !important; + } + + .bottom-md-down\:50 { + bottom: 50% !important; + } + + .left-md-down\:50 { + left: 50% !important; + } + + .right-md-down\:50 { + right: 50% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:50 { + top: 50% !important; + } + + .bottom-md\:50 { + bottom: 50% !important; + } + + .left-md\:50 { + left: 50% !important; + } + + .right-md\:50 { + right: 50% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:50 { + top: 50% !important; + } + + .bottom-md-up\:50 { + bottom: 50% !important; + } + + .left-md-up\:50 { + left: 50% !important; + } + + .right-md-up\:50 { + right: 50% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:50 { + top: 50% !important; + } + + .bottom-lg-down\:50 { + bottom: 50% !important; + } + + .left-lg-down\:50 { + left: 50% !important; + } + + .right-lg-down\:50 { + right: 50% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:50 { + top: 50% !important; + } + + .bottom-lg\:50 { + bottom: 50% !important; + } + + .left-lg\:50 { + left: 50% !important; + } + + .right-lg\:50 { + right: 50% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:50 { + top: 50% !important; + } + + .bottom-lg-up\:50 { + bottom: 50% !important; + } + + .left-lg-up\:50 { + left: 50% !important; + } + + .right-lg-up\:50 { + right: 50% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:50 { + top: 50% !important; + } + + .bottom-xl-down\:50 { + bottom: 50% !important; + } + + .left-xl-down\:50 { + left: 50% !important; + } + + .right-xl-down\:50 { + right: 50% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:50 { + top: 50% !important; + } + + .bottom-xl\:50 { + bottom: 50% !important; + } + + .left-xl\:50 { + left: 50% !important; + } + + .right-xl\:50 { + right: 50% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:50 { + top: 50% !important; + } + + .bottom-xl-up\:50 { + bottom: 50% !important; + } + + .left-xl-up\:50 { + left: 50% !important; + } + + .right-xl-up\:50 { + right: 50% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:50 { + top: 50% !important; + } + + .bottom-xxl\:50 { + bottom: 50% !important; + } + + .left-xxl\:50 { + left: 50% !important; + } + + .right-xxl\:50 { + right: 50% !important; + } +} +.top\:60 { + top: 60% !important; +} + +.bottom\:60 { + bottom: 60% !important; +} + +.left\:60 { + left: 60% !important; +} + +.right\:60 { + right: 60% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:60 { + top: 60% !important; + } + + .bottom-xs\:60 { + bottom: 60% !important; + } + + .left-xs\:60 { + left: 60% !important; + } + + .right-xs\:60 { + right: 60% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:60 { + top: 60% !important; + } + + .bottom-sm-down\:60 { + bottom: 60% !important; + } + + .left-sm-down\:60 { + left: 60% !important; + } + + .right-sm-down\:60 { + right: 60% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:60 { + top: 60% !important; + } + + .bottom-sm\:60 { + bottom: 60% !important; + } + + .left-sm\:60 { + left: 60% !important; + } + + .right-sm\:60 { + right: 60% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:60 { + top: 60% !important; + } + + .bottom-sm-up\:60 { + bottom: 60% !important; + } + + .left-sm-up\:60 { + left: 60% !important; + } + + .right-sm-up\:60 { + right: 60% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:60 { + top: 60% !important; + } + + .bottom-md-down\:60 { + bottom: 60% !important; + } + + .left-md-down\:60 { + left: 60% !important; + } + + .right-md-down\:60 { + right: 60% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:60 { + top: 60% !important; + } + + .bottom-md\:60 { + bottom: 60% !important; + } + + .left-md\:60 { + left: 60% !important; + } + + .right-md\:60 { + right: 60% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:60 { + top: 60% !important; + } + + .bottom-md-up\:60 { + bottom: 60% !important; + } + + .left-md-up\:60 { + left: 60% !important; + } + + .right-md-up\:60 { + right: 60% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:60 { + top: 60% !important; + } + + .bottom-lg-down\:60 { + bottom: 60% !important; + } + + .left-lg-down\:60 { + left: 60% !important; + } + + .right-lg-down\:60 { + right: 60% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:60 { + top: 60% !important; + } + + .bottom-lg\:60 { + bottom: 60% !important; + } + + .left-lg\:60 { + left: 60% !important; + } + + .right-lg\:60 { + right: 60% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:60 { + top: 60% !important; + } + + .bottom-lg-up\:60 { + bottom: 60% !important; + } + + .left-lg-up\:60 { + left: 60% !important; + } + + .right-lg-up\:60 { + right: 60% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:60 { + top: 60% !important; + } + + .bottom-xl-down\:60 { + bottom: 60% !important; + } + + .left-xl-down\:60 { + left: 60% !important; + } + + .right-xl-down\:60 { + right: 60% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:60 { + top: 60% !important; + } + + .bottom-xl\:60 { + bottom: 60% !important; + } + + .left-xl\:60 { + left: 60% !important; + } + + .right-xl\:60 { + right: 60% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:60 { + top: 60% !important; + } + + .bottom-xl-up\:60 { + bottom: 60% !important; + } + + .left-xl-up\:60 { + left: 60% !important; + } + + .right-xl-up\:60 { + right: 60% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:60 { + top: 60% !important; + } + + .bottom-xxl\:60 { + bottom: 60% !important; + } + + .left-xxl\:60 { + left: 60% !important; + } + + .right-xxl\:60 { + right: 60% !important; + } +} +.top\:66 { + top: 66.66% !important; +} + +.bottom\:66 { + bottom: 66.66% !important; +} + +.left\:66 { + left: 66.66% !important; +} + +.right\:66 { + right: 66.66% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:66 { + top: 66.66% !important; + } + + .bottom-xs\:66 { + bottom: 66.66% !important; + } + + .left-xs\:66 { + left: 66.66% !important; + } + + .right-xs\:66 { + right: 66.66% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:66 { + top: 66.66% !important; + } + + .bottom-sm-down\:66 { + bottom: 66.66% !important; + } + + .left-sm-down\:66 { + left: 66.66% !important; + } + + .right-sm-down\:66 { + right: 66.66% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:66 { + top: 66.66% !important; + } + + .bottom-sm\:66 { + bottom: 66.66% !important; + } + + .left-sm\:66 { + left: 66.66% !important; + } + + .right-sm\:66 { + right: 66.66% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:66 { + top: 66.66% !important; + } + + .bottom-sm-up\:66 { + bottom: 66.66% !important; + } + + .left-sm-up\:66 { + left: 66.66% !important; + } + + .right-sm-up\:66 { + right: 66.66% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:66 { + top: 66.66% !important; + } + + .bottom-md-down\:66 { + bottom: 66.66% !important; + } + + .left-md-down\:66 { + left: 66.66% !important; + } + + .right-md-down\:66 { + right: 66.66% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:66 { + top: 66.66% !important; + } + + .bottom-md\:66 { + bottom: 66.66% !important; + } + + .left-md\:66 { + left: 66.66% !important; + } + + .right-md\:66 { + right: 66.66% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:66 { + top: 66.66% !important; + } + + .bottom-md-up\:66 { + bottom: 66.66% !important; + } + + .left-md-up\:66 { + left: 66.66% !important; + } + + .right-md-up\:66 { + right: 66.66% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:66 { + top: 66.66% !important; + } + + .bottom-lg-down\:66 { + bottom: 66.66% !important; + } + + .left-lg-down\:66 { + left: 66.66% !important; + } + + .right-lg-down\:66 { + right: 66.66% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:66 { + top: 66.66% !important; + } + + .bottom-lg\:66 { + bottom: 66.66% !important; + } + + .left-lg\:66 { + left: 66.66% !important; + } + + .right-lg\:66 { + right: 66.66% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:66 { + top: 66.66% !important; + } + + .bottom-lg-up\:66 { + bottom: 66.66% !important; + } + + .left-lg-up\:66 { + left: 66.66% !important; + } + + .right-lg-up\:66 { + right: 66.66% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:66 { + top: 66.66% !important; + } + + .bottom-xl-down\:66 { + bottom: 66.66% !important; + } + + .left-xl-down\:66 { + left: 66.66% !important; + } + + .right-xl-down\:66 { + right: 66.66% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:66 { + top: 66.66% !important; + } + + .bottom-xl\:66 { + bottom: 66.66% !important; + } + + .left-xl\:66 { + left: 66.66% !important; + } + + .right-xl\:66 { + right: 66.66% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:66 { + top: 66.66% !important; + } + + .bottom-xl-up\:66 { + bottom: 66.66% !important; + } + + .left-xl-up\:66 { + left: 66.66% !important; + } + + .right-xl-up\:66 { + right: 66.66% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:66 { + top: 66.66% !important; + } + + .bottom-xxl\:66 { + bottom: 66.66% !important; + } + + .left-xxl\:66 { + left: 66.66% !important; + } + + .right-xxl\:66 { + right: 66.66% !important; + } +} +.top\:70 { + top: 70% !important; +} + +.bottom\:70 { + bottom: 70% !important; +} + +.left\:70 { + left: 70% !important; +} + +.right\:70 { + right: 70% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:70 { + top: 70% !important; + } + + .bottom-xs\:70 { + bottom: 70% !important; + } + + .left-xs\:70 { + left: 70% !important; + } + + .right-xs\:70 { + right: 70% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:70 { + top: 70% !important; + } + + .bottom-sm-down\:70 { + bottom: 70% !important; + } + + .left-sm-down\:70 { + left: 70% !important; + } + + .right-sm-down\:70 { + right: 70% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:70 { + top: 70% !important; + } + + .bottom-sm\:70 { + bottom: 70% !important; + } + + .left-sm\:70 { + left: 70% !important; + } + + .right-sm\:70 { + right: 70% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:70 { + top: 70% !important; + } + + .bottom-sm-up\:70 { + bottom: 70% !important; + } + + .left-sm-up\:70 { + left: 70% !important; + } + + .right-sm-up\:70 { + right: 70% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:70 { + top: 70% !important; + } + + .bottom-md-down\:70 { + bottom: 70% !important; + } + + .left-md-down\:70 { + left: 70% !important; + } + + .right-md-down\:70 { + right: 70% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:70 { + top: 70% !important; + } + + .bottom-md\:70 { + bottom: 70% !important; + } + + .left-md\:70 { + left: 70% !important; + } + + .right-md\:70 { + right: 70% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:70 { + top: 70% !important; + } + + .bottom-md-up\:70 { + bottom: 70% !important; + } + + .left-md-up\:70 { + left: 70% !important; + } + + .right-md-up\:70 { + right: 70% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:70 { + top: 70% !important; + } + + .bottom-lg-down\:70 { + bottom: 70% !important; + } + + .left-lg-down\:70 { + left: 70% !important; + } + + .right-lg-down\:70 { + right: 70% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:70 { + top: 70% !important; + } + + .bottom-lg\:70 { + bottom: 70% !important; + } + + .left-lg\:70 { + left: 70% !important; + } + + .right-lg\:70 { + right: 70% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:70 { + top: 70% !important; + } + + .bottom-lg-up\:70 { + bottom: 70% !important; + } + + .left-lg-up\:70 { + left: 70% !important; + } + + .right-lg-up\:70 { + right: 70% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:70 { + top: 70% !important; + } + + .bottom-xl-down\:70 { + bottom: 70% !important; + } + + .left-xl-down\:70 { + left: 70% !important; + } + + .right-xl-down\:70 { + right: 70% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:70 { + top: 70% !important; + } + + .bottom-xl\:70 { + bottom: 70% !important; + } + + .left-xl\:70 { + left: 70% !important; + } + + .right-xl\:70 { + right: 70% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:70 { + top: 70% !important; + } + + .bottom-xl-up\:70 { + bottom: 70% !important; + } + + .left-xl-up\:70 { + left: 70% !important; + } + + .right-xl-up\:70 { + right: 70% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:70 { + top: 70% !important; + } + + .bottom-xxl\:70 { + bottom: 70% !important; + } + + .left-xxl\:70 { + left: 70% !important; + } + + .right-xxl\:70 { + right: 70% !important; + } +} +.top\:75 { + top: 75% !important; +} + +.bottom\:75 { + bottom: 75% !important; +} + +.left\:75 { + left: 75% !important; +} + +.right\:75 { + right: 75% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:75 { + top: 75% !important; + } + + .bottom-xs\:75 { + bottom: 75% !important; + } + + .left-xs\:75 { + left: 75% !important; + } + + .right-xs\:75 { + right: 75% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:75 { + top: 75% !important; + } + + .bottom-sm-down\:75 { + bottom: 75% !important; + } + + .left-sm-down\:75 { + left: 75% !important; + } + + .right-sm-down\:75 { + right: 75% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:75 { + top: 75% !important; + } + + .bottom-sm\:75 { + bottom: 75% !important; + } + + .left-sm\:75 { + left: 75% !important; + } + + .right-sm\:75 { + right: 75% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:75 { + top: 75% !important; + } + + .bottom-sm-up\:75 { + bottom: 75% !important; + } + + .left-sm-up\:75 { + left: 75% !important; + } + + .right-sm-up\:75 { + right: 75% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:75 { + top: 75% !important; + } + + .bottom-md-down\:75 { + bottom: 75% !important; + } + + .left-md-down\:75 { + left: 75% !important; + } + + .right-md-down\:75 { + right: 75% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:75 { + top: 75% !important; + } + + .bottom-md\:75 { + bottom: 75% !important; + } + + .left-md\:75 { + left: 75% !important; + } + + .right-md\:75 { + right: 75% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:75 { + top: 75% !important; + } + + .bottom-md-up\:75 { + bottom: 75% !important; + } + + .left-md-up\:75 { + left: 75% !important; + } + + .right-md-up\:75 { + right: 75% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:75 { + top: 75% !important; + } + + .bottom-lg-down\:75 { + bottom: 75% !important; + } + + .left-lg-down\:75 { + left: 75% !important; + } + + .right-lg-down\:75 { + right: 75% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:75 { + top: 75% !important; + } + + .bottom-lg\:75 { + bottom: 75% !important; + } + + .left-lg\:75 { + left: 75% !important; + } + + .right-lg\:75 { + right: 75% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:75 { + top: 75% !important; + } + + .bottom-lg-up\:75 { + bottom: 75% !important; + } + + .left-lg-up\:75 { + left: 75% !important; + } + + .right-lg-up\:75 { + right: 75% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:75 { + top: 75% !important; + } + + .bottom-xl-down\:75 { + bottom: 75% !important; + } + + .left-xl-down\:75 { + left: 75% !important; + } + + .right-xl-down\:75 { + right: 75% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:75 { + top: 75% !important; + } + + .bottom-xl\:75 { + bottom: 75% !important; + } + + .left-xl\:75 { + left: 75% !important; + } + + .right-xl\:75 { + right: 75% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:75 { + top: 75% !important; + } + + .bottom-xl-up\:75 { + bottom: 75% !important; + } + + .left-xl-up\:75 { + left: 75% !important; + } + + .right-xl-up\:75 { + right: 75% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:75 { + top: 75% !important; + } + + .bottom-xxl\:75 { + bottom: 75% !important; + } + + .left-xxl\:75 { + left: 75% !important; + } + + .right-xxl\:75 { + right: 75% !important; + } +} +.top\:80 { + top: 80% !important; +} + +.bottom\:80 { + bottom: 80% !important; +} + +.left\:80 { + left: 80% !important; +} + +.right\:80 { + right: 80% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:80 { + top: 80% !important; + } + + .bottom-xs\:80 { + bottom: 80% !important; + } + + .left-xs\:80 { + left: 80% !important; + } + + .right-xs\:80 { + right: 80% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:80 { + top: 80% !important; + } + + .bottom-sm-down\:80 { + bottom: 80% !important; + } + + .left-sm-down\:80 { + left: 80% !important; + } + + .right-sm-down\:80 { + right: 80% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:80 { + top: 80% !important; + } + + .bottom-sm\:80 { + bottom: 80% !important; + } + + .left-sm\:80 { + left: 80% !important; + } + + .right-sm\:80 { + right: 80% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:80 { + top: 80% !important; + } + + .bottom-sm-up\:80 { + bottom: 80% !important; + } + + .left-sm-up\:80 { + left: 80% !important; + } + + .right-sm-up\:80 { + right: 80% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:80 { + top: 80% !important; + } + + .bottom-md-down\:80 { + bottom: 80% !important; + } + + .left-md-down\:80 { + left: 80% !important; + } + + .right-md-down\:80 { + right: 80% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:80 { + top: 80% !important; + } + + .bottom-md\:80 { + bottom: 80% !important; + } + + .left-md\:80 { + left: 80% !important; + } + + .right-md\:80 { + right: 80% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:80 { + top: 80% !important; + } + + .bottom-md-up\:80 { + bottom: 80% !important; + } + + .left-md-up\:80 { + left: 80% !important; + } + + .right-md-up\:80 { + right: 80% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:80 { + top: 80% !important; + } + + .bottom-lg-down\:80 { + bottom: 80% !important; + } + + .left-lg-down\:80 { + left: 80% !important; + } + + .right-lg-down\:80 { + right: 80% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:80 { + top: 80% !important; + } + + .bottom-lg\:80 { + bottom: 80% !important; + } + + .left-lg\:80 { + left: 80% !important; + } + + .right-lg\:80 { + right: 80% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:80 { + top: 80% !important; + } + + .bottom-lg-up\:80 { + bottom: 80% !important; + } + + .left-lg-up\:80 { + left: 80% !important; + } + + .right-lg-up\:80 { + right: 80% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:80 { + top: 80% !important; + } + + .bottom-xl-down\:80 { + bottom: 80% !important; + } + + .left-xl-down\:80 { + left: 80% !important; + } + + .right-xl-down\:80 { + right: 80% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:80 { + top: 80% !important; + } + + .bottom-xl\:80 { + bottom: 80% !important; + } + + .left-xl\:80 { + left: 80% !important; + } + + .right-xl\:80 { + right: 80% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:80 { + top: 80% !important; + } + + .bottom-xl-up\:80 { + bottom: 80% !important; + } + + .left-xl-up\:80 { + left: 80% !important; + } + + .right-xl-up\:80 { + right: 80% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:80 { + top: 80% !important; + } + + .bottom-xxl\:80 { + bottom: 80% !important; + } + + .left-xxl\:80 { + left: 80% !important; + } + + .right-xxl\:80 { + right: 80% !important; + } +} +.top\:90 { + top: 90% !important; +} + +.bottom\:90 { + bottom: 90% !important; +} + +.left\:90 { + left: 90% !important; +} + +.right\:90 { + right: 90% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:90 { + top: 90% !important; + } + + .bottom-xs\:90 { + bottom: 90% !important; + } + + .left-xs\:90 { + left: 90% !important; + } + + .right-xs\:90 { + right: 90% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:90 { + top: 90% !important; + } + + .bottom-sm-down\:90 { + bottom: 90% !important; + } + + .left-sm-down\:90 { + left: 90% !important; + } + + .right-sm-down\:90 { + right: 90% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:90 { + top: 90% !important; + } + + .bottom-sm\:90 { + bottom: 90% !important; + } + + .left-sm\:90 { + left: 90% !important; + } + + .right-sm\:90 { + right: 90% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:90 { + top: 90% !important; + } + + .bottom-sm-up\:90 { + bottom: 90% !important; + } + + .left-sm-up\:90 { + left: 90% !important; + } + + .right-sm-up\:90 { + right: 90% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:90 { + top: 90% !important; + } + + .bottom-md-down\:90 { + bottom: 90% !important; + } + + .left-md-down\:90 { + left: 90% !important; + } + + .right-md-down\:90 { + right: 90% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:90 { + top: 90% !important; + } + + .bottom-md\:90 { + bottom: 90% !important; + } + + .left-md\:90 { + left: 90% !important; + } + + .right-md\:90 { + right: 90% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:90 { + top: 90% !important; + } + + .bottom-md-up\:90 { + bottom: 90% !important; + } + + .left-md-up\:90 { + left: 90% !important; + } + + .right-md-up\:90 { + right: 90% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:90 { + top: 90% !important; + } + + .bottom-lg-down\:90 { + bottom: 90% !important; + } + + .left-lg-down\:90 { + left: 90% !important; + } + + .right-lg-down\:90 { + right: 90% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:90 { + top: 90% !important; + } + + .bottom-lg\:90 { + bottom: 90% !important; + } + + .left-lg\:90 { + left: 90% !important; + } + + .right-lg\:90 { + right: 90% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:90 { + top: 90% !important; + } + + .bottom-lg-up\:90 { + bottom: 90% !important; + } + + .left-lg-up\:90 { + left: 90% !important; + } + + .right-lg-up\:90 { + right: 90% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:90 { + top: 90% !important; + } + + .bottom-xl-down\:90 { + bottom: 90% !important; + } + + .left-xl-down\:90 { + left: 90% !important; + } + + .right-xl-down\:90 { + right: 90% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:90 { + top: 90% !important; + } + + .bottom-xl\:90 { + bottom: 90% !important; + } + + .left-xl\:90 { + left: 90% !important; + } + + .right-xl\:90 { + right: 90% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:90 { + top: 90% !important; + } + + .bottom-xl-up\:90 { + bottom: 90% !important; + } + + .left-xl-up\:90 { + left: 90% !important; + } + + .right-xl-up\:90 { + right: 90% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:90 { + top: 90% !important; + } + + .bottom-xxl\:90 { + bottom: 90% !important; + } + + .left-xxl\:90 { + left: 90% !important; + } + + .right-xxl\:90 { + right: 90% !important; + } +} +.top\:100 { + top: 100% !important; +} + +.bottom\:100 { + bottom: 100% !important; +} + +.left\:100 { + left: 100% !important; +} + +.right\:100 { + right: 100% !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:100 { + top: 100% !important; + } + + .bottom-xs\:100 { + bottom: 100% !important; + } + + .left-xs\:100 { + left: 100% !important; + } + + .right-xs\:100 { + right: 100% !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:100 { + top: 100% !important; + } + + .bottom-sm-down\:100 { + bottom: 100% !important; + } + + .left-sm-down\:100 { + left: 100% !important; + } + + .right-sm-down\:100 { + right: 100% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:100 { + top: 100% !important; + } + + .bottom-sm\:100 { + bottom: 100% !important; + } + + .left-sm\:100 { + left: 100% !important; + } + + .right-sm\:100 { + right: 100% !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:100 { + top: 100% !important; + } + + .bottom-sm-up\:100 { + bottom: 100% !important; + } + + .left-sm-up\:100 { + left: 100% !important; + } + + .right-sm-up\:100 { + right: 100% !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:100 { + top: 100% !important; + } + + .bottom-md-down\:100 { + bottom: 100% !important; + } + + .left-md-down\:100 { + left: 100% !important; + } + + .right-md-down\:100 { + right: 100% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:100 { + top: 100% !important; + } + + .bottom-md\:100 { + bottom: 100% !important; + } + + .left-md\:100 { + left: 100% !important; + } + + .right-md\:100 { + right: 100% !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:100 { + top: 100% !important; + } + + .bottom-md-up\:100 { + bottom: 100% !important; + } + + .left-md-up\:100 { + left: 100% !important; + } + + .right-md-up\:100 { + right: 100% !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:100 { + top: 100% !important; + } + + .bottom-lg-down\:100 { + bottom: 100% !important; + } + + .left-lg-down\:100 { + left: 100% !important; + } + + .right-lg-down\:100 { + right: 100% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:100 { + top: 100% !important; + } + + .bottom-lg\:100 { + bottom: 100% !important; + } + + .left-lg\:100 { + left: 100% !important; + } + + .right-lg\:100 { + right: 100% !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:100 { + top: 100% !important; + } + + .bottom-lg-up\:100 { + bottom: 100% !important; + } + + .left-lg-up\:100 { + left: 100% !important; + } + + .right-lg-up\:100 { + right: 100% !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:100 { + top: 100% !important; + } + + .bottom-xl-down\:100 { + bottom: 100% !important; + } + + .left-xl-down\:100 { + left: 100% !important; + } + + .right-xl-down\:100 { + right: 100% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:100 { + top: 100% !important; + } + + .bottom-xl\:100 { + bottom: 100% !important; + } + + .left-xl\:100 { + left: 100% !important; + } + + .right-xl\:100 { + right: 100% !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:100 { + top: 100% !important; + } + + .bottom-xl-up\:100 { + bottom: 100% !important; + } + + .left-xl-up\:100 { + left: 100% !important; + } + + .right-xl-up\:100 { + right: 100% !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:100 { + top: 100% !important; + } + + .bottom-xxl\:100 { + bottom: 100% !important; + } + + .left-xxl\:100 { + left: 100% !important; + } + + .right-xxl\:100 { + right: 100% !important; + } +} +.top\:10vh { + top: 10vh !important; +} + +.bottom\:10vh { + bottom: 10vh !important; +} + +.left\:10vh { + left: 10vh !important; +} + +.right\:10vh { + right: 10vh !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:10vh { + top: 10vh !important; + } + + .bottom-xs\:10vh { + bottom: 10vh !important; + } + + .left-xs\:10vh { + left: 10vh !important; + } + + .right-xs\:10vh { + right: 10vh !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:10vh { + top: 10vh !important; + } + + .bottom-sm-down\:10vh { + bottom: 10vh !important; + } + + .left-sm-down\:10vh { + left: 10vh !important; + } + + .right-sm-down\:10vh { + right: 10vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:10vh { + top: 10vh !important; + } + + .bottom-sm\:10vh { + bottom: 10vh !important; + } + + .left-sm\:10vh { + left: 10vh !important; + } + + .right-sm\:10vh { + right: 10vh !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:10vh { + top: 10vh !important; + } + + .bottom-sm-up\:10vh { + bottom: 10vh !important; + } + + .left-sm-up\:10vh { + left: 10vh !important; + } + + .right-sm-up\:10vh { + right: 10vh !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:10vh { + top: 10vh !important; + } + + .bottom-md-down\:10vh { + bottom: 10vh !important; + } + + .left-md-down\:10vh { + left: 10vh !important; + } + + .right-md-down\:10vh { + right: 10vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:10vh { + top: 10vh !important; + } + + .bottom-md\:10vh { + bottom: 10vh !important; + } + + .left-md\:10vh { + left: 10vh !important; + } + + .right-md\:10vh { + right: 10vh !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:10vh { + top: 10vh !important; + } + + .bottom-md-up\:10vh { + bottom: 10vh !important; + } + + .left-md-up\:10vh { + left: 10vh !important; + } + + .right-md-up\:10vh { + right: 10vh !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:10vh { + top: 10vh !important; + } + + .bottom-lg-down\:10vh { + bottom: 10vh !important; + } + + .left-lg-down\:10vh { + left: 10vh !important; + } + + .right-lg-down\:10vh { + right: 10vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:10vh { + top: 10vh !important; + } + + .bottom-lg\:10vh { + bottom: 10vh !important; + } + + .left-lg\:10vh { + left: 10vh !important; + } + + .right-lg\:10vh { + right: 10vh !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:10vh { + top: 10vh !important; + } + + .bottom-lg-up\:10vh { + bottom: 10vh !important; + } + + .left-lg-up\:10vh { + left: 10vh !important; + } + + .right-lg-up\:10vh { + right: 10vh !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:10vh { + top: 10vh !important; + } + + .bottom-xl-down\:10vh { + bottom: 10vh !important; + } + + .left-xl-down\:10vh { + left: 10vh !important; + } + + .right-xl-down\:10vh { + right: 10vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:10vh { + top: 10vh !important; + } + + .bottom-xl\:10vh { + bottom: 10vh !important; + } + + .left-xl\:10vh { + left: 10vh !important; + } + + .right-xl\:10vh { + right: 10vh !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:10vh { + top: 10vh !important; + } + + .bottom-xl-up\:10vh { + bottom: 10vh !important; + } + + .left-xl-up\:10vh { + left: 10vh !important; + } + + .right-xl-up\:10vh { + right: 10vh !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:10vh { + top: 10vh !important; + } + + .bottom-xxl\:10vh { + bottom: 10vh !important; + } + + .left-xxl\:10vh { + left: 10vh !important; + } + + .right-xxl\:10vh { + right: 10vh !important; + } +} +.top\:25vh { + top: 25vh !important; +} + +.bottom\:25vh { + bottom: 25vh !important; +} + +.left\:25vh { + left: 25vh !important; +} + +.right\:25vh { + right: 25vh !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:25vh { + top: 25vh !important; + } + + .bottom-xs\:25vh { + bottom: 25vh !important; + } + + .left-xs\:25vh { + left: 25vh !important; + } + + .right-xs\:25vh { + right: 25vh !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:25vh { + top: 25vh !important; + } + + .bottom-sm-down\:25vh { + bottom: 25vh !important; + } + + .left-sm-down\:25vh { + left: 25vh !important; + } + + .right-sm-down\:25vh { + right: 25vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:25vh { + top: 25vh !important; + } + + .bottom-sm\:25vh { + bottom: 25vh !important; + } + + .left-sm\:25vh { + left: 25vh !important; + } + + .right-sm\:25vh { + right: 25vh !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:25vh { + top: 25vh !important; + } + + .bottom-sm-up\:25vh { + bottom: 25vh !important; + } + + .left-sm-up\:25vh { + left: 25vh !important; + } + + .right-sm-up\:25vh { + right: 25vh !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:25vh { + top: 25vh !important; + } + + .bottom-md-down\:25vh { + bottom: 25vh !important; + } + + .left-md-down\:25vh { + left: 25vh !important; + } + + .right-md-down\:25vh { + right: 25vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:25vh { + top: 25vh !important; + } + + .bottom-md\:25vh { + bottom: 25vh !important; + } + + .left-md\:25vh { + left: 25vh !important; + } + + .right-md\:25vh { + right: 25vh !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:25vh { + top: 25vh !important; + } + + .bottom-md-up\:25vh { + bottom: 25vh !important; + } + + .left-md-up\:25vh { + left: 25vh !important; + } + + .right-md-up\:25vh { + right: 25vh !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:25vh { + top: 25vh !important; + } + + .bottom-lg-down\:25vh { + bottom: 25vh !important; + } + + .left-lg-down\:25vh { + left: 25vh !important; + } + + .right-lg-down\:25vh { + right: 25vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:25vh { + top: 25vh !important; + } + + .bottom-lg\:25vh { + bottom: 25vh !important; + } + + .left-lg\:25vh { + left: 25vh !important; + } + + .right-lg\:25vh { + right: 25vh !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:25vh { + top: 25vh !important; + } + + .bottom-lg-up\:25vh { + bottom: 25vh !important; + } + + .left-lg-up\:25vh { + left: 25vh !important; + } + + .right-lg-up\:25vh { + right: 25vh !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:25vh { + top: 25vh !important; + } + + .bottom-xl-down\:25vh { + bottom: 25vh !important; + } + + .left-xl-down\:25vh { + left: 25vh !important; + } + + .right-xl-down\:25vh { + right: 25vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:25vh { + top: 25vh !important; + } + + .bottom-xl\:25vh { + bottom: 25vh !important; + } + + .left-xl\:25vh { + left: 25vh !important; + } + + .right-xl\:25vh { + right: 25vh !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:25vh { + top: 25vh !important; + } + + .bottom-xl-up\:25vh { + bottom: 25vh !important; + } + + .left-xl-up\:25vh { + left: 25vh !important; + } + + .right-xl-up\:25vh { + right: 25vh !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:25vh { + top: 25vh !important; + } + + .bottom-xxl\:25vh { + bottom: 25vh !important; + } + + .left-xxl\:25vh { + left: 25vh !important; + } + + .right-xxl\:25vh { + right: 25vh !important; + } +} +.top\:50vh { + top: 50vh !important; +} + +.bottom\:50vh { + bottom: 50vh !important; +} + +.left\:50vh { + left: 50vh !important; +} + +.right\:50vh { + right: 50vh !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:50vh { + top: 50vh !important; + } + + .bottom-xs\:50vh { + bottom: 50vh !important; + } + + .left-xs\:50vh { + left: 50vh !important; + } + + .right-xs\:50vh { + right: 50vh !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:50vh { + top: 50vh !important; + } + + .bottom-sm-down\:50vh { + bottom: 50vh !important; + } + + .left-sm-down\:50vh { + left: 50vh !important; + } + + .right-sm-down\:50vh { + right: 50vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:50vh { + top: 50vh !important; + } + + .bottom-sm\:50vh { + bottom: 50vh !important; + } + + .left-sm\:50vh { + left: 50vh !important; + } + + .right-sm\:50vh { + right: 50vh !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:50vh { + top: 50vh !important; + } + + .bottom-sm-up\:50vh { + bottom: 50vh !important; + } + + .left-sm-up\:50vh { + left: 50vh !important; + } + + .right-sm-up\:50vh { + right: 50vh !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:50vh { + top: 50vh !important; + } + + .bottom-md-down\:50vh { + bottom: 50vh !important; + } + + .left-md-down\:50vh { + left: 50vh !important; + } + + .right-md-down\:50vh { + right: 50vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:50vh { + top: 50vh !important; + } + + .bottom-md\:50vh { + bottom: 50vh !important; + } + + .left-md\:50vh { + left: 50vh !important; + } + + .right-md\:50vh { + right: 50vh !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:50vh { + top: 50vh !important; + } + + .bottom-md-up\:50vh { + bottom: 50vh !important; + } + + .left-md-up\:50vh { + left: 50vh !important; + } + + .right-md-up\:50vh { + right: 50vh !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:50vh { + top: 50vh !important; + } + + .bottom-lg-down\:50vh { + bottom: 50vh !important; + } + + .left-lg-down\:50vh { + left: 50vh !important; + } + + .right-lg-down\:50vh { + right: 50vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:50vh { + top: 50vh !important; + } + + .bottom-lg\:50vh { + bottom: 50vh !important; + } + + .left-lg\:50vh { + left: 50vh !important; + } + + .right-lg\:50vh { + right: 50vh !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:50vh { + top: 50vh !important; + } + + .bottom-lg-up\:50vh { + bottom: 50vh !important; + } + + .left-lg-up\:50vh { + left: 50vh !important; + } + + .right-lg-up\:50vh { + right: 50vh !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:50vh { + top: 50vh !important; + } + + .bottom-xl-down\:50vh { + bottom: 50vh !important; + } + + .left-xl-down\:50vh { + left: 50vh !important; + } + + .right-xl-down\:50vh { + right: 50vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:50vh { + top: 50vh !important; + } + + .bottom-xl\:50vh { + bottom: 50vh !important; + } + + .left-xl\:50vh { + left: 50vh !important; + } + + .right-xl\:50vh { + right: 50vh !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:50vh { + top: 50vh !important; + } + + .bottom-xl-up\:50vh { + bottom: 50vh !important; + } + + .left-xl-up\:50vh { + left: 50vh !important; + } + + .right-xl-up\:50vh { + right: 50vh !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:50vh { + top: 50vh !important; + } + + .bottom-xxl\:50vh { + bottom: 50vh !important; + } + + .left-xxl\:50vh { + left: 50vh !important; + } + + .right-xxl\:50vh { + right: 50vh !important; + } +} +.top\:75vh { + top: 75vh !important; +} + +.bottom\:75vh { + bottom: 75vh !important; +} + +.left\:75vh { + left: 75vh !important; +} + +.right\:75vh { + right: 75vh !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:75vh { + top: 75vh !important; + } + + .bottom-xs\:75vh { + bottom: 75vh !important; + } + + .left-xs\:75vh { + left: 75vh !important; + } + + .right-xs\:75vh { + right: 75vh !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:75vh { + top: 75vh !important; + } + + .bottom-sm-down\:75vh { + bottom: 75vh !important; + } + + .left-sm-down\:75vh { + left: 75vh !important; + } + + .right-sm-down\:75vh { + right: 75vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:75vh { + top: 75vh !important; + } + + .bottom-sm\:75vh { + bottom: 75vh !important; + } + + .left-sm\:75vh { + left: 75vh !important; + } + + .right-sm\:75vh { + right: 75vh !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:75vh { + top: 75vh !important; + } + + .bottom-sm-up\:75vh { + bottom: 75vh !important; + } + + .left-sm-up\:75vh { + left: 75vh !important; + } + + .right-sm-up\:75vh { + right: 75vh !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:75vh { + top: 75vh !important; + } + + .bottom-md-down\:75vh { + bottom: 75vh !important; + } + + .left-md-down\:75vh { + left: 75vh !important; + } + + .right-md-down\:75vh { + right: 75vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:75vh { + top: 75vh !important; + } + + .bottom-md\:75vh { + bottom: 75vh !important; + } + + .left-md\:75vh { + left: 75vh !important; + } + + .right-md\:75vh { + right: 75vh !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:75vh { + top: 75vh !important; + } + + .bottom-md-up\:75vh { + bottom: 75vh !important; + } + + .left-md-up\:75vh { + left: 75vh !important; + } + + .right-md-up\:75vh { + right: 75vh !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:75vh { + top: 75vh !important; + } + + .bottom-lg-down\:75vh { + bottom: 75vh !important; + } + + .left-lg-down\:75vh { + left: 75vh !important; + } + + .right-lg-down\:75vh { + right: 75vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:75vh { + top: 75vh !important; + } + + .bottom-lg\:75vh { + bottom: 75vh !important; + } + + .left-lg\:75vh { + left: 75vh !important; + } + + .right-lg\:75vh { + right: 75vh !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:75vh { + top: 75vh !important; + } + + .bottom-lg-up\:75vh { + bottom: 75vh !important; + } + + .left-lg-up\:75vh { + left: 75vh !important; + } + + .right-lg-up\:75vh { + right: 75vh !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:75vh { + top: 75vh !important; + } + + .bottom-xl-down\:75vh { + bottom: 75vh !important; + } + + .left-xl-down\:75vh { + left: 75vh !important; + } + + .right-xl-down\:75vh { + right: 75vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:75vh { + top: 75vh !important; + } + + .bottom-xl\:75vh { + bottom: 75vh !important; + } + + .left-xl\:75vh { + left: 75vh !important; + } + + .right-xl\:75vh { + right: 75vh !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:75vh { + top: 75vh !important; + } + + .bottom-xl-up\:75vh { + bottom: 75vh !important; + } + + .left-xl-up\:75vh { + left: 75vh !important; + } + + .right-xl-up\:75vh { + right: 75vh !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:75vh { + top: 75vh !important; + } + + .bottom-xxl\:75vh { + bottom: 75vh !important; + } + + .left-xxl\:75vh { + left: 75vh !important; + } + + .right-xxl\:75vh { + right: 75vh !important; + } +} +.top\:100vh { + top: 100vh !important; +} + +.bottom\:100vh { + bottom: 100vh !important; +} + +.left\:100vh { + left: 100vh !important; +} + +.right\:100vh { + right: 100vh !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:100vh { + top: 100vh !important; + } + + .bottom-xs\:100vh { + bottom: 100vh !important; + } + + .left-xs\:100vh { + left: 100vh !important; + } + + .right-xs\:100vh { + right: 100vh !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:100vh { + top: 100vh !important; + } + + .bottom-sm-down\:100vh { + bottom: 100vh !important; + } + + .left-sm-down\:100vh { + left: 100vh !important; + } + + .right-sm-down\:100vh { + right: 100vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:100vh { + top: 100vh !important; + } + + .bottom-sm\:100vh { + bottom: 100vh !important; + } + + .left-sm\:100vh { + left: 100vh !important; + } + + .right-sm\:100vh { + right: 100vh !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:100vh { + top: 100vh !important; + } + + .bottom-sm-up\:100vh { + bottom: 100vh !important; + } + + .left-sm-up\:100vh { + left: 100vh !important; + } + + .right-sm-up\:100vh { + right: 100vh !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:100vh { + top: 100vh !important; + } + + .bottom-md-down\:100vh { + bottom: 100vh !important; + } + + .left-md-down\:100vh { + left: 100vh !important; + } + + .right-md-down\:100vh { + right: 100vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:100vh { + top: 100vh !important; + } + + .bottom-md\:100vh { + bottom: 100vh !important; + } + + .left-md\:100vh { + left: 100vh !important; + } + + .right-md\:100vh { + right: 100vh !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:100vh { + top: 100vh !important; + } + + .bottom-md-up\:100vh { + bottom: 100vh !important; + } + + .left-md-up\:100vh { + left: 100vh !important; + } + + .right-md-up\:100vh { + right: 100vh !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:100vh { + top: 100vh !important; + } + + .bottom-lg-down\:100vh { + bottom: 100vh !important; + } + + .left-lg-down\:100vh { + left: 100vh !important; + } + + .right-lg-down\:100vh { + right: 100vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:100vh { + top: 100vh !important; + } + + .bottom-lg\:100vh { + bottom: 100vh !important; + } + + .left-lg\:100vh { + left: 100vh !important; + } + + .right-lg\:100vh { + right: 100vh !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:100vh { + top: 100vh !important; + } + + .bottom-lg-up\:100vh { + bottom: 100vh !important; + } + + .left-lg-up\:100vh { + left: 100vh !important; + } + + .right-lg-up\:100vh { + right: 100vh !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:100vh { + top: 100vh !important; + } + + .bottom-xl-down\:100vh { + bottom: 100vh !important; + } + + .left-xl-down\:100vh { + left: 100vh !important; + } + + .right-xl-down\:100vh { + right: 100vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:100vh { + top: 100vh !important; + } + + .bottom-xl\:100vh { + bottom: 100vh !important; + } + + .left-xl\:100vh { + left: 100vh !important; + } + + .right-xl\:100vh { + right: 100vh !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:100vh { + top: 100vh !important; + } + + .bottom-xl-up\:100vh { + bottom: 100vh !important; + } + + .left-xl-up\:100vh { + left: 100vh !important; + } + + .right-xl-up\:100vh { + right: 100vh !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:100vh { + top: 100vh !important; + } + + .bottom-xxl\:100vh { + bottom: 100vh !important; + } + + .left-xxl\:100vh { + left: 100vh !important; + } + + .right-xxl\:100vh { + right: 100vh !important; + } +} +.top\:10vw { + top: 10vw !important; +} + +.bottom\:10vw { + bottom: 10vw !important; +} + +.left\:10vw { + left: 10vw !important; +} + +.right\:10vw { + right: 10vw !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:10vw { + top: 10vw !important; + } + + .bottom-xs\:10vw { + bottom: 10vw !important; + } + + .left-xs\:10vw { + left: 10vw !important; + } + + .right-xs\:10vw { + right: 10vw !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:10vw { + top: 10vw !important; + } + + .bottom-sm-down\:10vw { + bottom: 10vw !important; + } + + .left-sm-down\:10vw { + left: 10vw !important; + } + + .right-sm-down\:10vw { + right: 10vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:10vw { + top: 10vw !important; + } + + .bottom-sm\:10vw { + bottom: 10vw !important; + } + + .left-sm\:10vw { + left: 10vw !important; + } + + .right-sm\:10vw { + right: 10vw !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:10vw { + top: 10vw !important; + } + + .bottom-sm-up\:10vw { + bottom: 10vw !important; + } + + .left-sm-up\:10vw { + left: 10vw !important; + } + + .right-sm-up\:10vw { + right: 10vw !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:10vw { + top: 10vw !important; + } + + .bottom-md-down\:10vw { + bottom: 10vw !important; + } + + .left-md-down\:10vw { + left: 10vw !important; + } + + .right-md-down\:10vw { + right: 10vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:10vw { + top: 10vw !important; + } + + .bottom-md\:10vw { + bottom: 10vw !important; + } + + .left-md\:10vw { + left: 10vw !important; + } + + .right-md\:10vw { + right: 10vw !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:10vw { + top: 10vw !important; + } + + .bottom-md-up\:10vw { + bottom: 10vw !important; + } + + .left-md-up\:10vw { + left: 10vw !important; + } + + .right-md-up\:10vw { + right: 10vw !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:10vw { + top: 10vw !important; + } + + .bottom-lg-down\:10vw { + bottom: 10vw !important; + } + + .left-lg-down\:10vw { + left: 10vw !important; + } + + .right-lg-down\:10vw { + right: 10vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:10vw { + top: 10vw !important; + } + + .bottom-lg\:10vw { + bottom: 10vw !important; + } + + .left-lg\:10vw { + left: 10vw !important; + } + + .right-lg\:10vw { + right: 10vw !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:10vw { + top: 10vw !important; + } + + .bottom-lg-up\:10vw { + bottom: 10vw !important; + } + + .left-lg-up\:10vw { + left: 10vw !important; + } + + .right-lg-up\:10vw { + right: 10vw !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:10vw { + top: 10vw !important; + } + + .bottom-xl-down\:10vw { + bottom: 10vw !important; + } + + .left-xl-down\:10vw { + left: 10vw !important; + } + + .right-xl-down\:10vw { + right: 10vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:10vw { + top: 10vw !important; + } + + .bottom-xl\:10vw { + bottom: 10vw !important; + } + + .left-xl\:10vw { + left: 10vw !important; + } + + .right-xl\:10vw { + right: 10vw !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:10vw { + top: 10vw !important; + } + + .bottom-xl-up\:10vw { + bottom: 10vw !important; + } + + .left-xl-up\:10vw { + left: 10vw !important; + } + + .right-xl-up\:10vw { + right: 10vw !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:10vw { + top: 10vw !important; + } + + .bottom-xxl\:10vw { + bottom: 10vw !important; + } + + .left-xxl\:10vw { + left: 10vw !important; + } + + .right-xxl\:10vw { + right: 10vw !important; + } +} +.top\:25vw { + top: 25vw !important; +} + +.bottom\:25vw { + bottom: 25vw !important; +} + +.left\:25vw { + left: 25vw !important; +} + +.right\:25vw { + right: 25vw !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:25vw { + top: 25vw !important; + } + + .bottom-xs\:25vw { + bottom: 25vw !important; + } + + .left-xs\:25vw { + left: 25vw !important; + } + + .right-xs\:25vw { + right: 25vw !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:25vw { + top: 25vw !important; + } + + .bottom-sm-down\:25vw { + bottom: 25vw !important; + } + + .left-sm-down\:25vw { + left: 25vw !important; + } + + .right-sm-down\:25vw { + right: 25vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:25vw { + top: 25vw !important; + } + + .bottom-sm\:25vw { + bottom: 25vw !important; + } + + .left-sm\:25vw { + left: 25vw !important; + } + + .right-sm\:25vw { + right: 25vw !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:25vw { + top: 25vw !important; + } + + .bottom-sm-up\:25vw { + bottom: 25vw !important; + } + + .left-sm-up\:25vw { + left: 25vw !important; + } + + .right-sm-up\:25vw { + right: 25vw !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:25vw { + top: 25vw !important; + } + + .bottom-md-down\:25vw { + bottom: 25vw !important; + } + + .left-md-down\:25vw { + left: 25vw !important; + } + + .right-md-down\:25vw { + right: 25vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:25vw { + top: 25vw !important; + } + + .bottom-md\:25vw { + bottom: 25vw !important; + } + + .left-md\:25vw { + left: 25vw !important; + } + + .right-md\:25vw { + right: 25vw !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:25vw { + top: 25vw !important; + } + + .bottom-md-up\:25vw { + bottom: 25vw !important; + } + + .left-md-up\:25vw { + left: 25vw !important; + } + + .right-md-up\:25vw { + right: 25vw !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:25vw { + top: 25vw !important; + } + + .bottom-lg-down\:25vw { + bottom: 25vw !important; + } + + .left-lg-down\:25vw { + left: 25vw !important; + } + + .right-lg-down\:25vw { + right: 25vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:25vw { + top: 25vw !important; + } + + .bottom-lg\:25vw { + bottom: 25vw !important; + } + + .left-lg\:25vw { + left: 25vw !important; + } + + .right-lg\:25vw { + right: 25vw !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:25vw { + top: 25vw !important; + } + + .bottom-lg-up\:25vw { + bottom: 25vw !important; + } + + .left-lg-up\:25vw { + left: 25vw !important; + } + + .right-lg-up\:25vw { + right: 25vw !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:25vw { + top: 25vw !important; + } + + .bottom-xl-down\:25vw { + bottom: 25vw !important; + } + + .left-xl-down\:25vw { + left: 25vw !important; + } + + .right-xl-down\:25vw { + right: 25vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:25vw { + top: 25vw !important; + } + + .bottom-xl\:25vw { + bottom: 25vw !important; + } + + .left-xl\:25vw { + left: 25vw !important; + } + + .right-xl\:25vw { + right: 25vw !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:25vw { + top: 25vw !important; + } + + .bottom-xl-up\:25vw { + bottom: 25vw !important; + } + + .left-xl-up\:25vw { + left: 25vw !important; + } + + .right-xl-up\:25vw { + right: 25vw !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:25vw { + top: 25vw !important; + } + + .bottom-xxl\:25vw { + bottom: 25vw !important; + } + + .left-xxl\:25vw { + left: 25vw !important; + } + + .right-xxl\:25vw { + right: 25vw !important; + } +} +.top\:50vw { + top: 50vw !important; +} + +.bottom\:50vw { + bottom: 50vw !important; +} + +.left\:50vw { + left: 50vw !important; +} + +.right\:50vw { + right: 50vw !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:50vw { + top: 50vw !important; + } + + .bottom-xs\:50vw { + bottom: 50vw !important; + } + + .left-xs\:50vw { + left: 50vw !important; + } + + .right-xs\:50vw { + right: 50vw !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:50vw { + top: 50vw !important; + } + + .bottom-sm-down\:50vw { + bottom: 50vw !important; + } + + .left-sm-down\:50vw { + left: 50vw !important; + } + + .right-sm-down\:50vw { + right: 50vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:50vw { + top: 50vw !important; + } + + .bottom-sm\:50vw { + bottom: 50vw !important; + } + + .left-sm\:50vw { + left: 50vw !important; + } + + .right-sm\:50vw { + right: 50vw !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:50vw { + top: 50vw !important; + } + + .bottom-sm-up\:50vw { + bottom: 50vw !important; + } + + .left-sm-up\:50vw { + left: 50vw !important; + } + + .right-sm-up\:50vw { + right: 50vw !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:50vw { + top: 50vw !important; + } + + .bottom-md-down\:50vw { + bottom: 50vw !important; + } + + .left-md-down\:50vw { + left: 50vw !important; + } + + .right-md-down\:50vw { + right: 50vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:50vw { + top: 50vw !important; + } + + .bottom-md\:50vw { + bottom: 50vw !important; + } + + .left-md\:50vw { + left: 50vw !important; + } + + .right-md\:50vw { + right: 50vw !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:50vw { + top: 50vw !important; + } + + .bottom-md-up\:50vw { + bottom: 50vw !important; + } + + .left-md-up\:50vw { + left: 50vw !important; + } + + .right-md-up\:50vw { + right: 50vw !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:50vw { + top: 50vw !important; + } + + .bottom-lg-down\:50vw { + bottom: 50vw !important; + } + + .left-lg-down\:50vw { + left: 50vw !important; + } + + .right-lg-down\:50vw { + right: 50vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:50vw { + top: 50vw !important; + } + + .bottom-lg\:50vw { + bottom: 50vw !important; + } + + .left-lg\:50vw { + left: 50vw !important; + } + + .right-lg\:50vw { + right: 50vw !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:50vw { + top: 50vw !important; + } + + .bottom-lg-up\:50vw { + bottom: 50vw !important; + } + + .left-lg-up\:50vw { + left: 50vw !important; + } + + .right-lg-up\:50vw { + right: 50vw !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:50vw { + top: 50vw !important; + } + + .bottom-xl-down\:50vw { + bottom: 50vw !important; + } + + .left-xl-down\:50vw { + left: 50vw !important; + } + + .right-xl-down\:50vw { + right: 50vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:50vw { + top: 50vw !important; + } + + .bottom-xl\:50vw { + bottom: 50vw !important; + } + + .left-xl\:50vw { + left: 50vw !important; + } + + .right-xl\:50vw { + right: 50vw !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:50vw { + top: 50vw !important; + } + + .bottom-xl-up\:50vw { + bottom: 50vw !important; + } + + .left-xl-up\:50vw { + left: 50vw !important; + } + + .right-xl-up\:50vw { + right: 50vw !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:50vw { + top: 50vw !important; + } + + .bottom-xxl\:50vw { + bottom: 50vw !important; + } + + .left-xxl\:50vw { + left: 50vw !important; + } + + .right-xxl\:50vw { + right: 50vw !important; + } +} +.top\:75vw { + top: 75vw !important; +} + +.bottom\:75vw { + bottom: 75vw !important; +} + +.left\:75vw { + left: 75vw !important; +} + +.right\:75vw { + right: 75vw !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:75vw { + top: 75vw !important; + } + + .bottom-xs\:75vw { + bottom: 75vw !important; + } + + .left-xs\:75vw { + left: 75vw !important; + } + + .right-xs\:75vw { + right: 75vw !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:75vw { + top: 75vw !important; + } + + .bottom-sm-down\:75vw { + bottom: 75vw !important; + } + + .left-sm-down\:75vw { + left: 75vw !important; + } + + .right-sm-down\:75vw { + right: 75vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:75vw { + top: 75vw !important; + } + + .bottom-sm\:75vw { + bottom: 75vw !important; + } + + .left-sm\:75vw { + left: 75vw !important; + } + + .right-sm\:75vw { + right: 75vw !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:75vw { + top: 75vw !important; + } + + .bottom-sm-up\:75vw { + bottom: 75vw !important; + } + + .left-sm-up\:75vw { + left: 75vw !important; + } + + .right-sm-up\:75vw { + right: 75vw !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:75vw { + top: 75vw !important; + } + + .bottom-md-down\:75vw { + bottom: 75vw !important; + } + + .left-md-down\:75vw { + left: 75vw !important; + } + + .right-md-down\:75vw { + right: 75vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:75vw { + top: 75vw !important; + } + + .bottom-md\:75vw { + bottom: 75vw !important; + } + + .left-md\:75vw { + left: 75vw !important; + } + + .right-md\:75vw { + right: 75vw !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:75vw { + top: 75vw !important; + } + + .bottom-md-up\:75vw { + bottom: 75vw !important; + } + + .left-md-up\:75vw { + left: 75vw !important; + } + + .right-md-up\:75vw { + right: 75vw !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:75vw { + top: 75vw !important; + } + + .bottom-lg-down\:75vw { + bottom: 75vw !important; + } + + .left-lg-down\:75vw { + left: 75vw !important; + } + + .right-lg-down\:75vw { + right: 75vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:75vw { + top: 75vw !important; + } + + .bottom-lg\:75vw { + bottom: 75vw !important; + } + + .left-lg\:75vw { + left: 75vw !important; + } + + .right-lg\:75vw { + right: 75vw !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:75vw { + top: 75vw !important; + } + + .bottom-lg-up\:75vw { + bottom: 75vw !important; + } + + .left-lg-up\:75vw { + left: 75vw !important; + } + + .right-lg-up\:75vw { + right: 75vw !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:75vw { + top: 75vw !important; + } + + .bottom-xl-down\:75vw { + bottom: 75vw !important; + } + + .left-xl-down\:75vw { + left: 75vw !important; + } + + .right-xl-down\:75vw { + right: 75vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:75vw { + top: 75vw !important; + } + + .bottom-xl\:75vw { + bottom: 75vw !important; + } + + .left-xl\:75vw { + left: 75vw !important; + } + + .right-xl\:75vw { + right: 75vw !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:75vw { + top: 75vw !important; + } + + .bottom-xl-up\:75vw { + bottom: 75vw !important; + } + + .left-xl-up\:75vw { + left: 75vw !important; + } + + .right-xl-up\:75vw { + right: 75vw !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:75vw { + top: 75vw !important; + } + + .bottom-xxl\:75vw { + bottom: 75vw !important; + } + + .left-xxl\:75vw { + left: 75vw !important; + } + + .right-xxl\:75vw { + right: 75vw !important; + } +} +.top\:100vw { + top: 100vw !important; +} + +.bottom\:100vw { + bottom: 100vw !important; +} + +.left\:100vw { + left: 100vw !important; +} + +.right\:100vw { + right: 100vw !important; +} + +@media only screen and (max-width: 576px) { + .top-xs\:100vw { + top: 100vw !important; + } + + .bottom-xs\:100vw { + bottom: 100vw !important; + } + + .left-xs\:100vw { + left: 100vw !important; + } + + .right-xs\:100vw { + right: 100vw !important; + } +} +@media only screen and (max-width: 768px) { + .top-sm-down\:100vw { + top: 100vw !important; + } + + .bottom-sm-down\:100vw { + bottom: 100vw !important; + } + + .left-sm-down\:100vw { + left: 100vw !important; + } + + .right-sm-down\:100vw { + right: 100vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .top-sm\:100vw { + top: 100vw !important; + } + + .bottom-sm\:100vw { + bottom: 100vw !important; + } + + .left-sm\:100vw { + left: 100vw !important; + } + + .right-sm\:100vw { + right: 100vw !important; + } +} +@media only screen and (min-width: 577px) { + .top-sm-up\:100vw { + top: 100vw !important; + } + + .bottom-sm-up\:100vw { + bottom: 100vw !important; + } + + .left-sm-up\:100vw { + left: 100vw !important; + } + + .right-sm-up\:100vw { + right: 100vw !important; + } +} +@media only screen and (max-width: 992px) { + .top-md-down\:100vw { + top: 100vw !important; + } + + .bottom-md-down\:100vw { + bottom: 100vw !important; + } + + .left-md-down\:100vw { + left: 100vw !important; + } + + .right-md-down\:100vw { + right: 100vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .top-md\:100vw { + top: 100vw !important; + } + + .bottom-md\:100vw { + bottom: 100vw !important; + } + + .left-md\:100vw { + left: 100vw !important; + } + + .right-md\:100vw { + right: 100vw !important; + } +} +@media only screen and (min-width: 769px) { + .top-md-up\:100vw { + top: 100vw !important; + } + + .bottom-md-up\:100vw { + bottom: 100vw !important; + } + + .left-md-up\:100vw { + left: 100vw !important; + } + + .right-md-up\:100vw { + right: 100vw !important; + } +} +@media only screen and (max-width: 1200px) { + .top-lg-down\:100vw { + top: 100vw !important; + } + + .bottom-lg-down\:100vw { + bottom: 100vw !important; + } + + .left-lg-down\:100vw { + left: 100vw !important; + } + + .right-lg-down\:100vw { + right: 100vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .top-lg\:100vw { + top: 100vw !important; + } + + .bottom-lg\:100vw { + bottom: 100vw !important; + } + + .left-lg\:100vw { + left: 100vw !important; + } + + .right-lg\:100vw { + right: 100vw !important; + } +} +@media only screen and (min-width: 993px) { + .top-lg-up\:100vw { + top: 100vw !important; + } + + .bottom-lg-up\:100vw { + bottom: 100vw !important; + } + + .left-lg-up\:100vw { + left: 100vw !important; + } + + .right-lg-up\:100vw { + right: 100vw !important; + } +} +@media only screen and (max-width: 1400px) { + .top-xl-down\:100vw { + top: 100vw !important; + } + + .bottom-xl-down\:100vw { + bottom: 100vw !important; + } + + .left-xl-down\:100vw { + left: 100vw !important; + } + + .right-xl-down\:100vw { + right: 100vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .top-xl\:100vw { + top: 100vw !important; + } + + .bottom-xl\:100vw { + bottom: 100vw !important; + } + + .left-xl\:100vw { + left: 100vw !important; + } + + .right-xl\:100vw { + right: 100vw !important; + } +} +@media only screen and (min-width: 1201px) { + .top-xl-up\:100vw { + top: 100vw !important; + } + + .bottom-xl-up\:100vw { + bottom: 100vw !important; + } + + .left-xl-up\:100vw { + left: 100vw !important; + } + + .right-xl-up\:100vw { + right: 100vw !important; + } +} +@media only screen and (min-width: 1401px) { + .top-xxl\:100vw { + top: 100vw !important; + } + + .bottom-xxl\:100vw { + bottom: 100vw !important; + } + + .left-xxl\:100vw { + left: 100vw !important; + } + + .right-xxl\:100vw { + right: 100vw !important; + } +} +.transition\:c-btn { + transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out; +} + +.animation\:slide-up { + animation: slideUp 0.3s; +} + +.animation\:slide-down { + animation: slideDown 0.3s; +} + +.animation\:page-in { + animation: pageIn 0.3s; +} + +.animation\:slide-in-right { + animation: slideInRight 0.3s; +} + +@keyframes slideUp { + 0% { + transform: translateY(50%); + opacity: 0.1; + } + 100% { + transform: translateY(0px); + opacity: 1; + } +} +@keyframes slideDown { + 0% { + transform: translateY(-50%); + opacity: 0.1; + } + 100% { + transform: translateY(0px); + opacity: 1; + } +} +@keyframes slideInRight { + 0% { + transform: translateX(50%); + } + 100% { + transform: translateX(0px); + } +} +@keyframes pageIn { + 0% { + top: 10px; + opacity: 0; + } + 50% { + top: 5px; + opacity: 0.5; + } + 100% { + top: 0px; + opacity: 1; + } +} +.border\:none { + border: none !important; +} + +.border-radius\:none { + border-radius: none !important; +} + +.border-radius\:xs { + border-radius: 2px; +} + +.border-radius\:sm { + border-radius: 4px; +} + +.border-radius\:md { + border-radius: 6px; +} + +.border-radius\:lg { + border-radius: 8px; +} + +.border-radius\:xl { + border-radius: 10px; +} + +.border-radius\:xxl { + border-radius: 20px; +} + +.border-radius\:10 { + border-radius: 10%; +} + +.border-radius\:25 { + border-radius: 25%; +} + +.border-radius\:50 { + border-radius: 50%; +} + +.border-radius\:x { + border-radius: 1000px; +} + +.overflow\:auto { + overflow: auto !important; +} + +@media only screen and (max-width: 576px) { + .overflow-xs\:auto { + overflow: auto !important; + } +} +@media only screen and (max-width: 768px) { + .overflow-sm-down\:auto { + overflow: auto !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .overflow-sm\:auto { + overflow: auto !important; + } +} +@media only screen and (min-width: 577px) { + .overflow-sm-up\:auto { + overflow: auto !important; + } +} +@media only screen and (max-width: 992px) { + .overflow-md-down\:auto { + overflow: auto !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .overflow-md\:auto { + overflow: auto !important; + } +} +@media only screen and (min-width: 769px) { + .overflow-md-up\:auto { + overflow: auto !important; + } +} +@media only screen and (max-width: 1200px) { + .overflow-lg-down\:auto { + overflow: auto !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .overflow-lg\:auto { + overflow: auto !important; + } +} +@media only screen and (min-width: 993px) { + .overflow-lg-up\:auto { + overflow: auto !important; + } +} +@media only screen and (max-width: 1400px) { + .overflow-xl-down\:auto { + overflow: auto !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .overflow-xl\:auto { + overflow: auto !important; + } +} +@media only screen and (min-width: 1201px) { + .overflow-xl-up\:auto { + overflow: auto !important; + } +} +@media only screen and (min-width: 1401px) { + .overflow-xl\:auto { + overflow: auto !important; + } +} +.overflow\:hidden { + overflow: hidden !important; +} + +@media only screen and (max-width: 576px) { + .overflow-xs\:hidden { + overflow: hidden !important; + } +} +@media only screen and (max-width: 768px) { + .overflow-sm-down\:hidden { + overflow: hidden !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .overflow-sm\:hidden { + overflow: hidden !important; + } +} +@media only screen and (min-width: 577px) { + .overflow-sm-up\:hidden { + overflow: hidden !important; + } +} +@media only screen and (max-width: 992px) { + .overflow-md-down\:hidden { + overflow: hidden !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .overflow-md\:hidden { + overflow: hidden !important; + } +} +@media only screen and (min-width: 769px) { + .overflow-md-up\:hidden { + overflow: hidden !important; + } +} +@media only screen and (max-width: 1200px) { + .overflow-lg-down\:hidden { + overflow: hidden !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .overflow-lg\:hidden { + overflow: hidden !important; + } +} +@media only screen and (min-width: 993px) { + .overflow-lg-up\:hidden { + overflow: hidden !important; + } +} +@media only screen and (max-width: 1400px) { + .overflow-xl-down\:hidden { + overflow: hidden !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .overflow-xl\:hidden { + overflow: hidden !important; + } +} +@media only screen and (min-width: 1201px) { + .overflow-xl-up\:hidden { + overflow: hidden !important; + } +} +@media only screen and (min-width: 1401px) { + .overflow-xl\:hidden { + overflow: hidden !important; + } +} +.overflow\:scroll { + overflow: scroll !important; +} + +@media only screen and (max-width: 576px) { + .overflow-xs\:scroll { + overflow: scroll !important; + } +} +@media only screen and (max-width: 768px) { + .overflow-sm-down\:scroll { + overflow: scroll !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .overflow-sm\:scroll { + overflow: scroll !important; + } +} +@media only screen and (min-width: 577px) { + .overflow-sm-up\:scroll { + overflow: scroll !important; + } +} +@media only screen and (max-width: 992px) { + .overflow-md-down\:scroll { + overflow: scroll !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .overflow-md\:scroll { + overflow: scroll !important; + } +} +@media only screen and (min-width: 769px) { + .overflow-md-up\:scroll { + overflow: scroll !important; + } +} +@media only screen and (max-width: 1200px) { + .overflow-lg-down\:scroll { + overflow: scroll !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .overflow-lg\:scroll { + overflow: scroll !important; + } +} +@media only screen and (min-width: 993px) { + .overflow-lg-up\:scroll { + overflow: scroll !important; + } +} +@media only screen and (max-width: 1400px) { + .overflow-xl-down\:scroll { + overflow: scroll !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .overflow-xl\:scroll { + overflow: scroll !important; + } +} +@media only screen and (min-width: 1201px) { + .overflow-xl-up\:scroll { + overflow: scroll !important; + } +} +@media only screen and (min-width: 1401px) { + .overflow-xl\:scroll { + overflow: scroll !important; + } +} +.overflow\:visible { + overflow: visible !important; +} + +@media only screen and (max-width: 576px) { + .overflow-xs\:visible { + overflow: visible !important; + } +} +@media only screen and (max-width: 768px) { + .overflow-sm-down\:visible { + overflow: visible !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .overflow-sm\:visible { + overflow: visible !important; + } +} +@media only screen and (min-width: 577px) { + .overflow-sm-up\:visible { + overflow: visible !important; + } +} +@media only screen and (max-width: 992px) { + .overflow-md-down\:visible { + overflow: visible !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .overflow-md\:visible { + overflow: visible !important; + } +} +@media only screen and (min-width: 769px) { + .overflow-md-up\:visible { + overflow: visible !important; + } +} +@media only screen and (max-width: 1200px) { + .overflow-lg-down\:visible { + overflow: visible !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .overflow-lg\:visible { + overflow: visible !important; + } +} +@media only screen and (min-width: 993px) { + .overflow-lg-up\:visible { + overflow: visible !important; + } +} +@media only screen and (max-width: 1400px) { + .overflow-xl-down\:visible { + overflow: visible !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .overflow-xl\:visible { + overflow: visible !important; + } +} +@media only screen and (min-width: 1201px) { + .overflow-xl-up\:visible { + overflow: visible !important; + } +} +@media only screen and (min-width: 1401px) { + .overflow-xl\:visible { + overflow: visible !important; + } +} +.cursor\:pointer { + cursor: pointer !important; +} + +.cursor\:auto { + cursor: auto !important; +} + +.cursor\:default { + cursor: default !important; +} + +.cursor\:crosshair { + cursor: crosshair !important; +} + +.cursor\:not-allowed { + cursor: not-allowed !important; +} + +.cursor\:all-scroll { + cursor: all-scroll !important; +} + +.cursor\:none { + cursor: none !important; +} + +.cursor\:wait { + cursor: wait !important; +} + +.cursor\:text { + cursor: text !important; +} + +.cursor\:grab { + cursor: grab !important; +} + +.cursor\:grabbing { + cursor: grabbing !important; +} + +.cursor\:move { + cursor: move !important; +} + +.cursor\:copy { + cursor: copy !important; +} + +.cursor\:progress { + cursor: progress !important; +} + +.cursor\:help { + cursor: help !important; +} + +.cursor\:zoom-in { + cursor: zoom-in !important; +} + +.cursor\:zoom-out { + cursor: zoom-out !important; +} + +.cursor\:alias { + cursor: alias !important; +} + +.cursor\:row-resize { + cursor: row-resize !important; +} + +.cursor\:col-resize { + cursor: col-resize !important; +} + +.cursor\:cell { + cursor: cell !important; +} + +.cursor\:e-resize { + cursor: e-resize !important; +} + +.cursor\:ew-resize { + cursor: ew-resize !important; +} + +.cursor\:context-menu { + cursor: context-menu !important; +} + +.h\:-1 { + height: -10px !important; +} + +.w\:-1 { + width: -10px !important; +} + +.max-h\:-1 { + max-height: -10px !important; +} + +.max-w\:-1 { + max-width: -10px !important; +} + +.min-h\:-1 { + min-height: -10px !important; +} + +.min-w\:-1 { + min-width: -10px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:-1 { + height: -10px !important; + } + + .w-xs\:-1 { + width: -10px !important; + } + + .max-h-xs\:-1 { + max-height: -10px !important; + } + + .max-w-xs\:-1 { + max-width: -10px !important; + } + + .min-h-xs\:-1 { + min-height: -10px !important; + } + + .min-w-xs\:-1 { + min-width: -10px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:-1 { + height: -10px !important; + } + + .w-sm\:-1 { + width: -10px !important; + } + + .max-h-sm\:-1 { + max-height: -10px !important; + } + + .max-w-sm\:-1 { + max-width: -10px !important; + } + + .min-h-sm\:-1 { + min-height: -10px !important; + } + + .min-w-sm\:-1 { + min-width: -10px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:-1 { + height: -10px !important; + } + + .w-sm-up\:-1 { + width: -10px !important; + } + + .max-h-sm-up\:-1 { + max-height: -10px !important; + } + + .max-w-sm-up\:-1 { + max-width: -10px !important; + } + + .min-h-sm-up\:-1 { + min-height: -10px !important; + } + + .min-w-sm-up\:-1 { + min-width: -10px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:-1 { + height: -10px !important; + } + + .w-sm-down\:-1 { + width: -10px !important; + } + + .max-h-sm-down\:-1 { + max-height: -10px !important; + } + + .max-w-sm-down\:-1 { + max-width: -10px !important; + } + + .min-h-sm-down\:-1 { + min-height: -10px !important; + } + + .min-w-sm-down\:-1 { + min-width: -10px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:-1 { + height: -10px !important; + } + + .w-md\:-1 { + width: -10px !important; + } + + .max-h-md\:-1 { + max-height: -10px !important; + } + + .max-w-md\:-1 { + max-width: -10px !important; + } + + .min-h-md\:-1 { + min-height: -10px !important; + } + + .min-w-md\:-1 { + min-width: -10px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:-1 { + height: -10px !important; + } + + .w-md-up\:-1 { + width: -10px !important; + } + + .max-h-md-up\:-1 { + max-height: -10px !important; + } + + .max-w-md-up\:-1 { + max-width: -10px !important; + } + + .min-h-md-up\:-1 { + min-height: -10px !important; + } + + .min-w-md-up\:-1 { + min-width: -10px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:-1 { + height: -10px !important; + } + + .w-md-down\:-1 { + width: -10px !important; + } + + .max-h-md-down\:-1 { + max-height: -10px !important; + } + + .max-w-md-down\:-1 { + max-width: -10px !important; + } + + .min-h-md-down\:-1 { + min-height: -10px !important; + } + + .min-w-md-down\:-1 { + min-width: -10px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:-1 { + height: -10px !important; + } + + .w-lg\:-1 { + width: -10px !important; + } + + .max-h-lg\:-1 { + max-height: -10px !important; + } + + .max-w-lg\:-1 { + max-width: -10px !important; + } + + .min-h-lg\:-1 { + min-height: -10px !important; + } + + .min-w-lg\:-1 { + min-width: -10px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:-1 { + height: -10px !important; + } + + .w-lg-up\:-1 { + width: -10px !important; + } + + .max-h-lg-up\:-1 { + max-height: -10px !important; + } + + .max-w-lg-up\:-1 { + max-width: -10px !important; + } + + .min-h-lg-up\:-1 { + min-height: -10px !important; + } + + .min-w-lg-up\:-1 { + min-width: -10px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:-1 { + height: -10px !important; + } + + .w-lg-down\:-1 { + width: -10px !important; + } + + .max-h-lg-down\:-1 { + max-height: -10px !important; + } + + .max-w-lg-down\:-1 { + max-width: -10px !important; + } + + .min-h-lg-down\:-1 { + min-height: -10px !important; + } + + .min-w-lg-down\:-1 { + min-width: -10px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:-1 { + height: -10px !important; + } + + .w-xl\:-1 { + width: -10px !important; + } + + .max-h-xl\:-1 { + max-height: -10px !important; + } + + .max-w-xl\:-1 { + max-width: -10px !important; + } + + .min-h-xl\:-1 { + min-height: -10px !important; + } + + .min-w-xl\:-1 { + min-width: -10px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:-1 { + height: -10px !important; + } + + .w-xl-up\:-1 { + width: -10px !important; + } + + .max-h-xl-up\:-1 { + max-height: -10px !important; + } + + .max-w-xl-up\:-1 { + max-width: -10px !important; + } + + .min-h-xl-up\:-1 { + min-height: -10px !important; + } + + .min-w-xl-up\:-1 { + min-width: -10px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:-1 { + height: -10px !important; + } + + .w-xl-down\:-1 { + width: -10px !important; + } + + .max-h-xl-down\:-1 { + max-height: -10px !important; + } + + .max-w-xl-down\:-1 { + max-width: -10px !important; + } + + .min-h-xl-down\:-1 { + min-height: -10px !important; + } + + .min-w-xl-down\:-1 { + min-width: -10px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:-1 { + height: -10px !important; + } + + .w-xxl\:-1 { + width: -10px !important; + } + + .max-h-xxl\:-1 { + max-height: -10px !important; + } + + .max-w-xxl\:-1 { + max-width: -10px !important; + } + + .min-h-xxl\:-1 { + min-height: -10px !important; + } + + .min-w-xxl\:-1 { + min-width: -10px !important; + } +} +.h\:-2 { + height: -20px !important; +} + +.w\:-2 { + width: -20px !important; +} + +.max-h\:-2 { + max-height: -20px !important; +} + +.max-w\:-2 { + max-width: -20px !important; +} + +.min-h\:-2 { + min-height: -20px !important; +} + +.min-w\:-2 { + min-width: -20px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:-2 { + height: -20px !important; + } + + .w-xs\:-2 { + width: -20px !important; + } + + .max-h-xs\:-2 { + max-height: -20px !important; + } + + .max-w-xs\:-2 { + max-width: -20px !important; + } + + .min-h-xs\:-2 { + min-height: -20px !important; + } + + .min-w-xs\:-2 { + min-width: -20px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:-2 { + height: -20px !important; + } + + .w-sm\:-2 { + width: -20px !important; + } + + .max-h-sm\:-2 { + max-height: -20px !important; + } + + .max-w-sm\:-2 { + max-width: -20px !important; + } + + .min-h-sm\:-2 { + min-height: -20px !important; + } + + .min-w-sm\:-2 { + min-width: -20px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:-2 { + height: -20px !important; + } + + .w-sm-up\:-2 { + width: -20px !important; + } + + .max-h-sm-up\:-2 { + max-height: -20px !important; + } + + .max-w-sm-up\:-2 { + max-width: -20px !important; + } + + .min-h-sm-up\:-2 { + min-height: -20px !important; + } + + .min-w-sm-up\:-2 { + min-width: -20px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:-2 { + height: -20px !important; + } + + .w-sm-down\:-2 { + width: -20px !important; + } + + .max-h-sm-down\:-2 { + max-height: -20px !important; + } + + .max-w-sm-down\:-2 { + max-width: -20px !important; + } + + .min-h-sm-down\:-2 { + min-height: -20px !important; + } + + .min-w-sm-down\:-2 { + min-width: -20px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:-2 { + height: -20px !important; + } + + .w-md\:-2 { + width: -20px !important; + } + + .max-h-md\:-2 { + max-height: -20px !important; + } + + .max-w-md\:-2 { + max-width: -20px !important; + } + + .min-h-md\:-2 { + min-height: -20px !important; + } + + .min-w-md\:-2 { + min-width: -20px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:-2 { + height: -20px !important; + } + + .w-md-up\:-2 { + width: -20px !important; + } + + .max-h-md-up\:-2 { + max-height: -20px !important; + } + + .max-w-md-up\:-2 { + max-width: -20px !important; + } + + .min-h-md-up\:-2 { + min-height: -20px !important; + } + + .min-w-md-up\:-2 { + min-width: -20px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:-2 { + height: -20px !important; + } + + .w-md-down\:-2 { + width: -20px !important; + } + + .max-h-md-down\:-2 { + max-height: -20px !important; + } + + .max-w-md-down\:-2 { + max-width: -20px !important; + } + + .min-h-md-down\:-2 { + min-height: -20px !important; + } + + .min-w-md-down\:-2 { + min-width: -20px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:-2 { + height: -20px !important; + } + + .w-lg\:-2 { + width: -20px !important; + } + + .max-h-lg\:-2 { + max-height: -20px !important; + } + + .max-w-lg\:-2 { + max-width: -20px !important; + } + + .min-h-lg\:-2 { + min-height: -20px !important; + } + + .min-w-lg\:-2 { + min-width: -20px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:-2 { + height: -20px !important; + } + + .w-lg-up\:-2 { + width: -20px !important; + } + + .max-h-lg-up\:-2 { + max-height: -20px !important; + } + + .max-w-lg-up\:-2 { + max-width: -20px !important; + } + + .min-h-lg-up\:-2 { + min-height: -20px !important; + } + + .min-w-lg-up\:-2 { + min-width: -20px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:-2 { + height: -20px !important; + } + + .w-lg-down\:-2 { + width: -20px !important; + } + + .max-h-lg-down\:-2 { + max-height: -20px !important; + } + + .max-w-lg-down\:-2 { + max-width: -20px !important; + } + + .min-h-lg-down\:-2 { + min-height: -20px !important; + } + + .min-w-lg-down\:-2 { + min-width: -20px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:-2 { + height: -20px !important; + } + + .w-xl\:-2 { + width: -20px !important; + } + + .max-h-xl\:-2 { + max-height: -20px !important; + } + + .max-w-xl\:-2 { + max-width: -20px !important; + } + + .min-h-xl\:-2 { + min-height: -20px !important; + } + + .min-w-xl\:-2 { + min-width: -20px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:-2 { + height: -20px !important; + } + + .w-xl-up\:-2 { + width: -20px !important; + } + + .max-h-xl-up\:-2 { + max-height: -20px !important; + } + + .max-w-xl-up\:-2 { + max-width: -20px !important; + } + + .min-h-xl-up\:-2 { + min-height: -20px !important; + } + + .min-w-xl-up\:-2 { + min-width: -20px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:-2 { + height: -20px !important; + } + + .w-xl-down\:-2 { + width: -20px !important; + } + + .max-h-xl-down\:-2 { + max-height: -20px !important; + } + + .max-w-xl-down\:-2 { + max-width: -20px !important; + } + + .min-h-xl-down\:-2 { + min-height: -20px !important; + } + + .min-w-xl-down\:-2 { + min-width: -20px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:-2 { + height: -20px !important; + } + + .w-xxl\:-2 { + width: -20px !important; + } + + .max-h-xxl\:-2 { + max-height: -20px !important; + } + + .max-w-xxl\:-2 { + max-width: -20px !important; + } + + .min-h-xxl\:-2 { + min-height: -20px !important; + } + + .min-w-xxl\:-2 { + min-width: -20px !important; + } +} +.h\:-3 { + height: -30px !important; +} + +.w\:-3 { + width: -30px !important; +} + +.max-h\:-3 { + max-height: -30px !important; +} + +.max-w\:-3 { + max-width: -30px !important; +} + +.min-h\:-3 { + min-height: -30px !important; +} + +.min-w\:-3 { + min-width: -30px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:-3 { + height: -30px !important; + } + + .w-xs\:-3 { + width: -30px !important; + } + + .max-h-xs\:-3 { + max-height: -30px !important; + } + + .max-w-xs\:-3 { + max-width: -30px !important; + } + + .min-h-xs\:-3 { + min-height: -30px !important; + } + + .min-w-xs\:-3 { + min-width: -30px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:-3 { + height: -30px !important; + } + + .w-sm\:-3 { + width: -30px !important; + } + + .max-h-sm\:-3 { + max-height: -30px !important; + } + + .max-w-sm\:-3 { + max-width: -30px !important; + } + + .min-h-sm\:-3 { + min-height: -30px !important; + } + + .min-w-sm\:-3 { + min-width: -30px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:-3 { + height: -30px !important; + } + + .w-sm-up\:-3 { + width: -30px !important; + } + + .max-h-sm-up\:-3 { + max-height: -30px !important; + } + + .max-w-sm-up\:-3 { + max-width: -30px !important; + } + + .min-h-sm-up\:-3 { + min-height: -30px !important; + } + + .min-w-sm-up\:-3 { + min-width: -30px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:-3 { + height: -30px !important; + } + + .w-sm-down\:-3 { + width: -30px !important; + } + + .max-h-sm-down\:-3 { + max-height: -30px !important; + } + + .max-w-sm-down\:-3 { + max-width: -30px !important; + } + + .min-h-sm-down\:-3 { + min-height: -30px !important; + } + + .min-w-sm-down\:-3 { + min-width: -30px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:-3 { + height: -30px !important; + } + + .w-md\:-3 { + width: -30px !important; + } + + .max-h-md\:-3 { + max-height: -30px !important; + } + + .max-w-md\:-3 { + max-width: -30px !important; + } + + .min-h-md\:-3 { + min-height: -30px !important; + } + + .min-w-md\:-3 { + min-width: -30px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:-3 { + height: -30px !important; + } + + .w-md-up\:-3 { + width: -30px !important; + } + + .max-h-md-up\:-3 { + max-height: -30px !important; + } + + .max-w-md-up\:-3 { + max-width: -30px !important; + } + + .min-h-md-up\:-3 { + min-height: -30px !important; + } + + .min-w-md-up\:-3 { + min-width: -30px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:-3 { + height: -30px !important; + } + + .w-md-down\:-3 { + width: -30px !important; + } + + .max-h-md-down\:-3 { + max-height: -30px !important; + } + + .max-w-md-down\:-3 { + max-width: -30px !important; + } + + .min-h-md-down\:-3 { + min-height: -30px !important; + } + + .min-w-md-down\:-3 { + min-width: -30px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:-3 { + height: -30px !important; + } + + .w-lg\:-3 { + width: -30px !important; + } + + .max-h-lg\:-3 { + max-height: -30px !important; + } + + .max-w-lg\:-3 { + max-width: -30px !important; + } + + .min-h-lg\:-3 { + min-height: -30px !important; + } + + .min-w-lg\:-3 { + min-width: -30px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:-3 { + height: -30px !important; + } + + .w-lg-up\:-3 { + width: -30px !important; + } + + .max-h-lg-up\:-3 { + max-height: -30px !important; + } + + .max-w-lg-up\:-3 { + max-width: -30px !important; + } + + .min-h-lg-up\:-3 { + min-height: -30px !important; + } + + .min-w-lg-up\:-3 { + min-width: -30px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:-3 { + height: -30px !important; + } + + .w-lg-down\:-3 { + width: -30px !important; + } + + .max-h-lg-down\:-3 { + max-height: -30px !important; + } + + .max-w-lg-down\:-3 { + max-width: -30px !important; + } + + .min-h-lg-down\:-3 { + min-height: -30px !important; + } + + .min-w-lg-down\:-3 { + min-width: -30px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:-3 { + height: -30px !important; + } + + .w-xl\:-3 { + width: -30px !important; + } + + .max-h-xl\:-3 { + max-height: -30px !important; + } + + .max-w-xl\:-3 { + max-width: -30px !important; + } + + .min-h-xl\:-3 { + min-height: -30px !important; + } + + .min-w-xl\:-3 { + min-width: -30px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:-3 { + height: -30px !important; + } + + .w-xl-up\:-3 { + width: -30px !important; + } + + .max-h-xl-up\:-3 { + max-height: -30px !important; + } + + .max-w-xl-up\:-3 { + max-width: -30px !important; + } + + .min-h-xl-up\:-3 { + min-height: -30px !important; + } + + .min-w-xl-up\:-3 { + min-width: -30px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:-3 { + height: -30px !important; + } + + .w-xl-down\:-3 { + width: -30px !important; + } + + .max-h-xl-down\:-3 { + max-height: -30px !important; + } + + .max-w-xl-down\:-3 { + max-width: -30px !important; + } + + .min-h-xl-down\:-3 { + min-height: -30px !important; + } + + .min-w-xl-down\:-3 { + min-width: -30px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:-3 { + height: -30px !important; + } + + .w-xxl\:-3 { + width: -30px !important; + } + + .max-h-xxl\:-3 { + max-height: -30px !important; + } + + .max-w-xxl\:-3 { + max-width: -30px !important; + } + + .min-h-xxl\:-3 { + min-height: -30px !important; + } + + .min-w-xxl\:-3 { + min-width: -30px !important; + } +} +.h\:-4 { + height: -40px !important; +} + +.w\:-4 { + width: -40px !important; +} + +.max-h\:-4 { + max-height: -40px !important; +} + +.max-w\:-4 { + max-width: -40px !important; +} + +.min-h\:-4 { + min-height: -40px !important; +} + +.min-w\:-4 { + min-width: -40px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:-4 { + height: -40px !important; + } + + .w-xs\:-4 { + width: -40px !important; + } + + .max-h-xs\:-4 { + max-height: -40px !important; + } + + .max-w-xs\:-4 { + max-width: -40px !important; + } + + .min-h-xs\:-4 { + min-height: -40px !important; + } + + .min-w-xs\:-4 { + min-width: -40px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:-4 { + height: -40px !important; + } + + .w-sm\:-4 { + width: -40px !important; + } + + .max-h-sm\:-4 { + max-height: -40px !important; + } + + .max-w-sm\:-4 { + max-width: -40px !important; + } + + .min-h-sm\:-4 { + min-height: -40px !important; + } + + .min-w-sm\:-4 { + min-width: -40px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:-4 { + height: -40px !important; + } + + .w-sm-up\:-4 { + width: -40px !important; + } + + .max-h-sm-up\:-4 { + max-height: -40px !important; + } + + .max-w-sm-up\:-4 { + max-width: -40px !important; + } + + .min-h-sm-up\:-4 { + min-height: -40px !important; + } + + .min-w-sm-up\:-4 { + min-width: -40px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:-4 { + height: -40px !important; + } + + .w-sm-down\:-4 { + width: -40px !important; + } + + .max-h-sm-down\:-4 { + max-height: -40px !important; + } + + .max-w-sm-down\:-4 { + max-width: -40px !important; + } + + .min-h-sm-down\:-4 { + min-height: -40px !important; + } + + .min-w-sm-down\:-4 { + min-width: -40px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:-4 { + height: -40px !important; + } + + .w-md\:-4 { + width: -40px !important; + } + + .max-h-md\:-4 { + max-height: -40px !important; + } + + .max-w-md\:-4 { + max-width: -40px !important; + } + + .min-h-md\:-4 { + min-height: -40px !important; + } + + .min-w-md\:-4 { + min-width: -40px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:-4 { + height: -40px !important; + } + + .w-md-up\:-4 { + width: -40px !important; + } + + .max-h-md-up\:-4 { + max-height: -40px !important; + } + + .max-w-md-up\:-4 { + max-width: -40px !important; + } + + .min-h-md-up\:-4 { + min-height: -40px !important; + } + + .min-w-md-up\:-4 { + min-width: -40px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:-4 { + height: -40px !important; + } + + .w-md-down\:-4 { + width: -40px !important; + } + + .max-h-md-down\:-4 { + max-height: -40px !important; + } + + .max-w-md-down\:-4 { + max-width: -40px !important; + } + + .min-h-md-down\:-4 { + min-height: -40px !important; + } + + .min-w-md-down\:-4 { + min-width: -40px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:-4 { + height: -40px !important; + } + + .w-lg\:-4 { + width: -40px !important; + } + + .max-h-lg\:-4 { + max-height: -40px !important; + } + + .max-w-lg\:-4 { + max-width: -40px !important; + } + + .min-h-lg\:-4 { + min-height: -40px !important; + } + + .min-w-lg\:-4 { + min-width: -40px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:-4 { + height: -40px !important; + } + + .w-lg-up\:-4 { + width: -40px !important; + } + + .max-h-lg-up\:-4 { + max-height: -40px !important; + } + + .max-w-lg-up\:-4 { + max-width: -40px !important; + } + + .min-h-lg-up\:-4 { + min-height: -40px !important; + } + + .min-w-lg-up\:-4 { + min-width: -40px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:-4 { + height: -40px !important; + } + + .w-lg-down\:-4 { + width: -40px !important; + } + + .max-h-lg-down\:-4 { + max-height: -40px !important; + } + + .max-w-lg-down\:-4 { + max-width: -40px !important; + } + + .min-h-lg-down\:-4 { + min-height: -40px !important; + } + + .min-w-lg-down\:-4 { + min-width: -40px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:-4 { + height: -40px !important; + } + + .w-xl\:-4 { + width: -40px !important; + } + + .max-h-xl\:-4 { + max-height: -40px !important; + } + + .max-w-xl\:-4 { + max-width: -40px !important; + } + + .min-h-xl\:-4 { + min-height: -40px !important; + } + + .min-w-xl\:-4 { + min-width: -40px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:-4 { + height: -40px !important; + } + + .w-xl-up\:-4 { + width: -40px !important; + } + + .max-h-xl-up\:-4 { + max-height: -40px !important; + } + + .max-w-xl-up\:-4 { + max-width: -40px !important; + } + + .min-h-xl-up\:-4 { + min-height: -40px !important; + } + + .min-w-xl-up\:-4 { + min-width: -40px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:-4 { + height: -40px !important; + } + + .w-xl-down\:-4 { + width: -40px !important; + } + + .max-h-xl-down\:-4 { + max-height: -40px !important; + } + + .max-w-xl-down\:-4 { + max-width: -40px !important; + } + + .min-h-xl-down\:-4 { + min-height: -40px !important; + } + + .min-w-xl-down\:-4 { + min-width: -40px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:-4 { + height: -40px !important; + } + + .w-xxl\:-4 { + width: -40px !important; + } + + .max-h-xxl\:-4 { + max-height: -40px !important; + } + + .max-w-xxl\:-4 { + max-width: -40px !important; + } + + .min-h-xxl\:-4 { + min-height: -40px !important; + } + + .min-w-xxl\:-4 { + min-width: -40px !important; + } +} +.h\:-5 { + height: -50px !important; +} + +.w\:-5 { + width: -50px !important; +} + +.max-h\:-5 { + max-height: -50px !important; +} + +.max-w\:-5 { + max-width: -50px !important; +} + +.min-h\:-5 { + min-height: -50px !important; +} + +.min-w\:-5 { + min-width: -50px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:-5 { + height: -50px !important; + } + + .w-xs\:-5 { + width: -50px !important; + } + + .max-h-xs\:-5 { + max-height: -50px !important; + } + + .max-w-xs\:-5 { + max-width: -50px !important; + } + + .min-h-xs\:-5 { + min-height: -50px !important; + } + + .min-w-xs\:-5 { + min-width: -50px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:-5 { + height: -50px !important; + } + + .w-sm\:-5 { + width: -50px !important; + } + + .max-h-sm\:-5 { + max-height: -50px !important; + } + + .max-w-sm\:-5 { + max-width: -50px !important; + } + + .min-h-sm\:-5 { + min-height: -50px !important; + } + + .min-w-sm\:-5 { + min-width: -50px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:-5 { + height: -50px !important; + } + + .w-sm-up\:-5 { + width: -50px !important; + } + + .max-h-sm-up\:-5 { + max-height: -50px !important; + } + + .max-w-sm-up\:-5 { + max-width: -50px !important; + } + + .min-h-sm-up\:-5 { + min-height: -50px !important; + } + + .min-w-sm-up\:-5 { + min-width: -50px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:-5 { + height: -50px !important; + } + + .w-sm-down\:-5 { + width: -50px !important; + } + + .max-h-sm-down\:-5 { + max-height: -50px !important; + } + + .max-w-sm-down\:-5 { + max-width: -50px !important; + } + + .min-h-sm-down\:-5 { + min-height: -50px !important; + } + + .min-w-sm-down\:-5 { + min-width: -50px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:-5 { + height: -50px !important; + } + + .w-md\:-5 { + width: -50px !important; + } + + .max-h-md\:-5 { + max-height: -50px !important; + } + + .max-w-md\:-5 { + max-width: -50px !important; + } + + .min-h-md\:-5 { + min-height: -50px !important; + } + + .min-w-md\:-5 { + min-width: -50px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:-5 { + height: -50px !important; + } + + .w-md-up\:-5 { + width: -50px !important; + } + + .max-h-md-up\:-5 { + max-height: -50px !important; + } + + .max-w-md-up\:-5 { + max-width: -50px !important; + } + + .min-h-md-up\:-5 { + min-height: -50px !important; + } + + .min-w-md-up\:-5 { + min-width: -50px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:-5 { + height: -50px !important; + } + + .w-md-down\:-5 { + width: -50px !important; + } + + .max-h-md-down\:-5 { + max-height: -50px !important; + } + + .max-w-md-down\:-5 { + max-width: -50px !important; + } + + .min-h-md-down\:-5 { + min-height: -50px !important; + } + + .min-w-md-down\:-5 { + min-width: -50px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:-5 { + height: -50px !important; + } + + .w-lg\:-5 { + width: -50px !important; + } + + .max-h-lg\:-5 { + max-height: -50px !important; + } + + .max-w-lg\:-5 { + max-width: -50px !important; + } + + .min-h-lg\:-5 { + min-height: -50px !important; + } + + .min-w-lg\:-5 { + min-width: -50px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:-5 { + height: -50px !important; + } + + .w-lg-up\:-5 { + width: -50px !important; + } + + .max-h-lg-up\:-5 { + max-height: -50px !important; + } + + .max-w-lg-up\:-5 { + max-width: -50px !important; + } + + .min-h-lg-up\:-5 { + min-height: -50px !important; + } + + .min-w-lg-up\:-5 { + min-width: -50px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:-5 { + height: -50px !important; + } + + .w-lg-down\:-5 { + width: -50px !important; + } + + .max-h-lg-down\:-5 { + max-height: -50px !important; + } + + .max-w-lg-down\:-5 { + max-width: -50px !important; + } + + .min-h-lg-down\:-5 { + min-height: -50px !important; + } + + .min-w-lg-down\:-5 { + min-width: -50px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:-5 { + height: -50px !important; + } + + .w-xl\:-5 { + width: -50px !important; + } + + .max-h-xl\:-5 { + max-height: -50px !important; + } + + .max-w-xl\:-5 { + max-width: -50px !important; + } + + .min-h-xl\:-5 { + min-height: -50px !important; + } + + .min-w-xl\:-5 { + min-width: -50px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:-5 { + height: -50px !important; + } + + .w-xl-up\:-5 { + width: -50px !important; + } + + .max-h-xl-up\:-5 { + max-height: -50px !important; + } + + .max-w-xl-up\:-5 { + max-width: -50px !important; + } + + .min-h-xl-up\:-5 { + min-height: -50px !important; + } + + .min-w-xl-up\:-5 { + min-width: -50px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:-5 { + height: -50px !important; + } + + .w-xl-down\:-5 { + width: -50px !important; + } + + .max-h-xl-down\:-5 { + max-height: -50px !important; + } + + .max-w-xl-down\:-5 { + max-width: -50px !important; + } + + .min-h-xl-down\:-5 { + min-height: -50px !important; + } + + .min-w-xl-down\:-5 { + min-width: -50px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:-5 { + height: -50px !important; + } + + .w-xxl\:-5 { + width: -50px !important; + } + + .max-h-xxl\:-5 { + max-height: -50px !important; + } + + .max-w-xxl\:-5 { + max-width: -50px !important; + } + + .min-h-xxl\:-5 { + min-height: -50px !important; + } + + .min-w-xxl\:-5 { + min-width: -50px !important; + } +} +.h\:-6 { + height: -60px !important; +} + +.w\:-6 { + width: -60px !important; +} + +.max-h\:-6 { + max-height: -60px !important; +} + +.max-w\:-6 { + max-width: -60px !important; +} + +.min-h\:-6 { + min-height: -60px !important; +} + +.min-w\:-6 { + min-width: -60px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:-6 { + height: -60px !important; + } + + .w-xs\:-6 { + width: -60px !important; + } + + .max-h-xs\:-6 { + max-height: -60px !important; + } + + .max-w-xs\:-6 { + max-width: -60px !important; + } + + .min-h-xs\:-6 { + min-height: -60px !important; + } + + .min-w-xs\:-6 { + min-width: -60px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:-6 { + height: -60px !important; + } + + .w-sm\:-6 { + width: -60px !important; + } + + .max-h-sm\:-6 { + max-height: -60px !important; + } + + .max-w-sm\:-6 { + max-width: -60px !important; + } + + .min-h-sm\:-6 { + min-height: -60px !important; + } + + .min-w-sm\:-6 { + min-width: -60px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:-6 { + height: -60px !important; + } + + .w-sm-up\:-6 { + width: -60px !important; + } + + .max-h-sm-up\:-6 { + max-height: -60px !important; + } + + .max-w-sm-up\:-6 { + max-width: -60px !important; + } + + .min-h-sm-up\:-6 { + min-height: -60px !important; + } + + .min-w-sm-up\:-6 { + min-width: -60px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:-6 { + height: -60px !important; + } + + .w-sm-down\:-6 { + width: -60px !important; + } + + .max-h-sm-down\:-6 { + max-height: -60px !important; + } + + .max-w-sm-down\:-6 { + max-width: -60px !important; + } + + .min-h-sm-down\:-6 { + min-height: -60px !important; + } + + .min-w-sm-down\:-6 { + min-width: -60px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:-6 { + height: -60px !important; + } + + .w-md\:-6 { + width: -60px !important; + } + + .max-h-md\:-6 { + max-height: -60px !important; + } + + .max-w-md\:-6 { + max-width: -60px !important; + } + + .min-h-md\:-6 { + min-height: -60px !important; + } + + .min-w-md\:-6 { + min-width: -60px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:-6 { + height: -60px !important; + } + + .w-md-up\:-6 { + width: -60px !important; + } + + .max-h-md-up\:-6 { + max-height: -60px !important; + } + + .max-w-md-up\:-6 { + max-width: -60px !important; + } + + .min-h-md-up\:-6 { + min-height: -60px !important; + } + + .min-w-md-up\:-6 { + min-width: -60px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:-6 { + height: -60px !important; + } + + .w-md-down\:-6 { + width: -60px !important; + } + + .max-h-md-down\:-6 { + max-height: -60px !important; + } + + .max-w-md-down\:-6 { + max-width: -60px !important; + } + + .min-h-md-down\:-6 { + min-height: -60px !important; + } + + .min-w-md-down\:-6 { + min-width: -60px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:-6 { + height: -60px !important; + } + + .w-lg\:-6 { + width: -60px !important; + } + + .max-h-lg\:-6 { + max-height: -60px !important; + } + + .max-w-lg\:-6 { + max-width: -60px !important; + } + + .min-h-lg\:-6 { + min-height: -60px !important; + } + + .min-w-lg\:-6 { + min-width: -60px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:-6 { + height: -60px !important; + } + + .w-lg-up\:-6 { + width: -60px !important; + } + + .max-h-lg-up\:-6 { + max-height: -60px !important; + } + + .max-w-lg-up\:-6 { + max-width: -60px !important; + } + + .min-h-lg-up\:-6 { + min-height: -60px !important; + } + + .min-w-lg-up\:-6 { + min-width: -60px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:-6 { + height: -60px !important; + } + + .w-lg-down\:-6 { + width: -60px !important; + } + + .max-h-lg-down\:-6 { + max-height: -60px !important; + } + + .max-w-lg-down\:-6 { + max-width: -60px !important; + } + + .min-h-lg-down\:-6 { + min-height: -60px !important; + } + + .min-w-lg-down\:-6 { + min-width: -60px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:-6 { + height: -60px !important; + } + + .w-xl\:-6 { + width: -60px !important; + } + + .max-h-xl\:-6 { + max-height: -60px !important; + } + + .max-w-xl\:-6 { + max-width: -60px !important; + } + + .min-h-xl\:-6 { + min-height: -60px !important; + } + + .min-w-xl\:-6 { + min-width: -60px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:-6 { + height: -60px !important; + } + + .w-xl-up\:-6 { + width: -60px !important; + } + + .max-h-xl-up\:-6 { + max-height: -60px !important; + } + + .max-w-xl-up\:-6 { + max-width: -60px !important; + } + + .min-h-xl-up\:-6 { + min-height: -60px !important; + } + + .min-w-xl-up\:-6 { + min-width: -60px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:-6 { + height: -60px !important; + } + + .w-xl-down\:-6 { + width: -60px !important; + } + + .max-h-xl-down\:-6 { + max-height: -60px !important; + } + + .max-w-xl-down\:-6 { + max-width: -60px !important; + } + + .min-h-xl-down\:-6 { + min-height: -60px !important; + } + + .min-w-xl-down\:-6 { + min-width: -60px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:-6 { + height: -60px !important; + } + + .w-xxl\:-6 { + width: -60px !important; + } + + .max-h-xxl\:-6 { + max-height: -60px !important; + } + + .max-w-xxl\:-6 { + max-width: -60px !important; + } + + .min-h-xxl\:-6 { + min-height: -60px !important; + } + + .min-w-xxl\:-6 { + min-width: -60px !important; + } +} +.h\:-7 { + height: -70px !important; +} + +.w\:-7 { + width: -70px !important; +} + +.max-h\:-7 { + max-height: -70px !important; +} + +.max-w\:-7 { + max-width: -70px !important; +} + +.min-h\:-7 { + min-height: -70px !important; +} + +.min-w\:-7 { + min-width: -70px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:-7 { + height: -70px !important; + } + + .w-xs\:-7 { + width: -70px !important; + } + + .max-h-xs\:-7 { + max-height: -70px !important; + } + + .max-w-xs\:-7 { + max-width: -70px !important; + } + + .min-h-xs\:-7 { + min-height: -70px !important; + } + + .min-w-xs\:-7 { + min-width: -70px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:-7 { + height: -70px !important; + } + + .w-sm\:-7 { + width: -70px !important; + } + + .max-h-sm\:-7 { + max-height: -70px !important; + } + + .max-w-sm\:-7 { + max-width: -70px !important; + } + + .min-h-sm\:-7 { + min-height: -70px !important; + } + + .min-w-sm\:-7 { + min-width: -70px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:-7 { + height: -70px !important; + } + + .w-sm-up\:-7 { + width: -70px !important; + } + + .max-h-sm-up\:-7 { + max-height: -70px !important; + } + + .max-w-sm-up\:-7 { + max-width: -70px !important; + } + + .min-h-sm-up\:-7 { + min-height: -70px !important; + } + + .min-w-sm-up\:-7 { + min-width: -70px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:-7 { + height: -70px !important; + } + + .w-sm-down\:-7 { + width: -70px !important; + } + + .max-h-sm-down\:-7 { + max-height: -70px !important; + } + + .max-w-sm-down\:-7 { + max-width: -70px !important; + } + + .min-h-sm-down\:-7 { + min-height: -70px !important; + } + + .min-w-sm-down\:-7 { + min-width: -70px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:-7 { + height: -70px !important; + } + + .w-md\:-7 { + width: -70px !important; + } + + .max-h-md\:-7 { + max-height: -70px !important; + } + + .max-w-md\:-7 { + max-width: -70px !important; + } + + .min-h-md\:-7 { + min-height: -70px !important; + } + + .min-w-md\:-7 { + min-width: -70px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:-7 { + height: -70px !important; + } + + .w-md-up\:-7 { + width: -70px !important; + } + + .max-h-md-up\:-7 { + max-height: -70px !important; + } + + .max-w-md-up\:-7 { + max-width: -70px !important; + } + + .min-h-md-up\:-7 { + min-height: -70px !important; + } + + .min-w-md-up\:-7 { + min-width: -70px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:-7 { + height: -70px !important; + } + + .w-md-down\:-7 { + width: -70px !important; + } + + .max-h-md-down\:-7 { + max-height: -70px !important; + } + + .max-w-md-down\:-7 { + max-width: -70px !important; + } + + .min-h-md-down\:-7 { + min-height: -70px !important; + } + + .min-w-md-down\:-7 { + min-width: -70px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:-7 { + height: -70px !important; + } + + .w-lg\:-7 { + width: -70px !important; + } + + .max-h-lg\:-7 { + max-height: -70px !important; + } + + .max-w-lg\:-7 { + max-width: -70px !important; + } + + .min-h-lg\:-7 { + min-height: -70px !important; + } + + .min-w-lg\:-7 { + min-width: -70px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:-7 { + height: -70px !important; + } + + .w-lg-up\:-7 { + width: -70px !important; + } + + .max-h-lg-up\:-7 { + max-height: -70px !important; + } + + .max-w-lg-up\:-7 { + max-width: -70px !important; + } + + .min-h-lg-up\:-7 { + min-height: -70px !important; + } + + .min-w-lg-up\:-7 { + min-width: -70px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:-7 { + height: -70px !important; + } + + .w-lg-down\:-7 { + width: -70px !important; + } + + .max-h-lg-down\:-7 { + max-height: -70px !important; + } + + .max-w-lg-down\:-7 { + max-width: -70px !important; + } + + .min-h-lg-down\:-7 { + min-height: -70px !important; + } + + .min-w-lg-down\:-7 { + min-width: -70px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:-7 { + height: -70px !important; + } + + .w-xl\:-7 { + width: -70px !important; + } + + .max-h-xl\:-7 { + max-height: -70px !important; + } + + .max-w-xl\:-7 { + max-width: -70px !important; + } + + .min-h-xl\:-7 { + min-height: -70px !important; + } + + .min-w-xl\:-7 { + min-width: -70px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:-7 { + height: -70px !important; + } + + .w-xl-up\:-7 { + width: -70px !important; + } + + .max-h-xl-up\:-7 { + max-height: -70px !important; + } + + .max-w-xl-up\:-7 { + max-width: -70px !important; + } + + .min-h-xl-up\:-7 { + min-height: -70px !important; + } + + .min-w-xl-up\:-7 { + min-width: -70px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:-7 { + height: -70px !important; + } + + .w-xl-down\:-7 { + width: -70px !important; + } + + .max-h-xl-down\:-7 { + max-height: -70px !important; + } + + .max-w-xl-down\:-7 { + max-width: -70px !important; + } + + .min-h-xl-down\:-7 { + min-height: -70px !important; + } + + .min-w-xl-down\:-7 { + min-width: -70px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:-7 { + height: -70px !important; + } + + .w-xxl\:-7 { + width: -70px !important; + } + + .max-h-xxl\:-7 { + max-height: -70px !important; + } + + .max-w-xxl\:-7 { + max-width: -70px !important; + } + + .min-h-xxl\:-7 { + min-height: -70px !important; + } + + .min-w-xxl\:-7 { + min-width: -70px !important; + } +} +.h\:-8 { + height: -80px !important; +} + +.w\:-8 { + width: -80px !important; +} + +.max-h\:-8 { + max-height: -80px !important; +} + +.max-w\:-8 { + max-width: -80px !important; +} + +.min-h\:-8 { + min-height: -80px !important; +} + +.min-w\:-8 { + min-width: -80px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:-8 { + height: -80px !important; + } + + .w-xs\:-8 { + width: -80px !important; + } + + .max-h-xs\:-8 { + max-height: -80px !important; + } + + .max-w-xs\:-8 { + max-width: -80px !important; + } + + .min-h-xs\:-8 { + min-height: -80px !important; + } + + .min-w-xs\:-8 { + min-width: -80px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:-8 { + height: -80px !important; + } + + .w-sm\:-8 { + width: -80px !important; + } + + .max-h-sm\:-8 { + max-height: -80px !important; + } + + .max-w-sm\:-8 { + max-width: -80px !important; + } + + .min-h-sm\:-8 { + min-height: -80px !important; + } + + .min-w-sm\:-8 { + min-width: -80px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:-8 { + height: -80px !important; + } + + .w-sm-up\:-8 { + width: -80px !important; + } + + .max-h-sm-up\:-8 { + max-height: -80px !important; + } + + .max-w-sm-up\:-8 { + max-width: -80px !important; + } + + .min-h-sm-up\:-8 { + min-height: -80px !important; + } + + .min-w-sm-up\:-8 { + min-width: -80px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:-8 { + height: -80px !important; + } + + .w-sm-down\:-8 { + width: -80px !important; + } + + .max-h-sm-down\:-8 { + max-height: -80px !important; + } + + .max-w-sm-down\:-8 { + max-width: -80px !important; + } + + .min-h-sm-down\:-8 { + min-height: -80px !important; + } + + .min-w-sm-down\:-8 { + min-width: -80px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:-8 { + height: -80px !important; + } + + .w-md\:-8 { + width: -80px !important; + } + + .max-h-md\:-8 { + max-height: -80px !important; + } + + .max-w-md\:-8 { + max-width: -80px !important; + } + + .min-h-md\:-8 { + min-height: -80px !important; + } + + .min-w-md\:-8 { + min-width: -80px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:-8 { + height: -80px !important; + } + + .w-md-up\:-8 { + width: -80px !important; + } + + .max-h-md-up\:-8 { + max-height: -80px !important; + } + + .max-w-md-up\:-8 { + max-width: -80px !important; + } + + .min-h-md-up\:-8 { + min-height: -80px !important; + } + + .min-w-md-up\:-8 { + min-width: -80px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:-8 { + height: -80px !important; + } + + .w-md-down\:-8 { + width: -80px !important; + } + + .max-h-md-down\:-8 { + max-height: -80px !important; + } + + .max-w-md-down\:-8 { + max-width: -80px !important; + } + + .min-h-md-down\:-8 { + min-height: -80px !important; + } + + .min-w-md-down\:-8 { + min-width: -80px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:-8 { + height: -80px !important; + } + + .w-lg\:-8 { + width: -80px !important; + } + + .max-h-lg\:-8 { + max-height: -80px !important; + } + + .max-w-lg\:-8 { + max-width: -80px !important; + } + + .min-h-lg\:-8 { + min-height: -80px !important; + } + + .min-w-lg\:-8 { + min-width: -80px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:-8 { + height: -80px !important; + } + + .w-lg-up\:-8 { + width: -80px !important; + } + + .max-h-lg-up\:-8 { + max-height: -80px !important; + } + + .max-w-lg-up\:-8 { + max-width: -80px !important; + } + + .min-h-lg-up\:-8 { + min-height: -80px !important; + } + + .min-w-lg-up\:-8 { + min-width: -80px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:-8 { + height: -80px !important; + } + + .w-lg-down\:-8 { + width: -80px !important; + } + + .max-h-lg-down\:-8 { + max-height: -80px !important; + } + + .max-w-lg-down\:-8 { + max-width: -80px !important; + } + + .min-h-lg-down\:-8 { + min-height: -80px !important; + } + + .min-w-lg-down\:-8 { + min-width: -80px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:-8 { + height: -80px !important; + } + + .w-xl\:-8 { + width: -80px !important; + } + + .max-h-xl\:-8 { + max-height: -80px !important; + } + + .max-w-xl\:-8 { + max-width: -80px !important; + } + + .min-h-xl\:-8 { + min-height: -80px !important; + } + + .min-w-xl\:-8 { + min-width: -80px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:-8 { + height: -80px !important; + } + + .w-xl-up\:-8 { + width: -80px !important; + } + + .max-h-xl-up\:-8 { + max-height: -80px !important; + } + + .max-w-xl-up\:-8 { + max-width: -80px !important; + } + + .min-h-xl-up\:-8 { + min-height: -80px !important; + } + + .min-w-xl-up\:-8 { + min-width: -80px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:-8 { + height: -80px !important; + } + + .w-xl-down\:-8 { + width: -80px !important; + } + + .max-h-xl-down\:-8 { + max-height: -80px !important; + } + + .max-w-xl-down\:-8 { + max-width: -80px !important; + } + + .min-h-xl-down\:-8 { + min-height: -80px !important; + } + + .min-w-xl-down\:-8 { + min-width: -80px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:-8 { + height: -80px !important; + } + + .w-xxl\:-8 { + width: -80px !important; + } + + .max-h-xxl\:-8 { + max-height: -80px !important; + } + + .max-w-xxl\:-8 { + max-width: -80px !important; + } + + .min-h-xxl\:-8 { + min-height: -80px !important; + } + + .min-w-xxl\:-8 { + min-width: -80px !important; + } +} +.h\:-9 { + height: -90px !important; +} + +.w\:-9 { + width: -90px !important; +} + +.max-h\:-9 { + max-height: -90px !important; +} + +.max-w\:-9 { + max-width: -90px !important; +} + +.min-h\:-9 { + min-height: -90px !important; +} + +.min-w\:-9 { + min-width: -90px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:-9 { + height: -90px !important; + } + + .w-xs\:-9 { + width: -90px !important; + } + + .max-h-xs\:-9 { + max-height: -90px !important; + } + + .max-w-xs\:-9 { + max-width: -90px !important; + } + + .min-h-xs\:-9 { + min-height: -90px !important; + } + + .min-w-xs\:-9 { + min-width: -90px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:-9 { + height: -90px !important; + } + + .w-sm\:-9 { + width: -90px !important; + } + + .max-h-sm\:-9 { + max-height: -90px !important; + } + + .max-w-sm\:-9 { + max-width: -90px !important; + } + + .min-h-sm\:-9 { + min-height: -90px !important; + } + + .min-w-sm\:-9 { + min-width: -90px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:-9 { + height: -90px !important; + } + + .w-sm-up\:-9 { + width: -90px !important; + } + + .max-h-sm-up\:-9 { + max-height: -90px !important; + } + + .max-w-sm-up\:-9 { + max-width: -90px !important; + } + + .min-h-sm-up\:-9 { + min-height: -90px !important; + } + + .min-w-sm-up\:-9 { + min-width: -90px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:-9 { + height: -90px !important; + } + + .w-sm-down\:-9 { + width: -90px !important; + } + + .max-h-sm-down\:-9 { + max-height: -90px !important; + } + + .max-w-sm-down\:-9 { + max-width: -90px !important; + } + + .min-h-sm-down\:-9 { + min-height: -90px !important; + } + + .min-w-sm-down\:-9 { + min-width: -90px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:-9 { + height: -90px !important; + } + + .w-md\:-9 { + width: -90px !important; + } + + .max-h-md\:-9 { + max-height: -90px !important; + } + + .max-w-md\:-9 { + max-width: -90px !important; + } + + .min-h-md\:-9 { + min-height: -90px !important; + } + + .min-w-md\:-9 { + min-width: -90px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:-9 { + height: -90px !important; + } + + .w-md-up\:-9 { + width: -90px !important; + } + + .max-h-md-up\:-9 { + max-height: -90px !important; + } + + .max-w-md-up\:-9 { + max-width: -90px !important; + } + + .min-h-md-up\:-9 { + min-height: -90px !important; + } + + .min-w-md-up\:-9 { + min-width: -90px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:-9 { + height: -90px !important; + } + + .w-md-down\:-9 { + width: -90px !important; + } + + .max-h-md-down\:-9 { + max-height: -90px !important; + } + + .max-w-md-down\:-9 { + max-width: -90px !important; + } + + .min-h-md-down\:-9 { + min-height: -90px !important; + } + + .min-w-md-down\:-9 { + min-width: -90px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:-9 { + height: -90px !important; + } + + .w-lg\:-9 { + width: -90px !important; + } + + .max-h-lg\:-9 { + max-height: -90px !important; + } + + .max-w-lg\:-9 { + max-width: -90px !important; + } + + .min-h-lg\:-9 { + min-height: -90px !important; + } + + .min-w-lg\:-9 { + min-width: -90px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:-9 { + height: -90px !important; + } + + .w-lg-up\:-9 { + width: -90px !important; + } + + .max-h-lg-up\:-9 { + max-height: -90px !important; + } + + .max-w-lg-up\:-9 { + max-width: -90px !important; + } + + .min-h-lg-up\:-9 { + min-height: -90px !important; + } + + .min-w-lg-up\:-9 { + min-width: -90px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:-9 { + height: -90px !important; + } + + .w-lg-down\:-9 { + width: -90px !important; + } + + .max-h-lg-down\:-9 { + max-height: -90px !important; + } + + .max-w-lg-down\:-9 { + max-width: -90px !important; + } + + .min-h-lg-down\:-9 { + min-height: -90px !important; + } + + .min-w-lg-down\:-9 { + min-width: -90px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:-9 { + height: -90px !important; + } + + .w-xl\:-9 { + width: -90px !important; + } + + .max-h-xl\:-9 { + max-height: -90px !important; + } + + .max-w-xl\:-9 { + max-width: -90px !important; + } + + .min-h-xl\:-9 { + min-height: -90px !important; + } + + .min-w-xl\:-9 { + min-width: -90px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:-9 { + height: -90px !important; + } + + .w-xl-up\:-9 { + width: -90px !important; + } + + .max-h-xl-up\:-9 { + max-height: -90px !important; + } + + .max-w-xl-up\:-9 { + max-width: -90px !important; + } + + .min-h-xl-up\:-9 { + min-height: -90px !important; + } + + .min-w-xl-up\:-9 { + min-width: -90px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:-9 { + height: -90px !important; + } + + .w-xl-down\:-9 { + width: -90px !important; + } + + .max-h-xl-down\:-9 { + max-height: -90px !important; + } + + .max-w-xl-down\:-9 { + max-width: -90px !important; + } + + .min-h-xl-down\:-9 { + min-height: -90px !important; + } + + .min-w-xl-down\:-9 { + min-width: -90px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:-9 { + height: -90px !important; + } + + .w-xxl\:-9 { + width: -90px !important; + } + + .max-h-xxl\:-9 { + max-height: -90px !important; + } + + .max-w-xxl\:-9 { + max-width: -90px !important; + } + + .min-h-xxl\:-9 { + min-height: -90px !important; + } + + .min-w-xxl\:-9 { + min-width: -90px !important; + } +} +.h\:-10 { + height: -100px !important; +} + +.w\:-10 { + width: -100px !important; +} + +.max-h\:-10 { + max-height: -100px !important; +} + +.max-w\:-10 { + max-width: -100px !important; +} + +.min-h\:-10 { + min-height: -100px !important; +} + +.min-w\:-10 { + min-width: -100px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:-10 { + height: -100px !important; + } + + .w-xs\:-10 { + width: -100px !important; + } + + .max-h-xs\:-10 { + max-height: -100px !important; + } + + .max-w-xs\:-10 { + max-width: -100px !important; + } + + .min-h-xs\:-10 { + min-height: -100px !important; + } + + .min-w-xs\:-10 { + min-width: -100px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:-10 { + height: -100px !important; + } + + .w-sm\:-10 { + width: -100px !important; + } + + .max-h-sm\:-10 { + max-height: -100px !important; + } + + .max-w-sm\:-10 { + max-width: -100px !important; + } + + .min-h-sm\:-10 { + min-height: -100px !important; + } + + .min-w-sm\:-10 { + min-width: -100px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:-10 { + height: -100px !important; + } + + .w-sm-up\:-10 { + width: -100px !important; + } + + .max-h-sm-up\:-10 { + max-height: -100px !important; + } + + .max-w-sm-up\:-10 { + max-width: -100px !important; + } + + .min-h-sm-up\:-10 { + min-height: -100px !important; + } + + .min-w-sm-up\:-10 { + min-width: -100px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:-10 { + height: -100px !important; + } + + .w-sm-down\:-10 { + width: -100px !important; + } + + .max-h-sm-down\:-10 { + max-height: -100px !important; + } + + .max-w-sm-down\:-10 { + max-width: -100px !important; + } + + .min-h-sm-down\:-10 { + min-height: -100px !important; + } + + .min-w-sm-down\:-10 { + min-width: -100px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:-10 { + height: -100px !important; + } + + .w-md\:-10 { + width: -100px !important; + } + + .max-h-md\:-10 { + max-height: -100px !important; + } + + .max-w-md\:-10 { + max-width: -100px !important; + } + + .min-h-md\:-10 { + min-height: -100px !important; + } + + .min-w-md\:-10 { + min-width: -100px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:-10 { + height: -100px !important; + } + + .w-md-up\:-10 { + width: -100px !important; + } + + .max-h-md-up\:-10 { + max-height: -100px !important; + } + + .max-w-md-up\:-10 { + max-width: -100px !important; + } + + .min-h-md-up\:-10 { + min-height: -100px !important; + } + + .min-w-md-up\:-10 { + min-width: -100px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:-10 { + height: -100px !important; + } + + .w-md-down\:-10 { + width: -100px !important; + } + + .max-h-md-down\:-10 { + max-height: -100px !important; + } + + .max-w-md-down\:-10 { + max-width: -100px !important; + } + + .min-h-md-down\:-10 { + min-height: -100px !important; + } + + .min-w-md-down\:-10 { + min-width: -100px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:-10 { + height: -100px !important; + } + + .w-lg\:-10 { + width: -100px !important; + } + + .max-h-lg\:-10 { + max-height: -100px !important; + } + + .max-w-lg\:-10 { + max-width: -100px !important; + } + + .min-h-lg\:-10 { + min-height: -100px !important; + } + + .min-w-lg\:-10 { + min-width: -100px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:-10 { + height: -100px !important; + } + + .w-lg-up\:-10 { + width: -100px !important; + } + + .max-h-lg-up\:-10 { + max-height: -100px !important; + } + + .max-w-lg-up\:-10 { + max-width: -100px !important; + } + + .min-h-lg-up\:-10 { + min-height: -100px !important; + } + + .min-w-lg-up\:-10 { + min-width: -100px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:-10 { + height: -100px !important; + } + + .w-lg-down\:-10 { + width: -100px !important; + } + + .max-h-lg-down\:-10 { + max-height: -100px !important; + } + + .max-w-lg-down\:-10 { + max-width: -100px !important; + } + + .min-h-lg-down\:-10 { + min-height: -100px !important; + } + + .min-w-lg-down\:-10 { + min-width: -100px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:-10 { + height: -100px !important; + } + + .w-xl\:-10 { + width: -100px !important; + } + + .max-h-xl\:-10 { + max-height: -100px !important; + } + + .max-w-xl\:-10 { + max-width: -100px !important; + } + + .min-h-xl\:-10 { + min-height: -100px !important; + } + + .min-w-xl\:-10 { + min-width: -100px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:-10 { + height: -100px !important; + } + + .w-xl-up\:-10 { + width: -100px !important; + } + + .max-h-xl-up\:-10 { + max-height: -100px !important; + } + + .max-w-xl-up\:-10 { + max-width: -100px !important; + } + + .min-h-xl-up\:-10 { + min-height: -100px !important; + } + + .min-w-xl-up\:-10 { + min-width: -100px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:-10 { + height: -100px !important; + } + + .w-xl-down\:-10 { + width: -100px !important; + } + + .max-h-xl-down\:-10 { + max-height: -100px !important; + } + + .max-w-xl-down\:-10 { + max-width: -100px !important; + } + + .min-h-xl-down\:-10 { + min-height: -100px !important; + } + + .min-w-xl-down\:-10 { + min-width: -100px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:-10 { + height: -100px !important; + } + + .w-xxl\:-10 { + width: -100px !important; + } + + .max-h-xxl\:-10 { + max-height: -100px !important; + } + + .max-w-xxl\:-10 { + max-width: -100px !important; + } + + .min-h-xxl\:-10 { + min-height: -100px !important; + } + + .min-w-xxl\:-10 { + min-width: -100px !important; + } +} +.h\:0 { + height: 0 !important; +} + +.w\:0 { + width: 0 !important; +} + +.max-h\:0 { + max-height: 0 !important; +} + +.max-w\:0 { + max-width: 0 !important; +} + +.min-h\:0 { + min-height: 0 !important; +} + +.min-w\:0 { + min-width: 0 !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:0 { + height: 0 !important; + } + + .w-xs\:0 { + width: 0 !important; + } + + .max-h-xs\:0 { + max-height: 0 !important; + } + + .max-w-xs\:0 { + max-width: 0 !important; + } + + .min-h-xs\:0 { + min-height: 0 !important; + } + + .min-w-xs\:0 { + min-width: 0 !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:0 { + height: 0 !important; + } + + .w-sm\:0 { + width: 0 !important; + } + + .max-h-sm\:0 { + max-height: 0 !important; + } + + .max-w-sm\:0 { + max-width: 0 !important; + } + + .min-h-sm\:0 { + min-height: 0 !important; + } + + .min-w-sm\:0 { + min-width: 0 !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:0 { + height: 0 !important; + } + + .w-sm-up\:0 { + width: 0 !important; + } + + .max-h-sm-up\:0 { + max-height: 0 !important; + } + + .max-w-sm-up\:0 { + max-width: 0 !important; + } + + .min-h-sm-up\:0 { + min-height: 0 !important; + } + + .min-w-sm-up\:0 { + min-width: 0 !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:0 { + height: 0 !important; + } + + .w-sm-down\:0 { + width: 0 !important; + } + + .max-h-sm-down\:0 { + max-height: 0 !important; + } + + .max-w-sm-down\:0 { + max-width: 0 !important; + } + + .min-h-sm-down\:0 { + min-height: 0 !important; + } + + .min-w-sm-down\:0 { + min-width: 0 !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:0 { + height: 0 !important; + } + + .w-md\:0 { + width: 0 !important; + } + + .max-h-md\:0 { + max-height: 0 !important; + } + + .max-w-md\:0 { + max-width: 0 !important; + } + + .min-h-md\:0 { + min-height: 0 !important; + } + + .min-w-md\:0 { + min-width: 0 !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:0 { + height: 0 !important; + } + + .w-md-up\:0 { + width: 0 !important; + } + + .max-h-md-up\:0 { + max-height: 0 !important; + } + + .max-w-md-up\:0 { + max-width: 0 !important; + } + + .min-h-md-up\:0 { + min-height: 0 !important; + } + + .min-w-md-up\:0 { + min-width: 0 !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:0 { + height: 0 !important; + } + + .w-md-down\:0 { + width: 0 !important; + } + + .max-h-md-down\:0 { + max-height: 0 !important; + } + + .max-w-md-down\:0 { + max-width: 0 !important; + } + + .min-h-md-down\:0 { + min-height: 0 !important; + } + + .min-w-md-down\:0 { + min-width: 0 !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:0 { + height: 0 !important; + } + + .w-lg\:0 { + width: 0 !important; + } + + .max-h-lg\:0 { + max-height: 0 !important; + } + + .max-w-lg\:0 { + max-width: 0 !important; + } + + .min-h-lg\:0 { + min-height: 0 !important; + } + + .min-w-lg\:0 { + min-width: 0 !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:0 { + height: 0 !important; + } + + .w-lg-up\:0 { + width: 0 !important; + } + + .max-h-lg-up\:0 { + max-height: 0 !important; + } + + .max-w-lg-up\:0 { + max-width: 0 !important; + } + + .min-h-lg-up\:0 { + min-height: 0 !important; + } + + .min-w-lg-up\:0 { + min-width: 0 !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:0 { + height: 0 !important; + } + + .w-lg-down\:0 { + width: 0 !important; + } + + .max-h-lg-down\:0 { + max-height: 0 !important; + } + + .max-w-lg-down\:0 { + max-width: 0 !important; + } + + .min-h-lg-down\:0 { + min-height: 0 !important; + } + + .min-w-lg-down\:0 { + min-width: 0 !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:0 { + height: 0 !important; + } + + .w-xl\:0 { + width: 0 !important; + } + + .max-h-xl\:0 { + max-height: 0 !important; + } + + .max-w-xl\:0 { + max-width: 0 !important; + } + + .min-h-xl\:0 { + min-height: 0 !important; + } + + .min-w-xl\:0 { + min-width: 0 !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:0 { + height: 0 !important; + } + + .w-xl-up\:0 { + width: 0 !important; + } + + .max-h-xl-up\:0 { + max-height: 0 !important; + } + + .max-w-xl-up\:0 { + max-width: 0 !important; + } + + .min-h-xl-up\:0 { + min-height: 0 !important; + } + + .min-w-xl-up\:0 { + min-width: 0 !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:0 { + height: 0 !important; + } + + .w-xl-down\:0 { + width: 0 !important; + } + + .max-h-xl-down\:0 { + max-height: 0 !important; + } + + .max-w-xl-down\:0 { + max-width: 0 !important; + } + + .min-h-xl-down\:0 { + min-height: 0 !important; + } + + .min-w-xl-down\:0 { + min-width: 0 !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:0 { + height: 0 !important; + } + + .w-xxl\:0 { + width: 0 !important; + } + + .max-h-xxl\:0 { + max-height: 0 !important; + } + + .max-w-xxl\:0 { + max-width: 0 !important; + } + + .min-h-xxl\:0 { + min-height: 0 !important; + } + + .min-w-xxl\:0 { + min-width: 0 !important; + } +} +.h\:_1 { + height: 10px !important; +} + +.w\:_1 { + width: 10px !important; +} + +.max-h\:_1 { + max-height: 10px !important; +} + +.max-w\:_1 { + max-width: 10px !important; +} + +.min-h\:_1 { + min-height: 10px !important; +} + +.min-w\:_1 { + min-width: 10px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:_1 { + height: 10px !important; + } + + .w-xs\:_1 { + width: 10px !important; + } + + .max-h-xs\:_1 { + max-height: 10px !important; + } + + .max-w-xs\:_1 { + max-width: 10px !important; + } + + .min-h-xs\:_1 { + min-height: 10px !important; + } + + .min-w-xs\:_1 { + min-width: 10px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:_1 { + height: 10px !important; + } + + .w-sm\:_1 { + width: 10px !important; + } + + .max-h-sm\:_1 { + max-height: 10px !important; + } + + .max-w-sm\:_1 { + max-width: 10px !important; + } + + .min-h-sm\:_1 { + min-height: 10px !important; + } + + .min-w-sm\:_1 { + min-width: 10px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:_1 { + height: 10px !important; + } + + .w-sm-up\:_1 { + width: 10px !important; + } + + .max-h-sm-up\:_1 { + max-height: 10px !important; + } + + .max-w-sm-up\:_1 { + max-width: 10px !important; + } + + .min-h-sm-up\:_1 { + min-height: 10px !important; + } + + .min-w-sm-up\:_1 { + min-width: 10px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:_1 { + height: 10px !important; + } + + .w-sm-down\:_1 { + width: 10px !important; + } + + .max-h-sm-down\:_1 { + max-height: 10px !important; + } + + .max-w-sm-down\:_1 { + max-width: 10px !important; + } + + .min-h-sm-down\:_1 { + min-height: 10px !important; + } + + .min-w-sm-down\:_1 { + min-width: 10px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:_1 { + height: 10px !important; + } + + .w-md\:_1 { + width: 10px !important; + } + + .max-h-md\:_1 { + max-height: 10px !important; + } + + .max-w-md\:_1 { + max-width: 10px !important; + } + + .min-h-md\:_1 { + min-height: 10px !important; + } + + .min-w-md\:_1 { + min-width: 10px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:_1 { + height: 10px !important; + } + + .w-md-up\:_1 { + width: 10px !important; + } + + .max-h-md-up\:_1 { + max-height: 10px !important; + } + + .max-w-md-up\:_1 { + max-width: 10px !important; + } + + .min-h-md-up\:_1 { + min-height: 10px !important; + } + + .min-w-md-up\:_1 { + min-width: 10px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:_1 { + height: 10px !important; + } + + .w-md-down\:_1 { + width: 10px !important; + } + + .max-h-md-down\:_1 { + max-height: 10px !important; + } + + .max-w-md-down\:_1 { + max-width: 10px !important; + } + + .min-h-md-down\:_1 { + min-height: 10px !important; + } + + .min-w-md-down\:_1 { + min-width: 10px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:_1 { + height: 10px !important; + } + + .w-lg\:_1 { + width: 10px !important; + } + + .max-h-lg\:_1 { + max-height: 10px !important; + } + + .max-w-lg\:_1 { + max-width: 10px !important; + } + + .min-h-lg\:_1 { + min-height: 10px !important; + } + + .min-w-lg\:_1 { + min-width: 10px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:_1 { + height: 10px !important; + } + + .w-lg-up\:_1 { + width: 10px !important; + } + + .max-h-lg-up\:_1 { + max-height: 10px !important; + } + + .max-w-lg-up\:_1 { + max-width: 10px !important; + } + + .min-h-lg-up\:_1 { + min-height: 10px !important; + } + + .min-w-lg-up\:_1 { + min-width: 10px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:_1 { + height: 10px !important; + } + + .w-lg-down\:_1 { + width: 10px !important; + } + + .max-h-lg-down\:_1 { + max-height: 10px !important; + } + + .max-w-lg-down\:_1 { + max-width: 10px !important; + } + + .min-h-lg-down\:_1 { + min-height: 10px !important; + } + + .min-w-lg-down\:_1 { + min-width: 10px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:_1 { + height: 10px !important; + } + + .w-xl\:_1 { + width: 10px !important; + } + + .max-h-xl\:_1 { + max-height: 10px !important; + } + + .max-w-xl\:_1 { + max-width: 10px !important; + } + + .min-h-xl\:_1 { + min-height: 10px !important; + } + + .min-w-xl\:_1 { + min-width: 10px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:_1 { + height: 10px !important; + } + + .w-xl-up\:_1 { + width: 10px !important; + } + + .max-h-xl-up\:_1 { + max-height: 10px !important; + } + + .max-w-xl-up\:_1 { + max-width: 10px !important; + } + + .min-h-xl-up\:_1 { + min-height: 10px !important; + } + + .min-w-xl-up\:_1 { + min-width: 10px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:_1 { + height: 10px !important; + } + + .w-xl-down\:_1 { + width: 10px !important; + } + + .max-h-xl-down\:_1 { + max-height: 10px !important; + } + + .max-w-xl-down\:_1 { + max-width: 10px !important; + } + + .min-h-xl-down\:_1 { + min-height: 10px !important; + } + + .min-w-xl-down\:_1 { + min-width: 10px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:_1 { + height: 10px !important; + } + + .w-xxl\:_1 { + width: 10px !important; + } + + .max-h-xxl\:_1 { + max-height: 10px !important; + } + + .max-w-xxl\:_1 { + max-width: 10px !important; + } + + .min-h-xxl\:_1 { + min-height: 10px !important; + } + + .min-w-xxl\:_1 { + min-width: 10px !important; + } +} +.h\:_2 { + height: 20px !important; +} + +.w\:_2 { + width: 20px !important; +} + +.max-h\:_2 { + max-height: 20px !important; +} + +.max-w\:_2 { + max-width: 20px !important; +} + +.min-h\:_2 { + min-height: 20px !important; +} + +.min-w\:_2 { + min-width: 20px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:_2 { + height: 20px !important; + } + + .w-xs\:_2 { + width: 20px !important; + } + + .max-h-xs\:_2 { + max-height: 20px !important; + } + + .max-w-xs\:_2 { + max-width: 20px !important; + } + + .min-h-xs\:_2 { + min-height: 20px !important; + } + + .min-w-xs\:_2 { + min-width: 20px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:_2 { + height: 20px !important; + } + + .w-sm\:_2 { + width: 20px !important; + } + + .max-h-sm\:_2 { + max-height: 20px !important; + } + + .max-w-sm\:_2 { + max-width: 20px !important; + } + + .min-h-sm\:_2 { + min-height: 20px !important; + } + + .min-w-sm\:_2 { + min-width: 20px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:_2 { + height: 20px !important; + } + + .w-sm-up\:_2 { + width: 20px !important; + } + + .max-h-sm-up\:_2 { + max-height: 20px !important; + } + + .max-w-sm-up\:_2 { + max-width: 20px !important; + } + + .min-h-sm-up\:_2 { + min-height: 20px !important; + } + + .min-w-sm-up\:_2 { + min-width: 20px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:_2 { + height: 20px !important; + } + + .w-sm-down\:_2 { + width: 20px !important; + } + + .max-h-sm-down\:_2 { + max-height: 20px !important; + } + + .max-w-sm-down\:_2 { + max-width: 20px !important; + } + + .min-h-sm-down\:_2 { + min-height: 20px !important; + } + + .min-w-sm-down\:_2 { + min-width: 20px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:_2 { + height: 20px !important; + } + + .w-md\:_2 { + width: 20px !important; + } + + .max-h-md\:_2 { + max-height: 20px !important; + } + + .max-w-md\:_2 { + max-width: 20px !important; + } + + .min-h-md\:_2 { + min-height: 20px !important; + } + + .min-w-md\:_2 { + min-width: 20px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:_2 { + height: 20px !important; + } + + .w-md-up\:_2 { + width: 20px !important; + } + + .max-h-md-up\:_2 { + max-height: 20px !important; + } + + .max-w-md-up\:_2 { + max-width: 20px !important; + } + + .min-h-md-up\:_2 { + min-height: 20px !important; + } + + .min-w-md-up\:_2 { + min-width: 20px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:_2 { + height: 20px !important; + } + + .w-md-down\:_2 { + width: 20px !important; + } + + .max-h-md-down\:_2 { + max-height: 20px !important; + } + + .max-w-md-down\:_2 { + max-width: 20px !important; + } + + .min-h-md-down\:_2 { + min-height: 20px !important; + } + + .min-w-md-down\:_2 { + min-width: 20px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:_2 { + height: 20px !important; + } + + .w-lg\:_2 { + width: 20px !important; + } + + .max-h-lg\:_2 { + max-height: 20px !important; + } + + .max-w-lg\:_2 { + max-width: 20px !important; + } + + .min-h-lg\:_2 { + min-height: 20px !important; + } + + .min-w-lg\:_2 { + min-width: 20px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:_2 { + height: 20px !important; + } + + .w-lg-up\:_2 { + width: 20px !important; + } + + .max-h-lg-up\:_2 { + max-height: 20px !important; + } + + .max-w-lg-up\:_2 { + max-width: 20px !important; + } + + .min-h-lg-up\:_2 { + min-height: 20px !important; + } + + .min-w-lg-up\:_2 { + min-width: 20px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:_2 { + height: 20px !important; + } + + .w-lg-down\:_2 { + width: 20px !important; + } + + .max-h-lg-down\:_2 { + max-height: 20px !important; + } + + .max-w-lg-down\:_2 { + max-width: 20px !important; + } + + .min-h-lg-down\:_2 { + min-height: 20px !important; + } + + .min-w-lg-down\:_2 { + min-width: 20px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:_2 { + height: 20px !important; + } + + .w-xl\:_2 { + width: 20px !important; + } + + .max-h-xl\:_2 { + max-height: 20px !important; + } + + .max-w-xl\:_2 { + max-width: 20px !important; + } + + .min-h-xl\:_2 { + min-height: 20px !important; + } + + .min-w-xl\:_2 { + min-width: 20px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:_2 { + height: 20px !important; + } + + .w-xl-up\:_2 { + width: 20px !important; + } + + .max-h-xl-up\:_2 { + max-height: 20px !important; + } + + .max-w-xl-up\:_2 { + max-width: 20px !important; + } + + .min-h-xl-up\:_2 { + min-height: 20px !important; + } + + .min-w-xl-up\:_2 { + min-width: 20px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:_2 { + height: 20px !important; + } + + .w-xl-down\:_2 { + width: 20px !important; + } + + .max-h-xl-down\:_2 { + max-height: 20px !important; + } + + .max-w-xl-down\:_2 { + max-width: 20px !important; + } + + .min-h-xl-down\:_2 { + min-height: 20px !important; + } + + .min-w-xl-down\:_2 { + min-width: 20px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:_2 { + height: 20px !important; + } + + .w-xxl\:_2 { + width: 20px !important; + } + + .max-h-xxl\:_2 { + max-height: 20px !important; + } + + .max-w-xxl\:_2 { + max-width: 20px !important; + } + + .min-h-xxl\:_2 { + min-height: 20px !important; + } + + .min-w-xxl\:_2 { + min-width: 20px !important; + } +} +.h\:_3 { + height: 30px !important; +} + +.w\:_3 { + width: 30px !important; +} + +.max-h\:_3 { + max-height: 30px !important; +} + +.max-w\:_3 { + max-width: 30px !important; +} + +.min-h\:_3 { + min-height: 30px !important; +} + +.min-w\:_3 { + min-width: 30px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:_3 { + height: 30px !important; + } + + .w-xs\:_3 { + width: 30px !important; + } + + .max-h-xs\:_3 { + max-height: 30px !important; + } + + .max-w-xs\:_3 { + max-width: 30px !important; + } + + .min-h-xs\:_3 { + min-height: 30px !important; + } + + .min-w-xs\:_3 { + min-width: 30px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:_3 { + height: 30px !important; + } + + .w-sm\:_3 { + width: 30px !important; + } + + .max-h-sm\:_3 { + max-height: 30px !important; + } + + .max-w-sm\:_3 { + max-width: 30px !important; + } + + .min-h-sm\:_3 { + min-height: 30px !important; + } + + .min-w-sm\:_3 { + min-width: 30px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:_3 { + height: 30px !important; + } + + .w-sm-up\:_3 { + width: 30px !important; + } + + .max-h-sm-up\:_3 { + max-height: 30px !important; + } + + .max-w-sm-up\:_3 { + max-width: 30px !important; + } + + .min-h-sm-up\:_3 { + min-height: 30px !important; + } + + .min-w-sm-up\:_3 { + min-width: 30px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:_3 { + height: 30px !important; + } + + .w-sm-down\:_3 { + width: 30px !important; + } + + .max-h-sm-down\:_3 { + max-height: 30px !important; + } + + .max-w-sm-down\:_3 { + max-width: 30px !important; + } + + .min-h-sm-down\:_3 { + min-height: 30px !important; + } + + .min-w-sm-down\:_3 { + min-width: 30px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:_3 { + height: 30px !important; + } + + .w-md\:_3 { + width: 30px !important; + } + + .max-h-md\:_3 { + max-height: 30px !important; + } + + .max-w-md\:_3 { + max-width: 30px !important; + } + + .min-h-md\:_3 { + min-height: 30px !important; + } + + .min-w-md\:_3 { + min-width: 30px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:_3 { + height: 30px !important; + } + + .w-md-up\:_3 { + width: 30px !important; + } + + .max-h-md-up\:_3 { + max-height: 30px !important; + } + + .max-w-md-up\:_3 { + max-width: 30px !important; + } + + .min-h-md-up\:_3 { + min-height: 30px !important; + } + + .min-w-md-up\:_3 { + min-width: 30px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:_3 { + height: 30px !important; + } + + .w-md-down\:_3 { + width: 30px !important; + } + + .max-h-md-down\:_3 { + max-height: 30px !important; + } + + .max-w-md-down\:_3 { + max-width: 30px !important; + } + + .min-h-md-down\:_3 { + min-height: 30px !important; + } + + .min-w-md-down\:_3 { + min-width: 30px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:_3 { + height: 30px !important; + } + + .w-lg\:_3 { + width: 30px !important; + } + + .max-h-lg\:_3 { + max-height: 30px !important; + } + + .max-w-lg\:_3 { + max-width: 30px !important; + } + + .min-h-lg\:_3 { + min-height: 30px !important; + } + + .min-w-lg\:_3 { + min-width: 30px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:_3 { + height: 30px !important; + } + + .w-lg-up\:_3 { + width: 30px !important; + } + + .max-h-lg-up\:_3 { + max-height: 30px !important; + } + + .max-w-lg-up\:_3 { + max-width: 30px !important; + } + + .min-h-lg-up\:_3 { + min-height: 30px !important; + } + + .min-w-lg-up\:_3 { + min-width: 30px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:_3 { + height: 30px !important; + } + + .w-lg-down\:_3 { + width: 30px !important; + } + + .max-h-lg-down\:_3 { + max-height: 30px !important; + } + + .max-w-lg-down\:_3 { + max-width: 30px !important; + } + + .min-h-lg-down\:_3 { + min-height: 30px !important; + } + + .min-w-lg-down\:_3 { + min-width: 30px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:_3 { + height: 30px !important; + } + + .w-xl\:_3 { + width: 30px !important; + } + + .max-h-xl\:_3 { + max-height: 30px !important; + } + + .max-w-xl\:_3 { + max-width: 30px !important; + } + + .min-h-xl\:_3 { + min-height: 30px !important; + } + + .min-w-xl\:_3 { + min-width: 30px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:_3 { + height: 30px !important; + } + + .w-xl-up\:_3 { + width: 30px !important; + } + + .max-h-xl-up\:_3 { + max-height: 30px !important; + } + + .max-w-xl-up\:_3 { + max-width: 30px !important; + } + + .min-h-xl-up\:_3 { + min-height: 30px !important; + } + + .min-w-xl-up\:_3 { + min-width: 30px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:_3 { + height: 30px !important; + } + + .w-xl-down\:_3 { + width: 30px !important; + } + + .max-h-xl-down\:_3 { + max-height: 30px !important; + } + + .max-w-xl-down\:_3 { + max-width: 30px !important; + } + + .min-h-xl-down\:_3 { + min-height: 30px !important; + } + + .min-w-xl-down\:_3 { + min-width: 30px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:_3 { + height: 30px !important; + } + + .w-xxl\:_3 { + width: 30px !important; + } + + .max-h-xxl\:_3 { + max-height: 30px !important; + } + + .max-w-xxl\:_3 { + max-width: 30px !important; + } + + .min-h-xxl\:_3 { + min-height: 30px !important; + } + + .min-w-xxl\:_3 { + min-width: 30px !important; + } +} +.h\:_4 { + height: 40px !important; +} + +.w\:_4 { + width: 40px !important; +} + +.max-h\:_4 { + max-height: 40px !important; +} + +.max-w\:_4 { + max-width: 40px !important; +} + +.min-h\:_4 { + min-height: 40px !important; +} + +.min-w\:_4 { + min-width: 40px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:_4 { + height: 40px !important; + } + + .w-xs\:_4 { + width: 40px !important; + } + + .max-h-xs\:_4 { + max-height: 40px !important; + } + + .max-w-xs\:_4 { + max-width: 40px !important; + } + + .min-h-xs\:_4 { + min-height: 40px !important; + } + + .min-w-xs\:_4 { + min-width: 40px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:_4 { + height: 40px !important; + } + + .w-sm\:_4 { + width: 40px !important; + } + + .max-h-sm\:_4 { + max-height: 40px !important; + } + + .max-w-sm\:_4 { + max-width: 40px !important; + } + + .min-h-sm\:_4 { + min-height: 40px !important; + } + + .min-w-sm\:_4 { + min-width: 40px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:_4 { + height: 40px !important; + } + + .w-sm-up\:_4 { + width: 40px !important; + } + + .max-h-sm-up\:_4 { + max-height: 40px !important; + } + + .max-w-sm-up\:_4 { + max-width: 40px !important; + } + + .min-h-sm-up\:_4 { + min-height: 40px !important; + } + + .min-w-sm-up\:_4 { + min-width: 40px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:_4 { + height: 40px !important; + } + + .w-sm-down\:_4 { + width: 40px !important; + } + + .max-h-sm-down\:_4 { + max-height: 40px !important; + } + + .max-w-sm-down\:_4 { + max-width: 40px !important; + } + + .min-h-sm-down\:_4 { + min-height: 40px !important; + } + + .min-w-sm-down\:_4 { + min-width: 40px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:_4 { + height: 40px !important; + } + + .w-md\:_4 { + width: 40px !important; + } + + .max-h-md\:_4 { + max-height: 40px !important; + } + + .max-w-md\:_4 { + max-width: 40px !important; + } + + .min-h-md\:_4 { + min-height: 40px !important; + } + + .min-w-md\:_4 { + min-width: 40px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:_4 { + height: 40px !important; + } + + .w-md-up\:_4 { + width: 40px !important; + } + + .max-h-md-up\:_4 { + max-height: 40px !important; + } + + .max-w-md-up\:_4 { + max-width: 40px !important; + } + + .min-h-md-up\:_4 { + min-height: 40px !important; + } + + .min-w-md-up\:_4 { + min-width: 40px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:_4 { + height: 40px !important; + } + + .w-md-down\:_4 { + width: 40px !important; + } + + .max-h-md-down\:_4 { + max-height: 40px !important; + } + + .max-w-md-down\:_4 { + max-width: 40px !important; + } + + .min-h-md-down\:_4 { + min-height: 40px !important; + } + + .min-w-md-down\:_4 { + min-width: 40px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:_4 { + height: 40px !important; + } + + .w-lg\:_4 { + width: 40px !important; + } + + .max-h-lg\:_4 { + max-height: 40px !important; + } + + .max-w-lg\:_4 { + max-width: 40px !important; + } + + .min-h-lg\:_4 { + min-height: 40px !important; + } + + .min-w-lg\:_4 { + min-width: 40px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:_4 { + height: 40px !important; + } + + .w-lg-up\:_4 { + width: 40px !important; + } + + .max-h-lg-up\:_4 { + max-height: 40px !important; + } + + .max-w-lg-up\:_4 { + max-width: 40px !important; + } + + .min-h-lg-up\:_4 { + min-height: 40px !important; + } + + .min-w-lg-up\:_4 { + min-width: 40px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:_4 { + height: 40px !important; + } + + .w-lg-down\:_4 { + width: 40px !important; + } + + .max-h-lg-down\:_4 { + max-height: 40px !important; + } + + .max-w-lg-down\:_4 { + max-width: 40px !important; + } + + .min-h-lg-down\:_4 { + min-height: 40px !important; + } + + .min-w-lg-down\:_4 { + min-width: 40px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:_4 { + height: 40px !important; + } + + .w-xl\:_4 { + width: 40px !important; + } + + .max-h-xl\:_4 { + max-height: 40px !important; + } + + .max-w-xl\:_4 { + max-width: 40px !important; + } + + .min-h-xl\:_4 { + min-height: 40px !important; + } + + .min-w-xl\:_4 { + min-width: 40px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:_4 { + height: 40px !important; + } + + .w-xl-up\:_4 { + width: 40px !important; + } + + .max-h-xl-up\:_4 { + max-height: 40px !important; + } + + .max-w-xl-up\:_4 { + max-width: 40px !important; + } + + .min-h-xl-up\:_4 { + min-height: 40px !important; + } + + .min-w-xl-up\:_4 { + min-width: 40px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:_4 { + height: 40px !important; + } + + .w-xl-down\:_4 { + width: 40px !important; + } + + .max-h-xl-down\:_4 { + max-height: 40px !important; + } + + .max-w-xl-down\:_4 { + max-width: 40px !important; + } + + .min-h-xl-down\:_4 { + min-height: 40px !important; + } + + .min-w-xl-down\:_4 { + min-width: 40px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:_4 { + height: 40px !important; + } + + .w-xxl\:_4 { + width: 40px !important; + } + + .max-h-xxl\:_4 { + max-height: 40px !important; + } + + .max-w-xxl\:_4 { + max-width: 40px !important; + } + + .min-h-xxl\:_4 { + min-height: 40px !important; + } + + .min-w-xxl\:_4 { + min-width: 40px !important; + } +} +.h\:_5 { + height: 50px !important; +} + +.w\:_5 { + width: 50px !important; +} + +.max-h\:_5 { + max-height: 50px !important; +} + +.max-w\:_5 { + max-width: 50px !important; +} + +.min-h\:_5 { + min-height: 50px !important; +} + +.min-w\:_5 { + min-width: 50px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:_5 { + height: 50px !important; + } + + .w-xs\:_5 { + width: 50px !important; + } + + .max-h-xs\:_5 { + max-height: 50px !important; + } + + .max-w-xs\:_5 { + max-width: 50px !important; + } + + .min-h-xs\:_5 { + min-height: 50px !important; + } + + .min-w-xs\:_5 { + min-width: 50px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:_5 { + height: 50px !important; + } + + .w-sm\:_5 { + width: 50px !important; + } + + .max-h-sm\:_5 { + max-height: 50px !important; + } + + .max-w-sm\:_5 { + max-width: 50px !important; + } + + .min-h-sm\:_5 { + min-height: 50px !important; + } + + .min-w-sm\:_5 { + min-width: 50px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:_5 { + height: 50px !important; + } + + .w-sm-up\:_5 { + width: 50px !important; + } + + .max-h-sm-up\:_5 { + max-height: 50px !important; + } + + .max-w-sm-up\:_5 { + max-width: 50px !important; + } + + .min-h-sm-up\:_5 { + min-height: 50px !important; + } + + .min-w-sm-up\:_5 { + min-width: 50px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:_5 { + height: 50px !important; + } + + .w-sm-down\:_5 { + width: 50px !important; + } + + .max-h-sm-down\:_5 { + max-height: 50px !important; + } + + .max-w-sm-down\:_5 { + max-width: 50px !important; + } + + .min-h-sm-down\:_5 { + min-height: 50px !important; + } + + .min-w-sm-down\:_5 { + min-width: 50px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:_5 { + height: 50px !important; + } + + .w-md\:_5 { + width: 50px !important; + } + + .max-h-md\:_5 { + max-height: 50px !important; + } + + .max-w-md\:_5 { + max-width: 50px !important; + } + + .min-h-md\:_5 { + min-height: 50px !important; + } + + .min-w-md\:_5 { + min-width: 50px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:_5 { + height: 50px !important; + } + + .w-md-up\:_5 { + width: 50px !important; + } + + .max-h-md-up\:_5 { + max-height: 50px !important; + } + + .max-w-md-up\:_5 { + max-width: 50px !important; + } + + .min-h-md-up\:_5 { + min-height: 50px !important; + } + + .min-w-md-up\:_5 { + min-width: 50px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:_5 { + height: 50px !important; + } + + .w-md-down\:_5 { + width: 50px !important; + } + + .max-h-md-down\:_5 { + max-height: 50px !important; + } + + .max-w-md-down\:_5 { + max-width: 50px !important; + } + + .min-h-md-down\:_5 { + min-height: 50px !important; + } + + .min-w-md-down\:_5 { + min-width: 50px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:_5 { + height: 50px !important; + } + + .w-lg\:_5 { + width: 50px !important; + } + + .max-h-lg\:_5 { + max-height: 50px !important; + } + + .max-w-lg\:_5 { + max-width: 50px !important; + } + + .min-h-lg\:_5 { + min-height: 50px !important; + } + + .min-w-lg\:_5 { + min-width: 50px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:_5 { + height: 50px !important; + } + + .w-lg-up\:_5 { + width: 50px !important; + } + + .max-h-lg-up\:_5 { + max-height: 50px !important; + } + + .max-w-lg-up\:_5 { + max-width: 50px !important; + } + + .min-h-lg-up\:_5 { + min-height: 50px !important; + } + + .min-w-lg-up\:_5 { + min-width: 50px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:_5 { + height: 50px !important; + } + + .w-lg-down\:_5 { + width: 50px !important; + } + + .max-h-lg-down\:_5 { + max-height: 50px !important; + } + + .max-w-lg-down\:_5 { + max-width: 50px !important; + } + + .min-h-lg-down\:_5 { + min-height: 50px !important; + } + + .min-w-lg-down\:_5 { + min-width: 50px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:_5 { + height: 50px !important; + } + + .w-xl\:_5 { + width: 50px !important; + } + + .max-h-xl\:_5 { + max-height: 50px !important; + } + + .max-w-xl\:_5 { + max-width: 50px !important; + } + + .min-h-xl\:_5 { + min-height: 50px !important; + } + + .min-w-xl\:_5 { + min-width: 50px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:_5 { + height: 50px !important; + } + + .w-xl-up\:_5 { + width: 50px !important; + } + + .max-h-xl-up\:_5 { + max-height: 50px !important; + } + + .max-w-xl-up\:_5 { + max-width: 50px !important; + } + + .min-h-xl-up\:_5 { + min-height: 50px !important; + } + + .min-w-xl-up\:_5 { + min-width: 50px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:_5 { + height: 50px !important; + } + + .w-xl-down\:_5 { + width: 50px !important; + } + + .max-h-xl-down\:_5 { + max-height: 50px !important; + } + + .max-w-xl-down\:_5 { + max-width: 50px !important; + } + + .min-h-xl-down\:_5 { + min-height: 50px !important; + } + + .min-w-xl-down\:_5 { + min-width: 50px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:_5 { + height: 50px !important; + } + + .w-xxl\:_5 { + width: 50px !important; + } + + .max-h-xxl\:_5 { + max-height: 50px !important; + } + + .max-w-xxl\:_5 { + max-width: 50px !important; + } + + .min-h-xxl\:_5 { + min-height: 50px !important; + } + + .min-w-xxl\:_5 { + min-width: 50px !important; + } +} +.h\:_6 { + height: 60px !important; +} + +.w\:_6 { + width: 60px !important; +} + +.max-h\:_6 { + max-height: 60px !important; +} + +.max-w\:_6 { + max-width: 60px !important; +} + +.min-h\:_6 { + min-height: 60px !important; +} + +.min-w\:_6 { + min-width: 60px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:_6 { + height: 60px !important; + } + + .w-xs\:_6 { + width: 60px !important; + } + + .max-h-xs\:_6 { + max-height: 60px !important; + } + + .max-w-xs\:_6 { + max-width: 60px !important; + } + + .min-h-xs\:_6 { + min-height: 60px !important; + } + + .min-w-xs\:_6 { + min-width: 60px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:_6 { + height: 60px !important; + } + + .w-sm\:_6 { + width: 60px !important; + } + + .max-h-sm\:_6 { + max-height: 60px !important; + } + + .max-w-sm\:_6 { + max-width: 60px !important; + } + + .min-h-sm\:_6 { + min-height: 60px !important; + } + + .min-w-sm\:_6 { + min-width: 60px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:_6 { + height: 60px !important; + } + + .w-sm-up\:_6 { + width: 60px !important; + } + + .max-h-sm-up\:_6 { + max-height: 60px !important; + } + + .max-w-sm-up\:_6 { + max-width: 60px !important; + } + + .min-h-sm-up\:_6 { + min-height: 60px !important; + } + + .min-w-sm-up\:_6 { + min-width: 60px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:_6 { + height: 60px !important; + } + + .w-sm-down\:_6 { + width: 60px !important; + } + + .max-h-sm-down\:_6 { + max-height: 60px !important; + } + + .max-w-sm-down\:_6 { + max-width: 60px !important; + } + + .min-h-sm-down\:_6 { + min-height: 60px !important; + } + + .min-w-sm-down\:_6 { + min-width: 60px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:_6 { + height: 60px !important; + } + + .w-md\:_6 { + width: 60px !important; + } + + .max-h-md\:_6 { + max-height: 60px !important; + } + + .max-w-md\:_6 { + max-width: 60px !important; + } + + .min-h-md\:_6 { + min-height: 60px !important; + } + + .min-w-md\:_6 { + min-width: 60px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:_6 { + height: 60px !important; + } + + .w-md-up\:_6 { + width: 60px !important; + } + + .max-h-md-up\:_6 { + max-height: 60px !important; + } + + .max-w-md-up\:_6 { + max-width: 60px !important; + } + + .min-h-md-up\:_6 { + min-height: 60px !important; + } + + .min-w-md-up\:_6 { + min-width: 60px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:_6 { + height: 60px !important; + } + + .w-md-down\:_6 { + width: 60px !important; + } + + .max-h-md-down\:_6 { + max-height: 60px !important; + } + + .max-w-md-down\:_6 { + max-width: 60px !important; + } + + .min-h-md-down\:_6 { + min-height: 60px !important; + } + + .min-w-md-down\:_6 { + min-width: 60px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:_6 { + height: 60px !important; + } + + .w-lg\:_6 { + width: 60px !important; + } + + .max-h-lg\:_6 { + max-height: 60px !important; + } + + .max-w-lg\:_6 { + max-width: 60px !important; + } + + .min-h-lg\:_6 { + min-height: 60px !important; + } + + .min-w-lg\:_6 { + min-width: 60px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:_6 { + height: 60px !important; + } + + .w-lg-up\:_6 { + width: 60px !important; + } + + .max-h-lg-up\:_6 { + max-height: 60px !important; + } + + .max-w-lg-up\:_6 { + max-width: 60px !important; + } + + .min-h-lg-up\:_6 { + min-height: 60px !important; + } + + .min-w-lg-up\:_6 { + min-width: 60px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:_6 { + height: 60px !important; + } + + .w-lg-down\:_6 { + width: 60px !important; + } + + .max-h-lg-down\:_6 { + max-height: 60px !important; + } + + .max-w-lg-down\:_6 { + max-width: 60px !important; + } + + .min-h-lg-down\:_6 { + min-height: 60px !important; + } + + .min-w-lg-down\:_6 { + min-width: 60px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:_6 { + height: 60px !important; + } + + .w-xl\:_6 { + width: 60px !important; + } + + .max-h-xl\:_6 { + max-height: 60px !important; + } + + .max-w-xl\:_6 { + max-width: 60px !important; + } + + .min-h-xl\:_6 { + min-height: 60px !important; + } + + .min-w-xl\:_6 { + min-width: 60px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:_6 { + height: 60px !important; + } + + .w-xl-up\:_6 { + width: 60px !important; + } + + .max-h-xl-up\:_6 { + max-height: 60px !important; + } + + .max-w-xl-up\:_6 { + max-width: 60px !important; + } + + .min-h-xl-up\:_6 { + min-height: 60px !important; + } + + .min-w-xl-up\:_6 { + min-width: 60px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:_6 { + height: 60px !important; + } + + .w-xl-down\:_6 { + width: 60px !important; + } + + .max-h-xl-down\:_6 { + max-height: 60px !important; + } + + .max-w-xl-down\:_6 { + max-width: 60px !important; + } + + .min-h-xl-down\:_6 { + min-height: 60px !important; + } + + .min-w-xl-down\:_6 { + min-width: 60px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:_6 { + height: 60px !important; + } + + .w-xxl\:_6 { + width: 60px !important; + } + + .max-h-xxl\:_6 { + max-height: 60px !important; + } + + .max-w-xxl\:_6 { + max-width: 60px !important; + } + + .min-h-xxl\:_6 { + min-height: 60px !important; + } + + .min-w-xxl\:_6 { + min-width: 60px !important; + } +} +.h\:_7 { + height: 70px !important; +} + +.w\:_7 { + width: 70px !important; +} + +.max-h\:_7 { + max-height: 70px !important; +} + +.max-w\:_7 { + max-width: 70px !important; +} + +.min-h\:_7 { + min-height: 70px !important; +} + +.min-w\:_7 { + min-width: 70px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:_7 { + height: 70px !important; + } + + .w-xs\:_7 { + width: 70px !important; + } + + .max-h-xs\:_7 { + max-height: 70px !important; + } + + .max-w-xs\:_7 { + max-width: 70px !important; + } + + .min-h-xs\:_7 { + min-height: 70px !important; + } + + .min-w-xs\:_7 { + min-width: 70px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:_7 { + height: 70px !important; + } + + .w-sm\:_7 { + width: 70px !important; + } + + .max-h-sm\:_7 { + max-height: 70px !important; + } + + .max-w-sm\:_7 { + max-width: 70px !important; + } + + .min-h-sm\:_7 { + min-height: 70px !important; + } + + .min-w-sm\:_7 { + min-width: 70px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:_7 { + height: 70px !important; + } + + .w-sm-up\:_7 { + width: 70px !important; + } + + .max-h-sm-up\:_7 { + max-height: 70px !important; + } + + .max-w-sm-up\:_7 { + max-width: 70px !important; + } + + .min-h-sm-up\:_7 { + min-height: 70px !important; + } + + .min-w-sm-up\:_7 { + min-width: 70px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:_7 { + height: 70px !important; + } + + .w-sm-down\:_7 { + width: 70px !important; + } + + .max-h-sm-down\:_7 { + max-height: 70px !important; + } + + .max-w-sm-down\:_7 { + max-width: 70px !important; + } + + .min-h-sm-down\:_7 { + min-height: 70px !important; + } + + .min-w-sm-down\:_7 { + min-width: 70px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:_7 { + height: 70px !important; + } + + .w-md\:_7 { + width: 70px !important; + } + + .max-h-md\:_7 { + max-height: 70px !important; + } + + .max-w-md\:_7 { + max-width: 70px !important; + } + + .min-h-md\:_7 { + min-height: 70px !important; + } + + .min-w-md\:_7 { + min-width: 70px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:_7 { + height: 70px !important; + } + + .w-md-up\:_7 { + width: 70px !important; + } + + .max-h-md-up\:_7 { + max-height: 70px !important; + } + + .max-w-md-up\:_7 { + max-width: 70px !important; + } + + .min-h-md-up\:_7 { + min-height: 70px !important; + } + + .min-w-md-up\:_7 { + min-width: 70px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:_7 { + height: 70px !important; + } + + .w-md-down\:_7 { + width: 70px !important; + } + + .max-h-md-down\:_7 { + max-height: 70px !important; + } + + .max-w-md-down\:_7 { + max-width: 70px !important; + } + + .min-h-md-down\:_7 { + min-height: 70px !important; + } + + .min-w-md-down\:_7 { + min-width: 70px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:_7 { + height: 70px !important; + } + + .w-lg\:_7 { + width: 70px !important; + } + + .max-h-lg\:_7 { + max-height: 70px !important; + } + + .max-w-lg\:_7 { + max-width: 70px !important; + } + + .min-h-lg\:_7 { + min-height: 70px !important; + } + + .min-w-lg\:_7 { + min-width: 70px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:_7 { + height: 70px !important; + } + + .w-lg-up\:_7 { + width: 70px !important; + } + + .max-h-lg-up\:_7 { + max-height: 70px !important; + } + + .max-w-lg-up\:_7 { + max-width: 70px !important; + } + + .min-h-lg-up\:_7 { + min-height: 70px !important; + } + + .min-w-lg-up\:_7 { + min-width: 70px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:_7 { + height: 70px !important; + } + + .w-lg-down\:_7 { + width: 70px !important; + } + + .max-h-lg-down\:_7 { + max-height: 70px !important; + } + + .max-w-lg-down\:_7 { + max-width: 70px !important; + } + + .min-h-lg-down\:_7 { + min-height: 70px !important; + } + + .min-w-lg-down\:_7 { + min-width: 70px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:_7 { + height: 70px !important; + } + + .w-xl\:_7 { + width: 70px !important; + } + + .max-h-xl\:_7 { + max-height: 70px !important; + } + + .max-w-xl\:_7 { + max-width: 70px !important; + } + + .min-h-xl\:_7 { + min-height: 70px !important; + } + + .min-w-xl\:_7 { + min-width: 70px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:_7 { + height: 70px !important; + } + + .w-xl-up\:_7 { + width: 70px !important; + } + + .max-h-xl-up\:_7 { + max-height: 70px !important; + } + + .max-w-xl-up\:_7 { + max-width: 70px !important; + } + + .min-h-xl-up\:_7 { + min-height: 70px !important; + } + + .min-w-xl-up\:_7 { + min-width: 70px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:_7 { + height: 70px !important; + } + + .w-xl-down\:_7 { + width: 70px !important; + } + + .max-h-xl-down\:_7 { + max-height: 70px !important; + } + + .max-w-xl-down\:_7 { + max-width: 70px !important; + } + + .min-h-xl-down\:_7 { + min-height: 70px !important; + } + + .min-w-xl-down\:_7 { + min-width: 70px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:_7 { + height: 70px !important; + } + + .w-xxl\:_7 { + width: 70px !important; + } + + .max-h-xxl\:_7 { + max-height: 70px !important; + } + + .max-w-xxl\:_7 { + max-width: 70px !important; + } + + .min-h-xxl\:_7 { + min-height: 70px !important; + } + + .min-w-xxl\:_7 { + min-width: 70px !important; + } +} +.h\:_8 { + height: 80px !important; +} + +.w\:_8 { + width: 80px !important; +} + +.max-h\:_8 { + max-height: 80px !important; +} + +.max-w\:_8 { + max-width: 80px !important; +} + +.min-h\:_8 { + min-height: 80px !important; +} + +.min-w\:_8 { + min-width: 80px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:_8 { + height: 80px !important; + } + + .w-xs\:_8 { + width: 80px !important; + } + + .max-h-xs\:_8 { + max-height: 80px !important; + } + + .max-w-xs\:_8 { + max-width: 80px !important; + } + + .min-h-xs\:_8 { + min-height: 80px !important; + } + + .min-w-xs\:_8 { + min-width: 80px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:_8 { + height: 80px !important; + } + + .w-sm\:_8 { + width: 80px !important; + } + + .max-h-sm\:_8 { + max-height: 80px !important; + } + + .max-w-sm\:_8 { + max-width: 80px !important; + } + + .min-h-sm\:_8 { + min-height: 80px !important; + } + + .min-w-sm\:_8 { + min-width: 80px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:_8 { + height: 80px !important; + } + + .w-sm-up\:_8 { + width: 80px !important; + } + + .max-h-sm-up\:_8 { + max-height: 80px !important; + } + + .max-w-sm-up\:_8 { + max-width: 80px !important; + } + + .min-h-sm-up\:_8 { + min-height: 80px !important; + } + + .min-w-sm-up\:_8 { + min-width: 80px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:_8 { + height: 80px !important; + } + + .w-sm-down\:_8 { + width: 80px !important; + } + + .max-h-sm-down\:_8 { + max-height: 80px !important; + } + + .max-w-sm-down\:_8 { + max-width: 80px !important; + } + + .min-h-sm-down\:_8 { + min-height: 80px !important; + } + + .min-w-sm-down\:_8 { + min-width: 80px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:_8 { + height: 80px !important; + } + + .w-md\:_8 { + width: 80px !important; + } + + .max-h-md\:_8 { + max-height: 80px !important; + } + + .max-w-md\:_8 { + max-width: 80px !important; + } + + .min-h-md\:_8 { + min-height: 80px !important; + } + + .min-w-md\:_8 { + min-width: 80px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:_8 { + height: 80px !important; + } + + .w-md-up\:_8 { + width: 80px !important; + } + + .max-h-md-up\:_8 { + max-height: 80px !important; + } + + .max-w-md-up\:_8 { + max-width: 80px !important; + } + + .min-h-md-up\:_8 { + min-height: 80px !important; + } + + .min-w-md-up\:_8 { + min-width: 80px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:_8 { + height: 80px !important; + } + + .w-md-down\:_8 { + width: 80px !important; + } + + .max-h-md-down\:_8 { + max-height: 80px !important; + } + + .max-w-md-down\:_8 { + max-width: 80px !important; + } + + .min-h-md-down\:_8 { + min-height: 80px !important; + } + + .min-w-md-down\:_8 { + min-width: 80px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:_8 { + height: 80px !important; + } + + .w-lg\:_8 { + width: 80px !important; + } + + .max-h-lg\:_8 { + max-height: 80px !important; + } + + .max-w-lg\:_8 { + max-width: 80px !important; + } + + .min-h-lg\:_8 { + min-height: 80px !important; + } + + .min-w-lg\:_8 { + min-width: 80px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:_8 { + height: 80px !important; + } + + .w-lg-up\:_8 { + width: 80px !important; + } + + .max-h-lg-up\:_8 { + max-height: 80px !important; + } + + .max-w-lg-up\:_8 { + max-width: 80px !important; + } + + .min-h-lg-up\:_8 { + min-height: 80px !important; + } + + .min-w-lg-up\:_8 { + min-width: 80px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:_8 { + height: 80px !important; + } + + .w-lg-down\:_8 { + width: 80px !important; + } + + .max-h-lg-down\:_8 { + max-height: 80px !important; + } + + .max-w-lg-down\:_8 { + max-width: 80px !important; + } + + .min-h-lg-down\:_8 { + min-height: 80px !important; + } + + .min-w-lg-down\:_8 { + min-width: 80px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:_8 { + height: 80px !important; + } + + .w-xl\:_8 { + width: 80px !important; + } + + .max-h-xl\:_8 { + max-height: 80px !important; + } + + .max-w-xl\:_8 { + max-width: 80px !important; + } + + .min-h-xl\:_8 { + min-height: 80px !important; + } + + .min-w-xl\:_8 { + min-width: 80px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:_8 { + height: 80px !important; + } + + .w-xl-up\:_8 { + width: 80px !important; + } + + .max-h-xl-up\:_8 { + max-height: 80px !important; + } + + .max-w-xl-up\:_8 { + max-width: 80px !important; + } + + .min-h-xl-up\:_8 { + min-height: 80px !important; + } + + .min-w-xl-up\:_8 { + min-width: 80px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:_8 { + height: 80px !important; + } + + .w-xl-down\:_8 { + width: 80px !important; + } + + .max-h-xl-down\:_8 { + max-height: 80px !important; + } + + .max-w-xl-down\:_8 { + max-width: 80px !important; + } + + .min-h-xl-down\:_8 { + min-height: 80px !important; + } + + .min-w-xl-down\:_8 { + min-width: 80px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:_8 { + height: 80px !important; + } + + .w-xxl\:_8 { + width: 80px !important; + } + + .max-h-xxl\:_8 { + max-height: 80px !important; + } + + .max-w-xxl\:_8 { + max-width: 80px !important; + } + + .min-h-xxl\:_8 { + min-height: 80px !important; + } + + .min-w-xxl\:_8 { + min-width: 80px !important; + } +} +.h\:_9 { + height: 90px !important; +} + +.w\:_9 { + width: 90px !important; +} + +.max-h\:_9 { + max-height: 90px !important; +} + +.max-w\:_9 { + max-width: 90px !important; +} + +.min-h\:_9 { + min-height: 90px !important; +} + +.min-w\:_9 { + min-width: 90px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:_9 { + height: 90px !important; + } + + .w-xs\:_9 { + width: 90px !important; + } + + .max-h-xs\:_9 { + max-height: 90px !important; + } + + .max-w-xs\:_9 { + max-width: 90px !important; + } + + .min-h-xs\:_9 { + min-height: 90px !important; + } + + .min-w-xs\:_9 { + min-width: 90px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:_9 { + height: 90px !important; + } + + .w-sm\:_9 { + width: 90px !important; + } + + .max-h-sm\:_9 { + max-height: 90px !important; + } + + .max-w-sm\:_9 { + max-width: 90px !important; + } + + .min-h-sm\:_9 { + min-height: 90px !important; + } + + .min-w-sm\:_9 { + min-width: 90px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:_9 { + height: 90px !important; + } + + .w-sm-up\:_9 { + width: 90px !important; + } + + .max-h-sm-up\:_9 { + max-height: 90px !important; + } + + .max-w-sm-up\:_9 { + max-width: 90px !important; + } + + .min-h-sm-up\:_9 { + min-height: 90px !important; + } + + .min-w-sm-up\:_9 { + min-width: 90px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:_9 { + height: 90px !important; + } + + .w-sm-down\:_9 { + width: 90px !important; + } + + .max-h-sm-down\:_9 { + max-height: 90px !important; + } + + .max-w-sm-down\:_9 { + max-width: 90px !important; + } + + .min-h-sm-down\:_9 { + min-height: 90px !important; + } + + .min-w-sm-down\:_9 { + min-width: 90px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:_9 { + height: 90px !important; + } + + .w-md\:_9 { + width: 90px !important; + } + + .max-h-md\:_9 { + max-height: 90px !important; + } + + .max-w-md\:_9 { + max-width: 90px !important; + } + + .min-h-md\:_9 { + min-height: 90px !important; + } + + .min-w-md\:_9 { + min-width: 90px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:_9 { + height: 90px !important; + } + + .w-md-up\:_9 { + width: 90px !important; + } + + .max-h-md-up\:_9 { + max-height: 90px !important; + } + + .max-w-md-up\:_9 { + max-width: 90px !important; + } + + .min-h-md-up\:_9 { + min-height: 90px !important; + } + + .min-w-md-up\:_9 { + min-width: 90px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:_9 { + height: 90px !important; + } + + .w-md-down\:_9 { + width: 90px !important; + } + + .max-h-md-down\:_9 { + max-height: 90px !important; + } + + .max-w-md-down\:_9 { + max-width: 90px !important; + } + + .min-h-md-down\:_9 { + min-height: 90px !important; + } + + .min-w-md-down\:_9 { + min-width: 90px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:_9 { + height: 90px !important; + } + + .w-lg\:_9 { + width: 90px !important; + } + + .max-h-lg\:_9 { + max-height: 90px !important; + } + + .max-w-lg\:_9 { + max-width: 90px !important; + } + + .min-h-lg\:_9 { + min-height: 90px !important; + } + + .min-w-lg\:_9 { + min-width: 90px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:_9 { + height: 90px !important; + } + + .w-lg-up\:_9 { + width: 90px !important; + } + + .max-h-lg-up\:_9 { + max-height: 90px !important; + } + + .max-w-lg-up\:_9 { + max-width: 90px !important; + } + + .min-h-lg-up\:_9 { + min-height: 90px !important; + } + + .min-w-lg-up\:_9 { + min-width: 90px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:_9 { + height: 90px !important; + } + + .w-lg-down\:_9 { + width: 90px !important; + } + + .max-h-lg-down\:_9 { + max-height: 90px !important; + } + + .max-w-lg-down\:_9 { + max-width: 90px !important; + } + + .min-h-lg-down\:_9 { + min-height: 90px !important; + } + + .min-w-lg-down\:_9 { + min-width: 90px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:_9 { + height: 90px !important; + } + + .w-xl\:_9 { + width: 90px !important; + } + + .max-h-xl\:_9 { + max-height: 90px !important; + } + + .max-w-xl\:_9 { + max-width: 90px !important; + } + + .min-h-xl\:_9 { + min-height: 90px !important; + } + + .min-w-xl\:_9 { + min-width: 90px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:_9 { + height: 90px !important; + } + + .w-xl-up\:_9 { + width: 90px !important; + } + + .max-h-xl-up\:_9 { + max-height: 90px !important; + } + + .max-w-xl-up\:_9 { + max-width: 90px !important; + } + + .min-h-xl-up\:_9 { + min-height: 90px !important; + } + + .min-w-xl-up\:_9 { + min-width: 90px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:_9 { + height: 90px !important; + } + + .w-xl-down\:_9 { + width: 90px !important; + } + + .max-h-xl-down\:_9 { + max-height: 90px !important; + } + + .max-w-xl-down\:_9 { + max-width: 90px !important; + } + + .min-h-xl-down\:_9 { + min-height: 90px !important; + } + + .min-w-xl-down\:_9 { + min-width: 90px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:_9 { + height: 90px !important; + } + + .w-xxl\:_9 { + width: 90px !important; + } + + .max-h-xxl\:_9 { + max-height: 90px !important; + } + + .max-w-xxl\:_9 { + max-width: 90px !important; + } + + .min-h-xxl\:_9 { + min-height: 90px !important; + } + + .min-w-xxl\:_9 { + min-width: 90px !important; + } +} +.h\:_10 { + height: 100px !important; +} + +.w\:_10 { + width: 100px !important; +} + +.max-h\:_10 { + max-height: 100px !important; +} + +.max-w\:_10 { + max-width: 100px !important; +} + +.min-h\:_10 { + min-height: 100px !important; +} + +.min-w\:_10 { + min-width: 100px !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:_10 { + height: 100px !important; + } + + .w-xs\:_10 { + width: 100px !important; + } + + .max-h-xs\:_10 { + max-height: 100px !important; + } + + .max-w-xs\:_10 { + max-width: 100px !important; + } + + .min-h-xs\:_10 { + min-height: 100px !important; + } + + .min-w-xs\:_10 { + min-width: 100px !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:_10 { + height: 100px !important; + } + + .w-sm\:_10 { + width: 100px !important; + } + + .max-h-sm\:_10 { + max-height: 100px !important; + } + + .max-w-sm\:_10 { + max-width: 100px !important; + } + + .min-h-sm\:_10 { + min-height: 100px !important; + } + + .min-w-sm\:_10 { + min-width: 100px !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:_10 { + height: 100px !important; + } + + .w-sm-up\:_10 { + width: 100px !important; + } + + .max-h-sm-up\:_10 { + max-height: 100px !important; + } + + .max-w-sm-up\:_10 { + max-width: 100px !important; + } + + .min-h-sm-up\:_10 { + min-height: 100px !important; + } + + .min-w-sm-up\:_10 { + min-width: 100px !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:_10 { + height: 100px !important; + } + + .w-sm-down\:_10 { + width: 100px !important; + } + + .max-h-sm-down\:_10 { + max-height: 100px !important; + } + + .max-w-sm-down\:_10 { + max-width: 100px !important; + } + + .min-h-sm-down\:_10 { + min-height: 100px !important; + } + + .min-w-sm-down\:_10 { + min-width: 100px !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:_10 { + height: 100px !important; + } + + .w-md\:_10 { + width: 100px !important; + } + + .max-h-md\:_10 { + max-height: 100px !important; + } + + .max-w-md\:_10 { + max-width: 100px !important; + } + + .min-h-md\:_10 { + min-height: 100px !important; + } + + .min-w-md\:_10 { + min-width: 100px !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:_10 { + height: 100px !important; + } + + .w-md-up\:_10 { + width: 100px !important; + } + + .max-h-md-up\:_10 { + max-height: 100px !important; + } + + .max-w-md-up\:_10 { + max-width: 100px !important; + } + + .min-h-md-up\:_10 { + min-height: 100px !important; + } + + .min-w-md-up\:_10 { + min-width: 100px !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:_10 { + height: 100px !important; + } + + .w-md-down\:_10 { + width: 100px !important; + } + + .max-h-md-down\:_10 { + max-height: 100px !important; + } + + .max-w-md-down\:_10 { + max-width: 100px !important; + } + + .min-h-md-down\:_10 { + min-height: 100px !important; + } + + .min-w-md-down\:_10 { + min-width: 100px !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:_10 { + height: 100px !important; + } + + .w-lg\:_10 { + width: 100px !important; + } + + .max-h-lg\:_10 { + max-height: 100px !important; + } + + .max-w-lg\:_10 { + max-width: 100px !important; + } + + .min-h-lg\:_10 { + min-height: 100px !important; + } + + .min-w-lg\:_10 { + min-width: 100px !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:_10 { + height: 100px !important; + } + + .w-lg-up\:_10 { + width: 100px !important; + } + + .max-h-lg-up\:_10 { + max-height: 100px !important; + } + + .max-w-lg-up\:_10 { + max-width: 100px !important; + } + + .min-h-lg-up\:_10 { + min-height: 100px !important; + } + + .min-w-lg-up\:_10 { + min-width: 100px !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:_10 { + height: 100px !important; + } + + .w-lg-down\:_10 { + width: 100px !important; + } + + .max-h-lg-down\:_10 { + max-height: 100px !important; + } + + .max-w-lg-down\:_10 { + max-width: 100px !important; + } + + .min-h-lg-down\:_10 { + min-height: 100px !important; + } + + .min-w-lg-down\:_10 { + min-width: 100px !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:_10 { + height: 100px !important; + } + + .w-xl\:_10 { + width: 100px !important; + } + + .max-h-xl\:_10 { + max-height: 100px !important; + } + + .max-w-xl\:_10 { + max-width: 100px !important; + } + + .min-h-xl\:_10 { + min-height: 100px !important; + } + + .min-w-xl\:_10 { + min-width: 100px !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:_10 { + height: 100px !important; + } + + .w-xl-up\:_10 { + width: 100px !important; + } + + .max-h-xl-up\:_10 { + max-height: 100px !important; + } + + .max-w-xl-up\:_10 { + max-width: 100px !important; + } + + .min-h-xl-up\:_10 { + min-height: 100px !important; + } + + .min-w-xl-up\:_10 { + min-width: 100px !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:_10 { + height: 100px !important; + } + + .w-xl-down\:_10 { + width: 100px !important; + } + + .max-h-xl-down\:_10 { + max-height: 100px !important; + } + + .max-w-xl-down\:_10 { + max-width: 100px !important; + } + + .min-h-xl-down\:_10 { + min-height: 100px !important; + } + + .min-w-xl-down\:_10 { + min-width: 100px !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:_10 { + height: 100px !important; + } + + .w-xxl\:_10 { + width: 100px !important; + } + + .max-h-xxl\:_10 { + max-height: 100px !important; + } + + .max-w-xxl\:_10 { + max-width: 100px !important; + } + + .min-h-xxl\:_10 { + min-height: 100px !important; + } + + .min-w-xxl\:_10 { + min-width: 100px !important; + } +} +.h\:auto { + height: auto !important; +} + +.w\:auto { + width: auto !important; +} + +.max-h\:auto { + max-height: auto !important; +} + +.max-w\:auto { + max-width: auto !important; +} + +.min-h\:auto { + min-height: auto !important; +} + +.min-w\:auto { + min-width: auto !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:auto { + height: auto !important; + } + + .w-xs\:auto { + width: auto !important; + } + + .max-h-xs\:auto { + max-height: auto !important; + } + + .max-w-xs\:auto { + max-width: auto !important; + } + + .min-h-xs\:auto { + min-height: auto !important; + } + + .min-w-xs\:auto { + min-width: auto !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:auto { + height: auto !important; + } + + .w-sm\:auto { + width: auto !important; + } + + .max-h-sm\:auto { + max-height: auto !important; + } + + .max-w-sm\:auto { + max-width: auto !important; + } + + .min-h-sm\:auto { + min-height: auto !important; + } + + .min-w-sm\:auto { + min-width: auto !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:auto { + height: auto !important; + } + + .w-sm-up\:auto { + width: auto !important; + } + + .max-h-sm-up\:auto { + max-height: auto !important; + } + + .max-w-sm-up\:auto { + max-width: auto !important; + } + + .min-h-sm-up\:auto { + min-height: auto !important; + } + + .min-w-sm-up\:auto { + min-width: auto !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:auto { + height: auto !important; + } + + .w-sm-down\:auto { + width: auto !important; + } + + .max-h-sm-down\:auto { + max-height: auto !important; + } + + .max-w-sm-down\:auto { + max-width: auto !important; + } + + .min-h-sm-down\:auto { + min-height: auto !important; + } + + .min-w-sm-down\:auto { + min-width: auto !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:auto { + height: auto !important; + } + + .w-md\:auto { + width: auto !important; + } + + .max-h-md\:auto { + max-height: auto !important; + } + + .max-w-md\:auto { + max-width: auto !important; + } + + .min-h-md\:auto { + min-height: auto !important; + } + + .min-w-md\:auto { + min-width: auto !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:auto { + height: auto !important; + } + + .w-md-up\:auto { + width: auto !important; + } + + .max-h-md-up\:auto { + max-height: auto !important; + } + + .max-w-md-up\:auto { + max-width: auto !important; + } + + .min-h-md-up\:auto { + min-height: auto !important; + } + + .min-w-md-up\:auto { + min-width: auto !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:auto { + height: auto !important; + } + + .w-md-down\:auto { + width: auto !important; + } + + .max-h-md-down\:auto { + max-height: auto !important; + } + + .max-w-md-down\:auto { + max-width: auto !important; + } + + .min-h-md-down\:auto { + min-height: auto !important; + } + + .min-w-md-down\:auto { + min-width: auto !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:auto { + height: auto !important; + } + + .w-lg\:auto { + width: auto !important; + } + + .max-h-lg\:auto { + max-height: auto !important; + } + + .max-w-lg\:auto { + max-width: auto !important; + } + + .min-h-lg\:auto { + min-height: auto !important; + } + + .min-w-lg\:auto { + min-width: auto !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:auto { + height: auto !important; + } + + .w-lg-up\:auto { + width: auto !important; + } + + .max-h-lg-up\:auto { + max-height: auto !important; + } + + .max-w-lg-up\:auto { + max-width: auto !important; + } + + .min-h-lg-up\:auto { + min-height: auto !important; + } + + .min-w-lg-up\:auto { + min-width: auto !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:auto { + height: auto !important; + } + + .w-lg-down\:auto { + width: auto !important; + } + + .max-h-lg-down\:auto { + max-height: auto !important; + } + + .max-w-lg-down\:auto { + max-width: auto !important; + } + + .min-h-lg-down\:auto { + min-height: auto !important; + } + + .min-w-lg-down\:auto { + min-width: auto !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:auto { + height: auto !important; + } + + .w-xl\:auto { + width: auto !important; + } + + .max-h-xl\:auto { + max-height: auto !important; + } + + .max-w-xl\:auto { + max-width: auto !important; + } + + .min-h-xl\:auto { + min-height: auto !important; + } + + .min-w-xl\:auto { + min-width: auto !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:auto { + height: auto !important; + } + + .w-xl-up\:auto { + width: auto !important; + } + + .max-h-xl-up\:auto { + max-height: auto !important; + } + + .max-w-xl-up\:auto { + max-width: auto !important; + } + + .min-h-xl-up\:auto { + min-height: auto !important; + } + + .min-w-xl-up\:auto { + min-width: auto !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:auto { + height: auto !important; + } + + .w-xl-down\:auto { + width: auto !important; + } + + .max-h-xl-down\:auto { + max-height: auto !important; + } + + .max-w-xl-down\:auto { + max-width: auto !important; + } + + .min-h-xl-down\:auto { + min-height: auto !important; + } + + .min-w-xl-down\:auto { + min-width: auto !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:auto { + height: auto !important; + } + + .w-xxl\:auto { + width: auto !important; + } + + .max-h-xxl\:auto { + max-height: auto !important; + } + + .max-w-xxl\:auto { + max-width: auto !important; + } + + .min-h-xxl\:auto { + min-height: auto !important; + } + + .min-w-xxl\:auto { + min-width: auto !important; + } +} +.h\:10 { + height: 10% !important; +} + +.w\:10 { + width: 10% !important; +} + +.max-h\:10 { + max-height: 10% !important; +} + +.max-w\:10 { + max-width: 10% !important; +} + +.min-h\:10 { + min-height: 10% !important; +} + +.min-w\:10 { + min-width: 10% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:10 { + height: 10% !important; + } + + .w-xs\:10 { + width: 10% !important; + } + + .max-h-xs\:10 { + max-height: 10% !important; + } + + .max-w-xs\:10 { + max-width: 10% !important; + } + + .min-h-xs\:10 { + min-height: 10% !important; + } + + .min-w-xs\:10 { + min-width: 10% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:10 { + height: 10% !important; + } + + .w-sm\:10 { + width: 10% !important; + } + + .max-h-sm\:10 { + max-height: 10% !important; + } + + .max-w-sm\:10 { + max-width: 10% !important; + } + + .min-h-sm\:10 { + min-height: 10% !important; + } + + .min-w-sm\:10 { + min-width: 10% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:10 { + height: 10% !important; + } + + .w-sm-up\:10 { + width: 10% !important; + } + + .max-h-sm-up\:10 { + max-height: 10% !important; + } + + .max-w-sm-up\:10 { + max-width: 10% !important; + } + + .min-h-sm-up\:10 { + min-height: 10% !important; + } + + .min-w-sm-up\:10 { + min-width: 10% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:10 { + height: 10% !important; + } + + .w-sm-down\:10 { + width: 10% !important; + } + + .max-h-sm-down\:10 { + max-height: 10% !important; + } + + .max-w-sm-down\:10 { + max-width: 10% !important; + } + + .min-h-sm-down\:10 { + min-height: 10% !important; + } + + .min-w-sm-down\:10 { + min-width: 10% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:10 { + height: 10% !important; + } + + .w-md\:10 { + width: 10% !important; + } + + .max-h-md\:10 { + max-height: 10% !important; + } + + .max-w-md\:10 { + max-width: 10% !important; + } + + .min-h-md\:10 { + min-height: 10% !important; + } + + .min-w-md\:10 { + min-width: 10% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:10 { + height: 10% !important; + } + + .w-md-up\:10 { + width: 10% !important; + } + + .max-h-md-up\:10 { + max-height: 10% !important; + } + + .max-w-md-up\:10 { + max-width: 10% !important; + } + + .min-h-md-up\:10 { + min-height: 10% !important; + } + + .min-w-md-up\:10 { + min-width: 10% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:10 { + height: 10% !important; + } + + .w-md-down\:10 { + width: 10% !important; + } + + .max-h-md-down\:10 { + max-height: 10% !important; + } + + .max-w-md-down\:10 { + max-width: 10% !important; + } + + .min-h-md-down\:10 { + min-height: 10% !important; + } + + .min-w-md-down\:10 { + min-width: 10% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:10 { + height: 10% !important; + } + + .w-lg\:10 { + width: 10% !important; + } + + .max-h-lg\:10 { + max-height: 10% !important; + } + + .max-w-lg\:10 { + max-width: 10% !important; + } + + .min-h-lg\:10 { + min-height: 10% !important; + } + + .min-w-lg\:10 { + min-width: 10% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:10 { + height: 10% !important; + } + + .w-lg-up\:10 { + width: 10% !important; + } + + .max-h-lg-up\:10 { + max-height: 10% !important; + } + + .max-w-lg-up\:10 { + max-width: 10% !important; + } + + .min-h-lg-up\:10 { + min-height: 10% !important; + } + + .min-w-lg-up\:10 { + min-width: 10% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:10 { + height: 10% !important; + } + + .w-lg-down\:10 { + width: 10% !important; + } + + .max-h-lg-down\:10 { + max-height: 10% !important; + } + + .max-w-lg-down\:10 { + max-width: 10% !important; + } + + .min-h-lg-down\:10 { + min-height: 10% !important; + } + + .min-w-lg-down\:10 { + min-width: 10% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:10 { + height: 10% !important; + } + + .w-xl\:10 { + width: 10% !important; + } + + .max-h-xl\:10 { + max-height: 10% !important; + } + + .max-w-xl\:10 { + max-width: 10% !important; + } + + .min-h-xl\:10 { + min-height: 10% !important; + } + + .min-w-xl\:10 { + min-width: 10% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:10 { + height: 10% !important; + } + + .w-xl-up\:10 { + width: 10% !important; + } + + .max-h-xl-up\:10 { + max-height: 10% !important; + } + + .max-w-xl-up\:10 { + max-width: 10% !important; + } + + .min-h-xl-up\:10 { + min-height: 10% !important; + } + + .min-w-xl-up\:10 { + min-width: 10% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:10 { + height: 10% !important; + } + + .w-xl-down\:10 { + width: 10% !important; + } + + .max-h-xl-down\:10 { + max-height: 10% !important; + } + + .max-w-xl-down\:10 { + max-width: 10% !important; + } + + .min-h-xl-down\:10 { + min-height: 10% !important; + } + + .min-w-xl-down\:10 { + min-width: 10% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:10 { + height: 10% !important; + } + + .w-xxl\:10 { + width: 10% !important; + } + + .max-h-xxl\:10 { + max-height: 10% !important; + } + + .max-w-xxl\:10 { + max-width: 10% !important; + } + + .min-h-xxl\:10 { + min-height: 10% !important; + } + + .min-w-xxl\:10 { + min-width: 10% !important; + } +} +.h\:20 { + height: 20% !important; +} + +.w\:20 { + width: 20% !important; +} + +.max-h\:20 { + max-height: 20% !important; +} + +.max-w\:20 { + max-width: 20% !important; +} + +.min-h\:20 { + min-height: 20% !important; +} + +.min-w\:20 { + min-width: 20% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:20 { + height: 20% !important; + } + + .w-xs\:20 { + width: 20% !important; + } + + .max-h-xs\:20 { + max-height: 20% !important; + } + + .max-w-xs\:20 { + max-width: 20% !important; + } + + .min-h-xs\:20 { + min-height: 20% !important; + } + + .min-w-xs\:20 { + min-width: 20% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:20 { + height: 20% !important; + } + + .w-sm\:20 { + width: 20% !important; + } + + .max-h-sm\:20 { + max-height: 20% !important; + } + + .max-w-sm\:20 { + max-width: 20% !important; + } + + .min-h-sm\:20 { + min-height: 20% !important; + } + + .min-w-sm\:20 { + min-width: 20% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:20 { + height: 20% !important; + } + + .w-sm-up\:20 { + width: 20% !important; + } + + .max-h-sm-up\:20 { + max-height: 20% !important; + } + + .max-w-sm-up\:20 { + max-width: 20% !important; + } + + .min-h-sm-up\:20 { + min-height: 20% !important; + } + + .min-w-sm-up\:20 { + min-width: 20% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:20 { + height: 20% !important; + } + + .w-sm-down\:20 { + width: 20% !important; + } + + .max-h-sm-down\:20 { + max-height: 20% !important; + } + + .max-w-sm-down\:20 { + max-width: 20% !important; + } + + .min-h-sm-down\:20 { + min-height: 20% !important; + } + + .min-w-sm-down\:20 { + min-width: 20% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:20 { + height: 20% !important; + } + + .w-md\:20 { + width: 20% !important; + } + + .max-h-md\:20 { + max-height: 20% !important; + } + + .max-w-md\:20 { + max-width: 20% !important; + } + + .min-h-md\:20 { + min-height: 20% !important; + } + + .min-w-md\:20 { + min-width: 20% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:20 { + height: 20% !important; + } + + .w-md-up\:20 { + width: 20% !important; + } + + .max-h-md-up\:20 { + max-height: 20% !important; + } + + .max-w-md-up\:20 { + max-width: 20% !important; + } + + .min-h-md-up\:20 { + min-height: 20% !important; + } + + .min-w-md-up\:20 { + min-width: 20% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:20 { + height: 20% !important; + } + + .w-md-down\:20 { + width: 20% !important; + } + + .max-h-md-down\:20 { + max-height: 20% !important; + } + + .max-w-md-down\:20 { + max-width: 20% !important; + } + + .min-h-md-down\:20 { + min-height: 20% !important; + } + + .min-w-md-down\:20 { + min-width: 20% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:20 { + height: 20% !important; + } + + .w-lg\:20 { + width: 20% !important; + } + + .max-h-lg\:20 { + max-height: 20% !important; + } + + .max-w-lg\:20 { + max-width: 20% !important; + } + + .min-h-lg\:20 { + min-height: 20% !important; + } + + .min-w-lg\:20 { + min-width: 20% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:20 { + height: 20% !important; + } + + .w-lg-up\:20 { + width: 20% !important; + } + + .max-h-lg-up\:20 { + max-height: 20% !important; + } + + .max-w-lg-up\:20 { + max-width: 20% !important; + } + + .min-h-lg-up\:20 { + min-height: 20% !important; + } + + .min-w-lg-up\:20 { + min-width: 20% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:20 { + height: 20% !important; + } + + .w-lg-down\:20 { + width: 20% !important; + } + + .max-h-lg-down\:20 { + max-height: 20% !important; + } + + .max-w-lg-down\:20 { + max-width: 20% !important; + } + + .min-h-lg-down\:20 { + min-height: 20% !important; + } + + .min-w-lg-down\:20 { + min-width: 20% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:20 { + height: 20% !important; + } + + .w-xl\:20 { + width: 20% !important; + } + + .max-h-xl\:20 { + max-height: 20% !important; + } + + .max-w-xl\:20 { + max-width: 20% !important; + } + + .min-h-xl\:20 { + min-height: 20% !important; + } + + .min-w-xl\:20 { + min-width: 20% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:20 { + height: 20% !important; + } + + .w-xl-up\:20 { + width: 20% !important; + } + + .max-h-xl-up\:20 { + max-height: 20% !important; + } + + .max-w-xl-up\:20 { + max-width: 20% !important; + } + + .min-h-xl-up\:20 { + min-height: 20% !important; + } + + .min-w-xl-up\:20 { + min-width: 20% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:20 { + height: 20% !important; + } + + .w-xl-down\:20 { + width: 20% !important; + } + + .max-h-xl-down\:20 { + max-height: 20% !important; + } + + .max-w-xl-down\:20 { + max-width: 20% !important; + } + + .min-h-xl-down\:20 { + min-height: 20% !important; + } + + .min-w-xl-down\:20 { + min-width: 20% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:20 { + height: 20% !important; + } + + .w-xxl\:20 { + width: 20% !important; + } + + .max-h-xxl\:20 { + max-height: 20% !important; + } + + .max-w-xxl\:20 { + max-width: 20% !important; + } + + .min-h-xxl\:20 { + min-height: 20% !important; + } + + .min-w-xxl\:20 { + min-width: 20% !important; + } +} +.h\:25 { + height: 25% !important; +} + +.w\:25 { + width: 25% !important; +} + +.max-h\:25 { + max-height: 25% !important; +} + +.max-w\:25 { + max-width: 25% !important; +} + +.min-h\:25 { + min-height: 25% !important; +} + +.min-w\:25 { + min-width: 25% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:25 { + height: 25% !important; + } + + .w-xs\:25 { + width: 25% !important; + } + + .max-h-xs\:25 { + max-height: 25% !important; + } + + .max-w-xs\:25 { + max-width: 25% !important; + } + + .min-h-xs\:25 { + min-height: 25% !important; + } + + .min-w-xs\:25 { + min-width: 25% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:25 { + height: 25% !important; + } + + .w-sm\:25 { + width: 25% !important; + } + + .max-h-sm\:25 { + max-height: 25% !important; + } + + .max-w-sm\:25 { + max-width: 25% !important; + } + + .min-h-sm\:25 { + min-height: 25% !important; + } + + .min-w-sm\:25 { + min-width: 25% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:25 { + height: 25% !important; + } + + .w-sm-up\:25 { + width: 25% !important; + } + + .max-h-sm-up\:25 { + max-height: 25% !important; + } + + .max-w-sm-up\:25 { + max-width: 25% !important; + } + + .min-h-sm-up\:25 { + min-height: 25% !important; + } + + .min-w-sm-up\:25 { + min-width: 25% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:25 { + height: 25% !important; + } + + .w-sm-down\:25 { + width: 25% !important; + } + + .max-h-sm-down\:25 { + max-height: 25% !important; + } + + .max-w-sm-down\:25 { + max-width: 25% !important; + } + + .min-h-sm-down\:25 { + min-height: 25% !important; + } + + .min-w-sm-down\:25 { + min-width: 25% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:25 { + height: 25% !important; + } + + .w-md\:25 { + width: 25% !important; + } + + .max-h-md\:25 { + max-height: 25% !important; + } + + .max-w-md\:25 { + max-width: 25% !important; + } + + .min-h-md\:25 { + min-height: 25% !important; + } + + .min-w-md\:25 { + min-width: 25% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:25 { + height: 25% !important; + } + + .w-md-up\:25 { + width: 25% !important; + } + + .max-h-md-up\:25 { + max-height: 25% !important; + } + + .max-w-md-up\:25 { + max-width: 25% !important; + } + + .min-h-md-up\:25 { + min-height: 25% !important; + } + + .min-w-md-up\:25 { + min-width: 25% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:25 { + height: 25% !important; + } + + .w-md-down\:25 { + width: 25% !important; + } + + .max-h-md-down\:25 { + max-height: 25% !important; + } + + .max-w-md-down\:25 { + max-width: 25% !important; + } + + .min-h-md-down\:25 { + min-height: 25% !important; + } + + .min-w-md-down\:25 { + min-width: 25% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:25 { + height: 25% !important; + } + + .w-lg\:25 { + width: 25% !important; + } + + .max-h-lg\:25 { + max-height: 25% !important; + } + + .max-w-lg\:25 { + max-width: 25% !important; + } + + .min-h-lg\:25 { + min-height: 25% !important; + } + + .min-w-lg\:25 { + min-width: 25% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:25 { + height: 25% !important; + } + + .w-lg-up\:25 { + width: 25% !important; + } + + .max-h-lg-up\:25 { + max-height: 25% !important; + } + + .max-w-lg-up\:25 { + max-width: 25% !important; + } + + .min-h-lg-up\:25 { + min-height: 25% !important; + } + + .min-w-lg-up\:25 { + min-width: 25% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:25 { + height: 25% !important; + } + + .w-lg-down\:25 { + width: 25% !important; + } + + .max-h-lg-down\:25 { + max-height: 25% !important; + } + + .max-w-lg-down\:25 { + max-width: 25% !important; + } + + .min-h-lg-down\:25 { + min-height: 25% !important; + } + + .min-w-lg-down\:25 { + min-width: 25% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:25 { + height: 25% !important; + } + + .w-xl\:25 { + width: 25% !important; + } + + .max-h-xl\:25 { + max-height: 25% !important; + } + + .max-w-xl\:25 { + max-width: 25% !important; + } + + .min-h-xl\:25 { + min-height: 25% !important; + } + + .min-w-xl\:25 { + min-width: 25% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:25 { + height: 25% !important; + } + + .w-xl-up\:25 { + width: 25% !important; + } + + .max-h-xl-up\:25 { + max-height: 25% !important; + } + + .max-w-xl-up\:25 { + max-width: 25% !important; + } + + .min-h-xl-up\:25 { + min-height: 25% !important; + } + + .min-w-xl-up\:25 { + min-width: 25% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:25 { + height: 25% !important; + } + + .w-xl-down\:25 { + width: 25% !important; + } + + .max-h-xl-down\:25 { + max-height: 25% !important; + } + + .max-w-xl-down\:25 { + max-width: 25% !important; + } + + .min-h-xl-down\:25 { + min-height: 25% !important; + } + + .min-w-xl-down\:25 { + min-width: 25% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:25 { + height: 25% !important; + } + + .w-xxl\:25 { + width: 25% !important; + } + + .max-h-xxl\:25 { + max-height: 25% !important; + } + + .max-w-xxl\:25 { + max-width: 25% !important; + } + + .min-h-xxl\:25 { + min-height: 25% !important; + } + + .min-w-xxl\:25 { + min-width: 25% !important; + } +} +.h\:30 { + height: 30% !important; +} + +.w\:30 { + width: 30% !important; +} + +.max-h\:30 { + max-height: 30% !important; +} + +.max-w\:30 { + max-width: 30% !important; +} + +.min-h\:30 { + min-height: 30% !important; +} + +.min-w\:30 { + min-width: 30% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:30 { + height: 30% !important; + } + + .w-xs\:30 { + width: 30% !important; + } + + .max-h-xs\:30 { + max-height: 30% !important; + } + + .max-w-xs\:30 { + max-width: 30% !important; + } + + .min-h-xs\:30 { + min-height: 30% !important; + } + + .min-w-xs\:30 { + min-width: 30% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:30 { + height: 30% !important; + } + + .w-sm\:30 { + width: 30% !important; + } + + .max-h-sm\:30 { + max-height: 30% !important; + } + + .max-w-sm\:30 { + max-width: 30% !important; + } + + .min-h-sm\:30 { + min-height: 30% !important; + } + + .min-w-sm\:30 { + min-width: 30% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:30 { + height: 30% !important; + } + + .w-sm-up\:30 { + width: 30% !important; + } + + .max-h-sm-up\:30 { + max-height: 30% !important; + } + + .max-w-sm-up\:30 { + max-width: 30% !important; + } + + .min-h-sm-up\:30 { + min-height: 30% !important; + } + + .min-w-sm-up\:30 { + min-width: 30% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:30 { + height: 30% !important; + } + + .w-sm-down\:30 { + width: 30% !important; + } + + .max-h-sm-down\:30 { + max-height: 30% !important; + } + + .max-w-sm-down\:30 { + max-width: 30% !important; + } + + .min-h-sm-down\:30 { + min-height: 30% !important; + } + + .min-w-sm-down\:30 { + min-width: 30% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:30 { + height: 30% !important; + } + + .w-md\:30 { + width: 30% !important; + } + + .max-h-md\:30 { + max-height: 30% !important; + } + + .max-w-md\:30 { + max-width: 30% !important; + } + + .min-h-md\:30 { + min-height: 30% !important; + } + + .min-w-md\:30 { + min-width: 30% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:30 { + height: 30% !important; + } + + .w-md-up\:30 { + width: 30% !important; + } + + .max-h-md-up\:30 { + max-height: 30% !important; + } + + .max-w-md-up\:30 { + max-width: 30% !important; + } + + .min-h-md-up\:30 { + min-height: 30% !important; + } + + .min-w-md-up\:30 { + min-width: 30% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:30 { + height: 30% !important; + } + + .w-md-down\:30 { + width: 30% !important; + } + + .max-h-md-down\:30 { + max-height: 30% !important; + } + + .max-w-md-down\:30 { + max-width: 30% !important; + } + + .min-h-md-down\:30 { + min-height: 30% !important; + } + + .min-w-md-down\:30 { + min-width: 30% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:30 { + height: 30% !important; + } + + .w-lg\:30 { + width: 30% !important; + } + + .max-h-lg\:30 { + max-height: 30% !important; + } + + .max-w-lg\:30 { + max-width: 30% !important; + } + + .min-h-lg\:30 { + min-height: 30% !important; + } + + .min-w-lg\:30 { + min-width: 30% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:30 { + height: 30% !important; + } + + .w-lg-up\:30 { + width: 30% !important; + } + + .max-h-lg-up\:30 { + max-height: 30% !important; + } + + .max-w-lg-up\:30 { + max-width: 30% !important; + } + + .min-h-lg-up\:30 { + min-height: 30% !important; + } + + .min-w-lg-up\:30 { + min-width: 30% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:30 { + height: 30% !important; + } + + .w-lg-down\:30 { + width: 30% !important; + } + + .max-h-lg-down\:30 { + max-height: 30% !important; + } + + .max-w-lg-down\:30 { + max-width: 30% !important; + } + + .min-h-lg-down\:30 { + min-height: 30% !important; + } + + .min-w-lg-down\:30 { + min-width: 30% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:30 { + height: 30% !important; + } + + .w-xl\:30 { + width: 30% !important; + } + + .max-h-xl\:30 { + max-height: 30% !important; + } + + .max-w-xl\:30 { + max-width: 30% !important; + } + + .min-h-xl\:30 { + min-height: 30% !important; + } + + .min-w-xl\:30 { + min-width: 30% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:30 { + height: 30% !important; + } + + .w-xl-up\:30 { + width: 30% !important; + } + + .max-h-xl-up\:30 { + max-height: 30% !important; + } + + .max-w-xl-up\:30 { + max-width: 30% !important; + } + + .min-h-xl-up\:30 { + min-height: 30% !important; + } + + .min-w-xl-up\:30 { + min-width: 30% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:30 { + height: 30% !important; + } + + .w-xl-down\:30 { + width: 30% !important; + } + + .max-h-xl-down\:30 { + max-height: 30% !important; + } + + .max-w-xl-down\:30 { + max-width: 30% !important; + } + + .min-h-xl-down\:30 { + min-height: 30% !important; + } + + .min-w-xl-down\:30 { + min-width: 30% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:30 { + height: 30% !important; + } + + .w-xxl\:30 { + width: 30% !important; + } + + .max-h-xxl\:30 { + max-height: 30% !important; + } + + .max-w-xxl\:30 { + max-width: 30% !important; + } + + .min-h-xxl\:30 { + min-height: 30% !important; + } + + .min-w-xxl\:30 { + min-width: 30% !important; + } +} +.h\:33 { + height: 33.33% !important; +} + +.w\:33 { + width: 33.33% !important; +} + +.max-h\:33 { + max-height: 33.33% !important; +} + +.max-w\:33 { + max-width: 33.33% !important; +} + +.min-h\:33 { + min-height: 33.33% !important; +} + +.min-w\:33 { + min-width: 33.33% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:33 { + height: 33.33% !important; + } + + .w-xs\:33 { + width: 33.33% !important; + } + + .max-h-xs\:33 { + max-height: 33.33% !important; + } + + .max-w-xs\:33 { + max-width: 33.33% !important; + } + + .min-h-xs\:33 { + min-height: 33.33% !important; + } + + .min-w-xs\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:33 { + height: 33.33% !important; + } + + .w-sm\:33 { + width: 33.33% !important; + } + + .max-h-sm\:33 { + max-height: 33.33% !important; + } + + .max-w-sm\:33 { + max-width: 33.33% !important; + } + + .min-h-sm\:33 { + min-height: 33.33% !important; + } + + .min-w-sm\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:33 { + height: 33.33% !important; + } + + .w-sm-up\:33 { + width: 33.33% !important; + } + + .max-h-sm-up\:33 { + max-height: 33.33% !important; + } + + .max-w-sm-up\:33 { + max-width: 33.33% !important; + } + + .min-h-sm-up\:33 { + min-height: 33.33% !important; + } + + .min-w-sm-up\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:33 { + height: 33.33% !important; + } + + .w-sm-down\:33 { + width: 33.33% !important; + } + + .max-h-sm-down\:33 { + max-height: 33.33% !important; + } + + .max-w-sm-down\:33 { + max-width: 33.33% !important; + } + + .min-h-sm-down\:33 { + min-height: 33.33% !important; + } + + .min-w-sm-down\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:33 { + height: 33.33% !important; + } + + .w-md\:33 { + width: 33.33% !important; + } + + .max-h-md\:33 { + max-height: 33.33% !important; + } + + .max-w-md\:33 { + max-width: 33.33% !important; + } + + .min-h-md\:33 { + min-height: 33.33% !important; + } + + .min-w-md\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:33 { + height: 33.33% !important; + } + + .w-md-up\:33 { + width: 33.33% !important; + } + + .max-h-md-up\:33 { + max-height: 33.33% !important; + } + + .max-w-md-up\:33 { + max-width: 33.33% !important; + } + + .min-h-md-up\:33 { + min-height: 33.33% !important; + } + + .min-w-md-up\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:33 { + height: 33.33% !important; + } + + .w-md-down\:33 { + width: 33.33% !important; + } + + .max-h-md-down\:33 { + max-height: 33.33% !important; + } + + .max-w-md-down\:33 { + max-width: 33.33% !important; + } + + .min-h-md-down\:33 { + min-height: 33.33% !important; + } + + .min-w-md-down\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:33 { + height: 33.33% !important; + } + + .w-lg\:33 { + width: 33.33% !important; + } + + .max-h-lg\:33 { + max-height: 33.33% !important; + } + + .max-w-lg\:33 { + max-width: 33.33% !important; + } + + .min-h-lg\:33 { + min-height: 33.33% !important; + } + + .min-w-lg\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:33 { + height: 33.33% !important; + } + + .w-lg-up\:33 { + width: 33.33% !important; + } + + .max-h-lg-up\:33 { + max-height: 33.33% !important; + } + + .max-w-lg-up\:33 { + max-width: 33.33% !important; + } + + .min-h-lg-up\:33 { + min-height: 33.33% !important; + } + + .min-w-lg-up\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:33 { + height: 33.33% !important; + } + + .w-lg-down\:33 { + width: 33.33% !important; + } + + .max-h-lg-down\:33 { + max-height: 33.33% !important; + } + + .max-w-lg-down\:33 { + max-width: 33.33% !important; + } + + .min-h-lg-down\:33 { + min-height: 33.33% !important; + } + + .min-w-lg-down\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:33 { + height: 33.33% !important; + } + + .w-xl\:33 { + width: 33.33% !important; + } + + .max-h-xl\:33 { + max-height: 33.33% !important; + } + + .max-w-xl\:33 { + max-width: 33.33% !important; + } + + .min-h-xl\:33 { + min-height: 33.33% !important; + } + + .min-w-xl\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:33 { + height: 33.33% !important; + } + + .w-xl-up\:33 { + width: 33.33% !important; + } + + .max-h-xl-up\:33 { + max-height: 33.33% !important; + } + + .max-w-xl-up\:33 { + max-width: 33.33% !important; + } + + .min-h-xl-up\:33 { + min-height: 33.33% !important; + } + + .min-w-xl-up\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:33 { + height: 33.33% !important; + } + + .w-xl-down\:33 { + width: 33.33% !important; + } + + .max-h-xl-down\:33 { + max-height: 33.33% !important; + } + + .max-w-xl-down\:33 { + max-width: 33.33% !important; + } + + .min-h-xl-down\:33 { + min-height: 33.33% !important; + } + + .min-w-xl-down\:33 { + min-width: 33.33% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:33 { + height: 33.33% !important; + } + + .w-xxl\:33 { + width: 33.33% !important; + } + + .max-h-xxl\:33 { + max-height: 33.33% !important; + } + + .max-w-xxl\:33 { + max-width: 33.33% !important; + } + + .min-h-xxl\:33 { + min-height: 33.33% !important; + } + + .min-w-xxl\:33 { + min-width: 33.33% !important; + } +} +.h\:40 { + height: 40% !important; +} + +.w\:40 { + width: 40% !important; +} + +.max-h\:40 { + max-height: 40% !important; +} + +.max-w\:40 { + max-width: 40% !important; +} + +.min-h\:40 { + min-height: 40% !important; +} + +.min-w\:40 { + min-width: 40% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:40 { + height: 40% !important; + } + + .w-xs\:40 { + width: 40% !important; + } + + .max-h-xs\:40 { + max-height: 40% !important; + } + + .max-w-xs\:40 { + max-width: 40% !important; + } + + .min-h-xs\:40 { + min-height: 40% !important; + } + + .min-w-xs\:40 { + min-width: 40% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:40 { + height: 40% !important; + } + + .w-sm\:40 { + width: 40% !important; + } + + .max-h-sm\:40 { + max-height: 40% !important; + } + + .max-w-sm\:40 { + max-width: 40% !important; + } + + .min-h-sm\:40 { + min-height: 40% !important; + } + + .min-w-sm\:40 { + min-width: 40% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:40 { + height: 40% !important; + } + + .w-sm-up\:40 { + width: 40% !important; + } + + .max-h-sm-up\:40 { + max-height: 40% !important; + } + + .max-w-sm-up\:40 { + max-width: 40% !important; + } + + .min-h-sm-up\:40 { + min-height: 40% !important; + } + + .min-w-sm-up\:40 { + min-width: 40% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:40 { + height: 40% !important; + } + + .w-sm-down\:40 { + width: 40% !important; + } + + .max-h-sm-down\:40 { + max-height: 40% !important; + } + + .max-w-sm-down\:40 { + max-width: 40% !important; + } + + .min-h-sm-down\:40 { + min-height: 40% !important; + } + + .min-w-sm-down\:40 { + min-width: 40% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:40 { + height: 40% !important; + } + + .w-md\:40 { + width: 40% !important; + } + + .max-h-md\:40 { + max-height: 40% !important; + } + + .max-w-md\:40 { + max-width: 40% !important; + } + + .min-h-md\:40 { + min-height: 40% !important; + } + + .min-w-md\:40 { + min-width: 40% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:40 { + height: 40% !important; + } + + .w-md-up\:40 { + width: 40% !important; + } + + .max-h-md-up\:40 { + max-height: 40% !important; + } + + .max-w-md-up\:40 { + max-width: 40% !important; + } + + .min-h-md-up\:40 { + min-height: 40% !important; + } + + .min-w-md-up\:40 { + min-width: 40% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:40 { + height: 40% !important; + } + + .w-md-down\:40 { + width: 40% !important; + } + + .max-h-md-down\:40 { + max-height: 40% !important; + } + + .max-w-md-down\:40 { + max-width: 40% !important; + } + + .min-h-md-down\:40 { + min-height: 40% !important; + } + + .min-w-md-down\:40 { + min-width: 40% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:40 { + height: 40% !important; + } + + .w-lg\:40 { + width: 40% !important; + } + + .max-h-lg\:40 { + max-height: 40% !important; + } + + .max-w-lg\:40 { + max-width: 40% !important; + } + + .min-h-lg\:40 { + min-height: 40% !important; + } + + .min-w-lg\:40 { + min-width: 40% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:40 { + height: 40% !important; + } + + .w-lg-up\:40 { + width: 40% !important; + } + + .max-h-lg-up\:40 { + max-height: 40% !important; + } + + .max-w-lg-up\:40 { + max-width: 40% !important; + } + + .min-h-lg-up\:40 { + min-height: 40% !important; + } + + .min-w-lg-up\:40 { + min-width: 40% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:40 { + height: 40% !important; + } + + .w-lg-down\:40 { + width: 40% !important; + } + + .max-h-lg-down\:40 { + max-height: 40% !important; + } + + .max-w-lg-down\:40 { + max-width: 40% !important; + } + + .min-h-lg-down\:40 { + min-height: 40% !important; + } + + .min-w-lg-down\:40 { + min-width: 40% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:40 { + height: 40% !important; + } + + .w-xl\:40 { + width: 40% !important; + } + + .max-h-xl\:40 { + max-height: 40% !important; + } + + .max-w-xl\:40 { + max-width: 40% !important; + } + + .min-h-xl\:40 { + min-height: 40% !important; + } + + .min-w-xl\:40 { + min-width: 40% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:40 { + height: 40% !important; + } + + .w-xl-up\:40 { + width: 40% !important; + } + + .max-h-xl-up\:40 { + max-height: 40% !important; + } + + .max-w-xl-up\:40 { + max-width: 40% !important; + } + + .min-h-xl-up\:40 { + min-height: 40% !important; + } + + .min-w-xl-up\:40 { + min-width: 40% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:40 { + height: 40% !important; + } + + .w-xl-down\:40 { + width: 40% !important; + } + + .max-h-xl-down\:40 { + max-height: 40% !important; + } + + .max-w-xl-down\:40 { + max-width: 40% !important; + } + + .min-h-xl-down\:40 { + min-height: 40% !important; + } + + .min-w-xl-down\:40 { + min-width: 40% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:40 { + height: 40% !important; + } + + .w-xxl\:40 { + width: 40% !important; + } + + .max-h-xxl\:40 { + max-height: 40% !important; + } + + .max-w-xxl\:40 { + max-width: 40% !important; + } + + .min-h-xxl\:40 { + min-height: 40% !important; + } + + .min-w-xxl\:40 { + min-width: 40% !important; + } +} +.h\:45 { + height: 45% !important; +} + +.w\:45 { + width: 45% !important; +} + +.max-h\:45 { + max-height: 45% !important; +} + +.max-w\:45 { + max-width: 45% !important; +} + +.min-h\:45 { + min-height: 45% !important; +} + +.min-w\:45 { + min-width: 45% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:45 { + height: 45% !important; + } + + .w-xs\:45 { + width: 45% !important; + } + + .max-h-xs\:45 { + max-height: 45% !important; + } + + .max-w-xs\:45 { + max-width: 45% !important; + } + + .min-h-xs\:45 { + min-height: 45% !important; + } + + .min-w-xs\:45 { + min-width: 45% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:45 { + height: 45% !important; + } + + .w-sm\:45 { + width: 45% !important; + } + + .max-h-sm\:45 { + max-height: 45% !important; + } + + .max-w-sm\:45 { + max-width: 45% !important; + } + + .min-h-sm\:45 { + min-height: 45% !important; + } + + .min-w-sm\:45 { + min-width: 45% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:45 { + height: 45% !important; + } + + .w-sm-up\:45 { + width: 45% !important; + } + + .max-h-sm-up\:45 { + max-height: 45% !important; + } + + .max-w-sm-up\:45 { + max-width: 45% !important; + } + + .min-h-sm-up\:45 { + min-height: 45% !important; + } + + .min-w-sm-up\:45 { + min-width: 45% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:45 { + height: 45% !important; + } + + .w-sm-down\:45 { + width: 45% !important; + } + + .max-h-sm-down\:45 { + max-height: 45% !important; + } + + .max-w-sm-down\:45 { + max-width: 45% !important; + } + + .min-h-sm-down\:45 { + min-height: 45% !important; + } + + .min-w-sm-down\:45 { + min-width: 45% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:45 { + height: 45% !important; + } + + .w-md\:45 { + width: 45% !important; + } + + .max-h-md\:45 { + max-height: 45% !important; + } + + .max-w-md\:45 { + max-width: 45% !important; + } + + .min-h-md\:45 { + min-height: 45% !important; + } + + .min-w-md\:45 { + min-width: 45% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:45 { + height: 45% !important; + } + + .w-md-up\:45 { + width: 45% !important; + } + + .max-h-md-up\:45 { + max-height: 45% !important; + } + + .max-w-md-up\:45 { + max-width: 45% !important; + } + + .min-h-md-up\:45 { + min-height: 45% !important; + } + + .min-w-md-up\:45 { + min-width: 45% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:45 { + height: 45% !important; + } + + .w-md-down\:45 { + width: 45% !important; + } + + .max-h-md-down\:45 { + max-height: 45% !important; + } + + .max-w-md-down\:45 { + max-width: 45% !important; + } + + .min-h-md-down\:45 { + min-height: 45% !important; + } + + .min-w-md-down\:45 { + min-width: 45% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:45 { + height: 45% !important; + } + + .w-lg\:45 { + width: 45% !important; + } + + .max-h-lg\:45 { + max-height: 45% !important; + } + + .max-w-lg\:45 { + max-width: 45% !important; + } + + .min-h-lg\:45 { + min-height: 45% !important; + } + + .min-w-lg\:45 { + min-width: 45% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:45 { + height: 45% !important; + } + + .w-lg-up\:45 { + width: 45% !important; + } + + .max-h-lg-up\:45 { + max-height: 45% !important; + } + + .max-w-lg-up\:45 { + max-width: 45% !important; + } + + .min-h-lg-up\:45 { + min-height: 45% !important; + } + + .min-w-lg-up\:45 { + min-width: 45% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:45 { + height: 45% !important; + } + + .w-lg-down\:45 { + width: 45% !important; + } + + .max-h-lg-down\:45 { + max-height: 45% !important; + } + + .max-w-lg-down\:45 { + max-width: 45% !important; + } + + .min-h-lg-down\:45 { + min-height: 45% !important; + } + + .min-w-lg-down\:45 { + min-width: 45% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:45 { + height: 45% !important; + } + + .w-xl\:45 { + width: 45% !important; + } + + .max-h-xl\:45 { + max-height: 45% !important; + } + + .max-w-xl\:45 { + max-width: 45% !important; + } + + .min-h-xl\:45 { + min-height: 45% !important; + } + + .min-w-xl\:45 { + min-width: 45% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:45 { + height: 45% !important; + } + + .w-xl-up\:45 { + width: 45% !important; + } + + .max-h-xl-up\:45 { + max-height: 45% !important; + } + + .max-w-xl-up\:45 { + max-width: 45% !important; + } + + .min-h-xl-up\:45 { + min-height: 45% !important; + } + + .min-w-xl-up\:45 { + min-width: 45% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:45 { + height: 45% !important; + } + + .w-xl-down\:45 { + width: 45% !important; + } + + .max-h-xl-down\:45 { + max-height: 45% !important; + } + + .max-w-xl-down\:45 { + max-width: 45% !important; + } + + .min-h-xl-down\:45 { + min-height: 45% !important; + } + + .min-w-xl-down\:45 { + min-width: 45% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:45 { + height: 45% !important; + } + + .w-xxl\:45 { + width: 45% !important; + } + + .max-h-xxl\:45 { + max-height: 45% !important; + } + + .max-w-xxl\:45 { + max-width: 45% !important; + } + + .min-h-xxl\:45 { + min-height: 45% !important; + } + + .min-w-xxl\:45 { + min-width: 45% !important; + } +} +.h\:50 { + height: 50% !important; +} + +.w\:50 { + width: 50% !important; +} + +.max-h\:50 { + max-height: 50% !important; +} + +.max-w\:50 { + max-width: 50% !important; +} + +.min-h\:50 { + min-height: 50% !important; +} + +.min-w\:50 { + min-width: 50% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:50 { + height: 50% !important; + } + + .w-xs\:50 { + width: 50% !important; + } + + .max-h-xs\:50 { + max-height: 50% !important; + } + + .max-w-xs\:50 { + max-width: 50% !important; + } + + .min-h-xs\:50 { + min-height: 50% !important; + } + + .min-w-xs\:50 { + min-width: 50% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:50 { + height: 50% !important; + } + + .w-sm\:50 { + width: 50% !important; + } + + .max-h-sm\:50 { + max-height: 50% !important; + } + + .max-w-sm\:50 { + max-width: 50% !important; + } + + .min-h-sm\:50 { + min-height: 50% !important; + } + + .min-w-sm\:50 { + min-width: 50% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:50 { + height: 50% !important; + } + + .w-sm-up\:50 { + width: 50% !important; + } + + .max-h-sm-up\:50 { + max-height: 50% !important; + } + + .max-w-sm-up\:50 { + max-width: 50% !important; + } + + .min-h-sm-up\:50 { + min-height: 50% !important; + } + + .min-w-sm-up\:50 { + min-width: 50% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:50 { + height: 50% !important; + } + + .w-sm-down\:50 { + width: 50% !important; + } + + .max-h-sm-down\:50 { + max-height: 50% !important; + } + + .max-w-sm-down\:50 { + max-width: 50% !important; + } + + .min-h-sm-down\:50 { + min-height: 50% !important; + } + + .min-w-sm-down\:50 { + min-width: 50% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:50 { + height: 50% !important; + } + + .w-md\:50 { + width: 50% !important; + } + + .max-h-md\:50 { + max-height: 50% !important; + } + + .max-w-md\:50 { + max-width: 50% !important; + } + + .min-h-md\:50 { + min-height: 50% !important; + } + + .min-w-md\:50 { + min-width: 50% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:50 { + height: 50% !important; + } + + .w-md-up\:50 { + width: 50% !important; + } + + .max-h-md-up\:50 { + max-height: 50% !important; + } + + .max-w-md-up\:50 { + max-width: 50% !important; + } + + .min-h-md-up\:50 { + min-height: 50% !important; + } + + .min-w-md-up\:50 { + min-width: 50% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:50 { + height: 50% !important; + } + + .w-md-down\:50 { + width: 50% !important; + } + + .max-h-md-down\:50 { + max-height: 50% !important; + } + + .max-w-md-down\:50 { + max-width: 50% !important; + } + + .min-h-md-down\:50 { + min-height: 50% !important; + } + + .min-w-md-down\:50 { + min-width: 50% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:50 { + height: 50% !important; + } + + .w-lg\:50 { + width: 50% !important; + } + + .max-h-lg\:50 { + max-height: 50% !important; + } + + .max-w-lg\:50 { + max-width: 50% !important; + } + + .min-h-lg\:50 { + min-height: 50% !important; + } + + .min-w-lg\:50 { + min-width: 50% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:50 { + height: 50% !important; + } + + .w-lg-up\:50 { + width: 50% !important; + } + + .max-h-lg-up\:50 { + max-height: 50% !important; + } + + .max-w-lg-up\:50 { + max-width: 50% !important; + } + + .min-h-lg-up\:50 { + min-height: 50% !important; + } + + .min-w-lg-up\:50 { + min-width: 50% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:50 { + height: 50% !important; + } + + .w-lg-down\:50 { + width: 50% !important; + } + + .max-h-lg-down\:50 { + max-height: 50% !important; + } + + .max-w-lg-down\:50 { + max-width: 50% !important; + } + + .min-h-lg-down\:50 { + min-height: 50% !important; + } + + .min-w-lg-down\:50 { + min-width: 50% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:50 { + height: 50% !important; + } + + .w-xl\:50 { + width: 50% !important; + } + + .max-h-xl\:50 { + max-height: 50% !important; + } + + .max-w-xl\:50 { + max-width: 50% !important; + } + + .min-h-xl\:50 { + min-height: 50% !important; + } + + .min-w-xl\:50 { + min-width: 50% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:50 { + height: 50% !important; + } + + .w-xl-up\:50 { + width: 50% !important; + } + + .max-h-xl-up\:50 { + max-height: 50% !important; + } + + .max-w-xl-up\:50 { + max-width: 50% !important; + } + + .min-h-xl-up\:50 { + min-height: 50% !important; + } + + .min-w-xl-up\:50 { + min-width: 50% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:50 { + height: 50% !important; + } + + .w-xl-down\:50 { + width: 50% !important; + } + + .max-h-xl-down\:50 { + max-height: 50% !important; + } + + .max-w-xl-down\:50 { + max-width: 50% !important; + } + + .min-h-xl-down\:50 { + min-height: 50% !important; + } + + .min-w-xl-down\:50 { + min-width: 50% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:50 { + height: 50% !important; + } + + .w-xxl\:50 { + width: 50% !important; + } + + .max-h-xxl\:50 { + max-height: 50% !important; + } + + .max-w-xxl\:50 { + max-width: 50% !important; + } + + .min-h-xxl\:50 { + min-height: 50% !important; + } + + .min-w-xxl\:50 { + min-width: 50% !important; + } +} +.h\:60 { + height: 60% !important; +} + +.w\:60 { + width: 60% !important; +} + +.max-h\:60 { + max-height: 60% !important; +} + +.max-w\:60 { + max-width: 60% !important; +} + +.min-h\:60 { + min-height: 60% !important; +} + +.min-w\:60 { + min-width: 60% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:60 { + height: 60% !important; + } + + .w-xs\:60 { + width: 60% !important; + } + + .max-h-xs\:60 { + max-height: 60% !important; + } + + .max-w-xs\:60 { + max-width: 60% !important; + } + + .min-h-xs\:60 { + min-height: 60% !important; + } + + .min-w-xs\:60 { + min-width: 60% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:60 { + height: 60% !important; + } + + .w-sm\:60 { + width: 60% !important; + } + + .max-h-sm\:60 { + max-height: 60% !important; + } + + .max-w-sm\:60 { + max-width: 60% !important; + } + + .min-h-sm\:60 { + min-height: 60% !important; + } + + .min-w-sm\:60 { + min-width: 60% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:60 { + height: 60% !important; + } + + .w-sm-up\:60 { + width: 60% !important; + } + + .max-h-sm-up\:60 { + max-height: 60% !important; + } + + .max-w-sm-up\:60 { + max-width: 60% !important; + } + + .min-h-sm-up\:60 { + min-height: 60% !important; + } + + .min-w-sm-up\:60 { + min-width: 60% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:60 { + height: 60% !important; + } + + .w-sm-down\:60 { + width: 60% !important; + } + + .max-h-sm-down\:60 { + max-height: 60% !important; + } + + .max-w-sm-down\:60 { + max-width: 60% !important; + } + + .min-h-sm-down\:60 { + min-height: 60% !important; + } + + .min-w-sm-down\:60 { + min-width: 60% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:60 { + height: 60% !important; + } + + .w-md\:60 { + width: 60% !important; + } + + .max-h-md\:60 { + max-height: 60% !important; + } + + .max-w-md\:60 { + max-width: 60% !important; + } + + .min-h-md\:60 { + min-height: 60% !important; + } + + .min-w-md\:60 { + min-width: 60% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:60 { + height: 60% !important; + } + + .w-md-up\:60 { + width: 60% !important; + } + + .max-h-md-up\:60 { + max-height: 60% !important; + } + + .max-w-md-up\:60 { + max-width: 60% !important; + } + + .min-h-md-up\:60 { + min-height: 60% !important; + } + + .min-w-md-up\:60 { + min-width: 60% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:60 { + height: 60% !important; + } + + .w-md-down\:60 { + width: 60% !important; + } + + .max-h-md-down\:60 { + max-height: 60% !important; + } + + .max-w-md-down\:60 { + max-width: 60% !important; + } + + .min-h-md-down\:60 { + min-height: 60% !important; + } + + .min-w-md-down\:60 { + min-width: 60% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:60 { + height: 60% !important; + } + + .w-lg\:60 { + width: 60% !important; + } + + .max-h-lg\:60 { + max-height: 60% !important; + } + + .max-w-lg\:60 { + max-width: 60% !important; + } + + .min-h-lg\:60 { + min-height: 60% !important; + } + + .min-w-lg\:60 { + min-width: 60% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:60 { + height: 60% !important; + } + + .w-lg-up\:60 { + width: 60% !important; + } + + .max-h-lg-up\:60 { + max-height: 60% !important; + } + + .max-w-lg-up\:60 { + max-width: 60% !important; + } + + .min-h-lg-up\:60 { + min-height: 60% !important; + } + + .min-w-lg-up\:60 { + min-width: 60% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:60 { + height: 60% !important; + } + + .w-lg-down\:60 { + width: 60% !important; + } + + .max-h-lg-down\:60 { + max-height: 60% !important; + } + + .max-w-lg-down\:60 { + max-width: 60% !important; + } + + .min-h-lg-down\:60 { + min-height: 60% !important; + } + + .min-w-lg-down\:60 { + min-width: 60% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:60 { + height: 60% !important; + } + + .w-xl\:60 { + width: 60% !important; + } + + .max-h-xl\:60 { + max-height: 60% !important; + } + + .max-w-xl\:60 { + max-width: 60% !important; + } + + .min-h-xl\:60 { + min-height: 60% !important; + } + + .min-w-xl\:60 { + min-width: 60% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:60 { + height: 60% !important; + } + + .w-xl-up\:60 { + width: 60% !important; + } + + .max-h-xl-up\:60 { + max-height: 60% !important; + } + + .max-w-xl-up\:60 { + max-width: 60% !important; + } + + .min-h-xl-up\:60 { + min-height: 60% !important; + } + + .min-w-xl-up\:60 { + min-width: 60% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:60 { + height: 60% !important; + } + + .w-xl-down\:60 { + width: 60% !important; + } + + .max-h-xl-down\:60 { + max-height: 60% !important; + } + + .max-w-xl-down\:60 { + max-width: 60% !important; + } + + .min-h-xl-down\:60 { + min-height: 60% !important; + } + + .min-w-xl-down\:60 { + min-width: 60% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:60 { + height: 60% !important; + } + + .w-xxl\:60 { + width: 60% !important; + } + + .max-h-xxl\:60 { + max-height: 60% !important; + } + + .max-w-xxl\:60 { + max-width: 60% !important; + } + + .min-h-xxl\:60 { + min-height: 60% !important; + } + + .min-w-xxl\:60 { + min-width: 60% !important; + } +} +.h\:66 { + height: 66.66% !important; +} + +.w\:66 { + width: 66.66% !important; +} + +.max-h\:66 { + max-height: 66.66% !important; +} + +.max-w\:66 { + max-width: 66.66% !important; +} + +.min-h\:66 { + min-height: 66.66% !important; +} + +.min-w\:66 { + min-width: 66.66% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:66 { + height: 66.66% !important; + } + + .w-xs\:66 { + width: 66.66% !important; + } + + .max-h-xs\:66 { + max-height: 66.66% !important; + } + + .max-w-xs\:66 { + max-width: 66.66% !important; + } + + .min-h-xs\:66 { + min-height: 66.66% !important; + } + + .min-w-xs\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:66 { + height: 66.66% !important; + } + + .w-sm\:66 { + width: 66.66% !important; + } + + .max-h-sm\:66 { + max-height: 66.66% !important; + } + + .max-w-sm\:66 { + max-width: 66.66% !important; + } + + .min-h-sm\:66 { + min-height: 66.66% !important; + } + + .min-w-sm\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:66 { + height: 66.66% !important; + } + + .w-sm-up\:66 { + width: 66.66% !important; + } + + .max-h-sm-up\:66 { + max-height: 66.66% !important; + } + + .max-w-sm-up\:66 { + max-width: 66.66% !important; + } + + .min-h-sm-up\:66 { + min-height: 66.66% !important; + } + + .min-w-sm-up\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:66 { + height: 66.66% !important; + } + + .w-sm-down\:66 { + width: 66.66% !important; + } + + .max-h-sm-down\:66 { + max-height: 66.66% !important; + } + + .max-w-sm-down\:66 { + max-width: 66.66% !important; + } + + .min-h-sm-down\:66 { + min-height: 66.66% !important; + } + + .min-w-sm-down\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:66 { + height: 66.66% !important; + } + + .w-md\:66 { + width: 66.66% !important; + } + + .max-h-md\:66 { + max-height: 66.66% !important; + } + + .max-w-md\:66 { + max-width: 66.66% !important; + } + + .min-h-md\:66 { + min-height: 66.66% !important; + } + + .min-w-md\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:66 { + height: 66.66% !important; + } + + .w-md-up\:66 { + width: 66.66% !important; + } + + .max-h-md-up\:66 { + max-height: 66.66% !important; + } + + .max-w-md-up\:66 { + max-width: 66.66% !important; + } + + .min-h-md-up\:66 { + min-height: 66.66% !important; + } + + .min-w-md-up\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:66 { + height: 66.66% !important; + } + + .w-md-down\:66 { + width: 66.66% !important; + } + + .max-h-md-down\:66 { + max-height: 66.66% !important; + } + + .max-w-md-down\:66 { + max-width: 66.66% !important; + } + + .min-h-md-down\:66 { + min-height: 66.66% !important; + } + + .min-w-md-down\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:66 { + height: 66.66% !important; + } + + .w-lg\:66 { + width: 66.66% !important; + } + + .max-h-lg\:66 { + max-height: 66.66% !important; + } + + .max-w-lg\:66 { + max-width: 66.66% !important; + } + + .min-h-lg\:66 { + min-height: 66.66% !important; + } + + .min-w-lg\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:66 { + height: 66.66% !important; + } + + .w-lg-up\:66 { + width: 66.66% !important; + } + + .max-h-lg-up\:66 { + max-height: 66.66% !important; + } + + .max-w-lg-up\:66 { + max-width: 66.66% !important; + } + + .min-h-lg-up\:66 { + min-height: 66.66% !important; + } + + .min-w-lg-up\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:66 { + height: 66.66% !important; + } + + .w-lg-down\:66 { + width: 66.66% !important; + } + + .max-h-lg-down\:66 { + max-height: 66.66% !important; + } + + .max-w-lg-down\:66 { + max-width: 66.66% !important; + } + + .min-h-lg-down\:66 { + min-height: 66.66% !important; + } + + .min-w-lg-down\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:66 { + height: 66.66% !important; + } + + .w-xl\:66 { + width: 66.66% !important; + } + + .max-h-xl\:66 { + max-height: 66.66% !important; + } + + .max-w-xl\:66 { + max-width: 66.66% !important; + } + + .min-h-xl\:66 { + min-height: 66.66% !important; + } + + .min-w-xl\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:66 { + height: 66.66% !important; + } + + .w-xl-up\:66 { + width: 66.66% !important; + } + + .max-h-xl-up\:66 { + max-height: 66.66% !important; + } + + .max-w-xl-up\:66 { + max-width: 66.66% !important; + } + + .min-h-xl-up\:66 { + min-height: 66.66% !important; + } + + .min-w-xl-up\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:66 { + height: 66.66% !important; + } + + .w-xl-down\:66 { + width: 66.66% !important; + } + + .max-h-xl-down\:66 { + max-height: 66.66% !important; + } + + .max-w-xl-down\:66 { + max-width: 66.66% !important; + } + + .min-h-xl-down\:66 { + min-height: 66.66% !important; + } + + .min-w-xl-down\:66 { + min-width: 66.66% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:66 { + height: 66.66% !important; + } + + .w-xxl\:66 { + width: 66.66% !important; + } + + .max-h-xxl\:66 { + max-height: 66.66% !important; + } + + .max-w-xxl\:66 { + max-width: 66.66% !important; + } + + .min-h-xxl\:66 { + min-height: 66.66% !important; + } + + .min-w-xxl\:66 { + min-width: 66.66% !important; + } +} +.h\:70 { + height: 70% !important; +} + +.w\:70 { + width: 70% !important; +} + +.max-h\:70 { + max-height: 70% !important; +} + +.max-w\:70 { + max-width: 70% !important; +} + +.min-h\:70 { + min-height: 70% !important; +} + +.min-w\:70 { + min-width: 70% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:70 { + height: 70% !important; + } + + .w-xs\:70 { + width: 70% !important; + } + + .max-h-xs\:70 { + max-height: 70% !important; + } + + .max-w-xs\:70 { + max-width: 70% !important; + } + + .min-h-xs\:70 { + min-height: 70% !important; + } + + .min-w-xs\:70 { + min-width: 70% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:70 { + height: 70% !important; + } + + .w-sm\:70 { + width: 70% !important; + } + + .max-h-sm\:70 { + max-height: 70% !important; + } + + .max-w-sm\:70 { + max-width: 70% !important; + } + + .min-h-sm\:70 { + min-height: 70% !important; + } + + .min-w-sm\:70 { + min-width: 70% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:70 { + height: 70% !important; + } + + .w-sm-up\:70 { + width: 70% !important; + } + + .max-h-sm-up\:70 { + max-height: 70% !important; + } + + .max-w-sm-up\:70 { + max-width: 70% !important; + } + + .min-h-sm-up\:70 { + min-height: 70% !important; + } + + .min-w-sm-up\:70 { + min-width: 70% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:70 { + height: 70% !important; + } + + .w-sm-down\:70 { + width: 70% !important; + } + + .max-h-sm-down\:70 { + max-height: 70% !important; + } + + .max-w-sm-down\:70 { + max-width: 70% !important; + } + + .min-h-sm-down\:70 { + min-height: 70% !important; + } + + .min-w-sm-down\:70 { + min-width: 70% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:70 { + height: 70% !important; + } + + .w-md\:70 { + width: 70% !important; + } + + .max-h-md\:70 { + max-height: 70% !important; + } + + .max-w-md\:70 { + max-width: 70% !important; + } + + .min-h-md\:70 { + min-height: 70% !important; + } + + .min-w-md\:70 { + min-width: 70% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:70 { + height: 70% !important; + } + + .w-md-up\:70 { + width: 70% !important; + } + + .max-h-md-up\:70 { + max-height: 70% !important; + } + + .max-w-md-up\:70 { + max-width: 70% !important; + } + + .min-h-md-up\:70 { + min-height: 70% !important; + } + + .min-w-md-up\:70 { + min-width: 70% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:70 { + height: 70% !important; + } + + .w-md-down\:70 { + width: 70% !important; + } + + .max-h-md-down\:70 { + max-height: 70% !important; + } + + .max-w-md-down\:70 { + max-width: 70% !important; + } + + .min-h-md-down\:70 { + min-height: 70% !important; + } + + .min-w-md-down\:70 { + min-width: 70% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:70 { + height: 70% !important; + } + + .w-lg\:70 { + width: 70% !important; + } + + .max-h-lg\:70 { + max-height: 70% !important; + } + + .max-w-lg\:70 { + max-width: 70% !important; + } + + .min-h-lg\:70 { + min-height: 70% !important; + } + + .min-w-lg\:70 { + min-width: 70% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:70 { + height: 70% !important; + } + + .w-lg-up\:70 { + width: 70% !important; + } + + .max-h-lg-up\:70 { + max-height: 70% !important; + } + + .max-w-lg-up\:70 { + max-width: 70% !important; + } + + .min-h-lg-up\:70 { + min-height: 70% !important; + } + + .min-w-lg-up\:70 { + min-width: 70% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:70 { + height: 70% !important; + } + + .w-lg-down\:70 { + width: 70% !important; + } + + .max-h-lg-down\:70 { + max-height: 70% !important; + } + + .max-w-lg-down\:70 { + max-width: 70% !important; + } + + .min-h-lg-down\:70 { + min-height: 70% !important; + } + + .min-w-lg-down\:70 { + min-width: 70% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:70 { + height: 70% !important; + } + + .w-xl\:70 { + width: 70% !important; + } + + .max-h-xl\:70 { + max-height: 70% !important; + } + + .max-w-xl\:70 { + max-width: 70% !important; + } + + .min-h-xl\:70 { + min-height: 70% !important; + } + + .min-w-xl\:70 { + min-width: 70% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:70 { + height: 70% !important; + } + + .w-xl-up\:70 { + width: 70% !important; + } + + .max-h-xl-up\:70 { + max-height: 70% !important; + } + + .max-w-xl-up\:70 { + max-width: 70% !important; + } + + .min-h-xl-up\:70 { + min-height: 70% !important; + } + + .min-w-xl-up\:70 { + min-width: 70% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:70 { + height: 70% !important; + } + + .w-xl-down\:70 { + width: 70% !important; + } + + .max-h-xl-down\:70 { + max-height: 70% !important; + } + + .max-w-xl-down\:70 { + max-width: 70% !important; + } + + .min-h-xl-down\:70 { + min-height: 70% !important; + } + + .min-w-xl-down\:70 { + min-width: 70% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:70 { + height: 70% !important; + } + + .w-xxl\:70 { + width: 70% !important; + } + + .max-h-xxl\:70 { + max-height: 70% !important; + } + + .max-w-xxl\:70 { + max-width: 70% !important; + } + + .min-h-xxl\:70 { + min-height: 70% !important; + } + + .min-w-xxl\:70 { + min-width: 70% !important; + } +} +.h\:75 { + height: 75% !important; +} + +.w\:75 { + width: 75% !important; +} + +.max-h\:75 { + max-height: 75% !important; +} + +.max-w\:75 { + max-width: 75% !important; +} + +.min-h\:75 { + min-height: 75% !important; +} + +.min-w\:75 { + min-width: 75% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:75 { + height: 75% !important; + } + + .w-xs\:75 { + width: 75% !important; + } + + .max-h-xs\:75 { + max-height: 75% !important; + } + + .max-w-xs\:75 { + max-width: 75% !important; + } + + .min-h-xs\:75 { + min-height: 75% !important; + } + + .min-w-xs\:75 { + min-width: 75% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:75 { + height: 75% !important; + } + + .w-sm\:75 { + width: 75% !important; + } + + .max-h-sm\:75 { + max-height: 75% !important; + } + + .max-w-sm\:75 { + max-width: 75% !important; + } + + .min-h-sm\:75 { + min-height: 75% !important; + } + + .min-w-sm\:75 { + min-width: 75% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:75 { + height: 75% !important; + } + + .w-sm-up\:75 { + width: 75% !important; + } + + .max-h-sm-up\:75 { + max-height: 75% !important; + } + + .max-w-sm-up\:75 { + max-width: 75% !important; + } + + .min-h-sm-up\:75 { + min-height: 75% !important; + } + + .min-w-sm-up\:75 { + min-width: 75% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:75 { + height: 75% !important; + } + + .w-sm-down\:75 { + width: 75% !important; + } + + .max-h-sm-down\:75 { + max-height: 75% !important; + } + + .max-w-sm-down\:75 { + max-width: 75% !important; + } + + .min-h-sm-down\:75 { + min-height: 75% !important; + } + + .min-w-sm-down\:75 { + min-width: 75% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:75 { + height: 75% !important; + } + + .w-md\:75 { + width: 75% !important; + } + + .max-h-md\:75 { + max-height: 75% !important; + } + + .max-w-md\:75 { + max-width: 75% !important; + } + + .min-h-md\:75 { + min-height: 75% !important; + } + + .min-w-md\:75 { + min-width: 75% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:75 { + height: 75% !important; + } + + .w-md-up\:75 { + width: 75% !important; + } + + .max-h-md-up\:75 { + max-height: 75% !important; + } + + .max-w-md-up\:75 { + max-width: 75% !important; + } + + .min-h-md-up\:75 { + min-height: 75% !important; + } + + .min-w-md-up\:75 { + min-width: 75% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:75 { + height: 75% !important; + } + + .w-md-down\:75 { + width: 75% !important; + } + + .max-h-md-down\:75 { + max-height: 75% !important; + } + + .max-w-md-down\:75 { + max-width: 75% !important; + } + + .min-h-md-down\:75 { + min-height: 75% !important; + } + + .min-w-md-down\:75 { + min-width: 75% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:75 { + height: 75% !important; + } + + .w-lg\:75 { + width: 75% !important; + } + + .max-h-lg\:75 { + max-height: 75% !important; + } + + .max-w-lg\:75 { + max-width: 75% !important; + } + + .min-h-lg\:75 { + min-height: 75% !important; + } + + .min-w-lg\:75 { + min-width: 75% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:75 { + height: 75% !important; + } + + .w-lg-up\:75 { + width: 75% !important; + } + + .max-h-lg-up\:75 { + max-height: 75% !important; + } + + .max-w-lg-up\:75 { + max-width: 75% !important; + } + + .min-h-lg-up\:75 { + min-height: 75% !important; + } + + .min-w-lg-up\:75 { + min-width: 75% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:75 { + height: 75% !important; + } + + .w-lg-down\:75 { + width: 75% !important; + } + + .max-h-lg-down\:75 { + max-height: 75% !important; + } + + .max-w-lg-down\:75 { + max-width: 75% !important; + } + + .min-h-lg-down\:75 { + min-height: 75% !important; + } + + .min-w-lg-down\:75 { + min-width: 75% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:75 { + height: 75% !important; + } + + .w-xl\:75 { + width: 75% !important; + } + + .max-h-xl\:75 { + max-height: 75% !important; + } + + .max-w-xl\:75 { + max-width: 75% !important; + } + + .min-h-xl\:75 { + min-height: 75% !important; + } + + .min-w-xl\:75 { + min-width: 75% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:75 { + height: 75% !important; + } + + .w-xl-up\:75 { + width: 75% !important; + } + + .max-h-xl-up\:75 { + max-height: 75% !important; + } + + .max-w-xl-up\:75 { + max-width: 75% !important; + } + + .min-h-xl-up\:75 { + min-height: 75% !important; + } + + .min-w-xl-up\:75 { + min-width: 75% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:75 { + height: 75% !important; + } + + .w-xl-down\:75 { + width: 75% !important; + } + + .max-h-xl-down\:75 { + max-height: 75% !important; + } + + .max-w-xl-down\:75 { + max-width: 75% !important; + } + + .min-h-xl-down\:75 { + min-height: 75% !important; + } + + .min-w-xl-down\:75 { + min-width: 75% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:75 { + height: 75% !important; + } + + .w-xxl\:75 { + width: 75% !important; + } + + .max-h-xxl\:75 { + max-height: 75% !important; + } + + .max-w-xxl\:75 { + max-width: 75% !important; + } + + .min-h-xxl\:75 { + min-height: 75% !important; + } + + .min-w-xxl\:75 { + min-width: 75% !important; + } +} +.h\:80 { + height: 80% !important; +} + +.w\:80 { + width: 80% !important; +} + +.max-h\:80 { + max-height: 80% !important; +} + +.max-w\:80 { + max-width: 80% !important; +} + +.min-h\:80 { + min-height: 80% !important; +} + +.min-w\:80 { + min-width: 80% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:80 { + height: 80% !important; + } + + .w-xs\:80 { + width: 80% !important; + } + + .max-h-xs\:80 { + max-height: 80% !important; + } + + .max-w-xs\:80 { + max-width: 80% !important; + } + + .min-h-xs\:80 { + min-height: 80% !important; + } + + .min-w-xs\:80 { + min-width: 80% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:80 { + height: 80% !important; + } + + .w-sm\:80 { + width: 80% !important; + } + + .max-h-sm\:80 { + max-height: 80% !important; + } + + .max-w-sm\:80 { + max-width: 80% !important; + } + + .min-h-sm\:80 { + min-height: 80% !important; + } + + .min-w-sm\:80 { + min-width: 80% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:80 { + height: 80% !important; + } + + .w-sm-up\:80 { + width: 80% !important; + } + + .max-h-sm-up\:80 { + max-height: 80% !important; + } + + .max-w-sm-up\:80 { + max-width: 80% !important; + } + + .min-h-sm-up\:80 { + min-height: 80% !important; + } + + .min-w-sm-up\:80 { + min-width: 80% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:80 { + height: 80% !important; + } + + .w-sm-down\:80 { + width: 80% !important; + } + + .max-h-sm-down\:80 { + max-height: 80% !important; + } + + .max-w-sm-down\:80 { + max-width: 80% !important; + } + + .min-h-sm-down\:80 { + min-height: 80% !important; + } + + .min-w-sm-down\:80 { + min-width: 80% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:80 { + height: 80% !important; + } + + .w-md\:80 { + width: 80% !important; + } + + .max-h-md\:80 { + max-height: 80% !important; + } + + .max-w-md\:80 { + max-width: 80% !important; + } + + .min-h-md\:80 { + min-height: 80% !important; + } + + .min-w-md\:80 { + min-width: 80% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:80 { + height: 80% !important; + } + + .w-md-up\:80 { + width: 80% !important; + } + + .max-h-md-up\:80 { + max-height: 80% !important; + } + + .max-w-md-up\:80 { + max-width: 80% !important; + } + + .min-h-md-up\:80 { + min-height: 80% !important; + } + + .min-w-md-up\:80 { + min-width: 80% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:80 { + height: 80% !important; + } + + .w-md-down\:80 { + width: 80% !important; + } + + .max-h-md-down\:80 { + max-height: 80% !important; + } + + .max-w-md-down\:80 { + max-width: 80% !important; + } + + .min-h-md-down\:80 { + min-height: 80% !important; + } + + .min-w-md-down\:80 { + min-width: 80% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:80 { + height: 80% !important; + } + + .w-lg\:80 { + width: 80% !important; + } + + .max-h-lg\:80 { + max-height: 80% !important; + } + + .max-w-lg\:80 { + max-width: 80% !important; + } + + .min-h-lg\:80 { + min-height: 80% !important; + } + + .min-w-lg\:80 { + min-width: 80% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:80 { + height: 80% !important; + } + + .w-lg-up\:80 { + width: 80% !important; + } + + .max-h-lg-up\:80 { + max-height: 80% !important; + } + + .max-w-lg-up\:80 { + max-width: 80% !important; + } + + .min-h-lg-up\:80 { + min-height: 80% !important; + } + + .min-w-lg-up\:80 { + min-width: 80% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:80 { + height: 80% !important; + } + + .w-lg-down\:80 { + width: 80% !important; + } + + .max-h-lg-down\:80 { + max-height: 80% !important; + } + + .max-w-lg-down\:80 { + max-width: 80% !important; + } + + .min-h-lg-down\:80 { + min-height: 80% !important; + } + + .min-w-lg-down\:80 { + min-width: 80% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:80 { + height: 80% !important; + } + + .w-xl\:80 { + width: 80% !important; + } + + .max-h-xl\:80 { + max-height: 80% !important; + } + + .max-w-xl\:80 { + max-width: 80% !important; + } + + .min-h-xl\:80 { + min-height: 80% !important; + } + + .min-w-xl\:80 { + min-width: 80% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:80 { + height: 80% !important; + } + + .w-xl-up\:80 { + width: 80% !important; + } + + .max-h-xl-up\:80 { + max-height: 80% !important; + } + + .max-w-xl-up\:80 { + max-width: 80% !important; + } + + .min-h-xl-up\:80 { + min-height: 80% !important; + } + + .min-w-xl-up\:80 { + min-width: 80% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:80 { + height: 80% !important; + } + + .w-xl-down\:80 { + width: 80% !important; + } + + .max-h-xl-down\:80 { + max-height: 80% !important; + } + + .max-w-xl-down\:80 { + max-width: 80% !important; + } + + .min-h-xl-down\:80 { + min-height: 80% !important; + } + + .min-w-xl-down\:80 { + min-width: 80% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:80 { + height: 80% !important; + } + + .w-xxl\:80 { + width: 80% !important; + } + + .max-h-xxl\:80 { + max-height: 80% !important; + } + + .max-w-xxl\:80 { + max-width: 80% !important; + } + + .min-h-xxl\:80 { + min-height: 80% !important; + } + + .min-w-xxl\:80 { + min-width: 80% !important; + } +} +.h\:90 { + height: 90% !important; +} + +.w\:90 { + width: 90% !important; +} + +.max-h\:90 { + max-height: 90% !important; +} + +.max-w\:90 { + max-width: 90% !important; +} + +.min-h\:90 { + min-height: 90% !important; +} + +.min-w\:90 { + min-width: 90% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:90 { + height: 90% !important; + } + + .w-xs\:90 { + width: 90% !important; + } + + .max-h-xs\:90 { + max-height: 90% !important; + } + + .max-w-xs\:90 { + max-width: 90% !important; + } + + .min-h-xs\:90 { + min-height: 90% !important; + } + + .min-w-xs\:90 { + min-width: 90% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:90 { + height: 90% !important; + } + + .w-sm\:90 { + width: 90% !important; + } + + .max-h-sm\:90 { + max-height: 90% !important; + } + + .max-w-sm\:90 { + max-width: 90% !important; + } + + .min-h-sm\:90 { + min-height: 90% !important; + } + + .min-w-sm\:90 { + min-width: 90% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:90 { + height: 90% !important; + } + + .w-sm-up\:90 { + width: 90% !important; + } + + .max-h-sm-up\:90 { + max-height: 90% !important; + } + + .max-w-sm-up\:90 { + max-width: 90% !important; + } + + .min-h-sm-up\:90 { + min-height: 90% !important; + } + + .min-w-sm-up\:90 { + min-width: 90% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:90 { + height: 90% !important; + } + + .w-sm-down\:90 { + width: 90% !important; + } + + .max-h-sm-down\:90 { + max-height: 90% !important; + } + + .max-w-sm-down\:90 { + max-width: 90% !important; + } + + .min-h-sm-down\:90 { + min-height: 90% !important; + } + + .min-w-sm-down\:90 { + min-width: 90% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:90 { + height: 90% !important; + } + + .w-md\:90 { + width: 90% !important; + } + + .max-h-md\:90 { + max-height: 90% !important; + } + + .max-w-md\:90 { + max-width: 90% !important; + } + + .min-h-md\:90 { + min-height: 90% !important; + } + + .min-w-md\:90 { + min-width: 90% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:90 { + height: 90% !important; + } + + .w-md-up\:90 { + width: 90% !important; + } + + .max-h-md-up\:90 { + max-height: 90% !important; + } + + .max-w-md-up\:90 { + max-width: 90% !important; + } + + .min-h-md-up\:90 { + min-height: 90% !important; + } + + .min-w-md-up\:90 { + min-width: 90% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:90 { + height: 90% !important; + } + + .w-md-down\:90 { + width: 90% !important; + } + + .max-h-md-down\:90 { + max-height: 90% !important; + } + + .max-w-md-down\:90 { + max-width: 90% !important; + } + + .min-h-md-down\:90 { + min-height: 90% !important; + } + + .min-w-md-down\:90 { + min-width: 90% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:90 { + height: 90% !important; + } + + .w-lg\:90 { + width: 90% !important; + } + + .max-h-lg\:90 { + max-height: 90% !important; + } + + .max-w-lg\:90 { + max-width: 90% !important; + } + + .min-h-lg\:90 { + min-height: 90% !important; + } + + .min-w-lg\:90 { + min-width: 90% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:90 { + height: 90% !important; + } + + .w-lg-up\:90 { + width: 90% !important; + } + + .max-h-lg-up\:90 { + max-height: 90% !important; + } + + .max-w-lg-up\:90 { + max-width: 90% !important; + } + + .min-h-lg-up\:90 { + min-height: 90% !important; + } + + .min-w-lg-up\:90 { + min-width: 90% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:90 { + height: 90% !important; + } + + .w-lg-down\:90 { + width: 90% !important; + } + + .max-h-lg-down\:90 { + max-height: 90% !important; + } + + .max-w-lg-down\:90 { + max-width: 90% !important; + } + + .min-h-lg-down\:90 { + min-height: 90% !important; + } + + .min-w-lg-down\:90 { + min-width: 90% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:90 { + height: 90% !important; + } + + .w-xl\:90 { + width: 90% !important; + } + + .max-h-xl\:90 { + max-height: 90% !important; + } + + .max-w-xl\:90 { + max-width: 90% !important; + } + + .min-h-xl\:90 { + min-height: 90% !important; + } + + .min-w-xl\:90 { + min-width: 90% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:90 { + height: 90% !important; + } + + .w-xl-up\:90 { + width: 90% !important; + } + + .max-h-xl-up\:90 { + max-height: 90% !important; + } + + .max-w-xl-up\:90 { + max-width: 90% !important; + } + + .min-h-xl-up\:90 { + min-height: 90% !important; + } + + .min-w-xl-up\:90 { + min-width: 90% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:90 { + height: 90% !important; + } + + .w-xl-down\:90 { + width: 90% !important; + } + + .max-h-xl-down\:90 { + max-height: 90% !important; + } + + .max-w-xl-down\:90 { + max-width: 90% !important; + } + + .min-h-xl-down\:90 { + min-height: 90% !important; + } + + .min-w-xl-down\:90 { + min-width: 90% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:90 { + height: 90% !important; + } + + .w-xxl\:90 { + width: 90% !important; + } + + .max-h-xxl\:90 { + max-height: 90% !important; + } + + .max-w-xxl\:90 { + max-width: 90% !important; + } + + .min-h-xxl\:90 { + min-height: 90% !important; + } + + .min-w-xxl\:90 { + min-width: 90% !important; + } +} +.h\:100 { + height: 100% !important; +} + +.w\:100 { + width: 100% !important; +} + +.max-h\:100 { + max-height: 100% !important; +} + +.max-w\:100 { + max-width: 100% !important; +} + +.min-h\:100 { + min-height: 100% !important; +} + +.min-w\:100 { + min-width: 100% !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:100 { + height: 100% !important; + } + + .w-xs\:100 { + width: 100% !important; + } + + .max-h-xs\:100 { + max-height: 100% !important; + } + + .max-w-xs\:100 { + max-width: 100% !important; + } + + .min-h-xs\:100 { + min-height: 100% !important; + } + + .min-w-xs\:100 { + min-width: 100% !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:100 { + height: 100% !important; + } + + .w-sm\:100 { + width: 100% !important; + } + + .max-h-sm\:100 { + max-height: 100% !important; + } + + .max-w-sm\:100 { + max-width: 100% !important; + } + + .min-h-sm\:100 { + min-height: 100% !important; + } + + .min-w-sm\:100 { + min-width: 100% !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:100 { + height: 100% !important; + } + + .w-sm-up\:100 { + width: 100% !important; + } + + .max-h-sm-up\:100 { + max-height: 100% !important; + } + + .max-w-sm-up\:100 { + max-width: 100% !important; + } + + .min-h-sm-up\:100 { + min-height: 100% !important; + } + + .min-w-sm-up\:100 { + min-width: 100% !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:100 { + height: 100% !important; + } + + .w-sm-down\:100 { + width: 100% !important; + } + + .max-h-sm-down\:100 { + max-height: 100% !important; + } + + .max-w-sm-down\:100 { + max-width: 100% !important; + } + + .min-h-sm-down\:100 { + min-height: 100% !important; + } + + .min-w-sm-down\:100 { + min-width: 100% !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:100 { + height: 100% !important; + } + + .w-md\:100 { + width: 100% !important; + } + + .max-h-md\:100 { + max-height: 100% !important; + } + + .max-w-md\:100 { + max-width: 100% !important; + } + + .min-h-md\:100 { + min-height: 100% !important; + } + + .min-w-md\:100 { + min-width: 100% !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:100 { + height: 100% !important; + } + + .w-md-up\:100 { + width: 100% !important; + } + + .max-h-md-up\:100 { + max-height: 100% !important; + } + + .max-w-md-up\:100 { + max-width: 100% !important; + } + + .min-h-md-up\:100 { + min-height: 100% !important; + } + + .min-w-md-up\:100 { + min-width: 100% !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:100 { + height: 100% !important; + } + + .w-md-down\:100 { + width: 100% !important; + } + + .max-h-md-down\:100 { + max-height: 100% !important; + } + + .max-w-md-down\:100 { + max-width: 100% !important; + } + + .min-h-md-down\:100 { + min-height: 100% !important; + } + + .min-w-md-down\:100 { + min-width: 100% !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:100 { + height: 100% !important; + } + + .w-lg\:100 { + width: 100% !important; + } + + .max-h-lg\:100 { + max-height: 100% !important; + } + + .max-w-lg\:100 { + max-width: 100% !important; + } + + .min-h-lg\:100 { + min-height: 100% !important; + } + + .min-w-lg\:100 { + min-width: 100% !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:100 { + height: 100% !important; + } + + .w-lg-up\:100 { + width: 100% !important; + } + + .max-h-lg-up\:100 { + max-height: 100% !important; + } + + .max-w-lg-up\:100 { + max-width: 100% !important; + } + + .min-h-lg-up\:100 { + min-height: 100% !important; + } + + .min-w-lg-up\:100 { + min-width: 100% !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:100 { + height: 100% !important; + } + + .w-lg-down\:100 { + width: 100% !important; + } + + .max-h-lg-down\:100 { + max-height: 100% !important; + } + + .max-w-lg-down\:100 { + max-width: 100% !important; + } + + .min-h-lg-down\:100 { + min-height: 100% !important; + } + + .min-w-lg-down\:100 { + min-width: 100% !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:100 { + height: 100% !important; + } + + .w-xl\:100 { + width: 100% !important; + } + + .max-h-xl\:100 { + max-height: 100% !important; + } + + .max-w-xl\:100 { + max-width: 100% !important; + } + + .min-h-xl\:100 { + min-height: 100% !important; + } + + .min-w-xl\:100 { + min-width: 100% !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:100 { + height: 100% !important; + } + + .w-xl-up\:100 { + width: 100% !important; + } + + .max-h-xl-up\:100 { + max-height: 100% !important; + } + + .max-w-xl-up\:100 { + max-width: 100% !important; + } + + .min-h-xl-up\:100 { + min-height: 100% !important; + } + + .min-w-xl-up\:100 { + min-width: 100% !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:100 { + height: 100% !important; + } + + .w-xl-down\:100 { + width: 100% !important; + } + + .max-h-xl-down\:100 { + max-height: 100% !important; + } + + .max-w-xl-down\:100 { + max-width: 100% !important; + } + + .min-h-xl-down\:100 { + min-height: 100% !important; + } + + .min-w-xl-down\:100 { + min-width: 100% !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:100 { + height: 100% !important; + } + + .w-xxl\:100 { + width: 100% !important; + } + + .max-h-xxl\:100 { + max-height: 100% !important; + } + + .max-w-xxl\:100 { + max-width: 100% !important; + } + + .min-h-xxl\:100 { + min-height: 100% !important; + } + + .min-w-xxl\:100 { + min-width: 100% !important; + } +} +.h\:10vh { + height: 10vh !important; +} + +.w\:10vh { + width: 10vh !important; +} + +.max-h\:10vh { + max-height: 10vh !important; +} + +.max-w\:10vh { + max-width: 10vh !important; +} + +.min-h\:10vh { + min-height: 10vh !important; +} + +.min-w\:10vh { + min-width: 10vh !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:10vh { + height: 10vh !important; + } + + .w-xs\:10vh { + width: 10vh !important; + } + + .max-h-xs\:10vh { + max-height: 10vh !important; + } + + .max-w-xs\:10vh { + max-width: 10vh !important; + } + + .min-h-xs\:10vh { + min-height: 10vh !important; + } + + .min-w-xs\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:10vh { + height: 10vh !important; + } + + .w-sm\:10vh { + width: 10vh !important; + } + + .max-h-sm\:10vh { + max-height: 10vh !important; + } + + .max-w-sm\:10vh { + max-width: 10vh !important; + } + + .min-h-sm\:10vh { + min-height: 10vh !important; + } + + .min-w-sm\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:10vh { + height: 10vh !important; + } + + .w-sm-up\:10vh { + width: 10vh !important; + } + + .max-h-sm-up\:10vh { + max-height: 10vh !important; + } + + .max-w-sm-up\:10vh { + max-width: 10vh !important; + } + + .min-h-sm-up\:10vh { + min-height: 10vh !important; + } + + .min-w-sm-up\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:10vh { + height: 10vh !important; + } + + .w-sm-down\:10vh { + width: 10vh !important; + } + + .max-h-sm-down\:10vh { + max-height: 10vh !important; + } + + .max-w-sm-down\:10vh { + max-width: 10vh !important; + } + + .min-h-sm-down\:10vh { + min-height: 10vh !important; + } + + .min-w-sm-down\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:10vh { + height: 10vh !important; + } + + .w-md\:10vh { + width: 10vh !important; + } + + .max-h-md\:10vh { + max-height: 10vh !important; + } + + .max-w-md\:10vh { + max-width: 10vh !important; + } + + .min-h-md\:10vh { + min-height: 10vh !important; + } + + .min-w-md\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:10vh { + height: 10vh !important; + } + + .w-md-up\:10vh { + width: 10vh !important; + } + + .max-h-md-up\:10vh { + max-height: 10vh !important; + } + + .max-w-md-up\:10vh { + max-width: 10vh !important; + } + + .min-h-md-up\:10vh { + min-height: 10vh !important; + } + + .min-w-md-up\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:10vh { + height: 10vh !important; + } + + .w-md-down\:10vh { + width: 10vh !important; + } + + .max-h-md-down\:10vh { + max-height: 10vh !important; + } + + .max-w-md-down\:10vh { + max-width: 10vh !important; + } + + .min-h-md-down\:10vh { + min-height: 10vh !important; + } + + .min-w-md-down\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:10vh { + height: 10vh !important; + } + + .w-lg\:10vh { + width: 10vh !important; + } + + .max-h-lg\:10vh { + max-height: 10vh !important; + } + + .max-w-lg\:10vh { + max-width: 10vh !important; + } + + .min-h-lg\:10vh { + min-height: 10vh !important; + } + + .min-w-lg\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:10vh { + height: 10vh !important; + } + + .w-lg-up\:10vh { + width: 10vh !important; + } + + .max-h-lg-up\:10vh { + max-height: 10vh !important; + } + + .max-w-lg-up\:10vh { + max-width: 10vh !important; + } + + .min-h-lg-up\:10vh { + min-height: 10vh !important; + } + + .min-w-lg-up\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:10vh { + height: 10vh !important; + } + + .w-lg-down\:10vh { + width: 10vh !important; + } + + .max-h-lg-down\:10vh { + max-height: 10vh !important; + } + + .max-w-lg-down\:10vh { + max-width: 10vh !important; + } + + .min-h-lg-down\:10vh { + min-height: 10vh !important; + } + + .min-w-lg-down\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:10vh { + height: 10vh !important; + } + + .w-xl\:10vh { + width: 10vh !important; + } + + .max-h-xl\:10vh { + max-height: 10vh !important; + } + + .max-w-xl\:10vh { + max-width: 10vh !important; + } + + .min-h-xl\:10vh { + min-height: 10vh !important; + } + + .min-w-xl\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:10vh { + height: 10vh !important; + } + + .w-xl-up\:10vh { + width: 10vh !important; + } + + .max-h-xl-up\:10vh { + max-height: 10vh !important; + } + + .max-w-xl-up\:10vh { + max-width: 10vh !important; + } + + .min-h-xl-up\:10vh { + min-height: 10vh !important; + } + + .min-w-xl-up\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:10vh { + height: 10vh !important; + } + + .w-xl-down\:10vh { + width: 10vh !important; + } + + .max-h-xl-down\:10vh { + max-height: 10vh !important; + } + + .max-w-xl-down\:10vh { + max-width: 10vh !important; + } + + .min-h-xl-down\:10vh { + min-height: 10vh !important; + } + + .min-w-xl-down\:10vh { + min-width: 10vh !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:10vh { + height: 10vh !important; + } + + .w-xxl\:10vh { + width: 10vh !important; + } + + .max-h-xxl\:10vh { + max-height: 10vh !important; + } + + .max-w-xxl\:10vh { + max-width: 10vh !important; + } + + .min-h-xxl\:10vh { + min-height: 10vh !important; + } + + .min-w-xxl\:10vh { + min-width: 10vh !important; + } +} +.h\:25vh { + height: 25vh !important; +} + +.w\:25vh { + width: 25vh !important; +} + +.max-h\:25vh { + max-height: 25vh !important; +} + +.max-w\:25vh { + max-width: 25vh !important; +} + +.min-h\:25vh { + min-height: 25vh !important; +} + +.min-w\:25vh { + min-width: 25vh !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:25vh { + height: 25vh !important; + } + + .w-xs\:25vh { + width: 25vh !important; + } + + .max-h-xs\:25vh { + max-height: 25vh !important; + } + + .max-w-xs\:25vh { + max-width: 25vh !important; + } + + .min-h-xs\:25vh { + min-height: 25vh !important; + } + + .min-w-xs\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:25vh { + height: 25vh !important; + } + + .w-sm\:25vh { + width: 25vh !important; + } + + .max-h-sm\:25vh { + max-height: 25vh !important; + } + + .max-w-sm\:25vh { + max-width: 25vh !important; + } + + .min-h-sm\:25vh { + min-height: 25vh !important; + } + + .min-w-sm\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:25vh { + height: 25vh !important; + } + + .w-sm-up\:25vh { + width: 25vh !important; + } + + .max-h-sm-up\:25vh { + max-height: 25vh !important; + } + + .max-w-sm-up\:25vh { + max-width: 25vh !important; + } + + .min-h-sm-up\:25vh { + min-height: 25vh !important; + } + + .min-w-sm-up\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:25vh { + height: 25vh !important; + } + + .w-sm-down\:25vh { + width: 25vh !important; + } + + .max-h-sm-down\:25vh { + max-height: 25vh !important; + } + + .max-w-sm-down\:25vh { + max-width: 25vh !important; + } + + .min-h-sm-down\:25vh { + min-height: 25vh !important; + } + + .min-w-sm-down\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:25vh { + height: 25vh !important; + } + + .w-md\:25vh { + width: 25vh !important; + } + + .max-h-md\:25vh { + max-height: 25vh !important; + } + + .max-w-md\:25vh { + max-width: 25vh !important; + } + + .min-h-md\:25vh { + min-height: 25vh !important; + } + + .min-w-md\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:25vh { + height: 25vh !important; + } + + .w-md-up\:25vh { + width: 25vh !important; + } + + .max-h-md-up\:25vh { + max-height: 25vh !important; + } + + .max-w-md-up\:25vh { + max-width: 25vh !important; + } + + .min-h-md-up\:25vh { + min-height: 25vh !important; + } + + .min-w-md-up\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:25vh { + height: 25vh !important; + } + + .w-md-down\:25vh { + width: 25vh !important; + } + + .max-h-md-down\:25vh { + max-height: 25vh !important; + } + + .max-w-md-down\:25vh { + max-width: 25vh !important; + } + + .min-h-md-down\:25vh { + min-height: 25vh !important; + } + + .min-w-md-down\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:25vh { + height: 25vh !important; + } + + .w-lg\:25vh { + width: 25vh !important; + } + + .max-h-lg\:25vh { + max-height: 25vh !important; + } + + .max-w-lg\:25vh { + max-width: 25vh !important; + } + + .min-h-lg\:25vh { + min-height: 25vh !important; + } + + .min-w-lg\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:25vh { + height: 25vh !important; + } + + .w-lg-up\:25vh { + width: 25vh !important; + } + + .max-h-lg-up\:25vh { + max-height: 25vh !important; + } + + .max-w-lg-up\:25vh { + max-width: 25vh !important; + } + + .min-h-lg-up\:25vh { + min-height: 25vh !important; + } + + .min-w-lg-up\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:25vh { + height: 25vh !important; + } + + .w-lg-down\:25vh { + width: 25vh !important; + } + + .max-h-lg-down\:25vh { + max-height: 25vh !important; + } + + .max-w-lg-down\:25vh { + max-width: 25vh !important; + } + + .min-h-lg-down\:25vh { + min-height: 25vh !important; + } + + .min-w-lg-down\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:25vh { + height: 25vh !important; + } + + .w-xl\:25vh { + width: 25vh !important; + } + + .max-h-xl\:25vh { + max-height: 25vh !important; + } + + .max-w-xl\:25vh { + max-width: 25vh !important; + } + + .min-h-xl\:25vh { + min-height: 25vh !important; + } + + .min-w-xl\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:25vh { + height: 25vh !important; + } + + .w-xl-up\:25vh { + width: 25vh !important; + } + + .max-h-xl-up\:25vh { + max-height: 25vh !important; + } + + .max-w-xl-up\:25vh { + max-width: 25vh !important; + } + + .min-h-xl-up\:25vh { + min-height: 25vh !important; + } + + .min-w-xl-up\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:25vh { + height: 25vh !important; + } + + .w-xl-down\:25vh { + width: 25vh !important; + } + + .max-h-xl-down\:25vh { + max-height: 25vh !important; + } + + .max-w-xl-down\:25vh { + max-width: 25vh !important; + } + + .min-h-xl-down\:25vh { + min-height: 25vh !important; + } + + .min-w-xl-down\:25vh { + min-width: 25vh !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:25vh { + height: 25vh !important; + } + + .w-xxl\:25vh { + width: 25vh !important; + } + + .max-h-xxl\:25vh { + max-height: 25vh !important; + } + + .max-w-xxl\:25vh { + max-width: 25vh !important; + } + + .min-h-xxl\:25vh { + min-height: 25vh !important; + } + + .min-w-xxl\:25vh { + min-width: 25vh !important; + } +} +.h\:50vh { + height: 50vh !important; +} + +.w\:50vh { + width: 50vh !important; +} + +.max-h\:50vh { + max-height: 50vh !important; +} + +.max-w\:50vh { + max-width: 50vh !important; +} + +.min-h\:50vh { + min-height: 50vh !important; +} + +.min-w\:50vh { + min-width: 50vh !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:50vh { + height: 50vh !important; + } + + .w-xs\:50vh { + width: 50vh !important; + } + + .max-h-xs\:50vh { + max-height: 50vh !important; + } + + .max-w-xs\:50vh { + max-width: 50vh !important; + } + + .min-h-xs\:50vh { + min-height: 50vh !important; + } + + .min-w-xs\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:50vh { + height: 50vh !important; + } + + .w-sm\:50vh { + width: 50vh !important; + } + + .max-h-sm\:50vh { + max-height: 50vh !important; + } + + .max-w-sm\:50vh { + max-width: 50vh !important; + } + + .min-h-sm\:50vh { + min-height: 50vh !important; + } + + .min-w-sm\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:50vh { + height: 50vh !important; + } + + .w-sm-up\:50vh { + width: 50vh !important; + } + + .max-h-sm-up\:50vh { + max-height: 50vh !important; + } + + .max-w-sm-up\:50vh { + max-width: 50vh !important; + } + + .min-h-sm-up\:50vh { + min-height: 50vh !important; + } + + .min-w-sm-up\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:50vh { + height: 50vh !important; + } + + .w-sm-down\:50vh { + width: 50vh !important; + } + + .max-h-sm-down\:50vh { + max-height: 50vh !important; + } + + .max-w-sm-down\:50vh { + max-width: 50vh !important; + } + + .min-h-sm-down\:50vh { + min-height: 50vh !important; + } + + .min-w-sm-down\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:50vh { + height: 50vh !important; + } + + .w-md\:50vh { + width: 50vh !important; + } + + .max-h-md\:50vh { + max-height: 50vh !important; + } + + .max-w-md\:50vh { + max-width: 50vh !important; + } + + .min-h-md\:50vh { + min-height: 50vh !important; + } + + .min-w-md\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:50vh { + height: 50vh !important; + } + + .w-md-up\:50vh { + width: 50vh !important; + } + + .max-h-md-up\:50vh { + max-height: 50vh !important; + } + + .max-w-md-up\:50vh { + max-width: 50vh !important; + } + + .min-h-md-up\:50vh { + min-height: 50vh !important; + } + + .min-w-md-up\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:50vh { + height: 50vh !important; + } + + .w-md-down\:50vh { + width: 50vh !important; + } + + .max-h-md-down\:50vh { + max-height: 50vh !important; + } + + .max-w-md-down\:50vh { + max-width: 50vh !important; + } + + .min-h-md-down\:50vh { + min-height: 50vh !important; + } + + .min-w-md-down\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:50vh { + height: 50vh !important; + } + + .w-lg\:50vh { + width: 50vh !important; + } + + .max-h-lg\:50vh { + max-height: 50vh !important; + } + + .max-w-lg\:50vh { + max-width: 50vh !important; + } + + .min-h-lg\:50vh { + min-height: 50vh !important; + } + + .min-w-lg\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:50vh { + height: 50vh !important; + } + + .w-lg-up\:50vh { + width: 50vh !important; + } + + .max-h-lg-up\:50vh { + max-height: 50vh !important; + } + + .max-w-lg-up\:50vh { + max-width: 50vh !important; + } + + .min-h-lg-up\:50vh { + min-height: 50vh !important; + } + + .min-w-lg-up\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:50vh { + height: 50vh !important; + } + + .w-lg-down\:50vh { + width: 50vh !important; + } + + .max-h-lg-down\:50vh { + max-height: 50vh !important; + } + + .max-w-lg-down\:50vh { + max-width: 50vh !important; + } + + .min-h-lg-down\:50vh { + min-height: 50vh !important; + } + + .min-w-lg-down\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:50vh { + height: 50vh !important; + } + + .w-xl\:50vh { + width: 50vh !important; + } + + .max-h-xl\:50vh { + max-height: 50vh !important; + } + + .max-w-xl\:50vh { + max-width: 50vh !important; + } + + .min-h-xl\:50vh { + min-height: 50vh !important; + } + + .min-w-xl\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:50vh { + height: 50vh !important; + } + + .w-xl-up\:50vh { + width: 50vh !important; + } + + .max-h-xl-up\:50vh { + max-height: 50vh !important; + } + + .max-w-xl-up\:50vh { + max-width: 50vh !important; + } + + .min-h-xl-up\:50vh { + min-height: 50vh !important; + } + + .min-w-xl-up\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:50vh { + height: 50vh !important; + } + + .w-xl-down\:50vh { + width: 50vh !important; + } + + .max-h-xl-down\:50vh { + max-height: 50vh !important; + } + + .max-w-xl-down\:50vh { + max-width: 50vh !important; + } + + .min-h-xl-down\:50vh { + min-height: 50vh !important; + } + + .min-w-xl-down\:50vh { + min-width: 50vh !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:50vh { + height: 50vh !important; + } + + .w-xxl\:50vh { + width: 50vh !important; + } + + .max-h-xxl\:50vh { + max-height: 50vh !important; + } + + .max-w-xxl\:50vh { + max-width: 50vh !important; + } + + .min-h-xxl\:50vh { + min-height: 50vh !important; + } + + .min-w-xxl\:50vh { + min-width: 50vh !important; + } +} +.h\:75vh { + height: 75vh !important; +} + +.w\:75vh { + width: 75vh !important; +} + +.max-h\:75vh { + max-height: 75vh !important; +} + +.max-w\:75vh { + max-width: 75vh !important; +} + +.min-h\:75vh { + min-height: 75vh !important; +} + +.min-w\:75vh { + min-width: 75vh !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:75vh { + height: 75vh !important; + } + + .w-xs\:75vh { + width: 75vh !important; + } + + .max-h-xs\:75vh { + max-height: 75vh !important; + } + + .max-w-xs\:75vh { + max-width: 75vh !important; + } + + .min-h-xs\:75vh { + min-height: 75vh !important; + } + + .min-w-xs\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:75vh { + height: 75vh !important; + } + + .w-sm\:75vh { + width: 75vh !important; + } + + .max-h-sm\:75vh { + max-height: 75vh !important; + } + + .max-w-sm\:75vh { + max-width: 75vh !important; + } + + .min-h-sm\:75vh { + min-height: 75vh !important; + } + + .min-w-sm\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:75vh { + height: 75vh !important; + } + + .w-sm-up\:75vh { + width: 75vh !important; + } + + .max-h-sm-up\:75vh { + max-height: 75vh !important; + } + + .max-w-sm-up\:75vh { + max-width: 75vh !important; + } + + .min-h-sm-up\:75vh { + min-height: 75vh !important; + } + + .min-w-sm-up\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:75vh { + height: 75vh !important; + } + + .w-sm-down\:75vh { + width: 75vh !important; + } + + .max-h-sm-down\:75vh { + max-height: 75vh !important; + } + + .max-w-sm-down\:75vh { + max-width: 75vh !important; + } + + .min-h-sm-down\:75vh { + min-height: 75vh !important; + } + + .min-w-sm-down\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:75vh { + height: 75vh !important; + } + + .w-md\:75vh { + width: 75vh !important; + } + + .max-h-md\:75vh { + max-height: 75vh !important; + } + + .max-w-md\:75vh { + max-width: 75vh !important; + } + + .min-h-md\:75vh { + min-height: 75vh !important; + } + + .min-w-md\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:75vh { + height: 75vh !important; + } + + .w-md-up\:75vh { + width: 75vh !important; + } + + .max-h-md-up\:75vh { + max-height: 75vh !important; + } + + .max-w-md-up\:75vh { + max-width: 75vh !important; + } + + .min-h-md-up\:75vh { + min-height: 75vh !important; + } + + .min-w-md-up\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:75vh { + height: 75vh !important; + } + + .w-md-down\:75vh { + width: 75vh !important; + } + + .max-h-md-down\:75vh { + max-height: 75vh !important; + } + + .max-w-md-down\:75vh { + max-width: 75vh !important; + } + + .min-h-md-down\:75vh { + min-height: 75vh !important; + } + + .min-w-md-down\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:75vh { + height: 75vh !important; + } + + .w-lg\:75vh { + width: 75vh !important; + } + + .max-h-lg\:75vh { + max-height: 75vh !important; + } + + .max-w-lg\:75vh { + max-width: 75vh !important; + } + + .min-h-lg\:75vh { + min-height: 75vh !important; + } + + .min-w-lg\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:75vh { + height: 75vh !important; + } + + .w-lg-up\:75vh { + width: 75vh !important; + } + + .max-h-lg-up\:75vh { + max-height: 75vh !important; + } + + .max-w-lg-up\:75vh { + max-width: 75vh !important; + } + + .min-h-lg-up\:75vh { + min-height: 75vh !important; + } + + .min-w-lg-up\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:75vh { + height: 75vh !important; + } + + .w-lg-down\:75vh { + width: 75vh !important; + } + + .max-h-lg-down\:75vh { + max-height: 75vh !important; + } + + .max-w-lg-down\:75vh { + max-width: 75vh !important; + } + + .min-h-lg-down\:75vh { + min-height: 75vh !important; + } + + .min-w-lg-down\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:75vh { + height: 75vh !important; + } + + .w-xl\:75vh { + width: 75vh !important; + } + + .max-h-xl\:75vh { + max-height: 75vh !important; + } + + .max-w-xl\:75vh { + max-width: 75vh !important; + } + + .min-h-xl\:75vh { + min-height: 75vh !important; + } + + .min-w-xl\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:75vh { + height: 75vh !important; + } + + .w-xl-up\:75vh { + width: 75vh !important; + } + + .max-h-xl-up\:75vh { + max-height: 75vh !important; + } + + .max-w-xl-up\:75vh { + max-width: 75vh !important; + } + + .min-h-xl-up\:75vh { + min-height: 75vh !important; + } + + .min-w-xl-up\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:75vh { + height: 75vh !important; + } + + .w-xl-down\:75vh { + width: 75vh !important; + } + + .max-h-xl-down\:75vh { + max-height: 75vh !important; + } + + .max-w-xl-down\:75vh { + max-width: 75vh !important; + } + + .min-h-xl-down\:75vh { + min-height: 75vh !important; + } + + .min-w-xl-down\:75vh { + min-width: 75vh !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:75vh { + height: 75vh !important; + } + + .w-xxl\:75vh { + width: 75vh !important; + } + + .max-h-xxl\:75vh { + max-height: 75vh !important; + } + + .max-w-xxl\:75vh { + max-width: 75vh !important; + } + + .min-h-xxl\:75vh { + min-height: 75vh !important; + } + + .min-w-xxl\:75vh { + min-width: 75vh !important; + } +} +.h\:100vh { + height: 100vh !important; +} + +.w\:100vh { + width: 100vh !important; +} + +.max-h\:100vh { + max-height: 100vh !important; +} + +.max-w\:100vh { + max-width: 100vh !important; +} + +.min-h\:100vh { + min-height: 100vh !important; +} + +.min-w\:100vh { + min-width: 100vh !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:100vh { + height: 100vh !important; + } + + .w-xs\:100vh { + width: 100vh !important; + } + + .max-h-xs\:100vh { + max-height: 100vh !important; + } + + .max-w-xs\:100vh { + max-width: 100vh !important; + } + + .min-h-xs\:100vh { + min-height: 100vh !important; + } + + .min-w-xs\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:100vh { + height: 100vh !important; + } + + .w-sm\:100vh { + width: 100vh !important; + } + + .max-h-sm\:100vh { + max-height: 100vh !important; + } + + .max-w-sm\:100vh { + max-width: 100vh !important; + } + + .min-h-sm\:100vh { + min-height: 100vh !important; + } + + .min-w-sm\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:100vh { + height: 100vh !important; + } + + .w-sm-up\:100vh { + width: 100vh !important; + } + + .max-h-sm-up\:100vh { + max-height: 100vh !important; + } + + .max-w-sm-up\:100vh { + max-width: 100vh !important; + } + + .min-h-sm-up\:100vh { + min-height: 100vh !important; + } + + .min-w-sm-up\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:100vh { + height: 100vh !important; + } + + .w-sm-down\:100vh { + width: 100vh !important; + } + + .max-h-sm-down\:100vh { + max-height: 100vh !important; + } + + .max-w-sm-down\:100vh { + max-width: 100vh !important; + } + + .min-h-sm-down\:100vh { + min-height: 100vh !important; + } + + .min-w-sm-down\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:100vh { + height: 100vh !important; + } + + .w-md\:100vh { + width: 100vh !important; + } + + .max-h-md\:100vh { + max-height: 100vh !important; + } + + .max-w-md\:100vh { + max-width: 100vh !important; + } + + .min-h-md\:100vh { + min-height: 100vh !important; + } + + .min-w-md\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:100vh { + height: 100vh !important; + } + + .w-md-up\:100vh { + width: 100vh !important; + } + + .max-h-md-up\:100vh { + max-height: 100vh !important; + } + + .max-w-md-up\:100vh { + max-width: 100vh !important; + } + + .min-h-md-up\:100vh { + min-height: 100vh !important; + } + + .min-w-md-up\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:100vh { + height: 100vh !important; + } + + .w-md-down\:100vh { + width: 100vh !important; + } + + .max-h-md-down\:100vh { + max-height: 100vh !important; + } + + .max-w-md-down\:100vh { + max-width: 100vh !important; + } + + .min-h-md-down\:100vh { + min-height: 100vh !important; + } + + .min-w-md-down\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:100vh { + height: 100vh !important; + } + + .w-lg\:100vh { + width: 100vh !important; + } + + .max-h-lg\:100vh { + max-height: 100vh !important; + } + + .max-w-lg\:100vh { + max-width: 100vh !important; + } + + .min-h-lg\:100vh { + min-height: 100vh !important; + } + + .min-w-lg\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:100vh { + height: 100vh !important; + } + + .w-lg-up\:100vh { + width: 100vh !important; + } + + .max-h-lg-up\:100vh { + max-height: 100vh !important; + } + + .max-w-lg-up\:100vh { + max-width: 100vh !important; + } + + .min-h-lg-up\:100vh { + min-height: 100vh !important; + } + + .min-w-lg-up\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:100vh { + height: 100vh !important; + } + + .w-lg-down\:100vh { + width: 100vh !important; + } + + .max-h-lg-down\:100vh { + max-height: 100vh !important; + } + + .max-w-lg-down\:100vh { + max-width: 100vh !important; + } + + .min-h-lg-down\:100vh { + min-height: 100vh !important; + } + + .min-w-lg-down\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:100vh { + height: 100vh !important; + } + + .w-xl\:100vh { + width: 100vh !important; + } + + .max-h-xl\:100vh { + max-height: 100vh !important; + } + + .max-w-xl\:100vh { + max-width: 100vh !important; + } + + .min-h-xl\:100vh { + min-height: 100vh !important; + } + + .min-w-xl\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:100vh { + height: 100vh !important; + } + + .w-xl-up\:100vh { + width: 100vh !important; + } + + .max-h-xl-up\:100vh { + max-height: 100vh !important; + } + + .max-w-xl-up\:100vh { + max-width: 100vh !important; + } + + .min-h-xl-up\:100vh { + min-height: 100vh !important; + } + + .min-w-xl-up\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:100vh { + height: 100vh !important; + } + + .w-xl-down\:100vh { + width: 100vh !important; + } + + .max-h-xl-down\:100vh { + max-height: 100vh !important; + } + + .max-w-xl-down\:100vh { + max-width: 100vh !important; + } + + .min-h-xl-down\:100vh { + min-height: 100vh !important; + } + + .min-w-xl-down\:100vh { + min-width: 100vh !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:100vh { + height: 100vh !important; + } + + .w-xxl\:100vh { + width: 100vh !important; + } + + .max-h-xxl\:100vh { + max-height: 100vh !important; + } + + .max-w-xxl\:100vh { + max-width: 100vh !important; + } + + .min-h-xxl\:100vh { + min-height: 100vh !important; + } + + .min-w-xxl\:100vh { + min-width: 100vh !important; + } +} +.h\:10vw { + height: 10vw !important; +} + +.w\:10vw { + width: 10vw !important; +} + +.max-h\:10vw { + max-height: 10vw !important; +} + +.max-w\:10vw { + max-width: 10vw !important; +} + +.min-h\:10vw { + min-height: 10vw !important; +} + +.min-w\:10vw { + min-width: 10vw !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:10vw { + height: 10vw !important; + } + + .w-xs\:10vw { + width: 10vw !important; + } + + .max-h-xs\:10vw { + max-height: 10vw !important; + } + + .max-w-xs\:10vw { + max-width: 10vw !important; + } + + .min-h-xs\:10vw { + min-height: 10vw !important; + } + + .min-w-xs\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:10vw { + height: 10vw !important; + } + + .w-sm\:10vw { + width: 10vw !important; + } + + .max-h-sm\:10vw { + max-height: 10vw !important; + } + + .max-w-sm\:10vw { + max-width: 10vw !important; + } + + .min-h-sm\:10vw { + min-height: 10vw !important; + } + + .min-w-sm\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:10vw { + height: 10vw !important; + } + + .w-sm-up\:10vw { + width: 10vw !important; + } + + .max-h-sm-up\:10vw { + max-height: 10vw !important; + } + + .max-w-sm-up\:10vw { + max-width: 10vw !important; + } + + .min-h-sm-up\:10vw { + min-height: 10vw !important; + } + + .min-w-sm-up\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:10vw { + height: 10vw !important; + } + + .w-sm-down\:10vw { + width: 10vw !important; + } + + .max-h-sm-down\:10vw { + max-height: 10vw !important; + } + + .max-w-sm-down\:10vw { + max-width: 10vw !important; + } + + .min-h-sm-down\:10vw { + min-height: 10vw !important; + } + + .min-w-sm-down\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:10vw { + height: 10vw !important; + } + + .w-md\:10vw { + width: 10vw !important; + } + + .max-h-md\:10vw { + max-height: 10vw !important; + } + + .max-w-md\:10vw { + max-width: 10vw !important; + } + + .min-h-md\:10vw { + min-height: 10vw !important; + } + + .min-w-md\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:10vw { + height: 10vw !important; + } + + .w-md-up\:10vw { + width: 10vw !important; + } + + .max-h-md-up\:10vw { + max-height: 10vw !important; + } + + .max-w-md-up\:10vw { + max-width: 10vw !important; + } + + .min-h-md-up\:10vw { + min-height: 10vw !important; + } + + .min-w-md-up\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:10vw { + height: 10vw !important; + } + + .w-md-down\:10vw { + width: 10vw !important; + } + + .max-h-md-down\:10vw { + max-height: 10vw !important; + } + + .max-w-md-down\:10vw { + max-width: 10vw !important; + } + + .min-h-md-down\:10vw { + min-height: 10vw !important; + } + + .min-w-md-down\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:10vw { + height: 10vw !important; + } + + .w-lg\:10vw { + width: 10vw !important; + } + + .max-h-lg\:10vw { + max-height: 10vw !important; + } + + .max-w-lg\:10vw { + max-width: 10vw !important; + } + + .min-h-lg\:10vw { + min-height: 10vw !important; + } + + .min-w-lg\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:10vw { + height: 10vw !important; + } + + .w-lg-up\:10vw { + width: 10vw !important; + } + + .max-h-lg-up\:10vw { + max-height: 10vw !important; + } + + .max-w-lg-up\:10vw { + max-width: 10vw !important; + } + + .min-h-lg-up\:10vw { + min-height: 10vw !important; + } + + .min-w-lg-up\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:10vw { + height: 10vw !important; + } + + .w-lg-down\:10vw { + width: 10vw !important; + } + + .max-h-lg-down\:10vw { + max-height: 10vw !important; + } + + .max-w-lg-down\:10vw { + max-width: 10vw !important; + } + + .min-h-lg-down\:10vw { + min-height: 10vw !important; + } + + .min-w-lg-down\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:10vw { + height: 10vw !important; + } + + .w-xl\:10vw { + width: 10vw !important; + } + + .max-h-xl\:10vw { + max-height: 10vw !important; + } + + .max-w-xl\:10vw { + max-width: 10vw !important; + } + + .min-h-xl\:10vw { + min-height: 10vw !important; + } + + .min-w-xl\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:10vw { + height: 10vw !important; + } + + .w-xl-up\:10vw { + width: 10vw !important; + } + + .max-h-xl-up\:10vw { + max-height: 10vw !important; + } + + .max-w-xl-up\:10vw { + max-width: 10vw !important; + } + + .min-h-xl-up\:10vw { + min-height: 10vw !important; + } + + .min-w-xl-up\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:10vw { + height: 10vw !important; + } + + .w-xl-down\:10vw { + width: 10vw !important; + } + + .max-h-xl-down\:10vw { + max-height: 10vw !important; + } + + .max-w-xl-down\:10vw { + max-width: 10vw !important; + } + + .min-h-xl-down\:10vw { + min-height: 10vw !important; + } + + .min-w-xl-down\:10vw { + min-width: 10vw !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:10vw { + height: 10vw !important; + } + + .w-xxl\:10vw { + width: 10vw !important; + } + + .max-h-xxl\:10vw { + max-height: 10vw !important; + } + + .max-w-xxl\:10vw { + max-width: 10vw !important; + } + + .min-h-xxl\:10vw { + min-height: 10vw !important; + } + + .min-w-xxl\:10vw { + min-width: 10vw !important; + } +} +.h\:25vw { + height: 25vw !important; +} + +.w\:25vw { + width: 25vw !important; +} + +.max-h\:25vw { + max-height: 25vw !important; +} + +.max-w\:25vw { + max-width: 25vw !important; +} + +.min-h\:25vw { + min-height: 25vw !important; +} + +.min-w\:25vw { + min-width: 25vw !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:25vw { + height: 25vw !important; + } + + .w-xs\:25vw { + width: 25vw !important; + } + + .max-h-xs\:25vw { + max-height: 25vw !important; + } + + .max-w-xs\:25vw { + max-width: 25vw !important; + } + + .min-h-xs\:25vw { + min-height: 25vw !important; + } + + .min-w-xs\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:25vw { + height: 25vw !important; + } + + .w-sm\:25vw { + width: 25vw !important; + } + + .max-h-sm\:25vw { + max-height: 25vw !important; + } + + .max-w-sm\:25vw { + max-width: 25vw !important; + } + + .min-h-sm\:25vw { + min-height: 25vw !important; + } + + .min-w-sm\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:25vw { + height: 25vw !important; + } + + .w-sm-up\:25vw { + width: 25vw !important; + } + + .max-h-sm-up\:25vw { + max-height: 25vw !important; + } + + .max-w-sm-up\:25vw { + max-width: 25vw !important; + } + + .min-h-sm-up\:25vw { + min-height: 25vw !important; + } + + .min-w-sm-up\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:25vw { + height: 25vw !important; + } + + .w-sm-down\:25vw { + width: 25vw !important; + } + + .max-h-sm-down\:25vw { + max-height: 25vw !important; + } + + .max-w-sm-down\:25vw { + max-width: 25vw !important; + } + + .min-h-sm-down\:25vw { + min-height: 25vw !important; + } + + .min-w-sm-down\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:25vw { + height: 25vw !important; + } + + .w-md\:25vw { + width: 25vw !important; + } + + .max-h-md\:25vw { + max-height: 25vw !important; + } + + .max-w-md\:25vw { + max-width: 25vw !important; + } + + .min-h-md\:25vw { + min-height: 25vw !important; + } + + .min-w-md\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:25vw { + height: 25vw !important; + } + + .w-md-up\:25vw { + width: 25vw !important; + } + + .max-h-md-up\:25vw { + max-height: 25vw !important; + } + + .max-w-md-up\:25vw { + max-width: 25vw !important; + } + + .min-h-md-up\:25vw { + min-height: 25vw !important; + } + + .min-w-md-up\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:25vw { + height: 25vw !important; + } + + .w-md-down\:25vw { + width: 25vw !important; + } + + .max-h-md-down\:25vw { + max-height: 25vw !important; + } + + .max-w-md-down\:25vw { + max-width: 25vw !important; + } + + .min-h-md-down\:25vw { + min-height: 25vw !important; + } + + .min-w-md-down\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:25vw { + height: 25vw !important; + } + + .w-lg\:25vw { + width: 25vw !important; + } + + .max-h-lg\:25vw { + max-height: 25vw !important; + } + + .max-w-lg\:25vw { + max-width: 25vw !important; + } + + .min-h-lg\:25vw { + min-height: 25vw !important; + } + + .min-w-lg\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:25vw { + height: 25vw !important; + } + + .w-lg-up\:25vw { + width: 25vw !important; + } + + .max-h-lg-up\:25vw { + max-height: 25vw !important; + } + + .max-w-lg-up\:25vw { + max-width: 25vw !important; + } + + .min-h-lg-up\:25vw { + min-height: 25vw !important; + } + + .min-w-lg-up\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:25vw { + height: 25vw !important; + } + + .w-lg-down\:25vw { + width: 25vw !important; + } + + .max-h-lg-down\:25vw { + max-height: 25vw !important; + } + + .max-w-lg-down\:25vw { + max-width: 25vw !important; + } + + .min-h-lg-down\:25vw { + min-height: 25vw !important; + } + + .min-w-lg-down\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:25vw { + height: 25vw !important; + } + + .w-xl\:25vw { + width: 25vw !important; + } + + .max-h-xl\:25vw { + max-height: 25vw !important; + } + + .max-w-xl\:25vw { + max-width: 25vw !important; + } + + .min-h-xl\:25vw { + min-height: 25vw !important; + } + + .min-w-xl\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:25vw { + height: 25vw !important; + } + + .w-xl-up\:25vw { + width: 25vw !important; + } + + .max-h-xl-up\:25vw { + max-height: 25vw !important; + } + + .max-w-xl-up\:25vw { + max-width: 25vw !important; + } + + .min-h-xl-up\:25vw { + min-height: 25vw !important; + } + + .min-w-xl-up\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:25vw { + height: 25vw !important; + } + + .w-xl-down\:25vw { + width: 25vw !important; + } + + .max-h-xl-down\:25vw { + max-height: 25vw !important; + } + + .max-w-xl-down\:25vw { + max-width: 25vw !important; + } + + .min-h-xl-down\:25vw { + min-height: 25vw !important; + } + + .min-w-xl-down\:25vw { + min-width: 25vw !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:25vw { + height: 25vw !important; + } + + .w-xxl\:25vw { + width: 25vw !important; + } + + .max-h-xxl\:25vw { + max-height: 25vw !important; + } + + .max-w-xxl\:25vw { + max-width: 25vw !important; + } + + .min-h-xxl\:25vw { + min-height: 25vw !important; + } + + .min-w-xxl\:25vw { + min-width: 25vw !important; + } +} +.h\:50vw { + height: 50vw !important; +} + +.w\:50vw { + width: 50vw !important; +} + +.max-h\:50vw { + max-height: 50vw !important; +} + +.max-w\:50vw { + max-width: 50vw !important; +} + +.min-h\:50vw { + min-height: 50vw !important; +} + +.min-w\:50vw { + min-width: 50vw !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:50vw { + height: 50vw !important; + } + + .w-xs\:50vw { + width: 50vw !important; + } + + .max-h-xs\:50vw { + max-height: 50vw !important; + } + + .max-w-xs\:50vw { + max-width: 50vw !important; + } + + .min-h-xs\:50vw { + min-height: 50vw !important; + } + + .min-w-xs\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:50vw { + height: 50vw !important; + } + + .w-sm\:50vw { + width: 50vw !important; + } + + .max-h-sm\:50vw { + max-height: 50vw !important; + } + + .max-w-sm\:50vw { + max-width: 50vw !important; + } + + .min-h-sm\:50vw { + min-height: 50vw !important; + } + + .min-w-sm\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:50vw { + height: 50vw !important; + } + + .w-sm-up\:50vw { + width: 50vw !important; + } + + .max-h-sm-up\:50vw { + max-height: 50vw !important; + } + + .max-w-sm-up\:50vw { + max-width: 50vw !important; + } + + .min-h-sm-up\:50vw { + min-height: 50vw !important; + } + + .min-w-sm-up\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:50vw { + height: 50vw !important; + } + + .w-sm-down\:50vw { + width: 50vw !important; + } + + .max-h-sm-down\:50vw { + max-height: 50vw !important; + } + + .max-w-sm-down\:50vw { + max-width: 50vw !important; + } + + .min-h-sm-down\:50vw { + min-height: 50vw !important; + } + + .min-w-sm-down\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:50vw { + height: 50vw !important; + } + + .w-md\:50vw { + width: 50vw !important; + } + + .max-h-md\:50vw { + max-height: 50vw !important; + } + + .max-w-md\:50vw { + max-width: 50vw !important; + } + + .min-h-md\:50vw { + min-height: 50vw !important; + } + + .min-w-md\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:50vw { + height: 50vw !important; + } + + .w-md-up\:50vw { + width: 50vw !important; + } + + .max-h-md-up\:50vw { + max-height: 50vw !important; + } + + .max-w-md-up\:50vw { + max-width: 50vw !important; + } + + .min-h-md-up\:50vw { + min-height: 50vw !important; + } + + .min-w-md-up\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:50vw { + height: 50vw !important; + } + + .w-md-down\:50vw { + width: 50vw !important; + } + + .max-h-md-down\:50vw { + max-height: 50vw !important; + } + + .max-w-md-down\:50vw { + max-width: 50vw !important; + } + + .min-h-md-down\:50vw { + min-height: 50vw !important; + } + + .min-w-md-down\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:50vw { + height: 50vw !important; + } + + .w-lg\:50vw { + width: 50vw !important; + } + + .max-h-lg\:50vw { + max-height: 50vw !important; + } + + .max-w-lg\:50vw { + max-width: 50vw !important; + } + + .min-h-lg\:50vw { + min-height: 50vw !important; + } + + .min-w-lg\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:50vw { + height: 50vw !important; + } + + .w-lg-up\:50vw { + width: 50vw !important; + } + + .max-h-lg-up\:50vw { + max-height: 50vw !important; + } + + .max-w-lg-up\:50vw { + max-width: 50vw !important; + } + + .min-h-lg-up\:50vw { + min-height: 50vw !important; + } + + .min-w-lg-up\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:50vw { + height: 50vw !important; + } + + .w-lg-down\:50vw { + width: 50vw !important; + } + + .max-h-lg-down\:50vw { + max-height: 50vw !important; + } + + .max-w-lg-down\:50vw { + max-width: 50vw !important; + } + + .min-h-lg-down\:50vw { + min-height: 50vw !important; + } + + .min-w-lg-down\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:50vw { + height: 50vw !important; + } + + .w-xl\:50vw { + width: 50vw !important; + } + + .max-h-xl\:50vw { + max-height: 50vw !important; + } + + .max-w-xl\:50vw { + max-width: 50vw !important; + } + + .min-h-xl\:50vw { + min-height: 50vw !important; + } + + .min-w-xl\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:50vw { + height: 50vw !important; + } + + .w-xl-up\:50vw { + width: 50vw !important; + } + + .max-h-xl-up\:50vw { + max-height: 50vw !important; + } + + .max-w-xl-up\:50vw { + max-width: 50vw !important; + } + + .min-h-xl-up\:50vw { + min-height: 50vw !important; + } + + .min-w-xl-up\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:50vw { + height: 50vw !important; + } + + .w-xl-down\:50vw { + width: 50vw !important; + } + + .max-h-xl-down\:50vw { + max-height: 50vw !important; + } + + .max-w-xl-down\:50vw { + max-width: 50vw !important; + } + + .min-h-xl-down\:50vw { + min-height: 50vw !important; + } + + .min-w-xl-down\:50vw { + min-width: 50vw !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:50vw { + height: 50vw !important; + } + + .w-xxl\:50vw { + width: 50vw !important; + } + + .max-h-xxl\:50vw { + max-height: 50vw !important; + } + + .max-w-xxl\:50vw { + max-width: 50vw !important; + } + + .min-h-xxl\:50vw { + min-height: 50vw !important; + } + + .min-w-xxl\:50vw { + min-width: 50vw !important; + } +} +.h\:75vw { + height: 75vw !important; +} + +.w\:75vw { + width: 75vw !important; +} + +.max-h\:75vw { + max-height: 75vw !important; +} + +.max-w\:75vw { + max-width: 75vw !important; +} + +.min-h\:75vw { + min-height: 75vw !important; +} + +.min-w\:75vw { + min-width: 75vw !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:75vw { + height: 75vw !important; + } + + .w-xs\:75vw { + width: 75vw !important; + } + + .max-h-xs\:75vw { + max-height: 75vw !important; + } + + .max-w-xs\:75vw { + max-width: 75vw !important; + } + + .min-h-xs\:75vw { + min-height: 75vw !important; + } + + .min-w-xs\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:75vw { + height: 75vw !important; + } + + .w-sm\:75vw { + width: 75vw !important; + } + + .max-h-sm\:75vw { + max-height: 75vw !important; + } + + .max-w-sm\:75vw { + max-width: 75vw !important; + } + + .min-h-sm\:75vw { + min-height: 75vw !important; + } + + .min-w-sm\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:75vw { + height: 75vw !important; + } + + .w-sm-up\:75vw { + width: 75vw !important; + } + + .max-h-sm-up\:75vw { + max-height: 75vw !important; + } + + .max-w-sm-up\:75vw { + max-width: 75vw !important; + } + + .min-h-sm-up\:75vw { + min-height: 75vw !important; + } + + .min-w-sm-up\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:75vw { + height: 75vw !important; + } + + .w-sm-down\:75vw { + width: 75vw !important; + } + + .max-h-sm-down\:75vw { + max-height: 75vw !important; + } + + .max-w-sm-down\:75vw { + max-width: 75vw !important; + } + + .min-h-sm-down\:75vw { + min-height: 75vw !important; + } + + .min-w-sm-down\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:75vw { + height: 75vw !important; + } + + .w-md\:75vw { + width: 75vw !important; + } + + .max-h-md\:75vw { + max-height: 75vw !important; + } + + .max-w-md\:75vw { + max-width: 75vw !important; + } + + .min-h-md\:75vw { + min-height: 75vw !important; + } + + .min-w-md\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:75vw { + height: 75vw !important; + } + + .w-md-up\:75vw { + width: 75vw !important; + } + + .max-h-md-up\:75vw { + max-height: 75vw !important; + } + + .max-w-md-up\:75vw { + max-width: 75vw !important; + } + + .min-h-md-up\:75vw { + min-height: 75vw !important; + } + + .min-w-md-up\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:75vw { + height: 75vw !important; + } + + .w-md-down\:75vw { + width: 75vw !important; + } + + .max-h-md-down\:75vw { + max-height: 75vw !important; + } + + .max-w-md-down\:75vw { + max-width: 75vw !important; + } + + .min-h-md-down\:75vw { + min-height: 75vw !important; + } + + .min-w-md-down\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:75vw { + height: 75vw !important; + } + + .w-lg\:75vw { + width: 75vw !important; + } + + .max-h-lg\:75vw { + max-height: 75vw !important; + } + + .max-w-lg\:75vw { + max-width: 75vw !important; + } + + .min-h-lg\:75vw { + min-height: 75vw !important; + } + + .min-w-lg\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:75vw { + height: 75vw !important; + } + + .w-lg-up\:75vw { + width: 75vw !important; + } + + .max-h-lg-up\:75vw { + max-height: 75vw !important; + } + + .max-w-lg-up\:75vw { + max-width: 75vw !important; + } + + .min-h-lg-up\:75vw { + min-height: 75vw !important; + } + + .min-w-lg-up\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:75vw { + height: 75vw !important; + } + + .w-lg-down\:75vw { + width: 75vw !important; + } + + .max-h-lg-down\:75vw { + max-height: 75vw !important; + } + + .max-w-lg-down\:75vw { + max-width: 75vw !important; + } + + .min-h-lg-down\:75vw { + min-height: 75vw !important; + } + + .min-w-lg-down\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:75vw { + height: 75vw !important; + } + + .w-xl\:75vw { + width: 75vw !important; + } + + .max-h-xl\:75vw { + max-height: 75vw !important; + } + + .max-w-xl\:75vw { + max-width: 75vw !important; + } + + .min-h-xl\:75vw { + min-height: 75vw !important; + } + + .min-w-xl\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:75vw { + height: 75vw !important; + } + + .w-xl-up\:75vw { + width: 75vw !important; + } + + .max-h-xl-up\:75vw { + max-height: 75vw !important; + } + + .max-w-xl-up\:75vw { + max-width: 75vw !important; + } + + .min-h-xl-up\:75vw { + min-height: 75vw !important; + } + + .min-w-xl-up\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:75vw { + height: 75vw !important; + } + + .w-xl-down\:75vw { + width: 75vw !important; + } + + .max-h-xl-down\:75vw { + max-height: 75vw !important; + } + + .max-w-xl-down\:75vw { + max-width: 75vw !important; + } + + .min-h-xl-down\:75vw { + min-height: 75vw !important; + } + + .min-w-xl-down\:75vw { + min-width: 75vw !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:75vw { + height: 75vw !important; + } + + .w-xxl\:75vw { + width: 75vw !important; + } + + .max-h-xxl\:75vw { + max-height: 75vw !important; + } + + .max-w-xxl\:75vw { + max-width: 75vw !important; + } + + .min-h-xxl\:75vw { + min-height: 75vw !important; + } + + .min-w-xxl\:75vw { + min-width: 75vw !important; + } +} +.h\:100vw { + height: 100vw !important; +} + +.w\:100vw { + width: 100vw !important; +} + +.max-h\:100vw { + max-height: 100vw !important; +} + +.max-w\:100vw { + max-width: 100vw !important; +} + +.min-h\:100vw { + min-height: 100vw !important; +} + +.min-w\:100vw { + min-width: 100vw !important; +} + +@media only screen and (max-width: 576px) { + .h-xs\:100vw { + height: 100vw !important; + } + + .w-xs\:100vw { + width: 100vw !important; + } + + .max-h-xs\:100vw { + max-height: 100vw !important; + } + + .max-w-xs\:100vw { + max-width: 100vw !important; + } + + .min-h-xs\:100vw { + min-height: 100vw !important; + } + + .min-w-xs\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (min-width: 577px) and (max-width: 768px) { + .h-sm\:100vw { + height: 100vw !important; + } + + .w-sm\:100vw { + width: 100vw !important; + } + + .max-h-sm\:100vw { + max-height: 100vw !important; + } + + .max-w-sm\:100vw { + max-width: 100vw !important; + } + + .min-h-sm\:100vw { + min-height: 100vw !important; + } + + .min-w-sm\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (min-width: 577px) { + .h-sm-up\:100vw { + height: 100vw !important; + } + + .w-sm-up\:100vw { + width: 100vw !important; + } + + .max-h-sm-up\:100vw { + max-height: 100vw !important; + } + + .max-w-sm-up\:100vw { + max-width: 100vw !important; + } + + .min-h-sm-up\:100vw { + min-height: 100vw !important; + } + + .min-w-sm-up\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (max-width: 768px) { + .h-sm-down\:100vw { + height: 100vw !important; + } + + .w-sm-down\:100vw { + width: 100vw !important; + } + + .max-h-sm-down\:100vw { + max-height: 100vw !important; + } + + .max-w-sm-down\:100vw { + max-width: 100vw !important; + } + + .min-h-sm-down\:100vw { + min-height: 100vw !important; + } + + .min-w-sm-down\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (min-width: 769px) and (max-width: 992px) { + .h-md\:100vw { + height: 100vw !important; + } + + .w-md\:100vw { + width: 100vw !important; + } + + .max-h-md\:100vw { + max-height: 100vw !important; + } + + .max-w-md\:100vw { + max-width: 100vw !important; + } + + .min-h-md\:100vw { + min-height: 100vw !important; + } + + .min-w-md\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (min-width: 769px) { + .h-md-up\:100vw { + height: 100vw !important; + } + + .w-md-up\:100vw { + width: 100vw !important; + } + + .max-h-md-up\:100vw { + max-height: 100vw !important; + } + + .max-w-md-up\:100vw { + max-width: 100vw !important; + } + + .min-h-md-up\:100vw { + min-height: 100vw !important; + } + + .min-w-md-up\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (max-width: 992px) { + .h-md-down\:100vw { + height: 100vw !important; + } + + .w-md-down\:100vw { + width: 100vw !important; + } + + .max-h-md-down\:100vw { + max-height: 100vw !important; + } + + .max-w-md-down\:100vw { + max-width: 100vw !important; + } + + .min-h-md-down\:100vw { + min-height: 100vw !important; + } + + .min-w-md-down\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (min-width: 993px) and (max-width: 1200px) { + .h-lg\:100vw { + height: 100vw !important; + } + + .w-lg\:100vw { + width: 100vw !important; + } + + .max-h-lg\:100vw { + max-height: 100vw !important; + } + + .max-w-lg\:100vw { + max-width: 100vw !important; + } + + .min-h-lg\:100vw { + min-height: 100vw !important; + } + + .min-w-lg\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (min-width: 993px) { + .h-lg-up\:100vw { + height: 100vw !important; + } + + .w-lg-up\:100vw { + width: 100vw !important; + } + + .max-h-lg-up\:100vw { + max-height: 100vw !important; + } + + .max-w-lg-up\:100vw { + max-width: 100vw !important; + } + + .min-h-lg-up\:100vw { + min-height: 100vw !important; + } + + .min-w-lg-up\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (max-width: 1200px) { + .h-lg-down\:100vw { + height: 100vw !important; + } + + .w-lg-down\:100vw { + width: 100vw !important; + } + + .max-h-lg-down\:100vw { + max-height: 100vw !important; + } + + .max-w-lg-down\:100vw { + max-width: 100vw !important; + } + + .min-h-lg-down\:100vw { + min-height: 100vw !important; + } + + .min-w-lg-down\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (min-width: 1201px) and (max-width: 1400px) { + .h-xl\:100vw { + height: 100vw !important; + } + + .w-xl\:100vw { + width: 100vw !important; + } + + .max-h-xl\:100vw { + max-height: 100vw !important; + } + + .max-w-xl\:100vw { + max-width: 100vw !important; + } + + .min-h-xl\:100vw { + min-height: 100vw !important; + } + + .min-w-xl\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (min-width: 1201px) { + .h-xl-up\:100vw { + height: 100vw !important; + } + + .w-xl-up\:100vw { + width: 100vw !important; + } + + .max-h-xl-up\:100vw { + max-height: 100vw !important; + } + + .max-w-xl-up\:100vw { + max-width: 100vw !important; + } + + .min-h-xl-up\:100vw { + min-height: 100vw !important; + } + + .min-w-xl-up\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (max-width: 1400px) { + .h-xl-down\:100vw { + height: 100vw !important; + } + + .w-xl-down\:100vw { + width: 100vw !important; + } + + .max-h-xl-down\:100vw { + max-height: 100vw !important; + } + + .max-w-xl-down\:100vw { + max-width: 100vw !important; + } + + .min-h-xl-down\:100vw { + min-height: 100vw !important; + } + + .min-w-xl-down\:100vw { + min-width: 100vw !important; + } +} +@media only screen and (min-width: 1401px) { + .h-xxl\:100vw { + height: 100vw !important; + } + + .w-xxl\:100vw { + width: 100vw !important; + } + + .max-h-xxl\:100vw { + max-height: 100vw !important; + } + + .max-w-xxl\:100vw { + max-width: 100vw !important; + } + + .min-h-xxl\:100vw { + min-height: 100vw !important; + } + + .min-w-xxl\:100vw { + min-width: 100vw !important; + } +} +.shadow-sm\:100 { + box-shadow: 0px 0px 1px #f8f9fa !important; +} + +.shadow\:100 { + box-shadow: 0px 0px 4px #f8f9fa !important; +} + +.shadow-lg\:100 { + box-shadow: 0px 0px 8px #f8f9fa !important; +} + +.shadow-top-sm\:100 { + box-shadow: 0px -1px 1px #f8f9fa !important; +} + +.shadow-top\:100 { + box-shadow: 0px -1px 4px #f8f9fa !important; +} + +.shadow-top-lg\:100 { + box-shadow: 0px -1px 8px #f8f9fa !important; +} + +.shadow-bottom-sm\:100 { + box-shadow: 0px 1px 1px #f8f9fa !important; +} + +.shadow-bottom\:100 { + box-shadow: 0px 1px 4px #f8f9fa !important; +} + +.shadow-bottom-lg\:100 { + box-shadow: 0px 1px 8px #f8f9fa !important; +} + +.shadow-left-sm\:100 { + box-shadow: -1px 0px 1px #f8f9fa !important; +} + +.shadow-left\:100 { + box-shadow: -1px 0px 4px #f8f9fa !important; +} + +.shadow-left-lg\:100 { + box-shadow: -1px 0px 8px #f8f9fa !important; +} + +.shadow-right-sm\:100 { + box-shadow: 1px 0px 1px #f8f9fa !important; +} + +.shadow-right\:100 { + box-shadow: 1px 0px 4px #f8f9fa !important; +} + +.shadow-right-lg\:100 { + box-shadow: 1px 0px 8px #f8f9fa !important; +} + +.shadow-sm\:200 { + box-shadow: 0px 0px 1px #e9ecef !important; +} + +.shadow\:200 { + box-shadow: 0px 0px 4px #e9ecef !important; +} + +.shadow-lg\:200 { + box-shadow: 0px 0px 8px #e9ecef !important; +} + +.shadow-top-sm\:200 { + box-shadow: 0px -1px 1px #e9ecef !important; +} + +.shadow-top\:200 { + box-shadow: 0px -1px 4px #e9ecef !important; +} + +.shadow-top-lg\:200 { + box-shadow: 0px -1px 8px #e9ecef !important; +} + +.shadow-bottom-sm\:200 { + box-shadow: 0px 1px 1px #e9ecef !important; +} + +.shadow-bottom\:200 { + box-shadow: 0px 1px 4px #e9ecef !important; +} + +.shadow-bottom-lg\:200 { + box-shadow: 0px 1px 8px #e9ecef !important; +} + +.shadow-left-sm\:200 { + box-shadow: -1px 0px 1px #e9ecef !important; +} + +.shadow-left\:200 { + box-shadow: -1px 0px 4px #e9ecef !important; +} + +.shadow-left-lg\:200 { + box-shadow: -1px 0px 8px #e9ecef !important; +} + +.shadow-right-sm\:200 { + box-shadow: 1px 0px 1px #e9ecef !important; +} + +.shadow-right\:200 { + box-shadow: 1px 0px 4px #e9ecef !important; +} + +.shadow-right-lg\:200 { + box-shadow: 1px 0px 8px #e9ecef !important; +} + +.shadow-sm\:300 { + box-shadow: 0px 0px 1px #dee2e6 !important; +} + +.shadow\:300 { + box-shadow: 0px 0px 4px #dee2e6 !important; +} + +.shadow-lg\:300 { + box-shadow: 0px 0px 8px #dee2e6 !important; +} + +.shadow-top-sm\:300 { + box-shadow: 0px -1px 1px #dee2e6 !important; +} + +.shadow-top\:300 { + box-shadow: 0px -1px 4px #dee2e6 !important; +} + +.shadow-top-lg\:300 { + box-shadow: 0px -1px 8px #dee2e6 !important; +} + +.shadow-bottom-sm\:300 { + box-shadow: 0px 1px 1px #dee2e6 !important; +} + +.shadow-bottom\:300 { + box-shadow: 0px 1px 4px #dee2e6 !important; +} + +.shadow-bottom-lg\:300 { + box-shadow: 0px 1px 8px #dee2e6 !important; +} + +.shadow-left-sm\:300 { + box-shadow: -1px 0px 1px #dee2e6 !important; +} + +.shadow-left\:300 { + box-shadow: -1px 0px 4px #dee2e6 !important; +} + +.shadow-left-lg\:300 { + box-shadow: -1px 0px 8px #dee2e6 !important; +} + +.shadow-right-sm\:300 { + box-shadow: 1px 0px 1px #dee2e6 !important; +} + +.shadow-right\:300 { + box-shadow: 1px 0px 4px #dee2e6 !important; +} + +.shadow-right-lg\:300 { + box-shadow: 1px 0px 8px #dee2e6 !important; +} + +.shadow-sm\:400 { + box-shadow: 0px 0px 1px #ced4da !important; +} + +.shadow\:400 { + box-shadow: 0px 0px 4px #ced4da !important; +} + +.shadow-lg\:400 { + box-shadow: 0px 0px 8px #ced4da !important; +} + +.shadow-top-sm\:400 { + box-shadow: 0px -1px 1px #ced4da !important; +} + +.shadow-top\:400 { + box-shadow: 0px -1px 4px #ced4da !important; +} + +.shadow-top-lg\:400 { + box-shadow: 0px -1px 8px #ced4da !important; +} + +.shadow-bottom-sm\:400 { + box-shadow: 0px 1px 1px #ced4da !important; +} + +.shadow-bottom\:400 { + box-shadow: 0px 1px 4px #ced4da !important; +} + +.shadow-bottom-lg\:400 { + box-shadow: 0px 1px 8px #ced4da !important; +} + +.shadow-left-sm\:400 { + box-shadow: -1px 0px 1px #ced4da !important; +} + +.shadow-left\:400 { + box-shadow: -1px 0px 4px #ced4da !important; +} + +.shadow-left-lg\:400 { + box-shadow: -1px 0px 8px #ced4da !important; +} + +.shadow-right-sm\:400 { + box-shadow: 1px 0px 1px #ced4da !important; +} + +.shadow-right\:400 { + box-shadow: 1px 0px 4px #ced4da !important; +} + +.shadow-right-lg\:400 { + box-shadow: 1px 0px 8px #ced4da !important; +} + +.shadow-sm\:500 { + box-shadow: 0px 0px 1px #adb5bd !important; +} + +.shadow\:500 { + box-shadow: 0px 0px 4px #adb5bd !important; +} + +.shadow-lg\:500 { + box-shadow: 0px 0px 8px #adb5bd !important; +} + +.shadow-top-sm\:500 { + box-shadow: 0px -1px 1px #adb5bd !important; +} + +.shadow-top\:500 { + box-shadow: 0px -1px 4px #adb5bd !important; +} + +.shadow-top-lg\:500 { + box-shadow: 0px -1px 8px #adb5bd !important; +} + +.shadow-bottom-sm\:500 { + box-shadow: 0px 1px 1px #adb5bd !important; +} + +.shadow-bottom\:500 { + box-shadow: 0px 1px 4px #adb5bd !important; +} + +.shadow-bottom-lg\:500 { + box-shadow: 0px 1px 8px #adb5bd !important; +} + +.shadow-left-sm\:500 { + box-shadow: -1px 0px 1px #adb5bd !important; +} + +.shadow-left\:500 { + box-shadow: -1px 0px 4px #adb5bd !important; +} + +.shadow-left-lg\:500 { + box-shadow: -1px 0px 8px #adb5bd !important; +} + +.shadow-right-sm\:500 { + box-shadow: 1px 0px 1px #adb5bd !important; +} + +.shadow-right\:500 { + box-shadow: 1px 0px 4px #adb5bd !important; +} + +.shadow-right-lg\:500 { + box-shadow: 1px 0px 8px #adb5bd !important; +} + +.shadow-sm\:600 { + box-shadow: 0px 0px 1px #6c757d !important; +} + +.shadow\:600 { + box-shadow: 0px 0px 4px #6c757d !important; +} + +.shadow-lg\:600 { + box-shadow: 0px 0px 8px #6c757d !important; +} + +.shadow-top-sm\:600 { + box-shadow: 0px -1px 1px #6c757d !important; +} + +.shadow-top\:600 { + box-shadow: 0px -1px 4px #6c757d !important; +} + +.shadow-top-lg\:600 { + box-shadow: 0px -1px 8px #6c757d !important; +} + +.shadow-bottom-sm\:600 { + box-shadow: 0px 1px 1px #6c757d !important; +} + +.shadow-bottom\:600 { + box-shadow: 0px 1px 4px #6c757d !important; +} + +.shadow-bottom-lg\:600 { + box-shadow: 0px 1px 8px #6c757d !important; +} + +.shadow-left-sm\:600 { + box-shadow: -1px 0px 1px #6c757d !important; +} + +.shadow-left\:600 { + box-shadow: -1px 0px 4px #6c757d !important; +} + +.shadow-left-lg\:600 { + box-shadow: -1px 0px 8px #6c757d !important; +} + +.shadow-right-sm\:600 { + box-shadow: 1px 0px 1px #6c757d !important; +} + +.shadow-right\:600 { + box-shadow: 1px 0px 4px #6c757d !important; +} + +.shadow-right-lg\:600 { + box-shadow: 1px 0px 8px #6c757d !important; +} + +.shadow-sm\:700 { + box-shadow: 0px 0px 1px #495057 !important; +} + +.shadow\:700 { + box-shadow: 0px 0px 4px #495057 !important; +} + +.shadow-lg\:700 { + box-shadow: 0px 0px 8px #495057 !important; +} + +.shadow-top-sm\:700 { + box-shadow: 0px -1px 1px #495057 !important; +} + +.shadow-top\:700 { + box-shadow: 0px -1px 4px #495057 !important; +} + +.shadow-top-lg\:700 { + box-shadow: 0px -1px 8px #495057 !important; +} + +.shadow-bottom-sm\:700 { + box-shadow: 0px 1px 1px #495057 !important; +} + +.shadow-bottom\:700 { + box-shadow: 0px 1px 4px #495057 !important; +} + +.shadow-bottom-lg\:700 { + box-shadow: 0px 1px 8px #495057 !important; +} + +.shadow-left-sm\:700 { + box-shadow: -1px 0px 1px #495057 !important; +} + +.shadow-left\:700 { + box-shadow: -1px 0px 4px #495057 !important; +} + +.shadow-left-lg\:700 { + box-shadow: -1px 0px 8px #495057 !important; +} + +.shadow-right-sm\:700 { + box-shadow: 1px 0px 1px #495057 !important; +} + +.shadow-right\:700 { + box-shadow: 1px 0px 4px #495057 !important; +} + +.shadow-right-lg\:700 { + box-shadow: 1px 0px 8px #495057 !important; +} + +.shadow-sm\:800 { + box-shadow: 0px 0px 1px #343a40 !important; +} + +.shadow\:800 { + box-shadow: 0px 0px 4px #343a40 !important; +} + +.shadow-lg\:800 { + box-shadow: 0px 0px 8px #343a40 !important; +} + +.shadow-top-sm\:800 { + box-shadow: 0px -1px 1px #343a40 !important; +} + +.shadow-top\:800 { + box-shadow: 0px -1px 4px #343a40 !important; +} + +.shadow-top-lg\:800 { + box-shadow: 0px -1px 8px #343a40 !important; +} + +.shadow-bottom-sm\:800 { + box-shadow: 0px 1px 1px #343a40 !important; +} + +.shadow-bottom\:800 { + box-shadow: 0px 1px 4px #343a40 !important; +} + +.shadow-bottom-lg\:800 { + box-shadow: 0px 1px 8px #343a40 !important; +} + +.shadow-left-sm\:800 { + box-shadow: -1px 0px 1px #343a40 !important; +} + +.shadow-left\:800 { + box-shadow: -1px 0px 4px #343a40 !important; +} + +.shadow-left-lg\:800 { + box-shadow: -1px 0px 8px #343a40 !important; +} + +.shadow-right-sm\:800 { + box-shadow: 1px 0px 1px #343a40 !important; +} + +.shadow-right\:800 { + box-shadow: 1px 0px 4px #343a40 !important; +} + +.shadow-right-lg\:800 { + box-shadow: 1px 0px 8px #343a40 !important; +} + +.shadow-sm\:900 { + box-shadow: 0px 0px 1px #212529 !important; +} + +.shadow\:900 { + box-shadow: 0px 0px 4px #212529 !important; +} + +.shadow-lg\:900 { + box-shadow: 0px 0px 8px #212529 !important; +} + +.shadow-top-sm\:900 { + box-shadow: 0px -1px 1px #212529 !important; +} + +.shadow-top\:900 { + box-shadow: 0px -1px 4px #212529 !important; +} + +.shadow-top-lg\:900 { + box-shadow: 0px -1px 8px #212529 !important; +} + +.shadow-bottom-sm\:900 { + box-shadow: 0px 1px 1px #212529 !important; +} + +.shadow-bottom\:900 { + box-shadow: 0px 1px 4px #212529 !important; +} + +.shadow-bottom-lg\:900 { + box-shadow: 0px 1px 8px #212529 !important; +} + +.shadow-left-sm\:900 { + box-shadow: -1px 0px 1px #212529 !important; +} + +.shadow-left\:900 { + box-shadow: -1px 0px 4px #212529 !important; +} + +.shadow-left-lg\:900 { + box-shadow: -1px 0px 8px #212529 !important; +} + +.shadow-right-sm\:900 { + box-shadow: 1px 0px 1px #212529 !important; +} + +.shadow-right\:900 { + box-shadow: 1px 0px 4px #212529 !important; +} + +.shadow-right-lg\:900 { + box-shadow: 1px 0px 8px #212529 !important; +} + +/*# sourceMappingURL=449.css.map */ diff --git a/apps/docs/src/public/_headers b/apps/docs/src/public/_headers new file mode 100644 index 0000000..d56075a --- /dev/null +++ b/apps/docs/src/public/_headers @@ -0,0 +1,6 @@ +/* + X-Frame-Options: DENY + +/assets/* + cache-control: max-age=31536000 + cache-control: immutable diff --git a/apps/docs/src/public/_redirects b/apps/docs/src/public/_redirects new file mode 100644 index 0000000..85a4d4f --- /dev/null +++ b/apps/docs/src/public/_redirects @@ -0,0 +1,8 @@ +/docs/ /docs/introduction.html +/docs/contributing/doc-style-guide.html /community/contributing/doc-style-guide.html +/guide/doc-style-guide.html /community/contributing/doc-style-guide.html +/docs/contributing/writing-guide.html /community/contributing/writing-guide.html +/docs/writing-guide.html /community/contributing/writing-guide.html +/resources/* /ecosystem/:splat + +/blog/ https://blog.leafphp.dev diff --git a/apps/docs/src/public/global.css b/apps/docs/src/public/global.css new file mode 100644 index 0000000..3512518 --- /dev/null +++ b/apps/docs/src/public/global.css @@ -0,0 +1,109 @@ +.dark .vue-repl[data-v-760f3496] { + --bg: #001318 !important; + --bg-soft: #002028 !important; + --border: #383838; + --text-light: #aaa; + --color-branding: #42d392; + --color-branding-dark: #89ddff; +} + +.dark .CodeMirror { + color: var(--symbols); + --symbols: #89ddff; + --base: #a6accd; + --comment: #6d6d6d; + --keyword: #e879f9 !important; + --string: #bef264 !important; + --variable: #22d3ee !important; + --number: #f78c6c; + --tags: #f07178; + --brackets: #9299a6 !important; + --property: #f07178; + --attribute: #c792ea; + --cursor: #fff; + --selected-bg: rgba(255, 255, 255, 0.1); + --selected-bg-non-focus: rgba(255, 255, 255, 0.15); +} + +.-is-tutorial .VPNavBar { + border-bottom: 1px solid var(--vt-c-divider-light) !important; +} + +.video-docs { + color: var(--vt-c-text-1) !important; +} + +.video-docs .video-docs-title { + font-weight: 600 !important; +} + +.video-docs:not(.tip):not(.info):not(.warning):not(.danger)::before { + content: '' !important; +} + +.dark .video-docs div[class*='language-'] { + background-color: var(--vt-c-bg) !important; +} + +.CodeMirror pre { + font-size: 16px !important; +} + +.vt-doc [class*='language-'] pre, .vt-doc [class*='language-'] code span, .editor-container * { + font-family: DM Mono !important; +} + +.dark .cm-variable-2, .dark .cm-atom { + color: #fff !important; +} + +.dark .cm-meta { + color: #e879f9 !important; +} + +.dark .cm-operator { + color: #9299a6 !important; +} + +.CodeMirror-line { + padding-left: 20px !important; +} + +.CodeMirror-cursors { + margin-top: 14px; +} + +.CodeMirror-gutters { + /* padding-top: 10px !important; */ + border: none !important; +} + +.vue-repl .tab-buttons, .vue-repl .file-selector, .vue-repl .left, .vue-repl { + border: none !important; +} + +.vue-repl .output-container { + padding: 15px; + font-size: 16px; +} + +.next-steps-link { + margin: 0px !important; +} + +.vt-box-container .vt-box { + padding: 46px 36px !important; +} + +.VPFooter { + border-top: none !important; +} + +.join-button { + text-decoration: none; + background: white; + padding: 10px 20px; + color: black; + font-weight: 700; + border-radius: 4px; +} diff --git a/apps/docs/src/public/icons/flash.svg b/apps/docs/src/public/icons/flash.svg new file mode 100644 index 0000000..9d4d973 --- /dev/null +++ b/apps/docs/src/public/icons/flash.svg @@ -0,0 +1 @@ +Flash \ No newline at end of file diff --git a/apps/docs/src/public/icons/logo-github.svg b/apps/docs/src/public/icons/logo-github.svg new file mode 100644 index 0000000..6676102 --- /dev/null +++ b/apps/docs/src/public/icons/logo-github.svg @@ -0,0 +1 @@ +Logo Github \ No newline at end of file diff --git a/apps/docs/src/public/icons/logo-twitter.svg b/apps/docs/src/public/icons/logo-twitter.svg new file mode 100644 index 0000000..9b068f8 --- /dev/null +++ b/apps/docs/src/public/icons/logo-twitter.svg @@ -0,0 +1 @@ +Logo Twitter \ No newline at end of file diff --git a/apps/docs/src/public/icons/moon-outline.svg b/apps/docs/src/public/icons/moon-outline.svg new file mode 100644 index 0000000..c85150b --- /dev/null +++ b/apps/docs/src/public/icons/moon-outline.svg @@ -0,0 +1 @@ +Moon \ No newline at end of file diff --git a/apps/docs/src/public/icons/moon.svg b/apps/docs/src/public/icons/moon.svg new file mode 100644 index 0000000..4292577 --- /dev/null +++ b/apps/docs/src/public/icons/moon.svg @@ -0,0 +1 @@ +Moon \ No newline at end of file diff --git a/apps/docs/src/public/icons/search-outline.svg b/apps/docs/src/public/icons/search-outline.svg new file mode 100644 index 0000000..103efe8 --- /dev/null +++ b/apps/docs/src/public/icons/search-outline.svg @@ -0,0 +1 @@ +Search \ No newline at end of file diff --git a/apps/docs/src/public/icons/search-white.svg b/apps/docs/src/public/icons/search-white.svg new file mode 100644 index 0000000..f7f7956 --- /dev/null +++ b/apps/docs/src/public/icons/search-white.svg @@ -0,0 +1 @@ +Search diff --git a/apps/docs/src/public/icons/search.svg b/apps/docs/src/public/icons/search.svg new file mode 100644 index 0000000..83d0c11 --- /dev/null +++ b/apps/docs/src/public/icons/search.svg @@ -0,0 +1 @@ +Search diff --git a/apps/docs/src/public/icons/sunny.svg b/apps/docs/src/public/icons/sunny.svg new file mode 100644 index 0000000..2b8b16b --- /dev/null +++ b/apps/docs/src/public/icons/sunny.svg @@ -0,0 +1 @@ +Sunny \ No newline at end of file diff --git a/apps/docs/src/public/images/blog/leaf3-event-banner.jpg b/apps/docs/src/public/images/blog/leaf3-event-banner.jpg new file mode 100644 index 0000000..42c135c Binary files /dev/null and b/apps/docs/src/public/images/blog/leaf3-event-banner.jpg differ diff --git a/apps/docs/src/public/images/blog/leaf3-event.jpg b/apps/docs/src/public/images/blog/leaf3-event.jpg new file mode 100644 index 0000000..69a0805 Binary files /dev/null and b/apps/docs/src/public/images/blog/leaf3-event.jpg differ diff --git a/apps/docs/src/public/images/blog/leaf3-twitter-header.jpg b/apps/docs/src/public/images/blog/leaf3-twitter-header.jpg new file mode 100644 index 0000000..a475309 Binary files /dev/null and b/apps/docs/src/public/images/blog/leaf3-twitter-header.jpg differ diff --git a/apps/docs/src/public/images/blog/leaf3-twitter-post.jpg b/apps/docs/src/public/images/blog/leaf3-twitter-post.jpg new file mode 100644 index 0000000..363db4c Binary files /dev/null and b/apps/docs/src/public/images/blog/leaf3-twitter-post.jpg differ diff --git a/apps/docs/src/public/images/blog/leaf3-twitter-rebrand.jpg b/apps/docs/src/public/images/blog/leaf3-twitter-rebrand.jpg new file mode 100644 index 0000000..41741d9 Binary files /dev/null and b/apps/docs/src/public/images/blog/leaf3-twitter-rebrand.jpg differ diff --git a/apps/docs/src/public/images/icons/bulb.svg b/apps/docs/src/public/images/icons/bulb.svg new file mode 100644 index 0000000..984f318 --- /dev/null +++ b/apps/docs/src/public/images/icons/bulb.svg @@ -0,0 +1,10 @@ + + + bulb + + + + + + + diff --git a/apps/docs/src/public/images/icons/danger.svg b/apps/docs/src/public/images/icons/danger.svg new file mode 100644 index 0000000..45a7c34 --- /dev/null +++ b/apps/docs/src/public/images/icons/danger.svg @@ -0,0 +1,13 @@ + + + danger + + + + + + + + + + diff --git a/apps/docs/src/public/images/icons/icon-128x128.png b/apps/docs/src/public/images/icons/icon-128x128.png new file mode 100644 index 0000000..274ee6d Binary files /dev/null and b/apps/docs/src/public/images/icons/icon-128x128.png differ diff --git a/apps/docs/src/public/images/icons/icon-144x144.png b/apps/docs/src/public/images/icons/icon-144x144.png new file mode 100644 index 0000000..07d7584 Binary files /dev/null and b/apps/docs/src/public/images/icons/icon-144x144.png differ diff --git a/apps/docs/src/public/images/icons/icon-152x152.png b/apps/docs/src/public/images/icons/icon-152x152.png new file mode 100644 index 0000000..8099ef7 Binary files /dev/null and b/apps/docs/src/public/images/icons/icon-152x152.png differ diff --git a/apps/docs/src/public/images/icons/icon-192x192.png b/apps/docs/src/public/images/icons/icon-192x192.png new file mode 100644 index 0000000..24a9769 Binary files /dev/null and b/apps/docs/src/public/images/icons/icon-192x192.png differ diff --git a/apps/docs/src/public/images/icons/icon-384x384.png b/apps/docs/src/public/images/icons/icon-384x384.png new file mode 100644 index 0000000..06c4b08 Binary files /dev/null and b/apps/docs/src/public/images/icons/icon-384x384.png differ diff --git a/apps/docs/src/public/images/icons/icon-512x512.png b/apps/docs/src/public/images/icons/icon-512x512.png new file mode 100644 index 0000000..7d9e79a Binary files /dev/null and b/apps/docs/src/public/images/icons/icon-512x512.png differ diff --git a/apps/docs/src/public/images/icons/icon-72x72.png b/apps/docs/src/public/images/icons/icon-72x72.png new file mode 100644 index 0000000..341e525 Binary files /dev/null and b/apps/docs/src/public/images/icons/icon-72x72.png differ diff --git a/apps/docs/src/public/images/icons/icon-96x96.png b/apps/docs/src/public/images/icons/icon-96x96.png new file mode 100644 index 0000000..bf1e51c Binary files /dev/null and b/apps/docs/src/public/images/icons/icon-96x96.png differ diff --git a/apps/docs/src/public/images/icons/info.svg b/apps/docs/src/public/images/icons/info.svg new file mode 100644 index 0000000..26ca6e7 --- /dev/null +++ b/apps/docs/src/public/images/icons/info.svg @@ -0,0 +1,11 @@ + + + info + + + + + + + + diff --git a/apps/docs/src/public/images/icons/stop.svg b/apps/docs/src/public/images/icons/stop.svg new file mode 100644 index 0000000..85cd36a --- /dev/null +++ b/apps/docs/src/public/images/icons/stop.svg @@ -0,0 +1,10 @@ + + + stop + + + + + + + \ No newline at end of file diff --git a/apps/docs/src/public/images/logo.png b/apps/docs/src/public/images/logo.png new file mode 100644 index 0000000..60e1700 Binary files /dev/null and b/apps/docs/src/public/images/logo.png differ diff --git a/apps/docs/src/public/images/oxford-comma.jpg b/apps/docs/src/public/images/oxford-comma.jpg new file mode 100644 index 0000000..1f57614 Binary files /dev/null and b/apps/docs/src/public/images/oxford-comma.jpg differ diff --git a/apps/docs/src/public/images/partners/64robots-hero.jpg b/apps/docs/src/public/images/partners/64robots-hero.jpg new file mode 100644 index 0000000..b532e43 Binary files /dev/null and b/apps/docs/src/public/images/partners/64robots-hero.jpg differ diff --git a/apps/docs/src/public/images/partners/64robots.svg b/apps/docs/src/public/images/partners/64robots.svg new file mode 100644 index 0000000..022e7c1 --- /dev/null +++ b/apps/docs/src/public/images/partners/64robots.svg @@ -0,0 +1 @@ +64 Robots diff --git a/apps/docs/src/public/images/partners/curotec-hero.jpg b/apps/docs/src/public/images/partners/curotec-hero.jpg new file mode 100644 index 0000000..1948fcc Binary files /dev/null and b/apps/docs/src/public/images/partners/curotec-hero.jpg differ diff --git a/apps/docs/src/public/images/partners/curotec.png b/apps/docs/src/public/images/partners/curotec.png new file mode 100644 index 0000000..416eba4 Binary files /dev/null and b/apps/docs/src/public/images/partners/curotec.png differ diff --git a/apps/docs/src/public/images/partners/devsquad-hero.jpg b/apps/docs/src/public/images/partners/devsquad-hero.jpg new file mode 100644 index 0000000..52837bc Binary files /dev/null and b/apps/docs/src/public/images/partners/devsquad-hero.jpg differ diff --git a/apps/docs/src/public/images/partners/devsquad.png b/apps/docs/src/public/images/partners/devsquad.png new file mode 100644 index 0000000..a6f579f Binary files /dev/null and b/apps/docs/src/public/images/partners/devsquad.png differ diff --git a/apps/docs/src/public/images/partners/monterail-hero.jpg b/apps/docs/src/public/images/partners/monterail-hero.jpg new file mode 100644 index 0000000..48fc7d4 Binary files /dev/null and b/apps/docs/src/public/images/partners/monterail-hero.jpg differ diff --git a/apps/docs/src/public/images/partners/monterail.png b/apps/docs/src/public/images/partners/monterail.png new file mode 100644 index 0000000..0609a90 Binary files /dev/null and b/apps/docs/src/public/images/partners/monterail.png differ diff --git a/apps/docs/src/public/images/partners/passionatepeople-dark.png b/apps/docs/src/public/images/partners/passionatepeople-dark.png new file mode 100644 index 0000000..80496ac Binary files /dev/null and b/apps/docs/src/public/images/partners/passionatepeople-dark.png differ diff --git a/apps/docs/src/public/images/partners/passionatepeople-hero.jpg b/apps/docs/src/public/images/partners/passionatepeople-hero.jpg new file mode 100644 index 0000000..3334668 Binary files /dev/null and b/apps/docs/src/public/images/partners/passionatepeople-hero.jpg differ diff --git a/apps/docs/src/public/images/partners/passionatepeople.png b/apps/docs/src/public/images/partners/passionatepeople.png new file mode 100644 index 0000000..78bd5b6 Binary files /dev/null and b/apps/docs/src/public/images/partners/passionatepeople.png differ diff --git a/apps/docs/src/public/images/partners/redberry-hero.jpg b/apps/docs/src/public/images/partners/redberry-hero.jpg new file mode 100644 index 0000000..d045814 Binary files /dev/null and b/apps/docs/src/public/images/partners/redberry-hero.jpg differ diff --git a/apps/docs/src/public/images/partners/redberry.png b/apps/docs/src/public/images/partners/redberry.png new file mode 100644 index 0000000..1e2ff56 Binary files /dev/null and b/apps/docs/src/public/images/partners/redberry.png differ diff --git a/apps/docs/src/public/images/partners/tighten-dark.svg b/apps/docs/src/public/images/partners/tighten-dark.svg new file mode 100644 index 0000000..570f99a --- /dev/null +++ b/apps/docs/src/public/images/partners/tighten-dark.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/apps/docs/src/public/images/partners/tighten-hero.jpg b/apps/docs/src/public/images/partners/tighten-hero.jpg new file mode 100644 index 0000000..f09378b Binary files /dev/null and b/apps/docs/src/public/images/partners/tighten-hero.jpg differ diff --git a/apps/docs/src/public/images/partners/tighten.svg b/apps/docs/src/public/images/partners/tighten.svg new file mode 100644 index 0000000..d1edb27 --- /dev/null +++ b/apps/docs/src/public/images/partners/tighten.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/apps/docs/src/public/images/partners/vehikl-dark.svg b/apps/docs/src/public/images/partners/vehikl-dark.svg new file mode 100644 index 0000000..3636970 --- /dev/null +++ b/apps/docs/src/public/images/partners/vehikl-dark.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/apps/docs/src/public/images/partners/vehikl-hero.jpg b/apps/docs/src/public/images/partners/vehikl-hero.jpg new file mode 100644 index 0000000..b8b5953 Binary files /dev/null and b/apps/docs/src/public/images/partners/vehikl-hero.jpg differ diff --git a/apps/docs/src/public/images/partners/vehikl.svg b/apps/docs/src/public/images/partners/vehikl.svg new file mode 100644 index 0000000..2746f8d --- /dev/null +++ b/apps/docs/src/public/images/partners/vehikl.svg @@ -0,0 +1 @@ +vehikl \ No newline at end of file diff --git a/apps/docs/src/public/images/partners/webreinvent-hero.jpg b/apps/docs/src/public/images/partners/webreinvent-hero.jpg new file mode 100644 index 0000000..5595b2c Binary files /dev/null and b/apps/docs/src/public/images/partners/webreinvent-hero.jpg differ diff --git a/apps/docs/src/public/images/partners/webreinvent.png b/apps/docs/src/public/images/partners/webreinvent.png new file mode 100644 index 0000000..0bdd02c Binary files /dev/null and b/apps/docs/src/public/images/partners/webreinvent.png differ diff --git a/apps/docs/src/public/images/paypal.png b/apps/docs/src/public/images/paypal.png new file mode 100644 index 0000000..aa7213b Binary files /dev/null and b/apps/docs/src/public/images/paypal.png differ diff --git a/apps/docs/src/public/images/sponsors/.gitkeep b/apps/docs/src/public/images/sponsors/.gitkeep new file mode 100644 index 0000000..e69de29 diff --git a/apps/docs/src/public/images/sponsors/hbuilder.avif b/apps/docs/src/public/images/sponsors/hbuilder.avif new file mode 100644 index 0000000..91ccd51 Binary files /dev/null and b/apps/docs/src/public/images/sponsors/hbuilder.avif differ diff --git a/apps/docs/src/public/images/sponsors/hbuilder.png b/apps/docs/src/public/images/sponsors/hbuilder.png new file mode 100644 index 0000000..d39aade Binary files /dev/null and b/apps/docs/src/public/images/sponsors/hbuilder.png differ diff --git a/apps/docs/src/public/images/vueschool/vs-close.svg b/apps/docs/src/public/images/vueschool/vs-close.svg new file mode 100644 index 0000000..0e2f31f --- /dev/null +++ b/apps/docs/src/public/images/vueschool/vs-close.svg @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/apps/docs/src/public/images/vueschool/vs-fw-bg-small.svg b/apps/docs/src/public/images/vueschool/vs-fw-bg-small.svg new file mode 100644 index 0000000..a914f40 --- /dev/null +++ b/apps/docs/src/public/images/vueschool/vs-fw-bg-small.svg @@ -0,0 +1,183 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/apps/docs/src/public/images/vueschool/vs-fw-bg.svg b/apps/docs/src/public/images/vueschool/vs-fw-bg.svg new file mode 100644 index 0000000..8c52220 --- /dev/null +++ b/apps/docs/src/public/images/vueschool/vs-fw-bg.svg @@ -0,0 +1,219 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/apps/docs/src/public/images/vueschool/vs-iso.svg b/apps/docs/src/public/images/vueschool/vs-iso.svg new file mode 100644 index 0000000..a95d926 --- /dev/null +++ b/apps/docs/src/public/images/vueschool/vs-iso.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/apps/docs/src/public/images/vueschool/vs-logo.svg b/apps/docs/src/public/images/vueschool/vs-logo.svg new file mode 100644 index 0000000..b44c004 --- /dev/null +++ b/apps/docs/src/public/images/vueschool/vs-logo.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/apps/docs/src/public/logo-circle.png b/apps/docs/src/public/logo-circle.png new file mode 100644 index 0000000..9fbc613 Binary files /dev/null and b/apps/docs/src/public/logo-circle.png differ diff --git a/apps/docs/src/public/logo.png b/apps/docs/src/public/logo.png new file mode 100644 index 0000000..bd9e19b Binary files /dev/null and b/apps/docs/src/public/logo.png differ diff --git a/apps/docs/src/public/manifest.json b/apps/docs/src/public/manifest.json new file mode 100644 index 0000000..b2781aa --- /dev/null +++ b/apps/docs/src/public/manifest.json @@ -0,0 +1,50 @@ +{ + "name": "Leaf PHP", + "short_name": "Leaf PHP", + "start_url": ".", + "display": "standalone", + "background_color": "#001e26", + "description": "Leaf PHP framework documentation", + "icons": [ + { + "src": "images/icons/icon-72x72.png", + "sizes": "72x72", + "type": "image/png" + }, + { + "src": "images/icons/icon-96x96.png", + "sizes": "96x96", + "type": "image/png" + }, + { + "src": "images/icons/icon-128x128.png", + "sizes": "128x128", + "type": "image/png" + }, + { + "src": "images/icons/icon-144x144.png", + "sizes": "144x144", + "type": "image/png" + }, + { + "src": "images/icons/icon-152x152.png", + "sizes": "152x152", + "type": "image/png" + }, + { + "src": "images/icons/icon-192x192.png", + "sizes": "192x192", + "type": "image/png" + }, + { + "src": "images/icons/icon-384x384.png", + "sizes": "384x384", + "type": "image/png" + }, + { + "src": "images/icons/icon-512x512.png", + "sizes": "512x512", + "type": "image/png" + } + ] +} diff --git a/apps/docs/src/public/service-worker.js b/apps/docs/src/public/service-worker.js new file mode 100644 index 0000000..a9097e2 --- /dev/null +++ b/apps/docs/src/public/service-worker.js @@ -0,0 +1,15 @@ +// force clearing previous service worker +self.addEventListener('install', function (e) { + self.skipWaiting() +}) + +self.addEventListener('activate', function (e) { + self.registration + .unregister() + .then(function () { + return self.clients.matchAll() + }) + .then(function (clients) { + clients.forEach((client) => client.navigate(client.url)) + }) +}) diff --git a/apps/docs/src/public/sponsors.json b/apps/docs/src/public/sponsors.json new file mode 100644 index 0000000..4fa4d3a --- /dev/null +++ b/apps/docs/src/public/sponsors.json @@ -0,0 +1,302 @@ +{ + "special": [], + "sponsor": [ + { + "name": "Netlify", + "url": "https://netlify.com", + "img": "https://user-images.githubusercontent.com/26604242/186772985-b21c2850-3cc3-41c6-9299-fe9cc5bac46a.png" + }, + { + "name": "JetBrains", + "url": "https://www.jetbrains.com/", + "img": "https://avatars.githubusercontent.com/u/878437?s=200&v=4" + }, + { + "name": "Digital Ocean", + "url": "https://www.digitalocean.com/", + "img": "https://avatars.githubusercontent.com/u/4650108?s=200&v=4" + }, + { + "name": "Vano", + "url": "#", + "img": "https://images.opencollective.com/guest-32634fda/avatar.png" + }, + { + "name": "Casprine Asempah", + "url": "https://github.com/casprine", + "img": "https://images.opencollective.com/guest-c72a498e/avatar.png" + }, + { + "name": "Terry B", + "url": "https://github.com/terrybr", + "img": "https://avatars.githubusercontent.com/u/378788?v=4" + }, + { + "name": "Farhan Yahaya", + "url": "https://github.com/doc-han", + "img": "https://avatars.githubusercontent.com/u/35382021?v=4" + }, + { + "name": "Lucas Chaplain", + "url": "https://www.lucaschaplain.design/", + "img": "https://images.opencollective.com/sptaule/aa5f956/avatar/256.png" + }, + { + "name": "Dawuda Iddris", + "url": "https://github.com/dawoodiddris", + "img": "https://avatars.githubusercontent.com/u/31323758?v=4" + }, + { + "name": "King David Gyimah", + "url": "https://github.com/kdgyimah", + "img": "https://avatars.githubusercontent.com/u/29569594?v=4" + }, + { + "name": "Andy Kwesi Apenteng", + "url": "https://github.com/andykwesi", + "img": "https://avatars.githubusercontent.com/u/36931378?v=4" + }, + { + "name": "Aaron Smith", + "url": "https://opencollective.com/aaron-smith3", + "img": "https://images.opencollective.com/aaron-smith3/08ee620/avatar/256.png" + }, + { + "name": "Peter Bogner", + "url": "https://opencollective.com/peter-bogner", + "img": "https://images.opencollective.com/peter-bogner/avatar/256.png" + }, + { + "name": "温柔", + "url": "https://github.com/Seevil", + "img": "https://avatars.githubusercontent.com/u/7334510?v=4" + }, + { + "name": "Diego", + "url": "https://opencollective.com/guest-d6b48e41", + "img": "https://images.opencollective.com/guest-d6b48e41/avatar.png" + } + ], + "code": [ + { + "name": "Michael Darko", + "url": "https://github.com/mychidarko", + "img": "https://avatars.githubusercontent.com/u/26604242?v=4" + }, + { + "name": "André Rosa", + "url": "https://github.com/crosa7", + "img": "https://avatars.githubusercontent.com/u/32076460?v=4" + }, + { + "name": "Matthew Reichardt", + "url": "https://github.com/matthewjamesr", + "img": "https://avatars.githubusercontent.com/u/303321?v=4" + }, + { + "name": "Daniel Lemes", + "url": "https://github.com/lemesdaniel", + "img": "https://avatars.githubusercontent.com/u/587064?v=4" + }, + { + "name": "Ivan Voitovych", + "url": "https://github.com/ivanvoitovych/", + "img": "https://avatars.githubusercontent.com/u/9718423?v=4" + }, + { + "name": "Joan Miquel", + "url": "https://github.com/joanhey", + "img": "https://avatars.githubusercontent.com/u/249085?v=4" + }, + { + "name": "Ademílson F. Tonato", + "url": "https://github.com/ftonato", + "img": "https://avatars.githubusercontent.com/u/5417662?v=4" + }, + { + "name": "Vitor Rodrigues", + "url": "https://github.com/vs0uz4", + "img": "https://avatars.githubusercontent.com/u/2080547?v=4" + }, + { + "name": "sptaule", + "url": "https://github.com/sptaule", + "img": "https://avatars.githubusercontent.com/u/5262097?v=4" + }, + { + "name": "Tobias Herber", + "url": "https://github.com/herber", + "img": "https://avatars.githubusercontent.com/u/22559657?&v=4" + }, + { + "name": "Pjotr Savitski", + "url": "https://github.com/pjotrsavitski", + "img": "https://avatars.githubusercontent.com/u/518331?&v=4" + }, + { + "name": "Pablo Ferreiro", + "url": "https://github.com/pablouser1", + "img": "https://avatars.githubusercontent.com/u/17802865?&v=4" + }, + { + "name": "jess", + "url": "https://github.com/monkeywithacupcake", + "img": "https://avatars.githubusercontent.com/u/7316730?v=4" + }, + { + "name": "Sergey Romanenko", + "url": "https://github.com/Awilum", + "img": "https://avatars.githubusercontent.com/u/477114?v=4" + }, + { + "name": "Torben Buck", + "url": "https://github.com/Rasalas", + "img": "https://avatars.githubusercontent.com/u/7483565?v=4" + }, + { + "name": "Master Sofua Desmond", + "url": "https://github.com/cr34t1ve", + "img": "https://avatars.githubusercontent.com/u/37486330?v=4" + }, + { + "name": "Ashley", + "url": "https://github.com/AshleySymbolic", + "img": "https://avatars.githubusercontent.com/u/93997546?v=4" + }, + { + "name": "Ivan Brykov", + "url": "https://github.com/brykov", + "img": "https://avatars.githubusercontent.com/u/476516?v=4" + }, + { + "name": "Nur Muhammad", + "url": "https://github.com/ngekoding", + "img": "https://avatars.githubusercontent.com/u/11625690?v=4" + }, + { + "name": "Mauro Callegari", + "url": "https://github.com/MauMaxxa", + "img": "https://avatars.githubusercontent.com/u/10811652?v=4" + }, + { + "name": "Aminur Rahaman", + "url": "https://github.com/Aminur670", + "img": "https://avatars.githubusercontent.com/u/32174602?v=4" + }, + { + "name": "Divine Niiquaye Ibok", + "url": "https://github.com/divineniiquaye", + "img": "https://avatars.githubusercontent.com/u/53147395?v=4" + }, + { + "name": "Rai-Rai", + "url": "https://github.com/Rai-Rai", + "img": "https://avatars.githubusercontent.com/u/2023869?v=4" + }, + { + "name": "Wahyu Kristianto", + "url": "https://github.com/Kristories", + "img": "https://avatars.githubusercontent.com/u/774338?v=4" + }, + { + "name": "Muhammad Ezha Syafaat", + "url": "https://github.com/ezhasyafaat", + "img": "https://avatars.githubusercontent.com/u/49098343?v=4" + }, + { + "name": "Rafael M.", + "url": "https://github.com/iamrameffort", + "img": "https://avatars.githubusercontent.com/u/52138516?v=4" + }, + { + "name": "Pisyek K.", + "url": "https://github.com/pisyek", + "img": "https://avatars.githubusercontent.com/u/10695986?v=4" + }, + { + "name": "Rafael Morais", + "url": "https://github.com/rafaelcanical", + "img": "https://avatars.githubusercontent.com/u/924985?v=4" + }, + { + "name": "wfsdaj", + "url": "https://github.com/wfsdaj", + "img": "https://avatars.githubusercontent.com/u/36911167?v=4" + }, + { + "name": "tedtop", + "url": "https://github.com/tedtop", + "img": "https://avatars.githubusercontent.com/u/5151307?v=4" + }, + { + "name": "Dreamer0x01", + "url": "https://github.com/Dreamer0x01", + "img": "https://avatars.githubusercontent.com/u/12978365?v=4" + }, + { + "name": "N'Bayramberdiyev", + "url": "https://github.com/nbayramberdiyev", + "img": "https://avatars.githubusercontent.com/u/23094428?v=4" + }, + { + "name": "Robin", + "url": "https://github.com/MrAnyx", + "img": "https://avatars.githubusercontent.com/u/44176707?v=4" + }, + { + "name": "Doeke Norg", + "url": "https://github.com/doekenorg", + "img": "https://avatars.githubusercontent.com/u/529515?v=4" + }, + { + "name": "Francisco Ernesto Teixeira", + "url": "https://github.com/netinhoteixeira", + "img": "https://avatars.githubusercontent.com/u/1563399?v=4" + }, + { + "name": "Ryan Gunn", + "url": "https://github.com/bluesn4rfer", + "img": "https://avatars.githubusercontent.com/u/86926422?v=4" + }, + { + "name": "Shahlin Ibrahim", + "url": "https://github.com/shahlin", + "img": "https://avatars.githubusercontent.com/u/32275018?v=4" + }, + { + "name": "Jei", + "url": "https://github.com/jeis4n", + "img": "https://avatars.githubusercontent.com/u/112980298?v=4" + }, + { + "name": "induwara16", + "url": "https://github.com/induwara16", + "img": "https://avatars.githubusercontent.com/u/122541423?v=4" + }, + { + "name": "Dr. Tobias Quathamer", + "url": "https://github.com/toddy15", + "img": "https://avatars.githubusercontent.com/u/12176273?v=4" + }, + { + "name": "Zhangmw", + "url": "https://github.com/codediy", + "img": "https://avatars.githubusercontent.com/u/20250924?v=4" + }, + { + "name": "kczx3", + "url": "https://github.com/kczx3", + "img": "https://avatars.githubusercontent.com/u/15206020?v=4" + }, + { + "name": "1mahdimf", + "url": "https://github.com/1mahdimf", + "img": "https://avatars.githubusercontent.com/u/8771082?v=4" + }, + { + "name": "Shubham Chaudhary", + "url": "https://github.com/Shubhamc4", + "img": "https://avatars.githubusercontent.com/u/71214613?v=4" + } + ] +} diff --git a/apps/docs/src/sponsor/index.md b/apps/docs/src/sponsor/index.md new file mode 100644 index 0000000..eb660e3 --- /dev/null +++ b/apps/docs/src/sponsor/index.md @@ -0,0 +1,54 @@ +--- +sidebar: false +ads: false +editLink: false +# sponsors: false +vuejobs: false +--- + + + +# Support Leaf's Development + +Leaf PHP is an MIT licensed open source project and completely free to use. We are not officially backed by any company or budget, we are just a bunch of random people working towards a goal: to make software development a beautiful experience for developers. However, the amount of effort needed to maintain and develop new features for the project is not sustainable without proper financial backing. + +For this reason, we encourage you to help us reach our goal and continue making software development easier. + +## How to Sponsor + +Sponsorships can be done via [GitHub Sponsors](https://github.com/sponsors/leafsphp) or [OpenCollective](https://opencollective.com/leaf). All your contributions go into a fund with transparent expense models for supporting community efforts, events and core activities regarding Leaf. Both monthly-recurring sponsorships and one-time donations are accepted. Recurring sponsorships are entitled to logo placements as specified in Sponsorship Tiers. + +## Sponsoring Leaf as a Business + +Sponsoring Leaf gives you great exposure to all Leaf developers around the world through our website and GitHub project READMEs. In addition, supporting OSS improves the reputation of your brand, which is an important asset for any company that interacts with developers. + +If you are using Leaf to build a revenue-generating product, it makes business sense to sponsor Leaf's development: **it ensures the project that your product relies on stays healthy and actively maintained.** The exposure and positive brand image in the Leaf community also makes it easier to attract and recruit developers. + +If you are building a product where your target customers are developers, you will gain high quality traffic through the sponsorship exposure, since all our visitors are developers. The sponsorship also builds brand recognition and improves conversion. + +## Current Sponsors + +### Open Collective Sponsors + + + + diff --git a/apps/docs/src/support/index.md b/apps/docs/src/support/index.md new file mode 100644 index 0000000..eb660e3 --- /dev/null +++ b/apps/docs/src/support/index.md @@ -0,0 +1,54 @@ +--- +sidebar: false +ads: false +editLink: false +# sponsors: false +vuejobs: false +--- + + + +# Support Leaf's Development + +Leaf PHP is an MIT licensed open source project and completely free to use. We are not officially backed by any company or budget, we are just a bunch of random people working towards a goal: to make software development a beautiful experience for developers. However, the amount of effort needed to maintain and develop new features for the project is not sustainable without proper financial backing. + +For this reason, we encourage you to help us reach our goal and continue making software development easier. + +## How to Sponsor + +Sponsorships can be done via [GitHub Sponsors](https://github.com/sponsors/leafsphp) or [OpenCollective](https://opencollective.com/leaf). All your contributions go into a fund with transparent expense models for supporting community efforts, events and core activities regarding Leaf. Both monthly-recurring sponsorships and one-time donations are accepted. Recurring sponsorships are entitled to logo placements as specified in Sponsorship Tiers. + +## Sponsoring Leaf as a Business + +Sponsoring Leaf gives you great exposure to all Leaf developers around the world through our website and GitHub project READMEs. In addition, supporting OSS improves the reputation of your brand, which is an important asset for any company that interacts with developers. + +If you are using Leaf to build a revenue-generating product, it makes business sense to sponsor Leaf's development: **it ensures the project that your product relies on stays healthy and actively maintained.** The exposure and positive brand image in the Leaf community also makes it easier to attract and recruit developers. + +If you are building a product where your target customers are developers, you will gain high quality traffic through the sponsorship exposure, since all our visitors are developers. The sponsorship also builds brand recognition and improves conversion. + +## Current Sponsors + +### Open Collective Sponsors + + + + diff --git a/apps/docs/src/translations/index.md b/apps/docs/src/translations/index.md new file mode 100644 index 0000000..5140efd --- /dev/null +++ b/apps/docs/src/translations/index.md @@ -0,0 +1,25 @@ +--- +aside: false +--- + +# Translations + +The Leaf documentation currently only comes in English, but we wish to support other languages for free native translations. + +Translation efforts are managed in the [leafphp-translations](https://github.com/leafphp-translations/) GitHub organization. If you want to contribute, you can open an issue to express your interest. + + + +## Translations + +There are currently the following translations underway. If you want to contribute, you can open an issue to express your interest. + +- [Brazilian Portuguese (WIP)](https://pt-br.leafphp.dev) +- [French (WIP)](https://fr.leafphp.dev) + +## Starting a new Translation + +We are hoping to establish a standard workflow for community translations so that we can more easily coordinate community efforts. Please keep an eye on the [Translation Guidelines repo](https://github.com/leafphp-translations/guidelines/blob/main/README.md) for updates. + +In the meanwhile, if you are interested in starting translation for a new language, please open a thread in the [Discussions](https://github.com/leafphp-translations/guidelines/discussions) (and check if there is already one created for your language). This can help you find fellow collaborators and avoid duplicated efforts. diff --git a/apps/docs/src/tutorial/Repl/old/ssr-stub.js b/apps/docs/src/tutorial/Repl/old/ssr-stub.js new file mode 100644 index 0000000..7c6d6c7 --- /dev/null +++ b/apps/docs/src/tutorial/Repl/old/ssr-stub.js @@ -0,0 +1 @@ +module.exports = {} \ No newline at end of file diff --git a/apps/docs/src/tutorial/Repl/old/style.css b/apps/docs/src/tutorial/Repl/old/style.css new file mode 100644 index 0000000..9635363 --- /dev/null +++ b/apps/docs/src/tutorial/Repl/old/style.css @@ -0,0 +1,937 @@ + +.split-pane[data-v-3102671e] { + display: flex; + height: 100%; + position: relative; +} +.split-pane.dragging[data-v-3102671e] { + cursor: ew-resize; +} +.dragging .left[data-v-3102671e], +.dragging .right[data-v-3102671e] { + pointer-events: none; +} +.left[data-v-3102671e], +.right[data-v-3102671e] { + position: relative; + height: 100%; +} +.left[data-v-3102671e] { + border-right: 1px solid var(--border); +} +.dragger[data-v-3102671e] { + position: absolute; + z-index: 3; + top: 0; + bottom: 0; + right: -5px; + width: 10px; + cursor: ew-resize; +} +.toggler[data-v-3102671e] { + display: none; + z-index: 3; + font-family: var(--font-code); + color: var(--text-light); + position: absolute; + left: 50%; + bottom: 20px; + background-color: var(--bg); + padding: 8px 12px; + border-radius: 8px; + transform: translateX(-50%); + box-shadow: 0 3px 8px rgba(0, 0, 0, 0.25); +} +.dark .toggler[data-v-3102671e] { + background-color: var(--bg); +} + +/* vertical */ +@media (min-width: 721px) { +.split-pane.vertical[data-v-3102671e] { + display: block; +} +.split-pane.vertical.dragging[data-v-3102671e] { + cursor: ns-resize; +} +.vertical .dragger[data-v-3102671e] { + top: auto; + height: 10px; + width: 100%; + left: 0; + right: 0; + bottom: -5px; + cursor: ns-resize; +} +.vertical .left[data-v-3102671e], + .vertical .right[data-v-3102671e] { + width: 100%; +} +.vertical .left[data-v-3102671e] { + border-right: none; + border-bottom: 1px solid var(--border); +} +} + +/* mobile */ +@media (max-width: 720px) { +.left[data-v-3102671e], + .right[data-v-3102671e] { + width: 100% !important; + height: 100% !important; +} +.dragger[data-v-3102671e] { + display: none; +} +.split-pane .toggler[data-v-3102671e] { + display: block; +} +.split-pane .right[data-v-3102671e] { + display: none; +} +.split-pane.show-output .right[data-v-3102671e] { + display: block; +} +.split-pane.show-output .left[data-v-3102671e] { + display: none; +} +} + +.file-selector[data-v-21b6e53a] { + display: flex; + box-sizing: border-box; + border-bottom: 1px solid var(--border); + background-color: var(--bg); + overflow-y: hidden; + overflow-x: auto; + white-space: nowrap; + position: relative; + height: var(--header-height); +} +.file-selector[data-v-21b6e53a]::-webkit-scrollbar { + height: 1px; +} +.file-selector[data-v-21b6e53a]::-webkit-scrollbar-track { + background-color: var(--border); +} +.file-selector[data-v-21b6e53a]::-webkit-scrollbar-thumb { + background-color: var(--color-branding); +} +.file-selector.has-import-map .add[data-v-21b6e53a] { + margin-right: 10px; +} +.file[data-v-21b6e53a] { + display: inline-block; + font-size: 13px; + font-family: var(--font-code); + cursor: pointer; + color: var(--text-light); + box-sizing: border-box; +} +.file.active[data-v-21b6e53a] { + color: var(--color-branding); + border-bottom: 3px solid var(--color-branding); + cursor: text; +} +.file span[data-v-21b6e53a] { + display: inline-block; + padding: 8px 10px 6px; + line-height: 20px; +} +.file.pending input[data-v-21b6e53a] { + width: 90px; + height: 30px; + line-height: 30px; + outline: none; + border: 1px solid var(--border); + border-radius: 4px; + padding: 0 0 0 10px; + margin-top: 2px; + margin-left: 6px; + font-family: var(--font-code); + font-size: 12px; +} +.file .remove[data-v-21b6e53a] { + display: inline-block; + vertical-align: middle; + line-height: 12px; + cursor: pointer; + padding-left: 0; +} +.add[data-v-21b6e53a] { + font-size: 18px; + font-family: var(--font-code); + color: #999; + vertical-align: middle; + margin-left: 6px; + position: relative; + top: -1px; +} +.add[data-v-21b6e53a]:hover { + color: var(--color-branding); +} +.icon[data-v-21b6e53a] { + margin-top: -1px; +} +.import-map-wrapper[data-v-21b6e53a] { + position: sticky; + margin-left: auto; + top: 0; + right: 0; + padding-left: 30px; + background-color: var(--bg); + background: linear-gradient( + 90deg, + rgba(255, 255, 255, 0) 0%, + rgba(255, 255, 255, 1) 25% + ); +} +.dark .import-map-wrapper[data-v-21b6e53a] { + background: linear-gradient( + 90deg, + rgba(26, 26, 26, 0) 0%, + rgba(26, 26, 26, 1) 25% + ); +} +/* BASICS */ + +.CodeMirror { + color: var(--symbols); + --symbols: #777; + --base: #545281; + --comment: hsl(210, 25%, 60%); + --keyword: #af4ab1; + --variable: var(--base); + --function: #c25205; + --string: #2ba46d; + --number: #c25205; + --tags: #dd0000; + --brackets: var(--comment); + --qualifier: #ff6032; + --important: var(--string); + --attribute: #9c3eda; + --property: #6182b8; + + --selected-bg: #d7d4f0; + --selected-bg-non-focus: #d9d9d9; + --cursor: #000; + + direction: ltr; + font-family: var(--font-code); + height: auto; +} + +.dark .CodeMirror { + color: var(--symbols); + --symbols: #89ddff; + --base: #a6accd; + --comment: #6d6d6d; + --keyword: #89ddff; + --string: #c3e88d; + --variable: #82aaff; + --number: #f78c6c; + --tags: #f07178; + --brackets: var(--symbols); + --property: #f07178; + --attribute: #c792ea; + --cursor: #fff; + + --selected-bg: rgba(255, 255, 255, 0.1); + --selected-bg-non-focus: rgba(255, 255, 255, 0.15); +} + +/* PADDING */ + +.CodeMirror-lines { + padding: 4px 0; /* Vertical padding around content */ +} +.CodeMirror pre { + padding: 0 4px; /* Horizontal padding of content */ +} + +.CodeMirror-scrollbar-filler, +.CodeMirror-gutter-filler { + background-color: white; /* The little square between H and V scrollbars */ +} + +/* GUTTER */ + +.CodeMirror-gutters { + border-right: 1px solid var(--border); + background-color: transparent; + white-space: nowrap; +} +.CodeMirror-linenumber { + padding: 0 3px 0 5px; + min-width: 20px; + text-align: right; + color: var(--comment); + white-space: nowrap; + opacity: 0.6; +} + +.CodeMirror-guttermarker { + color: black; +} +.CodeMirror-guttermarker-subtle { + color: #999; +} + +/* FOLD GUTTER */ + +.CodeMirror-foldmarker { + color: #414141; + text-shadow: #ff9966 1px 1px 2px, #ff9966 -1px -1px 2px, #ff9966 1px -1px 2px, + #ff9966 -1px 1px 2px; + font-family: arial; + line-height: 0.3; + cursor: pointer; +} +.CodeMirror-foldgutter { + width: 0.7em; +} +.CodeMirror-foldgutter-open, +.CodeMirror-foldgutter-folded { + cursor: pointer; +} +.CodeMirror-foldgutter-open:after, +.CodeMirror-foldgutter-folded:after { + content: '>'; + font-size: 0.8em; + opacity: 0.8; + transition: transform 0.2s; + display: inline-block; + top: -0.1em; + position: relative; + transform: rotate(90deg); +} +.CodeMirror-foldgutter-folded:after { + transform: none; +} + +/* CURSOR */ + +.CodeMirror-cursor { + border-left: 1px solid var(--cursor); + border-right: none; + width: 0; +} +/* Shown when moving in bi-directional text */ +.CodeMirror div.CodeMirror-secondarycursor { + border-left: 1px solid silver; +} +.cm-fat-cursor .CodeMirror-cursor { + width: auto; + border: 0 !important; + background: #7e7; +} +.cm-fat-cursor div.CodeMirror-cursors { + z-index: 1; +} +.cm-fat-cursor-mark { + background-color: rgba(20, 255, 20, 0.5); + -webkit-animation: blink 1.06s steps(1) infinite; + -moz-animation: blink 1.06s steps(1) infinite; + animation: blink 1.06s steps(1) infinite; +} +.cm-animate-fat-cursor { + width: auto; + border: 0; + -webkit-animation: blink 1.06s steps(1) infinite; + -moz-animation: blink 1.06s steps(1) infinite; + animation: blink 1.06s steps(1) infinite; + background-color: #7e7; +} +@-moz-keyframes blink { + 0% { + } + 50% { + background-color: transparent; + } + 100% { + } +} +@-webkit-keyframes blink { + 0% { + } + 50% { + background-color: transparent; + } + 100% { + } +} +@keyframes blink { + 0% { + } + 50% { + background-color: transparent; + } + 100% { + } +} + +.cm-tab { + display: inline-block; + text-decoration: inherit; +} + +.CodeMirror-rulers { + position: absolute; + left: 0; + right: 0; + top: -50px; + bottom: -20px; + overflow: hidden; +} +.CodeMirror-ruler { + border-left: 1px solid #ccc; + top: 0; + bottom: 0; + position: absolute; +} + +/* DEFAULT THEME */ +.cm-s-default.CodeMirror { + background-color: transparent; +} +.cm-s-default .cm-header { + color: blue; +} +.cm-s-default .cm-quote { + color: #090; +} +.cm-negative { + color: #d44; +} +.cm-positive { + color: #292; +} +.cm-header, +.cm-strong { + font-weight: bold; +} +.cm-em { + font-style: italic; +} +.cm-link { + text-decoration: underline; +} +.cm-strikethrough { + text-decoration: line-through; +} + +.cm-s-default .cm-atom, +.cm-s-default .cm-def, +.cm-s-default .cm-variable-2, +.cm-s-default .cm-variable-3, +.cm-s-default .cm-punctuation { + color: var(--base); +} +.cm-s-default .cm-property { + color: var(--property); +} +.cm-s-default .cm-hr, +.cm-s-default .cm-comment { + color: var(--comment); +} +.cm-s-default .cm-attribute { + color: var(--attribute); +} +.cm-s-default .cm-keyword { + color: var(--keyword); +} +.cm-s-default .cm-variable { + color: var(--variable); +} +.cm-s-default .cm-tag { + color: var(--tags); +} +.cm-s-default .cm-bracket { + color: var(--brackets); +} +.cm-s-default .cm-number { + color: var(--number); +} +.cm-s-default .cm-string, +.cm-s-default .cm-string-2 { + color: var(--string); +} +.cm-s-default .cm-type { + color: #085; +} +.cm-s-default .cm-meta { + color: #555; +} +.cm-s-default .cm-qualifier { + color: var(--qualifier); +} +.cm-s-default .cm-builtin { + color: #7539ff; +} +.cm-s-default .cm-link { + color: var(--flash); +} +.cm-s-default .cm-error { + color: #ff008c; +} +.cm-invalidchar { + color: #ff008c; +} + +.CodeMirror-composing { + border-bottom: 2px solid; +} + +/* Default styles for common addons */ + +div.CodeMirror span.CodeMirror-matchingbracket { + color: #0b0; +} +div.CodeMirror span.CodeMirror-nonmatchingbracket { + color: #a22; +} +.CodeMirror-matchingtag { + background: rgba(255, 150, 0, 0.3); +} +.CodeMirror-activeline-background { + background: #e8f2ff; +} + +/* STOP */ + +/* The rest of this file contains styles related to the mechanics of + the editor. You probably shouldn't touch them. */ + +.CodeMirror { + position: relative; + overflow: hidden; + background: white; +} + +.CodeMirror-scroll { + overflow: scroll !important; /* Things will break if this is overridden */ + /* 30px is the magic margin used to hide the element's real scrollbars */ + /* See overflow: hidden in .CodeMirror */ + margin-bottom: -30px; + margin-right: -30px; + padding-bottom: 30px; + height: 100%; + outline: none; /* Prevent dragging from highlighting the element */ + position: relative; +} +.CodeMirror-sizer { + position: relative; + border-right: 30px solid transparent; +} + +/* The fake, visible scrollbars. Used to force redraw during scrolling + before actual scrolling happens, thus preventing shaking and + flickering artifacts. */ +.CodeMirror-vscrollbar, +.CodeMirror-hscrollbar, +.CodeMirror-scrollbar-filler, +.CodeMirror-gutter-filler { + position: absolute; + z-index: 6; + display: none; +} +.CodeMirror-vscrollbar { + right: 0; + top: 0; + overflow-x: hidden; + overflow-y: scroll; +} +.CodeMirror-hscrollbar { + bottom: 0; + left: 0; + overflow-y: hidden; + overflow-x: scroll; +} +.CodeMirror-scrollbar-filler { + right: 0; + bottom: 0; +} +.CodeMirror-gutter-filler { + left: 0; + bottom: 0; +} + +.CodeMirror-gutters { + position: absolute; + left: 0; + top: 0; + min-height: 100%; + z-index: 3; +} +.CodeMirror-gutter { + white-space: normal; + height: 100%; + display: inline-block; + vertical-align: top; + margin-bottom: -30px; +} +.CodeMirror-gutter-wrapper { + position: absolute; + z-index: 4; + background: none !important; + border: none !important; +} +.CodeMirror-gutter-background { + position: absolute; + top: 0; + bottom: 0; + z-index: 4; +} +.CodeMirror-gutter-elt { + position: absolute; + cursor: default; + z-index: 4; +} +.CodeMirror-gutter-wrapper ::selection { + background-color: transparent; +} +.CodeMirror-gutter-wrapper ::-moz-selection { + background-color: transparent; +} + +.CodeMirror-lines { + cursor: text; + min-height: 1px; /* prevents collapsing before first draw */ +} +.CodeMirror pre { + /* Reset some styles that the rest of the page might have set */ + -moz-border-radius: 0; + -webkit-border-radius: 0; + border-radius: 0; + border-width: 0; + background: transparent; + font-family: inherit; + font-size: inherit; + margin: 0; + white-space: pre; + word-wrap: normal; + line-height: inherit; + color: inherit; + z-index: 2; + position: relative; + overflow: visible; + -webkit-tap-highlight-color: transparent; + -webkit-font-variant-ligatures: contextual; + font-variant-ligatures: contextual; +} +.CodeMirror-wrap pre { + word-wrap: break-word; + white-space: pre-wrap; + word-break: normal; +} + +.CodeMirror-linebackground { + position: absolute; + left: 0; + right: 0; + top: 0; + bottom: 0; + z-index: 0; +} + +.CodeMirror-linewidget { + position: relative; + z-index: 2; + padding: 0.1px; /* Force widget margins to stay inside of the container */ +} + +.CodeMirror-rtl pre { + direction: rtl; +} + +.CodeMirror-code { + outline: none; +} + +/* Force content-box sizing for the elements where we expect it */ +.CodeMirror-scroll, +.CodeMirror-sizer, +.CodeMirror-gutter, +.CodeMirror-gutters, +.CodeMirror-linenumber { + -moz-box-sizing: content-box; + box-sizing: content-box; +} + +.CodeMirror-measure { + position: absolute; + width: 100%; + height: 0; + overflow: hidden; + visibility: hidden; +} + +.CodeMirror-cursor { + position: absolute; + pointer-events: none; +} +.CodeMirror-measure pre { + position: static; +} + +div.CodeMirror-cursors { + visibility: hidden; + position: relative; + z-index: 3; +} +div.CodeMirror-dragcursors { + visibility: visible; +} + +.CodeMirror-focused div.CodeMirror-cursors { + visibility: visible; +} + +.CodeMirror-selected { + background: var(--selected-bg-non-focus); +} +.CodeMirror-focused .CodeMirror-selected { + background: var(--selected-bg); +} +.CodeMirror-crosshair { + cursor: crosshair; +} +.CodeMirror-line::selection, +.CodeMirror-line > span::selection, +.CodeMirror-line > span > span::selection { + background: var(--selected-bg); +} +.CodeMirror-line::-moz-selection, +.CodeMirror-line > span::-moz-selection, +.CodeMirror-line > span > span::-moz-selection { + background: var(--selected-bg); +} + +.cm-searching { + background-color: #ffa; + background-color: rgba(255, 255, 0, 0.4); +} + +/* Used to force a border model for a node */ +.cm-force-border { + padding-right: 0.1px; +} + +@media print { + /* Hide the cursor when printing */ + .CodeMirror div.CodeMirror-cursors { + visibility: hidden; + } +} + +/* See issue #2901 */ +.cm-tab-wrap-hack:after { + content: ''; +} + +/* Help users use markselection to safely style text background */ +span.CodeMirror-selectedtext { + background: none; +} +/* Based on https://github.com/dempfi/ayu */ + +.cm-s-ayu-mirage.CodeMirror { background: #1f2430; color: #cbccc6; } +.cm-s-ayu-mirage div.CodeMirror-selected { background: #34455a; } +.cm-s-ayu-mirage .CodeMirror-line::selection, .cm-s-ayu-mirage .CodeMirror-line > span::selection, .cm-s-ayu-mirage .CodeMirror-line > span > span::selection { background: #34455a; } +.cm-s-ayu-mirage .CodeMirror-line::-moz-selection, .cm-s-ayu-mirage .CodeMirror-line > span::-moz-selection, .cm-s-ayu-mirage .CodeMirror-line > span > span::-moz-selection { background: rgba(25, 30, 42, 99); } +.cm-s-ayu-mirage .CodeMirror-gutters { background: #1f2430; border-right: 0px; } +.cm-s-ayu-mirage .CodeMirror-guttermarker { color: white; } +.cm-s-ayu-mirage .CodeMirror-guttermarker-subtle { color: rgba(112, 122, 140, 66); } +.cm-s-ayu-mirage .CodeMirror-linenumber { color: rgba(61, 66, 77, 99); } +.cm-s-ayu-mirage .CodeMirror-cursor { border-left: 1px solid #ffcc66; } +.cm-s-ayu-mirage.cm-fat-cursor .CodeMirror-cursor {background-color: #a2a8a175 !important;} +.cm-s-ayu-mirage .cm-animate-fat-cursor { background-color: #a2a8a175 !important; } + +.cm-s-ayu-mirage span.cm-comment { color: #5c6773; font-style:italic; } +.cm-s-ayu-mirage span.cm-atom { color: #ae81ff; } +.cm-s-ayu-mirage span.cm-number { color: #ffcc66; } + +.cm-s-ayu-mirage span.cm-comment.cm-attribute { color: #ffd580; } +.cm-s-ayu-mirage span.cm-comment.cm-def { color: #d4bfff; } +.cm-s-ayu-mirage span.cm-comment.cm-tag { color: #5ccfe6; } +.cm-s-ayu-mirage span.cm-comment.cm-type { color: #5998a6; } + +.cm-s-ayu-mirage span.cm-property { color: #f29e74; } +.cm-s-ayu-mirage span.cm-attribute { color: #ffd580; } +.cm-s-ayu-mirage span.cm-keyword { color: #ffa759; } +.cm-s-ayu-mirage span.cm-builtin { color: #ffcc66; } +.cm-s-ayu-mirage span.cm-string { color: #bae67e; } + +.cm-s-ayu-mirage span.cm-variable { color: #cbccc6; } +.cm-s-ayu-mirage span.cm-variable-2 { color: #f28779; } +.cm-s-ayu-mirage span.cm-variable-3 { color: #5ccfe6; } +.cm-s-ayu-mirage span.cm-type { color: #ffa759; } +.cm-s-ayu-mirage span.cm-def { color: #ffd580; } +.cm-s-ayu-mirage span.cm-bracket { color: rgba(92, 207, 230, 80); } +.cm-s-ayu-mirage span.cm-tag { color: #5ccfe6; } +.cm-s-ayu-mirage span.cm-header { color: #bae67e; } +.cm-s-ayu-mirage span.cm-link { color: #5ccfe6; } +.cm-s-ayu-mirage span.cm-error { color: #ff3333; } + +.cm-s-ayu-mirage .CodeMirror-activeline-background { background: #191e2a; } +.cm-s-ayu-mirage .CodeMirror-matchingbracket { + text-decoration: underline; + color: white !important; +} + +.editor { + position: relative; + height: 100%; + width: 100%; + overflow: hidden; +} +.CodeMirror { + font-family: var(--font-code); + line-height: 1.5; + height: 100%; +} + +.msg[data-v-92411507] { + position: absolute; + bottom: 0; + left: 8px; + right: 8px; + z-index: 10; + border: 2px solid transparent; + border-radius: 6px; + font-family: var(--font-code); + white-space: pre-wrap; + margin-bottom: 8px; + max-height: calc(100% - 300px); + min-height: 40px; + display: flex; + align-items: stretch; +} +pre[data-v-92411507] { + margin: 0; + padding: 12px 20px; + overflow: auto; +} +.dismiss[data-v-92411507] { + position: absolute; + top: 2px; + right: 2px; + width: 18px; + height: 18px; + line-height: 18px; + border-radius: 9px; + text-align: center; + display: block; + font-size: 9px; + padding: 0; + background-color: red; + color: #fff; +} +@media (max-width: 720px) { +.dismiss[data-v-92411507] { + top: -9px; + right: -9px; +} +.msg[data-v-92411507] { + bottom: 50px; +} +} +.msg.err[data-v-92411507] { + color: red; + border-color: red; + background-color: #ffd7d7; +} +.msg.warn[data-v-92411507] { + --color: rgb(105, 95, 27); + color: var(--color); + border-color: var(--color); + background-color: rgb(247, 240, 205); +} +.msg.warn .dismiss[data-v-92411507] { + background-color: var(--color); +} +.fade-enter-active[data-v-92411507], +.fade-leave-active[data-v-92411507] { + transition: all 0.15s ease-out; +} +.fade-enter-from[data-v-92411507], +.fade-leave-to[data-v-92411507] { + opacity: 0; + transform: translate(0, 10px); +} + +.editor-container[data-v-7f689af8] { + height: calc(100% - var(--header-height)); + overflow: hidden; + position: relative; +} + +.compiled-data-container[data-v-66d17936], +.compiled-data-container[data-v-66d17936] iframe { + width: 100%; + height: 100%; + border: none; +} + +.output-container[data-v-aafb6cb4] { + height: calc(100% - var(--header-height)); + overflow: hidden; + position: relative; +} +.tab-buttons[data-v-aafb6cb4] { + box-sizing: border-box; + border-bottom: 1px solid var(--border); + background-color: var(--bg); + height: var(--header-height); + overflow: hidden; +} +.tab-buttons button[data-v-aafb6cb4] { + padding: 0; + box-sizing: border-box; +} +.tab-buttons span[data-v-aafb6cb4] { + font-size: 13px; + font-family: var(--font-code); + text-transform: uppercase; + color: var(--text-light); + display: inline-block; + padding: 8px 16px 6px; + line-height: 20px; +} +button.active[data-v-aafb6cb4] { + color: var(--color-branding-dark); + border-bottom: 3px solid var(--color-branding-dark); +} + +.vue-repl[data-v-760f3496] { + --bg: #fff; + --bg-soft: #f8f8f8; + --border: #ddd; + --text-light: #888; + --font-code: Menlo, Monaco, Consolas, 'Courier New', monospace; + --color-branding: #42b883; + --color-branding-dark: #416f9c; + --header-height: 38px; + + font-size: 13px; + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, + Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; + margin: 0; + overflow: hidden; + background-color: var(--bg-soft); +} +.dark .vue-repl[data-v-760f3496] { + --bg: #1a1a1a; + --bg-soft: #242424; + --border: #383838; + --text-light: #aaa; + --color-branding: #42d392; + --color-branding-dark: #89ddff; +} +[data-v-760f3496] button { + border: none; + outline: none; + cursor: pointer; + margin: 0; + background-color: transparent; +} diff --git a/apps/docs/src/tutorial/Repl/old/vue-repl.js b/apps/docs/src/tutorial/Repl/old/vue-repl.js new file mode 100644 index 0000000..29b7538 --- /dev/null +++ b/apps/docs/src/tutorial/Repl/old/vue-repl.js @@ -0,0 +1,36971 @@ +import { defineComponent, computed, ref, inject, reactive, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, normalizeStyle, renderSlot, withModifiers, toDisplayString, Fragment, renderList, createCommentVNode, withDirectives, withKeys, vModelText, pushScopeId, popScopeId, onMounted, watchEffect, watch, createBlock, Transition, withCtx, createVNode, version, provide, toRef } from 'vue'; +import * as defaultCompiler from 'vue/compiler-sfc'; +import { shouldTransformRef, transformRef } from 'vue/compiler-sfc'; + +const _hoisted_1$5 = ["onMousedown"]; +const _sfc_main$7 = /* @__PURE__ */ defineComponent({ + __name: "SplitPane", + props: { + layout: null + }, + setup(__props) { + const props = __props; + const isVertical = computed(() => props.layout === "vertical"); + const container = ref(); + const store = inject("store"); + const showOutput = ref(store.initialShowOutput); + const state = reactive({ + dragging: false, + split: 50 + }); + const boundSplit = computed(() => { + const { split } = state; + return split < 20 ? 20 : split > 80 ? 80 : split; + }); + let startPosition = 0; + let startSplit = 0; + function dragStart(e) { + state.dragging = true; + startPosition = isVertical.value ? e.pageY : e.pageX; + startSplit = boundSplit.value; + } + function dragMove(e) { + if (state.dragging) { + const position = isVertical.value ? e.pageY : e.pageX; + const totalSize = isVertical.value ? container.value.offsetHeight : container.value.offsetWidth; + const dp = position - startPosition; + state.split = startSplit + ~~(dp / totalSize * 100); + } + } + function dragEnd() { + state.dragging = false; + } + return (_ctx, _cache) => { + return openBlock(), createElementBlock("div", { + ref_key: "container", + ref: container, + class: normalizeClass(["split-pane", { + dragging: state.dragging, + "show-output": showOutput.value, + vertical: unref(isVertical) + }]), + onMousemove: dragMove, + onMouseup: dragEnd, + onMouseleave: dragEnd + }, [ + createElementVNode("div", { + class: "left", + style: normalizeStyle({ [unref(isVertical) ? "height" : "width"]: unref(boundSplit) + "%" }) + }, [ + renderSlot(_ctx.$slots, "left", {}, void 0, true), + createElementVNode("div", { + class: "dragger", + onMousedown: withModifiers(dragStart, ["prevent"]) + }, null, 40, _hoisted_1$5) + ], 4), + createElementVNode("div", { + class: "right", + style: normalizeStyle({ [unref(isVertical) ? "height" : "width"]: 100 - unref(boundSplit) + "%" }) + }, [ + renderSlot(_ctx.$slots, "right", {}, void 0, true) + ], 4), + createElementVNode("button", { + class: "toggler", + onClick: _cache[0] || (_cache[0] = ($event) => showOutput.value = !showOutput.value) + }, toDisplayString(showOutput.value ? "< Code" : "Output >"), 1) + ], 34); + }; + } +}); + +const SplitPane_vue_vue_type_style_index_0_scoped_3102671e_lang = ''; + +const _export_sfc = (sfc, props) => { + const target = sfc.__vccOpts || sfc; + for (const [key, val] of props) { + target[key] = val; + } + return target; +}; + +const SplitPane = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-3102671e"]]); + +const _withScopeId$1 = (n) => (pushScopeId("data-v-21b6e53a"), n = n(), popScopeId(), n); +const _hoisted_1$4 = ["onClick"]; +const _hoisted_2$1 = { class: "label" }; +const _hoisted_3$1 = ["onClick"]; +const _hoisted_4$1 = /* @__PURE__ */ _withScopeId$1(() => /* @__PURE__ */ createElementVNode("svg", { + class: "icon", + width: "12", + height: "12", + viewBox: "0 0 24 24" +}, [ + /* @__PURE__ */ createElementVNode("line", { + stroke: "#999", + x1: "18", + y1: "6", + x2: "6", + y2: "18" + }), + /* @__PURE__ */ createElementVNode("line", { + stroke: "#999", + x1: "6", + y1: "6", + x2: "18", + y2: "18" + }) +], -1)); +const _hoisted_5$1 = [ + _hoisted_4$1 +]; +const _hoisted_6 = { + key: 0, + class: "file pending" +}; +const _hoisted_7 = ["onKeyup"]; +const _sfc_main$6 = /* @__PURE__ */ defineComponent({ + __name: "FileSelector", + setup(__props) { + const store = inject("store"); + const pending = ref(false); + const pendingFilename = ref("File.php"); + const importMapFile = "import-map.json"; + const files = computed(() => Object.entries(store.state.files).filter(([name, file]) => name !== importMapFile && !file.hidden).map(([name]) => name)); + function startAddFile() { + let i = 0; + let name = `File.php`; + while (true) { + let hasConflict = false; + for (const file in store.state.files) { + if (file === name) { + hasConflict = true; + name = `File${++i}.php`; + break; + } + } + if (!hasConflict) { + break; + } + } + pendingFilename.value = name; + pending.value = true; + } + function cancelAddFile() { + pending.value = false; + } + function focus({ el }) { + el.focus(); + } + function doneAddFile() { + if (!pending.value) + return; + const filename = pendingFilename.value; + if (!/\.(php|phtml|html|vue|tsx|jsx|js|ts|css|json)$/.test(filename)) { + store.state.errors = [ + `Playground only supports *.php, *.phtml, *html, *.json, *.js, *.ts, *.jsx, *.tsx, *.vue, *.css files.` + ]; + return; + } + if (filename in store.state.files) { + store.state.errors = [`File "${filename}" already exists.`]; + return; + } + store.state.errors = []; + cancelAddFile(); + store.addFile(filename); + } + const fileSel = ref(null); + function horizontalScroll(e) { + e.preventDefault(); + const el = fileSel.value; + const direction = Math.abs(e.deltaX) >= Math.abs(e.deltaY) ? e.deltaX : e.deltaY; + const distance = 30 * (direction > 0 ? 1 : -1); + el.scrollTo({ + left: el.scrollLeft + distance + }); + } + return (_ctx, _cache) => { + return openBlock(), createElementBlock("div", { + class: "file-selector", + onWheel: horizontalScroll, + ref_key: "fileSel", + ref: fileSel + }, [ + (openBlock(true), createElementBlock(Fragment, null, renderList(unref(files), (file, i) => { + return openBlock(), createElementBlock("div", { + class: normalizeClass(["file", { active: unref(store).state.activeFile.filename === file }]), + onClick: ($event) => unref(store).setActive(file) + }, [ + createElementVNode("span", _hoisted_2$1, toDisplayString(file === importMapFile ? "Import Map" : file), 1), + i > 0 ? (openBlock(), createElementBlock("span", { + key: 0, + class: "remove", + onClick: withModifiers(($event) => unref(store).deleteFile(file), ["stop"]) + }, _hoisted_5$1, 8, _hoisted_3$1)) : createCommentVNode("", true) + ], 10, _hoisted_1$4); + }), 256)), + pending.value ? (openBlock(), createElementBlock("div", _hoisted_6, [ + withDirectives(createElementVNode("input", { + "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => pendingFilename.value = $event), + spellcheck: "false", + onBlur: doneAddFile, + onKeyup: [ + withKeys(doneAddFile, ["enter"]), + withKeys(cancelAddFile, ["esc"]) + ], + onVnodeMounted: focus + }, null, 40, _hoisted_7), [ + [vModelText, pendingFilename.value] + ]) + ])) : createCommentVNode("", true), + createElementVNode("button", { + class: "add", + onClick: startAddFile + }, "+") + ], 544); + }; + } +}); + +const FileSelector_vue_vue_type_style_index_0_scoped_21b6e53a_lang = ''; + +const FileSelector = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-21b6e53a"]]); + +var __create = Object.create; +var __defProp = Object.defineProperty; +var __getOwnPropDesc = Object.getOwnPropertyDescriptor; +var __getOwnPropNames = Object.getOwnPropertyNames; +var __getProtoOf = Object.getPrototypeOf; +var __hasOwnProp = Object.prototype.hasOwnProperty; +var __commonJS = (cb, mod) => function __require() { + return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports; +}; +var __copyProps = (to, from, except, desc) => { + if (from && typeof from === "object" || typeof from === "function") { + for (let key of __getOwnPropNames(from)) + if (!__hasOwnProp.call(to, key) && key !== except) + __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable }); + } + return to; +}; +var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod)); + +var u8 = Uint8Array; +var u16 = Uint16Array; +var u32 = Uint32Array; +var fleb = new u8([0, 0, 0, 0, 0, 0, 0, 0, 1, 1, 1, 1, 2, 2, 2, 2, 3, 3, 3, 3, 4, 4, 4, 4, 5, 5, 5, 5, 0, 0, 0, 0]); +var fdeb = new u8([0, 0, 0, 0, 1, 1, 2, 2, 3, 3, 4, 4, 5, 5, 6, 6, 7, 7, 8, 8, 9, 9, 10, 10, 11, 11, 12, 12, 13, 13, 0, 0]); +var clim = new u8([16, 17, 18, 0, 8, 7, 9, 6, 10, 5, 11, 4, 12, 3, 13, 2, 14, 1, 15]); +var freb = function(eb, start) { + var b = new u16(31); + for (var i = 0; i < 31; ++i) { + b[i] = start += 1 << eb[i - 1]; + } + var r = new u32(b[30]); + for (var i = 1; i < 30; ++i) { + for (var j = b[i]; j < b[i + 1]; ++j) { + r[j] = j - b[i] << 5 | i; + } + } + return [b, r]; +}; +var _a = freb(fleb, 2); +var fl = _a[0]; +var revfl = _a[1]; +fl[28] = 258, revfl[258] = 28; +var _b = freb(fdeb, 0); +var fd = _b[0]; +var revfd = _b[1]; +var rev = new u16(32768); +for (i = 0; i < 32768; ++i) { + x = (i & 43690) >>> 1 | (i & 21845) << 1; + x = (x & 52428) >>> 2 | (x & 13107) << 2; + x = (x & 61680) >>> 4 | (x & 3855) << 4; + rev[i] = ((x & 65280) >>> 8 | (x & 255) << 8) >>> 1; +} +var x; +var i; +var hMap = function(cd, mb, r) { + var s = cd.length; + var i = 0; + var l = new u16(mb); + for (; i < s; ++i) { + if (cd[i]) + ++l[cd[i] - 1]; + } + var le = new u16(mb); + for (i = 0; i < mb; ++i) { + le[i] = le[i - 1] + l[i - 1] << 1; + } + var co; + if (r) { + co = new u16(1 << mb); + var rvb = 15 - mb; + for (i = 0; i < s; ++i) { + if (cd[i]) { + var sv = i << 4 | cd[i]; + var r_1 = mb - cd[i]; + var v = le[cd[i] - 1]++ << r_1; + for (var m = v | (1 << r_1) - 1; v <= m; ++v) { + co[rev[v] >>> rvb] = sv; + } + } + } + } else { + co = new u16(s); + for (i = 0; i < s; ++i) { + if (cd[i]) { + co[i] = rev[le[cd[i] - 1]++] >>> 15 - cd[i]; + } + } + } + return co; +}; +var flt = new u8(288); +for (i = 0; i < 144; ++i) + flt[i] = 8; +var i; +for (i = 144; i < 256; ++i) + flt[i] = 9; +var i; +for (i = 256; i < 280; ++i) + flt[i] = 7; +var i; +for (i = 280; i < 288; ++i) + flt[i] = 8; +var i; +var fdt = new u8(32); +for (i = 0; i < 32; ++i) + fdt[i] = 5; +var i; +var flm = /* @__PURE__ */ hMap(flt, 9, 0); +var flrm = /* @__PURE__ */ hMap(flt, 9, 1); +var fdm = /* @__PURE__ */ hMap(fdt, 5, 0); +var fdrm = /* @__PURE__ */ hMap(fdt, 5, 1); +var max = function(a) { + var m = a[0]; + for (var i = 1; i < a.length; ++i) { + if (a[i] > m) + m = a[i]; + } + return m; +}; +var bits = function(d, p, m) { + var o = p / 8 | 0; + return (d[o] | d[o + 1] << 8) >> (p & 7) & m; +}; +var bits16 = function(d, p) { + var o = p / 8 | 0; + return (d[o] | d[o + 1] << 8 | d[o + 2] << 16) >> (p & 7); +}; +var shft = function(p) { + return (p + 7) / 8 | 0; +}; +var slc = function(v, s, e) { + if (s == null || s < 0) + s = 0; + if (e == null || e > v.length) + e = v.length; + var n = new (v.BYTES_PER_ELEMENT == 2 ? u16 : v.BYTES_PER_ELEMENT == 4 ? u32 : u8)(e - s); + n.set(v.subarray(s, e)); + return n; +}; +var ec = [ + "unexpected EOF", + "invalid block type", + "invalid length/literal", + "invalid distance", + "stream finished", + "no stream handler", + , + "no callback", + "invalid UTF-8 data", + "extra field too long", + "date not in range 1980-2099", + "filename too long", + "stream finishing", + "invalid zip data" +]; +var err = function(ind, msg, nt) { + var e = new Error(msg || ec[ind]); + e.code = ind; + if (Error.captureStackTrace) + Error.captureStackTrace(e, err); + if (!nt) + throw e; + return e; +}; +var inflt = function(dat, buf, st) { + var sl = dat.length; + if (!sl || st && st.f && !st.l) + return buf || new u8(0); + var noBuf = !buf || st; + var noSt = !st || st.i; + if (!st) + st = {}; + if (!buf) + buf = new u8(sl * 3); + var cbuf = function(l2) { + var bl = buf.length; + if (l2 > bl) { + var nbuf = new u8(Math.max(bl * 2, l2)); + nbuf.set(buf); + buf = nbuf; + } + }; + var final = st.f || 0, pos = st.p || 0, bt = st.b || 0, lm = st.l, dm = st.d, lbt = st.m, dbt = st.n; + var tbts = sl * 8; + do { + if (!lm) { + final = bits(dat, pos, 1); + var type = bits(dat, pos + 1, 3); + pos += 3; + if (!type) { + var s = shft(pos) + 4, l = dat[s - 4] | dat[s - 3] << 8, t = s + l; + if (t > sl) { + if (noSt) + err(0); + break; + } + if (noBuf) + cbuf(bt + l); + buf.set(dat.subarray(s, t), bt); + st.b = bt += l, st.p = pos = t * 8, st.f = final; + continue; + } else if (type == 1) + lm = flrm, dm = fdrm, lbt = 9, dbt = 5; + else if (type == 2) { + var hLit = bits(dat, pos, 31) + 257, hcLen = bits(dat, pos + 10, 15) + 4; + var tl = hLit + bits(dat, pos + 5, 31) + 1; + pos += 14; + var ldt = new u8(tl); + var clt = new u8(19); + for (var i = 0; i < hcLen; ++i) { + clt[clim[i]] = bits(dat, pos + i * 3, 7); + } + pos += hcLen * 3; + var clb = max(clt), clbmsk = (1 << clb) - 1; + var clm = hMap(clt, clb, 1); + for (var i = 0; i < tl; ) { + var r = clm[bits(dat, pos, clbmsk)]; + pos += r & 15; + var s = r >>> 4; + if (s < 16) { + ldt[i++] = s; + } else { + var c = 0, n = 0; + if (s == 16) + n = 3 + bits(dat, pos, 3), pos += 2, c = ldt[i - 1]; + else if (s == 17) + n = 3 + bits(dat, pos, 7), pos += 3; + else if (s == 18) + n = 11 + bits(dat, pos, 127), pos += 7; + while (n--) + ldt[i++] = c; + } + } + var lt = ldt.subarray(0, hLit), dt = ldt.subarray(hLit); + lbt = max(lt); + dbt = max(dt); + lm = hMap(lt, lbt, 1); + dm = hMap(dt, dbt, 1); + } else + err(1); + if (pos > tbts) { + if (noSt) + err(0); + break; + } + } + if (noBuf) + cbuf(bt + 131072); + var lms = (1 << lbt) - 1, dms = (1 << dbt) - 1; + var lpos = pos; + for (; ; lpos = pos) { + var c = lm[bits16(dat, pos) & lms], sym = c >>> 4; + pos += c & 15; + if (pos > tbts) { + if (noSt) + err(0); + break; + } + if (!c) + err(2); + if (sym < 256) + buf[bt++] = sym; + else if (sym == 256) { + lpos = pos, lm = null; + break; + } else { + var add = sym - 254; + if (sym > 264) { + var i = sym - 257, b = fleb[i]; + add = bits(dat, pos, (1 << b) - 1) + fl[i]; + pos += b; + } + var d = dm[bits16(dat, pos) & dms], dsym = d >>> 4; + if (!d) + err(3); + pos += d & 15; + var dt = fd[dsym]; + if (dsym > 3) { + var b = fdeb[dsym]; + dt += bits16(dat, pos) & (1 << b) - 1, pos += b; + } + if (pos > tbts) { + if (noSt) + err(0); + break; + } + if (noBuf) + cbuf(bt + 131072); + var end = bt + add; + for (; bt < end; bt += 4) { + buf[bt] = buf[bt - dt]; + buf[bt + 1] = buf[bt + 1 - dt]; + buf[bt + 2] = buf[bt + 2 - dt]; + buf[bt + 3] = buf[bt + 3 - dt]; + } + bt = end; + } + } + st.l = lm, st.p = lpos, st.b = bt, st.f = final; + if (lm) + final = 1, st.m = lbt, st.d = dm, st.n = dbt; + } while (!final); + return bt == buf.length ? buf : slc(buf, 0, bt); +}; +var wbits = function(d, p, v) { + v <<= p & 7; + var o = p / 8 | 0; + d[o] |= v; + d[o + 1] |= v >>> 8; +}; +var wbits16 = function(d, p, v) { + v <<= p & 7; + var o = p / 8 | 0; + d[o] |= v; + d[o + 1] |= v >>> 8; + d[o + 2] |= v >>> 16; +}; +var hTree = function(d, mb) { + var t = []; + for (var i = 0; i < d.length; ++i) { + if (d[i]) + t.push({ s: i, f: d[i] }); + } + var s = t.length; + var t2 = t.slice(); + if (!s) + return [et, 0]; + if (s == 1) { + var v = new u8(t[0].s + 1); + v[t[0].s] = 1; + return [v, 1]; + } + t.sort(function(a, b) { + return a.f - b.f; + }); + t.push({ s: -1, f: 25001 }); + var l = t[0], r = t[1], i0 = 0, i1 = 1, i2 = 2; + t[0] = { s: -1, f: l.f + r.f, l, r }; + while (i1 != s - 1) { + l = t[t[i0].f < t[i2].f ? i0++ : i2++]; + r = t[i0 != i1 && t[i0].f < t[i2].f ? i0++ : i2++]; + t[i1++] = { s: -1, f: l.f + r.f, l, r }; + } + var maxSym = t2[0].s; + for (var i = 1; i < s; ++i) { + if (t2[i].s > maxSym) + maxSym = t2[i].s; + } + var tr = new u16(maxSym + 1); + var mbt = ln(t[i1 - 1], tr, 0); + if (mbt > mb) { + var i = 0, dt = 0; + var lft = mbt - mb, cst = 1 << lft; + t2.sort(function(a, b) { + return tr[b.s] - tr[a.s] || a.f - b.f; + }); + for (; i < s; ++i) { + var i2_1 = t2[i].s; + if (tr[i2_1] > mb) { + dt += cst - (1 << mbt - tr[i2_1]); + tr[i2_1] = mb; + } else + break; + } + dt >>>= lft; + while (dt > 0) { + var i2_2 = t2[i].s; + if (tr[i2_2] < mb) + dt -= 1 << mb - tr[i2_2]++ - 1; + else + ++i; + } + for (; i >= 0 && dt; --i) { + var i2_3 = t2[i].s; + if (tr[i2_3] == mb) { + --tr[i2_3]; + ++dt; + } + } + mbt = mb; + } + return [new u8(tr), mbt]; +}; +var ln = function(n, l, d) { + return n.s == -1 ? Math.max(ln(n.l, l, d + 1), ln(n.r, l, d + 1)) : l[n.s] = d; +}; +var lc = function(c) { + var s = c.length; + while (s && !c[--s]) + ; + var cl = new u16(++s); + var cli = 0, cln = c[0], cls = 1; + var w = function(v) { + cl[cli++] = v; + }; + for (var i = 1; i <= s; ++i) { + if (c[i] == cln && i != s) + ++cls; + else { + if (!cln && cls > 2) { + for (; cls > 138; cls -= 138) + w(32754); + if (cls > 2) { + w(cls > 10 ? cls - 11 << 5 | 28690 : cls - 3 << 5 | 12305); + cls = 0; + } + } else if (cls > 3) { + w(cln), --cls; + for (; cls > 6; cls -= 6) + w(8304); + if (cls > 2) + w(cls - 3 << 5 | 8208), cls = 0; + } + while (cls--) + w(cln); + cls = 1; + cln = c[i]; + } + } + return [cl.subarray(0, cli), s]; +}; +var clen = function(cf, cl) { + var l = 0; + for (var i = 0; i < cl.length; ++i) + l += cf[i] * cl[i]; + return l; +}; +var wfblk = function(out, pos, dat) { + var s = dat.length; + var o = shft(pos + 2); + out[o] = s & 255; + out[o + 1] = s >>> 8; + out[o + 2] = out[o] ^ 255; + out[o + 3] = out[o + 1] ^ 255; + for (var i = 0; i < s; ++i) + out[o + i + 4] = dat[i]; + return (o + 4 + s) * 8; +}; +var wblk = function(dat, out, final, syms, lf, df, eb, li, bs, bl, p) { + wbits(out, p++, final); + ++lf[256]; + var _a2 = hTree(lf, 15), dlt = _a2[0], mlb = _a2[1]; + var _b2 = hTree(df, 15), ddt = _b2[0], mdb = _b2[1]; + var _c = lc(dlt), lclt = _c[0], nlc = _c[1]; + var _d = lc(ddt), lcdt = _d[0], ndc = _d[1]; + var lcfreq = new u16(19); + for (var i = 0; i < lclt.length; ++i) + lcfreq[lclt[i] & 31]++; + for (var i = 0; i < lcdt.length; ++i) + lcfreq[lcdt[i] & 31]++; + var _e = hTree(lcfreq, 7), lct = _e[0], mlcb = _e[1]; + var nlcc = 19; + for (; nlcc > 4 && !lct[clim[nlcc - 1]]; --nlcc) + ; + var flen = bl + 5 << 3; + var ftlen = clen(lf, flt) + clen(df, fdt) + eb; + var dtlen = clen(lf, dlt) + clen(df, ddt) + eb + 14 + 3 * nlcc + clen(lcfreq, lct) + (2 * lcfreq[16] + 3 * lcfreq[17] + 7 * lcfreq[18]); + if (flen <= ftlen && flen <= dtlen) + return wfblk(out, p, dat.subarray(bs, bs + bl)); + var lm, ll, dm, dl; + wbits(out, p, 1 + (dtlen < ftlen)), p += 2; + if (dtlen < ftlen) { + lm = hMap(dlt, mlb, 0), ll = dlt, dm = hMap(ddt, mdb, 0), dl = ddt; + var llm = hMap(lct, mlcb, 0); + wbits(out, p, nlc - 257); + wbits(out, p + 5, ndc - 1); + wbits(out, p + 10, nlcc - 4); + p += 14; + for (var i = 0; i < nlcc; ++i) + wbits(out, p + 3 * i, lct[clim[i]]); + p += 3 * nlcc; + var lcts = [lclt, lcdt]; + for (var it = 0; it < 2; ++it) { + var clct = lcts[it]; + for (var i = 0; i < clct.length; ++i) { + var len = clct[i] & 31; + wbits(out, p, llm[len]), p += lct[len]; + if (len > 15) + wbits(out, p, clct[i] >>> 5 & 127), p += clct[i] >>> 12; + } + } + } else { + lm = flm, ll = flt, dm = fdm, dl = fdt; + } + for (var i = 0; i < li; ++i) { + if (syms[i] > 255) { + var len = syms[i] >>> 18 & 31; + wbits16(out, p, lm[len + 257]), p += ll[len + 257]; + if (len > 7) + wbits(out, p, syms[i] >>> 23 & 31), p += fleb[len]; + var dst = syms[i] & 31; + wbits16(out, p, dm[dst]), p += dl[dst]; + if (dst > 3) + wbits16(out, p, syms[i] >>> 5 & 8191), p += fdeb[dst]; + } else { + wbits16(out, p, lm[syms[i]]), p += ll[syms[i]]; + } + } + wbits16(out, p, lm[256]); + return p + ll[256]; +}; +var deo = /* @__PURE__ */ new u32([65540, 131080, 131088, 131104, 262176, 1048704, 1048832, 2114560, 2117632]); +var et = /* @__PURE__ */ new u8(0); +var dflt = function(dat, lvl, plvl, pre, post, lst) { + var s = dat.length; + var o = new u8(pre + s + 5 * (1 + Math.ceil(s / 7e3)) + post); + var w = o.subarray(pre, o.length - post); + var pos = 0; + if (!lvl || s < 8) { + for (var i = 0; i <= s; i += 65535) { + var e = i + 65535; + if (e >= s) { + w[pos >> 3] = lst; + } + pos = wfblk(w, pos + 1, dat.subarray(i, e)); + } + } else { + var opt = deo[lvl - 1]; + var n = opt >>> 13, c = opt & 8191; + var msk_1 = (1 << plvl) - 1; + var prev = new u16(32768), head = new u16(msk_1 + 1); + var bs1_1 = Math.ceil(plvl / 3), bs2_1 = 2 * bs1_1; + var hsh = function(i2) { + return (dat[i2] ^ dat[i2 + 1] << bs1_1 ^ dat[i2 + 2] << bs2_1) & msk_1; + }; + var syms = new u32(25e3); + var lf = new u16(288), df = new u16(32); + var lc_1 = 0, eb = 0, i = 0, li = 0, wi = 0, bs = 0; + for (; i < s; ++i) { + var hv = hsh(i); + var imod = i & 32767, pimod = head[hv]; + prev[imod] = pimod; + head[hv] = imod; + if (wi <= i) { + var rem = s - i; + if ((lc_1 > 7e3 || li > 24576) && rem > 423) { + pos = wblk(dat, w, 0, syms, lf, df, eb, li, bs, i - bs, pos); + li = lc_1 = eb = 0, bs = i; + for (var j = 0; j < 286; ++j) + lf[j] = 0; + for (var j = 0; j < 30; ++j) + df[j] = 0; + } + var l = 2, d = 0, ch_1 = c, dif = imod - pimod & 32767; + if (rem > 2 && hv == hsh(i - dif)) { + var maxn = Math.min(n, rem) - 1; + var maxd = Math.min(32767, i); + var ml = Math.min(258, rem); + while (dif <= maxd && --ch_1 && imod != pimod) { + if (dat[i + l] == dat[i + l - dif]) { + var nl = 0; + for (; nl < ml && dat[i + nl] == dat[i + nl - dif]; ++nl) + ; + if (nl > l) { + l = nl, d = dif; + if (nl > maxn) + break; + var mmd = Math.min(dif, nl - 2); + var md = 0; + for (var j = 0; j < mmd; ++j) { + var ti = i - dif + j + 32768 & 32767; + var pti = prev[ti]; + var cd = ti - pti + 32768 & 32767; + if (cd > md) + md = cd, pimod = ti; + } + } + } + imod = pimod, pimod = prev[imod]; + dif += imod - pimod + 32768 & 32767; + } + } + if (d) { + syms[li++] = 268435456 | revfl[l] << 18 | revfd[d]; + var lin = revfl[l] & 31, din = revfd[d] & 31; + eb += fleb[lin] + fdeb[din]; + ++lf[257 + lin]; + ++df[din]; + wi = i + l; + ++lc_1; + } else { + syms[li++] = dat[i]; + ++lf[dat[i]]; + } + } + } + pos = wblk(dat, w, lst, syms, lf, df, eb, li, bs, i - bs, pos); + if (!lst && pos & 7) + pos = wfblk(w, pos + 1, et); + } + return slc(o, 0, pre + shft(pos) + post); +}; +var adler = function() { + var a = 1, b = 0; + return { + p: function(d) { + var n = a, m = b; + var l = d.length | 0; + for (var i = 0; i != l; ) { + var e = Math.min(i + 2655, l); + for (; i < e; ++i) + m += n += d[i]; + n = (n & 65535) + 15 * (n >> 16), m = (m & 65535) + 15 * (m >> 16); + } + a = n, b = m; + }, + d: function() { + a %= 65521, b %= 65521; + return (a & 255) << 24 | a >>> 8 << 16 | (b & 255) << 8 | b >>> 8; + } + }; +}; +var dopt = function(dat, opt, pre, post, st) { + return dflt(dat, opt.level == null ? 6 : opt.level, opt.mem == null ? Math.ceil(Math.max(8, Math.min(13, Math.log(dat.length))) * 1.5) : 12 + opt.mem, pre, post, !st); +}; +var wbytes = function(d, b, v) { + for (; v; ++b) + d[b] = v, v >>>= 8; +}; +var zlh = function(c, o) { + var lv = o.level, fl2 = lv == 0 ? 0 : lv < 6 ? 1 : lv == 9 ? 3 : 2; + c[0] = 120, c[1] = fl2 << 6 | (fl2 ? 32 - 2 * fl2 : 1); +}; +var zlv = function(d) { + if ((d[0] & 15) != 8 || d[0] >>> 4 > 7 || (d[0] << 8 | d[1]) % 31) + err(6, "invalid zlib data"); + if (d[1] & 32) + err(6, "invalid zlib data: preset dictionaries not supported"); +}; +function zlibSync(data, opts) { + if (!opts) + opts = {}; + var a = adler(); + a.p(data); + var d = dopt(data, opts, 2, 4); + return zlh(d, opts), wbytes(d, d.length - 4, a.d()), d; +} +function unzlibSync(data, out) { + return inflt((zlv(data), data.subarray(2, -4)), out); +} +var te = typeof TextEncoder != "undefined" && /* @__PURE__ */ new TextEncoder(); +var td = typeof TextDecoder != "undefined" && /* @__PURE__ */ new TextDecoder(); +var tds = 0; +try { + td.decode(et, { stream: true }); + tds = 1; +} catch (e) { +} +var dutf8 = function(d) { + for (var r = "", i = 0; ; ) { + var c = d[i++]; + var eb = (c > 127) + (c > 223) + (c > 239); + if (i + eb > d.length) + return [r, slc(d, i - 1)]; + if (!eb) + r += String.fromCharCode(c); + else if (eb == 3) { + c = ((c & 15) << 18 | (d[i++] & 63) << 12 | (d[i++] & 63) << 6 | d[i++] & 63) - 65536, r += String.fromCharCode(55296 | c >> 10, 56320 | c & 1023); + } else if (eb & 1) + r += String.fromCharCode((c & 31) << 6 | d[i++] & 63); + else + r += String.fromCharCode((c & 15) << 12 | (d[i++] & 63) << 6 | d[i++] & 63); + } +}; +function strToU8(str, latin1) { + if (latin1) { + var ar_1 = new u8(str.length); + for (var i = 0; i < str.length; ++i) + ar_1[i] = str.charCodeAt(i); + return ar_1; + } + if (te) + return te.encode(str); + var l = str.length; + var ar = new u8(str.length + (str.length >> 1)); + var ai = 0; + var w = function(v) { + ar[ai++] = v; + }; + for (var i = 0; i < l; ++i) { + if (ai + 5 > ar.length) { + var n = new u8(ai + 8 + (l - i << 1)); + n.set(ar); + ar = n; + } + var c = str.charCodeAt(i); + if (c < 128 || latin1) + w(c); + else if (c < 2048) + w(192 | c >> 6), w(128 | c & 63); + else if (c > 55295 && c < 57344) + c = 65536 + (c & 1023 << 10) | str.charCodeAt(++i) & 1023, w(240 | c >> 18), w(128 | c >> 12 & 63), w(128 | c >> 6 & 63), w(128 | c & 63); + else + w(224 | c >> 12), w(128 | c >> 6 & 63), w(128 | c & 63); + } + return slc(ar, 0, ai); +} +function strFromU8(dat, latin1) { + if (latin1) { + var r = ""; + for (var i = 0; i < dat.length; i += 16384) + r += String.fromCharCode.apply(null, dat.subarray(i, i + 16384)); + return r; + } else if (td) + return td.decode(dat); + else { + var _a2 = dutf8(dat), out = _a2[0], ext = _a2[1]; + if (ext.length) + err(8); + return out; + } +} + +function debounce(fn, n = 100) { + let handle; + return (...args) => { + if (handle) + clearTimeout(handle); + handle = setTimeout(() => { + fn(...args); + }, n); + }; +} +function utoa(data) { + const buffer = strToU8(data); + const zipped = zlibSync(buffer, { level: 9 }); + const binary = strFromU8(zipped, true); + return btoa(binary); +} +function atou(base64) { + const binary = atob(base64); + if (binary.startsWith("x\xDA")) { + const buffer = strToU8(binary, true); + const unzipped = unzlibSync(buffer); + return strFromU8(unzipped); + } + return decodeURIComponent(escape(binary)); +} + +// node_modules/codemirror/lib/codemirror.js +var require_codemirror = __commonJS({ + "node_modules/codemirror/lib/codemirror.js"(exports, module) { + (function(global, factory) { + typeof exports === "object" && typeof module !== "undefined" ? module.exports = factory() : typeof define === "function" && define.amd ? define(factory) : (global = global || self, global.CodeMirror = factory()); + })(exports, function() { + var userAgent = navigator.userAgent; + var platform = navigator.platform; + var gecko = /gecko\/\d/i.test(userAgent); + var ie_upto10 = /MSIE \d/.test(userAgent); + var ie_11up = /Trident\/(?:[7-9]|\d{2,})\..*rv:(\d+)/.exec(userAgent); + var edge = /Edge\/(\d+)/.exec(userAgent); + var ie = ie_upto10 || ie_11up || edge; + var ie_version = ie && (ie_upto10 ? document.documentMode || 6 : +(edge || ie_11up)[1]); + var webkit = !edge && /WebKit\//.test(userAgent); + var qtwebkit = webkit && /Qt\/\d+\.\d+/.test(userAgent); + var chrome = !edge && /Chrome\/(\d+)/.exec(userAgent); + var chrome_version = chrome && +chrome[1]; + var presto = /Opera\//.test(userAgent); + var safari = /Apple Computer/.test(navigator.vendor); + var mac_geMountainLion = /Mac OS X 1\d\D([8-9]|\d\d)\D/.test(userAgent); + var phantom = /PhantomJS/.test(userAgent); + var ios = safari && (/Mobile\/\w+/.test(userAgent) || navigator.maxTouchPoints > 2); + var android = /Android/.test(userAgent); + var mobile = ios || android || /webOS|BlackBerry|Opera Mini|Opera Mobi|IEMobile/i.test(userAgent); + var mac = ios || /Mac/.test(platform); + var chromeOS = /\bCrOS\b/.test(userAgent); + var windows = /win/i.test(platform); + var presto_version = presto && userAgent.match(/Version\/(\d*\.\d*)/); + if (presto_version) { + presto_version = Number(presto_version[1]); + } + if (presto_version && presto_version >= 15) { + presto = false; + webkit = true; + } + var flipCtrlCmd = mac && (qtwebkit || presto && (presto_version == null || presto_version < 12.11)); + var captureRightClick = gecko || ie && ie_version >= 9; + function classTest(cls) { + return new RegExp("(^|\\s)" + cls + "(?:$|\\s)\\s*"); + } + var rmClass = function(node, cls) { + var current = node.className; + var match = classTest(cls).exec(current); + if (match) { + var after = current.slice(match.index + match[0].length); + node.className = current.slice(0, match.index) + (after ? match[1] + after : ""); + } + }; + function removeChildren(e) { + for (var count = e.childNodes.length; count > 0; --count) { + e.removeChild(e.firstChild); + } + return e; + } + function removeChildrenAndAdd(parent, e) { + return removeChildren(parent).appendChild(e); + } + function elt(tag, content, className, style) { + var e = document.createElement(tag); + if (className) { + e.className = className; + } + if (style) { + e.style.cssText = style; + } + if (typeof content == "string") { + e.appendChild(document.createTextNode(content)); + } else if (content) { + for (var i2 = 0; i2 < content.length; ++i2) { + e.appendChild(content[i2]); + } + } + return e; + } + function eltP(tag, content, className, style) { + var e = elt(tag, content, className, style); + e.setAttribute("role", "presentation"); + return e; + } + var range; + if (document.createRange) { + range = function(node, start, end, endNode) { + var r = document.createRange(); + r.setEnd(endNode || node, end); + r.setStart(node, start); + return r; + }; + } else { + range = function(node, start, end) { + var r = document.body.createTextRange(); + try { + r.moveToElementText(node.parentNode); + } catch (e) { + return r; + } + r.collapse(true); + r.moveEnd("character", end); + r.moveStart("character", start); + return r; + }; + } + function contains(parent, child) { + if (child.nodeType == 3) { + child = child.parentNode; + } + if (parent.contains) { + return parent.contains(child); + } + do { + if (child.nodeType == 11) { + child = child.host; + } + if (child == parent) { + return true; + } + } while (child = child.parentNode); + } + function activeElt() { + var activeElement; + try { + activeElement = document.activeElement; + } catch (e) { + activeElement = document.body || null; + } + while (activeElement && activeElement.shadowRoot && activeElement.shadowRoot.activeElement) { + activeElement = activeElement.shadowRoot.activeElement; + } + return activeElement; + } + function addClass(node, cls) { + var current = node.className; + if (!classTest(cls).test(current)) { + node.className += (current ? " " : "") + cls; + } + } + function joinClasses(a, b) { + var as = a.split(" "); + for (var i2 = 0; i2 < as.length; i2++) { + if (as[i2] && !classTest(as[i2]).test(b)) { + b += " " + as[i2]; + } + } + return b; + } + var selectInput = function(node) { + node.select(); + }; + if (ios) { + selectInput = function(node) { + node.selectionStart = 0; + node.selectionEnd = node.value.length; + }; + } else if (ie) { + selectInput = function(node) { + try { + node.select(); + } catch (_e) { + } + }; + } + function bind(f) { + var args = Array.prototype.slice.call(arguments, 1); + return function() { + return f.apply(null, args); + }; + } + function copyObj(obj, target, overwrite) { + if (!target) { + target = {}; + } + for (var prop2 in obj) { + if (obj.hasOwnProperty(prop2) && (overwrite !== false || !target.hasOwnProperty(prop2))) { + target[prop2] = obj[prop2]; + } + } + return target; + } + function countColumn(string, end, tabSize, startIndex, startValue) { + if (end == null) { + end = string.search(/[^\s\u00a0]/); + if (end == -1) { + end = string.length; + } + } + for (var i2 = startIndex || 0, n = startValue || 0; ; ) { + var nextTab = string.indexOf(" ", i2); + if (nextTab < 0 || nextTab >= end) { + return n + (end - i2); + } + n += nextTab - i2; + n += tabSize - n % tabSize; + i2 = nextTab + 1; + } + } + var Delayed = function() { + this.id = null; + this.f = null; + this.time = 0; + this.handler = bind(this.onTimeout, this); + }; + Delayed.prototype.onTimeout = function(self2) { + self2.id = 0; + if (self2.time <= +new Date()) { + self2.f(); + } else { + setTimeout(self2.handler, self2.time - +new Date()); + } + }; + Delayed.prototype.set = function(ms, f) { + this.f = f; + var time = +new Date() + ms; + if (!this.id || time < this.time) { + clearTimeout(this.id); + this.id = setTimeout(this.handler, ms); + this.time = time; + } + }; + function indexOf(array, elt2) { + for (var i2 = 0; i2 < array.length; ++i2) { + if (array[i2] == elt2) { + return i2; + } + } + return -1; + } + var scrollerGap = 50; + var Pass = { toString: function() { + return "CodeMirror.Pass"; + } }; + var sel_dontScroll = { scroll: false }, sel_mouse = { origin: "*mouse" }, sel_move = { origin: "+move" }; + function findColumn(string, goal, tabSize) { + for (var pos = 0, col = 0; ; ) { + var nextTab = string.indexOf(" ", pos); + if (nextTab == -1) { + nextTab = string.length; + } + var skipped = nextTab - pos; + if (nextTab == string.length || col + skipped >= goal) { + return pos + Math.min(skipped, goal - col); + } + col += nextTab - pos; + col += tabSize - col % tabSize; + pos = nextTab + 1; + if (col >= goal) { + return pos; + } + } + } + var spaceStrs = [""]; + function spaceStr(n) { + while (spaceStrs.length <= n) { + spaceStrs.push(lst(spaceStrs) + " "); + } + return spaceStrs[n]; + } + function lst(arr) { + return arr[arr.length - 1]; + } + function map(array, f) { + var out = []; + for (var i2 = 0; i2 < array.length; i2++) { + out[i2] = f(array[i2], i2); + } + return out; + } + function insertSorted(array, value, score) { + var pos = 0, priority = score(value); + while (pos < array.length && score(array[pos]) <= priority) { + pos++; + } + array.splice(pos, 0, value); + } + function nothing() { + } + function createObj(base, props) { + var inst; + if (Object.create) { + inst = Object.create(base); + } else { + nothing.prototype = base; + inst = new nothing(); + } + if (props) { + copyObj(props, inst); + } + return inst; + } + var nonASCIISingleCaseWordChar = /[\u00df\u0587\u0590-\u05f4\u0600-\u06ff\u3040-\u309f\u30a0-\u30ff\u3400-\u4db5\u4e00-\u9fcc\uac00-\ud7af]/; + function isWordCharBasic(ch) { + return /\w/.test(ch) || ch > "\x80" && (ch.toUpperCase() != ch.toLowerCase() || nonASCIISingleCaseWordChar.test(ch)); + } + function isWordChar(ch, helper) { + if (!helper) { + return isWordCharBasic(ch); + } + if (helper.source.indexOf("\\w") > -1 && isWordCharBasic(ch)) { + return true; + } + return helper.test(ch); + } + function isEmpty(obj) { + for (var n in obj) { + if (obj.hasOwnProperty(n) && obj[n]) { + return false; + } + } + return true; + } + var extendingChars = /[\u0300-\u036f\u0483-\u0489\u0591-\u05bd\u05bf\u05c1\u05c2\u05c4\u05c5\u05c7\u0610-\u061a\u064b-\u065e\u0670\u06d6-\u06dc\u06de-\u06e4\u06e7\u06e8\u06ea-\u06ed\u0711\u0730-\u074a\u07a6-\u07b0\u07eb-\u07f3\u0816-\u0819\u081b-\u0823\u0825-\u0827\u0829-\u082d\u0900-\u0902\u093c\u0941-\u0948\u094d\u0951-\u0955\u0962\u0963\u0981\u09bc\u09be\u09c1-\u09c4\u09cd\u09d7\u09e2\u09e3\u0a01\u0a02\u0a3c\u0a41\u0a42\u0a47\u0a48\u0a4b-\u0a4d\u0a51\u0a70\u0a71\u0a75\u0a81\u0a82\u0abc\u0ac1-\u0ac5\u0ac7\u0ac8\u0acd\u0ae2\u0ae3\u0b01\u0b3c\u0b3e\u0b3f\u0b41-\u0b44\u0b4d\u0b56\u0b57\u0b62\u0b63\u0b82\u0bbe\u0bc0\u0bcd\u0bd7\u0c3e-\u0c40\u0c46-\u0c48\u0c4a-\u0c4d\u0c55\u0c56\u0c62\u0c63\u0cbc\u0cbf\u0cc2\u0cc6\u0ccc\u0ccd\u0cd5\u0cd6\u0ce2\u0ce3\u0d3e\u0d41-\u0d44\u0d4d\u0d57\u0d62\u0d63\u0dca\u0dcf\u0dd2-\u0dd4\u0dd6\u0ddf\u0e31\u0e34-\u0e3a\u0e47-\u0e4e\u0eb1\u0eb4-\u0eb9\u0ebb\u0ebc\u0ec8-\u0ecd\u0f18\u0f19\u0f35\u0f37\u0f39\u0f71-\u0f7e\u0f80-\u0f84\u0f86\u0f87\u0f90-\u0f97\u0f99-\u0fbc\u0fc6\u102d-\u1030\u1032-\u1037\u1039\u103a\u103d\u103e\u1058\u1059\u105e-\u1060\u1071-\u1074\u1082\u1085\u1086\u108d\u109d\u135f\u1712-\u1714\u1732-\u1734\u1752\u1753\u1772\u1773\u17b7-\u17bd\u17c6\u17c9-\u17d3\u17dd\u180b-\u180d\u18a9\u1920-\u1922\u1927\u1928\u1932\u1939-\u193b\u1a17\u1a18\u1a56\u1a58-\u1a5e\u1a60\u1a62\u1a65-\u1a6c\u1a73-\u1a7c\u1a7f\u1b00-\u1b03\u1b34\u1b36-\u1b3a\u1b3c\u1b42\u1b6b-\u1b73\u1b80\u1b81\u1ba2-\u1ba5\u1ba8\u1ba9\u1c2c-\u1c33\u1c36\u1c37\u1cd0-\u1cd2\u1cd4-\u1ce0\u1ce2-\u1ce8\u1ced\u1dc0-\u1de6\u1dfd-\u1dff\u200c\u200d\u20d0-\u20f0\u2cef-\u2cf1\u2de0-\u2dff\u302a-\u302f\u3099\u309a\ua66f-\ua672\ua67c\ua67d\ua6f0\ua6f1\ua802\ua806\ua80b\ua825\ua826\ua8c4\ua8e0-\ua8f1\ua926-\ua92d\ua947-\ua951\ua980-\ua982\ua9b3\ua9b6-\ua9b9\ua9bc\uaa29-\uaa2e\uaa31\uaa32\uaa35\uaa36\uaa43\uaa4c\uaab0\uaab2-\uaab4\uaab7\uaab8\uaabe\uaabf\uaac1\uabe5\uabe8\uabed\udc00-\udfff\ufb1e\ufe00-\ufe0f\ufe20-\ufe26\uff9e\uff9f]/; + function isExtendingChar(ch) { + return ch.charCodeAt(0) >= 768 && extendingChars.test(ch); + } + function skipExtendingChars(str, pos, dir) { + while ((dir < 0 ? pos > 0 : pos < str.length) && isExtendingChar(str.charAt(pos))) { + pos += dir; + } + return pos; + } + function findFirst(pred, from, to) { + var dir = from > to ? -1 : 1; + for (; ; ) { + if (from == to) { + return from; + } + var midF = (from + to) / 2, mid = dir < 0 ? Math.ceil(midF) : Math.floor(midF); + if (mid == from) { + return pred(mid) ? from : to; + } + if (pred(mid)) { + to = mid; + } else { + from = mid + dir; + } + } + } + function iterateBidiSections(order, from, to, f) { + if (!order) { + return f(from, to, "ltr", 0); + } + var found = false; + for (var i2 = 0; i2 < order.length; ++i2) { + var part = order[i2]; + if (part.from < to && part.to > from || from == to && part.to == from) { + f(Math.max(part.from, from), Math.min(part.to, to), part.level == 1 ? "rtl" : "ltr", i2); + found = true; + } + } + if (!found) { + f(from, to, "ltr"); + } + } + var bidiOther = null; + function getBidiPartAt(order, ch, sticky) { + var found; + bidiOther = null; + for (var i2 = 0; i2 < order.length; ++i2) { + var cur = order[i2]; + if (cur.from < ch && cur.to > ch) { + return i2; + } + if (cur.to == ch) { + if (cur.from != cur.to && sticky == "before") { + found = i2; + } else { + bidiOther = i2; + } + } + if (cur.from == ch) { + if (cur.from != cur.to && sticky != "before") { + found = i2; + } else { + bidiOther = i2; + } + } + } + return found != null ? found : bidiOther; + } + var bidiOrdering = function() { + var lowTypes = "bbbbbbbbbtstwsbbbbbbbbbbbbbbssstwNN%%%NNNNNN,N,N1111111111NNNNNNNLLLLLLLLLLLLLLLLLLLLLLLLLLNNNNNNLLLLLLLLLLLLLLLLLLLLLLLLLLNNNNbbbbbbsbbbbbbbbbbbbbbbbbbbbbbbbbb,N%%%%NNNNLNNNNN%%11NLNNN1LNNNNNLLLLLLLLLLLLLLLLLLLLLLLNLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLLN"; + var arabicTypes = "nnnnnnNNr%%r,rNNmmmmmmmmmmmrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrmmmmmmmmmmmmmmmmmmmmmnnnnnnnnnn%nnrrrmrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrmmmmmmmnNmmmmmmrrmmNmmmmrr1111111111"; + function charType(code) { + if (code <= 247) { + return lowTypes.charAt(code); + } else if (1424 <= code && code <= 1524) { + return "R"; + } else if (1536 <= code && code <= 1785) { + return arabicTypes.charAt(code - 1536); + } else if (1774 <= code && code <= 2220) { + return "r"; + } else if (8192 <= code && code <= 8203) { + return "w"; + } else if (code == 8204) { + return "b"; + } else { + return "L"; + } + } + var bidiRE = /[\u0590-\u05f4\u0600-\u06ff\u0700-\u08ac]/; + var isNeutral = /[stwN]/, isStrong = /[LRr]/, countsAsLeft = /[Lb1n]/, countsAsNum = /[1n]/; + function BidiSpan(level, from, to) { + this.level = level; + this.from = from; + this.to = to; + } + return function(str, direction) { + var outerType = direction == "ltr" ? "L" : "R"; + if (str.length == 0 || direction == "ltr" && !bidiRE.test(str)) { + return false; + } + var len = str.length, types = []; + for (var i2 = 0; i2 < len; ++i2) { + types.push(charType(str.charCodeAt(i2))); + } + for (var i$12 = 0, prev = outerType; i$12 < len; ++i$12) { + var type = types[i$12]; + if (type == "m") { + types[i$12] = prev; + } else { + prev = type; + } + } + for (var i$22 = 0, cur = outerType; i$22 < len; ++i$22) { + var type$1 = types[i$22]; + if (type$1 == "1" && cur == "r") { + types[i$22] = "n"; + } else if (isStrong.test(type$1)) { + cur = type$1; + if (type$1 == "r") { + types[i$22] = "R"; + } + } + } + for (var i$3 = 1, prev$1 = types[0]; i$3 < len - 1; ++i$3) { + var type$2 = types[i$3]; + if (type$2 == "+" && prev$1 == "1" && types[i$3 + 1] == "1") { + types[i$3] = "1"; + } else if (type$2 == "," && prev$1 == types[i$3 + 1] && (prev$1 == "1" || prev$1 == "n")) { + types[i$3] = prev$1; + } + prev$1 = type$2; + } + for (var i$4 = 0; i$4 < len; ++i$4) { + var type$3 = types[i$4]; + if (type$3 == ",") { + types[i$4] = "N"; + } else if (type$3 == "%") { + var end = void 0; + for (end = i$4 + 1; end < len && types[end] == "%"; ++end) { + } + var replace = i$4 && types[i$4 - 1] == "!" || end < len && types[end] == "1" ? "1" : "N"; + for (var j = i$4; j < end; ++j) { + types[j] = replace; + } + i$4 = end - 1; + } + } + for (var i$5 = 0, cur$1 = outerType; i$5 < len; ++i$5) { + var type$4 = types[i$5]; + if (cur$1 == "L" && type$4 == "1") { + types[i$5] = "L"; + } else if (isStrong.test(type$4)) { + cur$1 = type$4; + } + } + for (var i$6 = 0; i$6 < len; ++i$6) { + if (isNeutral.test(types[i$6])) { + var end$1 = void 0; + for (end$1 = i$6 + 1; end$1 < len && isNeutral.test(types[end$1]); ++end$1) { + } + var before = (i$6 ? types[i$6 - 1] : outerType) == "L"; + var after = (end$1 < len ? types[end$1] : outerType) == "L"; + var replace$1 = before == after ? before ? "L" : "R" : outerType; + for (var j$1 = i$6; j$1 < end$1; ++j$1) { + types[j$1] = replace$1; + } + i$6 = end$1 - 1; + } + } + var order = [], m; + for (var i$7 = 0; i$7 < len; ) { + if (countsAsLeft.test(types[i$7])) { + var start = i$7; + for (++i$7; i$7 < len && countsAsLeft.test(types[i$7]); ++i$7) { + } + order.push(new BidiSpan(0, start, i$7)); + } else { + var pos = i$7, at = order.length, isRTL = direction == "rtl" ? 1 : 0; + for (++i$7; i$7 < len && types[i$7] != "L"; ++i$7) { + } + for (var j$2 = pos; j$2 < i$7; ) { + if (countsAsNum.test(types[j$2])) { + if (pos < j$2) { + order.splice(at, 0, new BidiSpan(1, pos, j$2)); + at += isRTL; + } + var nstart = j$2; + for (++j$2; j$2 < i$7 && countsAsNum.test(types[j$2]); ++j$2) { + } + order.splice(at, 0, new BidiSpan(2, nstart, j$2)); + at += isRTL; + pos = j$2; + } else { + ++j$2; + } + } + if (pos < i$7) { + order.splice(at, 0, new BidiSpan(1, pos, i$7)); + } + } + } + if (direction == "ltr") { + if (order[0].level == 1 && (m = str.match(/^\s+/))) { + order[0].from = m[0].length; + order.unshift(new BidiSpan(0, 0, m[0].length)); + } + if (lst(order).level == 1 && (m = str.match(/\s+$/))) { + lst(order).to -= m[0].length; + order.push(new BidiSpan(0, len - m[0].length, len)); + } + } + return direction == "rtl" ? order.reverse() : order; + }; + }(); + function getOrder(line, direction) { + var order = line.order; + if (order == null) { + order = line.order = bidiOrdering(line.text, direction); + } + return order; + } + var noHandlers = []; + var on = function(emitter, type, f) { + if (emitter.addEventListener) { + emitter.addEventListener(type, f, false); + } else if (emitter.attachEvent) { + emitter.attachEvent("on" + type, f); + } else { + var map2 = emitter._handlers || (emitter._handlers = {}); + map2[type] = (map2[type] || noHandlers).concat(f); + } + }; + function getHandlers(emitter, type) { + return emitter._handlers && emitter._handlers[type] || noHandlers; + } + function off(emitter, type, f) { + if (emitter.removeEventListener) { + emitter.removeEventListener(type, f, false); + } else if (emitter.detachEvent) { + emitter.detachEvent("on" + type, f); + } else { + var map2 = emitter._handlers, arr = map2 && map2[type]; + if (arr) { + var index = indexOf(arr, f); + if (index > -1) { + map2[type] = arr.slice(0, index).concat(arr.slice(index + 1)); + } + } + } + } + function signal(emitter, type) { + var handlers = getHandlers(emitter, type); + if (!handlers.length) { + return; + } + var args = Array.prototype.slice.call(arguments, 2); + for (var i2 = 0; i2 < handlers.length; ++i2) { + handlers[i2].apply(null, args); + } + } + function signalDOMEvent(cm, e, override) { + if (typeof e == "string") { + e = { type: e, preventDefault: function() { + this.defaultPrevented = true; + } }; + } + signal(cm, override || e.type, cm, e); + return e_defaultPrevented(e) || e.codemirrorIgnore; + } + function signalCursorActivity(cm) { + var arr = cm._handlers && cm._handlers.cursorActivity; + if (!arr) { + return; + } + var set = cm.curOp.cursorActivityHandlers || (cm.curOp.cursorActivityHandlers = []); + for (var i2 = 0; i2 < arr.length; ++i2) { + if (indexOf(set, arr[i2]) == -1) { + set.push(arr[i2]); + } + } + } + function hasHandler(emitter, type) { + return getHandlers(emitter, type).length > 0; + } + function eventMixin(ctor) { + ctor.prototype.on = function(type, f) { + on(this, type, f); + }; + ctor.prototype.off = function(type, f) { + off(this, type, f); + }; + } + function e_preventDefault(e) { + if (e.preventDefault) { + e.preventDefault(); + } else { + e.returnValue = false; + } + } + function e_stopPropagation(e) { + if (e.stopPropagation) { + e.stopPropagation(); + } else { + e.cancelBubble = true; + } + } + function e_defaultPrevented(e) { + return e.defaultPrevented != null ? e.defaultPrevented : e.returnValue == false; + } + function e_stop(e) { + e_preventDefault(e); + e_stopPropagation(e); + } + function e_target(e) { + return e.target || e.srcElement; + } + function e_button(e) { + var b = e.which; + if (b == null) { + if (e.button & 1) { + b = 1; + } else if (e.button & 2) { + b = 3; + } else if (e.button & 4) { + b = 2; + } + } + if (mac && e.ctrlKey && b == 1) { + b = 3; + } + return b; + } + var dragAndDrop = function() { + if (ie && ie_version < 9) { + return false; + } + var div = elt("div"); + return "draggable" in div || "dragDrop" in div; + }(); + var zwspSupported; + function zeroWidthElement(measure) { + if (zwspSupported == null) { + var test = elt("span", "\u200B"); + removeChildrenAndAdd(measure, elt("span", [test, document.createTextNode("x")])); + if (measure.firstChild.offsetHeight != 0) { + zwspSupported = test.offsetWidth <= 1 && test.offsetHeight > 2 && !(ie && ie_version < 8); + } + } + var node = zwspSupported ? elt("span", "\u200B") : elt("span", "\xA0", null, "display: inline-block; width: 1px; margin-right: -1px"); + node.setAttribute("cm-text", ""); + return node; + } + var badBidiRects; + function hasBadBidiRects(measure) { + if (badBidiRects != null) { + return badBidiRects; + } + var txt = removeChildrenAndAdd(measure, document.createTextNode("A\u062EA")); + var r0 = range(txt, 0, 1).getBoundingClientRect(); + var r1 = range(txt, 1, 2).getBoundingClientRect(); + removeChildren(measure); + if (!r0 || r0.left == r0.right) { + return false; + } + return badBidiRects = r1.right - r0.right < 3; + } + var splitLinesAuto = "\n\nb".split(/\n/).length != 3 ? function(string) { + var pos = 0, result = [], l = string.length; + while (pos <= l) { + var nl = string.indexOf("\n", pos); + if (nl == -1) { + nl = string.length; + } + var line = string.slice(pos, string.charAt(nl - 1) == "\r" ? nl - 1 : nl); + var rt = line.indexOf("\r"); + if (rt != -1) { + result.push(line.slice(0, rt)); + pos += rt + 1; + } else { + result.push(line); + pos = nl + 1; + } + } + return result; + } : function(string) { + return string.split(/\r\n?|\n/); + }; + var hasSelection = window.getSelection ? function(te) { + try { + return te.selectionStart != te.selectionEnd; + } catch (e) { + return false; + } + } : function(te) { + var range2; + try { + range2 = te.ownerDocument.selection.createRange(); + } catch (e) { + } + if (!range2 || range2.parentElement() != te) { + return false; + } + return range2.compareEndPoints("StartToEnd", range2) != 0; + }; + var hasCopyEvent = function() { + var e = elt("div"); + if ("oncopy" in e) { + return true; + } + e.setAttribute("oncopy", "return;"); + return typeof e.oncopy == "function"; + }(); + var badZoomedRects = null; + function hasBadZoomedRects(measure) { + if (badZoomedRects != null) { + return badZoomedRects; + } + var node = removeChildrenAndAdd(measure, elt("span", "x")); + var normal = node.getBoundingClientRect(); + var fromRange = range(node, 0, 1).getBoundingClientRect(); + return badZoomedRects = Math.abs(normal.left - fromRange.left) > 1; + } + var modes = {}, mimeModes = {}; + function defineMode(name, mode) { + if (arguments.length > 2) { + mode.dependencies = Array.prototype.slice.call(arguments, 2); + } + modes[name] = mode; + } + function defineMIME(mime, spec) { + mimeModes[mime] = spec; + } + function resolveMode(spec) { + if (typeof spec == "string" && mimeModes.hasOwnProperty(spec)) { + spec = mimeModes[spec]; + } else if (spec && typeof spec.name == "string" && mimeModes.hasOwnProperty(spec.name)) { + var found = mimeModes[spec.name]; + if (typeof found == "string") { + found = { name: found }; + } + spec = createObj(found, spec); + spec.name = found.name; + } else if (typeof spec == "string" && /^[\w\-]+\/[\w\-]+\+xml$/.test(spec)) { + return resolveMode("application/xml"); + } else if (typeof spec == "string" && /^[\w\-]+\/[\w\-]+\+json$/.test(spec)) { + return resolveMode("application/json"); + } + if (typeof spec == "string") { + return { name: spec }; + } else { + return spec || { name: "null" }; + } + } + function getMode(options, spec) { + spec = resolveMode(spec); + var mfactory = modes[spec.name]; + if (!mfactory) { + return getMode(options, "text/plain"); + } + var modeObj = mfactory(options, spec); + if (modeExtensions.hasOwnProperty(spec.name)) { + var exts = modeExtensions[spec.name]; + for (var prop2 in exts) { + if (!exts.hasOwnProperty(prop2)) { + continue; + } + if (modeObj.hasOwnProperty(prop2)) { + modeObj["_" + prop2] = modeObj[prop2]; + } + modeObj[prop2] = exts[prop2]; + } + } + modeObj.name = spec.name; + if (spec.helperType) { + modeObj.helperType = spec.helperType; + } + if (spec.modeProps) { + for (var prop$1 in spec.modeProps) { + modeObj[prop$1] = spec.modeProps[prop$1]; + } + } + return modeObj; + } + var modeExtensions = {}; + function extendMode(mode, properties) { + var exts = modeExtensions.hasOwnProperty(mode) ? modeExtensions[mode] : modeExtensions[mode] = {}; + copyObj(properties, exts); + } + function copyState(mode, state) { + if (state === true) { + return state; + } + if (mode.copyState) { + return mode.copyState(state); + } + var nstate = {}; + for (var n in state) { + var val = state[n]; + if (val instanceof Array) { + val = val.concat([]); + } + nstate[n] = val; + } + return nstate; + } + function innerMode(mode, state) { + var info; + while (mode.innerMode) { + info = mode.innerMode(state); + if (!info || info.mode == mode) { + break; + } + state = info.state; + mode = info.mode; + } + return info || { mode, state }; + } + function startState(mode, a1, a2) { + return mode.startState ? mode.startState(a1, a2) : true; + } + var StringStream = function(string, tabSize, lineOracle) { + this.pos = this.start = 0; + this.string = string; + this.tabSize = tabSize || 8; + this.lastColumnPos = this.lastColumnValue = 0; + this.lineStart = 0; + this.lineOracle = lineOracle; + }; + StringStream.prototype.eol = function() { + return this.pos >= this.string.length; + }; + StringStream.prototype.sol = function() { + return this.pos == this.lineStart; + }; + StringStream.prototype.peek = function() { + return this.string.charAt(this.pos) || void 0; + }; + StringStream.prototype.next = function() { + if (this.pos < this.string.length) { + return this.string.charAt(this.pos++); + } + }; + StringStream.prototype.eat = function(match) { + var ch = this.string.charAt(this.pos); + var ok; + if (typeof match == "string") { + ok = ch == match; + } else { + ok = ch && (match.test ? match.test(ch) : match(ch)); + } + if (ok) { + ++this.pos; + return ch; + } + }; + StringStream.prototype.eatWhile = function(match) { + var start = this.pos; + while (this.eat(match)) { + } + return this.pos > start; + }; + StringStream.prototype.eatSpace = function() { + var start = this.pos; + while (/[\s\u00a0]/.test(this.string.charAt(this.pos))) { + ++this.pos; + } + return this.pos > start; + }; + StringStream.prototype.skipToEnd = function() { + this.pos = this.string.length; + }; + StringStream.prototype.skipTo = function(ch) { + var found = this.string.indexOf(ch, this.pos); + if (found > -1) { + this.pos = found; + return true; + } + }; + StringStream.prototype.backUp = function(n) { + this.pos -= n; + }; + StringStream.prototype.column = function() { + if (this.lastColumnPos < this.start) { + this.lastColumnValue = countColumn(this.string, this.start, this.tabSize, this.lastColumnPos, this.lastColumnValue); + this.lastColumnPos = this.start; + } + return this.lastColumnValue - (this.lineStart ? countColumn(this.string, this.lineStart, this.tabSize) : 0); + }; + StringStream.prototype.indentation = function() { + return countColumn(this.string, null, this.tabSize) - (this.lineStart ? countColumn(this.string, this.lineStart, this.tabSize) : 0); + }; + StringStream.prototype.match = function(pattern, consume, caseInsensitive) { + if (typeof pattern == "string") { + var cased = function(str) { + return caseInsensitive ? str.toLowerCase() : str; + }; + var substr = this.string.substr(this.pos, pattern.length); + if (cased(substr) == cased(pattern)) { + if (consume !== false) { + this.pos += pattern.length; + } + return true; + } + } else { + var match = this.string.slice(this.pos).match(pattern); + if (match && match.index > 0) { + return null; + } + if (match && consume !== false) { + this.pos += match[0].length; + } + return match; + } + }; + StringStream.prototype.current = function() { + return this.string.slice(this.start, this.pos); + }; + StringStream.prototype.hideFirstChars = function(n, inner) { + this.lineStart += n; + try { + return inner(); + } finally { + this.lineStart -= n; + } + }; + StringStream.prototype.lookAhead = function(n) { + var oracle = this.lineOracle; + return oracle && oracle.lookAhead(n); + }; + StringStream.prototype.baseToken = function() { + var oracle = this.lineOracle; + return oracle && oracle.baseToken(this.pos); + }; + function getLine(doc, n) { + n -= doc.first; + if (n < 0 || n >= doc.size) { + throw new Error("There is no line " + (n + doc.first) + " in the document."); + } + var chunk = doc; + while (!chunk.lines) { + for (var i2 = 0; ; ++i2) { + var child = chunk.children[i2], sz = child.chunkSize(); + if (n < sz) { + chunk = child; + break; + } + n -= sz; + } + } + return chunk.lines[n]; + } + function getBetween(doc, start, end) { + var out = [], n = start.line; + doc.iter(start.line, end.line + 1, function(line) { + var text = line.text; + if (n == end.line) { + text = text.slice(0, end.ch); + } + if (n == start.line) { + text = text.slice(start.ch); + } + out.push(text); + ++n; + }); + return out; + } + function getLines(doc, from, to) { + var out = []; + doc.iter(from, to, function(line) { + out.push(line.text); + }); + return out; + } + function updateLineHeight(line, height) { + var diff = height - line.height; + if (diff) { + for (var n = line; n; n = n.parent) { + n.height += diff; + } + } + } + function lineNo(line) { + if (line.parent == null) { + return null; + } + var cur = line.parent, no = indexOf(cur.lines, line); + for (var chunk = cur.parent; chunk; cur = chunk, chunk = chunk.parent) { + for (var i2 = 0; ; ++i2) { + if (chunk.children[i2] == cur) { + break; + } + no += chunk.children[i2].chunkSize(); + } + } + return no + cur.first; + } + function lineAtHeight(chunk, h) { + var n = chunk.first; + outer: + do { + for (var i$12 = 0; i$12 < chunk.children.length; ++i$12) { + var child = chunk.children[i$12], ch = child.height; + if (h < ch) { + chunk = child; + continue outer; + } + h -= ch; + n += child.chunkSize(); + } + return n; + } while (!chunk.lines); + var i2 = 0; + for (; i2 < chunk.lines.length; ++i2) { + var line = chunk.lines[i2], lh = line.height; + if (h < lh) { + break; + } + h -= lh; + } + return n + i2; + } + function isLine(doc, l) { + return l >= doc.first && l < doc.first + doc.size; + } + function lineNumberFor(options, i2) { + return String(options.lineNumberFormatter(i2 + options.firstLineNumber)); + } + function Pos(line, ch, sticky) { + if (sticky === void 0) + sticky = null; + if (!(this instanceof Pos)) { + return new Pos(line, ch, sticky); + } + this.line = line; + this.ch = ch; + this.sticky = sticky; + } + function cmp(a, b) { + return a.line - b.line || a.ch - b.ch; + } + function equalCursorPos(a, b) { + return a.sticky == b.sticky && cmp(a, b) == 0; + } + function copyPos(x) { + return Pos(x.line, x.ch); + } + function maxPos(a, b) { + return cmp(a, b) < 0 ? b : a; + } + function minPos(a, b) { + return cmp(a, b) < 0 ? a : b; + } + function clipLine(doc, n) { + return Math.max(doc.first, Math.min(n, doc.first + doc.size - 1)); + } + function clipPos(doc, pos) { + if (pos.line < doc.first) { + return Pos(doc.first, 0); + } + var last = doc.first + doc.size - 1; + if (pos.line > last) { + return Pos(last, getLine(doc, last).text.length); + } + return clipToLen(pos, getLine(doc, pos.line).text.length); + } + function clipToLen(pos, linelen) { + var ch = pos.ch; + if (ch == null || ch > linelen) { + return Pos(pos.line, linelen); + } else if (ch < 0) { + return Pos(pos.line, 0); + } else { + return pos; + } + } + function clipPosArray(doc, array) { + var out = []; + for (var i2 = 0; i2 < array.length; i2++) { + out[i2] = clipPos(doc, array[i2]); + } + return out; + } + var SavedContext = function(state, lookAhead) { + this.state = state; + this.lookAhead = lookAhead; + }; + var Context = function(doc, state, line, lookAhead) { + this.state = state; + this.doc = doc; + this.line = line; + this.maxLookAhead = lookAhead || 0; + this.baseTokens = null; + this.baseTokenPos = 1; + }; + Context.prototype.lookAhead = function(n) { + var line = this.doc.getLine(this.line + n); + if (line != null && n > this.maxLookAhead) { + this.maxLookAhead = n; + } + return line; + }; + Context.prototype.baseToken = function(n) { + if (!this.baseTokens) { + return null; + } + while (this.baseTokens[this.baseTokenPos] <= n) { + this.baseTokenPos += 2; + } + var type = this.baseTokens[this.baseTokenPos + 1]; + return { + type: type && type.replace(/( |^)overlay .*/, ""), + size: this.baseTokens[this.baseTokenPos] - n + }; + }; + Context.prototype.nextLine = function() { + this.line++; + if (this.maxLookAhead > 0) { + this.maxLookAhead--; + } + }; + Context.fromSaved = function(doc, saved, line) { + if (saved instanceof SavedContext) { + return new Context(doc, copyState(doc.mode, saved.state), line, saved.lookAhead); + } else { + return new Context(doc, copyState(doc.mode, saved), line); + } + }; + Context.prototype.save = function(copy) { + var state = copy !== false ? copyState(this.doc.mode, this.state) : this.state; + return this.maxLookAhead > 0 ? new SavedContext(state, this.maxLookAhead) : state; + }; + function highlightLine(cm, line, context, forceToEnd) { + var st = [cm.state.modeGen], lineClasses = {}; + runMode(cm, line.text, cm.doc.mode, context, function(end, style) { + return st.push(end, style); + }, lineClasses, forceToEnd); + var state = context.state; + var loop = function(o2) { + context.baseTokens = st; + var overlay = cm.state.overlays[o2], i2 = 1, at = 0; + context.state = true; + runMode(cm, line.text, overlay.mode, context, function(end, style) { + var start = i2; + while (at < end) { + var i_end = st[i2]; + if (i_end > end) { + st.splice(i2, 1, end, st[i2 + 1], i_end); + } + i2 += 2; + at = Math.min(end, i_end); + } + if (!style) { + return; + } + if (overlay.opaque) { + st.splice(start, i2 - start, end, "overlay " + style); + i2 = start + 2; + } else { + for (; start < i2; start += 2) { + var cur = st[start + 1]; + st[start + 1] = (cur ? cur + " " : "") + "overlay " + style; + } + } + }, lineClasses); + context.state = state; + context.baseTokens = null; + context.baseTokenPos = 1; + }; + for (var o = 0; o < cm.state.overlays.length; ++o) + loop(o); + return { styles: st, classes: lineClasses.bgClass || lineClasses.textClass ? lineClasses : null }; + } + function getLineStyles(cm, line, updateFrontier) { + if (!line.styles || line.styles[0] != cm.state.modeGen) { + var context = getContextBefore(cm, lineNo(line)); + var resetState = line.text.length > cm.options.maxHighlightLength && copyState(cm.doc.mode, context.state); + var result = highlightLine(cm, line, context); + if (resetState) { + context.state = resetState; + } + line.stateAfter = context.save(!resetState); + line.styles = result.styles; + if (result.classes) { + line.styleClasses = result.classes; + } else if (line.styleClasses) { + line.styleClasses = null; + } + if (updateFrontier === cm.doc.highlightFrontier) { + cm.doc.modeFrontier = Math.max(cm.doc.modeFrontier, ++cm.doc.highlightFrontier); + } + } + return line.styles; + } + function getContextBefore(cm, n, precise) { + var doc = cm.doc, display = cm.display; + if (!doc.mode.startState) { + return new Context(doc, true, n); + } + var start = findStartLine(cm, n, precise); + var saved = start > doc.first && getLine(doc, start - 1).stateAfter; + var context = saved ? Context.fromSaved(doc, saved, start) : new Context(doc, startState(doc.mode), start); + doc.iter(start, n, function(line) { + processLine(cm, line.text, context); + var pos = context.line; + line.stateAfter = pos == n - 1 || pos % 5 == 0 || pos >= display.viewFrom && pos < display.viewTo ? context.save() : null; + context.nextLine(); + }); + if (precise) { + doc.modeFrontier = context.line; + } + return context; + } + function processLine(cm, text, context, startAt) { + var mode = cm.doc.mode; + var stream = new StringStream(text, cm.options.tabSize, context); + stream.start = stream.pos = startAt || 0; + if (text == "") { + callBlankLine(mode, context.state); + } + while (!stream.eol()) { + readToken(mode, stream, context.state); + stream.start = stream.pos; + } + } + function callBlankLine(mode, state) { + if (mode.blankLine) { + return mode.blankLine(state); + } + if (!mode.innerMode) { + return; + } + var inner = innerMode(mode, state); + if (inner.mode.blankLine) { + return inner.mode.blankLine(inner.state); + } + } + function readToken(mode, stream, state, inner) { + for (var i2 = 0; i2 < 10; i2++) { + if (inner) { + inner[0] = innerMode(mode, state).mode; + } + var style = mode.token(stream, state); + if (stream.pos > stream.start) { + return style; + } + } + throw new Error("Mode " + mode.name + " failed to advance stream."); + } + var Token = function(stream, type, state) { + this.start = stream.start; + this.end = stream.pos; + this.string = stream.current(); + this.type = type || null; + this.state = state; + }; + function takeToken(cm, pos, precise, asArray) { + var doc = cm.doc, mode = doc.mode, style; + pos = clipPos(doc, pos); + var line = getLine(doc, pos.line), context = getContextBefore(cm, pos.line, precise); + var stream = new StringStream(line.text, cm.options.tabSize, context), tokens; + if (asArray) { + tokens = []; + } + while ((asArray || stream.pos < pos.ch) && !stream.eol()) { + stream.start = stream.pos; + style = readToken(mode, stream, context.state); + if (asArray) { + tokens.push(new Token(stream, style, copyState(doc.mode, context.state))); + } + } + return asArray ? tokens : new Token(stream, style, context.state); + } + function extractLineClasses(type, output) { + if (type) { + for (; ; ) { + var lineClass = type.match(/(?:^|\s+)line-(background-)?(\S+)/); + if (!lineClass) { + break; + } + type = type.slice(0, lineClass.index) + type.slice(lineClass.index + lineClass[0].length); + var prop2 = lineClass[1] ? "bgClass" : "textClass"; + if (output[prop2] == null) { + output[prop2] = lineClass[2]; + } else if (!new RegExp("(?:^|\\s)" + lineClass[2] + "(?:$|\\s)").test(output[prop2])) { + output[prop2] += " " + lineClass[2]; + } + } + } + return type; + } + function runMode(cm, text, mode, context, f, lineClasses, forceToEnd) { + var flattenSpans = mode.flattenSpans; + if (flattenSpans == null) { + flattenSpans = cm.options.flattenSpans; + } + var curStart = 0, curStyle = null; + var stream = new StringStream(text, cm.options.tabSize, context), style; + var inner = cm.options.addModeClass && [null]; + if (text == "") { + extractLineClasses(callBlankLine(mode, context.state), lineClasses); + } + while (!stream.eol()) { + if (stream.pos > cm.options.maxHighlightLength) { + flattenSpans = false; + if (forceToEnd) { + processLine(cm, text, context, stream.pos); + } + stream.pos = text.length; + style = null; + } else { + style = extractLineClasses(readToken(mode, stream, context.state, inner), lineClasses); + } + if (inner) { + var mName = inner[0].name; + if (mName) { + style = "m-" + (style ? mName + " " + style : mName); + } + } + if (!flattenSpans || curStyle != style) { + while (curStart < stream.start) { + curStart = Math.min(stream.start, curStart + 5e3); + f(curStart, curStyle); + } + curStyle = style; + } + stream.start = stream.pos; + } + while (curStart < stream.pos) { + var pos = Math.min(stream.pos, curStart + 5e3); + f(pos, curStyle); + curStart = pos; + } + } + function findStartLine(cm, n, precise) { + var minindent, minline, doc = cm.doc; + var lim = precise ? -1 : n - (cm.doc.mode.innerMode ? 1e3 : 100); + for (var search = n; search > lim; --search) { + if (search <= doc.first) { + return doc.first; + } + var line = getLine(doc, search - 1), after = line.stateAfter; + if (after && (!precise || search + (after instanceof SavedContext ? after.lookAhead : 0) <= doc.modeFrontier)) { + return search; + } + var indented = countColumn(line.text, null, cm.options.tabSize); + if (minline == null || minindent > indented) { + minline = search - 1; + minindent = indented; + } + } + return minline; + } + function retreatFrontier(doc, n) { + doc.modeFrontier = Math.min(doc.modeFrontier, n); + if (doc.highlightFrontier < n - 10) { + return; + } + var start = doc.first; + for (var line = n - 1; line > start; line--) { + var saved = getLine(doc, line).stateAfter; + if (saved && (!(saved instanceof SavedContext) || line + saved.lookAhead < n)) { + start = line + 1; + break; + } + } + doc.highlightFrontier = Math.min(doc.highlightFrontier, start); + } + var sawReadOnlySpans = false, sawCollapsedSpans = false; + function seeReadOnlySpans() { + sawReadOnlySpans = true; + } + function seeCollapsedSpans() { + sawCollapsedSpans = true; + } + function MarkedSpan(marker, from, to) { + this.marker = marker; + this.from = from; + this.to = to; + } + function getMarkedSpanFor(spans, marker) { + if (spans) { + for (var i2 = 0; i2 < spans.length; ++i2) { + var span = spans[i2]; + if (span.marker == marker) { + return span; + } + } + } + } + function removeMarkedSpan(spans, span) { + var r; + for (var i2 = 0; i2 < spans.length; ++i2) { + if (spans[i2] != span) { + (r || (r = [])).push(spans[i2]); + } + } + return r; + } + function addMarkedSpan(line, span, op) { + var inThisOp = op && window.WeakSet && (op.markedSpans || (op.markedSpans = /* @__PURE__ */ new WeakSet())); + if (inThisOp && line.markedSpans && inThisOp.has(line.markedSpans)) { + line.markedSpans.push(span); + } else { + line.markedSpans = line.markedSpans ? line.markedSpans.concat([span]) : [span]; + if (inThisOp) { + inThisOp.add(line.markedSpans); + } + } + span.marker.attachLine(line); + } + function markedSpansBefore(old, startCh, isInsert) { + var nw; + if (old) { + for (var i2 = 0; i2 < old.length; ++i2) { + var span = old[i2], marker = span.marker; + var startsBefore = span.from == null || (marker.inclusiveLeft ? span.from <= startCh : span.from < startCh); + if (startsBefore || span.from == startCh && marker.type == "bookmark" && (!isInsert || !span.marker.insertLeft)) { + var endsAfter = span.to == null || (marker.inclusiveRight ? span.to >= startCh : span.to > startCh); + (nw || (nw = [])).push(new MarkedSpan(marker, span.from, endsAfter ? null : span.to)); + } + } + } + return nw; + } + function markedSpansAfter(old, endCh, isInsert) { + var nw; + if (old) { + for (var i2 = 0; i2 < old.length; ++i2) { + var span = old[i2], marker = span.marker; + var endsAfter = span.to == null || (marker.inclusiveRight ? span.to >= endCh : span.to > endCh); + if (endsAfter || span.from == endCh && marker.type == "bookmark" && (!isInsert || span.marker.insertLeft)) { + var startsBefore = span.from == null || (marker.inclusiveLeft ? span.from <= endCh : span.from < endCh); + (nw || (nw = [])).push(new MarkedSpan(marker, startsBefore ? null : span.from - endCh, span.to == null ? null : span.to - endCh)); + } + } + } + return nw; + } + function stretchSpansOverChange(doc, change) { + if (change.full) { + return null; + } + var oldFirst = isLine(doc, change.from.line) && getLine(doc, change.from.line).markedSpans; + var oldLast = isLine(doc, change.to.line) && getLine(doc, change.to.line).markedSpans; + if (!oldFirst && !oldLast) { + return null; + } + var startCh = change.from.ch, endCh = change.to.ch, isInsert = cmp(change.from, change.to) == 0; + var first = markedSpansBefore(oldFirst, startCh, isInsert); + var last = markedSpansAfter(oldLast, endCh, isInsert); + var sameLine = change.text.length == 1, offset = lst(change.text).length + (sameLine ? startCh : 0); + if (first) { + for (var i2 = 0; i2 < first.length; ++i2) { + var span = first[i2]; + if (span.to == null) { + var found = getMarkedSpanFor(last, span.marker); + if (!found) { + span.to = startCh; + } else if (sameLine) { + span.to = found.to == null ? null : found.to + offset; + } + } + } + } + if (last) { + for (var i$12 = 0; i$12 < last.length; ++i$12) { + var span$1 = last[i$12]; + if (span$1.to != null) { + span$1.to += offset; + } + if (span$1.from == null) { + var found$1 = getMarkedSpanFor(first, span$1.marker); + if (!found$1) { + span$1.from = offset; + if (sameLine) { + (first || (first = [])).push(span$1); + } + } + } else { + span$1.from += offset; + if (sameLine) { + (first || (first = [])).push(span$1); + } + } + } + } + if (first) { + first = clearEmptySpans(first); + } + if (last && last != first) { + last = clearEmptySpans(last); + } + var newMarkers = [first]; + if (!sameLine) { + var gap = change.text.length - 2, gapMarkers; + if (gap > 0 && first) { + for (var i$22 = 0; i$22 < first.length; ++i$22) { + if (first[i$22].to == null) { + (gapMarkers || (gapMarkers = [])).push(new MarkedSpan(first[i$22].marker, null, null)); + } + } + } + for (var i$3 = 0; i$3 < gap; ++i$3) { + newMarkers.push(gapMarkers); + } + newMarkers.push(last); + } + return newMarkers; + } + function clearEmptySpans(spans) { + for (var i2 = 0; i2 < spans.length; ++i2) { + var span = spans[i2]; + if (span.from != null && span.from == span.to && span.marker.clearWhenEmpty !== false) { + spans.splice(i2--, 1); + } + } + if (!spans.length) { + return null; + } + return spans; + } + function removeReadOnlyRanges(doc, from, to) { + var markers = null; + doc.iter(from.line, to.line + 1, function(line) { + if (line.markedSpans) { + for (var i3 = 0; i3 < line.markedSpans.length; ++i3) { + var mark = line.markedSpans[i3].marker; + if (mark.readOnly && (!markers || indexOf(markers, mark) == -1)) { + (markers || (markers = [])).push(mark); + } + } + } + }); + if (!markers) { + return null; + } + var parts = [{ from, to }]; + for (var i2 = 0; i2 < markers.length; ++i2) { + var mk = markers[i2], m = mk.find(0); + for (var j = 0; j < parts.length; ++j) { + var p = parts[j]; + if (cmp(p.to, m.from) < 0 || cmp(p.from, m.to) > 0) { + continue; + } + var newParts = [j, 1], dfrom = cmp(p.from, m.from), dto = cmp(p.to, m.to); + if (dfrom < 0 || !mk.inclusiveLeft && !dfrom) { + newParts.push({ from: p.from, to: m.from }); + } + if (dto > 0 || !mk.inclusiveRight && !dto) { + newParts.push({ from: m.to, to: p.to }); + } + parts.splice.apply(parts, newParts); + j += newParts.length - 3; + } + } + return parts; + } + function detachMarkedSpans(line) { + var spans = line.markedSpans; + if (!spans) { + return; + } + for (var i2 = 0; i2 < spans.length; ++i2) { + spans[i2].marker.detachLine(line); + } + line.markedSpans = null; + } + function attachMarkedSpans(line, spans) { + if (!spans) { + return; + } + for (var i2 = 0; i2 < spans.length; ++i2) { + spans[i2].marker.attachLine(line); + } + line.markedSpans = spans; + } + function extraLeft(marker) { + return marker.inclusiveLeft ? -1 : 0; + } + function extraRight(marker) { + return marker.inclusiveRight ? 1 : 0; + } + function compareCollapsedMarkers(a, b) { + var lenDiff = a.lines.length - b.lines.length; + if (lenDiff != 0) { + return lenDiff; + } + var aPos = a.find(), bPos = b.find(); + var fromCmp = cmp(aPos.from, bPos.from) || extraLeft(a) - extraLeft(b); + if (fromCmp) { + return -fromCmp; + } + var toCmp = cmp(aPos.to, bPos.to) || extraRight(a) - extraRight(b); + if (toCmp) { + return toCmp; + } + return b.id - a.id; + } + function collapsedSpanAtSide(line, start) { + var sps = sawCollapsedSpans && line.markedSpans, found; + if (sps) { + for (var sp = void 0, i2 = 0; i2 < sps.length; ++i2) { + sp = sps[i2]; + if (sp.marker.collapsed && (start ? sp.from : sp.to) == null && (!found || compareCollapsedMarkers(found, sp.marker) < 0)) { + found = sp.marker; + } + } + } + return found; + } + function collapsedSpanAtStart(line) { + return collapsedSpanAtSide(line, true); + } + function collapsedSpanAtEnd(line) { + return collapsedSpanAtSide(line, false); + } + function collapsedSpanAround(line, ch) { + var sps = sawCollapsedSpans && line.markedSpans, found; + if (sps) { + for (var i2 = 0; i2 < sps.length; ++i2) { + var sp = sps[i2]; + if (sp.marker.collapsed && (sp.from == null || sp.from < ch) && (sp.to == null || sp.to > ch) && (!found || compareCollapsedMarkers(found, sp.marker) < 0)) { + found = sp.marker; + } + } + } + return found; + } + function conflictingCollapsedRange(doc, lineNo2, from, to, marker) { + var line = getLine(doc, lineNo2); + var sps = sawCollapsedSpans && line.markedSpans; + if (sps) { + for (var i2 = 0; i2 < sps.length; ++i2) { + var sp = sps[i2]; + if (!sp.marker.collapsed) { + continue; + } + var found = sp.marker.find(0); + var fromCmp = cmp(found.from, from) || extraLeft(sp.marker) - extraLeft(marker); + var toCmp = cmp(found.to, to) || extraRight(sp.marker) - extraRight(marker); + if (fromCmp >= 0 && toCmp <= 0 || fromCmp <= 0 && toCmp >= 0) { + continue; + } + if (fromCmp <= 0 && (sp.marker.inclusiveRight && marker.inclusiveLeft ? cmp(found.to, from) >= 0 : cmp(found.to, from) > 0) || fromCmp >= 0 && (sp.marker.inclusiveRight && marker.inclusiveLeft ? cmp(found.from, to) <= 0 : cmp(found.from, to) < 0)) { + return true; + } + } + } + } + function visualLine(line) { + var merged; + while (merged = collapsedSpanAtStart(line)) { + line = merged.find(-1, true).line; + } + return line; + } + function visualLineEnd(line) { + var merged; + while (merged = collapsedSpanAtEnd(line)) { + line = merged.find(1, true).line; + } + return line; + } + function visualLineContinued(line) { + var merged, lines; + while (merged = collapsedSpanAtEnd(line)) { + line = merged.find(1, true).line; + (lines || (lines = [])).push(line); + } + return lines; + } + function visualLineNo(doc, lineN) { + var line = getLine(doc, lineN), vis = visualLine(line); + if (line == vis) { + return lineN; + } + return lineNo(vis); + } + function visualLineEndNo(doc, lineN) { + if (lineN > doc.lastLine()) { + return lineN; + } + var line = getLine(doc, lineN), merged; + if (!lineIsHidden(doc, line)) { + return lineN; + } + while (merged = collapsedSpanAtEnd(line)) { + line = merged.find(1, true).line; + } + return lineNo(line) + 1; + } + function lineIsHidden(doc, line) { + var sps = sawCollapsedSpans && line.markedSpans; + if (sps) { + for (var sp = void 0, i2 = 0; i2 < sps.length; ++i2) { + sp = sps[i2]; + if (!sp.marker.collapsed) { + continue; + } + if (sp.from == null) { + return true; + } + if (sp.marker.widgetNode) { + continue; + } + if (sp.from == 0 && sp.marker.inclusiveLeft && lineIsHiddenInner(doc, line, sp)) { + return true; + } + } + } + } + function lineIsHiddenInner(doc, line, span) { + if (span.to == null) { + var end = span.marker.find(1, true); + return lineIsHiddenInner(doc, end.line, getMarkedSpanFor(end.line.markedSpans, span.marker)); + } + if (span.marker.inclusiveRight && span.to == line.text.length) { + return true; + } + for (var sp = void 0, i2 = 0; i2 < line.markedSpans.length; ++i2) { + sp = line.markedSpans[i2]; + if (sp.marker.collapsed && !sp.marker.widgetNode && sp.from == span.to && (sp.to == null || sp.to != span.from) && (sp.marker.inclusiveLeft || span.marker.inclusiveRight) && lineIsHiddenInner(doc, line, sp)) { + return true; + } + } + } + function heightAtLine(lineObj) { + lineObj = visualLine(lineObj); + var h = 0, chunk = lineObj.parent; + for (var i2 = 0; i2 < chunk.lines.length; ++i2) { + var line = chunk.lines[i2]; + if (line == lineObj) { + break; + } else { + h += line.height; + } + } + for (var p = chunk.parent; p; chunk = p, p = chunk.parent) { + for (var i$12 = 0; i$12 < p.children.length; ++i$12) { + var cur = p.children[i$12]; + if (cur == chunk) { + break; + } else { + h += cur.height; + } + } + } + return h; + } + function lineLength(line) { + if (line.height == 0) { + return 0; + } + var len = line.text.length, merged, cur = line; + while (merged = collapsedSpanAtStart(cur)) { + var found = merged.find(0, true); + cur = found.from.line; + len += found.from.ch - found.to.ch; + } + cur = line; + while (merged = collapsedSpanAtEnd(cur)) { + var found$1 = merged.find(0, true); + len -= cur.text.length - found$1.from.ch; + cur = found$1.to.line; + len += cur.text.length - found$1.to.ch; + } + return len; + } + function findMaxLine(cm) { + var d = cm.display, doc = cm.doc; + d.maxLine = getLine(doc, doc.first); + d.maxLineLength = lineLength(d.maxLine); + d.maxLineChanged = true; + doc.iter(function(line) { + var len = lineLength(line); + if (len > d.maxLineLength) { + d.maxLineLength = len; + d.maxLine = line; + } + }); + } + var Line = function(text, markedSpans, estimateHeight2) { + this.text = text; + attachMarkedSpans(this, markedSpans); + this.height = estimateHeight2 ? estimateHeight2(this) : 1; + }; + Line.prototype.lineNo = function() { + return lineNo(this); + }; + eventMixin(Line); + function updateLine(line, text, markedSpans, estimateHeight2) { + line.text = text; + if (line.stateAfter) { + line.stateAfter = null; + } + if (line.styles) { + line.styles = null; + } + if (line.order != null) { + line.order = null; + } + detachMarkedSpans(line); + attachMarkedSpans(line, markedSpans); + var estHeight = estimateHeight2 ? estimateHeight2(line) : 1; + if (estHeight != line.height) { + updateLineHeight(line, estHeight); + } + } + function cleanUpLine(line) { + line.parent = null; + detachMarkedSpans(line); + } + var styleToClassCache = {}, styleToClassCacheWithMode = {}; + function interpretTokenStyle(style, options) { + if (!style || /^\s*$/.test(style)) { + return null; + } + var cache = options.addModeClass ? styleToClassCacheWithMode : styleToClassCache; + return cache[style] || (cache[style] = style.replace(/\S+/g, "cm-$&")); + } + function buildLineContent(cm, lineView) { + var content = eltP("span", null, null, webkit ? "padding-right: .1px" : null); + var builder = { + pre: eltP("pre", [content], "CodeMirror-line"), + content, + col: 0, + pos: 0, + cm, + trailingSpace: false, + splitSpaces: cm.getOption("lineWrapping") + }; + lineView.measure = {}; + for (var i2 = 0; i2 <= (lineView.rest ? lineView.rest.length : 0); i2++) { + var line = i2 ? lineView.rest[i2 - 1] : lineView.line, order = void 0; + builder.pos = 0; + builder.addToken = buildToken; + if (hasBadBidiRects(cm.display.measure) && (order = getOrder(line, cm.doc.direction))) { + builder.addToken = buildTokenBadBidi(builder.addToken, order); + } + builder.map = []; + var allowFrontierUpdate = lineView != cm.display.externalMeasured && lineNo(line); + insertLineContent(line, builder, getLineStyles(cm, line, allowFrontierUpdate)); + if (line.styleClasses) { + if (line.styleClasses.bgClass) { + builder.bgClass = joinClasses(line.styleClasses.bgClass, builder.bgClass || ""); + } + if (line.styleClasses.textClass) { + builder.textClass = joinClasses(line.styleClasses.textClass, builder.textClass || ""); + } + } + if (builder.map.length == 0) { + builder.map.push(0, 0, builder.content.appendChild(zeroWidthElement(cm.display.measure))); + } + if (i2 == 0) { + lineView.measure.map = builder.map; + lineView.measure.cache = {}; + } else { + (lineView.measure.maps || (lineView.measure.maps = [])).push(builder.map); + (lineView.measure.caches || (lineView.measure.caches = [])).push({}); + } + } + if (webkit) { + var last = builder.content.lastChild; + if (/\bcm-tab\b/.test(last.className) || last.querySelector && last.querySelector(".cm-tab")) { + builder.content.className = "cm-tab-wrap-hack"; + } + } + signal(cm, "renderLine", cm, lineView.line, builder.pre); + if (builder.pre.className) { + builder.textClass = joinClasses(builder.pre.className, builder.textClass || ""); + } + return builder; + } + function defaultSpecialCharPlaceholder(ch) { + var token = elt("span", "\u2022", "cm-invalidchar"); + token.title = "\\u" + ch.charCodeAt(0).toString(16); + token.setAttribute("aria-label", token.title); + return token; + } + function buildToken(builder, text, style, startStyle, endStyle, css, attributes) { + if (!text) { + return; + } + var displayText = builder.splitSpaces ? splitSpaces(text, builder.trailingSpace) : text; + var special = builder.cm.state.specialChars, mustWrap = false; + var content; + if (!special.test(text)) { + builder.col += text.length; + content = document.createTextNode(displayText); + builder.map.push(builder.pos, builder.pos + text.length, content); + if (ie && ie_version < 9) { + mustWrap = true; + } + builder.pos += text.length; + } else { + content = document.createDocumentFragment(); + var pos = 0; + while (true) { + special.lastIndex = pos; + var m = special.exec(text); + var skipped = m ? m.index - pos : text.length - pos; + if (skipped) { + var txt = document.createTextNode(displayText.slice(pos, pos + skipped)); + if (ie && ie_version < 9) { + content.appendChild(elt("span", [txt])); + } else { + content.appendChild(txt); + } + builder.map.push(builder.pos, builder.pos + skipped, txt); + builder.col += skipped; + builder.pos += skipped; + } + if (!m) { + break; + } + pos += skipped + 1; + var txt$1 = void 0; + if (m[0] == " ") { + var tabSize = builder.cm.options.tabSize, tabWidth = tabSize - builder.col % tabSize; + txt$1 = content.appendChild(elt("span", spaceStr(tabWidth), "cm-tab")); + txt$1.setAttribute("role", "presentation"); + txt$1.setAttribute("cm-text", " "); + builder.col += tabWidth; + } else if (m[0] == "\r" || m[0] == "\n") { + txt$1 = content.appendChild(elt("span", m[0] == "\r" ? "\u240D" : "\u2424", "cm-invalidchar")); + txt$1.setAttribute("cm-text", m[0]); + builder.col += 1; + } else { + txt$1 = builder.cm.options.specialCharPlaceholder(m[0]); + txt$1.setAttribute("cm-text", m[0]); + if (ie && ie_version < 9) { + content.appendChild(elt("span", [txt$1])); + } else { + content.appendChild(txt$1); + } + builder.col += 1; + } + builder.map.push(builder.pos, builder.pos + 1, txt$1); + builder.pos++; + } + } + builder.trailingSpace = displayText.charCodeAt(text.length - 1) == 32; + if (style || startStyle || endStyle || mustWrap || css || attributes) { + var fullStyle = style || ""; + if (startStyle) { + fullStyle += startStyle; + } + if (endStyle) { + fullStyle += endStyle; + } + var token = elt("span", [content], fullStyle, css); + if (attributes) { + for (var attr in attributes) { + if (attributes.hasOwnProperty(attr) && attr != "style" && attr != "class") { + token.setAttribute(attr, attributes[attr]); + } + } + } + return builder.content.appendChild(token); + } + builder.content.appendChild(content); + } + function splitSpaces(text, trailingBefore) { + if (text.length > 1 && !/ /.test(text)) { + return text; + } + var spaceBefore = trailingBefore, result = ""; + for (var i2 = 0; i2 < text.length; i2++) { + var ch = text.charAt(i2); + if (ch == " " && spaceBefore && (i2 == text.length - 1 || text.charCodeAt(i2 + 1) == 32)) { + ch = "\xA0"; + } + result += ch; + spaceBefore = ch == " "; + } + return result; + } + function buildTokenBadBidi(inner, order) { + return function(builder, text, style, startStyle, endStyle, css, attributes) { + style = style ? style + " cm-force-border" : "cm-force-border"; + var start = builder.pos, end = start + text.length; + for (; ; ) { + var part = void 0; + for (var i2 = 0; i2 < order.length; i2++) { + part = order[i2]; + if (part.to > start && part.from <= start) { + break; + } + } + if (part.to >= end) { + return inner(builder, text, style, startStyle, endStyle, css, attributes); + } + inner(builder, text.slice(0, part.to - start), style, startStyle, null, css, attributes); + startStyle = null; + text = text.slice(part.to - start); + start = part.to; + } + }; + } + function buildCollapsedSpan(builder, size, marker, ignoreWidget) { + var widget = !ignoreWidget && marker.widgetNode; + if (widget) { + builder.map.push(builder.pos, builder.pos + size, widget); + } + if (!ignoreWidget && builder.cm.display.input.needsContentAttribute) { + if (!widget) { + widget = builder.content.appendChild(document.createElement("span")); + } + widget.setAttribute("cm-marker", marker.id); + } + if (widget) { + builder.cm.display.input.setUneditable(widget); + builder.content.appendChild(widget); + } + builder.pos += size; + builder.trailingSpace = false; + } + function insertLineContent(line, builder, styles) { + var spans = line.markedSpans, allText = line.text, at = 0; + if (!spans) { + for (var i$12 = 1; i$12 < styles.length; i$12 += 2) { + builder.addToken(builder, allText.slice(at, at = styles[i$12]), interpretTokenStyle(styles[i$12 + 1], builder.cm.options)); + } + return; + } + var len = allText.length, pos = 0, i2 = 1, text = "", style, css; + var nextChange = 0, spanStyle, spanEndStyle, spanStartStyle, collapsed, attributes; + for (; ; ) { + if (nextChange == pos) { + spanStyle = spanEndStyle = spanStartStyle = css = ""; + attributes = null; + collapsed = null; + nextChange = Infinity; + var foundBookmarks = [], endStyles = void 0; + for (var j = 0; j < spans.length; ++j) { + var sp = spans[j], m = sp.marker; + if (m.type == "bookmark" && sp.from == pos && m.widgetNode) { + foundBookmarks.push(m); + } else if (sp.from <= pos && (sp.to == null || sp.to > pos || m.collapsed && sp.to == pos && sp.from == pos)) { + if (sp.to != null && sp.to != pos && nextChange > sp.to) { + nextChange = sp.to; + spanEndStyle = ""; + } + if (m.className) { + spanStyle += " " + m.className; + } + if (m.css) { + css = (css ? css + ";" : "") + m.css; + } + if (m.startStyle && sp.from == pos) { + spanStartStyle += " " + m.startStyle; + } + if (m.endStyle && sp.to == nextChange) { + (endStyles || (endStyles = [])).push(m.endStyle, sp.to); + } + if (m.title) { + (attributes || (attributes = {})).title = m.title; + } + if (m.attributes) { + for (var attr in m.attributes) { + (attributes || (attributes = {}))[attr] = m.attributes[attr]; + } + } + if (m.collapsed && (!collapsed || compareCollapsedMarkers(collapsed.marker, m) < 0)) { + collapsed = sp; + } + } else if (sp.from > pos && nextChange > sp.from) { + nextChange = sp.from; + } + } + if (endStyles) { + for (var j$1 = 0; j$1 < endStyles.length; j$1 += 2) { + if (endStyles[j$1 + 1] == nextChange) { + spanEndStyle += " " + endStyles[j$1]; + } + } + } + if (!collapsed || collapsed.from == pos) { + for (var j$2 = 0; j$2 < foundBookmarks.length; ++j$2) { + buildCollapsedSpan(builder, 0, foundBookmarks[j$2]); + } + } + if (collapsed && (collapsed.from || 0) == pos) { + buildCollapsedSpan(builder, (collapsed.to == null ? len + 1 : collapsed.to) - pos, collapsed.marker, collapsed.from == null); + if (collapsed.to == null) { + return; + } + if (collapsed.to == pos) { + collapsed = false; + } + } + } + if (pos >= len) { + break; + } + var upto = Math.min(len, nextChange); + while (true) { + if (text) { + var end = pos + text.length; + if (!collapsed) { + var tokenText = end > upto ? text.slice(0, upto - pos) : text; + builder.addToken(builder, tokenText, style ? style + spanStyle : spanStyle, spanStartStyle, pos + tokenText.length == nextChange ? spanEndStyle : "", css, attributes); + } + if (end >= upto) { + text = text.slice(upto - pos); + pos = upto; + break; + } + pos = end; + spanStartStyle = ""; + } + text = allText.slice(at, at = styles[i2++]); + style = interpretTokenStyle(styles[i2++], builder.cm.options); + } + } + } + function LineView(doc, line, lineN) { + this.line = line; + this.rest = visualLineContinued(line); + this.size = this.rest ? lineNo(lst(this.rest)) - lineN + 1 : 1; + this.node = this.text = null; + this.hidden = lineIsHidden(doc, line); + } + function buildViewArray(cm, from, to) { + var array = [], nextPos; + for (var pos = from; pos < to; pos = nextPos) { + var view = new LineView(cm.doc, getLine(cm.doc, pos), pos); + nextPos = pos + view.size; + array.push(view); + } + return array; + } + var operationGroup = null; + function pushOperation(op) { + if (operationGroup) { + operationGroup.ops.push(op); + } else { + op.ownsGroup = operationGroup = { + ops: [op], + delayedCallbacks: [] + }; + } + } + function fireCallbacksForOps(group) { + var callbacks = group.delayedCallbacks, i2 = 0; + do { + for (; i2 < callbacks.length; i2++) { + callbacks[i2].call(null); + } + for (var j = 0; j < group.ops.length; j++) { + var op = group.ops[j]; + if (op.cursorActivityHandlers) { + while (op.cursorActivityCalled < op.cursorActivityHandlers.length) { + op.cursorActivityHandlers[op.cursorActivityCalled++].call(null, op.cm); + } + } + } + } while (i2 < callbacks.length); + } + function finishOperation(op, endCb) { + var group = op.ownsGroup; + if (!group) { + return; + } + try { + fireCallbacksForOps(group); + } finally { + operationGroup = null; + endCb(group); + } + } + var orphanDelayedCallbacks = null; + function signalLater(emitter, type) { + var arr = getHandlers(emitter, type); + if (!arr.length) { + return; + } + var args = Array.prototype.slice.call(arguments, 2), list; + if (operationGroup) { + list = operationGroup.delayedCallbacks; + } else if (orphanDelayedCallbacks) { + list = orphanDelayedCallbacks; + } else { + list = orphanDelayedCallbacks = []; + setTimeout(fireOrphanDelayed, 0); + } + var loop = function(i3) { + list.push(function() { + return arr[i3].apply(null, args); + }); + }; + for (var i2 = 0; i2 < arr.length; ++i2) + loop(i2); + } + function fireOrphanDelayed() { + var delayed = orphanDelayedCallbacks; + orphanDelayedCallbacks = null; + for (var i2 = 0; i2 < delayed.length; ++i2) { + delayed[i2](); + } + } + function updateLineForChanges(cm, lineView, lineN, dims) { + for (var j = 0; j < lineView.changes.length; j++) { + var type = lineView.changes[j]; + if (type == "text") { + updateLineText(cm, lineView); + } else if (type == "gutter") { + updateLineGutter(cm, lineView, lineN, dims); + } else if (type == "class") { + updateLineClasses(cm, lineView); + } else if (type == "widget") { + updateLineWidgets(cm, lineView, dims); + } + } + lineView.changes = null; + } + function ensureLineWrapped(lineView) { + if (lineView.node == lineView.text) { + lineView.node = elt("div", null, null, "position: relative"); + if (lineView.text.parentNode) { + lineView.text.parentNode.replaceChild(lineView.node, lineView.text); + } + lineView.node.appendChild(lineView.text); + if (ie && ie_version < 8) { + lineView.node.style.zIndex = 2; + } + } + return lineView.node; + } + function updateLineBackground(cm, lineView) { + var cls = lineView.bgClass ? lineView.bgClass + " " + (lineView.line.bgClass || "") : lineView.line.bgClass; + if (cls) { + cls += " CodeMirror-linebackground"; + } + if (lineView.background) { + if (cls) { + lineView.background.className = cls; + } else { + lineView.background.parentNode.removeChild(lineView.background); + lineView.background = null; + } + } else if (cls) { + var wrap = ensureLineWrapped(lineView); + lineView.background = wrap.insertBefore(elt("div", null, cls), wrap.firstChild); + cm.display.input.setUneditable(lineView.background); + } + } + function getLineContent(cm, lineView) { + var ext = cm.display.externalMeasured; + if (ext && ext.line == lineView.line) { + cm.display.externalMeasured = null; + lineView.measure = ext.measure; + return ext.built; + } + return buildLineContent(cm, lineView); + } + function updateLineText(cm, lineView) { + var cls = lineView.text.className; + var built = getLineContent(cm, lineView); + if (lineView.text == lineView.node) { + lineView.node = built.pre; + } + lineView.text.parentNode.replaceChild(built.pre, lineView.text); + lineView.text = built.pre; + if (built.bgClass != lineView.bgClass || built.textClass != lineView.textClass) { + lineView.bgClass = built.bgClass; + lineView.textClass = built.textClass; + updateLineClasses(cm, lineView); + } else if (cls) { + lineView.text.className = cls; + } + } + function updateLineClasses(cm, lineView) { + updateLineBackground(cm, lineView); + if (lineView.line.wrapClass) { + ensureLineWrapped(lineView).className = lineView.line.wrapClass; + } else if (lineView.node != lineView.text) { + lineView.node.className = ""; + } + var textClass = lineView.textClass ? lineView.textClass + " " + (lineView.line.textClass || "") : lineView.line.textClass; + lineView.text.className = textClass || ""; + } + function updateLineGutter(cm, lineView, lineN, dims) { + if (lineView.gutter) { + lineView.node.removeChild(lineView.gutter); + lineView.gutter = null; + } + if (lineView.gutterBackground) { + lineView.node.removeChild(lineView.gutterBackground); + lineView.gutterBackground = null; + } + if (lineView.line.gutterClass) { + var wrap = ensureLineWrapped(lineView); + lineView.gutterBackground = elt("div", null, "CodeMirror-gutter-background " + lineView.line.gutterClass, "left: " + (cm.options.fixedGutter ? dims.fixedPos : -dims.gutterTotalWidth) + "px; width: " + dims.gutterTotalWidth + "px"); + cm.display.input.setUneditable(lineView.gutterBackground); + wrap.insertBefore(lineView.gutterBackground, lineView.text); + } + var markers = lineView.line.gutterMarkers; + if (cm.options.lineNumbers || markers) { + var wrap$1 = ensureLineWrapped(lineView); + var gutterWrap = lineView.gutter = elt("div", null, "CodeMirror-gutter-wrapper", "left: " + (cm.options.fixedGutter ? dims.fixedPos : -dims.gutterTotalWidth) + "px"); + gutterWrap.setAttribute("aria-hidden", "true"); + cm.display.input.setUneditable(gutterWrap); + wrap$1.insertBefore(gutterWrap, lineView.text); + if (lineView.line.gutterClass) { + gutterWrap.className += " " + lineView.line.gutterClass; + } + if (cm.options.lineNumbers && (!markers || !markers["CodeMirror-linenumbers"])) { + lineView.lineNumber = gutterWrap.appendChild(elt("div", lineNumberFor(cm.options, lineN), "CodeMirror-linenumber CodeMirror-gutter-elt", "left: " + dims.gutterLeft["CodeMirror-linenumbers"] + "px; width: " + cm.display.lineNumInnerWidth + "px")); + } + if (markers) { + for (var k = 0; k < cm.display.gutterSpecs.length; ++k) { + var id = cm.display.gutterSpecs[k].className, found = markers.hasOwnProperty(id) && markers[id]; + if (found) { + gutterWrap.appendChild(elt("div", [found], "CodeMirror-gutter-elt", "left: " + dims.gutterLeft[id] + "px; width: " + dims.gutterWidth[id] + "px")); + } + } + } + } + } + function updateLineWidgets(cm, lineView, dims) { + if (lineView.alignable) { + lineView.alignable = null; + } + var isWidget = classTest("CodeMirror-linewidget"); + for (var node = lineView.node.firstChild, next = void 0; node; node = next) { + next = node.nextSibling; + if (isWidget.test(node.className)) { + lineView.node.removeChild(node); + } + } + insertLineWidgets(cm, lineView, dims); + } + function buildLineElement(cm, lineView, lineN, dims) { + var built = getLineContent(cm, lineView); + lineView.text = lineView.node = built.pre; + if (built.bgClass) { + lineView.bgClass = built.bgClass; + } + if (built.textClass) { + lineView.textClass = built.textClass; + } + updateLineClasses(cm, lineView); + updateLineGutter(cm, lineView, lineN, dims); + insertLineWidgets(cm, lineView, dims); + return lineView.node; + } + function insertLineWidgets(cm, lineView, dims) { + insertLineWidgetsFor(cm, lineView.line, lineView, dims, true); + if (lineView.rest) { + for (var i2 = 0; i2 < lineView.rest.length; i2++) { + insertLineWidgetsFor(cm, lineView.rest[i2], lineView, dims, false); + } + } + } + function insertLineWidgetsFor(cm, line, lineView, dims, allowAbove) { + if (!line.widgets) { + return; + } + var wrap = ensureLineWrapped(lineView); + for (var i2 = 0, ws = line.widgets; i2 < ws.length; ++i2) { + var widget = ws[i2], node = elt("div", [widget.node], "CodeMirror-linewidget" + (widget.className ? " " + widget.className : "")); + if (!widget.handleMouseEvents) { + node.setAttribute("cm-ignore-events", "true"); + } + positionLineWidget(widget, node, lineView, dims); + cm.display.input.setUneditable(node); + if (allowAbove && widget.above) { + wrap.insertBefore(node, lineView.gutter || lineView.text); + } else { + wrap.appendChild(node); + } + signalLater(widget, "redraw"); + } + } + function positionLineWidget(widget, node, lineView, dims) { + if (widget.noHScroll) { + (lineView.alignable || (lineView.alignable = [])).push(node); + var width = dims.wrapperWidth; + node.style.left = dims.fixedPos + "px"; + if (!widget.coverGutter) { + width -= dims.gutterTotalWidth; + node.style.paddingLeft = dims.gutterTotalWidth + "px"; + } + node.style.width = width + "px"; + } + if (widget.coverGutter) { + node.style.zIndex = 5; + node.style.position = "relative"; + if (!widget.noHScroll) { + node.style.marginLeft = -dims.gutterTotalWidth + "px"; + } + } + } + function widgetHeight(widget) { + if (widget.height != null) { + return widget.height; + } + var cm = widget.doc.cm; + if (!cm) { + return 0; + } + if (!contains(document.body, widget.node)) { + var parentStyle = "position: relative;"; + if (widget.coverGutter) { + parentStyle += "margin-left: -" + cm.display.gutters.offsetWidth + "px;"; + } + if (widget.noHScroll) { + parentStyle += "width: " + cm.display.wrapper.clientWidth + "px;"; + } + removeChildrenAndAdd(cm.display.measure, elt("div", [widget.node], null, parentStyle)); + } + return widget.height = widget.node.parentNode.offsetHeight; + } + function eventInWidget(display, e) { + for (var n = e_target(e); n != display.wrapper; n = n.parentNode) { + if (!n || n.nodeType == 1 && n.getAttribute("cm-ignore-events") == "true" || n.parentNode == display.sizer && n != display.mover) { + return true; + } + } + } + function paddingTop(display) { + return display.lineSpace.offsetTop; + } + function paddingVert(display) { + return display.mover.offsetHeight - display.lineSpace.offsetHeight; + } + function paddingH(display) { + if (display.cachedPaddingH) { + return display.cachedPaddingH; + } + var e = removeChildrenAndAdd(display.measure, elt("pre", "x", "CodeMirror-line-like")); + var style = window.getComputedStyle ? window.getComputedStyle(e) : e.currentStyle; + var data = { left: parseInt(style.paddingLeft), right: parseInt(style.paddingRight) }; + if (!isNaN(data.left) && !isNaN(data.right)) { + display.cachedPaddingH = data; + } + return data; + } + function scrollGap(cm) { + return scrollerGap - cm.display.nativeBarWidth; + } + function displayWidth(cm) { + return cm.display.scroller.clientWidth - scrollGap(cm) - cm.display.barWidth; + } + function displayHeight(cm) { + return cm.display.scroller.clientHeight - scrollGap(cm) - cm.display.barHeight; + } + function ensureLineHeights(cm, lineView, rect) { + var wrapping = cm.options.lineWrapping; + var curWidth = wrapping && displayWidth(cm); + if (!lineView.measure.heights || wrapping && lineView.measure.width != curWidth) { + var heights = lineView.measure.heights = []; + if (wrapping) { + lineView.measure.width = curWidth; + var rects = lineView.text.firstChild.getClientRects(); + for (var i2 = 0; i2 < rects.length - 1; i2++) { + var cur = rects[i2], next = rects[i2 + 1]; + if (Math.abs(cur.bottom - next.bottom) > 2) { + heights.push((cur.bottom + next.top) / 2 - rect.top); + } + } + } + heights.push(rect.bottom - rect.top); + } + } + function mapFromLineView(lineView, line, lineN) { + if (lineView.line == line) { + return { map: lineView.measure.map, cache: lineView.measure.cache }; + } + if (lineView.rest) { + for (var i2 = 0; i2 < lineView.rest.length; i2++) { + if (lineView.rest[i2] == line) { + return { map: lineView.measure.maps[i2], cache: lineView.measure.caches[i2] }; + } + } + for (var i$12 = 0; i$12 < lineView.rest.length; i$12++) { + if (lineNo(lineView.rest[i$12]) > lineN) { + return { map: lineView.measure.maps[i$12], cache: lineView.measure.caches[i$12], before: true }; + } + } + } + } + function updateExternalMeasurement(cm, line) { + line = visualLine(line); + var lineN = lineNo(line); + var view = cm.display.externalMeasured = new LineView(cm.doc, line, lineN); + view.lineN = lineN; + var built = view.built = buildLineContent(cm, view); + view.text = built.pre; + removeChildrenAndAdd(cm.display.lineMeasure, built.pre); + return view; + } + function measureChar(cm, line, ch, bias) { + return measureCharPrepared(cm, prepareMeasureForLine(cm, line), ch, bias); + } + function findViewForLine(cm, lineN) { + if (lineN >= cm.display.viewFrom && lineN < cm.display.viewTo) { + return cm.display.view[findViewIndex(cm, lineN)]; + } + var ext = cm.display.externalMeasured; + if (ext && lineN >= ext.lineN && lineN < ext.lineN + ext.size) { + return ext; + } + } + function prepareMeasureForLine(cm, line) { + var lineN = lineNo(line); + var view = findViewForLine(cm, lineN); + if (view && !view.text) { + view = null; + } else if (view && view.changes) { + updateLineForChanges(cm, view, lineN, getDimensions(cm)); + cm.curOp.forceUpdate = true; + } + if (!view) { + view = updateExternalMeasurement(cm, line); + } + var info = mapFromLineView(view, line, lineN); + return { + line, + view, + rect: null, + map: info.map, + cache: info.cache, + before: info.before, + hasHeights: false + }; + } + function measureCharPrepared(cm, prepared, ch, bias, varHeight) { + if (prepared.before) { + ch = -1; + } + var key = ch + (bias || ""), found; + if (prepared.cache.hasOwnProperty(key)) { + found = prepared.cache[key]; + } else { + if (!prepared.rect) { + prepared.rect = prepared.view.text.getBoundingClientRect(); + } + if (!prepared.hasHeights) { + ensureLineHeights(cm, prepared.view, prepared.rect); + prepared.hasHeights = true; + } + found = measureCharInner(cm, prepared, ch, bias); + if (!found.bogus) { + prepared.cache[key] = found; + } + } + return { + left: found.left, + right: found.right, + top: varHeight ? found.rtop : found.top, + bottom: varHeight ? found.rbottom : found.bottom + }; + } + var nullRect = { left: 0, right: 0, top: 0, bottom: 0 }; + function nodeAndOffsetInLineMap(map2, ch, bias) { + var node, start, end, collapse, mStart, mEnd; + for (var i2 = 0; i2 < map2.length; i2 += 3) { + mStart = map2[i2]; + mEnd = map2[i2 + 1]; + if (ch < mStart) { + start = 0; + end = 1; + collapse = "left"; + } else if (ch < mEnd) { + start = ch - mStart; + end = start + 1; + } else if (i2 == map2.length - 3 || ch == mEnd && map2[i2 + 3] > ch) { + end = mEnd - mStart; + start = end - 1; + if (ch >= mEnd) { + collapse = "right"; + } + } + if (start != null) { + node = map2[i2 + 2]; + if (mStart == mEnd && bias == (node.insertLeft ? "left" : "right")) { + collapse = bias; + } + if (bias == "left" && start == 0) { + while (i2 && map2[i2 - 2] == map2[i2 - 3] && map2[i2 - 1].insertLeft) { + node = map2[(i2 -= 3) + 2]; + collapse = "left"; + } + } + if (bias == "right" && start == mEnd - mStart) { + while (i2 < map2.length - 3 && map2[i2 + 3] == map2[i2 + 4] && !map2[i2 + 5].insertLeft) { + node = map2[(i2 += 3) + 2]; + collapse = "right"; + } + } + break; + } + } + return { node, start, end, collapse, coverStart: mStart, coverEnd: mEnd }; + } + function getUsefulRect(rects, bias) { + var rect = nullRect; + if (bias == "left") { + for (var i2 = 0; i2 < rects.length; i2++) { + if ((rect = rects[i2]).left != rect.right) { + break; + } + } + } else { + for (var i$12 = rects.length - 1; i$12 >= 0; i$12--) { + if ((rect = rects[i$12]).left != rect.right) { + break; + } + } + } + return rect; + } + function measureCharInner(cm, prepared, ch, bias) { + var place = nodeAndOffsetInLineMap(prepared.map, ch, bias); + var node = place.node, start = place.start, end = place.end, collapse = place.collapse; + var rect; + if (node.nodeType == 3) { + for (var i$12 = 0; i$12 < 4; i$12++) { + while (start && isExtendingChar(prepared.line.text.charAt(place.coverStart + start))) { + --start; + } + while (place.coverStart + end < place.coverEnd && isExtendingChar(prepared.line.text.charAt(place.coverStart + end))) { + ++end; + } + if (ie && ie_version < 9 && start == 0 && end == place.coverEnd - place.coverStart) { + rect = node.parentNode.getBoundingClientRect(); + } else { + rect = getUsefulRect(range(node, start, end).getClientRects(), bias); + } + if (rect.left || rect.right || start == 0) { + break; + } + end = start; + start = start - 1; + collapse = "right"; + } + if (ie && ie_version < 11) { + rect = maybeUpdateRectForZooming(cm.display.measure, rect); + } + } else { + if (start > 0) { + collapse = bias = "right"; + } + var rects; + if (cm.options.lineWrapping && (rects = node.getClientRects()).length > 1) { + rect = rects[bias == "right" ? rects.length - 1 : 0]; + } else { + rect = node.getBoundingClientRect(); + } + } + if (ie && ie_version < 9 && !start && (!rect || !rect.left && !rect.right)) { + var rSpan = node.parentNode.getClientRects()[0]; + if (rSpan) { + rect = { left: rSpan.left, right: rSpan.left + charWidth(cm.display), top: rSpan.top, bottom: rSpan.bottom }; + } else { + rect = nullRect; + } + } + var rtop = rect.top - prepared.rect.top, rbot = rect.bottom - prepared.rect.top; + var mid = (rtop + rbot) / 2; + var heights = prepared.view.measure.heights; + var i2 = 0; + for (; i2 < heights.length - 1; i2++) { + if (mid < heights[i2]) { + break; + } + } + var top = i2 ? heights[i2 - 1] : 0, bot = heights[i2]; + var result = { + left: (collapse == "right" ? rect.right : rect.left) - prepared.rect.left, + right: (collapse == "left" ? rect.left : rect.right) - prepared.rect.left, + top, + bottom: bot + }; + if (!rect.left && !rect.right) { + result.bogus = true; + } + if (!cm.options.singleCursorHeightPerLine) { + result.rtop = rtop; + result.rbottom = rbot; + } + return result; + } + function maybeUpdateRectForZooming(measure, rect) { + if (!window.screen || screen.logicalXDPI == null || screen.logicalXDPI == screen.deviceXDPI || !hasBadZoomedRects(measure)) { + return rect; + } + var scaleX = screen.logicalXDPI / screen.deviceXDPI; + var scaleY = screen.logicalYDPI / screen.deviceYDPI; + return { + left: rect.left * scaleX, + right: rect.right * scaleX, + top: rect.top * scaleY, + bottom: rect.bottom * scaleY + }; + } + function clearLineMeasurementCacheFor(lineView) { + if (lineView.measure) { + lineView.measure.cache = {}; + lineView.measure.heights = null; + if (lineView.rest) { + for (var i2 = 0; i2 < lineView.rest.length; i2++) { + lineView.measure.caches[i2] = {}; + } + } + } + } + function clearLineMeasurementCache(cm) { + cm.display.externalMeasure = null; + removeChildren(cm.display.lineMeasure); + for (var i2 = 0; i2 < cm.display.view.length; i2++) { + clearLineMeasurementCacheFor(cm.display.view[i2]); + } + } + function clearCaches(cm) { + clearLineMeasurementCache(cm); + cm.display.cachedCharWidth = cm.display.cachedTextHeight = cm.display.cachedPaddingH = null; + if (!cm.options.lineWrapping) { + cm.display.maxLineChanged = true; + } + cm.display.lineNumChars = null; + } + function pageScrollX() { + if (chrome && android) { + return -(document.body.getBoundingClientRect().left - parseInt(getComputedStyle(document.body).marginLeft)); + } + return window.pageXOffset || (document.documentElement || document.body).scrollLeft; + } + function pageScrollY() { + if (chrome && android) { + return -(document.body.getBoundingClientRect().top - parseInt(getComputedStyle(document.body).marginTop)); + } + return window.pageYOffset || (document.documentElement || document.body).scrollTop; + } + function widgetTopHeight(lineObj) { + var ref = visualLine(lineObj); + var widgets = ref.widgets; + var height = 0; + if (widgets) { + for (var i2 = 0; i2 < widgets.length; ++i2) { + if (widgets[i2].above) { + height += widgetHeight(widgets[i2]); + } + } + } + return height; + } + function intoCoordSystem(cm, lineObj, rect, context, includeWidgets) { + if (!includeWidgets) { + var height = widgetTopHeight(lineObj); + rect.top += height; + rect.bottom += height; + } + if (context == "line") { + return rect; + } + if (!context) { + context = "local"; + } + var yOff = heightAtLine(lineObj); + if (context == "local") { + yOff += paddingTop(cm.display); + } else { + yOff -= cm.display.viewOffset; + } + if (context == "page" || context == "window") { + var lOff = cm.display.lineSpace.getBoundingClientRect(); + yOff += lOff.top + (context == "window" ? 0 : pageScrollY()); + var xOff = lOff.left + (context == "window" ? 0 : pageScrollX()); + rect.left += xOff; + rect.right += xOff; + } + rect.top += yOff; + rect.bottom += yOff; + return rect; + } + function fromCoordSystem(cm, coords, context) { + if (context == "div") { + return coords; + } + var left = coords.left, top = coords.top; + if (context == "page") { + left -= pageScrollX(); + top -= pageScrollY(); + } else if (context == "local" || !context) { + var localBox = cm.display.sizer.getBoundingClientRect(); + left += localBox.left; + top += localBox.top; + } + var lineSpaceBox = cm.display.lineSpace.getBoundingClientRect(); + return { left: left - lineSpaceBox.left, top: top - lineSpaceBox.top }; + } + function charCoords(cm, pos, context, lineObj, bias) { + if (!lineObj) { + lineObj = getLine(cm.doc, pos.line); + } + return intoCoordSystem(cm, lineObj, measureChar(cm, lineObj, pos.ch, bias), context); + } + function cursorCoords(cm, pos, context, lineObj, preparedMeasure, varHeight) { + lineObj = lineObj || getLine(cm.doc, pos.line); + if (!preparedMeasure) { + preparedMeasure = prepareMeasureForLine(cm, lineObj); + } + function get(ch2, right) { + var m = measureCharPrepared(cm, preparedMeasure, ch2, right ? "right" : "left", varHeight); + if (right) { + m.left = m.right; + } else { + m.right = m.left; + } + return intoCoordSystem(cm, lineObj, m, context); + } + var order = getOrder(lineObj, cm.doc.direction), ch = pos.ch, sticky = pos.sticky; + if (ch >= lineObj.text.length) { + ch = lineObj.text.length; + sticky = "before"; + } else if (ch <= 0) { + ch = 0; + sticky = "after"; + } + if (!order) { + return get(sticky == "before" ? ch - 1 : ch, sticky == "before"); + } + function getBidi(ch2, partPos2, invert) { + var part = order[partPos2], right = part.level == 1; + return get(invert ? ch2 - 1 : ch2, right != invert); + } + var partPos = getBidiPartAt(order, ch, sticky); + var other = bidiOther; + var val = getBidi(ch, partPos, sticky == "before"); + if (other != null) { + val.other = getBidi(ch, other, sticky != "before"); + } + return val; + } + function estimateCoords(cm, pos) { + var left = 0; + pos = clipPos(cm.doc, pos); + if (!cm.options.lineWrapping) { + left = charWidth(cm.display) * pos.ch; + } + var lineObj = getLine(cm.doc, pos.line); + var top = heightAtLine(lineObj) + paddingTop(cm.display); + return { left, right: left, top, bottom: top + lineObj.height }; + } + function PosWithInfo(line, ch, sticky, outside, xRel) { + var pos = Pos(line, ch, sticky); + pos.xRel = xRel; + if (outside) { + pos.outside = outside; + } + return pos; + } + function coordsChar(cm, x, y) { + var doc = cm.doc; + y += cm.display.viewOffset; + if (y < 0) { + return PosWithInfo(doc.first, 0, null, -1, -1); + } + var lineN = lineAtHeight(doc, y), last = doc.first + doc.size - 1; + if (lineN > last) { + return PosWithInfo(doc.first + doc.size - 1, getLine(doc, last).text.length, null, 1, 1); + } + if (x < 0) { + x = 0; + } + var lineObj = getLine(doc, lineN); + for (; ; ) { + var found = coordsCharInner(cm, lineObj, lineN, x, y); + var collapsed = collapsedSpanAround(lineObj, found.ch + (found.xRel > 0 || found.outside > 0 ? 1 : 0)); + if (!collapsed) { + return found; + } + var rangeEnd = collapsed.find(1); + if (rangeEnd.line == lineN) { + return rangeEnd; + } + lineObj = getLine(doc, lineN = rangeEnd.line); + } + } + function wrappedLineExtent(cm, lineObj, preparedMeasure, y) { + y -= widgetTopHeight(lineObj); + var end = lineObj.text.length; + var begin = findFirst(function(ch) { + return measureCharPrepared(cm, preparedMeasure, ch - 1).bottom <= y; + }, end, 0); + end = findFirst(function(ch) { + return measureCharPrepared(cm, preparedMeasure, ch).top > y; + }, begin, end); + return { begin, end }; + } + function wrappedLineExtentChar(cm, lineObj, preparedMeasure, target) { + if (!preparedMeasure) { + preparedMeasure = prepareMeasureForLine(cm, lineObj); + } + var targetTop = intoCoordSystem(cm, lineObj, measureCharPrepared(cm, preparedMeasure, target), "line").top; + return wrappedLineExtent(cm, lineObj, preparedMeasure, targetTop); + } + function boxIsAfter(box, x, y, left) { + return box.bottom <= y ? false : box.top > y ? true : (left ? box.left : box.right) > x; + } + function coordsCharInner(cm, lineObj, lineNo2, x, y) { + y -= heightAtLine(lineObj); + var preparedMeasure = prepareMeasureForLine(cm, lineObj); + var widgetHeight2 = widgetTopHeight(lineObj); + var begin = 0, end = lineObj.text.length, ltr = true; + var order = getOrder(lineObj, cm.doc.direction); + if (order) { + var part = (cm.options.lineWrapping ? coordsBidiPartWrapped : coordsBidiPart)(cm, lineObj, lineNo2, preparedMeasure, order, x, y); + ltr = part.level != 1; + begin = ltr ? part.from : part.to - 1; + end = ltr ? part.to : part.from - 1; + } + var chAround = null, boxAround = null; + var ch = findFirst(function(ch2) { + var box = measureCharPrepared(cm, preparedMeasure, ch2); + box.top += widgetHeight2; + box.bottom += widgetHeight2; + if (!boxIsAfter(box, x, y, false)) { + return false; + } + if (box.top <= y && box.left <= x) { + chAround = ch2; + boxAround = box; + } + return true; + }, begin, end); + var baseX, sticky, outside = false; + if (boxAround) { + var atLeft = x - boxAround.left < boxAround.right - x, atStart = atLeft == ltr; + ch = chAround + (atStart ? 0 : 1); + sticky = atStart ? "after" : "before"; + baseX = atLeft ? boxAround.left : boxAround.right; + } else { + if (!ltr && (ch == end || ch == begin)) { + ch++; + } + sticky = ch == 0 ? "after" : ch == lineObj.text.length ? "before" : measureCharPrepared(cm, preparedMeasure, ch - (ltr ? 1 : 0)).bottom + widgetHeight2 <= y == ltr ? "after" : "before"; + var coords = cursorCoords(cm, Pos(lineNo2, ch, sticky), "line", lineObj, preparedMeasure); + baseX = coords.left; + outside = y < coords.top ? -1 : y >= coords.bottom ? 1 : 0; + } + ch = skipExtendingChars(lineObj.text, ch, 1); + return PosWithInfo(lineNo2, ch, sticky, outside, x - baseX); + } + function coordsBidiPart(cm, lineObj, lineNo2, preparedMeasure, order, x, y) { + var index = findFirst(function(i2) { + var part2 = order[i2], ltr2 = part2.level != 1; + return boxIsAfter(cursorCoords(cm, Pos(lineNo2, ltr2 ? part2.to : part2.from, ltr2 ? "before" : "after"), "line", lineObj, preparedMeasure), x, y, true); + }, 0, order.length - 1); + var part = order[index]; + if (index > 0) { + var ltr = part.level != 1; + var start = cursorCoords(cm, Pos(lineNo2, ltr ? part.from : part.to, ltr ? "after" : "before"), "line", lineObj, preparedMeasure); + if (boxIsAfter(start, x, y, true) && start.top > y) { + part = order[index - 1]; + } + } + return part; + } + function coordsBidiPartWrapped(cm, lineObj, _lineNo, preparedMeasure, order, x, y) { + var ref = wrappedLineExtent(cm, lineObj, preparedMeasure, y); + var begin = ref.begin; + var end = ref.end; + if (/\s/.test(lineObj.text.charAt(end - 1))) { + end--; + } + var part = null, closestDist = null; + for (var i2 = 0; i2 < order.length; i2++) { + var p = order[i2]; + if (p.from >= end || p.to <= begin) { + continue; + } + var ltr = p.level != 1; + var endX = measureCharPrepared(cm, preparedMeasure, ltr ? Math.min(end, p.to) - 1 : Math.max(begin, p.from)).right; + var dist = endX < x ? x - endX + 1e9 : endX - x; + if (!part || closestDist > dist) { + part = p; + closestDist = dist; + } + } + if (!part) { + part = order[order.length - 1]; + } + if (part.from < begin) { + part = { from: begin, to: part.to, level: part.level }; + } + if (part.to > end) { + part = { from: part.from, to: end, level: part.level }; + } + return part; + } + var measureText; + function textHeight(display) { + if (display.cachedTextHeight != null) { + return display.cachedTextHeight; + } + if (measureText == null) { + measureText = elt("pre", null, "CodeMirror-line-like"); + for (var i2 = 0; i2 < 49; ++i2) { + measureText.appendChild(document.createTextNode("x")); + measureText.appendChild(elt("br")); + } + measureText.appendChild(document.createTextNode("x")); + } + removeChildrenAndAdd(display.measure, measureText); + var height = measureText.offsetHeight / 50; + if (height > 3) { + display.cachedTextHeight = height; + } + removeChildren(display.measure); + return height || 1; + } + function charWidth(display) { + if (display.cachedCharWidth != null) { + return display.cachedCharWidth; + } + var anchor = elt("span", "xxxxxxxxxx"); + var pre = elt("pre", [anchor], "CodeMirror-line-like"); + removeChildrenAndAdd(display.measure, pre); + var rect = anchor.getBoundingClientRect(), width = (rect.right - rect.left) / 10; + if (width > 2) { + display.cachedCharWidth = width; + } + return width || 10; + } + function getDimensions(cm) { + var d = cm.display, left = {}, width = {}; + var gutterLeft = d.gutters.clientLeft; + for (var n = d.gutters.firstChild, i2 = 0; n; n = n.nextSibling, ++i2) { + var id = cm.display.gutterSpecs[i2].className; + left[id] = n.offsetLeft + n.clientLeft + gutterLeft; + width[id] = n.clientWidth; + } + return { + fixedPos: compensateForHScroll(d), + gutterTotalWidth: d.gutters.offsetWidth, + gutterLeft: left, + gutterWidth: width, + wrapperWidth: d.wrapper.clientWidth + }; + } + function compensateForHScroll(display) { + return display.scroller.getBoundingClientRect().left - display.sizer.getBoundingClientRect().left; + } + function estimateHeight(cm) { + var th = textHeight(cm.display), wrapping = cm.options.lineWrapping; + var perLine = wrapping && Math.max(5, cm.display.scroller.clientWidth / charWidth(cm.display) - 3); + return function(line) { + if (lineIsHidden(cm.doc, line)) { + return 0; + } + var widgetsHeight = 0; + if (line.widgets) { + for (var i2 = 0; i2 < line.widgets.length; i2++) { + if (line.widgets[i2].height) { + widgetsHeight += line.widgets[i2].height; + } + } + } + if (wrapping) { + return widgetsHeight + (Math.ceil(line.text.length / perLine) || 1) * th; + } else { + return widgetsHeight + th; + } + }; + } + function estimateLineHeights(cm) { + var doc = cm.doc, est = estimateHeight(cm); + doc.iter(function(line) { + var estHeight = est(line); + if (estHeight != line.height) { + updateLineHeight(line, estHeight); + } + }); + } + function posFromMouse(cm, e, liberal, forRect) { + var display = cm.display; + if (!liberal && e_target(e).getAttribute("cm-not-content") == "true") { + return null; + } + var x, y, space = display.lineSpace.getBoundingClientRect(); + try { + x = e.clientX - space.left; + y = e.clientY - space.top; + } catch (e$1) { + return null; + } + var coords = coordsChar(cm, x, y), line; + if (forRect && coords.xRel > 0 && (line = getLine(cm.doc, coords.line).text).length == coords.ch) { + var colDiff = countColumn(line, line.length, cm.options.tabSize) - line.length; + coords = Pos(coords.line, Math.max(0, Math.round((x - paddingH(cm.display).left) / charWidth(cm.display)) - colDiff)); + } + return coords; + } + function findViewIndex(cm, n) { + if (n >= cm.display.viewTo) { + return null; + } + n -= cm.display.viewFrom; + if (n < 0) { + return null; + } + var view = cm.display.view; + for (var i2 = 0; i2 < view.length; i2++) { + n -= view[i2].size; + if (n < 0) { + return i2; + } + } + } + function regChange(cm, from, to, lendiff) { + if (from == null) { + from = cm.doc.first; + } + if (to == null) { + to = cm.doc.first + cm.doc.size; + } + if (!lendiff) { + lendiff = 0; + } + var display = cm.display; + if (lendiff && to < display.viewTo && (display.updateLineNumbers == null || display.updateLineNumbers > from)) { + display.updateLineNumbers = from; + } + cm.curOp.viewChanged = true; + if (from >= display.viewTo) { + if (sawCollapsedSpans && visualLineNo(cm.doc, from) < display.viewTo) { + resetView(cm); + } + } else if (to <= display.viewFrom) { + if (sawCollapsedSpans && visualLineEndNo(cm.doc, to + lendiff) > display.viewFrom) { + resetView(cm); + } else { + display.viewFrom += lendiff; + display.viewTo += lendiff; + } + } else if (from <= display.viewFrom && to >= display.viewTo) { + resetView(cm); + } else if (from <= display.viewFrom) { + var cut = viewCuttingPoint(cm, to, to + lendiff, 1); + if (cut) { + display.view = display.view.slice(cut.index); + display.viewFrom = cut.lineN; + display.viewTo += lendiff; + } else { + resetView(cm); + } + } else if (to >= display.viewTo) { + var cut$1 = viewCuttingPoint(cm, from, from, -1); + if (cut$1) { + display.view = display.view.slice(0, cut$1.index); + display.viewTo = cut$1.lineN; + } else { + resetView(cm); + } + } else { + var cutTop = viewCuttingPoint(cm, from, from, -1); + var cutBot = viewCuttingPoint(cm, to, to + lendiff, 1); + if (cutTop && cutBot) { + display.view = display.view.slice(0, cutTop.index).concat(buildViewArray(cm, cutTop.lineN, cutBot.lineN)).concat(display.view.slice(cutBot.index)); + display.viewTo += lendiff; + } else { + resetView(cm); + } + } + var ext = display.externalMeasured; + if (ext) { + if (to < ext.lineN) { + ext.lineN += lendiff; + } else if (from < ext.lineN + ext.size) { + display.externalMeasured = null; + } + } + } + function regLineChange(cm, line, type) { + cm.curOp.viewChanged = true; + var display = cm.display, ext = cm.display.externalMeasured; + if (ext && line >= ext.lineN && line < ext.lineN + ext.size) { + display.externalMeasured = null; + } + if (line < display.viewFrom || line >= display.viewTo) { + return; + } + var lineView = display.view[findViewIndex(cm, line)]; + if (lineView.node == null) { + return; + } + var arr = lineView.changes || (lineView.changes = []); + if (indexOf(arr, type) == -1) { + arr.push(type); + } + } + function resetView(cm) { + cm.display.viewFrom = cm.display.viewTo = cm.doc.first; + cm.display.view = []; + cm.display.viewOffset = 0; + } + function viewCuttingPoint(cm, oldN, newN, dir) { + var index = findViewIndex(cm, oldN), diff, view = cm.display.view; + if (!sawCollapsedSpans || newN == cm.doc.first + cm.doc.size) { + return { index, lineN: newN }; + } + var n = cm.display.viewFrom; + for (var i2 = 0; i2 < index; i2++) { + n += view[i2].size; + } + if (n != oldN) { + if (dir > 0) { + if (index == view.length - 1) { + return null; + } + diff = n + view[index].size - oldN; + index++; + } else { + diff = n - oldN; + } + oldN += diff; + newN += diff; + } + while (visualLineNo(cm.doc, newN) != newN) { + if (index == (dir < 0 ? 0 : view.length - 1)) { + return null; + } + newN += dir * view[index - (dir < 0 ? 1 : 0)].size; + index += dir; + } + return { index, lineN: newN }; + } + function adjustView(cm, from, to) { + var display = cm.display, view = display.view; + if (view.length == 0 || from >= display.viewTo || to <= display.viewFrom) { + display.view = buildViewArray(cm, from, to); + display.viewFrom = from; + } else { + if (display.viewFrom > from) { + display.view = buildViewArray(cm, from, display.viewFrom).concat(display.view); + } else if (display.viewFrom < from) { + display.view = display.view.slice(findViewIndex(cm, from)); + } + display.viewFrom = from; + if (display.viewTo < to) { + display.view = display.view.concat(buildViewArray(cm, display.viewTo, to)); + } else if (display.viewTo > to) { + display.view = display.view.slice(0, findViewIndex(cm, to)); + } + } + display.viewTo = to; + } + function countDirtyView(cm) { + var view = cm.display.view, dirty = 0; + for (var i2 = 0; i2 < view.length; i2++) { + var lineView = view[i2]; + if (!lineView.hidden && (!lineView.node || lineView.changes)) { + ++dirty; + } + } + return dirty; + } + function updateSelection(cm) { + cm.display.input.showSelection(cm.display.input.prepareSelection()); + } + function prepareSelection(cm, primary) { + if (primary === void 0) + primary = true; + var doc = cm.doc, result = {}; + var curFragment = result.cursors = document.createDocumentFragment(); + var selFragment = result.selection = document.createDocumentFragment(); + var customCursor = cm.options.$customCursor; + if (customCursor) { + primary = true; + } + for (var i2 = 0; i2 < doc.sel.ranges.length; i2++) { + if (!primary && i2 == doc.sel.primIndex) { + continue; + } + var range2 = doc.sel.ranges[i2]; + if (range2.from().line >= cm.display.viewTo || range2.to().line < cm.display.viewFrom) { + continue; + } + var collapsed = range2.empty(); + if (customCursor) { + var head = customCursor(cm, range2); + if (head) { + drawSelectionCursor(cm, head, curFragment); + } + } else if (collapsed || cm.options.showCursorWhenSelecting) { + drawSelectionCursor(cm, range2.head, curFragment); + } + if (!collapsed) { + drawSelectionRange(cm, range2, selFragment); + } + } + return result; + } + function drawSelectionCursor(cm, head, output) { + var pos = cursorCoords(cm, head, "div", null, null, !cm.options.singleCursorHeightPerLine); + var cursor = output.appendChild(elt("div", "\xA0", "CodeMirror-cursor")); + cursor.style.left = pos.left + "px"; + cursor.style.top = pos.top + "px"; + cursor.style.height = Math.max(0, pos.bottom - pos.top) * cm.options.cursorHeight + "px"; + if (/\bcm-fat-cursor\b/.test(cm.getWrapperElement().className)) { + var charPos = charCoords(cm, head, "div", null, null); + var width = charPos.right - charPos.left; + cursor.style.width = (width > 0 ? width : cm.defaultCharWidth()) + "px"; + } + if (pos.other) { + var otherCursor = output.appendChild(elt("div", "\xA0", "CodeMirror-cursor CodeMirror-secondarycursor")); + otherCursor.style.display = ""; + otherCursor.style.left = pos.other.left + "px"; + otherCursor.style.top = pos.other.top + "px"; + otherCursor.style.height = (pos.other.bottom - pos.other.top) * 0.85 + "px"; + } + } + function cmpCoords(a, b) { + return a.top - b.top || a.left - b.left; + } + function drawSelectionRange(cm, range2, output) { + var display = cm.display, doc = cm.doc; + var fragment = document.createDocumentFragment(); + var padding = paddingH(cm.display), leftSide = padding.left; + var rightSide = Math.max(display.sizerWidth, displayWidth(cm) - display.sizer.offsetLeft) - padding.right; + var docLTR = doc.direction == "ltr"; + function add(left, top, width, bottom) { + if (top < 0) { + top = 0; + } + top = Math.round(top); + bottom = Math.round(bottom); + fragment.appendChild(elt("div", null, "CodeMirror-selected", "position: absolute; left: " + left + "px;\n top: " + top + "px; width: " + (width == null ? rightSide - left : width) + "px;\n height: " + (bottom - top) + "px")); + } + function drawForLine(line, fromArg, toArg) { + var lineObj = getLine(doc, line); + var lineLen = lineObj.text.length; + var start, end; + function coords(ch, bias) { + return charCoords(cm, Pos(line, ch), "div", lineObj, bias); + } + function wrapX(pos, dir, side) { + var extent = wrappedLineExtentChar(cm, lineObj, null, pos); + var prop2 = dir == "ltr" == (side == "after") ? "left" : "right"; + var ch = side == "after" ? extent.begin : extent.end - (/\s/.test(lineObj.text.charAt(extent.end - 1)) ? 2 : 1); + return coords(ch, prop2)[prop2]; + } + var order = getOrder(lineObj, doc.direction); + iterateBidiSections(order, fromArg || 0, toArg == null ? lineLen : toArg, function(from, to, dir, i2) { + var ltr = dir == "ltr"; + var fromPos = coords(from, ltr ? "left" : "right"); + var toPos = coords(to - 1, ltr ? "right" : "left"); + var openStart = fromArg == null && from == 0, openEnd = toArg == null && to == lineLen; + var first = i2 == 0, last = !order || i2 == order.length - 1; + if (toPos.top - fromPos.top <= 3) { + var openLeft = (docLTR ? openStart : openEnd) && first; + var openRight = (docLTR ? openEnd : openStart) && last; + var left = openLeft ? leftSide : (ltr ? fromPos : toPos).left; + var right = openRight ? rightSide : (ltr ? toPos : fromPos).right; + add(left, fromPos.top, right - left, fromPos.bottom); + } else { + var topLeft, topRight, botLeft, botRight; + if (ltr) { + topLeft = docLTR && openStart && first ? leftSide : fromPos.left; + topRight = docLTR ? rightSide : wrapX(from, dir, "before"); + botLeft = docLTR ? leftSide : wrapX(to, dir, "after"); + botRight = docLTR && openEnd && last ? rightSide : toPos.right; + } else { + topLeft = !docLTR ? leftSide : wrapX(from, dir, "before"); + topRight = !docLTR && openStart && first ? rightSide : fromPos.right; + botLeft = !docLTR && openEnd && last ? leftSide : toPos.left; + botRight = !docLTR ? rightSide : wrapX(to, dir, "after"); + } + add(topLeft, fromPos.top, topRight - topLeft, fromPos.bottom); + if (fromPos.bottom < toPos.top) { + add(leftSide, fromPos.bottom, null, toPos.top); + } + add(botLeft, toPos.top, botRight - botLeft, toPos.bottom); + } + if (!start || cmpCoords(fromPos, start) < 0) { + start = fromPos; + } + if (cmpCoords(toPos, start) < 0) { + start = toPos; + } + if (!end || cmpCoords(fromPos, end) < 0) { + end = fromPos; + } + if (cmpCoords(toPos, end) < 0) { + end = toPos; + } + }); + return { start, end }; + } + var sFrom = range2.from(), sTo = range2.to(); + if (sFrom.line == sTo.line) { + drawForLine(sFrom.line, sFrom.ch, sTo.ch); + } else { + var fromLine = getLine(doc, sFrom.line), toLine = getLine(doc, sTo.line); + var singleVLine = visualLine(fromLine) == visualLine(toLine); + var leftEnd = drawForLine(sFrom.line, sFrom.ch, singleVLine ? fromLine.text.length + 1 : null).end; + var rightStart = drawForLine(sTo.line, singleVLine ? 0 : null, sTo.ch).start; + if (singleVLine) { + if (leftEnd.top < rightStart.top - 2) { + add(leftEnd.right, leftEnd.top, null, leftEnd.bottom); + add(leftSide, rightStart.top, rightStart.left, rightStart.bottom); + } else { + add(leftEnd.right, leftEnd.top, rightStart.left - leftEnd.right, leftEnd.bottom); + } + } + if (leftEnd.bottom < rightStart.top) { + add(leftSide, leftEnd.bottom, null, rightStart.top); + } + } + output.appendChild(fragment); + } + function restartBlink(cm) { + if (!cm.state.focused) { + return; + } + var display = cm.display; + clearInterval(display.blinker); + var on2 = true; + display.cursorDiv.style.visibility = ""; + if (cm.options.cursorBlinkRate > 0) { + display.blinker = setInterval(function() { + if (!cm.hasFocus()) { + onBlur(cm); + } + display.cursorDiv.style.visibility = (on2 = !on2) ? "" : "hidden"; + }, cm.options.cursorBlinkRate); + } else if (cm.options.cursorBlinkRate < 0) { + display.cursorDiv.style.visibility = "hidden"; + } + } + function ensureFocus(cm) { + if (!cm.hasFocus()) { + cm.display.input.focus(); + if (!cm.state.focused) { + onFocus(cm); + } + } + } + function delayBlurEvent(cm) { + cm.state.delayingBlurEvent = true; + setTimeout(function() { + if (cm.state.delayingBlurEvent) { + cm.state.delayingBlurEvent = false; + if (cm.state.focused) { + onBlur(cm); + } + } + }, 100); + } + function onFocus(cm, e) { + if (cm.state.delayingBlurEvent && !cm.state.draggingText) { + cm.state.delayingBlurEvent = false; + } + if (cm.options.readOnly == "nocursor") { + return; + } + if (!cm.state.focused) { + signal(cm, "focus", cm, e); + cm.state.focused = true; + addClass(cm.display.wrapper, "CodeMirror-focused"); + if (!cm.curOp && cm.display.selForContextMenu != cm.doc.sel) { + cm.display.input.reset(); + if (webkit) { + setTimeout(function() { + return cm.display.input.reset(true); + }, 20); + } + } + cm.display.input.receivedFocus(); + } + restartBlink(cm); + } + function onBlur(cm, e) { + if (cm.state.delayingBlurEvent) { + return; + } + if (cm.state.focused) { + signal(cm, "blur", cm, e); + cm.state.focused = false; + rmClass(cm.display.wrapper, "CodeMirror-focused"); + } + clearInterval(cm.display.blinker); + setTimeout(function() { + if (!cm.state.focused) { + cm.display.shift = false; + } + }, 150); + } + function updateHeightsInViewport(cm) { + var display = cm.display; + var prevBottom = display.lineDiv.offsetTop; + var viewTop = Math.max(0, display.scroller.getBoundingClientRect().top); + var oldHeight = display.lineDiv.getBoundingClientRect().top; + var mustScroll = 0; + for (var i2 = 0; i2 < display.view.length; i2++) { + var cur = display.view[i2], wrapping = cm.options.lineWrapping; + var height = void 0, width = 0; + if (cur.hidden) { + continue; + } + oldHeight += cur.line.height; + if (ie && ie_version < 8) { + var bot = cur.node.offsetTop + cur.node.offsetHeight; + height = bot - prevBottom; + prevBottom = bot; + } else { + var box = cur.node.getBoundingClientRect(); + height = box.bottom - box.top; + if (!wrapping && cur.text.firstChild) { + width = cur.text.firstChild.getBoundingClientRect().right - box.left - 1; + } + } + var diff = cur.line.height - height; + if (diff > 5e-3 || diff < -5e-3) { + if (oldHeight < viewTop) { + mustScroll -= diff; + } + updateLineHeight(cur.line, height); + updateWidgetHeight(cur.line); + if (cur.rest) { + for (var j = 0; j < cur.rest.length; j++) { + updateWidgetHeight(cur.rest[j]); + } + } + } + if (width > cm.display.sizerWidth) { + var chWidth = Math.ceil(width / charWidth(cm.display)); + if (chWidth > cm.display.maxLineLength) { + cm.display.maxLineLength = chWidth; + cm.display.maxLine = cur.line; + cm.display.maxLineChanged = true; + } + } + } + if (Math.abs(mustScroll) > 2) { + display.scroller.scrollTop += mustScroll; + } + } + function updateWidgetHeight(line) { + if (line.widgets) { + for (var i2 = 0; i2 < line.widgets.length; ++i2) { + var w = line.widgets[i2], parent = w.node.parentNode; + if (parent) { + w.height = parent.offsetHeight; + } + } + } + } + function visibleLines(display, doc, viewport) { + var top = viewport && viewport.top != null ? Math.max(0, viewport.top) : display.scroller.scrollTop; + top = Math.floor(top - paddingTop(display)); + var bottom = viewport && viewport.bottom != null ? viewport.bottom : top + display.wrapper.clientHeight; + var from = lineAtHeight(doc, top), to = lineAtHeight(doc, bottom); + if (viewport && viewport.ensure) { + var ensureFrom = viewport.ensure.from.line, ensureTo = viewport.ensure.to.line; + if (ensureFrom < from) { + from = ensureFrom; + to = lineAtHeight(doc, heightAtLine(getLine(doc, ensureFrom)) + display.wrapper.clientHeight); + } else if (Math.min(ensureTo, doc.lastLine()) >= to) { + from = lineAtHeight(doc, heightAtLine(getLine(doc, ensureTo)) - display.wrapper.clientHeight); + to = ensureTo; + } + } + return { from, to: Math.max(to, from + 1) }; + } + function maybeScrollWindow(cm, rect) { + if (signalDOMEvent(cm, "scrollCursorIntoView")) { + return; + } + var display = cm.display, box = display.sizer.getBoundingClientRect(), doScroll = null; + if (rect.top + box.top < 0) { + doScroll = true; + } else if (rect.bottom + box.top > (window.innerHeight || document.documentElement.clientHeight)) { + doScroll = false; + } + if (doScroll != null && !phantom) { + var scrollNode = elt("div", "\u200B", null, "position: absolute;\n top: " + (rect.top - display.viewOffset - paddingTop(cm.display)) + "px;\n height: " + (rect.bottom - rect.top + scrollGap(cm) + display.barHeight) + "px;\n left: " + rect.left + "px; width: " + Math.max(2, rect.right - rect.left) + "px;"); + cm.display.lineSpace.appendChild(scrollNode); + scrollNode.scrollIntoView(doScroll); + cm.display.lineSpace.removeChild(scrollNode); + } + } + function scrollPosIntoView(cm, pos, end, margin) { + if (margin == null) { + margin = 0; + } + var rect; + if (!cm.options.lineWrapping && pos == end) { + end = pos.sticky == "before" ? Pos(pos.line, pos.ch + 1, "before") : pos; + pos = pos.ch ? Pos(pos.line, pos.sticky == "before" ? pos.ch - 1 : pos.ch, "after") : pos; + } + for (var limit = 0; limit < 5; limit++) { + var changed = false; + var coords = cursorCoords(cm, pos); + var endCoords = !end || end == pos ? coords : cursorCoords(cm, end); + rect = { + left: Math.min(coords.left, endCoords.left), + top: Math.min(coords.top, endCoords.top) - margin, + right: Math.max(coords.left, endCoords.left), + bottom: Math.max(coords.bottom, endCoords.bottom) + margin + }; + var scrollPos = calculateScrollPos(cm, rect); + var startTop = cm.doc.scrollTop, startLeft = cm.doc.scrollLeft; + if (scrollPos.scrollTop != null) { + updateScrollTop(cm, scrollPos.scrollTop); + if (Math.abs(cm.doc.scrollTop - startTop) > 1) { + changed = true; + } + } + if (scrollPos.scrollLeft != null) { + setScrollLeft(cm, scrollPos.scrollLeft); + if (Math.abs(cm.doc.scrollLeft - startLeft) > 1) { + changed = true; + } + } + if (!changed) { + break; + } + } + return rect; + } + function scrollIntoView(cm, rect) { + var scrollPos = calculateScrollPos(cm, rect); + if (scrollPos.scrollTop != null) { + updateScrollTop(cm, scrollPos.scrollTop); + } + if (scrollPos.scrollLeft != null) { + setScrollLeft(cm, scrollPos.scrollLeft); + } + } + function calculateScrollPos(cm, rect) { + var display = cm.display, snapMargin = textHeight(cm.display); + if (rect.top < 0) { + rect.top = 0; + } + var screentop = cm.curOp && cm.curOp.scrollTop != null ? cm.curOp.scrollTop : display.scroller.scrollTop; + var screen2 = displayHeight(cm), result = {}; + if (rect.bottom - rect.top > screen2) { + rect.bottom = rect.top + screen2; + } + var docBottom = cm.doc.height + paddingVert(display); + var atTop = rect.top < snapMargin, atBottom = rect.bottom > docBottom - snapMargin; + if (rect.top < screentop) { + result.scrollTop = atTop ? 0 : rect.top; + } else if (rect.bottom > screentop + screen2) { + var newTop = Math.min(rect.top, (atBottom ? docBottom : rect.bottom) - screen2); + if (newTop != screentop) { + result.scrollTop = newTop; + } + } + var gutterSpace = cm.options.fixedGutter ? 0 : display.gutters.offsetWidth; + var screenleft = cm.curOp && cm.curOp.scrollLeft != null ? cm.curOp.scrollLeft : display.scroller.scrollLeft - gutterSpace; + var screenw = displayWidth(cm) - display.gutters.offsetWidth; + var tooWide = rect.right - rect.left > screenw; + if (tooWide) { + rect.right = rect.left + screenw; + } + if (rect.left < 10) { + result.scrollLeft = 0; + } else if (rect.left < screenleft) { + result.scrollLeft = Math.max(0, rect.left + gutterSpace - (tooWide ? 0 : 10)); + } else if (rect.right > screenw + screenleft - 3) { + result.scrollLeft = rect.right + (tooWide ? 0 : 10) - screenw; + } + return result; + } + function addToScrollTop(cm, top) { + if (top == null) { + return; + } + resolveScrollToPos(cm); + cm.curOp.scrollTop = (cm.curOp.scrollTop == null ? cm.doc.scrollTop : cm.curOp.scrollTop) + top; + } + function ensureCursorVisible(cm) { + resolveScrollToPos(cm); + var cur = cm.getCursor(); + cm.curOp.scrollToPos = { from: cur, to: cur, margin: cm.options.cursorScrollMargin }; + } + function scrollToCoords(cm, x, y) { + if (x != null || y != null) { + resolveScrollToPos(cm); + } + if (x != null) { + cm.curOp.scrollLeft = x; + } + if (y != null) { + cm.curOp.scrollTop = y; + } + } + function scrollToRange(cm, range2) { + resolveScrollToPos(cm); + cm.curOp.scrollToPos = range2; + } + function resolveScrollToPos(cm) { + var range2 = cm.curOp.scrollToPos; + if (range2) { + cm.curOp.scrollToPos = null; + var from = estimateCoords(cm, range2.from), to = estimateCoords(cm, range2.to); + scrollToCoordsRange(cm, from, to, range2.margin); + } + } + function scrollToCoordsRange(cm, from, to, margin) { + var sPos = calculateScrollPos(cm, { + left: Math.min(from.left, to.left), + top: Math.min(from.top, to.top) - margin, + right: Math.max(from.right, to.right), + bottom: Math.max(from.bottom, to.bottom) + margin + }); + scrollToCoords(cm, sPos.scrollLeft, sPos.scrollTop); + } + function updateScrollTop(cm, val) { + if (Math.abs(cm.doc.scrollTop - val) < 2) { + return; + } + if (!gecko) { + updateDisplaySimple(cm, { top: val }); + } + setScrollTop(cm, val, true); + if (gecko) { + updateDisplaySimple(cm); + } + startWorker(cm, 100); + } + function setScrollTop(cm, val, forceScroll) { + val = Math.max(0, Math.min(cm.display.scroller.scrollHeight - cm.display.scroller.clientHeight, val)); + if (cm.display.scroller.scrollTop == val && !forceScroll) { + return; + } + cm.doc.scrollTop = val; + cm.display.scrollbars.setScrollTop(val); + if (cm.display.scroller.scrollTop != val) { + cm.display.scroller.scrollTop = val; + } + } + function setScrollLeft(cm, val, isScroller, forceScroll) { + val = Math.max(0, Math.min(val, cm.display.scroller.scrollWidth - cm.display.scroller.clientWidth)); + if ((isScroller ? val == cm.doc.scrollLeft : Math.abs(cm.doc.scrollLeft - val) < 2) && !forceScroll) { + return; + } + cm.doc.scrollLeft = val; + alignHorizontally(cm); + if (cm.display.scroller.scrollLeft != val) { + cm.display.scroller.scrollLeft = val; + } + cm.display.scrollbars.setScrollLeft(val); + } + function measureForScrollbars(cm) { + var d = cm.display, gutterW = d.gutters.offsetWidth; + var docH = Math.round(cm.doc.height + paddingVert(cm.display)); + return { + clientHeight: d.scroller.clientHeight, + viewHeight: d.wrapper.clientHeight, + scrollWidth: d.scroller.scrollWidth, + clientWidth: d.scroller.clientWidth, + viewWidth: d.wrapper.clientWidth, + barLeft: cm.options.fixedGutter ? gutterW : 0, + docHeight: docH, + scrollHeight: docH + scrollGap(cm) + d.barHeight, + nativeBarWidth: d.nativeBarWidth, + gutterWidth: gutterW + }; + } + var NativeScrollbars = function(place, scroll, cm) { + this.cm = cm; + var vert = this.vert = elt("div", [elt("div", null, null, "min-width: 1px")], "CodeMirror-vscrollbar"); + var horiz = this.horiz = elt("div", [elt("div", null, null, "height: 100%; min-height: 1px")], "CodeMirror-hscrollbar"); + vert.tabIndex = horiz.tabIndex = -1; + place(vert); + place(horiz); + on(vert, "scroll", function() { + if (vert.clientHeight) { + scroll(vert.scrollTop, "vertical"); + } + }); + on(horiz, "scroll", function() { + if (horiz.clientWidth) { + scroll(horiz.scrollLeft, "horizontal"); + } + }); + this.checkedZeroWidth = false; + if (ie && ie_version < 8) { + this.horiz.style.minHeight = this.vert.style.minWidth = "18px"; + } + }; + NativeScrollbars.prototype.update = function(measure) { + var needsH = measure.scrollWidth > measure.clientWidth + 1; + var needsV = measure.scrollHeight > measure.clientHeight + 1; + var sWidth = measure.nativeBarWidth; + if (needsV) { + this.vert.style.display = "block"; + this.vert.style.bottom = needsH ? sWidth + "px" : "0"; + var totalHeight = measure.viewHeight - (needsH ? sWidth : 0); + this.vert.firstChild.style.height = Math.max(0, measure.scrollHeight - measure.clientHeight + totalHeight) + "px"; + } else { + this.vert.scrollTop = 0; + this.vert.style.display = ""; + this.vert.firstChild.style.height = "0"; + } + if (needsH) { + this.horiz.style.display = "block"; + this.horiz.style.right = needsV ? sWidth + "px" : "0"; + this.horiz.style.left = measure.barLeft + "px"; + var totalWidth = measure.viewWidth - measure.barLeft - (needsV ? sWidth : 0); + this.horiz.firstChild.style.width = Math.max(0, measure.scrollWidth - measure.clientWidth + totalWidth) + "px"; + } else { + this.horiz.style.display = ""; + this.horiz.firstChild.style.width = "0"; + } + if (!this.checkedZeroWidth && measure.clientHeight > 0) { + if (sWidth == 0) { + this.zeroWidthHack(); + } + this.checkedZeroWidth = true; + } + return { right: needsV ? sWidth : 0, bottom: needsH ? sWidth : 0 }; + }; + NativeScrollbars.prototype.setScrollLeft = function(pos) { + if (this.horiz.scrollLeft != pos) { + this.horiz.scrollLeft = pos; + } + if (this.disableHoriz) { + this.enableZeroWidthBar(this.horiz, this.disableHoriz, "horiz"); + } + }; + NativeScrollbars.prototype.setScrollTop = function(pos) { + if (this.vert.scrollTop != pos) { + this.vert.scrollTop = pos; + } + if (this.disableVert) { + this.enableZeroWidthBar(this.vert, this.disableVert, "vert"); + } + }; + NativeScrollbars.prototype.zeroWidthHack = function() { + var w = mac && !mac_geMountainLion ? "12px" : "18px"; + this.horiz.style.height = this.vert.style.width = w; + this.horiz.style.visibility = this.vert.style.visibility = "hidden"; + this.disableHoriz = new Delayed(); + this.disableVert = new Delayed(); + }; + NativeScrollbars.prototype.enableZeroWidthBar = function(bar, delay, type) { + bar.style.visibility = ""; + function maybeDisable() { + var box = bar.getBoundingClientRect(); + var elt2 = type == "vert" ? document.elementFromPoint(box.right - 1, (box.top + box.bottom) / 2) : document.elementFromPoint((box.right + box.left) / 2, box.bottom - 1); + if (elt2 != bar) { + bar.style.visibility = "hidden"; + } else { + delay.set(1e3, maybeDisable); + } + } + delay.set(1e3, maybeDisable); + }; + NativeScrollbars.prototype.clear = function() { + var parent = this.horiz.parentNode; + parent.removeChild(this.horiz); + parent.removeChild(this.vert); + }; + var NullScrollbars = function() { + }; + NullScrollbars.prototype.update = function() { + return { bottom: 0, right: 0 }; + }; + NullScrollbars.prototype.setScrollLeft = function() { + }; + NullScrollbars.prototype.setScrollTop = function() { + }; + NullScrollbars.prototype.clear = function() { + }; + function updateScrollbars(cm, measure) { + if (!measure) { + measure = measureForScrollbars(cm); + } + var startWidth = cm.display.barWidth, startHeight = cm.display.barHeight; + updateScrollbarsInner(cm, measure); + for (var i2 = 0; i2 < 4 && startWidth != cm.display.barWidth || startHeight != cm.display.barHeight; i2++) { + if (startWidth != cm.display.barWidth && cm.options.lineWrapping) { + updateHeightsInViewport(cm); + } + updateScrollbarsInner(cm, measureForScrollbars(cm)); + startWidth = cm.display.barWidth; + startHeight = cm.display.barHeight; + } + } + function updateScrollbarsInner(cm, measure) { + var d = cm.display; + var sizes = d.scrollbars.update(measure); + d.sizer.style.paddingRight = (d.barWidth = sizes.right) + "px"; + d.sizer.style.paddingBottom = (d.barHeight = sizes.bottom) + "px"; + d.heightForcer.style.borderBottom = sizes.bottom + "px solid transparent"; + if (sizes.right && sizes.bottom) { + d.scrollbarFiller.style.display = "block"; + d.scrollbarFiller.style.height = sizes.bottom + "px"; + d.scrollbarFiller.style.width = sizes.right + "px"; + } else { + d.scrollbarFiller.style.display = ""; + } + if (sizes.bottom && cm.options.coverGutterNextToScrollbar && cm.options.fixedGutter) { + d.gutterFiller.style.display = "block"; + d.gutterFiller.style.height = sizes.bottom + "px"; + d.gutterFiller.style.width = measure.gutterWidth + "px"; + } else { + d.gutterFiller.style.display = ""; + } + } + var scrollbarModel = { "native": NativeScrollbars, "null": NullScrollbars }; + function initScrollbars(cm) { + if (cm.display.scrollbars) { + cm.display.scrollbars.clear(); + if (cm.display.scrollbars.addClass) { + rmClass(cm.display.wrapper, cm.display.scrollbars.addClass); + } + } + cm.display.scrollbars = new scrollbarModel[cm.options.scrollbarStyle](function(node) { + cm.display.wrapper.insertBefore(node, cm.display.scrollbarFiller); + on(node, "mousedown", function() { + if (cm.state.focused) { + setTimeout(function() { + return cm.display.input.focus(); + }, 0); + } + }); + node.setAttribute("cm-not-content", "true"); + }, function(pos, axis) { + if (axis == "horizontal") { + setScrollLeft(cm, pos); + } else { + updateScrollTop(cm, pos); + } + }, cm); + if (cm.display.scrollbars.addClass) { + addClass(cm.display.wrapper, cm.display.scrollbars.addClass); + } + } + var nextOpId = 0; + function startOperation(cm) { + cm.curOp = { + cm, + viewChanged: false, + startHeight: cm.doc.height, + forceUpdate: false, + updateInput: 0, + typing: false, + changeObjs: null, + cursorActivityHandlers: null, + cursorActivityCalled: 0, + selectionChanged: false, + updateMaxLine: false, + scrollLeft: null, + scrollTop: null, + scrollToPos: null, + focus: false, + id: ++nextOpId, + markArrays: null + }; + pushOperation(cm.curOp); + } + function endOperation(cm) { + var op = cm.curOp; + if (op) { + finishOperation(op, function(group) { + for (var i2 = 0; i2 < group.ops.length; i2++) { + group.ops[i2].cm.curOp = null; + } + endOperations(group); + }); + } + } + function endOperations(group) { + var ops = group.ops; + for (var i2 = 0; i2 < ops.length; i2++) { + endOperation_R1(ops[i2]); + } + for (var i$12 = 0; i$12 < ops.length; i$12++) { + endOperation_W1(ops[i$12]); + } + for (var i$22 = 0; i$22 < ops.length; i$22++) { + endOperation_R2(ops[i$22]); + } + for (var i$3 = 0; i$3 < ops.length; i$3++) { + endOperation_W2(ops[i$3]); + } + for (var i$4 = 0; i$4 < ops.length; i$4++) { + endOperation_finish(ops[i$4]); + } + } + function endOperation_R1(op) { + var cm = op.cm, display = cm.display; + maybeClipScrollbars(cm); + if (op.updateMaxLine) { + findMaxLine(cm); + } + op.mustUpdate = op.viewChanged || op.forceUpdate || op.scrollTop != null || op.scrollToPos && (op.scrollToPos.from.line < display.viewFrom || op.scrollToPos.to.line >= display.viewTo) || display.maxLineChanged && cm.options.lineWrapping; + op.update = op.mustUpdate && new DisplayUpdate(cm, op.mustUpdate && { top: op.scrollTop, ensure: op.scrollToPos }, op.forceUpdate); + } + function endOperation_W1(op) { + op.updatedDisplay = op.mustUpdate && updateDisplayIfNeeded(op.cm, op.update); + } + function endOperation_R2(op) { + var cm = op.cm, display = cm.display; + if (op.updatedDisplay) { + updateHeightsInViewport(cm); + } + op.barMeasure = measureForScrollbars(cm); + if (display.maxLineChanged && !cm.options.lineWrapping) { + op.adjustWidthTo = measureChar(cm, display.maxLine, display.maxLine.text.length).left + 3; + cm.display.sizerWidth = op.adjustWidthTo; + op.barMeasure.scrollWidth = Math.max(display.scroller.clientWidth, display.sizer.offsetLeft + op.adjustWidthTo + scrollGap(cm) + cm.display.barWidth); + op.maxScrollLeft = Math.max(0, display.sizer.offsetLeft + op.adjustWidthTo - displayWidth(cm)); + } + if (op.updatedDisplay || op.selectionChanged) { + op.preparedSelection = display.input.prepareSelection(); + } + } + function endOperation_W2(op) { + var cm = op.cm; + if (op.adjustWidthTo != null) { + cm.display.sizer.style.minWidth = op.adjustWidthTo + "px"; + if (op.maxScrollLeft < cm.doc.scrollLeft) { + setScrollLeft(cm, Math.min(cm.display.scroller.scrollLeft, op.maxScrollLeft), true); + } + cm.display.maxLineChanged = false; + } + var takeFocus = op.focus && op.focus == activeElt(); + if (op.preparedSelection) { + cm.display.input.showSelection(op.preparedSelection, takeFocus); + } + if (op.updatedDisplay || op.startHeight != cm.doc.height) { + updateScrollbars(cm, op.barMeasure); + } + if (op.updatedDisplay) { + setDocumentHeight(cm, op.barMeasure); + } + if (op.selectionChanged) { + restartBlink(cm); + } + if (cm.state.focused && op.updateInput) { + cm.display.input.reset(op.typing); + } + if (takeFocus) { + ensureFocus(op.cm); + } + } + function endOperation_finish(op) { + var cm = op.cm, display = cm.display, doc = cm.doc; + if (op.updatedDisplay) { + postUpdateDisplay(cm, op.update); + } + if (display.wheelStartX != null && (op.scrollTop != null || op.scrollLeft != null || op.scrollToPos)) { + display.wheelStartX = display.wheelStartY = null; + } + if (op.scrollTop != null) { + setScrollTop(cm, op.scrollTop, op.forceScroll); + } + if (op.scrollLeft != null) { + setScrollLeft(cm, op.scrollLeft, true, true); + } + if (op.scrollToPos) { + var rect = scrollPosIntoView(cm, clipPos(doc, op.scrollToPos.from), clipPos(doc, op.scrollToPos.to), op.scrollToPos.margin); + maybeScrollWindow(cm, rect); + } + var hidden = op.maybeHiddenMarkers, unhidden = op.maybeUnhiddenMarkers; + if (hidden) { + for (var i2 = 0; i2 < hidden.length; ++i2) { + if (!hidden[i2].lines.length) { + signal(hidden[i2], "hide"); + } + } + } + if (unhidden) { + for (var i$12 = 0; i$12 < unhidden.length; ++i$12) { + if (unhidden[i$12].lines.length) { + signal(unhidden[i$12], "unhide"); + } + } + } + if (display.wrapper.offsetHeight) { + doc.scrollTop = cm.display.scroller.scrollTop; + } + if (op.changeObjs) { + signal(cm, "changes", cm, op.changeObjs); + } + if (op.update) { + op.update.finish(); + } + } + function runInOp(cm, f) { + if (cm.curOp) { + return f(); + } + startOperation(cm); + try { + return f(); + } finally { + endOperation(cm); + } + } + function operation(cm, f) { + return function() { + if (cm.curOp) { + return f.apply(cm, arguments); + } + startOperation(cm); + try { + return f.apply(cm, arguments); + } finally { + endOperation(cm); + } + }; + } + function methodOp(f) { + return function() { + if (this.curOp) { + return f.apply(this, arguments); + } + startOperation(this); + try { + return f.apply(this, arguments); + } finally { + endOperation(this); + } + }; + } + function docMethodOp(f) { + return function() { + var cm = this.cm; + if (!cm || cm.curOp) { + return f.apply(this, arguments); + } + startOperation(cm); + try { + return f.apply(this, arguments); + } finally { + endOperation(cm); + } + }; + } + function startWorker(cm, time) { + if (cm.doc.highlightFrontier < cm.display.viewTo) { + cm.state.highlight.set(time, bind(highlightWorker, cm)); + } + } + function highlightWorker(cm) { + var doc = cm.doc; + if (doc.highlightFrontier >= cm.display.viewTo) { + return; + } + var end = +new Date() + cm.options.workTime; + var context = getContextBefore(cm, doc.highlightFrontier); + var changedLines = []; + doc.iter(context.line, Math.min(doc.first + doc.size, cm.display.viewTo + 500), function(line) { + if (context.line >= cm.display.viewFrom) { + var oldStyles = line.styles; + var resetState = line.text.length > cm.options.maxHighlightLength ? copyState(doc.mode, context.state) : null; + var highlighted = highlightLine(cm, line, context, true); + if (resetState) { + context.state = resetState; + } + line.styles = highlighted.styles; + var oldCls = line.styleClasses, newCls = highlighted.classes; + if (newCls) { + line.styleClasses = newCls; + } else if (oldCls) { + line.styleClasses = null; + } + var ischange = !oldStyles || oldStyles.length != line.styles.length || oldCls != newCls && (!oldCls || !newCls || oldCls.bgClass != newCls.bgClass || oldCls.textClass != newCls.textClass); + for (var i2 = 0; !ischange && i2 < oldStyles.length; ++i2) { + ischange = oldStyles[i2] != line.styles[i2]; + } + if (ischange) { + changedLines.push(context.line); + } + line.stateAfter = context.save(); + context.nextLine(); + } else { + if (line.text.length <= cm.options.maxHighlightLength) { + processLine(cm, line.text, context); + } + line.stateAfter = context.line % 5 == 0 ? context.save() : null; + context.nextLine(); + } + if (+new Date() > end) { + startWorker(cm, cm.options.workDelay); + return true; + } + }); + doc.highlightFrontier = context.line; + doc.modeFrontier = Math.max(doc.modeFrontier, context.line); + if (changedLines.length) { + runInOp(cm, function() { + for (var i2 = 0; i2 < changedLines.length; i2++) { + regLineChange(cm, changedLines[i2], "text"); + } + }); + } + } + var DisplayUpdate = function(cm, viewport, force) { + var display = cm.display; + this.viewport = viewport; + this.visible = visibleLines(display, cm.doc, viewport); + this.editorIsHidden = !display.wrapper.offsetWidth; + this.wrapperHeight = display.wrapper.clientHeight; + this.wrapperWidth = display.wrapper.clientWidth; + this.oldDisplayWidth = displayWidth(cm); + this.force = force; + this.dims = getDimensions(cm); + this.events = []; + }; + DisplayUpdate.prototype.signal = function(emitter, type) { + if (hasHandler(emitter, type)) { + this.events.push(arguments); + } + }; + DisplayUpdate.prototype.finish = function() { + for (var i2 = 0; i2 < this.events.length; i2++) { + signal.apply(null, this.events[i2]); + } + }; + function maybeClipScrollbars(cm) { + var display = cm.display; + if (!display.scrollbarsClipped && display.scroller.offsetWidth) { + display.nativeBarWidth = display.scroller.offsetWidth - display.scroller.clientWidth; + display.heightForcer.style.height = scrollGap(cm) + "px"; + display.sizer.style.marginBottom = -display.nativeBarWidth + "px"; + display.sizer.style.borderRightWidth = scrollGap(cm) + "px"; + display.scrollbarsClipped = true; + } + } + function selectionSnapshot(cm) { + if (cm.hasFocus()) { + return null; + } + var active = activeElt(); + if (!active || !contains(cm.display.lineDiv, active)) { + return null; + } + var result = { activeElt: active }; + if (window.getSelection) { + var sel = window.getSelection(); + if (sel.anchorNode && sel.extend && contains(cm.display.lineDiv, sel.anchorNode)) { + result.anchorNode = sel.anchorNode; + result.anchorOffset = sel.anchorOffset; + result.focusNode = sel.focusNode; + result.focusOffset = sel.focusOffset; + } + } + return result; + } + function restoreSelection(snapshot) { + if (!snapshot || !snapshot.activeElt || snapshot.activeElt == activeElt()) { + return; + } + snapshot.activeElt.focus(); + if (!/^(INPUT|TEXTAREA)$/.test(snapshot.activeElt.nodeName) && snapshot.anchorNode && contains(document.body, snapshot.anchorNode) && contains(document.body, snapshot.focusNode)) { + var sel = window.getSelection(), range2 = document.createRange(); + range2.setEnd(snapshot.anchorNode, snapshot.anchorOffset); + range2.collapse(false); + sel.removeAllRanges(); + sel.addRange(range2); + sel.extend(snapshot.focusNode, snapshot.focusOffset); + } + } + function updateDisplayIfNeeded(cm, update) { + var display = cm.display, doc = cm.doc; + if (update.editorIsHidden) { + resetView(cm); + return false; + } + if (!update.force && update.visible.from >= display.viewFrom && update.visible.to <= display.viewTo && (display.updateLineNumbers == null || display.updateLineNumbers >= display.viewTo) && display.renderedView == display.view && countDirtyView(cm) == 0) { + return false; + } + if (maybeUpdateLineNumberWidth(cm)) { + resetView(cm); + update.dims = getDimensions(cm); + } + var end = doc.first + doc.size; + var from = Math.max(update.visible.from - cm.options.viewportMargin, doc.first); + var to = Math.min(end, update.visible.to + cm.options.viewportMargin); + if (display.viewFrom < from && from - display.viewFrom < 20) { + from = Math.max(doc.first, display.viewFrom); + } + if (display.viewTo > to && display.viewTo - to < 20) { + to = Math.min(end, display.viewTo); + } + if (sawCollapsedSpans) { + from = visualLineNo(cm.doc, from); + to = visualLineEndNo(cm.doc, to); + } + var different = from != display.viewFrom || to != display.viewTo || display.lastWrapHeight != update.wrapperHeight || display.lastWrapWidth != update.wrapperWidth; + adjustView(cm, from, to); + display.viewOffset = heightAtLine(getLine(cm.doc, display.viewFrom)); + cm.display.mover.style.top = display.viewOffset + "px"; + var toUpdate = countDirtyView(cm); + if (!different && toUpdate == 0 && !update.force && display.renderedView == display.view && (display.updateLineNumbers == null || display.updateLineNumbers >= display.viewTo)) { + return false; + } + var selSnapshot = selectionSnapshot(cm); + if (toUpdate > 4) { + display.lineDiv.style.display = "none"; + } + patchDisplay(cm, display.updateLineNumbers, update.dims); + if (toUpdate > 4) { + display.lineDiv.style.display = ""; + } + display.renderedView = display.view; + restoreSelection(selSnapshot); + removeChildren(display.cursorDiv); + removeChildren(display.selectionDiv); + display.gutters.style.height = display.sizer.style.minHeight = 0; + if (different) { + display.lastWrapHeight = update.wrapperHeight; + display.lastWrapWidth = update.wrapperWidth; + startWorker(cm, 400); + } + display.updateLineNumbers = null; + return true; + } + function postUpdateDisplay(cm, update) { + var viewport = update.viewport; + for (var first = true; ; first = false) { + if (!first || !cm.options.lineWrapping || update.oldDisplayWidth == displayWidth(cm)) { + if (viewport && viewport.top != null) { + viewport = { top: Math.min(cm.doc.height + paddingVert(cm.display) - displayHeight(cm), viewport.top) }; + } + update.visible = visibleLines(cm.display, cm.doc, viewport); + if (update.visible.from >= cm.display.viewFrom && update.visible.to <= cm.display.viewTo) { + break; + } + } else if (first) { + update.visible = visibleLines(cm.display, cm.doc, viewport); + } + if (!updateDisplayIfNeeded(cm, update)) { + break; + } + updateHeightsInViewport(cm); + var barMeasure = measureForScrollbars(cm); + updateSelection(cm); + updateScrollbars(cm, barMeasure); + setDocumentHeight(cm, barMeasure); + update.force = false; + } + update.signal(cm, "update", cm); + if (cm.display.viewFrom != cm.display.reportedViewFrom || cm.display.viewTo != cm.display.reportedViewTo) { + update.signal(cm, "viewportChange", cm, cm.display.viewFrom, cm.display.viewTo); + cm.display.reportedViewFrom = cm.display.viewFrom; + cm.display.reportedViewTo = cm.display.viewTo; + } + } + function updateDisplaySimple(cm, viewport) { + var update = new DisplayUpdate(cm, viewport); + if (updateDisplayIfNeeded(cm, update)) { + updateHeightsInViewport(cm); + postUpdateDisplay(cm, update); + var barMeasure = measureForScrollbars(cm); + updateSelection(cm); + updateScrollbars(cm, barMeasure); + setDocumentHeight(cm, barMeasure); + update.finish(); + } + } + function patchDisplay(cm, updateNumbersFrom, dims) { + var display = cm.display, lineNumbers = cm.options.lineNumbers; + var container = display.lineDiv, cur = container.firstChild; + function rm(node2) { + var next = node2.nextSibling; + if (webkit && mac && cm.display.currentWheelTarget == node2) { + node2.style.display = "none"; + } else { + node2.parentNode.removeChild(node2); + } + return next; + } + var view = display.view, lineN = display.viewFrom; + for (var i2 = 0; i2 < view.length; i2++) { + var lineView = view[i2]; + if (lineView.hidden) + ; + else if (!lineView.node || lineView.node.parentNode != container) { + var node = buildLineElement(cm, lineView, lineN, dims); + container.insertBefore(node, cur); + } else { + while (cur != lineView.node) { + cur = rm(cur); + } + var updateNumber = lineNumbers && updateNumbersFrom != null && updateNumbersFrom <= lineN && lineView.lineNumber; + if (lineView.changes) { + if (indexOf(lineView.changes, "gutter") > -1) { + updateNumber = false; + } + updateLineForChanges(cm, lineView, lineN, dims); + } + if (updateNumber) { + removeChildren(lineView.lineNumber); + lineView.lineNumber.appendChild(document.createTextNode(lineNumberFor(cm.options, lineN))); + } + cur = lineView.node.nextSibling; + } + lineN += lineView.size; + } + while (cur) { + cur = rm(cur); + } + } + function updateGutterSpace(display) { + var width = display.gutters.offsetWidth; + display.sizer.style.marginLeft = width + "px"; + signalLater(display, "gutterChanged", display); + } + function setDocumentHeight(cm, measure) { + cm.display.sizer.style.minHeight = measure.docHeight + "px"; + cm.display.heightForcer.style.top = measure.docHeight + "px"; + cm.display.gutters.style.height = measure.docHeight + cm.display.barHeight + scrollGap(cm) + "px"; + } + function alignHorizontally(cm) { + var display = cm.display, view = display.view; + if (!display.alignWidgets && (!display.gutters.firstChild || !cm.options.fixedGutter)) { + return; + } + var comp = compensateForHScroll(display) - display.scroller.scrollLeft + cm.doc.scrollLeft; + var gutterW = display.gutters.offsetWidth, left = comp + "px"; + for (var i2 = 0; i2 < view.length; i2++) { + if (!view[i2].hidden) { + if (cm.options.fixedGutter) { + if (view[i2].gutter) { + view[i2].gutter.style.left = left; + } + if (view[i2].gutterBackground) { + view[i2].gutterBackground.style.left = left; + } + } + var align = view[i2].alignable; + if (align) { + for (var j = 0; j < align.length; j++) { + align[j].style.left = left; + } + } + } + } + if (cm.options.fixedGutter) { + display.gutters.style.left = comp + gutterW + "px"; + } + } + function maybeUpdateLineNumberWidth(cm) { + if (!cm.options.lineNumbers) { + return false; + } + var doc = cm.doc, last = lineNumberFor(cm.options, doc.first + doc.size - 1), display = cm.display; + if (last.length != display.lineNumChars) { + var test = display.measure.appendChild(elt("div", [elt("div", last)], "CodeMirror-linenumber CodeMirror-gutter-elt")); + var innerW = test.firstChild.offsetWidth, padding = test.offsetWidth - innerW; + display.lineGutter.style.width = ""; + display.lineNumInnerWidth = Math.max(innerW, display.lineGutter.offsetWidth - padding) + 1; + display.lineNumWidth = display.lineNumInnerWidth + padding; + display.lineNumChars = display.lineNumInnerWidth ? last.length : -1; + display.lineGutter.style.width = display.lineNumWidth + "px"; + updateGutterSpace(cm.display); + return true; + } + return false; + } + function getGutters(gutters, lineNumbers) { + var result = [], sawLineNumbers = false; + for (var i2 = 0; i2 < gutters.length; i2++) { + var name = gutters[i2], style = null; + if (typeof name != "string") { + style = name.style; + name = name.className; + } + if (name == "CodeMirror-linenumbers") { + if (!lineNumbers) { + continue; + } else { + sawLineNumbers = true; + } + } + result.push({ className: name, style }); + } + if (lineNumbers && !sawLineNumbers) { + result.push({ className: "CodeMirror-linenumbers", style: null }); + } + return result; + } + function renderGutters(display) { + var gutters = display.gutters, specs = display.gutterSpecs; + removeChildren(gutters); + display.lineGutter = null; + for (var i2 = 0; i2 < specs.length; ++i2) { + var ref = specs[i2]; + var className = ref.className; + var style = ref.style; + var gElt = gutters.appendChild(elt("div", null, "CodeMirror-gutter " + className)); + if (style) { + gElt.style.cssText = style; + } + if (className == "CodeMirror-linenumbers") { + display.lineGutter = gElt; + gElt.style.width = (display.lineNumWidth || 1) + "px"; + } + } + gutters.style.display = specs.length ? "" : "none"; + updateGutterSpace(display); + } + function updateGutters(cm) { + renderGutters(cm.display); + regChange(cm); + alignHorizontally(cm); + } + function Display(place, doc, input, options) { + var d = this; + this.input = input; + d.scrollbarFiller = elt("div", null, "CodeMirror-scrollbar-filler"); + d.scrollbarFiller.setAttribute("cm-not-content", "true"); + d.gutterFiller = elt("div", null, "CodeMirror-gutter-filler"); + d.gutterFiller.setAttribute("cm-not-content", "true"); + d.lineDiv = eltP("div", null, "CodeMirror-code"); + d.selectionDiv = elt("div", null, null, "position: relative; z-index: 1"); + d.cursorDiv = elt("div", null, "CodeMirror-cursors"); + d.measure = elt("div", null, "CodeMirror-measure"); + d.lineMeasure = elt("div", null, "CodeMirror-measure"); + d.lineSpace = eltP("div", [d.measure, d.lineMeasure, d.selectionDiv, d.cursorDiv, d.lineDiv], null, "position: relative; outline: none"); + var lines = eltP("div", [d.lineSpace], "CodeMirror-lines"); + d.mover = elt("div", [lines], null, "position: relative"); + d.sizer = elt("div", [d.mover], "CodeMirror-sizer"); + d.sizerWidth = null; + d.heightForcer = elt("div", null, null, "position: absolute; height: " + scrollerGap + "px; width: 1px;"); + d.gutters = elt("div", null, "CodeMirror-gutters"); + d.lineGutter = null; + d.scroller = elt("div", [d.sizer, d.heightForcer, d.gutters], "CodeMirror-scroll"); + d.scroller.setAttribute("tabIndex", "-1"); + d.wrapper = elt("div", [d.scrollbarFiller, d.gutterFiller, d.scroller], "CodeMirror"); + d.wrapper.setAttribute("translate", "no"); + if (ie && ie_version < 8) { + d.gutters.style.zIndex = -1; + d.scroller.style.paddingRight = 0; + } + if (!webkit && !(gecko && mobile)) { + d.scroller.draggable = true; + } + if (place) { + if (place.appendChild) { + place.appendChild(d.wrapper); + } else { + place(d.wrapper); + } + } + d.viewFrom = d.viewTo = doc.first; + d.reportedViewFrom = d.reportedViewTo = doc.first; + d.view = []; + d.renderedView = null; + d.externalMeasured = null; + d.viewOffset = 0; + d.lastWrapHeight = d.lastWrapWidth = 0; + d.updateLineNumbers = null; + d.nativeBarWidth = d.barHeight = d.barWidth = 0; + d.scrollbarsClipped = false; + d.lineNumWidth = d.lineNumInnerWidth = d.lineNumChars = null; + d.alignWidgets = false; + d.cachedCharWidth = d.cachedTextHeight = d.cachedPaddingH = null; + d.maxLine = null; + d.maxLineLength = 0; + d.maxLineChanged = false; + d.wheelDX = d.wheelDY = d.wheelStartX = d.wheelStartY = null; + d.shift = false; + d.selForContextMenu = null; + d.activeTouch = null; + d.gutterSpecs = getGutters(options.gutters, options.lineNumbers); + renderGutters(d); + input.init(d); + } + var wheelSamples = 0, wheelPixelsPerUnit = null; + if (ie) { + wheelPixelsPerUnit = -0.53; + } else if (gecko) { + wheelPixelsPerUnit = 15; + } else if (chrome) { + wheelPixelsPerUnit = -0.7; + } else if (safari) { + wheelPixelsPerUnit = -1 / 3; + } + function wheelEventDelta(e) { + var dx = e.wheelDeltaX, dy = e.wheelDeltaY; + if (dx == null && e.detail && e.axis == e.HORIZONTAL_AXIS) { + dx = e.detail; + } + if (dy == null && e.detail && e.axis == e.VERTICAL_AXIS) { + dy = e.detail; + } else if (dy == null) { + dy = e.wheelDelta; + } + return { x: dx, y: dy }; + } + function wheelEventPixels(e) { + var delta = wheelEventDelta(e); + delta.x *= wheelPixelsPerUnit; + delta.y *= wheelPixelsPerUnit; + return delta; + } + function onScrollWheel(cm, e) { + if (chrome && chrome_version >= 102) { + if (cm.display.chromeScrollHack == null) { + cm.display.sizer.style.pointerEvents = "none"; + } else { + clearTimeout(cm.display.chromeScrollHack); + } + cm.display.chromeScrollHack = setTimeout(function() { + cm.display.chromeScrollHack = null; + cm.display.sizer.style.pointerEvents = ""; + }, 100); + } + var delta = wheelEventDelta(e), dx = delta.x, dy = delta.y; + var pixelsPerUnit = wheelPixelsPerUnit; + if (e.deltaMode === 0) { + dx = e.deltaX; + dy = e.deltaY; + pixelsPerUnit = 1; + } + var display = cm.display, scroll = display.scroller; + var canScrollX = scroll.scrollWidth > scroll.clientWidth; + var canScrollY = scroll.scrollHeight > scroll.clientHeight; + if (!(dx && canScrollX || dy && canScrollY)) { + return; + } + if (dy && mac && webkit) { + outer: + for (var cur = e.target, view = display.view; cur != scroll; cur = cur.parentNode) { + for (var i2 = 0; i2 < view.length; i2++) { + if (view[i2].node == cur) { + cm.display.currentWheelTarget = cur; + break outer; + } + } + } + } + if (dx && !gecko && !presto && pixelsPerUnit != null) { + if (dy && canScrollY) { + updateScrollTop(cm, Math.max(0, scroll.scrollTop + dy * pixelsPerUnit)); + } + setScrollLeft(cm, Math.max(0, scroll.scrollLeft + dx * pixelsPerUnit)); + if (!dy || dy && canScrollY) { + e_preventDefault(e); + } + display.wheelStartX = null; + return; + } + if (dy && pixelsPerUnit != null) { + var pixels = dy * pixelsPerUnit; + var top = cm.doc.scrollTop, bot = top + display.wrapper.clientHeight; + if (pixels < 0) { + top = Math.max(0, top + pixels - 50); + } else { + bot = Math.min(cm.doc.height, bot + pixels + 50); + } + updateDisplaySimple(cm, { top, bottom: bot }); + } + if (wheelSamples < 20 && e.deltaMode !== 0) { + if (display.wheelStartX == null) { + display.wheelStartX = scroll.scrollLeft; + display.wheelStartY = scroll.scrollTop; + display.wheelDX = dx; + display.wheelDY = dy; + setTimeout(function() { + if (display.wheelStartX == null) { + return; + } + var movedX = scroll.scrollLeft - display.wheelStartX; + var movedY = scroll.scrollTop - display.wheelStartY; + var sample = movedY && display.wheelDY && movedY / display.wheelDY || movedX && display.wheelDX && movedX / display.wheelDX; + display.wheelStartX = display.wheelStartY = null; + if (!sample) { + return; + } + wheelPixelsPerUnit = (wheelPixelsPerUnit * wheelSamples + sample) / (wheelSamples + 1); + ++wheelSamples; + }, 200); + } else { + display.wheelDX += dx; + display.wheelDY += dy; + } + } + } + var Selection = function(ranges, primIndex) { + this.ranges = ranges; + this.primIndex = primIndex; + }; + Selection.prototype.primary = function() { + return this.ranges[this.primIndex]; + }; + Selection.prototype.equals = function(other) { + if (other == this) { + return true; + } + if (other.primIndex != this.primIndex || other.ranges.length != this.ranges.length) { + return false; + } + for (var i2 = 0; i2 < this.ranges.length; i2++) { + var here = this.ranges[i2], there = other.ranges[i2]; + if (!equalCursorPos(here.anchor, there.anchor) || !equalCursorPos(here.head, there.head)) { + return false; + } + } + return true; + }; + Selection.prototype.deepCopy = function() { + var out = []; + for (var i2 = 0; i2 < this.ranges.length; i2++) { + out[i2] = new Range(copyPos(this.ranges[i2].anchor), copyPos(this.ranges[i2].head)); + } + return new Selection(out, this.primIndex); + }; + Selection.prototype.somethingSelected = function() { + for (var i2 = 0; i2 < this.ranges.length; i2++) { + if (!this.ranges[i2].empty()) { + return true; + } + } + return false; + }; + Selection.prototype.contains = function(pos, end) { + if (!end) { + end = pos; + } + for (var i2 = 0; i2 < this.ranges.length; i2++) { + var range2 = this.ranges[i2]; + if (cmp(end, range2.from()) >= 0 && cmp(pos, range2.to()) <= 0) { + return i2; + } + } + return -1; + }; + var Range = function(anchor, head) { + this.anchor = anchor; + this.head = head; + }; + Range.prototype.from = function() { + return minPos(this.anchor, this.head); + }; + Range.prototype.to = function() { + return maxPos(this.anchor, this.head); + }; + Range.prototype.empty = function() { + return this.head.line == this.anchor.line && this.head.ch == this.anchor.ch; + }; + function normalizeSelection(cm, ranges, primIndex) { + var mayTouch = cm && cm.options.selectionsMayTouch; + var prim = ranges[primIndex]; + ranges.sort(function(a, b) { + return cmp(a.from(), b.from()); + }); + primIndex = indexOf(ranges, prim); + for (var i2 = 1; i2 < ranges.length; i2++) { + var cur = ranges[i2], prev = ranges[i2 - 1]; + var diff = cmp(prev.to(), cur.from()); + if (mayTouch && !cur.empty() ? diff > 0 : diff >= 0) { + var from = minPos(prev.from(), cur.from()), to = maxPos(prev.to(), cur.to()); + var inv = prev.empty() ? cur.from() == cur.head : prev.from() == prev.head; + if (i2 <= primIndex) { + --primIndex; + } + ranges.splice(--i2, 2, new Range(inv ? to : from, inv ? from : to)); + } + } + return new Selection(ranges, primIndex); + } + function simpleSelection(anchor, head) { + return new Selection([new Range(anchor, head || anchor)], 0); + } + function changeEnd(change) { + if (!change.text) { + return change.to; + } + return Pos(change.from.line + change.text.length - 1, lst(change.text).length + (change.text.length == 1 ? change.from.ch : 0)); + } + function adjustForChange(pos, change) { + if (cmp(pos, change.from) < 0) { + return pos; + } + if (cmp(pos, change.to) <= 0) { + return changeEnd(change); + } + var line = pos.line + change.text.length - (change.to.line - change.from.line) - 1, ch = pos.ch; + if (pos.line == change.to.line) { + ch += changeEnd(change).ch - change.to.ch; + } + return Pos(line, ch); + } + function computeSelAfterChange(doc, change) { + var out = []; + for (var i2 = 0; i2 < doc.sel.ranges.length; i2++) { + var range2 = doc.sel.ranges[i2]; + out.push(new Range(adjustForChange(range2.anchor, change), adjustForChange(range2.head, change))); + } + return normalizeSelection(doc.cm, out, doc.sel.primIndex); + } + function offsetPos(pos, old, nw) { + if (pos.line == old.line) { + return Pos(nw.line, pos.ch - old.ch + nw.ch); + } else { + return Pos(nw.line + (pos.line - old.line), pos.ch); + } + } + function computeReplacedSel(doc, changes, hint) { + var out = []; + var oldPrev = Pos(doc.first, 0), newPrev = oldPrev; + for (var i2 = 0; i2 < changes.length; i2++) { + var change = changes[i2]; + var from = offsetPos(change.from, oldPrev, newPrev); + var to = offsetPos(changeEnd(change), oldPrev, newPrev); + oldPrev = change.to; + newPrev = to; + if (hint == "around") { + var range2 = doc.sel.ranges[i2], inv = cmp(range2.head, range2.anchor) < 0; + out[i2] = new Range(inv ? to : from, inv ? from : to); + } else { + out[i2] = new Range(from, from); + } + } + return new Selection(out, doc.sel.primIndex); + } + function loadMode(cm) { + cm.doc.mode = getMode(cm.options, cm.doc.modeOption); + resetModeState(cm); + } + function resetModeState(cm) { + cm.doc.iter(function(line) { + if (line.stateAfter) { + line.stateAfter = null; + } + if (line.styles) { + line.styles = null; + } + }); + cm.doc.modeFrontier = cm.doc.highlightFrontier = cm.doc.first; + startWorker(cm, 100); + cm.state.modeGen++; + if (cm.curOp) { + regChange(cm); + } + } + function isWholeLineUpdate(doc, change) { + return change.from.ch == 0 && change.to.ch == 0 && lst(change.text) == "" && (!doc.cm || doc.cm.options.wholeLineUpdateBefore); + } + function updateDoc(doc, change, markedSpans, estimateHeight2) { + function spansFor(n) { + return markedSpans ? markedSpans[n] : null; + } + function update(line, text2, spans) { + updateLine(line, text2, spans, estimateHeight2); + signalLater(line, "change", line, change); + } + function linesFor(start, end) { + var result = []; + for (var i2 = start; i2 < end; ++i2) { + result.push(new Line(text[i2], spansFor(i2), estimateHeight2)); + } + return result; + } + var from = change.from, to = change.to, text = change.text; + var firstLine = getLine(doc, from.line), lastLine = getLine(doc, to.line); + var lastText = lst(text), lastSpans = spansFor(text.length - 1), nlines = to.line - from.line; + if (change.full) { + doc.insert(0, linesFor(0, text.length)); + doc.remove(text.length, doc.size - text.length); + } else if (isWholeLineUpdate(doc, change)) { + var added = linesFor(0, text.length - 1); + update(lastLine, lastLine.text, lastSpans); + if (nlines) { + doc.remove(from.line, nlines); + } + if (added.length) { + doc.insert(from.line, added); + } + } else if (firstLine == lastLine) { + if (text.length == 1) { + update(firstLine, firstLine.text.slice(0, from.ch) + lastText + firstLine.text.slice(to.ch), lastSpans); + } else { + var added$1 = linesFor(1, text.length - 1); + added$1.push(new Line(lastText + firstLine.text.slice(to.ch), lastSpans, estimateHeight2)); + update(firstLine, firstLine.text.slice(0, from.ch) + text[0], spansFor(0)); + doc.insert(from.line + 1, added$1); + } + } else if (text.length == 1) { + update(firstLine, firstLine.text.slice(0, from.ch) + text[0] + lastLine.text.slice(to.ch), spansFor(0)); + doc.remove(from.line + 1, nlines); + } else { + update(firstLine, firstLine.text.slice(0, from.ch) + text[0], spansFor(0)); + update(lastLine, lastText + lastLine.text.slice(to.ch), lastSpans); + var added$2 = linesFor(1, text.length - 1); + if (nlines > 1) { + doc.remove(from.line + 1, nlines - 1); + } + doc.insert(from.line + 1, added$2); + } + signalLater(doc, "change", doc, change); + } + function linkedDocs(doc, f, sharedHistOnly) { + function propagate(doc2, skip, sharedHist) { + if (doc2.linked) { + for (var i2 = 0; i2 < doc2.linked.length; ++i2) { + var rel = doc2.linked[i2]; + if (rel.doc == skip) { + continue; + } + var shared = sharedHist && rel.sharedHist; + if (sharedHistOnly && !shared) { + continue; + } + f(rel.doc, shared); + propagate(rel.doc, doc2, shared); + } + } + } + propagate(doc, null, true); + } + function attachDoc(cm, doc) { + if (doc.cm) { + throw new Error("This document is already in use."); + } + cm.doc = doc; + doc.cm = cm; + estimateLineHeights(cm); + loadMode(cm); + setDirectionClass(cm); + cm.options.direction = doc.direction; + if (!cm.options.lineWrapping) { + findMaxLine(cm); + } + cm.options.mode = doc.modeOption; + regChange(cm); + } + function setDirectionClass(cm) { + (cm.doc.direction == "rtl" ? addClass : rmClass)(cm.display.lineDiv, "CodeMirror-rtl"); + } + function directionChanged(cm) { + runInOp(cm, function() { + setDirectionClass(cm); + regChange(cm); + }); + } + function History(prev) { + this.done = []; + this.undone = []; + this.undoDepth = prev ? prev.undoDepth : Infinity; + this.lastModTime = this.lastSelTime = 0; + this.lastOp = this.lastSelOp = null; + this.lastOrigin = this.lastSelOrigin = null; + this.generation = this.maxGeneration = prev ? prev.maxGeneration : 1; + } + function historyChangeFromChange(doc, change) { + var histChange = { from: copyPos(change.from), to: changeEnd(change), text: getBetween(doc, change.from, change.to) }; + attachLocalSpans(doc, histChange, change.from.line, change.to.line + 1); + linkedDocs(doc, function(doc2) { + return attachLocalSpans(doc2, histChange, change.from.line, change.to.line + 1); + }, true); + return histChange; + } + function clearSelectionEvents(array) { + while (array.length) { + var last = lst(array); + if (last.ranges) { + array.pop(); + } else { + break; + } + } + } + function lastChangeEvent(hist, force) { + if (force) { + clearSelectionEvents(hist.done); + return lst(hist.done); + } else if (hist.done.length && !lst(hist.done).ranges) { + return lst(hist.done); + } else if (hist.done.length > 1 && !hist.done[hist.done.length - 2].ranges) { + hist.done.pop(); + return lst(hist.done); + } + } + function addChangeToHistory(doc, change, selAfter, opId) { + var hist = doc.history; + hist.undone.length = 0; + var time = +new Date(), cur; + var last; + if ((hist.lastOp == opId || hist.lastOrigin == change.origin && change.origin && (change.origin.charAt(0) == "+" && hist.lastModTime > time - (doc.cm ? doc.cm.options.historyEventDelay : 500) || change.origin.charAt(0) == "*")) && (cur = lastChangeEvent(hist, hist.lastOp == opId))) { + last = lst(cur.changes); + if (cmp(change.from, change.to) == 0 && cmp(change.from, last.to) == 0) { + last.to = changeEnd(change); + } else { + cur.changes.push(historyChangeFromChange(doc, change)); + } + } else { + var before = lst(hist.done); + if (!before || !before.ranges) { + pushSelectionToHistory(doc.sel, hist.done); + } + cur = { + changes: [historyChangeFromChange(doc, change)], + generation: hist.generation + }; + hist.done.push(cur); + while (hist.done.length > hist.undoDepth) { + hist.done.shift(); + if (!hist.done[0].ranges) { + hist.done.shift(); + } + } + } + hist.done.push(selAfter); + hist.generation = ++hist.maxGeneration; + hist.lastModTime = hist.lastSelTime = time; + hist.lastOp = hist.lastSelOp = opId; + hist.lastOrigin = hist.lastSelOrigin = change.origin; + if (!last) { + signal(doc, "historyAdded"); + } + } + function selectionEventCanBeMerged(doc, origin, prev, sel) { + var ch = origin.charAt(0); + return ch == "*" || ch == "+" && prev.ranges.length == sel.ranges.length && prev.somethingSelected() == sel.somethingSelected() && new Date() - doc.history.lastSelTime <= (doc.cm ? doc.cm.options.historyEventDelay : 500); + } + function addSelectionToHistory(doc, sel, opId, options) { + var hist = doc.history, origin = options && options.origin; + if (opId == hist.lastSelOp || origin && hist.lastSelOrigin == origin && (hist.lastModTime == hist.lastSelTime && hist.lastOrigin == origin || selectionEventCanBeMerged(doc, origin, lst(hist.done), sel))) { + hist.done[hist.done.length - 1] = sel; + } else { + pushSelectionToHistory(sel, hist.done); + } + hist.lastSelTime = +new Date(); + hist.lastSelOrigin = origin; + hist.lastSelOp = opId; + if (options && options.clearRedo !== false) { + clearSelectionEvents(hist.undone); + } + } + function pushSelectionToHistory(sel, dest) { + var top = lst(dest); + if (!(top && top.ranges && top.equals(sel))) { + dest.push(sel); + } + } + function attachLocalSpans(doc, change, from, to) { + var existing = change["spans_" + doc.id], n = 0; + doc.iter(Math.max(doc.first, from), Math.min(doc.first + doc.size, to), function(line) { + if (line.markedSpans) { + (existing || (existing = change["spans_" + doc.id] = {}))[n] = line.markedSpans; + } + ++n; + }); + } + function removeClearedSpans(spans) { + if (!spans) { + return null; + } + var out; + for (var i2 = 0; i2 < spans.length; ++i2) { + if (spans[i2].marker.explicitlyCleared) { + if (!out) { + out = spans.slice(0, i2); + } + } else if (out) { + out.push(spans[i2]); + } + } + return !out ? spans : out.length ? out : null; + } + function getOldSpans(doc, change) { + var found = change["spans_" + doc.id]; + if (!found) { + return null; + } + var nw = []; + for (var i2 = 0; i2 < change.text.length; ++i2) { + nw.push(removeClearedSpans(found[i2])); + } + return nw; + } + function mergeOldSpans(doc, change) { + var old = getOldSpans(doc, change); + var stretched = stretchSpansOverChange(doc, change); + if (!old) { + return stretched; + } + if (!stretched) { + return old; + } + for (var i2 = 0; i2 < old.length; ++i2) { + var oldCur = old[i2], stretchCur = stretched[i2]; + if (oldCur && stretchCur) { + spans: + for (var j = 0; j < stretchCur.length; ++j) { + var span = stretchCur[j]; + for (var k = 0; k < oldCur.length; ++k) { + if (oldCur[k].marker == span.marker) { + continue spans; + } + } + oldCur.push(span); + } + } else if (stretchCur) { + old[i2] = stretchCur; + } + } + return old; + } + function copyHistoryArray(events, newGroup, instantiateSel) { + var copy = []; + for (var i2 = 0; i2 < events.length; ++i2) { + var event = events[i2]; + if (event.ranges) { + copy.push(instantiateSel ? Selection.prototype.deepCopy.call(event) : event); + continue; + } + var changes = event.changes, newChanges = []; + copy.push({ changes: newChanges }); + for (var j = 0; j < changes.length; ++j) { + var change = changes[j], m = void 0; + newChanges.push({ from: change.from, to: change.to, text: change.text }); + if (newGroup) { + for (var prop2 in change) { + if (m = prop2.match(/^spans_(\d+)$/)) { + if (indexOf(newGroup, Number(m[1])) > -1) { + lst(newChanges)[prop2] = change[prop2]; + delete change[prop2]; + } + } + } + } + } + } + return copy; + } + function extendRange(range2, head, other, extend) { + if (extend) { + var anchor = range2.anchor; + if (other) { + var posBefore = cmp(head, anchor) < 0; + if (posBefore != cmp(other, anchor) < 0) { + anchor = head; + head = other; + } else if (posBefore != cmp(head, other) < 0) { + head = other; + } + } + return new Range(anchor, head); + } else { + return new Range(other || head, head); + } + } + function extendSelection(doc, head, other, options, extend) { + if (extend == null) { + extend = doc.cm && (doc.cm.display.shift || doc.extend); + } + setSelection(doc, new Selection([extendRange(doc.sel.primary(), head, other, extend)], 0), options); + } + function extendSelections(doc, heads, options) { + var out = []; + var extend = doc.cm && (doc.cm.display.shift || doc.extend); + for (var i2 = 0; i2 < doc.sel.ranges.length; i2++) { + out[i2] = extendRange(doc.sel.ranges[i2], heads[i2], null, extend); + } + var newSel = normalizeSelection(doc.cm, out, doc.sel.primIndex); + setSelection(doc, newSel, options); + } + function replaceOneSelection(doc, i2, range2, options) { + var ranges = doc.sel.ranges.slice(0); + ranges[i2] = range2; + setSelection(doc, normalizeSelection(doc.cm, ranges, doc.sel.primIndex), options); + } + function setSimpleSelection(doc, anchor, head, options) { + setSelection(doc, simpleSelection(anchor, head), options); + } + function filterSelectionChange(doc, sel, options) { + var obj = { + ranges: sel.ranges, + update: function(ranges) { + this.ranges = []; + for (var i2 = 0; i2 < ranges.length; i2++) { + this.ranges[i2] = new Range(clipPos(doc, ranges[i2].anchor), clipPos(doc, ranges[i2].head)); + } + }, + origin: options && options.origin + }; + signal(doc, "beforeSelectionChange", doc, obj); + if (doc.cm) { + signal(doc.cm, "beforeSelectionChange", doc.cm, obj); + } + if (obj.ranges != sel.ranges) { + return normalizeSelection(doc.cm, obj.ranges, obj.ranges.length - 1); + } else { + return sel; + } + } + function setSelectionReplaceHistory(doc, sel, options) { + var done = doc.history.done, last = lst(done); + if (last && last.ranges) { + done[done.length - 1] = sel; + setSelectionNoUndo(doc, sel, options); + } else { + setSelection(doc, sel, options); + } + } + function setSelection(doc, sel, options) { + setSelectionNoUndo(doc, sel, options); + addSelectionToHistory(doc, doc.sel, doc.cm ? doc.cm.curOp.id : NaN, options); + } + function setSelectionNoUndo(doc, sel, options) { + if (hasHandler(doc, "beforeSelectionChange") || doc.cm && hasHandler(doc.cm, "beforeSelectionChange")) { + sel = filterSelectionChange(doc, sel, options); + } + var bias = options && options.bias || (cmp(sel.primary().head, doc.sel.primary().head) < 0 ? -1 : 1); + setSelectionInner(doc, skipAtomicInSelection(doc, sel, bias, true)); + if (!(options && options.scroll === false) && doc.cm && doc.cm.getOption("readOnly") != "nocursor") { + ensureCursorVisible(doc.cm); + } + } + function setSelectionInner(doc, sel) { + if (sel.equals(doc.sel)) { + return; + } + doc.sel = sel; + if (doc.cm) { + doc.cm.curOp.updateInput = 1; + doc.cm.curOp.selectionChanged = true; + signalCursorActivity(doc.cm); + } + signalLater(doc, "cursorActivity", doc); + } + function reCheckSelection(doc) { + setSelectionInner(doc, skipAtomicInSelection(doc, doc.sel, null, false)); + } + function skipAtomicInSelection(doc, sel, bias, mayClear) { + var out; + for (var i2 = 0; i2 < sel.ranges.length; i2++) { + var range2 = sel.ranges[i2]; + var old = sel.ranges.length == doc.sel.ranges.length && doc.sel.ranges[i2]; + var newAnchor = skipAtomic(doc, range2.anchor, old && old.anchor, bias, mayClear); + var newHead = range2.head == range2.anchor ? newAnchor : skipAtomic(doc, range2.head, old && old.head, bias, mayClear); + if (out || newAnchor != range2.anchor || newHead != range2.head) { + if (!out) { + out = sel.ranges.slice(0, i2); + } + out[i2] = new Range(newAnchor, newHead); + } + } + return out ? normalizeSelection(doc.cm, out, sel.primIndex) : sel; + } + function skipAtomicInner(doc, pos, oldPos, dir, mayClear) { + var line = getLine(doc, pos.line); + if (line.markedSpans) { + for (var i2 = 0; i2 < line.markedSpans.length; ++i2) { + var sp = line.markedSpans[i2], m = sp.marker; + var preventCursorLeft = "selectLeft" in m ? !m.selectLeft : m.inclusiveLeft; + var preventCursorRight = "selectRight" in m ? !m.selectRight : m.inclusiveRight; + if ((sp.from == null || (preventCursorLeft ? sp.from <= pos.ch : sp.from < pos.ch)) && (sp.to == null || (preventCursorRight ? sp.to >= pos.ch : sp.to > pos.ch))) { + if (mayClear) { + signal(m, "beforeCursorEnter"); + if (m.explicitlyCleared) { + if (!line.markedSpans) { + break; + } else { + --i2; + continue; + } + } + } + if (!m.atomic) { + continue; + } + if (oldPos) { + var near = m.find(dir < 0 ? 1 : -1), diff = void 0; + if (dir < 0 ? preventCursorRight : preventCursorLeft) { + near = movePos(doc, near, -dir, near && near.line == pos.line ? line : null); + } + if (near && near.line == pos.line && (diff = cmp(near, oldPos)) && (dir < 0 ? diff < 0 : diff > 0)) { + return skipAtomicInner(doc, near, pos, dir, mayClear); + } + } + var far = m.find(dir < 0 ? -1 : 1); + if (dir < 0 ? preventCursorLeft : preventCursorRight) { + far = movePos(doc, far, dir, far.line == pos.line ? line : null); + } + return far ? skipAtomicInner(doc, far, pos, dir, mayClear) : null; + } + } + } + return pos; + } + function skipAtomic(doc, pos, oldPos, bias, mayClear) { + var dir = bias || 1; + var found = skipAtomicInner(doc, pos, oldPos, dir, mayClear) || !mayClear && skipAtomicInner(doc, pos, oldPos, dir, true) || skipAtomicInner(doc, pos, oldPos, -dir, mayClear) || !mayClear && skipAtomicInner(doc, pos, oldPos, -dir, true); + if (!found) { + doc.cantEdit = true; + return Pos(doc.first, 0); + } + return found; + } + function movePos(doc, pos, dir, line) { + if (dir < 0 && pos.ch == 0) { + if (pos.line > doc.first) { + return clipPos(doc, Pos(pos.line - 1)); + } else { + return null; + } + } else if (dir > 0 && pos.ch == (line || getLine(doc, pos.line)).text.length) { + if (pos.line < doc.first + doc.size - 1) { + return Pos(pos.line + 1, 0); + } else { + return null; + } + } else { + return new Pos(pos.line, pos.ch + dir); + } + } + function selectAll(cm) { + cm.setSelection(Pos(cm.firstLine(), 0), Pos(cm.lastLine()), sel_dontScroll); + } + function filterChange(doc, change, update) { + var obj = { + canceled: false, + from: change.from, + to: change.to, + text: change.text, + origin: change.origin, + cancel: function() { + return obj.canceled = true; + } + }; + if (update) { + obj.update = function(from, to, text, origin) { + if (from) { + obj.from = clipPos(doc, from); + } + if (to) { + obj.to = clipPos(doc, to); + } + if (text) { + obj.text = text; + } + if (origin !== void 0) { + obj.origin = origin; + } + }; + } + signal(doc, "beforeChange", doc, obj); + if (doc.cm) { + signal(doc.cm, "beforeChange", doc.cm, obj); + } + if (obj.canceled) { + if (doc.cm) { + doc.cm.curOp.updateInput = 2; + } + return null; + } + return { from: obj.from, to: obj.to, text: obj.text, origin: obj.origin }; + } + function makeChange(doc, change, ignoreReadOnly) { + if (doc.cm) { + if (!doc.cm.curOp) { + return operation(doc.cm, makeChange)(doc, change, ignoreReadOnly); + } + if (doc.cm.state.suppressEdits) { + return; + } + } + if (hasHandler(doc, "beforeChange") || doc.cm && hasHandler(doc.cm, "beforeChange")) { + change = filterChange(doc, change, true); + if (!change) { + return; + } + } + var split = sawReadOnlySpans && !ignoreReadOnly && removeReadOnlyRanges(doc, change.from, change.to); + if (split) { + for (var i2 = split.length - 1; i2 >= 0; --i2) { + makeChangeInner(doc, { from: split[i2].from, to: split[i2].to, text: i2 ? [""] : change.text, origin: change.origin }); + } + } else { + makeChangeInner(doc, change); + } + } + function makeChangeInner(doc, change) { + if (change.text.length == 1 && change.text[0] == "" && cmp(change.from, change.to) == 0) { + return; + } + var selAfter = computeSelAfterChange(doc, change); + addChangeToHistory(doc, change, selAfter, doc.cm ? doc.cm.curOp.id : NaN); + makeChangeSingleDoc(doc, change, selAfter, stretchSpansOverChange(doc, change)); + var rebased = []; + linkedDocs(doc, function(doc2, sharedHist) { + if (!sharedHist && indexOf(rebased, doc2.history) == -1) { + rebaseHist(doc2.history, change); + rebased.push(doc2.history); + } + makeChangeSingleDoc(doc2, change, null, stretchSpansOverChange(doc2, change)); + }); + } + function makeChangeFromHistory(doc, type, allowSelectionOnly) { + var suppress = doc.cm && doc.cm.state.suppressEdits; + if (suppress && !allowSelectionOnly) { + return; + } + var hist = doc.history, event, selAfter = doc.sel; + var source = type == "undo" ? hist.done : hist.undone, dest = type == "undo" ? hist.undone : hist.done; + var i2 = 0; + for (; i2 < source.length; i2++) { + event = source[i2]; + if (allowSelectionOnly ? event.ranges && !event.equals(doc.sel) : !event.ranges) { + break; + } + } + if (i2 == source.length) { + return; + } + hist.lastOrigin = hist.lastSelOrigin = null; + for (; ; ) { + event = source.pop(); + if (event.ranges) { + pushSelectionToHistory(event, dest); + if (allowSelectionOnly && !event.equals(doc.sel)) { + setSelection(doc, event, { clearRedo: false }); + return; + } + selAfter = event; + } else if (suppress) { + source.push(event); + return; + } else { + break; + } + } + var antiChanges = []; + pushSelectionToHistory(selAfter, dest); + dest.push({ changes: antiChanges, generation: hist.generation }); + hist.generation = event.generation || ++hist.maxGeneration; + var filter = hasHandler(doc, "beforeChange") || doc.cm && hasHandler(doc.cm, "beforeChange"); + var loop = function(i3) { + var change = event.changes[i3]; + change.origin = type; + if (filter && !filterChange(doc, change, false)) { + source.length = 0; + return {}; + } + antiChanges.push(historyChangeFromChange(doc, change)); + var after = i3 ? computeSelAfterChange(doc, change) : lst(source); + makeChangeSingleDoc(doc, change, after, mergeOldSpans(doc, change)); + if (!i3 && doc.cm) { + doc.cm.scrollIntoView({ from: change.from, to: changeEnd(change) }); + } + var rebased = []; + linkedDocs(doc, function(doc2, sharedHist) { + if (!sharedHist && indexOf(rebased, doc2.history) == -1) { + rebaseHist(doc2.history, change); + rebased.push(doc2.history); + } + makeChangeSingleDoc(doc2, change, null, mergeOldSpans(doc2, change)); + }); + }; + for (var i$12 = event.changes.length - 1; i$12 >= 0; --i$12) { + var returned = loop(i$12); + if (returned) + return returned.v; + } + } + function shiftDoc(doc, distance) { + if (distance == 0) { + return; + } + doc.first += distance; + doc.sel = new Selection(map(doc.sel.ranges, function(range2) { + return new Range(Pos(range2.anchor.line + distance, range2.anchor.ch), Pos(range2.head.line + distance, range2.head.ch)); + }), doc.sel.primIndex); + if (doc.cm) { + regChange(doc.cm, doc.first, doc.first - distance, distance); + for (var d = doc.cm.display, l = d.viewFrom; l < d.viewTo; l++) { + regLineChange(doc.cm, l, "gutter"); + } + } + } + function makeChangeSingleDoc(doc, change, selAfter, spans) { + if (doc.cm && !doc.cm.curOp) { + return operation(doc.cm, makeChangeSingleDoc)(doc, change, selAfter, spans); + } + if (change.to.line < doc.first) { + shiftDoc(doc, change.text.length - 1 - (change.to.line - change.from.line)); + return; + } + if (change.from.line > doc.lastLine()) { + return; + } + if (change.from.line < doc.first) { + var shift = change.text.length - 1 - (doc.first - change.from.line); + shiftDoc(doc, shift); + change = { + from: Pos(doc.first, 0), + to: Pos(change.to.line + shift, change.to.ch), + text: [lst(change.text)], + origin: change.origin + }; + } + var last = doc.lastLine(); + if (change.to.line > last) { + change = { + from: change.from, + to: Pos(last, getLine(doc, last).text.length), + text: [change.text[0]], + origin: change.origin + }; + } + change.removed = getBetween(doc, change.from, change.to); + if (!selAfter) { + selAfter = computeSelAfterChange(doc, change); + } + if (doc.cm) { + makeChangeSingleDocInEditor(doc.cm, change, spans); + } else { + updateDoc(doc, change, spans); + } + setSelectionNoUndo(doc, selAfter, sel_dontScroll); + if (doc.cantEdit && skipAtomic(doc, Pos(doc.firstLine(), 0))) { + doc.cantEdit = false; + } + } + function makeChangeSingleDocInEditor(cm, change, spans) { + var doc = cm.doc, display = cm.display, from = change.from, to = change.to; + var recomputeMaxLength = false, checkWidthStart = from.line; + if (!cm.options.lineWrapping) { + checkWidthStart = lineNo(visualLine(getLine(doc, from.line))); + doc.iter(checkWidthStart, to.line + 1, function(line) { + if (line == display.maxLine) { + recomputeMaxLength = true; + return true; + } + }); + } + if (doc.sel.contains(change.from, change.to) > -1) { + signalCursorActivity(cm); + } + updateDoc(doc, change, spans, estimateHeight(cm)); + if (!cm.options.lineWrapping) { + doc.iter(checkWidthStart, from.line + change.text.length, function(line) { + var len = lineLength(line); + if (len > display.maxLineLength) { + display.maxLine = line; + display.maxLineLength = len; + display.maxLineChanged = true; + recomputeMaxLength = false; + } + }); + if (recomputeMaxLength) { + cm.curOp.updateMaxLine = true; + } + } + retreatFrontier(doc, from.line); + startWorker(cm, 400); + var lendiff = change.text.length - (to.line - from.line) - 1; + if (change.full) { + regChange(cm); + } else if (from.line == to.line && change.text.length == 1 && !isWholeLineUpdate(cm.doc, change)) { + regLineChange(cm, from.line, "text"); + } else { + regChange(cm, from.line, to.line + 1, lendiff); + } + var changesHandler = hasHandler(cm, "changes"), changeHandler = hasHandler(cm, "change"); + if (changeHandler || changesHandler) { + var obj = { + from, + to, + text: change.text, + removed: change.removed, + origin: change.origin + }; + if (changeHandler) { + signalLater(cm, "change", cm, obj); + } + if (changesHandler) { + (cm.curOp.changeObjs || (cm.curOp.changeObjs = [])).push(obj); + } + } + cm.display.selForContextMenu = null; + } + function replaceRange(doc, code, from, to, origin) { + var assign; + if (!to) { + to = from; + } + if (cmp(to, from) < 0) { + assign = [to, from], from = assign[0], to = assign[1]; + } + if (typeof code == "string") { + code = doc.splitLines(code); + } + makeChange(doc, { from, to, text: code, origin }); + } + function rebaseHistSelSingle(pos, from, to, diff) { + if (to < pos.line) { + pos.line += diff; + } else if (from < pos.line) { + pos.line = from; + pos.ch = 0; + } + } + function rebaseHistArray(array, from, to, diff) { + for (var i2 = 0; i2 < array.length; ++i2) { + var sub = array[i2], ok = true; + if (sub.ranges) { + if (!sub.copied) { + sub = array[i2] = sub.deepCopy(); + sub.copied = true; + } + for (var j = 0; j < sub.ranges.length; j++) { + rebaseHistSelSingle(sub.ranges[j].anchor, from, to, diff); + rebaseHistSelSingle(sub.ranges[j].head, from, to, diff); + } + continue; + } + for (var j$1 = 0; j$1 < sub.changes.length; ++j$1) { + var cur = sub.changes[j$1]; + if (to < cur.from.line) { + cur.from = Pos(cur.from.line + diff, cur.from.ch); + cur.to = Pos(cur.to.line + diff, cur.to.ch); + } else if (from <= cur.to.line) { + ok = false; + break; + } + } + if (!ok) { + array.splice(0, i2 + 1); + i2 = 0; + } + } + } + function rebaseHist(hist, change) { + var from = change.from.line, to = change.to.line, diff = change.text.length - (to - from) - 1; + rebaseHistArray(hist.done, from, to, diff); + rebaseHistArray(hist.undone, from, to, diff); + } + function changeLine(doc, handle, changeType, op) { + var no = handle, line = handle; + if (typeof handle == "number") { + line = getLine(doc, clipLine(doc, handle)); + } else { + no = lineNo(handle); + } + if (no == null) { + return null; + } + if (op(line, no) && doc.cm) { + regLineChange(doc.cm, no, changeType); + } + return line; + } + function LeafChunk(lines) { + this.lines = lines; + this.parent = null; + var height = 0; + for (var i2 = 0; i2 < lines.length; ++i2) { + lines[i2].parent = this; + height += lines[i2].height; + } + this.height = height; + } + LeafChunk.prototype = { + chunkSize: function() { + return this.lines.length; + }, + removeInner: function(at, n) { + for (var i2 = at, e = at + n; i2 < e; ++i2) { + var line = this.lines[i2]; + this.height -= line.height; + cleanUpLine(line); + signalLater(line, "delete"); + } + this.lines.splice(at, n); + }, + collapse: function(lines) { + lines.push.apply(lines, this.lines); + }, + insertInner: function(at, lines, height) { + this.height += height; + this.lines = this.lines.slice(0, at).concat(lines).concat(this.lines.slice(at)); + for (var i2 = 0; i2 < lines.length; ++i2) { + lines[i2].parent = this; + } + }, + iterN: function(at, n, op) { + for (var e = at + n; at < e; ++at) { + if (op(this.lines[at])) { + return true; + } + } + } + }; + function BranchChunk(children) { + this.children = children; + var size = 0, height = 0; + for (var i2 = 0; i2 < children.length; ++i2) { + var ch = children[i2]; + size += ch.chunkSize(); + height += ch.height; + ch.parent = this; + } + this.size = size; + this.height = height; + this.parent = null; + } + BranchChunk.prototype = { + chunkSize: function() { + return this.size; + }, + removeInner: function(at, n) { + this.size -= n; + for (var i2 = 0; i2 < this.children.length; ++i2) { + var child = this.children[i2], sz = child.chunkSize(); + if (at < sz) { + var rm = Math.min(n, sz - at), oldHeight = child.height; + child.removeInner(at, rm); + this.height -= oldHeight - child.height; + if (sz == rm) { + this.children.splice(i2--, 1); + child.parent = null; + } + if ((n -= rm) == 0) { + break; + } + at = 0; + } else { + at -= sz; + } + } + if (this.size - n < 25 && (this.children.length > 1 || !(this.children[0] instanceof LeafChunk))) { + var lines = []; + this.collapse(lines); + this.children = [new LeafChunk(lines)]; + this.children[0].parent = this; + } + }, + collapse: function(lines) { + for (var i2 = 0; i2 < this.children.length; ++i2) { + this.children[i2].collapse(lines); + } + }, + insertInner: function(at, lines, height) { + this.size += lines.length; + this.height += height; + for (var i2 = 0; i2 < this.children.length; ++i2) { + var child = this.children[i2], sz = child.chunkSize(); + if (at <= sz) { + child.insertInner(at, lines, height); + if (child.lines && child.lines.length > 50) { + var remaining = child.lines.length % 25 + 25; + for (var pos = remaining; pos < child.lines.length; ) { + var leaf = new LeafChunk(child.lines.slice(pos, pos += 25)); + child.height -= leaf.height; + this.children.splice(++i2, 0, leaf); + leaf.parent = this; + } + child.lines = child.lines.slice(0, remaining); + this.maybeSpill(); + } + break; + } + at -= sz; + } + }, + maybeSpill: function() { + if (this.children.length <= 10) { + return; + } + var me = this; + do { + var spilled = me.children.splice(me.children.length - 5, 5); + var sibling = new BranchChunk(spilled); + if (!me.parent) { + var copy = new BranchChunk(me.children); + copy.parent = me; + me.children = [copy, sibling]; + me = copy; + } else { + me.size -= sibling.size; + me.height -= sibling.height; + var myIndex = indexOf(me.parent.children, me); + me.parent.children.splice(myIndex + 1, 0, sibling); + } + sibling.parent = me.parent; + } while (me.children.length > 10); + me.parent.maybeSpill(); + }, + iterN: function(at, n, op) { + for (var i2 = 0; i2 < this.children.length; ++i2) { + var child = this.children[i2], sz = child.chunkSize(); + if (at < sz) { + var used = Math.min(n, sz - at); + if (child.iterN(at, used, op)) { + return true; + } + if ((n -= used) == 0) { + break; + } + at = 0; + } else { + at -= sz; + } + } + } + }; + var LineWidget = function(doc, node, options) { + if (options) { + for (var opt in options) { + if (options.hasOwnProperty(opt)) { + this[opt] = options[opt]; + } + } + } + this.doc = doc; + this.node = node; + }; + LineWidget.prototype.clear = function() { + var cm = this.doc.cm, ws = this.line.widgets, line = this.line, no = lineNo(line); + if (no == null || !ws) { + return; + } + for (var i2 = 0; i2 < ws.length; ++i2) { + if (ws[i2] == this) { + ws.splice(i2--, 1); + } + } + if (!ws.length) { + line.widgets = null; + } + var height = widgetHeight(this); + updateLineHeight(line, Math.max(0, line.height - height)); + if (cm) { + runInOp(cm, function() { + adjustScrollWhenAboveVisible(cm, line, -height); + regLineChange(cm, no, "widget"); + }); + signalLater(cm, "lineWidgetCleared", cm, this, no); + } + }; + LineWidget.prototype.changed = function() { + var this$1$1 = this; + var oldH = this.height, cm = this.doc.cm, line = this.line; + this.height = null; + var diff = widgetHeight(this) - oldH; + if (!diff) { + return; + } + if (!lineIsHidden(this.doc, line)) { + updateLineHeight(line, line.height + diff); + } + if (cm) { + runInOp(cm, function() { + cm.curOp.forceUpdate = true; + adjustScrollWhenAboveVisible(cm, line, diff); + signalLater(cm, "lineWidgetChanged", cm, this$1$1, lineNo(line)); + }); + } + }; + eventMixin(LineWidget); + function adjustScrollWhenAboveVisible(cm, line, diff) { + if (heightAtLine(line) < (cm.curOp && cm.curOp.scrollTop || cm.doc.scrollTop)) { + addToScrollTop(cm, diff); + } + } + function addLineWidget(doc, handle, node, options) { + var widget = new LineWidget(doc, node, options); + var cm = doc.cm; + if (cm && widget.noHScroll) { + cm.display.alignWidgets = true; + } + changeLine(doc, handle, "widget", function(line) { + var widgets = line.widgets || (line.widgets = []); + if (widget.insertAt == null) { + widgets.push(widget); + } else { + widgets.splice(Math.min(widgets.length, Math.max(0, widget.insertAt)), 0, widget); + } + widget.line = line; + if (cm && !lineIsHidden(doc, line)) { + var aboveVisible = heightAtLine(line) < doc.scrollTop; + updateLineHeight(line, line.height + widgetHeight(widget)); + if (aboveVisible) { + addToScrollTop(cm, widget.height); + } + cm.curOp.forceUpdate = true; + } + return true; + }); + if (cm) { + signalLater(cm, "lineWidgetAdded", cm, widget, typeof handle == "number" ? handle : lineNo(handle)); + } + return widget; + } + var nextMarkerId = 0; + var TextMarker = function(doc, type) { + this.lines = []; + this.type = type; + this.doc = doc; + this.id = ++nextMarkerId; + }; + TextMarker.prototype.clear = function() { + if (this.explicitlyCleared) { + return; + } + var cm = this.doc.cm, withOp = cm && !cm.curOp; + if (withOp) { + startOperation(cm); + } + if (hasHandler(this, "clear")) { + var found = this.find(); + if (found) { + signalLater(this, "clear", found.from, found.to); + } + } + var min = null, max = null; + for (var i2 = 0; i2 < this.lines.length; ++i2) { + var line = this.lines[i2]; + var span = getMarkedSpanFor(line.markedSpans, this); + if (cm && !this.collapsed) { + regLineChange(cm, lineNo(line), "text"); + } else if (cm) { + if (span.to != null) { + max = lineNo(line); + } + if (span.from != null) { + min = lineNo(line); + } + } + line.markedSpans = removeMarkedSpan(line.markedSpans, span); + if (span.from == null && this.collapsed && !lineIsHidden(this.doc, line) && cm) { + updateLineHeight(line, textHeight(cm.display)); + } + } + if (cm && this.collapsed && !cm.options.lineWrapping) { + for (var i$12 = 0; i$12 < this.lines.length; ++i$12) { + var visual = visualLine(this.lines[i$12]), len = lineLength(visual); + if (len > cm.display.maxLineLength) { + cm.display.maxLine = visual; + cm.display.maxLineLength = len; + cm.display.maxLineChanged = true; + } + } + } + if (min != null && cm && this.collapsed) { + regChange(cm, min, max + 1); + } + this.lines.length = 0; + this.explicitlyCleared = true; + if (this.atomic && this.doc.cantEdit) { + this.doc.cantEdit = false; + if (cm) { + reCheckSelection(cm.doc); + } + } + if (cm) { + signalLater(cm, "markerCleared", cm, this, min, max); + } + if (withOp) { + endOperation(cm); + } + if (this.parent) { + this.parent.clear(); + } + }; + TextMarker.prototype.find = function(side, lineObj) { + if (side == null && this.type == "bookmark") { + side = 1; + } + var from, to; + for (var i2 = 0; i2 < this.lines.length; ++i2) { + var line = this.lines[i2]; + var span = getMarkedSpanFor(line.markedSpans, this); + if (span.from != null) { + from = Pos(lineObj ? line : lineNo(line), span.from); + if (side == -1) { + return from; + } + } + if (span.to != null) { + to = Pos(lineObj ? line : lineNo(line), span.to); + if (side == 1) { + return to; + } + } + } + return from && { from, to }; + }; + TextMarker.prototype.changed = function() { + var this$1$1 = this; + var pos = this.find(-1, true), widget = this, cm = this.doc.cm; + if (!pos || !cm) { + return; + } + runInOp(cm, function() { + var line = pos.line, lineN = lineNo(pos.line); + var view = findViewForLine(cm, lineN); + if (view) { + clearLineMeasurementCacheFor(view); + cm.curOp.selectionChanged = cm.curOp.forceUpdate = true; + } + cm.curOp.updateMaxLine = true; + if (!lineIsHidden(widget.doc, line) && widget.height != null) { + var oldHeight = widget.height; + widget.height = null; + var dHeight = widgetHeight(widget) - oldHeight; + if (dHeight) { + updateLineHeight(line, line.height + dHeight); + } + } + signalLater(cm, "markerChanged", cm, this$1$1); + }); + }; + TextMarker.prototype.attachLine = function(line) { + if (!this.lines.length && this.doc.cm) { + var op = this.doc.cm.curOp; + if (!op.maybeHiddenMarkers || indexOf(op.maybeHiddenMarkers, this) == -1) { + (op.maybeUnhiddenMarkers || (op.maybeUnhiddenMarkers = [])).push(this); + } + } + this.lines.push(line); + }; + TextMarker.prototype.detachLine = function(line) { + this.lines.splice(indexOf(this.lines, line), 1); + if (!this.lines.length && this.doc.cm) { + var op = this.doc.cm.curOp; + (op.maybeHiddenMarkers || (op.maybeHiddenMarkers = [])).push(this); + } + }; + eventMixin(TextMarker); + function markText(doc, from, to, options, type) { + if (options && options.shared) { + return markTextShared(doc, from, to, options, type); + } + if (doc.cm && !doc.cm.curOp) { + return operation(doc.cm, markText)(doc, from, to, options, type); + } + var marker = new TextMarker(doc, type), diff = cmp(from, to); + if (options) { + copyObj(options, marker, false); + } + if (diff > 0 || diff == 0 && marker.clearWhenEmpty !== false) { + return marker; + } + if (marker.replacedWith) { + marker.collapsed = true; + marker.widgetNode = eltP("span", [marker.replacedWith], "CodeMirror-widget"); + if (!options.handleMouseEvents) { + marker.widgetNode.setAttribute("cm-ignore-events", "true"); + } + if (options.insertLeft) { + marker.widgetNode.insertLeft = true; + } + } + if (marker.collapsed) { + if (conflictingCollapsedRange(doc, from.line, from, to, marker) || from.line != to.line && conflictingCollapsedRange(doc, to.line, from, to, marker)) { + throw new Error("Inserting collapsed marker partially overlapping an existing one"); + } + seeCollapsedSpans(); + } + if (marker.addToHistory) { + addChangeToHistory(doc, { from, to, origin: "markText" }, doc.sel, NaN); + } + var curLine = from.line, cm = doc.cm, updateMaxLine; + doc.iter(curLine, to.line + 1, function(line) { + if (cm && marker.collapsed && !cm.options.lineWrapping && visualLine(line) == cm.display.maxLine) { + updateMaxLine = true; + } + if (marker.collapsed && curLine != from.line) { + updateLineHeight(line, 0); + } + addMarkedSpan(line, new MarkedSpan(marker, curLine == from.line ? from.ch : null, curLine == to.line ? to.ch : null), doc.cm && doc.cm.curOp); + ++curLine; + }); + if (marker.collapsed) { + doc.iter(from.line, to.line + 1, function(line) { + if (lineIsHidden(doc, line)) { + updateLineHeight(line, 0); + } + }); + } + if (marker.clearOnEnter) { + on(marker, "beforeCursorEnter", function() { + return marker.clear(); + }); + } + if (marker.readOnly) { + seeReadOnlySpans(); + if (doc.history.done.length || doc.history.undone.length) { + doc.clearHistory(); + } + } + if (marker.collapsed) { + marker.id = ++nextMarkerId; + marker.atomic = true; + } + if (cm) { + if (updateMaxLine) { + cm.curOp.updateMaxLine = true; + } + if (marker.collapsed) { + regChange(cm, from.line, to.line + 1); + } else if (marker.className || marker.startStyle || marker.endStyle || marker.css || marker.attributes || marker.title) { + for (var i2 = from.line; i2 <= to.line; i2++) { + regLineChange(cm, i2, "text"); + } + } + if (marker.atomic) { + reCheckSelection(cm.doc); + } + signalLater(cm, "markerAdded", cm, marker); + } + return marker; + } + var SharedTextMarker = function(markers, primary) { + this.markers = markers; + this.primary = primary; + for (var i2 = 0; i2 < markers.length; ++i2) { + markers[i2].parent = this; + } + }; + SharedTextMarker.prototype.clear = function() { + if (this.explicitlyCleared) { + return; + } + this.explicitlyCleared = true; + for (var i2 = 0; i2 < this.markers.length; ++i2) { + this.markers[i2].clear(); + } + signalLater(this, "clear"); + }; + SharedTextMarker.prototype.find = function(side, lineObj) { + return this.primary.find(side, lineObj); + }; + eventMixin(SharedTextMarker); + function markTextShared(doc, from, to, options, type) { + options = copyObj(options); + options.shared = false; + var markers = [markText(doc, from, to, options, type)], primary = markers[0]; + var widget = options.widgetNode; + linkedDocs(doc, function(doc2) { + if (widget) { + options.widgetNode = widget.cloneNode(true); + } + markers.push(markText(doc2, clipPos(doc2, from), clipPos(doc2, to), options, type)); + for (var i2 = 0; i2 < doc2.linked.length; ++i2) { + if (doc2.linked[i2].isParent) { + return; + } + } + primary = lst(markers); + }); + return new SharedTextMarker(markers, primary); + } + function findSharedMarkers(doc) { + return doc.findMarks(Pos(doc.first, 0), doc.clipPos(Pos(doc.lastLine())), function(m) { + return m.parent; + }); + } + function copySharedMarkers(doc, markers) { + for (var i2 = 0; i2 < markers.length; i2++) { + var marker = markers[i2], pos = marker.find(); + var mFrom = doc.clipPos(pos.from), mTo = doc.clipPos(pos.to); + if (cmp(mFrom, mTo)) { + var subMark = markText(doc, mFrom, mTo, marker.primary, marker.primary.type); + marker.markers.push(subMark); + subMark.parent = marker; + } + } + } + function detachSharedMarkers(markers) { + var loop = function(i3) { + var marker = markers[i3], linked = [marker.primary.doc]; + linkedDocs(marker.primary.doc, function(d) { + return linked.push(d); + }); + for (var j = 0; j < marker.markers.length; j++) { + var subMarker = marker.markers[j]; + if (indexOf(linked, subMarker.doc) == -1) { + subMarker.parent = null; + marker.markers.splice(j--, 1); + } + } + }; + for (var i2 = 0; i2 < markers.length; i2++) + loop(i2); + } + var nextDocId = 0; + var Doc = function(text, mode, firstLine, lineSep, direction) { + if (!(this instanceof Doc)) { + return new Doc(text, mode, firstLine, lineSep, direction); + } + if (firstLine == null) { + firstLine = 0; + } + BranchChunk.call(this, [new LeafChunk([new Line("", null)])]); + this.first = firstLine; + this.scrollTop = this.scrollLeft = 0; + this.cantEdit = false; + this.cleanGeneration = 1; + this.modeFrontier = this.highlightFrontier = firstLine; + var start = Pos(firstLine, 0); + this.sel = simpleSelection(start); + this.history = new History(null); + this.id = ++nextDocId; + this.modeOption = mode; + this.lineSep = lineSep; + this.direction = direction == "rtl" ? "rtl" : "ltr"; + this.extend = false; + if (typeof text == "string") { + text = this.splitLines(text); + } + updateDoc(this, { from: start, to: start, text }); + setSelection(this, simpleSelection(start), sel_dontScroll); + }; + Doc.prototype = createObj(BranchChunk.prototype, { + constructor: Doc, + iter: function(from, to, op) { + if (op) { + this.iterN(from - this.first, to - from, op); + } else { + this.iterN(this.first, this.first + this.size, from); + } + }, + insert: function(at, lines) { + var height = 0; + for (var i2 = 0; i2 < lines.length; ++i2) { + height += lines[i2].height; + } + this.insertInner(at - this.first, lines, height); + }, + remove: function(at, n) { + this.removeInner(at - this.first, n); + }, + getValue: function(lineSep) { + var lines = getLines(this, this.first, this.first + this.size); + if (lineSep === false) { + return lines; + } + return lines.join(lineSep || this.lineSeparator()); + }, + setValue: docMethodOp(function(code) { + var top = Pos(this.first, 0), last = this.first + this.size - 1; + makeChange(this, { + from: top, + to: Pos(last, getLine(this, last).text.length), + text: this.splitLines(code), + origin: "setValue", + full: true + }, true); + if (this.cm) { + scrollToCoords(this.cm, 0, 0); + } + setSelection(this, simpleSelection(top), sel_dontScroll); + }), + replaceRange: function(code, from, to, origin) { + from = clipPos(this, from); + to = to ? clipPos(this, to) : from; + replaceRange(this, code, from, to, origin); + }, + getRange: function(from, to, lineSep) { + var lines = getBetween(this, clipPos(this, from), clipPos(this, to)); + if (lineSep === false) { + return lines; + } + if (lineSep === "") { + return lines.join(""); + } + return lines.join(lineSep || this.lineSeparator()); + }, + getLine: function(line) { + var l = this.getLineHandle(line); + return l && l.text; + }, + getLineHandle: function(line) { + if (isLine(this, line)) { + return getLine(this, line); + } + }, + getLineNumber: function(line) { + return lineNo(line); + }, + getLineHandleVisualStart: function(line) { + if (typeof line == "number") { + line = getLine(this, line); + } + return visualLine(line); + }, + lineCount: function() { + return this.size; + }, + firstLine: function() { + return this.first; + }, + lastLine: function() { + return this.first + this.size - 1; + }, + clipPos: function(pos) { + return clipPos(this, pos); + }, + getCursor: function(start) { + var range2 = this.sel.primary(), pos; + if (start == null || start == "head") { + pos = range2.head; + } else if (start == "anchor") { + pos = range2.anchor; + } else if (start == "end" || start == "to" || start === false) { + pos = range2.to(); + } else { + pos = range2.from(); + } + return pos; + }, + listSelections: function() { + return this.sel.ranges; + }, + somethingSelected: function() { + return this.sel.somethingSelected(); + }, + setCursor: docMethodOp(function(line, ch, options) { + setSimpleSelection(this, clipPos(this, typeof line == "number" ? Pos(line, ch || 0) : line), null, options); + }), + setSelection: docMethodOp(function(anchor, head, options) { + setSimpleSelection(this, clipPos(this, anchor), clipPos(this, head || anchor), options); + }), + extendSelection: docMethodOp(function(head, other, options) { + extendSelection(this, clipPos(this, head), other && clipPos(this, other), options); + }), + extendSelections: docMethodOp(function(heads, options) { + extendSelections(this, clipPosArray(this, heads), options); + }), + extendSelectionsBy: docMethodOp(function(f, options) { + var heads = map(this.sel.ranges, f); + extendSelections(this, clipPosArray(this, heads), options); + }), + setSelections: docMethodOp(function(ranges, primary, options) { + if (!ranges.length) { + return; + } + var out = []; + for (var i2 = 0; i2 < ranges.length; i2++) { + out[i2] = new Range(clipPos(this, ranges[i2].anchor), clipPos(this, ranges[i2].head || ranges[i2].anchor)); + } + if (primary == null) { + primary = Math.min(ranges.length - 1, this.sel.primIndex); + } + setSelection(this, normalizeSelection(this.cm, out, primary), options); + }), + addSelection: docMethodOp(function(anchor, head, options) { + var ranges = this.sel.ranges.slice(0); + ranges.push(new Range(clipPos(this, anchor), clipPos(this, head || anchor))); + setSelection(this, normalizeSelection(this.cm, ranges, ranges.length - 1), options); + }), + getSelection: function(lineSep) { + var ranges = this.sel.ranges, lines; + for (var i2 = 0; i2 < ranges.length; i2++) { + var sel = getBetween(this, ranges[i2].from(), ranges[i2].to()); + lines = lines ? lines.concat(sel) : sel; + } + if (lineSep === false) { + return lines; + } else { + return lines.join(lineSep || this.lineSeparator()); + } + }, + getSelections: function(lineSep) { + var parts = [], ranges = this.sel.ranges; + for (var i2 = 0; i2 < ranges.length; i2++) { + var sel = getBetween(this, ranges[i2].from(), ranges[i2].to()); + if (lineSep !== false) { + sel = sel.join(lineSep || this.lineSeparator()); + } + parts[i2] = sel; + } + return parts; + }, + replaceSelection: function(code, collapse, origin) { + var dup = []; + for (var i2 = 0; i2 < this.sel.ranges.length; i2++) { + dup[i2] = code; + } + this.replaceSelections(dup, collapse, origin || "+input"); + }, + replaceSelections: docMethodOp(function(code, collapse, origin) { + var changes = [], sel = this.sel; + for (var i2 = 0; i2 < sel.ranges.length; i2++) { + var range2 = sel.ranges[i2]; + changes[i2] = { from: range2.from(), to: range2.to(), text: this.splitLines(code[i2]), origin }; + } + var newSel = collapse && collapse != "end" && computeReplacedSel(this, changes, collapse); + for (var i$12 = changes.length - 1; i$12 >= 0; i$12--) { + makeChange(this, changes[i$12]); + } + if (newSel) { + setSelectionReplaceHistory(this, newSel); + } else if (this.cm) { + ensureCursorVisible(this.cm); + } + }), + undo: docMethodOp(function() { + makeChangeFromHistory(this, "undo"); + }), + redo: docMethodOp(function() { + makeChangeFromHistory(this, "redo"); + }), + undoSelection: docMethodOp(function() { + makeChangeFromHistory(this, "undo", true); + }), + redoSelection: docMethodOp(function() { + makeChangeFromHistory(this, "redo", true); + }), + setExtending: function(val) { + this.extend = val; + }, + getExtending: function() { + return this.extend; + }, + historySize: function() { + var hist = this.history, done = 0, undone = 0; + for (var i2 = 0; i2 < hist.done.length; i2++) { + if (!hist.done[i2].ranges) { + ++done; + } + } + for (var i$12 = 0; i$12 < hist.undone.length; i$12++) { + if (!hist.undone[i$12].ranges) { + ++undone; + } + } + return { undo: done, redo: undone }; + }, + clearHistory: function() { + var this$1$1 = this; + this.history = new History(this.history); + linkedDocs(this, function(doc) { + return doc.history = this$1$1.history; + }, true); + }, + markClean: function() { + this.cleanGeneration = this.changeGeneration(true); + }, + changeGeneration: function(forceSplit) { + if (forceSplit) { + this.history.lastOp = this.history.lastSelOp = this.history.lastOrigin = null; + } + return this.history.generation; + }, + isClean: function(gen) { + return this.history.generation == (gen || this.cleanGeneration); + }, + getHistory: function() { + return { + done: copyHistoryArray(this.history.done), + undone: copyHistoryArray(this.history.undone) + }; + }, + setHistory: function(histData) { + var hist = this.history = new History(this.history); + hist.done = copyHistoryArray(histData.done.slice(0), null, true); + hist.undone = copyHistoryArray(histData.undone.slice(0), null, true); + }, + setGutterMarker: docMethodOp(function(line, gutterID, value) { + return changeLine(this, line, "gutter", function(line2) { + var markers = line2.gutterMarkers || (line2.gutterMarkers = {}); + markers[gutterID] = value; + if (!value && isEmpty(markers)) { + line2.gutterMarkers = null; + } + return true; + }); + }), + clearGutter: docMethodOp(function(gutterID) { + var this$1$1 = this; + this.iter(function(line) { + if (line.gutterMarkers && line.gutterMarkers[gutterID]) { + changeLine(this$1$1, line, "gutter", function() { + line.gutterMarkers[gutterID] = null; + if (isEmpty(line.gutterMarkers)) { + line.gutterMarkers = null; + } + return true; + }); + } + }); + }), + lineInfo: function(line) { + var n; + if (typeof line == "number") { + if (!isLine(this, line)) { + return null; + } + n = line; + line = getLine(this, line); + if (!line) { + return null; + } + } else { + n = lineNo(line); + if (n == null) { + return null; + } + } + return { + line: n, + handle: line, + text: line.text, + gutterMarkers: line.gutterMarkers, + textClass: line.textClass, + bgClass: line.bgClass, + wrapClass: line.wrapClass, + widgets: line.widgets + }; + }, + addLineClass: docMethodOp(function(handle, where, cls) { + return changeLine(this, handle, where == "gutter" ? "gutter" : "class", function(line) { + var prop2 = where == "text" ? "textClass" : where == "background" ? "bgClass" : where == "gutter" ? "gutterClass" : "wrapClass"; + if (!line[prop2]) { + line[prop2] = cls; + } else if (classTest(cls).test(line[prop2])) { + return false; + } else { + line[prop2] += " " + cls; + } + return true; + }); + }), + removeLineClass: docMethodOp(function(handle, where, cls) { + return changeLine(this, handle, where == "gutter" ? "gutter" : "class", function(line) { + var prop2 = where == "text" ? "textClass" : where == "background" ? "bgClass" : where == "gutter" ? "gutterClass" : "wrapClass"; + var cur = line[prop2]; + if (!cur) { + return false; + } else if (cls == null) { + line[prop2] = null; + } else { + var found = cur.match(classTest(cls)); + if (!found) { + return false; + } + var end = found.index + found[0].length; + line[prop2] = cur.slice(0, found.index) + (!found.index || end == cur.length ? "" : " ") + cur.slice(end) || null; + } + return true; + }); + }), + addLineWidget: docMethodOp(function(handle, node, options) { + return addLineWidget(this, handle, node, options); + }), + removeLineWidget: function(widget) { + widget.clear(); + }, + markText: function(from, to, options) { + return markText(this, clipPos(this, from), clipPos(this, to), options, options && options.type || "range"); + }, + setBookmark: function(pos, options) { + var realOpts = { + replacedWith: options && (options.nodeType == null ? options.widget : options), + insertLeft: options && options.insertLeft, + clearWhenEmpty: false, + shared: options && options.shared, + handleMouseEvents: options && options.handleMouseEvents + }; + pos = clipPos(this, pos); + return markText(this, pos, pos, realOpts, "bookmark"); + }, + findMarksAt: function(pos) { + pos = clipPos(this, pos); + var markers = [], spans = getLine(this, pos.line).markedSpans; + if (spans) { + for (var i2 = 0; i2 < spans.length; ++i2) { + var span = spans[i2]; + if ((span.from == null || span.from <= pos.ch) && (span.to == null || span.to >= pos.ch)) { + markers.push(span.marker.parent || span.marker); + } + } + } + return markers; + }, + findMarks: function(from, to, filter) { + from = clipPos(this, from); + to = clipPos(this, to); + var found = [], lineNo2 = from.line; + this.iter(from.line, to.line + 1, function(line) { + var spans = line.markedSpans; + if (spans) { + for (var i2 = 0; i2 < spans.length; i2++) { + var span = spans[i2]; + if (!(span.to != null && lineNo2 == from.line && from.ch >= span.to || span.from == null && lineNo2 != from.line || span.from != null && lineNo2 == to.line && span.from >= to.ch) && (!filter || filter(span.marker))) { + found.push(span.marker.parent || span.marker); + } + } + } + ++lineNo2; + }); + return found; + }, + getAllMarks: function() { + var markers = []; + this.iter(function(line) { + var sps = line.markedSpans; + if (sps) { + for (var i2 = 0; i2 < sps.length; ++i2) { + if (sps[i2].from != null) { + markers.push(sps[i2].marker); + } + } + } + }); + return markers; + }, + posFromIndex: function(off2) { + var ch, lineNo2 = this.first, sepSize = this.lineSeparator().length; + this.iter(function(line) { + var sz = line.text.length + sepSize; + if (sz > off2) { + ch = off2; + return true; + } + off2 -= sz; + ++lineNo2; + }); + return clipPos(this, Pos(lineNo2, ch)); + }, + indexFromPos: function(coords) { + coords = clipPos(this, coords); + var index = coords.ch; + if (coords.line < this.first || coords.ch < 0) { + return 0; + } + var sepSize = this.lineSeparator().length; + this.iter(this.first, coords.line, function(line) { + index += line.text.length + sepSize; + }); + return index; + }, + copy: function(copyHistory) { + var doc = new Doc(getLines(this, this.first, this.first + this.size), this.modeOption, this.first, this.lineSep, this.direction); + doc.scrollTop = this.scrollTop; + doc.scrollLeft = this.scrollLeft; + doc.sel = this.sel; + doc.extend = false; + if (copyHistory) { + doc.history.undoDepth = this.history.undoDepth; + doc.setHistory(this.getHistory()); + } + return doc; + }, + linkedDoc: function(options) { + if (!options) { + options = {}; + } + var from = this.first, to = this.first + this.size; + if (options.from != null && options.from > from) { + from = options.from; + } + if (options.to != null && options.to < to) { + to = options.to; + } + var copy = new Doc(getLines(this, from, to), options.mode || this.modeOption, from, this.lineSep, this.direction); + if (options.sharedHist) { + copy.history = this.history; + } + (this.linked || (this.linked = [])).push({ doc: copy, sharedHist: options.sharedHist }); + copy.linked = [{ doc: this, isParent: true, sharedHist: options.sharedHist }]; + copySharedMarkers(copy, findSharedMarkers(this)); + return copy; + }, + unlinkDoc: function(other) { + if (other instanceof CodeMirror) { + other = other.doc; + } + if (this.linked) { + for (var i2 = 0; i2 < this.linked.length; ++i2) { + var link = this.linked[i2]; + if (link.doc != other) { + continue; + } + this.linked.splice(i2, 1); + other.unlinkDoc(this); + detachSharedMarkers(findSharedMarkers(this)); + break; + } + } + if (other.history == this.history) { + var splitIds = [other.id]; + linkedDocs(other, function(doc) { + return splitIds.push(doc.id); + }, true); + other.history = new History(null); + other.history.done = copyHistoryArray(this.history.done, splitIds); + other.history.undone = copyHistoryArray(this.history.undone, splitIds); + } + }, + iterLinkedDocs: function(f) { + linkedDocs(this, f); + }, + getMode: function() { + return this.mode; + }, + getEditor: function() { + return this.cm; + }, + splitLines: function(str) { + if (this.lineSep) { + return str.split(this.lineSep); + } + return splitLinesAuto(str); + }, + lineSeparator: function() { + return this.lineSep || "\n"; + }, + setDirection: docMethodOp(function(dir) { + if (dir != "rtl") { + dir = "ltr"; + } + if (dir == this.direction) { + return; + } + this.direction = dir; + this.iter(function(line) { + return line.order = null; + }); + if (this.cm) { + directionChanged(this.cm); + } + }) + }); + Doc.prototype.eachLine = Doc.prototype.iter; + var lastDrop = 0; + function onDrop(e) { + var cm = this; + clearDragCursor(cm); + if (signalDOMEvent(cm, e) || eventInWidget(cm.display, e)) { + return; + } + e_preventDefault(e); + if (ie) { + lastDrop = +new Date(); + } + var pos = posFromMouse(cm, e, true), files = e.dataTransfer.files; + if (!pos || cm.isReadOnly()) { + return; + } + if (files && files.length && window.FileReader && window.File) { + var n = files.length, text = Array(n), read = 0; + var markAsReadAndPasteIfAllFilesAreRead = function() { + if (++read == n) { + operation(cm, function() { + pos = clipPos(cm.doc, pos); + var change = { + from: pos, + to: pos, + text: cm.doc.splitLines(text.filter(function(t) { + return t != null; + }).join(cm.doc.lineSeparator())), + origin: "paste" + }; + makeChange(cm.doc, change); + setSelectionReplaceHistory(cm.doc, simpleSelection(clipPos(cm.doc, pos), clipPos(cm.doc, changeEnd(change)))); + })(); + } + }; + var readTextFromFile = function(file, i3) { + if (cm.options.allowDropFileTypes && indexOf(cm.options.allowDropFileTypes, file.type) == -1) { + markAsReadAndPasteIfAllFilesAreRead(); + return; + } + var reader = new FileReader(); + reader.onerror = function() { + return markAsReadAndPasteIfAllFilesAreRead(); + }; + reader.onload = function() { + var content = reader.result; + if (/[\x00-\x08\x0e-\x1f]{2}/.test(content)) { + markAsReadAndPasteIfAllFilesAreRead(); + return; + } + text[i3] = content; + markAsReadAndPasteIfAllFilesAreRead(); + }; + reader.readAsText(file); + }; + for (var i2 = 0; i2 < files.length; i2++) { + readTextFromFile(files[i2], i2); + } + } else { + if (cm.state.draggingText && cm.doc.sel.contains(pos) > -1) { + cm.state.draggingText(e); + setTimeout(function() { + return cm.display.input.focus(); + }, 20); + return; + } + try { + var text$1 = e.dataTransfer.getData("Text"); + if (text$1) { + var selected; + if (cm.state.draggingText && !cm.state.draggingText.copy) { + selected = cm.listSelections(); + } + setSelectionNoUndo(cm.doc, simpleSelection(pos, pos)); + if (selected) { + for (var i$12 = 0; i$12 < selected.length; ++i$12) { + replaceRange(cm.doc, "", selected[i$12].anchor, selected[i$12].head, "drag"); + } + } + cm.replaceSelection(text$1, "around", "paste"); + cm.display.input.focus(); + } + } catch (e$1) { + } + } + } + function onDragStart(cm, e) { + if (ie && (!cm.state.draggingText || +new Date() - lastDrop < 100)) { + e_stop(e); + return; + } + if (signalDOMEvent(cm, e) || eventInWidget(cm.display, e)) { + return; + } + e.dataTransfer.setData("Text", cm.getSelection()); + e.dataTransfer.effectAllowed = "copyMove"; + if (e.dataTransfer.setDragImage && !safari) { + var img = elt("img", null, null, "position: fixed; left: 0; top: 0;"); + img.src = "data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw=="; + if (presto) { + img.width = img.height = 1; + cm.display.wrapper.appendChild(img); + img._top = img.offsetTop; + } + e.dataTransfer.setDragImage(img, 0, 0); + if (presto) { + img.parentNode.removeChild(img); + } + } + } + function onDragOver(cm, e) { + var pos = posFromMouse(cm, e); + if (!pos) { + return; + } + var frag = document.createDocumentFragment(); + drawSelectionCursor(cm, pos, frag); + if (!cm.display.dragCursor) { + cm.display.dragCursor = elt("div", null, "CodeMirror-cursors CodeMirror-dragcursors"); + cm.display.lineSpace.insertBefore(cm.display.dragCursor, cm.display.cursorDiv); + } + removeChildrenAndAdd(cm.display.dragCursor, frag); + } + function clearDragCursor(cm) { + if (cm.display.dragCursor) { + cm.display.lineSpace.removeChild(cm.display.dragCursor); + cm.display.dragCursor = null; + } + } + function forEachCodeMirror(f) { + if (!document.getElementsByClassName) { + return; + } + var byClass = document.getElementsByClassName("CodeMirror"), editors = []; + for (var i2 = 0; i2 < byClass.length; i2++) { + var cm = byClass[i2].CodeMirror; + if (cm) { + editors.push(cm); + } + } + if (editors.length) { + editors[0].operation(function() { + for (var i3 = 0; i3 < editors.length; i3++) { + f(editors[i3]); + } + }); + } + } + var globalsRegistered = false; + function ensureGlobalHandlers() { + if (globalsRegistered) { + return; + } + registerGlobalHandlers(); + globalsRegistered = true; + } + function registerGlobalHandlers() { + var resizeTimer; + on(window, "resize", function() { + if (resizeTimer == null) { + resizeTimer = setTimeout(function() { + resizeTimer = null; + forEachCodeMirror(onResize); + }, 100); + } + }); + on(window, "blur", function() { + return forEachCodeMirror(onBlur); + }); + } + function onResize(cm) { + var d = cm.display; + d.cachedCharWidth = d.cachedTextHeight = d.cachedPaddingH = null; + d.scrollbarsClipped = false; + cm.setSize(); + } + var keyNames = { + 3: "Pause", + 8: "Backspace", + 9: "Tab", + 13: "Enter", + 16: "Shift", + 17: "Ctrl", + 18: "Alt", + 19: "Pause", + 20: "CapsLock", + 27: "Esc", + 32: "Space", + 33: "PageUp", + 34: "PageDown", + 35: "End", + 36: "Home", + 37: "Left", + 38: "Up", + 39: "Right", + 40: "Down", + 44: "PrintScrn", + 45: "Insert", + 46: "Delete", + 59: ";", + 61: "=", + 91: "Mod", + 92: "Mod", + 93: "Mod", + 106: "*", + 107: "=", + 109: "-", + 110: ".", + 111: "/", + 145: "ScrollLock", + 173: "-", + 186: ";", + 187: "=", + 188: ",", + 189: "-", + 190: ".", + 191: "/", + 192: "`", + 219: "[", + 220: "\\", + 221: "]", + 222: "'", + 224: "Mod", + 63232: "Up", + 63233: "Down", + 63234: "Left", + 63235: "Right", + 63272: "Delete", + 63273: "Home", + 63275: "End", + 63276: "PageUp", + 63277: "PageDown", + 63302: "Insert" + }; + for (var i = 0; i < 10; i++) { + keyNames[i + 48] = keyNames[i + 96] = String(i); + } + for (var i$1 = 65; i$1 <= 90; i$1++) { + keyNames[i$1] = String.fromCharCode(i$1); + } + for (var i$2 = 1; i$2 <= 12; i$2++) { + keyNames[i$2 + 111] = keyNames[i$2 + 63235] = "F" + i$2; + } + var keyMap = {}; + keyMap.basic = { + "Left": "goCharLeft", + "Right": "goCharRight", + "Up": "goLineUp", + "Down": "goLineDown", + "End": "goLineEnd", + "Home": "goLineStartSmart", + "PageUp": "goPageUp", + "PageDown": "goPageDown", + "Delete": "delCharAfter", + "Backspace": "delCharBefore", + "Shift-Backspace": "delCharBefore", + "Tab": "defaultTab", + "Shift-Tab": "indentAuto", + "Enter": "newlineAndIndent", + "Insert": "toggleOverwrite", + "Esc": "singleSelection" + }; + keyMap.pcDefault = { + "Ctrl-A": "selectAll", + "Ctrl-D": "deleteLine", + "Ctrl-Z": "undo", + "Shift-Ctrl-Z": "redo", + "Ctrl-Y": "redo", + "Ctrl-Home": "goDocStart", + "Ctrl-End": "goDocEnd", + "Ctrl-Up": "goLineUp", + "Ctrl-Down": "goLineDown", + "Ctrl-Left": "goGroupLeft", + "Ctrl-Right": "goGroupRight", + "Alt-Left": "goLineStart", + "Alt-Right": "goLineEnd", + "Ctrl-Backspace": "delGroupBefore", + "Ctrl-Delete": "delGroupAfter", + "Ctrl-S": "save", + "Ctrl-F": "find", + "Ctrl-G": "findNext", + "Shift-Ctrl-G": "findPrev", + "Shift-Ctrl-F": "replace", + "Shift-Ctrl-R": "replaceAll", + "Ctrl-[": "indentLess", + "Ctrl-]": "indentMore", + "Ctrl-U": "undoSelection", + "Shift-Ctrl-U": "redoSelection", + "Alt-U": "redoSelection", + "fallthrough": "basic" + }; + keyMap.emacsy = { + "Ctrl-F": "goCharRight", + "Ctrl-B": "goCharLeft", + "Ctrl-P": "goLineUp", + "Ctrl-N": "goLineDown", + "Ctrl-A": "goLineStart", + "Ctrl-E": "goLineEnd", + "Ctrl-V": "goPageDown", + "Shift-Ctrl-V": "goPageUp", + "Ctrl-D": "delCharAfter", + "Ctrl-H": "delCharBefore", + "Alt-Backspace": "delWordBefore", + "Ctrl-K": "killLine", + "Ctrl-T": "transposeChars", + "Ctrl-O": "openLine" + }; + keyMap.macDefault = { + "Cmd-A": "selectAll", + "Cmd-D": "deleteLine", + "Cmd-Z": "undo", + "Shift-Cmd-Z": "redo", + "Cmd-Y": "redo", + "Cmd-Home": "goDocStart", + "Cmd-Up": "goDocStart", + "Cmd-End": "goDocEnd", + "Cmd-Down": "goDocEnd", + "Alt-Left": "goGroupLeft", + "Alt-Right": "goGroupRight", + "Cmd-Left": "goLineLeft", + "Cmd-Right": "goLineRight", + "Alt-Backspace": "delGroupBefore", + "Ctrl-Alt-Backspace": "delGroupAfter", + "Alt-Delete": "delGroupAfter", + "Cmd-S": "save", + "Cmd-F": "find", + "Cmd-G": "findNext", + "Shift-Cmd-G": "findPrev", + "Cmd-Alt-F": "replace", + "Shift-Cmd-Alt-F": "replaceAll", + "Cmd-[": "indentLess", + "Cmd-]": "indentMore", + "Cmd-Backspace": "delWrappedLineLeft", + "Cmd-Delete": "delWrappedLineRight", + "Cmd-U": "undoSelection", + "Shift-Cmd-U": "redoSelection", + "Ctrl-Up": "goDocStart", + "Ctrl-Down": "goDocEnd", + "fallthrough": ["basic", "emacsy"] + }; + keyMap["default"] = mac ? keyMap.macDefault : keyMap.pcDefault; + function normalizeKeyName(name) { + var parts = name.split(/-(?!$)/); + name = parts[parts.length - 1]; + var alt, ctrl, shift, cmd; + for (var i2 = 0; i2 < parts.length - 1; i2++) { + var mod = parts[i2]; + if (/^(cmd|meta|m)$/i.test(mod)) { + cmd = true; + } else if (/^a(lt)?$/i.test(mod)) { + alt = true; + } else if (/^(c|ctrl|control)$/i.test(mod)) { + ctrl = true; + } else if (/^s(hift)?$/i.test(mod)) { + shift = true; + } else { + throw new Error("Unrecognized modifier name: " + mod); + } + } + if (alt) { + name = "Alt-" + name; + } + if (ctrl) { + name = "Ctrl-" + name; + } + if (cmd) { + name = "Cmd-" + name; + } + if (shift) { + name = "Shift-" + name; + } + return name; + } + function normalizeKeyMap(keymap) { + var copy = {}; + for (var keyname in keymap) { + if (keymap.hasOwnProperty(keyname)) { + var value = keymap[keyname]; + if (/^(name|fallthrough|(de|at)tach)$/.test(keyname)) { + continue; + } + if (value == "...") { + delete keymap[keyname]; + continue; + } + var keys = map(keyname.split(" "), normalizeKeyName); + for (var i2 = 0; i2 < keys.length; i2++) { + var val = void 0, name = void 0; + if (i2 == keys.length - 1) { + name = keys.join(" "); + val = value; + } else { + name = keys.slice(0, i2 + 1).join(" "); + val = "..."; + } + var prev = copy[name]; + if (!prev) { + copy[name] = val; + } else if (prev != val) { + throw new Error("Inconsistent bindings for " + name); + } + } + delete keymap[keyname]; + } + } + for (var prop2 in copy) { + keymap[prop2] = copy[prop2]; + } + return keymap; + } + function lookupKey(key, map2, handle, context) { + map2 = getKeyMap(map2); + var found = map2.call ? map2.call(key, context) : map2[key]; + if (found === false) { + return "nothing"; + } + if (found === "...") { + return "multi"; + } + if (found != null && handle(found)) { + return "handled"; + } + if (map2.fallthrough) { + if (Object.prototype.toString.call(map2.fallthrough) != "[object Array]") { + return lookupKey(key, map2.fallthrough, handle, context); + } + for (var i2 = 0; i2 < map2.fallthrough.length; i2++) { + var result = lookupKey(key, map2.fallthrough[i2], handle, context); + if (result) { + return result; + } + } + } + } + function isModifierKey(value) { + var name = typeof value == "string" ? value : keyNames[value.keyCode]; + return name == "Ctrl" || name == "Alt" || name == "Shift" || name == "Mod"; + } + function addModifierNames(name, event, noShift) { + var base = name; + if (event.altKey && base != "Alt") { + name = "Alt-" + name; + } + if ((flipCtrlCmd ? event.metaKey : event.ctrlKey) && base != "Ctrl") { + name = "Ctrl-" + name; + } + if ((flipCtrlCmd ? event.ctrlKey : event.metaKey) && base != "Mod") { + name = "Cmd-" + name; + } + if (!noShift && event.shiftKey && base != "Shift") { + name = "Shift-" + name; + } + return name; + } + function keyName(event, noShift) { + if (presto && event.keyCode == 34 && event["char"]) { + return false; + } + var name = keyNames[event.keyCode]; + if (name == null || event.altGraphKey) { + return false; + } + if (event.keyCode == 3 && event.code) { + name = event.code; + } + return addModifierNames(name, event, noShift); + } + function getKeyMap(val) { + return typeof val == "string" ? keyMap[val] : val; + } + function deleteNearSelection(cm, compute) { + var ranges = cm.doc.sel.ranges, kill = []; + for (var i2 = 0; i2 < ranges.length; i2++) { + var toKill = compute(ranges[i2]); + while (kill.length && cmp(toKill.from, lst(kill).to) <= 0) { + var replaced = kill.pop(); + if (cmp(replaced.from, toKill.from) < 0) { + toKill.from = replaced.from; + break; + } + } + kill.push(toKill); + } + runInOp(cm, function() { + for (var i3 = kill.length - 1; i3 >= 0; i3--) { + replaceRange(cm.doc, "", kill[i3].from, kill[i3].to, "+delete"); + } + ensureCursorVisible(cm); + }); + } + function moveCharLogically(line, ch, dir) { + var target = skipExtendingChars(line.text, ch + dir, dir); + return target < 0 || target > line.text.length ? null : target; + } + function moveLogically(line, start, dir) { + var ch = moveCharLogically(line, start.ch, dir); + return ch == null ? null : new Pos(start.line, ch, dir < 0 ? "after" : "before"); + } + function endOfLine(visually, cm, lineObj, lineNo2, dir) { + if (visually) { + if (cm.doc.direction == "rtl") { + dir = -dir; + } + var order = getOrder(lineObj, cm.doc.direction); + if (order) { + var part = dir < 0 ? lst(order) : order[0]; + var moveInStorageOrder = dir < 0 == (part.level == 1); + var sticky = moveInStorageOrder ? "after" : "before"; + var ch; + if (part.level > 0 || cm.doc.direction == "rtl") { + var prep = prepareMeasureForLine(cm, lineObj); + ch = dir < 0 ? lineObj.text.length - 1 : 0; + var targetTop = measureCharPrepared(cm, prep, ch).top; + ch = findFirst(function(ch2) { + return measureCharPrepared(cm, prep, ch2).top == targetTop; + }, dir < 0 == (part.level == 1) ? part.from : part.to - 1, ch); + if (sticky == "before") { + ch = moveCharLogically(lineObj, ch, 1); + } + } else { + ch = dir < 0 ? part.to : part.from; + } + return new Pos(lineNo2, ch, sticky); + } + } + return new Pos(lineNo2, dir < 0 ? lineObj.text.length : 0, dir < 0 ? "before" : "after"); + } + function moveVisually(cm, line, start, dir) { + var bidi = getOrder(line, cm.doc.direction); + if (!bidi) { + return moveLogically(line, start, dir); + } + if (start.ch >= line.text.length) { + start.ch = line.text.length; + start.sticky = "before"; + } else if (start.ch <= 0) { + start.ch = 0; + start.sticky = "after"; + } + var partPos = getBidiPartAt(bidi, start.ch, start.sticky), part = bidi[partPos]; + if (cm.doc.direction == "ltr" && part.level % 2 == 0 && (dir > 0 ? part.to > start.ch : part.from < start.ch)) { + return moveLogically(line, start, dir); + } + var mv = function(pos, dir2) { + return moveCharLogically(line, pos instanceof Pos ? pos.ch : pos, dir2); + }; + var prep; + var getWrappedLineExtent = function(ch2) { + if (!cm.options.lineWrapping) { + return { begin: 0, end: line.text.length }; + } + prep = prep || prepareMeasureForLine(cm, line); + return wrappedLineExtentChar(cm, line, prep, ch2); + }; + var wrappedLineExtent2 = getWrappedLineExtent(start.sticky == "before" ? mv(start, -1) : start.ch); + if (cm.doc.direction == "rtl" || part.level == 1) { + var moveInStorageOrder = part.level == 1 == dir < 0; + var ch = mv(start, moveInStorageOrder ? 1 : -1); + if (ch != null && (!moveInStorageOrder ? ch >= part.from && ch >= wrappedLineExtent2.begin : ch <= part.to && ch <= wrappedLineExtent2.end)) { + var sticky = moveInStorageOrder ? "before" : "after"; + return new Pos(start.line, ch, sticky); + } + } + var searchInVisualLine = function(partPos2, dir2, wrappedLineExtent3) { + var getRes = function(ch3, moveInStorageOrder3) { + return moveInStorageOrder3 ? new Pos(start.line, mv(ch3, 1), "before") : new Pos(start.line, ch3, "after"); + }; + for (; partPos2 >= 0 && partPos2 < bidi.length; partPos2 += dir2) { + var part2 = bidi[partPos2]; + var moveInStorageOrder2 = dir2 > 0 == (part2.level != 1); + var ch2 = moveInStorageOrder2 ? wrappedLineExtent3.begin : mv(wrappedLineExtent3.end, -1); + if (part2.from <= ch2 && ch2 < part2.to) { + return getRes(ch2, moveInStorageOrder2); + } + ch2 = moveInStorageOrder2 ? part2.from : mv(part2.to, -1); + if (wrappedLineExtent3.begin <= ch2 && ch2 < wrappedLineExtent3.end) { + return getRes(ch2, moveInStorageOrder2); + } + } + }; + var res = searchInVisualLine(partPos + dir, dir, wrappedLineExtent2); + if (res) { + return res; + } + var nextCh = dir > 0 ? wrappedLineExtent2.end : mv(wrappedLineExtent2.begin, -1); + if (nextCh != null && !(dir > 0 && nextCh == line.text.length)) { + res = searchInVisualLine(dir > 0 ? 0 : bidi.length - 1, dir, getWrappedLineExtent(nextCh)); + if (res) { + return res; + } + } + return null; + } + var commands = { + selectAll, + singleSelection: function(cm) { + return cm.setSelection(cm.getCursor("anchor"), cm.getCursor("head"), sel_dontScroll); + }, + killLine: function(cm) { + return deleteNearSelection(cm, function(range2) { + if (range2.empty()) { + var len = getLine(cm.doc, range2.head.line).text.length; + if (range2.head.ch == len && range2.head.line < cm.lastLine()) { + return { from: range2.head, to: Pos(range2.head.line + 1, 0) }; + } else { + return { from: range2.head, to: Pos(range2.head.line, len) }; + } + } else { + return { from: range2.from(), to: range2.to() }; + } + }); + }, + deleteLine: function(cm) { + return deleteNearSelection(cm, function(range2) { + return { + from: Pos(range2.from().line, 0), + to: clipPos(cm.doc, Pos(range2.to().line + 1, 0)) + }; + }); + }, + delLineLeft: function(cm) { + return deleteNearSelection(cm, function(range2) { + return { + from: Pos(range2.from().line, 0), + to: range2.from() + }; + }); + }, + delWrappedLineLeft: function(cm) { + return deleteNearSelection(cm, function(range2) { + var top = cm.charCoords(range2.head, "div").top + 5; + var leftPos = cm.coordsChar({ left: 0, top }, "div"); + return { from: leftPos, to: range2.from() }; + }); + }, + delWrappedLineRight: function(cm) { + return deleteNearSelection(cm, function(range2) { + var top = cm.charCoords(range2.head, "div").top + 5; + var rightPos = cm.coordsChar({ left: cm.display.lineDiv.offsetWidth + 100, top }, "div"); + return { from: range2.from(), to: rightPos }; + }); + }, + undo: function(cm) { + return cm.undo(); + }, + redo: function(cm) { + return cm.redo(); + }, + undoSelection: function(cm) { + return cm.undoSelection(); + }, + redoSelection: function(cm) { + return cm.redoSelection(); + }, + goDocStart: function(cm) { + return cm.extendSelection(Pos(cm.firstLine(), 0)); + }, + goDocEnd: function(cm) { + return cm.extendSelection(Pos(cm.lastLine())); + }, + goLineStart: function(cm) { + return cm.extendSelectionsBy(function(range2) { + return lineStart(cm, range2.head.line); + }, { origin: "+move", bias: 1 }); + }, + goLineStartSmart: function(cm) { + return cm.extendSelectionsBy(function(range2) { + return lineStartSmart(cm, range2.head); + }, { origin: "+move", bias: 1 }); + }, + goLineEnd: function(cm) { + return cm.extendSelectionsBy(function(range2) { + return lineEnd(cm, range2.head.line); + }, { origin: "+move", bias: -1 }); + }, + goLineRight: function(cm) { + return cm.extendSelectionsBy(function(range2) { + var top = cm.cursorCoords(range2.head, "div").top + 5; + return cm.coordsChar({ left: cm.display.lineDiv.offsetWidth + 100, top }, "div"); + }, sel_move); + }, + goLineLeft: function(cm) { + return cm.extendSelectionsBy(function(range2) { + var top = cm.cursorCoords(range2.head, "div").top + 5; + return cm.coordsChar({ left: 0, top }, "div"); + }, sel_move); + }, + goLineLeftSmart: function(cm) { + return cm.extendSelectionsBy(function(range2) { + var top = cm.cursorCoords(range2.head, "div").top + 5; + var pos = cm.coordsChar({ left: 0, top }, "div"); + if (pos.ch < cm.getLine(pos.line).search(/\S/)) { + return lineStartSmart(cm, range2.head); + } + return pos; + }, sel_move); + }, + goLineUp: function(cm) { + return cm.moveV(-1, "line"); + }, + goLineDown: function(cm) { + return cm.moveV(1, "line"); + }, + goPageUp: function(cm) { + return cm.moveV(-1, "page"); + }, + goPageDown: function(cm) { + return cm.moveV(1, "page"); + }, + goCharLeft: function(cm) { + return cm.moveH(-1, "char"); + }, + goCharRight: function(cm) { + return cm.moveH(1, "char"); + }, + goColumnLeft: function(cm) { + return cm.moveH(-1, "column"); + }, + goColumnRight: function(cm) { + return cm.moveH(1, "column"); + }, + goWordLeft: function(cm) { + return cm.moveH(-1, "word"); + }, + goGroupRight: function(cm) { + return cm.moveH(1, "group"); + }, + goGroupLeft: function(cm) { + return cm.moveH(-1, "group"); + }, + goWordRight: function(cm) { + return cm.moveH(1, "word"); + }, + delCharBefore: function(cm) { + return cm.deleteH(-1, "codepoint"); + }, + delCharAfter: function(cm) { + return cm.deleteH(1, "char"); + }, + delWordBefore: function(cm) { + return cm.deleteH(-1, "word"); + }, + delWordAfter: function(cm) { + return cm.deleteH(1, "word"); + }, + delGroupBefore: function(cm) { + return cm.deleteH(-1, "group"); + }, + delGroupAfter: function(cm) { + return cm.deleteH(1, "group"); + }, + indentAuto: function(cm) { + return cm.indentSelection("smart"); + }, + indentMore: function(cm) { + return cm.indentSelection("add"); + }, + indentLess: function(cm) { + return cm.indentSelection("subtract"); + }, + insertTab: function(cm) { + return cm.replaceSelection(" "); + }, + insertSoftTab: function(cm) { + var spaces = [], ranges = cm.listSelections(), tabSize = cm.options.tabSize; + for (var i2 = 0; i2 < ranges.length; i2++) { + var pos = ranges[i2].from(); + var col = countColumn(cm.getLine(pos.line), pos.ch, tabSize); + spaces.push(spaceStr(tabSize - col % tabSize)); + } + cm.replaceSelections(spaces); + }, + defaultTab: function(cm) { + if (cm.somethingSelected()) { + cm.indentSelection("add"); + } else { + cm.execCommand("insertTab"); + } + }, + transposeChars: function(cm) { + return runInOp(cm, function() { + var ranges = cm.listSelections(), newSel = []; + for (var i2 = 0; i2 < ranges.length; i2++) { + if (!ranges[i2].empty()) { + continue; + } + var cur = ranges[i2].head, line = getLine(cm.doc, cur.line).text; + if (line) { + if (cur.ch == line.length) { + cur = new Pos(cur.line, cur.ch - 1); + } + if (cur.ch > 0) { + cur = new Pos(cur.line, cur.ch + 1); + cm.replaceRange(line.charAt(cur.ch - 1) + line.charAt(cur.ch - 2), Pos(cur.line, cur.ch - 2), cur, "+transpose"); + } else if (cur.line > cm.doc.first) { + var prev = getLine(cm.doc, cur.line - 1).text; + if (prev) { + cur = new Pos(cur.line, 1); + cm.replaceRange(line.charAt(0) + cm.doc.lineSeparator() + prev.charAt(prev.length - 1), Pos(cur.line - 1, prev.length - 1), cur, "+transpose"); + } + } + } + newSel.push(new Range(cur, cur)); + } + cm.setSelections(newSel); + }); + }, + newlineAndIndent: function(cm) { + return runInOp(cm, function() { + var sels = cm.listSelections(); + for (var i2 = sels.length - 1; i2 >= 0; i2--) { + cm.replaceRange(cm.doc.lineSeparator(), sels[i2].anchor, sels[i2].head, "+input"); + } + sels = cm.listSelections(); + for (var i$12 = 0; i$12 < sels.length; i$12++) { + cm.indentLine(sels[i$12].from().line, null, true); + } + ensureCursorVisible(cm); + }); + }, + openLine: function(cm) { + return cm.replaceSelection("\n", "start"); + }, + toggleOverwrite: function(cm) { + return cm.toggleOverwrite(); + } + }; + function lineStart(cm, lineN) { + var line = getLine(cm.doc, lineN); + var visual = visualLine(line); + if (visual != line) { + lineN = lineNo(visual); + } + return endOfLine(true, cm, visual, lineN, 1); + } + function lineEnd(cm, lineN) { + var line = getLine(cm.doc, lineN); + var visual = visualLineEnd(line); + if (visual != line) { + lineN = lineNo(visual); + } + return endOfLine(true, cm, line, lineN, -1); + } + function lineStartSmart(cm, pos) { + var start = lineStart(cm, pos.line); + var line = getLine(cm.doc, start.line); + var order = getOrder(line, cm.doc.direction); + if (!order || order[0].level == 0) { + var firstNonWS = Math.max(start.ch, line.text.search(/\S/)); + var inWS = pos.line == start.line && pos.ch <= firstNonWS && pos.ch; + return Pos(start.line, inWS ? 0 : firstNonWS, start.sticky); + } + return start; + } + function doHandleBinding(cm, bound, dropShift) { + if (typeof bound == "string") { + bound = commands[bound]; + if (!bound) { + return false; + } + } + cm.display.input.ensurePolled(); + var prevShift = cm.display.shift, done = false; + try { + if (cm.isReadOnly()) { + cm.state.suppressEdits = true; + } + if (dropShift) { + cm.display.shift = false; + } + done = bound(cm) != Pass; + } finally { + cm.display.shift = prevShift; + cm.state.suppressEdits = false; + } + return done; + } + function lookupKeyForEditor(cm, name, handle) { + for (var i2 = 0; i2 < cm.state.keyMaps.length; i2++) { + var result = lookupKey(name, cm.state.keyMaps[i2], handle, cm); + if (result) { + return result; + } + } + return cm.options.extraKeys && lookupKey(name, cm.options.extraKeys, handle, cm) || lookupKey(name, cm.options.keyMap, handle, cm); + } + var stopSeq = new Delayed(); + function dispatchKey(cm, name, e, handle) { + var seq = cm.state.keySeq; + if (seq) { + if (isModifierKey(name)) { + return "handled"; + } + if (/\'$/.test(name)) { + cm.state.keySeq = null; + } else { + stopSeq.set(50, function() { + if (cm.state.keySeq == seq) { + cm.state.keySeq = null; + cm.display.input.reset(); + } + }); + } + if (dispatchKeyInner(cm, seq + " " + name, e, handle)) { + return true; + } + } + return dispatchKeyInner(cm, name, e, handle); + } + function dispatchKeyInner(cm, name, e, handle) { + var result = lookupKeyForEditor(cm, name, handle); + if (result == "multi") { + cm.state.keySeq = name; + } + if (result == "handled") { + signalLater(cm, "keyHandled", cm, name, e); + } + if (result == "handled" || result == "multi") { + e_preventDefault(e); + restartBlink(cm); + } + return !!result; + } + function handleKeyBinding(cm, e) { + var name = keyName(e, true); + if (!name) { + return false; + } + if (e.shiftKey && !cm.state.keySeq) { + return dispatchKey(cm, "Shift-" + name, e, function(b) { + return doHandleBinding(cm, b, true); + }) || dispatchKey(cm, name, e, function(b) { + if (typeof b == "string" ? /^go[A-Z]/.test(b) : b.motion) { + return doHandleBinding(cm, b); + } + }); + } else { + return dispatchKey(cm, name, e, function(b) { + return doHandleBinding(cm, b); + }); + } + } + function handleCharBinding(cm, e, ch) { + return dispatchKey(cm, "'" + ch + "'", e, function(b) { + return doHandleBinding(cm, b, true); + }); + } + var lastStoppedKey = null; + function onKeyDown(e) { + var cm = this; + if (e.target && e.target != cm.display.input.getField()) { + return; + } + cm.curOp.focus = activeElt(); + if (signalDOMEvent(cm, e)) { + return; + } + if (ie && ie_version < 11 && e.keyCode == 27) { + e.returnValue = false; + } + var code = e.keyCode; + cm.display.shift = code == 16 || e.shiftKey; + var handled = handleKeyBinding(cm, e); + if (presto) { + lastStoppedKey = handled ? code : null; + if (!handled && code == 88 && !hasCopyEvent && (mac ? e.metaKey : e.ctrlKey)) { + cm.replaceSelection("", null, "cut"); + } + } + if (gecko && !mac && !handled && code == 46 && e.shiftKey && !e.ctrlKey && document.execCommand) { + document.execCommand("cut"); + } + if (code == 18 && !/\bCodeMirror-crosshair\b/.test(cm.display.lineDiv.className)) { + showCrossHair(cm); + } + } + function showCrossHair(cm) { + var lineDiv = cm.display.lineDiv; + addClass(lineDiv, "CodeMirror-crosshair"); + function up(e) { + if (e.keyCode == 18 || !e.altKey) { + rmClass(lineDiv, "CodeMirror-crosshair"); + off(document, "keyup", up); + off(document, "mouseover", up); + } + } + on(document, "keyup", up); + on(document, "mouseover", up); + } + function onKeyUp(e) { + if (e.keyCode == 16) { + this.doc.sel.shift = false; + } + signalDOMEvent(this, e); + } + function onKeyPress(e) { + var cm = this; + if (e.target && e.target != cm.display.input.getField()) { + return; + } + if (eventInWidget(cm.display, e) || signalDOMEvent(cm, e) || e.ctrlKey && !e.altKey || mac && e.metaKey) { + return; + } + var keyCode = e.keyCode, charCode = e.charCode; + if (presto && keyCode == lastStoppedKey) { + lastStoppedKey = null; + e_preventDefault(e); + return; + } + if (presto && (!e.which || e.which < 10) && handleKeyBinding(cm, e)) { + return; + } + var ch = String.fromCharCode(charCode == null ? keyCode : charCode); + if (ch == "\b") { + return; + } + if (handleCharBinding(cm, e, ch)) { + return; + } + cm.display.input.onKeyPress(e); + } + var DOUBLECLICK_DELAY = 400; + var PastClick = function(time, pos, button) { + this.time = time; + this.pos = pos; + this.button = button; + }; + PastClick.prototype.compare = function(time, pos, button) { + return this.time + DOUBLECLICK_DELAY > time && cmp(pos, this.pos) == 0 && button == this.button; + }; + var lastClick, lastDoubleClick; + function clickRepeat(pos, button) { + var now = +new Date(); + if (lastDoubleClick && lastDoubleClick.compare(now, pos, button)) { + lastClick = lastDoubleClick = null; + return "triple"; + } else if (lastClick && lastClick.compare(now, pos, button)) { + lastDoubleClick = new PastClick(now, pos, button); + lastClick = null; + return "double"; + } else { + lastClick = new PastClick(now, pos, button); + lastDoubleClick = null; + return "single"; + } + } + function onMouseDown(e) { + var cm = this, display = cm.display; + if (signalDOMEvent(cm, e) || display.activeTouch && display.input.supportsTouch()) { + return; + } + display.input.ensurePolled(); + display.shift = e.shiftKey; + if (eventInWidget(display, e)) { + if (!webkit) { + display.scroller.draggable = false; + setTimeout(function() { + return display.scroller.draggable = true; + }, 100); + } + return; + } + if (clickInGutter(cm, e)) { + return; + } + var pos = posFromMouse(cm, e), button = e_button(e), repeat = pos ? clickRepeat(pos, button) : "single"; + window.focus(); + if (button == 1 && cm.state.selectingText) { + cm.state.selectingText(e); + } + if (pos && handleMappedButton(cm, button, pos, repeat, e)) { + return; + } + if (button == 1) { + if (pos) { + leftButtonDown(cm, pos, repeat, e); + } else if (e_target(e) == display.scroller) { + e_preventDefault(e); + } + } else if (button == 2) { + if (pos) { + extendSelection(cm.doc, pos); + } + setTimeout(function() { + return display.input.focus(); + }, 20); + } else if (button == 3) { + if (captureRightClick) { + cm.display.input.onContextMenu(e); + } else { + delayBlurEvent(cm); + } + } + } + function handleMappedButton(cm, button, pos, repeat, event) { + var name = "Click"; + if (repeat == "double") { + name = "Double" + name; + } else if (repeat == "triple") { + name = "Triple" + name; + } + name = (button == 1 ? "Left" : button == 2 ? "Middle" : "Right") + name; + return dispatchKey(cm, addModifierNames(name, event), event, function(bound) { + if (typeof bound == "string") { + bound = commands[bound]; + } + if (!bound) { + return false; + } + var done = false; + try { + if (cm.isReadOnly()) { + cm.state.suppressEdits = true; + } + done = bound(cm, pos) != Pass; + } finally { + cm.state.suppressEdits = false; + } + return done; + }); + } + function configureMouse(cm, repeat, event) { + var option = cm.getOption("configureMouse"); + var value = option ? option(cm, repeat, event) : {}; + if (value.unit == null) { + var rect = chromeOS ? event.shiftKey && event.metaKey : event.altKey; + value.unit = rect ? "rectangle" : repeat == "single" ? "char" : repeat == "double" ? "word" : "line"; + } + if (value.extend == null || cm.doc.extend) { + value.extend = cm.doc.extend || event.shiftKey; + } + if (value.addNew == null) { + value.addNew = mac ? event.metaKey : event.ctrlKey; + } + if (value.moveOnDrag == null) { + value.moveOnDrag = !(mac ? event.altKey : event.ctrlKey); + } + return value; + } + function leftButtonDown(cm, pos, repeat, event) { + if (ie) { + setTimeout(bind(ensureFocus, cm), 0); + } else { + cm.curOp.focus = activeElt(); + } + var behavior = configureMouse(cm, repeat, event); + var sel = cm.doc.sel, contained; + if (cm.options.dragDrop && dragAndDrop && !cm.isReadOnly() && repeat == "single" && (contained = sel.contains(pos)) > -1 && (cmp((contained = sel.ranges[contained]).from(), pos) < 0 || pos.xRel > 0) && (cmp(contained.to(), pos) > 0 || pos.xRel < 0)) { + leftButtonStartDrag(cm, event, pos, behavior); + } else { + leftButtonSelect(cm, event, pos, behavior); + } + } + function leftButtonStartDrag(cm, event, pos, behavior) { + var display = cm.display, moved = false; + var dragEnd = operation(cm, function(e) { + if (webkit) { + display.scroller.draggable = false; + } + cm.state.draggingText = false; + if (cm.state.delayingBlurEvent) { + if (cm.hasFocus()) { + cm.state.delayingBlurEvent = false; + } else { + delayBlurEvent(cm); + } + } + off(display.wrapper.ownerDocument, "mouseup", dragEnd); + off(display.wrapper.ownerDocument, "mousemove", mouseMove); + off(display.scroller, "dragstart", dragStart); + off(display.scroller, "drop", dragEnd); + if (!moved) { + e_preventDefault(e); + if (!behavior.addNew) { + extendSelection(cm.doc, pos, null, null, behavior.extend); + } + if (webkit && !safari || ie && ie_version == 9) { + setTimeout(function() { + display.wrapper.ownerDocument.body.focus({ preventScroll: true }); + display.input.focus(); + }, 20); + } else { + display.input.focus(); + } + } + }); + var mouseMove = function(e2) { + moved = moved || Math.abs(event.clientX - e2.clientX) + Math.abs(event.clientY - e2.clientY) >= 10; + }; + var dragStart = function() { + return moved = true; + }; + if (webkit) { + display.scroller.draggable = true; + } + cm.state.draggingText = dragEnd; + dragEnd.copy = !behavior.moveOnDrag; + on(display.wrapper.ownerDocument, "mouseup", dragEnd); + on(display.wrapper.ownerDocument, "mousemove", mouseMove); + on(display.scroller, "dragstart", dragStart); + on(display.scroller, "drop", dragEnd); + cm.state.delayingBlurEvent = true; + setTimeout(function() { + return display.input.focus(); + }, 20); + if (display.scroller.dragDrop) { + display.scroller.dragDrop(); + } + } + function rangeForUnit(cm, pos, unit) { + if (unit == "char") { + return new Range(pos, pos); + } + if (unit == "word") { + return cm.findWordAt(pos); + } + if (unit == "line") { + return new Range(Pos(pos.line, 0), clipPos(cm.doc, Pos(pos.line + 1, 0))); + } + var result = unit(cm, pos); + return new Range(result.from, result.to); + } + function leftButtonSelect(cm, event, start, behavior) { + if (ie) { + delayBlurEvent(cm); + } + var display = cm.display, doc = cm.doc; + e_preventDefault(event); + var ourRange, ourIndex, startSel = doc.sel, ranges = startSel.ranges; + if (behavior.addNew && !behavior.extend) { + ourIndex = doc.sel.contains(start); + if (ourIndex > -1) { + ourRange = ranges[ourIndex]; + } else { + ourRange = new Range(start, start); + } + } else { + ourRange = doc.sel.primary(); + ourIndex = doc.sel.primIndex; + } + if (behavior.unit == "rectangle") { + if (!behavior.addNew) { + ourRange = new Range(start, start); + } + start = posFromMouse(cm, event, true, true); + ourIndex = -1; + } else { + var range2 = rangeForUnit(cm, start, behavior.unit); + if (behavior.extend) { + ourRange = extendRange(ourRange, range2.anchor, range2.head, behavior.extend); + } else { + ourRange = range2; + } + } + if (!behavior.addNew) { + ourIndex = 0; + setSelection(doc, new Selection([ourRange], 0), sel_mouse); + startSel = doc.sel; + } else if (ourIndex == -1) { + ourIndex = ranges.length; + setSelection(doc, normalizeSelection(cm, ranges.concat([ourRange]), ourIndex), { scroll: false, origin: "*mouse" }); + } else if (ranges.length > 1 && ranges[ourIndex].empty() && behavior.unit == "char" && !behavior.extend) { + setSelection(doc, normalizeSelection(cm, ranges.slice(0, ourIndex).concat(ranges.slice(ourIndex + 1)), 0), { scroll: false, origin: "*mouse" }); + startSel = doc.sel; + } else { + replaceOneSelection(doc, ourIndex, ourRange, sel_mouse); + } + var lastPos = start; + function extendTo(pos) { + if (cmp(lastPos, pos) == 0) { + return; + } + lastPos = pos; + if (behavior.unit == "rectangle") { + var ranges2 = [], tabSize = cm.options.tabSize; + var startCol = countColumn(getLine(doc, start.line).text, start.ch, tabSize); + var posCol = countColumn(getLine(doc, pos.line).text, pos.ch, tabSize); + var left = Math.min(startCol, posCol), right = Math.max(startCol, posCol); + for (var line = Math.min(start.line, pos.line), end = Math.min(cm.lastLine(), Math.max(start.line, pos.line)); line <= end; line++) { + var text = getLine(doc, line).text, leftPos = findColumn(text, left, tabSize); + if (left == right) { + ranges2.push(new Range(Pos(line, leftPos), Pos(line, leftPos))); + } else if (text.length > leftPos) { + ranges2.push(new Range(Pos(line, leftPos), Pos(line, findColumn(text, right, tabSize)))); + } + } + if (!ranges2.length) { + ranges2.push(new Range(start, start)); + } + setSelection(doc, normalizeSelection(cm, startSel.ranges.slice(0, ourIndex).concat(ranges2), ourIndex), { origin: "*mouse", scroll: false }); + cm.scrollIntoView(pos); + } else { + var oldRange = ourRange; + var range3 = rangeForUnit(cm, pos, behavior.unit); + var anchor = oldRange.anchor, head; + if (cmp(range3.anchor, anchor) > 0) { + head = range3.head; + anchor = minPos(oldRange.from(), range3.anchor); + } else { + head = range3.anchor; + anchor = maxPos(oldRange.to(), range3.head); + } + var ranges$1 = startSel.ranges.slice(0); + ranges$1[ourIndex] = bidiSimplify(cm, new Range(clipPos(doc, anchor), head)); + setSelection(doc, normalizeSelection(cm, ranges$1, ourIndex), sel_mouse); + } + } + var editorSize = display.wrapper.getBoundingClientRect(); + var counter = 0; + function extend(e) { + var curCount = ++counter; + var cur = posFromMouse(cm, e, true, behavior.unit == "rectangle"); + if (!cur) { + return; + } + if (cmp(cur, lastPos) != 0) { + cm.curOp.focus = activeElt(); + extendTo(cur); + var visible = visibleLines(display, doc); + if (cur.line >= visible.to || cur.line < visible.from) { + setTimeout(operation(cm, function() { + if (counter == curCount) { + extend(e); + } + }), 150); + } + } else { + var outside = e.clientY < editorSize.top ? -20 : e.clientY > editorSize.bottom ? 20 : 0; + if (outside) { + setTimeout(operation(cm, function() { + if (counter != curCount) { + return; + } + display.scroller.scrollTop += outside; + extend(e); + }), 50); + } + } + } + function done(e) { + cm.state.selectingText = false; + counter = Infinity; + if (e) { + e_preventDefault(e); + display.input.focus(); + } + off(display.wrapper.ownerDocument, "mousemove", move); + off(display.wrapper.ownerDocument, "mouseup", up); + doc.history.lastSelOrigin = null; + } + var move = operation(cm, function(e) { + if (e.buttons === 0 || !e_button(e)) { + done(e); + } else { + extend(e); + } + }); + var up = operation(cm, done); + cm.state.selectingText = up; + on(display.wrapper.ownerDocument, "mousemove", move); + on(display.wrapper.ownerDocument, "mouseup", up); + } + function bidiSimplify(cm, range2) { + var anchor = range2.anchor; + var head = range2.head; + var anchorLine = getLine(cm.doc, anchor.line); + if (cmp(anchor, head) == 0 && anchor.sticky == head.sticky) { + return range2; + } + var order = getOrder(anchorLine); + if (!order) { + return range2; + } + var index = getBidiPartAt(order, anchor.ch, anchor.sticky), part = order[index]; + if (part.from != anchor.ch && part.to != anchor.ch) { + return range2; + } + var boundary = index + (part.from == anchor.ch == (part.level != 1) ? 0 : 1); + if (boundary == 0 || boundary == order.length) { + return range2; + } + var leftSide; + if (head.line != anchor.line) { + leftSide = (head.line - anchor.line) * (cm.doc.direction == "ltr" ? 1 : -1) > 0; + } else { + var headIndex = getBidiPartAt(order, head.ch, head.sticky); + var dir = headIndex - index || (head.ch - anchor.ch) * (part.level == 1 ? -1 : 1); + if (headIndex == boundary - 1 || headIndex == boundary) { + leftSide = dir < 0; + } else { + leftSide = dir > 0; + } + } + var usePart = order[boundary + (leftSide ? -1 : 0)]; + var from = leftSide == (usePart.level == 1); + var ch = from ? usePart.from : usePart.to, sticky = from ? "after" : "before"; + return anchor.ch == ch && anchor.sticky == sticky ? range2 : new Range(new Pos(anchor.line, ch, sticky), head); + } + function gutterEvent(cm, e, type, prevent) { + var mX, mY; + if (e.touches) { + mX = e.touches[0].clientX; + mY = e.touches[0].clientY; + } else { + try { + mX = e.clientX; + mY = e.clientY; + } catch (e$1) { + return false; + } + } + if (mX >= Math.floor(cm.display.gutters.getBoundingClientRect().right)) { + return false; + } + if (prevent) { + e_preventDefault(e); + } + var display = cm.display; + var lineBox = display.lineDiv.getBoundingClientRect(); + if (mY > lineBox.bottom || !hasHandler(cm, type)) { + return e_defaultPrevented(e); + } + mY -= lineBox.top - display.viewOffset; + for (var i2 = 0; i2 < cm.display.gutterSpecs.length; ++i2) { + var g = display.gutters.childNodes[i2]; + if (g && g.getBoundingClientRect().right >= mX) { + var line = lineAtHeight(cm.doc, mY); + var gutter = cm.display.gutterSpecs[i2]; + signal(cm, type, cm, line, gutter.className, e); + return e_defaultPrevented(e); + } + } + } + function clickInGutter(cm, e) { + return gutterEvent(cm, e, "gutterClick", true); + } + function onContextMenu(cm, e) { + if (eventInWidget(cm.display, e) || contextMenuInGutter(cm, e)) { + return; + } + if (signalDOMEvent(cm, e, "contextmenu")) { + return; + } + if (!captureRightClick) { + cm.display.input.onContextMenu(e); + } + } + function contextMenuInGutter(cm, e) { + if (!hasHandler(cm, "gutterContextMenu")) { + return false; + } + return gutterEvent(cm, e, "gutterContextMenu", false); + } + function themeChanged(cm) { + cm.display.wrapper.className = cm.display.wrapper.className.replace(/\s*cm-s-\S+/g, "") + cm.options.theme.replace(/(^|\s)\s*/g, " cm-s-"); + clearCaches(cm); + } + var Init = { toString: function() { + return "CodeMirror.Init"; + } }; + var defaults = {}; + var optionHandlers = {}; + function defineOptions(CodeMirror2) { + var optionHandlers2 = CodeMirror2.optionHandlers; + function option(name, deflt, handle, notOnInit) { + CodeMirror2.defaults[name] = deflt; + if (handle) { + optionHandlers2[name] = notOnInit ? function(cm, val, old) { + if (old != Init) { + handle(cm, val, old); + } + } : handle; + } + } + CodeMirror2.defineOption = option; + CodeMirror2.Init = Init; + option("value", "", function(cm, val) { + return cm.setValue(val); + }, true); + option("mode", null, function(cm, val) { + cm.doc.modeOption = val; + loadMode(cm); + }, true); + option("indentUnit", 2, loadMode, true); + option("indentWithTabs", false); + option("smartIndent", true); + option("tabSize", 4, function(cm) { + resetModeState(cm); + clearCaches(cm); + regChange(cm); + }, true); + option("lineSeparator", null, function(cm, val) { + cm.doc.lineSep = val; + if (!val) { + return; + } + var newBreaks = [], lineNo2 = cm.doc.first; + cm.doc.iter(function(line) { + for (var pos = 0; ; ) { + var found = line.text.indexOf(val, pos); + if (found == -1) { + break; + } + pos = found + val.length; + newBreaks.push(Pos(lineNo2, found)); + } + lineNo2++; + }); + for (var i2 = newBreaks.length - 1; i2 >= 0; i2--) { + replaceRange(cm.doc, val, newBreaks[i2], Pos(newBreaks[i2].line, newBreaks[i2].ch + val.length)); + } + }); + option("specialChars", /[\u0000-\u001f\u007f-\u009f\u00ad\u061c\u200b\u200e\u200f\u2028\u2029\ufeff\ufff9-\ufffc]/g, function(cm, val, old) { + cm.state.specialChars = new RegExp(val.source + (val.test(" ") ? "" : "| "), "g"); + if (old != Init) { + cm.refresh(); + } + }); + option("specialCharPlaceholder", defaultSpecialCharPlaceholder, function(cm) { + return cm.refresh(); + }, true); + option("electricChars", true); + option("inputStyle", mobile ? "contenteditable" : "textarea", function() { + throw new Error("inputStyle can not (yet) be changed in a running editor"); + }, true); + option("spellcheck", false, function(cm, val) { + return cm.getInputField().spellcheck = val; + }, true); + option("autocorrect", false, function(cm, val) { + return cm.getInputField().autocorrect = val; + }, true); + option("autocapitalize", false, function(cm, val) { + return cm.getInputField().autocapitalize = val; + }, true); + option("rtlMoveVisually", !windows); + option("wholeLineUpdateBefore", true); + option("theme", "default", function(cm) { + themeChanged(cm); + updateGutters(cm); + }, true); + option("keyMap", "default", function(cm, val, old) { + var next = getKeyMap(val); + var prev = old != Init && getKeyMap(old); + if (prev && prev.detach) { + prev.detach(cm, next); + } + if (next.attach) { + next.attach(cm, prev || null); + } + }); + option("extraKeys", null); + option("configureMouse", null); + option("lineWrapping", false, wrappingChanged, true); + option("gutters", [], function(cm, val) { + cm.display.gutterSpecs = getGutters(val, cm.options.lineNumbers); + updateGutters(cm); + }, true); + option("fixedGutter", true, function(cm, val) { + cm.display.gutters.style.left = val ? compensateForHScroll(cm.display) + "px" : "0"; + cm.refresh(); + }, true); + option("coverGutterNextToScrollbar", false, function(cm) { + return updateScrollbars(cm); + }, true); + option("scrollbarStyle", "native", function(cm) { + initScrollbars(cm); + updateScrollbars(cm); + cm.display.scrollbars.setScrollTop(cm.doc.scrollTop); + cm.display.scrollbars.setScrollLeft(cm.doc.scrollLeft); + }, true); + option("lineNumbers", false, function(cm, val) { + cm.display.gutterSpecs = getGutters(cm.options.gutters, val); + updateGutters(cm); + }, true); + option("firstLineNumber", 1, updateGutters, true); + option("lineNumberFormatter", function(integer) { + return integer; + }, updateGutters, true); + option("showCursorWhenSelecting", false, updateSelection, true); + option("resetSelectionOnContextMenu", true); + option("lineWiseCopyCut", true); + option("pasteLinesPerSelection", true); + option("selectionsMayTouch", false); + option("readOnly", false, function(cm, val) { + if (val == "nocursor") { + onBlur(cm); + cm.display.input.blur(); + } + cm.display.input.readOnlyChanged(val); + }); + option("screenReaderLabel", null, function(cm, val) { + val = val === "" ? null : val; + cm.display.input.screenReaderLabelChanged(val); + }); + option("disableInput", false, function(cm, val) { + if (!val) { + cm.display.input.reset(); + } + }, true); + option("dragDrop", true, dragDropChanged); + option("allowDropFileTypes", null); + option("cursorBlinkRate", 530); + option("cursorScrollMargin", 0); + option("cursorHeight", 1, updateSelection, true); + option("singleCursorHeightPerLine", true, updateSelection, true); + option("workTime", 100); + option("workDelay", 100); + option("flattenSpans", true, resetModeState, true); + option("addModeClass", false, resetModeState, true); + option("pollInterval", 100); + option("undoDepth", 200, function(cm, val) { + return cm.doc.history.undoDepth = val; + }); + option("historyEventDelay", 1250); + option("viewportMargin", 10, function(cm) { + return cm.refresh(); + }, true); + option("maxHighlightLength", 1e4, resetModeState, true); + option("moveInputWithCursor", true, function(cm, val) { + if (!val) { + cm.display.input.resetPosition(); + } + }); + option("tabindex", null, function(cm, val) { + return cm.display.input.getField().tabIndex = val || ""; + }); + option("autofocus", null); + option("direction", "ltr", function(cm, val) { + return cm.doc.setDirection(val); + }, true); + option("phrases", null); + } + function dragDropChanged(cm, value, old) { + var wasOn = old && old != Init; + if (!value != !wasOn) { + var funcs = cm.display.dragFunctions; + var toggle = value ? on : off; + toggle(cm.display.scroller, "dragstart", funcs.start); + toggle(cm.display.scroller, "dragenter", funcs.enter); + toggle(cm.display.scroller, "dragover", funcs.over); + toggle(cm.display.scroller, "dragleave", funcs.leave); + toggle(cm.display.scroller, "drop", funcs.drop); + } + } + function wrappingChanged(cm) { + if (cm.options.lineWrapping) { + addClass(cm.display.wrapper, "CodeMirror-wrap"); + cm.display.sizer.style.minWidth = ""; + cm.display.sizerWidth = null; + } else { + rmClass(cm.display.wrapper, "CodeMirror-wrap"); + findMaxLine(cm); + } + estimateLineHeights(cm); + regChange(cm); + clearCaches(cm); + setTimeout(function() { + return updateScrollbars(cm); + }, 100); + } + function CodeMirror(place, options) { + var this$1$1 = this; + if (!(this instanceof CodeMirror)) { + return new CodeMirror(place, options); + } + this.options = options = options ? copyObj(options) : {}; + copyObj(defaults, options, false); + var doc = options.value; + if (typeof doc == "string") { + doc = new Doc(doc, options.mode, null, options.lineSeparator, options.direction); + } else if (options.mode) { + doc.modeOption = options.mode; + } + this.doc = doc; + var input = new CodeMirror.inputStyles[options.inputStyle](this); + var display = this.display = new Display(place, doc, input, options); + display.wrapper.CodeMirror = this; + themeChanged(this); + if (options.lineWrapping) { + this.display.wrapper.className += " CodeMirror-wrap"; + } + initScrollbars(this); + this.state = { + keyMaps: [], + overlays: [], + modeGen: 0, + overwrite: false, + delayingBlurEvent: false, + focused: false, + suppressEdits: false, + pasteIncoming: -1, + cutIncoming: -1, + selectingText: false, + draggingText: false, + highlight: new Delayed(), + keySeq: null, + specialChars: null + }; + if (options.autofocus && !mobile) { + display.input.focus(); + } + if (ie && ie_version < 11) { + setTimeout(function() { + return this$1$1.display.input.reset(true); + }, 20); + } + registerEventHandlers(this); + ensureGlobalHandlers(); + startOperation(this); + this.curOp.forceUpdate = true; + attachDoc(this, doc); + if (options.autofocus && !mobile || this.hasFocus()) { + setTimeout(function() { + if (this$1$1.hasFocus() && !this$1$1.state.focused) { + onFocus(this$1$1); + } + }, 20); + } else { + onBlur(this); + } + for (var opt in optionHandlers) { + if (optionHandlers.hasOwnProperty(opt)) { + optionHandlers[opt](this, options[opt], Init); + } + } + maybeUpdateLineNumberWidth(this); + if (options.finishInit) { + options.finishInit(this); + } + for (var i2 = 0; i2 < initHooks.length; ++i2) { + initHooks[i2](this); + } + endOperation(this); + if (webkit && options.lineWrapping && getComputedStyle(display.lineDiv).textRendering == "optimizelegibility") { + display.lineDiv.style.textRendering = "auto"; + } + } + CodeMirror.defaults = defaults; + CodeMirror.optionHandlers = optionHandlers; + function registerEventHandlers(cm) { + var d = cm.display; + on(d.scroller, "mousedown", operation(cm, onMouseDown)); + if (ie && ie_version < 11) { + on(d.scroller, "dblclick", operation(cm, function(e) { + if (signalDOMEvent(cm, e)) { + return; + } + var pos = posFromMouse(cm, e); + if (!pos || clickInGutter(cm, e) || eventInWidget(cm.display, e)) { + return; + } + e_preventDefault(e); + var word = cm.findWordAt(pos); + extendSelection(cm.doc, word.anchor, word.head); + })); + } else { + on(d.scroller, "dblclick", function(e) { + return signalDOMEvent(cm, e) || e_preventDefault(e); + }); + } + on(d.scroller, "contextmenu", function(e) { + return onContextMenu(cm, e); + }); + on(d.input.getField(), "contextmenu", function(e) { + if (!d.scroller.contains(e.target)) { + onContextMenu(cm, e); + } + }); + var touchFinished, prevTouch = { end: 0 }; + function finishTouch() { + if (d.activeTouch) { + touchFinished = setTimeout(function() { + return d.activeTouch = null; + }, 1e3); + prevTouch = d.activeTouch; + prevTouch.end = +new Date(); + } + } + function isMouseLikeTouchEvent(e) { + if (e.touches.length != 1) { + return false; + } + var touch = e.touches[0]; + return touch.radiusX <= 1 && touch.radiusY <= 1; + } + function farAway(touch, other) { + if (other.left == null) { + return true; + } + var dx = other.left - touch.left, dy = other.top - touch.top; + return dx * dx + dy * dy > 20 * 20; + } + on(d.scroller, "touchstart", function(e) { + if (!signalDOMEvent(cm, e) && !isMouseLikeTouchEvent(e) && !clickInGutter(cm, e)) { + d.input.ensurePolled(); + clearTimeout(touchFinished); + var now = +new Date(); + d.activeTouch = { + start: now, + moved: false, + prev: now - prevTouch.end <= 300 ? prevTouch : null + }; + if (e.touches.length == 1) { + d.activeTouch.left = e.touches[0].pageX; + d.activeTouch.top = e.touches[0].pageY; + } + } + }); + on(d.scroller, "touchmove", function() { + if (d.activeTouch) { + d.activeTouch.moved = true; + } + }); + on(d.scroller, "touchend", function(e) { + var touch = d.activeTouch; + if (touch && !eventInWidget(d, e) && touch.left != null && !touch.moved && new Date() - touch.start < 300) { + var pos = cm.coordsChar(d.activeTouch, "page"), range2; + if (!touch.prev || farAway(touch, touch.prev)) { + range2 = new Range(pos, pos); + } else if (!touch.prev.prev || farAway(touch, touch.prev.prev)) { + range2 = cm.findWordAt(pos); + } else { + range2 = new Range(Pos(pos.line, 0), clipPos(cm.doc, Pos(pos.line + 1, 0))); + } + cm.setSelection(range2.anchor, range2.head); + cm.focus(); + e_preventDefault(e); + } + finishTouch(); + }); + on(d.scroller, "touchcancel", finishTouch); + on(d.scroller, "scroll", function() { + if (d.scroller.clientHeight) { + updateScrollTop(cm, d.scroller.scrollTop); + setScrollLeft(cm, d.scroller.scrollLeft, true); + signal(cm, "scroll", cm); + } + }); + on(d.scroller, "mousewheel", function(e) { + return onScrollWheel(cm, e); + }); + on(d.scroller, "DOMMouseScroll", function(e) { + return onScrollWheel(cm, e); + }); + on(d.wrapper, "scroll", function() { + return d.wrapper.scrollTop = d.wrapper.scrollLeft = 0; + }); + d.dragFunctions = { + enter: function(e) { + if (!signalDOMEvent(cm, e)) { + e_stop(e); + } + }, + over: function(e) { + if (!signalDOMEvent(cm, e)) { + onDragOver(cm, e); + e_stop(e); + } + }, + start: function(e) { + return onDragStart(cm, e); + }, + drop: operation(cm, onDrop), + leave: function(e) { + if (!signalDOMEvent(cm, e)) { + clearDragCursor(cm); + } + } + }; + var inp = d.input.getField(); + on(inp, "keyup", function(e) { + return onKeyUp.call(cm, e); + }); + on(inp, "keydown", operation(cm, onKeyDown)); + on(inp, "keypress", operation(cm, onKeyPress)); + on(inp, "focus", function(e) { + return onFocus(cm, e); + }); + on(inp, "blur", function(e) { + return onBlur(cm, e); + }); + } + var initHooks = []; + CodeMirror.defineInitHook = function(f) { + return initHooks.push(f); + }; + function indentLine(cm, n, how, aggressive) { + var doc = cm.doc, state; + if (how == null) { + how = "add"; + } + if (how == "smart") { + if (!doc.mode.indent) { + how = "prev"; + } else { + state = getContextBefore(cm, n).state; + } + } + var tabSize = cm.options.tabSize; + var line = getLine(doc, n), curSpace = countColumn(line.text, null, tabSize); + if (line.stateAfter) { + line.stateAfter = null; + } + var curSpaceString = line.text.match(/^\s*/)[0], indentation; + if (!aggressive && !/\S/.test(line.text)) { + indentation = 0; + how = "not"; + } else if (how == "smart") { + indentation = doc.mode.indent(state, line.text.slice(curSpaceString.length), line.text); + if (indentation == Pass || indentation > 150) { + if (!aggressive) { + return; + } + how = "prev"; + } + } + if (how == "prev") { + if (n > doc.first) { + indentation = countColumn(getLine(doc, n - 1).text, null, tabSize); + } else { + indentation = 0; + } + } else if (how == "add") { + indentation = curSpace + cm.options.indentUnit; + } else if (how == "subtract") { + indentation = curSpace - cm.options.indentUnit; + } else if (typeof how == "number") { + indentation = curSpace + how; + } + indentation = Math.max(0, indentation); + var indentString = "", pos = 0; + if (cm.options.indentWithTabs) { + for (var i2 = Math.floor(indentation / tabSize); i2; --i2) { + pos += tabSize; + indentString += " "; + } + } + if (pos < indentation) { + indentString += spaceStr(indentation - pos); + } + if (indentString != curSpaceString) { + replaceRange(doc, indentString, Pos(n, 0), Pos(n, curSpaceString.length), "+input"); + line.stateAfter = null; + return true; + } else { + for (var i$12 = 0; i$12 < doc.sel.ranges.length; i$12++) { + var range2 = doc.sel.ranges[i$12]; + if (range2.head.line == n && range2.head.ch < curSpaceString.length) { + var pos$1 = Pos(n, curSpaceString.length); + replaceOneSelection(doc, i$12, new Range(pos$1, pos$1)); + break; + } + } + } + } + var lastCopied = null; + function setLastCopied(newLastCopied) { + lastCopied = newLastCopied; + } + function applyTextInput(cm, inserted, deleted, sel, origin) { + var doc = cm.doc; + cm.display.shift = false; + if (!sel) { + sel = doc.sel; + } + var recent = +new Date() - 200; + var paste = origin == "paste" || cm.state.pasteIncoming > recent; + var textLines = splitLinesAuto(inserted), multiPaste = null; + if (paste && sel.ranges.length > 1) { + if (lastCopied && lastCopied.text.join("\n") == inserted) { + if (sel.ranges.length % lastCopied.text.length == 0) { + multiPaste = []; + for (var i2 = 0; i2 < lastCopied.text.length; i2++) { + multiPaste.push(doc.splitLines(lastCopied.text[i2])); + } + } + } else if (textLines.length == sel.ranges.length && cm.options.pasteLinesPerSelection) { + multiPaste = map(textLines, function(l) { + return [l]; + }); + } + } + var updateInput = cm.curOp.updateInput; + for (var i$12 = sel.ranges.length - 1; i$12 >= 0; i$12--) { + var range2 = sel.ranges[i$12]; + var from = range2.from(), to = range2.to(); + if (range2.empty()) { + if (deleted && deleted > 0) { + from = Pos(from.line, from.ch - deleted); + } else if (cm.state.overwrite && !paste) { + to = Pos(to.line, Math.min(getLine(doc, to.line).text.length, to.ch + lst(textLines).length)); + } else if (paste && lastCopied && lastCopied.lineWise && lastCopied.text.join("\n") == textLines.join("\n")) { + from = to = Pos(from.line, 0); + } + } + var changeEvent = { + from, + to, + text: multiPaste ? multiPaste[i$12 % multiPaste.length] : textLines, + origin: origin || (paste ? "paste" : cm.state.cutIncoming > recent ? "cut" : "+input") + }; + makeChange(cm.doc, changeEvent); + signalLater(cm, "inputRead", cm, changeEvent); + } + if (inserted && !paste) { + triggerElectric(cm, inserted); + } + ensureCursorVisible(cm); + if (cm.curOp.updateInput < 2) { + cm.curOp.updateInput = updateInput; + } + cm.curOp.typing = true; + cm.state.pasteIncoming = cm.state.cutIncoming = -1; + } + function handlePaste(e, cm) { + var pasted = e.clipboardData && e.clipboardData.getData("Text"); + if (pasted) { + e.preventDefault(); + if (!cm.isReadOnly() && !cm.options.disableInput && cm.hasFocus()) { + runInOp(cm, function() { + return applyTextInput(cm, pasted, 0, null, "paste"); + }); + } + return true; + } + } + function triggerElectric(cm, inserted) { + if (!cm.options.electricChars || !cm.options.smartIndent) { + return; + } + var sel = cm.doc.sel; + for (var i2 = sel.ranges.length - 1; i2 >= 0; i2--) { + var range2 = sel.ranges[i2]; + if (range2.head.ch > 100 || i2 && sel.ranges[i2 - 1].head.line == range2.head.line) { + continue; + } + var mode = cm.getModeAt(range2.head); + var indented = false; + if (mode.electricChars) { + for (var j = 0; j < mode.electricChars.length; j++) { + if (inserted.indexOf(mode.electricChars.charAt(j)) > -1) { + indented = indentLine(cm, range2.head.line, "smart"); + break; + } + } + } else if (mode.electricInput) { + if (mode.electricInput.test(getLine(cm.doc, range2.head.line).text.slice(0, range2.head.ch))) { + indented = indentLine(cm, range2.head.line, "smart"); + } + } + if (indented) { + signalLater(cm, "electricInput", cm, range2.head.line); + } + } + } + function copyableRanges(cm) { + var text = [], ranges = []; + for (var i2 = 0; i2 < cm.doc.sel.ranges.length; i2++) { + var line = cm.doc.sel.ranges[i2].head.line; + var lineRange = { anchor: Pos(line, 0), head: Pos(line + 1, 0) }; + ranges.push(lineRange); + text.push(cm.getRange(lineRange.anchor, lineRange.head)); + } + return { text, ranges }; + } + function disableBrowserMagic(field, spellcheck, autocorrect, autocapitalize) { + field.setAttribute("autocorrect", autocorrect ? "" : "off"); + field.setAttribute("autocapitalize", autocapitalize ? "" : "off"); + field.setAttribute("spellcheck", !!spellcheck); + } + function hiddenTextarea() { + var te = elt("textarea", null, null, "position: absolute; bottom: -1em; padding: 0; width: 1px; height: 1em; min-height: 1em; outline: none"); + var div = elt("div", [te], null, "overflow: hidden; position: relative; width: 3px; height: 0px;"); + if (webkit) { + te.style.width = "1000px"; + } else { + te.setAttribute("wrap", "off"); + } + if (ios) { + te.style.border = "1px solid black"; + } + disableBrowserMagic(te); + return div; + } + function addEditorMethods(CodeMirror2) { + var optionHandlers2 = CodeMirror2.optionHandlers; + var helpers = CodeMirror2.helpers = {}; + CodeMirror2.prototype = { + constructor: CodeMirror2, + focus: function() { + window.focus(); + this.display.input.focus(); + }, + setOption: function(option, value) { + var options = this.options, old = options[option]; + if (options[option] == value && option != "mode") { + return; + } + options[option] = value; + if (optionHandlers2.hasOwnProperty(option)) { + operation(this, optionHandlers2[option])(this, value, old); + } + signal(this, "optionChange", this, option); + }, + getOption: function(option) { + return this.options[option]; + }, + getDoc: function() { + return this.doc; + }, + addKeyMap: function(map2, bottom) { + this.state.keyMaps[bottom ? "push" : "unshift"](getKeyMap(map2)); + }, + removeKeyMap: function(map2) { + var maps = this.state.keyMaps; + for (var i2 = 0; i2 < maps.length; ++i2) { + if (maps[i2] == map2 || maps[i2].name == map2) { + maps.splice(i2, 1); + return true; + } + } + }, + addOverlay: methodOp(function(spec, options) { + var mode = spec.token ? spec : CodeMirror2.getMode(this.options, spec); + if (mode.startState) { + throw new Error("Overlays may not be stateful."); + } + insertSorted(this.state.overlays, { + mode, + modeSpec: spec, + opaque: options && options.opaque, + priority: options && options.priority || 0 + }, function(overlay) { + return overlay.priority; + }); + this.state.modeGen++; + regChange(this); + }), + removeOverlay: methodOp(function(spec) { + var overlays = this.state.overlays; + for (var i2 = 0; i2 < overlays.length; ++i2) { + var cur = overlays[i2].modeSpec; + if (cur == spec || typeof spec == "string" && cur.name == spec) { + overlays.splice(i2, 1); + this.state.modeGen++; + regChange(this); + return; + } + } + }), + indentLine: methodOp(function(n, dir, aggressive) { + if (typeof dir != "string" && typeof dir != "number") { + if (dir == null) { + dir = this.options.smartIndent ? "smart" : "prev"; + } else { + dir = dir ? "add" : "subtract"; + } + } + if (isLine(this.doc, n)) { + indentLine(this, n, dir, aggressive); + } + }), + indentSelection: methodOp(function(how) { + var ranges = this.doc.sel.ranges, end = -1; + for (var i2 = 0; i2 < ranges.length; i2++) { + var range2 = ranges[i2]; + if (!range2.empty()) { + var from = range2.from(), to = range2.to(); + var start = Math.max(end, from.line); + end = Math.min(this.lastLine(), to.line - (to.ch ? 0 : 1)) + 1; + for (var j = start; j < end; ++j) { + indentLine(this, j, how); + } + var newRanges = this.doc.sel.ranges; + if (from.ch == 0 && ranges.length == newRanges.length && newRanges[i2].from().ch > 0) { + replaceOneSelection(this.doc, i2, new Range(from, newRanges[i2].to()), sel_dontScroll); + } + } else if (range2.head.line > end) { + indentLine(this, range2.head.line, how, true); + end = range2.head.line; + if (i2 == this.doc.sel.primIndex) { + ensureCursorVisible(this); + } + } + } + }), + getTokenAt: function(pos, precise) { + return takeToken(this, pos, precise); + }, + getLineTokens: function(line, precise) { + return takeToken(this, Pos(line), precise, true); + }, + getTokenTypeAt: function(pos) { + pos = clipPos(this.doc, pos); + var styles = getLineStyles(this, getLine(this.doc, pos.line)); + var before = 0, after = (styles.length - 1) / 2, ch = pos.ch; + var type; + if (ch == 0) { + type = styles[2]; + } else { + for (; ; ) { + var mid = before + after >> 1; + if ((mid ? styles[mid * 2 - 1] : 0) >= ch) { + after = mid; + } else if (styles[mid * 2 + 1] < ch) { + before = mid + 1; + } else { + type = styles[mid * 2 + 2]; + break; + } + } + } + var cut = type ? type.indexOf("overlay ") : -1; + return cut < 0 ? type : cut == 0 ? null : type.slice(0, cut - 1); + }, + getModeAt: function(pos) { + var mode = this.doc.mode; + if (!mode.innerMode) { + return mode; + } + return CodeMirror2.innerMode(mode, this.getTokenAt(pos).state).mode; + }, + getHelper: function(pos, type) { + return this.getHelpers(pos, type)[0]; + }, + getHelpers: function(pos, type) { + var found = []; + if (!helpers.hasOwnProperty(type)) { + return found; + } + var help = helpers[type], mode = this.getModeAt(pos); + if (typeof mode[type] == "string") { + if (help[mode[type]]) { + found.push(help[mode[type]]); + } + } else if (mode[type]) { + for (var i2 = 0; i2 < mode[type].length; i2++) { + var val = help[mode[type][i2]]; + if (val) { + found.push(val); + } + } + } else if (mode.helperType && help[mode.helperType]) { + found.push(help[mode.helperType]); + } else if (help[mode.name]) { + found.push(help[mode.name]); + } + for (var i$12 = 0; i$12 < help._global.length; i$12++) { + var cur = help._global[i$12]; + if (cur.pred(mode, this) && indexOf(found, cur.val) == -1) { + found.push(cur.val); + } + } + return found; + }, + getStateAfter: function(line, precise) { + var doc = this.doc; + line = clipLine(doc, line == null ? doc.first + doc.size - 1 : line); + return getContextBefore(this, line + 1, precise).state; + }, + cursorCoords: function(start, mode) { + var pos, range2 = this.doc.sel.primary(); + if (start == null) { + pos = range2.head; + } else if (typeof start == "object") { + pos = clipPos(this.doc, start); + } else { + pos = start ? range2.from() : range2.to(); + } + return cursorCoords(this, pos, mode || "page"); + }, + charCoords: function(pos, mode) { + return charCoords(this, clipPos(this.doc, pos), mode || "page"); + }, + coordsChar: function(coords, mode) { + coords = fromCoordSystem(this, coords, mode || "page"); + return coordsChar(this, coords.left, coords.top); + }, + lineAtHeight: function(height, mode) { + height = fromCoordSystem(this, { top: height, left: 0 }, mode || "page").top; + return lineAtHeight(this.doc, height + this.display.viewOffset); + }, + heightAtLine: function(line, mode, includeWidgets) { + var end = false, lineObj; + if (typeof line == "number") { + var last = this.doc.first + this.doc.size - 1; + if (line < this.doc.first) { + line = this.doc.first; + } else if (line > last) { + line = last; + end = true; + } + lineObj = getLine(this.doc, line); + } else { + lineObj = line; + } + return intoCoordSystem(this, lineObj, { top: 0, left: 0 }, mode || "page", includeWidgets || end).top + (end ? this.doc.height - heightAtLine(lineObj) : 0); + }, + defaultTextHeight: function() { + return textHeight(this.display); + }, + defaultCharWidth: function() { + return charWidth(this.display); + }, + getViewport: function() { + return { from: this.display.viewFrom, to: this.display.viewTo }; + }, + addWidget: function(pos, node, scroll, vert, horiz) { + var display = this.display; + pos = cursorCoords(this, clipPos(this.doc, pos)); + var top = pos.bottom, left = pos.left; + node.style.position = "absolute"; + node.setAttribute("cm-ignore-events", "true"); + this.display.input.setUneditable(node); + display.sizer.appendChild(node); + if (vert == "over") { + top = pos.top; + } else if (vert == "above" || vert == "near") { + var vspace = Math.max(display.wrapper.clientHeight, this.doc.height), hspace = Math.max(display.sizer.clientWidth, display.lineSpace.clientWidth); + if ((vert == "above" || pos.bottom + node.offsetHeight > vspace) && pos.top > node.offsetHeight) { + top = pos.top - node.offsetHeight; + } else if (pos.bottom + node.offsetHeight <= vspace) { + top = pos.bottom; + } + if (left + node.offsetWidth > hspace) { + left = hspace - node.offsetWidth; + } + } + node.style.top = top + "px"; + node.style.left = node.style.right = ""; + if (horiz == "right") { + left = display.sizer.clientWidth - node.offsetWidth; + node.style.right = "0px"; + } else { + if (horiz == "left") { + left = 0; + } else if (horiz == "middle") { + left = (display.sizer.clientWidth - node.offsetWidth) / 2; + } + node.style.left = left + "px"; + } + if (scroll) { + scrollIntoView(this, { left, top, right: left + node.offsetWidth, bottom: top + node.offsetHeight }); + } + }, + triggerOnKeyDown: methodOp(onKeyDown), + triggerOnKeyPress: methodOp(onKeyPress), + triggerOnKeyUp: onKeyUp, + triggerOnMouseDown: methodOp(onMouseDown), + execCommand: function(cmd) { + if (commands.hasOwnProperty(cmd)) { + return commands[cmd].call(null, this); + } + }, + triggerElectric: methodOp(function(text) { + triggerElectric(this, text); + }), + findPosH: function(from, amount, unit, visually) { + var dir = 1; + if (amount < 0) { + dir = -1; + amount = -amount; + } + var cur = clipPos(this.doc, from); + for (var i2 = 0; i2 < amount; ++i2) { + cur = findPosH(this.doc, cur, dir, unit, visually); + if (cur.hitSide) { + break; + } + } + return cur; + }, + moveH: methodOp(function(dir, unit) { + var this$1$1 = this; + this.extendSelectionsBy(function(range2) { + if (this$1$1.display.shift || this$1$1.doc.extend || range2.empty()) { + return findPosH(this$1$1.doc, range2.head, dir, unit, this$1$1.options.rtlMoveVisually); + } else { + return dir < 0 ? range2.from() : range2.to(); + } + }, sel_move); + }), + deleteH: methodOp(function(dir, unit) { + var sel = this.doc.sel, doc = this.doc; + if (sel.somethingSelected()) { + doc.replaceSelection("", null, "+delete"); + } else { + deleteNearSelection(this, function(range2) { + var other = findPosH(doc, range2.head, dir, unit, false); + return dir < 0 ? { from: other, to: range2.head } : { from: range2.head, to: other }; + }); + } + }), + findPosV: function(from, amount, unit, goalColumn) { + var dir = 1, x = goalColumn; + if (amount < 0) { + dir = -1; + amount = -amount; + } + var cur = clipPos(this.doc, from); + for (var i2 = 0; i2 < amount; ++i2) { + var coords = cursorCoords(this, cur, "div"); + if (x == null) { + x = coords.left; + } else { + coords.left = x; + } + cur = findPosV(this, coords, dir, unit); + if (cur.hitSide) { + break; + } + } + return cur; + }, + moveV: methodOp(function(dir, unit) { + var this$1$1 = this; + var doc = this.doc, goals = []; + var collapse = !this.display.shift && !doc.extend && doc.sel.somethingSelected(); + doc.extendSelectionsBy(function(range2) { + if (collapse) { + return dir < 0 ? range2.from() : range2.to(); + } + var headPos = cursorCoords(this$1$1, range2.head, "div"); + if (range2.goalColumn != null) { + headPos.left = range2.goalColumn; + } + goals.push(headPos.left); + var pos = findPosV(this$1$1, headPos, dir, unit); + if (unit == "page" && range2 == doc.sel.primary()) { + addToScrollTop(this$1$1, charCoords(this$1$1, pos, "div").top - headPos.top); + } + return pos; + }, sel_move); + if (goals.length) { + for (var i2 = 0; i2 < doc.sel.ranges.length; i2++) { + doc.sel.ranges[i2].goalColumn = goals[i2]; + } + } + }), + findWordAt: function(pos) { + var doc = this.doc, line = getLine(doc, pos.line).text; + var start = pos.ch, end = pos.ch; + if (line) { + var helper = this.getHelper(pos, "wordChars"); + if ((pos.sticky == "before" || end == line.length) && start) { + --start; + } else { + ++end; + } + var startChar = line.charAt(start); + var check = isWordChar(startChar, helper) ? function(ch) { + return isWordChar(ch, helper); + } : /\s/.test(startChar) ? function(ch) { + return /\s/.test(ch); + } : function(ch) { + return !/\s/.test(ch) && !isWordChar(ch); + }; + while (start > 0 && check(line.charAt(start - 1))) { + --start; + } + while (end < line.length && check(line.charAt(end))) { + ++end; + } + } + return new Range(Pos(pos.line, start), Pos(pos.line, end)); + }, + toggleOverwrite: function(value) { + if (value != null && value == this.state.overwrite) { + return; + } + if (this.state.overwrite = !this.state.overwrite) { + addClass(this.display.cursorDiv, "CodeMirror-overwrite"); + } else { + rmClass(this.display.cursorDiv, "CodeMirror-overwrite"); + } + signal(this, "overwriteToggle", this, this.state.overwrite); + }, + hasFocus: function() { + return this.display.input.getField() == activeElt(); + }, + isReadOnly: function() { + return !!(this.options.readOnly || this.doc.cantEdit); + }, + scrollTo: methodOp(function(x, y) { + scrollToCoords(this, x, y); + }), + getScrollInfo: function() { + var scroller = this.display.scroller; + return { + left: scroller.scrollLeft, + top: scroller.scrollTop, + height: scroller.scrollHeight - scrollGap(this) - this.display.barHeight, + width: scroller.scrollWidth - scrollGap(this) - this.display.barWidth, + clientHeight: displayHeight(this), + clientWidth: displayWidth(this) + }; + }, + scrollIntoView: methodOp(function(range2, margin) { + if (range2 == null) { + range2 = { from: this.doc.sel.primary().head, to: null }; + if (margin == null) { + margin = this.options.cursorScrollMargin; + } + } else if (typeof range2 == "number") { + range2 = { from: Pos(range2, 0), to: null }; + } else if (range2.from == null) { + range2 = { from: range2, to: null }; + } + if (!range2.to) { + range2.to = range2.from; + } + range2.margin = margin || 0; + if (range2.from.line != null) { + scrollToRange(this, range2); + } else { + scrollToCoordsRange(this, range2.from, range2.to, range2.margin); + } + }), + setSize: methodOp(function(width, height) { + var this$1$1 = this; + var interpret = function(val) { + return typeof val == "number" || /^\d+$/.test(String(val)) ? val + "px" : val; + }; + if (width != null) { + this.display.wrapper.style.width = interpret(width); + } + if (height != null) { + this.display.wrapper.style.height = interpret(height); + } + if (this.options.lineWrapping) { + clearLineMeasurementCache(this); + } + var lineNo2 = this.display.viewFrom; + this.doc.iter(lineNo2, this.display.viewTo, function(line) { + if (line.widgets) { + for (var i2 = 0; i2 < line.widgets.length; i2++) { + if (line.widgets[i2].noHScroll) { + regLineChange(this$1$1, lineNo2, "widget"); + break; + } + } + } + ++lineNo2; + }); + this.curOp.forceUpdate = true; + signal(this, "refresh", this); + }), + operation: function(f) { + return runInOp(this, f); + }, + startOperation: function() { + return startOperation(this); + }, + endOperation: function() { + return endOperation(this); + }, + refresh: methodOp(function() { + var oldHeight = this.display.cachedTextHeight; + regChange(this); + this.curOp.forceUpdate = true; + clearCaches(this); + scrollToCoords(this, this.doc.scrollLeft, this.doc.scrollTop); + updateGutterSpace(this.display); + if (oldHeight == null || Math.abs(oldHeight - textHeight(this.display)) > 0.5 || this.options.lineWrapping) { + estimateLineHeights(this); + } + signal(this, "refresh", this); + }), + swapDoc: methodOp(function(doc) { + var old = this.doc; + old.cm = null; + if (this.state.selectingText) { + this.state.selectingText(); + } + attachDoc(this, doc); + clearCaches(this); + this.display.input.reset(); + scrollToCoords(this, doc.scrollLeft, doc.scrollTop); + this.curOp.forceScroll = true; + signalLater(this, "swapDoc", this, old); + return old; + }), + phrase: function(phraseText) { + var phrases = this.options.phrases; + return phrases && Object.prototype.hasOwnProperty.call(phrases, phraseText) ? phrases[phraseText] : phraseText; + }, + getInputField: function() { + return this.display.input.getField(); + }, + getWrapperElement: function() { + return this.display.wrapper; + }, + getScrollerElement: function() { + return this.display.scroller; + }, + getGutterElement: function() { + return this.display.gutters; + } + }; + eventMixin(CodeMirror2); + CodeMirror2.registerHelper = function(type, name, value) { + if (!helpers.hasOwnProperty(type)) { + helpers[type] = CodeMirror2[type] = { _global: [] }; + } + helpers[type][name] = value; + }; + CodeMirror2.registerGlobalHelper = function(type, name, predicate, value) { + CodeMirror2.registerHelper(type, name, value); + helpers[type]._global.push({ pred: predicate, val: value }); + }; + } + function findPosH(doc, pos, dir, unit, visually) { + var oldPos = pos; + var origDir = dir; + var lineObj = getLine(doc, pos.line); + var lineDir = visually && doc.direction == "rtl" ? -dir : dir; + function findNextLine() { + var l = pos.line + lineDir; + if (l < doc.first || l >= doc.first + doc.size) { + return false; + } + pos = new Pos(l, pos.ch, pos.sticky); + return lineObj = getLine(doc, l); + } + function moveOnce(boundToLine) { + var next; + if (unit == "codepoint") { + var ch = lineObj.text.charCodeAt(pos.ch + (dir > 0 ? 0 : -1)); + if (isNaN(ch)) { + next = null; + } else { + var astral = dir > 0 ? ch >= 55296 && ch < 56320 : ch >= 56320 && ch < 57343; + next = new Pos(pos.line, Math.max(0, Math.min(lineObj.text.length, pos.ch + dir * (astral ? 2 : 1))), -dir); + } + } else if (visually) { + next = moveVisually(doc.cm, lineObj, pos, dir); + } else { + next = moveLogically(lineObj, pos, dir); + } + if (next == null) { + if (!boundToLine && findNextLine()) { + pos = endOfLine(visually, doc.cm, lineObj, pos.line, lineDir); + } else { + return false; + } + } else { + pos = next; + } + return true; + } + if (unit == "char" || unit == "codepoint") { + moveOnce(); + } else if (unit == "column") { + moveOnce(true); + } else if (unit == "word" || unit == "group") { + var sawType = null, group = unit == "group"; + var helper = doc.cm && doc.cm.getHelper(pos, "wordChars"); + for (var first = true; ; first = false) { + if (dir < 0 && !moveOnce(!first)) { + break; + } + var cur = lineObj.text.charAt(pos.ch) || "\n"; + var type = isWordChar(cur, helper) ? "w" : group && cur == "\n" ? "n" : !group || /\s/.test(cur) ? null : "p"; + if (group && !first && !type) { + type = "s"; + } + if (sawType && sawType != type) { + if (dir < 0) { + dir = 1; + moveOnce(); + pos.sticky = "after"; + } + break; + } + if (type) { + sawType = type; + } + if (dir > 0 && !moveOnce(!first)) { + break; + } + } + } + var result = skipAtomic(doc, pos, oldPos, origDir, true); + if (equalCursorPos(oldPos, result)) { + result.hitSide = true; + } + return result; + } + function findPosV(cm, pos, dir, unit) { + var doc = cm.doc, x = pos.left, y; + if (unit == "page") { + var pageSize = Math.min(cm.display.wrapper.clientHeight, window.innerHeight || document.documentElement.clientHeight); + var moveAmount = Math.max(pageSize - 0.5 * textHeight(cm.display), 3); + y = (dir > 0 ? pos.bottom : pos.top) + dir * moveAmount; + } else if (unit == "line") { + y = dir > 0 ? pos.bottom + 3 : pos.top - 3; + } + var target; + for (; ; ) { + target = coordsChar(cm, x, y); + if (!target.outside) { + break; + } + if (dir < 0 ? y <= 0 : y >= doc.height) { + target.hitSide = true; + break; + } + y += dir * 5; + } + return target; + } + var ContentEditableInput = function(cm) { + this.cm = cm; + this.lastAnchorNode = this.lastAnchorOffset = this.lastFocusNode = this.lastFocusOffset = null; + this.polling = new Delayed(); + this.composing = null; + this.gracePeriod = false; + this.readDOMTimeout = null; + }; + ContentEditableInput.prototype.init = function(display) { + var this$1$1 = this; + var input = this, cm = input.cm; + var div = input.div = display.lineDiv; + div.contentEditable = true; + disableBrowserMagic(div, cm.options.spellcheck, cm.options.autocorrect, cm.options.autocapitalize); + function belongsToInput(e) { + for (var t = e.target; t; t = t.parentNode) { + if (t == div) { + return true; + } + if (/\bCodeMirror-(?:line)?widget\b/.test(t.className)) { + break; + } + } + return false; + } + on(div, "paste", function(e) { + if (!belongsToInput(e) || signalDOMEvent(cm, e) || handlePaste(e, cm)) { + return; + } + if (ie_version <= 11) { + setTimeout(operation(cm, function() { + return this$1$1.updateFromDOM(); + }), 20); + } + }); + on(div, "compositionstart", function(e) { + this$1$1.composing = { data: e.data, done: false }; + }); + on(div, "compositionupdate", function(e) { + if (!this$1$1.composing) { + this$1$1.composing = { data: e.data, done: false }; + } + }); + on(div, "compositionend", function(e) { + if (this$1$1.composing) { + if (e.data != this$1$1.composing.data) { + this$1$1.readFromDOMSoon(); + } + this$1$1.composing.done = true; + } + }); + on(div, "touchstart", function() { + return input.forceCompositionEnd(); + }); + on(div, "input", function() { + if (!this$1$1.composing) { + this$1$1.readFromDOMSoon(); + } + }); + function onCopyCut(e) { + if (!belongsToInput(e) || signalDOMEvent(cm, e)) { + return; + } + if (cm.somethingSelected()) { + setLastCopied({ lineWise: false, text: cm.getSelections() }); + if (e.type == "cut") { + cm.replaceSelection("", null, "cut"); + } + } else if (!cm.options.lineWiseCopyCut) { + return; + } else { + var ranges = copyableRanges(cm); + setLastCopied({ lineWise: true, text: ranges.text }); + if (e.type == "cut") { + cm.operation(function() { + cm.setSelections(ranges.ranges, 0, sel_dontScroll); + cm.replaceSelection("", null, "cut"); + }); + } + } + if (e.clipboardData) { + e.clipboardData.clearData(); + var content = lastCopied.text.join("\n"); + e.clipboardData.setData("Text", content); + if (e.clipboardData.getData("Text") == content) { + e.preventDefault(); + return; + } + } + var kludge = hiddenTextarea(), te = kludge.firstChild; + cm.display.lineSpace.insertBefore(kludge, cm.display.lineSpace.firstChild); + te.value = lastCopied.text.join("\n"); + var hadFocus = activeElt(); + selectInput(te); + setTimeout(function() { + cm.display.lineSpace.removeChild(kludge); + hadFocus.focus(); + if (hadFocus == div) { + input.showPrimarySelection(); + } + }, 50); + } + on(div, "copy", onCopyCut); + on(div, "cut", onCopyCut); + }; + ContentEditableInput.prototype.screenReaderLabelChanged = function(label) { + if (label) { + this.div.setAttribute("aria-label", label); + } else { + this.div.removeAttribute("aria-label"); + } + }; + ContentEditableInput.prototype.prepareSelection = function() { + var result = prepareSelection(this.cm, false); + result.focus = activeElt() == this.div; + return result; + }; + ContentEditableInput.prototype.showSelection = function(info, takeFocus) { + if (!info || !this.cm.display.view.length) { + return; + } + if (info.focus || takeFocus) { + this.showPrimarySelection(); + } + this.showMultipleSelections(info); + }; + ContentEditableInput.prototype.getSelection = function() { + return this.cm.display.wrapper.ownerDocument.getSelection(); + }; + ContentEditableInput.prototype.showPrimarySelection = function() { + var sel = this.getSelection(), cm = this.cm, prim = cm.doc.sel.primary(); + var from = prim.from(), to = prim.to(); + if (cm.display.viewTo == cm.display.viewFrom || from.line >= cm.display.viewTo || to.line < cm.display.viewFrom) { + sel.removeAllRanges(); + return; + } + var curAnchor = domToPos(cm, sel.anchorNode, sel.anchorOffset); + var curFocus = domToPos(cm, sel.focusNode, sel.focusOffset); + if (curAnchor && !curAnchor.bad && curFocus && !curFocus.bad && cmp(minPos(curAnchor, curFocus), from) == 0 && cmp(maxPos(curAnchor, curFocus), to) == 0) { + return; + } + var view = cm.display.view; + var start = from.line >= cm.display.viewFrom && posToDOM(cm, from) || { node: view[0].measure.map[2], offset: 0 }; + var end = to.line < cm.display.viewTo && posToDOM(cm, to); + if (!end) { + var measure = view[view.length - 1].measure; + var map2 = measure.maps ? measure.maps[measure.maps.length - 1] : measure.map; + end = { node: map2[map2.length - 1], offset: map2[map2.length - 2] - map2[map2.length - 3] }; + } + if (!start || !end) { + sel.removeAllRanges(); + return; + } + var old = sel.rangeCount && sel.getRangeAt(0), rng; + try { + rng = range(start.node, start.offset, end.offset, end.node); + } catch (e) { + } + if (rng) { + if (!gecko && cm.state.focused) { + sel.collapse(start.node, start.offset); + if (!rng.collapsed) { + sel.removeAllRanges(); + sel.addRange(rng); + } + } else { + sel.removeAllRanges(); + sel.addRange(rng); + } + if (old && sel.anchorNode == null) { + sel.addRange(old); + } else if (gecko) { + this.startGracePeriod(); + } + } + this.rememberSelection(); + }; + ContentEditableInput.prototype.startGracePeriod = function() { + var this$1$1 = this; + clearTimeout(this.gracePeriod); + this.gracePeriod = setTimeout(function() { + this$1$1.gracePeriod = false; + if (this$1$1.selectionChanged()) { + this$1$1.cm.operation(function() { + return this$1$1.cm.curOp.selectionChanged = true; + }); + } + }, 20); + }; + ContentEditableInput.prototype.showMultipleSelections = function(info) { + removeChildrenAndAdd(this.cm.display.cursorDiv, info.cursors); + removeChildrenAndAdd(this.cm.display.selectionDiv, info.selection); + }; + ContentEditableInput.prototype.rememberSelection = function() { + var sel = this.getSelection(); + this.lastAnchorNode = sel.anchorNode; + this.lastAnchorOffset = sel.anchorOffset; + this.lastFocusNode = sel.focusNode; + this.lastFocusOffset = sel.focusOffset; + }; + ContentEditableInput.prototype.selectionInEditor = function() { + var sel = this.getSelection(); + if (!sel.rangeCount) { + return false; + } + var node = sel.getRangeAt(0).commonAncestorContainer; + return contains(this.div, node); + }; + ContentEditableInput.prototype.focus = function() { + if (this.cm.options.readOnly != "nocursor") { + if (!this.selectionInEditor() || activeElt() != this.div) { + this.showSelection(this.prepareSelection(), true); + } + this.div.focus(); + } + }; + ContentEditableInput.prototype.blur = function() { + this.div.blur(); + }; + ContentEditableInput.prototype.getField = function() { + return this.div; + }; + ContentEditableInput.prototype.supportsTouch = function() { + return true; + }; + ContentEditableInput.prototype.receivedFocus = function() { + var this$1$1 = this; + var input = this; + if (this.selectionInEditor()) { + setTimeout(function() { + return this$1$1.pollSelection(); + }, 20); + } else { + runInOp(this.cm, function() { + return input.cm.curOp.selectionChanged = true; + }); + } + function poll() { + if (input.cm.state.focused) { + input.pollSelection(); + input.polling.set(input.cm.options.pollInterval, poll); + } + } + this.polling.set(this.cm.options.pollInterval, poll); + }; + ContentEditableInput.prototype.selectionChanged = function() { + var sel = this.getSelection(); + return sel.anchorNode != this.lastAnchorNode || sel.anchorOffset != this.lastAnchorOffset || sel.focusNode != this.lastFocusNode || sel.focusOffset != this.lastFocusOffset; + }; + ContentEditableInput.prototype.pollSelection = function() { + if (this.readDOMTimeout != null || this.gracePeriod || !this.selectionChanged()) { + return; + } + var sel = this.getSelection(), cm = this.cm; + if (android && chrome && this.cm.display.gutterSpecs.length && isInGutter(sel.anchorNode)) { + this.cm.triggerOnKeyDown({ type: "keydown", keyCode: 8, preventDefault: Math.abs }); + this.blur(); + this.focus(); + return; + } + if (this.composing) { + return; + } + this.rememberSelection(); + var anchor = domToPos(cm, sel.anchorNode, sel.anchorOffset); + var head = domToPos(cm, sel.focusNode, sel.focusOffset); + if (anchor && head) { + runInOp(cm, function() { + setSelection(cm.doc, simpleSelection(anchor, head), sel_dontScroll); + if (anchor.bad || head.bad) { + cm.curOp.selectionChanged = true; + } + }); + } + }; + ContentEditableInput.prototype.pollContent = function() { + if (this.readDOMTimeout != null) { + clearTimeout(this.readDOMTimeout); + this.readDOMTimeout = null; + } + var cm = this.cm, display = cm.display, sel = cm.doc.sel.primary(); + var from = sel.from(), to = sel.to(); + if (from.ch == 0 && from.line > cm.firstLine()) { + from = Pos(from.line - 1, getLine(cm.doc, from.line - 1).length); + } + if (to.ch == getLine(cm.doc, to.line).text.length && to.line < cm.lastLine()) { + to = Pos(to.line + 1, 0); + } + if (from.line < display.viewFrom || to.line > display.viewTo - 1) { + return false; + } + var fromIndex, fromLine, fromNode; + if (from.line == display.viewFrom || (fromIndex = findViewIndex(cm, from.line)) == 0) { + fromLine = lineNo(display.view[0].line); + fromNode = display.view[0].node; + } else { + fromLine = lineNo(display.view[fromIndex].line); + fromNode = display.view[fromIndex - 1].node.nextSibling; + } + var toIndex = findViewIndex(cm, to.line); + var toLine, toNode; + if (toIndex == display.view.length - 1) { + toLine = display.viewTo - 1; + toNode = display.lineDiv.lastChild; + } else { + toLine = lineNo(display.view[toIndex + 1].line) - 1; + toNode = display.view[toIndex + 1].node.previousSibling; + } + if (!fromNode) { + return false; + } + var newText = cm.doc.splitLines(domTextBetween(cm, fromNode, toNode, fromLine, toLine)); + var oldText = getBetween(cm.doc, Pos(fromLine, 0), Pos(toLine, getLine(cm.doc, toLine).text.length)); + while (newText.length > 1 && oldText.length > 1) { + if (lst(newText) == lst(oldText)) { + newText.pop(); + oldText.pop(); + toLine--; + } else if (newText[0] == oldText[0]) { + newText.shift(); + oldText.shift(); + fromLine++; + } else { + break; + } + } + var cutFront = 0, cutEnd = 0; + var newTop = newText[0], oldTop = oldText[0], maxCutFront = Math.min(newTop.length, oldTop.length); + while (cutFront < maxCutFront && newTop.charCodeAt(cutFront) == oldTop.charCodeAt(cutFront)) { + ++cutFront; + } + var newBot = lst(newText), oldBot = lst(oldText); + var maxCutEnd = Math.min(newBot.length - (newText.length == 1 ? cutFront : 0), oldBot.length - (oldText.length == 1 ? cutFront : 0)); + while (cutEnd < maxCutEnd && newBot.charCodeAt(newBot.length - cutEnd - 1) == oldBot.charCodeAt(oldBot.length - cutEnd - 1)) { + ++cutEnd; + } + if (newText.length == 1 && oldText.length == 1 && fromLine == from.line) { + while (cutFront && cutFront > from.ch && newBot.charCodeAt(newBot.length - cutEnd - 1) == oldBot.charCodeAt(oldBot.length - cutEnd - 1)) { + cutFront--; + cutEnd++; + } + } + newText[newText.length - 1] = newBot.slice(0, newBot.length - cutEnd).replace(/^\u200b+/, ""); + newText[0] = newText[0].slice(cutFront).replace(/\u200b+$/, ""); + var chFrom = Pos(fromLine, cutFront); + var chTo = Pos(toLine, oldText.length ? lst(oldText).length - cutEnd : 0); + if (newText.length > 1 || newText[0] || cmp(chFrom, chTo)) { + replaceRange(cm.doc, newText, chFrom, chTo, "+input"); + return true; + } + }; + ContentEditableInput.prototype.ensurePolled = function() { + this.forceCompositionEnd(); + }; + ContentEditableInput.prototype.reset = function() { + this.forceCompositionEnd(); + }; + ContentEditableInput.prototype.forceCompositionEnd = function() { + if (!this.composing) { + return; + } + clearTimeout(this.readDOMTimeout); + this.composing = null; + this.updateFromDOM(); + this.div.blur(); + this.div.focus(); + }; + ContentEditableInput.prototype.readFromDOMSoon = function() { + var this$1$1 = this; + if (this.readDOMTimeout != null) { + return; + } + this.readDOMTimeout = setTimeout(function() { + this$1$1.readDOMTimeout = null; + if (this$1$1.composing) { + if (this$1$1.composing.done) { + this$1$1.composing = null; + } else { + return; + } + } + this$1$1.updateFromDOM(); + }, 80); + }; + ContentEditableInput.prototype.updateFromDOM = function() { + var this$1$1 = this; + if (this.cm.isReadOnly() || !this.pollContent()) { + runInOp(this.cm, function() { + return regChange(this$1$1.cm); + }); + } + }; + ContentEditableInput.prototype.setUneditable = function(node) { + node.contentEditable = "false"; + }; + ContentEditableInput.prototype.onKeyPress = function(e) { + if (e.charCode == 0 || this.composing) { + return; + } + e.preventDefault(); + if (!this.cm.isReadOnly()) { + operation(this.cm, applyTextInput)(this.cm, String.fromCharCode(e.charCode == null ? e.keyCode : e.charCode), 0); + } + }; + ContentEditableInput.prototype.readOnlyChanged = function(val) { + this.div.contentEditable = String(val != "nocursor"); + }; + ContentEditableInput.prototype.onContextMenu = function() { + }; + ContentEditableInput.prototype.resetPosition = function() { + }; + ContentEditableInput.prototype.needsContentAttribute = true; + function posToDOM(cm, pos) { + var view = findViewForLine(cm, pos.line); + if (!view || view.hidden) { + return null; + } + var line = getLine(cm.doc, pos.line); + var info = mapFromLineView(view, line, pos.line); + var order = getOrder(line, cm.doc.direction), side = "left"; + if (order) { + var partPos = getBidiPartAt(order, pos.ch); + side = partPos % 2 ? "right" : "left"; + } + var result = nodeAndOffsetInLineMap(info.map, pos.ch, side); + result.offset = result.collapse == "right" ? result.end : result.start; + return result; + } + function isInGutter(node) { + for (var scan = node; scan; scan = scan.parentNode) { + if (/CodeMirror-gutter-wrapper/.test(scan.className)) { + return true; + } + } + return false; + } + function badPos(pos, bad) { + if (bad) { + pos.bad = true; + } + return pos; + } + function domTextBetween(cm, from, to, fromLine, toLine) { + var text = "", closing = false, lineSep = cm.doc.lineSeparator(), extraLinebreak = false; + function recognizeMarker(id) { + return function(marker) { + return marker.id == id; + }; + } + function close() { + if (closing) { + text += lineSep; + if (extraLinebreak) { + text += lineSep; + } + closing = extraLinebreak = false; + } + } + function addText(str) { + if (str) { + close(); + text += str; + } + } + function walk(node) { + if (node.nodeType == 1) { + var cmText = node.getAttribute("cm-text"); + if (cmText) { + addText(cmText); + return; + } + var markerID = node.getAttribute("cm-marker"), range2; + if (markerID) { + var found = cm.findMarks(Pos(fromLine, 0), Pos(toLine + 1, 0), recognizeMarker(+markerID)); + if (found.length && (range2 = found[0].find(0))) { + addText(getBetween(cm.doc, range2.from, range2.to).join(lineSep)); + } + return; + } + if (node.getAttribute("contenteditable") == "false") { + return; + } + var isBlock = /^(pre|div|p|li|table|br)$/i.test(node.nodeName); + if (!/^br$/i.test(node.nodeName) && node.textContent.length == 0) { + return; + } + if (isBlock) { + close(); + } + for (var i2 = 0; i2 < node.childNodes.length; i2++) { + walk(node.childNodes[i2]); + } + if (/^(pre|p)$/i.test(node.nodeName)) { + extraLinebreak = true; + } + if (isBlock) { + closing = true; + } + } else if (node.nodeType == 3) { + addText(node.nodeValue.replace(/\u200b/g, "").replace(/\u00a0/g, " ")); + } + } + for (; ; ) { + walk(from); + if (from == to) { + break; + } + from = from.nextSibling; + extraLinebreak = false; + } + return text; + } + function domToPos(cm, node, offset) { + var lineNode; + if (node == cm.display.lineDiv) { + lineNode = cm.display.lineDiv.childNodes[offset]; + if (!lineNode) { + return badPos(cm.clipPos(Pos(cm.display.viewTo - 1)), true); + } + node = null; + offset = 0; + } else { + for (lineNode = node; ; lineNode = lineNode.parentNode) { + if (!lineNode || lineNode == cm.display.lineDiv) { + return null; + } + if (lineNode.parentNode && lineNode.parentNode == cm.display.lineDiv) { + break; + } + } + } + for (var i2 = 0; i2 < cm.display.view.length; i2++) { + var lineView = cm.display.view[i2]; + if (lineView.node == lineNode) { + return locateNodeInLineView(lineView, node, offset); + } + } + } + function locateNodeInLineView(lineView, node, offset) { + var wrapper = lineView.text.firstChild, bad = false; + if (!node || !contains(wrapper, node)) { + return badPos(Pos(lineNo(lineView.line), 0), true); + } + if (node == wrapper) { + bad = true; + node = wrapper.childNodes[offset]; + offset = 0; + if (!node) { + var line = lineView.rest ? lst(lineView.rest) : lineView.line; + return badPos(Pos(lineNo(line), line.text.length), bad); + } + } + var textNode = node.nodeType == 3 ? node : null, topNode = node; + if (!textNode && node.childNodes.length == 1 && node.firstChild.nodeType == 3) { + textNode = node.firstChild; + if (offset) { + offset = textNode.nodeValue.length; + } + } + while (topNode.parentNode != wrapper) { + topNode = topNode.parentNode; + } + var measure = lineView.measure, maps = measure.maps; + function find(textNode2, topNode2, offset2) { + for (var i2 = -1; i2 < (maps ? maps.length : 0); i2++) { + var map2 = i2 < 0 ? measure.map : maps[i2]; + for (var j = 0; j < map2.length; j += 3) { + var curNode = map2[j + 2]; + if (curNode == textNode2 || curNode == topNode2) { + var line2 = lineNo(i2 < 0 ? lineView.line : lineView.rest[i2]); + var ch = map2[j] + offset2; + if (offset2 < 0 || curNode != textNode2) { + ch = map2[j + (offset2 ? 1 : 0)]; + } + return Pos(line2, ch); + } + } + } + } + var found = find(textNode, topNode, offset); + if (found) { + return badPos(found, bad); + } + for (var after = topNode.nextSibling, dist = textNode ? textNode.nodeValue.length - offset : 0; after; after = after.nextSibling) { + found = find(after, after.firstChild, 0); + if (found) { + return badPos(Pos(found.line, found.ch - dist), bad); + } else { + dist += after.textContent.length; + } + } + for (var before = topNode.previousSibling, dist$1 = offset; before; before = before.previousSibling) { + found = find(before, before.firstChild, -1); + if (found) { + return badPos(Pos(found.line, found.ch + dist$1), bad); + } else { + dist$1 += before.textContent.length; + } + } + } + var TextareaInput = function(cm) { + this.cm = cm; + this.prevInput = ""; + this.pollingFast = false; + this.polling = new Delayed(); + this.hasSelection = false; + this.composing = null; + }; + TextareaInput.prototype.init = function(display) { + var this$1$1 = this; + var input = this, cm = this.cm; + this.createField(display); + var te = this.textarea; + display.wrapper.insertBefore(this.wrapper, display.wrapper.firstChild); + if (ios) { + te.style.width = "0px"; + } + on(te, "input", function() { + if (ie && ie_version >= 9 && this$1$1.hasSelection) { + this$1$1.hasSelection = null; + } + input.poll(); + }); + on(te, "paste", function(e) { + if (signalDOMEvent(cm, e) || handlePaste(e, cm)) { + return; + } + cm.state.pasteIncoming = +new Date(); + input.fastPoll(); + }); + function prepareCopyCut(e) { + if (signalDOMEvent(cm, e)) { + return; + } + if (cm.somethingSelected()) { + setLastCopied({ lineWise: false, text: cm.getSelections() }); + } else if (!cm.options.lineWiseCopyCut) { + return; + } else { + var ranges = copyableRanges(cm); + setLastCopied({ lineWise: true, text: ranges.text }); + if (e.type == "cut") { + cm.setSelections(ranges.ranges, null, sel_dontScroll); + } else { + input.prevInput = ""; + te.value = ranges.text.join("\n"); + selectInput(te); + } + } + if (e.type == "cut") { + cm.state.cutIncoming = +new Date(); + } + } + on(te, "cut", prepareCopyCut); + on(te, "copy", prepareCopyCut); + on(display.scroller, "paste", function(e) { + if (eventInWidget(display, e) || signalDOMEvent(cm, e)) { + return; + } + if (!te.dispatchEvent) { + cm.state.pasteIncoming = +new Date(); + input.focus(); + return; + } + var event = new Event("paste"); + event.clipboardData = e.clipboardData; + te.dispatchEvent(event); + }); + on(display.lineSpace, "selectstart", function(e) { + if (!eventInWidget(display, e)) { + e_preventDefault(e); + } + }); + on(te, "compositionstart", function() { + var start = cm.getCursor("from"); + if (input.composing) { + input.composing.range.clear(); + } + input.composing = { + start, + range: cm.markText(start, cm.getCursor("to"), { className: "CodeMirror-composing" }) + }; + }); + on(te, "compositionend", function() { + if (input.composing) { + input.poll(); + input.composing.range.clear(); + input.composing = null; + } + }); + }; + TextareaInput.prototype.createField = function(_display) { + this.wrapper = hiddenTextarea(); + this.textarea = this.wrapper.firstChild; + }; + TextareaInput.prototype.screenReaderLabelChanged = function(label) { + if (label) { + this.textarea.setAttribute("aria-label", label); + } else { + this.textarea.removeAttribute("aria-label"); + } + }; + TextareaInput.prototype.prepareSelection = function() { + var cm = this.cm, display = cm.display, doc = cm.doc; + var result = prepareSelection(cm); + if (cm.options.moveInputWithCursor) { + var headPos = cursorCoords(cm, doc.sel.primary().head, "div"); + var wrapOff = display.wrapper.getBoundingClientRect(), lineOff = display.lineDiv.getBoundingClientRect(); + result.teTop = Math.max(0, Math.min(display.wrapper.clientHeight - 10, headPos.top + lineOff.top - wrapOff.top)); + result.teLeft = Math.max(0, Math.min(display.wrapper.clientWidth - 10, headPos.left + lineOff.left - wrapOff.left)); + } + return result; + }; + TextareaInput.prototype.showSelection = function(drawn) { + var cm = this.cm, display = cm.display; + removeChildrenAndAdd(display.cursorDiv, drawn.cursors); + removeChildrenAndAdd(display.selectionDiv, drawn.selection); + if (drawn.teTop != null) { + this.wrapper.style.top = drawn.teTop + "px"; + this.wrapper.style.left = drawn.teLeft + "px"; + } + }; + TextareaInput.prototype.reset = function(typing) { + if (this.contextMenuPending || this.composing) { + return; + } + var cm = this.cm; + if (cm.somethingSelected()) { + this.prevInput = ""; + var content = cm.getSelection(); + this.textarea.value = content; + if (cm.state.focused) { + selectInput(this.textarea); + } + if (ie && ie_version >= 9) { + this.hasSelection = content; + } + } else if (!typing) { + this.prevInput = this.textarea.value = ""; + if (ie && ie_version >= 9) { + this.hasSelection = null; + } + } + }; + TextareaInput.prototype.getField = function() { + return this.textarea; + }; + TextareaInput.prototype.supportsTouch = function() { + return false; + }; + TextareaInput.prototype.focus = function() { + if (this.cm.options.readOnly != "nocursor" && (!mobile || activeElt() != this.textarea)) { + try { + this.textarea.focus(); + } catch (e) { + } + } + }; + TextareaInput.prototype.blur = function() { + this.textarea.blur(); + }; + TextareaInput.prototype.resetPosition = function() { + this.wrapper.style.top = this.wrapper.style.left = 0; + }; + TextareaInput.prototype.receivedFocus = function() { + this.slowPoll(); + }; + TextareaInput.prototype.slowPoll = function() { + var this$1$1 = this; + if (this.pollingFast) { + return; + } + this.polling.set(this.cm.options.pollInterval, function() { + this$1$1.poll(); + if (this$1$1.cm.state.focused) { + this$1$1.slowPoll(); + } + }); + }; + TextareaInput.prototype.fastPoll = function() { + var missed = false, input = this; + input.pollingFast = true; + function p() { + var changed = input.poll(); + if (!changed && !missed) { + missed = true; + input.polling.set(60, p); + } else { + input.pollingFast = false; + input.slowPoll(); + } + } + input.polling.set(20, p); + }; + TextareaInput.prototype.poll = function() { + var this$1$1 = this; + var cm = this.cm, input = this.textarea, prevInput = this.prevInput; + if (this.contextMenuPending || !cm.state.focused || hasSelection(input) && !prevInput && !this.composing || cm.isReadOnly() || cm.options.disableInput || cm.state.keySeq) { + return false; + } + var text = input.value; + if (text == prevInput && !cm.somethingSelected()) { + return false; + } + if (ie && ie_version >= 9 && this.hasSelection === text || mac && /[\uf700-\uf7ff]/.test(text)) { + cm.display.input.reset(); + return false; + } + if (cm.doc.sel == cm.display.selForContextMenu) { + var first = text.charCodeAt(0); + if (first == 8203 && !prevInput) { + prevInput = "\u200B"; + } + if (first == 8666) { + this.reset(); + return this.cm.execCommand("undo"); + } + } + var same = 0, l = Math.min(prevInput.length, text.length); + while (same < l && prevInput.charCodeAt(same) == text.charCodeAt(same)) { + ++same; + } + runInOp(cm, function() { + applyTextInput(cm, text.slice(same), prevInput.length - same, null, this$1$1.composing ? "*compose" : null); + if (text.length > 1e3 || text.indexOf("\n") > -1) { + input.value = this$1$1.prevInput = ""; + } else { + this$1$1.prevInput = text; + } + if (this$1$1.composing) { + this$1$1.composing.range.clear(); + this$1$1.composing.range = cm.markText(this$1$1.composing.start, cm.getCursor("to"), { className: "CodeMirror-composing" }); + } + }); + return true; + }; + TextareaInput.prototype.ensurePolled = function() { + if (this.pollingFast && this.poll()) { + this.pollingFast = false; + } + }; + TextareaInput.prototype.onKeyPress = function() { + if (ie && ie_version >= 9) { + this.hasSelection = null; + } + this.fastPoll(); + }; + TextareaInput.prototype.onContextMenu = function(e) { + var input = this, cm = input.cm, display = cm.display, te = input.textarea; + if (input.contextMenuPending) { + input.contextMenuPending(); + } + var pos = posFromMouse(cm, e), scrollPos = display.scroller.scrollTop; + if (!pos || presto) { + return; + } + var reset = cm.options.resetSelectionOnContextMenu; + if (reset && cm.doc.sel.contains(pos) == -1) { + operation(cm, setSelection)(cm.doc, simpleSelection(pos), sel_dontScroll); + } + var oldCSS = te.style.cssText, oldWrapperCSS = input.wrapper.style.cssText; + var wrapperBox = input.wrapper.offsetParent.getBoundingClientRect(); + input.wrapper.style.cssText = "position: static"; + te.style.cssText = "position: absolute; width: 30px; height: 30px;\n top: " + (e.clientY - wrapperBox.top - 5) + "px; left: " + (e.clientX - wrapperBox.left - 5) + "px;\n z-index: 1000; background: " + (ie ? "rgba(255, 255, 255, .05)" : "transparent") + ";\n outline: none; border-width: 0; outline: none; overflow: hidden; opacity: .05; filter: alpha(opacity=5);"; + var oldScrollY; + if (webkit) { + oldScrollY = window.scrollY; + } + display.input.focus(); + if (webkit) { + window.scrollTo(null, oldScrollY); + } + display.input.reset(); + if (!cm.somethingSelected()) { + te.value = input.prevInput = " "; + } + input.contextMenuPending = rehide; + display.selForContextMenu = cm.doc.sel; + clearTimeout(display.detectingSelectAll); + function prepareSelectAllHack() { + if (te.selectionStart != null) { + var selected = cm.somethingSelected(); + var extval = "\u200B" + (selected ? te.value : ""); + te.value = "\u21DA"; + te.value = extval; + input.prevInput = selected ? "" : "\u200B"; + te.selectionStart = 1; + te.selectionEnd = extval.length; + display.selForContextMenu = cm.doc.sel; + } + } + function rehide() { + if (input.contextMenuPending != rehide) { + return; + } + input.contextMenuPending = false; + input.wrapper.style.cssText = oldWrapperCSS; + te.style.cssText = oldCSS; + if (ie && ie_version < 9) { + display.scrollbars.setScrollTop(display.scroller.scrollTop = scrollPos); + } + if (te.selectionStart != null) { + if (!ie || ie && ie_version < 9) { + prepareSelectAllHack(); + } + var i2 = 0, poll = function() { + if (display.selForContextMenu == cm.doc.sel && te.selectionStart == 0 && te.selectionEnd > 0 && input.prevInput == "\u200B") { + operation(cm, selectAll)(cm); + } else if (i2++ < 10) { + display.detectingSelectAll = setTimeout(poll, 500); + } else { + display.selForContextMenu = null; + display.input.reset(); + } + }; + display.detectingSelectAll = setTimeout(poll, 200); + } + } + if (ie && ie_version >= 9) { + prepareSelectAllHack(); + } + if (captureRightClick) { + e_stop(e); + var mouseup = function() { + off(window, "mouseup", mouseup); + setTimeout(rehide, 20); + }; + on(window, "mouseup", mouseup); + } else { + setTimeout(rehide, 50); + } + }; + TextareaInput.prototype.readOnlyChanged = function(val) { + if (!val) { + this.reset(); + } + this.textarea.disabled = val == "nocursor"; + this.textarea.readOnly = !!val; + }; + TextareaInput.prototype.setUneditable = function() { + }; + TextareaInput.prototype.needsContentAttribute = false; + function fromTextArea(textarea, options) { + options = options ? copyObj(options) : {}; + options.value = textarea.value; + if (!options.tabindex && textarea.tabIndex) { + options.tabindex = textarea.tabIndex; + } + if (!options.placeholder && textarea.placeholder) { + options.placeholder = textarea.placeholder; + } + if (options.autofocus == null) { + var hasFocus = activeElt(); + options.autofocus = hasFocus == textarea || textarea.getAttribute("autofocus") != null && hasFocus == document.body; + } + function save() { + textarea.value = cm.getValue(); + } + var realSubmit; + if (textarea.form) { + on(textarea.form, "submit", save); + if (!options.leaveSubmitMethodAlone) { + var form = textarea.form; + realSubmit = form.submit; + try { + var wrappedSubmit = form.submit = function() { + save(); + form.submit = realSubmit; + form.submit(); + form.submit = wrappedSubmit; + }; + } catch (e) { + } + } + } + options.finishInit = function(cm2) { + cm2.save = save; + cm2.getTextArea = function() { + return textarea; + }; + cm2.toTextArea = function() { + cm2.toTextArea = isNaN; + save(); + textarea.parentNode.removeChild(cm2.getWrapperElement()); + textarea.style.display = ""; + if (textarea.form) { + off(textarea.form, "submit", save); + if (!options.leaveSubmitMethodAlone && typeof textarea.form.submit == "function") { + textarea.form.submit = realSubmit; + } + } + }; + }; + textarea.style.display = "none"; + var cm = CodeMirror(function(node) { + return textarea.parentNode.insertBefore(node, textarea.nextSibling); + }, options); + return cm; + } + function addLegacyProps(CodeMirror2) { + CodeMirror2.off = off; + CodeMirror2.on = on; + CodeMirror2.wheelEventPixels = wheelEventPixels; + CodeMirror2.Doc = Doc; + CodeMirror2.splitLines = splitLinesAuto; + CodeMirror2.countColumn = countColumn; + CodeMirror2.findColumn = findColumn; + CodeMirror2.isWordChar = isWordCharBasic; + CodeMirror2.Pass = Pass; + CodeMirror2.signal = signal; + CodeMirror2.Line = Line; + CodeMirror2.changeEnd = changeEnd; + CodeMirror2.scrollbarModel = scrollbarModel; + CodeMirror2.Pos = Pos; + CodeMirror2.cmpPos = cmp; + CodeMirror2.modes = modes; + CodeMirror2.mimeModes = mimeModes; + CodeMirror2.resolveMode = resolveMode; + CodeMirror2.getMode = getMode; + CodeMirror2.modeExtensions = modeExtensions; + CodeMirror2.extendMode = extendMode; + CodeMirror2.copyState = copyState; + CodeMirror2.startState = startState; + CodeMirror2.innerMode = innerMode; + CodeMirror2.commands = commands; + CodeMirror2.keyMap = keyMap; + CodeMirror2.keyName = keyName; + CodeMirror2.isModifierKey = isModifierKey; + CodeMirror2.lookupKey = lookupKey; + CodeMirror2.normalizeKeyMap = normalizeKeyMap; + CodeMirror2.StringStream = StringStream; + CodeMirror2.SharedTextMarker = SharedTextMarker; + CodeMirror2.TextMarker = TextMarker; + CodeMirror2.LineWidget = LineWidget; + CodeMirror2.e_preventDefault = e_preventDefault; + CodeMirror2.e_stopPropagation = e_stopPropagation; + CodeMirror2.e_stop = e_stop; + CodeMirror2.addClass = addClass; + CodeMirror2.contains = contains; + CodeMirror2.rmClass = rmClass; + CodeMirror2.keyNames = keyNames; + } + defineOptions(CodeMirror); + addEditorMethods(CodeMirror); + var dontDelegate = "iter insert remove copy getEditor constructor".split(" "); + for (var prop in Doc.prototype) { + if (Doc.prototype.hasOwnProperty(prop) && indexOf(dontDelegate, prop) < 0) { + CodeMirror.prototype[prop] = function(method) { + return function() { + return method.apply(this.doc, arguments); + }; + }(Doc.prototype[prop]); + } + } + eventMixin(Doc); + CodeMirror.inputStyles = { "textarea": TextareaInput, "contenteditable": ContentEditableInput }; + CodeMirror.defineMode = function(name) { + if (!CodeMirror.defaults.mode && name != "null") { + CodeMirror.defaults.mode = name; + } + defineMode.apply(this, arguments); + }; + CodeMirror.defineMIME = defineMIME; + CodeMirror.defineMode("null", function() { + return { token: function(stream) { + return stream.skipToEnd(); + } }; + }); + CodeMirror.defineMIME("text/plain", "null"); + CodeMirror.defineExtension = function(name, func) { + CodeMirror.prototype[name] = func; + }; + CodeMirror.defineDocExtension = function(name, func) { + Doc.prototype[name] = func; + }; + CodeMirror.fromTextArea = fromTextArea; + addLegacyProps(CodeMirror); + CodeMirror.version = "5.65.6"; + return CodeMirror; + }); + } +}); + +// dep:codemirror +var codemirror_default = require_codemirror(); + +const codemirror = ''; + +// node_modules/codemirror/mode/javascript/javascript.js +var require_javascript = __commonJS({ + "node_modules/codemirror/mode/javascript/javascript.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + CodeMirror2.defineMode("javascript", function(config, parserConfig) { + var indentUnit = config.indentUnit; + var statementIndent = parserConfig.statementIndent; + var jsonldMode = parserConfig.jsonld; + var jsonMode = parserConfig.json || jsonldMode; + var trackScope = parserConfig.trackScope !== false; + var isTS = parserConfig.typescript; + var wordRE = parserConfig.wordCharacters || /[\w$\xa1-\uffff]/; + var keywords = function() { + function kw(type2) { + return { type: type2, style: "keyword" }; + } + var A = kw("keyword a"), B = kw("keyword b"), C = kw("keyword c"), D = kw("keyword d"); + var operator = kw("operator"), atom = { type: "atom", style: "atom" }; + return { + "if": kw("if"), + "while": A, + "with": A, + "else": B, + "do": B, + "try": B, + "finally": B, + "return": D, + "break": D, + "continue": D, + "new": kw("new"), + "delete": C, + "void": C, + "throw": C, + "debugger": kw("debugger"), + "var": kw("var"), + "const": kw("var"), + "let": kw("var"), + "function": kw("function"), + "catch": kw("catch"), + "for": kw("for"), + "switch": kw("switch"), + "case": kw("case"), + "default": kw("default"), + "in": operator, + "typeof": operator, + "instanceof": operator, + "true": atom, + "false": atom, + "null": atom, + "undefined": atom, + "NaN": atom, + "Infinity": atom, + "this": kw("this"), + "class": kw("class"), + "super": kw("atom"), + "yield": C, + "export": kw("export"), + "import": kw("import"), + "extends": C, + "await": C + }; + }(); + var isOperatorChar = /[+\-*&%=<>!?|~^@]/; + var isJsonldKeyword = /^@(context|id|value|language|type|container|list|set|reverse|index|base|vocab|graph)"/; + function readRegexp(stream) { + var escaped = false, next, inSet = false; + while ((next = stream.next()) != null) { + if (!escaped) { + if (next == "/" && !inSet) + return; + if (next == "[") + inSet = true; + else if (inSet && next == "]") + inSet = false; + } + escaped = !escaped && next == "\\"; + } + } + var type, content; + function ret(tp, style, cont2) { + type = tp; + content = cont2; + return style; + } + function tokenBase(stream, state) { + var ch = stream.next(); + if (ch == '"' || ch == "'") { + state.tokenize = tokenString(ch); + return state.tokenize(stream, state); + } else if (ch == "." && stream.match(/^\d[\d_]*(?:[eE][+\-]?[\d_]+)?/)) { + return ret("number", "number"); + } else if (ch == "." && stream.match("..")) { + return ret("spread", "meta"); + } else if (/[\[\]{}\(\),;\:\.]/.test(ch)) { + return ret(ch); + } else if (ch == "=" && stream.eat(">")) { + return ret("=>", "operator"); + } else if (ch == "0" && stream.match(/^(?:x[\dA-Fa-f_]+|o[0-7_]+|b[01_]+)n?/)) { + return ret("number", "number"); + } else if (/\d/.test(ch)) { + stream.match(/^[\d_]*(?:n|(?:\.[\d_]*)?(?:[eE][+\-]?[\d_]+)?)?/); + return ret("number", "number"); + } else if (ch == "/") { + if (stream.eat("*")) { + state.tokenize = tokenComment; + return tokenComment(stream, state); + } else if (stream.eat("/")) { + stream.skipToEnd(); + return ret("comment", "comment"); + } else if (expressionAllowed(stream, state, 1)) { + readRegexp(stream); + stream.match(/^\b(([gimyus])(?![gimyus]*\2))+\b/); + return ret("regexp", "string-2"); + } else { + stream.eat("="); + return ret("operator", "operator", stream.current()); + } + } else if (ch == "`") { + state.tokenize = tokenQuasi; + return tokenQuasi(stream, state); + } else if (ch == "#" && stream.peek() == "!") { + stream.skipToEnd(); + return ret("meta", "meta"); + } else if (ch == "#" && stream.eatWhile(wordRE)) { + return ret("variable", "property"); + } else if (ch == "<" && stream.match("!--") || ch == "-" && stream.match("->") && !/\S/.test(stream.string.slice(0, stream.start))) { + stream.skipToEnd(); + return ret("comment", "comment"); + } else if (isOperatorChar.test(ch)) { + if (ch != ">" || !state.lexical || state.lexical.type != ">") { + if (stream.eat("=")) { + if (ch == "!" || ch == "=") + stream.eat("="); + } else if (/[<>*+\-|&?]/.test(ch)) { + stream.eat(ch); + if (ch == ">") + stream.eat(ch); + } + } + if (ch == "?" && stream.eat(".")) + return ret("."); + return ret("operator", "operator", stream.current()); + } else if (wordRE.test(ch)) { + stream.eatWhile(wordRE); + var word = stream.current(); + if (state.lastType != ".") { + if (keywords.propertyIsEnumerable(word)) { + var kw = keywords[word]; + return ret(kw.type, kw.style, word); + } + if (word == "async" && stream.match(/^(\s|\/\*([^*]|\*(?!\/))*?\*\/)*[\[\(\w]/, false)) + return ret("async", "keyword", word); + } + return ret("variable", "variable", word); + } + } + function tokenString(quote) { + return function(stream, state) { + var escaped = false, next; + if (jsonldMode && stream.peek() == "@" && stream.match(isJsonldKeyword)) { + state.tokenize = tokenBase; + return ret("jsonld-keyword", "meta"); + } + while ((next = stream.next()) != null) { + if (next == quote && !escaped) + break; + escaped = !escaped && next == "\\"; + } + if (!escaped) + state.tokenize = tokenBase; + return ret("string", "string"); + }; + } + function tokenComment(stream, state) { + var maybeEnd = false, ch; + while (ch = stream.next()) { + if (ch == "/" && maybeEnd) { + state.tokenize = tokenBase; + break; + } + maybeEnd = ch == "*"; + } + return ret("comment", "comment"); + } + function tokenQuasi(stream, state) { + var escaped = false, next; + while ((next = stream.next()) != null) { + if (!escaped && (next == "`" || next == "$" && stream.eat("{"))) { + state.tokenize = tokenBase; + break; + } + escaped = !escaped && next == "\\"; + } + return ret("quasi", "string-2", stream.current()); + } + var brackets = "([{}])"; + function findFatArrow(stream, state) { + if (state.fatArrowAt) + state.fatArrowAt = null; + var arrow = stream.string.indexOf("=>", stream.start); + if (arrow < 0) + return; + if (isTS) { + var m = /:\s*(?:\w+(?:<[^>]*>|\[\])?|\{[^}]*\})\s*$/.exec(stream.string.slice(stream.start, arrow)); + if (m) + arrow = m.index; + } + var depth = 0, sawSomething = false; + for (var pos = arrow - 1; pos >= 0; --pos) { + var ch = stream.string.charAt(pos); + var bracket = brackets.indexOf(ch); + if (bracket >= 0 && bracket < 3) { + if (!depth) { + ++pos; + break; + } + if (--depth == 0) { + if (ch == "(") + sawSomething = true; + break; + } + } else if (bracket >= 3 && bracket < 6) { + ++depth; + } else if (wordRE.test(ch)) { + sawSomething = true; + } else if (/["'\/`]/.test(ch)) { + for (; ; --pos) { + if (pos == 0) + return; + var next = stream.string.charAt(pos - 1); + if (next == ch && stream.string.charAt(pos - 2) != "\\") { + pos--; + break; + } + } + } else if (sawSomething && !depth) { + ++pos; + break; + } + } + if (sawSomething && !depth) + state.fatArrowAt = pos; + } + var atomicTypes = { + "atom": true, + "number": true, + "variable": true, + "string": true, + "regexp": true, + "this": true, + "import": true, + "jsonld-keyword": true + }; + function JSLexical(indented, column, type2, align, prev, info) { + this.indented = indented; + this.column = column; + this.type = type2; + this.prev = prev; + this.info = info; + if (align != null) + this.align = align; + } + function inScope(state, varname) { + if (!trackScope) + return false; + for (var v = state.localVars; v; v = v.next) + if (v.name == varname) + return true; + for (var cx2 = state.context; cx2; cx2 = cx2.prev) { + for (var v = cx2.vars; v; v = v.next) + if (v.name == varname) + return true; + } + } + function parseJS(state, style, type2, content2, stream) { + var cc = state.cc; + cx.state = state; + cx.stream = stream; + cx.marked = null, cx.cc = cc; + cx.style = style; + if (!state.lexical.hasOwnProperty("align")) + state.lexical.align = true; + while (true) { + var combinator = cc.length ? cc.pop() : jsonMode ? expression : statement; + if (combinator(type2, content2)) { + while (cc.length && cc[cc.length - 1].lex) + cc.pop()(); + if (cx.marked) + return cx.marked; + if (type2 == "variable" && inScope(state, content2)) + return "variable-2"; + return style; + } + } + } + var cx = { state: null, column: null, marked: null, cc: null }; + function pass() { + for (var i = arguments.length - 1; i >= 0; i--) + cx.cc.push(arguments[i]); + } + function cont() { + pass.apply(null, arguments); + return true; + } + function inList(name, list) { + for (var v = list; v; v = v.next) + if (v.name == name) + return true; + return false; + } + function register(varname) { + var state = cx.state; + cx.marked = "def"; + if (!trackScope) + return; + if (state.context) { + if (state.lexical.info == "var" && state.context && state.context.block) { + var newContext = registerVarScoped(varname, state.context); + if (newContext != null) { + state.context = newContext; + return; + } + } else if (!inList(varname, state.localVars)) { + state.localVars = new Var(varname, state.localVars); + return; + } + } + if (parserConfig.globalVars && !inList(varname, state.globalVars)) + state.globalVars = new Var(varname, state.globalVars); + } + function registerVarScoped(varname, context) { + if (!context) { + return null; + } else if (context.block) { + var inner = registerVarScoped(varname, context.prev); + if (!inner) + return null; + if (inner == context.prev) + return context; + return new Context(inner, context.vars, true); + } else if (inList(varname, context.vars)) { + return context; + } else { + return new Context(context.prev, new Var(varname, context.vars), false); + } + } + function isModifier(name) { + return name == "public" || name == "private" || name == "protected" || name == "abstract" || name == "readonly"; + } + function Context(prev, vars, block2) { + this.prev = prev; + this.vars = vars; + this.block = block2; + } + function Var(name, next) { + this.name = name; + this.next = next; + } + var defaultVars = new Var("this", new Var("arguments", null)); + function pushcontext() { + cx.state.context = new Context(cx.state.context, cx.state.localVars, false); + cx.state.localVars = defaultVars; + } + function pushblockcontext() { + cx.state.context = new Context(cx.state.context, cx.state.localVars, true); + cx.state.localVars = null; + } + pushcontext.lex = pushblockcontext.lex = true; + function popcontext() { + cx.state.localVars = cx.state.context.vars; + cx.state.context = cx.state.context.prev; + } + popcontext.lex = true; + function pushlex(type2, info) { + var result = function() { + var state = cx.state, indent = state.indented; + if (state.lexical.type == "stat") + indent = state.lexical.indented; + else + for (var outer = state.lexical; outer && outer.type == ")" && outer.align; outer = outer.prev) + indent = outer.indented; + state.lexical = new JSLexical(indent, cx.stream.column(), type2, null, state.lexical, info); + }; + result.lex = true; + return result; + } + function poplex() { + var state = cx.state; + if (state.lexical.prev) { + if (state.lexical.type == ")") + state.indented = state.lexical.indented; + state.lexical = state.lexical.prev; + } + } + poplex.lex = true; + function expect(wanted) { + function exp(type2) { + if (type2 == wanted) + return cont(); + else if (wanted == ";" || type2 == "}" || type2 == ")" || type2 == "]") + return pass(); + else + return cont(exp); + } + return exp; + } + function statement(type2, value) { + if (type2 == "var") + return cont(pushlex("vardef", value), vardef, expect(";"), poplex); + if (type2 == "keyword a") + return cont(pushlex("form"), parenExpr, statement, poplex); + if (type2 == "keyword b") + return cont(pushlex("form"), statement, poplex); + if (type2 == "keyword d") + return cx.stream.match(/^\s*$/, false) ? cont() : cont(pushlex("stat"), maybeexpression, expect(";"), poplex); + if (type2 == "debugger") + return cont(expect(";")); + if (type2 == "{") + return cont(pushlex("}"), pushblockcontext, block, poplex, popcontext); + if (type2 == ";") + return cont(); + if (type2 == "if") { + if (cx.state.lexical.info == "else" && cx.state.cc[cx.state.cc.length - 1] == poplex) + cx.state.cc.pop()(); + return cont(pushlex("form"), parenExpr, statement, poplex, maybeelse); + } + if (type2 == "function") + return cont(functiondef); + if (type2 == "for") + return cont(pushlex("form"), pushblockcontext, forspec, statement, popcontext, poplex); + if (type2 == "class" || isTS && value == "interface") { + cx.marked = "keyword"; + return cont(pushlex("form", type2 == "class" ? type2 : value), className, poplex); + } + if (type2 == "variable") { + if (isTS && value == "declare") { + cx.marked = "keyword"; + return cont(statement); + } else if (isTS && (value == "module" || value == "enum" || value == "type") && cx.stream.match(/^\s*\w/, false)) { + cx.marked = "keyword"; + if (value == "enum") + return cont(enumdef); + else if (value == "type") + return cont(typename, expect("operator"), typeexpr, expect(";")); + else + return cont(pushlex("form"), pattern, expect("{"), pushlex("}"), block, poplex, poplex); + } else if (isTS && value == "namespace") { + cx.marked = "keyword"; + return cont(pushlex("form"), expression, statement, poplex); + } else if (isTS && value == "abstract") { + cx.marked = "keyword"; + return cont(statement); + } else { + return cont(pushlex("stat"), maybelabel); + } + } + if (type2 == "switch") + return cont(pushlex("form"), parenExpr, expect("{"), pushlex("}", "switch"), pushblockcontext, block, poplex, poplex, popcontext); + if (type2 == "case") + return cont(expression, expect(":")); + if (type2 == "default") + return cont(expect(":")); + if (type2 == "catch") + return cont(pushlex("form"), pushcontext, maybeCatchBinding, statement, poplex, popcontext); + if (type2 == "export") + return cont(pushlex("stat"), afterExport, poplex); + if (type2 == "import") + return cont(pushlex("stat"), afterImport, poplex); + if (type2 == "async") + return cont(statement); + if (value == "@") + return cont(expression, statement); + return pass(pushlex("stat"), expression, expect(";"), poplex); + } + function maybeCatchBinding(type2) { + if (type2 == "(") + return cont(funarg, expect(")")); + } + function expression(type2, value) { + return expressionInner(type2, value, false); + } + function expressionNoComma(type2, value) { + return expressionInner(type2, value, true); + } + function parenExpr(type2) { + if (type2 != "(") + return pass(); + return cont(pushlex(")"), maybeexpression, expect(")"), poplex); + } + function expressionInner(type2, value, noComma) { + if (cx.state.fatArrowAt == cx.stream.start) { + var body = noComma ? arrowBodyNoComma : arrowBody; + if (type2 == "(") + return cont(pushcontext, pushlex(")"), commasep(funarg, ")"), poplex, expect("=>"), body, popcontext); + else if (type2 == "variable") + return pass(pushcontext, pattern, expect("=>"), body, popcontext); + } + var maybeop = noComma ? maybeoperatorNoComma : maybeoperatorComma; + if (atomicTypes.hasOwnProperty(type2)) + return cont(maybeop); + if (type2 == "function") + return cont(functiondef, maybeop); + if (type2 == "class" || isTS && value == "interface") { + cx.marked = "keyword"; + return cont(pushlex("form"), classExpression, poplex); + } + if (type2 == "keyword c" || type2 == "async") + return cont(noComma ? expressionNoComma : expression); + if (type2 == "(") + return cont(pushlex(")"), maybeexpression, expect(")"), poplex, maybeop); + if (type2 == "operator" || type2 == "spread") + return cont(noComma ? expressionNoComma : expression); + if (type2 == "[") + return cont(pushlex("]"), arrayLiteral, poplex, maybeop); + if (type2 == "{") + return contCommasep(objprop, "}", null, maybeop); + if (type2 == "quasi") + return pass(quasi, maybeop); + if (type2 == "new") + return cont(maybeTarget(noComma)); + return cont(); + } + function maybeexpression(type2) { + if (type2.match(/[;\}\)\],]/)) + return pass(); + return pass(expression); + } + function maybeoperatorComma(type2, value) { + if (type2 == ",") + return cont(maybeexpression); + return maybeoperatorNoComma(type2, value, false); + } + function maybeoperatorNoComma(type2, value, noComma) { + var me = noComma == false ? maybeoperatorComma : maybeoperatorNoComma; + var expr = noComma == false ? expression : expressionNoComma; + if (type2 == "=>") + return cont(pushcontext, noComma ? arrowBodyNoComma : arrowBody, popcontext); + if (type2 == "operator") { + if (/\+\+|--/.test(value) || isTS && value == "!") + return cont(me); + if (isTS && value == "<" && cx.stream.match(/^([^<>]|<[^<>]*>)*>\s*\(/, false)) + return cont(pushlex(">"), commasep(typeexpr, ">"), poplex, me); + if (value == "?") + return cont(expression, expect(":"), expr); + return cont(expr); + } + if (type2 == "quasi") { + return pass(quasi, me); + } + if (type2 == ";") + return; + if (type2 == "(") + return contCommasep(expressionNoComma, ")", "call", me); + if (type2 == ".") + return cont(property, me); + if (type2 == "[") + return cont(pushlex("]"), maybeexpression, expect("]"), poplex, me); + if (isTS && value == "as") { + cx.marked = "keyword"; + return cont(typeexpr, me); + } + if (type2 == "regexp") { + cx.state.lastType = cx.marked = "operator"; + cx.stream.backUp(cx.stream.pos - cx.stream.start - 1); + return cont(expr); + } + } + function quasi(type2, value) { + if (type2 != "quasi") + return pass(); + if (value.slice(value.length - 2) != "${") + return cont(quasi); + return cont(maybeexpression, continueQuasi); + } + function continueQuasi(type2) { + if (type2 == "}") { + cx.marked = "string-2"; + cx.state.tokenize = tokenQuasi; + return cont(quasi); + } + } + function arrowBody(type2) { + findFatArrow(cx.stream, cx.state); + return pass(type2 == "{" ? statement : expression); + } + function arrowBodyNoComma(type2) { + findFatArrow(cx.stream, cx.state); + return pass(type2 == "{" ? statement : expressionNoComma); + } + function maybeTarget(noComma) { + return function(type2) { + if (type2 == ".") + return cont(noComma ? targetNoComma : target); + else if (type2 == "variable" && isTS) + return cont(maybeTypeArgs, noComma ? maybeoperatorNoComma : maybeoperatorComma); + else + return pass(noComma ? expressionNoComma : expression); + }; + } + function target(_, value) { + if (value == "target") { + cx.marked = "keyword"; + return cont(maybeoperatorComma); + } + } + function targetNoComma(_, value) { + if (value == "target") { + cx.marked = "keyword"; + return cont(maybeoperatorNoComma); + } + } + function maybelabel(type2) { + if (type2 == ":") + return cont(poplex, statement); + return pass(maybeoperatorComma, expect(";"), poplex); + } + function property(type2) { + if (type2 == "variable") { + cx.marked = "property"; + return cont(); + } + } + function objprop(type2, value) { + if (type2 == "async") { + cx.marked = "property"; + return cont(objprop); + } else if (type2 == "variable" || cx.style == "keyword") { + cx.marked = "property"; + if (value == "get" || value == "set") + return cont(getterSetter); + var m; + if (isTS && cx.state.fatArrowAt == cx.stream.start && (m = cx.stream.match(/^\s*:\s*/, false))) + cx.state.fatArrowAt = cx.stream.pos + m[0].length; + return cont(afterprop); + } else if (type2 == "number" || type2 == "string") { + cx.marked = jsonldMode ? "property" : cx.style + " property"; + return cont(afterprop); + } else if (type2 == "jsonld-keyword") { + return cont(afterprop); + } else if (isTS && isModifier(value)) { + cx.marked = "keyword"; + return cont(objprop); + } else if (type2 == "[") { + return cont(expression, maybetype, expect("]"), afterprop); + } else if (type2 == "spread") { + return cont(expressionNoComma, afterprop); + } else if (value == "*") { + cx.marked = "keyword"; + return cont(objprop); + } else if (type2 == ":") { + return pass(afterprop); + } + } + function getterSetter(type2) { + if (type2 != "variable") + return pass(afterprop); + cx.marked = "property"; + return cont(functiondef); + } + function afterprop(type2) { + if (type2 == ":") + return cont(expressionNoComma); + if (type2 == "(") + return pass(functiondef); + } + function commasep(what, end, sep) { + function proceed(type2, value) { + if (sep ? sep.indexOf(type2) > -1 : type2 == ",") { + var lex = cx.state.lexical; + if (lex.info == "call") + lex.pos = (lex.pos || 0) + 1; + return cont(function(type3, value2) { + if (type3 == end || value2 == end) + return pass(); + return pass(what); + }, proceed); + } + if (type2 == end || value == end) + return cont(); + if (sep && sep.indexOf(";") > -1) + return pass(what); + return cont(expect(end)); + } + return function(type2, value) { + if (type2 == end || value == end) + return cont(); + return pass(what, proceed); + }; + } + function contCommasep(what, end, info) { + for (var i = 3; i < arguments.length; i++) + cx.cc.push(arguments[i]); + return cont(pushlex(end, info), commasep(what, end), poplex); + } + function block(type2) { + if (type2 == "}") + return cont(); + return pass(statement, block); + } + function maybetype(type2, value) { + if (isTS) { + if (type2 == ":") + return cont(typeexpr); + if (value == "?") + return cont(maybetype); + } + } + function maybetypeOrIn(type2, value) { + if (isTS && (type2 == ":" || value == "in")) + return cont(typeexpr); + } + function mayberettype(type2) { + if (isTS && type2 == ":") { + if (cx.stream.match(/^\s*\w+\s+is\b/, false)) + return cont(expression, isKW, typeexpr); + else + return cont(typeexpr); + } + } + function isKW(_, value) { + if (value == "is") { + cx.marked = "keyword"; + return cont(); + } + } + function typeexpr(type2, value) { + if (value == "keyof" || value == "typeof" || value == "infer" || value == "readonly") { + cx.marked = "keyword"; + return cont(value == "typeof" ? expressionNoComma : typeexpr); + } + if (type2 == "variable" || value == "void") { + cx.marked = "type"; + return cont(afterType); + } + if (value == "|" || value == "&") + return cont(typeexpr); + if (type2 == "string" || type2 == "number" || type2 == "atom") + return cont(afterType); + if (type2 == "[") + return cont(pushlex("]"), commasep(typeexpr, "]", ","), poplex, afterType); + if (type2 == "{") + return cont(pushlex("}"), typeprops, poplex, afterType); + if (type2 == "(") + return cont(commasep(typearg, ")"), maybeReturnType, afterType); + if (type2 == "<") + return cont(commasep(typeexpr, ">"), typeexpr); + if (type2 == "quasi") { + return pass(quasiType, afterType); + } + } + function maybeReturnType(type2) { + if (type2 == "=>") + return cont(typeexpr); + } + function typeprops(type2) { + if (type2.match(/[\}\)\]]/)) + return cont(); + if (type2 == "," || type2 == ";") + return cont(typeprops); + return pass(typeprop, typeprops); + } + function typeprop(type2, value) { + if (type2 == "variable" || cx.style == "keyword") { + cx.marked = "property"; + return cont(typeprop); + } else if (value == "?" || type2 == "number" || type2 == "string") { + return cont(typeprop); + } else if (type2 == ":") { + return cont(typeexpr); + } else if (type2 == "[") { + return cont(expect("variable"), maybetypeOrIn, expect("]"), typeprop); + } else if (type2 == "(") { + return pass(functiondecl, typeprop); + } else if (!type2.match(/[;\}\)\],]/)) { + return cont(); + } + } + function quasiType(type2, value) { + if (type2 != "quasi") + return pass(); + if (value.slice(value.length - 2) != "${") + return cont(quasiType); + return cont(typeexpr, continueQuasiType); + } + function continueQuasiType(type2) { + if (type2 == "}") { + cx.marked = "string-2"; + cx.state.tokenize = tokenQuasi; + return cont(quasiType); + } + } + function typearg(type2, value) { + if (type2 == "variable" && cx.stream.match(/^\s*[?:]/, false) || value == "?") + return cont(typearg); + if (type2 == ":") + return cont(typeexpr); + if (type2 == "spread") + return cont(typearg); + return pass(typeexpr); + } + function afterType(type2, value) { + if (value == "<") + return cont(pushlex(">"), commasep(typeexpr, ">"), poplex, afterType); + if (value == "|" || type2 == "." || value == "&") + return cont(typeexpr); + if (type2 == "[") + return cont(typeexpr, expect("]"), afterType); + if (value == "extends" || value == "implements") { + cx.marked = "keyword"; + return cont(typeexpr); + } + if (value == "?") + return cont(typeexpr, expect(":"), typeexpr); + } + function maybeTypeArgs(_, value) { + if (value == "<") + return cont(pushlex(">"), commasep(typeexpr, ">"), poplex, afterType); + } + function typeparam() { + return pass(typeexpr, maybeTypeDefault); + } + function maybeTypeDefault(_, value) { + if (value == "=") + return cont(typeexpr); + } + function vardef(_, value) { + if (value == "enum") { + cx.marked = "keyword"; + return cont(enumdef); + } + return pass(pattern, maybetype, maybeAssign, vardefCont); + } + function pattern(type2, value) { + if (isTS && isModifier(value)) { + cx.marked = "keyword"; + return cont(pattern); + } + if (type2 == "variable") { + register(value); + return cont(); + } + if (type2 == "spread") + return cont(pattern); + if (type2 == "[") + return contCommasep(eltpattern, "]"); + if (type2 == "{") + return contCommasep(proppattern, "}"); + } + function proppattern(type2, value) { + if (type2 == "variable" && !cx.stream.match(/^\s*:/, false)) { + register(value); + return cont(maybeAssign); + } + if (type2 == "variable") + cx.marked = "property"; + if (type2 == "spread") + return cont(pattern); + if (type2 == "}") + return pass(); + if (type2 == "[") + return cont(expression, expect("]"), expect(":"), proppattern); + return cont(expect(":"), pattern, maybeAssign); + } + function eltpattern() { + return pass(pattern, maybeAssign); + } + function maybeAssign(_type, value) { + if (value == "=") + return cont(expressionNoComma); + } + function vardefCont(type2) { + if (type2 == ",") + return cont(vardef); + } + function maybeelse(type2, value) { + if (type2 == "keyword b" && value == "else") + return cont(pushlex("form", "else"), statement, poplex); + } + function forspec(type2, value) { + if (value == "await") + return cont(forspec); + if (type2 == "(") + return cont(pushlex(")"), forspec1, poplex); + } + function forspec1(type2) { + if (type2 == "var") + return cont(vardef, forspec2); + if (type2 == "variable") + return cont(forspec2); + return pass(forspec2); + } + function forspec2(type2, value) { + if (type2 == ")") + return cont(); + if (type2 == ";") + return cont(forspec2); + if (value == "in" || value == "of") { + cx.marked = "keyword"; + return cont(expression, forspec2); + } + return pass(expression, forspec2); + } + function functiondef(type2, value) { + if (value == "*") { + cx.marked = "keyword"; + return cont(functiondef); + } + if (type2 == "variable") { + register(value); + return cont(functiondef); + } + if (type2 == "(") + return cont(pushcontext, pushlex(")"), commasep(funarg, ")"), poplex, mayberettype, statement, popcontext); + if (isTS && value == "<") + return cont(pushlex(">"), commasep(typeparam, ">"), poplex, functiondef); + } + function functiondecl(type2, value) { + if (value == "*") { + cx.marked = "keyword"; + return cont(functiondecl); + } + if (type2 == "variable") { + register(value); + return cont(functiondecl); + } + if (type2 == "(") + return cont(pushcontext, pushlex(")"), commasep(funarg, ")"), poplex, mayberettype, popcontext); + if (isTS && value == "<") + return cont(pushlex(">"), commasep(typeparam, ">"), poplex, functiondecl); + } + function typename(type2, value) { + if (type2 == "keyword" || type2 == "variable") { + cx.marked = "type"; + return cont(typename); + } else if (value == "<") { + return cont(pushlex(">"), commasep(typeparam, ">"), poplex); + } + } + function funarg(type2, value) { + if (value == "@") + cont(expression, funarg); + if (type2 == "spread") + return cont(funarg); + if (isTS && isModifier(value)) { + cx.marked = "keyword"; + return cont(funarg); + } + if (isTS && type2 == "this") + return cont(maybetype, maybeAssign); + return pass(pattern, maybetype, maybeAssign); + } + function classExpression(type2, value) { + if (type2 == "variable") + return className(type2, value); + return classNameAfter(type2, value); + } + function className(type2, value) { + if (type2 == "variable") { + register(value); + return cont(classNameAfter); + } + } + function classNameAfter(type2, value) { + if (value == "<") + return cont(pushlex(">"), commasep(typeparam, ">"), poplex, classNameAfter); + if (value == "extends" || value == "implements" || isTS && type2 == ",") { + if (value == "implements") + cx.marked = "keyword"; + return cont(isTS ? typeexpr : expression, classNameAfter); + } + if (type2 == "{") + return cont(pushlex("}"), classBody, poplex); + } + function classBody(type2, value) { + if (type2 == "async" || type2 == "variable" && (value == "static" || value == "get" || value == "set" || isTS && isModifier(value)) && cx.stream.match(/^\s+[\w$\xa1-\uffff]/, false)) { + cx.marked = "keyword"; + return cont(classBody); + } + if (type2 == "variable" || cx.style == "keyword") { + cx.marked = "property"; + return cont(classfield, classBody); + } + if (type2 == "number" || type2 == "string") + return cont(classfield, classBody); + if (type2 == "[") + return cont(expression, maybetype, expect("]"), classfield, classBody); + if (value == "*") { + cx.marked = "keyword"; + return cont(classBody); + } + if (isTS && type2 == "(") + return pass(functiondecl, classBody); + if (type2 == ";" || type2 == ",") + return cont(classBody); + if (type2 == "}") + return cont(); + if (value == "@") + return cont(expression, classBody); + } + function classfield(type2, value) { + if (value == "!") + return cont(classfield); + if (value == "?") + return cont(classfield); + if (type2 == ":") + return cont(typeexpr, maybeAssign); + if (value == "=") + return cont(expressionNoComma); + var context = cx.state.lexical.prev, isInterface = context && context.info == "interface"; + return pass(isInterface ? functiondecl : functiondef); + } + function afterExport(type2, value) { + if (value == "*") { + cx.marked = "keyword"; + return cont(maybeFrom, expect(";")); + } + if (value == "default") { + cx.marked = "keyword"; + return cont(expression, expect(";")); + } + if (type2 == "{") + return cont(commasep(exportField, "}"), maybeFrom, expect(";")); + return pass(statement); + } + function exportField(type2, value) { + if (value == "as") { + cx.marked = "keyword"; + return cont(expect("variable")); + } + if (type2 == "variable") + return pass(expressionNoComma, exportField); + } + function afterImport(type2) { + if (type2 == "string") + return cont(); + if (type2 == "(") + return pass(expression); + if (type2 == ".") + return pass(maybeoperatorComma); + return pass(importSpec, maybeMoreImports, maybeFrom); + } + function importSpec(type2, value) { + if (type2 == "{") + return contCommasep(importSpec, "}"); + if (type2 == "variable") + register(value); + if (value == "*") + cx.marked = "keyword"; + return cont(maybeAs); + } + function maybeMoreImports(type2) { + if (type2 == ",") + return cont(importSpec, maybeMoreImports); + } + function maybeAs(_type, value) { + if (value == "as") { + cx.marked = "keyword"; + return cont(importSpec); + } + } + function maybeFrom(_type, value) { + if (value == "from") { + cx.marked = "keyword"; + return cont(expression); + } + } + function arrayLiteral(type2) { + if (type2 == "]") + return cont(); + return pass(commasep(expressionNoComma, "]")); + } + function enumdef() { + return pass(pushlex("form"), pattern, expect("{"), pushlex("}"), commasep(enummember, "}"), poplex, poplex); + } + function enummember() { + return pass(pattern, maybeAssign); + } + function isContinuedStatement(state, textAfter) { + return state.lastType == "operator" || state.lastType == "," || isOperatorChar.test(textAfter.charAt(0)) || /[,.]/.test(textAfter.charAt(0)); + } + function expressionAllowed(stream, state, backUp) { + return state.tokenize == tokenBase && /^(?:operator|sof|keyword [bcd]|case|new|export|default|spread|[\[{}\(,;:]|=>)$/.test(state.lastType) || state.lastType == "quasi" && /\{\s*$/.test(stream.string.slice(0, stream.pos - (backUp || 0))); + } + return { + startState: function(basecolumn) { + var state = { + tokenize: tokenBase, + lastType: "sof", + cc: [], + lexical: new JSLexical((basecolumn || 0) - indentUnit, 0, "block", false), + localVars: parserConfig.localVars, + context: parserConfig.localVars && new Context(null, null, false), + indented: basecolumn || 0 + }; + if (parserConfig.globalVars && typeof parserConfig.globalVars == "object") + state.globalVars = parserConfig.globalVars; + return state; + }, + token: function(stream, state) { + if (stream.sol()) { + if (!state.lexical.hasOwnProperty("align")) + state.lexical.align = false; + state.indented = stream.indentation(); + findFatArrow(stream, state); + } + if (state.tokenize != tokenComment && stream.eatSpace()) + return null; + var style = state.tokenize(stream, state); + if (type == "comment") + return style; + state.lastType = type == "operator" && (content == "++" || content == "--") ? "incdec" : type; + return parseJS(state, style, type, content, stream); + }, + indent: function(state, textAfter) { + if (state.tokenize == tokenComment || state.tokenize == tokenQuasi) + return CodeMirror2.Pass; + if (state.tokenize != tokenBase) + return 0; + var firstChar = textAfter && textAfter.charAt(0), lexical = state.lexical, top; + if (!/^\s*else\b/.test(textAfter)) + for (var i = state.cc.length - 1; i >= 0; --i) { + var c = state.cc[i]; + if (c == poplex) + lexical = lexical.prev; + else if (c != maybeelse && c != popcontext) + break; + } + while ((lexical.type == "stat" || lexical.type == "form") && (firstChar == "}" || (top = state.cc[state.cc.length - 1]) && (top == maybeoperatorComma || top == maybeoperatorNoComma) && !/^[,\.=+\-*:?[\(]/.test(textAfter))) + lexical = lexical.prev; + if (statementIndent && lexical.type == ")" && lexical.prev.type == "stat") + lexical = lexical.prev; + var type2 = lexical.type, closing = firstChar == type2; + if (type2 == "vardef") + return lexical.indented + (state.lastType == "operator" || state.lastType == "," ? lexical.info.length + 1 : 0); + else if (type2 == "form" && firstChar == "{") + return lexical.indented; + else if (type2 == "form") + return lexical.indented + indentUnit; + else if (type2 == "stat") + return lexical.indented + (isContinuedStatement(state, textAfter) ? statementIndent || indentUnit : 0); + else if (lexical.info == "switch" && !closing && parserConfig.doubleIndentSwitch != false) + return lexical.indented + (/^(?:case|default)\b/.test(textAfter) ? indentUnit : 2 * indentUnit); + else if (lexical.align) + return lexical.column + (closing ? 0 : 1); + else + return lexical.indented + (closing ? 0 : indentUnit); + }, + electricInput: /^\s*(?:case .*?:|default:|\{|\})$/, + blockCommentStart: jsonMode ? null : "/*", + blockCommentEnd: jsonMode ? null : "*/", + blockCommentContinue: jsonMode ? null : " * ", + lineComment: jsonMode ? null : "//", + fold: "brace", + closeBrackets: "()[]{}''\"\"``", + helperType: jsonMode ? "json" : "javascript", + jsonldMode, + jsonMode, + expressionAllowed, + skipExpression: function(state) { + parseJS(state, "atom", "atom", "true", new CodeMirror2.StringStream("", 2, null)); + } + }; + }); + CodeMirror2.registerHelper("wordChars", "javascript", /[\w$]/); + CodeMirror2.defineMIME("text/javascript", "javascript"); + CodeMirror2.defineMIME("text/ecmascript", "javascript"); + CodeMirror2.defineMIME("application/javascript", "javascript"); + CodeMirror2.defineMIME("application/x-javascript", "javascript"); + CodeMirror2.defineMIME("application/ecmascript", "javascript"); + CodeMirror2.defineMIME("application/json", { name: "javascript", json: true }); + CodeMirror2.defineMIME("application/x-json", { name: "javascript", json: true }); + CodeMirror2.defineMIME("application/manifest+json", { name: "javascript", json: true }); + CodeMirror2.defineMIME("application/ld+json", { name: "javascript", jsonld: true }); + CodeMirror2.defineMIME("text/typescript", { name: "javascript", typescript: true }); + CodeMirror2.defineMIME("application/typescript", { name: "javascript", typescript: true }); + }); + } +}); + +// node_modules/codemirror/mode/css/css.js +var require_css = __commonJS({ + "node_modules/codemirror/mode/css/css.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + CodeMirror2.defineMode("css", function(config, parserConfig) { + var inline = parserConfig.inline; + if (!parserConfig.propertyKeywords) + parserConfig = CodeMirror2.resolveMode("text/css"); + var indentUnit = config.indentUnit, tokenHooks = parserConfig.tokenHooks, documentTypes2 = parserConfig.documentTypes || {}, mediaTypes2 = parserConfig.mediaTypes || {}, mediaFeatures2 = parserConfig.mediaFeatures || {}, mediaValueKeywords2 = parserConfig.mediaValueKeywords || {}, propertyKeywords2 = parserConfig.propertyKeywords || {}, nonStandardPropertyKeywords2 = parserConfig.nonStandardPropertyKeywords || {}, fontProperties2 = parserConfig.fontProperties || {}, counterDescriptors2 = parserConfig.counterDescriptors || {}, colorKeywords2 = parserConfig.colorKeywords || {}, valueKeywords2 = parserConfig.valueKeywords || {}, allowNested = parserConfig.allowNested, lineComment = parserConfig.lineComment, supportsAtComponent = parserConfig.supportsAtComponent === true, highlightNonStandardPropertyKeywords = config.highlightNonStandardPropertyKeywords !== false; + var type, override; + function ret(style, tp) { + type = tp; + return style; + } + function tokenBase(stream, state) { + var ch = stream.next(); + if (tokenHooks[ch]) { + var result = tokenHooks[ch](stream, state); + if (result !== false) + return result; + } + if (ch == "@") { + stream.eatWhile(/[\w\\\-]/); + return ret("def", stream.current()); + } else if (ch == "=" || (ch == "~" || ch == "|") && stream.eat("=")) { + return ret(null, "compare"); + } else if (ch == '"' || ch == "'") { + state.tokenize = tokenString(ch); + return state.tokenize(stream, state); + } else if (ch == "#") { + stream.eatWhile(/[\w\\\-]/); + return ret("atom", "hash"); + } else if (ch == "!") { + stream.match(/^\s*\w*/); + return ret("keyword", "important"); + } else if (/\d/.test(ch) || ch == "." && stream.eat(/\d/)) { + stream.eatWhile(/[\w.%]/); + return ret("number", "unit"); + } else if (ch === "-") { + if (/[\d.]/.test(stream.peek())) { + stream.eatWhile(/[\w.%]/); + return ret("number", "unit"); + } else if (stream.match(/^-[\w\\\-]*/)) { + stream.eatWhile(/[\w\\\-]/); + if (stream.match(/^\s*:/, false)) + return ret("variable-2", "variable-definition"); + return ret("variable-2", "variable"); + } else if (stream.match(/^\w+-/)) { + return ret("meta", "meta"); + } + } else if (/[,+>*\/]/.test(ch)) { + return ret(null, "select-op"); + } else if (ch == "." && stream.match(/^-?[_a-z][_a-z0-9-]*/i)) { + return ret("qualifier", "qualifier"); + } else if (/[:;{}\[\]\(\)]/.test(ch)) { + return ret(null, ch); + } else if (stream.match(/^[\w-.]+(?=\()/)) { + if (/^(url(-prefix)?|domain|regexp)$/i.test(stream.current())) { + state.tokenize = tokenParenthesized; + } + return ret("variable callee", "variable"); + } else if (/[\w\\\-]/.test(ch)) { + stream.eatWhile(/[\w\\\-]/); + return ret("property", "word"); + } else { + return ret(null, null); + } + } + function tokenString(quote) { + return function(stream, state) { + var escaped = false, ch; + while ((ch = stream.next()) != null) { + if (ch == quote && !escaped) { + if (quote == ")") + stream.backUp(1); + break; + } + escaped = !escaped && ch == "\\"; + } + if (ch == quote || !escaped && quote != ")") + state.tokenize = null; + return ret("string", "string"); + }; + } + function tokenParenthesized(stream, state) { + stream.next(); + if (!stream.match(/^\s*[\"\')]/, false)) + state.tokenize = tokenString(")"); + else + state.tokenize = null; + return ret(null, "("); + } + function Context(type2, indent, prev) { + this.type = type2; + this.indent = indent; + this.prev = prev; + } + function pushContext(state, stream, type2, indent) { + state.context = new Context(type2, stream.indentation() + (indent === false ? 0 : indentUnit), state.context); + return type2; + } + function popContext(state) { + if (state.context.prev) + state.context = state.context.prev; + return state.context.type; + } + function pass(type2, stream, state) { + return states[state.context.type](type2, stream, state); + } + function popAndPass(type2, stream, state, n) { + for (var i = n || 1; i > 0; i--) + state.context = state.context.prev; + return pass(type2, stream, state); + } + function wordAsValue(stream) { + var word = stream.current().toLowerCase(); + if (valueKeywords2.hasOwnProperty(word)) + override = "atom"; + else if (colorKeywords2.hasOwnProperty(word)) + override = "keyword"; + else + override = "variable"; + } + var states = {}; + states.top = function(type2, stream, state) { + if (type2 == "{") { + return pushContext(state, stream, "block"); + } else if (type2 == "}" && state.context.prev) { + return popContext(state); + } else if (supportsAtComponent && /@component/i.test(type2)) { + return pushContext(state, stream, "atComponentBlock"); + } else if (/^@(-moz-)?document$/i.test(type2)) { + return pushContext(state, stream, "documentTypes"); + } else if (/^@(media|supports|(-moz-)?document|import)$/i.test(type2)) { + return pushContext(state, stream, "atBlock"); + } else if (/^@(font-face|counter-style)/i.test(type2)) { + state.stateArg = type2; + return "restricted_atBlock_before"; + } else if (/^@(-(moz|ms|o|webkit)-)?keyframes$/i.test(type2)) { + return "keyframes"; + } else if (type2 && type2.charAt(0) == "@") { + return pushContext(state, stream, "at"); + } else if (type2 == "hash") { + override = "builtin"; + } else if (type2 == "word") { + override = "tag"; + } else if (type2 == "variable-definition") { + return "maybeprop"; + } else if (type2 == "interpolation") { + return pushContext(state, stream, "interpolation"); + } else if (type2 == ":") { + return "pseudo"; + } else if (allowNested && type2 == "(") { + return pushContext(state, stream, "parens"); + } + return state.context.type; + }; + states.block = function(type2, stream, state) { + if (type2 == "word") { + var word = stream.current().toLowerCase(); + if (propertyKeywords2.hasOwnProperty(word)) { + override = "property"; + return "maybeprop"; + } else if (nonStandardPropertyKeywords2.hasOwnProperty(word)) { + override = highlightNonStandardPropertyKeywords ? "string-2" : "property"; + return "maybeprop"; + } else if (allowNested) { + override = stream.match(/^\s*:(?:\s|$)/, false) ? "property" : "tag"; + return "block"; + } else { + override += " error"; + return "maybeprop"; + } + } else if (type2 == "meta") { + return "block"; + } else if (!allowNested && (type2 == "hash" || type2 == "qualifier")) { + override = "error"; + return "block"; + } else { + return states.top(type2, stream, state); + } + }; + states.maybeprop = function(type2, stream, state) { + if (type2 == ":") + return pushContext(state, stream, "prop"); + return pass(type2, stream, state); + }; + states.prop = function(type2, stream, state) { + if (type2 == ";") + return popContext(state); + if (type2 == "{" && allowNested) + return pushContext(state, stream, "propBlock"); + if (type2 == "}" || type2 == "{") + return popAndPass(type2, stream, state); + if (type2 == "(") + return pushContext(state, stream, "parens"); + if (type2 == "hash" && !/^#([0-9a-fA-f]{3,4}|[0-9a-fA-f]{6}|[0-9a-fA-f]{8})$/.test(stream.current())) { + override += " error"; + } else if (type2 == "word") { + wordAsValue(stream); + } else if (type2 == "interpolation") { + return pushContext(state, stream, "interpolation"); + } + return "prop"; + }; + states.propBlock = function(type2, _stream, state) { + if (type2 == "}") + return popContext(state); + if (type2 == "word") { + override = "property"; + return "maybeprop"; + } + return state.context.type; + }; + states.parens = function(type2, stream, state) { + if (type2 == "{" || type2 == "}") + return popAndPass(type2, stream, state); + if (type2 == ")") + return popContext(state); + if (type2 == "(") + return pushContext(state, stream, "parens"); + if (type2 == "interpolation") + return pushContext(state, stream, "interpolation"); + if (type2 == "word") + wordAsValue(stream); + return "parens"; + }; + states.pseudo = function(type2, stream, state) { + if (type2 == "meta") + return "pseudo"; + if (type2 == "word") { + override = "variable-3"; + return state.context.type; + } + return pass(type2, stream, state); + }; + states.documentTypes = function(type2, stream, state) { + if (type2 == "word" && documentTypes2.hasOwnProperty(stream.current())) { + override = "tag"; + return state.context.type; + } else { + return states.atBlock(type2, stream, state); + } + }; + states.atBlock = function(type2, stream, state) { + if (type2 == "(") + return pushContext(state, stream, "atBlock_parens"); + if (type2 == "}" || type2 == ";") + return popAndPass(type2, stream, state); + if (type2 == "{") + return popContext(state) && pushContext(state, stream, allowNested ? "block" : "top"); + if (type2 == "interpolation") + return pushContext(state, stream, "interpolation"); + if (type2 == "word") { + var word = stream.current().toLowerCase(); + if (word == "only" || word == "not" || word == "and" || word == "or") + override = "keyword"; + else if (mediaTypes2.hasOwnProperty(word)) + override = "attribute"; + else if (mediaFeatures2.hasOwnProperty(word)) + override = "property"; + else if (mediaValueKeywords2.hasOwnProperty(word)) + override = "keyword"; + else if (propertyKeywords2.hasOwnProperty(word)) + override = "property"; + else if (nonStandardPropertyKeywords2.hasOwnProperty(word)) + override = highlightNonStandardPropertyKeywords ? "string-2" : "property"; + else if (valueKeywords2.hasOwnProperty(word)) + override = "atom"; + else if (colorKeywords2.hasOwnProperty(word)) + override = "keyword"; + else + override = "error"; + } + return state.context.type; + }; + states.atComponentBlock = function(type2, stream, state) { + if (type2 == "}") + return popAndPass(type2, stream, state); + if (type2 == "{") + return popContext(state) && pushContext(state, stream, allowNested ? "block" : "top", false); + if (type2 == "word") + override = "error"; + return state.context.type; + }; + states.atBlock_parens = function(type2, stream, state) { + if (type2 == ")") + return popContext(state); + if (type2 == "{" || type2 == "}") + return popAndPass(type2, stream, state, 2); + return states.atBlock(type2, stream, state); + }; + states.restricted_atBlock_before = function(type2, stream, state) { + if (type2 == "{") + return pushContext(state, stream, "restricted_atBlock"); + if (type2 == "word" && state.stateArg == "@counter-style") { + override = "variable"; + return "restricted_atBlock_before"; + } + return pass(type2, stream, state); + }; + states.restricted_atBlock = function(type2, stream, state) { + if (type2 == "}") { + state.stateArg = null; + return popContext(state); + } + if (type2 == "word") { + if (state.stateArg == "@font-face" && !fontProperties2.hasOwnProperty(stream.current().toLowerCase()) || state.stateArg == "@counter-style" && !counterDescriptors2.hasOwnProperty(stream.current().toLowerCase())) + override = "error"; + else + override = "property"; + return "maybeprop"; + } + return "restricted_atBlock"; + }; + states.keyframes = function(type2, stream, state) { + if (type2 == "word") { + override = "variable"; + return "keyframes"; + } + if (type2 == "{") + return pushContext(state, stream, "top"); + return pass(type2, stream, state); + }; + states.at = function(type2, stream, state) { + if (type2 == ";") + return popContext(state); + if (type2 == "{" || type2 == "}") + return popAndPass(type2, stream, state); + if (type2 == "word") + override = "tag"; + else if (type2 == "hash") + override = "builtin"; + return "at"; + }; + states.interpolation = function(type2, stream, state) { + if (type2 == "}") + return popContext(state); + if (type2 == "{" || type2 == ";") + return popAndPass(type2, stream, state); + if (type2 == "word") + override = "variable"; + else if (type2 != "variable" && type2 != "(" && type2 != ")") + override = "error"; + return "interpolation"; + }; + return { + startState: function(base) { + return { + tokenize: null, + state: inline ? "block" : "top", + stateArg: null, + context: new Context(inline ? "block" : "top", base || 0, null) + }; + }, + token: function(stream, state) { + if (!state.tokenize && stream.eatSpace()) + return null; + var style = (state.tokenize || tokenBase)(stream, state); + if (style && typeof style == "object") { + type = style[1]; + style = style[0]; + } + override = style; + if (type != "comment") + state.state = states[state.state](type, stream, state); + return override; + }, + indent: function(state, textAfter) { + var cx = state.context, ch = textAfter && textAfter.charAt(0); + var indent = cx.indent; + if (cx.type == "prop" && (ch == "}" || ch == ")")) + cx = cx.prev; + if (cx.prev) { + if (ch == "}" && (cx.type == "block" || cx.type == "top" || cx.type == "interpolation" || cx.type == "restricted_atBlock")) { + cx = cx.prev; + indent = cx.indent; + } else if (ch == ")" && (cx.type == "parens" || cx.type == "atBlock_parens") || ch == "{" && (cx.type == "at" || cx.type == "atBlock")) { + indent = Math.max(0, cx.indent - indentUnit); + } + } + return indent; + }, + electricChars: "}", + blockCommentStart: "/*", + blockCommentEnd: "*/", + blockCommentContinue: " * ", + lineComment, + fold: "brace" + }; + }); + function keySet(array) { + var keys = {}; + for (var i = 0; i < array.length; ++i) { + keys[array[i].toLowerCase()] = true; + } + return keys; + } + var documentTypes_ = [ + "domain", + "regexp", + "url", + "url-prefix" + ], documentTypes = keySet(documentTypes_); + var mediaTypes_ = [ + "all", + "aural", + "braille", + "handheld", + "print", + "projection", + "screen", + "tty", + "tv", + "embossed" + ], mediaTypes = keySet(mediaTypes_); + var mediaFeatures_ = [ + "width", + "min-width", + "max-width", + "height", + "min-height", + "max-height", + "device-width", + "min-device-width", + "max-device-width", + "device-height", + "min-device-height", + "max-device-height", + "aspect-ratio", + "min-aspect-ratio", + "max-aspect-ratio", + "device-aspect-ratio", + "min-device-aspect-ratio", + "max-device-aspect-ratio", + "color", + "min-color", + "max-color", + "color-index", + "min-color-index", + "max-color-index", + "monochrome", + "min-monochrome", + "max-monochrome", + "resolution", + "min-resolution", + "max-resolution", + "scan", + "grid", + "orientation", + "device-pixel-ratio", + "min-device-pixel-ratio", + "max-device-pixel-ratio", + "pointer", + "any-pointer", + "hover", + "any-hover", + "prefers-color-scheme", + "dynamic-range", + "video-dynamic-range" + ], mediaFeatures = keySet(mediaFeatures_); + var mediaValueKeywords_ = [ + "landscape", + "portrait", + "none", + "coarse", + "fine", + "on-demand", + "hover", + "interlace", + "progressive", + "dark", + "light", + "standard", + "high" + ], mediaValueKeywords = keySet(mediaValueKeywords_); + var propertyKeywords_ = [ + "align-content", + "align-items", + "align-self", + "alignment-adjust", + "alignment-baseline", + "all", + "anchor-point", + "animation", + "animation-delay", + "animation-direction", + "animation-duration", + "animation-fill-mode", + "animation-iteration-count", + "animation-name", + "animation-play-state", + "animation-timing-function", + "appearance", + "azimuth", + "backdrop-filter", + "backface-visibility", + "background", + "background-attachment", + "background-blend-mode", + "background-clip", + "background-color", + "background-image", + "background-origin", + "background-position", + "background-position-x", + "background-position-y", + "background-repeat", + "background-size", + "baseline-shift", + "binding", + "bleed", + "block-size", + "bookmark-label", + "bookmark-level", + "bookmark-state", + "bookmark-target", + "border", + "border-bottom", + "border-bottom-color", + "border-bottom-left-radius", + "border-bottom-right-radius", + "border-bottom-style", + "border-bottom-width", + "border-collapse", + "border-color", + "border-image", + "border-image-outset", + "border-image-repeat", + "border-image-slice", + "border-image-source", + "border-image-width", + "border-left", + "border-left-color", + "border-left-style", + "border-left-width", + "border-radius", + "border-right", + "border-right-color", + "border-right-style", + "border-right-width", + "border-spacing", + "border-style", + "border-top", + "border-top-color", + "border-top-left-radius", + "border-top-right-radius", + "border-top-style", + "border-top-width", + "border-width", + "bottom", + "box-decoration-break", + "box-shadow", + "box-sizing", + "break-after", + "break-before", + "break-inside", + "caption-side", + "caret-color", + "clear", + "clip", + "color", + "color-profile", + "column-count", + "column-fill", + "column-gap", + "column-rule", + "column-rule-color", + "column-rule-style", + "column-rule-width", + "column-span", + "column-width", + "columns", + "contain", + "content", + "counter-increment", + "counter-reset", + "crop", + "cue", + "cue-after", + "cue-before", + "cursor", + "direction", + "display", + "dominant-baseline", + "drop-initial-after-adjust", + "drop-initial-after-align", + "drop-initial-before-adjust", + "drop-initial-before-align", + "drop-initial-size", + "drop-initial-value", + "elevation", + "empty-cells", + "fit", + "fit-content", + "fit-position", + "flex", + "flex-basis", + "flex-direction", + "flex-flow", + "flex-grow", + "flex-shrink", + "flex-wrap", + "float", + "float-offset", + "flow-from", + "flow-into", + "font", + "font-family", + "font-feature-settings", + "font-kerning", + "font-language-override", + "font-optical-sizing", + "font-size", + "font-size-adjust", + "font-stretch", + "font-style", + "font-synthesis", + "font-variant", + "font-variant-alternates", + "font-variant-caps", + "font-variant-east-asian", + "font-variant-ligatures", + "font-variant-numeric", + "font-variant-position", + "font-variation-settings", + "font-weight", + "gap", + "grid", + "grid-area", + "grid-auto-columns", + "grid-auto-flow", + "grid-auto-rows", + "grid-column", + "grid-column-end", + "grid-column-gap", + "grid-column-start", + "grid-gap", + "grid-row", + "grid-row-end", + "grid-row-gap", + "grid-row-start", + "grid-template", + "grid-template-areas", + "grid-template-columns", + "grid-template-rows", + "hanging-punctuation", + "height", + "hyphens", + "icon", + "image-orientation", + "image-rendering", + "image-resolution", + "inline-box-align", + "inset", + "inset-block", + "inset-block-end", + "inset-block-start", + "inset-inline", + "inset-inline-end", + "inset-inline-start", + "isolation", + "justify-content", + "justify-items", + "justify-self", + "left", + "letter-spacing", + "line-break", + "line-height", + "line-height-step", + "line-stacking", + "line-stacking-ruby", + "line-stacking-shift", + "line-stacking-strategy", + "list-style", + "list-style-image", + "list-style-position", + "list-style-type", + "margin", + "margin-bottom", + "margin-left", + "margin-right", + "margin-top", + "marks", + "marquee-direction", + "marquee-loop", + "marquee-play-count", + "marquee-speed", + "marquee-style", + "mask-clip", + "mask-composite", + "mask-image", + "mask-mode", + "mask-origin", + "mask-position", + "mask-repeat", + "mask-size", + "mask-type", + "max-block-size", + "max-height", + "max-inline-size", + "max-width", + "min-block-size", + "min-height", + "min-inline-size", + "min-width", + "mix-blend-mode", + "move-to", + "nav-down", + "nav-index", + "nav-left", + "nav-right", + "nav-up", + "object-fit", + "object-position", + "offset", + "offset-anchor", + "offset-distance", + "offset-path", + "offset-position", + "offset-rotate", + "opacity", + "order", + "orphans", + "outline", + "outline-color", + "outline-offset", + "outline-style", + "outline-width", + "overflow", + "overflow-style", + "overflow-wrap", + "overflow-x", + "overflow-y", + "padding", + "padding-bottom", + "padding-left", + "padding-right", + "padding-top", + "page", + "page-break-after", + "page-break-before", + "page-break-inside", + "page-policy", + "pause", + "pause-after", + "pause-before", + "perspective", + "perspective-origin", + "pitch", + "pitch-range", + "place-content", + "place-items", + "place-self", + "play-during", + "position", + "presentation-level", + "punctuation-trim", + "quotes", + "region-break-after", + "region-break-before", + "region-break-inside", + "region-fragment", + "rendering-intent", + "resize", + "rest", + "rest-after", + "rest-before", + "richness", + "right", + "rotate", + "rotation", + "rotation-point", + "row-gap", + "ruby-align", + "ruby-overhang", + "ruby-position", + "ruby-span", + "scale", + "scroll-behavior", + "scroll-margin", + "scroll-margin-block", + "scroll-margin-block-end", + "scroll-margin-block-start", + "scroll-margin-bottom", + "scroll-margin-inline", + "scroll-margin-inline-end", + "scroll-margin-inline-start", + "scroll-margin-left", + "scroll-margin-right", + "scroll-margin-top", + "scroll-padding", + "scroll-padding-block", + "scroll-padding-block-end", + "scroll-padding-block-start", + "scroll-padding-bottom", + "scroll-padding-inline", + "scroll-padding-inline-end", + "scroll-padding-inline-start", + "scroll-padding-left", + "scroll-padding-right", + "scroll-padding-top", + "scroll-snap-align", + "scroll-snap-type", + "shape-image-threshold", + "shape-inside", + "shape-margin", + "shape-outside", + "size", + "speak", + "speak-as", + "speak-header", + "speak-numeral", + "speak-punctuation", + "speech-rate", + "stress", + "string-set", + "tab-size", + "table-layout", + "target", + "target-name", + "target-new", + "target-position", + "text-align", + "text-align-last", + "text-combine-upright", + "text-decoration", + "text-decoration-color", + "text-decoration-line", + "text-decoration-skip", + "text-decoration-skip-ink", + "text-decoration-style", + "text-emphasis", + "text-emphasis-color", + "text-emphasis-position", + "text-emphasis-style", + "text-height", + "text-indent", + "text-justify", + "text-orientation", + "text-outline", + "text-overflow", + "text-rendering", + "text-shadow", + "text-size-adjust", + "text-space-collapse", + "text-transform", + "text-underline-position", + "text-wrap", + "top", + "touch-action", + "transform", + "transform-origin", + "transform-style", + "transition", + "transition-delay", + "transition-duration", + "transition-property", + "transition-timing-function", + "translate", + "unicode-bidi", + "user-select", + "vertical-align", + "visibility", + "voice-balance", + "voice-duration", + "voice-family", + "voice-pitch", + "voice-range", + "voice-rate", + "voice-stress", + "voice-volume", + "volume", + "white-space", + "widows", + "width", + "will-change", + "word-break", + "word-spacing", + "word-wrap", + "writing-mode", + "z-index", + "clip-path", + "clip-rule", + "mask", + "enable-background", + "filter", + "flood-color", + "flood-opacity", + "lighting-color", + "stop-color", + "stop-opacity", + "pointer-events", + "color-interpolation", + "color-interpolation-filters", + "color-rendering", + "fill", + "fill-opacity", + "fill-rule", + "image-rendering", + "marker", + "marker-end", + "marker-mid", + "marker-start", + "paint-order", + "shape-rendering", + "stroke", + "stroke-dasharray", + "stroke-dashoffset", + "stroke-linecap", + "stroke-linejoin", + "stroke-miterlimit", + "stroke-opacity", + "stroke-width", + "text-rendering", + "baseline-shift", + "dominant-baseline", + "glyph-orientation-horizontal", + "glyph-orientation-vertical", + "text-anchor", + "writing-mode" + ], propertyKeywords = keySet(propertyKeywords_); + var nonStandardPropertyKeywords_ = [ + "accent-color", + "aspect-ratio", + "border-block", + "border-block-color", + "border-block-end", + "border-block-end-color", + "border-block-end-style", + "border-block-end-width", + "border-block-start", + "border-block-start-color", + "border-block-start-style", + "border-block-start-width", + "border-block-style", + "border-block-width", + "border-inline", + "border-inline-color", + "border-inline-end", + "border-inline-end-color", + "border-inline-end-style", + "border-inline-end-width", + "border-inline-start", + "border-inline-start-color", + "border-inline-start-style", + "border-inline-start-width", + "border-inline-style", + "border-inline-width", + "content-visibility", + "margin-block", + "margin-block-end", + "margin-block-start", + "margin-inline", + "margin-inline-end", + "margin-inline-start", + "overflow-anchor", + "overscroll-behavior", + "padding-block", + "padding-block-end", + "padding-block-start", + "padding-inline", + "padding-inline-end", + "padding-inline-start", + "scroll-snap-stop", + "scrollbar-3d-light-color", + "scrollbar-arrow-color", + "scrollbar-base-color", + "scrollbar-dark-shadow-color", + "scrollbar-face-color", + "scrollbar-highlight-color", + "scrollbar-shadow-color", + "scrollbar-track-color", + "searchfield-cancel-button", + "searchfield-decoration", + "searchfield-results-button", + "searchfield-results-decoration", + "shape-inside", + "zoom" + ], nonStandardPropertyKeywords = keySet(nonStandardPropertyKeywords_); + var fontProperties_ = [ + "font-display", + "font-family", + "src", + "unicode-range", + "font-variant", + "font-feature-settings", + "font-stretch", + "font-weight", + "font-style" + ], fontProperties = keySet(fontProperties_); + var counterDescriptors_ = [ + "additive-symbols", + "fallback", + "negative", + "pad", + "prefix", + "range", + "speak-as", + "suffix", + "symbols", + "system" + ], counterDescriptors = keySet(counterDescriptors_); + var colorKeywords_ = [ + "aliceblue", + "antiquewhite", + "aqua", + "aquamarine", + "azure", + "beige", + "bisque", + "black", + "blanchedalmond", + "blue", + "blueviolet", + "brown", + "burlywood", + "cadetblue", + "chartreuse", + "chocolate", + "coral", + "cornflowerblue", + "cornsilk", + "crimson", + "cyan", + "darkblue", + "darkcyan", + "darkgoldenrod", + "darkgray", + "darkgreen", + "darkgrey", + "darkkhaki", + "darkmagenta", + "darkolivegreen", + "darkorange", + "darkorchid", + "darkred", + "darksalmon", + "darkseagreen", + "darkslateblue", + "darkslategray", + "darkslategrey", + "darkturquoise", + "darkviolet", + "deeppink", + "deepskyblue", + "dimgray", + "dimgrey", + "dodgerblue", + "firebrick", + "floralwhite", + "forestgreen", + "fuchsia", + "gainsboro", + "ghostwhite", + "gold", + "goldenrod", + "gray", + "grey", + "green", + "greenyellow", + "honeydew", + "hotpink", + "indianred", + "indigo", + "ivory", + "khaki", + "lavender", + "lavenderblush", + "lawngreen", + "lemonchiffon", + "lightblue", + "lightcoral", + "lightcyan", + "lightgoldenrodyellow", + "lightgray", + "lightgreen", + "lightgrey", + "lightpink", + "lightsalmon", + "lightseagreen", + "lightskyblue", + "lightslategray", + "lightslategrey", + "lightsteelblue", + "lightyellow", + "lime", + "limegreen", + "linen", + "magenta", + "maroon", + "mediumaquamarine", + "mediumblue", + "mediumorchid", + "mediumpurple", + "mediumseagreen", + "mediumslateblue", + "mediumspringgreen", + "mediumturquoise", + "mediumvioletred", + "midnightblue", + "mintcream", + "mistyrose", + "moccasin", + "navajowhite", + "navy", + "oldlace", + "olive", + "olivedrab", + "orange", + "orangered", + "orchid", + "palegoldenrod", + "palegreen", + "paleturquoise", + "palevioletred", + "papayawhip", + "peachpuff", + "peru", + "pink", + "plum", + "powderblue", + "purple", + "rebeccapurple", + "red", + "rosybrown", + "royalblue", + "saddlebrown", + "salmon", + "sandybrown", + "seagreen", + "seashell", + "sienna", + "silver", + "skyblue", + "slateblue", + "slategray", + "slategrey", + "snow", + "springgreen", + "steelblue", + "tan", + "teal", + "thistle", + "tomato", + "turquoise", + "violet", + "wheat", + "white", + "whitesmoke", + "yellow", + "yellowgreen" + ], colorKeywords = keySet(colorKeywords_); + var valueKeywords_ = [ + "above", + "absolute", + "activeborder", + "additive", + "activecaption", + "afar", + "after-white-space", + "ahead", + "alias", + "all", + "all-scroll", + "alphabetic", + "alternate", + "always", + "amharic", + "amharic-abegede", + "antialiased", + "appworkspace", + "arabic-indic", + "armenian", + "asterisks", + "attr", + "auto", + "auto-flow", + "avoid", + "avoid-column", + "avoid-page", + "avoid-region", + "axis-pan", + "background", + "backwards", + "baseline", + "below", + "bidi-override", + "binary", + "bengali", + "blink", + "block", + "block-axis", + "blur", + "bold", + "bolder", + "border", + "border-box", + "both", + "bottom", + "break", + "break-all", + "break-word", + "brightness", + "bullets", + "button", + "buttonface", + "buttonhighlight", + "buttonshadow", + "buttontext", + "calc", + "cambodian", + "capitalize", + "caps-lock-indicator", + "caption", + "captiontext", + "caret", + "cell", + "center", + "checkbox", + "circle", + "cjk-decimal", + "cjk-earthly-branch", + "cjk-heavenly-stem", + "cjk-ideographic", + "clear", + "clip", + "close-quote", + "col-resize", + "collapse", + "color", + "color-burn", + "color-dodge", + "column", + "column-reverse", + "compact", + "condensed", + "conic-gradient", + "contain", + "content", + "contents", + "content-box", + "context-menu", + "continuous", + "contrast", + "copy", + "counter", + "counters", + "cover", + "crop", + "cross", + "crosshair", + "cubic-bezier", + "currentcolor", + "cursive", + "cyclic", + "darken", + "dashed", + "decimal", + "decimal-leading-zero", + "default", + "default-button", + "dense", + "destination-atop", + "destination-in", + "destination-out", + "destination-over", + "devanagari", + "difference", + "disc", + "discard", + "disclosure-closed", + "disclosure-open", + "document", + "dot-dash", + "dot-dot-dash", + "dotted", + "double", + "down", + "drop-shadow", + "e-resize", + "ease", + "ease-in", + "ease-in-out", + "ease-out", + "element", + "ellipse", + "ellipsis", + "embed", + "end", + "ethiopic", + "ethiopic-abegede", + "ethiopic-abegede-am-et", + "ethiopic-abegede-gez", + "ethiopic-abegede-ti-er", + "ethiopic-abegede-ti-et", + "ethiopic-halehame-aa-er", + "ethiopic-halehame-aa-et", + "ethiopic-halehame-am-et", + "ethiopic-halehame-gez", + "ethiopic-halehame-om-et", + "ethiopic-halehame-sid-et", + "ethiopic-halehame-so-et", + "ethiopic-halehame-ti-er", + "ethiopic-halehame-ti-et", + "ethiopic-halehame-tig", + "ethiopic-numeric", + "ew-resize", + "exclusion", + "expanded", + "extends", + "extra-condensed", + "extra-expanded", + "fantasy", + "fast", + "fill", + "fill-box", + "fixed", + "flat", + "flex", + "flex-end", + "flex-start", + "footnotes", + "forwards", + "from", + "geometricPrecision", + "georgian", + "grayscale", + "graytext", + "grid", + "groove", + "gujarati", + "gurmukhi", + "hand", + "hangul", + "hangul-consonant", + "hard-light", + "hebrew", + "help", + "hidden", + "hide", + "higher", + "highlight", + "highlighttext", + "hiragana", + "hiragana-iroha", + "horizontal", + "hsl", + "hsla", + "hue", + "hue-rotate", + "icon", + "ignore", + "inactiveborder", + "inactivecaption", + "inactivecaptiontext", + "infinite", + "infobackground", + "infotext", + "inherit", + "initial", + "inline", + "inline-axis", + "inline-block", + "inline-flex", + "inline-grid", + "inline-table", + "inset", + "inside", + "intrinsic", + "invert", + "italic", + "japanese-formal", + "japanese-informal", + "justify", + "kannada", + "katakana", + "katakana-iroha", + "keep-all", + "khmer", + "korean-hangul-formal", + "korean-hanja-formal", + "korean-hanja-informal", + "landscape", + "lao", + "large", + "larger", + "left", + "level", + "lighter", + "lighten", + "line-through", + "linear", + "linear-gradient", + "lines", + "list-item", + "listbox", + "listitem", + "local", + "logical", + "loud", + "lower", + "lower-alpha", + "lower-armenian", + "lower-greek", + "lower-hexadecimal", + "lower-latin", + "lower-norwegian", + "lower-roman", + "lowercase", + "ltr", + "luminosity", + "malayalam", + "manipulation", + "match", + "matrix", + "matrix3d", + "media-play-button", + "media-slider", + "media-sliderthumb", + "media-volume-slider", + "media-volume-sliderthumb", + "medium", + "menu", + "menulist", + "menulist-button", + "menutext", + "message-box", + "middle", + "min-intrinsic", + "mix", + "mongolian", + "monospace", + "move", + "multiple", + "multiple_mask_images", + "multiply", + "myanmar", + "n-resize", + "narrower", + "ne-resize", + "nesw-resize", + "no-close-quote", + "no-drop", + "no-open-quote", + "no-repeat", + "none", + "normal", + "not-allowed", + "nowrap", + "ns-resize", + "numbers", + "numeric", + "nw-resize", + "nwse-resize", + "oblique", + "octal", + "opacity", + "open-quote", + "optimizeLegibility", + "optimizeSpeed", + "oriya", + "oromo", + "outset", + "outside", + "outside-shape", + "overlay", + "overline", + "padding", + "padding-box", + "painted", + "page", + "paused", + "persian", + "perspective", + "pinch-zoom", + "plus-darker", + "plus-lighter", + "pointer", + "polygon", + "portrait", + "pre", + "pre-line", + "pre-wrap", + "preserve-3d", + "progress", + "push-button", + "radial-gradient", + "radio", + "read-only", + "read-write", + "read-write-plaintext-only", + "rectangle", + "region", + "relative", + "repeat", + "repeating-linear-gradient", + "repeating-radial-gradient", + "repeating-conic-gradient", + "repeat-x", + "repeat-y", + "reset", + "reverse", + "rgb", + "rgba", + "ridge", + "right", + "rotate", + "rotate3d", + "rotateX", + "rotateY", + "rotateZ", + "round", + "row", + "row-resize", + "row-reverse", + "rtl", + "run-in", + "running", + "s-resize", + "sans-serif", + "saturate", + "saturation", + "scale", + "scale3d", + "scaleX", + "scaleY", + "scaleZ", + "screen", + "scroll", + "scrollbar", + "scroll-position", + "se-resize", + "searchfield", + "searchfield-cancel-button", + "searchfield-decoration", + "searchfield-results-button", + "searchfield-results-decoration", + "self-start", + "self-end", + "semi-condensed", + "semi-expanded", + "separate", + "sepia", + "serif", + "show", + "sidama", + "simp-chinese-formal", + "simp-chinese-informal", + "single", + "skew", + "skewX", + "skewY", + "skip-white-space", + "slide", + "slider-horizontal", + "slider-vertical", + "sliderthumb-horizontal", + "sliderthumb-vertical", + "slow", + "small", + "small-caps", + "small-caption", + "smaller", + "soft-light", + "solid", + "somali", + "source-atop", + "source-in", + "source-out", + "source-over", + "space", + "space-around", + "space-between", + "space-evenly", + "spell-out", + "square", + "square-button", + "start", + "static", + "status-bar", + "stretch", + "stroke", + "stroke-box", + "sub", + "subpixel-antialiased", + "svg_masks", + "super", + "sw-resize", + "symbolic", + "symbols", + "system-ui", + "table", + "table-caption", + "table-cell", + "table-column", + "table-column-group", + "table-footer-group", + "table-header-group", + "table-row", + "table-row-group", + "tamil", + "telugu", + "text", + "text-bottom", + "text-top", + "textarea", + "textfield", + "thai", + "thick", + "thin", + "threeddarkshadow", + "threedface", + "threedhighlight", + "threedlightshadow", + "threedshadow", + "tibetan", + "tigre", + "tigrinya-er", + "tigrinya-er-abegede", + "tigrinya-et", + "tigrinya-et-abegede", + "to", + "top", + "trad-chinese-formal", + "trad-chinese-informal", + "transform", + "translate", + "translate3d", + "translateX", + "translateY", + "translateZ", + "transparent", + "ultra-condensed", + "ultra-expanded", + "underline", + "unidirectional-pan", + "unset", + "up", + "upper-alpha", + "upper-armenian", + "upper-greek", + "upper-hexadecimal", + "upper-latin", + "upper-norwegian", + "upper-roman", + "uppercase", + "urdu", + "url", + "var", + "vertical", + "vertical-text", + "view-box", + "visible", + "visibleFill", + "visiblePainted", + "visibleStroke", + "visual", + "w-resize", + "wait", + "wave", + "wider", + "window", + "windowframe", + "windowtext", + "words", + "wrap", + "wrap-reverse", + "x-large", + "x-small", + "xor", + "xx-large", + "xx-small" + ], valueKeywords = keySet(valueKeywords_); + var allWords = documentTypes_.concat(mediaTypes_).concat(mediaFeatures_).concat(mediaValueKeywords_).concat(propertyKeywords_).concat(nonStandardPropertyKeywords_).concat(colorKeywords_).concat(valueKeywords_); + CodeMirror2.registerHelper("hintWords", "css", allWords); + function tokenCComment(stream, state) { + var maybeEnd = false, ch; + while ((ch = stream.next()) != null) { + if (maybeEnd && ch == "/") { + state.tokenize = null; + break; + } + maybeEnd = ch == "*"; + } + return ["comment", "comment"]; + } + CodeMirror2.defineMIME("text/css", { + documentTypes, + mediaTypes, + mediaFeatures, + mediaValueKeywords, + propertyKeywords, + nonStandardPropertyKeywords, + fontProperties, + counterDescriptors, + colorKeywords, + valueKeywords, + tokenHooks: { + "/": function(stream, state) { + if (!stream.eat("*")) + return false; + state.tokenize = tokenCComment; + return tokenCComment(stream, state); + } + }, + name: "css" + }); + CodeMirror2.defineMIME("text/x-scss", { + mediaTypes, + mediaFeatures, + mediaValueKeywords, + propertyKeywords, + nonStandardPropertyKeywords, + colorKeywords, + valueKeywords, + fontProperties, + allowNested: true, + lineComment: "//", + tokenHooks: { + "/": function(stream, state) { + if (stream.eat("/")) { + stream.skipToEnd(); + return ["comment", "comment"]; + } else if (stream.eat("*")) { + state.tokenize = tokenCComment; + return tokenCComment(stream, state); + } else { + return ["operator", "operator"]; + } + }, + ":": function(stream) { + if (stream.match(/^\s*\{/, false)) + return [null, null]; + return false; + }, + "$": function(stream) { + stream.match(/^[\w-]+/); + if (stream.match(/^\s*:/, false)) + return ["variable-2", "variable-definition"]; + return ["variable-2", "variable"]; + }, + "#": function(stream) { + if (!stream.eat("{")) + return false; + return [null, "interpolation"]; + } + }, + name: "css", + helperType: "scss" + }); + CodeMirror2.defineMIME("text/x-less", { + mediaTypes, + mediaFeatures, + mediaValueKeywords, + propertyKeywords, + nonStandardPropertyKeywords, + colorKeywords, + valueKeywords, + fontProperties, + allowNested: true, + lineComment: "//", + tokenHooks: { + "/": function(stream, state) { + if (stream.eat("/")) { + stream.skipToEnd(); + return ["comment", "comment"]; + } else if (stream.eat("*")) { + state.tokenize = tokenCComment; + return tokenCComment(stream, state); + } else { + return ["operator", "operator"]; + } + }, + "@": function(stream) { + if (stream.eat("{")) + return [null, "interpolation"]; + if (stream.match(/^(charset|document|font-face|import|(-(moz|ms|o|webkit)-)?keyframes|media|namespace|page|supports)\b/i, false)) + return false; + stream.eatWhile(/[\w\\\-]/); + if (stream.match(/^\s*:/, false)) + return ["variable-2", "variable-definition"]; + return ["variable-2", "variable"]; + }, + "&": function() { + return ["atom", "atom"]; + } + }, + name: "css", + helperType: "less" + }); + CodeMirror2.defineMIME("text/x-gss", { + documentTypes, + mediaTypes, + mediaFeatures, + propertyKeywords, + nonStandardPropertyKeywords, + fontProperties, + counterDescriptors, + colorKeywords, + valueKeywords, + supportsAtComponent: true, + tokenHooks: { + "/": function(stream, state) { + if (!stream.eat("*")) + return false; + state.tokenize = tokenCComment; + return tokenCComment(stream, state); + } + }, + name: "css", + helperType: "gss" + }); + }); + } +}); + +// node_modules/codemirror/mode/xml/xml.js +var require_xml = __commonJS({ + "node_modules/codemirror/mode/xml/xml.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + var htmlConfig = { + autoSelfClosers: { + "area": true, + "base": true, + "br": true, + "col": true, + "command": true, + "embed": true, + "frame": true, + "hr": true, + "img": true, + "input": true, + "keygen": true, + "link": true, + "meta": true, + "param": true, + "source": true, + "track": true, + "wbr": true, + "menuitem": true + }, + implicitlyClosed: { + "dd": true, + "li": true, + "optgroup": true, + "option": true, + "p": true, + "rp": true, + "rt": true, + "tbody": true, + "td": true, + "tfoot": true, + "th": true, + "tr": true + }, + contextGrabbers: { + "dd": { "dd": true, "dt": true }, + "dt": { "dd": true, "dt": true }, + "li": { "li": true }, + "option": { "option": true, "optgroup": true }, + "optgroup": { "optgroup": true }, + "p": { + "address": true, + "article": true, + "aside": true, + "blockquote": true, + "dir": true, + "div": true, + "dl": true, + "fieldset": true, + "footer": true, + "form": true, + "h1": true, + "h2": true, + "h3": true, + "h4": true, + "h5": true, + "h6": true, + "header": true, + "hgroup": true, + "hr": true, + "menu": true, + "nav": true, + "ol": true, + "p": true, + "pre": true, + "section": true, + "table": true, + "ul": true + }, + "rp": { "rp": true, "rt": true }, + "rt": { "rp": true, "rt": true }, + "tbody": { "tbody": true, "tfoot": true }, + "td": { "td": true, "th": true }, + "tfoot": { "tbody": true }, + "th": { "td": true, "th": true }, + "thead": { "tbody": true, "tfoot": true }, + "tr": { "tr": true } + }, + doNotIndent: { "pre": true }, + allowUnquoted: true, + allowMissing: true, + caseFold: true + }; + var xmlConfig = { + autoSelfClosers: {}, + implicitlyClosed: {}, + contextGrabbers: {}, + doNotIndent: {}, + allowUnquoted: false, + allowMissing: false, + allowMissingTagName: false, + caseFold: false + }; + CodeMirror2.defineMode("xml", function(editorConf, config_) { + var indentUnit = editorConf.indentUnit; + var config = {}; + var defaults = config_.htmlMode ? htmlConfig : xmlConfig; + for (var prop in defaults) + config[prop] = defaults[prop]; + for (var prop in config_) + config[prop] = config_[prop]; + var type, setStyle; + function inText(stream, state) { + function chain(parser) { + state.tokenize = parser; + return parser(stream, state); + } + var ch = stream.next(); + if (ch == "<") { + if (stream.eat("!")) { + if (stream.eat("[")) { + if (stream.match("CDATA[")) + return chain(inBlock("atom", "]]>")); + else + return null; + } else if (stream.match("--")) { + return chain(inBlock("comment", "-->")); + } else if (stream.match("DOCTYPE", true, true)) { + stream.eatWhile(/[\w\._\-]/); + return chain(doctype(1)); + } else { + return null; + } + } else if (stream.eat("?")) { + stream.eatWhile(/[\w\._\-]/); + state.tokenize = inBlock("meta", "?>"); + return "meta"; + } else { + type = stream.eat("/") ? "closeTag" : "openTag"; + state.tokenize = inTag; + return "tag bracket"; + } + } else if (ch == "&") { + var ok; + if (stream.eat("#")) { + if (stream.eat("x")) { + ok = stream.eatWhile(/[a-fA-F\d]/) && stream.eat(";"); + } else { + ok = stream.eatWhile(/[\d]/) && stream.eat(";"); + } + } else { + ok = stream.eatWhile(/[\w\.\-:]/) && stream.eat(";"); + } + return ok ? "atom" : "error"; + } else { + stream.eatWhile(/[^&<]/); + return null; + } + } + inText.isInText = true; + function inTag(stream, state) { + var ch = stream.next(); + if (ch == ">" || ch == "/" && stream.eat(">")) { + state.tokenize = inText; + type = ch == ">" ? "endTag" : "selfcloseTag"; + return "tag bracket"; + } else if (ch == "=") { + type = "equals"; + return null; + } else if (ch == "<") { + state.tokenize = inText; + state.state = baseState; + state.tagName = state.tagStart = null; + var next = state.tokenize(stream, state); + return next ? next + " tag error" : "tag error"; + } else if (/[\'\"]/.test(ch)) { + state.tokenize = inAttribute(ch); + state.stringStartCol = stream.column(); + return state.tokenize(stream, state); + } else { + stream.match(/^[^\s\u00a0=<>\"\']*[^\s\u00a0=<>\"\'\/]/); + return "word"; + } + } + function inAttribute(quote) { + var closure = function(stream, state) { + while (!stream.eol()) { + if (stream.next() == quote) { + state.tokenize = inTag; + break; + } + } + return "string"; + }; + closure.isInAttribute = true; + return closure; + } + function inBlock(style, terminator) { + return function(stream, state) { + while (!stream.eol()) { + if (stream.match(terminator)) { + state.tokenize = inText; + break; + } + stream.next(); + } + return style; + }; + } + function doctype(depth) { + return function(stream, state) { + var ch; + while ((ch = stream.next()) != null) { + if (ch == "<") { + state.tokenize = doctype(depth + 1); + return state.tokenize(stream, state); + } else if (ch == ">") { + if (depth == 1) { + state.tokenize = inText; + break; + } else { + state.tokenize = doctype(depth - 1); + return state.tokenize(stream, state); + } + } + } + return "meta"; + }; + } + function lower(tagName) { + return tagName && tagName.toLowerCase(); + } + function Context(state, tagName, startOfLine) { + this.prev = state.context; + this.tagName = tagName || ""; + this.indent = state.indented; + this.startOfLine = startOfLine; + if (config.doNotIndent.hasOwnProperty(tagName) || state.context && state.context.noIndent) + this.noIndent = true; + } + function popContext(state) { + if (state.context) + state.context = state.context.prev; + } + function maybePopContext(state, nextTagName) { + var parentTagName; + while (true) { + if (!state.context) { + return; + } + parentTagName = state.context.tagName; + if (!config.contextGrabbers.hasOwnProperty(lower(parentTagName)) || !config.contextGrabbers[lower(parentTagName)].hasOwnProperty(lower(nextTagName))) { + return; + } + popContext(state); + } + } + function baseState(type2, stream, state) { + if (type2 == "openTag") { + state.tagStart = stream.column(); + return tagNameState; + } else if (type2 == "closeTag") { + return closeTagNameState; + } else { + return baseState; + } + } + function tagNameState(type2, stream, state) { + if (type2 == "word") { + state.tagName = stream.current(); + setStyle = "tag"; + return attrState; + } else if (config.allowMissingTagName && type2 == "endTag") { + setStyle = "tag bracket"; + return attrState(type2, stream, state); + } else { + setStyle = "error"; + return tagNameState; + } + } + function closeTagNameState(type2, stream, state) { + if (type2 == "word") { + var tagName = stream.current(); + if (state.context && state.context.tagName != tagName && config.implicitlyClosed.hasOwnProperty(lower(state.context.tagName))) + popContext(state); + if (state.context && state.context.tagName == tagName || config.matchClosing === false) { + setStyle = "tag"; + return closeState; + } else { + setStyle = "tag error"; + return closeStateErr; + } + } else if (config.allowMissingTagName && type2 == "endTag") { + setStyle = "tag bracket"; + return closeState(type2, stream, state); + } else { + setStyle = "error"; + return closeStateErr; + } + } + function closeState(type2, _stream, state) { + if (type2 != "endTag") { + setStyle = "error"; + return closeState; + } + popContext(state); + return baseState; + } + function closeStateErr(type2, stream, state) { + setStyle = "error"; + return closeState(type2, stream, state); + } + function attrState(type2, _stream, state) { + if (type2 == "word") { + setStyle = "attribute"; + return attrEqState; + } else if (type2 == "endTag" || type2 == "selfcloseTag") { + var tagName = state.tagName, tagStart = state.tagStart; + state.tagName = state.tagStart = null; + if (type2 == "selfcloseTag" || config.autoSelfClosers.hasOwnProperty(lower(tagName))) { + maybePopContext(state, tagName); + } else { + maybePopContext(state, tagName); + state.context = new Context(state, tagName, tagStart == state.indented); + } + return baseState; + } + setStyle = "error"; + return attrState; + } + function attrEqState(type2, stream, state) { + if (type2 == "equals") + return attrValueState; + if (!config.allowMissing) + setStyle = "error"; + return attrState(type2, stream, state); + } + function attrValueState(type2, stream, state) { + if (type2 == "string") + return attrContinuedState; + if (type2 == "word" && config.allowUnquoted) { + setStyle = "string"; + return attrState; + } + setStyle = "error"; + return attrState(type2, stream, state); + } + function attrContinuedState(type2, stream, state) { + if (type2 == "string") + return attrContinuedState; + return attrState(type2, stream, state); + } + return { + startState: function(baseIndent) { + var state = { + tokenize: inText, + state: baseState, + indented: baseIndent || 0, + tagName: null, + tagStart: null, + context: null + }; + if (baseIndent != null) + state.baseIndent = baseIndent; + return state; + }, + token: function(stream, state) { + if (!state.tagName && stream.sol()) + state.indented = stream.indentation(); + if (stream.eatSpace()) + return null; + type = null; + var style = state.tokenize(stream, state); + if ((style || type) && style != "comment") { + setStyle = null; + state.state = state.state(type || style, stream, state); + if (setStyle) + style = setStyle == "error" ? style + " error" : setStyle; + } + return style; + }, + indent: function(state, textAfter, fullLine) { + var context = state.context; + if (state.tokenize.isInAttribute) { + if (state.tagStart == state.indented) + return state.stringStartCol + 1; + else + return state.indented + indentUnit; + } + if (context && context.noIndent) + return CodeMirror2.Pass; + if (state.tokenize != inTag && state.tokenize != inText) + return fullLine ? fullLine.match(/^(\s*)/)[0].length : 0; + if (state.tagName) { + if (config.multilineTagIndentPastTag !== false) + return state.tagStart + state.tagName.length + 2; + else + return state.tagStart + indentUnit * (config.multilineTagIndentFactor || 1); + } + if (config.alignCDATA && /$/, + blockCommentStart: "", + configuration: config.htmlMode ? "html" : "xml", + helperType: config.htmlMode ? "html" : "xml", + skipAttribute: function(state) { + if (state.state == attrValueState) + state.state = attrState; + }, + xmlCurrentTag: function(state) { + return state.tagName ? { name: state.tagName, close: state.type == "closeTag" } : null; + }, + xmlCurrentContext: function(state) { + var context = []; + for (var cx = state.context; cx; cx = cx.prev) + context.push(cx.tagName); + return context.reverse(); + } + }; + }); + CodeMirror2.defineMIME("text/xml", "xml"); + CodeMirror2.defineMIME("application/xml", "xml"); + if (!CodeMirror2.mimeModes.hasOwnProperty("text/html")) + CodeMirror2.defineMIME("text/html", { name: "xml", htmlMode: true }); + }); + } +}); + +// node_modules/codemirror/mode/htmlmixed/htmlmixed.js +var require_htmlmixed = __commonJS({ + "node_modules/codemirror/mode/htmlmixed/htmlmixed.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror(), require_xml(), require_javascript(), require_css()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror", "../xml/xml", "../javascript/javascript", "../css/css"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + var defaultTags = { + script: [ + ["lang", /(javascript|babel)/i, "javascript"], + ["type", /^(?:text|application)\/(?:x-)?(?:java|ecma)script$|^module$|^$/i, "javascript"], + ["type", /./, "text/plain"], + [null, null, "javascript"] + ], + style: [ + ["lang", /^css$/i, "css"], + ["type", /^(text\/)?(x-)?(stylesheet|css)$/i, "css"], + ["type", /./, "text/plain"], + [null, null, "css"] + ] + }; + function maybeBackup(stream, pat, style) { + var cur = stream.current(), close = cur.search(pat); + if (close > -1) { + stream.backUp(cur.length - close); + } else if (cur.match(/<\/?$/)) { + stream.backUp(cur.length); + if (!stream.match(pat, false)) + stream.match(cur); + } + return style; + } + var attrRegexpCache = {}; + function getAttrRegexp(attr) { + var regexp = attrRegexpCache[attr]; + if (regexp) + return regexp; + return attrRegexpCache[attr] = new RegExp("\\s+" + attr + `\\s*=\\s*('|")?([^'"]+)('|")?\\s*`); + } + function getAttrValue(text, attr) { + var match = text.match(getAttrRegexp(attr)); + return match ? /^\s*(.*?)\s*$/.exec(match[2])[1] : ""; + } + function getTagRegexp(tagName, anchored) { + return new RegExp((anchored ? "^" : "") + "", "i"); + } + function addTags(from, to) { + for (var tag in from) { + var dest = to[tag] || (to[tag] = []); + var source = from[tag]; + for (var i = source.length - 1; i >= 0; i--) + dest.unshift(source[i]); + } + } + function findMatchingMode(tagInfo, tagText) { + for (var i = 0; i < tagInfo.length; i++) { + var spec = tagInfo[i]; + if (!spec[0] || spec[1].test(getAttrValue(tagText, spec[0]))) + return spec[2]; + } + } + CodeMirror2.defineMode("htmlmixed", function(config, parserConfig) { + var htmlMode = CodeMirror2.getMode(config, { + name: "xml", + htmlMode: true, + multilineTagIndentFactor: parserConfig.multilineTagIndentFactor, + multilineTagIndentPastTag: parserConfig.multilineTagIndentPastTag, + allowMissingTagName: parserConfig.allowMissingTagName + }); + var tags = {}; + var configTags = parserConfig && parserConfig.tags, configScript = parserConfig && parserConfig.scriptTypes; + addTags(defaultTags, tags); + if (configTags) + addTags(configTags, tags); + if (configScript) + for (var i = configScript.length - 1; i >= 0; i--) + tags.script.unshift(["type", configScript[i].matches, configScript[i].mode]); + function html(stream, state) { + var style = htmlMode.token(stream, state.htmlState), tag = /\btag\b/.test(style), tagName; + if (tag && !/[<>\s\/]/.test(stream.current()) && (tagName = state.htmlState.tagName && state.htmlState.tagName.toLowerCase()) && tags.hasOwnProperty(tagName)) { + state.inTag = tagName + " "; + } else if (state.inTag && tag && />$/.test(stream.current())) { + var inTag = /^([\S]+) (.*)/.exec(state.inTag); + state.inTag = null; + var modeSpec = stream.current() == ">" && findMatchingMode(tags[inTag[1]], inTag[2]); + var mode = CodeMirror2.getMode(config, modeSpec); + var endTagA = getTagRegexp(inTag[1], true), endTag = getTagRegexp(inTag[1], false); + state.token = function(stream2, state2) { + if (stream2.match(endTagA, false)) { + state2.token = html; + state2.localState = state2.localMode = null; + return null; + } + return maybeBackup(stream2, endTag, state2.localMode.token(stream2, state2.localState)); + }; + state.localMode = mode; + state.localState = CodeMirror2.startState(mode, htmlMode.indent(state.htmlState, "", "")); + } else if (state.inTag) { + state.inTag += stream.current(); + if (stream.eol()) + state.inTag += " "; + } + return style; + } + return { + startState: function() { + var state = CodeMirror2.startState(htmlMode); + return { token: html, inTag: null, localMode: null, localState: null, htmlState: state }; + }, + copyState: function(state) { + var local; + if (state.localState) { + local = CodeMirror2.copyState(state.localMode, state.localState); + } + return { + token: state.token, + inTag: state.inTag, + localMode: state.localMode, + localState: local, + htmlState: CodeMirror2.copyState(htmlMode, state.htmlState) + }; + }, + token: function(stream, state) { + return state.token(stream, state); + }, + indent: function(state, textAfter, line) { + if (!state.localMode || /^\s*<\//.test(textAfter)) + return htmlMode.indent(state.htmlState, textAfter, line); + else if (state.localMode.indent) + return state.localMode.indent(state.localState, textAfter, line); + else + return CodeMirror2.Pass; + }, + innerMode: function(state) { + return { state: state.localState || state.htmlState, mode: state.localMode || htmlMode }; + } + }; + }, "xml", "javascript", "css"); + CodeMirror2.defineMIME("text/html", "htmlmixed"); + }); + } +}); + +// node_modules/codemirror/mode/clike/clike.js +var require_clike = __commonJS({ + "node_modules/codemirror/mode/clike/clike.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + function Context(indented, column, type, info, align, prev) { + this.indented = indented; + this.column = column; + this.type = type; + this.info = info; + this.align = align; + this.prev = prev; + } + function pushContext(state, col, type, info) { + var indent = state.indented; + if (state.context && state.context.type == "statement" && type != "statement") + indent = state.context.indented; + return state.context = new Context(indent, col, type, info, null, state.context); + } + function popContext(state) { + var t = state.context.type; + if (t == ")" || t == "]" || t == "}") + state.indented = state.context.indented; + return state.context = state.context.prev; + } + function typeBefore(stream, state, pos) { + if (state.prevToken == "variable" || state.prevToken == "type") + return true; + if (/\S(?:[^- ]>|[*\]])\s*$|\*$/.test(stream.string.slice(0, pos))) + return true; + if (state.typeAtEndOfLine && stream.column() == stream.indentation()) + return true; + } + function isTopScope(context) { + for (; ; ) { + if (!context || context.type == "top") + return true; + if (context.type == "}" && context.prev.info != "namespace") + return false; + context = context.prev; + } + } + CodeMirror2.defineMode("clike", function(config, parserConfig) { + var indentUnit = config.indentUnit, statementIndentUnit = parserConfig.statementIndentUnit || indentUnit, dontAlignCalls = parserConfig.dontAlignCalls, keywords = parserConfig.keywords || {}, types = parserConfig.types || {}, builtin = parserConfig.builtin || {}, blockKeywords = parserConfig.blockKeywords || {}, defKeywords = parserConfig.defKeywords || {}, atoms = parserConfig.atoms || {}, hooks = parserConfig.hooks || {}, multiLineStrings = parserConfig.multiLineStrings, indentStatements = parserConfig.indentStatements !== false, indentSwitch = parserConfig.indentSwitch !== false, namespaceSeparator = parserConfig.namespaceSeparator, isPunctuationChar = parserConfig.isPunctuationChar || /[\[\]{}\(\),;\:\.]/, numberStart = parserConfig.numberStart || /[\d\.]/, number = parserConfig.number || /^(?:0x[a-f\d]+|0b[01]+|(?:\d+\.?\d*|\.\d+)(?:e[-+]?\d+)?)(u|ll?|l|f)?/i, isOperatorChar = parserConfig.isOperatorChar || /[+\-*&%=<>!?|\/]/, isIdentifierChar = parserConfig.isIdentifierChar || /[\w\$_\xa1-\uffff]/, isReservedIdentifier = parserConfig.isReservedIdentifier || false; + var curPunc, isDefKeyword; + function tokenBase(stream, state) { + var ch = stream.next(); + if (hooks[ch]) { + var result = hooks[ch](stream, state); + if (result !== false) + return result; + } + if (ch == '"' || ch == "'") { + state.tokenize = tokenString(ch); + return state.tokenize(stream, state); + } + if (numberStart.test(ch)) { + stream.backUp(1); + if (stream.match(number)) + return "number"; + stream.next(); + } + if (isPunctuationChar.test(ch)) { + curPunc = ch; + return null; + } + if (ch == "/") { + if (stream.eat("*")) { + state.tokenize = tokenComment; + return tokenComment(stream, state); + } + if (stream.eat("/")) { + stream.skipToEnd(); + return "comment"; + } + } + if (isOperatorChar.test(ch)) { + while (!stream.match(/^\/[\/*]/, false) && stream.eat(isOperatorChar)) { + } + return "operator"; + } + stream.eatWhile(isIdentifierChar); + if (namespaceSeparator) + while (stream.match(namespaceSeparator)) + stream.eatWhile(isIdentifierChar); + var cur = stream.current(); + if (contains(keywords, cur)) { + if (contains(blockKeywords, cur)) + curPunc = "newstatement"; + if (contains(defKeywords, cur)) + isDefKeyword = true; + return "keyword"; + } + if (contains(types, cur)) + return "type"; + if (contains(builtin, cur) || isReservedIdentifier && isReservedIdentifier(cur)) { + if (contains(blockKeywords, cur)) + curPunc = "newstatement"; + return "builtin"; + } + if (contains(atoms, cur)) + return "atom"; + return "variable"; + } + function tokenString(quote) { + return function(stream, state) { + var escaped = false, next, end = false; + while ((next = stream.next()) != null) { + if (next == quote && !escaped) { + end = true; + break; + } + escaped = !escaped && next == "\\"; + } + if (end || !(escaped || multiLineStrings)) + state.tokenize = null; + return "string"; + }; + } + function tokenComment(stream, state) { + var maybeEnd = false, ch; + while (ch = stream.next()) { + if (ch == "/" && maybeEnd) { + state.tokenize = null; + break; + } + maybeEnd = ch == "*"; + } + return "comment"; + } + function maybeEOL(stream, state) { + if (parserConfig.typeFirstDefinitions && stream.eol() && isTopScope(state.context)) + state.typeAtEndOfLine = typeBefore(stream, state, stream.pos); + } + return { + startState: function(basecolumn) { + return { + tokenize: null, + context: new Context((basecolumn || 0) - indentUnit, 0, "top", null, false), + indented: 0, + startOfLine: true, + prevToken: null + }; + }, + token: function(stream, state) { + var ctx = state.context; + if (stream.sol()) { + if (ctx.align == null) + ctx.align = false; + state.indented = stream.indentation(); + state.startOfLine = true; + } + if (stream.eatSpace()) { + maybeEOL(stream, state); + return null; + } + curPunc = isDefKeyword = null; + var style = (state.tokenize || tokenBase)(stream, state); + if (style == "comment" || style == "meta") + return style; + if (ctx.align == null) + ctx.align = true; + if (curPunc == ";" || curPunc == ":" || curPunc == "," && stream.match(/^\s*(?:\/\/.*)?$/, false)) + while (state.context.type == "statement") + popContext(state); + else if (curPunc == "{") + pushContext(state, stream.column(), "}"); + else if (curPunc == "[") + pushContext(state, stream.column(), "]"); + else if (curPunc == "(") + pushContext(state, stream.column(), ")"); + else if (curPunc == "}") { + while (ctx.type == "statement") + ctx = popContext(state); + if (ctx.type == "}") + ctx = popContext(state); + while (ctx.type == "statement") + ctx = popContext(state); + } else if (curPunc == ctx.type) + popContext(state); + else if (indentStatements && ((ctx.type == "}" || ctx.type == "top") && curPunc != ";" || ctx.type == "statement" && curPunc == "newstatement")) { + pushContext(state, stream.column(), "statement", stream.current()); + } + if (style == "variable" && (state.prevToken == "def" || parserConfig.typeFirstDefinitions && typeBefore(stream, state, stream.start) && isTopScope(state.context) && stream.match(/^\s*\(/, false))) + style = "def"; + if (hooks.token) { + var result = hooks.token(stream, state, style); + if (result !== void 0) + style = result; + } + if (style == "def" && parserConfig.styleDefs === false) + style = "variable"; + state.startOfLine = false; + state.prevToken = isDefKeyword ? "def" : style || curPunc; + maybeEOL(stream, state); + return style; + }, + indent: function(state, textAfter) { + if (state.tokenize != tokenBase && state.tokenize != null || state.typeAtEndOfLine) + return CodeMirror2.Pass; + var ctx = state.context, firstChar = textAfter && textAfter.charAt(0); + var closing = firstChar == ctx.type; + if (ctx.type == "statement" && firstChar == "}") + ctx = ctx.prev; + if (parserConfig.dontIndentStatements) + while (ctx.type == "statement" && parserConfig.dontIndentStatements.test(ctx.info)) + ctx = ctx.prev; + if (hooks.indent) { + var hook = hooks.indent(state, ctx, textAfter, indentUnit); + if (typeof hook == "number") + return hook; + } + var switchBlock = ctx.prev && ctx.prev.info == "switch"; + if (parserConfig.allmanIndentation && /[{(]/.test(firstChar)) { + while (ctx.type != "top" && ctx.type != "}") + ctx = ctx.prev; + return ctx.indented; + } + if (ctx.type == "statement") + return ctx.indented + (firstChar == "{" ? 0 : statementIndentUnit); + if (ctx.align && (!dontAlignCalls || ctx.type != ")")) + return ctx.column + (closing ? 0 : 1); + if (ctx.type == ")" && !closing) + return ctx.indented + statementIndentUnit; + return ctx.indented + (closing ? 0 : indentUnit) + (!closing && switchBlock && !/^(?:case|default)\b/.test(textAfter) ? indentUnit : 0); + }, + electricInput: indentSwitch ? /^\s*(?:case .*?:|default:|\{\}?|\})$/ : /^\s*[{}]$/, + blockCommentStart: "/*", + blockCommentEnd: "*/", + blockCommentContinue: " * ", + lineComment: "//", + fold: "brace" + }; + }); + function words(str) { + var obj = {}, words2 = str.split(" "); + for (var i = 0; i < words2.length; ++i) + obj[words2[i]] = true; + return obj; + } + function contains(words2, word) { + if (typeof words2 === "function") { + return words2(word); + } else { + return words2.propertyIsEnumerable(word); + } + } + var cKeywords = "auto if break case register continue return default do sizeof static else struct switch extern typedef union for goto while enum const volatile inline restrict asm fortran"; + var cppKeywords = "alignas alignof and and_eq audit axiom bitand bitor catch class compl concept constexpr const_cast decltype delete dynamic_cast explicit export final friend import module mutable namespace new noexcept not not_eq operator or or_eq override private protected public reinterpret_cast requires static_assert static_cast template this thread_local throw try typeid typename using virtual xor xor_eq"; + var objCKeywords = "bycopy byref in inout oneway out self super atomic nonatomic retain copy readwrite readonly strong weak assign typeof nullable nonnull null_resettable _cmd @interface @implementation @end @protocol @encode @property @synthesize @dynamic @class @public @package @private @protected @required @optional @try @catch @finally @import @selector @encode @defs @synchronized @autoreleasepool @compatibility_alias @available"; + var objCBuiltins = "FOUNDATION_EXPORT FOUNDATION_EXTERN NS_INLINE NS_FORMAT_FUNCTION NS_RETURNS_RETAINEDNS_ERROR_ENUM NS_RETURNS_NOT_RETAINED NS_RETURNS_INNER_POINTER NS_DESIGNATED_INITIALIZER NS_ENUM NS_OPTIONS NS_REQUIRES_NIL_TERMINATION NS_ASSUME_NONNULL_BEGIN NS_ASSUME_NONNULL_END NS_SWIFT_NAME NS_REFINED_FOR_SWIFT"; + var basicCTypes = words("int long char short double float unsigned signed void bool"); + var basicObjCTypes = words("SEL instancetype id Class Protocol BOOL"); + function cTypes(identifier) { + return contains(basicCTypes, identifier) || /.+_t$/.test(identifier); + } + function objCTypes(identifier) { + return cTypes(identifier) || contains(basicObjCTypes, identifier); + } + var cBlockKeywords = "case do else for if switch while struct enum union"; + var cDefKeywords = "struct enum union"; + function cppHook(stream, state) { + if (!state.startOfLine) + return false; + for (var ch, next = null; ch = stream.peek(); ) { + if (ch == "\\" && stream.match(/^.$/)) { + next = cppHook; + break; + } else if (ch == "/" && stream.match(/^\/[\/\*]/, false)) { + break; + } + stream.next(); + } + state.tokenize = next; + return "meta"; + } + function pointerHook(_stream, state) { + if (state.prevToken == "type") + return "type"; + return false; + } + function cIsReservedIdentifier(token) { + if (!token || token.length < 2) + return false; + if (token[0] != "_") + return false; + return token[1] == "_" || token[1] !== token[1].toLowerCase(); + } + function cpp14Literal(stream) { + stream.eatWhile(/[\w\.']/); + return "number"; + } + function cpp11StringHook(stream, state) { + stream.backUp(1); + if (stream.match(/^(?:R|u8R|uR|UR|LR)/)) { + var match = stream.match(/^"([^\s\\()]{0,16})\(/); + if (!match) { + return false; + } + state.cpp11RawStringDelim = match[1]; + state.tokenize = tokenRawString; + return tokenRawString(stream, state); + } + if (stream.match(/^(?:u8|u|U|L)/)) { + if (stream.match(/^["']/, false)) { + return "string"; + } + return false; + } + stream.next(); + return false; + } + function cppLooksLikeConstructor(word) { + var lastTwo = /(\w+)::~?(\w+)$/.exec(word); + return lastTwo && lastTwo[1] == lastTwo[2]; + } + function tokenAtString(stream, state) { + var next; + while ((next = stream.next()) != null) { + if (next == '"' && !stream.eat('"')) { + state.tokenize = null; + break; + } + } + return "string"; + } + function tokenRawString(stream, state) { + var delim = state.cpp11RawStringDelim.replace(/[^\w\s]/g, "\\$&"); + var match = stream.match(new RegExp(".*?\\)" + delim + '"')); + if (match) + state.tokenize = null; + else + stream.skipToEnd(); + return "string"; + } + function def(mimes, mode) { + if (typeof mimes == "string") + mimes = [mimes]; + var words2 = []; + function add(obj) { + if (obj) { + for (var prop in obj) + if (obj.hasOwnProperty(prop)) + words2.push(prop); + } + } + add(mode.keywords); + add(mode.types); + add(mode.builtin); + add(mode.atoms); + if (words2.length) { + mode.helperType = mimes[0]; + CodeMirror2.registerHelper("hintWords", mimes[0], words2); + } + for (var i = 0; i < mimes.length; ++i) + CodeMirror2.defineMIME(mimes[i], mode); + } + def(["text/x-csrc", "text/x-c", "text/x-chdr"], { + name: "clike", + keywords: words(cKeywords), + types: cTypes, + blockKeywords: words(cBlockKeywords), + defKeywords: words(cDefKeywords), + typeFirstDefinitions: true, + atoms: words("NULL true false"), + isReservedIdentifier: cIsReservedIdentifier, + hooks: { + "#": cppHook, + "*": pointerHook + }, + modeProps: { fold: ["brace", "include"] } + }); + def(["text/x-c++src", "text/x-c++hdr"], { + name: "clike", + keywords: words(cKeywords + " " + cppKeywords), + types: cTypes, + blockKeywords: words(cBlockKeywords + " class try catch"), + defKeywords: words(cDefKeywords + " class namespace"), + typeFirstDefinitions: true, + atoms: words("true false NULL nullptr"), + dontIndentStatements: /^template$/, + isIdentifierChar: /[\w\$_~\xa1-\uffff]/, + isReservedIdentifier: cIsReservedIdentifier, + hooks: { + "#": cppHook, + "*": pointerHook, + "u": cpp11StringHook, + "U": cpp11StringHook, + "L": cpp11StringHook, + "R": cpp11StringHook, + "0": cpp14Literal, + "1": cpp14Literal, + "2": cpp14Literal, + "3": cpp14Literal, + "4": cpp14Literal, + "5": cpp14Literal, + "6": cpp14Literal, + "7": cpp14Literal, + "8": cpp14Literal, + "9": cpp14Literal, + token: function(stream, state, style) { + if (style == "variable" && stream.peek() == "(" && (state.prevToken == ";" || state.prevToken == null || state.prevToken == "}") && cppLooksLikeConstructor(stream.current())) + return "def"; + } + }, + namespaceSeparator: "::", + modeProps: { fold: ["brace", "include"] } + }); + def("text/x-java", { + name: "clike", + keywords: words("abstract assert break case catch class const continue default do else enum extends final finally for goto if implements import instanceof interface native new package private protected public return static strictfp super switch synchronized this throw throws transient try volatile while @interface"), + types: words("var byte short int long float double boolean char void Boolean Byte Character Double Float Integer Long Number Object Short String StringBuffer StringBuilder Void"), + blockKeywords: words("catch class do else finally for if switch try while"), + defKeywords: words("class interface enum @interface"), + typeFirstDefinitions: true, + atoms: words("true false null"), + number: /^(?:0x[a-f\d_]+|0b[01_]+|(?:[\d_]+\.?\d*|\.\d+)(?:e[-+]?[\d_]+)?)(u|ll?|l|f)?/i, + hooks: { + "@": function(stream) { + if (stream.match("interface", false)) + return false; + stream.eatWhile(/[\w\$_]/); + return "meta"; + }, + '"': function(stream, state) { + if (!stream.match(/""$/)) + return false; + state.tokenize = tokenTripleString; + return state.tokenize(stream, state); + } + }, + modeProps: { fold: ["brace", "import"] } + }); + def("text/x-csharp", { + name: "clike", + keywords: words("abstract as async await base break case catch checked class const continue default delegate do else enum event explicit extern finally fixed for foreach goto if implicit in interface internal is lock namespace new operator out override params private protected public readonly ref return sealed sizeof stackalloc static struct switch this throw try typeof unchecked unsafe using virtual void volatile while add alias ascending descending dynamic from get global group into join let orderby partial remove select set value var yield"), + types: words("Action Boolean Byte Char DateTime DateTimeOffset Decimal Double Func Guid Int16 Int32 Int64 Object SByte Single String Task TimeSpan UInt16 UInt32 UInt64 bool byte char decimal double short int long object sbyte float string ushort uint ulong"), + blockKeywords: words("catch class do else finally for foreach if struct switch try while"), + defKeywords: words("class interface namespace struct var"), + typeFirstDefinitions: true, + atoms: words("true false null"), + hooks: { + "@": function(stream, state) { + if (stream.eat('"')) { + state.tokenize = tokenAtString; + return tokenAtString(stream, state); + } + stream.eatWhile(/[\w\$_]/); + return "meta"; + } + } + }); + function tokenTripleString(stream, state) { + var escaped = false; + while (!stream.eol()) { + if (!escaped && stream.match('"""')) { + state.tokenize = null; + break; + } + escaped = stream.next() == "\\" && !escaped; + } + return "string"; + } + function tokenNestedComment(depth) { + return function(stream, state) { + var ch; + while (ch = stream.next()) { + if (ch == "*" && stream.eat("/")) { + if (depth == 1) { + state.tokenize = null; + break; + } else { + state.tokenize = tokenNestedComment(depth - 1); + return state.tokenize(stream, state); + } + } else if (ch == "/" && stream.eat("*")) { + state.tokenize = tokenNestedComment(depth + 1); + return state.tokenize(stream, state); + } + } + return "comment"; + }; + } + def("text/x-scala", { + name: "clike", + keywords: words("abstract case catch class def do else extends final finally for forSome if implicit import lazy match new null object override package private protected return sealed super this throw trait try type val var while with yield _ assert assume require print println printf readLine readBoolean readByte readShort readChar readInt readLong readFloat readDouble"), + types: words("AnyVal App Application Array BufferedIterator BigDecimal BigInt Char Console Either Enumeration Equiv Error Exception Fractional Function IndexedSeq Int Integral Iterable Iterator List Map Numeric Nil NotNull Option Ordered Ordering PartialFunction PartialOrdering Product Proxy Range Responder Seq Serializable Set Specializable Stream StringBuilder StringContext Symbol Throwable Traversable TraversableOnce Tuple Unit Vector Boolean Byte Character CharSequence Class ClassLoader Cloneable Comparable Compiler Double Exception Float Integer Long Math Number Object Package Pair Process Runtime Runnable SecurityManager Short StackTraceElement StrictMath String StringBuffer System Thread ThreadGroup ThreadLocal Throwable Triple Void"), + multiLineStrings: true, + blockKeywords: words("catch class enum do else finally for forSome if match switch try while"), + defKeywords: words("class enum def object package trait type val var"), + atoms: words("true false null"), + indentStatements: false, + indentSwitch: false, + isOperatorChar: /[+\-*&%=<>!?|\/#:@]/, + hooks: { + "@": function(stream) { + stream.eatWhile(/[\w\$_]/); + return "meta"; + }, + '"': function(stream, state) { + if (!stream.match('""')) + return false; + state.tokenize = tokenTripleString; + return state.tokenize(stream, state); + }, + "'": function(stream) { + stream.eatWhile(/[\w\$_\xa1-\uffff]/); + return "atom"; + }, + "=": function(stream, state) { + var cx = state.context; + if (cx.type == "}" && cx.align && stream.eat(">")) { + state.context = new Context(cx.indented, cx.column, cx.type, cx.info, null, cx.prev); + return "operator"; + } else { + return false; + } + }, + "/": function(stream, state) { + if (!stream.eat("*")) + return false; + state.tokenize = tokenNestedComment(1); + return state.tokenize(stream, state); + } + }, + modeProps: { closeBrackets: { pairs: '()[]{}""', triples: '"' } } + }); + function tokenKotlinString(tripleString) { + return function(stream, state) { + var escaped = false, next, end = false; + while (!stream.eol()) { + if (!tripleString && !escaped && stream.match('"')) { + end = true; + break; + } + if (tripleString && stream.match('"""')) { + end = true; + break; + } + next = stream.next(); + if (!escaped && next == "$" && stream.match("{")) + stream.skipTo("}"); + escaped = !escaped && next == "\\" && !tripleString; + } + if (end || !tripleString) + state.tokenize = null; + return "string"; + }; + } + def("text/x-kotlin", { + name: "clike", + keywords: words("package as typealias class interface this super val operator var fun for is in This throw return annotation break continue object if else while do try when !in !is as? file import where by get set abstract enum open inner override private public internal protected catch finally out final vararg reified dynamic companion constructor init sealed field property receiver param sparam lateinit data inline noinline tailrec external annotation crossinline const operator infix suspend actual expect setparam value"), + types: words("Boolean Byte Character CharSequence Class ClassLoader Cloneable Comparable Compiler Double Exception Float Integer Long Math Number Object Package Pair Process Runtime Runnable SecurityManager Short StackTraceElement StrictMath String StringBuffer System Thread ThreadGroup ThreadLocal Throwable Triple Void Annotation Any BooleanArray ByteArray Char CharArray DeprecationLevel DoubleArray Enum FloatArray Function Int IntArray Lazy LazyThreadSafetyMode LongArray Nothing ShortArray Unit"), + intendSwitch: false, + indentStatements: false, + multiLineStrings: true, + number: /^(?:0x[a-f\d_]+|0b[01_]+|(?:[\d_]+(\.\d+)?|\.\d+)(?:e[-+]?[\d_]+)?)(u|ll?|l|f)?/i, + blockKeywords: words("catch class do else finally for if where try while enum"), + defKeywords: words("class val var object interface fun"), + atoms: words("true false null this"), + hooks: { + "@": function(stream) { + stream.eatWhile(/[\w\$_]/); + return "meta"; + }, + "*": function(_stream, state) { + return state.prevToken == "." ? "variable" : "operator"; + }, + '"': function(stream, state) { + state.tokenize = tokenKotlinString(stream.match('""')); + return state.tokenize(stream, state); + }, + "/": function(stream, state) { + if (!stream.eat("*")) + return false; + state.tokenize = tokenNestedComment(1); + return state.tokenize(stream, state); + }, + indent: function(state, ctx, textAfter, indentUnit) { + var firstChar = textAfter && textAfter.charAt(0); + if ((state.prevToken == "}" || state.prevToken == ")") && textAfter == "") + return state.indented; + if (state.prevToken == "operator" && textAfter != "}" && state.context.type != "}" || state.prevToken == "variable" && firstChar == "." || (state.prevToken == "}" || state.prevToken == ")") && firstChar == ".") + return indentUnit * 2 + ctx.indented; + if (ctx.align && ctx.type == "}") + return ctx.indented + (state.context.type == (textAfter || "").charAt(0) ? 0 : indentUnit); + } + }, + modeProps: { closeBrackets: { triples: '"' } } + }); + def(["x-shader/x-vertex", "x-shader/x-fragment"], { + name: "clike", + keywords: words("sampler1D sampler2D sampler3D samplerCube sampler1DShadow sampler2DShadow const attribute uniform varying break continue discard return for while do if else struct in out inout"), + types: words("float int bool void vec2 vec3 vec4 ivec2 ivec3 ivec4 bvec2 bvec3 bvec4 mat2 mat3 mat4"), + blockKeywords: words("for while do if else struct"), + builtin: words("radians degrees sin cos tan asin acos atan pow exp log exp2 sqrt inversesqrt abs sign floor ceil fract mod min max clamp mix step smoothstep length distance dot cross normalize ftransform faceforward reflect refract matrixCompMult lessThan lessThanEqual greaterThan greaterThanEqual equal notEqual any all not texture1D texture1DProj texture1DLod texture1DProjLod texture2D texture2DProj texture2DLod texture2DProjLod texture3D texture3DProj texture3DLod texture3DProjLod textureCube textureCubeLod shadow1D shadow2D shadow1DProj shadow2DProj shadow1DLod shadow2DLod shadow1DProjLod shadow2DProjLod dFdx dFdy fwidth noise1 noise2 noise3 noise4"), + atoms: words("true false gl_FragColor gl_SecondaryColor gl_Normal gl_Vertex gl_MultiTexCoord0 gl_MultiTexCoord1 gl_MultiTexCoord2 gl_MultiTexCoord3 gl_MultiTexCoord4 gl_MultiTexCoord5 gl_MultiTexCoord6 gl_MultiTexCoord7 gl_FogCoord gl_PointCoord gl_Position gl_PointSize gl_ClipVertex gl_FrontColor gl_BackColor gl_FrontSecondaryColor gl_BackSecondaryColor gl_TexCoord gl_FogFragCoord gl_FragCoord gl_FrontFacing gl_FragData gl_FragDepth gl_ModelViewMatrix gl_ProjectionMatrix gl_ModelViewProjectionMatrix gl_TextureMatrix gl_NormalMatrix gl_ModelViewMatrixInverse gl_ProjectionMatrixInverse gl_ModelViewProjectionMatrixInverse gl_TextureMatrixTranspose gl_ModelViewMatrixInverseTranspose gl_ProjectionMatrixInverseTranspose gl_ModelViewProjectionMatrixInverseTranspose gl_TextureMatrixInverseTranspose gl_NormalScale gl_DepthRange gl_ClipPlane gl_Point gl_FrontMaterial gl_BackMaterial gl_LightSource gl_LightModel gl_FrontLightModelProduct gl_BackLightModelProduct gl_TextureColor gl_EyePlaneS gl_EyePlaneT gl_EyePlaneR gl_EyePlaneQ gl_FogParameters gl_MaxLights gl_MaxClipPlanes gl_MaxTextureUnits gl_MaxTextureCoords gl_MaxVertexAttribs gl_MaxVertexUniformComponents gl_MaxVaryingFloats gl_MaxVertexTextureImageUnits gl_MaxTextureImageUnits gl_MaxFragmentUniformComponents gl_MaxCombineTextureImageUnits gl_MaxDrawBuffers"), + indentSwitch: false, + hooks: { "#": cppHook }, + modeProps: { fold: ["brace", "include"] } + }); + def("text/x-nesc", { + name: "clike", + keywords: words(cKeywords + " as atomic async call command component components configuration event generic implementation includes interface module new norace nx_struct nx_union post provides signal task uses abstract extends"), + types: cTypes, + blockKeywords: words(cBlockKeywords), + atoms: words("null true false"), + hooks: { "#": cppHook }, + modeProps: { fold: ["brace", "include"] } + }); + def("text/x-objectivec", { + name: "clike", + keywords: words(cKeywords + " " + objCKeywords), + types: objCTypes, + builtin: words(objCBuiltins), + blockKeywords: words(cBlockKeywords + " @synthesize @try @catch @finally @autoreleasepool @synchronized"), + defKeywords: words(cDefKeywords + " @interface @implementation @protocol @class"), + dontIndentStatements: /^@.*$/, + typeFirstDefinitions: true, + atoms: words("YES NO NULL Nil nil true false nullptr"), + isReservedIdentifier: cIsReservedIdentifier, + hooks: { + "#": cppHook, + "*": pointerHook + }, + modeProps: { fold: ["brace", "include"] } + }); + def("text/x-objectivec++", { + name: "clike", + keywords: words(cKeywords + " " + objCKeywords + " " + cppKeywords), + types: objCTypes, + builtin: words(objCBuiltins), + blockKeywords: words(cBlockKeywords + " @synthesize @try @catch @finally @autoreleasepool @synchronized class try catch"), + defKeywords: words(cDefKeywords + " @interface @implementation @protocol @class class namespace"), + dontIndentStatements: /^@.*$|^template$/, + typeFirstDefinitions: true, + atoms: words("YES NO NULL Nil nil true false nullptr"), + isReservedIdentifier: cIsReservedIdentifier, + hooks: { + "#": cppHook, + "*": pointerHook, + "u": cpp11StringHook, + "U": cpp11StringHook, + "L": cpp11StringHook, + "R": cpp11StringHook, + "0": cpp14Literal, + "1": cpp14Literal, + "2": cpp14Literal, + "3": cpp14Literal, + "4": cpp14Literal, + "5": cpp14Literal, + "6": cpp14Literal, + "7": cpp14Literal, + "8": cpp14Literal, + "9": cpp14Literal, + token: function(stream, state, style) { + if (style == "variable" && stream.peek() == "(" && (state.prevToken == ";" || state.prevToken == null || state.prevToken == "}") && cppLooksLikeConstructor(stream.current())) + return "def"; + } + }, + namespaceSeparator: "::", + modeProps: { fold: ["brace", "include"] } + }); + def("text/x-squirrel", { + name: "clike", + keywords: words("base break clone continue const default delete enum extends function in class foreach local resume return this throw typeof yield constructor instanceof static"), + types: cTypes, + blockKeywords: words("case catch class else for foreach if switch try while"), + defKeywords: words("function local class"), + typeFirstDefinitions: true, + atoms: words("true false null"), + hooks: { "#": cppHook }, + modeProps: { fold: ["brace", "include"] } + }); + var stringTokenizer = null; + function tokenCeylonString(type) { + return function(stream, state) { + var escaped = false, next, end = false; + while (!stream.eol()) { + if (!escaped && stream.match('"') && (type == "single" || stream.match('""'))) { + end = true; + break; + } + if (!escaped && stream.match("``")) { + stringTokenizer = tokenCeylonString(type); + end = true; + break; + } + next = stream.next(); + escaped = type == "single" && !escaped && next == "\\"; + } + if (end) + state.tokenize = null; + return "string"; + }; + } + def("text/x-ceylon", { + name: "clike", + keywords: words("abstracts alias assembly assert assign break case catch class continue dynamic else exists extends finally for function given if import in interface is let module new nonempty object of out outer package return satisfies super switch then this throw try value void while"), + types: function(word) { + var first = word.charAt(0); + return first === first.toUpperCase() && first !== first.toLowerCase(); + }, + blockKeywords: words("case catch class dynamic else finally for function if interface module new object switch try while"), + defKeywords: words("class dynamic function interface module object package value"), + builtin: words("abstract actual aliased annotation by default deprecated doc final formal late license native optional sealed see serializable shared suppressWarnings tagged throws variable"), + isPunctuationChar: /[\[\]{}\(\),;\:\.`]/, + isOperatorChar: /[+\-*&%=<>!?|^~:\/]/, + numberStart: /[\d#$]/, + number: /^(?:#[\da-fA-F_]+|\$[01_]+|[\d_]+[kMGTPmunpf]?|[\d_]+\.[\d_]+(?:[eE][-+]?\d+|[kMGTPmunpf]|)|)/i, + multiLineStrings: true, + typeFirstDefinitions: true, + atoms: words("true false null larger smaller equal empty finished"), + indentSwitch: false, + styleDefs: false, + hooks: { + "@": function(stream) { + stream.eatWhile(/[\w\$_]/); + return "meta"; + }, + '"': function(stream, state) { + state.tokenize = tokenCeylonString(stream.match('""') ? "triple" : "single"); + return state.tokenize(stream, state); + }, + "`": function(stream, state) { + if (!stringTokenizer || !stream.match("`")) + return false; + state.tokenize = stringTokenizer; + stringTokenizer = null; + return state.tokenize(stream, state); + }, + "'": function(stream) { + stream.eatWhile(/[\w\$_\xa1-\uffff]/); + return "atom"; + }, + token: function(_stream, state, style) { + if ((style == "variable" || style == "type") && state.prevToken == ".") { + return "variable-2"; + } + } + }, + modeProps: { + fold: ["brace", "import"], + closeBrackets: { triples: '"' } + } + }); + }); + } +}); + +// node_modules/codemirror/mode/php/php.js +var require_php = __commonJS({ + "node_modules/codemirror/mode/php/php.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror(), require_htmlmixed(), require_clike()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror", "../htmlmixed/htmlmixed", "../clike/clike"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + function keywords(str) { + var obj = {}, words = str.split(" "); + for (var i = 0; i < words.length; ++i) + obj[words[i]] = true; + return obj; + } + function matchSequence(list, end, escapes) { + if (list.length == 0) + return phpString(end); + return function(stream, state) { + var patterns = list[0]; + for (var i = 0; i < patterns.length; i++) + if (stream.match(patterns[i][0])) { + state.tokenize = matchSequence(list.slice(1), end); + return patterns[i][1]; + } + state.tokenize = phpString(end, escapes); + return "string"; + }; + } + function phpString(closing, escapes) { + return function(stream, state) { + return phpString_(stream, state, closing, escapes); + }; + } + function phpString_(stream, state, closing, escapes) { + if (escapes !== false && stream.match("${", false) || stream.match("{$", false)) { + state.tokenize = null; + return "string"; + } + if (escapes !== false && stream.match(/^\$[a-zA-Z_][a-zA-Z0-9_]*/)) { + if (stream.match("[", false)) { + state.tokenize = matchSequence([ + [["[", null]], + [ + [/\d[\w\.]*/, "number"], + [/\$[a-zA-Z_][a-zA-Z0-9_]*/, "variable-2"], + [/[\w\$]+/, "variable"] + ], + [["]", null]] + ], closing, escapes); + } + if (stream.match(/^->\w/, false)) { + state.tokenize = matchSequence([ + [["->", null]], + [[/[\w]+/, "variable"]] + ], closing, escapes); + } + return "variable-2"; + } + var escaped = false; + while (!stream.eol() && (escaped || escapes === false || !stream.match("{$", false) && !stream.match(/^(\$[a-zA-Z_][a-zA-Z0-9_]*|\$\{)/, false))) { + if (!escaped && stream.match(closing)) { + state.tokenize = null; + state.tokStack.pop(); + state.tokStack.pop(); + break; + } + escaped = stream.next() == "\\" && !escaped; + } + return "string"; + } + var phpKeywords = "abstract and array as break case catch class clone const continue declare default do else elseif enddeclare endfor endforeach endif endswitch endwhile enum extends final for foreach function global goto if implements interface instanceof namespace new or private protected public static switch throw trait try use var while xor die echo empty exit eval include include_once isset list require require_once return print unset __halt_compiler self static parent yield insteadof finally readonly match"; + var phpAtoms = "true false null TRUE FALSE NULL __CLASS__ __DIR__ __FILE__ __LINE__ __METHOD__ __FUNCTION__ __NAMESPACE__ __TRAIT__"; + var phpBuiltin = "func_num_args func_get_arg func_get_args strlen strcmp strncmp strcasecmp strncasecmp each error_reporting define defined trigger_error user_error set_error_handler restore_error_handler get_declared_classes get_loaded_extensions extension_loaded get_extension_funcs debug_backtrace constant bin2hex hex2bin sleep usleep time mktime gmmktime strftime gmstrftime strtotime date gmdate getdate localtime checkdate flush wordwrap htmlspecialchars htmlentities html_entity_decode md5 md5_file crc32 getimagesize image_type_to_mime_type phpinfo phpversion phpcredits strnatcmp strnatcasecmp substr_count strspn strcspn strtok strtoupper strtolower strpos strrpos strrev hebrev hebrevc nl2br basename dirname pathinfo stripslashes stripcslashes strstr stristr strrchr str_shuffle str_word_count strcoll substr substr_replace quotemeta ucfirst ucwords strtr addslashes addcslashes rtrim str_replace str_repeat count_chars chunk_split trim ltrim strip_tags similar_text explode implode setlocale localeconv parse_str str_pad chop strchr sprintf printf vprintf vsprintf sscanf fscanf parse_url urlencode urldecode rawurlencode rawurldecode readlink linkinfo link unlink exec system escapeshellcmd escapeshellarg passthru shell_exec proc_open proc_close rand srand getrandmax mt_rand mt_srand mt_getrandmax base64_decode base64_encode abs ceil floor round is_finite is_nan is_infinite bindec hexdec octdec decbin decoct dechex base_convert number_format fmod ip2long long2ip getenv putenv getopt microtime gettimeofday getrusage uniqid quoted_printable_decode set_time_limit get_cfg_var magic_quotes_runtime set_magic_quotes_runtime get_magic_quotes_gpc get_magic_quotes_runtime import_request_variables error_log serialize unserialize memory_get_usage memory_get_peak_usage var_dump var_export debug_zval_dump print_r highlight_file show_source highlight_string ini_get ini_get_all ini_set ini_alter ini_restore get_include_path set_include_path restore_include_path setcookie header headers_sent connection_aborted connection_status ignore_user_abort parse_ini_file is_uploaded_file move_uploaded_file intval floatval doubleval strval gettype settype is_null is_resource is_bool is_long is_float is_int is_integer is_double is_real is_numeric is_string is_array is_object is_scalar ereg ereg_replace eregi eregi_replace split spliti join sql_regcase dl pclose popen readfile rewind rmdir umask fclose feof fgetc fgets fgetss fread fopen fpassthru ftruncate fstat fseek ftell fflush fwrite fputs mkdir rename copy tempnam tmpfile file file_get_contents file_put_contents stream_select stream_context_create stream_context_set_params stream_context_set_option stream_context_get_options stream_filter_prepend stream_filter_append fgetcsv flock get_meta_tags stream_set_write_buffer set_file_buffer set_socket_blocking stream_set_blocking socket_set_blocking stream_get_meta_data stream_register_wrapper stream_wrapper_register stream_set_timeout socket_set_timeout socket_get_status realpath fnmatch fsockopen pfsockopen pack unpack get_browser crypt opendir closedir chdir getcwd rewinddir readdir dir glob fileatime filectime filegroup fileinode filemtime fileowner fileperms filesize filetype file_exists is_writable is_writeable is_readable is_executable is_file is_dir is_link stat lstat chown touch clearstatcache mail ob_start ob_flush ob_clean ob_end_flush ob_end_clean ob_get_flush ob_get_clean ob_get_length ob_get_level ob_get_status ob_get_contents ob_implicit_flush ob_list_handlers ksort krsort natsort natcasesort asort arsort sort rsort usort uasort uksort shuffle array_walk count end prev next reset current key min max in_array array_search extract compact array_fill range array_multisort array_push array_pop array_shift array_unshift array_splice array_slice array_merge array_merge_recursive array_keys array_values array_count_values array_reverse array_reduce array_pad array_flip array_change_key_case array_rand array_unique array_intersect array_intersect_assoc array_diff array_diff_assoc array_sum array_filter array_map array_chunk array_key_exists array_intersect_key array_combine array_column pos sizeof key_exists assert assert_options version_compare ftok str_rot13 aggregate session_name session_module_name session_save_path session_id session_regenerate_id session_decode session_register session_unregister session_is_registered session_encode session_start session_destroy session_unset session_set_save_handler session_cache_limiter session_cache_expire session_set_cookie_params session_get_cookie_params session_write_close preg_match preg_match_all preg_replace preg_replace_callback preg_split preg_quote preg_grep overload ctype_alnum ctype_alpha ctype_cntrl ctype_digit ctype_lower ctype_graph ctype_print ctype_punct ctype_space ctype_upper ctype_xdigit virtual apache_request_headers apache_note apache_lookup_uri apache_child_terminate apache_setenv apache_response_headers apache_get_version getallheaders mysql_connect mysql_pconnect mysql_close mysql_select_db mysql_create_db mysql_drop_db mysql_query mysql_unbuffered_query mysql_db_query mysql_list_dbs mysql_list_tables mysql_list_fields mysql_list_processes mysql_error mysql_errno mysql_affected_rows mysql_insert_id mysql_result mysql_num_rows mysql_num_fields mysql_fetch_row mysql_fetch_array mysql_fetch_assoc mysql_fetch_object mysql_data_seek mysql_fetch_lengths mysql_fetch_field mysql_field_seek mysql_free_result mysql_field_name mysql_field_table mysql_field_len mysql_field_type mysql_field_flags mysql_escape_string mysql_real_escape_string mysql_stat mysql_thread_id mysql_client_encoding mysql_get_client_info mysql_get_host_info mysql_get_proto_info mysql_get_server_info mysql_info mysql mysql_fieldname mysql_fieldtable mysql_fieldlen mysql_fieldtype mysql_fieldflags mysql_selectdb mysql_createdb mysql_dropdb mysql_freeresult mysql_numfields mysql_numrows mysql_listdbs mysql_listtables mysql_listfields mysql_db_name mysql_dbname mysql_tablename mysql_table_name pg_connect pg_pconnect pg_close pg_connection_status pg_connection_busy pg_connection_reset pg_host pg_dbname pg_port pg_tty pg_options pg_ping pg_query pg_send_query pg_cancel_query pg_fetch_result pg_fetch_row pg_fetch_assoc pg_fetch_array pg_fetch_object pg_fetch_all pg_affected_rows pg_get_result pg_result_seek pg_result_status pg_free_result pg_last_oid pg_num_rows pg_num_fields pg_field_name pg_field_num pg_field_size pg_field_type pg_field_prtlen pg_field_is_null pg_get_notify pg_get_pid pg_result_error pg_last_error pg_last_notice pg_put_line pg_end_copy pg_copy_to pg_copy_from pg_trace pg_untrace pg_lo_create pg_lo_unlink pg_lo_open pg_lo_close pg_lo_read pg_lo_write pg_lo_read_all pg_lo_import pg_lo_export pg_lo_seek pg_lo_tell pg_escape_string pg_escape_bytea pg_unescape_bytea pg_client_encoding pg_set_client_encoding pg_meta_data pg_convert pg_insert pg_update pg_delete pg_select pg_exec pg_getlastoid pg_cmdtuples pg_errormessage pg_numrows pg_numfields pg_fieldname pg_fieldsize pg_fieldtype pg_fieldnum pg_fieldprtlen pg_fieldisnull pg_freeresult pg_result pg_loreadall pg_locreate pg_lounlink pg_loopen pg_loclose pg_loread pg_lowrite pg_loimport pg_loexport http_response_code get_declared_traits getimagesizefromstring socket_import_stream stream_set_chunk_size trait_exists header_register_callback class_uses session_status session_register_shutdown echo print global static exit array empty eval isset unset die include require include_once require_once json_decode json_encode json_last_error json_last_error_msg curl_close curl_copy_handle curl_errno curl_error curl_escape curl_exec curl_file_create curl_getinfo curl_init curl_multi_add_handle curl_multi_close curl_multi_exec curl_multi_getcontent curl_multi_info_read curl_multi_init curl_multi_remove_handle curl_multi_select curl_multi_setopt curl_multi_strerror curl_pause curl_reset curl_setopt_array curl_setopt curl_share_close curl_share_init curl_share_setopt curl_strerror curl_unescape curl_version mysqli_affected_rows mysqli_autocommit mysqli_change_user mysqli_character_set_name mysqli_close mysqli_commit mysqli_connect_errno mysqli_connect_error mysqli_connect mysqli_data_seek mysqli_debug mysqli_dump_debug_info mysqli_errno mysqli_error_list mysqli_error mysqli_fetch_all mysqli_fetch_array mysqli_fetch_assoc mysqli_fetch_field_direct mysqli_fetch_field mysqli_fetch_fields mysqli_fetch_lengths mysqli_fetch_object mysqli_fetch_row mysqli_field_count mysqli_field_seek mysqli_field_tell mysqli_free_result mysqli_get_charset mysqli_get_client_info mysqli_get_client_stats mysqli_get_client_version mysqli_get_connection_stats mysqli_get_host_info mysqli_get_proto_info mysqli_get_server_info mysqli_get_server_version mysqli_info mysqli_init mysqli_insert_id mysqli_kill mysqli_more_results mysqli_multi_query mysqli_next_result mysqli_num_fields mysqli_num_rows mysqli_options mysqli_ping mysqli_prepare mysqli_query mysqli_real_connect mysqli_real_escape_string mysqli_real_query mysqli_reap_async_query mysqli_refresh mysqli_rollback mysqli_select_db mysqli_set_charset mysqli_set_local_infile_default mysqli_set_local_infile_handler mysqli_sqlstate mysqli_ssl_set mysqli_stat mysqli_stmt_init mysqli_store_result mysqli_thread_id mysqli_thread_safe mysqli_use_result mysqli_warning_count"; + CodeMirror2.registerHelper("hintWords", "php", [phpKeywords, phpAtoms, phpBuiltin].join(" ").split(" ")); + CodeMirror2.registerHelper("wordChars", "php", /[\w$]/); + var phpConfig = { + name: "clike", + helperType: "php", + keywords: keywords(phpKeywords), + blockKeywords: keywords("catch do else elseif for foreach if switch try while finally"), + defKeywords: keywords("class enum function interface namespace trait"), + atoms: keywords(phpAtoms), + builtin: keywords(phpBuiltin), + multiLineStrings: true, + hooks: { + "$": function(stream) { + stream.eatWhile(/[\w\$_]/); + return "variable-2"; + }, + "<": function(stream, state) { + var before; + if (before = stream.match(/^<<\s*/)) { + var quoted = stream.eat(/['"]/); + stream.eatWhile(/[\w\.]/); + var delim = stream.current().slice(before[0].length + (quoted ? 2 : 1)); + if (quoted) + stream.eat(quoted); + if (delim) { + (state.tokStack || (state.tokStack = [])).push(delim, 0); + state.tokenize = phpString(delim, quoted != "'"); + return "string"; + } + } + return false; + }, + "#": function(stream) { + while (!stream.eol() && !stream.match("?>", false)) + stream.next(); + return "comment"; + }, + "/": function(stream) { + if (stream.eat("/")) { + while (!stream.eol() && !stream.match("?>", false)) + stream.next(); + return "comment"; + } + return false; + }, + '"': function(_stream, state) { + (state.tokStack || (state.tokStack = [])).push('"', 0); + state.tokenize = phpString('"'); + return "string"; + }, + "{": function(_stream, state) { + if (state.tokStack && state.tokStack.length) + state.tokStack[state.tokStack.length - 1]++; + return false; + }, + "}": function(_stream, state) { + if (state.tokStack && state.tokStack.length > 0 && !--state.tokStack[state.tokStack.length - 1]) { + state.tokenize = phpString(state.tokStack[state.tokStack.length - 2]); + } + return false; + } + } + }; + CodeMirror2.defineMode("php", function(config, parserConfig) { + var htmlMode = CodeMirror2.getMode(config, parserConfig && parserConfig.htmlMode || "text/html"); + var phpMode = CodeMirror2.getMode(config, phpConfig); + function dispatch(stream, state) { + var isPHP = state.curMode == phpMode; + if (stream.sol() && state.pending && state.pending != '"' && state.pending != "'") + state.pending = null; + if (!isPHP) { + if (stream.match(/^<\?\w*/)) { + state.curMode = phpMode; + if (!state.php) + state.php = CodeMirror2.startState(phpMode, htmlMode.indent(state.html, "", "")); + state.curState = state.php; + return "meta"; + } + if (state.pending == '"' || state.pending == "'") { + while (!stream.eol() && stream.next() != state.pending) { + } + var style = "string"; + } else if (state.pending && stream.pos < state.pending.end) { + stream.pos = state.pending.end; + var style = state.pending.style; + } else { + var style = htmlMode.token(stream, state.curState); + } + if (state.pending) + state.pending = null; + var cur = stream.current(), openPHP = cur.search(/<\?/), m; + if (openPHP != -1) { + if (style == "string" && (m = cur.match(/[\'\"]$/)) && !/\?>/.test(cur)) + state.pending = m[0]; + else + state.pending = { end: stream.pos, style }; + stream.backUp(cur.length - openPHP); + } + return style; + } else if (isPHP && state.php.tokenize == null && stream.match("?>")) { + state.curMode = htmlMode; + state.curState = state.html; + if (!state.php.context.prev) + state.php = null; + return "meta"; + } else { + return phpMode.token(stream, state.curState); + } + } + return { + startState: function() { + var html = CodeMirror2.startState(htmlMode); + var php = parserConfig.startOpen ? CodeMirror2.startState(phpMode) : null; + return { + html, + php, + curMode: parserConfig.startOpen ? phpMode : htmlMode, + curState: parserConfig.startOpen ? php : html, + pending: null + }; + }, + copyState: function(state) { + var html = state.html, htmlNew = CodeMirror2.copyState(htmlMode, html), php = state.php, phpNew = php && CodeMirror2.copyState(phpMode, php), cur; + if (state.curMode == htmlMode) + cur = htmlNew; + else + cur = phpNew; + return { + html: htmlNew, + php: phpNew, + curMode: state.curMode, + curState: cur, + pending: state.pending + }; + }, + token: dispatch, + indent: function(state, textAfter, line) { + if (state.curMode != phpMode && /^\s*<\//.test(textAfter) || state.curMode == phpMode && /^\?>/.test(textAfter)) + return htmlMode.indent(state.html, textAfter, line); + return state.curMode.indent(state.curState, textAfter, line); + }, + blockCommentStart: "/*", + blockCommentEnd: "*/", + lineComment: "//", + innerMode: function(state) { + return { state: state.curState, mode: state.curMode }; + } + }; + }, "htmlmixed", "clike"); + CodeMirror2.defineMIME("application/x-httpd-php", "php"); + CodeMirror2.defineMIME("application/x-httpd-php-open", { name: "php", startOpen: true }); + CodeMirror2.defineMIME("text/x-php", phpConfig); + }); + } +}); + +// dep:codemirror_mode_php_php__js +require_php(); + +// dep:codemirror_mode_javascript_javascript__js +require_javascript(); + +// dep:codemirror_mode_css_css__js +require_css(); + +// dep:codemirror_mode_htmlmixed_htmlmixed__js +require_htmlmixed(); + +const ayuMirage = ''; + +// node_modules/codemirror/addon/edit/closebrackets.js +var require_closebrackets = __commonJS({ + "node_modules/codemirror/addon/edit/closebrackets.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + var defaults = { + pairs: `()[]{}''""`, + closeBefore: `)]}'":;>`, + triples: "", + explode: "[]{}" + }; + var Pos = CodeMirror2.Pos; + CodeMirror2.defineOption("autoCloseBrackets", false, function(cm, val, old) { + if (old && old != CodeMirror2.Init) { + cm.removeKeyMap(keyMap); + cm.state.closeBrackets = null; + } + if (val) { + ensureBound(getOption(val, "pairs")); + cm.state.closeBrackets = val; + cm.addKeyMap(keyMap); + } + }); + function getOption(conf, name) { + if (name == "pairs" && typeof conf == "string") + return conf; + if (typeof conf == "object" && conf[name] != null) + return conf[name]; + return defaults[name]; + } + var keyMap = { Backspace: handleBackspace, Enter: handleEnter }; + function ensureBound(chars) { + for (var i = 0; i < chars.length; i++) { + var ch = chars.charAt(i), key = "'" + ch + "'"; + if (!keyMap[key]) + keyMap[key] = handler(ch); + } + } + ensureBound(defaults.pairs + "`"); + function handler(ch) { + return function(cm) { + return handleChar(cm, ch); + }; + } + function getConfig(cm) { + var deflt = cm.state.closeBrackets; + if (!deflt || deflt.override) + return deflt; + var mode = cm.getModeAt(cm.getCursor()); + return mode.closeBrackets || deflt; + } + function handleBackspace(cm) { + var conf = getConfig(cm); + if (!conf || cm.getOption("disableInput")) + return CodeMirror2.Pass; + var pairs = getOption(conf, "pairs"); + var ranges = cm.listSelections(); + for (var i = 0; i < ranges.length; i++) { + if (!ranges[i].empty()) + return CodeMirror2.Pass; + var around = charsAround(cm, ranges[i].head); + if (!around || pairs.indexOf(around) % 2 != 0) + return CodeMirror2.Pass; + } + for (var i = ranges.length - 1; i >= 0; i--) { + var cur = ranges[i].head; + cm.replaceRange("", Pos(cur.line, cur.ch - 1), Pos(cur.line, cur.ch + 1), "+delete"); + } + } + function handleEnter(cm) { + var conf = getConfig(cm); + var explode = conf && getOption(conf, "explode"); + if (!explode || cm.getOption("disableInput")) + return CodeMirror2.Pass; + var ranges = cm.listSelections(); + for (var i = 0; i < ranges.length; i++) { + if (!ranges[i].empty()) + return CodeMirror2.Pass; + var around = charsAround(cm, ranges[i].head); + if (!around || explode.indexOf(around) % 2 != 0) + return CodeMirror2.Pass; + } + cm.operation(function() { + var linesep = cm.lineSeparator() || "\n"; + cm.replaceSelection(linesep + linesep, null); + moveSel(cm, -1); + ranges = cm.listSelections(); + for (var i2 = 0; i2 < ranges.length; i2++) { + var line = ranges[i2].head.line; + cm.indentLine(line, null, true); + cm.indentLine(line + 1, null, true); + } + }); + } + function moveSel(cm, dir) { + var newRanges = [], ranges = cm.listSelections(), primary = 0; + for (var i = 0; i < ranges.length; i++) { + var range = ranges[i]; + if (range.head == cm.getCursor()) + primary = i; + var pos = range.head.ch || dir > 0 ? { line: range.head.line, ch: range.head.ch + dir } : { line: range.head.line - 1 }; + newRanges.push({ anchor: pos, head: pos }); + } + cm.setSelections(newRanges, primary); + } + function contractSelection(sel) { + var inverted = CodeMirror2.cmpPos(sel.anchor, sel.head) > 0; + return { + anchor: new Pos(sel.anchor.line, sel.anchor.ch + (inverted ? -1 : 1)), + head: new Pos(sel.head.line, sel.head.ch + (inverted ? 1 : -1)) + }; + } + function handleChar(cm, ch) { + var conf = getConfig(cm); + if (!conf || cm.getOption("disableInput")) + return CodeMirror2.Pass; + var pairs = getOption(conf, "pairs"); + var pos = pairs.indexOf(ch); + if (pos == -1) + return CodeMirror2.Pass; + var closeBefore = getOption(conf, "closeBefore"); + var triples = getOption(conf, "triples"); + var identical = pairs.charAt(pos + 1) == ch; + var ranges = cm.listSelections(); + var opening = pos % 2 == 0; + var type; + for (var i = 0; i < ranges.length; i++) { + var range = ranges[i], cur = range.head, curType; + var next = cm.getRange(cur, Pos(cur.line, cur.ch + 1)); + if (opening && !range.empty()) { + curType = "surround"; + } else if ((identical || !opening) && next == ch) { + if (identical && stringStartsAfter(cm, cur)) + curType = "both"; + else if (triples.indexOf(ch) >= 0 && cm.getRange(cur, Pos(cur.line, cur.ch + 3)) == ch + ch + ch) + curType = "skipThree"; + else + curType = "skip"; + } else if (identical && cur.ch > 1 && triples.indexOf(ch) >= 0 && cm.getRange(Pos(cur.line, cur.ch - 2), cur) == ch + ch) { + if (cur.ch > 2 && /\bstring/.test(cm.getTokenTypeAt(Pos(cur.line, cur.ch - 2)))) + return CodeMirror2.Pass; + curType = "addFour"; + } else if (identical) { + var prev = cur.ch == 0 ? " " : cm.getRange(Pos(cur.line, cur.ch - 1), cur); + if (!CodeMirror2.isWordChar(next) && prev != ch && !CodeMirror2.isWordChar(prev)) + curType = "both"; + else + return CodeMirror2.Pass; + } else if (opening && (next.length === 0 || /\s/.test(next) || closeBefore.indexOf(next) > -1)) { + curType = "both"; + } else { + return CodeMirror2.Pass; + } + if (!type) + type = curType; + else if (type != curType) + return CodeMirror2.Pass; + } + var left = pos % 2 ? pairs.charAt(pos - 1) : ch; + var right = pos % 2 ? ch : pairs.charAt(pos + 1); + cm.operation(function() { + if (type == "skip") { + moveSel(cm, 1); + } else if (type == "skipThree") { + moveSel(cm, 3); + } else if (type == "surround") { + var sels = cm.getSelections(); + for (var i2 = 0; i2 < sels.length; i2++) + sels[i2] = left + sels[i2] + right; + cm.replaceSelections(sels, "around"); + sels = cm.listSelections().slice(); + for (var i2 = 0; i2 < sels.length; i2++) + sels[i2] = contractSelection(sels[i2]); + cm.setSelections(sels); + } else if (type == "both") { + cm.replaceSelection(left + right, null); + cm.triggerElectric(left + right); + moveSel(cm, -1); + } else if (type == "addFour") { + cm.replaceSelection(left + left + left + left, "before"); + moveSel(cm, 1); + } + }); + } + function charsAround(cm, pos) { + var str = cm.getRange(Pos(pos.line, pos.ch - 1), Pos(pos.line, pos.ch + 1)); + return str.length == 2 ? str : null; + } + function stringStartsAfter(cm, pos) { + var token = cm.getTokenAt(Pos(pos.line, pos.ch + 1)); + return /\bstring/.test(token.type) && token.start == pos.ch && (pos.ch == 0 || !/\bstring/.test(cm.getTokenTypeAt(pos))); + } + }); + } +}); + +// dep:codemirror_addon_edit_closebrackets__js +require_closebrackets(); + +// node_modules/codemirror/addon/fold/xml-fold.js +var require_xml_fold = __commonJS({ + "node_modules/codemirror/addon/fold/xml-fold.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + var Pos = CodeMirror2.Pos; + function cmp(a, b) { + return a.line - b.line || a.ch - b.ch; + } + var nameStartChar = "A-Z_a-z\\u00C0-\\u00D6\\u00D8-\\u00F6\\u00F8-\\u02FF\\u0370-\\u037D\\u037F-\\u1FFF\\u200C-\\u200D\\u2070-\\u218F\\u2C00-\\u2FEF\\u3001-\\uD7FF\\uF900-\\uFDCF\\uFDF0-\\uFFFD"; + var nameChar = nameStartChar + "-:.0-9\\u00B7\\u0300-\\u036F\\u203F-\\u2040"; + var xmlTagStart = new RegExp("<(/?)([" + nameStartChar + "][" + nameChar + "]*)", "g"); + function Iter(cm, line, ch, range) { + this.line = line; + this.ch = ch; + this.cm = cm; + this.text = cm.getLine(line); + this.min = range ? Math.max(range.from, cm.firstLine()) : cm.firstLine(); + this.max = range ? Math.min(range.to - 1, cm.lastLine()) : cm.lastLine(); + } + function tagAt(iter, ch) { + var type = iter.cm.getTokenTypeAt(Pos(iter.line, ch)); + return type && /\btag\b/.test(type); + } + function nextLine(iter) { + if (iter.line >= iter.max) + return; + iter.ch = 0; + iter.text = iter.cm.getLine(++iter.line); + return true; + } + function prevLine(iter) { + if (iter.line <= iter.min) + return; + iter.text = iter.cm.getLine(--iter.line); + iter.ch = iter.text.length; + return true; + } + function toTagEnd(iter) { + for (; ; ) { + var gt = iter.text.indexOf(">", iter.ch); + if (gt == -1) { + if (nextLine(iter)) + continue; + else + return; + } + if (!tagAt(iter, gt + 1)) { + iter.ch = gt + 1; + continue; + } + var lastSlash = iter.text.lastIndexOf("/", gt); + var selfClose = lastSlash > -1 && !/\S/.test(iter.text.slice(lastSlash + 1, gt)); + iter.ch = gt + 1; + return selfClose ? "selfClose" : "regular"; + } + } + function toTagStart(iter) { + for (; ; ) { + var lt = iter.ch ? iter.text.lastIndexOf("<", iter.ch - 1) : -1; + if (lt == -1) { + if (prevLine(iter)) + continue; + else + return; + } + if (!tagAt(iter, lt + 1)) { + iter.ch = lt; + continue; + } + xmlTagStart.lastIndex = lt; + iter.ch = lt; + var match = xmlTagStart.exec(iter.text); + if (match && match.index == lt) + return match; + } + } + function toNextTag(iter) { + for (; ; ) { + xmlTagStart.lastIndex = iter.ch; + var found = xmlTagStart.exec(iter.text); + if (!found) { + if (nextLine(iter)) + continue; + else + return; + } + if (!tagAt(iter, found.index + 1)) { + iter.ch = found.index + 1; + continue; + } + iter.ch = found.index + found[0].length; + return found; + } + } + function toPrevTag(iter) { + for (; ; ) { + var gt = iter.ch ? iter.text.lastIndexOf(">", iter.ch - 1) : -1; + if (gt == -1) { + if (prevLine(iter)) + continue; + else + return; + } + if (!tagAt(iter, gt + 1)) { + iter.ch = gt; + continue; + } + var lastSlash = iter.text.lastIndexOf("/", gt); + var selfClose = lastSlash > -1 && !/\S/.test(iter.text.slice(lastSlash + 1, gt)); + iter.ch = gt + 1; + return selfClose ? "selfClose" : "regular"; + } + } + function findMatchingClose(iter, tag) { + var stack = []; + for (; ; ) { + var next = toNextTag(iter), end, startLine = iter.line, startCh = iter.ch - (next ? next[0].length : 0); + if (!next || !(end = toTagEnd(iter))) + return; + if (end == "selfClose") + continue; + if (next[1]) { + for (var i = stack.length - 1; i >= 0; --i) + if (stack[i] == next[2]) { + stack.length = i; + break; + } + if (i < 0 && (!tag || tag == next[2])) + return { + tag: next[2], + from: Pos(startLine, startCh), + to: Pos(iter.line, iter.ch) + }; + } else { + stack.push(next[2]); + } + } + } + function findMatchingOpen(iter, tag) { + var stack = []; + for (; ; ) { + var prev = toPrevTag(iter); + if (!prev) + return; + if (prev == "selfClose") { + toTagStart(iter); + continue; + } + var endLine = iter.line, endCh = iter.ch; + var start = toTagStart(iter); + if (!start) + return; + if (start[1]) { + stack.push(start[2]); + } else { + for (var i = stack.length - 1; i >= 0; --i) + if (stack[i] == start[2]) { + stack.length = i; + break; + } + if (i < 0 && (!tag || tag == start[2])) + return { + tag: start[2], + from: Pos(iter.line, iter.ch), + to: Pos(endLine, endCh) + }; + } + } + } + CodeMirror2.registerHelper("fold", "xml", function(cm, start) { + var iter = new Iter(cm, start.line, 0); + for (; ; ) { + var openTag = toNextTag(iter); + if (!openTag || iter.line != start.line) + return; + var end = toTagEnd(iter); + if (!end) + return; + if (!openTag[1] && end != "selfClose") { + var startPos = Pos(iter.line, iter.ch); + var endPos = findMatchingClose(iter, openTag[2]); + return endPos && cmp(endPos.from, startPos) > 0 ? { from: startPos, to: endPos.from } : null; + } + } + }); + CodeMirror2.findMatchingTag = function(cm, pos, range) { + var iter = new Iter(cm, pos.line, pos.ch, range); + if (iter.text.indexOf(">") == -1 && iter.text.indexOf("<") == -1) + return; + var end = toTagEnd(iter), to = end && Pos(iter.line, iter.ch); + var start = end && toTagStart(iter); + if (!end || !start || cmp(iter, pos) > 0) + return; + var here = { from: Pos(iter.line, iter.ch), to, tag: start[2] }; + if (end == "selfClose") + return { open: here, close: null, at: "open" }; + if (start[1]) { + return { open: findMatchingOpen(iter, start[2]), close: here, at: "close" }; + } else { + iter = new Iter(cm, to.line, to.ch, range); + return { open: here, close: findMatchingClose(iter, start[2]), at: "open" }; + } + }; + CodeMirror2.findEnclosingTag = function(cm, pos, range, tag) { + var iter = new Iter(cm, pos.line, pos.ch, range); + for (; ; ) { + var open = findMatchingOpen(iter, tag); + if (!open) + break; + var forward = new Iter(cm, pos.line, pos.ch, range); + var close = findMatchingClose(forward, open.tag); + if (close) + return { open, close }; + } + }; + CodeMirror2.scanForClosingTag = function(cm, pos, name, end) { + var iter = new Iter(cm, pos.line, pos.ch, end ? { from: 0, to: end } : null); + return findMatchingClose(iter, name); + }; + }); + } +}); + +// node_modules/codemirror/addon/edit/closetag.js +var require_closetag = __commonJS({ + "node_modules/codemirror/addon/edit/closetag.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror(), require_xml_fold()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror", "../fold/xml-fold"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + CodeMirror2.defineOption("autoCloseTags", false, function(cm, val, old) { + if (old != CodeMirror2.Init && old) + cm.removeKeyMap("autoCloseTags"); + if (!val) + return; + var map = { name: "autoCloseTags" }; + if (typeof val != "object" || val.whenClosing !== false) + map["'/'"] = function(cm2) { + return autoCloseSlash(cm2); + }; + if (typeof val != "object" || val.whenOpening !== false) + map["'>'"] = function(cm2) { + return autoCloseGT(cm2); + }; + cm.addKeyMap(map); + }); + var htmlDontClose = [ + "area", + "base", + "br", + "col", + "command", + "embed", + "hr", + "img", + "input", + "keygen", + "link", + "meta", + "param", + "source", + "track", + "wbr" + ]; + var htmlIndent = [ + "applet", + "blockquote", + "body", + "button", + "div", + "dl", + "fieldset", + "form", + "frameset", + "h1", + "h2", + "h3", + "h4", + "h5", + "h6", + "head", + "html", + "iframe", + "layer", + "legend", + "object", + "ol", + "p", + "select", + "table", + "ul" + ]; + function autoCloseGT(cm) { + if (cm.getOption("disableInput")) + return CodeMirror2.Pass; + var ranges = cm.listSelections(), replacements = []; + var opt = cm.getOption("autoCloseTags"); + for (var i = 0; i < ranges.length; i++) { + if (!ranges[i].empty()) + return CodeMirror2.Pass; + var pos = ranges[i].head, tok = cm.getTokenAt(pos); + var inner = CodeMirror2.innerMode(cm.getMode(), tok.state), state = inner.state; + var tagInfo = inner.mode.xmlCurrentTag && inner.mode.xmlCurrentTag(state); + var tagName = tagInfo && tagInfo.name; + if (!tagName) + return CodeMirror2.Pass; + var html = inner.mode.configuration == "html"; + var dontCloseTags = typeof opt == "object" && opt.dontCloseTags || html && htmlDontClose; + var indentTags = typeof opt == "object" && opt.indentTags || html && htmlIndent; + if (tok.end > pos.ch) + tagName = tagName.slice(0, tagName.length - tok.end + pos.ch); + var lowerTagName = tagName.toLowerCase(); + if (!tagName || tok.type == "string" && (tok.end != pos.ch || !/[\"\']/.test(tok.string.charAt(tok.string.length - 1)) || tok.string.length == 1) || tok.type == "tag" && tagInfo.close || tok.string.indexOf("/") == pos.ch - tok.start - 1 || dontCloseTags && indexOf(dontCloseTags, lowerTagName) > -1 || closingTagExists(cm, inner.mode.xmlCurrentContext && inner.mode.xmlCurrentContext(state) || [], tagName, pos, true)) + return CodeMirror2.Pass; + var emptyTags = typeof opt == "object" && opt.emptyTags; + if (emptyTags && indexOf(emptyTags, tagName) > -1) { + replacements[i] = { text: "/>", newPos: CodeMirror2.Pos(pos.line, pos.ch + 2) }; + continue; + } + var indent = indentTags && indexOf(indentTags, lowerTagName) > -1; + replacements[i] = { + indent, + text: ">" + (indent ? "\n\n" : "") + "", + newPos: indent ? CodeMirror2.Pos(pos.line + 1, 0) : CodeMirror2.Pos(pos.line, pos.ch + 1) + }; + } + var dontIndentOnAutoClose = typeof opt == "object" && opt.dontIndentOnAutoClose; + for (var i = ranges.length - 1; i >= 0; i--) { + var info = replacements[i]; + cm.replaceRange(info.text, ranges[i].head, ranges[i].anchor, "+insert"); + var sel = cm.listSelections().slice(0); + sel[i] = { head: info.newPos, anchor: info.newPos }; + cm.setSelections(sel); + if (!dontIndentOnAutoClose && info.indent) { + cm.indentLine(info.newPos.line, null, true); + cm.indentLine(info.newPos.line + 1, null, true); + } + } + } + function autoCloseCurrent(cm, typingSlash) { + var ranges = cm.listSelections(), replacements = []; + var head = typingSlash ? "/" : "") + replacement += ">"; + replacements[i] = replacement; + } + cm.replaceSelections(replacements); + ranges = cm.listSelections(); + if (!dontIndentOnAutoClose) { + for (var i = 0; i < ranges.length; i++) + if (i == ranges.length - 1 || ranges[i].head.line < ranges[i + 1].head.line) + cm.indentLine(ranges[i].head.line); + } + } + function autoCloseSlash(cm) { + if (cm.getOption("disableInput")) + return CodeMirror2.Pass; + return autoCloseCurrent(cm, true); + } + CodeMirror2.commands.closeTag = function(cm) { + return autoCloseCurrent(cm); + }; + function indexOf(collection, elt) { + if (collection.indexOf) + return collection.indexOf(elt); + for (var i = 0, e = collection.length; i < e; ++i) + if (collection[i] == elt) + return i; + return -1; + } + function closingTagExists(cm, context, tagName, pos, newTag) { + if (!CodeMirror2.scanForClosingTag) + return false; + var end = Math.min(cm.lastLine() + 1, pos.line + 500); + var nextClose = CodeMirror2.scanForClosingTag(cm, pos, null, end); + if (!nextClose || nextClose.tag != tagName) + return false; + var onCx = newTag ? 1 : 0; + for (var i = context.length - 1; i >= 0; i--) { + if (context[i] == tagName) + ++onCx; + else + break; + } + pos = nextClose.to; + for (var i = 1; i < onCx; i++) { + var next = CodeMirror2.scanForClosingTag(cm, pos, null, end); + if (!next || next.tag != tagName) + return false; + pos = next.to; + } + return true; + } + }); + } +}); + +// dep:codemirror_addon_edit_closetag__js +require_closetag(); + +// node_modules/codemirror/addon/comment/comment.js +var require_comment = __commonJS({ + "node_modules/codemirror/addon/comment/comment.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + var noOptions = {}; + var nonWS = /[^\s\u00a0]/; + var Pos = CodeMirror2.Pos, cmp = CodeMirror2.cmpPos; + function firstNonWS(str) { + var found = str.search(nonWS); + return found == -1 ? 0 : found; + } + CodeMirror2.commands.toggleComment = function(cm) { + cm.toggleComment(); + }; + CodeMirror2.defineExtension("toggleComment", function(options) { + if (!options) + options = noOptions; + var cm = this; + var minLine = Infinity, ranges = this.listSelections(), mode = null; + for (var i = ranges.length - 1; i >= 0; i--) { + var from = ranges[i].from(), to = ranges[i].to(); + if (from.line >= minLine) + continue; + if (to.line >= minLine) + to = Pos(minLine, 0); + minLine = from.line; + if (mode == null) { + if (cm.uncomment(from, to, options)) + mode = "un"; + else { + cm.lineComment(from, to, options); + mode = "line"; + } + } else if (mode == "un") { + cm.uncomment(from, to, options); + } else { + cm.lineComment(from, to, options); + } + } + }); + function probablyInsideString(cm, pos, line) { + return /\bstring\b/.test(cm.getTokenTypeAt(Pos(pos.line, 0))) && !/^[\'\"\`]/.test(line); + } + function getMode(cm, pos) { + var mode = cm.getMode(); + return mode.useInnerComments === false || !mode.innerMode ? mode : cm.getModeAt(pos); + } + CodeMirror2.defineExtension("lineComment", function(from, to, options) { + if (!options) + options = noOptions; + var self = this, mode = getMode(self, from); + var firstLine = self.getLine(from.line); + if (firstLine == null || probablyInsideString(self, from, firstLine)) + return; + var commentString = options.lineComment || mode.lineComment; + if (!commentString) { + if (options.blockCommentStart || mode.blockCommentStart) { + options.fullLines = true; + self.blockComment(from, to, options); + } + return; + } + var end = Math.min(to.ch != 0 || to.line == from.line ? to.line + 1 : to.line, self.lastLine() + 1); + var pad = options.padding == null ? " " : options.padding; + var blankLines = options.commentBlankLines || from.line == to.line; + self.operation(function() { + if (options.indent) { + var baseString = null; + for (var i = from.line; i < end; ++i) { + var line = self.getLine(i); + var whitespace = line.search(nonWS) === -1 ? line : line.slice(0, firstNonWS(line)); + if (baseString == null || baseString.length > whitespace.length) { + baseString = whitespace; + } + } + for (var i = from.line; i < end; ++i) { + var line = self.getLine(i), cut = baseString.length; + if (!blankLines && !nonWS.test(line)) + continue; + if (line.slice(0, cut) != baseString) + cut = firstNonWS(line); + self.replaceRange(baseString + commentString + pad, Pos(i, 0), Pos(i, cut)); + } + } else { + for (var i = from.line; i < end; ++i) { + if (blankLines || nonWS.test(self.getLine(i))) + self.replaceRange(commentString + pad, Pos(i, 0)); + } + } + }); + }); + CodeMirror2.defineExtension("blockComment", function(from, to, options) { + if (!options) + options = noOptions; + var self = this, mode = getMode(self, from); + var startString = options.blockCommentStart || mode.blockCommentStart; + var endString = options.blockCommentEnd || mode.blockCommentEnd; + if (!startString || !endString) { + if ((options.lineComment || mode.lineComment) && options.fullLines != false) + self.lineComment(from, to, options); + return; + } + if (/\bcomment\b/.test(self.getTokenTypeAt(Pos(from.line, 0)))) + return; + var end = Math.min(to.line, self.lastLine()); + if (end != from.line && to.ch == 0 && nonWS.test(self.getLine(end))) + --end; + var pad = options.padding == null ? " " : options.padding; + if (from.line > end) + return; + self.operation(function() { + if (options.fullLines != false) { + var lastLineHasText = nonWS.test(self.getLine(end)); + self.replaceRange(pad + endString, Pos(end)); + self.replaceRange(startString + pad, Pos(from.line, 0)); + var lead = options.blockCommentLead || mode.blockCommentLead; + if (lead != null) { + for (var i = from.line + 1; i <= end; ++i) + if (i != end || lastLineHasText) + self.replaceRange(lead + pad, Pos(i, 0)); + } + } else { + var atCursor = cmp(self.getCursor("to"), to) == 0, empty = !self.somethingSelected(); + self.replaceRange(endString, to); + if (atCursor) + self.setSelection(empty ? to : self.getCursor("from"), to); + self.replaceRange(startString, from); + } + }); + }); + CodeMirror2.defineExtension("uncomment", function(from, to, options) { + if (!options) + options = noOptions; + var self = this, mode = getMode(self, from); + var end = Math.min(to.ch != 0 || to.line == from.line ? to.line : to.line - 1, self.lastLine()), start = Math.min(from.line, end); + var lineString = options.lineComment || mode.lineComment, lines = []; + var pad = options.padding == null ? " " : options.padding, didSomething; + lineComment: { + if (!lineString) + break lineComment; + for (var i = start; i <= end; ++i) { + var line = self.getLine(i); + var found = line.indexOf(lineString); + if (found > -1 && !/comment/.test(self.getTokenTypeAt(Pos(i, found + 1)))) + found = -1; + if (found == -1 && nonWS.test(line)) + break lineComment; + if (found > -1 && nonWS.test(line.slice(0, found))) + break lineComment; + lines.push(line); + } + self.operation(function() { + for (var i2 = start; i2 <= end; ++i2) { + var line2 = lines[i2 - start]; + var pos = line2.indexOf(lineString), endPos = pos + lineString.length; + if (pos < 0) + continue; + if (line2.slice(endPos, endPos + pad.length) == pad) + endPos += pad.length; + didSomething = true; + self.replaceRange("", Pos(i2, pos), Pos(i2, endPos)); + } + }); + if (didSomething) + return true; + } + var startString = options.blockCommentStart || mode.blockCommentStart; + var endString = options.blockCommentEnd || mode.blockCommentEnd; + if (!startString || !endString) + return false; + var lead = options.blockCommentLead || mode.blockCommentLead; + var startLine = self.getLine(start), open = startLine.indexOf(startString); + if (open == -1) + return false; + var endLine = end == start ? startLine : self.getLine(end); + var close = endLine.indexOf(endString, end == start ? open + startString.length : 0); + var insideStart = Pos(start, open + 1), insideEnd = Pos(end, close + 1); + if (close == -1 || !/comment/.test(self.getTokenTypeAt(insideStart)) || !/comment/.test(self.getTokenTypeAt(insideEnd)) || self.getRange(insideStart, insideEnd, "\n").indexOf(endString) > -1) + return false; + var lastStart = startLine.lastIndexOf(startString, from.ch); + var firstEnd = lastStart == -1 ? -1 : startLine.slice(0, from.ch).indexOf(endString, lastStart + startString.length); + if (lastStart != -1 && firstEnd != -1 && firstEnd + endString.length != from.ch) + return false; + firstEnd = endLine.indexOf(endString, to.ch); + var almostLastStart = endLine.slice(to.ch).lastIndexOf(startString, firstEnd - to.ch); + lastStart = firstEnd == -1 || almostLastStart == -1 ? -1 : to.ch + almostLastStart; + if (firstEnd != -1 && lastStart != -1 && lastStart != to.ch) + return false; + self.operation(function() { + self.replaceRange("", Pos(end, close - (pad && endLine.slice(close - pad.length, close) == pad ? pad.length : 0)), Pos(end, close + endString.length)); + var openEnd = open + startString.length; + if (pad && startLine.slice(openEnd, openEnd + pad.length) == pad) + openEnd += pad.length; + self.replaceRange("", Pos(start, open), Pos(start, openEnd)); + if (lead) + for (var i2 = start + 1; i2 <= end; ++i2) { + var line2 = self.getLine(i2), found2 = line2.indexOf(lead); + if (found2 == -1 || nonWS.test(line2.slice(0, found2))) + continue; + var foundEnd = found2 + lead.length; + if (pad && line2.slice(foundEnd, foundEnd + pad.length) == pad) + foundEnd += pad.length; + self.replaceRange("", Pos(i2, found2), Pos(i2, foundEnd)); + } + }); + return true; + }); + }); + } +}); + +// dep:codemirror_addon_comment_comment__js +require_comment(); + +// node_modules/codemirror/addon/fold/foldcode.js +var require_foldcode = __commonJS({ + "node_modules/codemirror/addon/fold/foldcode.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + function doFold(cm, pos, options, force) { + if (options && options.call) { + var finder = options; + options = null; + } else { + var finder = getOption(cm, options, "rangeFinder"); + } + if (typeof pos == "number") + pos = CodeMirror2.Pos(pos, 0); + var minSize = getOption(cm, options, "minFoldSize"); + function getRange(allowFolded) { + var range2 = finder(cm, pos); + if (!range2 || range2.to.line - range2.from.line < minSize) + return null; + if (force === "fold") + return range2; + var marks = cm.findMarksAt(range2.from); + for (var i = 0; i < marks.length; ++i) { + if (marks[i].__isFold) { + if (!allowFolded) + return null; + range2.cleared = true; + marks[i].clear(); + } + } + return range2; + } + var range = getRange(true); + if (getOption(cm, options, "scanUp")) + while (!range && pos.line > cm.firstLine()) { + pos = CodeMirror2.Pos(pos.line - 1, 0); + range = getRange(false); + } + if (!range || range.cleared || force === "unfold") + return; + var myWidget = makeWidget(cm, options, range); + CodeMirror2.on(myWidget, "mousedown", function(e) { + myRange.clear(); + CodeMirror2.e_preventDefault(e); + }); + var myRange = cm.markText(range.from, range.to, { + replacedWith: myWidget, + clearOnEnter: getOption(cm, options, "clearOnEnter"), + __isFold: true + }); + myRange.on("clear", function(from, to) { + CodeMirror2.signal(cm, "unfold", cm, from, to); + }); + CodeMirror2.signal(cm, "fold", cm, range.from, range.to); + } + function makeWidget(cm, options, range) { + var widget = getOption(cm, options, "widget"); + if (typeof widget == "function") { + widget = widget(range.from, range.to); + } + if (typeof widget == "string") { + var text = document.createTextNode(widget); + widget = document.createElement("span"); + widget.appendChild(text); + widget.className = "CodeMirror-foldmarker"; + } else if (widget) { + widget = widget.cloneNode(true); + } + return widget; + } + CodeMirror2.newFoldFunction = function(rangeFinder, widget) { + return function(cm, pos) { + doFold(cm, pos, { rangeFinder, widget }); + }; + }; + CodeMirror2.defineExtension("foldCode", function(pos, options, force) { + doFold(this, pos, options, force); + }); + CodeMirror2.defineExtension("isFolded", function(pos) { + var marks = this.findMarksAt(pos); + for (var i = 0; i < marks.length; ++i) + if (marks[i].__isFold) + return true; + }); + CodeMirror2.commands.toggleFold = function(cm) { + cm.foldCode(cm.getCursor()); + }; + CodeMirror2.commands.fold = function(cm) { + cm.foldCode(cm.getCursor(), null, "fold"); + }; + CodeMirror2.commands.unfold = function(cm) { + cm.foldCode(cm.getCursor(), { scanUp: false }, "unfold"); + }; + CodeMirror2.commands.foldAll = function(cm) { + cm.operation(function() { + for (var i = cm.firstLine(), e = cm.lastLine(); i <= e; i++) + cm.foldCode(CodeMirror2.Pos(i, 0), { scanUp: false }, "fold"); + }); + }; + CodeMirror2.commands.unfoldAll = function(cm) { + cm.operation(function() { + for (var i = cm.firstLine(), e = cm.lastLine(); i <= e; i++) + cm.foldCode(CodeMirror2.Pos(i, 0), { scanUp: false }, "unfold"); + }); + }; + CodeMirror2.registerHelper("fold", "combine", function() { + var funcs = Array.prototype.slice.call(arguments, 0); + return function(cm, start) { + for (var i = 0; i < funcs.length; ++i) { + var found = funcs[i](cm, start); + if (found) + return found; + } + }; + }); + CodeMirror2.registerHelper("fold", "auto", function(cm, start) { + var helpers = cm.getHelpers(start, "fold"); + for (var i = 0; i < helpers.length; i++) { + var cur = helpers[i](cm, start); + if (cur) + return cur; + } + }); + var defaultOptions = { + rangeFinder: CodeMirror2.fold.auto, + widget: "\u2194", + minFoldSize: 0, + scanUp: false, + clearOnEnter: true + }; + CodeMirror2.defineOption("foldOptions", null); + function getOption(cm, options, name) { + if (options && options[name] !== void 0) + return options[name]; + var editorOptions = cm.options.foldOptions; + if (editorOptions && editorOptions[name] !== void 0) + return editorOptions[name]; + return defaultOptions[name]; + } + CodeMirror2.defineExtension("foldOption", function(options, name) { + return getOption(this, options, name); + }); + }); + } +}); + +// dep:codemirror_addon_fold_foldcode__js +require_foldcode(); + +// node_modules/codemirror/addon/fold/foldgutter.js +var require_foldgutter = __commonJS({ + "node_modules/codemirror/addon/fold/foldgutter.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror(), require_foldcode()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror", "./foldcode"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + CodeMirror2.defineOption("foldGutter", false, function(cm, val, old) { + if (old && old != CodeMirror2.Init) { + cm.clearGutter(cm.state.foldGutter.options.gutter); + cm.state.foldGutter = null; + cm.off("gutterClick", onGutterClick); + cm.off("changes", onChange); + cm.off("viewportChange", onViewportChange); + cm.off("fold", onFold); + cm.off("unfold", onFold); + cm.off("swapDoc", onChange); + } + if (val) { + cm.state.foldGutter = new State(parseOptions(val)); + updateInViewport(cm); + cm.on("gutterClick", onGutterClick); + cm.on("changes", onChange); + cm.on("viewportChange", onViewportChange); + cm.on("fold", onFold); + cm.on("unfold", onFold); + cm.on("swapDoc", onChange); + } + }); + var Pos = CodeMirror2.Pos; + function State(options) { + this.options = options; + this.from = this.to = 0; + } + function parseOptions(opts) { + if (opts === true) + opts = {}; + if (opts.gutter == null) + opts.gutter = "CodeMirror-foldgutter"; + if (opts.indicatorOpen == null) + opts.indicatorOpen = "CodeMirror-foldgutter-open"; + if (opts.indicatorFolded == null) + opts.indicatorFolded = "CodeMirror-foldgutter-folded"; + return opts; + } + function isFolded(cm, line) { + var marks = cm.findMarks(Pos(line, 0), Pos(line + 1, 0)); + for (var i = 0; i < marks.length; ++i) { + if (marks[i].__isFold) { + var fromPos = marks[i].find(-1); + if (fromPos && fromPos.line === line) + return marks[i]; + } + } + } + function marker(spec) { + if (typeof spec == "string") { + var elt = document.createElement("div"); + elt.className = spec + " CodeMirror-guttermarker-subtle"; + return elt; + } else { + return spec.cloneNode(true); + } + } + function updateFoldInfo(cm, from, to) { + var opts = cm.state.foldGutter.options, cur = from - 1; + var minSize = cm.foldOption(opts, "minFoldSize"); + var func = cm.foldOption(opts, "rangeFinder"); + var clsFolded = typeof opts.indicatorFolded == "string" && classTest(opts.indicatorFolded); + var clsOpen = typeof opts.indicatorOpen == "string" && classTest(opts.indicatorOpen); + cm.eachLine(from, to, function(line) { + ++cur; + var mark = null; + var old = line.gutterMarkers; + if (old) + old = old[opts.gutter]; + if (isFolded(cm, cur)) { + if (clsFolded && old && clsFolded.test(old.className)) + return; + mark = marker(opts.indicatorFolded); + } else { + var pos = Pos(cur, 0); + var range = func && func(cm, pos); + if (range && range.to.line - range.from.line >= minSize) { + if (clsOpen && old && clsOpen.test(old.className)) + return; + mark = marker(opts.indicatorOpen); + } + } + if (!mark && !old) + return; + cm.setGutterMarker(line, opts.gutter, mark); + }); + } + function classTest(cls) { + return new RegExp("(^|\\s)" + cls + "(?:$|\\s)\\s*"); + } + function updateInViewport(cm) { + var vp = cm.getViewport(), state = cm.state.foldGutter; + if (!state) + return; + cm.operation(function() { + updateFoldInfo(cm, vp.from, vp.to); + }); + state.from = vp.from; + state.to = vp.to; + } + function onGutterClick(cm, line, gutter) { + var state = cm.state.foldGutter; + if (!state) + return; + var opts = state.options; + if (gutter != opts.gutter) + return; + var folded = isFolded(cm, line); + if (folded) + folded.clear(); + else + cm.foldCode(Pos(line, 0), opts); + } + function onChange(cm) { + var state = cm.state.foldGutter; + if (!state) + return; + var opts = state.options; + state.from = state.to = 0; + clearTimeout(state.changeUpdate); + state.changeUpdate = setTimeout(function() { + updateInViewport(cm); + }, opts.foldOnChangeTimeSpan || 600); + } + function onViewportChange(cm) { + var state = cm.state.foldGutter; + if (!state) + return; + var opts = state.options; + clearTimeout(state.changeUpdate); + state.changeUpdate = setTimeout(function() { + var vp = cm.getViewport(); + if (state.from == state.to || vp.from - state.to > 20 || state.from - vp.to > 20) { + updateInViewport(cm); + } else { + cm.operation(function() { + if (vp.from < state.from) { + updateFoldInfo(cm, vp.from, state.from); + state.from = vp.from; + } + if (vp.to > state.to) { + updateFoldInfo(cm, state.to, vp.to); + state.to = vp.to; + } + }); + } + }, opts.updateViewportTimeSpan || 400); + } + function onFold(cm, from) { + var state = cm.state.foldGutter; + if (!state) + return; + var line = from.line; + if (line >= state.from && line < state.to) + updateFoldInfo(cm, line, line + 1); + } + }); + } +}); + +// dep:codemirror_addon_fold_foldgutter__js +require_foldgutter(); + +// node_modules/codemirror/addon/fold/brace-fold.js +var require_brace_fold = __commonJS({ + "node_modules/codemirror/addon/fold/brace-fold.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + function bracketFolding(pairs) { + return function(cm, start) { + var line = start.line, lineText = cm.getLine(line); + function findOpening(pair) { + var tokenType; + for (var at = start.ch, pass = 0; ; ) { + var found2 = at <= 0 ? -1 : lineText.lastIndexOf(pair[0], at - 1); + if (found2 == -1) { + if (pass == 1) + break; + pass = 1; + at = lineText.length; + continue; + } + if (pass == 1 && found2 < start.ch) + break; + tokenType = cm.getTokenTypeAt(CodeMirror2.Pos(line, found2 + 1)); + if (!/^(comment|string)/.test(tokenType)) + return { ch: found2 + 1, tokenType, pair }; + at = found2 - 1; + } + } + function findRange(found2) { + var count = 1, lastLine = cm.lastLine(), end, startCh = found2.ch, endCh; + outer: + for (var i2 = line; i2 <= lastLine; ++i2) { + var text = cm.getLine(i2), pos = i2 == line ? startCh : 0; + for (; ; ) { + var nextOpen = text.indexOf(found2.pair[0], pos), nextClose = text.indexOf(found2.pair[1], pos); + if (nextOpen < 0) + nextOpen = text.length; + if (nextClose < 0) + nextClose = text.length; + pos = Math.min(nextOpen, nextClose); + if (pos == text.length) + break; + if (cm.getTokenTypeAt(CodeMirror2.Pos(i2, pos + 1)) == found2.tokenType) { + if (pos == nextOpen) + ++count; + else if (!--count) { + end = i2; + endCh = pos; + break outer; + } + } + ++pos; + } + } + if (end == null || line == end) + return null; + return { + from: CodeMirror2.Pos(line, startCh), + to: CodeMirror2.Pos(end, endCh) + }; + } + var found = []; + for (var i = 0; i < pairs.length; i++) { + var open = findOpening(pairs[i]); + if (open) + found.push(open); + } + found.sort(function(a, b) { + return a.ch - b.ch; + }); + for (var i = 0; i < found.length; i++) { + var range = findRange(found[i]); + if (range) + return range; + } + return null; + }; + } + CodeMirror2.registerHelper("fold", "brace", bracketFolding([["{", "}"], ["[", "]"]])); + CodeMirror2.registerHelper("fold", "brace-paren", bracketFolding([["{", "}"], ["[", "]"], ["(", ")"]])); + CodeMirror2.registerHelper("fold", "import", function(cm, start) { + function hasImport(line) { + if (line < cm.firstLine() || line > cm.lastLine()) + return null; + var start2 = cm.getTokenAt(CodeMirror2.Pos(line, 1)); + if (!/\S/.test(start2.string)) + start2 = cm.getTokenAt(CodeMirror2.Pos(line, start2.end + 1)); + if (start2.type != "keyword" || start2.string != "import") + return null; + for (var i = line, e = Math.min(cm.lastLine(), line + 10); i <= e; ++i) { + var text = cm.getLine(i), semi = text.indexOf(";"); + if (semi != -1) + return { startCh: start2.end, end: CodeMirror2.Pos(i, semi) }; + } + } + var startLine = start.line, has = hasImport(startLine), prev; + if (!has || hasImport(startLine - 1) || (prev = hasImport(startLine - 2)) && prev.end.line == startLine - 1) + return null; + for (var end = has.end; ; ) { + var next = hasImport(end.line + 1); + if (next == null) + break; + end = next.end; + } + return { from: cm.clipPos(CodeMirror2.Pos(startLine, has.startCh + 1)), to: end }; + }); + CodeMirror2.registerHelper("fold", "include", function(cm, start) { + function hasInclude(line) { + if (line < cm.firstLine() || line > cm.lastLine()) + return null; + var start2 = cm.getTokenAt(CodeMirror2.Pos(line, 1)); + if (!/\S/.test(start2.string)) + start2 = cm.getTokenAt(CodeMirror2.Pos(line, start2.end + 1)); + if (start2.type == "meta" && start2.string.slice(0, 8) == "#include") + return start2.start + 8; + } + var startLine = start.line, has = hasInclude(startLine); + if (has == null || hasInclude(startLine - 1) != null) + return null; + for (var end = startLine; ; ) { + var next = hasInclude(end + 1); + if (next == null) + break; + ++end; + } + return { + from: CodeMirror2.Pos(startLine, has + 1), + to: cm.clipPos(CodeMirror2.Pos(end)) + }; + }); + }); + } +}); + +// dep:codemirror_addon_fold_brace-fold__js +require_brace_fold(); + +// node_modules/codemirror/addon/fold/indent-fold.js +var require_indent_fold = __commonJS({ + "node_modules/codemirror/addon/fold/indent-fold.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + function lineIndent(cm, lineNo) { + var text = cm.getLine(lineNo); + var spaceTo = text.search(/\S/); + if (spaceTo == -1 || /\bcomment\b/.test(cm.getTokenTypeAt(CodeMirror2.Pos(lineNo, spaceTo + 1)))) + return -1; + return CodeMirror2.countColumn(text, null, cm.getOption("tabSize")); + } + CodeMirror2.registerHelper("fold", "indent", function(cm, start) { + var myIndent = lineIndent(cm, start.line); + if (myIndent < 0) + return; + var lastLineInFold = null; + for (var i = start.line + 1, end = cm.lastLine(); i <= end; ++i) { + var indent = lineIndent(cm, i); + if (indent == -1) ; else if (indent > myIndent) { + lastLineInFold = i; + } else { + break; + } + } + if (lastLineInFold) + return { + from: CodeMirror2.Pos(start.line, cm.getLine(start.line).length), + to: CodeMirror2.Pos(lastLineInFold, cm.getLine(lastLineInFold).length) + }; + }); + }); + } +}); + +// dep:codemirror_addon_fold_indent-fold__js +require_indent_fold(); + +// node_modules/codemirror/addon/fold/comment-fold.js +var require_comment_fold = __commonJS({ + "node_modules/codemirror/addon/fold/comment-fold.js"(exports, module) { + (function(mod) { + if (typeof exports == "object" && typeof module == "object") + mod(require_codemirror()); + else if (typeof define == "function" && define.amd) + define(["../../lib/codemirror"], mod); + else + mod(CodeMirror); + })(function(CodeMirror2) { + CodeMirror2.registerGlobalHelper("fold", "comment", function(mode) { + return mode.blockCommentStart && mode.blockCommentEnd; + }, function(cm, start) { + var mode = cm.getModeAt(start), startToken = mode.blockCommentStart, endToken = mode.blockCommentEnd; + if (!startToken || !endToken) + return; + var line = start.line, lineText = cm.getLine(line); + var startCh; + for (var at = start.ch, pass = 0; ; ) { + var found = at <= 0 ? -1 : lineText.lastIndexOf(startToken, at - 1); + if (found == -1) { + if (pass == 1) + return; + pass = 1; + at = lineText.length; + continue; + } + if (pass == 1 && found < start.ch) + return; + if (/comment/.test(cm.getTokenTypeAt(CodeMirror2.Pos(line, found + 1))) && (found == 0 || lineText.slice(found - endToken.length, found) == endToken || !/comment/.test(cm.getTokenTypeAt(CodeMirror2.Pos(line, found))))) { + startCh = found + startToken.length; + break; + } + at = found - 1; + } + var depth = 1, lastLine = cm.lastLine(), end, endCh; + outer: + for (var i = line; i <= lastLine; ++i) { + var text = cm.getLine(i), pos = i == line ? startCh : 0; + for (; ; ) { + var nextOpen = text.indexOf(startToken, pos), nextClose = text.indexOf(endToken, pos); + if (nextOpen < 0) + nextOpen = text.length; + if (nextClose < 0) + nextClose = text.length; + pos = Math.min(nextOpen, nextClose); + if (pos == text.length) + break; + if (pos == nextOpen) + ++depth; + else if (!--depth) { + end = i; + endCh = pos; + break outer; + } + ++pos; + } + } + if (end == null || line == end && endCh == startCh) + return; + return { + from: CodeMirror2.Pos(line, startCh), + to: CodeMirror2.Pos(end, endCh) + }; + }); + }); + } +}); + +// dep:codemirror_addon_fold_comment-fold__js +require_comment_fold(); + +const CodeMirror$1 = codemirror_default.__esModule ? codemirror_default.default : codemirror_default; + +const _sfc_main$5 = /* @__PURE__ */ defineComponent({ + __name: "CodeMirror", + props: { + mode: { default: "htmlmixed" }, + value: { default: "" }, + readonly: { type: Boolean, default: false } + }, + emits: ["change"], + setup(__props, { emit }) { + const props = __props; + const el = ref(); + const needAutoResize = inject("autoresize"); + onMounted(() => { + const addonOptions = { + autoCloseBrackets: true, + autoCloseTags: true, + foldGutter: true, + gutters: ["CodeMirror-linenumbers", "CodeMirror-foldgutter"] + }; + const editor = CodeMirror$1(el.value, { + value: "", + mode: props.mode, + readOnly: props.readonly, + tabSize: 2, + lineWrapping: true, + lineNumbers: true, + ...addonOptions + }); + editor.on("change", () => { + emit("change", editor.getValue()); + }); + watchEffect(() => { + const cur = editor.getValue(); + if (props.value !== cur) { + editor.setValue(props.value); + } + }); + watchEffect(() => { + editor.setOption("mode", props.mode); + }); + setTimeout(() => { + editor.refresh(); + }, 50); + if (needAutoResize) { + window.addEventListener("resize", debounce(() => { + editor.refresh(); + })); + } + }); + return (_ctx, _cache) => { + return openBlock(), createElementBlock("div", { + class: "editor", + ref_key: "el", + ref: el + }, null, 512); + }; + } +}); + +const CodeMirror_vue_vue_type_style_index_0_lang = ''; + +const _sfc_main$4 = /* @__PURE__ */ defineComponent({ + __name: "Message", + props: ["err", "warn"], + setup(__props) { + const props = __props; + const dismissed = ref(false); + watch(() => [props.err, props.warn], () => { + dismissed.value = false; + }); + function formatMessage(err) { + if (typeof err === "string") { + return err; + } else { + let msg = err.message; + const loc = err.loc; + if (loc && loc.start) { + msg = `(${loc.start.line}:${loc.start.column}) ` + msg; + } + return msg; + } + } + return (_ctx, _cache) => { + return openBlock(), createBlock(Transition, { name: "fade" }, { + default: withCtx(() => [ + !dismissed.value && (__props.err || __props.warn) ? (openBlock(), createElementBlock("div", { + key: 0, + class: normalizeClass(["msg", __props.err ? "err" : "warn"]) + }, [ + createElementVNode("pre", null, toDisplayString(formatMessage(__props.err || __props.warn)), 1), + createElementVNode("button", { + class: "dismiss", + onClick: _cache[0] || (_cache[0] = ($event) => dismissed.value = true) + }, "\u2715") + ], 2)) : createCommentVNode("", true) + ]), + _: 1 + }); + }; + } +}); + +const Message_vue_vue_type_style_index_0_scoped_92411507_lang = ''; + +const Message = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-92411507"]]); + +const _hoisted_1$3 = { class: "editor-container" }; +const _sfc_main$3 = /* @__PURE__ */ defineComponent({ + __name: "Editor", + setup(__props) { + const store = inject("store"); + const onChange = debounce((code) => { + store.state.activeFile.code = code; + }, 250); + const activeMode = computed(() => { + const { filename } = store.state.activeFile; + return filename.endsWith(".php") ? "php" : filename.endsWith(".vue") || filename.endsWith(".html") ? "htmlmixed" : filename.endsWith(".css") ? "css" : "javascript"; + }); + return (_ctx, _cache) => { + return openBlock(), createElementBlock(Fragment, null, [ + createVNode(FileSelector), + createElementVNode("div", _hoisted_1$3, [ + createVNode(_sfc_main$5, { + onChange: unref(onChange), + value: unref(store).state.activeFile.code, + mode: unref(activeMode) + }, null, 8, ["onChange", "value", "mode"]), + createVNode(Message, { + err: unref(store).state.errors[0] + }, null, 8, ["err"]) + ]) + ], 64); + }; + } +}); + +const Editor_vue_vue_type_style_index_0_scoped_7f689af8_lang = ''; + +const Editor = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-7f689af8"]]); + +const _hoisted_1$2 = ["innerHTML"]; +const _sfc_main$2 = /* @__PURE__ */ defineComponent({ + __name: "Preview", + props: ["output"], + setup(__props) { + const store = inject("store"); + return (_ctx, _cache) => { + return openBlock(), createElementBlock(Fragment, null, [ + createElementVNode("div", { + class: "compiled-data-container", + innerHTML: __props.output || "", + ref: "container" + }, null, 8, _hoisted_1$2), + unref(store).state.errors.length ? (openBlock(), createBlock(Message, { + key: 0, + err: unref(store).state.errors + }, null, 8, ["err"])) : createCommentVNode("", true) + ], 64); + }; + } +}); + +const Preview_vue_vue_type_style_index_0_scoped_66d17936_lang = ''; + +const Preview = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-66d17936"]]); + +const _withScopeId = (n) => (pushScopeId("data-v-aafb6cb4"), n = n(), popScopeId(), n); +const _hoisted_1$1 = { class: "tab-buttons" }; +const _hoisted_2 = ["onClick"]; +const _hoisted_3 = /* @__PURE__ */ _withScopeId(() => /* @__PURE__ */ createElementVNode("span", null, "RUN", -1)); +const _hoisted_4 = [ + _hoisted_3 +]; +const _hoisted_5 = { class: "output-container" }; +const _sfc_main$1 = /* @__PURE__ */ defineComponent({ + __name: "Output", + props: ["output", "run"], + setup(__props) { + const props = __props; + const store = inject("store"); + const modes = computed(() => ["preview"]); + const mode = ref(modes.value.includes(store.initialOutputMode) ? store.initialOutputMode : "preview"); + const compileCode = () => { + console.log("code compiling...", props.output); + if (props.run) { + props.run(); + } + }; + return (_ctx, _cache) => { + return openBlock(), createElementBlock(Fragment, null, [ + createElementVNode("div", _hoisted_1$1, [ + (openBlock(true), createElementBlock(Fragment, null, renderList(unref(modes), (m) => { + return openBlock(), createElementBlock("button", { + class: normalizeClass({ active: mode.value === m }), + onClick: ($event) => mode.value = m + }, [ + createElementVNode("span", null, toDisplayString(m), 1) + ], 10, _hoisted_2); + }), 256)), + createElementVNode("button", { onClick: compileCode }, _hoisted_4) + ]), + createElementVNode("div", _hoisted_5, [ + createVNode(Preview, { output: __props.output }, null, 8, ["output"]), + mode.value !== "preview" ? (openBlock(), createBlock(_sfc_main$5, { + key: 0, + readonly: "", + mode: mode.value === "css" ? "css" : "javascript", + value: unref(store).state.activeFile.compiled[mode.value] + }, null, 8, ["mode", "value"])) : createCommentVNode("", true) + ]) + ], 64); + }; + } +}); + +const Output_vue_vue_type_style_index_0_scoped_aafb6cb4_lang = ''; + +const Output = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-aafb6cb4"]]); + +// node_modules/ts-interface-checker/dist/util.js +var require_util = __commonJS({ + "node_modules/ts-interface-checker/dist/util.js"(exports) { + var __extends = exports && exports.__extends || function() { + var extendStatics = function(d, b) { + extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function(d2, b2) { + d2.__proto__ = b2; + } || function(d2, b2) { + for (var p in b2) + if (b2.hasOwnProperty(p)) + d2[p] = b2[p]; + }; + return extendStatics(d, b); + }; + return function(d, b) { + extendStatics(d, b); + function __() { + this.constructor = d; + } + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; + }(); + Object.defineProperty(exports, "__esModule", { value: true }); + exports.DetailContext = exports.NoopContext = exports.VError = void 0; + var VError = function(_super) { + __extends(VError2, _super); + function VError2(path, message) { + var _this = _super.call(this, message) || this; + _this.path = path; + Object.setPrototypeOf(_this, VError2.prototype); + return _this; + } + return VError2; + }(Error); + exports.VError = VError; + var NoopContext = function() { + function NoopContext2() { + } + NoopContext2.prototype.fail = function(relPath, message, score) { + return false; + }; + NoopContext2.prototype.unionResolver = function() { + return this; + }; + NoopContext2.prototype.createContext = function() { + return this; + }; + NoopContext2.prototype.resolveUnion = function(ur) { + }; + return NoopContext2; + }(); + exports.NoopContext = NoopContext; + var DetailContext = function() { + function DetailContext2() { + this._propNames = [""]; + this._messages = [null]; + this._score = 0; + } + DetailContext2.prototype.fail = function(relPath, message, score) { + this._propNames.push(relPath); + this._messages.push(message); + this._score += score; + return false; + }; + DetailContext2.prototype.unionResolver = function() { + return new DetailUnionResolver(); + }; + DetailContext2.prototype.resolveUnion = function(unionResolver) { + var _a, _b; + var u = unionResolver; + var best = null; + for (var _i = 0, _c = u.contexts; _i < _c.length; _i++) { + var ctx = _c[_i]; + if (!best || ctx._score >= best._score) { + best = ctx; + } + } + if (best && best._score > 0) { + (_a = this._propNames).push.apply(_a, best._propNames); + (_b = this._messages).push.apply(_b, best._messages); + } + }; + DetailContext2.prototype.getError = function(path) { + var msgParts = []; + for (var i = this._propNames.length - 1; i >= 0; i--) { + var p = this._propNames[i]; + path += typeof p === "number" ? "[" + p + "]" : p ? "." + p : ""; + var m = this._messages[i]; + if (m) { + msgParts.push(path + " " + m); + } + } + return new VError(path, msgParts.join("; ")); + }; + DetailContext2.prototype.getErrorDetail = function(path) { + var details = []; + for (var i = this._propNames.length - 1; i >= 0; i--) { + var p = this._propNames[i]; + path += typeof p === "number" ? "[" + p + "]" : p ? "." + p : ""; + var message = this._messages[i]; + if (message) { + details.push({ path, message }); + } + } + var detail = null; + for (var i = details.length - 1; i >= 0; i--) { + if (detail) { + details[i].nested = [detail]; + } + detail = details[i]; + } + return detail; + }; + return DetailContext2; + }(); + exports.DetailContext = DetailContext; + var DetailUnionResolver = function() { + function DetailUnionResolver2() { + this.contexts = []; + } + DetailUnionResolver2.prototype.createContext = function() { + var ctx = new DetailContext(); + this.contexts.push(ctx); + return ctx; + }; + return DetailUnionResolver2; + }(); + } +}); + +// node_modules/ts-interface-checker/dist/types.js +var require_types = __commonJS({ + "node_modules/ts-interface-checker/dist/types.js"(exports) { + var __extends = exports && exports.__extends || function() { + var extendStatics = function(d, b) { + extendStatics = Object.setPrototypeOf || { __proto__: [] } instanceof Array && function(d2, b2) { + d2.__proto__ = b2; + } || function(d2, b2) { + for (var p in b2) + if (b2.hasOwnProperty(p)) + d2[p] = b2[p]; + }; + return extendStatics(d, b); + }; + return function(d, b) { + extendStatics(d, b); + function __() { + this.constructor = d; + } + d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __()); + }; + }(); + Object.defineProperty(exports, "__esModule", { value: true }); + exports.basicTypes = exports.BasicType = exports.TParamList = exports.TParam = exports.param = exports.TFunc = exports.func = exports.TProp = exports.TOptional = exports.opt = exports.TIface = exports.iface = exports.TEnumLiteral = exports.enumlit = exports.TEnumType = exports.enumtype = exports.TIntersection = exports.intersection = exports.TUnion = exports.union = exports.TTuple = exports.tuple = exports.TArray = exports.array = exports.TLiteral = exports.lit = exports.TName = exports.name = exports.TType = void 0; + var util_1 = require_util(); + var TType = function() { + function TType2() { + } + return TType2; + }(); + exports.TType = TType; + function parseSpec(typeSpec) { + return typeof typeSpec === "string" ? name(typeSpec) : typeSpec; + } + function getNamedType(suite, name2) { + var ttype = suite[name2]; + if (!ttype) { + throw new Error("Unknown type " + name2); + } + return ttype; + } + function name(value) { + return new TName(value); + } + exports.name = name; + var TName = function(_super) { + __extends(TName2, _super); + function TName2(name2) { + var _this = _super.call(this) || this; + _this.name = name2; + _this._failMsg = "is not a " + name2; + return _this; + } + TName2.prototype.getChecker = function(suite, strict, allowedProps) { + var _this = this; + var ttype = getNamedType(suite, this.name); + var checker = ttype.getChecker(suite, strict, allowedProps); + if (ttype instanceof BasicType || ttype instanceof TName2) { + return checker; + } + return function(value, ctx) { + return checker(value, ctx) ? true : ctx.fail(null, _this._failMsg, 0); + }; + }; + return TName2; + }(TType); + exports.TName = TName; + function lit2(value) { + return new TLiteral(value); + } + exports.lit = lit2; + var TLiteral = function(_super) { + __extends(TLiteral2, _super); + function TLiteral2(value) { + var _this = _super.call(this) || this; + _this.value = value; + _this.name = JSON.stringify(value); + _this._failMsg = "is not " + _this.name; + return _this; + } + TLiteral2.prototype.getChecker = function(suite, strict) { + var _this = this; + return function(value, ctx) { + return value === _this.value ? true : ctx.fail(null, _this._failMsg, -1); + }; + }; + return TLiteral2; + }(TType); + exports.TLiteral = TLiteral; + function array2(typeSpec) { + return new TArray(parseSpec(typeSpec)); + } + exports.array = array2; + var TArray = function(_super) { + __extends(TArray2, _super); + function TArray2(ttype) { + var _this = _super.call(this) || this; + _this.ttype = ttype; + return _this; + } + TArray2.prototype.getChecker = function(suite, strict) { + var itemChecker = this.ttype.getChecker(suite, strict); + return function(value, ctx) { + if (!Array.isArray(value)) { + return ctx.fail(null, "is not an array", 0); + } + for (var i = 0; i < value.length; i++) { + var ok = itemChecker(value[i], ctx); + if (!ok) { + return ctx.fail(i, null, 1); + } + } + return true; + }; + }; + return TArray2; + }(TType); + exports.TArray = TArray; + function tuple() { + var typeSpec = []; + for (var _i2 = 0; _i2 < arguments.length; _i2++) { + typeSpec[_i2] = arguments[_i2]; + } + return new TTuple(typeSpec.map(function(t2) { + return parseSpec(t2); + })); + } + exports.tuple = tuple; + var TTuple = function(_super) { + __extends(TTuple2, _super); + function TTuple2(ttypes) { + var _this = _super.call(this) || this; + _this.ttypes = ttypes; + return _this; + } + TTuple2.prototype.getChecker = function(suite, strict) { + var itemCheckers = this.ttypes.map(function(t2) { + return t2.getChecker(suite, strict); + }); + var checker = function(value, ctx) { + if (!Array.isArray(value)) { + return ctx.fail(null, "is not an array", 0); + } + for (var i = 0; i < itemCheckers.length; i++) { + var ok = itemCheckers[i](value[i], ctx); + if (!ok) { + return ctx.fail(i, null, 1); + } + } + return true; + }; + if (!strict) { + return checker; + } + return function(value, ctx) { + if (!checker(value, ctx)) { + return false; + } + return value.length <= itemCheckers.length ? true : ctx.fail(itemCheckers.length, "is extraneous", 2); + }; + }; + return TTuple2; + }(TType); + exports.TTuple = TTuple; + function union2() { + var typeSpec = []; + for (var _i2 = 0; _i2 < arguments.length; _i2++) { + typeSpec[_i2] = arguments[_i2]; + } + return new TUnion(typeSpec.map(function(t2) { + return parseSpec(t2); + })); + } + exports.union = union2; + var TUnion = function(_super) { + __extends(TUnion2, _super); + function TUnion2(ttypes) { + var _this = _super.call(this) || this; + _this.ttypes = ttypes; + var names = ttypes.map(function(t2) { + return t2 instanceof TName || t2 instanceof TLiteral ? t2.name : null; + }).filter(function(n) { + return n; + }); + var otherTypes = ttypes.length - names.length; + if (names.length) { + if (otherTypes > 0) { + names.push(otherTypes + " more"); + } + _this._failMsg = "is none of " + names.join(", "); + } else { + _this._failMsg = "is none of " + otherTypes + " types"; + } + return _this; + } + TUnion2.prototype.getChecker = function(suite, strict) { + var _this = this; + var itemCheckers = this.ttypes.map(function(t2) { + return t2.getChecker(suite, strict); + }); + return function(value, ctx) { + var ur = ctx.unionResolver(); + for (var i = 0; i < itemCheckers.length; i++) { + var ok = itemCheckers[i](value, ur.createContext()); + if (ok) { + return true; + } + } + ctx.resolveUnion(ur); + return ctx.fail(null, _this._failMsg, 0); + }; + }; + return TUnion2; + }(TType); + exports.TUnion = TUnion; + function intersection() { + var typeSpec = []; + for (var _i2 = 0; _i2 < arguments.length; _i2++) { + typeSpec[_i2] = arguments[_i2]; + } + return new TIntersection(typeSpec.map(function(t2) { + return parseSpec(t2); + })); + } + exports.intersection = intersection; + var TIntersection = function(_super) { + __extends(TIntersection2, _super); + function TIntersection2(ttypes) { + var _this = _super.call(this) || this; + _this.ttypes = ttypes; + return _this; + } + TIntersection2.prototype.getChecker = function(suite, strict) { + var allowedProps = /* @__PURE__ */ new Set(); + var itemCheckers = this.ttypes.map(function(t2) { + return t2.getChecker(suite, strict, allowedProps); + }); + return function(value, ctx) { + var ok = itemCheckers.every(function(checker) { + return checker(value, ctx); + }); + if (ok) { + return true; + } + return ctx.fail(null, null, 0); + }; + }; + return TIntersection2; + }(TType); + exports.TIntersection = TIntersection; + function enumtype(values) { + return new TEnumType(values); + } + exports.enumtype = enumtype; + var TEnumType = function(_super) { + __extends(TEnumType2, _super); + function TEnumType2(members) { + var _this = _super.call(this) || this; + _this.members = members; + _this.validValues = /* @__PURE__ */ new Set(); + _this._failMsg = "is not a valid enum value"; + _this.validValues = new Set(Object.keys(members).map(function(name2) { + return members[name2]; + })); + return _this; + } + TEnumType2.prototype.getChecker = function(suite, strict) { + var _this = this; + return function(value, ctx) { + return _this.validValues.has(value) ? true : ctx.fail(null, _this._failMsg, 0); + }; + }; + return TEnumType2; + }(TType); + exports.TEnumType = TEnumType; + function enumlit(name2, prop) { + return new TEnumLiteral(name2, prop); + } + exports.enumlit = enumlit; + var TEnumLiteral = function(_super) { + __extends(TEnumLiteral2, _super); + function TEnumLiteral2(enumName, prop) { + var _this = _super.call(this) || this; + _this.enumName = enumName; + _this.prop = prop; + _this._failMsg = "is not " + enumName + "." + prop; + return _this; + } + TEnumLiteral2.prototype.getChecker = function(suite, strict) { + var _this = this; + var ttype = getNamedType(suite, this.enumName); + if (!(ttype instanceof TEnumType)) { + throw new Error("Type " + this.enumName + " used in enumlit is not an enum type"); + } + var val = ttype.members[this.prop]; + if (!ttype.members.hasOwnProperty(this.prop)) { + throw new Error("Unknown value " + this.enumName + "." + this.prop + " used in enumlit"); + } + return function(value, ctx) { + return value === val ? true : ctx.fail(null, _this._failMsg, -1); + }; + }; + return TEnumLiteral2; + }(TType); + exports.TEnumLiteral = TEnumLiteral; + function makeIfaceProps(props) { + return Object.keys(props).map(function(name2) { + return makeIfaceProp(name2, props[name2]); + }); + } + function makeIfaceProp(name2, prop) { + return prop instanceof TOptional ? new TProp(name2, prop.ttype, true) : new TProp(name2, parseSpec(prop), false); + } + function iface2(bases, props) { + return new TIface(bases, makeIfaceProps(props)); + } + exports.iface = iface2; + var TIface = function(_super) { + __extends(TIface2, _super); + function TIface2(bases, props) { + var _this = _super.call(this) || this; + _this.bases = bases; + _this.props = props; + _this.propSet = new Set(props.map(function(p) { + return p.name; + })); + return _this; + } + TIface2.prototype.getChecker = function(suite, strict, allowedProps) { + var _this = this; + var baseCheckers = this.bases.map(function(b) { + return getNamedType(suite, b).getChecker(suite, strict); + }); + var propCheckers = this.props.map(function(prop) { + return prop.ttype.getChecker(suite, strict); + }); + var testCtx = new util_1.NoopContext(); + var isPropRequired = this.props.map(function(prop, i) { + return !prop.isOpt && !propCheckers[i](void 0, testCtx); + }); + var checker = function(value, ctx) { + if (typeof value !== "object" || value === null) { + return ctx.fail(null, "is not an object", 0); + } + for (var i = 0; i < baseCheckers.length; i++) { + if (!baseCheckers[i](value, ctx)) { + return false; + } + } + for (var i = 0; i < propCheckers.length; i++) { + var name_1 = _this.props[i].name; + var v = value[name_1]; + if (v === void 0) { + if (isPropRequired[i]) { + return ctx.fail(name_1, "is missing", 1); + } + } else { + var ok = propCheckers[i](v, ctx); + if (!ok) { + return ctx.fail(name_1, null, 1); + } + } + } + return true; + }; + if (!strict) { + return checker; + } + var propSet = this.propSet; + if (allowedProps) { + this.propSet.forEach(function(prop) { + return allowedProps.add(prop); + }); + propSet = allowedProps; + } + return function(value, ctx) { + if (!checker(value, ctx)) { + return false; + } + for (var prop in value) { + if (!propSet.has(prop)) { + return ctx.fail(prop, "is extraneous", 2); + } + } + return true; + }; + }; + return TIface2; + }(TType); + exports.TIface = TIface; + function opt2(typeSpec) { + return new TOptional(parseSpec(typeSpec)); + } + exports.opt = opt2; + var TOptional = function(_super) { + __extends(TOptional2, _super); + function TOptional2(ttype) { + var _this = _super.call(this) || this; + _this.ttype = ttype; + return _this; + } + TOptional2.prototype.getChecker = function(suite, strict) { + var itemChecker = this.ttype.getChecker(suite, strict); + return function(value, ctx) { + return value === void 0 || itemChecker(value, ctx); + }; + }; + return TOptional2; + }(TType); + exports.TOptional = TOptional; + var TProp = function() { + function TProp2(name2, ttype, isOpt) { + this.name = name2; + this.ttype = ttype; + this.isOpt = isOpt; + } + return TProp2; + }(); + exports.TProp = TProp; + function func(resultSpec) { + var params = []; + for (var _i2 = 1; _i2 < arguments.length; _i2++) { + params[_i2 - 1] = arguments[_i2]; + } + return new TFunc(new TParamList(params), parseSpec(resultSpec)); + } + exports.func = func; + var TFunc = function(_super) { + __extends(TFunc2, _super); + function TFunc2(paramList, result) { + var _this = _super.call(this) || this; + _this.paramList = paramList; + _this.result = result; + return _this; + } + TFunc2.prototype.getChecker = function(suite, strict) { + return function(value, ctx) { + return typeof value === "function" ? true : ctx.fail(null, "is not a function", 0); + }; + }; + return TFunc2; + }(TType); + exports.TFunc = TFunc; + function param(name2, typeSpec, isOpt) { + return new TParam(name2, parseSpec(typeSpec), Boolean(isOpt)); + } + exports.param = param; + var TParam = function() { + function TParam2(name2, ttype, isOpt) { + this.name = name2; + this.ttype = ttype; + this.isOpt = isOpt; + } + return TParam2; + }(); + exports.TParam = TParam; + var TParamList = function(_super) { + __extends(TParamList2, _super); + function TParamList2(params) { + var _this = _super.call(this) || this; + _this.params = params; + return _this; + } + TParamList2.prototype.getChecker = function(suite, strict) { + var _this = this; + var itemCheckers = this.params.map(function(t2) { + return t2.ttype.getChecker(suite, strict); + }); + var testCtx = new util_1.NoopContext(); + var isParamRequired = this.params.map(function(param2, i) { + return !param2.isOpt && !itemCheckers[i](void 0, testCtx); + }); + var checker = function(value, ctx) { + if (!Array.isArray(value)) { + return ctx.fail(null, "is not an array", 0); + } + for (var i = 0; i < itemCheckers.length; i++) { + var p = _this.params[i]; + if (value[i] === void 0) { + if (isParamRequired[i]) { + return ctx.fail(p.name, "is missing", 1); + } + } else { + var ok = itemCheckers[i](value[i], ctx); + if (!ok) { + return ctx.fail(p.name, null, 1); + } + } + } + return true; + }; + if (!strict) { + return checker; + } + return function(value, ctx) { + if (!checker(value, ctx)) { + return false; + } + return value.length <= itemCheckers.length ? true : ctx.fail(itemCheckers.length, "is extraneous", 2); + }; + }; + return TParamList2; + }(TType); + exports.TParamList = TParamList; + var BasicType = function(_super) { + __extends(BasicType2, _super); + function BasicType2(validator, message) { + var _this = _super.call(this) || this; + _this.validator = validator; + _this.message = message; + return _this; + } + BasicType2.prototype.getChecker = function(suite, strict) { + var _this = this; + return function(value, ctx) { + return _this.validator(value) ? true : ctx.fail(null, _this.message, 0); + }; + }; + return BasicType2; + }(TType); + exports.BasicType = BasicType; + exports.basicTypes = { + any: new BasicType(function(v) { + return true; + }, "is invalid"), + number: new BasicType(function(v) { + return typeof v === "number"; + }, "is not a number"), + object: new BasicType(function(v) { + return typeof v === "object" && v; + }, "is not an object"), + boolean: new BasicType(function(v) { + return typeof v === "boolean"; + }, "is not a boolean"), + string: new BasicType(function(v) { + return typeof v === "string"; + }, "is not a string"), + symbol: new BasicType(function(v) { + return typeof v === "symbol"; + }, "is not a symbol"), + void: new BasicType(function(v) { + return v == null; + }, "is not void"), + undefined: new BasicType(function(v) { + return v === void 0; + }, "is not undefined"), + null: new BasicType(function(v) { + return v === null; + }, "is not null"), + never: new BasicType(function(v) { + return false; + }, "is unexpected"), + Date: new BasicType(getIsNativeChecker("[object Date]"), "is not a Date"), + RegExp: new BasicType(getIsNativeChecker("[object RegExp]"), "is not a RegExp") + }; + var nativeToString = Object.prototype.toString; + function getIsNativeChecker(tag) { + return function(v) { + return typeof v === "object" && v && nativeToString.call(v) === tag; + }; + } + if (typeof Buffer !== "undefined") { + exports.basicTypes.Buffer = new BasicType(function(v) { + return Buffer.isBuffer(v); + }, "is not a Buffer"); + } + var _loop_1 = function(array_12) { + exports.basicTypes[array_12.name] = new BasicType(function(v) { + return v instanceof array_12; + }, "is not a " + array_12.name); + }; + for (_i = 0, _a = [ + Int8Array, + Uint8Array, + Uint8ClampedArray, + Int16Array, + Uint16Array, + Int32Array, + Uint32Array, + Float32Array, + Float64Array, + ArrayBuffer + ]; _i < _a.length; _i++) { + array_1 = _a[_i]; + _loop_1(array_1); + } + var array_1; + var _i; + var _a; + } +}); + +// node_modules/ts-interface-checker/dist/index.js +var require_dist = __commonJS({ + "node_modules/ts-interface-checker/dist/index.js"(exports) { + var __spreadArrays = exports && exports.__spreadArrays || function() { + for (var s = 0, i = 0, il = arguments.length; i < il; i++) + s += arguments[i].length; + for (var r = Array(s), k = 0, i = 0; i < il; i++) + for (var a = arguments[i], j = 0, jl = a.length; j < jl; j++, k++) + r[k] = a[j]; + return r; + }; + Object.defineProperty(exports, "__esModule", { value: true }); + exports.Checker = exports.createCheckers = void 0; + var types_1 = require_types(); + var util_1 = require_util(); + var types_2 = require_types(); + Object.defineProperty(exports, "TArray", { enumerable: true, get: function() { + return types_2.TArray; + } }); + Object.defineProperty(exports, "TEnumType", { enumerable: true, get: function() { + return types_2.TEnumType; + } }); + Object.defineProperty(exports, "TEnumLiteral", { enumerable: true, get: function() { + return types_2.TEnumLiteral; + } }); + Object.defineProperty(exports, "TFunc", { enumerable: true, get: function() { + return types_2.TFunc; + } }); + Object.defineProperty(exports, "TIface", { enumerable: true, get: function() { + return types_2.TIface; + } }); + Object.defineProperty(exports, "TLiteral", { enumerable: true, get: function() { + return types_2.TLiteral; + } }); + Object.defineProperty(exports, "TName", { enumerable: true, get: function() { + return types_2.TName; + } }); + Object.defineProperty(exports, "TOptional", { enumerable: true, get: function() { + return types_2.TOptional; + } }); + Object.defineProperty(exports, "TParam", { enumerable: true, get: function() { + return types_2.TParam; + } }); + Object.defineProperty(exports, "TParamList", { enumerable: true, get: function() { + return types_2.TParamList; + } }); + Object.defineProperty(exports, "TProp", { enumerable: true, get: function() { + return types_2.TProp; + } }); + Object.defineProperty(exports, "TTuple", { enumerable: true, get: function() { + return types_2.TTuple; + } }); + Object.defineProperty(exports, "TType", { enumerable: true, get: function() { + return types_2.TType; + } }); + Object.defineProperty(exports, "TUnion", { enumerable: true, get: function() { + return types_2.TUnion; + } }); + Object.defineProperty(exports, "TIntersection", { enumerable: true, get: function() { + return types_2.TIntersection; + } }); + Object.defineProperty(exports, "array", { enumerable: true, get: function() { + return types_2.array; + } }); + Object.defineProperty(exports, "enumlit", { enumerable: true, get: function() { + return types_2.enumlit; + } }); + Object.defineProperty(exports, "enumtype", { enumerable: true, get: function() { + return types_2.enumtype; + } }); + Object.defineProperty(exports, "func", { enumerable: true, get: function() { + return types_2.func; + } }); + Object.defineProperty(exports, "iface", { enumerable: true, get: function() { + return types_2.iface; + } }); + Object.defineProperty(exports, "lit", { enumerable: true, get: function() { + return types_2.lit; + } }); + Object.defineProperty(exports, "name", { enumerable: true, get: function() { + return types_2.name; + } }); + Object.defineProperty(exports, "opt", { enumerable: true, get: function() { + return types_2.opt; + } }); + Object.defineProperty(exports, "param", { enumerable: true, get: function() { + return types_2.param; + } }); + Object.defineProperty(exports, "tuple", { enumerable: true, get: function() { + return types_2.tuple; + } }); + Object.defineProperty(exports, "union", { enumerable: true, get: function() { + return types_2.union; + } }); + Object.defineProperty(exports, "intersection", { enumerable: true, get: function() { + return types_2.intersection; + } }); + Object.defineProperty(exports, "BasicType", { enumerable: true, get: function() { + return types_2.BasicType; + } }); + var util_2 = require_util(); + Object.defineProperty(exports, "VError", { enumerable: true, get: function() { + return util_2.VError; + } }); + function createCheckers2() { + var typeSuite = []; + for (var _i = 0; _i < arguments.length; _i++) { + typeSuite[_i] = arguments[_i]; + } + var fullSuite = Object.assign.apply(Object, __spreadArrays([{}, types_1.basicTypes], typeSuite)); + var checkers = {}; + for (var _a = 0, typeSuite_1 = typeSuite; _a < typeSuite_1.length; _a++) { + var suite_1 = typeSuite_1[_a]; + for (var _b = 0, _c = Object.keys(suite_1); _b < _c.length; _b++) { + var name = _c[_b]; + checkers[name] = new Checker(fullSuite, suite_1[name]); + } + } + return checkers; + } + exports.createCheckers = createCheckers2; + var Checker = function() { + function Checker2(suite, ttype, _path) { + if (_path === void 0) { + _path = "value"; + } + this.suite = suite; + this.ttype = ttype; + this._path = _path; + this.props = /* @__PURE__ */ new Map(); + if (ttype instanceof types_1.TIface) { + for (var _i = 0, _a = ttype.props; _i < _a.length; _i++) { + var p = _a[_i]; + this.props.set(p.name, p.ttype); + } + } + this.checkerPlain = this.ttype.getChecker(suite, false); + this.checkerStrict = this.ttype.getChecker(suite, true); + } + Checker2.prototype.setReportedPath = function(path) { + this._path = path; + }; + Checker2.prototype.check = function(value) { + return this._doCheck(this.checkerPlain, value); + }; + Checker2.prototype.test = function(value) { + return this.checkerPlain(value, new util_1.NoopContext()); + }; + Checker2.prototype.validate = function(value) { + return this._doValidate(this.checkerPlain, value); + }; + Checker2.prototype.strictCheck = function(value) { + return this._doCheck(this.checkerStrict, value); + }; + Checker2.prototype.strictTest = function(value) { + return this.checkerStrict(value, new util_1.NoopContext()); + }; + Checker2.prototype.strictValidate = function(value) { + return this._doValidate(this.checkerStrict, value); + }; + Checker2.prototype.getProp = function(prop) { + var ttype = this.props.get(prop); + if (!ttype) { + throw new Error("Type has no property " + prop); + } + return new Checker2(this.suite, ttype, this._path + "." + prop); + }; + Checker2.prototype.methodArgs = function(methodName) { + var tfunc = this._getMethod(methodName); + return new Checker2(this.suite, tfunc.paramList); + }; + Checker2.prototype.methodResult = function(methodName) { + var tfunc = this._getMethod(methodName); + return new Checker2(this.suite, tfunc.result); + }; + Checker2.prototype.getArgs = function() { + if (!(this.ttype instanceof types_1.TFunc)) { + throw new Error("getArgs() applied to non-function"); + } + return new Checker2(this.suite, this.ttype.paramList); + }; + Checker2.prototype.getResult = function() { + if (!(this.ttype instanceof types_1.TFunc)) { + throw new Error("getResult() applied to non-function"); + } + return new Checker2(this.suite, this.ttype.result); + }; + Checker2.prototype.getType = function() { + return this.ttype; + }; + Checker2.prototype._doCheck = function(checkerFunc, value) { + var noopCtx = new util_1.NoopContext(); + if (!checkerFunc(value, noopCtx)) { + var detailCtx = new util_1.DetailContext(); + checkerFunc(value, detailCtx); + throw detailCtx.getError(this._path); + } + }; + Checker2.prototype._doValidate = function(checkerFunc, value) { + var noopCtx = new util_1.NoopContext(); + if (checkerFunc(value, noopCtx)) { + return null; + } + var detailCtx = new util_1.DetailContext(); + checkerFunc(value, detailCtx); + return detailCtx.getErrorDetail(this._path); + }; + Checker2.prototype._getMethod = function(methodName) { + var ttype = this.props.get(methodName); + if (!ttype) { + throw new Error("Type has no property " + methodName); + } + if (!(ttype instanceof types_1.TFunc)) { + throw new Error("Property " + methodName + " is not a method"); + } + return ttype; + }; + return Checker2; + }(); + exports.Checker = Checker; + } +}); + +// node_modules/lines-and-columns/build/index.js +var require_build = __commonJS({ + "node_modules/lines-and-columns/build/index.js"(exports) { + exports.__esModule = true; + exports.LinesAndColumns = void 0; + var LF = "\n"; + var CR = "\r"; + var LinesAndColumns2 = function() { + function LinesAndColumns3(string) { + this.string = string; + var offsets = [0]; + for (var offset = 0; offset < string.length; ) { + switch (string[offset]) { + case LF: + offset += LF.length; + offsets.push(offset); + break; + case CR: + offset += CR.length; + if (string[offset] === LF) { + offset += LF.length; + } + offsets.push(offset); + break; + default: + offset++; + break; + } + } + this.offsets = offsets; + } + LinesAndColumns3.prototype.locationForIndex = function(index) { + if (index < 0 || index > this.string.length) { + return null; + } + var line = 0; + var offsets = this.offsets; + while (offsets[line + 1] <= index) { + line++; + } + var column = index - offsets[line]; + return { line, column }; + }; + LinesAndColumns3.prototype.indexForLocation = function(location) { + var line = location.line, column = location.column; + if (line < 0 || line >= this.offsets.length) { + return null; + } + if (column < 0 || column > this.lengthOfLine(line)) { + return null; + } + return this.offsets[line] + column; + }; + LinesAndColumns3.prototype.lengthOfLine = function(line) { + var offset = this.offsets[line]; + var nextOffset = line === this.offsets.length - 1 ? this.string.length : this.offsets[line + 1]; + return nextOffset - offset; + }; + return LinesAndColumns3; + }(); + exports.LinesAndColumns = LinesAndColumns2; + exports["default"] = LinesAndColumns2; + } +}); + +// node_modules/sucrase/dist/esm/parser/tokenizer/keywords.js +var ContextualKeyword; +(function(ContextualKeyword2) { + const NONE = 0; + ContextualKeyword2[ContextualKeyword2["NONE"] = NONE] = "NONE"; + const _abstract = NONE + 1; + ContextualKeyword2[ContextualKeyword2["_abstract"] = _abstract] = "_abstract"; + const _as = _abstract + 1; + ContextualKeyword2[ContextualKeyword2["_as"] = _as] = "_as"; + const _asserts = _as + 1; + ContextualKeyword2[ContextualKeyword2["_asserts"] = _asserts] = "_asserts"; + const _async = _asserts + 1; + ContextualKeyword2[ContextualKeyword2["_async"] = _async] = "_async"; + const _await = _async + 1; + ContextualKeyword2[ContextualKeyword2["_await"] = _await] = "_await"; + const _checks = _await + 1; + ContextualKeyword2[ContextualKeyword2["_checks"] = _checks] = "_checks"; + const _constructor = _checks + 1; + ContextualKeyword2[ContextualKeyword2["_constructor"] = _constructor] = "_constructor"; + const _declare = _constructor + 1; + ContextualKeyword2[ContextualKeyword2["_declare"] = _declare] = "_declare"; + const _enum = _declare + 1; + ContextualKeyword2[ContextualKeyword2["_enum"] = _enum] = "_enum"; + const _exports = _enum + 1; + ContextualKeyword2[ContextualKeyword2["_exports"] = _exports] = "_exports"; + const _from = _exports + 1; + ContextualKeyword2[ContextualKeyword2["_from"] = _from] = "_from"; + const _get = _from + 1; + ContextualKeyword2[ContextualKeyword2["_get"] = _get] = "_get"; + const _global = _get + 1; + ContextualKeyword2[ContextualKeyword2["_global"] = _global] = "_global"; + const _implements = _global + 1; + ContextualKeyword2[ContextualKeyword2["_implements"] = _implements] = "_implements"; + const _infer = _implements + 1; + ContextualKeyword2[ContextualKeyword2["_infer"] = _infer] = "_infer"; + const _interface = _infer + 1; + ContextualKeyword2[ContextualKeyword2["_interface"] = _interface] = "_interface"; + const _is = _interface + 1; + ContextualKeyword2[ContextualKeyword2["_is"] = _is] = "_is"; + const _keyof = _is + 1; + ContextualKeyword2[ContextualKeyword2["_keyof"] = _keyof] = "_keyof"; + const _mixins = _keyof + 1; + ContextualKeyword2[ContextualKeyword2["_mixins"] = _mixins] = "_mixins"; + const _module = _mixins + 1; + ContextualKeyword2[ContextualKeyword2["_module"] = _module] = "_module"; + const _namespace = _module + 1; + ContextualKeyword2[ContextualKeyword2["_namespace"] = _namespace] = "_namespace"; + const _of = _namespace + 1; + ContextualKeyword2[ContextualKeyword2["_of"] = _of] = "_of"; + const _opaque = _of + 1; + ContextualKeyword2[ContextualKeyword2["_opaque"] = _opaque] = "_opaque"; + const _override = _opaque + 1; + ContextualKeyword2[ContextualKeyword2["_override"] = _override] = "_override"; + const _private = _override + 1; + ContextualKeyword2[ContextualKeyword2["_private"] = _private] = "_private"; + const _protected = _private + 1; + ContextualKeyword2[ContextualKeyword2["_protected"] = _protected] = "_protected"; + const _proto = _protected + 1; + ContextualKeyword2[ContextualKeyword2["_proto"] = _proto] = "_proto"; + const _public = _proto + 1; + ContextualKeyword2[ContextualKeyword2["_public"] = _public] = "_public"; + const _readonly = _public + 1; + ContextualKeyword2[ContextualKeyword2["_readonly"] = _readonly] = "_readonly"; + const _require = _readonly + 1; + ContextualKeyword2[ContextualKeyword2["_require"] = _require] = "_require"; + const _set = _require + 1; + ContextualKeyword2[ContextualKeyword2["_set"] = _set] = "_set"; + const _static = _set + 1; + ContextualKeyword2[ContextualKeyword2["_static"] = _static] = "_static"; + const _symbol = _static + 1; + ContextualKeyword2[ContextualKeyword2["_symbol"] = _symbol] = "_symbol"; + const _type = _symbol + 1; + ContextualKeyword2[ContextualKeyword2["_type"] = _type] = "_type"; + const _unique = _type + 1; + ContextualKeyword2[ContextualKeyword2["_unique"] = _unique] = "_unique"; +})(ContextualKeyword || (ContextualKeyword = {})); + +// node_modules/sucrase/dist/esm/parser/tokenizer/types.js +var TokenType; +(function(TokenType2) { + const PRECEDENCE_MASK = 15; + TokenType2[TokenType2["PRECEDENCE_MASK"] = PRECEDENCE_MASK] = "PRECEDENCE_MASK"; + const IS_KEYWORD = 1 << 4; + TokenType2[TokenType2["IS_KEYWORD"] = IS_KEYWORD] = "IS_KEYWORD"; + const IS_ASSIGN = 1 << 5; + TokenType2[TokenType2["IS_ASSIGN"] = IS_ASSIGN] = "IS_ASSIGN"; + const IS_RIGHT_ASSOCIATIVE = 1 << 6; + TokenType2[TokenType2["IS_RIGHT_ASSOCIATIVE"] = IS_RIGHT_ASSOCIATIVE] = "IS_RIGHT_ASSOCIATIVE"; + const IS_PREFIX = 1 << 7; + TokenType2[TokenType2["IS_PREFIX"] = IS_PREFIX] = "IS_PREFIX"; + const IS_POSTFIX = 1 << 8; + TokenType2[TokenType2["IS_POSTFIX"] = IS_POSTFIX] = "IS_POSTFIX"; + const num = 0; + TokenType2[TokenType2["num"] = num] = "num"; + const bigint = 512; + TokenType2[TokenType2["bigint"] = bigint] = "bigint"; + const decimal = 1024; + TokenType2[TokenType2["decimal"] = decimal] = "decimal"; + const regexp = 1536; + TokenType2[TokenType2["regexp"] = regexp] = "regexp"; + const string = 2048; + TokenType2[TokenType2["string"] = string] = "string"; + const name = 2560; + TokenType2[TokenType2["name"] = name] = "name"; + const eof = 3072; + TokenType2[TokenType2["eof"] = eof] = "eof"; + const bracketL = 3584; + TokenType2[TokenType2["bracketL"] = bracketL] = "bracketL"; + const bracketR = 4096; + TokenType2[TokenType2["bracketR"] = bracketR] = "bracketR"; + const braceL = 4608; + TokenType2[TokenType2["braceL"] = braceL] = "braceL"; + const braceBarL = 5120; + TokenType2[TokenType2["braceBarL"] = braceBarL] = "braceBarL"; + const braceR = 5632; + TokenType2[TokenType2["braceR"] = braceR] = "braceR"; + const braceBarR = 6144; + TokenType2[TokenType2["braceBarR"] = braceBarR] = "braceBarR"; + const parenL = 6656; + TokenType2[TokenType2["parenL"] = parenL] = "parenL"; + const parenR = 7168; + TokenType2[TokenType2["parenR"] = parenR] = "parenR"; + const comma = 7680; + TokenType2[TokenType2["comma"] = comma] = "comma"; + const semi = 8192; + TokenType2[TokenType2["semi"] = semi] = "semi"; + const colon = 8704; + TokenType2[TokenType2["colon"] = colon] = "colon"; + const doubleColon = 9216; + TokenType2[TokenType2["doubleColon"] = doubleColon] = "doubleColon"; + const dot = 9728; + TokenType2[TokenType2["dot"] = dot] = "dot"; + const question = 10240; + TokenType2[TokenType2["question"] = question] = "question"; + const questionDot = 10752; + TokenType2[TokenType2["questionDot"] = questionDot] = "questionDot"; + const arrow = 11264; + TokenType2[TokenType2["arrow"] = arrow] = "arrow"; + const template = 11776; + TokenType2[TokenType2["template"] = template] = "template"; + const ellipsis = 12288; + TokenType2[TokenType2["ellipsis"] = ellipsis] = "ellipsis"; + const backQuote = 12800; + TokenType2[TokenType2["backQuote"] = backQuote] = "backQuote"; + const dollarBraceL = 13312; + TokenType2[TokenType2["dollarBraceL"] = dollarBraceL] = "dollarBraceL"; + const at = 13824; + TokenType2[TokenType2["at"] = at] = "at"; + const hash = 14336; + TokenType2[TokenType2["hash"] = hash] = "hash"; + const eq = 14880; + TokenType2[TokenType2["eq"] = eq] = "eq"; + const assign = 15392; + TokenType2[TokenType2["assign"] = assign] = "assign"; + const preIncDec = 16256; + TokenType2[TokenType2["preIncDec"] = preIncDec] = "preIncDec"; + const postIncDec = 16768; + TokenType2[TokenType2["postIncDec"] = postIncDec] = "postIncDec"; + const bang = 17024; + TokenType2[TokenType2["bang"] = bang] = "bang"; + const tilde = 17536; + TokenType2[TokenType2["tilde"] = tilde] = "tilde"; + const pipeline = 17921; + TokenType2[TokenType2["pipeline"] = pipeline] = "pipeline"; + const nullishCoalescing = 18434; + TokenType2[TokenType2["nullishCoalescing"] = nullishCoalescing] = "nullishCoalescing"; + const logicalOR = 18946; + TokenType2[TokenType2["logicalOR"] = logicalOR] = "logicalOR"; + const logicalAND = 19459; + TokenType2[TokenType2["logicalAND"] = logicalAND] = "logicalAND"; + const bitwiseOR = 19972; + TokenType2[TokenType2["bitwiseOR"] = bitwiseOR] = "bitwiseOR"; + const bitwiseXOR = 20485; + TokenType2[TokenType2["bitwiseXOR"] = bitwiseXOR] = "bitwiseXOR"; + const bitwiseAND = 20998; + TokenType2[TokenType2["bitwiseAND"] = bitwiseAND] = "bitwiseAND"; + const equality = 21511; + TokenType2[TokenType2["equality"] = equality] = "equality"; + const lessThan = 22024; + TokenType2[TokenType2["lessThan"] = lessThan] = "lessThan"; + const greaterThan = 22536; + TokenType2[TokenType2["greaterThan"] = greaterThan] = "greaterThan"; + const relationalOrEqual = 23048; + TokenType2[TokenType2["relationalOrEqual"] = relationalOrEqual] = "relationalOrEqual"; + const bitShift = 23561; + TokenType2[TokenType2["bitShift"] = bitShift] = "bitShift"; + const plus = 24202; + TokenType2[TokenType2["plus"] = plus] = "plus"; + const minus = 24714; + TokenType2[TokenType2["minus"] = minus] = "minus"; + const modulo = 25099; + TokenType2[TokenType2["modulo"] = modulo] = "modulo"; + const star = 25611; + TokenType2[TokenType2["star"] = star] = "star"; + const slash = 26123; + TokenType2[TokenType2["slash"] = slash] = "slash"; + const exponent = 26700; + TokenType2[TokenType2["exponent"] = exponent] = "exponent"; + const jsxName = 27136; + TokenType2[TokenType2["jsxName"] = jsxName] = "jsxName"; + const jsxText = 27648; + TokenType2[TokenType2["jsxText"] = jsxText] = "jsxText"; + const jsxTagStart = 28160; + TokenType2[TokenType2["jsxTagStart"] = jsxTagStart] = "jsxTagStart"; + const jsxTagEnd = 28672; + TokenType2[TokenType2["jsxTagEnd"] = jsxTagEnd] = "jsxTagEnd"; + const typeParameterStart = 29184; + TokenType2[TokenType2["typeParameterStart"] = typeParameterStart] = "typeParameterStart"; + const nonNullAssertion = 29696; + TokenType2[TokenType2["nonNullAssertion"] = nonNullAssertion] = "nonNullAssertion"; + const _break = 30224; + TokenType2[TokenType2["_break"] = _break] = "_break"; + const _case = 30736; + TokenType2[TokenType2["_case"] = _case] = "_case"; + const _catch = 31248; + TokenType2[TokenType2["_catch"] = _catch] = "_catch"; + const _continue = 31760; + TokenType2[TokenType2["_continue"] = _continue] = "_continue"; + const _debugger = 32272; + TokenType2[TokenType2["_debugger"] = _debugger] = "_debugger"; + const _default = 32784; + TokenType2[TokenType2["_default"] = _default] = "_default"; + const _do = 33296; + TokenType2[TokenType2["_do"] = _do] = "_do"; + const _else = 33808; + TokenType2[TokenType2["_else"] = _else] = "_else"; + const _finally = 34320; + TokenType2[TokenType2["_finally"] = _finally] = "_finally"; + const _for = 34832; + TokenType2[TokenType2["_for"] = _for] = "_for"; + const _function = 35344; + TokenType2[TokenType2["_function"] = _function] = "_function"; + const _if = 35856; + TokenType2[TokenType2["_if"] = _if] = "_if"; + const _return = 36368; + TokenType2[TokenType2["_return"] = _return] = "_return"; + const _switch = 36880; + TokenType2[TokenType2["_switch"] = _switch] = "_switch"; + const _throw = 37520; + TokenType2[TokenType2["_throw"] = _throw] = "_throw"; + const _try = 37904; + TokenType2[TokenType2["_try"] = _try] = "_try"; + const _var = 38416; + TokenType2[TokenType2["_var"] = _var] = "_var"; + const _let = 38928; + TokenType2[TokenType2["_let"] = _let] = "_let"; + const _const = 39440; + TokenType2[TokenType2["_const"] = _const] = "_const"; + const _while = 39952; + TokenType2[TokenType2["_while"] = _while] = "_while"; + const _with = 40464; + TokenType2[TokenType2["_with"] = _with] = "_with"; + const _new = 40976; + TokenType2[TokenType2["_new"] = _new] = "_new"; + const _this = 41488; + TokenType2[TokenType2["_this"] = _this] = "_this"; + const _super = 42e3; + TokenType2[TokenType2["_super"] = _super] = "_super"; + const _class = 42512; + TokenType2[TokenType2["_class"] = _class] = "_class"; + const _extends = 43024; + TokenType2[TokenType2["_extends"] = _extends] = "_extends"; + const _export = 43536; + TokenType2[TokenType2["_export"] = _export] = "_export"; + const _import = 44048; + TokenType2[TokenType2["_import"] = _import] = "_import"; + const _yield = 44560; + TokenType2[TokenType2["_yield"] = _yield] = "_yield"; + const _null = 45072; + TokenType2[TokenType2["_null"] = _null] = "_null"; + const _true = 45584; + TokenType2[TokenType2["_true"] = _true] = "_true"; + const _false = 46096; + TokenType2[TokenType2["_false"] = _false] = "_false"; + const _in = 46616; + TokenType2[TokenType2["_in"] = _in] = "_in"; + const _instanceof = 47128; + TokenType2[TokenType2["_instanceof"] = _instanceof] = "_instanceof"; + const _typeof = 47760; + TokenType2[TokenType2["_typeof"] = _typeof] = "_typeof"; + const _void = 48272; + TokenType2[TokenType2["_void"] = _void] = "_void"; + const _delete = 48784; + TokenType2[TokenType2["_delete"] = _delete] = "_delete"; + const _async = 49168; + TokenType2[TokenType2["_async"] = _async] = "_async"; + const _get = 49680; + TokenType2[TokenType2["_get"] = _get] = "_get"; + const _set = 50192; + TokenType2[TokenType2["_set"] = _set] = "_set"; + const _declare = 50704; + TokenType2[TokenType2["_declare"] = _declare] = "_declare"; + const _readonly = 51216; + TokenType2[TokenType2["_readonly"] = _readonly] = "_readonly"; + const _abstract = 51728; + TokenType2[TokenType2["_abstract"] = _abstract] = "_abstract"; + const _static = 52240; + TokenType2[TokenType2["_static"] = _static] = "_static"; + const _public = 52752; + TokenType2[TokenType2["_public"] = _public] = "_public"; + const _private = 53264; + TokenType2[TokenType2["_private"] = _private] = "_private"; + const _protected = 53776; + TokenType2[TokenType2["_protected"] = _protected] = "_protected"; + const _override = 54288; + TokenType2[TokenType2["_override"] = _override] = "_override"; + const _as = 54800; + TokenType2[TokenType2["_as"] = _as] = "_as"; + const _enum = 55312; + TokenType2[TokenType2["_enum"] = _enum] = "_enum"; + const _type = 55824; + TokenType2[TokenType2["_type"] = _type] = "_type"; + const _implements = 56336; + TokenType2[TokenType2["_implements"] = _implements] = "_implements"; +})(TokenType || (TokenType = {})); +function formatTokenType(tokenType) { + switch (tokenType) { + case TokenType.num: + return "num"; + case TokenType.bigint: + return "bigint"; + case TokenType.decimal: + return "decimal"; + case TokenType.regexp: + return "regexp"; + case TokenType.string: + return "string"; + case TokenType.name: + return "name"; + case TokenType.eof: + return "eof"; + case TokenType.bracketL: + return "["; + case TokenType.bracketR: + return "]"; + case TokenType.braceL: + return "{"; + case TokenType.braceBarL: + return "{|"; + case TokenType.braceR: + return "}"; + case TokenType.braceBarR: + return "|}"; + case TokenType.parenL: + return "("; + case TokenType.parenR: + return ")"; + case TokenType.comma: + return ","; + case TokenType.semi: + return ";"; + case TokenType.colon: + return ":"; + case TokenType.doubleColon: + return "::"; + case TokenType.dot: + return "."; + case TokenType.question: + return "?"; + case TokenType.questionDot: + return "?."; + case TokenType.arrow: + return "=>"; + case TokenType.template: + return "template"; + case TokenType.ellipsis: + return "..."; + case TokenType.backQuote: + return "`"; + case TokenType.dollarBraceL: + return "${"; + case TokenType.at: + return "@"; + case TokenType.hash: + return "#"; + case TokenType.eq: + return "="; + case TokenType.assign: + return "_="; + case TokenType.preIncDec: + return "++/--"; + case TokenType.postIncDec: + return "++/--"; + case TokenType.bang: + return "!"; + case TokenType.tilde: + return "~"; + case TokenType.pipeline: + return "|>"; + case TokenType.nullishCoalescing: + return "??"; + case TokenType.logicalOR: + return "||"; + case TokenType.logicalAND: + return "&&"; + case TokenType.bitwiseOR: + return "|"; + case TokenType.bitwiseXOR: + return "^"; + case TokenType.bitwiseAND: + return "&"; + case TokenType.equality: + return "==/!="; + case TokenType.lessThan: + return "<"; + case TokenType.greaterThan: + return ">"; + case TokenType.relationalOrEqual: + return "<=/>="; + case TokenType.bitShift: + return "<>"; + case TokenType.plus: + return "+"; + case TokenType.minus: + return "-"; + case TokenType.modulo: + return "%"; + case TokenType.star: + return "*"; + case TokenType.slash: + return "/"; + case TokenType.exponent: + return "**"; + case TokenType.jsxName: + return "jsxName"; + case TokenType.jsxText: + return "jsxText"; + case TokenType.jsxTagStart: + return "jsxTagStart"; + case TokenType.jsxTagEnd: + return "jsxTagEnd"; + case TokenType.typeParameterStart: + return "typeParameterStart"; + case TokenType.nonNullAssertion: + return "nonNullAssertion"; + case TokenType._break: + return "break"; + case TokenType._case: + return "case"; + case TokenType._catch: + return "catch"; + case TokenType._continue: + return "continue"; + case TokenType._debugger: + return "debugger"; + case TokenType._default: + return "default"; + case TokenType._do: + return "do"; + case TokenType._else: + return "else"; + case TokenType._finally: + return "finally"; + case TokenType._for: + return "for"; + case TokenType._function: + return "function"; + case TokenType._if: + return "if"; + case TokenType._return: + return "return"; + case TokenType._switch: + return "switch"; + case TokenType._throw: + return "throw"; + case TokenType._try: + return "try"; + case TokenType._var: + return "var"; + case TokenType._let: + return "let"; + case TokenType._const: + return "const"; + case TokenType._while: + return "while"; + case TokenType._with: + return "with"; + case TokenType._new: + return "new"; + case TokenType._this: + return "this"; + case TokenType._super: + return "super"; + case TokenType._class: + return "class"; + case TokenType._extends: + return "extends"; + case TokenType._export: + return "export"; + case TokenType._import: + return "import"; + case TokenType._yield: + return "yield"; + case TokenType._null: + return "null"; + case TokenType._true: + return "true"; + case TokenType._false: + return "false"; + case TokenType._in: + return "in"; + case TokenType._instanceof: + return "instanceof"; + case TokenType._typeof: + return "typeof"; + case TokenType._void: + return "void"; + case TokenType._delete: + return "delete"; + case TokenType._async: + return "async"; + case TokenType._get: + return "get"; + case TokenType._set: + return "set"; + case TokenType._declare: + return "declare"; + case TokenType._readonly: + return "readonly"; + case TokenType._abstract: + return "abstract"; + case TokenType._static: + return "static"; + case TokenType._public: + return "public"; + case TokenType._private: + return "private"; + case TokenType._protected: + return "protected"; + case TokenType._override: + return "override"; + case TokenType._as: + return "as"; + case TokenType._enum: + return "enum"; + case TokenType._type: + return "type"; + case TokenType._implements: + return "implements"; + default: + return ""; + } +} + +// node_modules/sucrase/dist/esm/parser/tokenizer/state.js +var Scope = class { + constructor(startTokenIndex, endTokenIndex, isFunctionScope) { + this.startTokenIndex = startTokenIndex; + this.endTokenIndex = endTokenIndex; + this.isFunctionScope = isFunctionScope; + } +}; +var StateSnapshot = class { + constructor(potentialArrowAt, noAnonFunctionType, tokensLength, scopesLength, pos, type, contextualKeyword, start, end, isType, scopeDepth, error) { + this.potentialArrowAt = potentialArrowAt; + this.noAnonFunctionType = noAnonFunctionType; + this.tokensLength = tokensLength; + this.scopesLength = scopesLength; + this.pos = pos; + this.type = type; + this.contextualKeyword = contextualKeyword; + this.start = start; + this.end = end; + this.isType = isType; + this.scopeDepth = scopeDepth; + this.error = error; + } +}; +var State = class { + constructor() { + State.prototype.__init.call(this); + State.prototype.__init2.call(this); + State.prototype.__init3.call(this); + State.prototype.__init4.call(this); + State.prototype.__init5.call(this); + State.prototype.__init6.call(this); + State.prototype.__init7.call(this); + State.prototype.__init8.call(this); + State.prototype.__init9.call(this); + State.prototype.__init10.call(this); + State.prototype.__init11.call(this); + State.prototype.__init12.call(this); + } + __init() { + this.potentialArrowAt = -1; + } + __init2() { + this.noAnonFunctionType = false; + } + __init3() { + this.tokens = []; + } + __init4() { + this.scopes = []; + } + __init5() { + this.pos = 0; + } + __init6() { + this.type = TokenType.eof; + } + __init7() { + this.contextualKeyword = ContextualKeyword.NONE; + } + __init8() { + this.start = 0; + } + __init9() { + this.end = 0; + } + __init10() { + this.isType = false; + } + __init11() { + this.scopeDepth = 0; + } + __init12() { + this.error = null; + } + snapshot() { + return new StateSnapshot(this.potentialArrowAt, this.noAnonFunctionType, this.tokens.length, this.scopes.length, this.pos, this.type, this.contextualKeyword, this.start, this.end, this.isType, this.scopeDepth, this.error); + } + restoreFromSnapshot(snapshot) { + this.potentialArrowAt = snapshot.potentialArrowAt; + this.noAnonFunctionType = snapshot.noAnonFunctionType; + this.tokens.length = snapshot.tokensLength; + this.scopes.length = snapshot.scopesLength; + this.pos = snapshot.pos; + this.type = snapshot.type; + this.contextualKeyword = snapshot.contextualKeyword; + this.start = snapshot.start; + this.end = snapshot.end; + this.isType = snapshot.isType; + this.scopeDepth = snapshot.scopeDepth; + this.error = snapshot.error; + } +}; + +// node_modules/sucrase/dist/esm/parser/util/charcodes.js +var charCodes; +(function(charCodes2) { + const backSpace = 8; + charCodes2[charCodes2["backSpace"] = backSpace] = "backSpace"; + const lineFeed = 10; + charCodes2[charCodes2["lineFeed"] = lineFeed] = "lineFeed"; + const carriageReturn = 13; + charCodes2[charCodes2["carriageReturn"] = carriageReturn] = "carriageReturn"; + const shiftOut = 14; + charCodes2[charCodes2["shiftOut"] = shiftOut] = "shiftOut"; + const space = 32; + charCodes2[charCodes2["space"] = space] = "space"; + const exclamationMark = 33; + charCodes2[charCodes2["exclamationMark"] = exclamationMark] = "exclamationMark"; + const quotationMark = 34; + charCodes2[charCodes2["quotationMark"] = quotationMark] = "quotationMark"; + const numberSign = 35; + charCodes2[charCodes2["numberSign"] = numberSign] = "numberSign"; + const dollarSign = 36; + charCodes2[charCodes2["dollarSign"] = dollarSign] = "dollarSign"; + const percentSign = 37; + charCodes2[charCodes2["percentSign"] = percentSign] = "percentSign"; + const ampersand = 38; + charCodes2[charCodes2["ampersand"] = ampersand] = "ampersand"; + const apostrophe = 39; + charCodes2[charCodes2["apostrophe"] = apostrophe] = "apostrophe"; + const leftParenthesis = 40; + charCodes2[charCodes2["leftParenthesis"] = leftParenthesis] = "leftParenthesis"; + const rightParenthesis = 41; + charCodes2[charCodes2["rightParenthesis"] = rightParenthesis] = "rightParenthesis"; + const asterisk = 42; + charCodes2[charCodes2["asterisk"] = asterisk] = "asterisk"; + const plusSign = 43; + charCodes2[charCodes2["plusSign"] = plusSign] = "plusSign"; + const comma = 44; + charCodes2[charCodes2["comma"] = comma] = "comma"; + const dash = 45; + charCodes2[charCodes2["dash"] = dash] = "dash"; + const dot = 46; + charCodes2[charCodes2["dot"] = dot] = "dot"; + const slash = 47; + charCodes2[charCodes2["slash"] = slash] = "slash"; + const digit0 = 48; + charCodes2[charCodes2["digit0"] = digit0] = "digit0"; + const digit1 = 49; + charCodes2[charCodes2["digit1"] = digit1] = "digit1"; + const digit2 = 50; + charCodes2[charCodes2["digit2"] = digit2] = "digit2"; + const digit3 = 51; + charCodes2[charCodes2["digit3"] = digit3] = "digit3"; + const digit4 = 52; + charCodes2[charCodes2["digit4"] = digit4] = "digit4"; + const digit5 = 53; + charCodes2[charCodes2["digit5"] = digit5] = "digit5"; + const digit6 = 54; + charCodes2[charCodes2["digit6"] = digit6] = "digit6"; + const digit7 = 55; + charCodes2[charCodes2["digit7"] = digit7] = "digit7"; + const digit8 = 56; + charCodes2[charCodes2["digit8"] = digit8] = "digit8"; + const digit9 = 57; + charCodes2[charCodes2["digit9"] = digit9] = "digit9"; + const colon = 58; + charCodes2[charCodes2["colon"] = colon] = "colon"; + const semicolon2 = 59; + charCodes2[charCodes2["semicolon"] = semicolon2] = "semicolon"; + const lessThan = 60; + charCodes2[charCodes2["lessThan"] = lessThan] = "lessThan"; + const equalsTo = 61; + charCodes2[charCodes2["equalsTo"] = equalsTo] = "equalsTo"; + const greaterThan = 62; + charCodes2[charCodes2["greaterThan"] = greaterThan] = "greaterThan"; + const questionMark = 63; + charCodes2[charCodes2["questionMark"] = questionMark] = "questionMark"; + const atSign = 64; + charCodes2[charCodes2["atSign"] = atSign] = "atSign"; + const uppercaseA = 65; + charCodes2[charCodes2["uppercaseA"] = uppercaseA] = "uppercaseA"; + const uppercaseB = 66; + charCodes2[charCodes2["uppercaseB"] = uppercaseB] = "uppercaseB"; + const uppercaseC = 67; + charCodes2[charCodes2["uppercaseC"] = uppercaseC] = "uppercaseC"; + const uppercaseD = 68; + charCodes2[charCodes2["uppercaseD"] = uppercaseD] = "uppercaseD"; + const uppercaseE = 69; + charCodes2[charCodes2["uppercaseE"] = uppercaseE] = "uppercaseE"; + const uppercaseF = 70; + charCodes2[charCodes2["uppercaseF"] = uppercaseF] = "uppercaseF"; + const uppercaseG = 71; + charCodes2[charCodes2["uppercaseG"] = uppercaseG] = "uppercaseG"; + const uppercaseH = 72; + charCodes2[charCodes2["uppercaseH"] = uppercaseH] = "uppercaseH"; + const uppercaseI = 73; + charCodes2[charCodes2["uppercaseI"] = uppercaseI] = "uppercaseI"; + const uppercaseJ = 74; + charCodes2[charCodes2["uppercaseJ"] = uppercaseJ] = "uppercaseJ"; + const uppercaseK = 75; + charCodes2[charCodes2["uppercaseK"] = uppercaseK] = "uppercaseK"; + const uppercaseL = 76; + charCodes2[charCodes2["uppercaseL"] = uppercaseL] = "uppercaseL"; + const uppercaseM = 77; + charCodes2[charCodes2["uppercaseM"] = uppercaseM] = "uppercaseM"; + const uppercaseN = 78; + charCodes2[charCodes2["uppercaseN"] = uppercaseN] = "uppercaseN"; + const uppercaseO = 79; + charCodes2[charCodes2["uppercaseO"] = uppercaseO] = "uppercaseO"; + const uppercaseP = 80; + charCodes2[charCodes2["uppercaseP"] = uppercaseP] = "uppercaseP"; + const uppercaseQ = 81; + charCodes2[charCodes2["uppercaseQ"] = uppercaseQ] = "uppercaseQ"; + const uppercaseR = 82; + charCodes2[charCodes2["uppercaseR"] = uppercaseR] = "uppercaseR"; + const uppercaseS = 83; + charCodes2[charCodes2["uppercaseS"] = uppercaseS] = "uppercaseS"; + const uppercaseT = 84; + charCodes2[charCodes2["uppercaseT"] = uppercaseT] = "uppercaseT"; + const uppercaseU = 85; + charCodes2[charCodes2["uppercaseU"] = uppercaseU] = "uppercaseU"; + const uppercaseV = 86; + charCodes2[charCodes2["uppercaseV"] = uppercaseV] = "uppercaseV"; + const uppercaseW = 87; + charCodes2[charCodes2["uppercaseW"] = uppercaseW] = "uppercaseW"; + const uppercaseX = 88; + charCodes2[charCodes2["uppercaseX"] = uppercaseX] = "uppercaseX"; + const uppercaseY = 89; + charCodes2[charCodes2["uppercaseY"] = uppercaseY] = "uppercaseY"; + const uppercaseZ = 90; + charCodes2[charCodes2["uppercaseZ"] = uppercaseZ] = "uppercaseZ"; + const leftSquareBracket = 91; + charCodes2[charCodes2["leftSquareBracket"] = leftSquareBracket] = "leftSquareBracket"; + const backslash = 92; + charCodes2[charCodes2["backslash"] = backslash] = "backslash"; + const rightSquareBracket = 93; + charCodes2[charCodes2["rightSquareBracket"] = rightSquareBracket] = "rightSquareBracket"; + const caret = 94; + charCodes2[charCodes2["caret"] = caret] = "caret"; + const underscore = 95; + charCodes2[charCodes2["underscore"] = underscore] = "underscore"; + const graveAccent = 96; + charCodes2[charCodes2["graveAccent"] = graveAccent] = "graveAccent"; + const lowercaseA = 97; + charCodes2[charCodes2["lowercaseA"] = lowercaseA] = "lowercaseA"; + const lowercaseB = 98; + charCodes2[charCodes2["lowercaseB"] = lowercaseB] = "lowercaseB"; + const lowercaseC = 99; + charCodes2[charCodes2["lowercaseC"] = lowercaseC] = "lowercaseC"; + const lowercaseD = 100; + charCodes2[charCodes2["lowercaseD"] = lowercaseD] = "lowercaseD"; + const lowercaseE = 101; + charCodes2[charCodes2["lowercaseE"] = lowercaseE] = "lowercaseE"; + const lowercaseF = 102; + charCodes2[charCodes2["lowercaseF"] = lowercaseF] = "lowercaseF"; + const lowercaseG = 103; + charCodes2[charCodes2["lowercaseG"] = lowercaseG] = "lowercaseG"; + const lowercaseH = 104; + charCodes2[charCodes2["lowercaseH"] = lowercaseH] = "lowercaseH"; + const lowercaseI = 105; + charCodes2[charCodes2["lowercaseI"] = lowercaseI] = "lowercaseI"; + const lowercaseJ = 106; + charCodes2[charCodes2["lowercaseJ"] = lowercaseJ] = "lowercaseJ"; + const lowercaseK = 107; + charCodes2[charCodes2["lowercaseK"] = lowercaseK] = "lowercaseK"; + const lowercaseL = 108; + charCodes2[charCodes2["lowercaseL"] = lowercaseL] = "lowercaseL"; + const lowercaseM = 109; + charCodes2[charCodes2["lowercaseM"] = lowercaseM] = "lowercaseM"; + const lowercaseN = 110; + charCodes2[charCodes2["lowercaseN"] = lowercaseN] = "lowercaseN"; + const lowercaseO = 111; + charCodes2[charCodes2["lowercaseO"] = lowercaseO] = "lowercaseO"; + const lowercaseP = 112; + charCodes2[charCodes2["lowercaseP"] = lowercaseP] = "lowercaseP"; + const lowercaseQ = 113; + charCodes2[charCodes2["lowercaseQ"] = lowercaseQ] = "lowercaseQ"; + const lowercaseR = 114; + charCodes2[charCodes2["lowercaseR"] = lowercaseR] = "lowercaseR"; + const lowercaseS = 115; + charCodes2[charCodes2["lowercaseS"] = lowercaseS] = "lowercaseS"; + const lowercaseT = 116; + charCodes2[charCodes2["lowercaseT"] = lowercaseT] = "lowercaseT"; + const lowercaseU = 117; + charCodes2[charCodes2["lowercaseU"] = lowercaseU] = "lowercaseU"; + const lowercaseV = 118; + charCodes2[charCodes2["lowercaseV"] = lowercaseV] = "lowercaseV"; + const lowercaseW = 119; + charCodes2[charCodes2["lowercaseW"] = lowercaseW] = "lowercaseW"; + const lowercaseX = 120; + charCodes2[charCodes2["lowercaseX"] = lowercaseX] = "lowercaseX"; + const lowercaseY = 121; + charCodes2[charCodes2["lowercaseY"] = lowercaseY] = "lowercaseY"; + const lowercaseZ = 122; + charCodes2[charCodes2["lowercaseZ"] = lowercaseZ] = "lowercaseZ"; + const leftCurlyBrace = 123; + charCodes2[charCodes2["leftCurlyBrace"] = leftCurlyBrace] = "leftCurlyBrace"; + const verticalBar = 124; + charCodes2[charCodes2["verticalBar"] = verticalBar] = "verticalBar"; + const rightCurlyBrace = 125; + charCodes2[charCodes2["rightCurlyBrace"] = rightCurlyBrace] = "rightCurlyBrace"; + const tilde = 126; + charCodes2[charCodes2["tilde"] = tilde] = "tilde"; + const nonBreakingSpace = 160; + charCodes2[charCodes2["nonBreakingSpace"] = nonBreakingSpace] = "nonBreakingSpace"; + const oghamSpaceMark = 5760; + charCodes2[charCodes2["oghamSpaceMark"] = oghamSpaceMark] = "oghamSpaceMark"; + const lineSeparator = 8232; + charCodes2[charCodes2["lineSeparator"] = lineSeparator] = "lineSeparator"; + const paragraphSeparator = 8233; + charCodes2[charCodes2["paragraphSeparator"] = paragraphSeparator] = "paragraphSeparator"; +})(charCodes || (charCodes = {})); + +// node_modules/sucrase/dist/esm/parser/traverser/base.js +var isJSXEnabled; +var isTypeScriptEnabled; +var isFlowEnabled; +var state; +var input; +var nextContextId; +function getNextContextId() { + return nextContextId++; +} +function augmentError(error) { + if ("pos" in error) { + const loc = locationForIndex(error.pos); + error.message += ` (${loc.line}:${loc.column})`; + error.loc = loc; + } + return error; +} +var Loc = class { + constructor(line, column) { + this.line = line; + this.column = column; + } +}; +function locationForIndex(pos) { + let line = 1; + let column = 1; + for (let i = 0; i < pos; i++) { + if (input.charCodeAt(i) === charCodes.lineFeed) { + line++; + column = 1; + } else { + column++; + } + } + return new Loc(line, column); +} +function initParser(inputCode, isJSXEnabledArg, isTypeScriptEnabledArg, isFlowEnabledArg) { + input = inputCode; + state = new State(); + nextContextId = 1; + isJSXEnabled = isJSXEnabledArg; + isTypeScriptEnabled = isTypeScriptEnabledArg; + isFlowEnabled = isFlowEnabledArg; +} + +// node_modules/sucrase/dist/esm/parser/traverser/util.js +function isContextual(contextualKeyword) { + return state.contextualKeyword === contextualKeyword; +} +function isLookaheadContextual(contextualKeyword) { + const l = lookaheadTypeAndKeyword(); + return l.type === TokenType.name && l.contextualKeyword === contextualKeyword; +} +function eatContextual(contextualKeyword) { + return state.contextualKeyword === contextualKeyword && eat(TokenType.name); +} +function expectContextual(contextualKeyword) { + if (!eatContextual(contextualKeyword)) { + unexpected(); + } +} +function canInsertSemicolon() { + return match(TokenType.eof) || match(TokenType.braceR) || hasPrecedingLineBreak(); +} +function hasPrecedingLineBreak() { + const prevToken = state.tokens[state.tokens.length - 1]; + const lastTokEnd = prevToken ? prevToken.end : 0; + for (let i = lastTokEnd; i < state.start; i++) { + const code = input.charCodeAt(i); + if (code === charCodes.lineFeed || code === charCodes.carriageReturn || code === 8232 || code === 8233) { + return true; + } + } + return false; +} +function hasFollowingLineBreak() { + const nextStart = nextTokenStart(); + for (let i = state.end; i < nextStart; i++) { + const code = input.charCodeAt(i); + if (code === charCodes.lineFeed || code === charCodes.carriageReturn || code === 8232 || code === 8233) { + return true; + } + } + return false; +} +function isLineTerminator() { + return eat(TokenType.semi) || canInsertSemicolon(); +} +function semicolon() { + if (!isLineTerminator()) { + unexpected('Unexpected token, expected ";"'); + } +} +function expect(type) { + const matched = eat(type); + if (!matched) { + unexpected(`Unexpected token, expected "${formatTokenType(type)}"`); + } +} +function unexpected(message = "Unexpected token", pos = state.start) { + if (state.error) { + return; + } + const err = new SyntaxError(message); + err.pos = pos; + state.error = err; + state.pos = input.length; + finishToken(TokenType.eof); +} + +// node_modules/sucrase/dist/esm/parser/util/whitespace.js +var WHITESPACE_CHARS = [ + 9, + 11, + 12, + charCodes.space, + charCodes.nonBreakingSpace, + charCodes.oghamSpaceMark, + 8192, + 8193, + 8194, + 8195, + 8196, + 8197, + 8198, + 8199, + 8200, + 8201, + 8202, + 8239, + 8287, + 12288, + 65279 +]; +var skipWhiteSpace = /(?:\s|\/\/.*|\/\*[^]*?\*\/)*/g; +var IS_WHITESPACE = new Uint8Array(65536); +for (const char of WHITESPACE_CHARS) { + IS_WHITESPACE[char] = 1; +} + +// node_modules/sucrase/dist/esm/parser/util/identifier.js +function computeIsIdentifierChar(code) { + if (code < 48) + return code === 36; + if (code < 58) + return true; + if (code < 65) + return false; + if (code < 91) + return true; + if (code < 97) + return code === 95; + if (code < 123) + return true; + if (code < 128) + return false; + throw new Error("Should not be called with non-ASCII char code."); +} +var IS_IDENTIFIER_CHAR = new Uint8Array(65536); +for (let i = 0; i < 128; i++) { + IS_IDENTIFIER_CHAR[i] = computeIsIdentifierChar(i) ? 1 : 0; +} +for (let i = 128; i < 65536; i++) { + IS_IDENTIFIER_CHAR[i] = 1; +} +for (const whitespaceChar of WHITESPACE_CHARS) { + IS_IDENTIFIER_CHAR[whitespaceChar] = 0; +} +IS_IDENTIFIER_CHAR[8232] = 0; +IS_IDENTIFIER_CHAR[8233] = 0; +var IS_IDENTIFIER_START = IS_IDENTIFIER_CHAR.slice(); +for (let numChar = charCodes.digit0; numChar <= charCodes.digit9; numChar++) { + IS_IDENTIFIER_START[numChar] = 0; +} + +// node_modules/sucrase/dist/esm/parser/tokenizer/readWordTree.js +var READ_WORD_TREE = new Int32Array([ + -1, + 27, + 594, + 729, + 1566, + 2187, + 2673, + 3294, + -1, + 3510, + -1, + 4428, + 4563, + 4644, + 4941, + 5319, + 5697, + -1, + 6237, + 6696, + 7290, + 7722, + 7884, + 8046, + -1, + 8262, + -1, + -1, + -1, + 54, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 243, + -1, + -1, + -1, + 486, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 81, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 108, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 135, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 162, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 189, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 216, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._abstract << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._as << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 270, + -1, + -1, + -1, + -1, + -1, + 405, + -1, + -1, + -1, + -1, + -1, + -1, + 297, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 324, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 351, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 378, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._asserts << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 432, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 459, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._async << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 513, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 540, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 567, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._await << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 621, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 648, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 675, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 702, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._break << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 756, + -1, + -1, + -1, + -1, + -1, + -1, + 918, + -1, + -1, + -1, + 1053, + -1, + -1, + 1161, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 783, + 837, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 810, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._case << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 864, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 891, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._catch << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 945, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 972, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 999, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1026, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._checks << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1080, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1107, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1134, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._class << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1188, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1215, + 1431, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1242, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._const << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1269, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1296, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1323, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1350, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1377, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1404, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._constructor << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1458, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1485, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1512, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1539, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._continue << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1593, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2160, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1620, + 1782, + -1, + -1, + 1917, + -1, + -1, + -1, + -1, + -1, + 2052, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1647, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1674, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1701, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1728, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1755, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._debugger << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1809, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1836, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1863, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1890, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._declare << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1944, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1971, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 1998, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2025, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._default << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2079, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2106, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2133, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._delete << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._do << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2214, + -1, + 2295, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2376, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2241, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2268, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._else << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2322, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2349, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._enum << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2403, + -1, + -1, + -1, + 2538, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2430, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2457, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2484, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._export << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2511, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._exports << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2565, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2592, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2619, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2646, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._extends << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2700, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2808, + -1, + -1, + -1, + -1, + -1, + 2970, + -1, + -1, + 3024, + -1, + -1, + 3105, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2727, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2754, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2781, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._false << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2835, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2862, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2889, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2916, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2943, + -1, + (TokenType._finally << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 2997, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._for << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3051, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3078, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._from << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3132, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3159, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3186, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3213, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3240, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3267, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._function << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3321, + -1, + -1, + -1, + -1, + -1, + -1, + 3375, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3348, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._get << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3402, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3429, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3456, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3483, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._global << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3537, + -1, + -1, + -1, + -1, + -1, + -1, + 3564, + 3888, + -1, + -1, + -1, + -1, + 4401, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._if << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3591, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3618, + -1, + -1, + 3807, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3645, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3672, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3699, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3726, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3753, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3780, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._implements << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3834, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3861, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._import << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._in << 1) + 1, + -1, + -1, + -1, + -1, + -1, + 3915, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3996, + 4212, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3942, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 3969, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._infer << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4023, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4050, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4077, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4104, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4131, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4158, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4185, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._instanceof << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4239, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4266, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4293, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4320, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4347, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4374, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._interface << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._is << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4455, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4482, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4509, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4536, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._keyof << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4590, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4617, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._let << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4671, + -1, + -1, + -1, + -1, + -1, + 4806, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4698, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4725, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4752, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4779, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._mixins << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4833, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4860, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4887, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4914, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._module << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4968, + -1, + -1, + -1, + 5184, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5238, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 4995, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5022, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5049, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5076, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5103, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5130, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5157, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._namespace << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5211, + -1, + -1, + -1, + (TokenType._new << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5265, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5292, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._null << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5346, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5373, + -1, + -1, + -1, + -1, + -1, + 5508, + -1, + -1, + -1, + -1, + ContextualKeyword._of << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5400, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5427, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5454, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5481, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._opaque << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5535, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5562, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5589, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5616, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5643, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5670, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._override << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5724, + -1, + -1, + 6102, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5751, + -1, + -1, + -1, + -1, + -1, + 5886, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5778, + -1, + -1, + -1, + -1, + -1, + 5805, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5832, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5859, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._private << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5913, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5940, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6075, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5967, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 5994, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6021, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6048, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._protected << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._proto << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6129, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6156, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6183, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6210, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._public << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6264, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6291, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6453, + -1, + -1, + 6588, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6318, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6345, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6372, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6399, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6426, + -1, + ContextualKeyword._readonly << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6480, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6507, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6534, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6561, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._require << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6615, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6642, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6669, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._return << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6723, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6777, + 6912, + -1, + 7020, + -1, + 7155, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6750, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._set << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6804, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6831, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6858, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6885, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._static << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6939, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6966, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 6993, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._super << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7047, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7074, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7101, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7128, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._switch << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7182, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7209, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7236, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7263, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._symbol << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7317, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7479, + -1, + -1, + -1, + -1, + -1, + -1, + 7587, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7344, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7398, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7371, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._this << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7425, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7452, + -1, + -1, + -1, + (TokenType._throw << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7506, + -1, + -1, + -1, + 7560, + -1, + -1, + -1, + -1, + -1, + -1, + 7533, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._true << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._try << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7614, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7641, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._type << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7668, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7695, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._typeof << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7749, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7776, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7803, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7830, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7857, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + ContextualKeyword._unique << 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7911, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7965, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7938, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._var << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 7992, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 8019, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._void << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 8073, + 8181, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 8100, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 8127, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 8154, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._while << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 8208, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 8235, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._with << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 8289, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 8316, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 8343, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + 8370, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + (TokenType._yield << 1) + 1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1, + -1 +]); + +// node_modules/sucrase/dist/esm/parser/tokenizer/readWord.js +function readWord() { + let treePos = 0; + let code = 0; + let pos = state.pos; + while (pos < input.length) { + code = input.charCodeAt(pos); + if (code < charCodes.lowercaseA || code > charCodes.lowercaseZ) { + break; + } + const next2 = READ_WORD_TREE[treePos + (code - charCodes.lowercaseA) + 1]; + if (next2 === -1) { + break; + } else { + treePos = next2; + pos++; + } + } + const keywordValue = READ_WORD_TREE[treePos]; + if (keywordValue > -1 && !IS_IDENTIFIER_CHAR[code]) { + state.pos = pos; + if (keywordValue & 1) { + finishToken(keywordValue >>> 1); + } else { + finishToken(TokenType.name, keywordValue >>> 1); + } + return; + } + while (pos < input.length) { + const ch = input.charCodeAt(pos); + if (IS_IDENTIFIER_CHAR[ch]) { + pos++; + } else if (ch === charCodes.backslash) { + pos += 2; + if (input.charCodeAt(pos) === charCodes.leftCurlyBrace) { + while (pos < input.length && input.charCodeAt(pos) !== charCodes.rightCurlyBrace) { + pos++; + } + pos++; + } + } else if (ch === charCodes.atSign && input.charCodeAt(pos + 1) === charCodes.atSign) { + pos += 2; + } else { + break; + } + } + state.pos = pos; + finishToken(TokenType.name); +} + +// node_modules/sucrase/dist/esm/parser/tokenizer/index.js +var IdentifierRole; +(function(IdentifierRole2) { + const Access = 0; + IdentifierRole2[IdentifierRole2["Access"] = Access] = "Access"; + const ExportAccess = Access + 1; + IdentifierRole2[IdentifierRole2["ExportAccess"] = ExportAccess] = "ExportAccess"; + const TopLevelDeclaration = ExportAccess + 1; + IdentifierRole2[IdentifierRole2["TopLevelDeclaration"] = TopLevelDeclaration] = "TopLevelDeclaration"; + const FunctionScopedDeclaration = TopLevelDeclaration + 1; + IdentifierRole2[IdentifierRole2["FunctionScopedDeclaration"] = FunctionScopedDeclaration] = "FunctionScopedDeclaration"; + const BlockScopedDeclaration = FunctionScopedDeclaration + 1; + IdentifierRole2[IdentifierRole2["BlockScopedDeclaration"] = BlockScopedDeclaration] = "BlockScopedDeclaration"; + const ObjectShorthandTopLevelDeclaration = BlockScopedDeclaration + 1; + IdentifierRole2[IdentifierRole2["ObjectShorthandTopLevelDeclaration"] = ObjectShorthandTopLevelDeclaration] = "ObjectShorthandTopLevelDeclaration"; + const ObjectShorthandFunctionScopedDeclaration = ObjectShorthandTopLevelDeclaration + 1; + IdentifierRole2[IdentifierRole2["ObjectShorthandFunctionScopedDeclaration"] = ObjectShorthandFunctionScopedDeclaration] = "ObjectShorthandFunctionScopedDeclaration"; + const ObjectShorthandBlockScopedDeclaration = ObjectShorthandFunctionScopedDeclaration + 1; + IdentifierRole2[IdentifierRole2["ObjectShorthandBlockScopedDeclaration"] = ObjectShorthandBlockScopedDeclaration] = "ObjectShorthandBlockScopedDeclaration"; + const ObjectShorthand = ObjectShorthandBlockScopedDeclaration + 1; + IdentifierRole2[IdentifierRole2["ObjectShorthand"] = ObjectShorthand] = "ObjectShorthand"; + const ImportDeclaration = ObjectShorthand + 1; + IdentifierRole2[IdentifierRole2["ImportDeclaration"] = ImportDeclaration] = "ImportDeclaration"; + const ObjectKey = ImportDeclaration + 1; + IdentifierRole2[IdentifierRole2["ObjectKey"] = ObjectKey] = "ObjectKey"; + const ImportAccess = ObjectKey + 1; + IdentifierRole2[IdentifierRole2["ImportAccess"] = ImportAccess] = "ImportAccess"; +})(IdentifierRole || (IdentifierRole = {})); +function isDeclaration(token) { + const role = token.identifierRole; + return role === IdentifierRole.TopLevelDeclaration || role === IdentifierRole.FunctionScopedDeclaration || role === IdentifierRole.BlockScopedDeclaration || role === IdentifierRole.ObjectShorthandTopLevelDeclaration || role === IdentifierRole.ObjectShorthandFunctionScopedDeclaration || role === IdentifierRole.ObjectShorthandBlockScopedDeclaration; +} +function isNonTopLevelDeclaration(token) { + const role = token.identifierRole; + return role === IdentifierRole.FunctionScopedDeclaration || role === IdentifierRole.BlockScopedDeclaration || role === IdentifierRole.ObjectShorthandFunctionScopedDeclaration || role === IdentifierRole.ObjectShorthandBlockScopedDeclaration; +} +function isTopLevelDeclaration(token) { + const role = token.identifierRole; + return role === IdentifierRole.TopLevelDeclaration || role === IdentifierRole.ObjectShorthandTopLevelDeclaration || role === IdentifierRole.ImportDeclaration; +} +function isBlockScopedDeclaration(token) { + const role = token.identifierRole; + return role === IdentifierRole.TopLevelDeclaration || role === IdentifierRole.BlockScopedDeclaration || role === IdentifierRole.ObjectShorthandTopLevelDeclaration || role === IdentifierRole.ObjectShorthandBlockScopedDeclaration; +} +function isFunctionScopedDeclaration(token) { + const role = token.identifierRole; + return role === IdentifierRole.FunctionScopedDeclaration || role === IdentifierRole.ObjectShorthandFunctionScopedDeclaration; +} +function isObjectShorthandDeclaration(token) { + return token.identifierRole === IdentifierRole.ObjectShorthandTopLevelDeclaration || token.identifierRole === IdentifierRole.ObjectShorthandBlockScopedDeclaration || token.identifierRole === IdentifierRole.ObjectShorthandFunctionScopedDeclaration; +} +var Token = class { + constructor() { + this.type = state.type; + this.contextualKeyword = state.contextualKeyword; + this.start = state.start; + this.end = state.end; + this.scopeDepth = state.scopeDepth; + this.isType = state.isType; + this.identifierRole = null; + this.shadowsGlobal = false; + this.isAsyncOperation = false; + this.contextId = null; + this.rhsEndIndex = null; + this.isExpression = false; + this.numNullishCoalesceStarts = 0; + this.numNullishCoalesceEnds = 0; + this.isOptionalChainStart = false; + this.isOptionalChainEnd = false; + this.subscriptStartIndex = null; + this.nullishStartIndex = null; + } +}; +function next() { + state.tokens.push(new Token()); + nextToken(); +} +function nextTemplateToken() { + state.tokens.push(new Token()); + state.start = state.pos; + readTmplToken(); +} +function retokenizeSlashAsRegex() { + if (state.type === TokenType.assign) { + --state.pos; + } + readRegexp(); +} +function pushTypeContext(existingTokensInType) { + for (let i = state.tokens.length - existingTokensInType; i < state.tokens.length; i++) { + state.tokens[i].isType = true; + } + const oldIsType = state.isType; + state.isType = true; + return oldIsType; +} +function popTypeContext(oldIsType) { + state.isType = oldIsType; +} +function eat(type) { + if (match(type)) { + next(); + return true; + } else { + return false; + } +} +function eatTypeToken(tokenType) { + const oldIsType = state.isType; + state.isType = true; + eat(tokenType); + state.isType = oldIsType; +} +function match(type) { + return state.type === type; +} +function lookaheadType() { + const snapshot = state.snapshot(); + next(); + const type = state.type; + state.restoreFromSnapshot(snapshot); + return type; +} +var TypeAndKeyword = class { + constructor(type, contextualKeyword) { + this.type = type; + this.contextualKeyword = contextualKeyword; + } +}; +function lookaheadTypeAndKeyword() { + const snapshot = state.snapshot(); + next(); + const type = state.type; + const contextualKeyword = state.contextualKeyword; + state.restoreFromSnapshot(snapshot); + return new TypeAndKeyword(type, contextualKeyword); +} +function nextTokenStart() { + return nextTokenStartSince(state.pos); +} +function nextTokenStartSince(pos) { + skipWhiteSpace.lastIndex = pos; + const skip = skipWhiteSpace.exec(input); + return pos + skip[0].length; +} +function lookaheadCharCode() { + return input.charCodeAt(nextTokenStart()); +} +function nextToken() { + skipSpace(); + state.start = state.pos; + if (state.pos >= input.length) { + const tokens = state.tokens; + if (tokens.length >= 2 && tokens[tokens.length - 1].start >= input.length && tokens[tokens.length - 2].start >= input.length) { + unexpected("Unexpectedly reached the end of input."); + } + finishToken(TokenType.eof); + return; + } + readToken(input.charCodeAt(state.pos)); +} +function readToken(code) { + if (IS_IDENTIFIER_START[code] || code === charCodes.backslash || code === charCodes.atSign && input.charCodeAt(state.pos + 1) === charCodes.atSign) { + readWord(); + } else { + getTokenFromCode(code); + } +} +function skipBlockComment() { + while (input.charCodeAt(state.pos) !== charCodes.asterisk || input.charCodeAt(state.pos + 1) !== charCodes.slash) { + state.pos++; + if (state.pos > input.length) { + unexpected("Unterminated comment", state.pos - 2); + return; + } + } + state.pos += 2; +} +function skipLineComment(startSkip) { + let ch = input.charCodeAt(state.pos += startSkip); + if (state.pos < input.length) { + while (ch !== charCodes.lineFeed && ch !== charCodes.carriageReturn && ch !== charCodes.lineSeparator && ch !== charCodes.paragraphSeparator && ++state.pos < input.length) { + ch = input.charCodeAt(state.pos); + } + } +} +function skipSpace() { + while (state.pos < input.length) { + const ch = input.charCodeAt(state.pos); + switch (ch) { + case charCodes.carriageReturn: + if (input.charCodeAt(state.pos + 1) === charCodes.lineFeed) { + ++state.pos; + } + case charCodes.lineFeed: + case charCodes.lineSeparator: + case charCodes.paragraphSeparator: + ++state.pos; + break; + case charCodes.slash: + switch (input.charCodeAt(state.pos + 1)) { + case charCodes.asterisk: + state.pos += 2; + skipBlockComment(); + break; + case charCodes.slash: + skipLineComment(2); + break; + default: + return; + } + break; + default: + if (IS_WHITESPACE[ch]) { + ++state.pos; + } else { + return; + } + } + } +} +function finishToken(type, contextualKeyword = ContextualKeyword.NONE) { + state.end = state.pos; + state.type = type; + state.contextualKeyword = contextualKeyword; +} +function readToken_dot() { + const nextChar = input.charCodeAt(state.pos + 1); + if (nextChar >= charCodes.digit0 && nextChar <= charCodes.digit9) { + readNumber(true); + return; + } + if (nextChar === charCodes.dot && input.charCodeAt(state.pos + 2) === charCodes.dot) { + state.pos += 3; + finishToken(TokenType.ellipsis); + } else { + ++state.pos; + finishToken(TokenType.dot); + } +} +function readToken_slash() { + const nextChar = input.charCodeAt(state.pos + 1); + if (nextChar === charCodes.equalsTo) { + finishOp(TokenType.assign, 2); + } else { + finishOp(TokenType.slash, 1); + } +} +function readToken_mult_modulo(code) { + let tokenType = code === charCodes.asterisk ? TokenType.star : TokenType.modulo; + let width = 1; + let nextChar = input.charCodeAt(state.pos + 1); + if (code === charCodes.asterisk && nextChar === charCodes.asterisk) { + width++; + nextChar = input.charCodeAt(state.pos + 2); + tokenType = TokenType.exponent; + } + if (nextChar === charCodes.equalsTo && input.charCodeAt(state.pos + 2) !== charCodes.greaterThan) { + width++; + tokenType = TokenType.assign; + } + finishOp(tokenType, width); +} +function readToken_pipe_amp(code) { + const nextChar = input.charCodeAt(state.pos + 1); + if (nextChar === code) { + if (input.charCodeAt(state.pos + 2) === charCodes.equalsTo) { + finishOp(TokenType.assign, 3); + } else { + finishOp(code === charCodes.verticalBar ? TokenType.logicalOR : TokenType.logicalAND, 2); + } + return; + } + if (code === charCodes.verticalBar) { + if (nextChar === charCodes.greaterThan) { + finishOp(TokenType.pipeline, 2); + return; + } else if (nextChar === charCodes.rightCurlyBrace && isFlowEnabled) { + finishOp(TokenType.braceBarR, 2); + return; + } + } + if (nextChar === charCodes.equalsTo) { + finishOp(TokenType.assign, 2); + return; + } + finishOp(code === charCodes.verticalBar ? TokenType.bitwiseOR : TokenType.bitwiseAND, 1); +} +function readToken_caret() { + const nextChar = input.charCodeAt(state.pos + 1); + if (nextChar === charCodes.equalsTo) { + finishOp(TokenType.assign, 2); + } else { + finishOp(TokenType.bitwiseXOR, 1); + } +} +function readToken_plus_min(code) { + const nextChar = input.charCodeAt(state.pos + 1); + if (nextChar === code) { + finishOp(TokenType.preIncDec, 2); + return; + } + if (nextChar === charCodes.equalsTo) { + finishOp(TokenType.assign, 2); + } else if (code === charCodes.plusSign) { + finishOp(TokenType.plus, 1); + } else { + finishOp(TokenType.minus, 1); + } +} +function readToken_lt_gt(code) { + const nextChar = input.charCodeAt(state.pos + 1); + if (nextChar === code) { + const size = code === charCodes.greaterThan && input.charCodeAt(state.pos + 2) === charCodes.greaterThan ? 3 : 2; + if (input.charCodeAt(state.pos + size) === charCodes.equalsTo) { + finishOp(TokenType.assign, size + 1); + return; + } + if (code === charCodes.greaterThan && state.isType) { + finishOp(TokenType.greaterThan, 1); + return; + } + finishOp(TokenType.bitShift, size); + return; + } + if (nextChar === charCodes.equalsTo) { + finishOp(TokenType.relationalOrEqual, 2); + } else if (code === charCodes.lessThan) { + finishOp(TokenType.lessThan, 1); + } else { + finishOp(TokenType.greaterThan, 1); + } +} +function readToken_eq_excl(code) { + const nextChar = input.charCodeAt(state.pos + 1); + if (nextChar === charCodes.equalsTo) { + finishOp(TokenType.equality, input.charCodeAt(state.pos + 2) === charCodes.equalsTo ? 3 : 2); + return; + } + if (code === charCodes.equalsTo && nextChar === charCodes.greaterThan) { + state.pos += 2; + finishToken(TokenType.arrow); + return; + } + finishOp(code === charCodes.equalsTo ? TokenType.eq : TokenType.bang, 1); +} +function readToken_question() { + const nextChar = input.charCodeAt(state.pos + 1); + const nextChar2 = input.charCodeAt(state.pos + 2); + if (nextChar === charCodes.questionMark && !state.isType) { + if (nextChar2 === charCodes.equalsTo) { + finishOp(TokenType.assign, 3); + } else { + finishOp(TokenType.nullishCoalescing, 2); + } + } else if (nextChar === charCodes.dot && !(nextChar2 >= charCodes.digit0 && nextChar2 <= charCodes.digit9)) { + state.pos += 2; + finishToken(TokenType.questionDot); + } else { + ++state.pos; + finishToken(TokenType.question); + } +} +function getTokenFromCode(code) { + switch (code) { + case charCodes.numberSign: + ++state.pos; + finishToken(TokenType.hash); + return; + case charCodes.dot: + readToken_dot(); + return; + case charCodes.leftParenthesis: + ++state.pos; + finishToken(TokenType.parenL); + return; + case charCodes.rightParenthesis: + ++state.pos; + finishToken(TokenType.parenR); + return; + case charCodes.semicolon: + ++state.pos; + finishToken(TokenType.semi); + return; + case charCodes.comma: + ++state.pos; + finishToken(TokenType.comma); + return; + case charCodes.leftSquareBracket: + ++state.pos; + finishToken(TokenType.bracketL); + return; + case charCodes.rightSquareBracket: + ++state.pos; + finishToken(TokenType.bracketR); + return; + case charCodes.leftCurlyBrace: + if (isFlowEnabled && input.charCodeAt(state.pos + 1) === charCodes.verticalBar) { + finishOp(TokenType.braceBarL, 2); + } else { + ++state.pos; + finishToken(TokenType.braceL); + } + return; + case charCodes.rightCurlyBrace: + ++state.pos; + finishToken(TokenType.braceR); + return; + case charCodes.colon: + if (input.charCodeAt(state.pos + 1) === charCodes.colon) { + finishOp(TokenType.doubleColon, 2); + } else { + ++state.pos; + finishToken(TokenType.colon); + } + return; + case charCodes.questionMark: + readToken_question(); + return; + case charCodes.atSign: + ++state.pos; + finishToken(TokenType.at); + return; + case charCodes.graveAccent: + ++state.pos; + finishToken(TokenType.backQuote); + return; + case charCodes.digit0: { + const nextChar = input.charCodeAt(state.pos + 1); + if (nextChar === charCodes.lowercaseX || nextChar === charCodes.uppercaseX || nextChar === charCodes.lowercaseO || nextChar === charCodes.uppercaseO || nextChar === charCodes.lowercaseB || nextChar === charCodes.uppercaseB) { + readRadixNumber(); + return; + } + } + case charCodes.digit1: + case charCodes.digit2: + case charCodes.digit3: + case charCodes.digit4: + case charCodes.digit5: + case charCodes.digit6: + case charCodes.digit7: + case charCodes.digit8: + case charCodes.digit9: + readNumber(false); + return; + case charCodes.quotationMark: + case charCodes.apostrophe: + readString(code); + return; + case charCodes.slash: + readToken_slash(); + return; + case charCodes.percentSign: + case charCodes.asterisk: + readToken_mult_modulo(code); + return; + case charCodes.verticalBar: + case charCodes.ampersand: + readToken_pipe_amp(code); + return; + case charCodes.caret: + readToken_caret(); + return; + case charCodes.plusSign: + case charCodes.dash: + readToken_plus_min(code); + return; + case charCodes.lessThan: + case charCodes.greaterThan: + readToken_lt_gt(code); + return; + case charCodes.equalsTo: + case charCodes.exclamationMark: + readToken_eq_excl(code); + return; + case charCodes.tilde: + finishOp(TokenType.tilde, 1); + return; + } + unexpected(`Unexpected character '${String.fromCharCode(code)}'`, state.pos); +} +function finishOp(type, size) { + state.pos += size; + finishToken(type); +} +function readRegexp() { + const start = state.pos; + let escaped = false; + let inClass = false; + for (; ; ) { + if (state.pos >= input.length) { + unexpected("Unterminated regular expression", start); + return; + } + const code = input.charCodeAt(state.pos); + if (escaped) { + escaped = false; + } else { + if (code === charCodes.leftSquareBracket) { + inClass = true; + } else if (code === charCodes.rightSquareBracket && inClass) { + inClass = false; + } else if (code === charCodes.slash && !inClass) { + break; + } + escaped = code === charCodes.backslash; + } + ++state.pos; + } + ++state.pos; + skipWord(); + finishToken(TokenType.regexp); +} +function readInt() { + while (true) { + const code = input.charCodeAt(state.pos); + if (code >= charCodes.digit0 && code <= charCodes.digit9 || code === charCodes.underscore) { + state.pos++; + } else { + break; + } + } +} +function readRadixNumber() { + state.pos += 2; + while (true) { + const code = input.charCodeAt(state.pos); + if (code >= charCodes.digit0 && code <= charCodes.digit9 || code >= charCodes.lowercaseA && code <= charCodes.lowercaseF || code >= charCodes.uppercaseA && code <= charCodes.uppercaseF || code === charCodes.underscore) { + state.pos++; + } else { + break; + } + } + const nextChar = input.charCodeAt(state.pos); + if (nextChar === charCodes.lowercaseN) { + ++state.pos; + finishToken(TokenType.bigint); + } else { + finishToken(TokenType.num); + } +} +function readNumber(startsWithDot) { + let isBigInt = false; + let isDecimal = false; + if (!startsWithDot) { + readInt(); + } + let nextChar = input.charCodeAt(state.pos); + if (nextChar === charCodes.dot) { + ++state.pos; + readInt(); + nextChar = input.charCodeAt(state.pos); + } + if (nextChar === charCodes.uppercaseE || nextChar === charCodes.lowercaseE) { + nextChar = input.charCodeAt(++state.pos); + if (nextChar === charCodes.plusSign || nextChar === charCodes.dash) { + ++state.pos; + } + readInt(); + nextChar = input.charCodeAt(state.pos); + } + if (nextChar === charCodes.lowercaseN) { + ++state.pos; + isBigInt = true; + } else if (nextChar === charCodes.lowercaseM) { + ++state.pos; + isDecimal = true; + } + if (isBigInt) { + finishToken(TokenType.bigint); + return; + } + if (isDecimal) { + finishToken(TokenType.decimal); + return; + } + finishToken(TokenType.num); +} +function readString(quote) { + state.pos++; + for (; ; ) { + if (state.pos >= input.length) { + unexpected("Unterminated string constant"); + return; + } + const ch = input.charCodeAt(state.pos); + if (ch === charCodes.backslash) { + state.pos++; + } else if (ch === quote) { + break; + } + state.pos++; + } + state.pos++; + finishToken(TokenType.string); +} +function readTmplToken() { + for (; ; ) { + if (state.pos >= input.length) { + unexpected("Unterminated template"); + return; + } + const ch = input.charCodeAt(state.pos); + if (ch === charCodes.graveAccent || ch === charCodes.dollarSign && input.charCodeAt(state.pos + 1) === charCodes.leftCurlyBrace) { + if (state.pos === state.start && match(TokenType.template)) { + if (ch === charCodes.dollarSign) { + state.pos += 2; + finishToken(TokenType.dollarBraceL); + return; + } else { + ++state.pos; + finishToken(TokenType.backQuote); + return; + } + } + finishToken(TokenType.template); + return; + } + if (ch === charCodes.backslash) { + state.pos++; + } + state.pos++; + } +} +function skipWord() { + while (state.pos < input.length) { + const ch = input.charCodeAt(state.pos); + if (IS_IDENTIFIER_CHAR[ch]) { + state.pos++; + } else if (ch === charCodes.backslash) { + state.pos += 2; + if (input.charCodeAt(state.pos) === charCodes.leftCurlyBrace) { + while (state.pos < input.length && input.charCodeAt(state.pos) !== charCodes.rightCurlyBrace) { + state.pos++; + } + state.pos++; + } + } else { + break; + } + } +} + +// node_modules/sucrase/dist/esm/util/getImportExportSpecifierInfo.js +function getImportExportSpecifierInfo(tokens, index = tokens.currentIndex()) { + let endIndex = index + 1; + if (isSpecifierEnd(tokens, endIndex)) { + const name = tokens.identifierNameAtIndex(index); + return { + isType: false, + leftName: name, + rightName: name, + endIndex + }; + } + endIndex++; + if (isSpecifierEnd(tokens, endIndex)) { + return { + isType: true, + leftName: null, + rightName: null, + endIndex + }; + } + endIndex++; + if (isSpecifierEnd(tokens, endIndex)) { + return { + isType: false, + leftName: tokens.identifierNameAtIndex(index), + rightName: tokens.identifierNameAtIndex(index + 2), + endIndex + }; + } + endIndex++; + if (isSpecifierEnd(tokens, endIndex)) { + return { + isType: true, + leftName: null, + rightName: null, + endIndex + }; + } + throw new Error(`Unexpected import/export specifier at ${index}`); +} +function isSpecifierEnd(tokens, index) { + const token = tokens.tokens[index]; + return token.type === TokenType.braceR || token.type === TokenType.comma; +} + +// node_modules/sucrase/dist/esm/parser/plugins/jsx/xhtml.js +var entities = { + quot: '"', + amp: "&", + apos: "'", + lt: "<", + gt: ">", + nbsp: "\xA0", + iexcl: "\xA1", + cent: "\xA2", + pound: "\xA3", + curren: "\xA4", + yen: "\xA5", + brvbar: "\xA6", + sect: "\xA7", + uml: "\xA8", + copy: "\xA9", + ordf: "\xAA", + laquo: "\xAB", + not: "\xAC", + shy: "\xAD", + reg: "\xAE", + macr: "\xAF", + deg: "\xB0", + plusmn: "\xB1", + sup2: "\xB2", + sup3: "\xB3", + acute: "\xB4", + micro: "\xB5", + para: "\xB6", + middot: "\xB7", + cedil: "\xB8", + sup1: "\xB9", + ordm: "\xBA", + raquo: "\xBB", + frac14: "\xBC", + frac12: "\xBD", + frac34: "\xBE", + iquest: "\xBF", + Agrave: "\xC0", + Aacute: "\xC1", + Acirc: "\xC2", + Atilde: "\xC3", + Auml: "\xC4", + Aring: "\xC5", + AElig: "\xC6", + Ccedil: "\xC7", + Egrave: "\xC8", + Eacute: "\xC9", + Ecirc: "\xCA", + Euml: "\xCB", + Igrave: "\xCC", + Iacute: "\xCD", + Icirc: "\xCE", + Iuml: "\xCF", + ETH: "\xD0", + Ntilde: "\xD1", + Ograve: "\xD2", + Oacute: "\xD3", + Ocirc: "\xD4", + Otilde: "\xD5", + Ouml: "\xD6", + times: "\xD7", + Oslash: "\xD8", + Ugrave: "\xD9", + Uacute: "\xDA", + Ucirc: "\xDB", + Uuml: "\xDC", + Yacute: "\xDD", + THORN: "\xDE", + szlig: "\xDF", + agrave: "\xE0", + aacute: "\xE1", + acirc: "\xE2", + atilde: "\xE3", + auml: "\xE4", + aring: "\xE5", + aelig: "\xE6", + ccedil: "\xE7", + egrave: "\xE8", + eacute: "\xE9", + ecirc: "\xEA", + euml: "\xEB", + igrave: "\xEC", + iacute: "\xED", + icirc: "\xEE", + iuml: "\xEF", + eth: "\xF0", + ntilde: "\xF1", + ograve: "\xF2", + oacute: "\xF3", + ocirc: "\xF4", + otilde: "\xF5", + ouml: "\xF6", + divide: "\xF7", + oslash: "\xF8", + ugrave: "\xF9", + uacute: "\xFA", + ucirc: "\xFB", + uuml: "\xFC", + yacute: "\xFD", + thorn: "\xFE", + yuml: "\xFF", + OElig: "\u0152", + oelig: "\u0153", + Scaron: "\u0160", + scaron: "\u0161", + Yuml: "\u0178", + fnof: "\u0192", + circ: "\u02C6", + tilde: "\u02DC", + Alpha: "\u0391", + Beta: "\u0392", + Gamma: "\u0393", + Delta: "\u0394", + Epsilon: "\u0395", + Zeta: "\u0396", + Eta: "\u0397", + Theta: "\u0398", + Iota: "\u0399", + Kappa: "\u039A", + Lambda: "\u039B", + Mu: "\u039C", + Nu: "\u039D", + Xi: "\u039E", + Omicron: "\u039F", + Pi: "\u03A0", + Rho: "\u03A1", + Sigma: "\u03A3", + Tau: "\u03A4", + Upsilon: "\u03A5", + Phi: "\u03A6", + Chi: "\u03A7", + Psi: "\u03A8", + Omega: "\u03A9", + alpha: "\u03B1", + beta: "\u03B2", + gamma: "\u03B3", + delta: "\u03B4", + epsilon: "\u03B5", + zeta: "\u03B6", + eta: "\u03B7", + theta: "\u03B8", + iota: "\u03B9", + kappa: "\u03BA", + lambda: "\u03BB", + mu: "\u03BC", + nu: "\u03BD", + xi: "\u03BE", + omicron: "\u03BF", + pi: "\u03C0", + rho: "\u03C1", + sigmaf: "\u03C2", + sigma: "\u03C3", + tau: "\u03C4", + upsilon: "\u03C5", + phi: "\u03C6", + chi: "\u03C7", + psi: "\u03C8", + omega: "\u03C9", + thetasym: "\u03D1", + upsih: "\u03D2", + piv: "\u03D6", + ensp: "\u2002", + emsp: "\u2003", + thinsp: "\u2009", + zwnj: "\u200C", + zwj: "\u200D", + lrm: "\u200E", + rlm: "\u200F", + ndash: "\u2013", + mdash: "\u2014", + lsquo: "\u2018", + rsquo: "\u2019", + sbquo: "\u201A", + ldquo: "\u201C", + rdquo: "\u201D", + bdquo: "\u201E", + dagger: "\u2020", + Dagger: "\u2021", + bull: "\u2022", + hellip: "\u2026", + permil: "\u2030", + prime: "\u2032", + Prime: "\u2033", + lsaquo: "\u2039", + rsaquo: "\u203A", + oline: "\u203E", + frasl: "\u2044", + euro: "\u20AC", + image: "\u2111", + weierp: "\u2118", + real: "\u211C", + trade: "\u2122", + alefsym: "\u2135", + larr: "\u2190", + uarr: "\u2191", + rarr: "\u2192", + darr: "\u2193", + harr: "\u2194", + crarr: "\u21B5", + lArr: "\u21D0", + uArr: "\u21D1", + rArr: "\u21D2", + dArr: "\u21D3", + hArr: "\u21D4", + forall: "\u2200", + part: "\u2202", + exist: "\u2203", + empty: "\u2205", + nabla: "\u2207", + isin: "\u2208", + notin: "\u2209", + ni: "\u220B", + prod: "\u220F", + sum: "\u2211", + minus: "\u2212", + lowast: "\u2217", + radic: "\u221A", + prop: "\u221D", + infin: "\u221E", + ang: "\u2220", + and: "\u2227", + or: "\u2228", + cap: "\u2229", + cup: "\u222A", + int: "\u222B", + there4: "\u2234", + sim: "\u223C", + cong: "\u2245", + asymp: "\u2248", + ne: "\u2260", + equiv: "\u2261", + le: "\u2264", + ge: "\u2265", + sub: "\u2282", + sup: "\u2283", + nsub: "\u2284", + sube: "\u2286", + supe: "\u2287", + oplus: "\u2295", + otimes: "\u2297", + perp: "\u22A5", + sdot: "\u22C5", + lceil: "\u2308", + rceil: "\u2309", + lfloor: "\u230A", + rfloor: "\u230B", + lang: "\u2329", + rang: "\u232A", + loz: "\u25CA", + spades: "\u2660", + clubs: "\u2663", + hearts: "\u2665", + diams: "\u2666" +}; +var xhtml_default = entities; + +// node_modules/sucrase/dist/esm/util/getJSXPragmaInfo.js +function getJSXPragmaInfo(options) { + const [base, suffix] = splitPragma(options.jsxPragma || "React.createElement"); + const [fragmentBase, fragmentSuffix] = splitPragma(options.jsxFragmentPragma || "React.Fragment"); + return { base, suffix, fragmentBase, fragmentSuffix }; +} +function splitPragma(pragma) { + let dotIndex = pragma.indexOf("."); + if (dotIndex === -1) { + dotIndex = pragma.length; + } + return [pragma.slice(0, dotIndex), pragma.slice(dotIndex)]; +} + +// node_modules/sucrase/dist/esm/transformers/Transformer.js +var Transformer = class { + getPrefixCode() { + return ""; + } + getHoistedCode() { + return ""; + } + getSuffixCode() { + return ""; + } +}; + +// node_modules/sucrase/dist/esm/transformers/JSXTransformer.js +var HEX_NUMBER = /^[\da-fA-F]+$/; +var DECIMAL_NUMBER = /^\d+$/; +var JSXTransformer = class extends Transformer { + __init() { + this.lastLineNumber = 1; + } + __init2() { + this.lastIndex = 0; + } + __init3() { + this.filenameVarName = null; + } + constructor(rootTransformer, tokens, importProcessor, nameManager, options) { + super(); + this.rootTransformer = rootTransformer; + this.tokens = tokens; + this.importProcessor = importProcessor; + this.nameManager = nameManager; + this.options = options; + JSXTransformer.prototype.__init.call(this); + JSXTransformer.prototype.__init2.call(this); + JSXTransformer.prototype.__init3.call(this); + this.jsxPragmaInfo = getJSXPragmaInfo(options); + } + process() { + if (this.tokens.matches1(TokenType.jsxTagStart)) { + this.processJSXTag(); + return true; + } + return false; + } + getPrefixCode() { + if (this.filenameVarName) { + return `const ${this.filenameVarName} = ${JSON.stringify(this.options.filePath || "")};`; + } else { + return ""; + } + } + getLineNumberForIndex(index) { + const code = this.tokens.code; + while (this.lastIndex < index && this.lastIndex < code.length) { + if (code[this.lastIndex] === "\n") { + this.lastLineNumber++; + } + this.lastIndex++; + } + return this.lastLineNumber; + } + getFilenameVarName() { + if (!this.filenameVarName) { + this.filenameVarName = this.nameManager.claimFreeName("_jsxFileName"); + } + return this.filenameVarName; + } + processProps(firstTokenStart) { + const lineNumber = this.getLineNumberForIndex(firstTokenStart); + const devProps = this.options.production ? "" : `__self: this, __source: {fileName: ${this.getFilenameVarName()}, lineNumber: ${lineNumber}}`; + if (!this.tokens.matches1(TokenType.jsxName) && !this.tokens.matches1(TokenType.braceL)) { + if (devProps) { + this.tokens.appendCode(`, {${devProps}}`); + } else { + this.tokens.appendCode(`, null`); + } + return; + } + this.tokens.appendCode(`, {`); + while (true) { + if (this.tokens.matches2(TokenType.jsxName, TokenType.eq)) { + this.processPropKeyName(); + this.tokens.replaceToken(": "); + if (this.tokens.matches1(TokenType.braceL)) { + this.tokens.replaceToken(""); + this.rootTransformer.processBalancedCode(); + this.tokens.replaceToken(""); + } else if (this.tokens.matches1(TokenType.jsxTagStart)) { + this.processJSXTag(); + } else { + this.processStringPropValue(); + } + } else if (this.tokens.matches1(TokenType.jsxName)) { + this.processPropKeyName(); + this.tokens.appendCode(": true"); + } else if (this.tokens.matches1(TokenType.braceL)) { + this.tokens.replaceToken(""); + this.rootTransformer.processBalancedCode(); + this.tokens.replaceToken(""); + } else { + break; + } + this.tokens.appendCode(","); + } + if (devProps) { + this.tokens.appendCode(` ${devProps}}`); + } else { + this.tokens.appendCode("}"); + } + } + processPropKeyName() { + const keyName = this.tokens.identifierName(); + if (keyName.includes("-")) { + this.tokens.replaceToken(`'${keyName}'`); + } else { + this.tokens.copyToken(); + } + } + processStringPropValue() { + const token = this.tokens.currentToken(); + const valueCode = this.tokens.code.slice(token.start + 1, token.end - 1); + const replacementCode = formatJSXTextReplacement(valueCode); + const literalCode = formatJSXStringValueLiteral(valueCode); + this.tokens.replaceToken(literalCode + replacementCode); + } + processTagIntro() { + let introEnd = this.tokens.currentIndex() + 1; + while (this.tokens.tokens[introEnd].isType || !this.tokens.matches2AtIndex(introEnd - 1, TokenType.jsxName, TokenType.jsxName) && !this.tokens.matches2AtIndex(introEnd - 1, TokenType.greaterThan, TokenType.jsxName) && !this.tokens.matches1AtIndex(introEnd, TokenType.braceL) && !this.tokens.matches1AtIndex(introEnd, TokenType.jsxTagEnd) && !this.tokens.matches2AtIndex(introEnd, TokenType.slash, TokenType.jsxTagEnd)) { + introEnd++; + } + if (introEnd === this.tokens.currentIndex() + 1) { + const tagName = this.tokens.identifierName(); + if (startsWithLowerCase(tagName)) { + this.tokens.replaceToken(`'${tagName}'`); + } + } + while (this.tokens.currentIndex() < introEnd) { + this.rootTransformer.processToken(); + } + } + processChildren() { + while (true) { + if (this.tokens.matches2(TokenType.jsxTagStart, TokenType.slash)) { + return; + } + if (this.tokens.matches1(TokenType.braceL)) { + if (this.tokens.matches2(TokenType.braceL, TokenType.braceR)) { + this.tokens.replaceToken(""); + this.tokens.replaceToken(""); + } else { + this.tokens.replaceToken(", "); + this.rootTransformer.processBalancedCode(); + this.tokens.replaceToken(""); + } + } else if (this.tokens.matches1(TokenType.jsxTagStart)) { + this.tokens.appendCode(", "); + this.processJSXTag(); + } else if (this.tokens.matches1(TokenType.jsxText)) { + this.processChildTextElement(); + } else { + throw new Error("Unexpected token when processing JSX children."); + } + } + } + processChildTextElement() { + const token = this.tokens.currentToken(); + const valueCode = this.tokens.code.slice(token.start, token.end); + const replacementCode = formatJSXTextReplacement(valueCode); + const literalCode = formatJSXTextLiteral(valueCode); + if (literalCode === '""') { + this.tokens.replaceToken(replacementCode); + } else { + this.tokens.replaceToken(`, ${literalCode}${replacementCode}`); + } + } + processJSXTag() { + const { jsxPragmaInfo } = this; + const resolvedPragmaBaseName = this.importProcessor ? this.importProcessor.getIdentifierReplacement(jsxPragmaInfo.base) || jsxPragmaInfo.base : jsxPragmaInfo.base; + const firstTokenStart = this.tokens.currentToken().start; + this.tokens.replaceToken(`${resolvedPragmaBaseName}${jsxPragmaInfo.suffix}(`); + if (this.tokens.matches1(TokenType.jsxTagEnd)) { + const resolvedFragmentPragmaBaseName = this.importProcessor ? this.importProcessor.getIdentifierReplacement(jsxPragmaInfo.fragmentBase) || jsxPragmaInfo.fragmentBase : jsxPragmaInfo.fragmentBase; + this.tokens.replaceToken(`${resolvedFragmentPragmaBaseName}${jsxPragmaInfo.fragmentSuffix}, null`); + this.processChildren(); + while (!this.tokens.matches1(TokenType.jsxTagEnd)) { + this.tokens.replaceToken(""); + } + this.tokens.replaceToken(")"); + } else { + this.processTagIntro(); + this.processProps(firstTokenStart); + if (this.tokens.matches2(TokenType.slash, TokenType.jsxTagEnd)) { + this.tokens.replaceToken(""); + this.tokens.replaceToken(")"); + } else if (this.tokens.matches1(TokenType.jsxTagEnd)) { + this.tokens.replaceToken(""); + this.processChildren(); + while (!this.tokens.matches1(TokenType.jsxTagEnd)) { + this.tokens.replaceToken(""); + } + this.tokens.replaceToken(")"); + } else { + throw new Error("Expected either /> or > at the end of the tag."); + } + } + } +}; +function startsWithLowerCase(s) { + const firstChar = s.charCodeAt(0); + return firstChar >= charCodes.lowercaseA && firstChar <= charCodes.lowercaseZ; +} +function formatJSXTextLiteral(text) { + let result = ""; + let whitespace = ""; + let isInInitialLineWhitespace = false; + let seenNonWhitespace = false; + for (let i = 0; i < text.length; i++) { + const c = text[i]; + if (c === " " || c === " " || c === "\r") { + if (!isInInitialLineWhitespace) { + whitespace += c; + } + } else if (c === "\n") { + whitespace = ""; + isInInitialLineWhitespace = true; + } else { + if (seenNonWhitespace && isInInitialLineWhitespace) { + result += " "; + } + result += whitespace; + whitespace = ""; + if (c === "&") { + const { entity, newI } = processEntity(text, i + 1); + i = newI - 1; + result += entity; + } else { + result += c; + } + seenNonWhitespace = true; + isInInitialLineWhitespace = false; + } + } + if (!isInInitialLineWhitespace) { + result += whitespace; + } + return JSON.stringify(result); +} +function formatJSXTextReplacement(text) { + let numNewlines = 0; + let numSpaces = 0; + for (const c of text) { + if (c === "\n") { + numNewlines++; + numSpaces = 0; + } else if (c === " ") { + numSpaces++; + } + } + return "\n".repeat(numNewlines) + " ".repeat(numSpaces); +} +function formatJSXStringValueLiteral(text) { + let result = ""; + for (let i = 0; i < text.length; i++) { + const c = text[i]; + if (c === "\n") { + if (/\s/.test(text[i + 1])) { + result += " "; + while (i < text.length && /\s/.test(text[i + 1])) { + i++; + } + } else { + result += "\n"; + } + } else if (c === "&") { + const { entity, newI } = processEntity(text, i + 1); + result += entity; + i = newI - 1; + } else { + result += c; + } + } + return JSON.stringify(result); +} +function processEntity(text, indexAfterAmpersand) { + let str = ""; + let count = 0; + let entity; + let i = indexAfterAmpersand; + while (i < text.length && count++ < 10) { + const ch = text[i]; + i++; + if (ch === ";") { + if (str[0] === "#") { + if (str[1] === "x") { + str = str.slice(2); + if (HEX_NUMBER.test(str)) { + entity = String.fromCodePoint(parseInt(str, 16)); + } + } else { + str = str.slice(1); + if (DECIMAL_NUMBER.test(str)) { + entity = String.fromCodePoint(parseInt(str, 10)); + } + } + } else { + entity = xhtml_default[str]; + } + break; + } + str += ch; + } + if (!entity) { + return { entity: "&", newI: indexAfterAmpersand }; + } + return { entity, newI: i }; +} + +// node_modules/sucrase/dist/esm/util/getNonTypeIdentifiers.js +function getNonTypeIdentifiers(tokens, options) { + const jsxPragmaInfo = getJSXPragmaInfo(options); + const nonTypeIdentifiers = /* @__PURE__ */ new Set(); + for (let i = 0; i < tokens.tokens.length; i++) { + const token = tokens.tokens[i]; + if (token.type === TokenType.name && !token.isType && (token.identifierRole === IdentifierRole.Access || token.identifierRole === IdentifierRole.ObjectShorthand || token.identifierRole === IdentifierRole.ExportAccess) && !token.shadowsGlobal) { + nonTypeIdentifiers.add(tokens.identifierNameForToken(token)); + } + if (token.type === TokenType.jsxTagStart) { + nonTypeIdentifiers.add(jsxPragmaInfo.base); + } + if (token.type === TokenType.jsxTagStart && i + 1 < tokens.tokens.length && tokens.tokens[i + 1].type === TokenType.jsxTagEnd) { + nonTypeIdentifiers.add(jsxPragmaInfo.base); + nonTypeIdentifiers.add(jsxPragmaInfo.fragmentBase); + } + if (token.type === TokenType.jsxName && token.identifierRole === IdentifierRole.Access) { + const identifierName = tokens.identifierNameForToken(token); + if (!startsWithLowerCase(identifierName) || tokens.tokens[i + 1].type === TokenType.dot) { + nonTypeIdentifiers.add(tokens.identifierNameForToken(token)); + } + } + } + return nonTypeIdentifiers; +} + +// node_modules/sucrase/dist/esm/CJSImportProcessor.js +var CJSImportProcessor = class { + __init() { + this.nonTypeIdentifiers = /* @__PURE__ */ new Set(); + } + __init2() { + this.importInfoByPath = /* @__PURE__ */ new Map(); + } + __init3() { + this.importsToReplace = /* @__PURE__ */ new Map(); + } + __init4() { + this.identifierReplacements = /* @__PURE__ */ new Map(); + } + __init5() { + this.exportBindingsByLocalName = /* @__PURE__ */ new Map(); + } + constructor(nameManager, tokens, enableLegacyTypeScriptModuleInterop, options, isTypeScriptTransformEnabled, helperManager) { + this.nameManager = nameManager; + this.tokens = tokens; + this.enableLegacyTypeScriptModuleInterop = enableLegacyTypeScriptModuleInterop; + this.options = options; + this.isTypeScriptTransformEnabled = isTypeScriptTransformEnabled; + this.helperManager = helperManager; + CJSImportProcessor.prototype.__init.call(this); + CJSImportProcessor.prototype.__init2.call(this); + CJSImportProcessor.prototype.__init3.call(this); + CJSImportProcessor.prototype.__init4.call(this); + CJSImportProcessor.prototype.__init5.call(this); + } + preprocessTokens() { + for (let i = 0; i < this.tokens.tokens.length; i++) { + if (this.tokens.matches1AtIndex(i, TokenType._import) && !this.tokens.matches3AtIndex(i, TokenType._import, TokenType.name, TokenType.eq)) { + this.preprocessImportAtIndex(i); + } + if (this.tokens.matches1AtIndex(i, TokenType._export) && !this.tokens.matches2AtIndex(i, TokenType._export, TokenType.eq)) { + this.preprocessExportAtIndex(i); + } + } + this.generateImportReplacements(); + } + pruneTypeOnlyImports() { + this.nonTypeIdentifiers = getNonTypeIdentifiers(this.tokens, this.options); + for (const [path, importInfo] of this.importInfoByPath.entries()) { + if (importInfo.hasBareImport || importInfo.hasStarExport || importInfo.exportStarNames.length > 0 || importInfo.namedExports.length > 0) { + continue; + } + const names = [ + ...importInfo.defaultNames, + ...importInfo.wildcardNames, + ...importInfo.namedImports.map(({ localName }) => localName) + ]; + if (names.every((name) => this.isTypeName(name))) { + this.importsToReplace.set(path, ""); + } + } + } + isTypeName(name) { + return this.isTypeScriptTransformEnabled && !this.nonTypeIdentifiers.has(name); + } + generateImportReplacements() { + for (const [path, importInfo] of this.importInfoByPath.entries()) { + const { + defaultNames, + wildcardNames, + namedImports, + namedExports, + exportStarNames, + hasStarExport + } = importInfo; + if (defaultNames.length === 0 && wildcardNames.length === 0 && namedImports.length === 0 && namedExports.length === 0 && exportStarNames.length === 0 && !hasStarExport) { + this.importsToReplace.set(path, `require('${path}');`); + continue; + } + const primaryImportName = this.getFreeIdentifierForPath(path); + let secondaryImportName; + if (this.enableLegacyTypeScriptModuleInterop) { + secondaryImportName = primaryImportName; + } else { + secondaryImportName = wildcardNames.length > 0 ? wildcardNames[0] : this.getFreeIdentifierForPath(path); + } + let requireCode = `var ${primaryImportName} = require('${path}');`; + if (wildcardNames.length > 0) { + for (const wildcardName of wildcardNames) { + const moduleExpr = this.enableLegacyTypeScriptModuleInterop ? primaryImportName : `${this.helperManager.getHelperName("interopRequireWildcard")}(${primaryImportName})`; + requireCode += ` var ${wildcardName} = ${moduleExpr};`; + } + } else if (exportStarNames.length > 0 && secondaryImportName !== primaryImportName) { + requireCode += ` var ${secondaryImportName} = ${this.helperManager.getHelperName("interopRequireWildcard")}(${primaryImportName});`; + } else if (defaultNames.length > 0 && secondaryImportName !== primaryImportName) { + requireCode += ` var ${secondaryImportName} = ${this.helperManager.getHelperName("interopRequireDefault")}(${primaryImportName});`; + } + for (const { importedName, localName } of namedExports) { + requireCode += ` ${this.helperManager.getHelperName("createNamedExportFrom")}(${primaryImportName}, '${localName}', '${importedName}');`; + } + for (const exportStarName of exportStarNames) { + requireCode += ` exports.${exportStarName} = ${secondaryImportName};`; + } + if (hasStarExport) { + requireCode += ` ${this.helperManager.getHelperName("createStarExport")}(${primaryImportName});`; + } + this.importsToReplace.set(path, requireCode); + for (const defaultName of defaultNames) { + this.identifierReplacements.set(defaultName, `${secondaryImportName}.default`); + } + for (const { importedName, localName } of namedImports) { + this.identifierReplacements.set(localName, `${primaryImportName}.${importedName}`); + } + } + } + getFreeIdentifierForPath(path) { + const components = path.split("/"); + const lastComponent = components[components.length - 1]; + const baseName = lastComponent.replace(/\W/g, ""); + return this.nameManager.claimFreeName(`_${baseName}`); + } + preprocessImportAtIndex(index) { + const defaultNames = []; + const wildcardNames = []; + const namedImports = []; + index++; + if ((this.tokens.matchesContextualAtIndex(index, ContextualKeyword._type) || this.tokens.matches1AtIndex(index, TokenType._typeof)) && !this.tokens.matches1AtIndex(index + 1, TokenType.comma) && !this.tokens.matchesContextualAtIndex(index + 1, ContextualKeyword._from)) { + return; + } + if (this.tokens.matches1AtIndex(index, TokenType.parenL)) { + return; + } + if (this.tokens.matches1AtIndex(index, TokenType.name)) { + defaultNames.push(this.tokens.identifierNameAtIndex(index)); + index++; + if (this.tokens.matches1AtIndex(index, TokenType.comma)) { + index++; + } + } + if (this.tokens.matches1AtIndex(index, TokenType.star)) { + index += 2; + wildcardNames.push(this.tokens.identifierNameAtIndex(index)); + index++; + } + if (this.tokens.matches1AtIndex(index, TokenType.braceL)) { + const result = this.getNamedImports(index + 1); + index = result.newIndex; + for (const namedImport of result.namedImports) { + if (namedImport.importedName === "default") { + defaultNames.push(namedImport.localName); + } else { + namedImports.push(namedImport); + } + } + } + if (this.tokens.matchesContextualAtIndex(index, ContextualKeyword._from)) { + index++; + } + if (!this.tokens.matches1AtIndex(index, TokenType.string)) { + throw new Error("Expected string token at the end of import statement."); + } + const path = this.tokens.stringValueAtIndex(index); + const importInfo = this.getImportInfo(path); + importInfo.defaultNames.push(...defaultNames); + importInfo.wildcardNames.push(...wildcardNames); + importInfo.namedImports.push(...namedImports); + if (defaultNames.length === 0 && wildcardNames.length === 0 && namedImports.length === 0) { + importInfo.hasBareImport = true; + } + } + preprocessExportAtIndex(index) { + if (this.tokens.matches2AtIndex(index, TokenType._export, TokenType._var) || this.tokens.matches2AtIndex(index, TokenType._export, TokenType._let) || this.tokens.matches2AtIndex(index, TokenType._export, TokenType._const)) { + this.preprocessVarExportAtIndex(index); + } else if (this.tokens.matches2AtIndex(index, TokenType._export, TokenType._function) || this.tokens.matches2AtIndex(index, TokenType._export, TokenType._class)) { + const exportName = this.tokens.identifierNameAtIndex(index + 2); + this.addExportBinding(exportName, exportName); + } else if (this.tokens.matches3AtIndex(index, TokenType._export, TokenType.name, TokenType._function)) { + const exportName = this.tokens.identifierNameAtIndex(index + 3); + this.addExportBinding(exportName, exportName); + } else if (this.tokens.matches2AtIndex(index, TokenType._export, TokenType.braceL)) { + this.preprocessNamedExportAtIndex(index); + } else if (this.tokens.matches2AtIndex(index, TokenType._export, TokenType.star)) { + this.preprocessExportStarAtIndex(index); + } + } + preprocessVarExportAtIndex(index) { + let depth = 0; + for (let i = index + 2; ; i++) { + if (this.tokens.matches1AtIndex(i, TokenType.braceL) || this.tokens.matches1AtIndex(i, TokenType.dollarBraceL) || this.tokens.matches1AtIndex(i, TokenType.bracketL)) { + depth++; + } else if (this.tokens.matches1AtIndex(i, TokenType.braceR) || this.tokens.matches1AtIndex(i, TokenType.bracketR)) { + depth--; + } else if (depth === 0 && !this.tokens.matches1AtIndex(i, TokenType.name)) { + break; + } else if (this.tokens.matches1AtIndex(1, TokenType.eq)) { + const endIndex = this.tokens.currentToken().rhsEndIndex; + if (endIndex == null) { + throw new Error("Expected = token with an end index."); + } + i = endIndex - 1; + } else { + const token = this.tokens.tokens[i]; + if (isDeclaration(token)) { + const exportName = this.tokens.identifierNameAtIndex(i); + this.identifierReplacements.set(exportName, `exports.${exportName}`); + } + } + } + } + preprocessNamedExportAtIndex(index) { + index += 2; + const { newIndex, namedImports } = this.getNamedImports(index); + index = newIndex; + if (this.tokens.matchesContextualAtIndex(index, ContextualKeyword._from)) { + index++; + } else { + for (const { importedName: localName, localName: exportedName } of namedImports) { + this.addExportBinding(localName, exportedName); + } + return; + } + if (!this.tokens.matches1AtIndex(index, TokenType.string)) { + throw new Error("Expected string token at the end of import statement."); + } + const path = this.tokens.stringValueAtIndex(index); + const importInfo = this.getImportInfo(path); + importInfo.namedExports.push(...namedImports); + } + preprocessExportStarAtIndex(index) { + let exportedName = null; + if (this.tokens.matches3AtIndex(index, TokenType._export, TokenType.star, TokenType._as)) { + index += 3; + exportedName = this.tokens.identifierNameAtIndex(index); + index += 2; + } else { + index += 3; + } + if (!this.tokens.matches1AtIndex(index, TokenType.string)) { + throw new Error("Expected string token at the end of star export statement."); + } + const path = this.tokens.stringValueAtIndex(index); + const importInfo = this.getImportInfo(path); + if (exportedName !== null) { + importInfo.exportStarNames.push(exportedName); + } else { + importInfo.hasStarExport = true; + } + } + getNamedImports(index) { + const namedImports = []; + while (true) { + if (this.tokens.matches1AtIndex(index, TokenType.braceR)) { + index++; + break; + } + const specifierInfo = getImportExportSpecifierInfo(this.tokens, index); + index = specifierInfo.endIndex; + if (!specifierInfo.isType) { + namedImports.push({ + importedName: specifierInfo.leftName, + localName: specifierInfo.rightName + }); + } + if (this.tokens.matches2AtIndex(index, TokenType.comma, TokenType.braceR)) { + index += 2; + break; + } else if (this.tokens.matches1AtIndex(index, TokenType.braceR)) { + index++; + break; + } else if (this.tokens.matches1AtIndex(index, TokenType.comma)) { + index++; + } else { + throw new Error(`Unexpected token: ${JSON.stringify(this.tokens.tokens[index])}`); + } + } + return { newIndex: index, namedImports }; + } + getImportInfo(path) { + const existingInfo = this.importInfoByPath.get(path); + if (existingInfo) { + return existingInfo; + } + const newInfo = { + defaultNames: [], + wildcardNames: [], + namedImports: [], + namedExports: [], + hasBareImport: false, + exportStarNames: [], + hasStarExport: false + }; + this.importInfoByPath.set(path, newInfo); + return newInfo; + } + addExportBinding(localName, exportedName) { + if (!this.exportBindingsByLocalName.has(localName)) { + this.exportBindingsByLocalName.set(localName, []); + } + this.exportBindingsByLocalName.get(localName).push(exportedName); + } + claimImportCode(importPath) { + const result = this.importsToReplace.get(importPath); + this.importsToReplace.set(importPath, ""); + return result || ""; + } + getIdentifierReplacement(identifierName) { + return this.identifierReplacements.get(identifierName) || null; + } + resolveExportBinding(assignedName) { + const exportedNames = this.exportBindingsByLocalName.get(assignedName); + if (!exportedNames || exportedNames.length === 0) { + return null; + } + return exportedNames.map((exportedName) => `exports.${exportedName}`).join(" = "); + } + getGlobalNames() { + return /* @__PURE__ */ new Set([ + ...this.identifierReplacements.keys(), + ...this.exportBindingsByLocalName.keys() + ]); + } +}; + +// node_modules/sucrase/dist/esm/computeSourceMap.js +function computeSourceMap(code, filePath, { compiledFilename }) { + let mappings = "AAAA"; + for (let i = 0; i < code.length; i++) { + if (code.charCodeAt(i) === charCodes.lineFeed) { + mappings += ";AACA"; + } + } + return { + version: 3, + file: compiledFilename || "", + sources: [filePath], + mappings, + names: [] + }; +} + +// node_modules/sucrase/dist/esm/HelperManager.js +var HELPERS = { + interopRequireWildcard: ` + function interopRequireWildcard(obj) { + if (obj && obj.__esModule) { + return obj; + } else { + var newObj = {}; + if (obj != null) { + for (var key in obj) { + if (Object.prototype.hasOwnProperty.call(obj, key)) { + newObj[key] = obj[key]; + } + } + } + newObj.default = obj; + return newObj; + } + } + `, + interopRequireDefault: ` + function interopRequireDefault(obj) { + return obj && obj.__esModule ? obj : { default: obj }; + } + `, + createNamedExportFrom: ` + function createNamedExportFrom(obj, localName, importedName) { + Object.defineProperty(exports, localName, {enumerable: true, configurable: true, get: () => obj[importedName]}); + } + `, + createStarExport: ` + function createStarExport(obj) { + Object.keys(obj) + .filter((key) => key !== "default" && key !== "__esModule") + .forEach((key) => { + if (exports.hasOwnProperty(key)) { + return; + } + Object.defineProperty(exports, key, {enumerable: true, configurable: true, get: () => obj[key]}); + }); + } + `, + nullishCoalesce: ` + function nullishCoalesce(lhs, rhsFn) { + if (lhs != null) { + return lhs; + } else { + return rhsFn(); + } + } + `, + asyncNullishCoalesce: ` + async function asyncNullishCoalesce(lhs, rhsFn) { + if (lhs != null) { + return lhs; + } else { + return await rhsFn(); + } + } + `, + optionalChain: ` + function optionalChain(ops) { + let lastAccessLHS = undefined; + let value = ops[0]; + let i = 1; + while (i < ops.length) { + const op = ops[i]; + const fn = ops[i + 1]; + i += 2; + if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { + return undefined; + } + if (op === 'access' || op === 'optionalAccess') { + lastAccessLHS = value; + value = fn(value); + } else if (op === 'call' || op === 'optionalCall') { + value = fn((...args) => value.call(lastAccessLHS, ...args)); + lastAccessLHS = undefined; + } + } + return value; + } + `, + asyncOptionalChain: ` + async function asyncOptionalChain(ops) { + let lastAccessLHS = undefined; + let value = ops[0]; + let i = 1; + while (i < ops.length) { + const op = ops[i]; + const fn = ops[i + 1]; + i += 2; + if ((op === 'optionalAccess' || op === 'optionalCall') && value == null) { + return undefined; + } + if (op === 'access' || op === 'optionalAccess') { + lastAccessLHS = value; + value = await fn(value); + } else if (op === 'call' || op === 'optionalCall') { + value = await fn((...args) => value.call(lastAccessLHS, ...args)); + lastAccessLHS = undefined; + } + } + return value; + } + `, + optionalChainDelete: ` + function optionalChainDelete(ops) { + const result = OPTIONAL_CHAIN_NAME(ops); + return result == null ? true : result; + } + `, + asyncOptionalChainDelete: ` + async function asyncOptionalChainDelete(ops) { + const result = await ASYNC_OPTIONAL_CHAIN_NAME(ops); + return result == null ? true : result; + } + ` +}; +var HelperManager = class { + __init() { + this.helperNames = {}; + } + constructor(nameManager) { + this.nameManager = nameManager; + HelperManager.prototype.__init.call(this); + } + getHelperName(baseName) { + let helperName = this.helperNames[baseName]; + if (helperName) { + return helperName; + } + helperName = this.nameManager.claimFreeName(`_${baseName}`); + this.helperNames[baseName] = helperName; + return helperName; + } + emitHelpers() { + let resultCode = ""; + if (this.helperNames.optionalChainDelete) { + this.getHelperName("optionalChain"); + } + if (this.helperNames.asyncOptionalChainDelete) { + this.getHelperName("asyncOptionalChain"); + } + for (const [baseName, helperCodeTemplate] of Object.entries(HELPERS)) { + const helperName = this.helperNames[baseName]; + let helperCode = helperCodeTemplate; + if (baseName === "optionalChainDelete") { + helperCode = helperCode.replace("OPTIONAL_CHAIN_NAME", this.helperNames.optionalChain); + } else if (baseName === "asyncOptionalChainDelete") { + helperCode = helperCode.replace("ASYNC_OPTIONAL_CHAIN_NAME", this.helperNames.asyncOptionalChain); + } + if (helperName) { + resultCode += " "; + resultCode += helperCode.replace(baseName, helperName).replace(/\s+/g, " ").trim(); + } + } + return resultCode; + } +}; + +// node_modules/sucrase/dist/esm/identifyShadowedGlobals.js +function identifyShadowedGlobals(tokens, scopes, globalNames) { + if (!hasShadowedGlobals(tokens, globalNames)) { + return; + } + markShadowedGlobals(tokens, scopes, globalNames); +} +function hasShadowedGlobals(tokens, globalNames) { + for (const token of tokens.tokens) { + if (token.type === TokenType.name && isNonTopLevelDeclaration(token) && globalNames.has(tokens.identifierNameForToken(token))) { + return true; + } + } + return false; +} +function markShadowedGlobals(tokens, scopes, globalNames) { + const scopeStack = []; + let scopeIndex = scopes.length - 1; + for (let i = tokens.tokens.length - 1; ; i--) { + while (scopeStack.length > 0 && scopeStack[scopeStack.length - 1].startTokenIndex === i + 1) { + scopeStack.pop(); + } + while (scopeIndex >= 0 && scopes[scopeIndex].endTokenIndex === i + 1) { + scopeStack.push(scopes[scopeIndex]); + scopeIndex--; + } + if (i < 0) { + break; + } + const token = tokens.tokens[i]; + const name = tokens.identifierNameForToken(token); + if (scopeStack.length > 1 && token.type === TokenType.name && globalNames.has(name)) { + if (isBlockScopedDeclaration(token)) { + markShadowedForScope(scopeStack[scopeStack.length - 1], tokens, name); + } else if (isFunctionScopedDeclaration(token)) { + let stackIndex = scopeStack.length - 1; + while (stackIndex > 0 && !scopeStack[stackIndex].isFunctionScope) { + stackIndex--; + } + if (stackIndex < 0) { + throw new Error("Did not find parent function scope."); + } + markShadowedForScope(scopeStack[stackIndex], tokens, name); + } + } + } + if (scopeStack.length > 0) { + throw new Error("Expected empty scope stack after processing file."); + } +} +function markShadowedForScope(scope, tokens, name) { + for (let i = scope.startTokenIndex; i < scope.endTokenIndex; i++) { + const token = tokens.tokens[i]; + if ((token.type === TokenType.name || token.type === TokenType.jsxName) && tokens.identifierNameForToken(token) === name) { + token.shadowsGlobal = true; + } + } +} + +// node_modules/sucrase/dist/esm/util/getIdentifierNames.js +function getIdentifierNames(code, tokens) { + const names = []; + for (const token of tokens) { + if (token.type === TokenType.name) { + names.push(code.slice(token.start, token.end)); + } + } + return names; +} + +// node_modules/sucrase/dist/esm/NameManager.js +var NameManager = class { + __init() { + this.usedNames = /* @__PURE__ */ new Set(); + } + constructor(code, tokens) { + NameManager.prototype.__init.call(this); + this.usedNames = new Set(getIdentifierNames(code, tokens)); + } + claimFreeName(name) { + const newName = this.findFreeName(name); + this.usedNames.add(newName); + return newName; + } + findFreeName(name) { + if (!this.usedNames.has(name)) { + return name; + } + let suffixNum = 2; + while (this.usedNames.has(name + String(suffixNum))) { + suffixNum++; + } + return name + String(suffixNum); + } +}; + +// node_modules/sucrase/dist/esm/Options.js +var import_ts_interface_checker = __toESM(require_dist()); + +// node_modules/sucrase/dist/esm/Options-gen-types.js +var t = __toESM(require_dist()); +var Transform = t.union(t.lit("jsx"), t.lit("typescript"), t.lit("flow"), t.lit("imports"), t.lit("react-hot-loader"), t.lit("jest")); +var SourceMapOptions = t.iface([], { + compiledFilename: "string" +}); +var Options = t.iface([], { + transforms: t.array("Transform"), + jsxPragma: t.opt("string"), + jsxFragmentPragma: t.opt("string"), + enableLegacyTypeScriptModuleInterop: t.opt("boolean"), + enableLegacyBabel5ModuleInterop: t.opt("boolean"), + sourceMapOptions: t.opt("SourceMapOptions"), + filePath: t.opt("string"), + production: t.opt("boolean"), + disableESTransforms: t.opt("boolean") +}); +var exportedTypeSuite = { + Transform, + SourceMapOptions, + Options +}; +var Options_gen_types_default = exportedTypeSuite; + +// node_modules/sucrase/dist/esm/Options.js +var { Options: OptionsChecker } = (0, import_ts_interface_checker.createCheckers)(Options_gen_types_default); +function validateOptions(options) { + OptionsChecker.strictCheck(options); +} + +// node_modules/sucrase/dist/esm/parser/traverser/lval.js +function parseSpread() { + next(); + parseMaybeAssign(false); +} +function parseRest(isBlockScope) { + next(); + parseBindingAtom(isBlockScope); +} +function parseBindingIdentifier(isBlockScope) { + parseIdentifier(); + markPriorBindingIdentifier(isBlockScope); +} +function parseImportedIdentifier() { + parseIdentifier(); + state.tokens[state.tokens.length - 1].identifierRole = IdentifierRole.ImportDeclaration; +} +function markPriorBindingIdentifier(isBlockScope) { + let identifierRole; + if (state.scopeDepth === 0) { + identifierRole = IdentifierRole.TopLevelDeclaration; + } else if (isBlockScope) { + identifierRole = IdentifierRole.BlockScopedDeclaration; + } else { + identifierRole = IdentifierRole.FunctionScopedDeclaration; + } + state.tokens[state.tokens.length - 1].identifierRole = identifierRole; +} +function parseBindingAtom(isBlockScope) { + switch (state.type) { + case TokenType._this: { + const oldIsType = pushTypeContext(0); + next(); + popTypeContext(oldIsType); + return; + } + case TokenType._yield: + case TokenType.name: { + state.type = TokenType.name; + parseBindingIdentifier(isBlockScope); + return; + } + case TokenType.bracketL: { + next(); + parseBindingList(TokenType.bracketR, isBlockScope, true); + return; + } + case TokenType.braceL: + parseObj(true, isBlockScope); + return; + default: + unexpected(); + } +} +function parseBindingList(close, isBlockScope, allowEmpty = false, allowModifiers = false, contextId = 0) { + let first = true; + let hasRemovedComma = false; + const firstItemTokenIndex = state.tokens.length; + while (!eat(close) && !state.error) { + if (first) { + first = false; + } else { + expect(TokenType.comma); + state.tokens[state.tokens.length - 1].contextId = contextId; + if (!hasRemovedComma && state.tokens[firstItemTokenIndex].isType) { + state.tokens[state.tokens.length - 1].isType = true; + hasRemovedComma = true; + } + } + if (allowEmpty && match(TokenType.comma)) ; else if (eat(close)) { + break; + } else if (match(TokenType.ellipsis)) { + parseRest(isBlockScope); + parseAssignableListItemTypes(); + eat(TokenType.comma); + expect(close); + break; + } else { + parseAssignableListItem(allowModifiers, isBlockScope); + } + } +} +function parseAssignableListItem(allowModifiers, isBlockScope) { + if (allowModifiers) { + tsParseModifiers([ + ContextualKeyword._public, + ContextualKeyword._protected, + ContextualKeyword._private, + ContextualKeyword._readonly, + ContextualKeyword._override + ]); + } + parseMaybeDefault(isBlockScope); + parseAssignableListItemTypes(); + parseMaybeDefault(isBlockScope, true); +} +function parseAssignableListItemTypes() { + if (isFlowEnabled) { + flowParseAssignableListItemTypes(); + } else if (isTypeScriptEnabled) { + tsParseAssignableListItemTypes(); + } +} +function parseMaybeDefault(isBlockScope, leftAlreadyParsed = false) { + if (!leftAlreadyParsed) { + parseBindingAtom(isBlockScope); + } + if (!eat(TokenType.eq)) { + return; + } + const eqIndex = state.tokens.length - 1; + parseMaybeAssign(); + state.tokens[eqIndex].rhsEndIndex = state.tokens.length; +} + +// node_modules/sucrase/dist/esm/parser/plugins/typescript.js +function tsIsIdentifier() { + return match(TokenType.name); +} +function isLiteralPropertyName() { + return match(TokenType.name) || Boolean(state.type & TokenType.IS_KEYWORD) || match(TokenType.string) || match(TokenType.num) || match(TokenType.bigint) || match(TokenType.decimal); +} +function tsNextTokenCanFollowModifier() { + const snapshot = state.snapshot(); + next(); + const canFollowModifier = (match(TokenType.bracketL) || match(TokenType.braceL) || match(TokenType.star) || match(TokenType.ellipsis) || match(TokenType.hash) || isLiteralPropertyName()) && !hasPrecedingLineBreak(); + if (canFollowModifier) { + return true; + } else { + state.restoreFromSnapshot(snapshot); + return false; + } +} +function tsParseModifiers(allowedModifiers) { + while (true) { + const modifier = tsParseModifier(allowedModifiers); + if (modifier === null) { + break; + } + } +} +function tsParseModifier(allowedModifiers) { + if (!match(TokenType.name)) { + return null; + } + const modifier = state.contextualKeyword; + if (allowedModifiers.indexOf(modifier) !== -1 && tsNextTokenCanFollowModifier()) { + switch (modifier) { + case ContextualKeyword._readonly: + state.tokens[state.tokens.length - 1].type = TokenType._readonly; + break; + case ContextualKeyword._abstract: + state.tokens[state.tokens.length - 1].type = TokenType._abstract; + break; + case ContextualKeyword._static: + state.tokens[state.tokens.length - 1].type = TokenType._static; + break; + case ContextualKeyword._public: + state.tokens[state.tokens.length - 1].type = TokenType._public; + break; + case ContextualKeyword._private: + state.tokens[state.tokens.length - 1].type = TokenType._private; + break; + case ContextualKeyword._protected: + state.tokens[state.tokens.length - 1].type = TokenType._protected; + break; + case ContextualKeyword._override: + state.tokens[state.tokens.length - 1].type = TokenType._override; + break; + case ContextualKeyword._declare: + state.tokens[state.tokens.length - 1].type = TokenType._declare; + break; + } + return modifier; + } + return null; +} +function tsParseEntityName() { + parseIdentifier(); + while (eat(TokenType.dot)) { + parseIdentifier(); + } +} +function tsParseTypeReference() { + tsParseEntityName(); + if (!hasPrecedingLineBreak() && match(TokenType.lessThan)) { + tsParseTypeArguments(); + } +} +function tsParseThisTypePredicate() { + next(); + tsParseTypeAnnotation(); +} +function tsParseThisTypeNode() { + next(); +} +function tsParseTypeQuery() { + expect(TokenType._typeof); + if (match(TokenType._import)) { + tsParseImportType(); + } else { + tsParseEntityName(); + } +} +function tsParseImportType() { + expect(TokenType._import); + expect(TokenType.parenL); + expect(TokenType.string); + expect(TokenType.parenR); + if (eat(TokenType.dot)) { + tsParseEntityName(); + } + if (match(TokenType.lessThan)) { + tsParseTypeArguments(); + } +} +function tsParseTypeParameter() { + parseIdentifier(); + if (eat(TokenType._extends)) { + tsParseType(); + } + if (eat(TokenType.eq)) { + tsParseType(); + } +} +function tsTryParseTypeParameters() { + if (match(TokenType.lessThan)) { + tsParseTypeParameters(); + } +} +function tsParseTypeParameters() { + const oldIsType = pushTypeContext(0); + if (match(TokenType.lessThan) || match(TokenType.typeParameterStart)) { + next(); + } else { + unexpected(); + } + while (!eat(TokenType.greaterThan) && !state.error) { + tsParseTypeParameter(); + eat(TokenType.comma); + } + popTypeContext(oldIsType); +} +function tsFillSignature(returnToken) { + const returnTokenRequired = returnToken === TokenType.arrow; + tsTryParseTypeParameters(); + expect(TokenType.parenL); + state.scopeDepth++; + tsParseBindingListForSignature(false); + state.scopeDepth--; + if (returnTokenRequired) { + tsParseTypeOrTypePredicateAnnotation(returnToken); + } else if (match(returnToken)) { + tsParseTypeOrTypePredicateAnnotation(returnToken); + } +} +function tsParseBindingListForSignature(isBlockScope) { + parseBindingList(TokenType.parenR, isBlockScope); +} +function tsParseTypeMemberSemicolon() { + if (!eat(TokenType.comma)) { + semicolon(); + } +} +function tsParseSignatureMember() { + tsFillSignature(TokenType.colon); + tsParseTypeMemberSemicolon(); +} +function tsIsUnambiguouslyIndexSignature() { + const snapshot = state.snapshot(); + next(); + const isIndexSignature = eat(TokenType.name) && match(TokenType.colon); + state.restoreFromSnapshot(snapshot); + return isIndexSignature; +} +function tsTryParseIndexSignature() { + if (!(match(TokenType.bracketL) && tsIsUnambiguouslyIndexSignature())) { + return false; + } + const oldIsType = pushTypeContext(0); + expect(TokenType.bracketL); + parseIdentifier(); + tsParseTypeAnnotation(); + expect(TokenType.bracketR); + tsTryParseTypeAnnotation(); + tsParseTypeMemberSemicolon(); + popTypeContext(oldIsType); + return true; +} +function tsParsePropertyOrMethodSignature(isReadonly) { + eat(TokenType.question); + if (!isReadonly && (match(TokenType.parenL) || match(TokenType.lessThan))) { + tsFillSignature(TokenType.colon); + tsParseTypeMemberSemicolon(); + } else { + tsTryParseTypeAnnotation(); + tsParseTypeMemberSemicolon(); + } +} +function tsParseTypeMember() { + if (match(TokenType.parenL) || match(TokenType.lessThan)) { + tsParseSignatureMember(); + return; + } + if (match(TokenType._new)) { + next(); + if (match(TokenType.parenL) || match(TokenType.lessThan)) { + tsParseSignatureMember(); + } else { + tsParsePropertyOrMethodSignature(false); + } + return; + } + const readonly = !!tsParseModifier([ContextualKeyword._readonly]); + const found = tsTryParseIndexSignature(); + if (found) { + return; + } + if ((isContextual(ContextualKeyword._get) || isContextual(ContextualKeyword._set)) && tsNextTokenCanFollowModifier()) ; + parsePropertyName(-1); + tsParsePropertyOrMethodSignature(readonly); +} +function tsParseTypeLiteral() { + tsParseObjectTypeMembers(); +} +function tsParseObjectTypeMembers() { + expect(TokenType.braceL); + while (!eat(TokenType.braceR) && !state.error) { + tsParseTypeMember(); + } +} +function tsLookaheadIsStartOfMappedType() { + const snapshot = state.snapshot(); + const isStartOfMappedType = tsIsStartOfMappedType(); + state.restoreFromSnapshot(snapshot); + return isStartOfMappedType; +} +function tsIsStartOfMappedType() { + next(); + if (eat(TokenType.plus) || eat(TokenType.minus)) { + return isContextual(ContextualKeyword._readonly); + } + if (isContextual(ContextualKeyword._readonly)) { + next(); + } + if (!match(TokenType.bracketL)) { + return false; + } + next(); + if (!tsIsIdentifier()) { + return false; + } + next(); + return match(TokenType._in); +} +function tsParseMappedTypeParameter() { + parseIdentifier(); + expect(TokenType._in); + tsParseType(); +} +function tsParseMappedType() { + expect(TokenType.braceL); + if (match(TokenType.plus) || match(TokenType.minus)) { + next(); + expectContextual(ContextualKeyword._readonly); + } else { + eatContextual(ContextualKeyword._readonly); + } + expect(TokenType.bracketL); + tsParseMappedTypeParameter(); + if (eatContextual(ContextualKeyword._as)) { + tsParseType(); + } + expect(TokenType.bracketR); + if (match(TokenType.plus) || match(TokenType.minus)) { + next(); + expect(TokenType.question); + } else { + eat(TokenType.question); + } + tsTryParseType(); + semicolon(); + expect(TokenType.braceR); +} +function tsParseTupleType() { + expect(TokenType.bracketL); + while (!eat(TokenType.bracketR) && !state.error) { + tsParseTupleElementType(); + eat(TokenType.comma); + } +} +function tsParseTupleElementType() { + if (eat(TokenType.ellipsis)) { + tsParseType(); + } else { + tsParseType(); + eat(TokenType.question); + } + if (eat(TokenType.colon)) { + tsParseType(); + } +} +function tsParseParenthesizedType() { + expect(TokenType.parenL); + tsParseType(); + expect(TokenType.parenR); +} +function tsParseTemplateLiteralType() { + nextTemplateToken(); + nextTemplateToken(); + while (!match(TokenType.backQuote) && !state.error) { + expect(TokenType.dollarBraceL); + tsParseType(); + nextTemplateToken(); + nextTemplateToken(); + } + next(); +} +var FunctionType; +(function(FunctionType2) { + const TSFunctionType = 0; + FunctionType2[FunctionType2["TSFunctionType"] = TSFunctionType] = "TSFunctionType"; + const TSConstructorType = TSFunctionType + 1; + FunctionType2[FunctionType2["TSConstructorType"] = TSConstructorType] = "TSConstructorType"; + const TSAbstractConstructorType = TSConstructorType + 1; + FunctionType2[FunctionType2["TSAbstractConstructorType"] = TSAbstractConstructorType] = "TSAbstractConstructorType"; +})(FunctionType || (FunctionType = {})); +function tsParseFunctionOrConstructorType(type) { + if (type === FunctionType.TSAbstractConstructorType) { + expectContextual(ContextualKeyword._abstract); + } + if (type === FunctionType.TSConstructorType || type === FunctionType.TSAbstractConstructorType) { + expect(TokenType._new); + } + tsFillSignature(TokenType.arrow); +} +function tsParseNonArrayType() { + switch (state.type) { + case TokenType.name: + tsParseTypeReference(); + return; + case TokenType._void: + case TokenType._null: + next(); + return; + case TokenType.string: + case TokenType.num: + case TokenType.bigint: + case TokenType.decimal: + case TokenType._true: + case TokenType._false: + parseLiteral(); + return; + case TokenType.minus: + next(); + parseLiteral(); + return; + case TokenType._this: { + tsParseThisTypeNode(); + if (isContextual(ContextualKeyword._is) && !hasPrecedingLineBreak()) { + tsParseThisTypePredicate(); + } + return; + } + case TokenType._typeof: + tsParseTypeQuery(); + return; + case TokenType._import: + tsParseImportType(); + return; + case TokenType.braceL: + if (tsLookaheadIsStartOfMappedType()) { + tsParseMappedType(); + } else { + tsParseTypeLiteral(); + } + return; + case TokenType.bracketL: + tsParseTupleType(); + return; + case TokenType.parenL: + tsParseParenthesizedType(); + return; + case TokenType.backQuote: + tsParseTemplateLiteralType(); + return; + default: + if (state.type & TokenType.IS_KEYWORD) { + next(); + state.tokens[state.tokens.length - 1].type = TokenType.name; + return; + } + break; + } + unexpected(); +} +function tsParseArrayTypeOrHigher() { + tsParseNonArrayType(); + while (!hasPrecedingLineBreak() && eat(TokenType.bracketL)) { + if (!eat(TokenType.bracketR)) { + tsParseType(); + expect(TokenType.bracketR); + } + } +} +function tsParseInferType() { + expectContextual(ContextualKeyword._infer); + parseIdentifier(); +} +function tsParseTypeOperatorOrHigher() { + if (isContextual(ContextualKeyword._keyof) || isContextual(ContextualKeyword._unique) || isContextual(ContextualKeyword._readonly)) { + next(); + tsParseTypeOperatorOrHigher(); + } else if (isContextual(ContextualKeyword._infer)) { + tsParseInferType(); + } else { + tsParseArrayTypeOrHigher(); + } +} +function tsParseIntersectionTypeOrHigher() { + eat(TokenType.bitwiseAND); + tsParseTypeOperatorOrHigher(); + if (match(TokenType.bitwiseAND)) { + while (eat(TokenType.bitwiseAND)) { + tsParseTypeOperatorOrHigher(); + } + } +} +function tsParseUnionTypeOrHigher() { + eat(TokenType.bitwiseOR); + tsParseIntersectionTypeOrHigher(); + if (match(TokenType.bitwiseOR)) { + while (eat(TokenType.bitwiseOR)) { + tsParseIntersectionTypeOrHigher(); + } + } +} +function tsIsStartOfFunctionType() { + if (match(TokenType.lessThan)) { + return true; + } + return match(TokenType.parenL) && tsLookaheadIsUnambiguouslyStartOfFunctionType(); +} +function tsSkipParameterStart() { + if (match(TokenType.name) || match(TokenType._this)) { + next(); + return true; + } + if (match(TokenType.braceL) || match(TokenType.bracketL)) { + let depth = 1; + next(); + while (depth > 0 && !state.error) { + if (match(TokenType.braceL) || match(TokenType.bracketL)) { + depth++; + } else if (match(TokenType.braceR) || match(TokenType.bracketR)) { + depth--; + } + next(); + } + return true; + } + return false; +} +function tsLookaheadIsUnambiguouslyStartOfFunctionType() { + const snapshot = state.snapshot(); + const isUnambiguouslyStartOfFunctionType = tsIsUnambiguouslyStartOfFunctionType(); + state.restoreFromSnapshot(snapshot); + return isUnambiguouslyStartOfFunctionType; +} +function tsIsUnambiguouslyStartOfFunctionType() { + next(); + if (match(TokenType.parenR) || match(TokenType.ellipsis)) { + return true; + } + if (tsSkipParameterStart()) { + if (match(TokenType.colon) || match(TokenType.comma) || match(TokenType.question) || match(TokenType.eq)) { + return true; + } + if (match(TokenType.parenR)) { + next(); + if (match(TokenType.arrow)) { + return true; + } + } + } + return false; +} +function tsParseTypeOrTypePredicateAnnotation(returnToken) { + const oldIsType = pushTypeContext(0); + expect(returnToken); + const finishedReturn = tsParseTypePredicateOrAssertsPrefix(); + if (!finishedReturn) { + tsParseType(); + } + popTypeContext(oldIsType); +} +function tsTryParseTypeOrTypePredicateAnnotation() { + if (match(TokenType.colon)) { + tsParseTypeOrTypePredicateAnnotation(TokenType.colon); + } +} +function tsTryParseTypeAnnotation() { + if (match(TokenType.colon)) { + tsParseTypeAnnotation(); + } +} +function tsTryParseType() { + if (eat(TokenType.colon)) { + tsParseType(); + } +} +function tsParseTypePredicateOrAssertsPrefix() { + const snapshot = state.snapshot(); + if (isContextual(ContextualKeyword._asserts) && !hasPrecedingLineBreak()) { + next(); + if (eatContextual(ContextualKeyword._is)) { + tsParseType(); + return true; + } else if (tsIsIdentifier() || match(TokenType._this)) { + next(); + if (eatContextual(ContextualKeyword._is)) { + tsParseType(); + } + return true; + } else { + state.restoreFromSnapshot(snapshot); + return false; + } + } else if (tsIsIdentifier() || match(TokenType._this)) { + next(); + if (isContextual(ContextualKeyword._is) && !hasPrecedingLineBreak()) { + next(); + tsParseType(); + return true; + } else { + state.restoreFromSnapshot(snapshot); + return false; + } + } + return false; +} +function tsParseTypeAnnotation() { + const oldIsType = pushTypeContext(0); + expect(TokenType.colon); + tsParseType(); + popTypeContext(oldIsType); +} +function tsParseType() { + tsParseNonConditionalType(); + if (hasPrecedingLineBreak() || !eat(TokenType._extends)) { + return; + } + tsParseNonConditionalType(); + expect(TokenType.question); + tsParseType(); + expect(TokenType.colon); + tsParseType(); +} +function isAbstractConstructorSignature() { + return isContextual(ContextualKeyword._abstract) && lookaheadType() === TokenType._new; +} +function tsParseNonConditionalType() { + if (tsIsStartOfFunctionType()) { + tsParseFunctionOrConstructorType(FunctionType.TSFunctionType); + return; + } + if (match(TokenType._new)) { + tsParseFunctionOrConstructorType(FunctionType.TSConstructorType); + return; + } else if (isAbstractConstructorSignature()) { + tsParseFunctionOrConstructorType(FunctionType.TSAbstractConstructorType); + return; + } + tsParseUnionTypeOrHigher(); +} +function tsParseTypeAssertion() { + const oldIsType = pushTypeContext(1); + tsParseType(); + expect(TokenType.greaterThan); + popTypeContext(oldIsType); + parseMaybeUnary(); +} +function tsTryParseJSXTypeArgument() { + if (eat(TokenType.jsxTagStart)) { + state.tokens[state.tokens.length - 1].type = TokenType.typeParameterStart; + const oldIsType = pushTypeContext(1); + while (!match(TokenType.greaterThan) && !state.error) { + tsParseType(); + eat(TokenType.comma); + } + nextJSXTagToken(); + popTypeContext(oldIsType); + } +} +function tsParseHeritageClause() { + while (!match(TokenType.braceL) && !state.error) { + tsParseExpressionWithTypeArguments(); + eat(TokenType.comma); + } +} +function tsParseExpressionWithTypeArguments() { + tsParseEntityName(); + if (match(TokenType.lessThan)) { + tsParseTypeArguments(); + } +} +function tsParseInterfaceDeclaration() { + parseBindingIdentifier(false); + tsTryParseTypeParameters(); + if (eat(TokenType._extends)) { + tsParseHeritageClause(); + } + tsParseObjectTypeMembers(); +} +function tsParseTypeAliasDeclaration() { + parseBindingIdentifier(false); + tsTryParseTypeParameters(); + expect(TokenType.eq); + tsParseType(); + semicolon(); +} +function tsParseEnumMember() { + if (match(TokenType.string)) { + parseLiteral(); + } else { + parseIdentifier(); + } + if (eat(TokenType.eq)) { + const eqIndex = state.tokens.length - 1; + parseMaybeAssign(); + state.tokens[eqIndex].rhsEndIndex = state.tokens.length; + } +} +function tsParseEnumDeclaration() { + parseBindingIdentifier(false); + expect(TokenType.braceL); + while (!eat(TokenType.braceR) && !state.error) { + tsParseEnumMember(); + eat(TokenType.comma); + } +} +function tsParseModuleBlock() { + expect(TokenType.braceL); + parseBlockBody(TokenType.braceR); +} +function tsParseModuleOrNamespaceDeclaration() { + parseBindingIdentifier(false); + if (eat(TokenType.dot)) { + tsParseModuleOrNamespaceDeclaration(); + } else { + tsParseModuleBlock(); + } +} +function tsParseAmbientExternalModuleDeclaration() { + if (isContextual(ContextualKeyword._global)) { + parseIdentifier(); + } else if (match(TokenType.string)) { + parseExprAtom(); + } else { + unexpected(); + } + if (match(TokenType.braceL)) { + tsParseModuleBlock(); + } else { + semicolon(); + } +} +function tsParseImportEqualsDeclaration() { + parseImportedIdentifier(); + expect(TokenType.eq); + tsParseModuleReference(); + semicolon(); +} +function tsIsExternalModuleReference() { + return isContextual(ContextualKeyword._require) && lookaheadType() === TokenType.parenL; +} +function tsParseModuleReference() { + if (tsIsExternalModuleReference()) { + tsParseExternalModuleReference(); + } else { + tsParseEntityName(); + } +} +function tsParseExternalModuleReference() { + expectContextual(ContextualKeyword._require); + expect(TokenType.parenL); + if (!match(TokenType.string)) { + unexpected(); + } + parseLiteral(); + expect(TokenType.parenR); +} +function tsTryParseDeclare() { + if (isLineTerminator()) { + return false; + } + switch (state.type) { + case TokenType._function: { + const oldIsType = pushTypeContext(1); + next(); + const functionStart = state.start; + parseFunction(functionStart, true); + popTypeContext(oldIsType); + return true; + } + case TokenType._class: { + const oldIsType = pushTypeContext(1); + parseClass(true, false); + popTypeContext(oldIsType); + return true; + } + case TokenType._const: { + if (match(TokenType._const) && isLookaheadContextual(ContextualKeyword._enum)) { + const oldIsType = pushTypeContext(1); + expect(TokenType._const); + expectContextual(ContextualKeyword._enum); + state.tokens[state.tokens.length - 1].type = TokenType._enum; + tsParseEnumDeclaration(); + popTypeContext(oldIsType); + return true; + } + } + case TokenType._var: + case TokenType._let: { + const oldIsType = pushTypeContext(1); + parseVarStatement(state.type); + popTypeContext(oldIsType); + return true; + } + case TokenType.name: { + const oldIsType = pushTypeContext(1); + const contextualKeyword = state.contextualKeyword; + let matched = false; + if (contextualKeyword === ContextualKeyword._global) { + tsParseAmbientExternalModuleDeclaration(); + matched = true; + } else { + matched = tsParseDeclaration(contextualKeyword, true); + } + popTypeContext(oldIsType); + return matched; + } + default: + return false; + } +} +function tsTryParseExportDeclaration() { + return tsParseDeclaration(state.contextualKeyword, true); +} +function tsParseExpressionStatement(contextualKeyword) { + switch (contextualKeyword) { + case ContextualKeyword._declare: { + const declareTokenIndex = state.tokens.length - 1; + const matched = tsTryParseDeclare(); + if (matched) { + state.tokens[declareTokenIndex].type = TokenType._declare; + return true; + } + break; + } + case ContextualKeyword._global: + if (match(TokenType.braceL)) { + tsParseModuleBlock(); + return true; + } + break; + default: + return tsParseDeclaration(contextualKeyword, false); + } + return false; +} +function tsParseDeclaration(contextualKeyword, isBeforeToken) { + switch (contextualKeyword) { + case ContextualKeyword._abstract: + if (tsCheckLineTerminator(isBeforeToken) && match(TokenType._class)) { + state.tokens[state.tokens.length - 1].type = TokenType._abstract; + parseClass(true, false); + return true; + } + break; + case ContextualKeyword._enum: + if (tsCheckLineTerminator(isBeforeToken) && match(TokenType.name)) { + state.tokens[state.tokens.length - 1].type = TokenType._enum; + tsParseEnumDeclaration(); + return true; + } + break; + case ContextualKeyword._interface: + if (tsCheckLineTerminator(isBeforeToken) && match(TokenType.name)) { + const oldIsType = pushTypeContext(isBeforeToken ? 2 : 1); + tsParseInterfaceDeclaration(); + popTypeContext(oldIsType); + return true; + } + break; + case ContextualKeyword._module: + if (tsCheckLineTerminator(isBeforeToken)) { + if (match(TokenType.string)) { + const oldIsType = pushTypeContext(isBeforeToken ? 2 : 1); + tsParseAmbientExternalModuleDeclaration(); + popTypeContext(oldIsType); + return true; + } else if (match(TokenType.name)) { + const oldIsType = pushTypeContext(isBeforeToken ? 2 : 1); + tsParseModuleOrNamespaceDeclaration(); + popTypeContext(oldIsType); + return true; + } + } + break; + case ContextualKeyword._namespace: + if (tsCheckLineTerminator(isBeforeToken) && match(TokenType.name)) { + const oldIsType = pushTypeContext(isBeforeToken ? 2 : 1); + tsParseModuleOrNamespaceDeclaration(); + popTypeContext(oldIsType); + return true; + } + break; + case ContextualKeyword._type: + if (tsCheckLineTerminator(isBeforeToken) && match(TokenType.name)) { + const oldIsType = pushTypeContext(isBeforeToken ? 2 : 1); + tsParseTypeAliasDeclaration(); + popTypeContext(oldIsType); + return true; + } + break; + } + return false; +} +function tsCheckLineTerminator(isBeforeToken) { + if (isBeforeToken) { + next(); + return true; + } else { + return !isLineTerminator(); + } +} +function tsTryParseGenericAsyncArrowFunction() { + const snapshot = state.snapshot(); + tsParseTypeParameters(); + parseFunctionParams(); + tsTryParseTypeOrTypePredicateAnnotation(); + expect(TokenType.arrow); + if (state.error) { + state.restoreFromSnapshot(snapshot); + return false; + } + parseFunctionBody(true); + return true; +} +function tsParseTypeArguments() { + const oldIsType = pushTypeContext(0); + expect(TokenType.lessThan); + while (!eat(TokenType.greaterThan) && !state.error) { + tsParseType(); + eat(TokenType.comma); + } + popTypeContext(oldIsType); +} +function tsIsDeclarationStart() { + if (match(TokenType.name)) { + switch (state.contextualKeyword) { + case ContextualKeyword._abstract: + case ContextualKeyword._declare: + case ContextualKeyword._enum: + case ContextualKeyword._interface: + case ContextualKeyword._module: + case ContextualKeyword._namespace: + case ContextualKeyword._type: + return true; + } + } + return false; +} +function tsParseFunctionBodyAndFinish(functionStart, funcContextId) { + if (match(TokenType.colon)) { + tsParseTypeOrTypePredicateAnnotation(TokenType.colon); + } + if (!match(TokenType.braceL) && isLineTerminator()) { + let i = state.tokens.length - 1; + while (i >= 0 && (state.tokens[i].start >= functionStart || state.tokens[i].type === TokenType._default || state.tokens[i].type === TokenType._export)) { + state.tokens[i].isType = true; + i--; + } + return; + } + parseFunctionBody(false, funcContextId); +} +function tsParseSubscript(startTokenIndex, noCalls, stopState) { + if (!hasPrecedingLineBreak() && eat(TokenType.bang)) { + state.tokens[state.tokens.length - 1].type = TokenType.nonNullAssertion; + return; + } + if (match(TokenType.lessThan)) { + const snapshot = state.snapshot(); + if (!noCalls && atPossibleAsync()) { + const asyncArrowFn = tsTryParseGenericAsyncArrowFunction(); + if (asyncArrowFn) { + return; + } + } + tsParseTypeArguments(); + if (!noCalls && eat(TokenType.parenL)) { + state.tokens[state.tokens.length - 1].subscriptStartIndex = startTokenIndex; + parseCallExpressionArguments(); + } else if (match(TokenType.backQuote)) { + parseTemplate(); + } else { + unexpected(); + } + if (state.error) { + state.restoreFromSnapshot(snapshot); + } else { + return; + } + } else if (!noCalls && match(TokenType.questionDot) && lookaheadType() === TokenType.lessThan) { + next(); + state.tokens[startTokenIndex].isOptionalChainStart = true; + state.tokens[state.tokens.length - 1].subscriptStartIndex = startTokenIndex; + tsParseTypeArguments(); + expect(TokenType.parenL); + parseCallExpressionArguments(); + } + baseParseSubscript(startTokenIndex, noCalls, stopState); +} +function tsStartParseNewArguments() { + if (match(TokenType.lessThan)) { + const snapshot = state.snapshot(); + state.type = TokenType.typeParameterStart; + tsParseTypeArguments(); + if (!match(TokenType.parenL)) { + unexpected(); + } + if (state.error) { + state.restoreFromSnapshot(snapshot); + } + } +} +function tsTryParseExport() { + if (eat(TokenType._import)) { + if (isContextual(ContextualKeyword._type) && lookaheadType() !== TokenType.eq) { + expectContextual(ContextualKeyword._type); + } + tsParseImportEqualsDeclaration(); + return true; + } else if (eat(TokenType.eq)) { + parseExpression(); + semicolon(); + return true; + } else if (eatContextual(ContextualKeyword._as)) { + expectContextual(ContextualKeyword._namespace); + parseIdentifier(); + semicolon(); + return true; + } else { + if (isContextual(ContextualKeyword._type) && lookaheadType() === TokenType.braceL) { + next(); + } + return false; + } +} +function tsParseImportSpecifier() { + parseIdentifier(); + if (match(TokenType.comma) || match(TokenType.braceR)) { + state.tokens[state.tokens.length - 1].identifierRole = IdentifierRole.ImportDeclaration; + return; + } + parseIdentifier(); + if (match(TokenType.comma) || match(TokenType.braceR)) { + state.tokens[state.tokens.length - 1].identifierRole = IdentifierRole.ImportDeclaration; + state.tokens[state.tokens.length - 2].isType = true; + state.tokens[state.tokens.length - 1].isType = true; + return; + } + parseIdentifier(); + if (match(TokenType.comma) || match(TokenType.braceR)) { + state.tokens[state.tokens.length - 3].identifierRole = IdentifierRole.ImportAccess; + state.tokens[state.tokens.length - 1].identifierRole = IdentifierRole.ImportDeclaration; + return; + } + parseIdentifier(); + state.tokens[state.tokens.length - 3].identifierRole = IdentifierRole.ImportAccess; + state.tokens[state.tokens.length - 1].identifierRole = IdentifierRole.ImportDeclaration; + state.tokens[state.tokens.length - 4].isType = true; + state.tokens[state.tokens.length - 3].isType = true; + state.tokens[state.tokens.length - 2].isType = true; + state.tokens[state.tokens.length - 1].isType = true; +} +function tsParseExportSpecifier() { + parseIdentifier(); + if (match(TokenType.comma) || match(TokenType.braceR)) { + state.tokens[state.tokens.length - 1].identifierRole = IdentifierRole.ExportAccess; + return; + } + parseIdentifier(); + if (match(TokenType.comma) || match(TokenType.braceR)) { + state.tokens[state.tokens.length - 1].identifierRole = IdentifierRole.ExportAccess; + state.tokens[state.tokens.length - 2].isType = true; + state.tokens[state.tokens.length - 1].isType = true; + return; + } + parseIdentifier(); + if (match(TokenType.comma) || match(TokenType.braceR)) { + state.tokens[state.tokens.length - 3].identifierRole = IdentifierRole.ExportAccess; + return; + } + parseIdentifier(); + state.tokens[state.tokens.length - 3].identifierRole = IdentifierRole.ExportAccess; + state.tokens[state.tokens.length - 4].isType = true; + state.tokens[state.tokens.length - 3].isType = true; + state.tokens[state.tokens.length - 2].isType = true; + state.tokens[state.tokens.length - 1].isType = true; +} +function tsTryParseExportDefaultExpression() { + if (isContextual(ContextualKeyword._abstract) && lookaheadType() === TokenType._class) { + state.type = TokenType._abstract; + next(); + parseClass(true, true); + return true; + } + if (isContextual(ContextualKeyword._interface)) { + const oldIsType = pushTypeContext(2); + tsParseDeclaration(ContextualKeyword._interface, true); + popTypeContext(oldIsType); + return true; + } + return false; +} +function tsTryParseStatementContent() { + if (state.type === TokenType._const) { + const ahead = lookaheadTypeAndKeyword(); + if (ahead.type === TokenType.name && ahead.contextualKeyword === ContextualKeyword._enum) { + expect(TokenType._const); + expectContextual(ContextualKeyword._enum); + state.tokens[state.tokens.length - 1].type = TokenType._enum; + tsParseEnumDeclaration(); + return true; + } + } + return false; +} +function tsTryParseClassMemberWithIsStatic(isStatic) { + const memberStartIndexAfterStatic = state.tokens.length; + tsParseModifiers([ + ContextualKeyword._abstract, + ContextualKeyword._readonly, + ContextualKeyword._declare, + ContextualKeyword._static, + ContextualKeyword._override + ]); + const modifiersEndIndex = state.tokens.length; + const found = tsTryParseIndexSignature(); + if (found) { + const memberStartIndex = isStatic ? memberStartIndexAfterStatic - 1 : memberStartIndexAfterStatic; + for (let i = memberStartIndex; i < modifiersEndIndex; i++) { + state.tokens[i].isType = true; + } + return true; + } + return false; +} +function tsParseIdentifierStatement(contextualKeyword) { + const matched = tsParseExpressionStatement(contextualKeyword); + if (!matched) { + semicolon(); + } +} +function tsParseExportDeclaration() { + const isDeclare = eatContextual(ContextualKeyword._declare); + if (isDeclare) { + state.tokens[state.tokens.length - 1].type = TokenType._declare; + } + let matchedDeclaration = false; + if (match(TokenType.name)) { + if (isDeclare) { + const oldIsType = pushTypeContext(2); + matchedDeclaration = tsTryParseExportDeclaration(); + popTypeContext(oldIsType); + } else { + matchedDeclaration = tsTryParseExportDeclaration(); + } + } + if (!matchedDeclaration) { + if (isDeclare) { + const oldIsType = pushTypeContext(2); + parseStatement(true); + popTypeContext(oldIsType); + } else { + parseStatement(true); + } + } +} +function tsAfterParseClassSuper(hasSuper) { + if (hasSuper && match(TokenType.lessThan)) { + tsParseTypeArguments(); + } + if (eatContextual(ContextualKeyword._implements)) { + state.tokens[state.tokens.length - 1].type = TokenType._implements; + const oldIsType = pushTypeContext(1); + tsParseHeritageClause(); + popTypeContext(oldIsType); + } +} +function tsStartParseObjPropValue() { + tsTryParseTypeParameters(); +} +function tsStartParseFunctionParams() { + tsTryParseTypeParameters(); +} +function tsAfterParseVarHead() { + const oldIsType = pushTypeContext(0); + eat(TokenType.bang); + tsTryParseTypeAnnotation(); + popTypeContext(oldIsType); +} +function tsStartParseAsyncArrowFromCallExpression() { + if (match(TokenType.colon)) { + tsParseTypeAnnotation(); + } +} +function tsParseMaybeAssign(noIn, isWithinParens) { + if (isJSXEnabled) { + return tsParseMaybeAssignWithJSX(noIn, isWithinParens); + } else { + return tsParseMaybeAssignWithoutJSX(noIn, isWithinParens); + } +} +function tsParseMaybeAssignWithJSX(noIn, isWithinParens) { + if (!match(TokenType.lessThan)) { + return baseParseMaybeAssign(noIn, isWithinParens); + } + const snapshot = state.snapshot(); + let wasArrow = baseParseMaybeAssign(noIn, isWithinParens); + if (state.error) { + state.restoreFromSnapshot(snapshot); + } else { + return wasArrow; + } + state.type = TokenType.typeParameterStart; + tsParseTypeParameters(); + wasArrow = baseParseMaybeAssign(noIn, isWithinParens); + if (!wasArrow) { + unexpected(); + } + return wasArrow; +} +function tsParseMaybeAssignWithoutJSX(noIn, isWithinParens) { + if (!match(TokenType.lessThan)) { + return baseParseMaybeAssign(noIn, isWithinParens); + } + const snapshot = state.snapshot(); + tsParseTypeParameters(); + const wasArrow = baseParseMaybeAssign(noIn, isWithinParens); + if (!wasArrow) { + unexpected(); + } + if (state.error) { + state.restoreFromSnapshot(snapshot); + } else { + return wasArrow; + } + return baseParseMaybeAssign(noIn, isWithinParens); +} +function tsParseArrow() { + if (match(TokenType.colon)) { + const snapshot = state.snapshot(); + tsParseTypeOrTypePredicateAnnotation(TokenType.colon); + if (canInsertSemicolon()) + unexpected(); + if (!match(TokenType.arrow)) + unexpected(); + if (state.error) { + state.restoreFromSnapshot(snapshot); + } + } + return eat(TokenType.arrow); +} +function tsParseAssignableListItemTypes() { + const oldIsType = pushTypeContext(0); + eat(TokenType.question); + tsTryParseTypeAnnotation(); + popTypeContext(oldIsType); +} +function tsParseMaybeDecoratorArguments() { + if (match(TokenType.lessThan)) { + tsParseTypeArguments(); + } + baseParseMaybeDecoratorArguments(); +} + +// node_modules/sucrase/dist/esm/parser/plugins/jsx/index.js +function jsxReadToken() { + for (; ; ) { + if (state.pos >= input.length) { + unexpected("Unterminated JSX contents"); + return; + } + const ch = input.charCodeAt(state.pos); + switch (ch) { + case charCodes.lessThan: + case charCodes.leftCurlyBrace: + if (state.pos === state.start) { + if (ch === charCodes.lessThan) { + state.pos++; + finishToken(TokenType.jsxTagStart); + return; + } + getTokenFromCode(ch); + return; + } + finishToken(TokenType.jsxText); + return; + default: + state.pos++; + } + } +} +function jsxReadString(quote) { + state.pos++; + for (; ; ) { + if (state.pos >= input.length) { + unexpected("Unterminated string constant"); + return; + } + const ch = input.charCodeAt(state.pos); + if (ch === quote) { + state.pos++; + break; + } + state.pos++; + } + finishToken(TokenType.string); +} +function jsxReadWord() { + let ch; + do { + if (state.pos > input.length) { + unexpected("Unexpectedly reached the end of input."); + return; + } + ch = input.charCodeAt(++state.pos); + } while (IS_IDENTIFIER_CHAR[ch] || ch === charCodes.dash); + finishToken(TokenType.jsxName); +} +function jsxParseIdentifier() { + nextJSXTagToken(); +} +function jsxParseNamespacedName(identifierRole) { + jsxParseIdentifier(); + if (!eat(TokenType.colon)) { + state.tokens[state.tokens.length - 1].identifierRole = identifierRole; + return; + } + jsxParseIdentifier(); +} +function jsxParseElementName() { + jsxParseNamespacedName(IdentifierRole.Access); + while (match(TokenType.dot)) { + nextJSXTagToken(); + jsxParseIdentifier(); + } +} +function jsxParseAttributeValue() { + switch (state.type) { + case TokenType.braceL: + next(); + jsxParseExpressionContainer(); + nextJSXTagToken(); + return; + case TokenType.jsxTagStart: + jsxParseElement(); + nextJSXTagToken(); + return; + case TokenType.string: + nextJSXTagToken(); + return; + default: + unexpected("JSX value should be either an expression or a quoted JSX text"); + } +} +function jsxParseSpreadChild() { + expect(TokenType.ellipsis); + parseExpression(); +} +function jsxParseExpressionContainer() { + if (match(TokenType.braceR)) ; else { + parseExpression(); + } +} +function jsxParseAttribute() { + if (eat(TokenType.braceL)) { + expect(TokenType.ellipsis); + parseMaybeAssign(); + nextJSXTagToken(); + return; + } + jsxParseNamespacedName(IdentifierRole.ObjectKey); + if (match(TokenType.eq)) { + nextJSXTagToken(); + jsxParseAttributeValue(); + } +} +function jsxParseOpeningElement() { + if (match(TokenType.jsxTagEnd)) { + return false; + } + jsxParseElementName(); + if (isTypeScriptEnabled) { + tsTryParseJSXTypeArgument(); + } + while (!match(TokenType.slash) && !match(TokenType.jsxTagEnd) && !state.error) { + jsxParseAttribute(); + } + const isSelfClosing = match(TokenType.slash); + if (isSelfClosing) { + nextJSXTagToken(); + } + return isSelfClosing; +} +function jsxParseClosingElement() { + if (match(TokenType.jsxTagEnd)) { + return; + } + jsxParseElementName(); +} +function jsxParseElementAt() { + const isSelfClosing = jsxParseOpeningElement(); + if (!isSelfClosing) { + nextJSXExprToken(); + while (true) { + switch (state.type) { + case TokenType.jsxTagStart: + nextJSXTagToken(); + if (match(TokenType.slash)) { + nextJSXTagToken(); + jsxParseClosingElement(); + return; + } + jsxParseElementAt(); + nextJSXExprToken(); + break; + case TokenType.jsxText: + nextJSXExprToken(); + break; + case TokenType.braceL: + next(); + if (match(TokenType.ellipsis)) { + jsxParseSpreadChild(); + nextJSXExprToken(); + } else { + jsxParseExpressionContainer(); + nextJSXExprToken(); + } + break; + default: + unexpected(); + return; + } + } + } +} +function jsxParseElement() { + nextJSXTagToken(); + jsxParseElementAt(); +} +function nextJSXTagToken() { + state.tokens.push(new Token()); + skipSpace(); + state.start = state.pos; + const code = input.charCodeAt(state.pos); + if (IS_IDENTIFIER_START[code]) { + jsxReadWord(); + } else if (code === charCodes.quotationMark || code === charCodes.apostrophe) { + jsxReadString(code); + } else { + ++state.pos; + switch (code) { + case charCodes.greaterThan: + finishToken(TokenType.jsxTagEnd); + break; + case charCodes.lessThan: + finishToken(TokenType.jsxTagStart); + break; + case charCodes.slash: + finishToken(TokenType.slash); + break; + case charCodes.equalsTo: + finishToken(TokenType.eq); + break; + case charCodes.leftCurlyBrace: + finishToken(TokenType.braceL); + break; + case charCodes.dot: + finishToken(TokenType.dot); + break; + case charCodes.colon: + finishToken(TokenType.colon); + break; + default: + unexpected(); + } + } +} +function nextJSXExprToken() { + state.tokens.push(new Token()); + state.start = state.pos; + jsxReadToken(); +} + +// node_modules/sucrase/dist/esm/parser/plugins/types.js +function typedParseConditional(noIn) { + if (match(TokenType.question)) { + const nextType = lookaheadType(); + if (nextType === TokenType.colon || nextType === TokenType.comma || nextType === TokenType.parenR) { + return; + } + } + baseParseConditional(noIn); +} +function typedParseParenItem() { + eatTypeToken(TokenType.question); + if (match(TokenType.colon)) { + if (isTypeScriptEnabled) { + tsParseTypeAnnotation(); + } else if (isFlowEnabled) { + flowParseTypeAnnotation(); + } + } +} + +// node_modules/sucrase/dist/esm/parser/traverser/expression.js +var StopState = class { + constructor(stop) { + this.stop = stop; + } +}; +function parseExpression(noIn = false) { + parseMaybeAssign(noIn); + if (match(TokenType.comma)) { + while (eat(TokenType.comma)) { + parseMaybeAssign(noIn); + } + } +} +function parseMaybeAssign(noIn = false, isWithinParens = false) { + if (isTypeScriptEnabled) { + return tsParseMaybeAssign(noIn, isWithinParens); + } else if (isFlowEnabled) { + return flowParseMaybeAssign(noIn, isWithinParens); + } else { + return baseParseMaybeAssign(noIn, isWithinParens); + } +} +function baseParseMaybeAssign(noIn, isWithinParens) { + if (match(TokenType._yield)) { + parseYield(); + return false; + } + if (match(TokenType.parenL) || match(TokenType.name) || match(TokenType._yield)) { + state.potentialArrowAt = state.start; + } + const wasArrow = parseMaybeConditional(noIn); + if (isWithinParens) { + parseParenItem(); + } + if (state.type & TokenType.IS_ASSIGN) { + next(); + parseMaybeAssign(noIn); + return false; + } + return wasArrow; +} +function parseMaybeConditional(noIn) { + const wasArrow = parseExprOps(noIn); + if (wasArrow) { + return true; + } + parseConditional(noIn); + return false; +} +function parseConditional(noIn) { + if (isTypeScriptEnabled || isFlowEnabled) { + typedParseConditional(noIn); + } else { + baseParseConditional(noIn); + } +} +function baseParseConditional(noIn) { + if (eat(TokenType.question)) { + parseMaybeAssign(); + expect(TokenType.colon); + parseMaybeAssign(noIn); + } +} +function parseExprOps(noIn) { + const startTokenIndex = state.tokens.length; + const wasArrow = parseMaybeUnary(); + if (wasArrow) { + return true; + } + parseExprOp(startTokenIndex, -1, noIn); + return false; +} +function parseExprOp(startTokenIndex, minPrec, noIn) { + if (isTypeScriptEnabled && (TokenType._in & TokenType.PRECEDENCE_MASK) > minPrec && !hasPrecedingLineBreak() && eatContextual(ContextualKeyword._as)) { + state.tokens[state.tokens.length - 1].type = TokenType._as; + const oldIsType = pushTypeContext(1); + tsParseType(); + popTypeContext(oldIsType); + parseExprOp(startTokenIndex, minPrec, noIn); + return; + } + const prec = state.type & TokenType.PRECEDENCE_MASK; + if (prec > 0 && (!noIn || !match(TokenType._in))) { + if (prec > minPrec) { + const op = state.type; + next(); + if (op === TokenType.nullishCoalescing) { + state.tokens[state.tokens.length - 1].nullishStartIndex = startTokenIndex; + } + const rhsStartTokenIndex = state.tokens.length; + parseMaybeUnary(); + parseExprOp(rhsStartTokenIndex, op & TokenType.IS_RIGHT_ASSOCIATIVE ? prec - 1 : prec, noIn); + if (op === TokenType.nullishCoalescing) { + state.tokens[startTokenIndex].numNullishCoalesceStarts++; + state.tokens[state.tokens.length - 1].numNullishCoalesceEnds++; + } + parseExprOp(startTokenIndex, minPrec, noIn); + } + } +} +function parseMaybeUnary() { + if (isTypeScriptEnabled && !isJSXEnabled && eat(TokenType.lessThan)) { + tsParseTypeAssertion(); + return false; + } + if (isContextual(ContextualKeyword._module) && lookaheadCharCode() === charCodes.leftCurlyBrace && !hasFollowingLineBreak()) { + parseModuleExpression(); + return false; + } + if (state.type & TokenType.IS_PREFIX) { + next(); + parseMaybeUnary(); + return false; + } + const wasArrow = parseExprSubscripts(); + if (wasArrow) { + return true; + } + while (state.type & TokenType.IS_POSTFIX && !canInsertSemicolon()) { + if (state.type === TokenType.preIncDec) { + state.type = TokenType.postIncDec; + } + next(); + } + return false; +} +function parseExprSubscripts() { + const startTokenIndex = state.tokens.length; + const wasArrow = parseExprAtom(); + if (wasArrow) { + return true; + } + parseSubscripts(startTokenIndex); + if (state.tokens.length > startTokenIndex && state.tokens[startTokenIndex].isOptionalChainStart) { + state.tokens[state.tokens.length - 1].isOptionalChainEnd = true; + } + return false; +} +function parseSubscripts(startTokenIndex, noCalls = false) { + if (isFlowEnabled) { + flowParseSubscripts(startTokenIndex, noCalls); + } else { + baseParseSubscripts(startTokenIndex, noCalls); + } +} +function baseParseSubscripts(startTokenIndex, noCalls = false) { + const stopState = new StopState(false); + do { + parseSubscript(startTokenIndex, noCalls, stopState); + } while (!stopState.stop && !state.error); +} +function parseSubscript(startTokenIndex, noCalls, stopState) { + if (isTypeScriptEnabled) { + tsParseSubscript(startTokenIndex, noCalls, stopState); + } else if (isFlowEnabled) { + flowParseSubscript(startTokenIndex, noCalls, stopState); + } else { + baseParseSubscript(startTokenIndex, noCalls, stopState); + } +} +function baseParseSubscript(startTokenIndex, noCalls, stopState) { + if (!noCalls && eat(TokenType.doubleColon)) { + parseNoCallExpr(); + stopState.stop = true; + parseSubscripts(startTokenIndex, noCalls); + } else if (match(TokenType.questionDot)) { + state.tokens[startTokenIndex].isOptionalChainStart = true; + if (noCalls && lookaheadType() === TokenType.parenL) { + stopState.stop = true; + return; + } + next(); + state.tokens[state.tokens.length - 1].subscriptStartIndex = startTokenIndex; + if (eat(TokenType.bracketL)) { + parseExpression(); + expect(TokenType.bracketR); + } else if (eat(TokenType.parenL)) { + parseCallExpressionArguments(); + } else { + parseMaybePrivateName(); + } + } else if (eat(TokenType.dot)) { + state.tokens[state.tokens.length - 1].subscriptStartIndex = startTokenIndex; + parseMaybePrivateName(); + } else if (eat(TokenType.bracketL)) { + state.tokens[state.tokens.length - 1].subscriptStartIndex = startTokenIndex; + parseExpression(); + expect(TokenType.bracketR); + } else if (!noCalls && match(TokenType.parenL)) { + if (atPossibleAsync()) { + const snapshot = state.snapshot(); + const asyncStartTokenIndex = state.tokens.length; + next(); + state.tokens[state.tokens.length - 1].subscriptStartIndex = startTokenIndex; + const callContextId = getNextContextId(); + state.tokens[state.tokens.length - 1].contextId = callContextId; + parseCallExpressionArguments(); + state.tokens[state.tokens.length - 1].contextId = callContextId; + if (shouldParseAsyncArrow()) { + state.restoreFromSnapshot(snapshot); + stopState.stop = true; + state.scopeDepth++; + parseFunctionParams(); + parseAsyncArrowFromCallExpression(asyncStartTokenIndex); + } + } else { + next(); + state.tokens[state.tokens.length - 1].subscriptStartIndex = startTokenIndex; + const callContextId = getNextContextId(); + state.tokens[state.tokens.length - 1].contextId = callContextId; + parseCallExpressionArguments(); + state.tokens[state.tokens.length - 1].contextId = callContextId; + } + } else if (match(TokenType.backQuote)) { + parseTemplate(); + } else { + stopState.stop = true; + } +} +function atPossibleAsync() { + return state.tokens[state.tokens.length - 1].contextualKeyword === ContextualKeyword._async && !canInsertSemicolon(); +} +function parseCallExpressionArguments() { + let first = true; + while (!eat(TokenType.parenR) && !state.error) { + if (first) { + first = false; + } else { + expect(TokenType.comma); + if (eat(TokenType.parenR)) { + break; + } + } + parseExprListItem(false); + } +} +function shouldParseAsyncArrow() { + return match(TokenType.colon) || match(TokenType.arrow); +} +function parseAsyncArrowFromCallExpression(startTokenIndex) { + if (isTypeScriptEnabled) { + tsStartParseAsyncArrowFromCallExpression(); + } else if (isFlowEnabled) { + flowStartParseAsyncArrowFromCallExpression(); + } + expect(TokenType.arrow); + parseArrowExpression(startTokenIndex); +} +function parseNoCallExpr() { + const startTokenIndex = state.tokens.length; + parseExprAtom(); + parseSubscripts(startTokenIndex, true); +} +function parseExprAtom() { + if (eat(TokenType.modulo)) { + parseIdentifier(); + return false; + } + if (match(TokenType.jsxText)) { + parseLiteral(); + return false; + } else if (match(TokenType.lessThan) && isJSXEnabled) { + state.type = TokenType.jsxTagStart; + jsxParseElement(); + next(); + return false; + } + const canBeArrow = state.potentialArrowAt === state.start; + switch (state.type) { + case TokenType.slash: + case TokenType.assign: + retokenizeSlashAsRegex(); + case TokenType._super: + case TokenType._this: + case TokenType.regexp: + case TokenType.num: + case TokenType.bigint: + case TokenType.decimal: + case TokenType.string: + case TokenType._null: + case TokenType._true: + case TokenType._false: + next(); + return false; + case TokenType._import: + next(); + if (match(TokenType.dot)) { + state.tokens[state.tokens.length - 1].type = TokenType.name; + next(); + parseIdentifier(); + } + return false; + case TokenType.name: { + const startTokenIndex = state.tokens.length; + const functionStart = state.start; + const contextualKeyword = state.contextualKeyword; + parseIdentifier(); + if (contextualKeyword === ContextualKeyword._await) { + parseAwait(); + return false; + } else if (contextualKeyword === ContextualKeyword._async && match(TokenType._function) && !canInsertSemicolon()) { + next(); + parseFunction(functionStart, false); + return false; + } else if (canBeArrow && contextualKeyword === ContextualKeyword._async && !canInsertSemicolon() && match(TokenType.name)) { + state.scopeDepth++; + parseBindingIdentifier(false); + expect(TokenType.arrow); + parseArrowExpression(startTokenIndex); + return true; + } else if (match(TokenType._do) && !canInsertSemicolon()) { + next(); + parseBlock(); + return false; + } + if (canBeArrow && !canInsertSemicolon() && match(TokenType.arrow)) { + state.scopeDepth++; + markPriorBindingIdentifier(false); + expect(TokenType.arrow); + parseArrowExpression(startTokenIndex); + return true; + } + state.tokens[state.tokens.length - 1].identifierRole = IdentifierRole.Access; + return false; + } + case TokenType._do: { + next(); + parseBlock(); + return false; + } + case TokenType.parenL: { + const wasArrow = parseParenAndDistinguishExpression(canBeArrow); + return wasArrow; + } + case TokenType.bracketL: + next(); + parseExprList(TokenType.bracketR, true); + return false; + case TokenType.braceL: + parseObj(false, false); + return false; + case TokenType._function: + parseFunctionExpression(); + return false; + case TokenType.at: + parseDecorators(); + case TokenType._class: + parseClass(false); + return false; + case TokenType._new: + parseNew(); + return false; + case TokenType.backQuote: + parseTemplate(); + return false; + case TokenType.doubleColon: { + next(); + parseNoCallExpr(); + return false; + } + case TokenType.hash: { + const code = lookaheadCharCode(); + if (IS_IDENTIFIER_START[code] || code === charCodes.backslash) { + parseMaybePrivateName(); + } else { + next(); + } + return false; + } + default: + unexpected(); + return false; + } +} +function parseMaybePrivateName() { + eat(TokenType.hash); + parseIdentifier(); +} +function parseFunctionExpression() { + const functionStart = state.start; + parseIdentifier(); + if (eat(TokenType.dot)) { + parseIdentifier(); + } + parseFunction(functionStart, false); +} +function parseLiteral() { + next(); +} +function parseParenExpression() { + expect(TokenType.parenL); + parseExpression(); + expect(TokenType.parenR); +} +function parseParenAndDistinguishExpression(canBeArrow) { + const snapshot = state.snapshot(); + const startTokenIndex = state.tokens.length; + expect(TokenType.parenL); + let first = true; + while (!match(TokenType.parenR) && !state.error) { + if (first) { + first = false; + } else { + expect(TokenType.comma); + if (match(TokenType.parenR)) { + break; + } + } + if (match(TokenType.ellipsis)) { + parseRest(false); + parseParenItem(); + break; + } else { + parseMaybeAssign(false, true); + } + } + expect(TokenType.parenR); + if (canBeArrow && shouldParseArrow()) { + const wasArrow = parseArrow(); + if (wasArrow) { + state.restoreFromSnapshot(snapshot); + state.scopeDepth++; + parseFunctionParams(); + parseArrow(); + parseArrowExpression(startTokenIndex); + if (state.error) { + state.restoreFromSnapshot(snapshot); + parseParenAndDistinguishExpression(false); + return false; + } + return true; + } + } + return false; +} +function shouldParseArrow() { + return match(TokenType.colon) || !canInsertSemicolon(); +} +function parseArrow() { + if (isTypeScriptEnabled) { + return tsParseArrow(); + } else if (isFlowEnabled) { + return flowParseArrow(); + } else { + return eat(TokenType.arrow); + } +} +function parseParenItem() { + if (isTypeScriptEnabled || isFlowEnabled) { + typedParseParenItem(); + } +} +function parseNew() { + expect(TokenType._new); + if (eat(TokenType.dot)) { + parseIdentifier(); + return; + } + parseNoCallExpr(); + eat(TokenType.questionDot); + parseNewArguments(); +} +function parseNewArguments() { + if (isTypeScriptEnabled) { + tsStartParseNewArguments(); + } else if (isFlowEnabled) { + flowStartParseNewArguments(); + } + if (eat(TokenType.parenL)) { + parseExprList(TokenType.parenR); + } +} +function parseTemplate() { + nextTemplateToken(); + nextTemplateToken(); + while (!match(TokenType.backQuote) && !state.error) { + expect(TokenType.dollarBraceL); + parseExpression(); + nextTemplateToken(); + nextTemplateToken(); + } + next(); +} +function parseObj(isPattern, isBlockScope) { + const contextId = getNextContextId(); + let first = true; + next(); + state.tokens[state.tokens.length - 1].contextId = contextId; + while (!eat(TokenType.braceR) && !state.error) { + if (first) { + first = false; + } else { + expect(TokenType.comma); + if (eat(TokenType.braceR)) { + break; + } + } + let isGenerator = false; + if (match(TokenType.ellipsis)) { + const previousIndex = state.tokens.length; + parseSpread(); + if (isPattern) { + if (state.tokens.length === previousIndex + 2) { + markPriorBindingIdentifier(isBlockScope); + } + if (eat(TokenType.braceR)) { + break; + } + } + continue; + } + if (!isPattern) { + isGenerator = eat(TokenType.star); + } + if (!isPattern && isContextual(ContextualKeyword._async)) { + if (isGenerator) + unexpected(); + parseIdentifier(); + if (match(TokenType.colon) || match(TokenType.parenL) || match(TokenType.braceR) || match(TokenType.eq) || match(TokenType.comma)) ; else { + if (match(TokenType.star)) { + next(); + isGenerator = true; + } + parsePropertyName(contextId); + } + } else { + parsePropertyName(contextId); + } + parseObjPropValue(isPattern, isBlockScope, contextId); + } + state.tokens[state.tokens.length - 1].contextId = contextId; +} +function isGetterOrSetterMethod(isPattern) { + return !isPattern && (match(TokenType.string) || match(TokenType.num) || match(TokenType.bracketL) || match(TokenType.name) || !!(state.type & TokenType.IS_KEYWORD)); +} +function parseObjectMethod(isPattern, objectContextId) { + const functionStart = state.start; + if (match(TokenType.parenL)) { + if (isPattern) + unexpected(); + parseMethod(functionStart, false); + return true; + } + if (isGetterOrSetterMethod(isPattern)) { + parsePropertyName(objectContextId); + parseMethod(functionStart, false); + return true; + } + return false; +} +function parseObjectProperty(isPattern, isBlockScope) { + if (eat(TokenType.colon)) { + if (isPattern) { + parseMaybeDefault(isBlockScope); + } else { + parseMaybeAssign(false); + } + return; + } + let identifierRole; + if (isPattern) { + if (state.scopeDepth === 0) { + identifierRole = IdentifierRole.ObjectShorthandTopLevelDeclaration; + } else if (isBlockScope) { + identifierRole = IdentifierRole.ObjectShorthandBlockScopedDeclaration; + } else { + identifierRole = IdentifierRole.ObjectShorthandFunctionScopedDeclaration; + } + } else { + identifierRole = IdentifierRole.ObjectShorthand; + } + state.tokens[state.tokens.length - 1].identifierRole = identifierRole; + parseMaybeDefault(isBlockScope, true); +} +function parseObjPropValue(isPattern, isBlockScope, objectContextId) { + if (isTypeScriptEnabled) { + tsStartParseObjPropValue(); + } else if (isFlowEnabled) { + flowStartParseObjPropValue(); + } + const wasMethod = parseObjectMethod(isPattern, objectContextId); + if (!wasMethod) { + parseObjectProperty(isPattern, isBlockScope); + } +} +function parsePropertyName(objectContextId) { + if (isFlowEnabled) { + flowParseVariance(); + } + if (eat(TokenType.bracketL)) { + state.tokens[state.tokens.length - 1].contextId = objectContextId; + parseMaybeAssign(); + expect(TokenType.bracketR); + state.tokens[state.tokens.length - 1].contextId = objectContextId; + } else { + if (match(TokenType.num) || match(TokenType.string) || match(TokenType.bigint) || match(TokenType.decimal)) { + parseExprAtom(); + } else { + parseMaybePrivateName(); + } + state.tokens[state.tokens.length - 1].identifierRole = IdentifierRole.ObjectKey; + state.tokens[state.tokens.length - 1].contextId = objectContextId; + } +} +function parseMethod(functionStart, isConstructor) { + const funcContextId = getNextContextId(); + state.scopeDepth++; + const startTokenIndex = state.tokens.length; + const allowModifiers = isConstructor; + parseFunctionParams(allowModifiers, funcContextId); + parseFunctionBodyAndFinish(functionStart, funcContextId); + const endTokenIndex = state.tokens.length; + state.scopes.push(new Scope(startTokenIndex, endTokenIndex, true)); + state.scopeDepth--; +} +function parseArrowExpression(startTokenIndex) { + parseFunctionBody(true); + const endTokenIndex = state.tokens.length; + state.scopes.push(new Scope(startTokenIndex, endTokenIndex, true)); + state.scopeDepth--; +} +function parseFunctionBodyAndFinish(functionStart, funcContextId = 0) { + if (isTypeScriptEnabled) { + tsParseFunctionBodyAndFinish(functionStart, funcContextId); + } else if (isFlowEnabled) { + flowParseFunctionBodyAndFinish(funcContextId); + } else { + parseFunctionBody(false, funcContextId); + } +} +function parseFunctionBody(allowExpression, funcContextId = 0) { + const isExpression = allowExpression && !match(TokenType.braceL); + if (isExpression) { + parseMaybeAssign(); + } else { + parseBlock(true, funcContextId); + } +} +function parseExprList(close, allowEmpty = false) { + let first = true; + while (!eat(close) && !state.error) { + if (first) { + first = false; + } else { + expect(TokenType.comma); + if (eat(close)) + break; + } + parseExprListItem(allowEmpty); + } +} +function parseExprListItem(allowEmpty) { + if (allowEmpty && match(TokenType.comma)) ; else if (match(TokenType.ellipsis)) { + parseSpread(); + parseParenItem(); + } else if (match(TokenType.question)) { + next(); + } else { + parseMaybeAssign(false, true); + } +} +function parseIdentifier() { + next(); + state.tokens[state.tokens.length - 1].type = TokenType.name; +} +function parseAwait() { + parseMaybeUnary(); +} +function parseYield() { + next(); + if (!match(TokenType.semi) && !canInsertSemicolon()) { + eat(TokenType.star); + parseMaybeAssign(); + } +} +function parseModuleExpression() { + expectContextual(ContextualKeyword._module); + expect(TokenType.braceL); + parseBlockBody(TokenType.braceR); +} + +// node_modules/sucrase/dist/esm/parser/plugins/flow.js +function isMaybeDefaultImport(lookahead) { + return (lookahead.type === TokenType.name || !!(lookahead.type & TokenType.IS_KEYWORD)) && lookahead.contextualKeyword !== ContextualKeyword._from; +} +function flowParseTypeInitialiser(tok) { + const oldIsType = pushTypeContext(0); + expect(tok || TokenType.colon); + flowParseType(); + popTypeContext(oldIsType); +} +function flowParsePredicate() { + expect(TokenType.modulo); + expectContextual(ContextualKeyword._checks); + if (eat(TokenType.parenL)) { + parseExpression(); + expect(TokenType.parenR); + } +} +function flowParseTypeAndPredicateInitialiser() { + const oldIsType = pushTypeContext(0); + expect(TokenType.colon); + if (match(TokenType.modulo)) { + flowParsePredicate(); + } else { + flowParseType(); + if (match(TokenType.modulo)) { + flowParsePredicate(); + } + } + popTypeContext(oldIsType); +} +function flowParseDeclareClass() { + next(); + flowParseInterfaceish(true); +} +function flowParseDeclareFunction() { + next(); + parseIdentifier(); + if (match(TokenType.lessThan)) { + flowParseTypeParameterDeclaration(); + } + expect(TokenType.parenL); + flowParseFunctionTypeParams(); + expect(TokenType.parenR); + flowParseTypeAndPredicateInitialiser(); + semicolon(); +} +function flowParseDeclare() { + if (match(TokenType._class)) { + flowParseDeclareClass(); + } else if (match(TokenType._function)) { + flowParseDeclareFunction(); + } else if (match(TokenType._var)) { + flowParseDeclareVariable(); + } else if (eatContextual(ContextualKeyword._module)) { + if (eat(TokenType.dot)) { + flowParseDeclareModuleExports(); + } else { + flowParseDeclareModule(); + } + } else if (isContextual(ContextualKeyword._type)) { + flowParseDeclareTypeAlias(); + } else if (isContextual(ContextualKeyword._opaque)) { + flowParseDeclareOpaqueType(); + } else if (isContextual(ContextualKeyword._interface)) { + flowParseDeclareInterface(); + } else if (match(TokenType._export)) { + flowParseDeclareExportDeclaration(); + } else { + unexpected(); + } +} +function flowParseDeclareVariable() { + next(); + flowParseTypeAnnotatableIdentifier(); + semicolon(); +} +function flowParseDeclareModule() { + if (match(TokenType.string)) { + parseExprAtom(); + } else { + parseIdentifier(); + } + expect(TokenType.braceL); + while (!match(TokenType.braceR) && !state.error) { + if (match(TokenType._import)) { + next(); + parseImport(); + } else { + unexpected(); + } + } + expect(TokenType.braceR); +} +function flowParseDeclareExportDeclaration() { + expect(TokenType._export); + if (eat(TokenType._default)) { + if (match(TokenType._function) || match(TokenType._class)) { + flowParseDeclare(); + } else { + flowParseType(); + semicolon(); + } + } else if (match(TokenType._var) || match(TokenType._function) || match(TokenType._class) || isContextual(ContextualKeyword._opaque)) { + flowParseDeclare(); + } else if (match(TokenType.star) || match(TokenType.braceL) || isContextual(ContextualKeyword._interface) || isContextual(ContextualKeyword._type) || isContextual(ContextualKeyword._opaque)) { + parseExport(); + } else { + unexpected(); + } +} +function flowParseDeclareModuleExports() { + expectContextual(ContextualKeyword._exports); + flowParseTypeAnnotation(); + semicolon(); +} +function flowParseDeclareTypeAlias() { + next(); + flowParseTypeAlias(); +} +function flowParseDeclareOpaqueType() { + next(); + flowParseOpaqueType(true); +} +function flowParseDeclareInterface() { + next(); + flowParseInterfaceish(); +} +function flowParseInterfaceish(isClass = false) { + flowParseRestrictedIdentifier(); + if (match(TokenType.lessThan)) { + flowParseTypeParameterDeclaration(); + } + if (eat(TokenType._extends)) { + do { + flowParseInterfaceExtends(); + } while (!isClass && eat(TokenType.comma)); + } + if (isContextual(ContextualKeyword._mixins)) { + next(); + do { + flowParseInterfaceExtends(); + } while (eat(TokenType.comma)); + } + if (isContextual(ContextualKeyword._implements)) { + next(); + do { + flowParseInterfaceExtends(); + } while (eat(TokenType.comma)); + } + flowParseObjectType(isClass, false, isClass); +} +function flowParseInterfaceExtends() { + flowParseQualifiedTypeIdentifier(false); + if (match(TokenType.lessThan)) { + flowParseTypeParameterInstantiation(); + } +} +function flowParseInterface() { + flowParseInterfaceish(); +} +function flowParseRestrictedIdentifier() { + parseIdentifier(); +} +function flowParseTypeAlias() { + flowParseRestrictedIdentifier(); + if (match(TokenType.lessThan)) { + flowParseTypeParameterDeclaration(); + } + flowParseTypeInitialiser(TokenType.eq); + semicolon(); +} +function flowParseOpaqueType(declare) { + expectContextual(ContextualKeyword._type); + flowParseRestrictedIdentifier(); + if (match(TokenType.lessThan)) { + flowParseTypeParameterDeclaration(); + } + if (match(TokenType.colon)) { + flowParseTypeInitialiser(TokenType.colon); + } + if (!declare) { + flowParseTypeInitialiser(TokenType.eq); + } + semicolon(); +} +function flowParseTypeParameter() { + flowParseVariance(); + flowParseTypeAnnotatableIdentifier(); + if (eat(TokenType.eq)) { + flowParseType(); + } +} +function flowParseTypeParameterDeclaration() { + const oldIsType = pushTypeContext(0); + if (match(TokenType.lessThan) || match(TokenType.typeParameterStart)) { + next(); + } else { + unexpected(); + } + do { + flowParseTypeParameter(); + if (!match(TokenType.greaterThan)) { + expect(TokenType.comma); + } + } while (!match(TokenType.greaterThan) && !state.error); + expect(TokenType.greaterThan); + popTypeContext(oldIsType); +} +function flowParseTypeParameterInstantiation() { + const oldIsType = pushTypeContext(0); + expect(TokenType.lessThan); + while (!match(TokenType.greaterThan) && !state.error) { + flowParseType(); + if (!match(TokenType.greaterThan)) { + expect(TokenType.comma); + } + } + expect(TokenType.greaterThan); + popTypeContext(oldIsType); +} +function flowParseInterfaceType() { + expectContextual(ContextualKeyword._interface); + if (eat(TokenType._extends)) { + do { + flowParseInterfaceExtends(); + } while (eat(TokenType.comma)); + } + flowParseObjectType(false, false, false); +} +function flowParseObjectPropertyKey() { + if (match(TokenType.num) || match(TokenType.string)) { + parseExprAtom(); + } else { + parseIdentifier(); + } +} +function flowParseObjectTypeIndexer() { + if (lookaheadType() === TokenType.colon) { + flowParseObjectPropertyKey(); + flowParseTypeInitialiser(); + } else { + flowParseType(); + } + expect(TokenType.bracketR); + flowParseTypeInitialiser(); +} +function flowParseObjectTypeInternalSlot() { + flowParseObjectPropertyKey(); + expect(TokenType.bracketR); + expect(TokenType.bracketR); + if (match(TokenType.lessThan) || match(TokenType.parenL)) { + flowParseObjectTypeMethodish(); + } else { + eat(TokenType.question); + flowParseTypeInitialiser(); + } +} +function flowParseObjectTypeMethodish() { + if (match(TokenType.lessThan)) { + flowParseTypeParameterDeclaration(); + } + expect(TokenType.parenL); + while (!match(TokenType.parenR) && !match(TokenType.ellipsis) && !state.error) { + flowParseFunctionTypeParam(); + if (!match(TokenType.parenR)) { + expect(TokenType.comma); + } + } + if (eat(TokenType.ellipsis)) { + flowParseFunctionTypeParam(); + } + expect(TokenType.parenR); + flowParseTypeInitialiser(); +} +function flowParseObjectTypeCallProperty() { + flowParseObjectTypeMethodish(); +} +function flowParseObjectType(allowStatic, allowExact, allowProto) { + let endDelim; + if (allowExact && match(TokenType.braceBarL)) { + expect(TokenType.braceBarL); + endDelim = TokenType.braceBarR; + } else { + expect(TokenType.braceL); + endDelim = TokenType.braceR; + } + while (!match(endDelim) && !state.error) { + if (allowProto && isContextual(ContextualKeyword._proto)) { + const lookahead = lookaheadType(); + if (lookahead !== TokenType.colon && lookahead !== TokenType.question) { + next(); + allowStatic = false; + } + } + if (allowStatic && isContextual(ContextualKeyword._static)) { + const lookahead = lookaheadType(); + if (lookahead !== TokenType.colon && lookahead !== TokenType.question) { + next(); + } + } + flowParseVariance(); + if (eat(TokenType.bracketL)) { + if (eat(TokenType.bracketL)) { + flowParseObjectTypeInternalSlot(); + } else { + flowParseObjectTypeIndexer(); + } + } else if (match(TokenType.parenL) || match(TokenType.lessThan)) { + flowParseObjectTypeCallProperty(); + } else { + if (isContextual(ContextualKeyword._get) || isContextual(ContextualKeyword._set)) { + const lookahead = lookaheadType(); + if (lookahead === TokenType.name || lookahead === TokenType.string || lookahead === TokenType.num) { + next(); + } + } + flowParseObjectTypeProperty(); + } + flowObjectTypeSemicolon(); + } + expect(endDelim); +} +function flowParseObjectTypeProperty() { + if (match(TokenType.ellipsis)) { + expect(TokenType.ellipsis); + if (!eat(TokenType.comma)) { + eat(TokenType.semi); + } + if (match(TokenType.braceR)) { + return; + } + flowParseType(); + } else { + flowParseObjectPropertyKey(); + if (match(TokenType.lessThan) || match(TokenType.parenL)) { + flowParseObjectTypeMethodish(); + } else { + eat(TokenType.question); + flowParseTypeInitialiser(); + } + } +} +function flowObjectTypeSemicolon() { + if (!eat(TokenType.semi) && !eat(TokenType.comma) && !match(TokenType.braceR) && !match(TokenType.braceBarR)) { + unexpected(); + } +} +function flowParseQualifiedTypeIdentifier(initialIdAlreadyParsed) { + if (!initialIdAlreadyParsed) { + parseIdentifier(); + } + while (eat(TokenType.dot)) { + parseIdentifier(); + } +} +function flowParseGenericType() { + flowParseQualifiedTypeIdentifier(true); + if (match(TokenType.lessThan)) { + flowParseTypeParameterInstantiation(); + } +} +function flowParseTypeofType() { + expect(TokenType._typeof); + flowParsePrimaryType(); +} +function flowParseTupleType() { + expect(TokenType.bracketL); + while (state.pos < input.length && !match(TokenType.bracketR)) { + flowParseType(); + if (match(TokenType.bracketR)) { + break; + } + expect(TokenType.comma); + } + expect(TokenType.bracketR); +} +function flowParseFunctionTypeParam() { + const lookahead = lookaheadType(); + if (lookahead === TokenType.colon || lookahead === TokenType.question) { + parseIdentifier(); + eat(TokenType.question); + flowParseTypeInitialiser(); + } else { + flowParseType(); + } +} +function flowParseFunctionTypeParams() { + while (!match(TokenType.parenR) && !match(TokenType.ellipsis) && !state.error) { + flowParseFunctionTypeParam(); + if (!match(TokenType.parenR)) { + expect(TokenType.comma); + } + } + if (eat(TokenType.ellipsis)) { + flowParseFunctionTypeParam(); + } +} +function flowParsePrimaryType() { + let isGroupedType = false; + const oldNoAnonFunctionType = state.noAnonFunctionType; + switch (state.type) { + case TokenType.name: { + if (isContextual(ContextualKeyword._interface)) { + flowParseInterfaceType(); + return; + } + parseIdentifier(); + flowParseGenericType(); + return; + } + case TokenType.braceL: + flowParseObjectType(false, false, false); + return; + case TokenType.braceBarL: + flowParseObjectType(false, true, false); + return; + case TokenType.bracketL: + flowParseTupleType(); + return; + case TokenType.lessThan: + flowParseTypeParameterDeclaration(); + expect(TokenType.parenL); + flowParseFunctionTypeParams(); + expect(TokenType.parenR); + expect(TokenType.arrow); + flowParseType(); + return; + case TokenType.parenL: + next(); + if (!match(TokenType.parenR) && !match(TokenType.ellipsis)) { + if (match(TokenType.name)) { + const token = lookaheadType(); + isGroupedType = token !== TokenType.question && token !== TokenType.colon; + } else { + isGroupedType = true; + } + } + if (isGroupedType) { + state.noAnonFunctionType = false; + flowParseType(); + state.noAnonFunctionType = oldNoAnonFunctionType; + if (state.noAnonFunctionType || !(match(TokenType.comma) || match(TokenType.parenR) && lookaheadType() === TokenType.arrow)) { + expect(TokenType.parenR); + return; + } else { + eat(TokenType.comma); + } + } + flowParseFunctionTypeParams(); + expect(TokenType.parenR); + expect(TokenType.arrow); + flowParseType(); + return; + case TokenType.minus: + next(); + parseLiteral(); + return; + case TokenType.string: + case TokenType.num: + case TokenType._true: + case TokenType._false: + case TokenType._null: + case TokenType._this: + case TokenType._void: + case TokenType.star: + next(); + return; + default: + if (state.type === TokenType._typeof) { + flowParseTypeofType(); + return; + } else if (state.type & TokenType.IS_KEYWORD) { + next(); + state.tokens[state.tokens.length - 1].type = TokenType.name; + return; + } + } + unexpected(); +} +function flowParsePostfixType() { + flowParsePrimaryType(); + while (!canInsertSemicolon() && (match(TokenType.bracketL) || match(TokenType.questionDot))) { + eat(TokenType.questionDot); + expect(TokenType.bracketL); + if (eat(TokenType.bracketR)) ; else { + flowParseType(); + expect(TokenType.bracketR); + } + } +} +function flowParsePrefixType() { + if (eat(TokenType.question)) { + flowParsePrefixType(); + } else { + flowParsePostfixType(); + } +} +function flowParseAnonFunctionWithoutParens() { + flowParsePrefixType(); + if (!state.noAnonFunctionType && eat(TokenType.arrow)) { + flowParseType(); + } +} +function flowParseIntersectionType() { + eat(TokenType.bitwiseAND); + flowParseAnonFunctionWithoutParens(); + while (eat(TokenType.bitwiseAND)) { + flowParseAnonFunctionWithoutParens(); + } +} +function flowParseUnionType() { + eat(TokenType.bitwiseOR); + flowParseIntersectionType(); + while (eat(TokenType.bitwiseOR)) { + flowParseIntersectionType(); + } +} +function flowParseType() { + flowParseUnionType(); +} +function flowParseTypeAnnotation() { + flowParseTypeInitialiser(); +} +function flowParseTypeAnnotatableIdentifier() { + parseIdentifier(); + if (match(TokenType.colon)) { + flowParseTypeAnnotation(); + } +} +function flowParseVariance() { + if (match(TokenType.plus) || match(TokenType.minus)) { + next(); + state.tokens[state.tokens.length - 1].isType = true; + } +} +function flowParseFunctionBodyAndFinish(funcContextId) { + if (match(TokenType.colon)) { + flowParseTypeAndPredicateInitialiser(); + } + parseFunctionBody(false, funcContextId); +} +function flowParseSubscript(startTokenIndex, noCalls, stopState) { + if (match(TokenType.questionDot) && lookaheadType() === TokenType.lessThan) { + if (noCalls) { + stopState.stop = true; + return; + } + next(); + flowParseTypeParameterInstantiation(); + expect(TokenType.parenL); + parseCallExpressionArguments(); + return; + } else if (!noCalls && match(TokenType.lessThan)) { + const snapshot = state.snapshot(); + flowParseTypeParameterInstantiation(); + expect(TokenType.parenL); + parseCallExpressionArguments(); + if (state.error) { + state.restoreFromSnapshot(snapshot); + } else { + return; + } + } + baseParseSubscript(startTokenIndex, noCalls, stopState); +} +function flowStartParseNewArguments() { + if (match(TokenType.lessThan)) { + const snapshot = state.snapshot(); + flowParseTypeParameterInstantiation(); + if (state.error) { + state.restoreFromSnapshot(snapshot); + } + } +} +function flowTryParseStatement() { + if (match(TokenType.name) && state.contextualKeyword === ContextualKeyword._interface) { + const oldIsType = pushTypeContext(0); + next(); + flowParseInterface(); + popTypeContext(oldIsType); + return true; + } else if (isContextual(ContextualKeyword._enum)) { + flowParseEnumDeclaration(); + return true; + } + return false; +} +function flowTryParseExportDefaultExpression() { + if (isContextual(ContextualKeyword._enum)) { + flowParseEnumDeclaration(); + return true; + } + return false; +} +function flowParseIdentifierStatement(contextualKeyword) { + if (contextualKeyword === ContextualKeyword._declare) { + if (match(TokenType._class) || match(TokenType.name) || match(TokenType._function) || match(TokenType._var) || match(TokenType._export)) { + const oldIsType = pushTypeContext(1); + flowParseDeclare(); + popTypeContext(oldIsType); + } + } else if (match(TokenType.name)) { + if (contextualKeyword === ContextualKeyword._interface) { + const oldIsType = pushTypeContext(1); + flowParseInterface(); + popTypeContext(oldIsType); + } else if (contextualKeyword === ContextualKeyword._type) { + const oldIsType = pushTypeContext(1); + flowParseTypeAlias(); + popTypeContext(oldIsType); + } else if (contextualKeyword === ContextualKeyword._opaque) { + const oldIsType = pushTypeContext(1); + flowParseOpaqueType(false); + popTypeContext(oldIsType); + } + } + semicolon(); +} +function flowShouldParseExportDeclaration() { + return isContextual(ContextualKeyword._type) || isContextual(ContextualKeyword._interface) || isContextual(ContextualKeyword._opaque) || isContextual(ContextualKeyword._enum); +} +function flowShouldDisallowExportDefaultSpecifier() { + return match(TokenType.name) && (state.contextualKeyword === ContextualKeyword._type || state.contextualKeyword === ContextualKeyword._interface || state.contextualKeyword === ContextualKeyword._opaque || state.contextualKeyword === ContextualKeyword._enum); +} +function flowParseExportDeclaration() { + if (isContextual(ContextualKeyword._type)) { + const oldIsType = pushTypeContext(1); + next(); + if (match(TokenType.braceL)) { + parseExportSpecifiers(); + parseExportFrom(); + } else { + flowParseTypeAlias(); + } + popTypeContext(oldIsType); + } else if (isContextual(ContextualKeyword._opaque)) { + const oldIsType = pushTypeContext(1); + next(); + flowParseOpaqueType(false); + popTypeContext(oldIsType); + } else if (isContextual(ContextualKeyword._interface)) { + const oldIsType = pushTypeContext(1); + next(); + flowParseInterface(); + popTypeContext(oldIsType); + } else { + parseStatement(true); + } +} +function flowShouldParseExportStar() { + return match(TokenType.star) || isContextual(ContextualKeyword._type) && lookaheadType() === TokenType.star; +} +function flowParseExportStar() { + if (eatContextual(ContextualKeyword._type)) { + const oldIsType = pushTypeContext(2); + baseParseExportStar(); + popTypeContext(oldIsType); + } else { + baseParseExportStar(); + } +} +function flowAfterParseClassSuper(hasSuper) { + if (hasSuper && match(TokenType.lessThan)) { + flowParseTypeParameterInstantiation(); + } + if (isContextual(ContextualKeyword._implements)) { + const oldIsType = pushTypeContext(0); + next(); + state.tokens[state.tokens.length - 1].type = TokenType._implements; + do { + flowParseRestrictedIdentifier(); + if (match(TokenType.lessThan)) { + flowParseTypeParameterInstantiation(); + } + } while (eat(TokenType.comma)); + popTypeContext(oldIsType); + } +} +function flowStartParseObjPropValue() { + if (match(TokenType.lessThan)) { + flowParseTypeParameterDeclaration(); + if (!match(TokenType.parenL)) + unexpected(); + } +} +function flowParseAssignableListItemTypes() { + const oldIsType = pushTypeContext(0); + eat(TokenType.question); + if (match(TokenType.colon)) { + flowParseTypeAnnotation(); + } + popTypeContext(oldIsType); +} +function flowStartParseImportSpecifiers() { + if (match(TokenType._typeof) || isContextual(ContextualKeyword._type)) { + const lh = lookaheadTypeAndKeyword(); + if (isMaybeDefaultImport(lh) || lh.type === TokenType.braceL || lh.type === TokenType.star) { + next(); + } + } +} +function flowParseImportSpecifier() { + const isTypeKeyword = state.contextualKeyword === ContextualKeyword._type || state.type === TokenType._typeof; + if (isTypeKeyword) { + next(); + } else { + parseIdentifier(); + } + if (isContextual(ContextualKeyword._as) && !isLookaheadContextual(ContextualKeyword._as)) { + parseIdentifier(); + if (isTypeKeyword && !match(TokenType.name) && !(state.type & TokenType.IS_KEYWORD)) ; else { + parseIdentifier(); + } + } else { + if (isTypeKeyword && (match(TokenType.name) || !!(state.type & TokenType.IS_KEYWORD))) { + parseIdentifier(); + } + if (eatContextual(ContextualKeyword._as)) { + parseIdentifier(); + } + } +} +function flowStartParseFunctionParams() { + if (match(TokenType.lessThan)) { + const oldIsType = pushTypeContext(0); + flowParseTypeParameterDeclaration(); + popTypeContext(oldIsType); + } +} +function flowAfterParseVarHead() { + if (match(TokenType.colon)) { + flowParseTypeAnnotation(); + } +} +function flowStartParseAsyncArrowFromCallExpression() { + if (match(TokenType.colon)) { + const oldNoAnonFunctionType = state.noAnonFunctionType; + state.noAnonFunctionType = true; + flowParseTypeAnnotation(); + state.noAnonFunctionType = oldNoAnonFunctionType; + } +} +function flowParseMaybeAssign(noIn, isWithinParens) { + if (match(TokenType.lessThan)) { + const snapshot = state.snapshot(); + let wasArrow = baseParseMaybeAssign(noIn, isWithinParens); + if (state.error) { + state.restoreFromSnapshot(snapshot); + state.type = TokenType.typeParameterStart; + } else { + return wasArrow; + } + const oldIsType = pushTypeContext(0); + flowParseTypeParameterDeclaration(); + popTypeContext(oldIsType); + wasArrow = baseParseMaybeAssign(noIn, isWithinParens); + if (wasArrow) { + return true; + } + unexpected(); + } + return baseParseMaybeAssign(noIn, isWithinParens); +} +function flowParseArrow() { + if (match(TokenType.colon)) { + const oldIsType = pushTypeContext(0); + const snapshot = state.snapshot(); + const oldNoAnonFunctionType = state.noAnonFunctionType; + state.noAnonFunctionType = true; + flowParseTypeAndPredicateInitialiser(); + state.noAnonFunctionType = oldNoAnonFunctionType; + if (canInsertSemicolon()) + unexpected(); + if (!match(TokenType.arrow)) + unexpected(); + if (state.error) { + state.restoreFromSnapshot(snapshot); + } + popTypeContext(oldIsType); + } + return eat(TokenType.arrow); +} +function flowParseSubscripts(startTokenIndex, noCalls = false) { + if (state.tokens[state.tokens.length - 1].contextualKeyword === ContextualKeyword._async && match(TokenType.lessThan)) { + const snapshot = state.snapshot(); + const wasArrow = parseAsyncArrowWithTypeParameters(); + if (wasArrow && !state.error) { + return; + } + state.restoreFromSnapshot(snapshot); + } + baseParseSubscripts(startTokenIndex, noCalls); +} +function parseAsyncArrowWithTypeParameters() { + state.scopeDepth++; + const startTokenIndex = state.tokens.length; + parseFunctionParams(); + if (!parseArrow()) { + return false; + } + parseArrowExpression(startTokenIndex); + return true; +} +function flowParseEnumDeclaration() { + expectContextual(ContextualKeyword._enum); + state.tokens[state.tokens.length - 1].type = TokenType._enum; + parseIdentifier(); + flowParseEnumBody(); +} +function flowParseEnumBody() { + if (eatContextual(ContextualKeyword._of)) { + next(); + } + expect(TokenType.braceL); + flowParseEnumMembers(); + expect(TokenType.braceR); +} +function flowParseEnumMembers() { + while (!match(TokenType.braceR) && !state.error) { + if (eat(TokenType.ellipsis)) { + break; + } + flowParseEnumMember(); + if (!match(TokenType.braceR)) { + expect(TokenType.comma); + } + } +} +function flowParseEnumMember() { + parseIdentifier(); + if (eat(TokenType.eq)) { + next(); + } +} + +// node_modules/sucrase/dist/esm/parser/traverser/statement.js +function parseTopLevel() { + parseBlockBody(TokenType.eof); + state.scopes.push(new Scope(0, state.tokens.length, true)); + if (state.scopeDepth !== 0) { + throw new Error(`Invalid scope depth at end of file: ${state.scopeDepth}`); + } + return new File$1(state.tokens, state.scopes); +} +function parseStatement(declaration) { + if (isFlowEnabled) { + if (flowTryParseStatement()) { + return; + } + } + if (match(TokenType.at)) { + parseDecorators(); + } + parseStatementContent(declaration); +} +function parseStatementContent(declaration) { + if (isTypeScriptEnabled) { + if (tsTryParseStatementContent()) { + return; + } + } + const starttype = state.type; + switch (starttype) { + case TokenType._break: + case TokenType._continue: + parseBreakContinueStatement(); + return; + case TokenType._debugger: + parseDebuggerStatement(); + return; + case TokenType._do: + parseDoStatement(); + return; + case TokenType._for: + parseForStatement(); + return; + case TokenType._function: + if (lookaheadType() === TokenType.dot) + break; + if (!declaration) + unexpected(); + parseFunctionStatement(); + return; + case TokenType._class: + if (!declaration) + unexpected(); + parseClass(true); + return; + case TokenType._if: + parseIfStatement(); + return; + case TokenType._return: + parseReturnStatement(); + return; + case TokenType._switch: + parseSwitchStatement(); + return; + case TokenType._throw: + parseThrowStatement(); + return; + case TokenType._try: + parseTryStatement(); + return; + case TokenType._let: + case TokenType._const: + if (!declaration) + unexpected(); + case TokenType._var: + parseVarStatement(starttype); + return; + case TokenType._while: + parseWhileStatement(); + return; + case TokenType.braceL: + parseBlock(); + return; + case TokenType.semi: + parseEmptyStatement(); + return; + case TokenType._export: + case TokenType._import: { + const nextType = lookaheadType(); + if (nextType === TokenType.parenL || nextType === TokenType.dot) { + break; + } + next(); + if (starttype === TokenType._import) { + parseImport(); + } else { + parseExport(); + } + return; + } + case TokenType.name: + if (state.contextualKeyword === ContextualKeyword._async) { + const functionStart = state.start; + const snapshot = state.snapshot(); + next(); + if (match(TokenType._function) && !canInsertSemicolon()) { + expect(TokenType._function); + parseFunction(functionStart, true); + return; + } else { + state.restoreFromSnapshot(snapshot); + } + } + } + const initialTokensLength = state.tokens.length; + parseExpression(); + let simpleName = null; + if (state.tokens.length === initialTokensLength + 1) { + const token = state.tokens[state.tokens.length - 1]; + if (token.type === TokenType.name) { + simpleName = token.contextualKeyword; + } + } + if (simpleName == null) { + semicolon(); + return; + } + if (eat(TokenType.colon)) { + parseLabeledStatement(); + } else { + parseIdentifierStatement(simpleName); + } +} +function parseDecorators() { + while (match(TokenType.at)) { + parseDecorator(); + } +} +function parseDecorator() { + next(); + if (eat(TokenType.parenL)) { + parseExpression(); + expect(TokenType.parenR); + } else { + parseIdentifier(); + while (eat(TokenType.dot)) { + parseIdentifier(); + } + } + parseMaybeDecoratorArguments(); +} +function parseMaybeDecoratorArguments() { + if (isTypeScriptEnabled) { + tsParseMaybeDecoratorArguments(); + } else { + baseParseMaybeDecoratorArguments(); + } +} +function baseParseMaybeDecoratorArguments() { + if (eat(TokenType.parenL)) { + parseCallExpressionArguments(); + } +} +function parseBreakContinueStatement() { + next(); + if (!isLineTerminator()) { + parseIdentifier(); + semicolon(); + } +} +function parseDebuggerStatement() { + next(); + semicolon(); +} +function parseDoStatement() { + next(); + parseStatement(false); + expect(TokenType._while); + parseParenExpression(); + eat(TokenType.semi); +} +function parseForStatement() { + state.scopeDepth++; + const startTokenIndex = state.tokens.length; + parseAmbiguousForStatement(); + const endTokenIndex = state.tokens.length; + state.scopes.push(new Scope(startTokenIndex, endTokenIndex, false)); + state.scopeDepth--; +} +function parseAmbiguousForStatement() { + next(); + let forAwait = false; + if (isContextual(ContextualKeyword._await)) { + forAwait = true; + next(); + } + expect(TokenType.parenL); + if (match(TokenType.semi)) { + if (forAwait) { + unexpected(); + } + parseFor(); + return; + } + if (match(TokenType._var) || match(TokenType._let) || match(TokenType._const)) { + const varKind = state.type; + next(); + parseVar(true, varKind); + if (match(TokenType._in) || isContextual(ContextualKeyword._of)) { + parseForIn(forAwait); + return; + } + parseFor(); + return; + } + parseExpression(true); + if (match(TokenType._in) || isContextual(ContextualKeyword._of)) { + parseForIn(forAwait); + return; + } + if (forAwait) { + unexpected(); + } + parseFor(); +} +function parseFunctionStatement() { + const functionStart = state.start; + next(); + parseFunction(functionStart, true); +} +function parseIfStatement() { + next(); + parseParenExpression(); + parseStatement(false); + if (eat(TokenType._else)) { + parseStatement(false); + } +} +function parseReturnStatement() { + next(); + if (!isLineTerminator()) { + parseExpression(); + semicolon(); + } +} +function parseSwitchStatement() { + next(); + parseParenExpression(); + state.scopeDepth++; + const startTokenIndex = state.tokens.length; + expect(TokenType.braceL); + while (!match(TokenType.braceR) && !state.error) { + if (match(TokenType._case) || match(TokenType._default)) { + const isCase = match(TokenType._case); + next(); + if (isCase) { + parseExpression(); + } + expect(TokenType.colon); + } else { + parseStatement(true); + } + } + next(); + const endTokenIndex = state.tokens.length; + state.scopes.push(new Scope(startTokenIndex, endTokenIndex, false)); + state.scopeDepth--; +} +function parseThrowStatement() { + next(); + parseExpression(); + semicolon(); +} +function parseCatchClauseParam() { + parseBindingAtom(true); + if (isTypeScriptEnabled) { + tsTryParseTypeAnnotation(); + } +} +function parseTryStatement() { + next(); + parseBlock(); + if (match(TokenType._catch)) { + next(); + let catchBindingStartTokenIndex = null; + if (match(TokenType.parenL)) { + state.scopeDepth++; + catchBindingStartTokenIndex = state.tokens.length; + expect(TokenType.parenL); + parseCatchClauseParam(); + expect(TokenType.parenR); + } + parseBlock(); + if (catchBindingStartTokenIndex != null) { + const endTokenIndex = state.tokens.length; + state.scopes.push(new Scope(catchBindingStartTokenIndex, endTokenIndex, false)); + state.scopeDepth--; + } + } + if (eat(TokenType._finally)) { + parseBlock(); + } +} +function parseVarStatement(kind) { + next(); + parseVar(false, kind); + semicolon(); +} +function parseWhileStatement() { + next(); + parseParenExpression(); + parseStatement(false); +} +function parseEmptyStatement() { + next(); +} +function parseLabeledStatement() { + parseStatement(true); +} +function parseIdentifierStatement(contextualKeyword) { + if (isTypeScriptEnabled) { + tsParseIdentifierStatement(contextualKeyword); + } else if (isFlowEnabled) { + flowParseIdentifierStatement(contextualKeyword); + } else { + semicolon(); + } +} +function parseBlock(isFunctionScope = false, contextId = 0) { + const startTokenIndex = state.tokens.length; + state.scopeDepth++; + expect(TokenType.braceL); + if (contextId) { + state.tokens[state.tokens.length - 1].contextId = contextId; + } + parseBlockBody(TokenType.braceR); + if (contextId) { + state.tokens[state.tokens.length - 1].contextId = contextId; + } + const endTokenIndex = state.tokens.length; + state.scopes.push(new Scope(startTokenIndex, endTokenIndex, isFunctionScope)); + state.scopeDepth--; +} +function parseBlockBody(end) { + while (!eat(end) && !state.error) { + parseStatement(true); + } +} +function parseFor() { + expect(TokenType.semi); + if (!match(TokenType.semi)) { + parseExpression(); + } + expect(TokenType.semi); + if (!match(TokenType.parenR)) { + parseExpression(); + } + expect(TokenType.parenR); + parseStatement(false); +} +function parseForIn(forAwait) { + if (forAwait) { + eatContextual(ContextualKeyword._of); + } else { + next(); + } + parseExpression(); + expect(TokenType.parenR); + parseStatement(false); +} +function parseVar(isFor, kind) { + while (true) { + const isBlockScope = kind === TokenType._const || kind === TokenType._let; + parseVarHead(isBlockScope); + if (eat(TokenType.eq)) { + const eqIndex = state.tokens.length - 1; + parseMaybeAssign(isFor); + state.tokens[eqIndex].rhsEndIndex = state.tokens.length; + } + if (!eat(TokenType.comma)) { + break; + } + } +} +function parseVarHead(isBlockScope) { + parseBindingAtom(isBlockScope); + if (isTypeScriptEnabled) { + tsAfterParseVarHead(); + } else if (isFlowEnabled) { + flowAfterParseVarHead(); + } +} +function parseFunction(functionStart, isStatement, optionalId = false) { + if (match(TokenType.star)) { + next(); + } + if (isStatement && !optionalId && !match(TokenType.name) && !match(TokenType._yield)) { + unexpected(); + } + let nameScopeStartTokenIndex = null; + if (match(TokenType.name)) { + if (!isStatement) { + nameScopeStartTokenIndex = state.tokens.length; + state.scopeDepth++; + } + parseBindingIdentifier(false); + } + const startTokenIndex = state.tokens.length; + state.scopeDepth++; + parseFunctionParams(); + parseFunctionBodyAndFinish(functionStart); + const endTokenIndex = state.tokens.length; + state.scopes.push(new Scope(startTokenIndex, endTokenIndex, true)); + state.scopeDepth--; + if (nameScopeStartTokenIndex !== null) { + state.scopes.push(new Scope(nameScopeStartTokenIndex, endTokenIndex, true)); + state.scopeDepth--; + } +} +function parseFunctionParams(allowModifiers = false, funcContextId = 0) { + if (isTypeScriptEnabled) { + tsStartParseFunctionParams(); + } else if (isFlowEnabled) { + flowStartParseFunctionParams(); + } + expect(TokenType.parenL); + if (funcContextId) { + state.tokens[state.tokens.length - 1].contextId = funcContextId; + } + parseBindingList(TokenType.parenR, false, false, allowModifiers, funcContextId); + if (funcContextId) { + state.tokens[state.tokens.length - 1].contextId = funcContextId; + } +} +function parseClass(isStatement, optionalId = false) { + const contextId = getNextContextId(); + next(); + state.tokens[state.tokens.length - 1].contextId = contextId; + state.tokens[state.tokens.length - 1].isExpression = !isStatement; + let nameScopeStartTokenIndex = null; + if (!isStatement) { + nameScopeStartTokenIndex = state.tokens.length; + state.scopeDepth++; + } + parseClassId(isStatement, optionalId); + parseClassSuper(); + const openBraceIndex = state.tokens.length; + parseClassBody(contextId); + if (state.error) { + return; + } + state.tokens[openBraceIndex].contextId = contextId; + state.tokens[state.tokens.length - 1].contextId = contextId; + if (nameScopeStartTokenIndex !== null) { + const endTokenIndex = state.tokens.length; + state.scopes.push(new Scope(nameScopeStartTokenIndex, endTokenIndex, false)); + state.scopeDepth--; + } +} +function isClassProperty() { + return match(TokenType.eq) || match(TokenType.semi) || match(TokenType.braceR) || match(TokenType.bang) || match(TokenType.colon); +} +function isClassMethod() { + return match(TokenType.parenL) || match(TokenType.lessThan); +} +function parseClassBody(classContextId) { + expect(TokenType.braceL); + while (!eat(TokenType.braceR) && !state.error) { + if (eat(TokenType.semi)) { + continue; + } + if (match(TokenType.at)) { + parseDecorator(); + continue; + } + const memberStart = state.start; + parseClassMember(memberStart, classContextId); + } +} +function parseClassMember(memberStart, classContextId) { + if (isTypeScriptEnabled) { + tsParseModifiers([ + ContextualKeyword._declare, + ContextualKeyword._public, + ContextualKeyword._protected, + ContextualKeyword._private, + ContextualKeyword._override + ]); + } + let isStatic = false; + if (match(TokenType.name) && state.contextualKeyword === ContextualKeyword._static) { + parseIdentifier(); + if (isClassMethod()) { + parseClassMethod(memberStart, false); + return; + } else if (isClassProperty()) { + parseClassProperty(); + return; + } + state.tokens[state.tokens.length - 1].type = TokenType._static; + isStatic = true; + if (match(TokenType.braceL)) { + state.tokens[state.tokens.length - 1].contextId = classContextId; + parseBlock(); + return; + } + } + parseClassMemberWithIsStatic(memberStart, isStatic, classContextId); +} +function parseClassMemberWithIsStatic(memberStart, isStatic, classContextId) { + if (isTypeScriptEnabled) { + if (tsTryParseClassMemberWithIsStatic(isStatic)) { + return; + } + } + if (eat(TokenType.star)) { + parseClassPropertyName(classContextId); + parseClassMethod(memberStart, false); + return; + } + parseClassPropertyName(classContextId); + let isConstructor = false; + const token = state.tokens[state.tokens.length - 1]; + if (token.contextualKeyword === ContextualKeyword._constructor) { + isConstructor = true; + } + parsePostMemberNameModifiers(); + if (isClassMethod()) { + parseClassMethod(memberStart, isConstructor); + } else if (isClassProperty()) { + parseClassProperty(); + } else if (token.contextualKeyword === ContextualKeyword._async && !isLineTerminator()) { + state.tokens[state.tokens.length - 1].type = TokenType._async; + const isGenerator = match(TokenType.star); + if (isGenerator) { + next(); + } + parseClassPropertyName(classContextId); + parsePostMemberNameModifiers(); + parseClassMethod(memberStart, false); + } else if ((token.contextualKeyword === ContextualKeyword._get || token.contextualKeyword === ContextualKeyword._set) && !(isLineTerminator() && match(TokenType.star))) { + if (token.contextualKeyword === ContextualKeyword._get) { + state.tokens[state.tokens.length - 1].type = TokenType._get; + } else { + state.tokens[state.tokens.length - 1].type = TokenType._set; + } + parseClassPropertyName(classContextId); + parseClassMethod(memberStart, false); + } else if (isLineTerminator()) { + parseClassProperty(); + } else { + unexpected(); + } +} +function parseClassMethod(functionStart, isConstructor) { + if (isTypeScriptEnabled) { + tsTryParseTypeParameters(); + } else if (isFlowEnabled) { + if (match(TokenType.lessThan)) { + flowParseTypeParameterDeclaration(); + } + } + parseMethod(functionStart, isConstructor); +} +function parseClassPropertyName(classContextId) { + parsePropertyName(classContextId); +} +function parsePostMemberNameModifiers() { + if (isTypeScriptEnabled) { + const oldIsType = pushTypeContext(0); + eat(TokenType.question); + popTypeContext(oldIsType); + } +} +function parseClassProperty() { + if (isTypeScriptEnabled) { + eatTypeToken(TokenType.bang); + tsTryParseTypeAnnotation(); + } else if (isFlowEnabled) { + if (match(TokenType.colon)) { + flowParseTypeAnnotation(); + } + } + if (match(TokenType.eq)) { + const equalsTokenIndex = state.tokens.length; + next(); + parseMaybeAssign(); + state.tokens[equalsTokenIndex].rhsEndIndex = state.tokens.length; + } + semicolon(); +} +function parseClassId(isStatement, optionalId = false) { + if (isTypeScriptEnabled && (!isStatement || optionalId) && isContextual(ContextualKeyword._implements)) { + return; + } + if (match(TokenType.name)) { + parseBindingIdentifier(true); + } + if (isTypeScriptEnabled) { + tsTryParseTypeParameters(); + } else if (isFlowEnabled) { + if (match(TokenType.lessThan)) { + flowParseTypeParameterDeclaration(); + } + } +} +function parseClassSuper() { + let hasSuper = false; + if (eat(TokenType._extends)) { + parseExprSubscripts(); + hasSuper = true; + } else { + hasSuper = false; + } + if (isTypeScriptEnabled) { + tsAfterParseClassSuper(hasSuper); + } else if (isFlowEnabled) { + flowAfterParseClassSuper(hasSuper); + } +} +function parseExport() { + const exportIndex = state.tokens.length - 1; + if (isTypeScriptEnabled) { + if (tsTryParseExport()) { + return; + } + } + if (shouldParseExportStar()) { + parseExportStar(); + } else if (isExportDefaultSpecifier()) { + parseIdentifier(); + if (match(TokenType.comma) && lookaheadType() === TokenType.star) { + expect(TokenType.comma); + expect(TokenType.star); + expectContextual(ContextualKeyword._as); + parseIdentifier(); + } else { + parseExportSpecifiersMaybe(); + } + parseExportFrom(); + } else if (eat(TokenType._default)) { + parseExportDefaultExpression(); + } else if (shouldParseExportDeclaration()) { + parseExportDeclaration(); + } else { + parseExportSpecifiers(); + parseExportFrom(); + } + state.tokens[exportIndex].rhsEndIndex = state.tokens.length; +} +function parseExportDefaultExpression() { + if (isTypeScriptEnabled) { + if (tsTryParseExportDefaultExpression()) { + return; + } + } + if (isFlowEnabled) { + if (flowTryParseExportDefaultExpression()) { + return; + } + } + const functionStart = state.start; + if (eat(TokenType._function)) { + parseFunction(functionStart, true, true); + } else if (isContextual(ContextualKeyword._async) && lookaheadType() === TokenType._function) { + eatContextual(ContextualKeyword._async); + eat(TokenType._function); + parseFunction(functionStart, true, true); + } else if (match(TokenType._class)) { + parseClass(true, true); + } else if (match(TokenType.at)) { + parseDecorators(); + parseClass(true, true); + } else { + parseMaybeAssign(); + semicolon(); + } +} +function parseExportDeclaration() { + if (isTypeScriptEnabled) { + tsParseExportDeclaration(); + } else if (isFlowEnabled) { + flowParseExportDeclaration(); + } else { + parseStatement(true); + } +} +function isExportDefaultSpecifier() { + if (isTypeScriptEnabled && tsIsDeclarationStart()) { + return false; + } else if (isFlowEnabled && flowShouldDisallowExportDefaultSpecifier()) { + return false; + } + if (match(TokenType.name)) { + return state.contextualKeyword !== ContextualKeyword._async; + } + if (!match(TokenType._default)) { + return false; + } + const _next = nextTokenStart(); + const lookahead = lookaheadTypeAndKeyword(); + const hasFrom = lookahead.type === TokenType.name && lookahead.contextualKeyword === ContextualKeyword._from; + if (lookahead.type === TokenType.comma) { + return true; + } + if (hasFrom) { + const nextAfterFrom = input.charCodeAt(nextTokenStartSince(_next + 4)); + return nextAfterFrom === charCodes.quotationMark || nextAfterFrom === charCodes.apostrophe; + } + return false; +} +function parseExportSpecifiersMaybe() { + if (eat(TokenType.comma)) { + parseExportSpecifiers(); + } +} +function parseExportFrom() { + if (eatContextual(ContextualKeyword._from)) { + parseExprAtom(); + } + semicolon(); +} +function shouldParseExportStar() { + if (isFlowEnabled) { + return flowShouldParseExportStar(); + } else { + return match(TokenType.star); + } +} +function parseExportStar() { + if (isFlowEnabled) { + flowParseExportStar(); + } else { + baseParseExportStar(); + } +} +function baseParseExportStar() { + expect(TokenType.star); + if (isContextual(ContextualKeyword._as)) { + parseExportNamespace(); + } else { + parseExportFrom(); + } +} +function parseExportNamespace() { + next(); + state.tokens[state.tokens.length - 1].type = TokenType._as; + parseIdentifier(); + parseExportSpecifiersMaybe(); + parseExportFrom(); +} +function shouldParseExportDeclaration() { + return isTypeScriptEnabled && tsIsDeclarationStart() || isFlowEnabled && flowShouldParseExportDeclaration() || state.type === TokenType._var || state.type === TokenType._const || state.type === TokenType._let || state.type === TokenType._function || state.type === TokenType._class || isContextual(ContextualKeyword._async) || match(TokenType.at); +} +function parseExportSpecifiers() { + let first = true; + expect(TokenType.braceL); + while (!eat(TokenType.braceR) && !state.error) { + if (first) { + first = false; + } else { + expect(TokenType.comma); + if (eat(TokenType.braceR)) { + break; + } + } + parseExportSpecifier(); + } +} +function parseExportSpecifier() { + if (isTypeScriptEnabled) { + tsParseExportSpecifier(); + return; + } + parseIdentifier(); + state.tokens[state.tokens.length - 1].identifierRole = IdentifierRole.ExportAccess; + if (eatContextual(ContextualKeyword._as)) { + parseIdentifier(); + } +} +function parseImport() { + if (isTypeScriptEnabled && match(TokenType.name) && lookaheadType() === TokenType.eq) { + tsParseImportEqualsDeclaration(); + return; + } + if (isTypeScriptEnabled && isContextual(ContextualKeyword._type)) { + const lookahead = lookaheadType(); + if (lookahead === TokenType.name) { + expectContextual(ContextualKeyword._type); + if (lookaheadType() === TokenType.eq) { + tsParseImportEqualsDeclaration(); + return; + } + } else if (lookahead === TokenType.star || lookahead === TokenType.braceL) { + expectContextual(ContextualKeyword._type); + } + } + if (match(TokenType.string)) { + parseExprAtom(); + } else { + parseImportSpecifiers(); + expectContextual(ContextualKeyword._from); + parseExprAtom(); + } + semicolon(); +} +function shouldParseDefaultImport() { + return match(TokenType.name); +} +function parseImportSpecifierLocal() { + parseImportedIdentifier(); +} +function parseImportSpecifiers() { + if (isFlowEnabled) { + flowStartParseImportSpecifiers(); + } + let first = true; + if (shouldParseDefaultImport()) { + parseImportSpecifierLocal(); + if (!eat(TokenType.comma)) + return; + } + if (match(TokenType.star)) { + next(); + expectContextual(ContextualKeyword._as); + parseImportSpecifierLocal(); + return; + } + expect(TokenType.braceL); + while (!eat(TokenType.braceR) && !state.error) { + if (first) { + first = false; + } else { + if (eat(TokenType.colon)) { + unexpected("ES2015 named imports do not destructure. Use another statement for destructuring after the import."); + } + expect(TokenType.comma); + if (eat(TokenType.braceR)) { + break; + } + } + parseImportSpecifier(); + } +} +function parseImportSpecifier() { + if (isTypeScriptEnabled) { + tsParseImportSpecifier(); + return; + } + if (isFlowEnabled) { + flowParseImportSpecifier(); + return; + } + parseImportedIdentifier(); + if (isContextual(ContextualKeyword._as)) { + state.tokens[state.tokens.length - 1].identifierRole = IdentifierRole.ImportAccess; + next(); + parseImportedIdentifier(); + } +} + +// node_modules/sucrase/dist/esm/parser/traverser/index.js +function parseFile() { + if (state.pos === 0 && input.charCodeAt(0) === charCodes.numberSign && input.charCodeAt(1) === charCodes.exclamationMark) { + skipLineComment(2); + } + nextToken(); + return parseTopLevel(); +} + +// node_modules/sucrase/dist/esm/parser/index.js +var File$1 = class { + constructor(tokens, scopes) { + this.tokens = tokens; + this.scopes = scopes; + } +}; +function parse(input2, isJSXEnabled2, isTypeScriptEnabled2, isFlowEnabled2) { + if (isFlowEnabled2 && isTypeScriptEnabled2) { + throw new Error("Cannot combine flow and typescript plugins."); + } + initParser(input2, isJSXEnabled2, isTypeScriptEnabled2, isFlowEnabled2); + const result = parseFile(); + if (state.error) { + throw augmentError(state.error); + } + return result; +} + +// node_modules/sucrase/dist/esm/util/isAsyncOperation.js +function isAsyncOperation(tokens) { + let index = tokens.currentIndex(); + let depth = 0; + const startToken = tokens.currentToken(); + do { + const token = tokens.tokens[index]; + if (token.isOptionalChainStart) { + depth++; + } + if (token.isOptionalChainEnd) { + depth--; + } + depth += token.numNullishCoalesceStarts; + depth -= token.numNullishCoalesceEnds; + if (token.contextualKeyword === ContextualKeyword._await && token.identifierRole == null && token.scopeDepth === startToken.scopeDepth) { + return true; + } + index += 1; + } while (depth > 0 && index < tokens.tokens.length); + return false; +} + +// node_modules/sucrase/dist/esm/TokenProcessor.js +var TokenProcessor = class { + __init() { + this.resultCode = ""; + } + __init2() { + this.tokenIndex = 0; + } + constructor(code, tokens, isFlowEnabled2, disableESTransforms, helperManager) { + this.code = code; + this.tokens = tokens; + this.isFlowEnabled = isFlowEnabled2; + this.disableESTransforms = disableESTransforms; + this.helperManager = helperManager; + TokenProcessor.prototype.__init.call(this); + TokenProcessor.prototype.__init2.call(this); + } + snapshot() { + return { resultCode: this.resultCode, tokenIndex: this.tokenIndex }; + } + restoreToSnapshot(snapshot) { + this.resultCode = snapshot.resultCode; + this.tokenIndex = snapshot.tokenIndex; + } + getResultCodeIndex() { + return this.resultCode.length; + } + reset() { + this.resultCode = ""; + this.tokenIndex = 0; + } + matchesContextualAtIndex(index, contextualKeyword) { + return this.matches1AtIndex(index, TokenType.name) && this.tokens[index].contextualKeyword === contextualKeyword; + } + identifierNameAtIndex(index) { + return this.identifierNameForToken(this.tokens[index]); + } + identifierNameAtRelativeIndex(relativeIndex) { + return this.identifierNameForToken(this.tokenAtRelativeIndex(relativeIndex)); + } + identifierName() { + return this.identifierNameForToken(this.currentToken()); + } + identifierNameForToken(token) { + return this.code.slice(token.start, token.end); + } + rawCodeForToken(token) { + return this.code.slice(token.start, token.end); + } + stringValueAtIndex(index) { + return this.stringValueForToken(this.tokens[index]); + } + stringValue() { + return this.stringValueForToken(this.currentToken()); + } + stringValueForToken(token) { + return this.code.slice(token.start + 1, token.end - 1); + } + matches1AtIndex(index, t1) { + return this.tokens[index].type === t1; + } + matches2AtIndex(index, t1, t2) { + return this.tokens[index].type === t1 && this.tokens[index + 1].type === t2; + } + matches3AtIndex(index, t1, t2, t3) { + return this.tokens[index].type === t1 && this.tokens[index + 1].type === t2 && this.tokens[index + 2].type === t3; + } + matches1(t1) { + return this.tokens[this.tokenIndex].type === t1; + } + matches2(t1, t2) { + return this.tokens[this.tokenIndex].type === t1 && this.tokens[this.tokenIndex + 1].type === t2; + } + matches3(t1, t2, t3) { + return this.tokens[this.tokenIndex].type === t1 && this.tokens[this.tokenIndex + 1].type === t2 && this.tokens[this.tokenIndex + 2].type === t3; + } + matches4(t1, t2, t3, t4) { + return this.tokens[this.tokenIndex].type === t1 && this.tokens[this.tokenIndex + 1].type === t2 && this.tokens[this.tokenIndex + 2].type === t3 && this.tokens[this.tokenIndex + 3].type === t4; + } + matches5(t1, t2, t3, t4, t5) { + return this.tokens[this.tokenIndex].type === t1 && this.tokens[this.tokenIndex + 1].type === t2 && this.tokens[this.tokenIndex + 2].type === t3 && this.tokens[this.tokenIndex + 3].type === t4 && this.tokens[this.tokenIndex + 4].type === t5; + } + matchesContextual(contextualKeyword) { + return this.matchesContextualAtIndex(this.tokenIndex, contextualKeyword); + } + matchesContextIdAndLabel(type, contextId) { + return this.matches1(type) && this.currentToken().contextId === contextId; + } + previousWhitespaceAndComments() { + let whitespaceAndComments = this.code.slice(this.tokenIndex > 0 ? this.tokens[this.tokenIndex - 1].end : 0, this.tokenIndex < this.tokens.length ? this.tokens[this.tokenIndex].start : this.code.length); + if (this.isFlowEnabled) { + whitespaceAndComments = whitespaceAndComments.replace(/@flow/g, ""); + } + return whitespaceAndComments; + } + replaceToken(newCode) { + this.resultCode += this.previousWhitespaceAndComments(); + this.appendTokenPrefix(); + this.resultCode += newCode; + this.appendTokenSuffix(); + this.tokenIndex++; + } + replaceTokenTrimmingLeftWhitespace(newCode) { + this.resultCode += this.previousWhitespaceAndComments().replace(/[^\r\n]/g, ""); + this.appendTokenPrefix(); + this.resultCode += newCode; + this.appendTokenSuffix(); + this.tokenIndex++; + } + removeInitialToken() { + this.replaceToken(""); + } + removeToken() { + this.replaceTokenTrimmingLeftWhitespace(""); + } + copyExpectedToken(tokenType) { + if (this.tokens[this.tokenIndex].type !== tokenType) { + throw new Error(`Expected token ${tokenType}`); + } + this.copyToken(); + } + copyToken() { + this.resultCode += this.previousWhitespaceAndComments(); + this.appendTokenPrefix(); + this.resultCode += this.code.slice(this.tokens[this.tokenIndex].start, this.tokens[this.tokenIndex].end); + this.appendTokenSuffix(); + this.tokenIndex++; + } + copyTokenWithPrefix(prefix) { + this.resultCode += this.previousWhitespaceAndComments(); + this.appendTokenPrefix(); + this.resultCode += prefix; + this.resultCode += this.code.slice(this.tokens[this.tokenIndex].start, this.tokens[this.tokenIndex].end); + this.appendTokenSuffix(); + this.tokenIndex++; + } + appendTokenPrefix() { + const token = this.currentToken(); + if (token.numNullishCoalesceStarts || token.isOptionalChainStart) { + token.isAsyncOperation = isAsyncOperation(this); + } + if (this.disableESTransforms) { + return; + } + if (token.numNullishCoalesceStarts) { + for (let i = 0; i < token.numNullishCoalesceStarts; i++) { + if (token.isAsyncOperation) { + this.resultCode += "await "; + this.resultCode += this.helperManager.getHelperName("asyncNullishCoalesce"); + } else { + this.resultCode += this.helperManager.getHelperName("nullishCoalesce"); + } + this.resultCode += "("; + } + } + if (token.isOptionalChainStart) { + if (token.isAsyncOperation) { + this.resultCode += "await "; + } + if (this.tokenIndex > 0 && this.tokenAtRelativeIndex(-1).type === TokenType._delete) { + if (token.isAsyncOperation) { + this.resultCode += this.helperManager.getHelperName("asyncOptionalChainDelete"); + } else { + this.resultCode += this.helperManager.getHelperName("optionalChainDelete"); + } + } else if (token.isAsyncOperation) { + this.resultCode += this.helperManager.getHelperName("asyncOptionalChain"); + } else { + this.resultCode += this.helperManager.getHelperName("optionalChain"); + } + this.resultCode += "(["; + } + } + appendTokenSuffix() { + const token = this.currentToken(); + if (token.isOptionalChainEnd && !this.disableESTransforms) { + this.resultCode += "])"; + } + if (token.numNullishCoalesceEnds && !this.disableESTransforms) { + for (let i = 0; i < token.numNullishCoalesceEnds; i++) { + this.resultCode += "))"; + } + } + } + appendCode(code) { + this.resultCode += code; + } + currentToken() { + return this.tokens[this.tokenIndex]; + } + currentTokenCode() { + const token = this.currentToken(); + return this.code.slice(token.start, token.end); + } + tokenAtRelativeIndex(relativeIndex) { + return this.tokens[this.tokenIndex + relativeIndex]; + } + currentIndex() { + return this.tokenIndex; + } + nextToken() { + if (this.tokenIndex === this.tokens.length) { + throw new Error("Unexpectedly reached end of input."); + } + this.tokenIndex++; + } + previousToken() { + this.tokenIndex--; + } + finish() { + if (this.tokenIndex !== this.tokens.length) { + throw new Error("Tried to finish processing tokens before reaching the end."); + } + this.resultCode += this.previousWhitespaceAndComments(); + return this.resultCode; + } + isAtEnd() { + return this.tokenIndex === this.tokens.length; + } +}; + +// node_modules/sucrase/dist/esm/util/getClassInfo.js +function getClassInfo(rootTransformer, tokens, nameManager, disableESTransforms) { + const snapshot = tokens.snapshot(); + const headerInfo = processClassHeader(tokens); + let constructorInitializerStatements = []; + const instanceInitializerNames = []; + const staticInitializerNames = []; + let constructorInsertPos = null; + const fields = []; + const rangesToRemove = []; + const classContextId = tokens.currentToken().contextId; + if (classContextId == null) { + throw new Error("Expected non-null class context ID on class open-brace."); + } + tokens.nextToken(); + while (!tokens.matchesContextIdAndLabel(TokenType.braceR, classContextId)) { + if (tokens.matchesContextual(ContextualKeyword._constructor) && !tokens.currentToken().isType) { + ({ constructorInitializerStatements, constructorInsertPos } = processConstructor(tokens)); + } else if (tokens.matches1(TokenType.semi)) { + if (!disableESTransforms) { + rangesToRemove.push({ start: tokens.currentIndex(), end: tokens.currentIndex() + 1 }); + } + tokens.nextToken(); + } else if (tokens.currentToken().isType) { + tokens.nextToken(); + } else { + const statementStartIndex = tokens.currentIndex(); + let isStatic = false; + let isESPrivate = false; + let isDeclare = false; + while (isAccessModifier(tokens.currentToken())) { + if (tokens.matches1(TokenType._static)) { + isStatic = true; + } + if (tokens.matches1(TokenType.hash)) { + isESPrivate = true; + } + if (tokens.matches1(TokenType._declare)) { + isDeclare = true; + } + tokens.nextToken(); + } + if (isStatic && tokens.matches1(TokenType.braceL)) { + skipToNextClassElement(tokens, classContextId); + continue; + } + if (isESPrivate) { + skipToNextClassElement(tokens, classContextId); + continue; + } + if (tokens.matchesContextual(ContextualKeyword._constructor) && !tokens.currentToken().isType) { + ({ constructorInitializerStatements, constructorInsertPos } = processConstructor(tokens)); + continue; + } + const nameStartIndex = tokens.currentIndex(); + skipFieldName(tokens); + if (tokens.matches1(TokenType.lessThan) || tokens.matches1(TokenType.parenL)) { + skipToNextClassElement(tokens, classContextId); + continue; + } + while (tokens.currentToken().isType) { + tokens.nextToken(); + } + if (tokens.matches1(TokenType.eq)) { + const equalsIndex = tokens.currentIndex(); + const valueEnd = tokens.currentToken().rhsEndIndex; + if (valueEnd == null) { + throw new Error("Expected rhsEndIndex on class field assignment."); + } + tokens.nextToken(); + while (tokens.currentIndex() < valueEnd) { + rootTransformer.processToken(); + } + let initializerName; + if (isStatic) { + initializerName = nameManager.claimFreeName("__initStatic"); + staticInitializerNames.push(initializerName); + } else { + initializerName = nameManager.claimFreeName("__init"); + instanceInitializerNames.push(initializerName); + } + fields.push({ + initializerName, + equalsIndex, + start: nameStartIndex, + end: tokens.currentIndex() + }); + } else if (!disableESTransforms || isDeclare) { + rangesToRemove.push({ start: statementStartIndex, end: tokens.currentIndex() }); + } + } + } + tokens.restoreToSnapshot(snapshot); + if (disableESTransforms) { + return { + headerInfo, + constructorInitializerStatements, + instanceInitializerNames: [], + staticInitializerNames: [], + constructorInsertPos, + fields: [], + rangesToRemove + }; + } else { + return { + headerInfo, + constructorInitializerStatements, + instanceInitializerNames, + staticInitializerNames, + constructorInsertPos, + fields, + rangesToRemove + }; + } +} +function skipToNextClassElement(tokens, classContextId) { + tokens.nextToken(); + while (tokens.currentToken().contextId !== classContextId) { + tokens.nextToken(); + } + while (isAccessModifier(tokens.tokenAtRelativeIndex(-1))) { + tokens.previousToken(); + } +} +function processClassHeader(tokens) { + const classToken = tokens.currentToken(); + const contextId = classToken.contextId; + if (contextId == null) { + throw new Error("Expected context ID on class token."); + } + const isExpression = classToken.isExpression; + if (isExpression == null) { + throw new Error("Expected isExpression on class token."); + } + let className = null; + let hasSuperclass = false; + tokens.nextToken(); + if (tokens.matches1(TokenType.name)) { + className = tokens.identifierName(); + } + while (!tokens.matchesContextIdAndLabel(TokenType.braceL, contextId)) { + if (tokens.matches1(TokenType._extends) && !tokens.currentToken().isType) { + hasSuperclass = true; + } + tokens.nextToken(); + } + return { isExpression, className, hasSuperclass }; +} +function processConstructor(tokens) { + const constructorInitializerStatements = []; + tokens.nextToken(); + const constructorContextId = tokens.currentToken().contextId; + if (constructorContextId == null) { + throw new Error("Expected context ID on open-paren starting constructor params."); + } + while (!tokens.matchesContextIdAndLabel(TokenType.parenR, constructorContextId)) { + if (tokens.currentToken().contextId === constructorContextId) { + tokens.nextToken(); + if (isAccessModifier(tokens.currentToken())) { + tokens.nextToken(); + while (isAccessModifier(tokens.currentToken())) { + tokens.nextToken(); + } + const token = tokens.currentToken(); + if (token.type !== TokenType.name) { + throw new Error("Expected identifier after access modifiers in constructor arg."); + } + const name = tokens.identifierNameForToken(token); + constructorInitializerStatements.push(`this.${name} = ${name}`); + } + } else { + tokens.nextToken(); + } + } + tokens.nextToken(); + let constructorInsertPos = tokens.currentIndex(); + let foundSuperCall = false; + while (!tokens.matchesContextIdAndLabel(TokenType.braceR, constructorContextId)) { + if (!foundSuperCall && tokens.matches2(TokenType._super, TokenType.parenL)) { + tokens.nextToken(); + const superCallContextId = tokens.currentToken().contextId; + if (superCallContextId == null) { + throw new Error("Expected a context ID on the super call"); + } + while (!tokens.matchesContextIdAndLabel(TokenType.parenR, superCallContextId)) { + tokens.nextToken(); + } + constructorInsertPos = tokens.currentIndex(); + foundSuperCall = true; + } + tokens.nextToken(); + } + tokens.nextToken(); + return { constructorInitializerStatements, constructorInsertPos }; +} +function isAccessModifier(token) { + return [ + TokenType._async, + TokenType._get, + TokenType._set, + TokenType.plus, + TokenType.minus, + TokenType._readonly, + TokenType._static, + TokenType._public, + TokenType._private, + TokenType._protected, + TokenType._override, + TokenType._abstract, + TokenType.star, + TokenType._declare, + TokenType.hash + ].includes(token.type); +} +function skipFieldName(tokens) { + if (tokens.matches1(TokenType.bracketL)) { + const startToken = tokens.currentToken(); + const classContextId = startToken.contextId; + if (classContextId == null) { + throw new Error("Expected class context ID on computed name open bracket."); + } + while (!tokens.matchesContextIdAndLabel(TokenType.bracketR, classContextId)) { + tokens.nextToken(); + } + tokens.nextToken(); + } else { + tokens.nextToken(); + } +} + +// node_modules/sucrase/dist/esm/util/elideImportEquals.js +function elideImportEquals(tokens) { + tokens.removeInitialToken(); + tokens.removeToken(); + tokens.removeToken(); + tokens.removeToken(); + if (tokens.matches1(TokenType.parenL)) { + tokens.removeToken(); + tokens.removeToken(); + tokens.removeToken(); + } else { + while (tokens.matches1(TokenType.dot)) { + tokens.removeToken(); + tokens.removeToken(); + } + } +} + +// node_modules/sucrase/dist/esm/util/getDeclarationInfo.js +var EMPTY_DECLARATION_INFO = { + typeDeclarations: /* @__PURE__ */ new Set(), + valueDeclarations: /* @__PURE__ */ new Set() +}; +function getDeclarationInfo(tokens) { + const typeDeclarations = /* @__PURE__ */ new Set(); + const valueDeclarations = /* @__PURE__ */ new Set(); + for (let i = 0; i < tokens.tokens.length; i++) { + const token = tokens.tokens[i]; + if (token.type === TokenType.name && isTopLevelDeclaration(token)) { + if (token.isType) { + typeDeclarations.add(tokens.identifierNameForToken(token)); + } else { + valueDeclarations.add(tokens.identifierNameForToken(token)); + } + } + } + return { typeDeclarations, valueDeclarations }; +} + +// node_modules/sucrase/dist/esm/util/shouldElideDefaultExport.js +function shouldElideDefaultExport(isTypeScriptTransformEnabled, tokens, declarationInfo) { + if (!isTypeScriptTransformEnabled) { + return false; + } + const exportToken = tokens.currentToken(); + if (exportToken.rhsEndIndex == null) { + throw new Error("Expected non-null rhsEndIndex on export token."); + } + const numTokens = exportToken.rhsEndIndex - tokens.currentIndex(); + if (numTokens !== 3 && !(numTokens === 4 && tokens.matches1AtIndex(exportToken.rhsEndIndex - 1, TokenType.semi))) { + return false; + } + const identifierToken = tokens.tokenAtRelativeIndex(2); + if (identifierToken.type !== TokenType.name) { + return false; + } + const exportedName = tokens.identifierNameForToken(identifierToken); + return declarationInfo.typeDeclarations.has(exportedName) && !declarationInfo.valueDeclarations.has(exportedName); +} + +// node_modules/sucrase/dist/esm/transformers/CJSImportTransformer.js +var CJSImportTransformer = class extends Transformer { + __init() { + this.hadExport = false; + } + __init2() { + this.hadNamedExport = false; + } + __init3() { + this.hadDefaultExport = false; + } + constructor(rootTransformer, tokens, importProcessor, nameManager, reactHotLoaderTransformer, enableLegacyBabel5ModuleInterop, isTypeScriptTransformEnabled) { + super(); + this.rootTransformer = rootTransformer; + this.tokens = tokens; + this.importProcessor = importProcessor; + this.nameManager = nameManager; + this.reactHotLoaderTransformer = reactHotLoaderTransformer; + this.enableLegacyBabel5ModuleInterop = enableLegacyBabel5ModuleInterop; + this.isTypeScriptTransformEnabled = isTypeScriptTransformEnabled; + CJSImportTransformer.prototype.__init.call(this); + CJSImportTransformer.prototype.__init2.call(this); + CJSImportTransformer.prototype.__init3.call(this); + this.declarationInfo = isTypeScriptTransformEnabled ? getDeclarationInfo(tokens) : EMPTY_DECLARATION_INFO; + } + getPrefixCode() { + let prefix = ""; + if (this.hadExport) { + prefix += 'Object.defineProperty(exports, "__esModule", {value: true});'; + } + return prefix; + } + getSuffixCode() { + if (this.enableLegacyBabel5ModuleInterop && this.hadDefaultExport && !this.hadNamedExport) { + return "\nmodule.exports = exports.default;\n"; + } + return ""; + } + process() { + if (this.tokens.matches3(TokenType._import, TokenType.name, TokenType.eq)) { + return this.processImportEquals(); + } + if (this.tokens.matches1(TokenType._import)) { + this.processImport(); + return true; + } + if (this.tokens.matches2(TokenType._export, TokenType.eq)) { + this.tokens.replaceToken("module.exports"); + return true; + } + if (this.tokens.matches1(TokenType._export) && !this.tokens.currentToken().isType) { + this.hadExport = true; + return this.processExport(); + } + if (this.tokens.matches2(TokenType.name, TokenType.postIncDec)) { + if (this.processPostIncDec()) { + return true; + } + } + if (this.tokens.matches1(TokenType.name) || this.tokens.matches1(TokenType.jsxName)) { + return this.processIdentifier(); + } + if (this.tokens.matches1(TokenType.eq)) { + return this.processAssignment(); + } + if (this.tokens.matches1(TokenType.assign)) { + return this.processComplexAssignment(); + } + if (this.tokens.matches1(TokenType.preIncDec)) { + return this.processPreIncDec(); + } + return false; + } + processImportEquals() { + const importName = this.tokens.identifierNameAtIndex(this.tokens.currentIndex() + 1); + if (this.importProcessor.isTypeName(importName)) { + elideImportEquals(this.tokens); + } else { + this.tokens.replaceToken("const"); + } + return true; + } + processImport() { + if (this.tokens.matches2(TokenType._import, TokenType.parenL)) { + this.tokens.replaceToken("Promise.resolve().then(() => require"); + const contextId = this.tokens.currentToken().contextId; + if (contextId == null) { + throw new Error("Expected context ID on dynamic import invocation."); + } + this.tokens.copyToken(); + while (!this.tokens.matchesContextIdAndLabel(TokenType.parenR, contextId)) { + this.rootTransformer.processToken(); + } + this.tokens.replaceToken("))"); + return; + } + const wasOnlyTypes = this.removeImportAndDetectIfType(); + if (wasOnlyTypes) { + this.tokens.removeToken(); + } else { + const path = this.tokens.stringValue(); + this.tokens.replaceTokenTrimmingLeftWhitespace(this.importProcessor.claimImportCode(path)); + this.tokens.appendCode(this.importProcessor.claimImportCode(path)); + } + if (this.tokens.matches1(TokenType.semi)) { + this.tokens.removeToken(); + } + } + removeImportAndDetectIfType() { + this.tokens.removeInitialToken(); + if (this.tokens.matchesContextual(ContextualKeyword._type) && !this.tokens.matches1AtIndex(this.tokens.currentIndex() + 1, TokenType.comma) && !this.tokens.matchesContextualAtIndex(this.tokens.currentIndex() + 1, ContextualKeyword._from)) { + this.removeRemainingImport(); + return true; + } + if (this.tokens.matches1(TokenType.name) || this.tokens.matches1(TokenType.star)) { + this.removeRemainingImport(); + return false; + } + if (this.tokens.matches1(TokenType.string)) { + return false; + } + let foundNonType = false; + while (!this.tokens.matches1(TokenType.string)) { + if (!foundNonType && this.tokens.matches1(TokenType.braceL) || this.tokens.matches1(TokenType.comma)) { + this.tokens.removeToken(); + if (this.tokens.matches2(TokenType.name, TokenType.comma) || this.tokens.matches2(TokenType.name, TokenType.braceR) || this.tokens.matches4(TokenType.name, TokenType.name, TokenType.name, TokenType.comma) || this.tokens.matches4(TokenType.name, TokenType.name, TokenType.name, TokenType.braceR)) { + foundNonType = true; + } + } + this.tokens.removeToken(); + } + return !foundNonType; + } + removeRemainingImport() { + while (!this.tokens.matches1(TokenType.string)) { + this.tokens.removeToken(); + } + } + processIdentifier() { + const token = this.tokens.currentToken(); + if (token.shadowsGlobal) { + return false; + } + if (token.identifierRole === IdentifierRole.ObjectShorthand) { + return this.processObjectShorthand(); + } + if (token.identifierRole !== IdentifierRole.Access) { + return false; + } + const replacement = this.importProcessor.getIdentifierReplacement(this.tokens.identifierNameForToken(token)); + if (!replacement) { + return false; + } + let possibleOpenParenIndex = this.tokens.currentIndex() + 1; + while (possibleOpenParenIndex < this.tokens.tokens.length && this.tokens.tokens[possibleOpenParenIndex].type === TokenType.parenR) { + possibleOpenParenIndex++; + } + if (this.tokens.tokens[possibleOpenParenIndex].type === TokenType.parenL) { + if (this.tokens.tokenAtRelativeIndex(1).type === TokenType.parenL && this.tokens.tokenAtRelativeIndex(-1).type !== TokenType._new) { + this.tokens.replaceToken(`${replacement}.call(void 0, `); + this.tokens.removeToken(); + this.rootTransformer.processBalancedCode(); + this.tokens.copyExpectedToken(TokenType.parenR); + } else { + this.tokens.replaceToken(`(0, ${replacement})`); + } + } else { + this.tokens.replaceToken(replacement); + } + return true; + } + processObjectShorthand() { + const identifier = this.tokens.identifierName(); + const replacement = this.importProcessor.getIdentifierReplacement(identifier); + if (!replacement) { + return false; + } + this.tokens.replaceToken(`${identifier}: ${replacement}`); + return true; + } + processExport() { + if (this.tokens.matches2(TokenType._export, TokenType._enum) || this.tokens.matches3(TokenType._export, TokenType._const, TokenType._enum)) { + return false; + } + if (this.tokens.matches2(TokenType._export, TokenType._default)) { + this.hadDefaultExport = true; + if (this.tokens.matches3(TokenType._export, TokenType._default, TokenType._enum)) { + return false; + } + this.processExportDefault(); + return true; + } + this.hadNamedExport = true; + if (this.tokens.matches2(TokenType._export, TokenType._var) || this.tokens.matches2(TokenType._export, TokenType._let) || this.tokens.matches2(TokenType._export, TokenType._const)) { + this.processExportVar(); + return true; + } else if (this.tokens.matches2(TokenType._export, TokenType._function) || this.tokens.matches3(TokenType._export, TokenType.name, TokenType._function)) { + this.processExportFunction(); + return true; + } else if (this.tokens.matches2(TokenType._export, TokenType._class) || this.tokens.matches3(TokenType._export, TokenType._abstract, TokenType._class)) { + this.processExportClass(); + return true; + } else if (this.tokens.matches2(TokenType._export, TokenType.braceL)) { + this.processExportBindings(); + return true; + } else if (this.tokens.matches2(TokenType._export, TokenType.star)) { + this.processExportStar(); + return true; + } else if (this.tokens.matches3(TokenType._export, TokenType.name, TokenType.braceL) && this.tokens.matchesContextualAtIndex(this.tokens.currentIndex() + 1, ContextualKeyword._type)) { + this.tokens.removeInitialToken(); + while (!this.tokens.matches1(TokenType.braceR)) { + this.tokens.removeToken(); + } + this.tokens.removeToken(); + if (this.tokens.matchesContextual(ContextualKeyword._from) && this.tokens.matches1AtIndex(this.tokens.currentIndex() + 1, TokenType.string)) { + this.tokens.removeToken(); + this.tokens.removeToken(); + } + return true; + } else { + throw new Error("Unrecognized export syntax."); + } + } + processAssignment() { + const index = this.tokens.currentIndex(); + const identifierToken = this.tokens.tokens[index - 1]; + if (identifierToken.isType || identifierToken.type !== TokenType.name) { + return false; + } + if (identifierToken.shadowsGlobal) { + return false; + } + if (index >= 2 && this.tokens.matches1AtIndex(index - 2, TokenType.dot)) { + return false; + } + if (index >= 2 && [TokenType._var, TokenType._let, TokenType._const].includes(this.tokens.tokens[index - 2].type)) { + return false; + } + const assignmentSnippet = this.importProcessor.resolveExportBinding(this.tokens.identifierNameForToken(identifierToken)); + if (!assignmentSnippet) { + return false; + } + this.tokens.copyToken(); + this.tokens.appendCode(` ${assignmentSnippet} =`); + return true; + } + processComplexAssignment() { + const index = this.tokens.currentIndex(); + const identifierToken = this.tokens.tokens[index - 1]; + if (identifierToken.type !== TokenType.name) { + return false; + } + if (identifierToken.shadowsGlobal) { + return false; + } + if (index >= 2 && this.tokens.matches1AtIndex(index - 2, TokenType.dot)) { + return false; + } + const assignmentSnippet = this.importProcessor.resolveExportBinding(this.tokens.identifierNameForToken(identifierToken)); + if (!assignmentSnippet) { + return false; + } + this.tokens.appendCode(` = ${assignmentSnippet}`); + this.tokens.copyToken(); + return true; + } + processPreIncDec() { + const index = this.tokens.currentIndex(); + const identifierToken = this.tokens.tokens[index + 1]; + if (identifierToken.type !== TokenType.name) { + return false; + } + if (identifierToken.shadowsGlobal) { + return false; + } + if (index + 2 < this.tokens.tokens.length && (this.tokens.matches1AtIndex(index + 2, TokenType.dot) || this.tokens.matches1AtIndex(index + 2, TokenType.bracketL) || this.tokens.matches1AtIndex(index + 2, TokenType.parenL))) { + return false; + } + const identifierName = this.tokens.identifierNameForToken(identifierToken); + const assignmentSnippet = this.importProcessor.resolveExportBinding(identifierName); + if (!assignmentSnippet) { + return false; + } + this.tokens.appendCode(`${assignmentSnippet} = `); + this.tokens.copyToken(); + return true; + } + processPostIncDec() { + const index = this.tokens.currentIndex(); + const identifierToken = this.tokens.tokens[index]; + const operatorToken = this.tokens.tokens[index + 1]; + if (identifierToken.type !== TokenType.name) { + return false; + } + if (identifierToken.shadowsGlobal) { + return false; + } + if (index >= 1 && this.tokens.matches1AtIndex(index - 1, TokenType.dot)) { + return false; + } + const identifierName = this.tokens.identifierNameForToken(identifierToken); + const assignmentSnippet = this.importProcessor.resolveExportBinding(identifierName); + if (!assignmentSnippet) { + return false; + } + const operatorCode = this.tokens.rawCodeForToken(operatorToken); + const base = this.importProcessor.getIdentifierReplacement(identifierName) || identifierName; + if (operatorCode === "++") { + this.tokens.replaceToken(`(${base} = ${assignmentSnippet} = ${base} + 1, ${base} - 1)`); + } else if (operatorCode === "--") { + this.tokens.replaceToken(`(${base} = ${assignmentSnippet} = ${base} - 1, ${base} + 1)`); + } else { + throw new Error(`Unexpected operator: ${operatorCode}`); + } + this.tokens.removeToken(); + return true; + } + processExportDefault() { + if (this.tokens.matches4(TokenType._export, TokenType._default, TokenType._function, TokenType.name) || this.tokens.matches5(TokenType._export, TokenType._default, TokenType.name, TokenType._function, TokenType.name) && this.tokens.matchesContextualAtIndex(this.tokens.currentIndex() + 2, ContextualKeyword._async)) { + this.tokens.removeInitialToken(); + this.tokens.removeToken(); + const name = this.processNamedFunction(); + this.tokens.appendCode(` exports.default = ${name};`); + } else if (this.tokens.matches4(TokenType._export, TokenType._default, TokenType._class, TokenType.name) || this.tokens.matches5(TokenType._export, TokenType._default, TokenType._abstract, TokenType._class, TokenType.name)) { + this.tokens.removeInitialToken(); + this.tokens.removeToken(); + if (this.tokens.matches1(TokenType._abstract)) { + this.tokens.removeToken(); + } + const name = this.rootTransformer.processNamedClass(); + this.tokens.appendCode(` exports.default = ${name};`); + } else if (this.tokens.matches3(TokenType._export, TokenType._default, TokenType.at)) { + throw new Error("Export default statements with decorators are not yet supported."); + } else if (shouldElideDefaultExport(this.isTypeScriptTransformEnabled, this.tokens, this.declarationInfo)) { + this.tokens.removeInitialToken(); + this.tokens.removeToken(); + this.tokens.removeToken(); + } else if (this.reactHotLoaderTransformer) { + const defaultVarName = this.nameManager.claimFreeName("_default"); + this.tokens.replaceToken(`let ${defaultVarName}; exports.`); + this.tokens.copyToken(); + this.tokens.appendCode(` = ${defaultVarName} =`); + this.reactHotLoaderTransformer.setExtractedDefaultExportName(defaultVarName); + } else { + this.tokens.replaceToken("exports."); + this.tokens.copyToken(); + this.tokens.appendCode(" ="); + } + } + processExportVar() { + if (this.isSimpleExportVar()) { + this.processSimpleExportVar(); + } else { + this.processComplexExportVar(); + } + } + isSimpleExportVar() { + let tokenIndex = this.tokens.currentIndex(); + tokenIndex++; + tokenIndex++; + if (!this.tokens.matches1AtIndex(tokenIndex, TokenType.name)) { + return false; + } + tokenIndex++; + while (tokenIndex < this.tokens.tokens.length && this.tokens.tokens[tokenIndex].isType) { + tokenIndex++; + } + if (!this.tokens.matches1AtIndex(tokenIndex, TokenType.eq)) { + return false; + } + return true; + } + processSimpleExportVar() { + this.tokens.removeInitialToken(); + this.tokens.copyToken(); + const varName = this.tokens.identifierName(); + while (!this.tokens.matches1(TokenType.eq)) { + this.rootTransformer.processToken(); + } + const endIndex = this.tokens.currentToken().rhsEndIndex; + if (endIndex == null) { + throw new Error("Expected = token with an end index."); + } + while (this.tokens.currentIndex() < endIndex) { + this.rootTransformer.processToken(); + } + this.tokens.appendCode(`; exports.${varName} = ${varName}`); + } + processComplexExportVar() { + this.tokens.removeInitialToken(); + this.tokens.removeToken(); + const needsParens = this.tokens.matches1(TokenType.braceL); + if (needsParens) { + this.tokens.appendCode("("); + } + let depth = 0; + while (true) { + if (this.tokens.matches1(TokenType.braceL) || this.tokens.matches1(TokenType.dollarBraceL) || this.tokens.matches1(TokenType.bracketL)) { + depth++; + this.tokens.copyToken(); + } else if (this.tokens.matches1(TokenType.braceR) || this.tokens.matches1(TokenType.bracketR)) { + depth--; + this.tokens.copyToken(); + } else if (depth === 0 && !this.tokens.matches1(TokenType.name) && !this.tokens.currentToken().isType) { + break; + } else if (this.tokens.matches1(TokenType.eq)) { + const endIndex = this.tokens.currentToken().rhsEndIndex; + if (endIndex == null) { + throw new Error("Expected = token with an end index."); + } + while (this.tokens.currentIndex() < endIndex) { + this.rootTransformer.processToken(); + } + } else { + const token = this.tokens.currentToken(); + if (isDeclaration(token)) { + const name = this.tokens.identifierName(); + let replacement = this.importProcessor.getIdentifierReplacement(name); + if (replacement === null) { + throw new Error(`Expected a replacement for ${name} in \`export var\` syntax.`); + } + if (isObjectShorthandDeclaration(token)) { + replacement = `${name}: ${replacement}`; + } + this.tokens.replaceToken(replacement); + } else { + this.rootTransformer.processToken(); + } + } + } + if (needsParens) { + const endIndex = this.tokens.currentToken().rhsEndIndex; + if (endIndex == null) { + throw new Error("Expected = token with an end index."); + } + while (this.tokens.currentIndex() < endIndex) { + this.rootTransformer.processToken(); + } + this.tokens.appendCode(")"); + } + } + processExportFunction() { + this.tokens.replaceToken(""); + const name = this.processNamedFunction(); + this.tokens.appendCode(` exports.${name} = ${name};`); + } + processNamedFunction() { + if (this.tokens.matches1(TokenType._function)) { + this.tokens.copyToken(); + } else if (this.tokens.matches2(TokenType.name, TokenType._function)) { + if (!this.tokens.matchesContextual(ContextualKeyword._async)) { + throw new Error("Expected async keyword in function export."); + } + this.tokens.copyToken(); + this.tokens.copyToken(); + } + if (this.tokens.matches1(TokenType.star)) { + this.tokens.copyToken(); + } + if (!this.tokens.matches1(TokenType.name)) { + throw new Error("Expected identifier for exported function name."); + } + const name = this.tokens.identifierName(); + this.tokens.copyToken(); + if (this.tokens.currentToken().isType) { + this.tokens.removeInitialToken(); + while (this.tokens.currentToken().isType) { + this.tokens.removeToken(); + } + } + this.tokens.copyExpectedToken(TokenType.parenL); + this.rootTransformer.processBalancedCode(); + this.tokens.copyExpectedToken(TokenType.parenR); + this.rootTransformer.processPossibleTypeRange(); + this.tokens.copyExpectedToken(TokenType.braceL); + this.rootTransformer.processBalancedCode(); + this.tokens.copyExpectedToken(TokenType.braceR); + return name; + } + processExportClass() { + this.tokens.removeInitialToken(); + if (this.tokens.matches1(TokenType._abstract)) { + this.tokens.removeToken(); + } + const name = this.rootTransformer.processNamedClass(); + this.tokens.appendCode(` exports.${name} = ${name};`); + } + processExportBindings() { + this.tokens.removeInitialToken(); + this.tokens.removeToken(); + const exportStatements = []; + while (true) { + if (this.tokens.matches1(TokenType.braceR)) { + this.tokens.removeToken(); + break; + } + const specifierInfo = getImportExportSpecifierInfo(this.tokens); + while (this.tokens.currentIndex() < specifierInfo.endIndex) { + this.tokens.removeToken(); + } + if (!specifierInfo.isType && !this.shouldElideExportedIdentifier(specifierInfo.leftName)) { + const localName = specifierInfo.leftName; + const exportedName = specifierInfo.rightName; + const newLocalName = this.importProcessor.getIdentifierReplacement(localName); + exportStatements.push(`exports.${exportedName} = ${newLocalName || localName};`); + } + if (this.tokens.matches1(TokenType.braceR)) { + this.tokens.removeToken(); + break; + } + if (this.tokens.matches2(TokenType.comma, TokenType.braceR)) { + this.tokens.removeToken(); + this.tokens.removeToken(); + break; + } else if (this.tokens.matches1(TokenType.comma)) { + this.tokens.removeToken(); + } else { + throw new Error(`Unexpected token: ${JSON.stringify(this.tokens.currentToken())}`); + } + } + if (this.tokens.matchesContextual(ContextualKeyword._from)) { + this.tokens.removeToken(); + const path = this.tokens.stringValue(); + this.tokens.replaceTokenTrimmingLeftWhitespace(this.importProcessor.claimImportCode(path)); + } else { + this.tokens.appendCode(exportStatements.join(" ")); + } + if (this.tokens.matches1(TokenType.semi)) { + this.tokens.removeToken(); + } + } + processExportStar() { + this.tokens.removeInitialToken(); + while (!this.tokens.matches1(TokenType.string)) { + this.tokens.removeToken(); + } + const path = this.tokens.stringValue(); + this.tokens.replaceTokenTrimmingLeftWhitespace(this.importProcessor.claimImportCode(path)); + if (this.tokens.matches1(TokenType.semi)) { + this.tokens.removeToken(); + } + } + shouldElideExportedIdentifier(name) { + return this.isTypeScriptTransformEnabled && !this.declarationInfo.valueDeclarations.has(name); + } +}; + +// node_modules/sucrase/dist/esm/transformers/ESMImportTransformer.js +var ESMImportTransformer = class extends Transformer { + constructor(tokens, nameManager, reactHotLoaderTransformer, isTypeScriptTransformEnabled, options) { + super(); + this.tokens = tokens; + this.nameManager = nameManager; + this.reactHotLoaderTransformer = reactHotLoaderTransformer; + this.isTypeScriptTransformEnabled = isTypeScriptTransformEnabled; + this.nonTypeIdentifiers = isTypeScriptTransformEnabled ? getNonTypeIdentifiers(tokens, options) : /* @__PURE__ */ new Set(); + this.declarationInfo = isTypeScriptTransformEnabled ? getDeclarationInfo(tokens) : EMPTY_DECLARATION_INFO; + } + process() { + if (this.tokens.matches3(TokenType._import, TokenType.name, TokenType.eq)) { + return this.processImportEquals(); + } + if (this.tokens.matches4(TokenType._import, TokenType.name, TokenType.name, TokenType.eq) && this.tokens.matchesContextualAtIndex(this.tokens.currentIndex() + 1, ContextualKeyword._type)) { + this.tokens.removeInitialToken(); + for (let i = 0; i < 7; i++) { + this.tokens.removeToken(); + } + return true; + } + if (this.tokens.matches2(TokenType._export, TokenType.eq)) { + this.tokens.replaceToken("module.exports"); + return true; + } + if (this.tokens.matches5(TokenType._export, TokenType._import, TokenType.name, TokenType.name, TokenType.eq) && this.tokens.matchesContextualAtIndex(this.tokens.currentIndex() + 2, ContextualKeyword._type)) { + this.tokens.removeInitialToken(); + for (let i = 0; i < 8; i++) { + this.tokens.removeToken(); + } + return true; + } + if (this.tokens.matches1(TokenType._import)) { + return this.processImport(); + } + if (this.tokens.matches2(TokenType._export, TokenType._default)) { + return this.processExportDefault(); + } + if (this.tokens.matches2(TokenType._export, TokenType.braceL)) { + return this.processNamedExports(); + } + if (this.tokens.matches3(TokenType._export, TokenType.name, TokenType.braceL) && this.tokens.matchesContextualAtIndex(this.tokens.currentIndex() + 1, ContextualKeyword._type)) { + this.tokens.removeInitialToken(); + while (!this.tokens.matches1(TokenType.braceR)) { + this.tokens.removeToken(); + } + this.tokens.removeToken(); + if (this.tokens.matchesContextual(ContextualKeyword._from) && this.tokens.matches1AtIndex(this.tokens.currentIndex() + 1, TokenType.string)) { + this.tokens.removeToken(); + this.tokens.removeToken(); + } + return true; + } + return false; + } + processImportEquals() { + const importName = this.tokens.identifierNameAtIndex(this.tokens.currentIndex() + 1); + if (this.isTypeName(importName)) { + elideImportEquals(this.tokens); + } else { + this.tokens.replaceToken("const"); + } + return true; + } + processImport() { + if (this.tokens.matches2(TokenType._import, TokenType.parenL)) { + return false; + } + const snapshot = this.tokens.snapshot(); + const allImportsRemoved = this.removeImportTypeBindings(); + if (allImportsRemoved) { + this.tokens.restoreToSnapshot(snapshot); + while (!this.tokens.matches1(TokenType.string)) { + this.tokens.removeToken(); + } + this.tokens.removeToken(); + if (this.tokens.matches1(TokenType.semi)) { + this.tokens.removeToken(); + } + } + return true; + } + removeImportTypeBindings() { + this.tokens.copyExpectedToken(TokenType._import); + if (this.tokens.matchesContextual(ContextualKeyword._type) && !this.tokens.matches1AtIndex(this.tokens.currentIndex() + 1, TokenType.comma) && !this.tokens.matchesContextualAtIndex(this.tokens.currentIndex() + 1, ContextualKeyword._from)) { + return true; + } + if (this.tokens.matches1(TokenType.string)) { + this.tokens.copyToken(); + return false; + } + let foundNonTypeImport = false; + if (this.tokens.matches1(TokenType.name)) { + if (this.isTypeName(this.tokens.identifierName())) { + this.tokens.removeToken(); + if (this.tokens.matches1(TokenType.comma)) { + this.tokens.removeToken(); + } + } else { + foundNonTypeImport = true; + this.tokens.copyToken(); + if (this.tokens.matches1(TokenType.comma)) { + this.tokens.copyToken(); + } + } + } + if (this.tokens.matches1(TokenType.star)) { + if (this.isTypeName(this.tokens.identifierNameAtIndex(this.tokens.currentIndex() + 2))) { + this.tokens.removeToken(); + this.tokens.removeToken(); + this.tokens.removeToken(); + } else { + foundNonTypeImport = true; + this.tokens.copyExpectedToken(TokenType.star); + this.tokens.copyExpectedToken(TokenType.name); + this.tokens.copyExpectedToken(TokenType.name); + } + } else if (this.tokens.matches1(TokenType.braceL)) { + this.tokens.copyToken(); + while (!this.tokens.matches1(TokenType.braceR)) { + const specifierInfo = getImportExportSpecifierInfo(this.tokens); + if (specifierInfo.isType || this.isTypeName(specifierInfo.rightName)) { + while (this.tokens.currentIndex() < specifierInfo.endIndex) { + this.tokens.removeToken(); + } + if (this.tokens.matches1(TokenType.comma)) { + this.tokens.removeToken(); + } + } else { + foundNonTypeImport = true; + while (this.tokens.currentIndex() < specifierInfo.endIndex) { + this.tokens.copyToken(); + } + if (this.tokens.matches1(TokenType.comma)) { + this.tokens.copyToken(); + } + } + } + this.tokens.copyExpectedToken(TokenType.braceR); + } + return !foundNonTypeImport; + } + isTypeName(name) { + return this.isTypeScriptTransformEnabled && !this.nonTypeIdentifiers.has(name); + } + processExportDefault() { + if (shouldElideDefaultExport(this.isTypeScriptTransformEnabled, this.tokens, this.declarationInfo)) { + this.tokens.removeInitialToken(); + this.tokens.removeToken(); + this.tokens.removeToken(); + return true; + } + const alreadyHasName = this.tokens.matches4(TokenType._export, TokenType._default, TokenType._function, TokenType.name) || this.tokens.matches5(TokenType._export, TokenType._default, TokenType.name, TokenType._function, TokenType.name) && this.tokens.matchesContextualAtIndex(this.tokens.currentIndex() + 2, ContextualKeyword._async) || this.tokens.matches4(TokenType._export, TokenType._default, TokenType._class, TokenType.name) || this.tokens.matches5(TokenType._export, TokenType._default, TokenType._abstract, TokenType._class, TokenType.name); + if (!alreadyHasName && this.reactHotLoaderTransformer) { + const defaultVarName = this.nameManager.claimFreeName("_default"); + this.tokens.replaceToken(`let ${defaultVarName}; export`); + this.tokens.copyToken(); + this.tokens.appendCode(` ${defaultVarName} =`); + this.reactHotLoaderTransformer.setExtractedDefaultExportName(defaultVarName); + return true; + } + return false; + } + processNamedExports() { + if (!this.isTypeScriptTransformEnabled) { + return false; + } + this.tokens.copyExpectedToken(TokenType._export); + this.tokens.copyExpectedToken(TokenType.braceL); + while (!this.tokens.matches1(TokenType.braceR)) { + const specifierInfo = getImportExportSpecifierInfo(this.tokens); + if (specifierInfo.isType || this.shouldElideExportedName(specifierInfo.leftName)) { + while (this.tokens.currentIndex() < specifierInfo.endIndex) { + this.tokens.removeToken(); + } + if (this.tokens.matches1(TokenType.comma)) { + this.tokens.removeToken(); + } + } else { + while (this.tokens.currentIndex() < specifierInfo.endIndex) { + this.tokens.copyToken(); + } + if (this.tokens.matches1(TokenType.comma)) { + this.tokens.copyToken(); + } + } + } + this.tokens.copyExpectedToken(TokenType.braceR); + return true; + } + shouldElideExportedName(name) { + return this.isTypeScriptTransformEnabled && this.declarationInfo.typeDeclarations.has(name) && !this.declarationInfo.valueDeclarations.has(name); + } +}; + +// node_modules/sucrase/dist/esm/transformers/FlowTransformer.js +var FlowTransformer = class extends Transformer { + constructor(rootTransformer, tokens, isImportsTransformEnabled) { + super(); + this.rootTransformer = rootTransformer; + this.tokens = tokens; + this.isImportsTransformEnabled = isImportsTransformEnabled; + } + process() { + if (this.rootTransformer.processPossibleArrowParamEnd() || this.rootTransformer.processPossibleAsyncArrowWithTypeParams() || this.rootTransformer.processPossibleTypeRange()) { + return true; + } + if (this.tokens.matches1(TokenType._enum)) { + this.processEnum(); + return true; + } + if (this.tokens.matches2(TokenType._export, TokenType._enum)) { + this.processNamedExportEnum(); + return true; + } + if (this.tokens.matches3(TokenType._export, TokenType._default, TokenType._enum)) { + this.processDefaultExportEnum(); + return true; + } + return false; + } + processNamedExportEnum() { + if (this.isImportsTransformEnabled) { + this.tokens.removeInitialToken(); + const enumName = this.tokens.identifierNameAtRelativeIndex(1); + this.processEnum(); + this.tokens.appendCode(` exports.${enumName} = ${enumName};`); + } else { + this.tokens.copyToken(); + this.processEnum(); + } + } + processDefaultExportEnum() { + this.tokens.removeInitialToken(); + this.tokens.removeToken(); + const enumName = this.tokens.identifierNameAtRelativeIndex(1); + this.processEnum(); + if (this.isImportsTransformEnabled) { + this.tokens.appendCode(` exports.default = ${enumName};`); + } else { + this.tokens.appendCode(` export default ${enumName};`); + } + } + processEnum() { + this.tokens.replaceToken("const"); + this.tokens.copyExpectedToken(TokenType.name); + let isSymbolEnum = false; + if (this.tokens.matchesContextual(ContextualKeyword._of)) { + this.tokens.removeToken(); + isSymbolEnum = this.tokens.matchesContextual(ContextualKeyword._symbol); + this.tokens.removeToken(); + } + const hasInitializers = this.tokens.matches3(TokenType.braceL, TokenType.name, TokenType.eq); + this.tokens.appendCode(' = require("flow-enums-runtime")'); + const isMirrored = !isSymbolEnum && !hasInitializers; + this.tokens.replaceTokenTrimmingLeftWhitespace(isMirrored ? ".Mirrored([" : "({"); + while (!this.tokens.matches1(TokenType.braceR)) { + if (this.tokens.matches1(TokenType.ellipsis)) { + this.tokens.removeToken(); + break; + } + this.processEnumElement(isSymbolEnum, hasInitializers); + if (this.tokens.matches1(TokenType.comma)) { + this.tokens.copyToken(); + } + } + this.tokens.replaceToken(isMirrored ? "]);" : "});"); + } + processEnumElement(isSymbolEnum, hasInitializers) { + if (isSymbolEnum) { + const elementName = this.tokens.identifierName(); + this.tokens.copyToken(); + this.tokens.appendCode(`: Symbol("${elementName}")`); + } else if (hasInitializers) { + this.tokens.copyToken(); + this.tokens.replaceTokenTrimmingLeftWhitespace(":"); + this.tokens.copyToken(); + } else { + this.tokens.replaceToken(`"${this.tokens.identifierName()}"`); + } + } +}; + +// node_modules/sucrase/dist/esm/transformers/JestHoistTransformer.js +function _optionalChain(ops) { + let lastAccessLHS = void 0; + let value = ops[0]; + let i = 1; + while (i < ops.length) { + const op = ops[i]; + const fn = ops[i + 1]; + i += 2; + if ((op === "optionalAccess" || op === "optionalCall") && value == null) { + return void 0; + } + if (op === "access" || op === "optionalAccess") { + lastAccessLHS = value; + value = fn(value); + } else if (op === "call" || op === "optionalCall") { + value = fn((...args) => value.call(lastAccessLHS, ...args)); + lastAccessLHS = void 0; + } + } + return value; +} +var JEST_GLOBAL_NAME = "jest"; +var HOISTED_METHODS = ["mock", "unmock", "enableAutomock", "disableAutomock"]; +var JestHoistTransformer = class extends Transformer { + __init() { + this.hoistedFunctionNames = []; + } + constructor(rootTransformer, tokens, nameManager, importProcessor) { + super(); + this.rootTransformer = rootTransformer; + this.tokens = tokens; + this.nameManager = nameManager; + this.importProcessor = importProcessor; + JestHoistTransformer.prototype.__init.call(this); + } + process() { + if (this.tokens.currentToken().scopeDepth === 0 && this.tokens.matches4(TokenType.name, TokenType.dot, TokenType.name, TokenType.parenL) && this.tokens.identifierName() === JEST_GLOBAL_NAME) { + if (_optionalChain([this, "access", (_) => _.importProcessor, "optionalAccess", (_2) => _2.getGlobalNames, "call", (_3) => _3(), "optionalAccess", (_4) => _4.has, "call", (_5) => _5(JEST_GLOBAL_NAME)])) { + return false; + } + return this.extractHoistedCalls(); + } + return false; + } + getHoistedCode() { + if (this.hoistedFunctionNames.length > 0) { + return this.hoistedFunctionNames.map((name) => `${name}();`).join(""); + } + return ""; + } + extractHoistedCalls() { + this.tokens.removeToken(); + let followsNonHoistedJestCall = false; + while (this.tokens.matches3(TokenType.dot, TokenType.name, TokenType.parenL)) { + const methodName = this.tokens.identifierNameAtIndex(this.tokens.currentIndex() + 1); + const shouldHoist = HOISTED_METHODS.includes(methodName); + if (shouldHoist) { + const hoistedFunctionName = this.nameManager.claimFreeName("__jestHoist"); + this.hoistedFunctionNames.push(hoistedFunctionName); + this.tokens.replaceToken(`function ${hoistedFunctionName}(){${JEST_GLOBAL_NAME}.`); + this.tokens.copyToken(); + this.tokens.copyToken(); + this.rootTransformer.processBalancedCode(); + this.tokens.copyExpectedToken(TokenType.parenR); + this.tokens.appendCode(";}"); + followsNonHoistedJestCall = false; + } else { + if (followsNonHoistedJestCall) { + this.tokens.copyToken(); + } else { + this.tokens.replaceToken(`${JEST_GLOBAL_NAME}.`); + } + this.tokens.copyToken(); + this.tokens.copyToken(); + this.rootTransformer.processBalancedCode(); + this.tokens.copyExpectedToken(TokenType.parenR); + followsNonHoistedJestCall = true; + } + } + return true; + } +}; + +// node_modules/sucrase/dist/esm/transformers/NumericSeparatorTransformer.js +var NumericSeparatorTransformer = class extends Transformer { + constructor(tokens) { + super(); + this.tokens = tokens; + } + process() { + if (this.tokens.matches1(TokenType.num)) { + const code = this.tokens.currentTokenCode(); + if (code.includes("_")) { + this.tokens.replaceToken(code.replace(/_/g, "")); + return true; + } + } + return false; + } +}; + +// node_modules/sucrase/dist/esm/transformers/OptionalCatchBindingTransformer.js +var OptionalCatchBindingTransformer = class extends Transformer { + constructor(tokens, nameManager) { + super(); + this.tokens = tokens; + this.nameManager = nameManager; + } + process() { + if (this.tokens.matches2(TokenType._catch, TokenType.braceL)) { + this.tokens.copyToken(); + this.tokens.appendCode(` (${this.nameManager.claimFreeName("e")})`); + return true; + } + return false; + } +}; + +// node_modules/sucrase/dist/esm/transformers/OptionalChainingNullishTransformer.js +var OptionalChainingNullishTransformer = class extends Transformer { + constructor(tokens, nameManager) { + super(); + this.tokens = tokens; + this.nameManager = nameManager; + } + process() { + if (this.tokens.matches1(TokenType.nullishCoalescing)) { + const token2 = this.tokens.currentToken(); + if (this.tokens.tokens[token2.nullishStartIndex].isAsyncOperation) { + this.tokens.replaceTokenTrimmingLeftWhitespace(", async () => ("); + } else { + this.tokens.replaceTokenTrimmingLeftWhitespace(", () => ("); + } + return true; + } + if (this.tokens.matches1(TokenType._delete)) { + const nextToken2 = this.tokens.tokenAtRelativeIndex(1); + if (nextToken2.isOptionalChainStart) { + this.tokens.removeInitialToken(); + return true; + } + } + const token = this.tokens.currentToken(); + const chainStart = token.subscriptStartIndex; + if (chainStart != null && this.tokens.tokens[chainStart].isOptionalChainStart && this.tokens.tokenAtRelativeIndex(-1).type !== TokenType._super) { + const param = this.nameManager.claimFreeName("_"); + let arrowStartSnippet; + if (chainStart > 0 && this.tokens.matches1AtIndex(chainStart - 1, TokenType._delete) && this.isLastSubscriptInChain()) { + arrowStartSnippet = `${param} => delete ${param}`; + } else { + arrowStartSnippet = `${param} => ${param}`; + } + if (this.tokens.tokens[chainStart].isAsyncOperation) { + arrowStartSnippet = `async ${arrowStartSnippet}`; + } + if (this.tokens.matches2(TokenType.questionDot, TokenType.parenL) || this.tokens.matches2(TokenType.questionDot, TokenType.lessThan)) { + if (this.justSkippedSuper()) { + this.tokens.appendCode(".bind(this)"); + } + this.tokens.replaceTokenTrimmingLeftWhitespace(`, 'optionalCall', ${arrowStartSnippet}`); + } else if (this.tokens.matches2(TokenType.questionDot, TokenType.bracketL)) { + this.tokens.replaceTokenTrimmingLeftWhitespace(`, 'optionalAccess', ${arrowStartSnippet}`); + } else if (this.tokens.matches1(TokenType.questionDot)) { + this.tokens.replaceTokenTrimmingLeftWhitespace(`, 'optionalAccess', ${arrowStartSnippet}.`); + } else if (this.tokens.matches1(TokenType.dot)) { + this.tokens.replaceTokenTrimmingLeftWhitespace(`, 'access', ${arrowStartSnippet}.`); + } else if (this.tokens.matches1(TokenType.bracketL)) { + this.tokens.replaceTokenTrimmingLeftWhitespace(`, 'access', ${arrowStartSnippet}[`); + } else if (this.tokens.matches1(TokenType.parenL)) { + if (this.justSkippedSuper()) { + this.tokens.appendCode(".bind(this)"); + } + this.tokens.replaceTokenTrimmingLeftWhitespace(`, 'call', ${arrowStartSnippet}(`); + } else { + throw new Error("Unexpected subscript operator in optional chain."); + } + return true; + } + return false; + } + isLastSubscriptInChain() { + let depth = 0; + for (let i = this.tokens.currentIndex() + 1; ; i++) { + if (i >= this.tokens.tokens.length) { + throw new Error("Reached the end of the code while finding the end of the access chain."); + } + if (this.tokens.tokens[i].isOptionalChainStart) { + depth++; + } else if (this.tokens.tokens[i].isOptionalChainEnd) { + depth--; + } + if (depth < 0) { + return true; + } + if (depth === 0 && this.tokens.tokens[i].subscriptStartIndex != null) { + return false; + } + } + } + justSkippedSuper() { + let depth = 0; + let index = this.tokens.currentIndex() - 1; + while (true) { + if (index < 0) { + throw new Error("Reached the start of the code while finding the start of the access chain."); + } + if (this.tokens.tokens[index].isOptionalChainStart) { + depth--; + } else if (this.tokens.tokens[index].isOptionalChainEnd) { + depth++; + } + if (depth < 0) { + return false; + } + if (depth === 0 && this.tokens.tokens[index].subscriptStartIndex != null) { + return this.tokens.tokens[index - 1].type === TokenType._super; + } + index--; + } + } +}; + +// node_modules/sucrase/dist/esm/transformers/ReactDisplayNameTransformer.js +var ReactDisplayNameTransformer = class extends Transformer { + constructor(rootTransformer, tokens, importProcessor, options) { + super(); + this.rootTransformer = rootTransformer; + this.tokens = tokens; + this.importProcessor = importProcessor; + this.options = options; + } + process() { + const startIndex = this.tokens.currentIndex(); + if (this.tokens.identifierName() === "createReactClass") { + const newName = this.importProcessor && this.importProcessor.getIdentifierReplacement("createReactClass"); + if (newName) { + this.tokens.replaceToken(`(0, ${newName})`); + } else { + this.tokens.copyToken(); + } + this.tryProcessCreateClassCall(startIndex); + return true; + } + if (this.tokens.matches3(TokenType.name, TokenType.dot, TokenType.name) && this.tokens.identifierName() === "React" && this.tokens.identifierNameAtIndex(this.tokens.currentIndex() + 2) === "createClass") { + const newName = this.importProcessor ? this.importProcessor.getIdentifierReplacement("React") || "React" : "React"; + if (newName) { + this.tokens.replaceToken(newName); + this.tokens.copyToken(); + this.tokens.copyToken(); + } else { + this.tokens.copyToken(); + this.tokens.copyToken(); + this.tokens.copyToken(); + } + this.tryProcessCreateClassCall(startIndex); + return true; + } + return false; + } + tryProcessCreateClassCall(startIndex) { + const displayName = this.findDisplayName(startIndex); + if (!displayName) { + return; + } + if (this.classNeedsDisplayName()) { + this.tokens.copyExpectedToken(TokenType.parenL); + this.tokens.copyExpectedToken(TokenType.braceL); + this.tokens.appendCode(`displayName: '${displayName}',`); + this.rootTransformer.processBalancedCode(); + this.tokens.copyExpectedToken(TokenType.braceR); + this.tokens.copyExpectedToken(TokenType.parenR); + } + } + findDisplayName(startIndex) { + if (startIndex < 2) { + return null; + } + if (this.tokens.matches2AtIndex(startIndex - 2, TokenType.name, TokenType.eq)) { + return this.tokens.identifierNameAtIndex(startIndex - 2); + } + if (startIndex >= 2 && this.tokens.tokens[startIndex - 2].identifierRole === IdentifierRole.ObjectKey) { + return this.tokens.identifierNameAtIndex(startIndex - 2); + } + if (this.tokens.matches2AtIndex(startIndex - 2, TokenType._export, TokenType._default)) { + return this.getDisplayNameFromFilename(); + } + return null; + } + getDisplayNameFromFilename() { + const filePath = this.options.filePath || "unknown"; + const pathSegments = filePath.split("/"); + const filename = pathSegments[pathSegments.length - 1]; + const dotIndex = filename.lastIndexOf("."); + const baseFilename = dotIndex === -1 ? filename : filename.slice(0, dotIndex); + if (baseFilename === "index" && pathSegments[pathSegments.length - 2]) { + return pathSegments[pathSegments.length - 2]; + } else { + return baseFilename; + } + } + classNeedsDisplayName() { + let index = this.tokens.currentIndex(); + if (!this.tokens.matches2(TokenType.parenL, TokenType.braceL)) { + return false; + } + const objectStartIndex = index + 1; + const objectContextId = this.tokens.tokens[objectStartIndex].contextId; + if (objectContextId == null) { + throw new Error("Expected non-null context ID on object open-brace."); + } + for (; index < this.tokens.tokens.length; index++) { + const token = this.tokens.tokens[index]; + if (token.type === TokenType.braceR && token.contextId === objectContextId) { + index++; + break; + } + if (this.tokens.identifierNameAtIndex(index) === "displayName" && this.tokens.tokens[index].identifierRole === IdentifierRole.ObjectKey && token.contextId === objectContextId) { + return false; + } + } + if (index === this.tokens.tokens.length) { + throw new Error("Unexpected end of input when processing React class."); + } + return this.tokens.matches1AtIndex(index, TokenType.parenR) || this.tokens.matches2AtIndex(index, TokenType.comma, TokenType.parenR); + } +}; + +// node_modules/sucrase/dist/esm/transformers/ReactHotLoaderTransformer.js +var ReactHotLoaderTransformer = class extends Transformer { + __init() { + this.extractedDefaultExportName = null; + } + constructor(tokens, filePath) { + super(); + this.tokens = tokens; + this.filePath = filePath; + ReactHotLoaderTransformer.prototype.__init.call(this); + } + setExtractedDefaultExportName(extractedDefaultExportName) { + this.extractedDefaultExportName = extractedDefaultExportName; + } + getPrefixCode() { + return ` + (function () { + var enterModule = require('react-hot-loader').enterModule; + enterModule && enterModule(module); + })();`.replace(/\s+/g, " ").trim(); + } + getSuffixCode() { + const topLevelNames = /* @__PURE__ */ new Set(); + for (const token of this.tokens.tokens) { + if (!token.isType && isTopLevelDeclaration(token) && token.identifierRole !== IdentifierRole.ImportDeclaration) { + topLevelNames.add(this.tokens.identifierNameForToken(token)); + } + } + const namesToRegister = Array.from(topLevelNames).map((name) => ({ + variableName: name, + uniqueLocalName: name + })); + if (this.extractedDefaultExportName) { + namesToRegister.push({ + variableName: this.extractedDefaultExportName, + uniqueLocalName: "default" + }); + } + return ` +;(function () { + var reactHotLoader = require('react-hot-loader').default; + var leaveModule = require('react-hot-loader').leaveModule; + if (!reactHotLoader) { + return; + } +${namesToRegister.map(({ variableName, uniqueLocalName }) => ` reactHotLoader.register(${variableName}, "${uniqueLocalName}", ${JSON.stringify(this.filePath || "")});`).join("\n")} + leaveModule(module); +})();`; + } + process() { + return false; + } +}; + +// node_modules/sucrase/dist/esm/util/isIdentifier.js +var RESERVED_WORDS = /* @__PURE__ */ new Set([ + "break", + "case", + "catch", + "class", + "const", + "continue", + "debugger", + "default", + "delete", + "do", + "else", + "export", + "extends", + "finally", + "for", + "function", + "if", + "import", + "in", + "instanceof", + "new", + "return", + "super", + "switch", + "this", + "throw", + "try", + "typeof", + "var", + "void", + "while", + "with", + "yield", + "enum", + "implements", + "interface", + "let", + "package", + "private", + "protected", + "public", + "static", + "await", + "false", + "null", + "true" +]); +function isIdentifier(name) { + if (name.length === 0) { + return false; + } + if (!IS_IDENTIFIER_START[name.charCodeAt(0)]) { + return false; + } + for (let i = 1; i < name.length; i++) { + if (!IS_IDENTIFIER_CHAR[name.charCodeAt(i)]) { + return false; + } + } + return !RESERVED_WORDS.has(name); +} + +// node_modules/sucrase/dist/esm/transformers/TypeScriptTransformer.js +var TypeScriptTransformer = class extends Transformer { + constructor(rootTransformer, tokens, isImportsTransformEnabled) { + super(); + this.rootTransformer = rootTransformer; + this.tokens = tokens; + this.isImportsTransformEnabled = isImportsTransformEnabled; + } + process() { + if (this.rootTransformer.processPossibleArrowParamEnd() || this.rootTransformer.processPossibleAsyncArrowWithTypeParams() || this.rootTransformer.processPossibleTypeRange()) { + return true; + } + if (this.tokens.matches1(TokenType._public) || this.tokens.matches1(TokenType._protected) || this.tokens.matches1(TokenType._private) || this.tokens.matches1(TokenType._abstract) || this.tokens.matches1(TokenType._readonly) || this.tokens.matches1(TokenType._override) || this.tokens.matches1(TokenType.nonNullAssertion)) { + this.tokens.removeInitialToken(); + return true; + } + if (this.tokens.matches1(TokenType._enum) || this.tokens.matches2(TokenType._const, TokenType._enum)) { + this.processEnum(); + return true; + } + if (this.tokens.matches2(TokenType._export, TokenType._enum) || this.tokens.matches3(TokenType._export, TokenType._const, TokenType._enum)) { + this.processEnum(true); + return true; + } + return false; + } + processEnum(isExport = false) { + this.tokens.removeInitialToken(); + while (this.tokens.matches1(TokenType._const) || this.tokens.matches1(TokenType._enum)) { + this.tokens.removeToken(); + } + const enumName = this.tokens.identifierName(); + this.tokens.removeToken(); + if (isExport && !this.isImportsTransformEnabled) { + this.tokens.appendCode("export "); + } + this.tokens.appendCode(`var ${enumName}; (function (${enumName})`); + this.tokens.copyExpectedToken(TokenType.braceL); + this.processEnumBody(enumName); + this.tokens.copyExpectedToken(TokenType.braceR); + if (isExport && this.isImportsTransformEnabled) { + this.tokens.appendCode(`)(${enumName} || (exports.${enumName} = ${enumName} = {}));`); + } else { + this.tokens.appendCode(`)(${enumName} || (${enumName} = {}));`); + } + } + processEnumBody(enumName) { + let previousValueCode = null; + while (true) { + if (this.tokens.matches1(TokenType.braceR)) { + break; + } + const { nameStringCode, variableName } = this.extractEnumKeyInfo(this.tokens.currentToken()); + this.tokens.removeInitialToken(); + if (this.tokens.matches3(TokenType.eq, TokenType.string, TokenType.comma) || this.tokens.matches3(TokenType.eq, TokenType.string, TokenType.braceR)) { + this.processStringLiteralEnumMember(enumName, nameStringCode, variableName); + } else if (this.tokens.matches1(TokenType.eq)) { + this.processExplicitValueEnumMember(enumName, nameStringCode, variableName); + } else { + this.processImplicitValueEnumMember(enumName, nameStringCode, variableName, previousValueCode); + } + if (this.tokens.matches1(TokenType.comma)) { + this.tokens.removeToken(); + } + if (variableName != null) { + previousValueCode = variableName; + } else { + previousValueCode = `${enumName}[${nameStringCode}]`; + } + } + } + extractEnumKeyInfo(nameToken) { + if (nameToken.type === TokenType.name) { + const name = this.tokens.identifierNameForToken(nameToken); + return { + nameStringCode: `"${name}"`, + variableName: isIdentifier(name) ? name : null + }; + } else if (nameToken.type === TokenType.string) { + const name = this.tokens.stringValueForToken(nameToken); + return { + nameStringCode: this.tokens.code.slice(nameToken.start, nameToken.end), + variableName: isIdentifier(name) ? name : null + }; + } else { + throw new Error("Expected name or string at beginning of enum element."); + } + } + processStringLiteralEnumMember(enumName, nameStringCode, variableName) { + if (variableName != null) { + this.tokens.appendCode(`const ${variableName}`); + this.tokens.copyToken(); + this.tokens.copyToken(); + this.tokens.appendCode(`; ${enumName}[${nameStringCode}] = ${variableName};`); + } else { + this.tokens.appendCode(`${enumName}[${nameStringCode}]`); + this.tokens.copyToken(); + this.tokens.copyToken(); + this.tokens.appendCode(";"); + } + } + processExplicitValueEnumMember(enumName, nameStringCode, variableName) { + const rhsEndIndex = this.tokens.currentToken().rhsEndIndex; + if (rhsEndIndex == null) { + throw new Error("Expected rhsEndIndex on enum assign."); + } + if (variableName != null) { + this.tokens.appendCode(`const ${variableName}`); + this.tokens.copyToken(); + while (this.tokens.currentIndex() < rhsEndIndex) { + this.rootTransformer.processToken(); + } + this.tokens.appendCode(`; ${enumName}[${enumName}[${nameStringCode}] = ${variableName}] = ${nameStringCode};`); + } else { + this.tokens.appendCode(`${enumName}[${enumName}[${nameStringCode}]`); + this.tokens.copyToken(); + while (this.tokens.currentIndex() < rhsEndIndex) { + this.rootTransformer.processToken(); + } + this.tokens.appendCode(`] = ${nameStringCode};`); + } + } + processImplicitValueEnumMember(enumName, nameStringCode, variableName, previousValueCode) { + let valueCode = previousValueCode != null ? `${previousValueCode} + 1` : "0"; + if (variableName != null) { + this.tokens.appendCode(`const ${variableName} = ${valueCode}; `); + valueCode = variableName; + } + this.tokens.appendCode(`${enumName}[${enumName}[${nameStringCode}] = ${valueCode}] = ${nameStringCode};`); + } +}; + +// node_modules/sucrase/dist/esm/transformers/RootTransformer.js +var RootTransformer = class { + __init() { + this.transformers = []; + } + __init2() { + this.generatedVariables = []; + } + constructor(sucraseContext, transforms, enableLegacyBabel5ModuleInterop, options) { + RootTransformer.prototype.__init.call(this); + RootTransformer.prototype.__init2.call(this); + this.nameManager = sucraseContext.nameManager; + this.helperManager = sucraseContext.helperManager; + const { tokenProcessor, importProcessor } = sucraseContext; + this.tokens = tokenProcessor; + this.isImportsTransformEnabled = transforms.includes("imports"); + this.isReactHotLoaderTransformEnabled = transforms.includes("react-hot-loader"); + this.disableESTransforms = Boolean(options.disableESTransforms); + if (!options.disableESTransforms) { + this.transformers.push(new OptionalChainingNullishTransformer(tokenProcessor, this.nameManager)); + this.transformers.push(new NumericSeparatorTransformer(tokenProcessor)); + this.transformers.push(new OptionalCatchBindingTransformer(tokenProcessor, this.nameManager)); + } + if (transforms.includes("jsx")) { + this.transformers.push(new JSXTransformer(this, tokenProcessor, importProcessor, this.nameManager, options)); + this.transformers.push(new ReactDisplayNameTransformer(this, tokenProcessor, importProcessor, options)); + } + let reactHotLoaderTransformer = null; + if (transforms.includes("react-hot-loader")) { + if (!options.filePath) { + throw new Error("filePath is required when using the react-hot-loader transform."); + } + reactHotLoaderTransformer = new ReactHotLoaderTransformer(tokenProcessor, options.filePath); + this.transformers.push(reactHotLoaderTransformer); + } + if (transforms.includes("imports")) { + if (importProcessor === null) { + throw new Error("Expected non-null importProcessor with imports transform enabled."); + } + this.transformers.push(new CJSImportTransformer(this, tokenProcessor, importProcessor, this.nameManager, reactHotLoaderTransformer, enableLegacyBabel5ModuleInterop, transforms.includes("typescript"))); + } else { + this.transformers.push(new ESMImportTransformer(tokenProcessor, this.nameManager, reactHotLoaderTransformer, transforms.includes("typescript"), options)); + } + if (transforms.includes("flow")) { + this.transformers.push(new FlowTransformer(this, tokenProcessor, transforms.includes("imports"))); + } + if (transforms.includes("typescript")) { + this.transformers.push(new TypeScriptTransformer(this, tokenProcessor, transforms.includes("imports"))); + } + if (transforms.includes("jest")) { + this.transformers.push(new JestHoistTransformer(this, tokenProcessor, this.nameManager, importProcessor)); + } + } + transform() { + this.tokens.reset(); + this.processBalancedCode(); + const shouldAddUseStrict = this.isImportsTransformEnabled; + let prefix = shouldAddUseStrict ? '"use strict";' : ""; + for (const transformer of this.transformers) { + prefix += transformer.getPrefixCode(); + } + prefix += this.helperManager.emitHelpers(); + prefix += this.generatedVariables.map((v) => ` var ${v};`).join(""); + for (const transformer of this.transformers) { + prefix += transformer.getHoistedCode(); + } + let suffix = ""; + for (const transformer of this.transformers) { + suffix += transformer.getSuffixCode(); + } + let code = this.tokens.finish(); + if (code.startsWith("#!")) { + let newlineIndex = code.indexOf("\n"); + if (newlineIndex === -1) { + newlineIndex = code.length; + code += "\n"; + } + return code.slice(0, newlineIndex + 1) + prefix + code.slice(newlineIndex + 1) + suffix; + } else { + return prefix + this.tokens.finish() + suffix; + } + } + processBalancedCode() { + let braceDepth = 0; + let parenDepth = 0; + while (!this.tokens.isAtEnd()) { + if (this.tokens.matches1(TokenType.braceL) || this.tokens.matches1(TokenType.dollarBraceL)) { + braceDepth++; + } else if (this.tokens.matches1(TokenType.braceR)) { + if (braceDepth === 0) { + return; + } + braceDepth--; + } + if (this.tokens.matches1(TokenType.parenL)) { + parenDepth++; + } else if (this.tokens.matches1(TokenType.parenR)) { + if (parenDepth === 0) { + return; + } + parenDepth--; + } + this.processToken(); + } + } + processToken() { + if (this.tokens.matches1(TokenType._class)) { + this.processClass(); + return; + } + for (const transformer of this.transformers) { + const wasProcessed = transformer.process(); + if (wasProcessed) { + return; + } + } + this.tokens.copyToken(); + } + processNamedClass() { + if (!this.tokens.matches2(TokenType._class, TokenType.name)) { + throw new Error("Expected identifier for exported class name."); + } + const name = this.tokens.identifierNameAtIndex(this.tokens.currentIndex() + 1); + this.processClass(); + return name; + } + processClass() { + const classInfo = getClassInfo(this, this.tokens, this.nameManager, this.disableESTransforms); + const needsCommaExpression = (classInfo.headerInfo.isExpression || !classInfo.headerInfo.className) && classInfo.staticInitializerNames.length + classInfo.instanceInitializerNames.length > 0; + let className = classInfo.headerInfo.className; + if (needsCommaExpression) { + className = this.nameManager.claimFreeName("_class"); + this.generatedVariables.push(className); + this.tokens.appendCode(` (${className} =`); + } + const classToken = this.tokens.currentToken(); + const contextId = classToken.contextId; + if (contextId == null) { + throw new Error("Expected class to have a context ID."); + } + this.tokens.copyExpectedToken(TokenType._class); + while (!this.tokens.matchesContextIdAndLabel(TokenType.braceL, contextId)) { + this.processToken(); + } + this.processClassBody(classInfo, className); + const staticInitializerStatements = classInfo.staticInitializerNames.map((name) => `${className}.${name}()`); + if (needsCommaExpression) { + this.tokens.appendCode(`, ${staticInitializerStatements.map((s) => `${s}, `).join("")}${className})`); + } else if (classInfo.staticInitializerNames.length > 0) { + this.tokens.appendCode(` ${staticInitializerStatements.map((s) => `${s};`).join(" ")}`); + } + } + processClassBody(classInfo, className) { + const { + headerInfo, + constructorInsertPos, + constructorInitializerStatements, + fields, + instanceInitializerNames, + rangesToRemove + } = classInfo; + let fieldIndex = 0; + let rangeToRemoveIndex = 0; + const classContextId = this.tokens.currentToken().contextId; + if (classContextId == null) { + throw new Error("Expected non-null context ID on class."); + } + this.tokens.copyExpectedToken(TokenType.braceL); + if (this.isReactHotLoaderTransformEnabled) { + this.tokens.appendCode("__reactstandin__regenerateByEval(key, code) {this[key] = eval(code);}"); + } + const needsConstructorInit = constructorInitializerStatements.length + instanceInitializerNames.length > 0; + if (constructorInsertPos === null && needsConstructorInit) { + const constructorInitializersCode = this.makeConstructorInitCode(constructorInitializerStatements, instanceInitializerNames, className); + if (headerInfo.hasSuperclass) { + const argsName = this.nameManager.claimFreeName("args"); + this.tokens.appendCode(`constructor(...${argsName}) { super(...${argsName}); ${constructorInitializersCode}; }`); + } else { + this.tokens.appendCode(`constructor() { ${constructorInitializersCode}; }`); + } + } + while (!this.tokens.matchesContextIdAndLabel(TokenType.braceR, classContextId)) { + if (fieldIndex < fields.length && this.tokens.currentIndex() === fields[fieldIndex].start) { + let needsCloseBrace = false; + if (this.tokens.matches1(TokenType.bracketL)) { + this.tokens.copyTokenWithPrefix(`${fields[fieldIndex].initializerName}() {this`); + } else if (this.tokens.matches1(TokenType.string) || this.tokens.matches1(TokenType.num)) { + this.tokens.copyTokenWithPrefix(`${fields[fieldIndex].initializerName}() {this[`); + needsCloseBrace = true; + } else { + this.tokens.copyTokenWithPrefix(`${fields[fieldIndex].initializerName}() {this.`); + } + while (this.tokens.currentIndex() < fields[fieldIndex].end) { + if (needsCloseBrace && this.tokens.currentIndex() === fields[fieldIndex].equalsIndex) { + this.tokens.appendCode("]"); + } + this.processToken(); + } + this.tokens.appendCode("}"); + fieldIndex++; + } else if (rangeToRemoveIndex < rangesToRemove.length && this.tokens.currentIndex() >= rangesToRemove[rangeToRemoveIndex].start) { + if (this.tokens.currentIndex() < rangesToRemove[rangeToRemoveIndex].end) { + this.tokens.removeInitialToken(); + } + while (this.tokens.currentIndex() < rangesToRemove[rangeToRemoveIndex].end) { + this.tokens.removeToken(); + } + rangeToRemoveIndex++; + } else if (this.tokens.currentIndex() === constructorInsertPos) { + this.tokens.copyToken(); + if (needsConstructorInit) { + this.tokens.appendCode(`;${this.makeConstructorInitCode(constructorInitializerStatements, instanceInitializerNames, className)};`); + } + this.processToken(); + } else { + this.processToken(); + } + } + this.tokens.copyExpectedToken(TokenType.braceR); + } + makeConstructorInitCode(constructorInitializerStatements, instanceInitializerNames, className) { + return [ + ...constructorInitializerStatements, + ...instanceInitializerNames.map((name) => `${className}.prototype.${name}.call(this)`) + ].join(";"); + } + processPossibleArrowParamEnd() { + if (this.tokens.matches2(TokenType.parenR, TokenType.colon) && this.tokens.tokenAtRelativeIndex(1).isType) { + let nextNonTypeIndex = this.tokens.currentIndex() + 1; + while (this.tokens.tokens[nextNonTypeIndex].isType) { + nextNonTypeIndex++; + } + if (this.tokens.matches1AtIndex(nextNonTypeIndex, TokenType.arrow)) { + this.tokens.removeInitialToken(); + while (this.tokens.currentIndex() < nextNonTypeIndex) { + this.tokens.removeToken(); + } + this.tokens.replaceTokenTrimmingLeftWhitespace(") =>"); + return true; + } + } + return false; + } + processPossibleAsyncArrowWithTypeParams() { + if (!this.tokens.matchesContextual(ContextualKeyword._async) && !this.tokens.matches1(TokenType._async)) { + return false; + } + const nextToken2 = this.tokens.tokenAtRelativeIndex(1); + if (nextToken2.type !== TokenType.lessThan || !nextToken2.isType) { + return false; + } + let nextNonTypeIndex = this.tokens.currentIndex() + 1; + while (this.tokens.tokens[nextNonTypeIndex].isType) { + nextNonTypeIndex++; + } + if (this.tokens.matches1AtIndex(nextNonTypeIndex, TokenType.parenL)) { + this.tokens.replaceToken("async ("); + this.tokens.removeInitialToken(); + while (this.tokens.currentIndex() < nextNonTypeIndex) { + this.tokens.removeToken(); + } + this.tokens.removeToken(); + this.processBalancedCode(); + this.processToken(); + return true; + } + return false; + } + processPossibleTypeRange() { + if (this.tokens.currentToken().isType) { + this.tokens.removeInitialToken(); + while (this.tokens.currentToken().isType) { + this.tokens.removeToken(); + } + return true; + } + return false; + } +}; + +// node_modules/sucrase/dist/esm/util/formatTokens.js +__toESM(require_build()); + +// node_modules/sucrase/dist/esm/util/getTSImportedNames.js +function getTSImportedNames(tokens) { + const importedNames = /* @__PURE__ */ new Set(); + for (let i = 0; i < tokens.tokens.length; i++) { + if (tokens.matches1AtIndex(i, TokenType._import) && !tokens.matches3AtIndex(i, TokenType._import, TokenType.name, TokenType.eq)) { + collectNamesForImport(tokens, i, importedNames); + } + } + return importedNames; +} +function collectNamesForImport(tokens, index, importedNames) { + index++; + if (tokens.matches1AtIndex(index, TokenType.parenL)) { + return; + } + if (tokens.matches1AtIndex(index, TokenType.name)) { + importedNames.add(tokens.identifierNameAtIndex(index)); + index++; + if (tokens.matches1AtIndex(index, TokenType.comma)) { + index++; + } + } + if (tokens.matches1AtIndex(index, TokenType.star)) { + index += 2; + importedNames.add(tokens.identifierNameAtIndex(index)); + index++; + } + if (tokens.matches1AtIndex(index, TokenType.braceL)) { + index++; + collectNamesForNamedImport(tokens, index, importedNames); + } +} +function collectNamesForNamedImport(tokens, index, importedNames) { + while (true) { + if (tokens.matches1AtIndex(index, TokenType.braceR)) { + return; + } + const specifierInfo = getImportExportSpecifierInfo(tokens, index); + index = specifierInfo.endIndex; + if (!specifierInfo.isType) { + importedNames.add(specifierInfo.rightName); + } + if (tokens.matches2AtIndex(index, TokenType.comma, TokenType.braceR)) { + return; + } else if (tokens.matches1AtIndex(index, TokenType.braceR)) { + return; + } else if (tokens.matches1AtIndex(index, TokenType.comma)) { + index++; + } else { + throw new Error(`Unexpected token: ${JSON.stringify(tokens.tokens[index])}`); + } + } +} +function transform(code, options) { + validateOptions(options); + try { + const sucraseContext = getSucraseContext(code, options); + const transformer = new RootTransformer(sucraseContext, options.transforms, Boolean(options.enableLegacyBabel5ModuleInterop), options); + let result = { code: transformer.transform() }; + if (options.sourceMapOptions) { + if (!options.filePath) { + throw new Error("filePath must be specified when generating a source map."); + } + result = { + ...result, + sourceMap: computeSourceMap(result.code, options.filePath, options.sourceMapOptions) + }; + } + return result; + } catch (e) { + if (options.filePath) { + e.message = `Error transforming ${options.filePath}: ${e.message}`; + } + throw e; + } +} +function getSucraseContext(code, options) { + const isJSXEnabled2 = options.transforms.includes("jsx"); + const isTypeScriptEnabled2 = options.transforms.includes("typescript"); + const isFlowEnabled2 = options.transforms.includes("flow"); + const disableESTransforms = options.disableESTransforms === true; + const file = parse(code, isJSXEnabled2, isTypeScriptEnabled2, isFlowEnabled2); + const tokens = file.tokens; + const scopes = file.scopes; + const nameManager = new NameManager(code, tokens); + const helperManager = new HelperManager(nameManager); + const tokenProcessor = new TokenProcessor(code, tokens, isFlowEnabled2, disableESTransforms, helperManager); + const enableLegacyTypeScriptModuleInterop = Boolean(options.enableLegacyTypeScriptModuleInterop); + let importProcessor = null; + if (options.transforms.includes("imports")) { + importProcessor = new CJSImportProcessor(nameManager, tokenProcessor, enableLegacyTypeScriptModuleInterop, options, options.transforms.includes("typescript"), helperManager); + importProcessor.preprocessTokens(); + identifyShadowedGlobals(tokenProcessor, scopes, importProcessor.getGlobalNames()); + if (options.transforms.includes("typescript")) { + importProcessor.pruneTypeOnlyImports(); + } + } else if (options.transforms.includes("typescript")) { + identifyShadowedGlobals(tokenProcessor, scopes, getTSImportedNames(tokenProcessor)); + } + return { tokenProcessor, scopes, nameManager, importProcessor, helperManager }; +} + +// node_modules/hash-sum/hash-sum.js +var require_hash_sum = __commonJS({ + "node_modules/hash-sum/hash-sum.js"(exports, module) { + function pad(hash, len) { + while (hash.length < len) { + hash = "0" + hash; + } + return hash; + } + function fold(hash, text) { + var i; + var chr; + var len; + if (text.length === 0) { + return hash; + } + for (i = 0, len = text.length; i < len; i++) { + chr = text.charCodeAt(i); + hash = (hash << 5) - hash + chr; + hash |= 0; + } + return hash < 0 ? hash * -2 : hash; + } + function foldObject(hash, o, seen) { + return Object.keys(o).sort().reduce(foldKey, hash); + function foldKey(hash2, key) { + return foldValue(hash2, o[key], key, seen); + } + } + function foldValue(input, value, key, seen) { + var hash = fold(fold(fold(input, key), toString(value)), typeof value); + if (value === null) { + return fold(hash, "null"); + } + if (value === void 0) { + return fold(hash, "undefined"); + } + if (typeof value === "object" || typeof value === "function") { + if (seen.indexOf(value) !== -1) { + return fold(hash, "[Circular]" + key); + } + seen.push(value); + var objHash = foldObject(hash, value, seen); + if (!("valueOf" in value) || typeof value.valueOf !== "function") { + return objHash; + } + try { + return fold(objHash, String(value.valueOf())); + } catch (err) { + return fold(objHash, "[valueOf exception]" + (err.stack || err.message)); + } + } + return fold(hash, value.toString()); + } + function toString(o) { + return Object.prototype.toString.call(o); + } + function sum(o) { + return pad(foldValue(0, o, "", []).toString(16), 8); + } + module.exports = sum; + } +}); + +// dep:hash-sum +var hash_sum_default = require_hash_sum(); + +const hashId = hash_sum_default.__esModule ? hash_sum_default.default : hash_sum_default; +const COMP_IDENTIFIER = `__sfc__`; +async function transformTS(src) { + return transform(src, { + transforms: ["typescript"] + }).code; +} +async function compileFile(store, { filename, code, compiled }) { + if (!code.trim()) { + store.state.errors = []; + return; + } + if (filename.endsWith(".css")) { + compiled.css = code; + store.state.errors = []; + return; + } + if (filename.endsWith(".js") || filename.endsWith(".ts")) { + if (shouldTransformRef(code)) { + code = transformRef(code, { filename }).code; + } + if (filename.endsWith(".ts")) { + code = await transformTS(code); + } + compiled.js = compiled.ssr = code; + store.state.errors = []; + return; + } + if (!filename.endsWith(".vue")) { + store.state.errors = []; + return; + } + const id = hashId(filename); + const { errors, descriptor } = store.compiler.parse(code, { + filename, + sourceMap: true + }); + if (errors.length) { + store.state.errors = errors; + return; + } + if (descriptor.styles.some((s) => s.lang) || descriptor.template && descriptor.template.lang) { + store.state.errors = [ + `lang="x" pre-processors for