aculix/vector-drawable-nextjs
1
0
Fork 0
mirror of https://github.com/aculix/vector-drawable-nextjs.git synced 2025-12-06 06:08:24 +00:00
Code Issues Packages Projects Releases Wiki Activity

add npx script

Browse Source
This commit is contained in:
Yath Seanghay 2021-01-07 19:32:37 +07:00
parent 51bec7f644
commit 3d6e695619
2 changed files with 38 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
pages/index.js
View File

@ -189,8 +189,16 @@ export default function Home() {
<ReactSVG src="/github.svg"/>
</a>
</div>
<h5>Or using command line</h5>
<p className="vd-code-snippet">
npx <span className="vd-cmd">vector-drawable-svg</span> <span className="vd-input">my-drawable.xml</span> <span className="vd-input">out.svg</span>
</p>
</footer>
</div>
</div>
</>
)

30
styles/globals.css
View File

@ -228,6 +228,7 @@ button:not(:disabled):active {
.vd-footer {
margin-top: 20px;
margin-bottom: 100px;
text-align: center;
}
.vd-github svg {
@ -236,12 +237,39 @@ button:not(:disabled):active {
}
.vd-code-snippet .vd-cmd {
color: var(--vd-color-primary);
}
.vd-code-snippet .vd-input {
color: var(--vd-color-secondary-text);
}
.vd-code-snippet {
background: var(--vd-color-on-surface);
border-radius: calc(var(--vd-size-corner-radius) / 2.5);
font-family: "JetBrains Mono", monospace;
font-weight: bold;
border: 1px solid rgba(255, 255,255, 0.1);
position: relative;
white-space: nowrap;
max-width: 600px;
padding: 14px 18px;
overflow-x: auto;
}
@media only screen and (max-width: 600px) {
.vd-code-snippet {
max-width: 300px;
}
.vd-title {
font-size: 1.8em;
}
.vd-subtitle {
font-size: 1em;
}
@ -260,3 +288,5 @@ button:not(:disabled):active {
}
}