DreamOnward site meta
Behind the scenes material about this site. Intended for use during development, but shown to general visitors to showcase development process.
HTML/JS/CSS tech
In case something on this site looks off, it may be due to the use of some fancier web elements. This is most likely to occur if you are viewing the cyberspaces through Internet Explorer or Safari.
Given that this site revolves around development, we aim to be less conservative and more ambitious in our incorporation of new technology.
The elements in question:
- CSS grid layout (Canisuse) and (Html5please).
Color palette
100 lightest
200 lighter
300 light
500 base
700 dark
800 darker
900 darkest
Primary
Neutral
Accent1
Accent2
Greens
Yellows
Reds
Tags
green
yellow
red
Note
Hello world
Integer lobortis gravida elementum. Nam et fringilla magna. In lobortis convallis
diam eget tincidunt. Nam in efficitur mi. In eu quam vel diam sollicitudin feugiat. Duis at mattis velit.
Pellentesque luctus at ipsum eu ullamcorper. Sed sed neque eget arcu viverra dictum sit amet id diam. Duis
tincidunt tincidunt suscipit. Nulla in bibendum libero, eget iaculis lectus.
Aenean eleifend, risus et consequat vehicula, massa libero porttitor diam, sed lobortis purus metus a arcu.
Morbi
imperdiet hendrerit suscipit. Phasellus placerat urna in molestie tincidunt. Aenean bibendum purus nec nunc
ornare
sollicitudin. Mauris condimentum, ante ac pharetra molestie, risus turpis pellentesque nunc, et pretium quam
dolor
nec justo. Vivamus at dui eget orci blandit consectetur et non elit. Mauris sapien velit, eleifend sed ornare
at,
pharetra a metus.
Buttons and links
Link buttonStraight up anchors
Normal linkSome paragraph with a link in the middle.
Typography
This is the first paragraph. And the second sentence follows the first.
This is the second paragraph.
Headings
Heading 1
Heading 2
Heading 3
Heading 4
Heading 5
Heading 6
Lists
Unordered list
- Item 01
- Item 02
- Nested item
- Nested item
- Doubly nested item
- Doubly nested item
- Doubly nested item
- Item 03
Ordered list
- Item 01
- Item 02
- Nested item
- Nested item
- Doubly nested item
- Doubly nested item
- Doubly nested item
- Item 03
Description list
- Description list title 01
- Description list description 01
- Description list title 02
- Description list description 02A
- Description list description 02B
Code
read -p "Are you sure? " -n 1 -r
echo # (optional) move to a new line
if [[ ! $REPLY =~ ^[Yy]$ ]]
then
exit 1
fi
Components
Project meta component
Alert component
Alert title
This is some descriptive text about this alert