<%= item.name %>
-
<% }) %>
diff --git a/source/less/_links.less b/source/less/_links.less
index fdd246b..afb6324 100755
--- a/source/less/_links.less
+++ b/source/less/_links.less
@@ -7,67 +7,68 @@
display: flex;
flex-wrap: wrap;
margin: -@gap/2;
- // justify-content: space-between;
.friend-card{
display: flex;
border-radius: @border_radius;
box-shadow: @boxshadow_card_normal, 0 4px 8px 0px rgba(0, 0, 0, 0.1);
background: #eee;
- // height: 10em;
- word-spacing: 4px;
margin: @gap/2;
color: fade(@color_text_main, 80%);
justify-content: flex-start;
@media(max-width: @on_phone){
width: 100%;
}
- &.float-btn{
- padding: @gap/2;
- text-align: left;
- }
&:hover{
text-decoration: none;
box-shadow: @boxshadow_card_raised, 0 32px 64px 0px rgba(0, 0, 0, 0.1);
transform: scale(1.05);
+ .friend-left{
.avatar{
- transform: scale(1.1);
+ transform: scale(1.1) rotate(12deg);
+ box-shadow: @boxshadow_card_raised;
}
+ }
+
}
.friend-left{
.avatar{
- width: 80px;
- height: 80px;
- margin: @gap/2;
+ width: 64px;
+ height: 64px;
+ min-width: 64px;
+ min-height: 64px;
+ margin: @gap;
border-radius: 100%;
border: 1px solid white;
+ box-shadow: @boxshadow_card_normal;
}
}
.friend-right{
flex: 1;
- margin: @gap @gap @gap 6px;
+ margin: @gap @gap @gap 0;
display: flex;
flex-direction: column;
justify-content: space-around;
+ .friend-tags-wrapper{
+ .enable-trans();
+ margin-left: -2px;
+ word-spacing: 4px;
+ word-break:break-all;
+ }
p{
margin: 0;
padding: 0;
+ text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
&.friend-name{
font-size: @fontsize_base;
font-weight: bold;
-
- // margin-top: 0;
- margin-bottom: 8px;
}
&.tags{
- margin: 0;
font-size: @fontsize_small * 0.85;
display: inline;
background: none;
+ word-wrap: break-word;
}
}
- .friend-tags-wrapper{
- margin-left: -2px;
- }
}
}
}
diff --git a/source/less/_widget.less b/source/less/_widget.less
index 0470222..ff2145c 100755
--- a/source/less/_widget.less
+++ b/source/less/_widget.less
@@ -95,10 +95,6 @@
author{
.enable-trans();
- @media(max-width: @on_phone){
- box-shadow: none;
- background: @theme_background;
- }
h2{
text-align: center;
// color: @color_text_header;
@@ -164,6 +160,13 @@
}
}
}
+ @media(max-width: @on_phone){
+ box-shadow: none;
+ background: @theme_background;
+ .social-wrapper{
+ justify-content: center;
+ }
+ }
}
mywidget{