Changeset 4374

Timestamp:

01/29/14 09:39:49 (10 years ago)

Author:

twagoo

Message:

updated breadcrumbs on search and result page, made selection in facets

Location:

vlo/branches/vlo-3.0/vlo-web-app/src/main/html

Files:

• index.html (modified) (5 diffs)
• record1.html (modified) (1 diff)
• style/search_icon_disabled.png (added)
• style/vlo-facets.css (modified) (2 diffs)
• style/vlo-header.css (modified) (1 diff)

vlo/branches/vlo-3.0/vlo-web-app/src/main/html/index.html

@@ -55 +55 @@
                 <div id="breadcrumbs">
                     <a href="">VLO</a>
-                    &gt; Language: German [<a href="">x</a>]
+                    &gt; Language: Dutch [<a href="">x</a>]
                     ; Resource class: Text [<a href="">x</a>]
                 </div>
                 <div id="topnavigationlinks">
                     <a href="">Help</a>
-                    | <a href="">About</a>
                     | <a href="">Link to this page</a>
                 </div>
@@ -94 +93 @@
                     <div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
                     <h1>Language</h1>
-                    <a class="filtertoggle" href="#"><span>filter</span></a>
+                    <div class="filtertoggle"><span>filter</span></div>
+                    <!--enabled as link:--> 
+                    <!--<a class="filtertoggle" href="#"><span>filter</span></a>-->
                     <form class="filterform">
                         <input type="text" />
@@ -100 +101 @@
                     <div class="sbilinks">
                         <ul>
-                            <li><a href="">Dutch (148081)</a></li>
-                            <li><a href="">English (72435) </a></li>
-                            <li><a href="">German (42365) </a></li>
-                            <li><a href="">French (9165) </a></li>
-                            <li><a href="">Spanish (8612) </a></li>
-                            <li><a href="">Danish (8427) </a></li>
-                            <li><a href="">Japanese (6757) </a></li>
-                            <li><a href="">Turkish (4968) </a></li>
-                            <li><a href="">Chinese (1971)</a></li>
+                            <li><span class="selectedfacetvalue">Dutch (148081)</span><a class="removefacetvalue" href="">✕</a></li>
+                            <li><span class="facetvalue">English (72435) </span></li>
+                            <li><span class="facetvalue">German (42365) </span></li>
+                            <li><span class="facetvalue">French (9165) </span></li>
+                            <li><span class="facetvalue">Spanish (8612) </span></li>
+                            <li><span class="facetvalue">Danish (8427) </span></li>
+                            <li><span class="facetvalue">Japanese (6757) </span></li>
+                            <li><span class="facetvalue">Turkish (4968) </span></li>
+                            <li><span class="facetvalue">Chinese (1971)</span></li>
                             <li class="more-link"><a href="#">more...</a></li>
                         </ul>
@@ -119 +120 @@
                     <div class="rtop"><div class="r1"></div><div class="r2"></div><div class="r3"></div><div class="r4"></div></div>
                     <h1>Resource class</h1>
-                    <a class="filtertoggle" href="#"><span>filter</span></a>
+                    <div class="filtertoggle"><span>filter</span></div>
                     <form class="filterform">
                         <input type="text" />
@@ -125 +126 @@
                     <div class="sbilinks">
                         <ul>
-                            <li><a href="">text (70769)</a></li>
-                            <li><a href="">televisie (39307)</a></li>
-                            <li><a href="">Text (32502)</a></li>
-                            <li><a href="">Sound (10007)</a></li>
-                            <li><a href="">Data Provider (4402)</a></li>
-                            <li><a href="">bioscoop (2956)</a></li>
-                            <li><a href="">Televisie (1695)</a></li>
-                            <li><a href="">niet van toepassing (1185)</a></li>
+                            <li><span class="facetvalue">text (70769)</span></li>
+                            <li><span class="facetvalue">televisie (39307)</span></li>
+                            <li><span class="selectedfacetvalue">Text (32502)</span><a class="removefacetvalue" href="">✕</a></li>
+                            <li><span class="facetvalue">Sound (10007)</span></li>
+                            <li><span class="facetvalue">Data Provider (4402)</span></li>
+                            <li><span class="facetvalue">bioscoop (2956)</span></li>
+                            <li><span class="facetvalue">Televisie (1695)</span></li>
+                            <li><span class="facetvalue">niet van toepassing (1185)</span></li>
                             <li class="more-link"><a href="#">more...</a></li>
                         </ul>

vlo/branches/vlo-3.0/vlo-web-app/src/main/html/record1.html

@@ -50 +50 @@
             </div>
 
+            <div id="topnavigation">
+                <div id="breadcrumbs">
+                    <a href="index.html">VLO</a>
+                    &gt; <a href="index.html">Language: Dutch ; Resource class: Text</a>
+                    &gt; &quot;Chinese Democratie en de Transformatie&quot;
+                </div>
+                <div id="topnavigationlinks">
+                    <a href="">Help</a>
+                    | <a href="">Link to this page</a>
+                </div>
+            </div>
+            
             <div class="sidebar">
 

vlo/branches/vlo-3.0/vlo-web-app/src/main/html/style/vlo-facets.css

@@ -22 +22 @@
 
 /* facet links */
+
+.facetvalue {
+    color: #ccc;
+}
+
+.facetvalue, .selectedfacetvalue {
+    padding: 0px 0px 2px 14px;
+}
+
+.sbilinks li a.removefacetvalue, .sbilinks li a.removefacetvalue:hover {
+    text-decoration: none;
+}
 
 li.more-link {
@@ -76 +88 @@
 }
 
-.filterfacet .filtertoggle {
+.sidebaritem .filtertoggle, .sidebaritem .filtertoggle:hover {
     float: right;
     clear: right;
     display: block;
     margin-top: 8px;
+    margin-right: 8px;
+    padding: 0px;
     width: 16px;
     height: 16px;
-    background: url('search_icon.png') no-repeat;
     background-size: 16px;
+    background-repeat: no-repeat;
+}
+.sidebaritem a.filtertoggle {
+    /* link means enabled */
+    background-image: url('search_icon.png');
 }
 
-a.filtertoggle span{
+.sidebaritem div.filtertoggle {
+    /* div means disabled */
+    background-image: url('search_icon_disabled.png');
+}
+
+.sidebaritem .filtertoggle span {
     display: none;
 }

vlo/branches/vlo-3.0/vlo-web-app/src/main/html/style/vlo-header.css

@@ -42 +42 @@
     display: block;
     position: relative;
-    top: 70px;
-    height: 30px;
+    top: 65px;
+    height: 40px;
 }