@startupjs/babel-plugin-rn-stylename-inline
Use styleName attributes with inline css and styl template strings
Last updated 2 days ago by yska .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install @startupjs/babel-plugin-rn-stylename-inline 
SYNC missed versions from official npm registry.

@startupjs/babel-plugin-rn-stylename-inline

Adds support for in-JS template strings css\`andstyl``` for CSS styles for react-native.

Must be used together with @startupjs/babel-plugin-rn-stylename library.

Options

platform -- what platform the compilation is on. For example, web or ios or android.

Example

File-level scope (global to file)

import React from 'react'
import { View } from 'react-native'
import { css } from 'startupjs'

export default function Card () {
  return <View styleName='card active'><Line /></View>
}
function Line () {
  return <View styleName='line' />
}
css`
  .card {
    padding: 8px 16px;
  }
  .line {
    margin-top: 16px;
    border-radius: 8px;
  }
  .active {
    background-color: red;
  }
`

Local component scope (inside particular react component function)

import React from 'react'
import { View } from 'react-native'
import { css, styl } from 'startupjs'

export default function Card () {
  return <View styleName='root active'><Line /></View>
  // .root will be scoped only to this specific component
  styl`
    .root
      padding: 8px 16px
  `
}
function Line () {
  return <View styleName='root' />
  // .root will be scoped only to this specific component
  css`
    .root {
      margin-top: 16px;
      border-radius: 8px;
    }
  `
}
// you can use global- and local- scoped styles together
styl`
  .active
    background-color red
`

Licence

MIT

Current Tags

  • 0.29.0                                ...           latest (2 days ago)

25 Versions

  • 0.29.0                                ...           2 days ago
  • 0.28.0                                ...           17 days ago
  • 0.27.0                                ...           19 days ago
  • 0.26.8                                ...           24 days ago
  • 0.26.7                                ...           25 days ago
  • 0.26.4                                ...           a month ago
  • 0.26.3                                ...           a month ago
  • 0.26.0                                ...           a month ago
  • 0.25.1                                ...           a month ago
  • 0.25.0                                ...           a month ago
  • 0.24.4                                ...           a month ago
  • 0.24.2                                ...           a month ago
  • 0.24.0                                ...           a month ago
  • 0.23.52                                ...           a month ago
  • 0.23.51                                ...           a month ago
  • 0.23.47                                ...           2 months ago
  • 0.23.45                                ...           2 months ago
  • 0.23.44                                ...           2 months ago
  • 0.23.43                                ...           3 months ago
  • 0.23.41                                ...           3 months ago
  • 0.23.40                                ...           3 months ago
  • 0.23.39                                ...           3 months ago
  • 0.23.37                                ...           3 months ago
  • 0.23.36                                ...           3 months ago
  • 0.23.33                                ...           3 months ago
Downloads
Today 0
This Week 9
This Month 64
Last Day 1
Last Week 0
Last Month 111
Dev Dependencies (3)
Dependents (1)

Copyright 2014 - 2016 © taobao.org |