Style fixes

This commit is contained in:
Juan 2018-03-09 14:20:36 +01:00
parent bbcd39f30d
commit b5bc7f24c4
8 changed files with 58 additions and 39 deletions

View File

@ -12,17 +12,21 @@
<vn-auto style="position: relative" pad-medium text-center>
<img
ng-src="http://verdnatura.es/vn-image-data/catalog/200x200/{{::$ctrl.item.image}}"
zoom-image="http://verdnatura.es/vn-image-data/catalog/900x900/{{::$ctrl.item.image}}" on-error-src/>
<a href="https://www.verdnatura.es/#!form=admin/items&filter={{::$ctrl.item.id}}" target="_blank"><vn-float-button icon="edit"
style="position: absolute; bottom: 1em; right: 1em;"
vn-visible-by="administrative"></vn-float-button>
zoom-image="http://verdnatura.es/vn-image-data/catalog/900x900/{{::$ctrl.item.image}}"
on-error-src/>
<a href="https://www.verdnatura.es/#!form=admin/items&filter={{::$ctrl.item.id}}" target="_blank">
<vn-float-button
icon="edit"
style="position: absolute; margin: 1em; bottom: 0; right: 0;"
vn-visible-by="administrative">
</vn-float-button>
</a>
</vn-auto>
<vn-auto pad-medium>
<h6>{{$ctrl.item.name}}</h6>
<div><vn-label translate>Id</vn-label> {{$ctrl.item.id}}</div>
<div ng-repeat="itemTag in $ctrl.itemTags | limitTo:4">
<div><vn-label translate>{{$ctrl.tags[itemTag.tagFk].name}}</vn-label>: {{itemTag.value}}</div>
<div><vn-label translate>{{$ctrl.tags[itemTag.tagFk].name}}</vn-label> {{itemTag.value}}</div>
</div>
</vn-auto>
</vn-vertical>

View File

@ -1,5 +1,5 @@
<vn-horizontal>
<ul style="list-style-type: none; margin: 0; padding: 0; width: 100%; color: #666;">
<ul style="list-style-type: none; margin: 0; padding: 0; width: 100%;">
<vn-menu-item ng-repeat="item in $ctrl.items" item="::item"></vn-menu-item>
</ul>
</vn-horizontal>

View File

@ -1,5 +1,5 @@
import ngModule from '../../module';
import './style.css';
import './style.scss';
export default class LeftMenu {
constructor(aclService, $state) {

View File

@ -1,7 +1,9 @@
<li ng-class="{active: $ctrl.item.active}">
<a ui-sref="{{::$ctrl.item.href}}" style="display: block; text-decoration: none; color: inherit; padding: .5em 2em;">
<i class="material-icons" style="float: right; margin-left: .4em;">keyboard_arrow_right</i>
<i class="material-icons" style="vertical-align: middle; margin-right: .4em;">{{::$ctrl.item.icon}}</i>
<a ui-sref="{{::$ctrl.item.href}}"
class="vn-clickable"
style="display: block; text-decoration: none; padding: .5em 2em;">
<vn-icon icon="keyboard_arrow_right" class="material-icons" style="float: right; margin-left: .4em;"></vn-icon>
<vn-icon icon="{{::$ctrl.item.icon}}" class="material-icons" style="vertical-align: middle; margin-right: .4em;"></vn-icon>
<span translate>{{::$ctrl.item.description}}</span>
</a>
</li>

View File

@ -1,7 +0,0 @@
vn-menu-item a:hover {
color: white !important;
background-color: #424242;
}
vn-menu-item li.active{
background-color: #E6E6E6;
}

View File

@ -0,0 +1,7 @@
vn-menu-item {
& > li.active {
background-color: #424242;
color: white;
}
}

View File

@ -26,11 +26,11 @@ html [bg-dark-menu], .bg-dark-menu {
background-color: darken($bg-dark-menu, 35%);
}
/* Color para items seleccionados */
.bg-dark-item{
.bg-dark-item {
background-color: $bg-dark-bar;
color: $color-white;
}
/* Color para items inactivos */
.bg-opacity-item{
.bg-opacity-item {
opacity: 0.6;
}

View File

@ -24,15 +24,6 @@ html [fixed-bottom-right] {
bottom: 2em;
right: 2em;
}
vn-label {
font-size: .9em;
color: #666;
}
vn-button-bar {
display: block;
margin-top: $margin-small;
}
html [text-center], .text-center {
text-align: center;
}
@ -105,6 +96,33 @@ html [noDrop], .noDrop{
cursor: no-drop;
}
a {
color: inherit;
}
.vn-clickable {
cursor: pointer;
transition: background-color 250ms ease-out;
&:hover {
background-color: rgba(0, 0, 0, .1);
}
}
button {
@extend .vn-clickable;
}
vn-label {
font-size: .9em;
color: #666;
}
vn-button-bar {
display: block;
margin-top: $margin-small;
}
vn-main-block {
display:block;
max-width: 1920px;
@ -118,6 +136,7 @@ vn-main-block {
padding-bottom: 1em;
}
}
.vn-descriptor {
& .header {
background: #ffa410;
@ -130,15 +149,15 @@ vn-main-block {
font-size: 2.5em;
}
& > a {
@extend .vn-clickable;
display: flex;
align-items: center;
padding: .5em;
color: white;
text-decoration: none;
transition: background-color 250ms ease-out;
&:hover {
background-color: rgba(1, 1, 1, 0.1);
}
& > vn-icon {
font-size: 1.8em;
}
@ -154,19 +173,12 @@ vn-main-block {
.vn-list-item {
@extend .pad-medium;
@extend .border-solid-bottom;
@extend .vn-clickable;
display: block;
text-decoration: none;
color: inherit;
&:hover {
color: white;
background-color: #424242;
vn-label {
color: #aaa;
}
}
& > vn-horizontal > .buttons {
align-items: center;
@ -174,6 +186,7 @@ vn-main-block {
opacity: .4;
color: #ffa410;
margin-left: .5em;
transition: opacity 250ms ease-out;
&:hover {
opacity: 1;