@loomhq/lens

    10.20.2 • Public • Published

    Lens — the design system for Loom products

    npm

    Installation

    Add Lens to your app:

    yarn add @loomhq/lens
    

    Add dependencies:

    yarn add @emotion/core
    yarn add @emotion/styled
    

    Install CSS variables

    getThemeStylesString() and getAllCssVarsString() return strings that contain all CSS variables. Use these functions and inject the output to a style tag in the head:

    import { getThemeStylesString, getAllCssVarsString } from '@loomhq/lens'
    
    const style = document.createElement('style');
    style.innerHTML = getThemeStylesString() + getAllCssVarsString();
    document.head.appendChild(style);
    

    In some cases you might need to inject the CSS variables to a specific element. Pass a string argument to getThemeStylesString() and getAllCssVarsString():

    getThemeStylesString('.myGlobalElement')
    getAllCssVarsString('.myGlobalElement')
    

    Install CSS utilities

    CSS classes are exported as a string and can be injected to a style tag in the head:

    import { cssUtilities } from '@loomhq/lens'
    
    const style = document.createElement('style');
    style.innerHTML = cssUtilities();
    document.head.appendChild(style);
    

    Running Locally

    yarn
    yarn dev
    navigate to: http://localhost:3000
    

    Documentation

    https://lens.loom.dev

    Keywords

    none

    Install

    npm i @loomhq/lens

    DownloadsWeekly Downloads

    4,109

    Version

    10.20.2

    License

    ISC

    Unpacked Size

    491 kB

    Total Files

    632

    Last publish

    Collaborators

    • tatiana_loom
    • jessica.pancer
    • jesse-lee-loom
    • thefriendlyghost
    • josh_loom
    • johnnyopao
    • keepitterron
    • vinayh
    • garshythoel
    • ploom
    • hihayk
    • brendonjohn
    • stevemilburn
    • brhenrique
    • loom.embed-sdk
    • cacheonly
    • diaswrd
    • nymerias
    • ydep
    • josecarlosatloom
    • yjaspar
    • acacheung
    • msfragala
    • avanika
    • hspak
    • luis.loom
    • fgwuuei1
    • gchilds
    • shayonj
    • harrisrasheed123
    • tiffyork
    • sravanti
    • swac
    • vinibaggio
    • azacharakis
    • jmreidy
    • premaloom
    • solidcell
    • vladloom
    • peter.heesterman
    • angelaliu
    • rodrigoloom
    • noah.loom
    • jennyloom
    • juliannaroenloom
    • marni.kostman
    • cndreisbach
    • narayangowraj8
    • lingrino-loom
    • dj_haile
    • catherinelin
    • andrzej.wisniewski
    • mosesj-loom
    • matt.lavine
    • erinbyerly
    • cwaslo-loom
    • aditya_singla
    • sidraman
    • jiaweiou
    • loominghoward
    • vishalsantoshi
    • wilbertthelam