[ KAWWA PORTAL ] Components : Tools links

Site Utilities

Tools links

Class name: (k-tools-list )
Version: 1.0

This component designs a list of links pointing to general site tools. It may be placed either in the pages' header or footer.

Demo
Snippets

HTML5 Plain Code

COPY

<!-- This block may be placed on the "k-tools" block -->

```
<ul class="k-tools-list">
```
```
	<li><a href="#">Contact us</a></li>
```
```
	<li><a href="#">FAQ</a></li>
```
```
	<li><a href="#">Site map</a></li>
```
```
</ul>
```

CSS Code

COPY

```
div.k-tools {}
```
```
ul.k-tools-list {
```
```
	float: right;
```
```
	width: auto;
```
```
	padding: 1em 2% 0;
```
```
}
```
```
	ul.k-tools-list li {
```
```
		display: inline;
```
```
		font-size: 0.65em;
```
```
		text-transform: uppercase;
```
```
		color: #999;
```
```
		background: transparent;
```
```
		padding: 2em 0.2em 0.3em;
```
```
	}
```

	ul.k-tools-list li:before {content: "\25CF \00A0 \00A0 ";}

	ul.k-tools-list a, ul.k-tools-list a:link {

```
		text-decoration: none;
```
```
	}
```

	ul.k-tools-list a:hover, ul.k-tools-list a:focus {text-decoration: underline;}

```
	/* Exceptions */
```

	footer[role=contentinfo] ul.k-tools-list, #footer ul.k-tools-list {

```
		float: none;
```
```
		padding: 0.5em 0 1em 0.5em;
```
```
		margin: -1em 0 1em;
```
```
		border-left: 1px solid #FFF;
```
```
	}
```

	footer[role=contentinfo] ul.k-tools-list li, #footer ul.k-tools-list li {

```
		display: block;
```
```
		padding-top: 0.5em;
```
```
	}
```

IE Backward Compatibility

In order to correct display bugs for Internet Explorer versions prior to 9, your html pages need to call the following file by Conditional Comments:

List of Components

: jQuery Interactive Feature
: Tapestry integration
: AngularJS Feature

Navigation

Forms

Tables

Dynamic Table

Blocks

Site Utilities

Editorial

eCommerce