diff --git a/src/js/src/color-sample.html b/src/js/src/color-sample.html new file mode 100644 index 0000000..4e2bd78 --- /dev/null +++ b/src/js/src/color-sample.html @@ -0,0 +1,22 @@ + + + + + + + + Solitude + + + +
+
+
+
+
+
+
+
+ + + \ No newline at end of file diff --git a/src/js/src/css/color-sample.css b/src/js/src/css/color-sample.css new file mode 100644 index 0000000..c265496 --- /dev/null +++ b/src/js/src/css/color-sample.css @@ -0,0 +1,20 @@ +body { + background-color:#28385E +} + +#main > div { + display: inline-block; + width: 100px; + height:50px; + vertical-align: top; +} + +#main > div:nth-child(1) { + background-color: #516C8D; +} +#main > div:nth-child(2) { + background-color: #6A91C1; +} +#main > div:nth-child(3) { + background-color: #CCCCCC; +} \ No newline at end of file diff --git a/src/js/src/css/index.css b/src/js/src/css/index.css new file mode 100644 index 0000000..e3bb398 --- /dev/null +++ b/src/js/src/css/index.css @@ -0,0 +1,117 @@ +body { + color: #CCCCCC; + background-color: #28385E; + font-size: 16px; +} + +#main { + white-space:nowrap; + overflow-x: scroll; +} + +#main > div { + display: inline-block; + vertical-align: top; + margin-right: 0.25em; +} + +#left-menu { + min-width: 300px; + font-size: 1.25em; + + min-width: 300px; + min-height: 640px; + margin-left: 0.5em; + color:#CCCCCC; + background-color: #516C8D; +} +#left-menu img { + padding-right: 0.25em; + +} +#left-menu ol { + padding-left: 0em; +} + +#left-menu li:nth-child(1) { + border-top-style:solid; + border-top-width:0.1em; + border-top-color:#CCCCCC; +} +#left-menu li { + padding-top: 0.25em; + padding-bottom:0.25em; + padding-left:0.5em; + border-bottom-style:solid; + border-bottom-width:0.1em; + border-bottom-color: #CCCCCC; + list-style:none; + height: 1.25em; +} + +#left-menu img { + width:auto; + height:auto; + max-width:100%; + max-height:100%; +} + +#left-menu li,#left-menu img { + vertical-align:middle; +} + +#left-menu li:hover { + background-color: #6A91C1; +} + + +#main-pane { + width:100% +} + +#main-tabs { + margin:0em; + margin-left:0em; + margin-right:0em; + padding: 0em; +} + +#main-tabs li.tab { + display: inline-block; + color: #516C8D; + background-color: #CCCCCC; + + + border-width: 0em; + border-style:solid; + border-color:#516C8D; + padding:0.4em; + min-width:5em; +} + + +#main-tabs li.tab:hover { + background-color: #6A91C1; +} + +#main-tabs li.tab.selected { + border-bottom-color:#CCCCCC; + border-bottom-width: 0.25em; +} + +div.main-article { + display: none; +} + +div.main-article.selected { + display: inline-block; + font-size: 1em; + min-width: 300px; + min-height: 640px; + width:100%; + padding-left : 0.5em; + padding-top :0.5em; + color: #516C8D; + background-color: #CCCCCC; +} + diff --git a/src/js/src/img/menu-home.png b/src/js/src/img/menu-home.png new file mode 100644 index 0000000..0575b0d --- /dev/null +++ b/src/js/src/img/menu-home.png Binary files differ diff --git a/src/js/src/img/menu-home.svg b/src/js/src/img/menu-home.svg new file mode 100644 index 0000000..aaf5daa --- /dev/null +++ b/src/js/src/img/menu-home.svg @@ -0,0 +1,14 @@ + + + + + + + + + + diff --git a/src/js/src/index.html b/src/js/src/index.html index 00f6d28..ed5bf37 100644 --- a/src/js/src/index.html +++ b/src/js/src/index.html @@ -4,10 +4,34 @@ + Solitude + -

Hello World

-

This is first Solitude

+
+
+
    +
  1. HOME
    2. +
  2. メニューアイテム2
    3. +
  3. メニューアイテム3
    4. +
+
+
+ +
+

Hello Solitude World

+

This is first Solitude

+
+
+

Hello Solitude World 2

+

This is second Solitude

+
+
+
+ \ No newline at end of file