Fix search and event covers CSS

themes/academic/assets/scss/ansol.scss

@@ -178,11 +178,11 @@ nav.main .nav-search:hover {
 .events-list li {
   min-width: 300px;
   display: grid;
-  grid-template-areas: "img headline" "img subheader";
+  grid-template-areas: "img text";
   justify-content: left;
   background-color: white;
-  padding: 20px;
   width: calc(50% - 50px);
+  column-gap: 1rem;
 }
 
 .events-list.events-list-full-width li {
@@ -190,19 +190,17 @@ nav.main .nav-search:hover {
 }
 
 .events-list .event-cover {
-  margin-top: -20px;
-  margin-left: -20px;
-  margin-bottom: -20px;
-  margin-right: 15px;
   width: 90px;
   height: 90px;
   object-fit: cover;
+  display: block;
+  background-color: white;
 }
 
-.events-list .img { grid-area: img; margin-right: 10px; }
-.events-list .headline { grid-area: headline; }
-.events-list .date { grid-area: date; }
-.events-list .subheader { grid-area: subheader; font-size: 0.8rem; margin-top: 10px; }
+.events-list .img { grid-area: img; }
+.events-list .text { grid-area: text; margin-top: 5px; }
+.events-list .date { }
+.events-list .subheader { font-size: 0.8rem; margin-top: 10px; }
 
 .events-list .title { font-size: 1.25rem; }
 
@@ -275,11 +273,11 @@ p { margin: 0px; }
 .news-section { background-color: #f7f7f7; }
 .events-section { background-color: #f7f7f7; }
 
-section h2 {
+main section h2 {
   position: relative;
 }
 
-section h2::before {
+main section h2::before {
   content: "";
   background-size: 40px 40px;
   width: 40px;
@@ -293,11 +291,11 @@ section h2::before {
 .campaigns-section h2::before { background-image: var(--campaigns-icon); }
 .events-section h2::before { background-image: var(--events-icon); }
 
-section {
+main section {
   padding: 40px 0px;
 }
 
-section.news-section { margin-top: 20px; }
+main section.news-section { margin-top: 20px; }
 
 .about { margin-top: 40px; max-width: 660px; }
 
@@ -328,7 +326,13 @@ article.article h1 {
   line-height: 2.5rem;
 }
 
+/* Search */
+
 .searching .search-results { display: block; }
+.searching nav.main { display: none; }
+.searching main { display: none; }
+.searching footer { display: none; }
+
 .search-results { display: none; }
 
 .search-results {
@@ -339,5 +343,27 @@ article.article h1 {
   right: 0;
   overflow: scroll;
   background-color: white;
+  padding: 20px;
 }
 
+.search-results h1 {
+  font-size: 2.25rem;
+  font-weight: 300;
+  line-height: 2.5rem;
+}
+
+.search-results h3 {
+  font-size: 1.5rem;
+  font-weight: 300;
+}
+
+.search-results .search-hit {
+  padding: 20px 0px;
+}
+
+.search-results .search-hit-description {
+  margin-top: 10px;
+}
+
+.search-results .search-title { display: flex; align-items: center; justify-content: space-between; }
+.search-results .search-close { font-size: 1.5rem; }

themes/academic/layouts/eventos/list.html

@@ -13,30 +13,32 @@
         {{ end }}
         <img class='event-cover' src="{{ $cover.Permalink }}" />
       </a>
-      <p class="headline">
-        <a class="title" href="{{ .Permalink }}">{{ .Title }}</a>
-      </p>
-      <p class="subheader">
-        <span class="date">
-          {{ with .Params.metadata.event.date }}
-            {{ if eq (time.Format "2 January 2006" .start) (time.Format "2 January 2006" .finish) }}
-              {{ if eq (time.Format "15:04" .start) (time.Format "15:04" .finish) }}
-                {{ time.Format "2 de January de 2006" .start }}
+      <div class="text">
+        <p class="headline">
+          <a class="title" href="{{ .Permalink }}">{{ .Title }}</a>
+        </p>
+        <p class="subheader">
+          <span class="date">
+            {{ with .Params.metadata.event.date }}
+              {{ if eq (time.Format "2 January 2006" .start) (time.Format "2 January 2006" .finish) }}
+                {{ if eq (time.Format "15:04" .start) (time.Format "15:04" .finish) }}
+                  {{ time.Format "2 de January de 2006" .start }}
+                {{ else }}
+                  {{ time.Format "2 de January de 2006" .start }} das
+                  {{ time.Format "15:04" .start }} às
+                  {{ time.Format "15:04" .finish }}
+                {{ end }}
+              {{ else if eq (time.Format "January 2006" .start) (time.Format "January 2006" .finish) }}
+                De {{ time.Format "2" .start }} a {{ time.Format "2 de January de 2006" .finish }}
               {{ else }}
-                {{ time.Format "2 de January de 2006" .start }} das
-                {{ time.Format "15:04" .start }} às
-                {{ time.Format "15:04" .finish }}
+                De {{ time.Format "2 de January de 2006" .start }} a {{ time.Format "2 de January de 2006" .finish }}
               {{ end }}
-            {{ else if eq (time.Format "January 2006" .start) (time.Format "January 2006" .finish) }}
-              De {{ time.Format "2" .start }} a {{ time.Format "2 de January de 2006" .finish }}
-            {{ else }}
-              De {{ time.Format "2 de January de 2006" .start }} a {{ time.Format "2 de January de 2006" .finish }}
             {{ end }}
-          {{ end }}
-        </span>
-        &mdash;
-        <span class='location'>{{ .Params.metadata.event.location }}</span>
-      </p>
+          </span>
+          &mdash;
+          <span class='location'>{{ .Params.metadata.event.location }}</span>
+        </p>
+      </div>
     </li>
   {{ end }}
 

themes/academic/layouts/index.html

@@ -43,7 +43,7 @@
         {{ end }}
       </ul>
       <p class="see-more body-width">
-        <a href="{{ (site.GetPage "Section" "post").Permalink }}">Ver mais notícias</a>
+        <a href="{{ (site.GetPage "noticias").Permalink }}">Ver mais notícias</a>
       </p>
     </section>
 
@@ -80,30 +80,32 @@
               <img class='event-cover' src="{{ .Permalink }}" />
             {{ end }}
           </a>
-          <p class="headline">
-            <a class="title" href="{{ .Permalink }}">{{ .Title }}</a>
-          </p>
-          <p class="subheader">
-            <span class="date">
-              {{ with .Params.metadata.event.date }}
-                {{ if eq (time.Format "2 January 2006" .start) (time.Format "2 January 2006" .finish) }}
-                  {{ if eq (time.Format "15:04" .start) (time.Format "15:04" .finish) }}
-                    {{ time.Format "2 de January de 2006" .start }}
+          <div class="text">
+            <p class="headline">
+              <a class="title" href="{{ .Permalink }}">{{ .Title }}</a>
+            </p>
+            <p class="subheader">
+              <span class="date">
+                {{ with .Params.metadata.event.date }}
+                  {{ if eq (time.Format "2 January 2006" .start) (time.Format "2 January 2006" .finish) }}
+                    {{ if eq (time.Format "15:04" .start) (time.Format "15:04" .finish) }}
+                      {{ time.Format "2 de January de 2006" .start }}
+                    {{ else }}
+                      {{ time.Format "2 de January de 2006" .start }} das
+                      {{ time.Format "15:04" .start }} às
+                      {{ time.Format "15:04" .finish }}
+                    {{ end }}
+                  {{ else if eq (time.Format "January 2006" .start) (time.Format "January 2006" .finish) }}
+                    De {{ time.Format "2" .start }} a {{ time.Format "2 de January de 2006" .finish }}
                   {{ else }}
-                    {{ time.Format "2 de January de 2006" .start }} das
-                    {{ time.Format "15:04" .start }} às
-                    {{ time.Format "15:04" .finish }}
+                    De {{ time.Format "2 de January de 2006" .start }} a {{ time.Format "2 de January de 2006" .finish }}
                   {{ end }}
-                {{ else if eq (time.Format "January 2006" .start) (time.Format "January 2006" .finish) }}
-                  De {{ time.Format "2" .start }} a {{ time.Format "2 de January de 2006" .finish }}
-                {{ else }}
-                  De {{ time.Format "2 de January de 2006" .start }} a {{ time.Format "2 de January de 2006" .finish }}
                 {{ end }}
-              {{ end }}
-            </span>
-            &mdash;
-            <span class='location'>{{ .Params.metadata.event.location }}</span>
-          </p>
+              </span>
+              &mdash;
+              <span class='location'>{{ .Params.metadata.event.location }}</span>
+            </p>
+          </div>
         </li>
         {{ end }}
       </ul>

themes/academic/layouts/partials/search.html

@@ -2,22 +2,20 @@
       <div class="container">
         <section class="search-header">
 
-          <div class="row no-gutters justify-content-between mb-3">
-            <div class="col-6">
-              <h1>{{ i18n "search" }}</h1>
-            </div>
-            <div class="col-6 col-search-close">
-              <a class="js-search" href="#" onclick="document.querySelector('body').classList.toggle('searching'); return false;">Fechar</a>
-            </div>
+          <div class="search-title">
+            <h1>{{ i18n "search" }}</h1>
+            <a class="search-close" href="#" onclick="document.querySelector('body').classList.toggle('searching'); return false;">Fechar</a>
           </div>
 
           <div id="search-box">
-            {{ if eq site.Params.search.engine 1 }}
-            <input name="q" id="search-query" placeholder="{{i18n "search_placeholder"}}" autocapitalize="off"
-            autocomplete="off" autocorrect="off" spellcheck="false" type="search">
-            {{ else }}
-            <!-- Search box will appear here -->
-            {{ end }}
+            <input
+                name="q" id="search-query"
+                placeholder="{{i18n "search_placeholder"}}"
+                autocapitalize="off"
+                autocomplete="off"
+                autocorrect="off"
+                spellcheck="false" type="search"
+            >
           </div>
 
         </section>