apps-pagetree-root

Introduced in v1.0.0
Available in TYPO3 7.6 8.6 9.5 10.4 11.5 12.4 13.x

Buttons

Button Label Button Label

Button Label Button Label

Usage

Markup

<svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 16 16"><path fill="#666" d="M12.053 11.026c-.238.07-.427.095-.674.095-2.033 0-5.017-7.1-5.017-9.462 0-.87.207-1.16.497-1.41C4.373.54 1.39 1.452.435 2.613c-.207.29-.332.746-.332 1.326C.103 7.628 4.04 16 6.82 16c1.283 0 3.45-2.114 5.233-4.974M10.756 0c2.57 0 5.14.415 5.14 1.865 0 2.943-1.865 6.508-2.818 6.508-1.7 0-3.814-4.725-3.814-7.088C9.264.207 9.68 0 10.756 0"/></svg>

Inline

<span class="icon icon-size-small icon-state-default">
    <span class="icon-markup">
        <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewBox="0 0 16 16"><path fill="#666" d="M12.053 11.026c-.238.07-.427.095-.674.095-2.033 0-5.017-7.1-5.017-9.462 0-.87.207-1.16.497-1.41C4.373.54 1.39 1.452.435 2.613c-.207.29-.332.746-.332 1.326C.103 7.628 4.04 16 6.82 16c1.283 0 3.45-2.114 5.233-4.974M10.756 0c2.57 0 5.14.415 5.14 1.865 0 2.943-1.865 6.508-2.818 6.508-1.7 0-3.814-4.725-3.814-7.088C9.264.207 9.68 0 10.756 0"/></svg>
    </span>
</span>

Sprite

<span class="icon icon-size-small icon-state-default">
    <span class="icon-markup">
        <svg role="img"><use xlink:href="dist/sprites/apps.svg#apps-pagetree-root" /></svg>
    </span>
</span>

TYPO3 ViewHelper

<core:icon identifier="apps-pagetree-root" size="small" />

CSS Background Image

.myclass {
    background-size: 1em 1em;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' xml:space='preserve' viewBox='0 0 16 16'%3e%3cpath fill='%23666' d='M12.053 11.026c-.238.07-.427.095-.674.095-2.033 0-5.017-7.1-5.017-9.462 0-.87.207-1.16.497-1.41C4.373.54 1.39 1.452.435 2.613c-.207.29-.332.746-.332 1.326C.103 7.628 4.04 16 6.82 16c1.283 0 3.45-2.114 5.233-4.974M10.756 0c2.57 0 5.14.415 5.14 1.865 0 2.943-1.865 6.508-2.818 6.508-1.7 0-3.814-4.725-3.814-7.088C9.264.207 9.68 0 10.756 0'/%3e%3c/svg%3e");
}

Sass Background Variable

@import "@typo3/icons/dist/icons.scss";
@import "@typo3/icons/dist/scss/icons-variables-apps.scss";

.myclass {
    background-size: 1em 1em;
    background-image: $icon-apps-pagetree-root;
}

Download

Download