/*
*对常见的多行样式进行了方法封装，方便调用，加快开发效率
*/

// 背景图片地址和大小 
.ms-background(@url) {
    background-image: url(@url);
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

// 圆角
.ms-radius(@radius) {
    -webkit-border-radius: @radius;
    -moz-border-radius: @radius;
    -ms-border-radius: @radius;
    -o-border-radius: @radius;
    border-radius: @radius;
}

//宽高
.ms-width-height(@width, @height: @width) {
    width: @width;
    height: @height;
}

//字体大小，颜色 ，字体粗细
.ms-font(@size, @color , @weight:initial) {
    font-weight: @weight;
    font-size: @size;
    color: @color;
}

//flex 布局和 子元素 对其方式
.ms-flex(@type: space-between) {
    display: flex;
    justify-content: @type;
}

//行级flex 布局和 子元素 对其方式
.ms-inline-flex(@type: space-between) {
    display: inline-flex;
    justify-content: @type;
}

//多行超文本隐藏
.ms-ellipsis-clamp(@num) {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: @num;
    -webkit-box-orient: vertical;
}

//行高和高
.ms-line-height(@num, @value: @num) {
    height: @num;
    line-height: @value;
}

//圆角元素
.ms-radius-size(@radius, @width, @height: @width) {
    .ms-width-height(@width, @height);
    .ms-radius(@radius);
    text-align: center;
    line-height: @height;
}

//边距
.ms-margin-padding(@margin, @padding: @margin) {
    margin: @margin;
    padding: @padding;
}