少了css mixin rem计算器而没有针对字体或其他东西

Question

Morning everyone i have the following mixin and i would like to transform it into a global one. What i mean is without settings the margin i want to use it for font-size for example .. or for anything else that you might want to set it into rem / em units. I'm new to less and preprocessors and i was wondering if someone from here might help me out changing the code. thank you very much for your time.

.marginSizeCalc(@sv) {
  @sizeValue: unit(@sv);
  @remValue: (@sizeValue / @font-size-base);
  margin: unit(@sv,px);
  margin: unit(@remValue,rem);
}

Answer 1

Found a way to solve the problem... and i think it's even better than setting margin or font or anything else inside the mixin.

.marginSizeCalc(@sv) {
  @sizeValue: unit(@sv);
  @remValue: (@sizeValue / @font-size-base);
  @toRem: unit(@remValue, rem);
}

How To:

h1, h2, h3, h4, h5, h6 {
    font-family: @headings-font-family;
    font-weight: @headings-font-weight;
    color: @headings-font-color;
    margin: @remValue;
    margin: @toRem;
    .marginSizeCalc(@gutterWidth);
}

Update:

.marginSizeCalc(@sv, @db) {
  @sizeValue: unit(@sv);
  @divideBy: unit(@sv);
  @remValue: (@sizeValue / @divideBy);
  @toPx: unit(@remValue, px);
  @toRem: unit(@remValue, rem);
}

h1, h2, h3, h4, h5, h6 {
    font-family: @headings-font-family;
    font-weight: @headings-font-weight;
    color: @headings-font-color;
    margin: @toPx;
    margin: @toRem;
    .marginSizeCalc(@gutterWidth, 2);
}