Skip to content
This repository has been archived by the owner on Sep 5, 2024. It is now read-only.

Use mdIcon instead of data-URIs #1466

Closed
wants to merge 1 commit into from
Closed

Use mdIcon instead of data-URIs #1466

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 16 additions & 0 deletions docs/app/img/icons/tabs-arrow.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion docs/app/partials/docs-demo.tmpl.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
style="min-width: 72px;"
layout="row" layout-align="center center"
ng-click="demoCtrl.$showSource = !demoCtrl.$showSource">
<md-icon svg-src="img/icons/ic_visibility_24px.svg"
<md-icon md-svg-src="img/icons/ic_visibility_24px.svg"
style="margin: 0 4px 0 0;">
</md-icon>
Source
Expand Down
6 changes: 3 additions & 3 deletions docs/config/template/index.template.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ <h2 class="menu-heading" ng-if="section.type === 'heading'" id="heading_{{ secti

<div class="md-toolbar-tools" ng-click="openMenu()">
<button class="menu-icon" hide-gt-sm aria-label="Toggle Menu">
<md-icon svg-src="img/icons/ic_menu_24px.svg"></md-icon>
<md-icon md-svg-src="img/icons/ic_menu_24px.svg"></md-icon>
</button>

<div layout="row" flex class="fill-height">
Expand All @@ -88,7 +88,7 @@ <h2 class="menu-heading" ng-if="section.type === 'heading'" id="heading_{{ secti
<md-button ng-class="{hide: !currentDoc || !currentDoc.hasDemo}"
ng-href="#/demo/{{currentComponent.name}}"
style="position: relative; padding-left: 30px; margin-right: 15px;">
<md-icon svg-src="img/icons/ic_play_arrow_24px.svg" style="
<md-icon md-svg-src="img/icons/ic_play_arrow_24px.svg" style="
height: 36px;
position: absolute;
left: 0px;
Expand All @@ -101,7 +101,7 @@ <h2 class="menu-heading" ng-if="section.type === 'heading'" id="heading_{{ secti
ng-href="{{currentDoc.githubUrl}}"
hide-sm hide-md
style="position: relative; padding-left: 30px; margin-right: 15px;">
<md-icon svg-src="img/icons/ic_launch_24px.svg" style="
<md-icon md-svg-src="img/icons/ic_launch_24px.svg" style="
height: 36px;
position: absolute;
left: 0px;
Expand Down
5 changes: 5 additions & 0 deletions src/components/tabs/demoDynamicTabs/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,6 +16,11 @@ md-tabs, md-tabs .md-header {
md-tab[disabled] {
opacity: 0.5;
}

md-tabs .md-next md-icon {
transform: rotate(180deg);
}

.md-tab-content {
background: white;
}
Expand Down
6 changes: 6 additions & 0 deletions src/components/tabs/demoStaticTabs/style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,3 +83,9 @@ md-tab[disabled] {
md-tabs-ink-bar {
background-color: #FFFF8D !important;
}
md-tabs .md-paginator {
color: white;
}
md-tabs .md-next md-icon {
transform: rotate(180deg);
}
2 changes: 2 additions & 0 deletions src/components/tabs/js/tabsDirective.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -110,6 +110,7 @@ function TabsDirective($mdTheming) {
'ng-if="pagination.active && pagination.hasPrev" ' +
'ng-click="pagination.clickPrevious()" ' +
'aria-hidden="true">' +
'<md-icon md-svg-icon="img/icons/tabs-arrow.svg"></md-icon>' +
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ThomasBurleson do these paths need to be configurable?

'</button>' +

// overflow: hidden container when paginating
Expand All @@ -124,6 +125,7 @@ function TabsDirective($mdTheming) {
'ng-if="pagination.active && pagination.hasNext" ' +
'ng-click="pagination.clickNext()" ' +
'aria-hidden="true">' +
'<md-icon md-svg-icon="img/icons/tabs-arrow.svg"></md-icon>' +
'</button>' +

'</section>' +
Expand Down
1 change: 1 addition & 0 deletions src/components/tabs/tabs-arrow.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
3 changes: 3 additions & 0 deletions src/components/tabs/tabs-theme.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,9 @@ md-tabs.md-THEME_NAME-theme {
.md-header {
background-color: transparent;
}
.md-paginator {
color: '{{primary-color}}';
}

&.md-accent {
.md-header {
Expand Down
9 changes: 0 additions & 9 deletions src/components/tabs/tabs.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,15 +38,6 @@ md-tabs {
&.md-next {
right: 0;
}

/* TODO Once we have a better way to inline svg images, change this
to use svgs correctly */
&.md-prev {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE3LjEuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPiA8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPiA8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjQgMjQiIHhtbDpzcGFjZT0icHJlc2VydmUiPiA8ZyBpZD0iSGVhZGVyIj4gPGc+IDxyZWN0IHg9Ii02MTgiIHk9Ii0xMjA4IiBmaWxsPSJub25lIiB3aWR0aD0iMTQwMCIgaGVpZ2h0PSIzNjAwIi8+IDwvZz4gPC9nPiA8ZyBpZD0iTGFiZWwiPiA8L2c+IDxnIGlkPSJJY29uIj4gPGc+IDxwb2x5Z29uIHBvaW50cz0iMTUuNCw3LjQgMTQsNiA4LDEyIDE0LDE4IDE1LjQsMTYuNiAxMC44LDEyIAkJIiBzdHlsZT0iZmlsbDp3aGl0ZTsiLz4gPHJlY3QgZmlsbD0ibm9uZSIgd2lkdGg9IjI0IiBoZWlnaHQ9IjI0Ii8+IDwvZz4gPC9nPiA8ZyBpZD0iR3JpZCIgZGlzcGxheT0ibm9uZSI+IDxnIGRpc3BsYXk9ImlubGluZSI+IDwvZz4gPC9nPiA8L3N2Zz4NCg==');
}
&.md-next {
background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPCEtLSBHZW5lcmF0b3I6IEFkb2JlIElsbHVzdHJhdG9yIDE3LjEuMCwgU1ZHIEV4cG9ydCBQbHVnLUluIC4gU1ZHIFZlcnNpb246IDYuMDAgQnVpbGQgMCkgIC0tPiA8IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPiA8c3ZnIHZlcnNpb249IjEuMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSIyNHB4IiBoZWlnaHQ9IjI0cHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZW5hYmxlLWJhY2tncm91bmQ9Im5ldyAwIDAgMjQgMjQiIHhtbDpzcGFjZT0icHJlc2VydmUiPiA8ZyBpZD0iSGVhZGVyIj4gPGc+IDxyZWN0IHg9Ii02MTgiIHk9Ii0xMzM2IiBmaWxsPSJub25lIiB3aWR0aD0iMTQwMCIgaGVpZ2h0PSIzNjAwIi8+IDwvZz4gPC9nPiA8ZyBpZD0iTGFiZWwiPiA8L2c+IDxnIGlkPSJJY29uIj4gPGc+IDxwb2x5Z29uIHBvaW50cz0iMTAsNiA4LjYsNy40IDEzLjIsMTIgOC42LDE2LjYgMTAsMTggMTYsMTIgCQkiIHN0eWxlPSJmaWxsOndoaXRlOyIvPiA8cmVjdCBmaWxsPSJub25lIiB3aWR0aD0iMjQiIGhlaWdodD0iMjQiLz4gPC9nPiA8L2c+IDxnIGlkPSJHcmlkIiBkaXNwbGF5PSJub25lIj4gPGcgZGlzcGxheT0iaW5saW5lIj4gPC9nPiA8L2c+IDwvc3ZnPg0K');
}
}

/* If `center` justified, change to left-justify if paginating */
Expand Down