Mailspring/internal_packages/plugins/stylesheets/plugins.less
2016-04-07 14:32:51 -07:00

124 lines
2.9 KiB
Plaintext

@import "ui-variables";
@import "ui-mixins";
.plugins-view-tabs {
color: @text-color-subtle;
list-style-type: none;
padding-left:0;
cursor: default;
li {
padding: @padding-large-vertical @padding-large-horizontal;
border-bottom: 1px solid @border-color-divider;
&.active {
background: @source-list-active-bg;
color: @source-list-active-color;
img.colorfill {
background: @source-list-active-color;
}
}
}
}
.plugins-view {
max-width: 800px;
margin: 0 auto;
.new-package {
margin-bottom: 50px;
}
.installed, .explore {
overflow-y: scroll;
padding-left: @padding-large-horizontal;
height: 100%;
.inner {
max-width: 800px;
.search-container {
margin: @padding-large-vertical 0;
justify-content: space-between;
}
}
input {
box-sizing: border-box;
width: 30%;
}
.search {
padding-left: 0;
background-repeat: no-repeat;
background-image: url("../static/images/search/searchloupe@2x.png");
background-size: 15px 15px;
background-position: 7px 4px;
text-indent: 31px;
}
.empty {
color: @text-color-very-subtle;
margin-bottom: @padding-large-vertical * 2;
}
}
.package-set {
margin-top: 35px;
}
.package {
align-items: center;
background: @background-primary;
border: 1px solid @border-color-divider;
border-radius: @border-radius-large;
margin-top: @padding-large-vertical;
margin-bottom: @padding-large-vertical;
padding: @padding-large-vertical @padding-large-horizontal;
.icon-container {
width: 52px;
height: 52px;
border-radius: 6px;
background: linear-gradient(to bottom, @background-primary 0%, @background-secondary 100%);
box-shadow: 0 0.5px 0 rgba(0,0,0,0.15), 0 -0.5px 0 rgba(0,0,0,0.15), 0.5px 0 0 rgba(0,0,0,0.15), -0.5px 0 0 rgba(0,0,0,0.15), 0 0.5px 1px rgba(0, 0, 0, 0.15);
flex-shrink: 0;
margin-right: @padding-large-horizontal;
text-align: center;
line-height: 50px;
}
.info {
max-width: 380px;
cursor: default;
.title {
color: @text-color-heading;
font-size: @font-size-h4;
font-weight: @font-weight-normal;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.uninstall-plugin {
color: @text-color-link;
margin-left: 10px;
margin-top: 4px;
}
.description {
padding-top:@padding-base-vertical;
color: @text-color-very-subtle;
font-size: @font-size-small;
}
}
.actions {
flex: 1;
text-align: right;
.btn {
margin-left:@padding-small-horizontal;
}
}
.update-info {
background: fade(@accent-primary, 10%);
line-height: @line-height-computed * 1.1;
.btn {
float: right;
}
}
}
}