lesli_assets 0.1.0

data/lib/lesli_assets_bulma/helpers/display.scss

@@ -0,0 +1,44 @@
+/*
+
+Lesli
+
+Copyright (c) 2023, 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/.
+
+Lesli · Ruby on Rails SaaS development platform.
+
+Made with ♥ by https://www.lesli.tech
+Building a better future, one line of code at a time.
+
+@contact  hello@lesli.tech
+@website  https://www.lesli.tech
+@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
+
+// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
+// ·  
+
+*/
+
+
+// · 
+.is-fullwidth {
+    width: 100%;
+}
+
+
+//
+.hover:hover {
+    cursor: pointer;
+}

data/lib/lesli_assets_bulma/helpers/tooltip.scss

@@ -0,0 +1,91 @@
+/*
+
+Lesli
+
+Copyright (c) 2023, 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/.
+
+Lesli · Ruby on Rails SaaS development platform.
+
+Made with ♥ by https://www.lesli.tech
+Building a better future, one line of code at a time.
+
+@contact  hello@lesli.tech
+@website  https://www.lesli.tech
+@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
+
+// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
+// ·  
+
+*/
+
+// · 
+[data-tooltip] {
+    position: relative;
+    z-index: 2;
+    cursor: pointer;
+
+    // Hide the tooltip content by default
+    &:before,
+    &:after {
+        opacity: 0;
+        visibility: hidden;
+        pointer-events: none;
+    }
+
+    // Position tooltip above the element 
+    &::before {
+        position: absolute;
+        bottom: 110%;
+        left: 50%;
+        margin-bottom: 5px;
+        margin-left: -80px;
+        padding: 7px;
+        width: 160px;
+        -webkit-border-radius: 3px;
+        -moz-border-radius: 3px;
+        border-radius: 3px;
+        background-color: #000;
+        background-color: hsla(0, 0%, 20%, 0.9);
+        color: #fff;
+        content: attr(data-tooltip);
+        text-align: center;
+        font-size: 14px;
+        line-height: 1.2;
+    }
+
+    // Triangle hack to make tooltip look like a speech bubble 
+    &:after {
+        position: absolute;
+        bottom: 110%;
+        left: 50%;
+        margin-left: -5px;
+        width: 0;
+        border-top: 5px solid #000;
+        border-top: 5px solid hsla(0, 0%, 20%, 0.9);
+        border-right: 5px solid transparent;
+        border-left: 5px solid transparent;
+        content: " ";
+        font-size: 0;
+        line-height: 0;
+    }
+
+    // Show tooltip content on hover 
+    &:hover:before,
+    &:hover:after {
+        visibility: visible;
+        opacity: 1;
+    }
+}

data/lib/lesli_assets_bulma/layouts/application-app.scss

@@ -0,0 +1,36 @@
+/*
+Lesli
+
+Copyright (c) 2023, 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/.
+
+Lesli · Ruby on Rails SaaS Development Framework.
+
+Made with ♥ by LesliTech
+Building a better future, one line of code at a time.
+
+@contact  hello@lesli.tech
+@website  https://www.lesli.tech
+@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
+
+// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
+// · 
+*/
+
+// · 
+main.lesli-application-app {
+    display: flex;
+    //height: calc(100vh - var(--lesli-header-height) - var(--lesli-navbar-height));
+}

data/lib/lesli_assets_bulma/layouts/application-component.scss

@@ -0,0 +1,39 @@
+/*
+
+Lesli
+
+Copyright (c) 2023, 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/.
+
+Lesli · Ruby on Rails SaaS Development Framework.
+
+Made with ♥ by https://www.lesli.tech
+Building a better future, one line of code at a time.
+
+@contact  hello@lesli.tech
+@website  https://www.lesli.tech
+@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
+
+// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
+// · 
+*/
+
+
+// · 
+.lesli-application-component {
+    border-radius: .6rem;
+    box-shadow: $lesli-box-shadow;
+    background-color: white;
+}

data/lib/lesli_assets_bulma/layouts/application-container.scss

@@ -0,0 +1,36 @@
+/*
+
+Lesli
+
+Copyright (c) 2023, 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/.
+
+Lesli · Ruby on Rails SaaS Development Framework.
+
+Made with ♥ by https://www.lesli.tech
+Building a better future, one line of code at a time.
+
+@contact  hello@lesli.tech
+@website  https://www.lesli.tech
+@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
+
+// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
+// · 
+*/
+
+section.lesli-application-container,
+turbo-frame.lesli-application-container {
+    padding: 1rem;
+}

data/lib/lesli_assets_bulma/layouts/application-engines.scss

@@ -0,0 +1,108 @@
+/*
+
+Lesli
+
+Copyright (c) 2023, 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/.
+
+Lesli · Ruby on Rails SaaS Development Framework.
+
+Made with ♥ by https://www.lesli.tech
+Building a better future, one line of code at a time.
+
+@contact  hello@lesli.tech
+@website  https://www.lesli.tech
+@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
+
+// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
+// · 
+*/
+
+.lesli-application-engines {
+
+    .engines-container {
+
+        .engines {
+            display: flex;
+            flex-wrap: wrap;
+            flex-direction: column;
+            justify-content: center;
+
+            // engine link
+            a {
+                width: 100%;
+                height: 200px;
+                display: block;
+
+                text-align: center;
+                padding: 1rem .4rem;
+                margin-bottom: 2rem;
+                border-radius: .5rem;
+                border: transparent 1px solid;
+                box-shadow: $lesli-box-shadow;
+                background-color: lesli-css-color(silver, 100);
+                background-color: #FFFFFF;
+                transition: all ease-in-out .4s;
+
+                &:hover {
+                    border-color: var(--lesli-color-primary);
+                    transform: translateY(-1px);
+                }
+
+                &.is-active {
+                    background-color: #F0F4FF;
+                    border-color: var(--lesli-color-primary);
+                }
+
+                // engine logo
+                svg {
+                    margin-right: .4rem;
+                    fill: var(--lesli-color-primary);
+                }
+
+                // engine description
+                p {
+                    font-size: 14;
+                }
+
+                // engine name
+                span {
+                    font-weight: 600;
+                    font-size: 20px;
+                }
+
+                span, p {
+                    color: var(--lesli-color-primary);
+                }
+            }
+        }
+
+        // close button 
+        button {
+            width: 100%;
+        }
+    }
+}
+
+
+@include lesli-css-breakpoint-tablet() {
+    .lesli-application-engines .engines-container .engines {
+        flex-direction: row;
+        a {
+            width: 320px;
+            margin: 1rem;
+        }
+    }
+}

data/lib/lesli_assets_bulma/layouts/application-header.scss

@@ -0,0 +1,94 @@
+/*
+
+Lesli
+
+Copyright (c) 2023, 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/.
+
+Lesli · Ruby on Rails SaaS Development Framework.
+
+Made with ♥ by LesliTech
+Building a better future, one line of code at a time.
+
+@contact  hello@lesli.tech
+@website  https://www.lesli.tech
+@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
+
+// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
+// · 
+*/
+
+
+// ·
+header.lesli-application-header {
+    background-color: var(--lesli-header-color);
+    height: var(--lesli-header-height);
+
+    nav.lesli-navbar {
+
+        .navbar-brand {
+            img {
+                height: var(--lesli-header-height);
+            }
+        }
+
+        .navbar-item {
+
+            .icon {
+                padding: 0;
+            }
+
+            // navigation icons
+            [class^="ri-"] {
+                font-size: 20px;
+                color: lesli-css-color(black, 700);
+            }
+        }
+
+        .header-icons {
+
+            a {
+                position: relative;
+            }
+
+            // navigation icons
+            [class^="ri-"] {
+                font-size: 25px;
+                padding: 0 0.6rem;
+                color: lesli-css-color(black, 700);
+            }
+
+            // Notification icon & count
+            .header-indicator {
+                .count {
+                    top: -8px;
+                    right: 10px;
+                    width: 10px;
+                    height: 10px;
+                    border-radius: 50%;
+                    background-color: lesli-css-color(berry, 300);
+                    position: absolute;
+                }
+            }
+
+            .lesli-header-notifications {
+                .dropdown-content {
+                    box-shadow: none;
+                    background-color: transparent;
+                }
+            }
+        }
+    }
+}

data/lib/lesli_assets_bulma/layouts/application-navigation.scss

@@ -0,0 +1,93 @@
+/*
+
+Lesli
+
+Copyright (c) 2025, 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/.
+
+Lesli · Ruby on Rails SaaS Development Framework.
+
+Made with ♥ by LesliTech
+Building a better future, one line of code at a time.
+
+@contact  hello@lesli.tech
+@website  https://www.lesli.tech
+@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
+
+// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
+// · 
+*/
+
+.navbar {
+    position: static;
+}
+
+nav.lesli-application-navigation {
+    background-color: var(--lesli-navbar-color);
+    border-bottom: 1px solid rgba(172,179,194,.5);
+    border-top: 1px solid rgba(172,179,194,.5);
+    width: 100%;
+
+    .navbar-menu {
+        justify-content: center;
+    }
+
+    .navbar-start {
+        display: none;
+    }
+
+    .navbar-end {
+        margin-inline-start: unset;
+    }
+
+    li {
+        padding-top: 0;
+        padding-bottom: 0;
+
+        a {
+            gap: 6px;
+            display: flex;
+            padding: 1.2rem 1.1rem 0.8rem;
+            align-items: center;
+            border-bottom: 2px solid transparent;
+            color: lesli-css-color(black, 700);
+            transition: all linear .2s;
+
+            &:hover {
+                // color: lesli-css-color(slate, 100);
+                // text-shadow: 0 0px 10px rgba(lesli-css-color(slate, 900), 0.8);
+                color: lesli-css-color(slate, 700);
+                text-shadow: 0 2px 6px rgba(lesli-css-color(slate, 700), 0.25);
+            }
+
+            // highlight active link
+            &.navigation-link-active {
+                border-bottom-color: lesli-css-color(lesli, primary);
+            }
+            
+            // link label
+            span.text {
+                flex-grow: 1;
+                font-size: 1rem;
+                text-align: left;
+                display: inline-block;
+            }
+
+            [class^="ri-"] {
+                font-size: 20px;
+            }
+        }
+    }
+}

data/lib/lesli_assets_bulma/layouts/application-notification.scss

@@ -0,0 +1,24 @@
+
+
+section.application-lesli-notifications {
+    max-width: 600px;
+    margin: 0 auto;
+    width: 90%;
+
+    position: fixed;
+    z-index: 999;
+    left: 0;
+    right: 0;
+
+    .notification {
+        animation: fadeOut 5s forwards;
+        border: 2px solid;
+    }
+}
+
+
+@keyframes fadeOut {
+    0% { opacity: 1; }
+    80% { opacity: 1; } /* Keep visible for most of the time */
+    100% { opacity: 0; display: none; }
+}

data/lib/lesli_assets_bulma/layouts/application-sidebar.scss

@@ -0,0 +1,93 @@
+/*
+Lesli
+
+Copyright (c) 2023, 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/.
+
+Lesli · Ruby on Rails SaaS Development Framework.
+
+Made with ♥ by https://www.lesli.tech
+Building a better future, one line of code at a time.
+
+@contact  hello@lesli.tech
+@website  https://www.lesli.dev
+@license  GPLv3 http://www.gnu.org/licenses/gpl-3.0.en.html
+
+// · ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~     ~·~
+// · 
+*/
+
+
+// use the default background color so we can use bulma functions to find the rest of colors
+@if $lesli-sidebar-color == "transparent" {
+    $lesli-sidebar-color: $lesli-color-background;
+}
+
+
+// · text color white or black depending in the luminance of the selected color
+$lesli-sidebar-color-text: findColorInvert($lesli-sidebar-color) !default;
+
+
+// · find exactly the inverted background color to use as text color, so we have contrast
+$lesli-sidebar-hover-text: findColorInvert($lesli-sidebar-hover) !default;
+$lesli-sidebar-hover: darken($lesli-color-background, 8);
+
+
+
+// · Navigation sidebar
+aside.lesli-application-sidebar {
+    display: flex;
+    flex-direction: column;
+    transition: all linear .2s;
+    width: var(--lesli-sidebar-width);
+    padding: 48px 0 0 3rem;
+
+    // allow the container to scroll over the navigation items
+    nav {
+        @include lesli-css-scrollbar(hide);
+        overflow-y: scroll;
+        background-color: white;
+        border-radius: 8px;
+        padding: .8rem 0 1rem 1rem;
+    }
+
+    // sidebar title
+    p.menu-label {
+        font-family: "Domine";
+        color: $lesli-sidebar-color-text;
+    }
+
+    // link container
+    li {
+
+        // link
+        a {
+            color: $lesli-sidebar-color-text;
+
+            // highlight sidebar navigation item when selected
+            // highlight sidebar navigation item on hover
+            &:hover,
+            &.is-active // rails routes
+            {
+                color: $lesli-sidebar-hover-text;
+            }
+
+            // icons from reixicons
+            span.text {
+                margin-left: .2rem;
+            }
+        }
+    }
+}