Page Comparison

{
"type": "stylesheet",
"children": [
{
"type": "view",
"style": {
"flexDirection": "column",
"gap": 24,
"padding": 16,
"maxWidth": 1200,
"margin": "0 auto"
},
"children": [
{
"type": "text",
"text": "My GitHub Repositories",
"style": {
"fontSize": 24,
"fontWeight": "bold",
"marginBottom": 16,
"color": "#24292e"
}
},
{
"type": "rest",
"id": "myRepos",
"uri": "datasource://github_ds/user/repos",
"children": [
{
"type": "list",
"path": "$",
"class": "repoList",
"item": {
"type": "link",
"href": "{html_url}",
"target": "_blank",
"style": {
"textDecoration": "none",
"color": "inherit"
},
"children": [
{
"type": "view",
"class": "repoCard",
"style": {
"display": "flex",
"flexDirection": "column",
"gap": 12,
"padding": 16,
"border": "1px solid #e1e4e8",
"borderRadius": 8,
"backgroundColor": "#ffffff",
"boxShadow": "0 1px 4px rgba(0, 0, 0, 0.1)",
"transition": "box-shadow 0.2s ease, transform 0.2s ease",
"cursor": "pointer",
"textAlign": "left"
},
"onHover": {
"style": {
"boxShadow": "0 4px 12px rgba(0, 0, 0, 0.15)",
"transform": "translateY(-2px)"
}
},
"children": [
{
"type": "view",
"style": {
"display": "flex",
"alignItems": "center",
"gap": 16
},
"children": [
{
"type": "image",
"src": "{owner.avatar_url}",
"style": {
"width": 64,
"height": 64,
"borderRadius": "50%"
}
},
{
"type": "view",
"style": {
"display": "flex",
"flexDirection": "column",
"gap": 4
},
"children": [
{
"type": "text",
"text": "{name}",
"style": {
"fontSize": 18,
"fontWeight": "bold",
"color": "#0366d6",
"textOverflow": "ellipsis",
"overflow": "hidden",
"whiteSpace": "nowrap"
}
},
{
"type": "text",
"text": "{description}",
"style": {
"fontSize": 14,
"color": "#586069",
"lineHeight": 1.4,
"maxHeight": 42,
"overflow": "hidden",
"textOverflow": "ellipsis"
}
}
]
}
]
},
{
"type": "view",
"style": {
"display": "flex",
"alignItems": "center",
"justifyContent": "space-between",
"marginTop": 8
},
"children": [
{
"type": "text",
"text": "⭐️ {stargazers_count}",
"style": {
"fontSize": 14,
"color": "#6a737d"
}
},
{
"type": "text",
"text": "Forks: {forks_count}",
"style": {
"fontSize": 14,
"color": "#6a737d"
}
},
{
"type": "text",
"text": "Issues: {open_issues_count}",
"style": {
"fontSize": 14,
"color": "#6a737d"
}
}
]
}
]
}
]
}
}
]
}
]
}
],
"styles": {
"repoList": {
"display": "flex",
"flexDirection": "column",
"gap": 16
}
}
}

{
"type": "stylesheet",
"children": [
{
"type": "view",
"style": {
"flexDirection": "column",
"gap": 24,
"padding": 16,
"maxWidth": 1200,
"margin": "0 auto"
},
"children": [
{
"type": "text",
"text": "Popular GitHub Repositories",
"style": {
"fontSize": 24,
"fontWeight": "bold",
"marginBottom": 16,
"color": "#24292e"
}
},
{
"type": "rest",
"id": "repos",
"uri": "https://api.github.com/search/repositories?q=stars: >207000&sort=stars&order=desc",
"children": [
{
"type": "list",
"path": "items",
"class": "repoList",
"item": {
"type": "view",
"class": "repoCard",
"style": {
"display": "flex",
"flexDirection": "column",
"gap": 12,
"padding": 16,
"border": "1px solid #e1e4e8",
"borderRadius": 8,
"backgroundColor": "#ffffff",
"boxShadow": "0 1px 4px rgba(0, 0, 0, 0.1)",
"transition": "box-shadow 0.2s ease, transform 0.2s ease",
"cursor": "pointer",
"textAlign": "left"
},
"onHover": {
"style": {
"boxShadow": "0 4px 12px rgba(0, 0, 0, 0.15)",
"transform": "translateY(-2px)"
}
},
"children": [
{
"type": "view",
"style": {
"display": "flex",
"alignItems": "center",
"gap": 16
},
"children": [
{
"type": "image",
"src": "{owner.avatar_url}",
"style": {
"width": 64,
"height": 64,
"borderRadius": "50%"
}
},
{
"type": "view",
"style": {
"display": "flex",
"flexDirection": "column",
"gap": 4
},
"children": [
{
"type": "link",
"href": "{html_url}",
"target": "_blank",
"text": "{full_name}",
"style": {
"fontSize": 18,
"fontWeight": "bold",
"color": "#0366d6",
"textDecoration": "none",
"whiteSpace": "nowrap",
"overflow": "hidden",
"textOverflow": "ellipsis"
}
},
{
"type": "text",
"text": "{description}",
"style": {
"fontSize": 14,
"color": "#586069",
"lineHeight": 1.4,
"maxHeight": 42,
"overflow": "hidden",
"textOverflow": "ellipsis"
}
}
]
}
]
},
{
"type": "view",
"style": {
"display": "flex",
"alignItems": "center",
"justifyContent": "space-between",
"marginTop": 8
},
"children": [
{
"type": "text",
"text": "⭐️ {stargazers_count}",
"style": {
"fontSize": 14,
"color": "#6a737d"
}
},
{
"type": "text",
"text": "Forks: {forks_count}",
"style": {
"fontSize": 14,
"color": "#6a737d"
}
},
{
"type": "text",
"text": "Issues: {open_issues_count}",
"style": {
"fontSize": 14,
"color": "#6a737d"
}
}
]
}
]
}
}
]
}
]
}
],
"styles": {
"repoList": {
"display": "flex",
"flexDirection": "column",
"gap": 16
}
}
}