less公共方法

/** 常用色值 **/
@c_primary: #c7ad7b;
@c_fff: #fff;
@c_ccc: #ccc;
@c_999: #999;


@c_666: #666;
@c_000: #000000;
@c_dfdfdf: #DFDFDF;
@c_eee: #EEE;
@c_ddd: #ddd;
@c_bbb: #bbb;
@c_e8e8e8: #E8E8E8;
@c_d9d9d9: #d9d9d9;
@c_efefef: #efefef;
@c_f5f5f5: #f5f5f5;
@c_bfbfbf: #BFBFBF;
@c_F0F4F7: #F0F4F7;
@c_bg: #f8f8f8;
@c_434343: #434343;
@c_e4e4e4: #e4e4e4;
@c_A6813B: #A6813B;
@c_f7f7f7: #f7f7f7;
@c_888: #888;
@c_AC843A: #AC843A;
@c_F4DDB3: #F4DDB3;
@c_C7AD7B: #C7AD7B;
@c_f6f6f6: #f6f6f6;
@c_333: #333;
@c_B98A48: #B98A48;
@c_ED3737: #ED3737;
@c_A62424: #A62424;
@c_bca77e: #bca77e;
@c_A9926F: #A9926F;

/** 常用字体大小 **/
@font34: 34px;
@font24: 24px;
@font22: 22px;
@font20: 20px;
@font18: 18px;
@font16: 16px;
@font14: 14px;
@font12: 12px;
@headerH_93: 93px;
@headerH_45: 45px;
//git push -u origin master
.primary_btn(@h:24px,@b:12px,@c:@c_primary) {
  box-sizing: border-box;
  height: @h;
  line-height: @h;
  border: 1px solid @c;
  color: @c;
  border-radius: @b;
}

.primary_btn_active(@c:@c_primary) {
  border: 1px solid @c;
  color: @c;
}

.triangle(right,@tb:16px,@lr:10px,@c:@c_primary) {
  border-color: transparent transparent transparent @c;
  border-top-width: @tb;
  border-left-width: @lr;
  border-right-width: @lr;
  border-bottom-width: @tb;
}

.triangle(bottom,@tb:16px,@lr:10px,@c:@c_primary) {
  border-color: transparent transparent @c transparent;
  border-top-width: @tb;
  border-left-width: @lr;
  border-right-width: @lr;
  border-bottom-width: @tb;
}

.triangle(top,@tb:16px,@lr:10px,@c:@c_primary) {
  border-color: @c transparent transparent transparent;
  border-top-width: @tb;
  border-left-width: @lr;
  border-right-width: @lr;
  border-bottom-width: @tb;
}

.triangle(@_,@tb:16px,@lr:10px,@c:@c_primary) {
  display: inline-block;
  content: "";
  width: 0;
  height: 0;
  border-style: solid;
}

.mixin_line-ellipses(@line-num: 1) {
  //white-space: nowrap;
  text-overflow: ellipsis;
  //overflow: hidden;
  //@supports(-webkit-line-clamp: 1) {
  display: -webkit-box;
  /* autoprefixer: off */
  -webkit-box-orient: vertical;
  /* autoprefixer: on */
  -webkit-line-clamp: @line-num;
  word-break: break-all;
  overflow: hidden;
  white-space: normal;
  //text-overflow: clip;
  //}
}

.icon_fun(@w:14px,@h:14px,@c:@c_primary) {
  width: @w;
  font-size: @w;
  height: @h;
  line-height: @h;
  color: @c;
}

.dividingLine(@w:14px,@m:14px) {
  border-width: 0;
  background: @c_dfdfdf;
  width: 1px;
  height: @w;
  margin: 0 @m;
}

.iconDelete(@w:14px,@c:#818d9a) {
  cursor: pointer;
  margin-left: 10px;
  width: @w;
  font-size: @w;
  height: @w;
  line-height: @w;
  color: @c;
}

.mixin_bg-image(@url:"user-queehg") {
  @iconUrl2: "@2x.png";
  background: url("@{url}@{iconUrl2}") no-repeat 0 0;
  background-size: 100% 100%;
  @media (-webkit-min-device-pixel-ratio: 3),(min-device-pixel-ratio: 3) {
    @iconUrl3: "@3x.png";
    .mixin_bg-image(@url:"user-queehg") {
      background: url("@{url}@{iconUrl3}") no-repeat 0 0;
      background-size: 100% 100%;
    }
  }
}

.mixin_bg-img(@url:"user-queehg") {
  background: url("@{url}") no-repeat 0 0;
  background-size: 100% 100%;
}

.mixin_bg-update-img(@url:"user-queehg") {
  background-image: url("@{url}");
}

.mixin_vertical_level(@index:10) {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: @index;
}

.mixin_bg_img_cover() {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.mixin_icon_img_cover() {
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
}

.mixin_font_size(@h:14px,@c:@c_333) {
  font-size: @h;
  line-height: @h;
  color: @c;
}

.mixin_iconfont(@h:14px) {
  height: @h;
  line-height: @h;
  font-size: @h;
}

@scrollbar-color: #999;
.mixin_scroll-default-style (@width: 2px) {
  &::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 @width rgba(0, 0, 0, 0.15);
    background-color: #fff;
  }
  &::-webkit-scrollbar {
    width: @width;
    background-color: #fff;
  }
  &::-webkit-scrollbar-thumb {
    background-color: @scrollbar-color;
    border-radius: @width;
    background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0.5) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0.5) 75%, transparent 75%, transparent)
  }
}

 

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值