loot/libloot
0
0
Fork 0
mirror of https://github.com/loot/libloot.git synced 2026-07-27 14:16:01 -07:00
Code Issues Packages Projects Releases Wiki Activity

Added flip effect for editor open icon.

Browse Source
This commit is contained in:
Oliver Hamlet
2015-02-10 13:27:41 +00:00
parent 4e0a2589d7
commit e269415cf4
1 changed files with 28 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/report/html/loot-plugin-item.html
+28 -6
View File
@@ -21,6 +21,26 @@
margin-left: 16px;
}
/* Flip effect for user metadata / editor open icons. */
#flipper {
transform-style: preserve-3d;
transition: 0.6s;
overflow: visible;
}
:host([data-editor-open]) #flipper {
transform: rotateY(180deg);
}
#hasUserEdits, #editorIsOpen {
backface-visibility: hidden;
display: block;
}
#hasUserEdits {
transform: translateZ(1px);
}
#editorIsOpen {
transform: rotateY(180deg) translateZ(-1px);
}
/* paper-item (two-line) */
paper-item.two-line {
/* Two-line items should be 72px high according to Material Design.
@@ -99,12 +119,14 @@
<div id="priority"></div>
</div>
</div>
<core-tooltip id="hasUserEdits" label="Has User Metadata" noarrow position="left">
<core-icon icon="account-circle"></core-icon>
</core-tooltip>
<core-tooltip id="editorIsOpen" label="Editor Is Open" noarrow position="left">
<core-icon icon="create"></core-icon>
</core-tooltip>
<div id="flipper">
<core-tooltip id="hasUserEdits" label="Has User Metadata" noarrow position="left">
<core-icon icon="account-circle"></core-icon>
</core-tooltip>
<core-tooltip id="editorIsOpen" label="Editor Is Open" noarrow position="left">
<core-icon icon="create"></core-icon>
</core-tooltip>
</div>
</paper-item>
</template>
<script>