update colours for package repo + installed packages

This commit is contained in:
Mads Rasmussen
2017-02-23 12:14:08 +01:00
parent cbcbb895ec
commit f2cefac866
3 changed files with 49 additions and 63 deletions

View File

@@ -23,7 +23,7 @@
.umb-packages-search {
width: 100%;
background: @grayLighter;
background: @gray-10;
border-radius: 3px;
padding: 30px;
box-sizing: border-box;
@@ -33,15 +33,13 @@
border-width: 2px;
border-radius: 3px;
min-height: 44px;
padding: 4px 10px;
font-size: 16px;
border-color: #ececec;
margin-bottom: 0;
border-color: @grayLight;
border-color: @gray-8;
&:hover, &:focus {
border-color: @grayLight;
border-color: @gray-8;
}
}
@@ -112,22 +110,17 @@
flex-wrap: wrap;
flex-direction: column;
justify-content: center;
position: relative;
box-sizing: border-box;
height: 100%;
width: 100%;
border: 1px solid #ececec;
border: 1px solid @gray-9;
border-radius: 3px;
text-decoration: none !important;
transition: border-color 100ms ease;
&:hover {
border-color: @blue;
border-color: @turquoise;
}
}
@@ -136,21 +129,16 @@
// Icon
.umb-package-icon {
display: flex;
justify-content: center;
align-items: center;
padding-top: 10px;
padding-right: 10px;
padding-left: 10px;
padding-bottom: 10px;
text-align: center;
background-color: white;
background-color: @white;
border-top-right-radius: 3px;
border-top-left-radius: 3px;
min-height: 60px;
}
@@ -168,11 +156,10 @@
padding-left: 15px;
padding-top: 15px;
text-align: center;
background: @grayLighter;
background: @gray-10;
border-bottom-left-radius: 3px;
border-bottom-right-radius: 3px;
border-top: 1px solid #ececec;
border-top: 1px solid @gray-9;
}
@@ -181,13 +168,10 @@
font-size: 14px;
max-width: 250px;
margin-bottom: 5px;
font-weight: bold;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
line-height: normal;
margin-left: auto;
margin-right: auto;
@@ -195,10 +179,9 @@
.umb-package-description {
font-size: 11px;
color: @grayMed;
color: @gray-4;
word-wrap: break-word;
line-height: 1.1rem;
white-space: nowrap;
max-width: 100%;
overflow: hidden;
@@ -211,15 +194,12 @@
flex-wrap: wrap;
flex-direction: row;
justify-content: center;
opacity: .6;
margin-top: 10px;
}
.umb-package-numbers small {
padding: 0 5px;
display: flex;
align-items: center;
justify-content: center;
@@ -234,7 +214,7 @@
}
.umb-package-link:hover .umb-package-numbers .icon-hearts {
color: red !important;
color: @red !important;
}
// Version
@@ -267,9 +247,9 @@
color: @black;
box-sizing: border-box;
justify-content: center;
border-top: 1px solid @grayLight;
border-bottom: 1px solid @grayLight;
border-right: 1px solid @grayLight;
border-top: 1px solid @gray-8;
border-bottom: 1px solid @gray-8;
border-right: 1px solid @gray-8;
padding: 10px 0;
}
@@ -286,30 +266,24 @@
@media (max-width: 992px) {
.umb-packages-category {
border: 1px solid @grayLight;
border: 1px solid @gray-8;
margin: 5px;
flex: 0 0 auto;
text-align: center;
padding: 10px;
max-width: 100%;
border-radius: 3px;
}
}
@media (min-width: 1100px) and (max-width: 1300px) {
.umb-packages-category {
border: 1px solid @grayLight;
border: 1px solid @gray-8;
margin: 5px;
flex: 0 0 auto;
text-align: center;
padding: 10px;
max-width: 100%;
border-radius: 3px;
}
}
@@ -318,17 +292,17 @@
.umb-packages-category:hover,
.umb-packages-category.-active {
text-decoration: none;
color: @blue;
color: @turquoise;
}
.umb-packages-category.-first {
border-left: 1px solid @grayLight;
border-left: 1px solid @gray-8;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.umb-packages-category.-last {
border-right: 1px solid @grayLight;
border-right: 1px solid @gray-8;
border-top-right-radius: 3px;
border-bottom-right-radius: 3px;
}
@@ -345,7 +319,7 @@ a.umb-package-details__back-link {
}
.umb-package-details__back-link:hover {
color: @grayMed;
color: @gray-4;
text-decoration: none;
}
@@ -382,7 +356,7 @@ a.umb-package-details__back-link {
}
.umb-package-details__section {
background: @grayLighter;
background: @gray-10;
padding: 20px;
margin-bottom: 20px;
border-radius: 3px;
@@ -391,7 +365,7 @@ a.umb-package-details__back-link {
.umb-package-details__section-title {
font-size: 17px;
font-weight: bold;
color: black;
color: @black;
margin-top: 0;
margin-bottom: 15px;
}
@@ -408,7 +382,7 @@ a.umb-package-details__back-link {
}
.umb-package-details__information-item-label {
color: black;
color: @black;
font-weight: bold;
}
@@ -418,7 +392,7 @@ a.umb-package-details__back-link {
.umb-package-details__information-item-label-2 {
font-size: 12px;
color: @grayMed;
color: @gray-4;
}
.umb-package-details__compatability {
@@ -441,12 +415,12 @@ a.umb-package-details__back-link {
/* Links */
.umb-package-details__link {
color: #DA3287;
font-weight: bold;
color: @black;
}
.umb-package-details__link:hover {
color: #B32D71;
text-decoration: none;
text-decoration: underline;
}
/* Owner profile */
@@ -462,13 +436,13 @@ a.umb-package-details__back-link {
.umb-package-details__owner-profile-name {
font-size: 15px;
color: #000000;
color: @black;
font-weight: bold;
}
.umb-package-details__owner-profile-karma {
font-size: 12px;
color: @grayMed;
color: @gray-4;
}
/* gallery */
@@ -480,7 +454,7 @@ a.umb-package-details__back-link {
.umb-gallery__thumbnail {
flex: 0 1 100px;
border: 1px solid @grayLight;
border: 1px solid @gray-8;
border-radius: 3px;
margin: 5px;
padding: 10px;
@@ -490,7 +464,7 @@ a.umb-package-details__back-link {
.umb-gallery__thumbnail:hover {
cursor: pointer;
border-color: @blue;
border-color: @turquoise;
}
/* PACKAGE LIST */
@@ -503,18 +477,20 @@ a.umb-package-details__back-link {
.umb-package-list__item {
display: flex;
flex-direction: row;
background: @grayLighter;
margin-bottom: 10px;
background: @gray-10;
margin-bottom: 5px;
border-radius: 3px;
padding: 20px;
padding: 15px 20px;
align-items: center;
}
.umb-package-list__item-icon {
flex: 0 0 50px;
flex: 0 0 35px;
margin-right: 20px;
font-size: 30px;
text-align: center;
justify-content: center;
align-items: center;
}
.umb-package-list__item-content {
@@ -531,7 +507,7 @@ a.umb-package-details__back-link {
.umb-package-list__item-description {
font-size: 14px;
color: @grayMed;
color: @gray-4;
}
.umb-package-list__item-actions {
@@ -539,3 +515,13 @@ a.umb-package-details__back-link {
display: flex;
justify-content: flex-end;
}
.umb-package-list__item-action {
font-weight: bold;
color: @gray-3;
}
.umb-package-list__item-action:hover {
text-decoration: none;
color: @red;
}

View File

@@ -24,7 +24,7 @@
</div>
<div class="umb-package-list__item-actions">
<button type="button" class="umb-era-button" ng-click="vm.confirmUninstall(installedPackage)">Uninstall</button>
<a class="umb-package-list__item-action" href="" ng-click="vm.confirmUninstall(installedPackage)">Uninstall</a>
</div>
</div>

View File

@@ -114,7 +114,7 @@
</div>
<!-- DETAILS --->
<!-- DETAILS -->
<div ng-if="vm.packageViewState === 'packageDetails' && vm.loading === false">
<umb-editor-sub-header>