Skip to content
This repository has been archived by the owner on May 29, 2019. It is now read-only.

Pagination 'direction-links' to support glyphicons #4130

Closed
Frondor opened this issue Aug 6, 2015 · 6 comments
Closed

Pagination 'direction-links' to support glyphicons #4130

Frondor opened this issue Aug 6, 2015 · 6 comments

Comments

@Frondor
Copy link

Frondor commented Aug 6, 2015

just by providing a string like glyphicon-chevron-right the directive should render a <span class="glyphicon glyphicon-chevron-right"></span> instead of a simple character or string.

@wesleycho
Copy link
Contributor

Any reason why you wouldn't just use &gt; or &lt; for that?

@Frondor
Copy link
Author

Frondor commented Aug 7, 2015

In a small pagination they are really small, and not good looking at all.
In bootstrap you can place whatever you want inside the list items

@wesleycho
Copy link
Contributor

The problem is, your suggestion is tied too heavily to one particular implementation. What if someone wants to use Font Awesome icons for example?

The best solution is to allow templateUrl overriding at the directive level IMO.

@RobJacobs
Copy link
Contributor

We could potentially add unique classes to the pagination first, last, next, previous elements that would allow people to use the css content property to set the icon, so the pagination button would look like so:

<li ng-if="::boundaryLinks" ng-class="{disabled: noPrevious()||ngDisabled}"><a href class="pagination-first" ng-click="selectPage(1, $event)">{{::getText('first')}}</a></li>

and the class would look something like:

.pagination-first: after {
     font-family: 'Glyphicons Halflings';
     content: '\fe079'; //glyphicon-chevron-left
}

@wesleycho
Copy link
Contributor

That is also a good idea - I was thinking about that too, it would make it more flexible to style.

wesleycho added a commit to wesleycho/bootstrap that referenced this issue Aug 7, 2015
- Add classes to allow the user to target the styles of component with more specificity

Closes angular-ui#4130
@wesleycho
Copy link
Contributor

I opened a PR with classes added to each of the li elements.

wesleycho added a commit to wesleycho/bootstrap that referenced this issue Aug 7, 2015
- Add classes to allow the user to target the styles of component with more specificity

Closes angular-ui#4130
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

3 participants