lesli 5.0.2 → 5.0.3

data/vendor/lesli-css/tests/mixins/breakpoint.spec.scss

@@ -0,0 +1,429 @@
+/*
+
+Lesli
+
+Copyright (c) 2020, Lesli Technologies, S. A.
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program. If not, see <http://www.gnu.org/licenses/>.
+
+LesliCSS - SCSS Utilities for websites, apps and web applications
+
+Powered by https://www.lesli.tech
+Building a better future, one line of code at a time.
+
+@contact  <hello@lesli.tech>
+@website  <https://lesli.tech>
+@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
+
+// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
+// · 
+
+*/
+
+
+// · 
+@import "true";
+@import "../../src/mixins/breakpoint.scss";
+
+
+// · 
+// Describe what you're testing
+@include describe('@mixin lesli-css-breakpoint-builder($min, $max)') {
+
+    @include it('should create a breakpoint for small sizes') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-builder("small", "small") {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (min-width: 320px) and (max-width: 520px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+
+    @include it('should create a breakpoint for small as min-width') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-builder("small") {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (min-width: 320px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint for small size') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-small {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (max-width: 520px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint for mobile size') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-mobile {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (max-width: 768px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint above tablet size') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-tablet {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (min-width: 769px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint above desktop size') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-desktop {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (min-width: 1024px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint above widescreen size') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-widescreen {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (min-width: 1216px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint above fullhd size') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-fullhd {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (min-width: 1408px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint until tablet ') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-until-tablet {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (max-width: 1023px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint until desktop ') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-until-desktop {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (max-width: 1215px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint until widescreen ') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-until-widescreen {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (max-width: 1407px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint only for tablet ') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-only-tablet {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (min-width: 769px) and (max-width: 1023px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint only for desktop ') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-only-desktop {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (min-width: 1024px) and (max-width: 1215px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint only for widescreen ') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint-only-widescreen {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (min-width: 1216px) and (max-width: 1407px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint with 10px width min') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint(10px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (min-width: 10px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+    @include it('should create a breakpoint with 10px width min and 666px width max') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-breakpoint(10px, 666px) {
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+            @include expect {
+                @media only screen and (min-width: 10px) and (max-width: 666px){
+                    .div {
+                        color: red;
+                    }
+                }
+            }
+
+        }
+
+    }
+
+}

data/vendor/lesli-css/tests/mixins/scrollbar.spec.scss

@@ -0,0 +1,82 @@
+/*
+
+Lesli
+
+Copyright (c) 2020, Lesli Technologies, S. A.
+
+This program is free software: you can redistribute it and/or modify
+it under the terms of the GNU General Public License as published by
+the Free Software Foundation, either version 3 of the License, or
+(at your option) any later version.
+
+This program is distributed in the hope that it will be useful,
+but WITHOUT ANY WARRANTY; without even the implied warranty of
+MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+GNU General Public License for more details.
+
+You should have received a copy of the GNU General Public License
+along with this program. If not, see <http://www.gnu.org/licenses/>.
+
+LesliCSS - SCSS Utilities for websites, apps and web applications
+
+Powered by https://www.lesli.tech
+Building a better future, one line of code at a time.
+
+@contact  <hello@lesli.tech>
+@website  <https://lesli.tech>
+@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
+
+// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
+// · 
+
+*/
+
+
+// · 
+@import "true";
+@import "../../src/mixins/scrollbar.scss";
+
+
+// · 
+// Describe what you're testing
+@include describe('@mixin lesli-css-scrollbar($style:normal, $color:false, $background:false)') {
+
+    @include it('should thin scrollbar') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-scrollbar();
+            }
+
+            @include expect {
+                scrollbar-width: thin;
+                scrollbar-color: #ffffff #ffffff;
+            }
+
+        }
+
+    }
+
+    @include it('should thin and hide scrollbar') {
+
+        @include assert {
+
+            @include output {
+                @include lesli-css-scrollbar(hide);
+            }
+
+            @include expect {
+                scrollbar-width: thin;
+                scrollbar-color: #ffffff #ffffff;
+                &::-webkit-scrollbar {
+                    width: 0px;
+                    background-color: #f5f5f5;
+                }
+            }
+
+        }
+
+    }
+
+}