Skip to content

Commit e3a831b

Browse files
committed
Updates
1 parent d4aaf73 commit e3a831b

32 files changed

+1147
-411
lines changed

etc/example.json

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
[
2+
{
3+
"fruit": "Apple",
4+
"size": "Large",
5+
"color": "Red"
6+
},
7+
{
8+
"fruit": "Banana",
9+
"size": "Bendy",
10+
"color": "Yellow"
11+
}
12+
]

html/index.html

Lines changed: 49 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,9 +6,8 @@
66
<script type="module" src="./index.js" defer></script>
77
<meta name="viewport" content="width=device-width, initial-scale=1.0">
88
</head>
9-
109
<body>
11-
<wc-navbar>Storybook</wc-navbar>
10+
<wc-navbar>Web Components Storybook</wc-navbar>
1211
<wc-row>
1312
<wc-col width="2" style="background-color: lightgray">NAV</wc-col>
1413
<wc-col width="10">
@@ -79,17 +78,60 @@ <h4>Nav (Vertical)</h4>
7978
<div class="container m-1">
8079
<h4>Form Elements</h4>
8180
<wc-form action="/">
81+
<wc-form-head>Form to fill in</wc-form-head>
8282
<wc-input name="input-a" placeholder="Placeholder">First input value</wc-input>
8383
<wc-input name="input-b" placeholder="Placeholder">Second input value</wc-input>
84-
<wc-checkbox-group name="checkbox-c" radio>
85-
<wc-checkbox value="1">Checkbox 1</wc-checkbox>
86-
<wc-checkbox value="2" checked>Checkbox 2</wc-checkbox>
87-
<wc-checkbox value="3" disabled>Checkbox 3</wc-checkbox>
88-
</wc-checkbox-group>
84+
<wc-row>
85+
<wc-col width="6">
86+
<wc-checkbox-group name="checkbox-c">
87+
<wc-checkbox value="1">Checkbox 1</wc-checkbox>
88+
<wc-checkbox value="2" checked>Checkbox 2</wc-checkbox>
89+
<wc-checkbox value="3" disabled>Checkbox 3</wc-checkbox>
90+
</wc-checkbox-group>
91+
</wc-col>
92+
<wc-col width="6">
93+
<wc-checkbox-group name="radio-d" radio>
94+
<wc-checkbox value="1">Radio 1</wc-checkbox>
95+
<wc-checkbox value="2" checked>Radio 2</wc-checkbox>
96+
<wc-checkbox value="3" disabled>Radio 3</wc-checkbox>
97+
</wc-checkbox-group>
98+
</wc-col>
99+
</wc-row>
89100
<wc-button>Submit</wc-button>
90101
</wc-form>
91102
</div>
92103

104+
<div class="container m-1">
105+
<h4>Modal</h4>
106+
<wc-button id="open-button">Open</wc-button>
107+
<wc-modal id="modal-window" bg="white">
108+
<wc-close></wc-close>
109+
<h3>This is a modal box</h3>
110+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore
111+
et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut
112+
aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
113+
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
114+
culpa qui officia deserunt
115+
mollit anim id est laborum.</p>
116+
<p>Duis aute irure dolor in reprehenderit in voluptate velit esse
117+
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in
118+
culpa qui officia deserunt
119+
mollit anim id est laborum.</p>
120+
</wc-modal>
121+
<script>
122+
var open = document.getElementById('open-button');
123+
var win = document.getElementById('modal-window');
124+
open.addEventListener('click', function() {
125+
win.style.display = 'block';
126+
});
127+
</script>
128+
</div>
129+
130+
<div class="container m-1">
131+
<h4>Table</h4>
132+
<wc-table columns="Col A, Col B, Col C" head foot data="fake-data"></wc-table>
133+
</div>
134+
93135
</wc-col>
94136
</wc-row>
95137
</body>

js/wc/event.js

Lines changed: 0 additions & 6 deletions
This file was deleted.

js/wc/index.js

Lines changed: 0 additions & 20 deletions
This file was deleted.

0 commit comments

Comments
 (0)