Skip to content

Commit

Permalink
fix #3 add icons
Browse files Browse the repository at this point in the history
  • Loading branch information
Ddiidev committed Sep 27, 2024
1 parent 63060ec commit 63dd23b
Showing 1 changed file with 115 additions and 95 deletions.
210 changes: 115 additions & 95 deletions index.html
Original file line number Diff line number Diff line change
@@ -1,110 +1,130 @@
<!doctype html>
<html lang="en" data-theme="dark">

<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="icon" type="image/png" sizes="32x32" href="assets/J2V-48x48.ico">
<title>JsonToVlang</title>
<link rel="stylesheet" href="css/pico/pico.min.css">
<link rel="stylesheet" href="css/custom/root.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Ruda:wght@500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500&display=swap" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.js"></script>
</head>
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="icon" type="image/png" sizes="32x32" href="assets/J2V-48x48.ico">
<title>JsonToVlang</title>
<link rel="stylesheet" type='text/css' href="https://cdn.jsdelivr.net/gh/devicons/devicon@latest/devicon.min.css" />
<link rel="stylesheet" href="css/pico/pico.min.css">
<link rel="stylesheet" href="css/custom/root.css">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Ruda:wght@500&display=swap" rel="stylesheet">
<link href="https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500&display=swap" rel="stylesheet">
<script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.5/lodash.js"></script>
</head>

<body>
<article class="options">
<nav>
<ul>
<li></li>
<li>
<label data-tooltip="Vlang.io" data-placement="bottom">
<a href="https://vlang.io" target="_blank">
<img src="https://devicons.dev.br/icons?icon=V&theme=dark">
</a>
</label>
</li>
<li>
<label data-tooltip="Json2V" data-placement="bottom">
<a href="https://github.com/Ddiidev/Json2V" target="_blank">
<img src="https://devicons.dev.br/icons?icon=Github&theme=dark">
</a>
</label>
</li>
<li>
<label data-tooltip="Json2V Tool CLI Vlang" data-placement="bottom">
<a href="https://github.com/Ddiidev/Json2VStruct" target="_blank">
<img src="assets/J2V-48x48.ico">
</a>
</label>
</li>
</ul>
<body>
<article class="options">
<nav>
<ul>
<li></li>
<li>
<label data-tooltip="Vlang.io" data-placement="bottom">
<a href="https://vlang.io" target="_blank">
<div class="icon-container">
<div class="icon-background">
<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 32 32"><path fill="#536b8a" d="m20.467 29.288l9.485-26.375a.5.5 0 0 0-.566-.728l-7.459.715a1.46 1.46 0 0 0-1.141.9l-8.779 25.206a.573.573 0 0 0 .578.813h7.26a.66.66 0 0 0 .577-.4Z"/><path fill="#5d87bf" d="m2.614 2.185l7.459.719a1.47 1.47 0 0 1 1.142.9l8.965 25.609a.286.286 0 0 1-.289.406h-7.306a1.31 1.31 0 0 1-1.152-.81L2.048 2.913a.5.5 0 0 1 .566-.728"/></svg>
</div>
</div>
</a>
</label>
</li>
<li>
<label data-tooltip="Json2V" data-placement="bottom">
<a href="https://github.com/Ddiidev/Json2V" target="_blank">
<div class="icon-container">
<div class="icon-background">
<i class="devicon-github-original" style="width: 64px; height: 64px;"></i>
</div>
</div>
</a>
</label>
</li>
<li>
<label data-tooltip="Json2V Tool CLI Vlang" data-placement="bottom">
<a href="https://github.com/Ddiidev/Json2VStruct" target="_blank">
<img src="assets/J2V-48x48.ico">
</a>
</label>
</li>
</ul>

<ul>
<li>
<label data-placement="bottom" data-tooltip="Field omitted if field value is empty"
for="ck_omitempty">
<input type="checkbox" id="ck_omitempty" name="ck_omitempty" onclick="loadFlags()" checked>
omitempty
</label>
</li>
<li>
<label data-placement="bottom"
data-tooltip="Reserved words will be added an '@' instead of a '_' E.g. type = @type"
for="ck_reserved_word">
<input type="checkbox" id="ck_reserved_word" onclick="loadFlags()" name="ck_reserved_word">
reserved word with @
</label>
</li>
<li>
<label data-placement="bottom" data-tooltip="Anonymous struct instead of a helper struct"
for="ck_struct_anon">
<input type="checkbox" id="ck_struct_anon" onclick="loadFlags()" name="ck_struct_anon">
struct anonymous
</label>
</li>
</ul>
<ul></ul>
<ul></ul>
</nav>
</article>
<div id="app">
<div class="container-fluid main-app">
<ul>
<li>
<label data-placement="bottom" data-tooltip="Field omitted if field value is empty"
for="ck_omitempty">
<input type="checkbox" id="ck_omitempty" name="ck_omitempty" onclick="loadFlags()" checked>
omitempty
</label>
</li>
<li>
<label data-placement="bottom"
data-tooltip="Reserved words will be added an '@' instead of a '_' E.g. type = @type"
for="ck_reserved_word">
<input type="checkbox" id="ck_reserved_word" onclick="loadFlags()" name="ck_reserved_word">
reserved word with @
</label>
</li>
<li>
<label data-placement="bottom" data-tooltip="Anonymous struct instead of a helper struct"
for="ck_struct_anon">
<input type="checkbox" id="ck_struct_anon" onclick="loadFlags()" name="ck_struct_anon">
struct anonymous
</label>
</li>
</ul>
<ul></ul>
<ul></ul>
</nav>
</article>
<div id="app">
<div class="container-fluid main-app">



<div class="grid" style="display: grid; height: 80%; padding: -15px;">
<article style="text-align: center;">
<h2>JSON</h2>
<div id="editorJson"></div>
</article>
<div class="grid" style="display: grid; height: 80%; padding: -15px;">
<article style="text-align: center;">
<h2>JSON</h2>
<div id="editorJson"></div>
</article>

<article style="text-align: center;">
<h2>Vlang</h2>
<div id="editorVlang"></div>
</article>
</div>
<article style="text-align: center;">
<h2>Vlang</h2>
<div id="editorVlang"></div>
</article>
</div>
</div>
</div>

<script>
window.onerror = function (msg, url, line, col, err) {
return true
}
</script>
<script src="./ace-builds/src-min/ace.js" type="text/javascript" charset="utf-8"></script>
<script>
window.onerror = function (msg, url, line, col, err) {
return true
}
</script>
<script src="./ace-builds/src-min/ace.js" type="text/javascript" charset="utf-8"></script>

<script defer src="./types.js"></script>
<script defer src="./validations.js"></script>
<script defer src="./resolvers.js"></script>
<script defer src="./index.js"></script>
</body>
<script defer src="./types.js"></script>
<script defer src="./validations.js"></script>
<script defer src="./resolvers.js"></script>
<script defer src="./index.js"></script>
</body>

<style>
.icon-container {
border-radius: 10px;
display: inline-block;
padding: 10px;
padding-left: 13px;
padding-right: 13px;
background-color: #242938;
transition: background-color 0.3s;
}
</style>
</html>

0 comments on commit 63dd23b

Please sign in to comment.