@sass-collective/sass-remdeprecated

Sass function & mixin to generate rem value.

Usage no npm install needed!

<script type="module">
  import sassCollectiveSassRem from 'https://cdn.skypack.dev/@sass-collective/sass-rem';
</script>

README

Sass Rem

Version Download Quality License

DEPRECATED: this package has been moved to new reference in Sass Collective monorepo @sass-collective/rem, use this package because the current repository is no more maintained.

Introduction

Sass function & mixin to generate rem value.

Install

npm install @sass-collective/sass-rem --save

Usage

Function

rem($values);

Mixin

rem($property, $values);

Variables

Names Values
$baseline 16

Update default context in global

@use "@sass-collective/sass-rem" with (
    $baseline: 16
);

Module System

@use "@sass-collective/sass-rem";

// Function

html,
body {
    // Single value
    font-size: sass-rem.rem(16);
    
    // Multiple values
    margin: sass-rem.rem(20 30);
}

// Mixin

html,
body {
    // Single value
    @include sass-rem.rem(font-size, 16);
    
    // Multiple values
    @include sass-rem.rem(margin, 20 30);
}

Legacy @import

@import "@sass-collective/sass-rem";

// Function

html,
body {
    font-size: sass-rem(16);
    margin: sass-rem(20 30);
}

// Mixin

html,
body {
    @include sass-rem(font-size, 16);
    @include sass-rem(margin, 20 30);
}

CSS

html,
body {
    font-size: 1rem;
    margin: 1.25rem 1.875rem;
}