IAI-30 adds first redesign changes to project

src/main/resources/META-INF/resources/content/index.xml

@@ -1,40 +1,109 @@
 <?xml version="1.0" encoding="UTF-8"?>
-<MyCoReWebPage><section xml:lang="de" title="Publikationsserver des IAI"><div class="row">
-<div class="col-xs-12">
-<h2 class="iai-first-headline">Willkommen auf den Seiten des Publikationsservers des IAI</h2>
-</div>
 
-<div class="col-xs-12"><img alt="" class="mir-figure img-responsive pull-right" src="../images/figure_repository_IAI.jpg" />
-<h3>Das Publikationsprogramm des IAI</h3>
+<MyCoReWebPage>
+  <section xml:lang="de" title="Publikationsserver des IAI">
+    <div class="row">
+      <div class="col-12">
 
-<p>Das <a href="http://www.iai.spk-berlin.de">Ibero-Amerikanische Institut (IAI)</a> verfügt über ein vielfältiges Publikationsprogramm in deutscher, spanischer, portugiesischer und englischer Sprache, das sich aus mehreren Quellen speist: der institutseigenen Forschungstätigkeit, am IAI durchgeführten Tagungen und Symposien, Kooperationsprojekten mit in- und ausländischen Forschungseinrichtungen sowie hervorragenden Arbeiten einzelner WissenschaftlerInnen (<a href="https://www.iai.spk-berlin.de/fileadmin/dokumentenbibliothek/Veroeffentlichungen/IAI_Publikationsbrosch%C3%BCre_DE_2022_Web.pdf">Download des Publikationsverzeichnisses 2020-2022</a>). Das IAI fördert die Idee des Open Access Publizierens. Auf unserem Publikationsserver stellen wir Ihnen einen großen Teil der seit Gründung des Instituts im Jahr 1930 veröffentlichten Bücher und Zeitschriften zum kostenlosen Download zur Verfügung.</p>
+        <h1>Willkommen</h1>
 
-<h3>Bücher und Working Papers</h3>
+        <h2>Das Publikationsprogramm des IAI</h2>
 
-<p>In den Schriftenreihen <a href="https://www.iai.spk-berlin.de/publikationen/bibliotheca-ibero-americana.html">Bibliotheca Ibero-Americana</a> und <a href="https://www.iai.spk-berlin.de/publikationen/biblioteca-luso-brasileira.html">Biblioteca Luso-Brasileira</a> werden Monographien und Sammelbände zu Literatur und Sprache, Geschichte, Wirtschaft und Politik Lateinamerikas, Spaniens und Portugals publiziert. Die Reihe <a href="https://www.iai.spk-berlin.de/publikationen/estudios-indiana.html">Estudios Indiana</a> (früher "Indiana Beihefte") präsentiert in Monografien und Sammelbänden die Ergebnisse von Forschungen zu den indigenen und multi-ethnischen Gesellschaften und Kulturen Lateinamerikas und der Karibik in Vergangenheit und Gegenwart. <a href="https://www.iai.spk-berlin.de/publikationen/ausser-der-reihe.html">Außerhalb dieser Reihen</a> veröffentlicht das IAI Monographien und Sammelbände in Kooperation mit nationalen und internationalen Partnern sowie mehrere Serien von Working Papers.</p>
+        <p>Das <a href="http://www.iai.spk-berlin.de">Ibero-Amerikanische Institut (IAI)</a> verfügt
+          über ein vielfältiges Publikationsprogramm in deutscher, spanischer, portugiesischer und
+          englischer Sprache, das sich aus mehreren Quellen speist: der institutseigenen
+          Forschungstätigkeit, am IAI durchgeführten Tagungen und Symposien, Kooperationsprojekten
+          mit in- und ausländischen Forschungseinrichtungen sowie hervorragenden Arbeiten einzelner
+          WissenschaftlerInnen (<a
+            href="https://www.iai.spk-berlin.de/fileadmin/dokumentenbibliothek/Veroeffentlichungen/IAI_Publikationsbrosch%C3%BCre_DE_2022_Web.pdf">Download
+          des Publikationsverzeichnisses 2020-2022</a>). Das IAI fördert die Idee des Open Access
+          Publizierens. Auf unserem Publikationsserver stellen wir Ihnen einen großen Teil der seit
+          Gründung des Instituts im Jahr 1930 veröffentlichten Bücher und Zeitschriften zum
+          kostenlosen Download zur Verfügung.</p>
 
-<h3>Zeitschriften</h3>
+        <h2>Bücher und Working Papers</h2>
 
-<p>Die Zeitschrift <a href="https://journals.iai.spk-berlin.de/index.php/iberoamericana">Iberoamericana. América Latina – España – Portugal</a> widmet sich literarischen, historischen und sozialwissenschaftlichen Themen. Die Zeitschrift <a href="https://journals.iai.spk-berlin.de/index.php/indiana">Indiana</a> ist der Erforschung der indigenen Bevölkerung Süd- und Mesoamerikas gewidmet, die <a href="https://www.jstor.org/journal/revintlinibe">Revista Internacional de Lingüística Iberoamericana</a> dem Studium der ibero-romanischen Sprachen. Die Übernahme der in den Zeitschriften des IAI veröffentlichten Beiträgen ins Repositorium ist in Vorbereitung.</p>
-</div>
-</div>
-</section><section xml:lang="en" title="Institutional Repository of IAI"><div class="row">
-<div class="col-xs-12">
-<h2 class="iai-first-headline">Welcome to the Institutional Repository of the Ibero-American Institute</h2>
-</div>
+        <p>In den Schriftenreihen <a
+            href="https://www.iai.spk-berlin.de/publikationen/bibliotheca-ibero-americana.html">Bibliotheca
+          Ibero-Americana</a> und <a
+            href="https://www.iai.spk-berlin.de/publikationen/biblioteca-luso-brasileira.html">Biblioteca
+          Luso-Brasileira</a> werden Monographien und Sammelbände zu Literatur und Sprache,
+          Geschichte, Wirtschaft und Politik Lateinamerikas, Spaniens und Portugals publiziert. Die
+          Reihe <a href="https://www.iai.spk-berlin.de/publikationen/estudios-indiana.html">Estudios
+          Indiana</a> (früher "Indiana Beihefte") präsentiert in Monografien und Sammelbänden die
+          Ergebnisse von Forschungen zu den indigenen und multi-ethnischen Gesellschaften und
+          Kulturen Lateinamerikas und der Karibik in Vergangenheit und Gegenwart. <a
+            href="https://www.iai.spk-berlin.de/publikationen/ausser-der-reihe.html">Außerhalb
+          dieser Reihen</a> veröffentlicht das IAI Monographien und Sammelbände in Kooperation mit
+          nationalen und internationalen Partnern sowie mehrere Serien von Working Papers.</p>
 
-<div class="col-xs-12"><img alt="" class="mir-figure img-responsive pull-right" src="../images/figure_repository_IAI.jpg" />
-<h3>IAI Publications</h3>
+        <h2>Zeitschriften</h2>
 
-<p>The <a href="http://www.iai.spk-berlin.de/en">Ibero-American Institute (IAI)</a> publishes a diverse range of books and journals in German, Spanish, Portuguese and English. These publications draw on a variety of sources: the institute's research activities, conferences and symposia; its cooperative projects with research institutes in Germany and abroad; and the outstanding work of individual scholars (<a href="https://www.iai.spk-berlin.de/fileadmin/dokumentenbibliothek/Veroeffentlichungen/IAI_Publikationsbrosch%C3%BCre_ES_2022_Web.pdf">download the inventory of publications 2020-2022 in spanish</a>). The IAI promotes the concept of Open Access and makes available via the Internet as many of its publications as possible in full text. This is realized with our <a href="http://publications.iai.spk-berlin.de/content/main/index.xml?lang=en">Institutional Repository</a>.</p>
+        <p>Die Zeitschrift <a href="https://journals.iai.spk-berlin.de/index.php/iberoamericana">Iberoamericana.
+          América Latina – España – Portugal</a> widmet sich literarischen, historischen und
+          sozialwissenschaftlichen Themen. Die Zeitschrift <a
+            href="https://journals.iai.spk-berlin.de/index.php/indiana">Indiana</a> ist der
+          Erforschung der indigenen Bevölkerung Süd- und Mesoamerikas gewidmet, die <a
+            href="https://www.jstor.org/journal/revintlinibe">Revista Internacional de Lingüística
+          Iberoamericana</a> dem Studium der ibero-romanischen Sprachen. Die Übernahme der in den
+          Zeitschriften des IAI veröffentlichten Beiträgen ins Repositorium ist in Vorbereitung.</p>
+      </div>
+    </div>
+  </section>
 
-<h3>Books and Working Papers</h3>
+  <section xml:lang="en" title="Institutional Repository of IAI">
+    <div class="row">
+      <div class="col-12">
 
-<p>The <a href="https://www.iai.spk-berlin.de/en/publications/bibliotheca-ibero-americana.html">Bibliotheca Ibero-Americana</a> and <a href="https://www.iai.spk-berlin.de/en/publications/biblioteca-luso-brasileira.html">Biblioteca Luso-Brasileira</a> series feature monographs and collections on the literature, language, history, economies and politics of Latin America, Spain and Portugal. The monographs and essay collections in the <a href="https://www.iai.spk-berlin.de/en/publications/estudios-indiana.html">Estudios Indiana</a> series (previously called "Indiana Beihefte") present the results of research into the indigenous and multiethnic societies and cultures of Latin America and the Caribbean, both past and present. In addition to these series, the IAI publishes <a href="https://www.iai.spk-berlin.de/en/publications/additional-publications.html">monographs and collections</a> in cooperation with national and international partners as well as several series of working papers.</p>
+        <h1 class="iai-first-headline">Welcome</h1>
 
-<h3>Journals</h3>
+        <h2>IAI Publications</h2>
 
-<p>The journal <a href="https://journals.iai.spk-berlin.de/index.php/iberoamericana">Iberoamericana: América Latina – España – Portugal</a> is dedicated to literary, historical and social topics. <a href="https://journals.iai.spk-berlin.de/index.php/indiana">Indiana</a> presents research on the indigenous populations of South America and Mesoamerica, while the <a href="https://www.jstor.org/journal/revintlinibe">Revista Internacional de Lingüística Iberoamericana</a> contains studies on Ibero-American languages. The integration of articles published in IAI journals into the <a href="http://publications.iai.spk-berlin.de/content/main/index.xml?lang=en">Institutional Repository</a> is in preparation.</p>
-</div>
-</div>
-</section><meta><log lastEditor="p.schulze" date="2020-10-13" time="10:14" /></meta></MyCoReWebPage>
+        <p>The <a href="http://www.iai.spk-berlin.de/en">Ibero-American Institute (IAI)</a>
+          publishes a diverse range of books and journals in German, Spanish, Portuguese and
+          English. These publications draw on a variety of sources: the institute's research
+          activities, conferences and symposia; its cooperative projects with research institutes in
+          Germany and abroad; and the outstanding work of individual scholars (<a
+            href="https://www.iai.spk-berlin.de/fileadmin/dokumentenbibliothek/Veroeffentlichungen/IAI_Publikationsbrosch%C3%BCre_ES_2022_Web.pdf">download
+          the inventory of publications 2020-2022 in spanish</a>). The IAI promotes the concept of
+          Open Access and makes available via the Internet as many of its publications as possible
+          in full text. This is realized with our <a
+            href="http://publications.iai.spk-berlin.de/content/main/index.xml?lang=en">Institutional
+          Repository</a>.</p>
+
+        <h2>Books and Working Papers</h2>
+
+        <p>The <a
+            href="https://www.iai.spk-berlin.de/en/publications/bibliotheca-ibero-americana.html">Bibliotheca
+          Ibero-Americana</a> and <a
+            href="https://www.iai.spk-berlin.de/en/publications/biblioteca-luso-brasileira.html">Biblioteca
+          Luso-Brasileira</a> series feature monographs and collections on the literature, language,
+          history, economies and politics of Latin America, Spain and Portugal. The monographs and
+          essay collections in the <a
+            href="https://www.iai.spk-berlin.de/en/publications/estudios-indiana.html">Estudios
+          Indiana</a> series (previously called "Indiana Beihefte") present the results of research
+          into the indigenous and multiethnic societies and cultures of Latin America and the
+          Caribbean, both past and present. In addition to these series, the IAI publishes <a
+            href="https://www.iai.spk-berlin.de/en/publications/additional-publications.html">monographs
+          and collections</a> in cooperation with national and international partners as well as
+          several series of working papers.</p>
+
+        <h2>Journals</h2>
+
+        <p>The journal <a href="https://journals.iai.spk-berlin.de/index.php/iberoamericana">Iberoamericana:
+          América Latina – España – Portugal</a> is dedicated to literary, historical and social
+          topics. <a href="https://journals.iai.spk-berlin.de/index.php/indiana">Indiana</a>
+          presents research on the indigenous populations of South America and Mesoamerica, while
+          the <a href="https://www.jstor.org/journal/revintlinibe">Revista Internacional de
+          Lingüística Iberoamericana</a> contains studies on Ibero-American languages. The
+          integration of articles published in IAI journals into the <a
+            href="http://publications.iai.spk-berlin.de/content/main/index.xml?lang=en">Institutional
+          Repository</a> is in preparation.</p>
+      </div>
+
+    </div>
+  </section>
+  <meta>
+    <log lastEditor="p.schulze" date="2020-10-13" time="10:14" />
+  </meta>
+</MyCoReWebPage>

src/main/resources/META-INF/resources/js/project.js

@@ -17,6 +17,16 @@ $(document).ready(function() {
     return true;
   });
 
+  // open search bar
+  $( ".js-search-toggler" ).click(function() {
+    if ( $( ".search-bar" ).hasClass('open') ) {
+      $( ".search-bar" ).removeClass('open');
+    } else {
+      $( ".search-bar" ).addClass('open');
+      $( "#searchbar" ).focus();
+    }
+  });
+
   // replace placeholder USERNAME with username
   var userID = $("#currentUser strong").html();
   var newHref = 'https://reposis-test.gbv.de/PROJECT/servlets/solr/select?q=createdby:' + userID + '&fq=objectType:mods';

src/main/resources/META-INF/resources/mir-layout/scss/project_styles/_footer.scss

@@ -6,6 +6,41 @@
 // set the defaults for all responsive levels here
 // no (xl) media query necessary (desktop first)
 
+  .flatmir-footer {
+    color: white;
+    background-color: $iai-blue;
+    .container {
+      padding-top: 1.2rem;
+      padding-bottom: 1.4rem;
+    }
+    &__bottom {
+      border-top: 1px solid white;
+    }
+  }
+
+  .footer-logo {
+    text-align: right;
+    img {
+      width: 318px;
+    }
+  }
+
+  .footer-nav {
+    li:first-child a {
+      padding-left: 0;
+    }
+  }
+  .social-nav {
+    display: flex;
+    justify-content: flex-end;
+    .fa-stack {
+      margin-right: 30px;
+    }
+    li:last-child .fa-stack {
+      margin-right: 0;
+    }
+
+  }
 
 // Large devices (desktops) and below: <= 1200px
 @include media-breakpoint-down(lg) {

src/main/resources/META-INF/resources/mir-layout/scss/project_styles/_header.scss

@@ -7,6 +7,111 @@
 // no (xl) media query necessary (desktop first)
 
 // logo and menu container
+  html > body > header {
+    min-width: 320px;
+    background-color: white;
+  }
+
+  .header_box {
+    display: flex;
+    justify-content: space-between;
+    padding: 1rem 0;
+    position: relative;
+    .project_logo_box {
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      a {
+        display: block;
+      }
+      img {
+        margin: 0;
+        width: 216px;
+      }
+    }
+    .project_nav_box {
+      display: flex;
+      justify-content: flex-end;
+      align-items: center;
+      flex-wrap: wrap;
+      gap: 1.5rem 0;
+      .mir-prop-nav {
+        flex-basis: 100%;
+        display: flex;
+        justify-content: flex-end;
+      }
+      .project-main-nav {
+        flex-basis: 100%;
+        display: flex;
+        justify-content: flex-end;
+        .navbar {
+          padding: 0;
+        }
+      }
+    }
+  }
+
+  .search-toggler {
+    padding: .5rem 1rem;
+    cursor: pointer;
+    border: 2px solid transparent;
+  }
+
+  .search-bar {
+    display: none;
+    position: absolute;
+    width: 100%;
+    &__form {
+      background-color: $iai-lightyellow;
+      padding: 1rem;
+    }
+    &__input {
+      width: 100%;
+      display: flex;
+      justify-content: center;
+      input {
+        flex: 1 1 auto;
+      }
+    }
+    &.open {
+      display: block;
+    }
+  }
+
+  .page-position {
+    height: 20vh;
+    background-image: url('../../../../images/figure_repository_IAI.jpg');
+    background-size: cover;
+    display: flex;
+    flex-direction: column;
+    justify-content: end;
+    &__title-box {
+      display: flex;
+    }
+    &__title {
+      flex: 0 0 auto;
+      background-color: white;
+      padding: 1rem 3rem 1rem 0;
+      position: relative;
+      font-size: 1rem;
+      &::before {
+        content: "IAI";
+        display: block;
+        position: absolute;
+        width: 200px;
+        left: -500px;
+        background-color: white;
+        bottom: 0;
+        z-index: 100;
+        color: #fff0;
+        width: 500px;
+        padding: 1rem 0;
+      }
+    }
+  }
+
+
+
 
 
 // Large devices (desktops) and below: <= 1200px

src/main/resources/META-INF/resources/mir-layout/scss/project_styles/_layout.scss

@@ -6,6 +6,11 @@
 // set the defaults for all responsive levels here
 // no (xl) media query necessary (desktop first)
 
+  #page {
+    padding-top: 5.5rem;
+    padding-bottom: 3rem;
+  }
+
 // Large devices (desktops) and below: <= 1200px
 @include media-breakpoint-down(lg) {
   // add/overwrite styles for responsive level lg and lower

src/main/resources/META-INF/resources/mir-layout/scss/project_styles/_navigation.scss

@@ -6,6 +6,74 @@
 // set the defaults for all responsive levels here
 // no (xl) media query necessary (desktop first)
 
+  .mir-prop-nav .navbar-nav > li {
+    & > a {
+      color: black;
+      font-size: 1rem;
+      text-transform: uppercase;
+      padding: .25rem 1rem;
+      &:hover,
+      &:focus {
+        text-decoration: underline;
+      }
+    }
+  }
+
+  .mir-main-nav {
+    .nav-link {
+      font-size: 1.25rem;
+      color: black;
+      font-weight: 700;
+      &:hover,
+      &:focus {
+        text-decoration: underline;
+      }
+    }
+  }
+
+  /* replace carret by chevron for all drop downs */
+  .dropdown-toggle::after {
+    display: inline-block;
+    margin-left: .375rem;
+    vertical-align: top;
+    content: "\f078";
+    font-weight: 900;
+    font-family: "Font Awesome 5 Free";
+    border: none;
+    font-size: 80%;
+  }
+
+  .dropdown-menu {
+    box-shadow: rgba(0, 0, 0, 0.24) 1px 2px 6px 0px;
+    .dropdown-item {
+      &:hover,
+      &:focus {
+        text-decoration: underline;
+      }
+    }
+  }
+
+  .nav-link {
+    border: 2px solid transparent;
+  }
+  .dropdown {
+    &.show {
+      .dropdown-toggle {
+        border: 2px solid $iai-blue;
+      }
+    }
+  }
+
+  .footer-nav {
+    a {
+      &:hover,
+      &:focus {
+        color: white;
+        text-decoration: underline;
+      }
+    }
+  }
+
 
 // Large devices (desktops) and below: <= 1200px
 @include media-breakpoint-down(lg) {