[valadoc/wip/beniofel/new-style] wip: sidebar

From: Ben Iofel <beniofel src gnome org>
To: commits-list gnome org
Cc:
Subject: [valadoc/wip/beniofel/new-style] wip: sidebar
Date: Sun, 20 Nov 2016 08:22:53 +0000 (UTC)
commit 396291947fe62f8ef1c28a59fe0bd04f203543ea
Author: Ben Iofel <iofelben gmail com>
Date:   Sun Nov 20 03:22:45 2016 -0500

    wip: sidebar

 web-assets/style.css |  461 ++++++++++++++++++++++++++++++++------------------
 1 files changed, 295 insertions(+), 166 deletions(-)
---
diff --git a/web-assets/style.css b/web-assets/style.css
index d8db625..07fb31b 100644
--- a/web-assets/style.css
+++ b/web-assets/style.css
@@ -1,11 +1,122 @@
-* {
-       font-family: 'Times New Roman';
-       font-size: 12pt;
+html {
+    color: #111;
+    font-family: "Open Sans", "Droid Sans", Helvetica, sans-serif;
+    font-size: 12px;
+    font-weight: 400;
 }
 
-ul.external_link {
+body {
+    margin: 0;
+    min-width: 720px;
+    padding: 48px 0 0;
 }
 
+a {
+    color: #08c;
+    text-decoration: none;
+}
+
+h2,
+h3 {
+    font-family: "Droid Serif", serif;
+    font-weight: 300;
+}
+
+p {
+    font-size: 14px;
+}
+
+/**********
+ * Header *
+ **********/
+
+ .site_header {
+    background-color: #403757;
+    box-shadow: 0 1px 3px rgba(0,0,0,0.12),
+                0 1px 2px rgba(0,0,0,0.24);
+    color: rgba(255,255,255,0.8);
+    font-size: 24px;
+    height: 48px;
+    line-height: 48px;
+    padding: 0 12px;
+    position: fixed;
+    top: 0;
+    width: calc(100% - 24px);
+    z-index: 1000;
+ }
+
+ /***********
+  * Sidebar *
+  ***********/
+
+.site_navigation {
+    position: fixed;
+    top: 48px;
+       width: 240px;
+    height: 100%;
+       background-color: #fcfcfc;
+    border-right: 1px solid #dedede;
+}
+
+.site_navigation ul {
+    font-size: 12px;
+    list-style: none;
+    margin: 6px 0;
+    padding: 0;
+}
+
+.site_navigation hr {
+    background-color: #dedede;
+    border: 0;
+    border-bottom: 1px solid #fff;
+    border-top: 1px solid #dedede;
+    height: 0;
+    margin: 6px 0;
+}
+
+.navi_inline {
+    font-size: 12px;
+    line-height: 21px;
+    list-style: none;
+    margin: 6px 3px;
+    padding-left: 6px;
+}
+
+.navi_inline {
+    padding-left: 12px;
+}
+
+.site_navigation .navi_main a {
+    display: initial;
+    padding: 0;
+}
+
+.site_navigation .navi_main a:before {
+    display: none;
+}
+
+.site_navigation .navi_main li {
+    padding: 3px 6px;
+}
+
+.navi_inline li:before,
+.navi_main li:before {
+    content: '';
+    display: inline-block;
+    height: 16px;
+    width: 16px;
+    margin-right: 6px;
+    vertical-align: middle;
+}
+
+.site_navigation .abstract_class > a,
+.navi_inline .abstract_class > a {
+    font-style: italic;
+}
+
+
+ /* TODO */
+
 .main_optional_parameter {
        font-style: italic;
 }
@@ -13,48 +124,33 @@ ul.external_link {
 .main_diagram {
        border-style: none;
        display: block;
-       margin: 0px auto;
-}
-
-.site_navi {
-       text-align: right;
+       margin: 0 auto;
 }
 
 .main_notification {
-       padding-right: 10px;
-       padding-left: 60px;
-       padding-bottom: 5px;
-       padding-top: 5px;
-       border-color: #aaaaff;
-       background-color: #eeeeff;
-       border-style: solid;
-       border-width: 1px;
-       margin: 10px;
-       min-height: 48px;
-       background-position: 6px 0.5em;
-       background-repeat: no-repeat;
-       background-image: url(images/warning.svg);
+    background-color: #eeeeff;
+    background-image: url(/images/warning.svg);
+    background-position: 6px 0.5em;
+    background-repeat: no-repeat;
+    border: 1px solid #aaaaff;
+    margin: 10px;
+    min-height: 48px;
+    padding: 5px 10px 5px 60px;
 }
 
 .main_table {
-       border-collapse: collapse;
-       border: 1px solid #aaaaff;
-       background: #eeeeff;
-       margin-right:auto;
-       margin-left:auto;
+    border-collapse: collapse;
+    border: 1px solid #aaaaff;
+    background: #eeeeff;
+    margin-right: auto;
+    margin-left: auto;
 }
 
-.main_source, .main_sourcesample {
-       padding-right: 10px;
-       padding-left: 5px;
-       padding-bottom: 5px;
-       padding-top: 5px;
-       margin: 10px;
-
-       border-color: #aaaaff;
-       background-color: #eeeeff;
-       border-style: solid;
-       border-width: 1px;
+.main_sourcesample {
+    background-color: #eeeeff;
+    border: 1px solid #aaaaff;
+    margin: 10px;
+    padding: 5px 10px 5px 5px;
 }
 
 
@@ -67,6 +163,7 @@ input {
 
 
 
+/*
 .site_header {
        font-size: 25px;
        padding-bottom: 10px;
@@ -74,12 +171,7 @@ input {
        background-color: #aaaaff;
        width: 100%;
 }
-
-
-div {
-       font-family:'Verdana';
-       font-size: 12;
-}
+*/
 
 
 .site_title {
@@ -102,15 +194,6 @@ div.site_body {
 }
 
 
-div.site_navigation {
-       float: left;
-
-       width: 240px;
-       border-color: #aaaaff;
-       border-style: solid;
-       border-width: 1px;
-       background-color: #eeeeff;
-}
 
 
 .site_content {
@@ -461,120 +544,13 @@ a.virtual_method, .description a.virtual_method, .brief_description a.virtual_me
        border:0px;
 }
 
-.navi_main .errorcode, .navi_inline .errorcode {
-       list-style-image:url(images/errorcode.svg);
-}
-.navi_main .enumvalue, .navi_inline .enumvalue {
-       list-style-image:url(images/enumvalue.svg);
-}
-.navi_main .abstract_class, .navi_inline .abstract_class {
-       list-style-image: url(images/abstractclass.svg);
-}
-.navi_main .abstract_method, .navi_inline .abstract_method {
-       list-style-image: url(images/abstractmethod.svg);
-}
-.navi_main .creation_method, .navi_inline .creation_method, .main_list_m {
-       list-style-image: url(images/constructor.svg);
-}
-.navi_main .static_method, .navi_inline .static_method {
-       list-style-image: url(images/staticmethod.svg);
-}
-.navi_main .package_index {
-       list-style-image: url(images/packages.svg);
-}
-.navi_main .virtual_method, .navi_inline .virtual_method {
-       list-style-image: url(images/virtualmethod.svg);
-}
-.navi_main .errordomain, .navi_inline .errordomain, .main_list_errdom {
-       list-style-image: url(images/errordomain.svg);
-}
-.navi_main .namespace, .navi_inline .namespace, .main_list_ns {
-       list-style-image: url(images/namespace.svg);
-}
-.navi_main .method, .navi_inline .method {
-       list-style-image: url(images/method.svg);
-}
-.navi_main .struct, .navi_inline .struct, .main_list_stru {
-       list-style-image: url(images/struct.svg);
-}
-.navi_main .interface, .navi_inline .interface, .main_list_iface {
-       list-style-image: url(images/interface.svg);
-}
-.navi_main .field, .navi_inline .field, .main_list_field {
-       list-style-image: url(images/field.svg);
-}
-.navi_main .class, .navi_inline .class, .main_list_cl {
-       list-style-image: url(images/class.svg);
-}
-.navi_main .enum, .navi_inline .enum, .main_list_en {
-       list-style-image: url(images/enum.svg);
-}
-.navi_main .property, .navi_inline .property, .main_list_prop {
-       list-style-image: url(images/property.svg);
-}
-.navi_main .abstract_property, .navi_inline .abstract_property {
-       list-style-image: url(images/abstractproperty.svg);
-}
-.navi_main .virtual_property, .navi_inline .virtual_property {
-       list-style-image: url(images/virtualproperty.svg);
-}
-.navi_main .delegate, .navi_inline .delegate, .main_list_del {
-       list-style-image: url(images/delegate.svg);
-}
-.navi_main .signal, .navi_inline .signal, .main_list_sig {
-       list-style-image: url(images/signal.svg);
-}
-.navi_main .package, .navi_inline .package {
-       list-style-image: url(images/package.svg);
-}
-.navi_main .constant, .navi_inline .constant {
-       list-style-image: url(images/constant.svg);
-}
-
-
-.navi_main {
-       margin-top: 10px;
-       margin-bottom: 10px;
-       padding-left: 30px;
-}
-
-.navi_hr {
-       border: 0;
-       color: #aaaaff;
-       background-color: #aaaaff;
-       height: 1px;
-       margin-left: 10px;
-       margin-right: 10px;
-       margin-top: 5px;
-       margin-bottom: 5px;
-}
-
-
-
-.navi_main a, .navi_inline a, a.external_link
-{
-       text-decoration: none;
-       color:  #214b87;
-}
 
-.navi_main .abstract_class > a, .navi_inline .abstract_class > a {
-       font-style: italic;
-}
 
-a.navi_link:hover, a.external_link:hover {
-       text-decoration: underline;
-}
 
 ul.no_bullet li {
        list-style-type: none;
 }
 
-.main_see_list {
-}
-
-.navi_inline {
-}
-
 .css_content_literal {
        font-family: monospace;
        color: #ff01ff;
@@ -592,8 +568,6 @@ code {
        text-decoration: underline;
 }
 
-.box {
-}
 .box .headline {
        background-image: url("coll_open.png");
        background-position: calc(100% - 1px) center;
@@ -621,11 +595,166 @@ code {
        width: 33%;
 }
 
-.namespace_note {
+.deprecated {
+       text-decoration:line-through;
 }
-.package_note {
+
+/*********
+ * Icons *
+ *********/
+
+.abstract_class:before,
+a.abstract_class,
+.description a.abstract_class,
+.brief_description a.abstract_class {
+    background-image: url(/images/abstractclass.svg);
+    font-style: italic;
 }
 
-.deprecated {
-       text-decoration:line-through;
+.abstract_method:before,
+.description a.abstract_method,
+.brief_description a.abstract_method {
+    background-image: url(/images/abstractmethod.svg);
+}
+
+.abstract_property:before,
+.description a.abstract_property,
+.brief_description a.abstract_property {
+    background-image: url(/images/abstractproperty.svg);
+}
+
+.class:before,
+.main_list_cl:before,
+.description a.class,
+.brief_description a.class {
+    background-image: url(/images/class.svg);
+}
+
+.constant:before,
+.description a.constant,
+.brief_description a.constant {
+    background-image: url(/images/constant.svg);
+}
+
+.creation_method:before,
+.main_list_m:before,
+.description a.creation_method,
+.brief_description a.creation_method {
+    background-image: url(/images/constructor.svg);
+}
+
+.delegate:before,
+.main_list_del:before,
+.description a.delegate,
+.brief_description a.delegate {
+    background-image: url(/images/delegate.svg);
+}
+
+.document:before {
+    background-image: url(/images/document.svg);
+}
+
+.enum:before,
+.main_list_en:before,
+.description a.enum,
+.brief_description a.enum {
+    background-image: url(/images/enum.svg);
+}
+
+.enumvalue:before,
+.enum_value:before,
+.description a.enumvalue,
+.brief_description a.enumvalue {
+    background-image: url(/images/enumvalue.svg);
+}
+
+.errorcode:before,
+.description a.errorcode,
+.brief_description a.errorcode {
+    background-image: url(/images/errorcode.svg);
+}
+
+.errordomain:before,
+.main_list_errdom:before,
+.description a.errordomain,
+.brief_description a.errordomain {
+    background-image: url(/images/errordomain.svg);
+}
+
+.field:before,
+.main_list_field:before,
+.description a.field,
+.brief_description a.field {
+    background-image: url(/images/field.svg);
+}
+
+.interface:before,
+.main_list_iface:before,
+.description a.interface,
+.brief_description a.interface {
+    background-image: url(/images/interface.svg);
+}
+
+.method:before,
+.description a.method,
+.brief_description a.method {
+    background-image: url(/images/method.svg);
+}
+
+.namespace:before,
+.main_list_ns:before,
+.description a.namespace,
+.brief_description a.namespace {
+    background-image: url(/images/namespace.svg);
+}
+
+.package:before {
+    background-image: url(/images/package.svg);
+}
+
+.package_index:before {
+    background-image: url(/images/packages.svg);
+}
+
+.property:before,
+.main_list_prop:before,
+.description a.property,
+.brief_description a.property {
+    background-image: url(/images/property.svg);
+}
+
+.signal:before,
+.main_list_sig:before,
+.description a.signal,
+.brief_description a.signal {
+    background-image: url(/images/signal.svg);
+}
+
+.static_method:before,
+.description a.static_method,
+.brief_description a.static_method {
+    background-image: url(/images/staticmethod.svg);
+}
+
+.struct:before,
+.main_list_stru:before,
+.description a.struct,
+.brief_description a.struct {
+    background-image: url(/images/struct.svg);
+}
+
+.video:before {
+    background-image: url(/images/video.svg);
+}
+
+.virtual_method:before,
+.description a.virtual_method,
+.brief_description a.virtual_method {
+    background-image: url(/images/virtualmethod.svg);
+}
+
+.virtual_property:before,
+.description a.virtual_property,
+.brief_description a.virtual_property {
+    background-image: url(/images/virtualproperty.svg);
 }
[Date Prev][Date Next] [Thread Prev][Thread Next] [Thread Index] [Date Index] [Author Index]