Improve appearance of plugin chooser

This commit is contained in:
Jeremy Ruston
2019-09-19 13:20:07 +01:00
parent bf9aeb5755
commit d91fcd990e
2 changed files with 64 additions and 26 deletions

View File

@@ -2070,11 +2070,13 @@ html body.tc-body.tc-single-tiddler-window {
}
.tc-plugin-info {
display: block;
display: flex;
border: 1px solid <<colour muted-foreground>>;
fill: <<colour muted-foreground>>;
background-colour: <<colour background>>;
margin: 0.5em 0 0.5em 0;
padding: 4px;
align-items: center;
}
.tc-plugin-info-disabled {
@@ -2099,40 +2101,57 @@ a.tc-tiddlylink.tc-plugin-info:hover .tc-plugin-info > .tc-plugin-info-chunk > s
}
.tc-plugin-info-chunk {
display: inline-block;
vertical-align: middle;
margin: 2px;
}
.tc-plugin-info-chunk h1 {
font-size: 1em;
margin: 2px 0 2px 0;
.tc-plugin-info-chunk.tc-plugin-info-toggle {
flex-grow: 0;
flex-shrink: 0;
}
.tc-plugin-info-chunk h2 {
.tc-plugin-info-chunk.tc-plugin-info-icon {
flex-grow: 0;
flex-shrink: 0;
}
.tc-plugin-info-chunk.tc-plugin-info-description {
flex-grow: 1;
}
.tc-plugin-info-chunk.tc-plugin-info-buttons {
font-size: 0.8em;
line-height: 1.2;
flex-grow: 0;
flex-shrink: 0;
text-align: right;
}
.tc-plugin-info-chunk.tc-plugin-info-description h1 {
font-size: 1em;
line-height: 1.2;
margin: 2px 0 2px 0;
}
.tc-plugin-info-chunk div {
.tc-plugin-info-chunk.tc-plugin-info-description h2 {
font-size: 0.8em;
line-height: 1.2;
margin: 2px 0 2px 0;
}
.tc-plugin-info-chunk.tc-plugin-info-description div {
font-size: 0.7em;
line-height: 1.2;
margin: 2px 0 2px 0;
}
.tc-plugin-info:hover > .tc-plugin-info-chunk > img, .tc-plugin-info:hover > .tc-plugin-info-chunk > svg {
width: 2em;
height: 2em;
fill: <<colour foreground>>;
.tc-plugin-info-chunk.tc-plugin-info-toggle img, .tc-plugin-info-chunk.tc-plugin-info-toggle svg {
width: 1.5em;
height: 1.5em;
}
.tc-plugin-info > .tc-plugin-info-chunk > img, .tc-plugin-info > .tc-plugin-info-chunk > svg {
.tc-plugin-info-chunk.tc-plugin-info-icon img, .tc-plugin-info-chunk.tc-plugin-info-icon svg {
width: 2em;
height: 2em;
fill: <<colour muted-foreground>>;
}
.tc-plugin-info.tc-small-icon > .tc-plugin-info-chunk > img, .tc-plugin-info.tc-small-icon > .tc-plugin-info-chunk > svg {
width: 1em;
height: 1em;
}
.tc-plugin-info-dropdown {
@@ -2151,6 +2170,20 @@ a.tc-tiddlylink.tc-plugin-info:hover .tc-plugin-info > .tc-plugin-info-chunk > s
padding: 1em 1em 1em 1em;
}
.tc-plugin-library-listing .tc-install-plugin {
font-weight: bold;
background: green;
color: white;
fill: white;
border-radius: 4px;
padding: 3px;
}
.tc-plugin-library-listing .tc-install-plugin.tc-reinstall {
background: blue;
}
.tc-check-list {
line-height: 2em;
}