Skip to content

Commit

Permalink
Minor revisions and clean up to the Patters pg in the User Guide. Add…
Browse files Browse the repository at this point in the history 
…ed download link for Dataverse Project logo to Foundations pg. [ref #3747]
  • Loading branch information
@mheppler
mheppler committed May 16, 2017
1 parent fdf0e93 commit a98917b
Show file tree
Hide file tree
Showing 4 changed files with 147 additions and 21 deletions.
104 changes: 104 additions & 0 deletions doc/sphinx-guides/source/_static/dataverse_project_logo.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
13 changes: 11 additions & 2 deletions doc/sphinx-guides/source/_static/docsdataverse_org.css
View file
Original file line number Diff line number Diff line change
Expand Up @@ -33,9 +33,13 @@ iframe {
border:0;
}

.navbar-default a.navbar-brand, .navbar-default a.navbar-brand:hover {
color: #c55b28;
a.navbar-brand, a.navbar-brand:hover {
color:#C55B28 !important;
}
span.navbar-brand {color:#C55B28 !important; padding-left: 32px; height: 50px;}
span.navbar-brand .icon-dataverse {color:#C55B28; font-size:28px; margin: -4px 0 0 -27px; position: absolute;}
ul.navbar-nav li.dropdown span.dropdown-toggle {display: block; padding: 15px; color: #777;}
ul.navbar-nav li.dropdown.open > span.dropdown-toggle {background: #e7e7e7;}
.bg-dataverse, bg-brand {background:#C55B28;}
.bg-dataset {background:#337AB7;}
.bg-file {background:#777777;}
Expand Down Expand Up @@ -93,6 +97,11 @@ div.code-example .color-swatch {
border-radius: 3px
}

#breadcrumbNavBlock {margin-top:.5em;}
#breadcrumbNavBlock .breadcrumbBlock {float:left; position:relative;}
#breadcrumbNavBlock .breadcrumbActive {font-weight:bold;}
#breadcrumbNavBlock .breadcrumbCarrot {float: left; margin: 0 .4em; color: #B3B3B3; display: block;}

/* alternative formattings: font-weight: bold; font-size: 110%; etc. */

/* #sidebar.bs-sidenav.affix {
Expand Down
2 changes: 2 additions & 0 deletions doc/sphinx-guides/source/style/foundations.rst
View file
Original file line number Diff line number Diff line change
Expand Up @@ -324,6 +324,8 @@ Logos

The Dataverse Project logo (below) is displayed in the footer, and was the basis for the creation of the application's icons and favicon.

Create both print and web version of the Dataverse Project logo by downloading this vector-based SVG file: :download:`dataverse_project_logo.svg <../_static/dataverse_project_logo.svg>`

.. raw:: html

<div class="panel panel-default">
Expand Down
49 changes: 30 additions & 19 deletions doc/sphinx-guides/source/style/patterns.rst
View file
Original file line number Diff line number Diff line change
Expand Up @@ -19,12 +19,6 @@ When logged in, the account name is a dropdown menu, linking the user to account
<nav id="navbarFixed" class="navbar navbar-default"><!-- navbar-fixed-top -->
<div class="container" style="width:auto !important;">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#topNavBar">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a href="#" onclick="return false;">
<span class="navbar-brand"><i id="icon-dataverse" class="icon-dataverse"></i> Dataverse</span>
</a>
Expand Down Expand Up @@ -60,24 +54,45 @@ When logged in, the account name is a dropdown menu, linking the user to account

<nav id="navbarFixed" class="navbar navbar-default navbar-fixed-top">
<div class="container">
...
<div class="navbar-header">
<a href="#" onclick="return false;">
<span class="navbar-brand"><i id="icon-dataverse" class="icon-dataverse"></i> Dataverse</span>
</a>
</div>
<div class="collapse navbar-collapse" id="topNavBar">
<ul class="nav navbar-nav navbar-right">
<li>
...
</li>
</ul>
</div>
</div>
</nav>


Breadcrumbs
===========

The breadcrumbs are displayed under the header, and provide a trail of links for users to navigate the hierarchy of containing objects, from file to dataset to dataverse.

*TO-DO...* should we change how we do breadcrumbs in order to follow this http://getbootstrap.com/components/#breadcrumbs
The breadcrumbs are displayed under the header, and provide a trail of links for users to navigate the hierarchy of containing objects, from file to dataset to dataverse. It utilizes a JSF `repeat component <http://docs.oracle.com/javaee/6/javaserverfaces/2.0/docs/pdldocs/facelets/ui/repeat.html>`_ to iterate through the breadcrumbs.

.. raw:: html

<div class="panel panel-default code-example">
<div class="panel-body">

BREADCRUMBS HERE
<div id="breadcrumbNavBlock" class="container">
<div class="breadcrumbBlock">
<a id="breadcrumbLnk0" href="#" onclick="return false;">Name of a Dataverse</a>
</div>
<span class="breadcrumbCarrot"> &gt; </span>
<div class="breadcrumbBlock">
<a id="breadcrumbLnk1" href="#" onclick="return false;">Name of Another Dataverse</a>
</div>
<span class="breadcrumbCarrot"> &gt; </span>
<div class="breadcrumbBlock">
<span class="breadcrumbActive">Title of Dataset</span>
</div>
</div>

</div>
</div>
Expand Down Expand Up @@ -177,8 +192,6 @@ Forms

Forms fulfill various functions across the site, but we try to style them consistently. We use the `.form-horizontal` layout, which uses `.form-group` to create a grid of rows for the labels and inputs. The consistent style of forms is maintained using the `Forms component <http://getbootstrap.com/css/#forms>`__ from Bootstrap. Form elements like the `InputText component <https://www.primefaces.org/showcase/ui/input/inputText.xhtml>`__ from PrimeFaces are kept looking clean and consistent across each page.

*TO-DO...* Fix tooltips. Add real XHTML not the generated HTML. Should more sections talk about the PrimeFaces components?

.. raw:: html

<div class="panel panel-default code-example">
Expand Down Expand Up @@ -364,8 +377,6 @@ There are a few places where we use icon-only buttons with no text label. For th

We use the style class `no-text` with the `glyphicon` class to fix spacing issues from margins and padding applied to buttons with text labels.

*TO-DO...* fix the tooltip + Bootstrap JS in example below...

.. raw:: html

<div class="panel panel-default code-example">
Expand Down Expand Up @@ -647,16 +658,16 @@ We use the `TabView component <https://www.primefaces.org/showcase/ui/panel/tabV

<ul class="ui-tabs-nav ui-helper-reset ui-helper-clearfix ui-widget-header ui-corner-all" role="tablist">
<li class="ui-state-default ui-tabs-selected ui-state-active ui-corner-top" role="tab" aria-expanded="true" aria-selected="true" tabindex="0">
<a href="#" onclick="return false;" tabindex="-1">Files</a>
<a href="#" onclick="return false;" tabindex="-1">Content Tab 1</a>
</li>
<li class="ui-state-default ui-corner-top" role="tab" aria-expanded="false" aria-selected="false" tabindex="-1">
<a href="#" onclick="return false;" tabindex="-1">Metadata</a>
<a href="#" onclick="return false;" tabindex="-1">Content Tab 2</a>
</li>
<li class="ui-state-default ui-corner-top" role="tab" aria-expanded="false" aria-selected="false" tabindex="-1">
<a href="#" onclick="return false;" tabindex="-1">Terms</a>
<a href="#" onclick="return false;" tabindex="-1">Content Tab 3</a>
</li>
<li class="ui-state-default ui-corner-top" role="tab" aria-expanded="false" aria-selected="false" tabindex="-1">
<a href="#" onclick="return false;" tabindex="-1">Versions</a>
<a href="#" onclick="return false;" tabindex="-1">Content Tab 4</a>
</li>
</ul>

Expand Down

0 comments on commit a98917b

Please sign in to comment.