Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fixed source code spacing in examples.html #60

Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion css/style.css
Original file line number Diff line number Diff line change
Expand Up @@ -80,12 +80,13 @@ button:focus {
code,
pre,
details {
margin: 5px;
margin: 0px;
cursor: default;
font-family: "Andale", monospace;
background-color: #dee2e6;
color: #0b101a;
display: block;
line-height: 0.8;
}

summary {
Expand Down
11 changes: 11 additions & 0 deletions examples.html
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,7 @@
<script defer type="text/javascript" src="https://www.julienbl.me/ListExtender/lib/ListExtender.min.js"></script>
<script defer type="text/javascript" src="js/examples.js"></script>
</head>

<body>
<nav>
<a href="index.html"><h3>ListExtender.js</h3></a>
Expand All @@ -22,6 +23,7 @@
<a href="documentation.html"><button>Documentation</button></a>
</div>
</nav>

<div id="examples">
<h1>Examples</h1>
<div class="card" id="simpleList">
Expand All @@ -39,6 +41,7 @@ <h3>A basic extending list</h3>
</code>
</details>
</div>

<div class="card" id="themeList">
<h3>Try a few of the built-in styles for extending lists!</h3>
<div id="themeButtons" onclick="setTheme(event)">
Expand All @@ -59,6 +62,7 @@ <h3>Try a few of the built-in styles for extending lists!</h3>
</code>
</details>
</div>

<div class="card" id="commList">
<h3>Try community-made built-in styles for extending lists!</h3>
<div id="commButtons" onclick="setCommTheme(event)">
Expand Down Expand Up @@ -94,6 +98,7 @@ <h3>Try community-made built-in styles for extending lists!</h3>
</details>
<p>Want to add your own theme to this list? Check out <a href="https://github.com/JLambertazzo/ListExtender/blob/master/CONTRIBUTING.md">contributing.md</a></p>
</div>

<div class="card" id="delThemeList">
<h3>We also have built-in styles for extending lists! Special thanks to
<a href="https://github.com/basil08" style="text-decoration: underline;">@basil08</a> for the contribution 🚀</h3>
Expand All @@ -116,6 +121,7 @@ <h3>We also have built-in styles for extending lists! Special thanks to
</details>
<p>Want to add your own theme to this list? Check out <a href="https://github.com/JLambertazzo/ListExtender/blob/master/CONTRIBUTING.md">contributing.md</a></p>
</div>

<div class="card" id="deleteButton">
<h3>Lists have an optional delete button that shows on hover</h3>
<p>When not using the delete button, remove an item by double clicking it and clearing the text.</p>
Expand All @@ -129,6 +135,7 @@ <h3>Lists have an optional delete button that shows on hover</h3>
</code>
</details>
</div>

<div class="card" id="validationOne">
<h3>ListExtender makes it easy to validate inputs</h3>
<p>The following list accepts dates in the following formats: 2020-12-19, 12/19/2020, 19122020</p>
Expand All @@ -146,6 +153,7 @@ <h3>ListExtender makes it easy to validate inputs</h3>
</code>
</details>
</div>

<div class="card" id="validationTwo">
<h3>ListExtender allows for more complex validation as well!</h3>
<p>The following list does not accept duplicate dates entries.</p>
Expand All @@ -167,6 +175,7 @@ <h3>ListExtender allows for more complex validation as well!</h3>
</code>
</details>
</div>

<div class="card" id="addItems">
<h3>It's easy to add items to the list!</h3>
<p>Type text in the input box below, each word will be added to the list</p>
Expand All @@ -190,6 +199,7 @@ <h3>It's easy to add items to the list!</h3>
</code>
</details>
</div>

<div class="card" id="getItems">
<h3>It's easy to get items from the list!</h3>
<p>The items given in the list are: </p>
Expand All @@ -210,6 +220,7 @@ <h3>It's easy to get items from the list!</h3>
</code>
</details>
</div>

<div class="card" id="markedLists">
<h3>Make a simple completed todo list!</h3>
<p>The items that you can set complete.</p>
Expand Down