yummacss 1.2.0 → 2.1.0

package/yumma-css/_breakpoints.scss

@@ -1,43 +0,0 @@
-$breakpoints: (
-    "xs": 0,
-    "sm": 480px,
-    "md": 720px,
-    "lg": 960px,
-    "xl": 1200px
-);
-
-@mixin xs {
-    @media (min-width: map-get($breakpoints, "xs")) {
-        @content;
-    }
-}
-
-@mixin sm {
-    @media (min-width: map-get($breakpoints, "sm")) {
-        @content;
-    }
-}
-
-@mixin md {
-    @media (min-width: map-get($breakpoints, "md")) {
-        @content;
-    }
-}
-
-@mixin lg {
-    @media (min-width: map-get($breakpoints, "lg")) {
-        @content;
-    }
-}
-
-@mixin xl {
-    @media (min-width: map-get($breakpoints, "xl")) {
-        @content;
-    }
-}
-
-@mixin breakpoint($bp: 0) {
-    @media (min-width: $bp) {
-        @content;
-    }
-}

package/yumma-css/_colors.scss

@@ -1,323 +0,0 @@
-@each $k, $v in $yma-colors {
-    // backgrounds
-    .bg-#{$k} {
-        background-color: $v;
-    }
-
-    .h\:bg-#{$k} {
-        &:hover {
-            background-color: $v;
-        }
-    }
-
-    // border colors
-    .bc-#{$k} {
-        border-color: $v;
-        border-style: solid;
-        border-width: 1px;
-    }
-
-    .h\:bc-#{$k} {
-        &:hover {
-            border-color: $v;
-            border-style: solid;
-            border-width: 1px;
-        }
-    }
-
-    .bc-b-#{$k} {
-        border-bottom-color: $v;
-        border-style: solid;
-        border-width: 1px;
-    }
-
-    .h\:bc-b-#{$k} {
-        &:hover {
-            border-bottom-color: $v;
-            border-style: solid;
-            border-width: 1px;
-        }
-    }
-
-    .bc-l-#{$k} {
-        border-left-color: $v;
-        border-style: solid;
-        border-width: 1px;
-    }
-
-    .h\:bc-l-#{$k} {
-        &:hover {
-            border-left-color: $v;
-            border-style: solid;
-            border-width: 1px;
-        }
-    }
-
-    .bc-r-#{$k} {
-        border-right-color: $v;
-        border-style: solid;
-        border-width: 1px;
-    }
-
-    .h\:bc-r-#{$k} {
-        &:hover {
-            border-right-color: $v;
-            border-style: solid;
-            border-width: 1px;
-        }
-    }
-
-    .bc-t-#{$k} {
-        border-top-color: $v;
-        border-style: solid;
-        border-width: 1px;
-    }
-
-    .h\:bc-t-#{$k} {
-        &:hover {
-            border-top-color: $v;
-            border-style: solid;
-            border-width: 1px;
-        }
-    }
-
-    // text color
-    .t-#{$k} {
-        color: $v;
-    }
-
-    .h\:t-#{$k} {
-        &:hover {
-            color: $v;
-        }
-    }
-
-    // caret colors
-    .cc-#{$k} {
-        caret-color: $v;
-    }
-
-    .h\:cc-#{$k} {
-        &:hover {
-            caret-color: $v;
-        }
-    }
-
-    .td-#{$k} {
-        text-decoration-color: $v;
-    }
-
-    .h\:td-#{$k} {
-        &:hover {
-            text-decoration-color: $v;
-        }
-    }
-
-    @if ($v !=black and $v !=white) {
-        // light variations
-        @for $i from 1 through 6 {
-            .bg-l-#{$k}-#{$i} {
-                background-color: mix(white, $v, $i * 10%);
-            }
-
-            .h\:bg-l-#{$k}-#{$i} {
-                &:hover {
-                    background-color: mix(white, $v, $i * 10%);
-                }
-            }
-
-            .bc-l-#{$k}-#{$i} {
-                border-color: mix(white, $v, $i * 10%);
-                border-style: solid;
-                border-width: 1px;
-            }
-
-            .h\:bc-l-#{$k}-#{$i} {
-                &:hover {
-                    border-color: mix(white, $v, $i * 10%);
-                    border-style: solid;
-                    border-width: 1px;
-                }
-            }
-
-            .bc-b-l-#{$k}-#{$i} {
-                border-bottom-color: mix(white, $v, $i * 10%);
-                border-style: solid;
-                border-width: 1px;
-            }
-
-            .h\:bc-b-l-#{$k}-#{$i} {
-                &:hover {
-                    border-bottom-color: mix(white, $v, $i * 10%);
-                    border-style: solid;
-                    border-width: 1px;
-                }
-            }
-
-            .bc-l-l-#{$k}-#{$i} {
-                border-left-color: mix(white, $v, $i * 10%);
-                border-style: solid;
-                border-width: 1px;
-            }
-
-            .h\:bc-l-l-#{$k}-#{$i} {
-                &:hover {
-                    border-left-color: mix(white, $v, $i * 10%);
-                    border-style: solid;
-                    border-width: 1px;
-                }
-            }
-
-            .bc-r-l-#{$k}-#{$i} {
-                border-right-color: mix(white, $v, $i * 10%);
-                border-style: solid;
-                border-width: 1px;
-            }
-
-            .h\:bc-r-l-#{$k}-#{$i} {
-                &:hover {
-                    border-right-color: mix(white, $v, $i * 10%);
-                    border-style: solid;
-                    border-width: 1px;
-                }
-            }
-
-            .bc-t-l-#{$k}-#{$i} {
-                border-top-color: mix(white, $v, $i * 10%);
-                border-style: solid;
-                border-width: 1px;
-            }
-
-            .h\:bc-t-l-#{$k}-#{$i} {
-                &:hover {
-                    border-top-color: mix(white, $v, $i * 10%);
-                    border-style: solid;
-                    border-width: 1px;
-                }
-            }
-
-            .t-l-#{$k}-#{$i} {
-                color: mix(white, $v, $i * 10%);
-            }
-
-            .h\:t-l-#{$k}-#{$i} {
-                &:hover {
-                    color: mix(white, $v, $i * 10%);
-                }
-            }
-
-            .cc-l-#{$k}-#{$i} {
-                caret-color: mix(white, $v, $i * 10%);
-            }
-
-            .h\:cc-l-#{$k}-#{$i} {
-                &:hover {
-                    caret-color: mix(white, $v, $i * 10%);
-                }
-            }
-        }
-
-        // dark variations
-        @for $i from 1 through 6 {
-            .bg-d-#{$k}-#{$i} {
-                background-color: mix(black, $v, $i * 10%);
-            }
-
-            .h\:bg-d-#{$k}-#{$i} {
-                &:hover {
-                    background-color: mix(black, $v, $i * 10%);
-                }
-            }
-
-            .bc-d-#{$k}-#{$i} {
-                border-color: mix(black, $v, $i * 10%);
-                border-style: solid;
-                border-width: 1px;
-            }
-
-            .h\:bc-d-#{$k}-#{$i} {
-                &:hover {
-                    border-color: mix(black, $v, $i * 10%);
-                    border-style: solid;
-                    border-width: 1px;
-                }
-            }
-
-            .bc-b-d-#{$k}-#{$i} {
-                border-bottom-color: mix(black, $v, $i * 10%);
-                border-style: solid;
-                border-width: 1px;
-            }
-
-            .h\:bc-b-d-#{$k}-#{$i} {
-                &:hover {
-                    border-bottom-color: mix(black, $v, $i * 10%);
-                    border-style: solid;
-                    border-width: 1px;
-                }
-            }
-
-            .bc-l-d-#{$k}-#{$i} {
-                border-left-color: mix(black, $v, $i * 10%);
-                border-style: solid;
-                border-width: 1px;
-            }
-
-            .h\:bc-l-d-#{$k}-#{$i} {
-                &:hover {
-                    border-left-color: mix(black, $v, $i * 10%);
-                    border-style: solid;
-                    border-width: 1px;
-                }
-            }
-
-            .bc-r-d-#{$k}-#{$i} {
-                border-right-color: mix(black, $v, $i * 10%);
-                border-style: solid;
-                border-width: 1px;
-            }
-
-            .h\:bc-r-d-#{$k}-#{$i} {
-                &:hover {
-                    border-right-color: mix(black, $v, $i * 10%);
-                    border-style: solid;
-                    border-width: 1px;
-                }
-            }
-
-            .bc-t-d-#{$k}-#{$i} {
-                border-top-color: mix(black, $v, $i * 10%);
-                border-style: solid;
-                border-width: 1px;
-            }
-
-            .h\:bc-t-d-#{$k}-#{$i} {
-                &:hover {
-                    border-top-color: mix(black, $v, $i * 10%);
-                    border-style: solid;
-                    border-width: 1px;
-                }
-            }
-
-            .t-d-#{$k}-#{$i} {
-                color: mix(black, $v, $i * 10%);
-            }
-
-            .h\:t-d-#{$k}-#{$i} {
-                &:hover {
-                    color: mix(black, $v, $i * 10%);
-                }
-            }
-
-            .cc-d-#{$k}-#{$i} {
-                caret-color: mix(black, $v, $i * 10%);
-            }
-
-            .h\:cc-d-#{$k}-#{$i} {
-                &:hover {
-                    caret-color: mix(black, $v, $i * 10%);
-                }
-            }
-        }
-    }
-}

package/yumma-css/_fonts.scss

@@ -1,19 +0,0 @@
-.ff-d {
-    font-family: $yma-system-fonts;
-    font-weight: $yma-font-weight;
-}
-
-.ff-c {
-    font-family: $yma-charter-fonts;
-    font-weight: $yma-font-weight;
-}
-
-.ff-i {
-    font-family: $yma-inter-fonts;
-    font-weight: $yma-font-weight;
-}
-
-.ff-m {
-    font-family: $yma-monospace-fonts;
-    font-weight: $yma-font-weight;
-}

package/yumma-css/_grid.scss

@@ -1,75 +0,0 @@
-@use "sass:math";
-
-$grid-columns: 12;
-
-$grid-gaps: (
-    "0": 0,
-    "1": 10px,
-    "2": 20px,
-    "3": 30px,
-    "4": 40px,
-    "5": 50px,
-    "6": 60px
-);
-
-@each $k, $v in $grid-gaps {
-    .gap-#{$k} > * {
-        padding: $v;
-    }
-
-    .gap-#{$k} {
-        margin-left: -$v;
-        margin-right: -$v;
-    }
-}
-
-// column classes
-@include xs {
-    @for $i from 1 through $grid-columns {
-        .xs\:col-#{$i} {
-            box-sizing: border-box;
-            flex-grow: 0;
-            width: math.div($i * 100%, $grid-columns);
-        }
-    }
-}
-
-@include sm {
-    @for $i from 1 through $grid-columns {
-        .sm\:col-#{$i} {
-            box-sizing: border-box;
-            flex-grow: 0;
-            width: math.div($i * 100%, $grid-columns);
-        }
-    }
-}
-
-@include md {
-    @for $i from 1 through $grid-columns {
-        .md\:col-#{$i} {
-            box-sizing: border-box;
-            flex-grow: 0;
-            width: math.div($i * 100%, $grid-columns);
-        }
-    }
-}
-
-@include lg {
-    @for $i from 1 through $grid-columns {
-        .lg\:col-#{$i} {
-            box-sizing: border-box;
-            flex-grow: 0;
-            width: math.div($i * 100%, $grid-columns);
-        }
-    }
-}
-
-@include xl {
-    @for $i from 1 through $grid-columns {
-        .xl\:col-#{$i} {
-            box-sizing: border-box;
-            flex-grow: 0;
-            width: math.div($i * 100%, $grid-columns);
-        }
-    }
-}

package/yumma-css/_layout.scss

@@ -1,18 +0,0 @@
-.cnn {
-    width: 100%;
-    max-width: 1200px;
-    margin: 0 auto;
-    padding: 0 20px;
-    box-sizing: border-box;
-}
-
-.ins {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-}
-
-.row {
-    display: flex;
-    flex-flow: row wrap;
-}