-
Notifications
You must be signed in to change notification settings - Fork 106
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
reminify html version to fix tab rules form display
- Loading branch information
Showing
10 changed files
with
50 additions
and
530 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,125 +1 @@ | ||
| <md-dialog aria-label="Add a new rule"> | ||
| <form ng-submit="save(rule)"> | ||
| <md-toolbar> | ||
| <div class="md-toolbar-tools"> | ||
| <h3 ng-if="rule.name === null">Add a new rule</h3> | ||
| <h3 ng-if="rule.name !== null">Edit rule "{{ rule.name }}"</h3> | ||
| <span flex></span> | ||
| <md-button class="md-icon-button" aria-label="Close" ng-click="closeForm()"> | ||
| <md-icon md-svg-icon="close"></md-icon> | ||
| </md-button> | ||
| </div> | ||
| </md-toolbar> | ||
| <md-dialog-content layout-padding> | ||
|
|
||
| <div layout="row"> | ||
| <!-- Name --> | ||
| <md-input-container flex> | ||
| <label for="rule_name" class="md-body-1">Name</label> | ||
| <input id="rule_name" type="text" ng-model="rule.name" placeholder="e.g. Pinned GMail" required> | ||
| <span class="md-caption">Give an explicit name, just for you</span> | ||
| </md-input-container> | ||
|
|
||
| <!-- URL fragment --> | ||
| <md-input-container flex> | ||
| <label for="rule_url_fragment" class="md-body-1">URL fragment</label> | ||
| <input id="rule_url_fragment" type="text" ng-model="rule.url_fragment" placeholder="e.g. mail.google.com to catch GMail" required> | ||
| <span class="md-caption">URL fragment to find</span> | ||
| </md-input-container> | ||
| </div> | ||
|
|
||
| <p class="md-primary md-margin-0" ng-if="rule.url_fragment === null">The URL fragment is required by the extension to detect when to apply your actions</p> | ||
| <p class="md-primary md-margin-0" ng-if="rule.url_fragment !== null">The following actions will be applied when the URL contains <strong><code ng-bind="rule.url_fragment"></code></strong>:</p> | ||
|
|
||
| <div ng-if="rule.url_fragment !== null" layout="column"> | ||
|
|
||
| <!-- Title --> | ||
| <md-input-container> | ||
| <label for="rule_title" class="md-body-1">Title</label> | ||
| <input id="rule_title" type="text" ng-model="rule.tab.title" placeholder="e.g. Hey {title}"> | ||
| <span class="md-caption">The new title you want to display in the tab.<br>You can inject any DOM content with <code>{selector}</code>. Examples: <code>{title}</code> for website title, <code>{h1}</code>, <code>{#id}</code>, <code>{.class}</code>, etc.</span> | ||
| </md-input-container> | ||
|
|
||
| <!-- Icon --> | ||
| <div layout="row"> | ||
|
|
||
| <!-- Select icon --> | ||
| <md-input-container flex="20"> | ||
| <label>Select icon</label> | ||
| <md-select ng-model="rule.tab.icon"> | ||
| <md-optgroup label="Chrome"> | ||
| <md-option layout="row" layout-align="start center" ng-repeat="icon in icon_list | filter: { category: 'chrome' }:true | orderBy: 'name'" ng-value="icon.value"> | ||
| <img class="md-img-select md-icon-16x" ng-src="../img/{{ icon.value }}" alt="{{ icon.name }}"> {{ icon.name }} | ||
| </md-option> | ||
| </md-optgroup> | ||
|
|
||
| <md-optgroup label="Color"> | ||
| <md-option layout="row" layout-align="start center" ng-repeat="icon in icon_list | filter: { category: 'color' }:true | orderBy: 'name'" ng-value="icon.value"> | ||
| <img class="md-img-select md-icon-16x" ng-src="../img/{{ icon.value }}" alt="{{ icon.name }}"> {{ icon.name }} | ||
| </md-option> | ||
| </md-optgroup> | ||
|
|
||
| <md-optgroup label="Color Alt"> | ||
| <md-option layout="row" layout-align="start center" ng-repeat="icon in icon_list | filter: { category: 'color-alt' }:true | orderBy: 'name'" ng-value="icon.value"> | ||
| <img class="md-img-select md-icon-16x" ng-src="../img/{{ icon.value }}" alt="{{ icon.name }}"> {{ icon.name }} | ||
| </md-option> | ||
| </md-optgroup> | ||
| </md-select> | ||
| </md-input-container> | ||
|
|
||
| <!-- URL Icon --> | ||
| <md-input-container flex-offset="5" flex="70"> | ||
| <label for="rule_icon" class="md-body-1">Icon</label> | ||
| <input id="rule_icon" type="text" ng-model="rule.tab.icon" placeholder="e.g. https://google.com/favicon.ico"> | ||
| <span class="md-caption">You can set a custom URL for the new icon, no local file <a class="md-primary" href="https://github.com/sylouuu/chrome-tab-modifier#local-icon-path-doesnt-work" target="_blank">accepted</span> | ||
| </md-input-container> | ||
| </div> | ||
|
|
||
| <div layout="row"> | ||
| <!-- Pinned --> | ||
| <md-switch class="md-accent md-2-line" flex ng-model="rule.tab.pinned" aria-label="Pinned"> | ||
| <p>Pinned</p> | ||
| <span class="md-caption">Will pin the tab</span> | ||
| </md-switch> | ||
|
|
||
| <!-- Protected --> | ||
| <md-switch class="md-accent md-2-line" flex ng-model="rule.tab.protected" aria-label="Protected"> | ||
| <p>Protected</p> | ||
| <span class="md-caption">Will ask you before closing the tab</span> | ||
| </md-switch> | ||
| </div> | ||
|
|
||
| <div layout="row"> | ||
| <!-- Unique --> | ||
| <md-switch class="md-accent md-2-line" flex ng-model="rule.tab.unique" aria-label="Unique"> | ||
| <p>Unique</p> | ||
| <span class="md-caption">Will prevent for opening a duplicate tab</span> | ||
| </md-switch> | ||
|
|
||
| <!-- Muted --> | ||
| <md-switch class="md-accent md-2-line" flex ng-model="rule.tab.muted" aria-label="Muted"> | ||
| <p>Muted</p> | ||
| <span class="md-caption">Will mute the tab (read the <a class="md-primary" href="#/help" target="_blank" aria-label="GitHub Project">help</a> section)</span> | ||
| </md-switch> | ||
| </div> | ||
|
|
||
| <!-- Regex --> | ||
| <md-input-container class="md-margin-bottom-0" flex> | ||
| <label for="rule_url_matcher" class="md-body-1">URL matcher</label> | ||
| <input id="rule_url_matcher" type="text" ng-model="rule.tab.url_matcher"> | ||
| <span class="md-caption">Advanced usage: regular expression to search string fragments and use it inside the title (read the <a class="md-primary" href="#/help" target="_blank" aria-label="GitHub Project">help</a> section)</span> | ||
| </md-input-container> | ||
| </div> | ||
| </md-dialog-content> | ||
|
|
||
| <!-- Save --> | ||
| <md-dialog-actions> | ||
| <p> | ||
| Remember to refresh your tabs after saving | ||
| </p> | ||
| <md-button class="md-raised md-accent" type="submit" ga-track-event="['tab-rules', 'save-rule']"> | ||
| <md-icon md-svg-icon="save"></md-icon> Save | ||
| </md-button> | ||
| </md-dialog-actions> | ||
| </form> | ||
| </md-dialog> | ||
| <md-dialog aria-label="Add a new rule"><form ng-submit=save(rule)><md-toolbar><div class=md-toolbar-tools><h3 ng-if="rule.name === null">Add a new rule</h3><h3 ng-if="rule.name !== null">Edit rule "{{ rule.name }}"</h3><span flex></span><md-button class=md-icon-button aria-label=Close ng-click=closeForm()><md-icon md-svg-icon=close></md-icon></md-button></div></md-toolbar><md-dialog-content layout-padding><div layout=row><md-input-container flex><label for=rule_name class=md-body-1>Name</label> <input id=rule_name type=text ng-model=rule.name placeholder="e.g. Pinned GMail" required> <span class=md-caption>Give an explicit name, just for you</span></md-input-container><md-input-container flex><label for=rule_url_fragment class=md-body-1>URL fragment</label> <input id=rule_url_fragment type=text ng-model=rule.url_fragment placeholder="e.g. mail.google.com to catch GMail" required> <span class=md-caption>URL fragment to find</span></md-input-container></div><p class="md-primary md-margin-0" ng-if="rule.url_fragment === null">The URL fragment is required by the extension to detect when to apply your actions</p><p class="md-primary md-margin-0" ng-if="rule.url_fragment !== null">The following actions will be applied when the URL contains <strong><code ng-bind=rule.url_fragment></code></strong>:</p><div ng-if="rule.url_fragment !== null" layout=column><md-input-container><label for=rule_title class=md-body-1>Title</label> <input id=rule_title type=text ng-model=rule.tab.title placeholder="e.g. Hey {title}"> <span class=md-caption>The new title you want to display in the tab.<br>You can inject any DOM content with <code>{selector}</code>. Examples: <code>{title}</code> for website title, <code>{h1}</code>, <code>{#id}</code>, <code>{.class}</code>, etc.</span></md-input-container><div layout=row><md-input-container flex=20><label>Select icon</label><md-select ng-model=rule.tab.icon><md-optgroup label=Chrome><md-option layout=row layout-align="start center" ng-repeat="icon in icon_list | filter: { category: 'chrome' }:true | orderBy: 'name'" ng-value=icon.value><img class="md-img-select md-icon-16x" ng-src="../img/{{ icon.value }}" alt="{{ icon.name }}"> {{ icon.name }}</md-option></md-optgroup><md-optgroup label=Color><md-option layout=row layout-align="start center" ng-repeat="icon in icon_list | filter: { category: 'color' }:true | orderBy: 'name'" ng-value=icon.value><img class="md-img-select md-icon-16x" ng-src="../img/{{ icon.value }}" alt="{{ icon.name }}"> {{ icon.name }}</md-option></md-optgroup><md-optgroup label="Color Alt"><md-option layout=row layout-align="start center" ng-repeat="icon in icon_list | filter: { category: 'color-alt' }:true | orderBy: 'name'" ng-value=icon.value><img class="md-img-select md-icon-16x" ng-src="../img/{{ icon.value }}" alt="{{ icon.name }}"> {{ icon.name }}</md-option></md-optgroup></md-select></md-input-container><md-input-container flex-offset=5 flex=70><label for=rule_icon class=md-body-1>Icon</label> <input id=rule_icon type=text ng-model=rule.tab.icon placeholder="e.g. https://google.com/favicon.ico"> <span class=md-caption>You can set a custom URL for the new icon, no local file <a class=md-primary href=https://github.com/sylouuu/chrome-tab-modifier#local-icon-path-doesnt-work target=_blank>accepted</a></span></md-input-container></div><div layout=row><md-switch class="md-accent md-2-line" flex ng-model=rule.tab.pinned aria-label=Pinned><p>Pinned</p><span class=md-caption>Will pin the tab</span></md-switch><md-switch class="md-accent md-2-line" flex ng-model=rule.tab.protected aria-label=Protected><p>Protected</p><span class=md-caption>Will ask you before closing the tab</span></md-switch></div><div layout=row><md-switch class="md-accent md-2-line" flex ng-model=rule.tab.unique aria-label=Unique><p>Unique</p><span class=md-caption>Will prevent for opening a duplicate tab</span></md-switch><md-switch class="md-accent md-2-line" flex ng-model=rule.tab.muted aria-label=Muted><p>Muted</p><span class=md-caption>Will mute the tab (read the <a class=md-primary href=#/help target=_blank aria-label="GitHub Project">help</a> section)</span></md-switch></div><md-input-container class=md-margin-bottom-0 flex><label for=rule_url_matcher class=md-body-1>URL matcher</label> <input id=rule_url_matcher type=text ng-model=rule.tab.url_matcher> <span class=md-caption>Advanced usage: regular expression to search string fragments and use it inside the title (read the <a class=md-primary href=#/help target=_blank aria-label="GitHub Project">help</a> section)</span></md-input-container></div></md-dialog-content><md-dialog-actions><p>Remember to refresh your tabs after saving</p><md-button class="md-raised md-accent" type=submit ga-track-event="['tab-rules', 'save-rule']"><md-icon md-svg-icon=save></md-icon> Save</md-button></md-dialog-actions></form></md-dialog> |
Oops, something went wrong.