84 lines
3.2 KiB
HTML
84 lines
3.2 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta
|
|
property="og:description"
|
|
content="Feature rich Select control for React/JS with multiselect, autocomplete and styling"
|
|
/>
|
|
<meta property="og:type" content="website" />
|
|
<meta property="og:site_name" content="cg-select" />
|
|
<meta property="og:url" content="https://cg-select.itguild.info" />
|
|
<meta property="og:image" content="../img/logoCG.jpg" />
|
|
|
|
<title>Cg-Select</title>
|
|
<link rel="shortcut icon" href="../img/logoCG2.ico" type="image/x-icon" />
|
|
<link href="../../style.scss" rel="stylesheet" />
|
|
<link href="constructor.scss" rel="stylesheet" />
|
|
</head>
|
|
<body class="body-example">
|
|
<div class="container">
|
|
<header class="header">
|
|
<div class="header__logoBox">
|
|
<h1>CG-SELECT</h1>
|
|
<img src="../img/logoCG.jpg" alt="#" class="header__logo" />
|
|
</div>
|
|
<hr style="width: 55%" />
|
|
<nav>
|
|
<ul class="navlist">
|
|
<li><a href="../../index.html">Home</a></li>
|
|
<li><a href="../../docs/index.html">Documentation</a></li>
|
|
<li><a href="./constructor.html">Constructor</a></li>
|
|
<li><a href="../cdn/cdn.html">CDN</a></li>
|
|
</ul>
|
|
</nav>
|
|
<p class="version">v. 0.3.11</p>
|
|
</header>
|
|
</div>
|
|
|
|
<div class="container content">
|
|
<div class="example-select">
|
|
<h1 class="example-select_title">Select constructor</h1>
|
|
<div class="row" style="margin: 20px; color: white">
|
|
<div class="col">
|
|
<h5 style="font-size: 18px; margin: 0;">Select Style Builder:</h5>
|
|
<p style="margin-right: 50px; font-size: 17px">
|
|
This is a constructor for styling a select online without downloading. For it to work,
|
|
you need to:
|
|
<ol style="font-size: 15px;">
|
|
<li class="liList">Select a part of the select for customization. </li>
|
|
<li class="liList">Enter styles in the text field in the form "color: red;".</li>
|
|
<li class="liList">Click on the render button.</li>
|
|
</ol>
|
|
</p>
|
|
</div>
|
|
<div class="col">
|
|
<div class="layout-select constructor">
|
|
<button class="cg-dropdown body"></button>
|
|
<textarea
|
|
name="styles"
|
|
id="styles"
|
|
cols="30"
|
|
rows="5"
|
|
class="textareaStyle"
|
|
placeholder="Enter CSS properties"
|
|
disabled="disabled"
|
|
></textarea>
|
|
<button type="button" class="check-code render">Render</button>
|
|
</div>
|
|
|
|
</div>
|
|
|
|
</div>
|
|
<div class="layout-select constructor" style="margin-bottom: 60px;">
|
|
<button class="cg-dropdown select"></button>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</body>
|
|
<script type="module" src="constructor.js"></script>
|
|
</html>
|