Skip to content

Instantly share code, notes, and snippets.

@arvinxx

arvinxx/html2sketch-text-right-position.json

Last active May 13, 2021 14:28
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save arvinxx/9ad1cda7ffd8702bd47cf29c1c59aef3 to your computer and use it in GitHub Desktop.
Save arvinxx/9ad1cda7ffd8702bd47cf29c1c59aef3 to your computer and use it in GitHub Desktop.
Download ZIP
html2sketch-text-right-position.json 是正确案例， wrong.json 是错误案例
Raw
html2sketch-text-right-position.json
{
"_class": "group",
"do_objectID": "690B0D7B-EA4F-4169-A5EA-0011F93769CA",
"booleanOperation": -1,
"isFixedToViewport": false,
"isFlippedHorizontal": false,
"isFlippedVertical": false,
"isVisible": true,
"isLocked": false,
"layerListExpandedType": 0,
"name": "A",
"nameIsFixed": false,
"resizingConstraint": 63,
"resizingType": 0,
"rotation": 0,
"shouldBreakMaskChain": false,
"exportOptions": {
"_class": "exportOptions",
"includedLayerIds": [],
"layerOptions": 0,
"shouldTrim": false,
"exportFormats": []
},
"frame": {
"_class": "rect",
"constrainProportions": false,
"height": 30,
"width": 76,
"x": 40,
"y": 0
},
"clippingMaskMode": 0,
"hasClippingMask": false,
"style": {
"_class": "style",
"do_objectID": "89F0672D-6F67-48E9-9F68-268A0ABB10CB",
"endMarkerType": 0,
"miterLimit": 10,
"startMarkerType": 0,
"windingRule": 1,
"borderOptions": {
"_class": "borderOptions",
"isEnabled": true,
"dashPattern": [],
"lineCapStyle": 0,
"lineJoinStyle": 0
},
"colorControls": {
"_class": "colorControls",
"isEnabled": false,
"brightness": 0,
"contrast": 1,
"hue": 0,
"saturation": 1
},
"fills": [],
"borders": [],
"shadows": [],
"innerShadows": [],
"contextSettings": {
"_class": "graphicsContextSettings",
"blendMode": 0,
"opacity": 1
}
},
"hasClickThrough": false,
"groupLayout": {
"_class": "MSImmutableFreeformGroupLayout"
},
"layers": [
{
"_class": "rectangle",
"name": "tea-tabs__tab is-active",
"resizingConstraint": 63,
"frame": {
"_class": "rect",
"constrainProportions": false,
"height": 30,
"width": 2,
"x": 74,
"y": 0
},
"do_objectID": "A47834A1-8AF1-41C3-81D3-75A6EEDB4161",
"hasConvertedToNewRoundCorners": true,
"needsConvertionToNewRoundCorners": false,
"fixedRadius": 0,
"style": {
"_class": "style",
"do_objectID": "B812B9D9-A2FA-430F-A7F4-2202CF6D4B96",
"endMarkerType": 0,
"miterLimit": 10,
"startMarkerType": 0,
"windingRule": 1,
"borderOptions": {
"_class": "borderOptions",
"isEnabled": true,
"dashPattern": [],
"lineCapStyle": 0,
"lineJoinStyle": 0
},
"colorControls": {
"_class": "colorControls",
"isEnabled": false,
"brightness": 0,
"contrast": 1,
"hue": 0,
"saturation": 1
},
"fills": [],
"borders": [],
"shadows": [],
"innerShadows": [
{
"_class": "innerShadow",
"isEnabled": true,
"blurRadius": 0,
"color": {
"_class": "color",
"red": 0,
"green": 0.43137254901960786,
"blue": 1,
"alpha": 1
},
"contextSettings": {
"_class": "graphicsContextSettings",
"blendMode": 0,
"opacity": 1
},
"offsetX": -2,
"offsetY": 0,
"spread": 0
}
],
"contextSettings": {
"_class": "graphicsContextSettings",
"blendMode": 0,
"opacity": 1
}
},
"edited": false,
"pointRadiusBehaviour": 1,
"points": [
{
"_class": "curvePoint",
"cornerRadius": 0,
"curveFrom": "{0, 0}",
"curveMode": 1,
"curveTo": "{0, 0}",
"hasCurveFrom": false,
"hasCurveTo": false,
"point": "{0, 0}"
},
{
"_class": "curvePoint",
"cornerRadius": 0,
"curveFrom": "{1, 0}",
"curveMode": 1,
"curveTo": "{1, 0}",
"hasCurveFrom": false,
"hasCurveTo": false,
"point": "{1, 0}"
},
{
"_class": "curvePoint",
"cornerRadius": 0,
"curveFrom": "{1, 1}",
"curveMode": 1,
"curveTo": "{1, 1}",
"hasCurveFrom": false,
"hasCurveTo": false,
"point": "{1, 1}"
},
{
"_class": "curvePoint",
"cornerRadius": 0,
"curveFrom": "{0, 1}",
"curveMode": 1,
"curveTo": "{0, 1}",
"hasCurveFrom": false,
"hasCurveTo": false,
"point": "{0, 1}"
}
],
"isClosed": true,
"booleanOperation": -1,
"exportOptions": {
"_class": "exportOptions",
"includedLayerIds": [],
"layerOptions": 0,
"shouldTrim": false,
"exportFormats": []
},
"isVisible": true,
"isFixedToViewport": false,
"isFlippedHorizontal": false,
"isFlippedVertical": false,
"layerListExpandedType": 0,
"nameIsFixed": false,
"resizingType": 0,
"rotation": 0,
"shouldBreakMaskChain": false,
"clippingMaskMode": 0,
"isLocked": false,
"hasClippingMask": false
},
{
"_class": "text",
"do_objectID": "85DB2DD1-2FA1-4B04-82D9-268A14198ECD",
"booleanOperation": -1,
"isFixedToViewport": false,
"isFlippedHorizontal": false,
"isFlippedVertical": false,
"isLocked": false,
"isVisible": true,
"name": "基本信息",
"nameIsFixed": false,
"layerListExpandedType": 0,
"resizingConstraint": 63,
"resizingType": 0,
"rotation": 0,
"shouldBreakMaskChain": false,
"exportOptions": {
"_class": "exportOptions",
"includedLayerIds": [],
"layerOptions": 0,
"shouldTrim": false,
"exportFormats": []
},
"frame": {
"_class": "rect",
"constrainProportions": false,
"height": 30,
"width": 76,
"x": 0,
"y": 0
},
"clippingMaskMode": 0,
"hasClippingMask": false,
"style": {
"_class": "style",
"do_objectID": "C671339B-BDAC-4D8D-AF64-6325727C397F",
"endMarkerType": 0,
"miterLimit": 10,
"startMarkerType": 0,
"windingRule": 1,
"borderOptions": {
"_class": "borderOptions",
"isEnabled": true,
"dashPattern": [],
"lineCapStyle": 0,
"lineJoinStyle": 0
},
"colorControls": {
"_class": "colorControls",
"isEnabled": false,
"brightness": 0,
"contrast": 1,
"hue": 0,
"saturation": 1
},
"fills": [],
"borders": [],
"shadows": [],
"innerShadows": [],
"contextSettings": {
"_class": "graphicsContextSettings",
"blendMode": 0,
"opacity": 1
}
},
"attributedString": {
"_class": "attributedString",
"string": "基本信息",
"attributes": [
{
"_class": "stringAttribute",
"location": 0,
"length": 4,
"attributes": {
"underlineStyle": 0,
"MSAttributedStringTextTransformAttribute": 0,
"paragraphStyle": {
"_class": "paragraphStyle",
"alignment": 0,
"maximumLineHeight": 30,
"minimumLineHeight": 30
},
"kerning": 0,
"strikethroughStyle": 0,
"MSAttributedStringFontAttribute": {
"_class": "fontDescriptor",
"attributes": {
"name": "PingFangSC-Semibold",
"size": 14
}
},
"MSAttributedStringColorAttribute": {
"_class": "color",
"red": 0,
"green": 0,
"blue": 0,
"alpha": 1
}
}
}
]
},
"automaticallyDrawOnUnderlyingPath": false,
"dontSynchroniseWithSymbol": false,
"lineSpacingBehaviour": 2,
"textBehaviour": 0,
"glyphBounds": ""
}
]
}
Raw
wrong.json
{
"_class": "group",
"do_objectID": "690B0D7B-EA4F-4169-A5EA-0011F93769CA",
"booleanOperation": -1,
"isFixedToViewport": false,
"isFlippedHorizontal": false,
"isFlippedVertical": false,
"isVisible": true,
"isLocked": false,
"layerListExpandedType": 0,
"name": "A",
"nameIsFixed": false,
"resizingConstraint": 63,
"resizingType": 0,
"rotation": 0,
"shouldBreakMaskChain": false,
"exportOptions": {
"_class": "exportOptions",
"includedLayerIds": [],
"layerOptions": 0,
"shouldTrim": false,
"exportFormats": []
},
"frame": {
"_class": "rect",
"constrainProportions": false,
"height": 30,
"width": 76,
"x": 40,
"y": 0
},
"clippingMaskMode": 0,
"hasClippingMask": false,
"style": {
"_class": "style",
"do_objectID": "89F0672D-6F67-48E9-9F68-268A0ABB10CB",
"endMarkerType": 0,
"miterLimit": 10,
"startMarkerType": 0,
"windingRule": 1,
"borderOptions": {
"_class": "borderOptions",
"isEnabled": true,
"dashPattern": [],
"lineCapStyle": 0,
"lineJoinStyle": 0
},
"colorControls": {
"_class": "colorControls",
"isEnabled": false,
"brightness": 0,
"contrast": 1,
"hue": 0,
"saturation": 1
},
"fills": [],
"borders": [],
"shadows": [],
"innerShadows": [],
"contextSettings": {
"_class": "graphicsContextSettings",
"blendMode": 0,
"opacity": 1
}
},
"hasClickThrough": false,
"groupLayout": {
"_class": "MSImmutableFreeformGroupLayout"
},
"layers": [
{
"_class": "rectangle",
"name": "tea-tabs__tab is-active",
"resizingConstraint": 63,
"frame": {
"_class": "rect",
"constrainProportions": false,
"height": 30,
"width": 2,
"x": 74,
"y": 0
},
"do_objectID": "A47834A1-8AF1-41C3-81D3-75A6EEDB4161",
"hasConvertedToNewRoundCorners": true,
"needsConvertionToNewRoundCorners": false,
"fixedRadius": 0,
"style": {
"_class": "style",
"do_objectID": "B812B9D9-A2FA-430F-A7F4-2202CF6D4B96",
"endMarkerType": 0,
"miterLimit": 10,
"startMarkerType": 0,
"windingRule": 1,
"borderOptions": {
"_class": "borderOptions",
"isEnabled": true,
"dashPattern": [],
"lineCapStyle": 0,
"lineJoinStyle": 0
},
"colorControls": {
"_class": "colorControls",
"isEnabled": false,
"brightness": 0,
"contrast": 1,
"hue": 0,
"saturation": 1
},
"fills": [],
"borders": [],
"shadows": [],
"innerShadows": [
{
"_class": "innerShadow",
"isEnabled": true,
"blurRadius": 0,
"color": {
"_class": "color",
"red": 0,
"green": 0.43137254901960786,
"blue": 1,
"alpha": 1
},
"contextSettings": {
"_class": "graphicsContextSettings",
"blendMode": 0,
"opacity": 1
},
"offsetX": -2,
"offsetY": 0,
"spread": 0
}
],
"contextSettings": {
"_class": "graphicsContextSettings",
"blendMode": 0,
"opacity": 1
}
},
"edited": false,
"pointRadiusBehaviour": 1,
"points": [
{
"_class": "curvePoint",
"cornerRadius": 0,
"curveFrom": "{0, 0}",
"curveMode": 1,
"curveTo": "{0, 0}",
"hasCurveFrom": false,
"hasCurveTo": false,
"point": "{0, 0}"
},
{
"_class": "curvePoint",
"cornerRadius": 0,
"curveFrom": "{1, 0}",
"curveMode": 1,
"curveTo": "{1, 0}",
"hasCurveFrom": false,
"hasCurveTo": false,
"point": "{1, 0}"
},
{
"_class": "curvePoint",
"cornerRadius": 0,
"curveFrom": "{1, 1}",
"curveMode": 1,
"curveTo": "{1, 1}",
"hasCurveFrom": false,
"hasCurveTo": false,
"point": "{1, 1}"
},
{
"_class": "curvePoint",
"cornerRadius": 0,
"curveFrom": "{0, 1}",
"curveMode": 1,
"curveTo": "{0, 1}",
"hasCurveFrom": false,
"hasCurveTo": false,
"point": "{0, 1}"
}
],
"isClosed": true,
"booleanOperation": -1,
"exportOptions": {
"_class": "exportOptions",
"includedLayerIds": [],
"layerOptions": 0,
"shouldTrim": false,
"exportFormats": []
},
"isVisible": true,
"isFixedToViewport": false,
"isFlippedHorizontal": false,
"isFlippedVertical": false,
"layerListExpandedType": 0,
"nameIsFixed": false,
"resizingType": 0,
"rotation": 0,
"shouldBreakMaskChain": false,
"clippingMaskMode": 0,
"isLocked": false,
"hasClippingMask": false
},
{
"_class": "text",
"do_objectID": "85DB2DD1-2FA1-4B04-82D9-268A14198ECD",
"booleanOperation": -1,
"isFixedToViewport": false,
"isFlippedHorizontal": false,
"isFlippedVertical": false,
"isLocked": false,
"isVisible": true,
"name": "基本信息",
"nameIsFixed": false,
"layerListExpandedType": 0,
"resizingConstraint": 63,
"resizingType": 0,
"rotation": 0,
"shouldBreakMaskChain": false,
"exportOptions": {
"_class": "exportOptions",
"includedLayerIds": [],
"layerOptions": 0,
"shouldTrim": false,
"exportFormats": []
},
"frame": {
"_class": "rect",
"constrainProportions": false,
"height": 30,
"width": 76,
"x": 0,
"y": 0
},
"clippingMaskMode": 0,
"hasClippingMask": false,
"style": {
"_class": "style",
"do_objectID": "C671339B-BDAC-4D8D-AF64-6325727C397F",
"endMarkerType": 0,
"miterLimit": 10,
"startMarkerType": 0,
"windingRule": 1,
"borderOptions": {
"_class": "borderOptions",
"isEnabled": true,
"dashPattern": [],
"lineCapStyle": 0,
"lineJoinStyle": 0
},
"colorControls": {
"_class": "colorControls",
"isEnabled": false,
"brightness": 0,
"contrast": 1,
"hue": 0,
"saturation": 1
},
"fills": [],
"borders": [],
"shadows": [],
"innerShadows": [],
"contextSettings": {
"_class": "graphicsContextSettings",
"blendMode": 0,
"opacity": 1
}
},
"attributedString": {
"_class": "attributedString",
"string": "基本信息",
"attributes": [
{
"_class": "stringAttribute",
"location": 0,
"length": 4,
"attributes": {
"underlineStyle": 0,
"MSAttributedStringTextTransformAttribute": 0,
"paragraphStyle": {
"_class": "paragraphStyle",
"alignment": 1,
"maximumLineHeight": 30,
"minimumLineHeight": 30
},
"kerning": 0,
"strikethroughStyle": 0,
"MSAttributedStringFontAttribute": {
"_class": "fontDescriptor",
"attributes": {
"name": "PingFangSC-Semibold",
"size": 14
}
},
"MSAttributedStringColorAttribute": {
"_class": "color",
"red": 0,
"green": 0,
"blue": 0,
"alpha": 1
}
}
}
]
},
"automaticallyDrawOnUnderlyingPath": false,
"dontSynchroniseWithSymbol": false,
"lineSpacingBehaviour": 2,
"textBehaviour": 0,
"glyphBounds": ""
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment