Nemcio/meanTorrent
1
0
Fork 0
mirror of https://github.com/taobataoma/meanTorrent.git synced 2026-03-03 18:51:09 +01:00
Code Issues Packages Projects Releases Wiki Activity

chg(about): change oper list item css style

Browse Source
This commit is contained in:
OldHawk
2018-01-15 10:54:17 +08:00
parent 6194132f1e
commit dd83028c27
2 changed files with 21 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files

59
modules/about/client/less/about.less
View File

@@ -4,9 +4,9 @@
.black-item {
cursor: pointer;
position: relative;
border: solid 1px #333;
border: solid 1px #1a1a1a;
border-radius: 4px;
background-color: #555;
background-color: #2a2a2a;
padding: 10px 0 15px 0;
margin: 20px 0 0 0;
overflow: hidden;
@@ -56,65 +56,30 @@
.oper-item {
cursor: pointer;
position: relative;
border: solid 1px darken(@state-danger-text, 15%);
border-radius: 4px;
background-color: lighten(@state-danger-text, 5%);
padding: 10px 0 10px 0;
margin: 20px 0 0 0;
//margin: 10px 0 0 0;
overflow: hidden;
&.is-admin {
background-color: darken(@state-danger-text, 10%);
}
.fa {
transition-property: transform, opacity;
transition-duration: .5s;
transition-timing-function: ease;
font-size: 7em;
color: #888;
}
span {
color: #ddd;
position: relative;
z-index: 100;
}
div {
color: #999;
position: relative;
z-index: 100;
}
&:hover {
.fa {
/* csslint ignore:start */
transform: scale(1.5);
/* csslint ignore:end */
}
.h3, .h4, div {
color: #fff;
}
.oper-icon {
opacity: 0.3;
}
//background-color: #ccc;
}
.oper-avatar {
img {
cursor: pointer;
float: left;
margin-left: 10px;
margin: 0 10px;
border-radius: 3px;
height: 80px;
width: 80px;
}
}
}
.oper-icon {
position: absolute;
top: 2px;
right: -40px;
opacity: 0.5;
.oper-info {
margin-top: 5px;
.oper-name, oper-msg {
font-size: 18px;
font-weight: 500;
}
}
}
}

17
modules/about/client/views/operlist.client.view.html
View File

@@ -1,6 +1,6 @@
<section class="container" ng-controller="AboutController as vm" ng-init="vm.getOperList();">
<div class="row margin-top-20">
<div class="col-sm-12 col-md-10 col-md-offset-1">
<div class="col-sm-12">
<span>
<h3 class="margin-bottom-30">
{{'ABOUT.OPER_LIST' | translate}}
@@ -14,17 +14,18 @@
</div>
<div class="row oper-list">
<div class="col-sm-6 col-md-4" ng-repeat="o in vm.operList">
<div class="text-center oper-item"
<div class="col-sm-6 col-md-4 col-lg-3" ng-repeat="o in vm.operList">
<div class="oper-item" mt-scale-by-mouse="{scale: 1.1, duration: '.5s'}"
ui-sref="userinfo({userId: o._id})"
ng-class="{'is-admin': o.isAdmin}">
<span user-info="o" info-class="oper-avatar" info-avatar></span>
<span info-class="h4" user-info="o" info-name></span>
<span to-class="h5" message-to="o" to-class="message-to-icon"></span>
<div class="oper-info">
<span info-class="oper-name" user-info="o" info-name></span>
<span to-class="oper-msg" message-to="o" to-class="message-to-icon"></span>
<div class="margin-top-10">ID: {{o.username}}</div>
<div>{{o.isAdmin ? 'Administrator' : 'Operator'}}</div>
<i class="fa fa-user-circle-o text-danger oper-icon"></i>
<div class="margin-top-10">ID: {{o.username}}</div>
<div>{{o.isAdmin ? 'Administrator' : 'Operator'}}</div>
</div>
</div>
</div>
</div>