mirror of https://github.com/lxndrblz/anatole.git
parent: 5e10a207 | patch | commit | ignore whitespace
alexanderdavide
10.37.2022 8f27e4fee2bff7201667fb3c90da657755c92c34 
refactor: sidebar
1 files deleted
6 files modified
309 ■■■■■ changed files
assets/css/style.css 12 ●●●●● patch | view | raw | blame | history
assets/scss/main.scss 1 ●●●●● patch | view | raw | blame | history
assets/scss/partials/components/_sidebar.scss 63 ●●●●● patch | view | raw | blame | history
assets/scss/partials/layout/_main.scss 3 ●●●●● patch | view | raw | blame | history
layouts/_default/baseof.html 12 ●●●●● patch | view | raw | blame | history
layouts/index.html 174 ●●●●● patch | view | raw | blame | history
layouts/partials/sidebar.html 44 ●●●●● patch | view | raw | blame | history 
 assets/css/style.css


@@ -742,10 +742,10 @@


}


*/


/* share */




/* 


.read_more {


  font-size: 1.4rem;


}


} */




/*


#fb_comments_container {


@@ -869,7 +869,7 @@


*/




/* Menu */


.menu {


/* .menu {


  float: right;


  padding-top: 30px;


}


@@ -925,7 +925,7 @@


  visibility: hidden;


  width: 100px;


  float: right;


}


} */


/*


.page_404 {


  text-align: center;


@@ -1090,9 +1090,9 @@


}




@media screen and (max-width: 960px) {


  aside {


  /* aside {


    width: 100%;


  }


  } */




  .sidebar {


    width: 100%;




 assets/scss/main.scss


@@ -6,7 +6,6 @@


@import './partials/layout/body';


@import './partials/layout/header';


@import './partials/layout/nav';


@import './partials/layout/main';


@import './partials/components/animated';


@import './partials/components/category';


@import './partials/components/tag';




 assets/scss/partials/components/_sidebar.scss


@@ -2,10 +2,39 @@


  -webkit-background-size: cover;


  background-size: cover;


  background-color: var(--bg-color);


  height: 100%;


  left: 0;


  z-index: 4;


  border-right: 1px solid var(--border-color);




  @media screen and (min-width: 961px), print {


    border-right: 1px solid $primary-lighter;


    z-index: 3;


    height: 100vh;


    position: fixed;


    width: $sidebar-width;


    display: flex;


    flex-direction: column;


  }




  @include widescreen {


    padding-left: 17%;


    padding-right: 3%;


    width: calc(var(--sidebar-width) - 20%);


  }




  &-wrapper {


    width: 100%;




    @media screen and (min-width: 961px), print {


      width: $sidebar-width;


    }


  }




  &__content {


    @media screen and (min-width: 961px), print {


      display: flex;


      flex-direction: column;


      flex-grow: 1;


      justify-content: center;


    }


  }




  &__list {


    list-style: none;


@@ -53,30 +82,4 @@


      margin: 1em;


    }


  }






}




@media screen and (min-width: 961px), print {


  .sidebar {


    height: 100vh;


    display: flex;


    flex-direction: column;


    position: fixed;


    width: $sidebar-width;


    &__content {


      display: flex;


      flex-direction: column;


      justify-content: center;


      flex-grow: 1;


    }


  }


}




@media (min-width: 1921px) {


  .sidebar {


    padding-left: 17%;


    padding-right: 3%;


    width: calc(var(--sidebar-width) - 20%);


  }


}




 assets/scss/partials/layout/_main.scss


File was deleted




 layouts/_default/baseof.html


@@ -9,16 +9,8 @@


  <body class="body">


    <header class="header">{{ partial "navbar.html" . }}</header>


    <div class="wrapper">


      <aside class="aside">


        {{- partial "sidebar.html" . -}}


      </aside>


      <main class="main">


        <div class="autopagerize_page_element">


          <div class="content">


            {{- block "main" . }}{{- end }}


          </div>


        </div>


      </main>


      {{- partial "sidebar.html" . -}}


      {{- block "main" . }}{{- end }}


    </div>




    {{- partial "footer.html" (dict "context" . "footerClassModifier" "base") -}}




 layouts/index.html


@@ -1,26 +1,5 @@


{{ define "main" }}


  <div


    class="post {{ with .Site.Params.doNotLoadAnimations }}


      .




    {{ else }}


      animated fadeInDown




    {{ end }}"


  >


    <div class="post-title post-content">


      {{ .Content }}


    </div>




    <!-- (Optional) Home


            -- on top of `mainSections` content (aka posts) ;


            -- as declared in content/_index.md




            One can set `mainSections = [""]` and have the content/_index.md specified here


        -->


  </div>




  {{ if .Params.mainSectionsTitle }}


  <main class="post-wrapper">


    <div


      class="post {{ with .Site.Params.doNotLoadAnimations }}


        .


@@ -31,90 +10,113 @@


      {{ end }}"


    >


      <div class="post-title post-content">


        <h2>{{ .Params.mainSectionsTitle }}</h2>


        {{ .Content }}


      </div>




      <!-- (Optional) Home


            -- on top of `mainSections` content (aka posts) ;


            -- as declared in content/_index.md




            One can set `mainSections = [""]` and have the content/_index.md specified here


        -->


    </div>




  {{ end }}


    {{ if .Params.mainSectionsTitle }}


      <div


        class="post {{ with .Site.Params.doNotLoadAnimations }}


          .




  {{ $paginator := .Paginate (where .Site.RegularPages "Type" "in" .Site.Params.mainSections) }}


  {{ range $paginator.Pages }}


    <div


      class="post {{ with .Site.Params.doNotLoadAnimations }}


        .


        {{ else }}


          animated fadeInDown




      {{ else }}


        animated fadeInDown




      {{ end }}"


    >


      {{ if .Params.thumbnail }}


        <div class="post-thumbnail">


          <a href="{{ .RelPermalink }}">


            <img src="{{ .Params.thumbnail | relURL }}" alt="Thumbnail image" loading="lazy" />


          </a>


        </div>




      {{ end }}


      <div class="post-title">


        <h3><a href="{{ .RelPermalink }}">{{ .Title }}</a></h3>


      </div>


      <div class="post-content">


        <div class="p_part">


          <p>


            {{ if .Site.Params.fullPostContent }}


              {{ .Content }}






            {{ else }}


              {{ .Summary }}






            {{ end }}


          </p>


          <!-- add read more -->


          {{- if and (.Truncated) (.Site.Params.readMore) -}}


            <a href="{{ .RelPermalink }}" class="read_more">{{ i18n "read_more" }}</a>




          {{- end -}}


        {{ end }}"


      >


        <div class="post-title post-content">


          <h2>{{ .Params.mainSectionsTitle }}</h2>


        </div>


      </div>




      <!--  -->


      <div class="post-footer">


        <div class="meta">


          <div class="info">


            <em class="fas fa-calendar-day"></em>


            <span class="date"


              >{{ if isset .Site.Params "indexdateformat" }}


                {{ .Date.Format .Site.Params.indexDateFormat }}


    {{ end }}




    {{ $paginator := .Paginate (where .Site.RegularPages "Type" "in" .Site.Params.mainSections) }}


    {{ range $paginator.Pages }}


      <div


        class="post {{ with .Site.Params.doNotLoadAnimations }}


          .




        {{ else }}


          animated fadeInDown




        {{ end }}"


      >


        {{ if .Params.thumbnail }}


          <div class="post-thumbnail">


            <a href="{{ .RelPermalink }}">


              <img src="{{ .Params.thumbnail | relURL }}" alt="Thumbnail image" loading="lazy" />


            </a>


          </div>




        {{ end }}


        <div class="post-title">


          <h3><a href="{{ .RelPermalink }}">{{ .Title }}</a></h3>


        </div>


        <div class="post-content">


          <div class="p_part">


            <p>


              {{ if .Site.Params.fullPostContent }}


                {{ .Content }}






              {{ else }}


                {{ .Date.Format "Mon, Jan 2, 2006" }}


                {{ .Summary }}






              {{ end }}</span


            >


            {{ with .Page.Params.Categories }}


              {{ partial "taxonomy/categories.html" . }}


              {{ end }}


            </p>


            <!-- add read more -->


            {{- if and (.Truncated) (.Site.Params.readMore) -}}


              <a href="{{ .RelPermalink }}" class="post__more">{{ i18n "read_more" }}</a>




            {{- end -}}


          </div>


        </div>




        <!--  -->


        <div class="post-footer">


          <div class="meta">


            <div class="info">


              <em class="fas fa-calendar-day"></em>


              <span class="date"


                >{{ if isset .Site.Params "indexdateformat" }}


                  {{ .Date.Format .Site.Params.indexDateFormat }}






            {{ end }}




            {{ with .Page.Params.Tags }}


              {{ partial "taxonomy/tags.html" . }}


                {{ else }}


                  {{ .Date.Format "Mon, Jan 2, 2006" }}






            {{ end }}


                {{ end }}</span


              >


              {{ with .Page.Params.Categories }}


                {{ partial "taxonomy/categories.html" . }}






              {{ end }}




              {{ with .Page.Params.Tags }}


                {{ partial "taxonomy/tags.html" . }}






              {{ end }}


            </div>


          </div>


        </div>


      </div>


    </div>




  {{ end }}


  <div class="pagination">


    {{ template "partials/pagination.html" . }}


  </div>


    {{ end }}


    <div class="pagination">


      {{ template "partials/pagination.html" . }}


    </div>


  </main>




{{ end }}




 layouts/partials/sidebar.html


@@ -1,30 +1,32 @@


<div


  class="sidebar{{ with .Site.Params.doNotLoadAnimations }}


    .


<aside class="sidebar-wrapper">


  <div


    class="sidebar{{ with .Site.Params.doNotLoadAnimations }}


      .




  {{ else }}


    animated fadeInDown


    {{ else }}


      animated fadeInDown




  {{ end }}"


>


  <div class="sidebar__content">


    <div class="sidebar__title">


    {{ end }}"


  >


    <div class="sidebar__content">


      <div class="sidebar__title">


        <img src="{{ .Site.Params.profilePicture | relURL }}" alt="profile picture" />


        <h3 title=""><a href="{{ .Site.BaseURL | relLangURL }}">{{ .Site.Params.Title }}</a></h3>


        <div class="sidebar__title-description">


          <p>{{ replace .Site.Params.description "\n" "<br />" | safeHTML }}</p>


        </div>


    </div>


    <ul class="sidebar__list">


      {{ range $item := .Site.Params.socialIcons }}


        <li class="sidebar__list-item">


          <a href="{{ $item.url }}" rel="me" aria-label="{{ $item.title }}" title="{{ $item.title }}">


            <i class="{{ $item.icon }} fa-2x" aria-hidden="true"></i>


          </a>


        </li>


      </div>


      <ul class="sidebar__list">


        {{ range $item := .Site.Params.socialIcons }}


          <li class="sidebar__list-item">


            <a href="{{ $item.url }}" rel="me" aria-label="{{ $item.title }}" title="{{ $item.title }}">


              <i class="{{ $item.icon }} fa-2x" aria-hidden="true"></i>


            </a>


          </li>




      {{ end }}


    </ul>


        {{ end }}


      </ul>


    </div>


    {{- partial "footer.html" (dict "context" . "footerClassModifier" "sidebar") -}}


  </div>


  {{- partial "footer.html" (dict "context" . "footerClassModifier" "sidebar") -}}


</div>


</aside>