apps-pagetree-backend-user-hideinmenu

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

Buttons

Button Label Button Label

Button Label Button Label

Usage

Markup

<svg xmlns="http://www.w3.org/2000/svg" viewBox="2 -3 16 16"><g opacity=".5"><path fill="#EFEFEF" d="M4-3v16h12V1l-4-4H4z"/><path fill="#FFF" d="M12 1v-4l4 4h-4z" opacity=".65"/><path fill="#212121" d="M15 2v5l-4-5h4z" opacity=".2"/><path fill="#999" d="M4-3v16h12V1l-4-4H4zm1 1h6v4h4v10H5V-2zm7 .4L14.6 1H12v-2.6z"/></g><g><path fill="#666" d="M12.725 2h-.45c-1.457 0-2.687 1.205-2.687 2.631v1.237c0 .649.287 1.38.769 1.99a3.108 3.108 0 0 1-.044.301l-.288.127c-.441.196-.896.398-1.456.558l-.116.033-.105.06C8.135 9.059 7 9.809 7 12v1h11v-1c0-2.275-1.175-2.978-1.396-3.088l-.084-.042-.089-.026c-.562-.16-1.019-.364-1.461-.56l-.255-.113a3.819 3.819 0 0 1-.053-.338c.47-.606.751-1.327.751-1.966V4.631C15.412 3.156 14.232 2 12.725 2z"/><path fill="#FFC857" d="M16.156 9.806c-.949-.271-1.612-.642-2.272-.896-.063-.207-.214-.574-.25-1.418.454-.457.779-1.103.779-1.623V4.631c0-.9-.731-1.631-1.688-1.631h-.45c-.9 0-1.688.731-1.688 1.631v1.237c0 .525.329 1.177.789 1.635-.015.829-.171 1.194-.245 1.401-.666.254-1.331.629-2.287.902 0 0-.787.45-.844 2.194h9c-.056-1.8-.844-2.194-.844-2.194z"/><path fill="#59F" d="M16.156 9.806c-.95-.271-1.612-.642-2.273-.897.04.131.047.197-.034.278-.675.731-2.081.675-2.7 0-.082-.082-.066-.149-.017-.284-.666.254-1.332.629-2.289.903 0 0-.787.45-.844 2.194H17c-.056-1.8-.844-2.194-.844-2.194z"/></g></svg>

Inline

<span class="icon icon-size-small icon-state-default">
    <span class="icon-markup">
        <svg xmlns="http://www.w3.org/2000/svg" viewBox="2 -3 16 16"><g opacity=".5"><path fill="#EFEFEF" d="M4-3v16h12V1l-4-4H4z"/><path fill="#FFF" d="M12 1v-4l4 4h-4z" opacity=".65"/><path fill="#212121" d="M15 2v5l-4-5h4z" opacity=".2"/><path fill="#999" d="M4-3v16h12V1l-4-4H4zm1 1h6v4h4v10H5V-2zm7 .4L14.6 1H12v-2.6z"/></g><g><path fill="#666" d="M12.725 2h-.45c-1.457 0-2.687 1.205-2.687 2.631v1.237c0 .649.287 1.38.769 1.99a3.108 3.108 0 0 1-.044.301l-.288.127c-.441.196-.896.398-1.456.558l-.116.033-.105.06C8.135 9.059 7 9.809 7 12v1h11v-1c0-2.275-1.175-2.978-1.396-3.088l-.084-.042-.089-.026c-.562-.16-1.019-.364-1.461-.56l-.255-.113a3.819 3.819 0 0 1-.053-.338c.47-.606.751-1.327.751-1.966V4.631C15.412 3.156 14.232 2 12.725 2z"/><path fill="#FFC857" d="M16.156 9.806c-.949-.271-1.612-.642-2.272-.896-.063-.207-.214-.574-.25-1.418.454-.457.779-1.103.779-1.623V4.631c0-.9-.731-1.631-1.688-1.631h-.45c-.9 0-1.688.731-1.688 1.631v1.237c0 .525.329 1.177.789 1.635-.015.829-.171 1.194-.245 1.401-.666.254-1.331.629-2.287.902 0 0-.787.45-.844 2.194h9c-.056-1.8-.844-2.194-.844-2.194z"/><path fill="#59F" d="M16.156 9.806c-.95-.271-1.612-.642-2.273-.897.04.131.047.197-.034.278-.675.731-2.081.675-2.7 0-.082-.082-.066-.149-.017-.284-.666.254-1.332.629-2.289.903 0 0-.787.45-.844 2.194H17c-.056-1.8-.844-2.194-.844-2.194z"/></g></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-backend-user-hideinmenu" /></svg>
    </span>
</span>

TYPO3 ViewHelper

<core:icon identifier="apps-pagetree-backend-user-hideinmenu" 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' viewBox='2 -3 16 16'%3e%3cg opacity='.5'%3e%3cpath fill='%23EFEFEF' d='M4-3v16h12V1l-4-4H4z'/%3e%3cpath fill='%23FFF' d='M12 1v-4l4 4h-4z' opacity='.65'/%3e%3cpath fill='%23212121' d='M15 2v5l-4-5h4z' opacity='.2'/%3e%3cpath fill='%23999' d='M4-3v16h12V1l-4-4H4zm1 1h6v4h4v10H5V-2zm7 .4L14.6 1H12v-2.6z'/%3e%3c/g%3e%3cg%3e%3cpath fill='%23666' d='M12.725 2h-.45c-1.457 0-2.687 1.205-2.687 2.631v1.237c0 .649.287 1.38.769 1.99a3.108 3.108 0 0 1-.044.301l-.288.127c-.441.196-.896.398-1.456.558l-.116.033-.105.06C8.135 9.059 7 9.809 7 12v1h11v-1c0-2.275-1.175-2.978-1.396-3.088l-.084-.042-.089-.026c-.562-.16-1.019-.364-1.461-.56l-.255-.113a3.819 3.819 0 0 1-.053-.338c.47-.606.751-1.327.751-1.966V4.631C15.412 3.156 14.232 2 12.725 2z'/%3e%3cpath fill='%23FFC857' d='M16.156 9.806c-.949-.271-1.612-.642-2.272-.896-.063-.207-.214-.574-.25-1.418.454-.457.779-1.103.779-1.623V4.631c0-.9-.731-1.631-1.688-1.631h-.45c-.9 0-1.688.731-1.688 1.631v1.237c0 .525.329 1.177.789 1.635-.015.829-.171 1.194-.245 1.401-.666.254-1.331.629-2.287.902 0 0-.787.45-.844 2.194h9c-.056-1.8-.844-2.194-.844-2.194z'/%3e%3cpath fill='%2359F' d='M16.156 9.806c-.95-.271-1.612-.642-2.273-.897.04.131.047.197-.034.278-.675.731-2.081.675-2.7 0-.082-.082-.066-.149-.017-.284-.666.254-1.332.629-2.289.903 0 0-.787.45-.844 2.194H17c-.056-1.8-.844-2.194-.844-2.194z'/%3e%3c/g%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-backend-user-hideinmenu;
}

Download

Download