├── .editorconfig ├── .gitattributes ├── .gitignore ├── .travis.yml ├── apex-nitro └── material-apex.json ├── changelog.md ├── contributing.md ├── docs ├── img │ ├── banner.png │ ├── favicon.png │ ├── home.jpg │ ├── login1.png │ ├── office.jpg │ ├── parallax1.jpg │ ├── parallax2.jpg │ ├── parallax3.jpg │ ├── parallax4.jpg │ ├── profile-picture.jpeg │ ├── responsive-video.mp4 │ ├── restore1.png │ ├── restore2.png │ ├── sample-1.jpg │ └── theme.image.jpg ├── readme.md └── update.md ├── license ├── package-lock.json ├── package.json ├── plugins ├── Dynamic Action │ ├── MATERIAL.APEX.BOTTOM.SHEET.CLOSE.sql │ ├── MATERIAL.APEX.BOTTOM.SHEET.OPEN.sql │ ├── MATERIAL.APEX.DISCOVERY.CLOSE.sql │ ├── MATERIAL.APEX.DISCOVERY.OPEN.sql │ ├── MATERIAL.APEX.REMOVE.SPINNERS.sql │ ├── MATERIAL.APEX.SHOW.SPINNER.sql │ └── MATERIAL.APEX.TOAST.sql ├── Item │ ├── MATERIAL.APEX.RANGE.sql │ └── MATERIAL.APEX.SWITCH.sql ├── Region │ ├── MATERIAL.APEX.CODE.sql │ └── MATERIAL.APEX.THEME.DOCUMENTATION.sql └── readme.md ├── readme.md ├── src ├── img │ └── ui-icons_ffffff_256x240.png ├── js │ ├── apex-init.js │ ├── finalize.js │ └── materialize-init.js ├── less │ └── _apex_variables.less ├── lib │ └── materialize │ │ └── js │ │ ├── materialize.js │ │ └── materialize.min.js └── scss │ ├── _apex_alert.scss │ ├── _apex_breadcrumbs.scss │ ├── _apex_buttons.scss │ ├── _apex_calendar.scss │ ├── _apex_cards.scss │ ├── _apex_carousel.scss │ ├── _apex_collapsible.scss │ ├── _apex_collections.scss │ ├── _apex_colors.scss │ ├── _apex_datepicker.scss │ ├── _apex_demo.scss │ ├── _apex_dropdown.scss │ ├── _apex_footer.scss │ ├── _apex_forms.scss │ ├── _apex_global.scss │ ├── _apex_grid.scss │ ├── _apex_icons.scss │ ├── _apex_ig.scss │ ├── _apex_ir.scss │ ├── _apex_materialbox.scss │ ├── _apex_media.scss │ ├── _apex_mixins.scss │ ├── _apex_modal.scss │ ├── _apex_nav.scss │ ├── _apex_pagination.scss │ ├── _apex_preloader.scss │ ├── _apex_promo.scss │ ├── _apex_responsive_text.scss │ ├── _apex_sidenav.scss │ ├── _apex_spacers.scss │ ├── _apex_table.scss │ ├── _apex_tabs.scss │ ├── _apex_themeroller.scss │ ├── _apex_timeline.scss │ ├── _apex_toasts.scss │ ├── _apex_toolbar.scss │ ├── _apex_typography.scss │ ├── _apex_variables.scss │ ├── _apex_wizard.scss │ └── app.scss └── templates ├── Breadcrumbs ├── Standard.hbs └── ~global.template.options.hbs ├── Buttons ├── Floating Action Button.hbs ├── Icon.hbs ├── Text with Icon.hbs ├── Text.hbs └── ~global.template.options.hbs ├── Fields ├── File Input.hbs ├── Image.hbs ├── Materialbox.hbs ├── Standard.hbs └── ~global.template.options.hbs ├── Lists ├── Collection.hbs ├── Navbar.hbs ├── SideNav.hbs ├── Tabs.hbs ├── Wizard.hbs └── ~global.template.options.hbs ├── Pages ├── Clean.hbs ├── Modal.hbs ├── Standard - No Footer.hbs ├── Standard.hbs └── ~global.template.options.hbs ├── Regions ├── Blockquote.hbs ├── Card.hbs ├── Carousel.hbs ├── Collapsible.hbs ├── Modal.hbs ├── Parallax.hbs ├── Promo.hbs ├── Slider.hbs ├── Standard.hbs ├── Tabs.hbs └── ~global.template.options.hbs ├── ReportGenericColumns ├── Standard.hbs └── ~global.template.options.hbs └── ReportNamedColumns ├── Cards.hbs ├── Carousel.hbs ├── Chips.hbs ├── Collapsible.hbs ├── Collection.hbs ├── Dropdown.hbs ├── SideNav Header.hbs ├── Slider.hbs ├── Timeline.hbs └── ~global.template.options.hbs /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | indent_style = tab 5 | end_of_line = lf 6 | charset = utf-8 7 | trim_trailing_whitespace = true 8 | insert_final_newline = true 9 | 10 | [{package.json,*.yml}] 11 | indent_style = space 12 | indent_size = 2 13 | -------------------------------------------------------------------------------- /.gitattributes: -------------------------------------------------------------------------------- 1 | # Auto detect text files and perform LF normalization 2 | * text=auto 3 | 4 | # Custom for Visual Studio 5 | *.cs diff=csharp 6 | 7 | # Standard to msysgit 8 | *.doc diff=astextplain 9 | *.DOC diff=astextplain 10 | *.docx diff=astextplain 11 | *.DOCX diff=astextplain 12 | *.dot diff=astextplain 13 | *.DOT diff=astextplain 14 | *.pdf diff=astextplain 15 | *.PDF diff=astextplain 16 | *.rtf diff=astextplain 17 | *.RTF diff=astextplain 18 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Folders 2 | node_modules 3 | bower_components 4 | apex 5 | dist 6 | 7 | # Logs 8 | logs 9 | *.log 10 | npm-debug.log* 11 | 12 | # Mac 13 | .DS_Store 14 | 15 | # VSCode 16 | .vscode 17 | 18 | # Others 19 | .atom-build-oracle.json 20 | .build-oracle.json 21 | app.export.sql 22 | -------------------------------------------------------------------------------- /.travis.yml: -------------------------------------------------------------------------------- 1 | language: node_js 2 | node_js: 3 | - "6" 4 | - "8" 5 | - "9" 6 | -------------------------------------------------------------------------------- /apex-nitro/material-apex.json: -------------------------------------------------------------------------------- 1 | { 2 | "mode": "advanced", 3 | "appURL": "CHANGEME_URL/f?p=12192:1", 4 | "srcFolder": "CHANGE_ME_PATH/material-apex/src", 5 | "distFolder": "CHANGE_ME_PATH/material-apex/dist", 6 | "js": { 7 | "processor": "default", 8 | "concat": false, 9 | "library": false, 10 | "tsConcat": false 11 | }, 12 | "css": { 13 | "language": "sass", 14 | "concat": false, 15 | "sassIncludePath": "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass" 16 | }, 17 | "browsersync": { 18 | "notify": true, 19 | "ghostMode": false 20 | }, 21 | "header": { 22 | "enabled": true, 23 | "packageJsonPath": "CHANGE_ME_PATH/material-apex/package.json" 24 | }, 25 | "apex": { 26 | "openBuilder": true 27 | }, 28 | "publish": { 29 | "destination": "theme", 30 | "path": "sql", 31 | "connectionType": "basic" 32 | }, 33 | "themeroller": { 34 | "files": [ 35 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_variables.scss", 36 | "CHANGE_ME_PATH/material-apex/src/less/_apex_variables.less", 37 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_mixins.scss", 38 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_global.scss", 39 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_navbar.scss", 40 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_cards.scss", 41 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_toast.scss", 42 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_tabs.scss", 43 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_tooltip.scss", 44 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_buttons.scss", 45 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_dropdown.scss", 46 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_waves.scss", 47 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_modal.scss", 48 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_collapsible.scss", 49 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_chips.scss", 50 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_materialbox.scss", 51 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/forms/_input-fields.scss", 52 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/forms/_radio-buttons.scss", 53 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/forms/_checkboxes.scss", 54 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/forms/_switches.scss", 55 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/forms/_select.scss", 56 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/forms/_file-input.scss", 57 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/forms/_range.scss", 58 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_sideNav.scss", 59 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_preloader.scss", 60 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_slider.scss", 61 | "CHANGE_ME_PATH/material-apex/node_modules/materialize-css/sass/components/_carousel.scss", 62 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_buttons.scss", 63 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_global.scss", 64 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_cards.scss", 65 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_code.scss", 66 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_collapsible.scss", 67 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_collections.scss", 68 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_datepicker.scss", 69 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_demo.scss", 70 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_dropdown.scss", 71 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_forms.scss", 72 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_grid.scss", 73 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_icons.scss", 74 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_ig.scss", 75 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_ir.scss", 76 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_materialbox.scss", 77 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_media.scss", 78 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_modal.scss", 79 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_nav.scss", 80 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_pagination.scss", 81 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_preloader.scss", 82 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_promo.scss", 83 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_sidenav.scss", 84 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_table.scss", 85 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_tabs.scss", 86 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_themeroller.scss", 87 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_toasts.scss", 88 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_toolbar.scss", 89 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_typography.scss", 90 | "CHANGE_ME_PATH/material-apex/src/scss/_apex_footer.scss" 91 | ] 92 | } 93 | } 94 | -------------------------------------------------------------------------------- /contributing.md: -------------------------------------------------------------------------------- 1 | # Contributing to Material APEX 2 | 👍🎉 First off, thanks for taking the time to contribute! 🎉👍 3 | 4 | The following is a set of guidelines, not rules, for contributing to Material APEX. Use your best judgment, and feel free to propose changes to this document in a pull request. 5 | 6 | ## How can I contribute? 7 | ### Improve documentation 8 | As a user of Material APEX you're the perfect candidate to help us improve our documentation. Typo corrections, error fixes, better explanations, more examples, etc. Open issues for things that could be improved. Anything. Even improvements to this document. 9 | 10 | ### Submitting an issue 11 | - Search the issue tracker before opening an issue. 12 | - Ensure you're using the latest version of Material APEX. 13 | - Use a clear and descriptive title. 14 | - Include as much information as possible: Steps to reproduce the issue, error message, screenshots, etc. 15 | - The more time you put into an issue, the more we will drill. 16 | 17 | ### Pull Requests 18 | This means actual code contributions. 19 | 20 | **Please ask first** before working on any significant pull request, otherwise you risk spending a lot of time working on something that the project's developers might not want to merge into the project. 21 | 22 | #### Pre-requisites 23 | Material APEX is built using [APEX Nitro](https://github.com/OraOpenSource/apex-nitro). Head there first and follow the instructions to install APEX Nitro on your system. 24 | 25 | #### Steps 26 | 1. Fork the project, clone your fork, and configure the upstream: 27 | ```bash 28 | # Clone your fork of the repo into the current directory 29 | git clone https://github.com//material-apex.git 30 | # Navigate to the newly cloned directory 31 | cd material-apex 32 | # Assign the original repo to a remote called "upstream" 33 | git remote add upstream https://github.com/vincentmorneau/material-apex.git 34 | ``` 35 | 36 | 2. If you cloned a while ago, get the latest changes from upstream: 37 | ```bash 38 | git checkout master 39 | git pull upstream master 40 | ``` 41 | 42 | 3. Install the Material APEX dependencies 43 | ```bash 44 | npm install 45 | ``` 46 | 47 | 4. Download the APEX Nitro [configuration file](/apex-nitro/material-apex.json) 48 | 49 | a. Search and replace all occurrences of `CHANGE_ME_PATH` to the path from step 1 50 | 51 | b. Search and replace all occurrences of `CHANGE_ME_URL` with the URL from your Material APEX environment. 52 | 53 | 5. Configure APEX Nitro 54 | ```bash 55 | apex-nitro config 56 | ``` 57 | A browser tab should open. 58 | 59 | a. Use the "Import" button 60 | 61 | b. Choose the file from step 4 62 | 63 | c. Save. You can close the tab now. 64 | 65 | 6. Launch APEX Nitro 66 | ```bash 67 | apex-nitro launch material-apex 68 | ``` 69 | 70 | 7. Make your changes 71 | 72 | 8. commit your changes 73 | ```bash 74 | git commit -m "your git commit message" 75 | ``` 76 | 77 | 9. Push your changes up to your fork: 78 | ```bash 79 | git push 80 | ``` 81 | 82 | 10. [Open a Pull Request](https://help.github.com/articles/using-pull-requests/) with a clear title and description 83 | -------------------------------------------------------------------------------- /docs/img/banner.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/banner.png -------------------------------------------------------------------------------- /docs/img/favicon.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/favicon.png -------------------------------------------------------------------------------- /docs/img/home.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/home.jpg -------------------------------------------------------------------------------- /docs/img/login1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/login1.png -------------------------------------------------------------------------------- /docs/img/office.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/office.jpg -------------------------------------------------------------------------------- /docs/img/parallax1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/parallax1.jpg -------------------------------------------------------------------------------- /docs/img/parallax2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/parallax2.jpg -------------------------------------------------------------------------------- /docs/img/parallax3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/parallax3.jpg -------------------------------------------------------------------------------- /docs/img/parallax4.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/parallax4.jpg -------------------------------------------------------------------------------- /docs/img/profile-picture.jpeg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/profile-picture.jpeg -------------------------------------------------------------------------------- /docs/img/responsive-video.mp4: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/responsive-video.mp4 -------------------------------------------------------------------------------- /docs/img/restore1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/restore1.png -------------------------------------------------------------------------------- /docs/img/restore2.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/restore2.png -------------------------------------------------------------------------------- /docs/img/sample-1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/sample-1.jpg -------------------------------------------------------------------------------- /docs/img/theme.image.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/docs/img/theme.image.jpg -------------------------------------------------------------------------------- /docs/readme.md: -------------------------------------------------------------------------------- 1 | # Documentation 2 | 3 | ### [Updating Material APEX](update.md) 4 | -------------------------------------------------------------------------------- /docs/update.md: -------------------------------------------------------------------------------- 1 | # Update 2 | 3 | 1. Import `empty-app.sql` from the [latest release](https://github.com/vincentmorneau/material-apex/releases/latest) in your workspace 4 | 2. Go to your existing application 5 | 3. Go to Shared Components - Themes 6 | 4. Select Restore Theme Subscription ![restore1](img/restore1.png) 7 | 5. Follow the instructions ![restore2](img/restore2.png) 8 | 9 | --- 10 | 11 | ### Make sure the following components are up to date: 12 | #### Page 0 (optional) 13 | ##### Regions 14 | Name | Type | Position | Template | Source 15 | --- | --- | --- | --- | --- 16 | {search bar} | Static Content | Search Bar | *None* | 17 | {sidenav header} | Classic Report | Item Container | *None* | *See Below* 18 | 19 | ```sql 20 | select '/img/sample-1.jpg' background_img 21 | , '/img/profile-picture.jpeg' profile_img 22 | , '#' profile_link 23 | , 'Vincent Morneau' text_line_1 24 | , 'vmorneau@insum.ca' text_line_2 25 | from dual 26 | ``` 27 | 28 | ##### Items 29 | Name | Type | Label | Region | Template 30 | --- | --- | --- | --- | --- 31 | P0_SEARCH | Text Field | `` | {search bar} | Standard 32 | -------------------------------------------------------------------------------- /license: -------------------------------------------------------------------------------- 1 | The MIT License (MIT) 2 | 3 | Copyright (c) Vincent Morneau 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in 13 | all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN 21 | THE SOFTWARE. 22 | -------------------------------------------------------------------------------- /package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "material-apex", 3 | "version": "1.0.0", 4 | "lockfileVersion": 1, 5 | "requires": true, 6 | "dependencies": { 7 | "materialize-css": { 8 | "version": "1.0.0", 9 | "resolved": "https://registry.npmjs.org/materialize-css/-/materialize-css-1.0.0.tgz", 10 | "integrity": "sha512-4/oecXl8y/1i8RDZvyvwAICyqwNoKU4or5uf8uoAd74k76KzZ0Llym4zhJ5lLNUskcqjO0AuMcvNyDkpz8Z6zw==" 11 | } 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "material-apex", 3 | "author": "Vincent Morneau", 4 | "version": "1.0.0", 5 | "description": "Material Design Theme for Oracle APEX 5", 6 | "link": "https://materialapex.com/pls/apex/f?p=12192", 7 | "license": "MIT", 8 | "repository": { 9 | "type": "git", 10 | "url": "git://github.com/vincentmorneau/material-apex.git" 11 | }, 12 | "dependencies": { 13 | "materialize-css": "1.0.0" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /plugins/Dynamic Action/MATERIAL.APEX.BOTTOM.SHEET.CLOSE.sql: -------------------------------------------------------------------------------- 1 | function render_staggered_list ( 2 | p_dynamic_action in apex_plugin.t_dynamic_action 3 | , p_plugin in apex_plugin.t_plugin 4 | ) return apex_plugin.t_dynamic_action_render_result 5 | is 6 | l_result apex_plugin.t_dynamic_action_render_result; 7 | begin 8 | l_result.javascript_function := 'function(){$(this.affectedElements).modal(''close'');}'; 9 | 10 | return l_result; 11 | end render_staggered_list; 12 | -------------------------------------------------------------------------------- /plugins/Dynamic Action/MATERIAL.APEX.BOTTOM.SHEET.OPEN.sql: -------------------------------------------------------------------------------- 1 | function render_staggered_list ( 2 | p_dynamic_action in apex_plugin.t_dynamic_action 3 | , p_plugin in apex_plugin.t_plugin 4 | ) return apex_plugin.t_dynamic_action_render_result 5 | is 6 | l_result apex_plugin.t_dynamic_action_render_result; 7 | begin 8 | l_result.javascript_function := 'function(){$(this.affectedElements).modal(''open'');}'; 9 | 10 | return l_result; 11 | end render_staggered_list; 12 | -------------------------------------------------------------------------------- /plugins/Dynamic Action/MATERIAL.APEX.DISCOVERY.CLOSE.sql: -------------------------------------------------------------------------------- 1 | function render ( 2 | p_dynamic_action in apex_plugin.t_dynamic_action 3 | , p_plugin in apex_plugin.t_plugin 4 | ) return apex_plugin.t_dynamic_action_render_result 5 | is 6 | l_result apex_plugin.t_dynamic_action_render_result; 7 | begin 8 | l_result.javascript_function := 'function(){ ' 9 | || ' $(".tap-target").tapTarget("close"); ' 10 | || ' }'; 11 | 12 | return l_result; 13 | end render; 14 | -------------------------------------------------------------------------------- /plugins/Dynamic Action/MATERIAL.APEX.DISCOVERY.OPEN.sql: -------------------------------------------------------------------------------- 1 | function render ( 2 | p_dynamic_action in apex_plugin.t_dynamic_action 3 | , p_plugin in apex_plugin.t_plugin 4 | ) return apex_plugin.t_dynamic_action_render_result 5 | is 6 | subtype plugin_attr is varchar2(32767); 7 | 8 | l_result apex_plugin.t_dynamic_action_render_result; 9 | l_tap_target_html plugin_attr; 10 | begin 11 | l_tap_target_html := '
' 12 | || '
' 13 | || '
' || p_dynamic_action.attribute_02 || '
' 14 | || '

' || p_dynamic_action.attribute_03 || '

' 15 | || '
' 16 | || '
'; 17 | 18 | l_result.javascript_function := 'function(){ ' 19 | || ' $(".tap-target-wrapper").remove();' 20 | || ' $("body").append("' || l_tap_target_html || '"); ' 21 | || ' $(".tap-target").tapTarget(); ' 22 | || ' $(".tap-target").tapTarget("open"); ' 23 | || ' }'; 24 | 25 | return l_result; 26 | end render; 27 | -------------------------------------------------------------------------------- /plugins/Dynamic Action/MATERIAL.APEX.REMOVE.SPINNERS.sql: -------------------------------------------------------------------------------- 1 | function render ( 2 | p_dynamic_action in apex_plugin.t_dynamic_action 3 | , p_plugin in apex_plugin.t_plugin 4 | ) return apex_plugin.t_dynamic_action_render_result 5 | is 6 | l_result apex_plugin.t_dynamic_action_render_result; 7 | begin 8 | /* debug information will be included */ 9 | if apex_application.g_debug then 10 | apex_plugin_util.debug_dynamic_action ( 11 | p_plugin => p_plugin 12 | , p_dynamic_action => p_dynamic_action 13 | ); 14 | end if; 15 | 16 | l_result.javascript_function := 'function(){$(".u-Processing").remove();}'; 17 | 18 | return l_result; 19 | end render; 20 | -------------------------------------------------------------------------------- /plugins/Dynamic Action/MATERIAL.APEX.SHOW.SPINNER.sql: -------------------------------------------------------------------------------- 1 | function render ( 2 | p_dynamic_action in apex_plugin.t_dynamic_action 3 | , p_plugin in apex_plugin.t_plugin 4 | ) return apex_plugin.t_dynamic_action_render_result 5 | is 6 | l_result apex_plugin.t_dynamic_action_render_result; 7 | begin 8 | /* debug information will be included */ 9 | if apex_application.g_debug then 10 | apex_plugin_util.debug_dynamic_action ( 11 | p_plugin => p_plugin 12 | , p_dynamic_action => p_dynamic_action 13 | ); 14 | end if; 15 | 16 | l_result.javascript_function := 'function(){' 17 | || 'var container = this.affectedElements[0] === document ? null : this.affectedElements;' 18 | || 'apex.util.showSpinner(container, {' 19 | || '"size":"' || p_dynamic_action.attribute_01 || '",' 20 | || '"color":"' || p_dynamic_action.attribute_02 || '"' 21 | || '});' 22 | || '}'; 23 | 24 | return l_result; 25 | end render; 26 | -------------------------------------------------------------------------------- /plugins/Dynamic Action/MATERIAL.APEX.TOAST.sql: -------------------------------------------------------------------------------- 1 | function render ( 2 | p_dynamic_action in apex_plugin.t_dynamic_action 3 | , p_plugin in apex_plugin.t_plugin ) 4 | return apex_plugin.t_dynamic_action_render_result 5 | is 6 | l_result apex_plugin.t_dynamic_action_render_result; 7 | begin 8 | l_result.javascript_function := 'function(){M.toast({' 9 | || 'html:"' || p_dynamic_action.attribute_01 || '",' 10 | || 'displayLength:' || p_dynamic_action.attribute_02 || ',' 11 | || 'classes:"' || p_dynamic_action.attribute_03 || '",' 12 | || 'completeCallback:function(){' || p_dynamic_action.attribute_04 || '}' 13 | || '});}'; 14 | 15 | return l_result; 16 | end render; 17 | -------------------------------------------------------------------------------- /plugins/Item/MATERIAL.APEX.RANGE.sql: -------------------------------------------------------------------------------- 1 | function render ( 2 | p_item in apex_plugin.t_page_item 3 | , p_plugin in apex_plugin.t_plugin 4 | , p_value in varchar2 5 | , p_is_readonly in boolean 6 | , p_is_printer_friendly in boolean 7 | ) return apex_plugin.t_page_item_render_result as 8 | subtype plugin_attr is varchar2(32767); 9 | 10 | l_disabled varchar2(15); 11 | l_id_suffix varchar2(15); 12 | 13 | /* Global variables */ 14 | l_result apex_plugin.t_page_item_render_result; 15 | 16 | /* Item Attributes */ 17 | l_min plugin_attr := p_item.attribute_01; 18 | l_max plugin_attr := p_item.attribute_02; 19 | l_step plugin_attr := p_item.attribute_03; 20 | begin 21 | /* debug information will be included */ 22 | if apex_application.g_debug then 23 | apex_plugin_util.debug_page_item ( 24 | p_plugin => p_plugin 25 | , p_page_item => p_item 26 | , p_value => p_value 27 | , p_is_readonly => p_is_readonly 28 | , p_is_printer_friendly => p_is_printer_friendly 29 | ); 30 | end if; 31 | 32 | if p_is_readonly then 33 | apex_plugin_util.print_hidden_if_readonly ( 34 | p_item_name => p_item.name 35 | , p_value => p_value 36 | , p_is_readonly => p_is_readonly 37 | , p_is_printer_friendly => p_is_printer_friendly 38 | ); 39 | 40 | l_result.is_navigable := false; 41 | 42 | l_id_suffix := '_DISPLAY'; 43 | l_disabled := ' disabled '; 44 | end if; 45 | 46 | htp.p('

' 47 | || '' 58 | || '

'); 59 | 60 | return l_result; 61 | end render; 62 | -------------------------------------------------------------------------------- /plugins/Item/MATERIAL.APEX.SWITCH.sql: -------------------------------------------------------------------------------- 1 | function render ( 2 | p_item in apex_plugin.t_page_item 3 | , p_plugin in apex_plugin.t_plugin 4 | , p_value in varchar2 5 | , p_is_readonly in boolean 6 | , p_is_printer_friendly in boolean 7 | ) return apex_plugin.t_page_item_render_result as 8 | subtype plugin_attr is varchar2(32767); 9 | 10 | l_disabled varchar2(15); 11 | l_checked varchar2(15); 12 | l_id_suffix varchar2(15); 13 | 14 | /* Global variables */ 15 | l_result apex_plugin.t_page_item_render_result; 16 | 17 | /* Item Attributes */ 18 | l_on_label plugin_attr := p_item.attribute_01; 19 | l_on_value plugin_attr := p_item.attribute_02; 20 | l_off_label plugin_attr := p_item.attribute_03; 21 | begin 22 | /* debug information will be included */ 23 | if apex_application.g_debug then 24 | apex_plugin_util.debug_page_item ( 25 | p_plugin => p_plugin 26 | , p_page_item => p_item 27 | , p_value => p_value 28 | , p_is_readonly => p_is_readonly 29 | , p_is_printer_friendly => p_is_printer_friendly 30 | ); 31 | end if; 32 | 33 | if p_is_readonly then 34 | apex_plugin_util.print_hidden_if_readonly ( 35 | p_item_name => p_item.name 36 | , p_value => p_value 37 | , p_is_readonly => p_is_readonly 38 | , p_is_printer_friendly => p_is_printer_friendly 39 | ); 40 | 41 | l_result.is_navigable := false; 42 | 43 | l_id_suffix := '_DISPLAY'; 44 | l_disabled := ' disabled '; 45 | end if; 46 | 47 | if p_value = l_on_value then 48 | l_checked := ' checked '; 49 | end if; 50 | 51 | htp.p('
' 52 | || '' 66 | || '
'); 67 | 68 | return l_result; 69 | end render; 70 | -------------------------------------------------------------------------------- /plugins/Region/MATERIAL.APEX.CODE.sql: -------------------------------------------------------------------------------- 1 | function render ( 2 | p_region in apex_plugin.t_region 3 | , p_plugin in apex_plugin.t_plugin 4 | , p_is_printer_friendly in boolean 5 | ) return apex_plugin.t_region_render_result as 6 | subtype plugin_attr is varchar2(32767); 7 | 8 | /* Global variables */ 9 | l_result apex_plugin.t_region_render_result; 10 | l_plugin_html plugin_attr; 11 | 12 | /* t_region Attributes */ 13 | l_language_type plugin_attr := p_region.attribute_01; 14 | l_source_code plugin_attr := p_region.attribute_02; 15 | begin 16 | /* debug information will be included */ 17 | if apex_application.g_debug then 18 | apex_plugin_util.debug_region ( 19 | p_plugin => p_plugin 20 | , p_region => p_region 21 | , p_is_printer_friendly => p_is_printer_friendly 22 | ); 23 | end if; 24 | 25 | l_plugin_html := '
'
26 | 		|| apex_escape.html(l_source_code)
27 | 		|| '
'; 28 | 29 | sys.htp.p(l_plugin_html); 30 | 31 | return l_result; 32 | end render; 33 | -------------------------------------------------------------------------------- /plugins/readme.md: -------------------------------------------------------------------------------- 1 | This repository stores the source of all Material APEX plugins. To download a plugin, export it from the demo application. 2 | -------------------------------------------------------------------------------- /readme.md: -------------------------------------------------------------------------------- 1 | Important: This project is no longer maintained. I am open to reviewing and accepting pull requests but I will not push any new updates going forward. Thanks for using Material APEX! 2 | 3 | # Material APEX 4 | 5 | [![npm](https://img.shields.io/npm/v/material-apex.svg)](https://www.npmjs.com/package/material-apex) [![Build Status](https://travis-ci.org/vincentmorneau/material-apex.svg?branch=master)](https://travis-ci.org/vincentmorneau/material-apex) [![Dependency Status](https://david-dm.org/vincentmorneau/material-apex.svg)](https://david-dm.org/vincentmorneau/material-apex) [![APEX Theme](https://cdn.rawgit.com/Dani3lSun/apex-github-badges/b7e95341/badges/apex-theme-badge.svg)](https://cdn.rawgit.com/Dani3lSun/apex-github-badges) 6 | 7 | ![banner](/docs/img/banner.png) 8 | 9 | ## Demo 10 | 11 | [https://apex.oracle.com/pls/apex/f?p=12192](https://apex.oracle.com/pls/apex/f?p=12192) 12 | 13 | ## Install 14 | 15 | Import **empty-app.sql** or **demo-app.sql** from the [latest release](https://github.com/vincentmorneau/material-apex/releases/latest) in your workspace. 16 | 17 | ## Update 18 | 19 | [See documentation](docs/update.md) 20 | 21 | ## Compatibility 22 | 23 | | APEX 18.1 | APEX 5.1 | APEX 5.0 | APEX 4.2 | 24 | | ----------------------------------------------------------------------------- | ------------------------------------------------------------------------------- | --------------------------------------------------------------------------------- | ------------- | 25 | | [v1.0.0](https://github.com/vincentmorneau/material-apex/releases/tag/v1.0.0) | [v0.12.2](https://github.com/vincentmorneau/material-apex/releases/tag/v0.12.2) | [v0.9.6.1](https://github.com/vincentmorneau/material-apex/releases/tag/v0.9.6.1) | Not available | 26 | 27 | ## Contribute 28 | 29 | [Learn how to build this project yourself and contribute](contributing.md). 30 | 31 | ## Changelog 32 | 33 | [See complete changelog](changelog.md). 34 | 35 | ## Sponsors 36 | 37 | [Insum Solutions](http://insum.ca/) 38 | 39 | ## License 40 | 41 | MIT © [Vincent Morneau](http://vmorneau.me) 42 | -------------------------------------------------------------------------------- /src/img/ui-icons_ffffff_256x240.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vincentmorneau/material-apex/b1c7b1814dbb52d99425e5ee12aeafc848124346/src/img/ui-icons_ffffff_256x240.png -------------------------------------------------------------------------------- /src/js/finalize.js: -------------------------------------------------------------------------------- 1 | $(document).ready(function () { 2 | var materializePlugins = { 3 | Chips: document.body.querySelectorAll('.chips'), 4 | // Dropdown: document.body.querySelectorAll('.dropdown-trigger'), 5 | Materialbox: document.body.querySelectorAll('.materialboxed'), 6 | Parallax: document.body.querySelectorAll('.parallax'), 7 | Pushpin: document.body.querySelectorAll('.pushpin'), 8 | ScrollSpy: document.body.querySelectorAll('.scrollspy') 9 | }; 10 | 11 | for (var pluginName in materializePlugins) { 12 | var plugin = M[pluginName]; 13 | plugin.init(materializePlugins[pluginName]); 14 | } 15 | 16 | materialAPEX.materialize.init(); 17 | materialAPEX.datepicker.init(); 18 | materialAPEX.select.init(); 19 | materialAPEX.ir.init(); 20 | materialAPEX.ig.init(); 21 | materialAPEX.observe.toolbar(); 22 | materialAPEX.observe.select(); 23 | materialAPEX.observe.irDialog(); 24 | materialAPEX.observe.irHeader(); 25 | materialAPEX.theme.init(); 26 | 27 | M.updateTextFields(); 28 | 29 | // triggers a resize 30 | $(document).trigger("apexwindowresized"); 31 | 32 | // making the page visible again 33 | // !important is required to overwrite what APEX already does 34 | $("html").attr('style', 'visibility: visible!important'); 35 | 36 | // event handler for apexafterrefresh 37 | $('select').on('apexafterrefresh', function () { 38 | materialAPEX.debug.time("apexafterrefresh"); 39 | materialAPEX.select.init(); 40 | materialAPEX.debug.timeEnd("apexafterrefresh"); 41 | }); 42 | 43 | // event handler for select change 44 | $('select:not(.apex-item-select--multiple)').on('change', function () { 45 | materialAPEX.debug.time("selectonchange"); 46 | materialAPEX.select.init(); 47 | materialAPEX.debug.timeEnd("selectonchange"); 48 | }); 49 | 50 | // event handler for interactive reports 51 | $(".a-IRR-container").closest(".ma-region").on("apexafterrefresh", function () { 52 | materialAPEX.debug.time("IRR-apexafterrefresh"); 53 | materialAPEX.ir.init(); 54 | materialAPEX.select.ir(); 55 | materialAPEX.debug.timeEnd("IRR-apexafterrefresh"); 56 | }); 57 | 58 | // global apexafterrefresh handler 59 | $(document).on("apexafterrefresh", function () { 60 | materialAPEX.debug.time("apexafterrefresh"); 61 | materialAPEX.items.init(); 62 | materialAPEX.textarea.init(); 63 | materialAPEX.debug.timeEnd("apexafterrefresh"); 64 | }); 65 | 66 | // event handler #1 for interactive grids 67 | $(document).on("gridpagechange", function (event, object) { 68 | materialAPEX.debug.time("gridpagechange"); 69 | materialAPEX.ig.init(); 70 | materialAPEX.items.init(); 71 | materialAPEX.debug.timeEnd("gridpagechange"); 72 | }); 73 | 74 | // event handler #2 for interactive grids 75 | $(document).on("apexbeginrecordedit", function (event, object) { 76 | materialAPEX.debug.time("apexbeginrecordedit"); 77 | materialAPEX.debug.timeEnd("apexbeginrecordedit"); 78 | }); 79 | 80 | // event handler #3 for interactive grids 81 | $(document).on("interactivegridselectionchange", function (event, object) { 82 | materialAPEX.debug.time("interactivegridselectionchange"); 83 | materialAPEX.items.init(object.recordId); 84 | materialAPEX.debug.timeEnd("interactivegridselectionchange"); 85 | }); 86 | 87 | // modal interactive grid 88 | $(document).on("dialogopen", function (event, object) { 89 | materialAPEX.debug.time("dialogopen"); 90 | materialAPEX.select.refresh("#" + event.target.id + " select"); 91 | materialAPEX.items.init("#" + event.target.id); 92 | materialAPEX.items.utr(); 93 | materialAPEX.debug.timeEnd("dialogopen"); 94 | }); 95 | 96 | // modal interactive grid 97 | $(document).on("dialogclose", function (event, object) { 98 | materialAPEX.debug.time("dialogclose"); 99 | materialAPEX.debug.timeEnd("dialogclose"); 100 | }); 101 | }); 102 | -------------------------------------------------------------------------------- /src/less/_apex_variables.less: -------------------------------------------------------------------------------- 1 | @medium-and-up: ~"only screen and (min-width : @{small-screen-up})"; 2 | @large-and-up: ~"only screen and (min-width : @{medium-screen-up})"; 3 | @extra-large-and-up: ~"only screen and (min-width : @{large-screen-up})"; 4 | @small-and-down: ~"only screen and (max-width : @{small-screen})"; 5 | @medium-and-down: ~"only screen and (max-width : @{medium-screen})"; 6 | @medium-only: ~"only screen and (min-width : @{small-screen-up}) and (max-width : @{medium-screen})"; 7 | -------------------------------------------------------------------------------- /src/scss/_apex_alert.scss: -------------------------------------------------------------------------------- 1 | #ma-notification-container { 2 | @extend #toast-container; 3 | max-width:none; 4 | z-index: 999; 5 | } 6 | 7 | @media #{$medium-and-up} { 8 | #ma-notification-container { 9 | top: 1.6rem; 10 | right: 1.6rem; 11 | left: auto; 12 | bottom: auto; 13 | } 14 | 15 | .t-Alert--page { 16 | max-width: 50rem; 17 | min-width: 20rem; 18 | } 19 | } 20 | 21 | .t-Alert { 22 | @include z-depth-1; 23 | 24 | &.t-Alert--horizontal .t-Alert-wrap { 25 | padding: 0; 26 | } 27 | 28 | &.t-Alert--page .t-Alert-icon { 29 | padding: 16px 0 16px 16px; 30 | } 31 | 32 | .t-Alert-header { 33 | padding: 20px; 34 | } 35 | 36 | &.t-Alert--page .t-Alert-title, &.t-Alert--page .a-Notification-title { 37 | font-size: 1.3rem; 38 | line-height: 1.3rem; 39 | } 40 | 41 | &.t-Alert--page .t-Button--closeAlert { 42 | position: static; 43 | margin-right: 1rem; 44 | } 45 | 46 | .t-Alert-buttons button { 47 | padding: 0; 48 | } 49 | 50 | &.t-Alert--page .a-Notification-list { 51 | font-size: 1rem; 52 | } 53 | } 54 | 55 | .t-Alert--success { 56 | background-color: $success-color; 57 | color: $success-color-text; 58 | 59 | .t-Alert-buttons button { 60 | color: $success-color-text; 61 | } 62 | } 63 | 64 | .t-Alert--warning { 65 | background-color: $warning-color; 66 | color: $warning-color-text; 67 | 68 | &.t-Alert--page .t-Alert-icon { 69 | color: darken($warning-color, 40%); 70 | } 71 | 72 | &.t-Alert--page .a-Notification-list { 73 | color: lighten($warning-color-text, 30%); 74 | } 75 | 76 | .t-Alert-buttons button { 77 | color: $warning-color-text; 78 | } 79 | } 80 | -------------------------------------------------------------------------------- /src/scss/_apex_breadcrumbs.scss: -------------------------------------------------------------------------------- 1 | nav.nav-extended .nav-breadcrumbs .nav-wrapper { 2 | height: 42px; 3 | line-height: 42px; 4 | min-height: 42px; 5 | 6 | .breadcrumb { 7 | color: lighten($color: $navbar-font-color, $amount: 25%); 8 | 9 | &:before { 10 | color: lighten($color: $navbar-font-color, $amount: 25%); 11 | } 12 | 13 | &:last-child { 14 | color: $navbar-font-color; 15 | } 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /src/scss/_apex_buttons.scss: -------------------------------------------------------------------------------- 1 | // Icons 2 | .icon-float-left { 3 | // left icon 4 | i:first-child { 5 | margin-right: 0.5rem; 6 | vertical-align: top; 7 | } 8 | // right icon 9 | .ma-button-label + i { 10 | @include hide; 11 | } 12 | } 13 | 14 | .icon-float-right { 15 | // left icon 16 | i:first-child { 17 | @include hide; 18 | } 19 | // right icon 20 | .ma-button-label + i { 21 | margin-left: 0.5rem; 22 | vertical-align: top; 23 | } 24 | } 25 | 26 | .ma-button-icon:not(.btn-floating) { 27 | padding: 0 1rem; 28 | } 29 | 30 | // Spacing around Buttons 31 | .ma-button { 32 | margin: 4px 2px; 33 | } 34 | 35 | // Fixed Action Button 36 | .fab-relative { 37 | position: relative; 38 | } 39 | 40 | .fixed-action-btn { 41 | bottom: 45px; 42 | z-index: 996; 43 | 44 | &.fab-position-left { 45 | left: 25px; 46 | } 47 | 48 | &.fab-position-right { 49 | right: 25px; 50 | } 51 | 52 | &.fab-position-absolute { 53 | position: absolute; 54 | right: 0; 55 | bottom: 0; 56 | } 57 | 58 | &.horizontal ul { 59 | bottom: 80px; 60 | 61 | li { 62 | margin: 5px 0 0; 63 | } 64 | 65 | .btn-floating { 66 | opacity: 0; 67 | margin: 5px 10px; 68 | } 69 | } 70 | 71 | /* Toolbar */ 72 | &.fab-toolbar { 73 | &.active { 74 | & > a i { 75 | opacity: 0; 76 | } 77 | } 78 | padding: 0; 79 | height: $button-floating-large-size; 80 | 81 | ul { 82 | display: flex; 83 | top: 0; 84 | bottom: 0; 85 | 86 | li { 87 | flex: 1; 88 | display: inline-block; 89 | margin: 0; 90 | height: 100%; 91 | transition: none; 92 | 93 | button, a { 94 | display: block; 95 | overflow: hidden; 96 | position: relative; 97 | width: 100%; 98 | height: 100%; 99 | background-color: transparent; 100 | box-shadow: none; 101 | color: #fff; 102 | line-height: $button-floating-large-size; 103 | z-index: 1; 104 | margin: 0; 105 | 106 | i { 107 | line-height: inherit; 108 | } 109 | } 110 | } 111 | } 112 | } 113 | } 114 | 115 | /* Inline button 116 | This is to give space as if there was a label */ 117 | .ma-btn-inline { 118 | margin-top: 2rem; 119 | } 120 | 121 | // IG and IRR buttons 122 | .a-Button, .ui-button { 123 | &:focus { 124 | outline: none; 125 | background-color: transparent; 126 | } 127 | 128 | background-color: transparent; 129 | box-shadow: none; 130 | } 131 | 132 | // Button block 133 | .ma-btn-block { 134 | display: block; 135 | width: 100%; 136 | } 137 | 138 | // Outlined 139 | .btn.btn-outlined { 140 | border: 1px solid $button-disabled-color; 141 | background-color: transparent; 142 | color: $secondary-color; 143 | line-height: 2.25rem; 144 | 145 | &:not(:hover) { 146 | box-shadow: none; 147 | } 148 | } 149 | -------------------------------------------------------------------------------- /src/scss/_apex_calendar.scss: -------------------------------------------------------------------------------- 1 | .fc-scroller { 2 | height: auto!important; // need to override inline style 3 | } 4 | 5 | .fc-toolbar.fc-header-toolbar { 6 | margin-bottom: 0!important; 7 | } 8 | -------------------------------------------------------------------------------- /src/scss/_apex_cards.scss: -------------------------------------------------------------------------------- 1 | .ma-region.card .row { 2 | margin-bottom: 0; 3 | } 4 | 5 | .card .card-title { 6 | z-index: 1; 7 | } 8 | 9 | // Handling conditional display for reveal cards 10 | .ma-card-reveal-content { 11 | @include hide(); 12 | } 13 | 14 | .ma-card-reveal { 15 | .ma-card-reveal-content { 16 | @include showFlex(); 17 | } 18 | 19 | .ma-card-image-content { 20 | @include hide(); 21 | } 22 | } 23 | 24 | // End 25 | 26 | .panel-close { 27 | cursor: pointer; 28 | } 29 | 30 | .ma-region-bg-color>.card { 31 | background-color: inherit; 32 | } 33 | 34 | 35 | // Horizontal Cards 36 | .ma-card-horizontal .card { 37 | @extend .horizontal; 38 | flex-direction: row !important; 39 | 40 | .ma-card-stacked { 41 | @extend .card-stacked; 42 | } 43 | } 44 | 45 | // Card Buttons 46 | .card-action { 47 | &>a { 48 | color: $card-link-color; 49 | margin-right: $card-padding; 50 | transition: color 0.3s ease; 51 | text-transform: uppercase; 52 | 53 | &:hover { 54 | color: $card-link-color-light; 55 | } 56 | } 57 | } 58 | 59 | // Hoverable 60 | .ma-card-hoverable>.ma-card-col>.card { 61 | @extend .hoverable; 62 | } 63 | 64 | // Fixing Card margin 65 | .card .card-content .card-title { 66 | margin-bottom: 0; 67 | line-height: unset; 68 | } 69 | 70 | .card .ma-region-header~.ma-region-body:not(:empty), 71 | .card .card-content .card-title:not(:empty)+p { 72 | margin-top: 1rem; 73 | } 74 | 75 | .ma-region-card.hide-title .ma-region-body { 76 | margin-top: 0 !important; 77 | } 78 | 79 | .ma-report--cards { 80 | display: flex; 81 | flex: 0 1 auto; 82 | flex-direction: row; 83 | flex-wrap: wrap; 84 | margin-right: (-1 * $gutter-width / 2); 85 | margin-left: (-1 * $gutter-width / 2); 86 | 87 | .ma-card-col { 88 | display: flex; 89 | flex: 0 0 auto; 90 | flex-grow: 1; 91 | flex-basis: 0; 92 | padding-right: $gutter-width / 2; 93 | padding-left: $gutter-width / 2; 94 | 95 | .card { 96 | display: flex; 97 | flex-direction: column; 98 | width: 100%; 99 | 100 | .card-content, 101 | .ma-card-stacked { 102 | display: flex; 103 | flex-direction: column; 104 | flex-grow: 1; 105 | } 106 | } 107 | } 108 | } 109 | 110 | @media #{$medium-and-up} { 111 | .ma-card-col-1 .ma-card-col { 112 | flex-basis: percentage(1 / 1); 113 | max-width: percentage(1 / 1); 114 | } 115 | 116 | .ma-card-col-2 .ma-card-col { 117 | flex-basis: percentage(1 / 2); 118 | max-width: percentage(1 / 2); 119 | } 120 | 121 | .ma-card-col-3 .ma-card-col { 122 | flex-basis: percentage(1 / 3); 123 | max-width: percentage(1 / 3); 124 | } 125 | 126 | .ma-card-col-4 .ma-card-col { 127 | flex-basis: percentage(1 / 4); 128 | max-width: percentage(1 / 4); 129 | } 130 | } 131 | 132 | @media #{$small-and-down} { 133 | 134 | .ma-card-col-1, 135 | .ma-card-col-2, 136 | .ma-card-col-3, 137 | .ma-card-col-4 { 138 | .ma-card-col { 139 | flex-basis: percentage(1 / 1); 140 | max-width: percentage(1 / 1); 141 | } 142 | } 143 | } 144 | -------------------------------------------------------------------------------- /src/scss/_apex_carousel.scss: -------------------------------------------------------------------------------- 1 | // .carousel.carousel-slider .carousel-item { 2 | // min-height: 100px; 3 | // } 4 | -------------------------------------------------------------------------------- /src/scss/_apex_collapsible.scss: -------------------------------------------------------------------------------- 1 | .collapsible { 2 | margin: 0; 3 | 4 | .collapsible-header i { 5 | width: initial; 6 | } 7 | 8 | .collapsible-body { 9 | background-color: $collapsible-header-color; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /src/scss/_apex_collections.scss: -------------------------------------------------------------------------------- 1 | .collection:not(.with-header) .collection-header { 2 | @include hide(); 3 | } 4 | 5 | .collection span.badge { 6 | max-width: 60%; 7 | display: inline-block; 8 | } 9 | 10 | .collection .secondary-content:empty { 11 | @include hide(); 12 | } 13 | -------------------------------------------------------------------------------- /src/scss/_apex_colors.scss: -------------------------------------------------------------------------------- 1 | @each $color_name, 2 | $color in $colors { 3 | 4 | @each $color_type, 5 | $color_value in $color { 6 | @if $color_type=="base" { 7 | 8 | .ma-colored-field.#{$color_name}-text, 9 | .ma-colored-region.#{$color_name}-text { 10 | input { 11 | color: $color_value !important; 12 | border-color: $color_value !important; 13 | box-shadow: none !important; 14 | 15 | &+label { 16 | color: $color_value !important; 17 | } 18 | 19 | &:focus:not([readonly]) { 20 | border-color: $input-focus-color !important; 21 | box-shadow: 0 1px 0 0 $input-focus-color !important; 22 | 23 | &+label { 24 | color: $input-focus-color !important; 25 | } 26 | } 27 | } 28 | } 29 | 30 | .ma-region-title-#{$color_name}-text .ma-region-title { 31 | color: $color_value !important; 32 | } 33 | } 34 | } 35 | } 36 | 37 | @each $color_name, 38 | $color_value in $shades { 39 | 40 | .ma-colored-field.#{$color_name}-text, 41 | .ma-colored-region.#{$color_name}-text { 42 | input { 43 | color: $color_value !important; 44 | border-color: $color_value !important; 45 | box-shadow: none !important; 46 | 47 | &+label { 48 | color: $color_value !important; 49 | } 50 | 51 | &:focus:not([readonly]) { 52 | border-color: $input-focus-color !important; 53 | box-shadow: 0 1px 0 0 $input-focus-color !important; 54 | 55 | &+label { 56 | color: $input-focus-color !important; 57 | } 58 | } 59 | } 60 | } 61 | 62 | .ma-region-title-#{$color_name}-text .ma-region-title { 63 | color: $color_value !important; 64 | } 65 | } 66 | -------------------------------------------------------------------------------- /src/scss/_apex_datepicker.scss: -------------------------------------------------------------------------------- 1 | .ui-datepicker-trigger { 2 | margin-left: -32px!important; 3 | background-color: transparent; 4 | border: none; 5 | box-shadow: none; 6 | padding: 4px 8px; 7 | line-height: 12px; 8 | } 9 | 10 | .a-IG .ui-datepicker-trigger { 11 | margin-left: -1px; 12 | } 13 | 14 | .ui-datepicker { 15 | padding: 0; 16 | border: none; 17 | z-index: 800!important; 18 | width: auto; 19 | @include z-depth-5; 20 | 21 | .ui-datepicker-material { 22 | display: flex; 23 | } 24 | 25 | .ui-datepicker-material-header { 26 | background-color: $datepicker-date-bg; 27 | color: #fff; 28 | padding: 1rem; 29 | font-weight: 300; 30 | max-width: 200px; 31 | 32 | .ui-datepicker-material-year { 33 | font-size: 1.3rem; 34 | color: $datepicker-year; 35 | } 36 | 37 | .ui-datepicker-material-day { 38 | font-size: 2rem; 39 | } 40 | } 41 | 42 | .ui-datepicker-material-body { 43 | display: block; 44 | min-width: 250px; 45 | } 46 | 47 | .ui-datepicker-header { 48 | text-align: center; 49 | background: #fff; 50 | font-weight: 300; 51 | padding: 0; 52 | border: none; 53 | 54 | .ui-datepicker-title { 55 | margin: .3rem 0; 56 | height: 2.3rem; 57 | 58 | select.ui-datepicker-month, select.ui-datepicker-year { 59 | @extend .browser-default; 60 | display: inline-block!important; 61 | margin: 0 0.5rem; 62 | width: 25%; 63 | } 64 | 65 | span.ui-datepicker-month, span.ui-datepicker-year { 66 | display: inline-block; 67 | margin: 1rem 0; 68 | } 69 | } 70 | 71 | .ui-datepicker-prev, .ui-datepicker-next { 72 | top: auto; 73 | height: 4rem; 74 | width: 3rem; 75 | cursor: pointer; 76 | 77 | .ui-icon { 78 | background-image: none!important; 79 | 80 | &:before { 81 | content: " "; 82 | border-top: .5em solid transparent; 83 | border-bottom: .5em solid transparent; 84 | border-right: 0.75em solid #676767; 85 | width: 0; 86 | height: 0; 87 | display: block; 88 | margin: 0 auto; 89 | } 90 | } 91 | 92 | &.ui-state-hover { 93 | border: none; 94 | background: $datepicker-selected-outfocus; 95 | } 96 | } 97 | 98 | .ui-datepicker-prev .ui-icon:before { 99 | } 100 | 101 | .ui-datepicker-next .ui-icon:before { 102 | border-right: 0; 103 | border-left: 0.75em solid #676767; 104 | } 105 | 106 | .ui-datepicker-prev, .ui-datepicker-prev-hover { 107 | left: 0; 108 | } 109 | 110 | .ui-datepicker-next, .ui-datepicker-next-hover { 111 | right: 0; 112 | } 113 | } 114 | 115 | .ui-datepicker-calendar { 116 | background: #fff; 117 | margin: 0; 118 | 119 | .ui-state-default { 120 | background: none; 121 | border: none; 122 | text-align: center; 123 | box-shadow: none; 124 | padding: .4rem 0; 125 | } 126 | 127 | .ui-state-active, .ui-state-highlight, .ui-state-hover { 128 | border-radius: 50%; 129 | color: #fff; 130 | width: 25px; 131 | height: 25px; 132 | margin: auto; 133 | line-height: 13px; 134 | } 135 | 136 | .ui-state-active { 137 | background-color: $datepicker-selected!important; 138 | } 139 | 140 | .ui-state-highlight, .ui-state-hover { 141 | color: $datepicker-date-bg; 142 | } 143 | 144 | thead { 145 | border-bottom: none; 146 | 147 | th { 148 | color: #999; 149 | font-weight: 500; 150 | width: percentage(1 / 7); 151 | padding: 0.5em 0; 152 | } 153 | } 154 | 155 | tr { 156 | border-bottom: 0; 157 | } 158 | } 159 | 160 | .ui-datepicker-buttonpane { 161 | .ui-corner-all { 162 | display: inline-block; 163 | 164 | .spanTime { 165 | table { 166 | margin-bottom: 0; 167 | } 168 | 169 | tr { 170 | border: none; 171 | } 172 | 173 | .datetimepicker_newMonth { 174 | display: inline-block; 175 | width: auto; 176 | margin-top: 0.2rem!important; 177 | margin-left: 0.2rem!important; 178 | margin-right: 0.2rem!important; 179 | } 180 | } 181 | } 182 | 183 | button { 184 | @include btn-flat; 185 | font-weight: normal; 186 | } 187 | } 188 | } 189 | -------------------------------------------------------------------------------- /src/scss/_apex_demo.scss: -------------------------------------------------------------------------------- 1 | .icon-container { 2 | .icon-preview { 3 | height: 120px; 4 | text-align: center; 5 | } 6 | 7 | i { 8 | font-size: 3em; 9 | display: block; 10 | margin-bottom: 10px; 11 | } 12 | } 13 | 14 | .dynamic-color { 15 | .red, .pink, .purple, .deep-purple, .indigo, .blue, .light-blue, .cyan, .teal, .green, .light-green, .lime, .yellow, .amber, .orange, .deep-orange, .brown, .grey, .blue-grey, .black, .white, .transparent { 16 | height: 55px; 17 | width: 100%; 18 | padding: 0 15px; 19 | line-height: 55px; 20 | font-weight: 500; 21 | font-size: 12px; 22 | display: block; 23 | box-sizing: border-box; 24 | } 25 | 26 | .darken-1, .darken-2, .darken-3, .darken-4 { 27 | color: #fff; 28 | } 29 | } 30 | 31 | .icon-demo { 32 | line-height: 50px; 33 | } 34 | 35 | .promo-i i { 36 | color: $primary-color; 37 | } -------------------------------------------------------------------------------- /src/scss/_apex_dropdown.scss: -------------------------------------------------------------------------------- 1 | // makes the dropdown width adapt to its content 2 | .dropdown-content.select-dropdown { 3 | width: auto !important; 4 | min-width: 100%; 5 | 6 | li { 7 | white-space: nowrap; 8 | } 9 | } 10 | -------------------------------------------------------------------------------- /src/scss/_apex_footer.scss: -------------------------------------------------------------------------------- 1 | .page-footer { 2 | font-size: $footer-font-size; 3 | } 4 | 5 | .footer-copyright { 6 | .version 7 | , .customize 8 | , .screenreader { 9 | display: inline-block; 10 | margin-left: 1rem; 11 | } 12 | 13 | a { 14 | color: inherit; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/scss/_apex_forms.scss: -------------------------------------------------------------------------------- 1 | // Input 2 | .input-field { 3 | margin-top: 1.5rem; 4 | } 5 | 6 | :focus { 7 | outline: none; 8 | } 9 | 10 | // Date Pickers 11 | .datepicker, 12 | .u-TF-item--datepicker { 13 | cursor: pointer; 14 | } 15 | 16 | // Display image 17 | .item-image-responsive img { 18 | @extend .responsive-img; 19 | } 20 | 21 | .item-image-circle img { 22 | @extend .circle; 23 | } 24 | 25 | .item-fade-in img { 26 | @extend .fade-in; 27 | } 28 | 29 | // Textarea 30 | .apex-item-textarea-counter { 31 | float: right; 32 | font-size: 12px; 33 | } 34 | 35 | // Checkbox and radio 36 | .checkbox_group, 37 | .radio_group { 38 | margin-bottom: $input-margin-bottom; 39 | 40 | .apex-item-option { 41 | padding-right: 1rem; 42 | } 43 | } 44 | 45 | [type="checkbox"], 46 | [type="radio"] { 47 | &+label { 48 | @extend span; 49 | } 50 | } 51 | 52 | [type="radio"]:checked + label:after, 53 | [type="radio"].with-gap:checked + label:after { 54 | background-color: $radio-fill-color; 55 | } 56 | 57 | [type="radio"]:checked + label:after, 58 | [type="radio"].with-gap:checked + label:before, 59 | [type="radio"].with-gap:checked + label:after { 60 | border: $radio-border; 61 | } 62 | 63 | [type="checkbox"]:checked { 64 | + label:not(.lever):before { 65 | border-right: $radio-border; 66 | border-bottom: $radio-border; 67 | } 68 | } 69 | 70 | [type="checkbox"]:indeterminate { 71 | + label:not(.lever):before { 72 | border-right: $radio-border; 73 | } 74 | } 75 | 76 | // Filled in Style 77 | [type="checkbox"].filled-in { 78 | // Checked style 79 | &:checked { 80 | + label:not(.lever):after { 81 | border: $radio-border; 82 | background-color: $radio-fill-color; 83 | } 84 | } 85 | 86 | &.tabbed:checked:focus + label:not(.lever):after { 87 | background-color: $radio-fill-color; 88 | border-color: $radio-fill-color; 89 | } 90 | } 91 | 92 | // Autocomplete 93 | .apex-item-wrapper--auto-complete { 94 | label { 95 | transform: translateY(-14px) scale(0.8); 96 | transform-origin: 0 0; 97 | } 98 | 99 | .oj-inputsearch-choice { 100 | background-color: transparent; 101 | border: none; 102 | margin-top: 1rem; 103 | } 104 | 105 | .oj-inputsearch { 106 | max-width: 100%; 107 | } 108 | } 109 | 110 | .oj-listbox-drop { 111 | border: none; 112 | overflow: visible; 113 | 114 | ul.oj-listbox-results { 115 | li.oj-listbox-result { 116 | font-size: 16px; 117 | color: $primary-color; 118 | display: block; 119 | line-height: 22px; 120 | padding: 14px 16px; 121 | } 122 | } 123 | } 124 | 125 | // Popup LOV 126 | .apex-item-wrapper--popup-lov { 127 | label { 128 | transform: translateY(-14px) scale(0.8); 129 | transform-origin: 0 0; 130 | } 131 | } 132 | 133 | .ma-popuplov-modal { 134 | margin: 0; 135 | max-width: 100%; 136 | width: 100%; 137 | 138 | #SEARCH { 139 | width: 50%; 140 | } 141 | 142 | .collection { 143 | margin-top: 0; 144 | margin-bottom: 0; 145 | 146 | br { 147 | @include hide(); 148 | } 149 | 150 | a { 151 | @extend .collection-item; 152 | } 153 | } 154 | } 155 | 156 | .ma-popuplov { 157 | .lov input { 158 | border-bottom: 1px solid $input-border-color; 159 | } 160 | 161 | label { 162 | transform: translateY(0) scale(0.8); 163 | transform-origin: 0 0; 164 | } 165 | 166 | .ma-chevron-up:before { 167 | @include apex5-font(); 168 | content: "\e012"; 169 | } 170 | } 171 | 172 | // Validation 173 | span.ma-error-message { 174 | color: $error-color; 175 | font-size: 0.8rem; 176 | position: absolute; 177 | top: 0; 178 | } 179 | 180 | .ma-field-container { 181 | span.ma-error-message { 182 | top: 3.5rem; 183 | left: 0; 184 | } 185 | 186 | &.ma-select-container span.ma-error-message { 187 | top: 5rem; 188 | } 189 | } 190 | 191 | // Icons 192 | .input-field .prefix { 193 | font-size: 1.5rem; 194 | top: 0.5rem; 195 | text-align: center; 196 | } 197 | 198 | .input-field .prefix~label { 199 | width: auto; 200 | } 201 | 202 | .input-field .prefix~.display_only { 203 | margin-left: 3rem; 204 | top: 0.5rem; 205 | display: block; 206 | position: relative; 207 | } 208 | 209 | // No Label 210 | .item-no-label { 211 | 212 | // hides regular input labels 213 | &>label { 214 | @include hide; 215 | } 216 | } 217 | 218 | // Switches 219 | .switch label { 220 | position: relative; 221 | } 222 | 223 | .ma-switch-container { 224 | margin-top: 1.5rem; 225 | 226 | &>label { 227 | transform: translateY(-22px); 228 | transform-origin: 0 0; 229 | position: absolute; 230 | } 231 | } 232 | 233 | // Ranges 234 | .input-field .range-field+label { 235 | transform: translateY(-14px) scale(0.8); 236 | transform-origin: 0 0; 237 | } 238 | 239 | input[type=range] { 240 | border: none; 241 | } 242 | 243 | // Text Alignment 244 | .ma-field-container { 245 | position: relative; 246 | 247 | &.center-align, 248 | &.left-align, 249 | &.right-align { 250 | 251 | input:not(.select-dropdown), 252 | textarea { 253 | text-align: inherit; 254 | } 255 | } 256 | } 257 | 258 | // Labels 259 | .label-block { 260 | display: block; 261 | } 262 | 263 | // Shuttle 264 | .shuttle { 265 | width: 100%; 266 | } 267 | 268 | .shuttle table.shuttle { 269 | width: 100%; 270 | border-collapse: collapse; 271 | } 272 | 273 | .shuttle td { 274 | vertical-align: top; 275 | } 276 | 277 | .shuttle .shuttleControl, 278 | .shuttle .shuttleSort2 { 279 | width: 1%; 280 | } 281 | 282 | .shuttle .shuttleSelect1, 283 | .shuttle .shuttleSelect2 { 284 | width: 49%; 285 | } 286 | 287 | .shuttle select.shuttle_left, 288 | .shuttle select.shuttle_right { 289 | width: 100%; 290 | min-height: 14.0rem; 291 | margin: 0.4rem 0; 292 | display: block; 293 | } 294 | 295 | // Quick picks in dropdowns 296 | .apex-quick-picks { 297 | transform: translateY(-14px); 298 | } 299 | 300 | // Browser defaults 301 | .apex-item-text.browser-default { 302 | @include browserDefaultInput(); 303 | } 304 | 305 | .apex-item-select.browser-default { 306 | @include browserDefaultInput(); 307 | @include browserDefaultSelect(); 308 | } 309 | -------------------------------------------------------------------------------- /src/scss/_apex_global.scss: -------------------------------------------------------------------------------- 1 | html { 2 | // !important is required to overwrite what APEX already does 3 | // Will be set to visible when the page has finished loading 4 | // using JavaScript 5 | visibility: hidden!important; 6 | } 7 | 8 | body { 9 | background: $background-color; 10 | } 11 | 12 | form p { 13 | text-align: inherit; 14 | } 15 | 16 | ul { 17 | margin: 0; 18 | 19 | &.table-of-contents { 20 | margin-top: 0; 21 | padding-top: 48px; 22 | } 23 | } 24 | 25 | // APEX hidden components 26 | input.u-vh { 27 | @include vh(); 28 | } 29 | 30 | // Main Container Handler 31 | .main-container .ma-main-container { 32 | @extend .container; 33 | margin-top: 1rem; 34 | } 35 | 36 | // Fix for menu icons 37 | i { 38 | &.left-l { 39 | float: left; 40 | margin-right: 0; 41 | 42 | @media #{$large-and-up} { 43 | margin-right: 15px; 44 | } 45 | } 46 | 47 | &.right-l { 48 | float: right; 49 | margin-left: 0; 50 | 51 | @media #{$large-and-up} { 52 | margin-left: 15px; 53 | } 54 | } 55 | } 56 | 57 | // Hamburger Menu 58 | #app-sidenav-trigger { 59 | display: block!important; 60 | 61 | &.hide { 62 | display: none!important; 63 | } 64 | } 65 | 66 | // Materialbox 67 | .materialbox-caption { 68 | top:0; 69 | } 70 | 71 | // Sticky Footer 72 | body > form { 73 | display: flex; 74 | min-height: 100vh; 75 | flex-direction: column; 76 | 77 | main { 78 | flex: 1 0 auto; 79 | } 80 | } 81 | 82 | // fix for IE to put the footer on the bottom 83 | @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { 84 | body > form { 85 | height: 1px; 86 | } 87 | } 88 | 89 | // Alignments 90 | .ma-region-title-left .ma-region-title 91 | , .ma-region-body-left .ma-region-body 92 | , [align='left'] { 93 | text-align: left; 94 | } 95 | .ma-region-title-center .ma-region-title 96 | , .ma-region-body-center .ma-region-body 97 | , [align='center'] { 98 | text-align: center; 99 | } 100 | .ma-region-title-right .ma-region-title 101 | , .ma-region-body-right .ma-region-body 102 | , [align='right'] { 103 | text-align: right; 104 | } 105 | 106 | // Badges 107 | span.badge.new:after { 108 | content: ""; 109 | } 110 | 111 | // Parallax 112 | .parallax-container { 113 | height: initial; 114 | min-height: 400px; 115 | } 116 | 117 | // Blockquote 118 | blockquote { 119 | padding: 1rem; 120 | } 121 | 122 | // Error template 123 | .a-Error-details h2 124 | , h2.a-Notification-title 125 | , .a-Notification-details h2 { 126 | font-size: $h5-fontsize; 127 | margin-top: 0; 128 | } 129 | 130 | // Notifications 131 | body .ui-dialog.ui-widget .ui-dialog-content.ui-widget-content.a-Notification-details { 132 | padding: 1rem; 133 | } 134 | 135 | // Apply flex to regions 136 | .ma-region-standard, .ma-region-card .card-content, .ma-region-header, .ma-region-buttons { 137 | @include ma-flex(); 138 | } 139 | 140 | .ma-region-buttons { 141 | .ma-flex-left 142 | , .ma-flex-center 143 | , .ma-flex-right { 144 | white-space: nowrap; 145 | } 146 | 147 | &:not(.card-action) { 148 | .ma-flex-left 149 | , .ma-flex-center 150 | , .ma-flex-right { 151 | padding-top: 1rem; 152 | padding-bottom: 1rem; 153 | } 154 | } 155 | } 156 | 157 | // Breadcrumb 158 | .breadcrumb:before { 159 | @include font-apex-large; 160 | content: '\f054'; 161 | font-size: inherit; 162 | } 163 | -------------------------------------------------------------------------------- /src/scss/_apex_grid.scss: -------------------------------------------------------------------------------- 1 | .ma-region.container { 2 | @extend .container; 3 | margin-bottom: $input-margin-bottom; // this is to replace .row margin-bottom: $input-margin-bottom 4 | } 5 | 6 | .ma-region { 7 | margin-bottom: $input-margin-bottom; // this is to replace .row margin-bottom: $input-margin-bottom 8 | 9 | .ma-region--no-padding { 10 | .card-content { 11 | padding: 0; 12 | } 13 | } 14 | } 15 | 16 | .ma-container-90 { 17 | @include ma-container-90; 18 | } 19 | 20 | .ma-container-80 { 21 | @include ma-container-80; 22 | } 23 | 24 | .ma-container-70 { 25 | @include ma-container-70; 26 | } 27 | 28 | .row { 29 | margin-bottom: 0; 30 | 31 | .col { 32 | min-height: 0; 33 | } 34 | } 35 | 36 | // Debug styling 37 | .grid-debug-on .row:before { 38 | content: ''; 39 | left: 0; 40 | top: 0; 41 | width: 100%; 42 | height: 100%; 43 | position: absolute; 44 | display: block; 45 | pointer-events: none; 46 | } 47 | 48 | .grid-debug-on .ma-container { 49 | position: relative; 50 | } 51 | 52 | .grid-debug-on .col:not(.col-null) { 53 | position: relative; 54 | box-shadow: 1px 1px 0 0 rgba(255, 0, 255, 0.5) inset, 1px 1px 0 0 rgba(255, 0, 255, 0.5); 55 | } 56 | 57 | .grid-debug-on .row { 58 | position: relative; 59 | } 60 | 61 | .grid-debug-on .row:before { 62 | background-image: linear-gradient(to left, transparent 0%, transparent 50%, rgba(255, 0, 255, 0.1) 50%, rgba(255, 0, 255, 0.1) 100%); 63 | background-size: 16.6666667% 100%; 64 | background-position: 50%; 65 | } 66 | 67 | .grid-debug-on .col:hover { 68 | opacity: 1; 69 | background-color: rgba(255, 0, 255, 0.15); 70 | } 71 | -------------------------------------------------------------------------------- /src/scss/_apex_icons.scss: -------------------------------------------------------------------------------- 1 | i { 2 | &.sm-md { 3 | font-size: 3rem; 4 | } 5 | 6 | &.xlarge { 7 | font-size: 8rem; 8 | } 9 | 10 | &.promo { 11 | color: $primary-color; 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /src/scss/_apex_ig.scss: -------------------------------------------------------------------------------- 1 | .a-IG { 2 | @include ma-card; 3 | 4 | .a-IG-header { 5 | padding: 8px; 6 | z-index: 800!important; 7 | background-color: $card-bg-color; 8 | // toolbar group 9 | .a-Toolbar-group { 10 | margin-bottom: 0; 11 | 12 | &.force-show { 13 | @include showInlineBlock(); 14 | } 15 | 16 | &.force-hide { 17 | @include hide(); 18 | } 19 | 20 | .a-Button { 21 | @include btn-flat; 22 | height: $input-height; 23 | padding: 0 0.5rem; 24 | line-height: 16px; 25 | 26 | &[disabled] { 27 | background-color: transparent!important; 28 | } 29 | 30 | .icon-menu-drop-down { 31 | @include hide; 32 | } 33 | } 34 | 35 | .a-Toolbar-radioGroup { 36 | label.a-Button { 37 | &:before, &:after { 38 | @include hide; 39 | } 40 | 41 | &.is-active { 42 | color: $primary-color; 43 | } 44 | 45 | .a-Icon { 46 | height: $input-height; 47 | line-height: $input-height; 48 | } 49 | } 50 | } 51 | 52 | input.a-Toolbar-input { 53 | &.a-Toolbar-inputText { 54 | width: auto; 55 | 56 | &:focus { 57 | outline: none; 58 | } 59 | } 60 | } 61 | // select fix 62 | select.a-Toolbar-selectList { 63 | @include hide(); 64 | } 65 | 66 | .a-Toolbar-inputText, 67 | .select-wrapper input.select-dropdown { 68 | margin: 0 0 8px; 69 | } 70 | 71 | div.a-Toolbar-selectList { 72 | background-color: transparent; 73 | overflow: visible; 74 | height: inherit; 75 | padding-right: 0; 76 | background-image: none; 77 | border: none; 78 | } 79 | // buttons 80 | // [data-enter-action='search'] { 81 | // margin-left: 1rem; 82 | // } 83 | [data-action='search'] { 84 | @include hide(); 85 | } 86 | 87 | [data-action='edit'] { 88 | label { 89 | padding: 15px 12px 12px 36px !important; 90 | font-size: 12px; 91 | 92 | &:before { 93 | margin-top: 14px; 94 | margin-left: 8px; 95 | } 96 | } 97 | } 98 | } 99 | } 100 | 101 | .a-IG-body { 102 | .a-GV-w-hdr { 103 | .a-GV-header { 104 | text-align: center; // default value 105 | } 106 | } 107 | } 108 | 109 | // borders 110 | .a-GV-cell, 111 | .a-GV-controlBreakHeader, 112 | // .a-GV-header, 113 | .a-GV-headerGroup 114 | { 115 | border: none; 116 | border-bottom: 1px solid #EAEAEA; 117 | } 118 | // row hover 119 | .a-GV-bdy tbody tr.is-hover { 120 | background-color: #eeeeee; 121 | } 122 | 123 | .a-GV-columnItem { 124 | input:not([type]), 125 | input[type=date], 126 | input[type=datetime-local], 127 | input[type=datetime], 128 | input[type=email], 129 | input[type=number], 130 | input[type=password], 131 | input[type=search], 132 | input[type=tel], 133 | input[type=text], 134 | input[type=time], 135 | input[type=url], 136 | textarea.materialize-textarea { 137 | border-bottom: none; 138 | height: auto; 139 | width: auto; 140 | font-size: inherit; 141 | margin: 0; 142 | 143 | &:focus:not([readonly]) { 144 | border-bottom: none; 145 | box-shadow: none; 146 | } 147 | } 148 | 149 | .color_picker td { 150 | vertical-align: middle; 151 | 152 | input.color_picker { 153 | box-shadow: inset 3px 0 3px -1px $primary-color; 154 | background-color: inherit; 155 | } 156 | } 157 | } 158 | // selected row 159 | .a-GV-table tr.is-selected .a-GV-cell { 160 | background-color: #f5f5f5; 161 | } 162 | 163 | .a-GV-cell.is-error:not(.is-active), 164 | .a-GV-cell.is-error:not(.is-active):before { 165 | color: $error-color; 166 | } 167 | 168 | .a-GV-row.is-inserted .a-GV-cell { 169 | background-color: #e3f2fd; 170 | } 171 | 172 | .a-GV-cell .a-GV-columnItem input:not([type=radio]):not([type=checkbox]):focus, 173 | .a-GV-cell .a-GV-columnItem select[size='1']:focus, 174 | .a-GV-floatingItem.is-expanded, 175 | .a-GV-floatingItem:not(.is-expanded), 176 | .a-GV-pageButton:focus, 177 | .a-GV-table .a-GV-cell.is-focused, 178 | .a-GV-table .a-GV-controlBreakHeader.is-focused, 179 | .a-GV-table .a-GV-header.is-focused, 180 | .a-GV-table .a-GV-headerGroup.is-focused { 181 | border-color: transparent; 182 | box-shadow: 0 0 2px 1px $radio-empty-color inset; 183 | } 184 | 185 | .a-GV-table .a-GV-cell.a-GV-rowHeader.is-focused { 186 | box-shadow: none; 187 | } 188 | 189 | .a-Button.a-Button--calendar { 190 | float: right; 191 | 192 | &:focus { 193 | outline: none; 194 | background-color: transparent; 195 | } 196 | } 197 | 198 | .a-GV-rowSelector { 199 | height: 22px; 200 | border: none; 201 | padding: 0; 202 | box-shadow: none; 203 | background-color: transparent; 204 | } 205 | 206 | .a-GV-rowSelector:hover, 207 | .is-hover .a-GV-rowSelector { 208 | border: none; 209 | 210 | &:before { 211 | opacity: 0; 212 | } 213 | } 214 | 215 | .is-selected .a-GV-rowSelector:before { 216 | opacity: 0; 217 | } 218 | // checkboxes 219 | .a-GV-header [type="checkbox"].filled-in { 220 | & + label:empty { 221 | padding-left: 0; 222 | } 223 | 224 | &:not(:checked):disabled + label:before { 225 | border: 2px solid transparent; 226 | } 227 | 228 | &:disabled:not(:checked) + label:after { 229 | border-color: $radio-empty-color; 230 | background-color: transparent; 231 | } 232 | 233 | &:disabled:checked+label:after { 234 | background-color: $secondary-color; 235 | border-color: $secondary-color; 236 | } 237 | } 238 | 239 | .a-IG-controlsCheckboxLabel { 240 | border: none; 241 | box-shadow: none; 242 | 243 | &:active:before, 244 | &:before, 245 | &:hover:before { 246 | opacity: 1; 247 | } 248 | 249 | &:active { 250 | background-color: transparent; 251 | box-shadow: none!important; 252 | } 253 | } 254 | 255 | .a-GV-rowSelect + label { 256 | padding-left: 0; 257 | } 258 | } 259 | -------------------------------------------------------------------------------- /src/scss/_apex_ir.scss: -------------------------------------------------------------------------------- 1 | .a-IRR-container { 2 | @include ma-card; 3 | padding: 1rem; 4 | 5 | .a-IRR { 6 | border: none; 7 | background-color: transparent; 8 | 9 | // IR Toolbar 10 | .a-IRR-toolbar { 11 | background-color: transparent; 12 | border-bottom: none; 13 | padding: 0; 14 | padding-bottom: 1rem; 15 | 16 | // IR Buttons 17 | .a-IRR-button { 18 | @include btn-flat; 19 | 20 | i { 21 | font-size: 1.5rem; 22 | vertical-align: middle; 23 | } 24 | } 25 | 26 | .a-IRR-controlGroup { 27 | margin-bottom: 0; 28 | } 29 | 30 | .a-IRR-controlGroup--search { 31 | .a-IRR-searchFieldContainer { 32 | margin-top: 0; 33 | 34 | .a-IRR-search-field { 35 | margin-bottom: 0; 36 | margin-left: 0.5rem; 37 | width: calc(100% - 1rem); 38 | } 39 | } 40 | } 41 | 42 | .a-IRR-controlGroup--views { 43 | .a-IRR-savedReports { 44 | display: block; 45 | } 46 | } 47 | 48 | .a-IRR-controlGroup--options { 49 | float: right; 50 | } 51 | 52 | // IR Buttons 53 | .a-IRR-button { 54 | height: $input-height; 55 | padding: 0 0.5rem; 56 | line-height: 3rem; 57 | } 58 | 59 | // select list 60 | select.a-IRR-selectList { 61 | @include hide; 62 | } 63 | 64 | div.a-IRR-selectList { 65 | display: block; 66 | height: auto; 67 | padding: 0; 68 | border: none; 69 | background-image: none; 70 | overflow:visible; 71 | 72 | input { 73 | margin-bottom:0; 74 | } 75 | } 76 | } 77 | 78 | // IR Table 79 | .a-IRR-table { 80 | // IR th 81 | .a-IRR-header { 82 | border-left: none; 83 | background-color: #fff; 84 | font-size: 16px; 85 | text-align: center; // default value 86 | } 87 | 88 | td { 89 | padding: 8px 4px; 90 | border-left: none; 91 | position: relative; 92 | } 93 | 94 | .datepicker td { 95 | border-top: none; 96 | } 97 | } 98 | 99 | .a-IRR-paginationWrap { 100 | &.a-IRR-paginationWrap--bottom { 101 | padding: 12px 12px 0 12px; 102 | } 103 | 104 | // IR Buttons 105 | .a-IRR-button { 106 | @include btn-flat; 107 | @include small-btn; 108 | 109 | i { 110 | font-size: 2rem; 111 | } 112 | } 113 | } 114 | } 115 | } 116 | 117 | // Menu when sorting columns 118 | .a-IRR-sortWidget { 119 | .a-IRR-sortWidget-search>.a-IRR-sortWidget-searchField { 120 | width: calc(100% - 40px); 121 | } 122 | } 123 | 124 | // Modal inputs 125 | .a-IRR-dialogContent { 126 | padding: 1rem; 127 | } 128 | 129 | .a-IRR-dialogTable { 130 | td, th { 131 | padding: 5px; 132 | vertical-align: middle; 133 | } 134 | 135 | select { 136 | @include browserDefaultInput(); 137 | @include browserDefaultSelect(); 138 | } 139 | 140 | .ajax_shuttle select { 141 | height: auto; 142 | } 143 | 144 | input { 145 | width: auto; 146 | margin: 0; 147 | } 148 | 149 | .a-Button--menu { 150 | @include btn-flat; 151 | @include small-btn; 152 | } 153 | 154 | .a-IRR-format-mask-picker { 155 | margin-left: -20px; 156 | } 157 | } 158 | -------------------------------------------------------------------------------- /src/scss/_apex_materialbox.scss: -------------------------------------------------------------------------------- 1 | .materialbox-caption { 2 | line-height: 30px; 3 | padding: 5% 15%; 4 | } 5 | 6 | .big-label { 7 | font-size: 1.5rem; 8 | } 9 | -------------------------------------------------------------------------------- /src/scss/_apex_media.scss: -------------------------------------------------------------------------------- 1 | .ma-region { 2 | video { 3 | max-width: 100%; 4 | height: auto; 5 | } 6 | } 7 | -------------------------------------------------------------------------------- /src/scss/_apex_mixins.scss: -------------------------------------------------------------------------------- 1 | @mixin hide() { 2 | display:none!important; 3 | visibility: hidden!important; 4 | } 5 | 6 | @mixin showBlock() { 7 | display:block!important; 8 | visibility:visible!important; 9 | } 10 | 11 | @mixin showFlex() { 12 | display:flex!important; 13 | visibility:visible!important; 14 | } 15 | 16 | @mixin showInlineBlock() { 17 | display:inline-block!important; 18 | visibility:visible!important; 19 | } 20 | 21 | @mixin browserDefaultInput() { 22 | background-color: transparent; 23 | border: none; 24 | border-bottom: none; 25 | border-radius: 0; 26 | outline: none; 27 | height: auto; 28 | width: auto; 29 | font-size: inherit; 30 | margin: 0; 31 | padding: 0; 32 | box-shadow: none; 33 | box-sizing: content-box; 34 | transition: none; 35 | } 36 | 37 | @mixin browserDefaultSelect() { 38 | display: block; 39 | width: 100%; 40 | height: $input-height; 41 | border: none; 42 | border-bottom: $input-border; 43 | } 44 | 45 | @mixin vh { 46 | border: 0!important; 47 | clip: rect(0 0 0 0)!important; 48 | height: 1px!important; 49 | margin: -1px!important; 50 | overflow: hidden!important; 51 | padding: 0!important; 52 | position: absolute!important; 53 | width: 1px!important; 54 | } 55 | 56 | @mixin ma-container-90 { 57 | margin: 0 auto; 58 | max-width: 1280px; 59 | width: 90%; 60 | 61 | @media #{$medium-and-up} { 62 | width: 90%; 63 | } 64 | 65 | @media #{$large-and-up} { 66 | width: 90%; 67 | } 68 | } 69 | 70 | @mixin ma-container-80 { 71 | margin: 0 auto; 72 | max-width: 1280px; 73 | width: 90%; 74 | 75 | @media #{$medium-and-up} { 76 | width: 85%; 77 | } 78 | 79 | @media #{$large-and-up} { 80 | width: 80%; 81 | } 82 | } 83 | 84 | @mixin ma-container-70 { 85 | margin: 0 auto; 86 | max-width: 1280px; 87 | width: 90%; 88 | 89 | @media #{$medium-and-up} { 90 | width: 80%; 91 | } 92 | 93 | @media #{$large-and-up} { 94 | width: 70%; 95 | } 96 | } 97 | 98 | @mixin ma-s1 { 99 | width: percentage(1 / 12 * 1); 100 | } 101 | 102 | @mixin ma-s2 { 103 | width: percentage(1 / 12 * 2); 104 | } 105 | 106 | @mixin ma-s3 { 107 | width: percentage(1 / 12 * 3); 108 | } 109 | 110 | @mixin ma-s4 { 111 | width: percentage(1 / 12 * 4); 112 | } 113 | 114 | @mixin ma-s5 { 115 | width: percentage(1 / 12 * 5); 116 | } 117 | 118 | @mixin ma-s6 { 119 | width: percentage(1 / 12 * 6); 120 | } 121 | 122 | @mixin ma-s7 { 123 | width: percentage(1 / 12 * 7); 124 | } 125 | 126 | @mixin ma-s8 { 127 | width: percentage(1 / 12 * 8); 128 | } 129 | 130 | @mixin ma-s9 { 131 | width: percentage(1 / 12 * 9); 132 | } 133 | 134 | @mixin ma-s10 { 135 | width: percentage(1 / 12 * 10); 136 | } 137 | 138 | @mixin ma-s11 { 139 | width: percentage(1 / 12 * 11); 140 | } 141 | 142 | @mixin ma-s12 { 143 | width: percentage(1 / 12 * 12); 144 | } 145 | 146 | @mixin apex5-font { 147 | font-size: 16px; 148 | font-family: apex-5-icon-font!important; 149 | font-style: normal!important; 150 | font-weight: 400!important; 151 | font-variant: normal!important; 152 | text-transform: none!important; 153 | speak: none; 154 | line-height: 1; 155 | } 156 | 157 | @mixin font-apex-small { 158 | font-family: 'Font APEX Small' !important; 159 | } 160 | 161 | @mixin font-apex-large { 162 | font-family: 'Font APEX Large' !important; 163 | } 164 | 165 | @mixin small-btn { 166 | height: 24px; 167 | line-height: 18px; 168 | padding: 0 1rem; 169 | } 170 | 171 | @mixin btn { 172 | @extend .btn; 173 | } 174 | 175 | @mixin btn-flat { 176 | @extend .btn-flat; 177 | } 178 | 179 | @mixin ma-card { 180 | @extend .card; 181 | } 182 | 183 | @mixin z-depth-1 { 184 | @extend .z-depth-1; 185 | } 186 | 187 | @mixin z-depth-2 { 188 | @extend .z-depth-2; 189 | } 190 | 191 | @mixin z-depth-3 { 192 | @extend .z-depth-3; 193 | } 194 | 195 | @mixin z-depth-4 { 196 | @extend .z-depth-4; 197 | } 198 | 199 | @mixin z-depth-5 { 200 | @extend .z-depth-5; 201 | } 202 | 203 | // Flexbox regions 204 | @mixin ma-flex { 205 | display: flex; 206 | 207 | &.ma-flex-justify { 208 | justify-content: space-between; 209 | } 210 | 211 | & > .ma-flex-left, & > .ma-flex-right { 212 | align-self: center; 213 | 214 | &:empty { 215 | @include hide(); 216 | } 217 | } 218 | 219 | & > .ma-flex-left { 220 | text-align: left; 221 | margin-right: 1rem; 222 | } 223 | 224 | & > .ma-flex-right { 225 | text-align: right; 226 | margin-left: 1rem; 227 | } 228 | 229 | & > .ma-flex-center { 230 | text-align: center; 231 | } 232 | 233 | & > .ma-flex-content { 234 | width: 100%; 235 | flex-shrink: 99999; 236 | } 237 | } 238 | -------------------------------------------------------------------------------- /src/scss/_apex_modal.scss: -------------------------------------------------------------------------------- 1 | .modal, .t-Dialog-page { 2 | background-color: $modal-background-color; 3 | 4 | .fixed-action-btn { 5 | bottom: 23px; 6 | } 7 | 8 | &.bottom-sheet { 9 | top: auto; 10 | bottom: 0; 11 | left: 0; 12 | width: 100%; 13 | display: block; 14 | } 15 | 16 | .t-Dialog-body { 17 | padding: 1rem; 18 | } 19 | 20 | .t-Dialog-footer { 21 | padding: 0 1rem; 22 | 23 | // remove unnessessary margin on modal footers 24 | .ma-region { 25 | margin-bottom: 0; 26 | padding-top: 0; 27 | padding-bottom: 0; 28 | } 29 | } 30 | } 31 | 32 | // Strech modals 33 | // Okay that's a funny hack... 34 | // The UT modal mecanism is hardcoding it's strech modal to 95% 35 | .ui-dialog--apex[style*="height: 95%; width: 95%;"] { 36 | width: 100%!important; 37 | height: 100%!important; 38 | top: 0!important; 39 | left: 0!important; 40 | } 41 | 42 | .region.modal { 43 | &.bottom-sheet { 44 | top: auto; 45 | bottom: -100%; 46 | width: 100%; 47 | 48 | .modal-footer { 49 | display: none; 50 | } 51 | } 52 | } 53 | 54 | body { 55 | .ui-widget-overlay { 56 | z-index: 999; 57 | } 58 | 59 | .ui-dialog.ui-front { 60 | border-width: 0; 61 | border-radius: 2px; 62 | position: absolute; 63 | top: 0; 64 | left: 0; 65 | padding: 0; 66 | outline: 0; 67 | box-shadow: 0 16px 28px 0 rgba(0, 0, 0, 0.22), 0 25px 55px 0 rgba(0, 0, 0, 0.21); 68 | box-sizing: content-box; 69 | background-color: $modal-background-color; 70 | z-index: 1000; 71 | background-clip: padding-box; 72 | transform: translate(0); 73 | will-change: top, opacity; 74 | 75 | .ui-dialog-titlebar { 76 | background-color: $modal-header-background; 77 | background: none; 78 | 79 | .ui-dialog-title { 80 | @extend h4; 81 | color: $modal-header-text; 82 | margin-top: 0; 83 | margin-bottom: 0; 84 | } 85 | } 86 | 87 | .ui-dialog-titlebar-close { 88 | right: 16px; 89 | top: 16px; 90 | box-shadow: none; 91 | background: none; 92 | border:none; 93 | 94 | &:before { 95 | font-size: 2rem; 96 | } 97 | 98 | .ui-icon-closethick { 99 | // display: none; 100 | } 101 | } 102 | } 103 | } 104 | 105 | body .ui-dialog, body .ui-dialog .ui-widget-content { 106 | background: none; 107 | 108 | .ui-state-focus { 109 | box-shadow: none!important; 110 | } 111 | } 112 | 113 | body .ui-dialog .ui-dialog-content, .t-Dialog-page { 114 | background-color: $modal-background-color; 115 | } 116 | -------------------------------------------------------------------------------- /src/scss/_apex_nav.scss: -------------------------------------------------------------------------------- 1 | // Search nav 2 | .nav-wrapper, 3 | .nav-wrapper form, 4 | .nav-wrapper form .input-field { 5 | height: 100%; 6 | } 7 | 8 | nav .search-nav-wrapper .input-field { 9 | height: $navbar-height-mobile; 10 | } 11 | 12 | @media #{$medium-and-up} { 13 | nav .search-nav-wrapper .input-field { 14 | height: $navbar-height; 15 | } 16 | } 17 | 18 | nav .search-nav-wrapper .input-field label.active { 19 | transform: translateY(0); 20 | left: 1rem; 21 | } 22 | 23 | // Search nav 24 | .page-navbar-fixed .top-nav-wrapper { 25 | @extend .navbar-fixed; 26 | } 27 | 28 | nav { 29 | background-color: $navbar-bg-color; 30 | color: $navbar-font-color; 31 | } 32 | 33 | nav ul a { 34 | display: inline-block; 35 | } 36 | 37 | nav .nav-wrapper { 38 | li, i { 39 | height: $navbar-height-mobile; 40 | line-height: $navbar-height-mobile; 41 | } 42 | 43 | i { 44 | font-size: ($navbar-font-size * 1.25) !important; 45 | } 46 | } 47 | 48 | @media #{$medium-and-up} { 49 | nav .nav-wrapper { 50 | li, i { 51 | height: $navbar-height; 52 | line-height: $navbar-height; 53 | } 54 | 55 | i { 56 | font-size: ($navbar-font-size * 1.75) !important; 57 | } 58 | } 59 | } 60 | 61 | nav .nav-wrapper { 62 | .btn i { 63 | height: $button-height; 64 | line-height: $button-height; 65 | font-size: $button-icon-font-size !important; 66 | } 67 | } 68 | 69 | .drag-target { 70 | top: $navbar-height-mobile; 71 | } 72 | 73 | @media #{$medium-and-up} { 74 | .drag-target { 75 | top: $navbar-height; 76 | } 77 | } 78 | 79 | .page-left-logo nav .brand-logo { 80 | left: auto; 81 | transform: none; 82 | } 83 | 84 | .page-center-logo nav .brand-logo { 85 | @extend .center; 86 | } 87 | 88 | @media #{$small-and-down} { 89 | .page-center-logo nav .brand-logo { 90 | left: auto; 91 | transform: none; 92 | } 93 | } 94 | 95 | .navbar-list .dropdown-content { 96 | 97 | li, 98 | a, 99 | i, 100 | span { 101 | height: $navbar-height-mobile; 102 | line-height: $navbar-height-mobile; 103 | padding-top: 0; 104 | padding-bottom: 0; 105 | } 106 | } 107 | 108 | @media #{$medium-and-up} { 109 | .navbar-list .dropdown-content { 110 | 111 | li, 112 | a, 113 | i, 114 | span { 115 | height: $navbar-height; 116 | line-height: $navbar-height; 117 | } 118 | } 119 | } 120 | 121 | // Scrollspy 122 | .apex-rds { 123 | @extend .table-of-contents; 124 | } 125 | 126 | .apex-rds-slider { 127 | @include hide; 128 | } 129 | 130 | // Region Display Selector 131 | .apex-rds-selected a { 132 | font-weight: 500; 133 | padding-left: 18px; 134 | border-left: 2px solid $secondary-color; 135 | } 136 | 137 | // Button 138 | nav .button-collapse { 139 | margin: 0; 140 | } 141 | 142 | // Transparent navbar 143 | .ma-page-navbar--transparent { 144 | header { 145 | position: absolute; 146 | 147 | nav:not(.ma-no-transparency) { 148 | background-color: transparent; 149 | box-shadow: none; 150 | transition: all 0.5s linear; 151 | 152 | a { 153 | color: $navbar-font-color-transparent; 154 | } 155 | 156 | .btn { 157 | color: $button-raised-color; 158 | } 159 | } 160 | 161 | nav.ma-no-transparency { 162 | background-color: $navbar-bg-color; 163 | @extend .z-depth-1; 164 | 165 | a { 166 | color: $navbar-font-color; 167 | } 168 | 169 | .btn { 170 | color: $button-raised-color; 171 | } 172 | } 173 | 174 | nav.ma-no-transparency.scroll { 175 | transition: all 0.5s linear; 176 | } 177 | } 178 | } 179 | 180 | // Dropdown content 181 | header .dropdown-content { 182 | li { 183 | &>a, 184 | &>span { 185 | color: $dropdown-color; 186 | } 187 | } 188 | } 189 | 190 | // Tabs 191 | header .nav-content { 192 | .tabs.tabs-transparent .tab a { 193 | color: $navbar-font-color; 194 | } 195 | 196 | .tabs.tabs-transparent .tab a:hover 197 | , .tabs.tabs-transparent .tab a.active { 198 | color: $navbar-font-color; 199 | border-bottom: 2px solid $navbar-font-color; 200 | } 201 | 202 | .indicator { 203 | @include hide; 204 | } 205 | } 206 | 207 | // Logo 208 | nav .brand-logo { 209 | font-weight: lighter; 210 | } 211 | -------------------------------------------------------------------------------- /src/scss/_apex_pagination.scss: -------------------------------------------------------------------------------- 1 | @mixin pagination-block { 2 | font-size: 1.2rem; 3 | float: left; 4 | width: 30px; 5 | height: 30px; 6 | margin: 0 5px; 7 | border-radius: 2px; 8 | text-align: center; 9 | line-height: 1.8rem; 10 | } 11 | 12 | .report-pagination [role="presentation"]{ 13 | display: block; 14 | } 15 | 16 | td.pagination { 17 | padding: 0; 18 | white-space: nowrap; 19 | } 20 | 21 | .pagination { 22 | 23 | // .instructiontext { 24 | b { 25 | @include pagination-block; 26 | 27 | color: #fff; 28 | 29 | background-color: $primary-color; 30 | } 31 | 32 | a { 33 | @include pagination-block; 34 | 35 | color: #444; 36 | } 37 | // } 38 | 39 | i { 40 | font-size: 2rem; 41 | line-height: 1.8rem; 42 | } 43 | } 44 | 45 | @media #{$medium-and-down} { 46 | .pagination { 47 | width: inherit; 48 | } 49 | } 50 | -------------------------------------------------------------------------------- /src/scss/_apex_preloader.scss: -------------------------------------------------------------------------------- 1 | .u-Processing { 2 | padding: 0; 3 | background-color: transparent; 4 | z-index: 995; 5 | } 6 | 7 | .u-Processing-spinner { 8 | @include hide(); 9 | } 10 | -------------------------------------------------------------------------------- /src/scss/_apex_promo.scss: -------------------------------------------------------------------------------- 1 | .promo { 2 | width: 100%; 3 | 4 | i { 5 | color: $primary-color; 6 | font-size: 7rem; 7 | display: block; 8 | } 9 | 10 | .promo-caption { 11 | font-size: 1.7rem; 12 | font-weight: 300; 13 | margin-top: 5px; 14 | margin-bottom: 0; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/scss/_apex_responsive_text.scss: -------------------------------------------------------------------------------- 1 | // custom responsive text (inspired by flow-text) 2 | .ma-responsive-text{ 3 | $i: 0; 4 | 5 | @while $i <= $intervals { 6 | @media only screen and (min-width : 360 + ($i * $interval-size)) { 7 | font-size: 1.2rem * (1 + (.03 * $i)) !important; 8 | } 9 | $i: $i + 1; 10 | } 11 | 12 | // Handle below 360px screen 13 | @media only screen and (max-width: 360px) { 14 | font-size: 1.2rem !important; 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /src/scss/_apex_sidenav.scss: -------------------------------------------------------------------------------- 1 | $sidenav-height: 44px; 2 | 3 | #sidenav-overlay { 4 | z-index: 999; 5 | } 6 | 7 | .drag-target { 8 | z-index: 1000; 9 | } 10 | 11 | .sidenav { 12 | z-index: 1000; 13 | height: 100%; 14 | width: $sidenav-width; 15 | 16 | // Right Align 17 | &.right-aligned { 18 | right: initial; 19 | left: initial; 20 | } 21 | 22 | li>a { 23 | padding: 0 16px; 24 | } 25 | 26 | .collapsible { 27 | .collapsible-body { 28 | background-color: $sidenav-bg-color; 29 | padding: 0; 30 | } 31 | } 32 | } 33 | 34 | /* 35 | Sidebar Fixed 36 | */ 37 | .ma-sidenav-fixed { 38 | .sidenav { 39 | @extend .sidenav-fixed; 40 | } 41 | 42 | @media #{$large-and-up} { 43 | #app-sidenav-trigger { 44 | display: none !important; 45 | } 46 | 47 | .top-nav-wrapper { 48 | z-index: 1001; 49 | } 50 | 51 | .sidenav { 52 | transform: translateX(0) !important; 53 | z-index: 1001; 54 | } 55 | 56 | main, 57 | footer, 58 | .main-nav-wrapper, 59 | .search-nav-wrapper, 60 | .nav-breadcrumbs, 61 | .nav-content 62 | { 63 | padding-left: $sidenav-width; 64 | } 65 | 66 | .container, 67 | &.main-container .ma-main-container { 68 | width: 85%; 69 | } 70 | } 71 | 72 | @media #{$medium-and-down} { 73 | #app-sidenav-trigger { 74 | display: block !important; 75 | } 76 | 77 | main, 78 | footer { 79 | padding-left: 0; 80 | } 81 | } 82 | } 83 | 84 | /* SideNav Header */ 85 | .user-view { 86 | @include hide(); 87 | 88 | a, 89 | span { 90 | color: $sidenav-header-text-color; 91 | } 92 | 93 | a { 94 | padding: 0; 95 | line-height: 24px; 96 | height: auto; 97 | } 98 | } 99 | 100 | .sidenav .user-view { 101 | @include showBlock(); 102 | } 103 | -------------------------------------------------------------------------------- /src/scss/_apex_spacers.scss: -------------------------------------------------------------------------------- 1 | // Spacing 2 | // 3 | // Control the default styling of most Bootstrap elements by modifying these 4 | // variables. Mostly focused on spacing. 5 | 6 | $spacer: 1rem !default; 7 | $spacer-x: $spacer !default; 8 | $spacer-y: $spacer !default; 9 | $spacers: ( 10 | 0: ( 11 | x: 0, 12 | y: 0 13 | ), 14 | 1: ( 15 | x: ($spacer-x * 1), 16 | y: ($spacer-y * 1) 17 | ), 18 | 2: ( 19 | x: ($spacer-x * 2), 20 | y: ($spacer-y * 2) 21 | ), 22 | 3: ( 23 | x: ($spacer-x * 4), 24 | y: ($spacer-y * 4) 25 | ), 26 | 4: ( 27 | x: ($spacer-x * 7), 28 | y: ($spacer-y * 7) 29 | ), 30 | 5: ( 31 | x: ($spacer-x * 10), 32 | y: ($spacer-y * 10) 33 | ), 34 | 1-neg: ( 35 | x: ($spacer-x * -1), 36 | y: ($spacer-y * -1) 37 | ), 38 | 2-neg: ( 39 | x: ($spacer-x * -2), 40 | y: ($spacer-y * -2) 41 | ), 42 | 3-neg: ( 43 | x: ($spacer-x * -4), 44 | y: ($spacer-y * -4) 45 | ), 46 | 4-neg: ( 47 | x: ($spacer-x * -7), 48 | y: ($spacer-y * -7) 49 | ), 50 | 5-neg: ( 51 | x: ($spacer-x * -10), 52 | y: ($spacer-y * -10) 53 | ) 54 | ) !default; 55 | $border-width: 1px !default; 56 | 57 | // Margin and Padding 58 | 59 | .m-x-auto { 60 | margin-right: auto !important; 61 | margin-left: auto !important; 62 | } 63 | 64 | @each $prop, $abbrev in (margin: m, padding: p) { 65 | @each $size, $lengths in $spacers { 66 | $length-x: map-get($lengths, x); 67 | $length-y: map-get($lengths, y); 68 | 69 | .#{$abbrev}-a-#{$size} { #{$prop}: $length-y $length-x !important; } // a = All sides 70 | .#{$abbrev}-t-#{$size} { #{$prop}-top: $length-y !important; } 71 | .#{$abbrev}-r-#{$size} { #{$prop}-right: $length-x !important; } 72 | .#{$abbrev}-b-#{$size} { #{$prop}-bottom: $length-y !important; } 73 | .#{$abbrev}-l-#{$size} { #{$prop}-left: $length-x !important; } 74 | 75 | // Axes 76 | .#{$abbrev}-x-#{$size} { 77 | #{$prop}-right: $length-x !important; 78 | #{$prop}-left: $length-x !important; 79 | } 80 | .#{$abbrev}-y-#{$size} { 81 | #{$prop}-top: $length-y !important; 82 | #{$prop}-bottom: $length-y !important; 83 | } 84 | } 85 | } 86 | -------------------------------------------------------------------------------- /src/scss/_apex_table.scss: -------------------------------------------------------------------------------- 1 | @media #{$small-and-down} { 2 | table.table-responsive thead { 3 | display: none; 4 | } 5 | 6 | table.table-responsive tr { 7 | padding: 5px; 8 | display: block; 9 | margin: .5rem 0 1rem; 10 | background-color: #fff; 11 | border-radius: 2px; 12 | box-shadow: 0 2px 5px 0 rgba(0,0,0,.16),0 2px 10px 0 rgba(0,0,0,.12); 13 | } 14 | 15 | table.table-responsive td { 16 | display: block; 17 | text-align: right; 18 | border-bottom: 1px solid #eee; 19 | } 20 | 21 | table.table-responsive td:last-child { 22 | border-bottom: 0; 23 | } 24 | 25 | table.table-responsive td:before { 26 | content: attr(data-label); 27 | float: left; 28 | font-weight: bold; 29 | } 30 | } 31 | 32 | table { 33 | thead th { 34 | font-size: 15px; 35 | } 36 | 37 | td { 38 | input:not([type]), input[type=text], input[type=password], input[type=email], input[type=url], input[type=time], input[type=date], input[type=datetime], input[type=datetime-local], input[type=tel], input[type=number], input[type=search], textarea.materialize-textarea, .select-wrapper input.select-dropdown { 39 | &:not(.browser-default) { 40 | margin-bottom: 0; 41 | } 42 | } 43 | } 44 | 45 | tbody tr:last-child { 46 | border-bottom: 0; 47 | } 48 | 49 | &.ma-table-small { 50 | td, th { 51 | padding: 5px; 52 | } 53 | } 54 | } 55 | 56 | // standard reports 57 | .u-Report--dataLoad { 58 | td, th { 59 | overflow: visible; 60 | min-width: 125px; 61 | max-width: none; 62 | } 63 | } 64 | 65 | .u-Report tr:nth-child(even) { 66 | td, th[scope=row] { 67 | background-color: #fff; 68 | } 69 | } 70 | 71 | .u-Report--standardLook { 72 | td, th { 73 | padding: 8px; 74 | } 75 | } 76 | 77 | .u-Report--dataLoad, .u-Report--standardLook { 78 | line-height: inherit; 79 | font-size: inherit; 80 | } 81 | 82 | // calendar fix 83 | .fc thead { 84 | border-bottom: none; 85 | } 86 | -------------------------------------------------------------------------------- /src/scss/_apex_tabs.scss: -------------------------------------------------------------------------------- 1 | @mixin tabs-fixed-bottom { 2 | position: fixed; 3 | bottom: 0; 4 | left: 0; 5 | right: 0; 6 | z-index: 400; 7 | display: flex; 8 | box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 9 | 0 3px 1px -2px rgba(0,0,0,0.12), 10 | 0 1px 5px 0 rgba(0,0,0,0.2); 11 | } 12 | 13 | .ma-tabs-position-bottom .tabs, .tabs.ma-tabs-position-bottom { 14 | @include tabs-fixed-bottom; 15 | } 16 | 17 | @media #{$small-and-down} { 18 | .ma-tabs-position-bottom-mobile .tabs, .tabs.ma-tabs-position-bottom-mobile { 19 | @include tabs-fixed-bottom; 20 | } 21 | } 22 | 23 | .tabs .tab a { 24 | .fa, span { 25 | display: block; 26 | } 27 | 28 | &.active { 29 | .fa, span { 30 | font-weight: 600; 31 | } 32 | } 33 | 34 | .fa { 35 | margin: 5px auto; 36 | 37 | & + span { 38 | line-height: 16px; 39 | } 40 | 41 | &:only-child { 42 | font-size: 20px; 43 | margin: 1rem auto; 44 | } 45 | } 46 | } 47 | 48 | // Fix for Regions under Tabs 49 | ul.tabs ~ div.row, .hide-tab-scrollbar ~ div.row { 50 | margin-bottom: 0; 51 | 52 | .ma-region { 53 | padding-top:0; 54 | } 55 | } 56 | 57 | @media #{$medium-and-up} { 58 | .tabs .ma-region.white .a-IRR-container { 59 | box-shadow: none; 60 | } 61 | 62 | .tabs .t-fht-thead { 63 | width:inherit!important; 64 | } 65 | } 66 | 67 | @media #{$small-and-down} { 68 | .ma-region.white { 69 | .a-IRR-container { 70 | padding: 20px; 71 | } 72 | 73 | table.table-responsive tr { 74 | box-shadow: none; 75 | } 76 | } 77 | } 78 | 79 | .tabs .tab a { 80 | color: $tabs-text-color; 81 | } 82 | -------------------------------------------------------------------------------- /src/scss/_apex_themeroller.scss: -------------------------------------------------------------------------------- 1 | body .ui-dialog.ui-widget.utr { 2 | z-index: 1002!important; 3 | 4 | .utr-container__body { 5 | max-height: 70vh!important; 6 | } 7 | 8 | .utr-custom-css__header-buttons, 9 | .utr-group__header-buttons { 10 | display: inline; 11 | } 12 | 13 | .ui-accordion-header .ui-accordion-header-icon { 14 | position: absolute; 15 | left: .5em; 16 | top: 50%; 17 | margin-top: -8px; 18 | } 19 | 20 | .ui-accordion-icons { 21 | padding-left: 2.2em; 22 | } 23 | 24 | // select 25 | &.a-LiveTemplateOptions { 26 | .a-Property-field--select { 27 | width: 95%; 28 | padding-right: 0; 29 | } 30 | } 31 | 32 | // checkbox and radio 33 | .a-Property-checkbox-input[type="checkbox"], .a-Property-radio-input[type="radio"] { 34 | & + label { 35 | padding-left: 35px; 36 | 37 | &:before { 38 | background-color: transparent; 39 | border: none; 40 | } 41 | &:after { 42 | opacity: 1; 43 | } 44 | } 45 | 46 | // &:checked + label { 47 | // &:before { 48 | // 49 | // } 50 | // &:after { 51 | // 52 | // } 53 | // } 54 | 55 | &:focus:checked + label { 56 | &:before { 57 | border-color: transparent; 58 | background-color: transparent; 59 | } 60 | // &:after { 61 | // 62 | // } 63 | } 64 | 65 | &:hover, &:focus { 66 | & + label:before { 67 | border-color: transparent; 68 | box-shadow: none; 69 | } 70 | 71 | & + label:after { 72 | transform: inherit; 73 | } 74 | } 75 | } 76 | 77 | // Footer 78 | .ui-dialog-buttonpane { 79 | margin-top: 0; 80 | padding: 0; 81 | 82 | .ui-dialog-buttonset { 83 | .ui-button { 84 | @extend .btn-flat; 85 | background: none; 86 | } 87 | 88 | .ui-button.ui-button--hot { 89 | @extend .btn; 90 | } 91 | } 92 | } 93 | 94 | .utr-toolbar-search { 95 | border-bottom: none; 96 | height: 30px; 97 | width: 30px; 98 | padding: 0; 99 | 100 | &:hover { 101 | width: 100px; 102 | } 103 | } 104 | 105 | button:focus { 106 | background-color:transparent; 107 | } 108 | 109 | .utr-container__field--select__container select { 110 | display:block; 111 | height:auto; 112 | padding: 0; 113 | } 114 | 115 | .a-D3ColorPicker-control { 116 | width: 4rem; 117 | height: auto; 118 | margin: 1px; 119 | } 120 | 121 | .ui-dialog-titlebar { 122 | .ui-dialog-titlebar__minimize { 123 | right: 30px!important; 124 | top: 6px!important; 125 | } 126 | 127 | .ui-dialog-titlebar-close { 128 | right: 10px!important; 129 | top: 10px!important; 130 | 131 | .ui-icon-closethick { 132 | display: block; 133 | } 134 | } 135 | } 136 | 137 | label[for='utr_theme_name'] { 138 | @include hide; 139 | } 140 | 141 | .icon-tr-close { 142 | @include hide; 143 | } 144 | } 145 | -------------------------------------------------------------------------------- /src/scss/_apex_timeline.scss: -------------------------------------------------------------------------------- 1 | /* https://codyhouse.co/gem/vertical-timeline/ */ 2 | .cd-container { 3 | width: 90%; 4 | max-width: 1170px; 5 | margin: 0 auto; 6 | } 7 | .cd-container::after { 8 | /* clearfix */ 9 | content: ''; 10 | display: table; 11 | clear: both; 12 | } 13 | 14 | .cd-timeline h1 { 15 | color: white; 16 | font-size: 18px; 17 | font-size: 1.125rem; 18 | } 19 | @media only screen and (min-width: 1170px) { 20 | .cd-timeline h1 { 21 | font-size: 24px; 22 | font-size: 1.5rem; 23 | } 24 | } 25 | 26 | .cd-timeline { 27 | position: relative; 28 | padding: 2em 0; 29 | margin-top: 2em; 30 | margin-bottom: 2em; 31 | } 32 | .cd-timeline::before { 33 | /* this is the vertical line */ 34 | content: ''; 35 | position: absolute; 36 | top: 0; 37 | left: 18px; 38 | height: 100%; 39 | width: 4px; 40 | background: #d7e4ed; 41 | } 42 | @media only screen and (min-width: 1170px) { 43 | .cd-timeline { 44 | margin-top: 3em; 45 | margin-bottom: 3em; 46 | } 47 | .cd-timeline::before { 48 | left: 50%; 49 | margin-left: -2px; 50 | } 51 | } 52 | 53 | .cd-timeline-block { 54 | position: relative; 55 | margin: 2em 0; 56 | } 57 | .cd-timeline-block:after { 58 | content: ""; 59 | display: table; 60 | clear: both; 61 | } 62 | .cd-timeline-block:first-child { 63 | margin-top: 0; 64 | } 65 | .cd-timeline-block:last-child { 66 | margin-bottom: 0; 67 | } 68 | @media only screen and (min-width: 1170px) { 69 | .cd-timeline-block { 70 | margin: 4em 0; 71 | } 72 | .cd-timeline-block:first-child { 73 | margin-top: 0; 74 | } 75 | .cd-timeline-block:last-child { 76 | margin-bottom: 0; 77 | } 78 | } 79 | 80 | .cd-timeline-img { 81 | position: absolute; 82 | top: 0; 83 | left: 0; 84 | width: 40px; 85 | height: 40px; 86 | border-radius: 50%; 87 | box-shadow: 0 0 0 4px white, inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05); 88 | } 89 | .cd-timeline-img i { 90 | display: block; 91 | width: 24px; 92 | height: 24px; 93 | position: relative; 94 | left: 50%; 95 | top: 50%; 96 | margin-left: -12px; 97 | margin-top: -12px; 98 | color:#fff; 99 | } 100 | .cd-timeline-img.cd-picture { 101 | background: #75ce66; 102 | } 103 | .cd-timeline-img.cd-movie { 104 | background: #c03b44; 105 | } 106 | .cd-timeline-img.cd-location { 107 | background: #f0ca45; 108 | } 109 | @media only screen and (min-width: 1170px) { 110 | .cd-timeline-img { 111 | width: 60px; 112 | height: 60px; 113 | left: 50%; 114 | margin-left: -30px; 115 | /* Force Hardware Acceleration in WebKit */ 116 | -webkit-transform: translateZ(0); 117 | -webkit-backface-visibility: hidden; 118 | } 119 | .cssanimations .cd-timeline-img.is-hidden { 120 | visibility: hidden; 121 | } 122 | .cssanimations .cd-timeline-img.bounce-in { 123 | visibility: visible; 124 | animation: cd-bounce-1 0.6s; 125 | } 126 | } 127 | 128 | @-webkit-keyframes cd-bounce-1 { 129 | 0% { 130 | opacity: 0; 131 | -webkit-transform: scale(0.5); 132 | } 133 | 134 | 60% { 135 | opacity: 1; 136 | -webkit-transform: scale(1.2); 137 | } 138 | 139 | 100% { 140 | -webkit-transform: scale(1); 141 | } 142 | } 143 | @-moz-keyframes cd-bounce-1 { 144 | 0% { 145 | opacity: 0; 146 | -moz-transform: scale(0.5); 147 | } 148 | 149 | 60% { 150 | opacity: 1; 151 | -moz-transform: scale(1.2); 152 | } 153 | 154 | 100% { 155 | -moz-transform: scale(1); 156 | } 157 | } 158 | @keyframes cd-bounce-1 { 159 | 0% { 160 | opacity: 0; 161 | transform: scale(0.5); 162 | } 163 | 164 | 60% { 165 | opacity: 1; 166 | transform: scale(1.2); 167 | } 168 | 169 | 100% { 170 | transform: scale(1); 171 | } 172 | } 173 | .cd-timeline-content { 174 | position: relative; 175 | margin-left: 60px; 176 | background: white; 177 | border-radius: 0.25em; 178 | padding: 1em; 179 | } 180 | .cd-timeline-content:after { 181 | content: ""; 182 | display: table; 183 | clear: both; 184 | } 185 | .cd-timeline-content h2 { 186 | color: #303e49; 187 | } 188 | .cd-timeline-content p, .cd-timeline-content .cd-date { 189 | font-size: 13px; 190 | font-size: 1rem; 191 | } 192 | .cd-timeline-content .cd-date { 193 | display: inline-block; 194 | } 195 | .cd-timeline-content p { 196 | margin: 1em 0; 197 | line-height: 1.6; 198 | } 199 | .cd-timeline-content .btn { 200 | float: right; 201 | } 202 | .cd-timeline-content .cd-date { 203 | float: left; 204 | padding: .8em 0; 205 | opacity: .7; 206 | } 207 | .cd-timeline-content::before { 208 | content: ''; 209 | position: absolute; 210 | top: 16px; 211 | right: 100%; 212 | height: 0; 213 | width: 0; 214 | border: 7px solid transparent; 215 | border-right: 7px solid white; 216 | } 217 | @media only screen and (min-width: 1170px) { 218 | .cd-timeline-content { 219 | margin-left: 0; 220 | padding: 1.6em; 221 | width: 45%; 222 | } 223 | .cd-timeline-content::before { 224 | top: 24px; 225 | left: 100%; 226 | border-color: transparent; 227 | border-left-color: white; 228 | } 229 | .cd-timeline-content .btn { 230 | float: left; 231 | } 232 | .cd-timeline-content .cd-date { 233 | position: absolute; 234 | width: 100%; 235 | left: 122%; 236 | top: 6px; 237 | font-size: 1rem; 238 | } 239 | .cd-timeline-block:nth-child(even) .cd-timeline-content { 240 | float: right; 241 | } 242 | .cd-timeline-block:nth-child(even) .cd-timeline-content::before { 243 | top: 24px; 244 | left: auto; 245 | right: 100%; 246 | border-color: transparent; 247 | border-right-color: white; 248 | } 249 | .cd-timeline-block:nth-child(even) .cd-timeline-content .btn { 250 | float: right; 251 | } 252 | .cd-timeline-block:nth-child(even) .cd-timeline-content .cd-date { 253 | left: auto; 254 | right: 122%; 255 | text-align: right; 256 | } 257 | .cssanimations .cd-timeline-content.is-hidden { 258 | visibility: hidden; 259 | } 260 | .cssanimations .cd-timeline-content.bounce-in { 261 | visibility: visible; 262 | animation: cd-bounce-2 0.6s; 263 | } 264 | } 265 | 266 | @media only screen and (min-width: 1170px) { 267 | /* inverse bounce effect on even content blocks */ 268 | .cssanimations .cd-timeline-block:nth-child(even) .cd-timeline-content.bounce-in { 269 | -webkit-animation: cd-bounce-2-inverse 0.6s; 270 | -moz-animation: cd-bounce-2-inverse 0.6s; 271 | animation: cd-bounce-2-inverse 0.6s; 272 | } 273 | } 274 | @-webkit-keyframes cd-bounce-2 { 275 | 0% { 276 | opacity: 0; 277 | -webkit-transform: translateX(-100px); 278 | } 279 | 280 | 60% { 281 | opacity: 1; 282 | -webkit-transform: translateX(20px); 283 | } 284 | 285 | 100% { 286 | -webkit-transform: translateX(0); 287 | } 288 | } 289 | @-moz-keyframes cd-bounce-2 { 290 | 0% { 291 | opacity: 0; 292 | -moz-transform: translateX(-100px); 293 | } 294 | 295 | 60% { 296 | opacity: 1; 297 | -moz-transform: translateX(20px); 298 | } 299 | 300 | 100% { 301 | -moz-transform: translateX(0); 302 | } 303 | } 304 | @keyframes cd-bounce-2 { 305 | 0% { 306 | opacity: 0; 307 | transform: translateX(-100px); 308 | } 309 | 310 | 60% { 311 | opacity: 1; 312 | transform: translateX(20px); 313 | } 314 | 315 | 100% { 316 | transform: translateX(0); 317 | } 318 | } 319 | @-webkit-keyframes cd-bounce-2-inverse { 320 | 0% { 321 | opacity: 0; 322 | -webkit-transform: translateX(100px); 323 | } 324 | 325 | 60% { 326 | opacity: 1; 327 | -webkit-transform: translateX(-20px); 328 | } 329 | 330 | 100% { 331 | -webkit-transform: translateX(0); 332 | } 333 | } 334 | @-moz-keyframes cd-bounce-2-inverse { 335 | 0% { 336 | opacity: 0; 337 | -moz-transform: translateX(100px); 338 | } 339 | 340 | 60% { 341 | opacity: 1; 342 | -moz-transform: translateX(-20px); 343 | } 344 | 345 | 100% { 346 | -moz-transform: translateX(0); 347 | } 348 | } 349 | @keyframes cd-bounce-2-inverse { 350 | 0% { 351 | opacity: 0; 352 | transform: translateX(100px); 353 | } 354 | 355 | 60% { 356 | opacity: 1; 357 | transform: translateX(-20px); 358 | } 359 | 360 | 100% { 361 | transform: translateX(0); 362 | } 363 | } 364 | -------------------------------------------------------------------------------- /src/scss/_apex_toasts.scss: -------------------------------------------------------------------------------- 1 | .ma-toast-close { 2 | cursor: pointer; 3 | } 4 | -------------------------------------------------------------------------------- /src/scss/_apex_toolbar.scss: -------------------------------------------------------------------------------- 1 | // menu container 2 | .a-Menu-content { 3 | border: none; 4 | @include z-depth-3; 5 | 6 | ul { 7 | background-color: $dropdown-bg-color; 8 | 9 | // menu separator 10 | .a-Menu-itemSep { 11 | min-height: 0; 12 | height: 1px; 13 | border-top: 1px solid #F0F0F0; 14 | 15 | .a-Menu-inner { 16 | @include hide(); 17 | } 18 | } 19 | 20 | li { 21 | min-height: 42px; 22 | 23 | & > span { 24 | line-height: 14px; 25 | height: 42px; 26 | } 27 | } 28 | 29 | // memu item 30 | .a-Menu-item { 31 | // hover and focused color states 32 | &.is-expanded, &.is-focused, &:hover { 33 | background-color: $dropdown-hover-bg-color; 34 | color: $dropdown-color; 35 | 36 | .a-Menu-inner .a-Menu-statusCol { 37 | color: $dropdown-color; 38 | } 39 | } 40 | 41 | // disabled state 42 | &.is-disabled 43 | , &.is-disabled .a-Menu-inner 44 | , &.is-disabled .a-Menu-label 45 | , &.is-disabled .a-Menu-statusCol { 46 | cursor: not-allowed!important; 47 | color: rgba(64,64,64,.5)!important; 48 | } 49 | &.is-disabled.is-focused { 50 | background-color: transparent; 51 | box-shadow: none; 52 | } 53 | 54 | // menu item inner container 55 | .a-Menu-inner { 56 | clear: both; 57 | color: $off-black; 58 | cursor: pointer; 59 | min-height: $dropdown-item-height; 60 | line-height: 1.5rem; 61 | width: 100%; 62 | text-align: left; 63 | text-transform: none; 64 | 65 | // menu label 66 | .a-Menu-labelContainer { 67 | font-size: 16px; 68 | color: $dropdown-color; 69 | display: block; 70 | line-height: 22px; 71 | padding: 6px 10px; 72 | 73 | .a-Menu-label { 74 | line-height: 32px; 75 | } 76 | } 77 | 78 | // right arrow 79 | .a-Menu-accelContainer { 80 | font-size: 16px; 81 | color: $dropdown-color; 82 | line-height: 22px; 83 | padding: 6px 10px; 84 | 85 | .a-Menu-subMenuCol { 86 | padding: 4px 4px 8px 0px; 87 | } 88 | } 89 | 90 | // Icon alignment override 91 | span .a-Icon { 92 | height: inherit; 93 | line-height: inherit; 94 | 95 | // override save icon 96 | &.icon-ig-save:before { 97 | content: "\f0c7"; 98 | font-family: font-apex!important; 99 | } 100 | 101 | // override save icon 102 | &.icon-ig-delete:before { 103 | content: "\f014"; 104 | font-family: font-apex!important; 105 | } 106 | } 107 | } 108 | } 109 | } 110 | } 111 | 112 | // remove outlines 113 | .a-Toolbar-group .a-Button:focus 114 | , input:not(.a-Toolbar-inputText):focus + .a-Toolbar-group .a-Button 115 | , .u-Form-fieldContainer.is-focused 116 | , .a-Toolbar-radioGroup input:focus + .a-Button 117 | , .a-Toolbar-toggleButton input:focus + .a-Button 118 | , .a-TreeView-row.is-focused { 119 | outline: none; 120 | } 121 | 122 | // toolbar modals 123 | body .ui-dialog.ui-widget { 124 | // region display selector 125 | .apex-rds { 126 | padding-top: 0; 127 | 128 | li { 129 | display: inline-block; 130 | } 131 | } 132 | 133 | select { 134 | font-size: 12px; 135 | } 136 | 137 | // toolbar buttons 138 | .a-Button:focus { 139 | outline: none; 140 | background-color: transparent; 141 | } 142 | 143 | .a-Button--withIcon { 144 | background-color: transparent; 145 | box-shadow: none; 146 | } 147 | 148 | // make select dropdown smaller 149 | .dropdown-content li { 150 | min-height: 42px; 151 | 152 | & > span { 153 | line-height: 14px; 154 | height: 42px; 155 | } 156 | } 157 | 158 | // Body 159 | .ui-dialog-content { 160 | // fix for weird overflow 161 | & 162 | , .a-IGDialog-region 163 | , .a-RV 164 | , .a-RV-w-scroll 165 | { 166 | width: 100%!important; 167 | position:relative!important; 168 | } 169 | 170 | // fix special height scenarios 171 | &[id*="flashback"] { 172 | min-height: 115px!important; 173 | } 174 | 175 | // left region 176 | .a-IGDialog-side { 177 | // little toolbar below table (sort buttons) 178 | .a-Toolbar { 179 | padding: 0; 180 | } 181 | 182 | // left grid 183 | .a-GV-table { 184 | table-layout: auto; 185 | width: auto!important; 186 | } 187 | 188 | .a-GV-header { 189 | border:none; 190 | 191 | &.is-readonly span { 192 | display:none; 193 | } 194 | } 195 | } 196 | 197 | // right 198 | .a-RV-body { 199 | padding: 0 16px; 200 | } 201 | 202 | textarea { 203 | width: auto; 204 | } 205 | } 206 | 207 | // fix for padding on help texts 208 | &.ui-dialog--notification, &.ui-dialog--notificationLarge { 209 | .ui-dialog-content { 210 | padding: 0; 211 | 212 | p { 213 | padding: 0 32px 36px; 214 | } 215 | } 216 | } 217 | 218 | // Footer 219 | .ui-dialog-buttonpane { 220 | .ui-dialog-buttonset { 221 | .ui-button { 222 | @include btn-flat; 223 | background: none; 224 | } 225 | 226 | .ui-button.ui-button--hot { 227 | @include btn; 228 | } 229 | } 230 | } 231 | 232 | // shuttle box background 233 | .a-GV-hdr { 234 | background-color: transparent; 235 | } 236 | 237 | // make checkboxes bigger 238 | .ro-checkbox::before { 239 | font-size: 16px; 240 | } 241 | 242 | .u-Form-inputContainer { 243 | overflow: visible; 244 | 245 | .a-GV-columnItem input/*, .a-GV-columnItem input.select-dropdown*/ { 246 | margin: 0; 247 | } 248 | } 249 | 250 | // color picker 251 | .color_picker .a-Combobox-wrapper { 252 | & > span { 253 | margin: 6px 4px!important; 254 | } 255 | 256 | & > input { 257 | @include hide(); 258 | } 259 | 260 | & > button { 261 | margin-left: 26px!important; 262 | } 263 | 264 | & > button[data-menu] { 265 | margin-left: 0!important; 266 | } 267 | } 268 | } 269 | 270 | // help text fix 271 | #apex_popup_help_area .ui-dialog.ui-widget { 272 | max-height: 80%; 273 | overflow-y: scroll; 274 | } 275 | 276 | // IR and IG filters 277 | .a-IG, .a-IRR { 278 | .a-MediaBlock { 279 | .a-MediaBlock-graphic { 280 | @include hide; 281 | } 282 | 283 | .a-IRR-reportSummaryContainer, .a-IG-reportSummaryContainer { 284 | @include hide; 285 | } 286 | 287 | .a-IRR-controls-cell:first-child { 288 | padding: 0; 289 | } 290 | 291 | .a-IRR-controlsCheckboxLabel { 292 | border: none; 293 | box-shadow: none; 294 | 295 | &:before { 296 | top: 6px!important; 297 | } 298 | 299 | &:after { 300 | top: 6px!important; 301 | } 302 | } 303 | } 304 | } 305 | -------------------------------------------------------------------------------- /src/scss/_apex_typography.scss: -------------------------------------------------------------------------------- 1 | /* Text Size */ 2 | // Default 3 | .ma-region > .ma-flex-content > .ma-region-header .ma-region-title { 4 | font-size: $h2-fontsize; 5 | font-weight: 300; 6 | } 7 | 8 | .ma-text-size-responsive .display_only { 9 | @extend .flow-text; 10 | font-weight: 300; 11 | } 12 | 13 | .ma-region.h1 > .ma-flex-content > .ma-region-header .ma-region-title 14 | , .ma-region.h1 > .card-content > .ma-flex-content > .ma-region-header .ma-region-title 15 | , .ma-text-size-h1 .display_only { 16 | font-size: $h1-fontsize; 17 | font-weight: 300; 18 | } 19 | 20 | .ma-region.h2 > .ma-flex-content > .ma-region-header .ma-region-title 21 | , .ma-region.h2 > .card-content > .ma-flex-content > .ma-region-header .ma-region-title 22 | , .ma-text-size-h2 .display_only { 23 | font-size: $h2-fontsize; 24 | font-weight: 300; 25 | } 26 | 27 | .ma-region.h3 > .ma-flex-content > .ma-region-header .ma-region-title 28 | , .ma-region.h3 > .card-content > .ma-flex-content > .ma-region-header .ma-region-title 29 | , .ma-text-size-h3 .display_only { 30 | font-size: $h3-fontsize; 31 | font-weight: 300; 32 | } 33 | 34 | .ma-region.h4 > .ma-flex-content > .ma-region-header .ma-region-title 35 | , .ma-region.h4 > .card-content > .ma-flex-content > .ma-region-header .ma-region-title 36 | , .ma-text-size-h4 .display_only { 37 | font-size: $h4-fontsize; 38 | font-weight: 300; 39 | } 40 | 41 | .ma-region.h5 > .ma-flex-content > .ma-region-header .ma-region-title 42 | , .ma-region.h5 > .card-content > .ma-flex-content > .ma-region-header .ma-region-title 43 | , .ma-text-size-h5 .display_only { 44 | font-size: $h5-fontsize; 45 | font-weight: 300; 46 | } 47 | 48 | .ma-region.h6 > .ma-flex-content > .ma-region-header .ma-region-title 49 | , .ma-region.h6 > .card-content > .ma-flex-content > .ma-region-header .ma-region-title 50 | , .ma-text-size-h6 .display_only { 51 | font-size: $h6-fontsize; 52 | font-weight: 300; 53 | } 54 | 55 | .ma-region.hide-title > .ma-flex-content > .ma-region-header .ma-region-title 56 | , .ma-region.hide-title.card > .card-content > .ma-flex-content > .ma-region-header .ma-region-title 57 | , blockquote.ma-region.hide-title > .ma-region-header .ma-region-title { 58 | @include hide(); 59 | } 60 | 61 | blockquote.ma-region > .ma-region-header .ma-region-title { 62 | font-weight: 300; 63 | } 64 | 65 | // Nowrap 66 | .text-nowrap { 67 | white-space: nowrap; 68 | } 69 | -------------------------------------------------------------------------------- /src/scss/_apex_wizard.scss: -------------------------------------------------------------------------------- 1 | .ma-wizard { 2 | margin: 0; 3 | padding: 0; 4 | list-style: none; 5 | display: table; 6 | table-layout: fixed; 7 | width: 100%; 8 | 9 | .ma-wizard-step { 10 | display: table-cell; 11 | vertical-align: top; 12 | 13 | .ma-wizard-step-wrap { 14 | float: left; 15 | width: 100%; 16 | height: 100%; 17 | position: relative; 18 | 19 | &:after { 20 | content: ''; 21 | position: absolute; 22 | width: 100%; 23 | top: 16px; 24 | height: 2px; 25 | margin-top: -1px; 26 | background-color: #d0d0d0; 27 | } 28 | } 29 | 30 | .ma-wizard-step-marker { 31 | display: block; 32 | text-align: center; 33 | width: 32px; 34 | height: 32px; 35 | margin-top: -10px; 36 | margin-left: -18px; 37 | top: 10px; 38 | left: 50%; 39 | position: absolute; 40 | z-index: 1; 41 | padding: 4px; 42 | border-radius: 100%; 43 | color: #666; 44 | 45 | i { 46 | font-size: 22px; 47 | } 48 | } 49 | 50 | .ma-wizard-step-marker.complete { 51 | display: none; 52 | } 53 | 54 | &.is-complete { 55 | .ma-wizard-step-marker.complete { 56 | display: block; 57 | } 58 | 59 | .ma-wizard-step-marker.not-complete { 60 | display: none; 61 | } 62 | } 63 | 64 | &.is-complete, 65 | &.is-active { 66 | .ma-wizard-step-marker { 67 | color: #FFF; 68 | } 69 | } 70 | 71 | .ma-wizard-step-label { 72 | display: block; 73 | text-align: center; 74 | margin-top: 36px; 75 | padding: 8px; 76 | line-height: 18px; 77 | font-size: 1.2rem; 78 | overflow: hidden; 79 | text-overflow: ellipsis; 80 | color: #666; 81 | } 82 | 83 | &.is-active .ma-wizard-step-label { 84 | color: #404040; 85 | font-weight: 700; 86 | } 87 | } 88 | } 89 | 90 | .ma-wizard-step:first-child .ma-wizard-step-wrap:after { 91 | left: 50%; 92 | right: 0; 93 | width: 50%; 94 | } 95 | 96 | .ma-wizard-step:last-child .ma-wizard-step-wrap:after { 97 | right: 50%; 98 | left: 0; 99 | width: 50%; 100 | } 101 | -------------------------------------------------------------------------------- /src/scss/app.scss: -------------------------------------------------------------------------------- 1 | @charset "UTF-8"; 2 | // Color 3 | @import "components/color-variables"; 4 | @import "components/color-classes"; 5 | 6 | // Custom APEX variables 7 | @import "apex_variables"; 8 | @import "apex_mixins"; 9 | 10 | // Original materialized CSS files 11 | @import "components/normalize"; 12 | @import "components/global"; 13 | @import "components/badges"; 14 | @import "components/icons-material-design"; 15 | @import "components/grid"; 16 | @import "components/navbar"; 17 | @import "components/typography"; 18 | @import "components/transitions"; 19 | @import "components/cards"; 20 | @import "components/toast"; 21 | @import "components/tabs"; 22 | @import "components/tooltip"; 23 | @import "components/buttons"; 24 | @import "components/dropdown"; 25 | @import "components/waves"; 26 | @import "components/modal"; 27 | @import "components/collapsible"; 28 | @import "components/chips"; 29 | @import "components/materialbox"; 30 | @import "components/forms/forms"; 31 | @import "components/table_of_contents"; 32 | @import "components/sidenav"; 33 | @import "components/preloader"; 34 | @import "components/slider"; 35 | @import "components/carousel"; 36 | @import "components/tapTarget"; 37 | @import "components/pulse"; 38 | @import "components/datepicker"; 39 | @import "components/timepicker"; 40 | 41 | // Custom APEX styles 42 | @import "apex_alert"; 43 | @import "apex_breadcrumbs"; 44 | @import "apex_buttons"; 45 | @import "apex_global"; 46 | @import "apex_calendar"; 47 | @import "apex_cards"; 48 | @import "apex_carousel"; 49 | @import "apex_collapsible"; 50 | @import "apex_collections"; 51 | @import "apex_colors"; 52 | @import "apex_datepicker"; 53 | @import "apex_demo"; 54 | @import "apex_dropdown"; 55 | @import "apex_forms"; 56 | @import "apex_footer"; 57 | @import "apex_grid"; 58 | @import "apex_icons"; 59 | @import "apex_ig"; 60 | @import "apex_ir"; 61 | @import "apex_materialbox"; 62 | @import "apex_media"; 63 | @import "apex_modal"; 64 | @import "apex_nav"; 65 | @import "apex_pagination"; 66 | @import "apex_preloader"; 67 | @import "apex_promo"; 68 | @import "apex_responsive_text"; 69 | @import "apex_sidenav"; 70 | @import "apex_table"; 71 | @import "apex_tabs"; 72 | @import "apex_timeline"; 73 | @import "apex_themeroller"; 74 | @import "apex_toasts"; 75 | @import "apex_toolbar"; 76 | @import "apex_typography"; 77 | @import "apex_spacers"; 78 | @import "apex_wizard"; 79 | -------------------------------------------------------------------------------- /templates/Breadcrumbs/Standard.hbs: -------------------------------------------------------------------------------- 1 | {{#BEFORE_FIRST}} 2 |
3 |
4 | {{/BEFORE_FIRST}} 5 | {{#CURRENT_PAGE_OPTION}} 6 | #NAME# 7 | {{/CURRENT_PAGE_OPTION}} 8 | {{#NON_CURRENT_PAGE_OPTION}} 9 | #NAME# 10 | {{/NON_CURRENT_PAGE_OPTION}} 11 | {{#MENU_LINK_ATTRIBUTES}}{{/MENU_LINK_ATTRIBUTES}} 12 | {{#BETWEEN_LEVELS}}{{/BETWEEN_LEVELS}} 13 | {{#AFTER_LAST}} 14 |
15 |
16 | {{/AFTER_LAST}} 17 | 18 | {{#MAX_LEVELS}} 19 | 12 20 | {{/MAX_LEVELS}} 21 | 22 | {{#TEMPLATE_OPTION_GROUPS}} 23 | [] 24 | {{/TEMPLATE_OPTION_GROUPS}} 25 | {{#TEMPLATE_OPTIONS}} 26 | [] 27 | {{/TEMPLATE_OPTIONS}} 28 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 29 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 30 | -------------------------------------------------------------------------------- /templates/Breadcrumbs/~global.template.options.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE_OPTION_GROUPS}} 2 | [] 3 | {{/TEMPLATE_OPTION_GROUPS}} 4 | {{#TEMPLATE_OPTIONS}} 5 | [] 6 | {{/TEMPLATE_OPTIONS}} 7 | -------------------------------------------------------------------------------- /templates/Buttons/Floating Action Button.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 | 5 | {{/TEMPLATE}} 6 | {{#HOT_TEMPLATE}} 7 | 8 | 9 | 10 | {{/HOT_TEMPLATE}} 11 | 12 | {{#TEMPLATE_OPTION_GROUPS}} 13 | [ 14 | { 15 | "NAME": "POSITION", 16 | "DISPLAY_NAME": "Position", 17 | "DISPLAY_SEQUENCE": 10, 18 | "HELP_TEXT": "", 19 | "NULL_TEXT": "", 20 | "IS_ADVANCED": "N", 21 | "TEMPLATE_OPTIONS": [ 22 | { 23 | "NAME": "RIGHT", 24 | "DISPLAY_NAME": "Fixed - Bottom Right", 25 | "DISPLAY_SEQUENCE": 1, 26 | "CSS_CLASSES": "fab-position-right", 27 | "HELP_TEXT": "" 28 | }, 29 | { 30 | "NAME": "LEFT", 31 | "DISPLAY_NAME": "Fixed - Bottom Left", 32 | "DISPLAY_SEQUENCE": 2, 33 | "CSS_CLASSES": "fab-position-left", 34 | "HELP_TEXT": "" 35 | }, 36 | { 37 | "NAME": "INSIDE_THE_PARENT", 38 | "DISPLAY_NAME": "Inside the Parent", 39 | "DISPLAY_SEQUENCE": 3, 40 | "CSS_CLASSES": "fab-position-absolute", 41 | "HELP_TEXT": "" 42 | } 43 | ] 44 | }, 45 | { 46 | "NAME": "FAB_DIRECTION", 47 | "DISPLAY_NAME": "Direction", 48 | "DISPLAY_SEQUENCE": 20, 49 | "HELP_TEXT": "Direction FAB menu opens. Can be 'top', 'right', 'bottom', 'left'", 50 | "NULL_TEXT": "", 51 | "IS_ADVANCED": "N", 52 | "TEMPLATE_OPTIONS": [ 53 | { 54 | "NAME": "FAB_DIRECTION_TOP", 55 | "DISPLAY_NAME": "Top", 56 | "DISPLAY_SEQUENCE": 10, 57 | "CSS_CLASSES": "fab-direction-top", 58 | "HELP_TEXT": "" 59 | }, 60 | { 61 | "NAME": "FAB_DIRECTION_RIGHT", 62 | "DISPLAY_NAME": "Right", 63 | "DISPLAY_SEQUENCE": 20, 64 | "CSS_CLASSES": "fab-direction-right", 65 | "HELP_TEXT": "" 66 | }, 67 | { 68 | "NAME": "FAB_DIRECTION_BOTTOM", 69 | "DISPLAY_NAME": "Bottom", 70 | "DISPLAY_SEQUENCE": 30, 71 | "CSS_CLASSES": "fab-direction-bottom", 72 | "HELP_TEXT": "" 73 | }, 74 | { 75 | "NAME": "FAB_DIRECTION_LEFT", 76 | "DISPLAY_NAME": "Left", 77 | "DISPLAY_SEQUENCE": 40, 78 | "CSS_CLASSES": "fab-direction-left", 79 | "HELP_TEXT": "" 80 | } 81 | ] 82 | }, 83 | { 84 | "NAME": "FAB_OPEN_BEHAVIOR", 85 | "DISPLAY_NAME": "Open Behavior", 86 | "DISPLAY_SEQUENCE": 30, 87 | "HELP_TEXT": "Determines if the FAB opens using Hover or Click", 88 | "NULL_TEXT": "", 89 | "IS_ADVANCED": "N", 90 | "TEMPLATE_OPTIONS": [ 91 | { 92 | "NAME": "FAB_OPEN_BEHAVIOR_HOVER", 93 | "DISPLAY_NAME": "Hover", 94 | "DISPLAY_SEQUENCE": 10, 95 | "CSS_CLASSES": "fab-open-behavior-hover", 96 | "HELP_TEXT": "" 97 | }, 98 | { 99 | "NAME": "FAB_OPEN_BEHAVIOR_CLICK", 100 | "DISPLAY_NAME": "Click", 101 | "DISPLAY_SEQUENCE": 20, 102 | "CSS_CLASSES": "fab-open-behavior-click", 103 | "HELP_TEXT": "" 104 | } 105 | ] 106 | } 107 | ] 108 | {{/TEMPLATE_OPTION_GROUPS}} 109 | {{#TEMPLATE_OPTIONS}} 110 | [ 111 | { 112 | "NAME": "FAB_TOOLBAR", 113 | "DISPLAY_NAME": "Toolbar", 114 | "DISPLAY_SEQUENCE": 40, 115 | "CSS_CLASSES": "fab-toolbar", 116 | "HELP_TEXT": "", 117 | "IS_ADVANCED": "" 118 | } 119 | ] 120 | {{/TEMPLATE_OPTIONS}} 121 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 122 | {{#PRESET_TEMPLATE_OPTIONS}} 123 | fab-position-absolute:btn-large:waves-effect waves-light:fab-direction-top:fab-open-behavior-hover 124 | {{/PRESET_TEMPLATE_OPTIONS}} 125 | -------------------------------------------------------------------------------- /templates/Buttons/Icon.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 | 5 | {{/TEMPLATE}} 6 | {{#HOT_TEMPLATE}} 7 | 8 | 9 | 10 | {{/HOT_TEMPLATE}} 11 | 12 | {{#TEMPLATE_OPTION_GROUPS}} 13 | [ 14 | { 15 | "NAME": "TYPE", 16 | "DISPLAY_NAME": "Type", 17 | "DISPLAY_SEQUENCE": 1, 18 | "HELP_TEXT": "", 19 | "NULL_TEXT": "", 20 | "IS_ADVANCED": "N", 21 | "TEMPLATE_OPTIONS": [ 22 | { 23 | "NAME": "RAISED", 24 | "DISPLAY_NAME": "Raised", 25 | "DISPLAY_SEQUENCE": 1, 26 | "CSS_CLASSES": "btn", 27 | "HELP_TEXT": "" 28 | }, 29 | { 30 | "NAME": "FLAT", 31 | "DISPLAY_NAME": "Flat", 32 | "DISPLAY_SEQUENCE": 2, 33 | "CSS_CLASSES": "btn-flat", 34 | "HELP_TEXT": "" 35 | }, 36 | { 37 | "NAME": "OUTLINE", 38 | "DISPLAY_NAME": "Outlined", 39 | "DISPLAY_SEQUENCE": 3, 40 | "CSS_CLASSES": "btn btn-outlined", 41 | "HELP_TEXT": "" 42 | } 43 | ] 44 | } 45 | ] 46 | {{/TEMPLATE_OPTION_GROUPS}} 47 | {{#TEMPLATE_OPTIONS}} 48 | [ 49 | { 50 | "NAME": "BUTTON_BLOCK", 51 | "DISPLAY_NAME": "Full Column Width", 52 | "DISPLAY_SEQUENCE": 1, 53 | "CSS_CLASSES": "ma-btn-block", 54 | "HELP_TEXT": "This makes the button to be 100% of the width of it's container.", 55 | "IS_ADVANCED": "" 56 | }, 57 | { 58 | "NAME": "INLINE_BUTTON", 59 | "DISPLAY_NAME": "Inline (Next to an item)", 60 | "DISPLAY_SEQUENCE": 2, 61 | "CSS_CLASSES": "ma-btn-inline", 62 | "HELP_TEXT": "", 63 | "IS_ADVANCED": "" 64 | } 65 | ] 66 | {{/TEMPLATE_OPTIONS}} 67 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 68 | {{#PRESET_TEMPLATE_OPTIONS}} 69 | btn:waves-effect waves-light 70 | {{/PRESET_TEMPLATE_OPTIONS}} 71 | -------------------------------------------------------------------------------- /templates/Buttons/Text with Icon.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 | 7 | {{/TEMPLATE}} 8 | {{#HOT_TEMPLATE}} 9 | 10 | 11 | #LABEL# 12 | 13 | 14 | {{/HOT_TEMPLATE}} 15 | 16 | {{#TEMPLATE_OPTION_GROUPS}} 17 | [ 18 | { 19 | "NAME": "TYPE", 20 | "DISPLAY_NAME": "Type", 21 | "DISPLAY_SEQUENCE": 1, 22 | "HELP_TEXT": "", 23 | "NULL_TEXT": "", 24 | "IS_ADVANCED": "N", 25 | "TEMPLATE_OPTIONS": [ 26 | { 27 | "NAME": "RAISED", 28 | "DISPLAY_NAME": "Raised", 29 | "DISPLAY_SEQUENCE": 1, 30 | "CSS_CLASSES": "btn", 31 | "HELP_TEXT": "" 32 | }, 33 | { 34 | "NAME": "FLAT", 35 | "DISPLAY_NAME": "Flat", 36 | "DISPLAY_SEQUENCE": 2, 37 | "CSS_CLASSES": "btn-flat", 38 | "HELP_TEXT": "" 39 | }, 40 | { 41 | "NAME": "OUTLINE", 42 | "DISPLAY_NAME": "Outlined", 43 | "DISPLAY_SEQUENCE": 3, 44 | "CSS_CLASSES": "btn btn-outlined", 45 | "HELP_TEXT": "" 46 | } 47 | ] 48 | }, 49 | { 50 | "NAME": "ICON_FLOAT", 51 | "DISPLAY_NAME": "Icon Float", 52 | "DISPLAY_SEQUENCE": 1, 53 | "HELP_TEXT": "Only applies if your button has an icon", 54 | "NULL_TEXT": "", 55 | "IS_ADVANCED": "Y", 56 | "TEMPLATE_OPTIONS": [ 57 | { 58 | "NAME": "ICON-FLOAT-LEFT", 59 | "DISPLAY_NAME": "Left", 60 | "DISPLAY_SEQUENCE": 1, 61 | "CSS_CLASSES": "icon-float-left", 62 | "HELP_TEXT": "Only applies if the button has an icon" 63 | }, 64 | { 65 | "NAME": "ICON-FLOAT-RIGHT", 66 | "DISPLAY_NAME": "Right", 67 | "DISPLAY_SEQUENCE": 2, 68 | "CSS_CLASSES": "icon-float-right", 69 | "HELP_TEXT": "Only applies if the button has an icon." 70 | } 71 | ] 72 | } 73 | ] 74 | {{/TEMPLATE_OPTION_GROUPS}} 75 | {{#TEMPLATE_OPTIONS}} 76 | [ 77 | { 78 | "NAME": "BUTTON_BLOCK", 79 | "DISPLAY_NAME": "Full Column Width", 80 | "DISPLAY_SEQUENCE": 1, 81 | "CSS_CLASSES": "ma-btn-block", 82 | "HELP_TEXT": "This makes the button to be 100% of the width of it's container.", 83 | "IS_ADVANCED": "" 84 | }, 85 | { 86 | "NAME": "INLINE_BUTTON", 87 | "DISPLAY_NAME": "Inline (Next to an item)", 88 | "DISPLAY_SEQUENCE": 2, 89 | "CSS_CLASSES": "ma-btn-inline", 90 | "HELP_TEXT": "", 91 | "IS_ADVANCED": "" 92 | } 93 | ] 94 | {{/TEMPLATE_OPTIONS}} 95 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 96 | {{#PRESET_TEMPLATE_OPTIONS}} 97 | btn:waves-effect waves-light:icon-float-left 98 | {{/PRESET_TEMPLATE_OPTIONS}} 99 | -------------------------------------------------------------------------------- /templates/Buttons/Text.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 | 5 | 6 | 7 | {{/TEMPLATE}} 8 | {{#HOT_TEMPLATE}} 9 | 10 | #LABEL# 11 | 12 | 13 | {{/HOT_TEMPLATE}} 14 | 15 | {{#TEMPLATE_OPTION_GROUPS}} 16 | [ 17 | { 18 | "NAME": "TYPE", 19 | "DISPLAY_NAME": "Type", 20 | "DISPLAY_SEQUENCE": 1, 21 | "HELP_TEXT": "", 22 | "NULL_TEXT": "", 23 | "IS_ADVANCED": "N", 24 | "TEMPLATE_OPTIONS": [ 25 | { 26 | "NAME": "RAISED", 27 | "DISPLAY_NAME": "Raised", 28 | "DISPLAY_SEQUENCE": 1, 29 | "CSS_CLASSES": "btn", 30 | "HELP_TEXT": "" 31 | }, 32 | { 33 | "NAME": "FLAT", 34 | "DISPLAY_NAME": "Flat", 35 | "DISPLAY_SEQUENCE": 2, 36 | "CSS_CLASSES": "btn-flat", 37 | "HELP_TEXT": "" 38 | }, 39 | { 40 | "NAME": "OUTLINE", 41 | "DISPLAY_NAME": "Outlined", 42 | "DISPLAY_SEQUENCE": 3, 43 | "CSS_CLASSES": "btn btn-outlined", 44 | "HELP_TEXT": "" 45 | } 46 | ] 47 | } 48 | ] 49 | {{/TEMPLATE_OPTION_GROUPS}} 50 | {{#TEMPLATE_OPTIONS}} 51 | [ 52 | { 53 | "NAME": "BUTTON_BLOCK", 54 | "DISPLAY_NAME": "Full Column Width", 55 | "DISPLAY_SEQUENCE": 1, 56 | "CSS_CLASSES": "ma-btn-block", 57 | "HELP_TEXT": "This makes the button to be 100% of the width of it's container.", 58 | "IS_ADVANCED": "" 59 | }, 60 | { 61 | "NAME": "INLINE_BUTTON", 62 | "DISPLAY_NAME": "Inline (Next to an item)", 63 | "DISPLAY_SEQUENCE": 2, 64 | "CSS_CLASSES": "ma-btn-inline", 65 | "HELP_TEXT": "", 66 | "IS_ADVANCED": "" 67 | } 68 | ] 69 | {{/TEMPLATE_OPTIONS}} 70 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 71 | {{#PRESET_TEMPLATE_OPTIONS}} 72 | btn:waves-effect waves-light 73 | {{/PRESET_TEMPLATE_OPTIONS}} 74 | -------------------------------------------------------------------------------- /templates/Fields/File Input.hbs: -------------------------------------------------------------------------------- 1 | {{#BEFORE_ITEM}} 2 |
3 |
4 | 5 | {{/BEFORE_ITEM}} 6 | {{#TEMPLATE_BODY1}} 7 | 8 | 9 | {{/TEMPLATE_BODY1}} 10 | {{#TEMPLATE_BODY2}} 11 | 12 | 13 | {{/TEMPLATE_BODY2}} 14 | {{#ITEM_PRE_TEXT}}{{/ITEM_PRE_TEXT}} 15 | {{#BEFORE_ELEMENT}}{{/BEFORE_ELEMENT}} 16 | {{#AFTER_ELEMENT}}{{/AFTER_ELEMENT}} 17 | {{#ITEM_POST_TEXT}}{{/ITEM_POST_TEXT}} 18 | {{#AFTER_ITEM}} 19 |
20 |
21 | 22 |
23 |
24 | 25 | 26 | {{/AFTER_ITEM}} 27 | 28 | {{#ON_ERROR_BEFORE_LABEL}}{{/ON_ERROR_BEFORE_LABEL}} 29 | {{#ON_ERROR_AFTER_LABEL}}{{/ON_ERROR_AFTER_LABEL}} 30 | {{#ERROR_TEMPLATE}}{{/ERROR_TEMPLATE}} 31 | {{#HELP_LINK}}{{/HELP_LINK}} 32 | {{#INLINE_HELP_TEXT}}{{/INLINE_HELP_TEXT}} 33 | 34 | {{#TEMPLATE_OPTION_GROUPS}} 35 | [] 36 | {{/TEMPLATE_OPTION_GROUPS}} 37 | {{#TEMPLATE_OPTIONS}} 38 | [] 39 | {{/TEMPLATE_OPTIONS}} 40 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 41 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 42 | -------------------------------------------------------------------------------- /templates/Fields/Image.hbs: -------------------------------------------------------------------------------- 1 | {{#BEFORE_ITEM}} 2 |
3 | 4 | {{/BEFORE_ITEM}} 5 | {{#TEMPLATE_BODY1}} 6 | 11 | 12 | {{/TEMPLATE_BODY2}} 13 | {{#ITEM_PRE_TEXT}}{{/ITEM_PRE_TEXT}} 14 | {{#BEFORE_ELEMENT}}{{/BEFORE_ELEMENT}} 15 | {{#AFTER_ELEMENT}}{{/AFTER_ELEMENT}} 16 | {{#ITEM_POST_TEXT}}{{/ITEM_POST_TEXT}} 17 | {{#AFTER_ITEM}} 18 |
19 | 20 | 21 | {{/AFTER_ITEM}} 22 | 23 | {{#ON_ERROR_BEFORE_LABEL}}{{/ON_ERROR_BEFORE_LABEL}} 24 | {{#ON_ERROR_AFTER_LABEL}}{{/ON_ERROR_AFTER_LABEL}} 25 | {{#ERROR_TEMPLATE}}{{/ERROR_TEMPLATE}} 26 | {{#HELP_LINK}}{{/HELP_LINK}} 27 | {{#INLINE_HELP_TEXT}}{{/INLINE_HELP_TEXT}} 28 | 29 | {{#TEMPLATE_OPTION_GROUPS}} 30 | [] 31 | {{/TEMPLATE_OPTION_GROUPS}} 32 | {{#TEMPLATE_OPTIONS}} 33 | [ 34 | { 35 | "NAME": "IMAGE_CIRCLE", 36 | "DISPLAY_NAME": "Image Circle", 37 | "DISPLAY_SEQUENCE": 1, 38 | "CSS_CLASSES": "item-image-circle", 39 | "HELP_TEXT": "", 40 | "IS_ADVANCED": "" 41 | }, 42 | { 43 | "NAME": "IMAGE_RESPONSIVE", 44 | "DISPLAY_NAME": "Image Responsive", 45 | "DISPLAY_SEQUENCE": 3, 46 | "CSS_CLASSES": "item-image-responsive", 47 | "HELP_TEXT": "", 48 | "IS_ADVANCED": "" 49 | } 50 | ] 51 | {{/TEMPLATE_OPTIONS}} 52 | {{#DEFAULT_TEMPLATE_OPTIONS}} 53 | item-image-responsive 54 | {{/DEFAULT_TEMPLATE_OPTIONS}} 55 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 56 | -------------------------------------------------------------------------------- /templates/Fields/Materialbox.hbs: -------------------------------------------------------------------------------- 1 | {{#BEFORE_ITEM}} 2 |
3 | 4 | {{/BEFORE_ITEM}} 5 | {{#TEMPLATE_BODY1}} 6 | 11 | 12 | {{/TEMPLATE_BODY2}} 13 | {{#ITEM_PRE_TEXT}}{{/ITEM_PRE_TEXT}} 14 | {{#BEFORE_ELEMENT}} 15 |
16 | 17 | {{/BEFORE_ELEMENT}} 18 | {{#AFTER_ELEMENT}} 19 |
20 | 21 | {{/AFTER_ELEMENT}} 22 | {{#ITEM_POST_TEXT}}{{/ITEM_POST_TEXT}} 23 | {{#AFTER_ITEM}} 24 |
25 | 26 | 27 | {{/AFTER_ITEM}} 28 | 29 | {{#ON_ERROR_BEFORE_LABEL}}{{/ON_ERROR_BEFORE_LABEL}} 30 | {{#ON_ERROR_AFTER_LABEL}}{{/ON_ERROR_AFTER_LABEL}} 31 | {{#ERROR_TEMPLATE}}{{/ERROR_TEMPLATE}} 32 | {{#HELP_LINK}}{{/HELP_LINK}} 33 | {{#INLINE_HELP_TEXT}}{{/INLINE_HELP_TEXT}} 34 | 35 | {{#TEMPLATE_OPTION_GROUPS}} 36 | [] 37 | {{/TEMPLATE_OPTION_GROUPS}} 38 | {{#TEMPLATE_OPTIONS}} 39 | [] 40 | {{/TEMPLATE_OPTIONS}} 41 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 42 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 43 | -------------------------------------------------------------------------------- /templates/Lists/Collection.hbs: -------------------------------------------------------------------------------- 1 | {{#JAVASCRIPT_FILE_URLS}}{{/JAVASCRIPT_FILE_URLS}} 2 | {{#JAVASCRIPT_CODE_ONLOAD}}{{/JAVASCRIPT_CODE_ONLOAD}} 3 | {{#CSS_FILE_URLS}}{{/CSS_FILE_URLS}} 4 | {{#INLINE_CSS}}{{/INLINE_CSS}} 5 | 6 | {{#LIST_TEMPLATE_BEFORE_ROWS}} 7 | 48 | 49 | {{/LIST_TEMPLATE_AFTER_ROWS}} 50 | 51 | {{#A01_LABEL}} 52 | Badge 53 | {{/A01_LABEL}} 54 | {{#A02_LABEL}} 55 | Secondary Link 56 | {{/A02_LABEL}} 57 | {{#A03_LABEL}}{{/A03_LABEL}} 58 | {{#A04_LABEL}}{{/A04_LABEL}} 59 | {{#A05_LABEL}}{{/A05_LABEL}} 60 | {{#A06_LABEL}}{{/A06_LABEL}} 61 | {{#A07_LABEL}}{{/A07_LABEL}} 62 | {{#A08_LABEL}}{{/A08_LABEL}} 63 | {{#A09_LABEL}}{{/A09_LABEL}} 64 | {{#A10_LABEL}}{{/A10_LABEL}} 65 | {{#A11_LABEL}}{{/A11_LABEL}} 66 | {{#A12_LABEL}}{{/A12_LABEL}} 67 | {{#A13_LABEL}}{{/A13_LABEL}} 68 | {{#A14_LABEL}}{{/A14_LABEL}} 69 | {{#A15_LABEL}}{{/A15_LABEL}} 70 | {{#A16_LABEL}}{{/A16_LABEL}} 71 | {{#A17_LABEL}}{{/A17_LABEL}} 72 | {{#A18_LABEL}}{{/A18_LABEL}} 73 | {{#A19_LABEL}}{{/A19_LABEL}} 74 | {{#A20_LABEL}}{{/A20_LABEL}} 75 | 76 | {{#TEMPLATE_OPTION_GROUPS}} 77 | [] 78 | {{/TEMPLATE_OPTION_GROUPS}} 79 | {{#TEMPLATE_OPTIONS}} 80 | [ 81 | { 82 | "NAME": "WITH_HEADER", 83 | "DISPLAY_NAME": "With Header", 84 | "DISPLAY_SEQUENCE": 1, 85 | "CSS_CLASSES": "with-header", 86 | "HELP_TEXT": "", 87 | "IS_ADVANCED": "" 88 | } 89 | ] 90 | {{/TEMPLATE_OPTIONS}} 91 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 92 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 93 | -------------------------------------------------------------------------------- /templates/Lists/Navbar.hbs: -------------------------------------------------------------------------------- 1 | {{#JAVASCRIPT_FILE_URLS}}{{/JAVASCRIPT_FILE_URLS}} 2 | {{#JAVASCRIPT_CODE_ONLOAD}}{{/JAVASCRIPT_CODE_ONLOAD}} 3 | {{#CSS_FILE_URLS}}{{/CSS_FILE_URLS}} 4 | {{#INLINE_CSS}}{{/INLINE_CSS}} 5 | 6 | {{#LIST_TEMPLATE_BEFORE_ROWS}} 7 | 65 | {{/LIST_TEMPLATE_AFTER_ROWS}} 66 | 67 | {{#A01_LABEL}} 68 | Button CSS Classes 69 | {{/A01_LABEL}} 70 | {{#A02_LABEL}}{{/A02_LABEL}} 71 | {{#A03_LABEL}}{{/A03_LABEL}} 72 | {{#A04_LABEL}}{{/A04_LABEL}} 73 | {{#A05_LABEL}}{{/A05_LABEL}} 74 | {{#A06_LABEL}}{{/A06_LABEL}} 75 | {{#A07_LABEL}}{{/A07_LABEL}} 76 | {{#A08_LABEL}}{{/A08_LABEL}} 77 | {{#A09_LABEL}}{{/A09_LABEL}} 78 | {{#A10_LABEL}}{{/A10_LABEL}} 79 | {{#A11_LABEL}}{{/A11_LABEL}} 80 | {{#A12_LABEL}}{{/A12_LABEL}} 81 | {{#A13_LABEL}}{{/A13_LABEL}} 82 | {{#A14_LABEL}}{{/A14_LABEL}} 83 | {{#A15_LABEL}}{{/A15_LABEL}} 84 | {{#A16_LABEL}}{{/A16_LABEL}} 85 | {{#A17_LABEL}}{{/A17_LABEL}} 86 | {{#A18_LABEL}}{{/A18_LABEL}} 87 | {{#A19_LABEL}}{{/A19_LABEL}} 88 | {{#A20_LABEL}}{{/A20_LABEL}} 89 | 90 | {{#TEMPLATE_OPTION_GROUPS}} 91 | [] 92 | {{/TEMPLATE_OPTION_GROUPS}} 93 | {{#TEMPLATE_OPTIONS}} 94 | [] 95 | {{/TEMPLATE_OPTIONS}} 96 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 97 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 98 | -------------------------------------------------------------------------------- /templates/Lists/SideNav.hbs: -------------------------------------------------------------------------------- 1 | {{#JAVASCRIPT_FILE_URLS}}{{/JAVASCRIPT_FILE_URLS}} 2 | {{#JAVASCRIPT_CODE_ONLOAD}} 3 | materialAPEX.sideNav.init(); 4 | {{/JAVASCRIPT_CODE_ONLOAD}} 5 | {{#CSS_FILE_URLS}}{{/CSS_FILE_URLS}} 6 | {{#INLINE_CSS}}{{/INLINE_CSS}} 7 | 8 | {{#LIST_TEMPLATE_BEFORE_ROWS}} 9 | 117 | {{/LIST_TEMPLATE_AFTER_ROWS}} 118 | 119 | {{#A01_LABEL}} 120 | Badge 121 | {{/A01_LABEL}} 122 | {{#A02_LABEL}}{{/A02_LABEL}} 123 | {{#A03_LABEL}}{{/A03_LABEL}} 124 | {{#A04_LABEL}}{{/A04_LABEL}} 125 | {{#A05_LABEL}}{{/A05_LABEL}} 126 | {{#A06_LABEL}}{{/A06_LABEL}} 127 | {{#A07_LABEL}}{{/A07_LABEL}} 128 | {{#A08_LABEL}}{{/A08_LABEL}} 129 | {{#A09_LABEL}}{{/A09_LABEL}} 130 | {{#A10_LABEL}}{{/A10_LABEL}} 131 | {{#A11_LABEL}}{{/A11_LABEL}} 132 | {{#A12_LABEL}}{{/A12_LABEL}} 133 | {{#A13_LABEL}}{{/A13_LABEL}} 134 | {{#A14_LABEL}}{{/A14_LABEL}} 135 | {{#A15_LABEL}}{{/A15_LABEL}} 136 | {{#A16_LABEL}}{{/A16_LABEL}} 137 | {{#A17_LABEL}}{{/A17_LABEL}} 138 | {{#A18_LABEL}}{{/A18_LABEL}} 139 | {{#A19_LABEL}}{{/A19_LABEL}} 140 | {{#A20_LABEL}}{{/A20_LABEL}} 141 | 142 | {{#TEMPLATE_OPTION_GROUPS}} 143 | [] 144 | {{/TEMPLATE_OPTION_GROUPS}} 145 | {{#TEMPLATE_OPTIONS}} 146 | [] 147 | {{/TEMPLATE_OPTIONS}} 148 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 149 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 150 | -------------------------------------------------------------------------------- /templates/Lists/Tabs.hbs: -------------------------------------------------------------------------------- 1 | {{#JAVASCRIPT_FILE_URLS}}{{/JAVASCRIPT_FILE_URLS}} 2 | {{#JAVASCRIPT_CODE_ONLOAD}}{{/JAVASCRIPT_CODE_ONLOAD}} 3 | {{#CSS_FILE_URLS}}{{/CSS_FILE_URLS}} 4 | {{#INLINE_CSS}}{{/INLINE_CSS}} 5 | 6 | {{#LIST_TEMPLATE_BEFORE_ROWS}} 7 | 37 | {{/LIST_TEMPLATE_AFTER_ROWS}} 38 | 39 | {{#A01_LABEL}}{{/A01_LABEL}} 40 | {{#A02_LABEL}}{{/A02_LABEL}} 41 | {{#A03_LABEL}}{{/A03_LABEL}} 42 | {{#A04_LABEL}}{{/A04_LABEL}} 43 | {{#A05_LABEL}}{{/A05_LABEL}} 44 | {{#A06_LABEL}}{{/A06_LABEL}} 45 | {{#A07_LABEL}}{{/A07_LABEL}} 46 | {{#A08_LABEL}}{{/A08_LABEL}} 47 | {{#A09_LABEL}}{{/A09_LABEL}} 48 | {{#A10_LABEL}}{{/A10_LABEL}} 49 | {{#A11_LABEL}}{{/A11_LABEL}} 50 | {{#A12_LABEL}}{{/A12_LABEL}} 51 | {{#A13_LABEL}}{{/A13_LABEL}} 52 | {{#A14_LABEL}}{{/A14_LABEL}} 53 | {{#A15_LABEL}}{{/A15_LABEL}} 54 | {{#A16_LABEL}}{{/A16_LABEL}} 55 | {{#A17_LABEL}}{{/A17_LABEL}} 56 | {{#A18_LABEL}}{{/A18_LABEL}} 57 | {{#A19_LABEL}}{{/A19_LABEL}} 58 | {{#A20_LABEL}}{{/A20_LABEL}} 59 | 60 | {{#TEMPLATE_OPTION_GROUPS}} 61 | [ 62 | { 63 | "NAME": "TABS_POSITION", 64 | "DISPLAY_NAME": "Position", 65 | "DISPLAY_SEQUENCE": 0, 66 | "HELP_TEXT": "The position of your tabs", 67 | "NULL_TEXT": "Default", 68 | "IS_ADVANCED": "N", 69 | "TEMPLATE_OPTIONS": [ 70 | { 71 | "NAME": "TABS_POSITION_BOTTOM", 72 | "DISPLAY_NAME": "Fixed Bottom - Always", 73 | "DISPLAY_SEQUENCE": 10, 74 | "CSS_CLASSES": "ma-tabs-position-bottom", 75 | "HELP_TEXT": "" 76 | }, 77 | { 78 | "NAME": "TABS_POSITION_BOTTOM_MOBILE", 79 | "DISPLAY_NAME": "Fixed Bottom - Mobile Only", 80 | "DISPLAY_SEQUENCE": 20, 81 | "CSS_CLASSES": "ma-tabs-position-bottom-mobile", 82 | "HELP_TEXT": "" 83 | } 84 | ] 85 | } 86 | ] 87 | {{/TEMPLATE_OPTION_GROUPS}} 88 | {{#TEMPLATE_OPTIONS}} 89 | [ 90 | { 91 | "NAME": "TABS_TRANSPARENT", 92 | "DISPLAY_NAME": "Tabs Transparent", 93 | "DISPLAY_SEQUENCE": 1, 94 | "CSS_CLASSES": "tabs-transparent", 95 | "HELP_TEXT": "", 96 | "IS_ADVANCED": "" 97 | } 98 | ] 99 | {{/TEMPLATE_OPTIONS}} 100 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 101 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 102 | -------------------------------------------------------------------------------- /templates/Lists/Wizard.hbs: -------------------------------------------------------------------------------- 1 | {{#JAVASCRIPT_FILE_URLS}}{{/JAVASCRIPT_FILE_URLS}} 2 | {{#JAVASCRIPT_CODE_ONLOAD}} 3 | materialAPEX.wizard.init(); 4 | {{/JAVASCRIPT_CODE_ONLOAD}} 5 | {{#CSS_FILE_URLS}}{{/CSS_FILE_URLS}} 6 | {{#INLINE_CSS}}{{/INLINE_CSS}} 7 | 8 | {{#LIST_TEMPLATE_BEFORE_ROWS}} 9 | #CURRENT_PROGRESS# 10 | 55 | 56 | {{/LIST_TEMPLATE_AFTER_ROWS}} 57 | 58 | {{#A01_LABEL}}Mobile Text{{/A01_LABEL}} 59 | {{#A02_LABEL}}{{/A02_LABEL}} 60 | {{#A03_LABEL}}{{/A03_LABEL}} 61 | {{#A04_LABEL}}{{/A04_LABEL}} 62 | {{#A05_LABEL}}{{/A05_LABEL}} 63 | {{#A06_LABEL}}{{/A06_LABEL}} 64 | {{#A07_LABEL}}{{/A07_LABEL}} 65 | {{#A08_LABEL}}{{/A08_LABEL}} 66 | {{#A09_LABEL}}{{/A09_LABEL}} 67 | {{#A10_LABEL}}{{/A10_LABEL}} 68 | {{#A11_LABEL}}{{/A11_LABEL}} 69 | {{#A12_LABEL}}{{/A12_LABEL}} 70 | {{#A13_LABEL}}{{/A13_LABEL}} 71 | {{#A14_LABEL}}{{/A14_LABEL}} 72 | {{#A15_LABEL}}{{/A15_LABEL}} 73 | {{#A16_LABEL}}{{/A16_LABEL}} 74 | {{#A17_LABEL}}{{/A17_LABEL}} 75 | {{#A18_LABEL}}{{/A18_LABEL}} 76 | {{#A19_LABEL}}{{/A19_LABEL}} 77 | {{#A20_LABEL}}{{/A20_LABEL}} 78 | 79 | {{#TEMPLATE_OPTION_GROUPS}} 80 | [] 81 | {{/TEMPLATE_OPTION_GROUPS}} 82 | {{#TEMPLATE_OPTIONS}} 83 | [] 84 | {{/TEMPLATE_OPTIONS}} 85 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 86 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 87 | -------------------------------------------------------------------------------- /templates/Lists/~global.template.options.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE_OPTION_GROUPS}} 2 | [] 3 | {{/TEMPLATE_OPTION_GROUPS}} 4 | {{#TEMPLATE_OPTIONS}} 5 | [] 6 | {{/TEMPLATE_OPTIONS}} 7 | -------------------------------------------------------------------------------- /templates/Pages/Clean.hbs: -------------------------------------------------------------------------------- 1 | {{#JAVASCRIPT_FILE_URLS}}{{/JAVASCRIPT_FILE_URLS}} 2 | {{#JAVASCRIPT_CODE}}{{/JAVASCRIPT_CODE}} 3 | {{#JAVASCRIPT_CODE_ONLOAD}}{{/JAVASCRIPT_CODE_ONLOAD}} 4 | {{#CSS_FILE_URLS}}{{/CSS_FILE_URLS}} 5 | {{#INLINE_CSS}}{{/INLINE_CSS}} 6 | 7 | {{#HEADER_TEMPLATE}} 8 | 9 | 10 | 11 | #TITLE# 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | #APEX_CSS# 21 | #THEME_CSS# 22 | #TEMPLATE_CSS# 23 | #THEME_STYLE_CSS# 24 | #APPLICATION_CSS# 25 | #PAGE_CSS# 26 | #FAVICONS# 27 | #HEAD# 28 | 29 | 30 | {{/HEADER_TEMPLATE}} 31 | {{#BOX}} 32 | #FORM_OPEN# 33 | 34 | 35 | #REGION_POSITION_01# 36 | 37 |
38 | #BODY# 39 |
40 | 41 |
42 | #SUCCESS_MESSAGE##NOTIFICATION_MESSAGE##GLOBAL_NOTIFICATION# 43 |
44 | 45 | #FORM_CLOSE# 46 | {{/BOX}} 47 | {{#FOOTER_TEMPLATE}} 48 | #FORM_CLOSE# 49 | #DEVELOPER_TOOLBAR# 50 | #APEX_JAVASCRIPT# 51 | #GENERATED_CSS# 52 | #THEME_JAVASCRIPT# 53 | #TEMPLATE_JAVASCRIPT# 54 | #APPLICATION_JAVASCRIPT# 55 | #PAGE_JAVASCRIPT# 56 | #GENERATED_JAVASCRIPT# 57 | 58 | 59 | 60 | {{/FOOTER_TEMPLATE}} 61 | 62 | {{#SUCCESS_MESSAGE}} 63 |
64 | 79 |
80 | {{/SUCCESS_MESSAGE}} 81 | {{#MESSAGE}} 82 |
83 | 98 |
99 | {{/MESSAGE}} 100 | 101 | {{#GRID_TEMPLATE}} 102 |
#ROWS#
103 | {{/GRID_TEMPLATE}} 104 | {{#GRID_ROW_TEMPLATE}} 105 |
#COLUMNS#
106 | {{/GRID_ROW_TEMPLATE}} 107 | {{#GRID_COLUMN_TEMPLATE}} 108 |
#CONTENT#
109 | {{/GRID_COLUMN_TEMPLATE}} 110 | 111 | {{#DIALOG_BROWSER_FRAME}} 112 | MODAL 113 | {{/DIALOG_BROWSER_FRAME}} 114 | {{#DIALOG_CSS_CLASSES}}{{/DIALOG_CSS_CLASSES}} 115 | {{#DIALOG_HEIGHT}}{{/DIALOG_HEIGHT}} 116 | {{#DIALOG_JS_CANCEL_CODE}} 117 | apex.navigation.dialog.cancel(#IS_MODAL#); 118 | {{/DIALOG_JS_CANCEL_CODE}} 119 | {{#DIALOG_JS_CLOSE_CODE}} 120 | apex.navigation.dialog.close(#IS_MODAL#,#TARGET#); 121 | {{/DIALOG_JS_CLOSE_CODE}} 122 | {{#DIALOG_JS_INIT_CODE}} 123 | apex.navigation.dialog(#PAGE_URL#,{title:#TITLE#,height:#DIALOG_HEIGHT#,width:#DIALOG_WIDTH#,maxWidth:#DIALOG_MAX_WIDTH#,modal:#IS_MODAL#,dialog:#DIALOG#,#DIALOG_ATTRIBUTES#},#DIALOG_CSS_CLASSES#,#TRIGGERING_ELEMENT#); 124 | {{/DIALOG_JS_INIT_CODE}} 125 | {{#DIALOG_MAX_WIDTH}}{{/DIALOG_MAX_WIDTH}} 126 | {{#DIALOG_WIDTH}}{{/DIALOG_WIDTH}} 127 | 128 | {{#TEMPLATE_OPTION_GROUPS}} 129 | [] 130 | {{/TEMPLATE_OPTION_GROUPS}} 131 | {{#TEMPLATE_OPTIONS}} 132 | [ 133 | { 134 | "NAME": "CONTAINER", 135 | "DISPLAY_NAME": "Wrap Page in a Container", 136 | "DISPLAY_SEQUENCE": 1, 137 | "CSS_CLASSES": "main-container", 138 | "HELP_TEXT": "", 139 | "IS_ADVANCED": "" 140 | } 141 | ] 142 | {{/TEMPLATE_OPTIONS}} 143 | {{#DEFAULT_TEMPLATE_OPTIONS}} 144 | main-container 145 | {{/DEFAULT_TEMPLATE_OPTIONS}} 146 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 147 | -------------------------------------------------------------------------------- /templates/Pages/Modal.hbs: -------------------------------------------------------------------------------- 1 | {{#JAVASCRIPT_FILE_URLS}}{{/JAVASCRIPT_FILE_URLS}} 2 | {{#JAVASCRIPT_CODE}}{{/JAVASCRIPT_CODE}} 3 | {{#JAVASCRIPT_CODE_ONLOAD}} 4 | apex.theme42.initializePage.modalDialog(); 5 | {{/JAVASCRIPT_CODE_ONLOAD}} 6 | {{#CSS_FILE_URLS}}{{/CSS_FILE_URLS}} 7 | {{#INLINE_CSS}}{{/INLINE_CSS}} 8 | 9 | {{#HEADER_TEMPLATE}} 10 | 11 | 12 | 13 | #TITLE# 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | #APEX_CSS# 23 | #THEME_CSS# 24 | #TEMPLATE_CSS# 25 | #THEME_STYLE_CSS# 26 | #APPLICATION_CSS# 27 | #PAGE_CSS# 28 | #FAVICONS# 29 | #HEAD# 30 | 31 | 32 | {{/HEADER_TEMPLATE}} 33 | {{#BOX}} 34 | #FORM_OPEN# 35 | 36 | 37 | #REGION_POSITION_01# 38 | 39 | 59 | 60 |
61 | #SUCCESS_MESSAGE##NOTIFICATION_MESSAGE##GLOBAL_NOTIFICATION# 62 |
63 | 64 | #FORM_CLOSE# 65 | {{/BOX}} 66 | {{#FOOTER_TEMPLATE}} 67 | #DEVELOPER_TOOLBAR# 68 | #APEX_JAVASCRIPT# 69 | #THEME_JAVASCRIPT# 70 | #TEMPLATE_JAVASCRIPT# 71 | #APPLICATION_JAVASCRIPT# 72 | #PAGE_JAVASCRIPT# 73 | #GENERATED_CSS# 74 | #GENERATED_JAVASCRIPT# 75 | 76 | 77 | 78 | {{/FOOTER_TEMPLATE}} 79 | 80 | {{#SUCCESS_MESSAGE}} 81 |
82 | 97 |
98 | {{/SUCCESS_MESSAGE}} 99 | {{#MESSAGE}} 100 |
101 | 116 |
117 | {{/MESSAGE}} 118 | 119 | {{#GRID_TEMPLATE}} 120 |
#ROWS#
121 | {{/GRID_TEMPLATE}} 122 | {{#GRID_ROW_TEMPLATE}} 123 |
#COLUMNS#
124 | {{/GRID_ROW_TEMPLATE}} 125 | {{#GRID_COLUMN_TEMPLATE}} 126 |
#CONTENT#
127 | {{/GRID_COLUMN_TEMPLATE}} 128 | 129 | {{#DIALOG_BROWSER_FRAME}} 130 | MODAL 131 | {{/DIALOG_BROWSER_FRAME}} 132 | {{#DIALOG_CSS_CLASSES}}{{/DIALOG_CSS_CLASSES}} 133 | {{#DIALOG_HEIGHT}} 134 | auto 135 | {{/DIALOG_HEIGHT}} 136 | {{#DIALOG_JS_CANCEL_CODE}} 137 | apex.navigation.dialog.cancel(#IS_MODAL#); 138 | {{/DIALOG_JS_CANCEL_CODE}} 139 | {{#DIALOG_JS_CLOSE_CODE}} 140 | apex.navigation.dialog.close(#IS_MODAL#,#TARGET#); 141 | {{/DIALOG_JS_CLOSE_CODE}} 142 | {{#DIALOG_JS_INIT_CODE}} 143 | apex.navigation.dialog(#PAGE_URL#,{title:#TITLE#,height:#DIALOG_HEIGHT#,width:#DIALOG_WIDTH#,maxWidth:#DIALOG_MAX_WIDTH#,modal:#IS_MODAL#,dialog:#DIALOG#,#DIALOG_ATTRIBUTES#},'t-Dialog-page--standard '+#DIALOG_CSS_CLASSES#,#TRIGGERING_ELEMENT#); 144 | {{/DIALOG_JS_INIT_CODE}} 145 | {{#DIALOG_MAX_WIDTH}} 146 | 960 147 | {{/DIALOG_MAX_WIDTH}} 148 | {{#DIALOG_WIDTH}} 149 | 720 150 | {{/DIALOG_WIDTH}} 151 | 152 | {{#TEMPLATE_OPTION_GROUPS}} 153 | [] 154 | {{/TEMPLATE_OPTION_GROUPS}} 155 | {{#TEMPLATE_OPTIONS}} 156 | [ 157 | { 158 | "NAME": "STRETCH_TO_FIT_WINDOW", 159 | "DISPLAY_NAME": "Stretch to Fit Window", 160 | "DISPLAY_SEQUENCE": 1, 161 | "CSS_CLASSES": "ui-dialog--stretch", 162 | "HELP_TEXT": "Stretch the dialog to fit the browser window.", 163 | "IS_ADVANCED": "" 164 | } 165 | ] 166 | {{/TEMPLATE_OPTIONS}} 167 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 168 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 169 | -------------------------------------------------------------------------------- /templates/Pages/Standard - No Footer.hbs: -------------------------------------------------------------------------------- 1 | {{#JAVASCRIPT_FILE_URLS}}{{/JAVASCRIPT_FILE_URLS}} 2 | {{#JAVASCRIPT_CODE}}{{/JAVASCRIPT_CODE}} 3 | {{#JAVASCRIPT_CODE_ONLOAD}}{{/JAVASCRIPT_CODE_ONLOAD}} 4 | {{#CSS_FILE_URLS}}{{/CSS_FILE_URLS}} 5 | {{#INLINE_CSS}}{{/INLINE_CSS}} 6 | 7 | {{#HEADER_TEMPLATE}} 8 | 9 | 10 | 11 | #TITLE# 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | #APEX_CSS# 21 | #THEME_CSS# 22 | #TEMPLATE_CSS# 23 | #THEME_STYLE_CSS# 24 | #APPLICATION_CSS# 25 | #PAGE_CSS# 26 | #FAVICONS# 27 | #HEAD# 28 | 29 | 30 | {{/HEADER_TEMPLATE}} 31 | {{#BOX}} 32 | #FORM_OPEN# 33 | 34 | 35 | #REGION_POSITION_01# 36 | 37 | 38 |
39 |
40 | 61 |
62 | 63 | #SIDE_GLOBAL_NAVIGATION_LIST# 64 |
65 | 66 | 67 |
68 |
69 |
70 |
71 | #BODY# 72 |
73 | 74 | 75 | #REGION_POSITION_04# 76 |
77 |
78 |
79 | 80 |
81 | #SUCCESS_MESSAGE##NOTIFICATION_MESSAGE##GLOBAL_NOTIFICATION# 82 |
83 | 84 | #FORM_CLOSE# 85 | {{/BOX}} 86 | {{#FOOTER_TEMPLATE}} 87 | #FORM_CLOSE# 88 | #DEVELOPER_TOOLBAR# 89 | #APEX_JAVASCRIPT# 90 | #GENERATED_CSS# 91 | #THEME_JAVASCRIPT# 92 | #TEMPLATE_JAVASCRIPT# 93 | #APPLICATION_JAVASCRIPT# 94 | #PAGE_JAVASCRIPT# 95 | #GENERATED_JAVASCRIPT# 96 | 97 | 98 | 99 | {{/FOOTER_TEMPLATE}} 100 | 101 | {{#SUCCESS_MESSAGE}} 102 |
103 | 118 |
119 | {{/SUCCESS_MESSAGE}} 120 | {{#MESSAGE}} 121 |
122 | 137 |
138 | {{/MESSAGE}} 139 | 140 | {{#GRID_TEMPLATE}} 141 |
#ROWS#
142 | {{/GRID_TEMPLATE}} 143 | {{#GRID_ROW_TEMPLATE}} 144 |
#COLUMNS#
145 | {{/GRID_ROW_TEMPLATE}} 146 | {{#GRID_COLUMN_TEMPLATE}} 147 |
#CONTENT#
148 | {{/GRID_COLUMN_TEMPLATE}} 149 | 150 | {{#DIALOG_BROWSER_FRAME}} 151 | MODAL 152 | {{/DIALOG_BROWSER_FRAME}} 153 | {{#DIALOG_CSS_CLASSES}}{{/DIALOG_CSS_CLASSES}} 154 | {{#DIALOG_HEIGHT}}{{/DIALOG_HEIGHT}} 155 | {{#DIALOG_JS_CANCEL_CODE}} 156 | apex.navigation.dialog.cancel(#IS_MODAL#); 157 | {{/DIALOG_JS_CANCEL_CODE}} 158 | {{#DIALOG_JS_CLOSE_CODE}} 159 | apex.navigation.dialog.close(#IS_MODAL#,#TARGET#); 160 | {{/DIALOG_JS_CLOSE_CODE}} 161 | {{#DIALOG_JS_INIT_CODE}} 162 | apex.navigation.dialog(#PAGE_URL#,{title:#TITLE#,height:#DIALOG_HEIGHT#,width:#DIALOG_WIDTH#,maxWidth:#DIALOG_MAX_WIDTH#,modal:#IS_MODAL#,dialog:#DIALOG#,#DIALOG_ATTRIBUTES#},#DIALOG_CSS_CLASSES#,#TRIGGERING_ELEMENT#); 163 | {{/DIALOG_JS_INIT_CODE}} 164 | {{#DIALOG_MAX_WIDTH}}{{/DIALOG_MAX_WIDTH}} 165 | {{#DIALOG_WIDTH}}{{/DIALOG_WIDTH}} 166 | 167 | {{#TEMPLATE_OPTION_GROUPS}} 168 | [ 169 | { 170 | "NAME": "PAGE_LOGO_ALIGNMENT", 171 | "DISPLAY_NAME": "Logo Alignment", 172 | "DISPLAY_SEQUENCE": 0, 173 | "HELP_TEXT": "The font size of your region title", 174 | "NULL_TEXT": "", 175 | "IS_ADVANCED": "N", 176 | "TEMPLATE_OPTIONS": [ 177 | { 178 | "NAME": "PAGE_LOGO_ALIGNMENT_LEFT", 179 | "DISPLAY_NAME": "Left", 180 | "DISPLAY_SEQUENCE": 10, 181 | "CSS_CLASSES": "page-left-logo", 182 | "HELP_TEXT": "" 183 | }, 184 | { 185 | "NAME": "PAGE_LOGO_ALIGNMENT_CENTER", 186 | "DISPLAY_NAME": "Center", 187 | "DISPLAY_SEQUENCE": 20, 188 | "CSS_CLASSES": "page-center-logo", 189 | "HELP_TEXT": "" 190 | } 191 | ] 192 | }, 193 | { 194 | "NAME": "PAGE_NAVBAR_STYLE", 195 | "DISPLAY_NAME": "Navigation Bar Style", 196 | "DISPLAY_SEQUENCE": 20, 197 | "HELP_TEXT": "", 198 | "NULL_TEXT": "", 199 | "IS_ADVANCED": "N", 200 | "TEMPLATE_OPTIONS": [ 201 | { 202 | "NAME": "PAGE_NAVBAR_STYLE_STANDARD", 203 | "DISPLAY_NAME": "Standard", 204 | "DISPLAY_SEQUENCE": 10, 205 | "CSS_CLASSES": "ma-page-navbar--standard", 206 | "HELP_TEXT": "" 207 | }, 208 | { 209 | "NAME": "PAGE_NAVBAR_STYLE_TRANSPARENT", 210 | "DISPLAY_NAME": "Transparent", 211 | "DISPLAY_SEQUENCE": 20, 212 | "CSS_CLASSES": "ma-page-navbar--transparent", 213 | "HELP_TEXT": "" 214 | } 215 | ] 216 | } 217 | ] 218 | {{/TEMPLATE_OPTION_GROUPS}} 219 | {{#TEMPLATE_OPTIONS}} 220 | [ 221 | { 222 | "NAME": "CONTAINER", 223 | "DISPLAY_NAME": "Wrap Page in a Container", 224 | "DISPLAY_SEQUENCE": 1, 225 | "CSS_CLASSES": "main-container", 226 | "HELP_TEXT": "", 227 | "IS_ADVANCED": "" 228 | }, 229 | { 230 | "NAME": "NAVIGATION_BAR_FIXED", 231 | "DISPLAY_NAME": "Navigation Bar Fixed", 232 | "DISPLAY_SEQUENCE": 3, 233 | "CSS_CLASSES": "page-navbar-fixed", 234 | "HELP_TEXT": "", 235 | "IS_ADVANCED": "" 236 | }, 237 | { 238 | "NAME": "SIDE_NAVIGATION_FIXED", 239 | "DISPLAY_NAME": "Side Navigation Fixed", 240 | "DISPLAY_SEQUENCE": 4, 241 | "CSS_CLASSES": "ma-sidenav-fixed", 242 | "HELP_TEXT": "", 243 | "IS_ADVANCED": "" 244 | } 245 | ] 246 | {{/TEMPLATE_OPTIONS}} 247 | {{#DEFAULT_TEMPLATE_OPTIONS}} 248 | main-container:page-navbar-fixed 249 | {{/DEFAULT_TEMPLATE_OPTIONS}} 250 | {{#PRESET_TEMPLATE_OPTIONS}} 251 | page-center-logo:ma-page-navbar--standard 252 | {{/PRESET_TEMPLATE_OPTIONS}} 253 | -------------------------------------------------------------------------------- /templates/Pages/~global.template.options.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE_OPTION_GROUPS}} 2 | [] 3 | {{/TEMPLATE_OPTION_GROUPS}} 4 | {{#TEMPLATE_OPTIONS}} 5 | [] 6 | {{/TEMPLATE_OPTIONS}} 7 | -------------------------------------------------------------------------------- /templates/Regions/Blockquote.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 |
3 |
#PREVIOUS#
4 | 5 |
6 |
7 |
8 |
#TITLE#
9 |
10 |
#EDIT#
11 |
12 | 13 |
14 |
#COPY#
15 |
16 |
#EXPAND#
17 |
18 | 19 |
#BODY##SUB_REGIONS#
20 | 21 |
22 |
#CLOSE##HELP#
23 |
#CHANGE#
24 |
#DELETE##CREATE##CREATE2#
25 |
26 |
27 | 28 |
#NEXT#
29 |
30 | 31 | {{/TEMPLATE}} 32 | {{#SUB_PLUG_HEADER_TEMPLATE}}{{/SUB_PLUG_HEADER_TEMPLATE}} 33 | {{#SUB_PLUG_HEADER_ENTRY_TEMPLATE}}{{/SUB_PLUG_HEADER_ENTRY_TEMPLATE}} 34 | {{#SUB_PLUG_TEMPLATE}}{{/SUB_PLUG_TEMPLATE}} 35 | 36 | {{#TEMPLATE_OPTION_GROUPS}} 37 | [ 38 | { 39 | "NAME": "TITLE_SIZE", 40 | "DISPLAY_NAME": "Title Size", 41 | "DISPLAY_SEQUENCE": 0, 42 | "HELP_TEXT": "The font size of your region title", 43 | "NULL_TEXT": "", 44 | "IS_ADVANCED": "N", 45 | "TEMPLATE_OPTIONS": [ 46 | { 47 | "NAME": "HIDDEN", 48 | "DISPLAY_NAME": "Hidden", 49 | "DISPLAY_SEQUENCE": 0, 50 | "CSS_CLASSES": "hide-title", 51 | "HELP_TEXT": "" 52 | }, 53 | { 54 | "NAME": "H1", 55 | "DISPLAY_NAME": "H1", 56 | "DISPLAY_SEQUENCE": 1, 57 | "CSS_CLASSES": "h1", 58 | "HELP_TEXT": "" 59 | }, 60 | { 61 | "NAME": "H2", 62 | "DISPLAY_NAME": "H2", 63 | "DISPLAY_SEQUENCE": 2, 64 | "CSS_CLASSES": "h2", 65 | "HELP_TEXT": "" 66 | }, 67 | { 68 | "NAME": "H3", 69 | "DISPLAY_NAME": "H3", 70 | "DISPLAY_SEQUENCE": 3, 71 | "CSS_CLASSES": "h3", 72 | "HELP_TEXT": "" 73 | }, 74 | { 75 | "NAME": "H4", 76 | "DISPLAY_NAME": "H4", 77 | "DISPLAY_SEQUENCE": 4, 78 | "CSS_CLASSES": "h4", 79 | "HELP_TEXT": "" 80 | }, 81 | { 82 | "NAME": "H5", 83 | "DISPLAY_NAME": "H5", 84 | "DISPLAY_SEQUENCE": 5, 85 | "CSS_CLASSES": "h5", 86 | "HELP_TEXT": "" 87 | }, 88 | { 89 | "NAME": "H6", 90 | "DISPLAY_NAME": "H6", 91 | "DISPLAY_SEQUENCE": 6, 92 | "CSS_CLASSES": "h6", 93 | "HELP_TEXT": "" 94 | } 95 | ] 96 | } 97 | ] 98 | {{/TEMPLATE_OPTION_GROUPS}} 99 | {{#TEMPLATE_OPTIONS}} 100 | [] 101 | {{/TEMPLATE_OPTIONS}} 102 | {{#DEFAULT_TEMPLATE_OPTIONS}} 103 | h6 104 | {{/DEFAULT_TEMPLATE_OPTIONS}} 105 | {{#PRESET_TEMPLATE_OPTIONS}} 106 | {{/PRESET_TEMPLATE_OPTIONS}} 107 | -------------------------------------------------------------------------------- /templates/Regions/Card.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 |
3 |
4 |
#PREVIOUS#
5 | 6 |
7 |
8 |
9 |
#TITLE#
10 |
11 |
#EDIT#
12 |
13 | 14 |
15 |
#COPY#
16 |
17 |
#EXPAND#
18 |
19 | 20 |
#BODY##SUB_REGIONS#
21 | 22 |
23 | 24 |
#NEXT#
25 |
26 | 27 |
28 |
#CLOSE##HELP#
29 |
#CHANGE#
30 |
#DELETE##CREATE##CREATE2#
31 |
32 |
33 | {{/TEMPLATE}} 34 | {{#SUB_PLUG_HEADER_TEMPLATE}}{{/SUB_PLUG_HEADER_TEMPLATE}} 35 | {{#SUB_PLUG_HEADER_ENTRY_TEMPLATE}}{{/SUB_PLUG_HEADER_ENTRY_TEMPLATE}} 36 | {{#SUB_PLUG_TEMPLATE}}{{/SUB_PLUG_TEMPLATE}} 37 | 38 | {{#TEMPLATE_OPTION_GROUPS}} 39 | [ 40 | { 41 | "NAME": "TITLE_SIZE", 42 | "DISPLAY_NAME": "Title Size", 43 | "DISPLAY_SEQUENCE": 0, 44 | "HELP_TEXT": "The font size of your region title", 45 | "NULL_TEXT": "Default", 46 | "IS_ADVANCED": "N", 47 | "TEMPLATE_OPTIONS": [ 48 | { 49 | "NAME": "HIDDEN", 50 | "DISPLAY_NAME": "Hidden", 51 | "DISPLAY_SEQUENCE": 0, 52 | "CSS_CLASSES": "hide-title", 53 | "HELP_TEXT": "" 54 | }, 55 | { 56 | "NAME": "H1", 57 | "DISPLAY_NAME": "H1", 58 | "DISPLAY_SEQUENCE": 1, 59 | "CSS_CLASSES": "h1", 60 | "HELP_TEXT": "" 61 | }, 62 | { 63 | "NAME": "H2", 64 | "DISPLAY_NAME": "H2", 65 | "DISPLAY_SEQUENCE": 2, 66 | "CSS_CLASSES": "h2", 67 | "HELP_TEXT": "" 68 | }, 69 | { 70 | "NAME": "H3", 71 | "DISPLAY_NAME": "H3", 72 | "DISPLAY_SEQUENCE": 3, 73 | "CSS_CLASSES": "h3", 74 | "HELP_TEXT": "" 75 | }, 76 | { 77 | "NAME": "H4", 78 | "DISPLAY_NAME": "H4", 79 | "DISPLAY_SEQUENCE": 4, 80 | "CSS_CLASSES": "h4", 81 | "HELP_TEXT": "" 82 | }, 83 | { 84 | "NAME": "H5", 85 | "DISPLAY_NAME": "H5", 86 | "DISPLAY_SEQUENCE": 5, 87 | "CSS_CLASSES": "h5", 88 | "HELP_TEXT": "" 89 | }, 90 | { 91 | "NAME": "H6", 92 | "DISPLAY_NAME": "H6", 93 | "DISPLAY_SEQUENCE": 6, 94 | "CSS_CLASSES": "h6", 95 | "HELP_TEXT": "" 96 | } 97 | ] 98 | } 99 | ] 100 | {{/TEMPLATE_OPTION_GROUPS}} 101 | {{#TEMPLATE_OPTIONS}} 102 | [ 103 | { 104 | "NAME": "CARD_HOVERABLE", 105 | "DISPLAY_NAME": "Hoverable", 106 | "DISPLAY_SEQUENCE": 10, 107 | "CSS_CLASSES": "hoverable", 108 | "HELP_TEXT": "Adds an animation for a box shadow around the card.", 109 | "IS_ADVANCED": "" 110 | }, 111 | { 112 | "NAME": "HIDE_TITLE", 113 | "DISPLAY_NAME": "Hide Title", 114 | "DISPLAY_SEQUENCE": 20, 115 | "CSS_CLASSES": "hide-title", 116 | "HELP_TEXT": "", 117 | "IS_ADVANCED": "" 118 | }, 119 | { 120 | "NAME": "NOBODYPADDING", 121 | "DISPLAY_NAME": "Remove Body Padding", 122 | "DISPLAY_SEQUENCE": 30, 123 | "CSS_CLASSES": "ma-region--no-padding", 124 | "HELP_TEXT": "Removes padding from region body.", 125 | "IS_ADVANCED": "N" 126 | } 127 | ] 128 | {{/TEMPLATE_OPTIONS}} 129 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 130 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 131 | -------------------------------------------------------------------------------- /templates/Regions/Carousel.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 | 5 | {{/TEMPLATE}} 6 | {{#SUB_PLUG_HEADER_TEMPLATE}}{{/SUB_PLUG_HEADER_TEMPLATE}} 7 | {{#SUB_PLUG_HEADER_ENTRY_TEMPLATE}}{{/SUB_PLUG_HEADER_ENTRY_TEMPLATE}} 8 | {{#SUB_PLUG_TEMPLATE}} 9 |
#SUB_REGION#
10 | {{/SUB_PLUG_TEMPLATE}} 11 | 12 | {{#TEMPLATE_OPTION_GROUPS}} 13 | [] 14 | {{/TEMPLATE_OPTION_GROUPS}} 15 | {{#TEMPLATE_OPTIONS}} 16 | [ 17 | { 18 | "NAME": "CAROUSEL_SLIDER", 19 | "DISPLAY_NAME": "Full Width Carousel", 20 | "DISPLAY_SEQUENCE": 1, 21 | "CSS_CLASSES": "carousel-slider", 22 | "HELP_TEXT": "Our carousel has a full width option that makes it into a simple and elegant image carousel", 23 | "IS_ADVANCED": "" 24 | } 25 | ] 26 | {{/TEMPLATE_OPTIONS}} 27 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 28 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 29 | -------------------------------------------------------------------------------- /templates/Regions/Collapsible.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 | 3 | {{/TEMPLATE}} 4 | {{#SUB_PLUG_HEADER_TEMPLATE}}{{/SUB_PLUG_HEADER_TEMPLATE}} 5 | {{#SUB_PLUG_HEADER_ENTRY_TEMPLATE}}{{/SUB_PLUG_HEADER_ENTRY_TEMPLATE}} 6 | {{#SUB_PLUG_TEMPLATE}} 7 |
  • 8 |
    #SUB_REGION_TITLE#
    9 |
    #SUB_REGION#
    10 |
    • 11 | {{/SUB_PLUG_TEMPLATE}} 12 | 13 | {{#TEMPLATE_OPTION_GROUPS}} 14 | [ 15 | { 16 | "NAME": "COLLAPSIBLE_BEHAVIOR", 17 | "DISPLAY_NAME": "Collapsible Behavior", 18 | "DISPLAY_SEQUENCE": 1, 19 | "HELP_TEXT": "", 20 | "NULL_TEXT": "", 21 | "IS_ADVANCED": "N", 22 | "TEMPLATE_OPTIONS": [ 23 | { 24 | "NAME": "ACCORDION", 25 | "DISPLAY_NAME": "Accordion", 26 | "DISPLAY_SEQUENCE": 1, 27 | "CSS_CLASSES": "ma-collapsible-accordion", 28 | "HELP_TEXT": "" 29 | }, 30 | { 31 | "NAME": "EXPANDABLE", 32 | "DISPLAY_NAME": "Expandable", 33 | "DISPLAY_SEQUENCE": 2, 34 | "CSS_CLASSES": "ma-collapsible-expandable", 35 | "HELP_TEXT": "" 36 | } 37 | ] 38 | } 39 | ] 40 | {{/TEMPLATE_OPTION_GROUPS}} 41 | {{#TEMPLATE_OPTIONS}} 42 | [ 43 | { 44 | "NAME": "POPOUT", 45 | "DISPLAY_NAME": "Popout", 46 | "DISPLAY_SEQUENCE": 1, 47 | "CSS_CLASSES": "popout", 48 | "HELP_TEXT": "", 49 | "IS_ADVANCED": "" 50 | } 51 | ] 52 | {{/TEMPLATE_OPTIONS}} 53 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 54 | {{#PRESET_TEMPLATE_OPTIONS}} 55 | ma-collapsible-accordion 56 | {{/PRESET_TEMPLATE_OPTIONS}} 57 | -------------------------------------------------------------------------------- /templates/Regions/Modal.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 | 8 | 9 | {{/TEMPLATE}} 10 | {{#SUB_PLUG_HEADER_TEMPLATE}}{{/SUB_PLUG_HEADER_TEMPLATE}} 11 | {{#SUB_PLUG_HEADER_ENTRY_TEMPLATE}}{{/SUB_PLUG_HEADER_ENTRY_TEMPLATE}} 12 | {{#SUB_PLUG_TEMPLATE}}{{/SUB_PLUG_TEMPLATE}} 13 | 14 | {{#TEMPLATE_OPTION_GROUPS}} 15 | [] 16 | {{/TEMPLATE_OPTION_GROUPS}} 17 | {{#TEMPLATE_OPTIONS}} 18 | [ 19 | { 20 | "NAME": "BOTTOM_SHEET", 21 | "DISPLAY_NAME": "Bottom Sheet", 22 | "DISPLAY_SEQUENCE": 1, 23 | "CSS_CLASSES": "bottom-sheet", 24 | "HELP_TEXT": "", 25 | "IS_ADVANCED": "" 26 | } 27 | ] 28 | {{/TEMPLATE_OPTIONS}} 29 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 30 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 31 | -------------------------------------------------------------------------------- /templates/Regions/Parallax.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 |
    3 |
    #BODY#
    4 |
    #SUB_REGION_HEADERS##SUB_REGIONS#
    5 |
    6 | 7 | {{/TEMPLATE}} 8 | {{#SUB_PLUG_HEADER_TEMPLATE}}{{/SUB_PLUG_HEADER_TEMPLATE}} 9 | {{#SUB_PLUG_HEADER_ENTRY_TEMPLATE}}{{/SUB_PLUG_HEADER_ENTRY_TEMPLATE}} 10 | {{#SUB_PLUG_TEMPLATE}}{{/SUB_PLUG_TEMPLATE}} 11 | 12 | {{#TEMPLATE_OPTION_GROUPS}} 13 | [] 14 | {{/TEMPLATE_OPTION_GROUPS}} 15 | {{#TEMPLATE_OPTIONS}} 16 | [] 17 | {{/TEMPLATE_OPTIONS}} 18 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 19 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 20 | -------------------------------------------------------------------------------- /templates/Regions/Promo.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 |
    3 | 4 |
    #TITLE#
    5 |
    #BODY#
    6 |
    7 | {{/TEMPLATE}} 8 | {{#SUB_PLUG_HEADER_TEMPLATE}}{{/SUB_PLUG_HEADER_TEMPLATE}} 9 | {{#SUB_PLUG_HEADER_ENTRY_TEMPLATE}}{{/SUB_PLUG_HEADER_ENTRY_TEMPLATE}} 10 | {{#SUB_PLUG_TEMPLATE}}{{/SUB_PLUG_TEMPLATE}} 11 | 12 | {{#TEMPLATE_OPTION_GROUPS}} 13 | [] 14 | {{/TEMPLATE_OPTION_GROUPS}} 15 | {{#TEMPLATE_OPTIONS}} 16 | [] 17 | {{/TEMPLATE_OPTIONS}} 18 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 19 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 20 | -------------------------------------------------------------------------------- /templates/Regions/Slider.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 |
    3 |
    #BODY#
    4 | 5 |
    6 | 7 | {{/TEMPLATE}} 8 | {{#SUB_PLUG_HEADER_TEMPLATE}}{{/SUB_PLUG_HEADER_TEMPLATE}} 9 | {{#SUB_PLUG_HEADER_ENTRY_TEMPLATE}}{{/SUB_PLUG_HEADER_ENTRY_TEMPLATE}} 10 | {{#SUB_PLUG_TEMPLATE}} 11 |
  • #SUB_REGION#
    • 12 | 13 | {{/SUB_PLUG_TEMPLATE}} 14 | 15 | {{#TEMPLATE_OPTION_GROUPS}} 16 | [] 17 | {{/TEMPLATE_OPTION_GROUPS}} 18 | {{#TEMPLATE_OPTIONS}} 19 | [ 20 | { 21 | "NAME": "SLIDER_FULLSCREEN", 22 | "DISPLAY_NAME": "Fullscreen", 23 | "DISPLAY_SEQUENCE": 1, 24 | "CSS_CLASSES": "fullscreen", 25 | "HELP_TEXT": "", 26 | "IS_ADVANCED": "" 27 | } 28 | ] 29 | {{/TEMPLATE_OPTIONS}} 30 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 31 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 32 | -------------------------------------------------------------------------------- /templates/Regions/Standard.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 |
    3 |
    #PREVIOUS#
    4 | 5 |
    6 |
    7 |
    8 |
    #TITLE#
    9 |
    10 |
    #EDIT#
    11 |
    12 | 13 |
    14 |
    #COPY#
    15 |
    16 |
    #EXPAND#
    17 |
    18 | 19 |
    #BODY##SUB_REGIONS#
    20 | 21 |
    22 |
    #CLOSE##HELP#
    23 |
    #CHANGE#
    24 |
    #DELETE##CREATE##CREATE2#
    25 |
    26 |
    27 | 28 |
    #NEXT#
    29 |
    30 | 31 | {{/TEMPLATE}} 32 | {{#SUB_PLUG_HEADER_TEMPLATE}}{{/SUB_PLUG_HEADER_TEMPLATE}} 33 | {{#SUB_PLUG_HEADER_ENTRY_TEMPLATE}}{{/SUB_PLUG_HEADER_ENTRY_TEMPLATE}} 34 | {{#SUB_PLUG_TEMPLATE}}{{/SUB_PLUG_TEMPLATE}} 35 | 36 | {{#TEMPLATE_OPTION_GROUPS}} 37 | [ 38 | { 39 | "NAME": "TITLE_SIZE", 40 | "DISPLAY_NAME": "Title Size", 41 | "DISPLAY_SEQUENCE": 0, 42 | "HELP_TEXT": "The font size of your region title", 43 | "NULL_TEXT": "", 44 | "IS_ADVANCED": "N", 45 | "TEMPLATE_OPTIONS": [ 46 | { 47 | "NAME": "HIDDEN", 48 | "DISPLAY_NAME": "Hidden", 49 | "DISPLAY_SEQUENCE": 0, 50 | "CSS_CLASSES": "hide-title", 51 | "HELP_TEXT": "" 52 | }, 53 | { 54 | "NAME": "H1", 55 | "DISPLAY_NAME": "H1", 56 | "DISPLAY_SEQUENCE": 1, 57 | "CSS_CLASSES": "h1", 58 | "HELP_TEXT": "" 59 | }, 60 | { 61 | "NAME": "H2", 62 | "DISPLAY_NAME": "H2", 63 | "DISPLAY_SEQUENCE": 2, 64 | "CSS_CLASSES": "h2", 65 | "HELP_TEXT": "" 66 | }, 67 | { 68 | "NAME": "H3", 69 | "DISPLAY_NAME": "H3", 70 | "DISPLAY_SEQUENCE": 3, 71 | "CSS_CLASSES": "h3", 72 | "HELP_TEXT": "" 73 | }, 74 | { 75 | "NAME": "H4", 76 | "DISPLAY_NAME": "H4", 77 | "DISPLAY_SEQUENCE": 4, 78 | "CSS_CLASSES": "h4", 79 | "HELP_TEXT": "" 80 | }, 81 | { 82 | "NAME": "H5", 83 | "DISPLAY_NAME": "H5", 84 | "DISPLAY_SEQUENCE": 5, 85 | "CSS_CLASSES": "h5", 86 | "HELP_TEXT": "" 87 | }, 88 | { 89 | "NAME": "H6", 90 | "DISPLAY_NAME": "H6", 91 | "DISPLAY_SEQUENCE": 6, 92 | "CSS_CLASSES": "h6", 93 | "HELP_TEXT": "" 94 | } 95 | ] 96 | } 97 | ] 98 | {{/TEMPLATE_OPTION_GROUPS}} 99 | {{#TEMPLATE_OPTIONS}} 100 | [] 101 | {{/TEMPLATE_OPTIONS}} 102 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 103 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 104 | -------------------------------------------------------------------------------- /templates/Regions/Tabs.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE}} 2 |
    #SUB_REGION_HEADERS##SUB_REGIONS#
    3 | {{/TEMPLATE}} 4 | {{#SUB_PLUG_HEADER_TEMPLATE}} 5 | 6 | {{/SUB_PLUG_HEADER_TEMPLATE}} 7 | {{#SUB_PLUG_HEADER_ENTRY_TEMPLATE}} 8 |
  • 9 | 10 | #SUB_REGION_TITLE# 11 | 12 |
    • 13 | {{/SUB_PLUG_HEADER_ENTRY_TEMPLATE}} 14 | {{#SUB_PLUG_TEMPLATE}} 15 |
    #SUB_REGION#
    16 | {{/SUB_PLUG_TEMPLATE}} 17 | 18 | {{#TEMPLATE_OPTION_GROUPS}} 19 | [ 20 | { 21 | "NAME": "TABS_POSITION", 22 | "DISPLAY_NAME": "Position", 23 | "DISPLAY_SEQUENCE": 0, 24 | "HELP_TEXT": "The position of your tabs", 25 | "NULL_TEXT": "Default", 26 | "IS_ADVANCED": "N", 27 | "TEMPLATE_OPTIONS": [ 28 | { 29 | "NAME": "TABS_POSITION_BOTTOM", 30 | "DISPLAY_NAME": "Fixed Bottom - Always", 31 | "DISPLAY_SEQUENCE": 10, 32 | "CSS_CLASSES": "ma-tabs-position-bottom", 33 | "HELP_TEXT": "" 34 | }, 35 | { 36 | "NAME": "TABS_POSITION_BOTTOM_MOBILE", 37 | "DISPLAY_NAME": "Fixed Bottom - Mobile Only", 38 | "DISPLAY_SEQUENCE": 20, 39 | "CSS_CLASSES": "ma-tabs-position-bottom-mobile", 40 | "HELP_TEXT": "" 41 | } 42 | ] 43 | } 44 | ] 45 | {{/TEMPLATE_OPTION_GROUPS}} 46 | {{#TEMPLATE_OPTIONS}} 47 | [ 48 | { 49 | "NAME": "REMEMBER_ACTIVE_TAB", 50 | "DISPLAY_NAME": "Remember Active Tab", 51 | "DISPLAY_SEQUENCE": 10, 52 | "CSS_CLASSES": "js-useLocalStorage", 53 | "HELP_TEXT": "", 54 | "IS_ADVANCED": "" 55 | }, 56 | { 57 | "NAME": "TABS_TRANSPARENT", 58 | "DISPLAY_NAME": "Tabs Transparent", 59 | "DISPLAY_SEQUENCE": 20, 60 | "CSS_CLASSES": "tabs-transparent", 61 | "HELP_TEXT": "", 62 | "IS_ADVANCED": "" 63 | } 64 | ] 65 | {{/TEMPLATE_OPTIONS}} 66 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 67 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 68 | -------------------------------------------------------------------------------- /templates/ReportGenericColumns/Standard.hbs: -------------------------------------------------------------------------------- 1 | {{#ROW_TEMPLATE_BEFORE_ROWS}} 2 | 3 | {{/ROW_TEMPLATE_BEFORE_ROWS}} 4 | 5 | {{#BEFORE_COLUMN_HEADING}} 6 | 7 | 8 | {{/BEFORE_COLUMN_HEADING}} 9 | {{#COLUMN_HEADING_TEMPLATE}} 10 | 11 | {{/COLUMN_HEADING_TEMPLATE}} 12 | {{#AFTER_COLUMN_HEADING}} 13 | 14 | 15 | 16 | {{/AFTER_COLUMN_HEADING}} 17 | 18 | {{#ROW_TEMPLATE_BEFORE_FIRST}} 19 | 20 | {{/ROW_TEMPLATE_BEFORE_FIRST}} 21 | 22 | {{#ROW_TEMPLATE1}} 23 | 24 | {{/ROW_TEMPLATE1}} 25 | {{#ROW_TEMPLATE_CONDITION1}}{{/ROW_TEMPLATE_CONDITION1}} 26 | {{#ROW_TEMPLATE_DISPLAY_COND1}} 27 | 0 28 | {{/ROW_TEMPLATE_DISPLAY_COND1}} 29 | {{#ROW_TEMPLATE2}}{{/ROW_TEMPLATE2}} 30 | {{#ROW_TEMPLATE_CONDITION2}}{{/ROW_TEMPLATE_CONDITION2}} 31 | {{#ROW_TEMPLATE_DISPLAY_COND2}} 32 | 0 33 | {{/ROW_TEMPLATE_DISPLAY_COND2}} 34 | {{#ROW_TEMPLATE3}}{{/ROW_TEMPLATE3}} 35 | {{#ROW_TEMPLATE_CONDITION3}}{{/ROW_TEMPLATE_CONDITION3}} 36 | {{#ROW_TEMPLATE_DISPLAY_COND3}} 37 | 0 38 | {{/ROW_TEMPLATE_DISPLAY_COND3}} 39 | {{#ROW_TEMPLATE4}}{{/ROW_TEMPLATE4}} 40 | {{#ROW_TEMPLATE_CONDITION4}}{{/ROW_TEMPLATE_CONDITION4}} 41 | {{#ROW_TEMPLATE_DISPLAY_COND4}} 42 | 0 43 | {{/ROW_TEMPLATE_DISPLAY_COND4}} 44 | 45 | {{#ROW_TEMPLATE_AFTER_LAST}} 46 | 47 | 48 | {{/ROW_TEMPLATE_AFTER_LAST}} 49 | 50 | {{#ROW_TEMPLATE_AFTER_ROWS}} 51 | 52 |
    #COLUMN_HEADER#
    #COLUMN_VALUE#
    53 | 54 |
    #EXTERNAL_LINK##CSV_LINK#
    55 |
    #PAGINATION#
    56 | 57 | {{/ROW_TEMPLATE_AFTER_ROWS}} 58 | 59 | {{#PAGINATION_TEMPLATE}} 60 | #TEXT# 61 | {{/PAGINATION_TEMPLATE}} 62 | {{#NEXT_PAGE_TEMPLATE}} 63 | 64 | {{/NEXT_PAGE_TEMPLATE}} 65 | {{#PREVIOUS_PAGE_TEMPLATE}} 66 | 67 | {{/PREVIOUS_PAGE_TEMPLATE}} 68 | {{#NEXT_SET_TEMPLATE}} 69 | 70 | {{/NEXT_SET_TEMPLATE}} 71 | {{#PREVIOUS_SET_TEMPLATE}} 72 | 73 | {{/PREVIOUS_SET_TEMPLATE}} 74 | 75 | {{#TEMPLATE_OPTION_GROUPS}} 76 | [ 77 | { 78 | "NAME": "RESPONSIVE_BEHAVIOR", 79 | "DISPLAY_NAME": "Responsive Behavior", 80 | "DISPLAY_SEQUENCE": 1, 81 | "HELP_TEXT": "", 82 | "NULL_TEXT": "", 83 | "IS_ADVANCED": "N", 84 | "TEMPLATE_OPTIONS": [ 85 | { 86 | "NAME": "RESPONSIVE", 87 | "DISPLAY_NAME": "Style 1", 88 | "DISPLAY_SEQUENCE": 1, 89 | "CSS_CLASSES": "responsive-table", 90 | "HELP_TEXT": "" 91 | }, 92 | { 93 | "NAME": "STYLE_2", 94 | "DISPLAY_NAME": "Style 2", 95 | "DISPLAY_SEQUENCE": 2, 96 | "CSS_CLASSES": "table-responsive", 97 | "HELP_TEXT": "" 98 | } 99 | ] 100 | } 101 | ] 102 | {{/TEMPLATE_OPTION_GROUPS}} 103 | {{#TEMPLATE_OPTIONS}} 104 | [ 105 | { 106 | "NAME": "BORDERLESS", 107 | "DISPLAY_NAME": "Borderless", 108 | "DISPLAY_SEQUENCE": 1, 109 | "CSS_CLASSES": "borderless", 110 | "HELP_TEXT": "", 111 | "IS_ADVANCED": "" 112 | }, 113 | { 114 | "NAME": "STRIPED", 115 | "DISPLAY_NAME": "Striped", 116 | "DISPLAY_SEQUENCE": 2, 117 | "CSS_CLASSES": "striped", 118 | "HELP_TEXT": "", 119 | "IS_ADVANCED": "" 120 | }, 121 | { 122 | "NAME": "HOVERABLE", 123 | "DISPLAY_NAME": "Hoverable", 124 | "DISPLAY_SEQUENCE": 3, 125 | "CSS_CLASSES": "highlight", 126 | "HELP_TEXT": "", 127 | "IS_ADVANCED": "" 128 | } 129 | ] 130 | {{/TEMPLATE_OPTIONS}} 131 | {{#DEFAULT_TEMPLATE_OPTIONS}} 132 | borderless 133 | {{/DEFAULT_TEMPLATE_OPTIONS}} 134 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 135 | -------------------------------------------------------------------------------- /templates/ReportGenericColumns/~global.template.options.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE_OPTION_GROUPS}} 2 | [] 3 | {{/TEMPLATE_OPTION_GROUPS}} 4 | {{#TEMPLATE_OPTIONS}} 5 | [] 6 | {{/TEMPLATE_OPTIONS}} 7 | -------------------------------------------------------------------------------- /templates/ReportNamedColumns/Cards.hbs: -------------------------------------------------------------------------------- 1 | {{#ROW_TEMPLATE_BEFORE_ROWS}} 2 |
    3 | {{/ROW_TEMPLATE_BEFORE_ROWS}} 4 | 5 | {{#BEFORE_COLUMN_HEADING}}{{/BEFORE_COLUMN_HEADING}} 6 | 7 | {{#COLUMN_HEADING_TEMPLATE}}{{/COLUMN_HEADING_TEMPLATE}} 8 | 9 | {{#AFTER_COLUMN_HEADING}}{{/AFTER_COLUMN_HEADING}} 10 | 11 | {{#ROW_TEMPLATE_BEFORE_FIRST}}{{/ROW_TEMPLATE_BEFORE_FIRST}} 12 | 13 | {{#ROW_TEMPLATE1}} 14 |
    15 |
    16 |
    17 | 18 | #TITLE# 19 | 20 | 21 | 22 |
    23 | 24 |
    25 |
    #CONTENT#
    26 |
    #BTN_LABEL_1##BTN_LABEL_2#
    27 |
    28 |
    29 |
    30 | {{/ROW_TEMPLATE1}} 31 | {{#ROW_TEMPLATE_CONDITION1}} 32 | :FAB_LINK is not null and :FAB_ICON_CSS_CLASSES is not null and :IMG_SRC is not null 33 | {{/ROW_TEMPLATE_CONDITION1}} 34 | {{#ROW_TEMPLATE_DISPLAY_COND1}} 35 | NOT_CONDITIONAL 36 | {{/ROW_TEMPLATE_DISPLAY_COND1}} 37 | {{#ROW_TEMPLATE2}} 38 |
    39 |
    40 |
    41 | 42 | #TITLE# 43 |
    44 |
    45 |
    46 |

    #CONTENT#

    47 |
    48 |
    #BTN_LABEL_1##BTN_LABEL_2#
    49 |
    50 |
    51 | 52 |
    53 |
    54 | 55 |
    56 |
    57 | #TITLE# 58 |
    59 |
    #BTN_LABEL_1##BTN_LABEL_2#
    60 |
    61 | #TITLE# 62 |

    #CONTENT#

    63 |
    64 |
    65 |
    66 | {{/ROW_TEMPLATE2}} 67 | {{#ROW_TEMPLATE_CONDITION2}} 68 | :IMG_SRC is not null 69 | {{/ROW_TEMPLATE_CONDITION2}} 70 | {{#ROW_TEMPLATE_DISPLAY_COND2}} 71 | NOT_CONDITIONAL 72 | {{/ROW_TEMPLATE_DISPLAY_COND2}} 73 | {{#ROW_TEMPLATE3}} 74 |
    75 |
    76 |
    77 |

    #TITLE#

    78 |

    #CONTENT#

    79 |
    80 |
    #BTN_LABEL_1##BTN_LABEL_2#
    81 |
    82 |
    83 | {{/ROW_TEMPLATE3}} 84 | {{#ROW_TEMPLATE_CONDITION3}}{{/ROW_TEMPLATE_CONDITION3}} 85 | {{#ROW_TEMPLATE_DISPLAY_COND3}} 86 | 0 87 | {{/ROW_TEMPLATE_DISPLAY_COND3}} 88 | {{#ROW_TEMPLATE4}}{{/ROW_TEMPLATE4}} 89 | {{#ROW_TEMPLATE_CONDITION4}}{{/ROW_TEMPLATE_CONDITION4}} 90 | {{#ROW_TEMPLATE_DISPLAY_COND4}} 91 | NOT_CONDITIONAL 92 | {{/ROW_TEMPLATE_DISPLAY_COND4}} 93 | 94 | {{#ROW_TEMPLATE_AFTER_LAST}}{{/ROW_TEMPLATE_AFTER_LAST}} 95 | 96 | {{#ROW_TEMPLATE_AFTER_ROWS}} 97 |
    98 | {{/ROW_TEMPLATE_AFTER_ROWS}} 99 | 100 | {{#PAGINATION_TEMPLATE}}{{/PAGINATION_TEMPLATE}} 101 | {{#NEXT_PAGE_TEMPLATE}}{{/NEXT_PAGE_TEMPLATE}} 102 | {{#PREVIOUS_PAGE_TEMPLATE}}{{/PREVIOUS_PAGE_TEMPLATE}} 103 | {{#NEXT_SET_TEMPLATE}}{{/NEXT_SET_TEMPLATE}} 104 | {{#PREVIOUS_SET_TEMPLATE}}{{/PREVIOUS_SET_TEMPLATE}} 105 | 106 | {{#TEMPLATE_OPTION_GROUPS}} 107 | [ 108 | { 109 | "NAME": "CARD_COLUMNS", 110 | "DISPLAY_NAME": "Number of columns", 111 | "DISPLAY_SEQUENCE": 1, 112 | "HELP_TEXT": "", 113 | "NULL_TEXT": "", 114 | "IS_ADVANCED": "N", 115 | "TEMPLATE_OPTIONS": [ 116 | { 117 | "NAME": "CARD_COL1", 118 | "DISPLAY_NAME": "1 Column", 119 | "DISPLAY_SEQUENCE": 1, 120 | "CSS_CLASSES": "ma-card-col-1", 121 | "HELP_TEXT": "" 122 | }, 123 | { 124 | "NAME": "CARD_COL2", 125 | "DISPLAY_NAME": "2 Columns", 126 | "DISPLAY_SEQUENCE": 2, 127 | "CSS_CLASSES": "ma-card-col-2", 128 | "HELP_TEXT": "" 129 | }, 130 | { 131 | "NAME": "CARD_COL3", 132 | "DISPLAY_NAME": "3 Columns", 133 | "DISPLAY_SEQUENCE": 3, 134 | "CSS_CLASSES": "ma-card-col-3", 135 | "HELP_TEXT": "" 136 | }, 137 | { 138 | "NAME": "CARD_COL4", 139 | "DISPLAY_NAME": "4 Columns", 140 | "DISPLAY_SEQUENCE": 4, 141 | "CSS_CLASSES": "ma-card-col-4", 142 | "HELP_TEXT": "" 143 | } 144 | ] 145 | } 146 | ] 147 | {{/TEMPLATE_OPTION_GROUPS}} 148 | {{#TEMPLATE_OPTIONS}} 149 | [ 150 | { 151 | "NAME": "CARD_HORIZONTAL", 152 | "DISPLAY_NAME": "Horizontal", 153 | "DISPLAY_SEQUENCE": 1, 154 | "CSS_CLASSES": "ma-card-horizontal", 155 | "HELP_TEXT": "If the card contains an image, it will be displayed horizontally", 156 | "IS_ADVANCED": "" 157 | }, 158 | { 159 | "NAME": "CARD_HOVERABLE1", 160 | "DISPLAY_NAME": "Hoverable", 161 | "DISPLAY_SEQUENCE": 2, 162 | "CSS_CLASSES": "ma-card-hoverable", 163 | "HELP_TEXT": "", 164 | "IS_ADVANCED": "" 165 | }, 166 | { 167 | "NAME": "CARD_REVEAL", 168 | "DISPLAY_NAME": "Reveal Effect", 169 | "DISPLAY_SEQUENCE": 3, 170 | "CSS_CLASSES": "ma-card-reveal", 171 | "HELP_TEXT": "The content will unfold when clicking on the card.", 172 | "IS_ADVANCED": "Y" 173 | } 174 | ] 175 | {{/TEMPLATE_OPTIONS}} 176 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 177 | {{#PRESET_TEMPLATE_OPTIONS}} 178 | ma-card-col-3 179 | {{/PRESET_TEMPLATE_OPTIONS}} 180 | -------------------------------------------------------------------------------- /templates/ReportNamedColumns/Carousel.hbs: -------------------------------------------------------------------------------- 1 | {{#ROW_TEMPLATE_BEFORE_ROWS}} 2 |
    3 | {{/ROW_TEMPLATE_BEFORE_ROWS}} 4 | 5 | {{#BEFORE_COLUMN_HEADING}}{{/BEFORE_COLUMN_HEADING}} 6 | 7 | {{#COLUMN_HEADING_TEMPLATE}}{{/COLUMN_HEADING_TEMPLATE}} 8 | 9 | {{#AFTER_COLUMN_HEADING}}{{/AFTER_COLUMN_HEADING}} 10 | 11 | {{#ROW_TEMPLATE_BEFORE_FIRST}}{{/ROW_TEMPLATE_BEFORE_FIRST}} 12 | 13 | {{#ROW_TEMPLATE1}} 14 |
    15 | 16 |
    #TITLE#
    17 |
    #BODY#
    18 |
    19 | {{/ROW_TEMPLATE1}} 20 | {{#ROW_TEMPLATE_CONDITION1}}{{/ROW_TEMPLATE_CONDITION1}} 21 | {{#ROW_TEMPLATE_DISPLAY_COND1}} 22 | 0 23 | {{/ROW_TEMPLATE_DISPLAY_COND1}} 24 | {{#ROW_TEMPLATE2}}{{/ROW_TEMPLATE2}} 25 | {{#ROW_TEMPLATE_CONDITION2}}{{/ROW_TEMPLATE_CONDITION2}} 26 | {{#ROW_TEMPLATE_DISPLAY_COND2}} 27 | 0 28 | {{/ROW_TEMPLATE_DISPLAY_COND2}} 29 | {{#ROW_TEMPLATE3}}{{/ROW_TEMPLATE3}} 30 | {{#ROW_TEMPLATE_CONDITION3}}{{/ROW_TEMPLATE_CONDITION3}} 31 | {{#ROW_TEMPLATE_DISPLAY_COND3}} 32 | 0 33 | {{/ROW_TEMPLATE_DISPLAY_COND3}} 34 | {{#ROW_TEMPLATE4}}{{/ROW_TEMPLATE4}} 35 | {{#ROW_TEMPLATE_CONDITION4}}{{/ROW_TEMPLATE_CONDITION4}} 36 | {{#ROW_TEMPLATE_DISPLAY_COND4}} 37 | 0 38 | {{/ROW_TEMPLATE_DISPLAY_COND4}} 39 | 40 | {{#ROW_TEMPLATE_AFTER_LAST}}{{/ROW_TEMPLATE_AFTER_LAST}} 41 | 42 | {{#ROW_TEMPLATE_AFTER_ROWS}} 43 |
    44 | {{/ROW_TEMPLATE_AFTER_ROWS}} 45 | 46 | {{#PAGINATION_TEMPLATE}}{{/PAGINATION_TEMPLATE}} 47 | {{#NEXT_PAGE_TEMPLATE}}{{/NEXT_PAGE_TEMPLATE}} 48 | {{#PREVIOUS_PAGE_TEMPLATE}}{{/PREVIOUS_PAGE_TEMPLATE}} 49 | {{#NEXT_SET_TEMPLATE}}{{/NEXT_SET_TEMPLATE}} 50 | {{#PREVIOUS_SET_TEMPLATE}}{{/PREVIOUS_SET_TEMPLATE}} 51 | 52 | {{#TEMPLATE_OPTION_GROUPS}} 53 | [] 54 | {{/TEMPLATE_OPTION_GROUPS}} 55 | {{#TEMPLATE_OPTIONS}} 56 | [] 57 | {{/TEMPLATE_OPTIONS}} 58 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 59 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 60 | -------------------------------------------------------------------------------- /templates/ReportNamedColumns/Chips.hbs: -------------------------------------------------------------------------------- 1 | {{#ROW_TEMPLATE_BEFORE_ROWS}} 2 | 3 | {{/ROW_TEMPLATE_BEFORE_ROWS}} 4 | 5 | {{#BEFORE_COLUMN_HEADING}}{{/BEFORE_COLUMN_HEADING}} 6 | 7 | {{#COLUMN_HEADING_TEMPLATE}}{{/COLUMN_HEADING_TEMPLATE}} 8 | 9 | {{#AFTER_COLUMN_HEADING}}{{/AFTER_COLUMN_HEADING}} 10 | 11 | {{#ROW_TEMPLATE_BEFORE_FIRST}}{{/ROW_TEMPLATE_BEFORE_FIRST}} 12 | 13 | {{#ROW_TEMPLATE1}} 14 |
    15 | #IMAGE# 16 | #TEXT# 17 | 18 |
    19 | {{/ROW_TEMPLATE1}} 20 | {{#ROW_TEMPLATE_CONDITION1}} 21 | :IND_CLOSABLE is not null AND :IMAGE is not null 22 | {{/ROW_TEMPLATE_CONDITION1}} 23 | {{#ROW_TEMPLATE_DISPLAY_COND1}} 24 | NOT_CONDITIONAL 25 | {{/ROW_TEMPLATE_DISPLAY_COND1}} 26 | {{#ROW_TEMPLATE2}} 27 |
    28 | #IMAGE# 29 | #TEXT# 30 |
    31 | {{/ROW_TEMPLATE2}} 32 | {{#ROW_TEMPLATE_CONDITION2}} 33 | :IMAGE is not null 34 | {{/ROW_TEMPLATE_CONDITION2}} 35 | {{#ROW_TEMPLATE_DISPLAY_COND2}} 36 | NOT_CONDITIONAL 37 | {{/ROW_TEMPLATE_DISPLAY_COND2}} 38 | {{#ROW_TEMPLATE3}} 39 |
    40 | #TEXT# 41 | 42 |
    43 | {{/ROW_TEMPLATE3}} 44 | {{#ROW_TEMPLATE_CONDITION3}} 45 | :IND_CLOSABLE is not null 46 | {{/ROW_TEMPLATE_CONDITION3}} 47 | {{#ROW_TEMPLATE_DISPLAY_COND3}} 48 | NOT_CONDITIONAL 49 | {{/ROW_TEMPLATE_DISPLAY_COND3}} 50 | {{#ROW_TEMPLATE4}} 51 |
    52 | #TEXT# 53 |
    54 | {{/ROW_TEMPLATE4}} 55 | {{#ROW_TEMPLATE_CONDITION4}}{{/ROW_TEMPLATE_CONDITION4}} 56 | {{#ROW_TEMPLATE_DISPLAY_COND4}} 57 | NOT_CONDITIONAL 58 | {{/ROW_TEMPLATE_DISPLAY_COND4}} 59 | 60 | {{#ROW_TEMPLATE_AFTER_LAST}}{{/ROW_TEMPLATE_AFTER_LAST}} 61 | 62 | {{#ROW_TEMPLATE_AFTER_ROWS}} 63 | 64 | {{/ROW_TEMPLATE_AFTER_ROWS}} 65 | 66 | {{#PAGINATION_TEMPLATE}}{{/PAGINATION_TEMPLATE}} 67 | {{#NEXT_PAGE_TEMPLATE}}{{/NEXT_PAGE_TEMPLATE}} 68 | {{#PREVIOUS_PAGE_TEMPLATE}}{{/PREVIOUS_PAGE_TEMPLATE}} 69 | {{#NEXT_SET_TEMPLATE}}{{/NEXT_SET_TEMPLATE}} 70 | {{#PREVIOUS_SET_TEMPLATE}}{{/PREVIOUS_SET_TEMPLATE}} 71 | 72 | {{#TEMPLATE_OPTION_GROUPS}} 73 | [] 74 | {{/TEMPLATE_OPTION_GROUPS}} 75 | {{#TEMPLATE_OPTIONS}} 76 | [] 77 | {{/TEMPLATE_OPTIONS}} 78 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 79 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 80 | -------------------------------------------------------------------------------- /templates/ReportNamedColumns/Collapsible.hbs: -------------------------------------------------------------------------------- 1 | {{#ROW_TEMPLATE_BEFORE_ROWS}} 2 | 50 | {{/ROW_TEMPLATE_AFTER_ROWS}} 51 | 52 | {{#PAGINATION_TEMPLATE}}{{/PAGINATION_TEMPLATE}} 53 | {{#NEXT_PAGE_TEMPLATE}}{{/NEXT_PAGE_TEMPLATE}} 54 | {{#PREVIOUS_PAGE_TEMPLATE}}{{/PREVIOUS_PAGE_TEMPLATE}} 55 | {{#NEXT_SET_TEMPLATE}}{{/NEXT_SET_TEMPLATE}} 56 | {{#PREVIOUS_SET_TEMPLATE}}{{/PREVIOUS_SET_TEMPLATE}} 57 | 58 | {{#TEMPLATE_OPTION_GROUPS}} 59 | [ 60 | { 61 | "NAME": "COLLAPSIBLE_BEHAVIOR", 62 | "DISPLAY_NAME": "Collapsible Behavior", 63 | "DISPLAY_SEQUENCE": 1, 64 | "HELP_TEXT": "", 65 | "NULL_TEXT": "", 66 | "IS_ADVANCED": "N", 67 | "TEMPLATE_OPTIONS": [ 68 | { 69 | "NAME": "ACCORDION", 70 | "DISPLAY_NAME": "Accordion", 71 | "DISPLAY_SEQUENCE": 1, 72 | "CSS_CLASSES": "ma-collapsible-accordion", 73 | "HELP_TEXT": "" 74 | }, 75 | { 76 | "NAME": "EXPANDABLE", 77 | "DISPLAY_NAME": "Expandable", 78 | "DISPLAY_SEQUENCE": 2, 79 | "CSS_CLASSES": "ma-collapsible-expandable", 80 | "HELP_TEXT": "" 81 | } 82 | ] 83 | } 84 | ] 85 | {{/TEMPLATE_OPTION_GROUPS}} 86 | {{#TEMPLATE_OPTIONS}} 87 | [ 88 | { 89 | "NAME": "POPOUT", 90 | "DISPLAY_NAME": "Popout", 91 | "DISPLAY_SEQUENCE": 1, 92 | "CSS_CLASSES": "popout", 93 | "HELP_TEXT": "", 94 | "IS_ADVANCED": "" 95 | } 96 | ] 97 | {{/TEMPLATE_OPTIONS}} 98 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 99 | {{#PRESET_TEMPLATE_OPTIONS}} 100 | ma-collapsible-accordion 101 | {{/PRESET_TEMPLATE_OPTIONS}} 102 | -------------------------------------------------------------------------------- /templates/ReportNamedColumns/Collection.hbs: -------------------------------------------------------------------------------- 1 | {{#ROW_TEMPLATE_BEFORE_ROWS}} 2 | 79 | {{/ROW_TEMPLATE_AFTER_ROWS}} 80 | 81 | {{#PAGINATION_TEMPLATE}}{{/PAGINATION_TEMPLATE}} 82 | {{#NEXT_PAGE_TEMPLATE}}{{/NEXT_PAGE_TEMPLATE}} 83 | {{#PREVIOUS_PAGE_TEMPLATE}}{{/PREVIOUS_PAGE_TEMPLATE}} 84 | {{#NEXT_SET_TEMPLATE}}{{/NEXT_SET_TEMPLATE}} 85 | {{#PREVIOUS_SET_TEMPLATE}}{{/PREVIOUS_SET_TEMPLATE}} 86 | 87 | {{#TEMPLATE_OPTION_GROUPS}} 88 | [] 89 | {{/TEMPLATE_OPTION_GROUPS}} 90 | {{#TEMPLATE_OPTIONS}} 91 | [ 92 | { 93 | "NAME": "WITH_HEADER", 94 | "DISPLAY_NAME": "With Header", 95 | "DISPLAY_SEQUENCE": 1, 96 | "CSS_CLASSES": "with-header", 97 | "HELP_TEXT": "", 98 | "IS_ADVANCED": "" 99 | } 100 | ] 101 | {{/TEMPLATE_OPTIONS}} 102 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 103 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 104 | -------------------------------------------------------------------------------- /templates/ReportNamedColumns/Dropdown.hbs: -------------------------------------------------------------------------------- 1 | {{#ROW_TEMPLATE_BEFORE_ROWS}} 2 | 3 | #REGION_TITLE# 4 | 5 | 6 | 58 | {{/ROW_TEMPLATE_AFTER_ROWS}} 59 | 60 | {{#PAGINATION_TEMPLATE}}{{/PAGINATION_TEMPLATE}} 61 | {{#NEXT_PAGE_TEMPLATE}}{{/NEXT_PAGE_TEMPLATE}} 62 | {{#PREVIOUS_PAGE_TEMPLATE}}{{/PREVIOUS_PAGE_TEMPLATE}} 63 | {{#NEXT_SET_TEMPLATE}}{{/NEXT_SET_TEMPLATE}} 64 | {{#PREVIOUS_SET_TEMPLATE}}{{/PREVIOUS_SET_TEMPLATE}} 65 | 66 | {{#TEMPLATE_OPTION_GROUPS}} 67 | [ 68 | { 69 | "NAME": "DROPDOWN_WIDTH", 70 | "DISPLAY_NAME": "Dropdown Width", 71 | "DISPLAY_SEQUENCE": 10, 72 | "HELP_TEXT": "", 73 | "NULL_TEXT": "", 74 | "IS_ADVANCED": "N", 75 | "TEMPLATE_OPTIONS": [ 76 | { 77 | "NAME": "DROPDOWN_WIDTH_CONSTRAINED", 78 | "DISPLAY_NAME": "Same as button (trigger)", 79 | "DISPLAY_SEQUENCE": 10, 80 | "CSS_CLASSES": "ma-dropdown--width-constrained", 81 | "HELP_TEXT": "" 82 | }, 83 | { 84 | "NAME": "DROPDOWN_WIDTH_AUTO", 85 | "DISPLAY_NAME": "Auto", 86 | "DISPLAY_SEQUENCE": 20, 87 | "CSS_CLASSES": "ma-dropdown--width-auto", 88 | "HELP_TEXT": "" 89 | } 90 | ] 91 | } 92 | ] 93 | {{/TEMPLATE_OPTION_GROUPS}} 94 | {{#TEMPLATE_OPTIONS}} 95 | [] 96 | {{/TEMPLATE_OPTIONS}} 97 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 98 | {{#PRESET_TEMPLATE_OPTIONS}} 99 | ma-dropdown--width-constrained 100 | {{/PRESET_TEMPLATE_OPTIONS}} 101 | -------------------------------------------------------------------------------- /templates/ReportNamedColumns/SideNav Header.hbs: -------------------------------------------------------------------------------- 1 | {{#ROW_TEMPLATE_BEFORE_ROWS}} 2 |
    3 | {{/ROW_TEMPLATE_BEFORE_ROWS}} 4 | 5 | {{#BEFORE_COLUMN_HEADING}}{{/BEFORE_COLUMN_HEADING}} 6 | 7 | {{#COLUMN_HEADING_TEMPLATE}}{{/COLUMN_HEADING_TEMPLATE}} 8 | 9 | {{#AFTER_COLUMN_HEADING}}{{/AFTER_COLUMN_HEADING}} 10 | 11 | {{#ROW_TEMPLATE_BEFORE_FIRST}}{{/ROW_TEMPLATE_BEFORE_FIRST}} 12 | 13 | {{#ROW_TEMPLATE1}} 14 |
    15 | 16 |
    17 | 18 | #TEXT_LINE_1# 19 | 20 | {{/ROW_TEMPLATE1}} 21 | {{#ROW_TEMPLATE_CONDITION1}}{{/ROW_TEMPLATE_CONDITION1}} 22 | {{#ROW_TEMPLATE_DISPLAY_COND1}} 23 | 0 24 | {{/ROW_TEMPLATE_DISPLAY_COND1}} 25 | {{#ROW_TEMPLATE2}}{{/ROW_TEMPLATE2}} 26 | {{#ROW_TEMPLATE_CONDITION2}}{{/ROW_TEMPLATE_CONDITION2}} 27 | {{#ROW_TEMPLATE_DISPLAY_COND2}} 28 | 0 29 | {{/ROW_TEMPLATE_DISPLAY_COND2}} 30 | {{#ROW_TEMPLATE3}}{{/ROW_TEMPLATE3}} 31 | {{#ROW_TEMPLATE_CONDITION3}}{{/ROW_TEMPLATE_CONDITION3}} 32 | {{#ROW_TEMPLATE_DISPLAY_COND3}} 33 | 0 34 | {{/ROW_TEMPLATE_DISPLAY_COND3}} 35 | {{#ROW_TEMPLATE4}}{{/ROW_TEMPLATE4}} 36 | {{#ROW_TEMPLATE_CONDITION4}}{{/ROW_TEMPLATE_CONDITION4}} 37 | {{#ROW_TEMPLATE_DISPLAY_COND4}} 38 | 0 39 | {{/ROW_TEMPLATE_DISPLAY_COND4}} 40 | 41 | {{#ROW_TEMPLATE_AFTER_LAST}}{{/ROW_TEMPLATE_AFTER_LAST}} 42 | 43 | {{#ROW_TEMPLATE_AFTER_ROWS}} 44 |
    45 | {{/ROW_TEMPLATE_AFTER_ROWS}} 46 | 47 | {{#PAGINATION_TEMPLATE}}{{/PAGINATION_TEMPLATE}} 48 | {{#NEXT_PAGE_TEMPLATE}}{{/NEXT_PAGE_TEMPLATE}} 49 | {{#PREVIOUS_PAGE_TEMPLATE}}{{/PREVIOUS_PAGE_TEMPLATE}} 50 | {{#NEXT_SET_TEMPLATE}}{{/NEXT_SET_TEMPLATE}} 51 | {{#PREVIOUS_SET_TEMPLATE}}{{/PREVIOUS_SET_TEMPLATE}} 52 | 53 | {{#TEMPLATE_OPTION_GROUPS}} 54 | [] 55 | {{/TEMPLATE_OPTION_GROUPS}} 56 | {{#TEMPLATE_OPTIONS}} 57 | [] 58 | {{/TEMPLATE_OPTIONS}} 59 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 60 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 61 | -------------------------------------------------------------------------------- /templates/ReportNamedColumns/Slider.hbs: -------------------------------------------------------------------------------- 1 | {{#ROW_TEMPLATE_BEFORE_ROWS}} 2 |
    3 | 49 |
    50 | 51 | {{/ROW_TEMPLATE_AFTER_ROWS}} 52 | 53 | {{#PAGINATION_TEMPLATE}}{{/PAGINATION_TEMPLATE}} 54 | {{#NEXT_PAGE_TEMPLATE}}{{/NEXT_PAGE_TEMPLATE}} 55 | {{#PREVIOUS_PAGE_TEMPLATE}}{{/PREVIOUS_PAGE_TEMPLATE}} 56 | {{#NEXT_SET_TEMPLATE}}{{/NEXT_SET_TEMPLATE}} 57 | {{#PREVIOUS_SET_TEMPLATE}}{{/PREVIOUS_SET_TEMPLATE}} 58 | 59 | {{#TEMPLATE_OPTION_GROUPS}} 60 | [] 61 | {{/TEMPLATE_OPTION_GROUPS}} 62 | {{#TEMPLATE_OPTIONS}} 63 | [ 64 | { 65 | "NAME": "SLIDER_FULLSCREEN", 66 | "DISPLAY_NAME": "Fullscreen", 67 | "DISPLAY_SEQUENCE": 1, 68 | "CSS_CLASSES": "fullscreen", 69 | "HELP_TEXT": "", 70 | "IS_ADVANCED": "" 71 | } 72 | ] 73 | {{/TEMPLATE_OPTIONS}} 74 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 75 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 76 | -------------------------------------------------------------------------------- /templates/ReportNamedColumns/Timeline.hbs: -------------------------------------------------------------------------------- 1 | {{#ROW_TEMPLATE_BEFORE_ROWS}} 2 |
    3 | 4 | {{/ROW_TEMPLATE_BEFORE_ROWS}} 5 | 6 | {{#BEFORE_COLUMN_HEADING}}{{/BEFORE_COLUMN_HEADING}} 7 | 8 | {{#COLUMN_HEADING_TEMPLATE}}{{/COLUMN_HEADING_TEMPLATE}} 9 | 10 | {{#AFTER_COLUMN_HEADING}}{{/AFTER_COLUMN_HEADING}} 11 | 12 | {{#ROW_TEMPLATE_BEFORE_FIRST}}{{/ROW_TEMPLATE_BEFORE_FIRST}} 13 | 14 | {{#ROW_TEMPLATE1}} 15 |
    16 |
    17 | 18 |
    19 | 20 |
    21 |
    #TITLE#
    22 |

    #DESCRIPTION#

    23 | #BTN_LABEL# 24 | #TIMELINE_DATE# 25 |
    26 |
    27 | {{/ROW_TEMPLATE1}} 28 | {{#ROW_TEMPLATE_CONDITION1}}{{/ROW_TEMPLATE_CONDITION1}} 29 | {{#ROW_TEMPLATE_DISPLAY_COND1}} 30 | 0 31 | {{/ROW_TEMPLATE_DISPLAY_COND1}} 32 | {{#ROW_TEMPLATE2}}{{/ROW_TEMPLATE2}} 33 | {{#ROW_TEMPLATE_CONDITION2}}{{/ROW_TEMPLATE_CONDITION2}} 34 | {{#ROW_TEMPLATE_DISPLAY_COND2}} 35 | 0 36 | {{/ROW_TEMPLATE_DISPLAY_COND2}} 37 | {{#ROW_TEMPLATE3}}{{/ROW_TEMPLATE3}} 38 | {{#ROW_TEMPLATE_CONDITION3}}{{/ROW_TEMPLATE_CONDITION3}} 39 | {{#ROW_TEMPLATE_DISPLAY_COND3}} 40 | 0 41 | {{/ROW_TEMPLATE_DISPLAY_COND3}} 42 | {{#ROW_TEMPLATE4}}{{/ROW_TEMPLATE4}} 43 | {{#ROW_TEMPLATE_CONDITION4}}{{/ROW_TEMPLATE_CONDITION4}} 44 | {{#ROW_TEMPLATE_DISPLAY_COND4}} 45 | 0 46 | {{/ROW_TEMPLATE_DISPLAY_COND4}} 47 | 48 | {{#ROW_TEMPLATE_AFTER_LAST}}{{/ROW_TEMPLATE_AFTER_LAST}} 49 | 50 | {{#ROW_TEMPLATE_AFTER_ROWS}} 51 | 52 | {{/ROW_TEMPLATE_AFTER_ROWS}} 53 | 54 | {{#PAGINATION_TEMPLATE}}{{/PAGINATION_TEMPLATE}} 55 | {{#NEXT_PAGE_TEMPLATE}}{{/NEXT_PAGE_TEMPLATE}} 56 | {{#PREVIOUS_PAGE_TEMPLATE}}{{/PREVIOUS_PAGE_TEMPLATE}} 57 | {{#NEXT_SET_TEMPLATE}}{{/NEXT_SET_TEMPLATE}} 58 | {{#PREVIOUS_SET_TEMPLATE}}{{/PREVIOUS_SET_TEMPLATE}} 59 | 60 | {{#TEMPLATE_OPTION_GROUPS}} 61 | [] 62 | {{/TEMPLATE_OPTION_GROUPS}} 63 | {{#TEMPLATE_OPTIONS}} 64 | [] 65 | {{/TEMPLATE_OPTIONS}} 66 | {{#DEFAULT_TEMPLATE_OPTIONS}}{{/DEFAULT_TEMPLATE_OPTIONS}} 67 | {{#PRESET_TEMPLATE_OPTIONS}}{{/PRESET_TEMPLATE_OPTIONS}} 68 | -------------------------------------------------------------------------------- /templates/ReportNamedColumns/~global.template.options.hbs: -------------------------------------------------------------------------------- 1 | {{#TEMPLATE_OPTION_GROUPS}} 2 | [] 3 | {{/TEMPLATE_OPTION_GROUPS}} 4 | {{#TEMPLATE_OPTIONS}} 5 | [] 6 | {{/TEMPLATE_OPTIONS}} 7 | --------------------------------------------------------------------------------