Last active
August 11, 2024 01:01
-
-
Save saugatmaharjan/493ab5eaaf1a29eaba1b3e73119df1c4 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"create": { | |
"create": "const styles = StyleSheet.create({})" | |
}, | |
"Platform_Select": { | |
"pselect": "...Platform.select({ ios: {}, android: {}})" | |
}, | |
"Shadow_Properties": { | |
"sdw": "...Platform.select({ ios: { ...shadowProperties }, android: { elevation }})," | |
}, | |
"View": { | |
"v": "<View style={{}}></View>" | |
}, | |
"Text": { | |
"te": "<Text style={{}}></Text>" | |
}, | |
"View_And_Text": { | |
"v>te": "<View><Text></Text></View>" | |
}, | |
"Image": { | |
"img": "<Image source={{}} style={{}} />" | |
}, | |
"FlatList": { | |
"fl": "<FlatList data={} renderItem={} />" | |
}, | |
"SectionList": { | |
"sl": "<SectionList data={} renderItem={} />" | |
}, | |
"ScrollView": { | |
"sv": "<ScrollView></ScrollView>" | |
}, | |
"TextInput": { | |
"ti": "<TextInput value={} placeholder='' underlineColorAndroid={false} onChange={} />" | |
}, | |
"Modal": { | |
"mdl": "<Modal visible={} animation='slide'></Modal>" | |
}, | |
"TouchableOpacity": { | |
"to": "<TouchableOpacity style={} onPress={}></TouchableOpacity>" | |
}, | |
"TouchableWithoutFeedback": { | |
"twf": "<TouchableWidthoutFeedback style={} onPress={}></TouchableWidthoutFeedback>" | |
}, | |
"TouchableHighlight": { | |
"th": "<TouchableHighlight style={{}} onPress={}></TouchableHighlight>" | |
}, | |
"TouchableWithNativeFeedback": { | |
"twnf": "<TouchableWithNativeFeedback style={} onPress={}></TouchableWithNativeFeedback>" | |
}, | |
"ActivityIndicator": { | |
"actind": "<ActivityIndicator color='#00ff00' />" | |
}, | |
"Button": { | |
"btn": "<Button color='#00ff00' title='button' onPress={} />" | |
}, | |
"Position": { | |
"pos": "position: 'absolute'," | |
}, | |
"Position_Absolute": { | |
"pos:a": "position: 'absolute'," | |
}, | |
"Position_Relative": { | |
"pos:r": "position: 'relative'," | |
}, | |
"Top": { | |
"t": "top: 0," | |
}, | |
"Top_Auto": { | |
"t:a": "top: 'auto'," | |
}, | |
"Right": { | |
"r": "right: 0," | |
}, | |
"Right_Auto": { | |
"r:a": "right: 'auto'," | |
}, | |
"Bottom": { | |
"b": "bottom: 0," | |
}, | |
"Bottom_Auto": { | |
"b:a": "bottom: 'auto'," | |
}, | |
"Left": { | |
"l": "left: 0," | |
}, | |
"Left_Auto": { | |
"l:a": "left: 'auto'," | |
}, | |
"ZIndex": { | |
"z": "zIndex: 2," | |
}, | |
"Overflow": { | |
"ov": "overflow: 'hidden'," | |
}, | |
"Overflow_Visible": { | |
"ov:v": "overflow: 'visible'," | |
}, | |
"Oveflow_Hidden": { | |
"ov:h": "overflow: 'hidden'," | |
}, | |
"Margin": { | |
"m": "margin: 4," | |
}, | |
"Margin_Auto": { | |
"m:a": "margin: 'auto'," | |
}, | |
"Margin_Top": { | |
"mt": "marginTop: 4," | |
}, | |
"Margin_Top_Auto": { | |
"mt:a": "marginTop: 'auto'," | |
}, | |
"Margin_Right": { | |
"mr": "marginRight: 4," | |
}, | |
"Margin_Right_Auto": { | |
"mr:a": "marginRight: 'auto'," | |
}, | |
"Margin_Bottom": { | |
"mb": "marginBottom: 4," | |
}, | |
"Margin_Bottom_Auto": { | |
"mb:a": "marginBottom: 'auto'," | |
}, | |
"Margin_Left": { | |
"ml": "marginLeft: 4," | |
}, | |
"Margin_Left_Auto": { | |
"ml:a": "marginLeft: 'auto'," | |
}, | |
"Padding": { | |
"p": "padding: 4," | |
}, | |
"Padding_Top": { | |
"pt": "paddingTop: 4," | |
}, | |
"Padding_Right": { | |
"pr": "paddingRight: 4," | |
}, | |
"Padding_Bottom": { | |
"pb": "paddingBottom: 4," | |
}, | |
"Padding_Left": { | |
"pl": "paddingLeft: 4," | |
}, | |
"Width": { | |
"w": "width: 120," | |
}, | |
"Width_Auto": { | |
"w:a": "width: 'auto'," | |
}, | |
"Height": { | |
"h": "height: 120," | |
}, | |
"Height_Auto": { | |
"h:a": "height: 'auto'," | |
}, | |
"Max_Width": { | |
"maxw": "maxWidth: 120," | |
}, | |
"Max_Height": { | |
"maxh": "maxHeight: 120," | |
}, | |
"Min_Width": { | |
"minw": "minWidth: 120," | |
}, | |
"Min_Height": { | |
"minh": "minHeight: 120," | |
}, | |
"Border_Colors": { | |
"bc": "borderColor: #000," | |
}, | |
"Border_Color_Transparent": { | |
"bc:t": "borderColor: 'transparent'," | |
}, | |
"Border_Width": { | |
"bw": "borderWidth: 1," | |
}, | |
"Border_Top_Width": { | |
"btw": "borderTopWidth: 1," | |
}, | |
"Border_Right_Width": { | |
"brw": "borderRightWidth: 1," | |
}, | |
"Border_Bottom_Width": { | |
"bbw": "borderBottomWidth: 1," | |
}, | |
"Border_Left_Width": { | |
"blw": "borderLeftWidth: 1," | |
}, | |
"Border_Top_Color": { | |
"btc": "borderTopColor: '#000'," | |
}, | |
"Border_Top_Color_Transparent": { | |
"btc:t": "borderTopColor: 'transparent'," | |
}, | |
"Border_Right_Color": { | |
"brc": "borderRightColor: '#000'," | |
}, | |
"Border_Right_Color_Transparent": { | |
"brc:t": "borderRightColor: 'transparent'," | |
}, | |
"Border_Bottom_Color": { | |
"prefix": "bbc", | |
"bbc": "borderBottomColor: '#000'," | |
}, | |
"Border_Bottom_Color_Transparent": { | |
"bbc:t": "borderBottomColor: 'transparent'," | |
}, | |
"Border_Left_Color": { | |
"blc": "borderLeftColor: '#000'," | |
}, | |
"Border_Left_Color_Transparent": { | |
"blc:t": "borderLeftColor: 'transparent'," | |
}, | |
"Border_Radius": { | |
"br": "borderRadius: 4," | |
}, | |
"Background_Color": { | |
"bgc": "backgroundColor: '#fff'," | |
}, | |
"BackgroundColor_Transparent": { | |
"bgc:t": "backgroundColor: 'transparent'," | |
}, | |
"Color": { | |
"c": "color: '#333'," | |
}, | |
"Color_RGB": { | |
"c:r": "color: 'rgb(0, 0, 0)'," | |
}, | |
"Color_RGBA": { | |
"c:ra": "color: 'rgba(0, 0, 0, 0.5)'," | |
}, | |
"Text_Align": { | |
"ta": "textAlign: 'center'," | |
}, | |
"Text_Align_Left": { | |
"ta:l": "textAlign: 'left'," | |
}, | |
"Text_Align_Center": { | |
"ta:c": "textAlign: 'center'," | |
}, | |
"Text_Align_Right": { | |
"ta:r": "textAlign: 'right'," | |
}, | |
"Text_Align_Right_Justify": { | |
"ta:j": "textAlign: 'justify'," | |
}, | |
"Text_Decoration": { | |
"td": "textDecoration: 'underline'," | |
}, | |
"Transform_Scale": { | |
"t:s": "transform: { scale: 1.2 }" | |
}, | |
"Transform_Scale_X": { | |
"t:sx": "transform: { scaleX: 1.2 }" | |
}, | |
"Transform_Scale_Y": { | |
"t:sy": "transform: { scaleY: 1.2 }" | |
}, | |
"Transform_Rotate": { | |
"t:r": "transform: { rotate: '90deg' }" | |
}, | |
"Transform_Rotate_X": { | |
"t:rx": "transform: { rotateX: '90deg' }" | |
}, | |
"Transform_Rotate_Y": { | |
"t:ry": "transform: { rotateY: '90deg' }" | |
}, | |
"Transform_Rotate_Z": { | |
"t:rz": "transform: { rotateZ: '90deg' }" | |
}, | |
"Transform_Translate_X": { | |
"t:tx": "transform: { translateX: x }" | |
}, | |
"Transform_Translate_Y": { | |
"t:ty": "transform: { translateY: y }" | |
}, | |
"Line_Height": { | |
"lh": "lineHeight: 24," | |
}, | |
"Letter_Spacing": { | |
"ls": "letterSpacing: 1," | |
}, | |
"Font_Weight": { | |
"fw": "fontWeight: 600," | |
}, | |
"Font_Weight_Bold": { | |
"fw:b": "fontWeight: 'bold'," | |
}, | |
"Font_Style": { | |
"fst": "fontStyle: 'italic'," | |
}, | |
"Font_Style_Italic": { | |
"fst:i": "fontStyle: 'italic'," | |
}, | |
"Font_Size": { | |
"fs": "fontSize: 14," | |
}, | |
"Font_Family": { | |
"ff": "fontFamily: 'Roboto'}," | |
}, | |
"Opacity": { | |
"prefix": "o", | |
"o": "opacity: 0.5," | |
}, | |
"Flex_Direction": { | |
"fd": "flexDirection: 'row'," | |
}, | |
"Flex_Direction_Row": { | |
"fd:r": "flexDirection: 'row'," | |
}, | |
"Flex_Direction_Row_Reverse": { | |
"fd:rr": "flexDirection: 'row-reverse'," | |
}, | |
"Flex_Direction_Column": { | |
"fd:c": "flexDirection: 'column'," | |
}, | |
"Flex_Direction_Column_Reverse": { | |
"fd:cr": "flexDirection: 'column-reverse'," | |
}, | |
"Flex_Wrap": { | |
"fwrap": "flexWrap: 'wrap'," | |
}, | |
"Flex_Wrap_Nowrap": { | |
"fwrap:n": "flexWrap: 'nowrap'," | |
}, | |
"Flex_Wrap_Wrap": { | |
"fwrap:w": "flexWrap: 'wrap'," | |
}, | |
"Justify_Content": { | |
"jc": "justifyContent: 'center'," | |
}, | |
"Justify_Content_Flex_Start": { | |
"jc:fs": "justifyContent: 'flex-start'," | |
}, | |
"Justify_Content_Flex_End": { | |
"jc:fe": "justifyContent: 'flex-end'," | |
}, | |
"Justify_Content_Flex_Center": { | |
"jc:c": "justifyContent: 'center'," | |
}, | |
"Justify_Content_Flex_Space_Evenly": { | |
"jc:se": "justifyContent: 'center'," | |
}, | |
"Justify_Content_Flex_Space_Between": { | |
"jc:sb": "justifyContent: 'space-between'," | |
}, | |
"Justify_Content_Flex_Space_Arround": { | |
"jc:sa": "justifyContent: 'space-around'," | |
}, | |
"Aligin_Items": { | |
"ai": "alignItems: 'center" | |
}, | |
"Align_Items_Flex_Start": { | |
"ai:fs": "alignItems: 'flex-start'," | |
}, | |
"Align_Items_Flex_End": { | |
"ai:fe": "alignItems: 'flex-end'," | |
}, | |
"Align_Items_Center": { | |
"ai:c": "alignItems: 'center'," | |
}, | |
"Align_Items_Stretch": { | |
"ai:s": "alignItems: 'stretch'," | |
}, | |
"Flex": { | |
"f": "flex: 1," | |
}, | |
"Align_Self": { | |
"as": "alignSelf: 'center'," | |
}, | |
"Margin_Horizontal": { | |
"mh": "marginHorizontal: 16," | |
}, | |
"Margin_Vertical": { | |
"mv": "marginVertical: 16," | |
}, | |
"Backface_Visibility": { | |
"bfv:v": "backfaceVisibility: 'visible'," | |
}, | |
"Border_Bottom_Left_Radius": { | |
"bblr": "borderBottomLeftRadius: 4," | |
}, | |
"Border_Bottom_Right_Radius": { | |
"bbrr": "borderBottomRightRadius: 4," | |
}, | |
"Border_Top_Left_Radius": { | |
"btlr": "borderTopLeftRadius: 4," | |
}, | |
"Border_Top_Right_Radius": { | |
"btrr": "borderTopRightRadius: 4," | |
}, | |
"Resize_Mode": { | |
"prefix": "rm", | |
"rm": "resizeMode: 'cover'," | |
}, | |
"Overlay_Color": { | |
"ovclr": "overlayColor: '#fff'," | |
}, | |
"Border_Style": { | |
"bs": "borderStyle: 'dashed'," | |
}, | |
"Elevation": { | |
"elv": "elevation: 4" | |
}, | |
"Text_Shadow_Color": { | |
"tsc": "textShadowColor: '#000'," | |
}, | |
"Text_Shadow_Offset": { | |
"tso": "textShadowOffset: { width: 0, height: 4 }," | |
}, | |
"Text_Shadow_Radius": { | |
"prefix": "tsr", | |
"tsr": "textShadowRadius: 2," | |
}, | |
"Text_Align_Vertical": { | |
"tav": "textAlignVertical: 'center'," | |
} | |
} |
The best feature would be to create View component starting with "." (dot) as html emmet does.
You just type name of the style and it creates View with the style name you type. And would be fabulous if it will create empty style for the created View.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Yeah. Maybe add v! or !v for this