Neanderthals Programming Machines

    react-native-short-styles

    1.0.0 • Public • Published

    react-native-short-styles

    Installation

    npm install react-native-short-styles

    or

    yarn add react-native-short-styles

    Example

    import { Text, View } from "react-native"
    import styles from "react-native-short-styles"
    
    // In your any react-native component
    ;<View style={styles("f1 ic jc")}>
      <Text style={styles("")}></Text>
    </View>

    Short Styles List

    The Listing is in alphabetical order of the properties in each section

    Spacing and Borders

    Property ShortStyle
    top ot
    left ol
    right or
    bottom ob
    start os
    end oe
    margin -m, m
    marginTop -mt, mt
    marginLeft -ml, ml
    marginBottom -mb, mb
    marginRight -mr, mr
    marginStart -ms, ms
    marginEnd -me, me
    marginHorizontal -mh, mh
    marginVertical -mv, mv
    padding p
    paddingTop pt
    paddingLeft pl
    paddingBottom pb
    paddingRight pr
    paddingStart ps
    paddingEnd pe
    paddingHorizontal ph
    paddingVertical pv
    borderWidth b
    borderColor bc
    borderTopWidth bt
    borderTopColor btc
    borderLeftWidth bl
    borderLeftColor blc
    borderBottomWidth bb
    borderBottomColor bbc
    borderRightWidth br
    borderRightColor brc
    borderStartWidth bs
    borderStartColor bsc
    borderEndWidth be
    borderEndColor bec
    Property Value ShortStyle
    borderStyle solid bss
    dashed bsh
    dotted bsd

    General

    Property Value ShortStyle
    aspectRatio - a
    backgroundColor - bg
    elevation - e
    minHeight - hn
    height - h
    maxHeight - hx
    minWidth - wn
    width - w
    maxWidth - wx
    opacity - o
    overflow hidden oh
    scroll oc
    visible ov
    position absolute poa
    relative por

    Flex

    Property Value ShortStyle
    alignContent center cc
    flex-end ce
    flex-start cs
    space-around ca
    space-between cb
    stretch ct
    alignItems baseline ia
    center ic
    flex-end ie
    flex-start is
    stretch it
    alignSelf auto ac
    center ac
    flex-end ae
    flex-start as
    space-around aa
    space-between ab
    stretch at
    flex - f
    flexBasis - fb
    flexDirection column fc
    column-reverse -fc
    row fr
    row-reverse -fr
    flexGrow - fg
    flexShrink - fs
    flexWrap nowrap fn
    wrap fw
    wrap-reverse -fw
    justifyContent center jc
    flex-end je
    flex-start js
    space-around ja
    space-between jb

    Text

    Property Value ShortStyle
    color - cl
    fontSize - ts
    fontStyle italic tsi
    normal tsn
    fontWeight bold tb
    normal tn
    letterSpacing - tls
    lineHeight - th
    textAlign auto ta
    center tc
    left tl
    justify tj
    right tr
    textAlignVertical auto tva
    bottom tvb
    center tvc
    top tvt
    textTransform capitalize ttc
    lowercase ttl
    none ttn
    uppercase ttu

    Install

    npm i react-native-short-styles

    DownloadsWeekly Downloads

    2

    Version

    1.0.0

    License

    MIT

    Unpacked Size

    13.8 kB

    Total Files

    6

    Last publish

    Collaborators

    • curiosbasant