Skip to content
GitLab
Projects
Groups
Snippets
/
Help
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
Menu
Open sidebar
bonita
bonita-web-pages
Commits
282e5074
Commit
282e5074
authored
Feb 23, 2018
by
julien.mege
Browse files
Add content for a Primer example page
parent
cbef9127
Changes
3
Hide whitespace changes
Inline
Side-by-side
page-hello-world/package.json
View file @
282e5074
...
...
@@ -21,6 +21,7 @@
"dependencies"
:
{
"lodash"
:
"^4.17.5"
,
"primer"
:
"^10.3.0"
,
"primer-buttons"
:
"^2.5.3"
"primer-buttons"
:
"^2.5.3"
,
"primer-layout"
:
"^1.4.5"
}
}
page-hello-world/src/index.js
View file @
282e5074
...
...
@@ -3,14 +3,78 @@ import './index.scss';
function
component
()
{
var
element
=
document
.
createElement
(
'
div
'
);
//element.innerHTML = _.join(['Hello', 'webpack'], ' ');
element
.
innerHTML
=
_
.
join
([
'
Hello
'
,
'
webpack
'
],
'
'
);
element
.
innerHTML
=
'
<div class="container">
\n
'
+
'
<div class="flash">
\n
'
+
'
<button type="submit" class="btn btn-sm primary flash-action">Complete action</button>
\n
'
+
'
Flash message with action here.
\n
'
+
'
</div>
'
+
'
<div class="Subhead">
\n
'
+
'
<div class="Subhead-heading">Buttons </div>
\n
'
+
'
<div class="Subhead-description">The subhead is a subdued header style with a light bottom border.</div>
\n
'
+
'
</div>
'
+
'
<button class="btn btn-primary" type="button">Button</button>
\n
'
+
'
<a class="btn" href="#url" role="button">Link button</a>
'
+
'
<div class="position-relative text-center">
\n
'
+
'
<button class="btn btn-primary">UI</button>
\n
'
+
'
<div class="Popover right-0 left-0">
\n
'
+
'
<div class="Popover-message Popover-message--top Popover-message--large text-left p-4 mt-2 Box box-shadow-large">
\n
'
+
'
<h4 class="mb-2">Popover heading</h4>
\n
'
+
'
<p>Message about this particular piece of UI.</p>
\n
'
+
'
<button type="submit" class="btn btn-outline mt-2 text-bold">Got it!</button>
\n
'
+
'
</div>
\n
'
+
'
</div>
\n
'
+
'
</div>
'
+
'
<div class="Subhead">
\n
'
+
'
<div class="Subhead-heading">A Box with action</div>
\n
'
+
'
<div class="Subhead-description">The subhead is a subdued header style with a light bottom border.</div>
\n
'
+
'
</div>
'
+
'
<div class="Box">
\n
'
+
'
<div class="Box-row d-flex flex-items-center">
\n
'
+
'
<div class="flex-auto">
\n
'
+
'
<strong>Row title</strong>
\n
'
+
'
<div class="text-small text-gray-light">
\n
'
+
'
Description
\n
'
+
'
</div>
\n
'
+
'
</div>
\n
'
+
'
<button type="button" class="btn btn-primary" name="button">View</button>
\n
'
+
'
</div>
\n
'
+
'
<div class="Box-row d-flex flex-items-center">
\n
'
+
'
<div class="flex-auto">
\n
'
+
'
<strong>Row title</strong>
\n
'
+
'
<div class="text-small text-gray-light">
\n
'
+
'
Description
\n
'
+
'
</div>
\n
'
+
'
</div>
\n
'
+
'
<button type="button" class="btn btn-primary" name="button">View</button>
\n
'
+
'
</div>
\n
'
+
'
<div class="Box-row d-flex flex-items-center">
\n
'
+
'
<div class="flex-auto">
\n
'
+
'
<strong>Row title</strong>
\n
'
+
'
<div class="text-small text-gray-light">
\n
'
+
'
Description
\n
'
+
'
</div>
\n
'
+
'
</div>
\n
'
+
'
<button type="button" class="btn btn-primary" name="button">View</button>
\n
'
+
'
</div>
\n
'
+
'
</div>
'
+
'
<div class="Subhead">
\n
'
+
'
<div class="Subhead-heading">Any empty space</div>
\n
'
+
'
<div class="Subhead-description">The subhead is a subdued header style with a light bottom border.</div>
\n
'
+
'
</div>
'
+
'
<div class="blankslate">
\n
'
+
'
<h3>This is a blank slate</h3>
\n
'
+
'
<p>Use it to provide information when no dynamic content exists.</p>
\n
'
+
'
</div>
'
+
'
</div>
'
;
return
element
;
}
var
element
=
document
.
createElement
(
'
button
'
);
element
.
className
=
'
btn btn-primary
'
;
element
.
innerText
=
'
Button
'
;
document
.
body
.
appendChild
(
element
);
document
.
body
.
appendChild
(
component
());
page-hello-world/src/index.scss
View file @
282e5074
@import
"primer-buttons/index.scss"
;
\ No newline at end of file
@import
"primer-layout/index.scss"
;
@import
"primer-subhead/index.scss"
;
@import
"primer-buttons/index.scss"
;
//Can import all for demo
@import
"primer/index.scss"
;
\ No newline at end of file
Write
Preview
Supports
Markdown
0%
Try again
or
attach a new file
.
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment