added metadata to fieldset, switched box model to border box to avoid truncating labels in definition lists

islandora_basic_image/css/islandora_basic_image.theme.css

@@ -18,8 +18,8 @@
 }
 
 .islandora-basic-image-metadata {
-  clear: both;
+  display: block;
-  padding-top: 1.5em;
+  clear: both
 }
 
 dl.islandora-basic-image-fields {
@@ -33,15 +33,25 @@ dl.islandora-basic-image-fields {
 /*
  * The width + left/right padding of DTs/DDs equals 88% when compensating for an image
  */
+
+.islandora-basic-image-metadata * {
+   -moz-box-sizing: border-box;
+   -webkit-box-sizing: border-box;
+   box-sizing: border-box;
+}
+
 .islandora-basic-image-metadata dt {
   margin-right:-1px;
-  width:12.5%;
+  width:15.625%;
-  font-weight: bold;
+  font-weight: normal;
   text-align: right;
+  font-weight: bold;
+  padding-right: 0;
 }
 
 .islandora-basic-image-metadata dd {
-  width:77%;
+  width:84.375%;
+  padding-left: 40px;
 }
 
 /* 
@@ -55,15 +65,15 @@ dl.islandora-basic-image-fields {
   letter-spacing:normal;
   word-spacing:normal;
   vertical-align:top;
-  padding:5px 0 3px 3%;
+  padding-top: 6px;
+  padding-bottom: 4px;
   margin:0;
-  border-top:1px solid #ddd;
+  border-top:1px solid #e5e5e5;
- -ms-word-break: break-all;
+}
-     word-break: break-all;
+
-     word-break: break-word; /* webkit */
+.islandora-basic-image-metadata dt.first,
--webkit-hyphens: auto;
+.islandora-basic-image-metadata dd.first {
-   -moz-hyphens: auto;
+  border-top:0;
-        hyphens: auto;
 }
 
 .islandora-basic-image-sidebar,

islandora_basic_image/islandora-basic-image.tpl.php

@@ -32,19 +32,22 @@
     <h3><?php print $dc_array['dc:description']['label']; ?></h3>
     <p><?php print $dc_array['dc:description']['value']; ?></p>
   </div>
-  <div class="islandora-basic-image-metadata">
+
-    <h4>Details</h4>
+  <fieldset class="collapsible collapsed islandora-basic-image-metadata">
-    <dl class="islandora-basic-image-fields">
+  <legend><span class="fieldset-legend">Extended Details</span></legend>
-      <?php $row_field = 0; ?>
+    <div class="fieldset-wrapper">
-      <?php foreach($dc_array as $key => $value): ?>
+      <dl class="islandora-basic-image-fields">
-        <dt class="<?php print $value['class']; ?><?php print $row_field == 0 ? ' first' : ''; ?>">
+        <?php $row_field = 0; ?>
-          <?php print $value['label']; ?>
+        <?php foreach($dc_array as $key => $value): ?>
-        </dt>
+          <dt class="<?php print $value['class']; ?><?php print $row_field == 0 ? ' first' : ''; ?>">
-        <dd class="<?php print $value['class']; ?><?php print $row_field == 0 ? ' first' : ''; ?>">
+            <?php print $value['label']; ?>
-          <?php print $value['value']; ?>
+          </dt>
-        </dd>
+          <dd class="<?php print $value['class']; ?><?php print $row_field == 0 ? ' first' : ''; ?>">
-        <?php $row_field++; ?>
+            <?php print $value['value']; ?>
-      <?php endforeach; ?>
+          </dd>
-    </dl>
+          <?php $row_field++; ?>
-  </div>
+        <?php endforeach; ?>
-</div>
+      </dl>
+    </div>
+  </fieldset>
+</div>

islandora_basic_image/islandora_basic_image.module

@@ -200,6 +200,8 @@ function islandora_basic_image_islandora_view_object($object, $user, $page_numbe
  *   an array of variables that will be passed to the theme function
  */
 function islandora_basic_image_preprocess_islandora_basic_image(&$variables) {
+  drupal_add_js('misc/form.js');
+  drupal_add_js('misc/collapse.js');
   $islandora_object = $variables['islandora_object'];
   module_load_include('inc', 'islandora', 'includes/islandora_dublin_core');
   try {