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

Improved card and editor styling.

Browse Source
This commit is contained in:
Oliver Hamlet
2014-12-24 16:36:46 +00:00
parent 6fe467594d
commit a6ce485be3
2 changed files with 59 additions and 64 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/report/html/loot-plugin-card.html
+20 -12
View File
@@ -28,6 +28,11 @@ loot-clear-metadata
<polymer-element name="loot-plugin-card" attributes="data">
<template>
<style>
/* Material Design for non-button icons. */
core-tooltip > core-icon {
color: rgba(0, 0, 0, 0.54);
}
/* Host and front/editor styling. */
#wrapper {
display: block;
@@ -42,21 +47,17 @@ loot-clear-metadata
transform-style: preserve-3d;
}
:host(.highlight) #wrapper {
outline: 3px solid #69aaff;
outline: 4px solid #69aaff;
}
:host([data-active=false]) #activeTick {
visibility: hidden;
}
:host([data-bsa=false]) #loadsBSA {
display: none;
}
:host([data-dummy=false]) #dummyPlugin {
display: none;
}
:host([data-bsa=false]) #loadsBSA,
:host([data-dummy=false]) #dummyPlugin,
:host(:not([data-edits])) #hasUserEdits {
display: none;
}
#front, #editor {
#front {
display: block;
}
#editor {
@@ -79,7 +80,7 @@ loot-clear-metadata
}
/* Icon styling. */
#activeTick {
#activeTick > core-icon {
color: green;
}
@@ -91,14 +92,14 @@ loot-clear-metadata
}
content::content > h1 {
display: inline-block;
font-weight: normal;
font-size: 1em;
font-weight: 400;
font-size: 1rem;
margin: 0;
}
content::content > .version {
display: inline-block;
margin-left: 16px;
color:#6394F8;
color: #6394F8;
}
content::content > .crc {
display: inline-block;
@@ -118,6 +119,13 @@ loot-clear-metadata
background: inherit;
height: 56px;
}
core-toolbar > div {
position: relative;
top: -4px;
}
core-tooltip > core-icon {
vertical-align: inherit !important;
}
#showOnlyConflicts {
display: block;
padding: 0 16px;
resources/report/html/loot-plugin-editor.html
+39 -52
View File
@@ -23,17 +23,20 @@ loot-editor-close
<polymer-element name="loot-plugin-editor" attributes="{{data}}">
<template>
<style>
/* Material Design for non-button icons. */
core-tooltip > core-icon {
color: rgba(0, 0, 0, 0.54);
}
/* Icon styling. */
:host-context(loot-plugin-card[data-active=false]) #activeTick {
visibility: hidden;
}
:host-context(loot-plugin-card[data-bsa=false]) #loadsBSA {
display: none;
}
:host-context(loot-plugin-card[data-bsa=false]) #loadsBSA,
:host-context(loot-plugin-card[data-dummy=false]) #dummyPlugin {
display: none;
}
#activeTick {
#activeTick > core-icon {
color: green;
}
#accept {
@@ -46,18 +49,18 @@ loot-editor-close
/* Content styling. */
h1 {
display: inline-block;
font-weight: normal;
font-size: 1em;
font-weight: 400;
font-size: 1rem;
margin: 0;
}
#version {
display: inline-block;
margin-left: 1em;
margin-left: 16px;
color:#6394F8;
}
#crc {
display: inline-block;
margin-left: 1em;
margin-left: 16px;
color:#BC8923;
}
:host-context(#main[data-hide-version]) #version,
@@ -66,54 +69,38 @@ loot-editor-close
}
/* Editor input styling. */
#main > * {
padding: 0 16px;
height: 48px;
}
#main > paper-checkbox, #main > core-tooltip {
display: table;
line-height: 48px;
}
#enableEdits {
margin-bottom: 1em;
}
/* Table styling. */
table {
margin: 0;
border-collapse: collapse;
width: 100%;
}
table:not(.core-selected), #main:not(.core-selected) {
core-selector > *:not(.core-selected) {
display: none;
}
td:last-child {
cursor: pointer;
}
td:last-child:hover {
color: red;
}
td, th {
vertical-align: top;
text-align: left;
padding: 0.5em;
}
th {
border-bottom: 1px black solid;
}
tbody tr:last-child {
cursor: pointer;
color: grey;
}
tbody tr:last-child:hover {
color: black;
}
/* Misc Styling. */
core-toolbar {
core-toolbar.medium-tall {
background: #E8EAF6;
height: 56px;
height: 104px;
}
#buttons {
text-align: right;
core-toolbar > div {
position: relative;
top: -4px;
}
#main {
padding: 16px;
core-tooltip > core-icon {
vertical-align: inherit !important;
}
#loadAfter,
#req,
#inc,
#message,
#tags,
#dirty,
#locations {
margin: 0;
}
</style>
<core-toolbar class="medium-tall">
@@ -167,7 +154,7 @@ loot-editor-close
</thead>
<tbody>
<!-- File rows go here. -->
<tr><td colspan="4">Add new row...</td><td></td></tr>
<tr><td colspan="3">Add new row...</td><td></td></tr>
</tbody>
</table>
<table is="editable-table" id="req" data-template="fileRow">
@@ -176,7 +163,7 @@ loot-editor-close
</thead>
<tbody>
<!-- File rows go here. -->
<tr><td colspan="4">Add new row...</td><td></td></tr>
<tr><td colspan="3">Add new row...</td><td></td></tr>
</tbody>
</table>
<table is="editable-table" id="inc" data-template="fileRow">
@@ -185,7 +172,7 @@ loot-editor-close
</thead>
<tbody>
<!-- File rows go here. -->
<tr><td colspan="4">Add new row...</td><td></td></tr>
<tr><td colspan="3">Add new row...</td><td></td></tr>
</tbody>
</table>
<table is="editable-table" id="message" data-template="messageRow">
@@ -203,7 +190,7 @@ loot-editor-close
</thead>
<tbody>
<!-- Bash Tag rows go here. -->
<tr><td colspan="4">Add new row...</td><td></td></tr>
<tr><td colspan="3">Add new row...</td><td></td></tr>
</tbody>
</table>
<table is="editable-table" id="dirty" data-template="dirtyInfoRow">
@@ -212,7 +199,7 @@ loot-editor-close
</thead>
<tbody>
<!-- Dirty info rows go here. -->
<tr><td colspan="4">Add new row...</td><td></td></tr>
<tr><td colspan="5">Add new row...</td><td></td></tr>
</tbody>
</table>
<table is="editable-table" id="locations" data-template="locationRow">
@@ -221,7 +208,7 @@ loot-editor-close
</thead>
<tbody>
<!-- Location rows go here. -->
<tr><td colspan="3">Add new row...</td><td></td></tr>
<tr><td colspan="2">Add new row...</td><td></td></tr>
</tbody>
</table>
</core-selector>