app_filtre.css

app_filtre.css

/* Script permettant de filtrer par année */
/* Source : https://platinumdogs.me/2014/07/15/dynamically-filtering-sharepoint-list-views-using-javascript/ */

/* CLEARFIX */
.cdtm-wrapper .row:before,
.cdtm-wrapper .row:after {
   content: "";
   display: table;
}

.cdtm-wrapper .row:after {
   clear: both;
}

.cdtm-wrapper .row {
   zoom: 1; /* For IE 6/7 (trigger hasLayout) */
}

   .cdtm-wrapper .row .left {
      float: left;
   }

   .cdtm-wrapper .row .right {
      float: left;
   }

/* LAYOUT */
.cdtm {
   display: inline-block;
   width: 100%;
}

.cdtm-wrapper {
   font-family: 'Open Sans',Calibri,Verdana,Arial,'Sans Serif';
   width: 100%;
   font-size: 12px;
}

   /* PADDING/MARGINS */

   .cdtm-wrapper > .box-5 {
      padding: 5px 10px 10px 0;
   }

   .cdtm-wrapper .header {
      margin: 0;
      padding: 0;
   }

   .cdtm-wrapper .nav {
      margin: 0;
      padding: 0;
   }

   .cdtm-wrapper article {
      margin: 0;
      padding: 0;
   }

   /* HEADER & NAVIGATION */

   .cdtm-wrapper .header h1, .cdtm-wrapper .header h2, .cdtm-wrapper .header h3, .cdtm-wrapper .header h4, .cdtm-wrapper .header h5 {
      color: #415A6C;
      margin: 0 0 8px 0;
      padding: 0;
      font-size: 18pt;
      line-height: 18pt;
      font-weight: 700;
   }

   .cdtm-wrapper .header h2 {
      font-size: 16pt;
   }

   .cdtm-wrapper .header h3 {
      font-size: 14pt;
   }

   .cdtm-wrapper .header h4 {
      font-size: 12pt;
   }

   .cdtm-wrapper .header h5 {
      font-size: 12pt;
   }

   .cdtm-wrapper .header h1 *[class^='icon-'] {
      font-size: 20px;
      line-height: 20px;
   }

   .cdtm-wrapper .nav .left {
      display: inline-block;
      width: 60%;
      min-width: 290px;
      max-width: 410px;
   }

   .cdtm-wrapper .nav .right {
      display: inline-block;
      width: 40%;
      max-width: 250px;
   }

   .cdtm-wrapper .nav ul {
      list-style: none outside none;
      margin: 0 0 5px;
      padding: 0;
   }

      .cdtm-wrapper .nav ul.years {
         font-size: 1.5em;
      }

      .cdtm-wrapper .nav ul.months {
         font-size: 1.2em;
      }

   .cdtm-wrapper .nav li {
      display: inline-block;
      margin: 0;
      padding: 0;
   }

      .cdtm-wrapper .nav li a, .cdtm-wrapper .nav li a:link {
         color: #E24912;
         display: inline-block;
         padding: 2px 3px;
         margin-right: 2px;
      }

         .cdtm-wrapper .nav li a:hover {
            color: #002596;
            cursor: pointer;

            background-color: rgb(0,180,240);
              -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* IE 8/9 */
              filter: alpha(opacity=50);  /* IE 5.5 - 7 */  

            background-color: rgba(0,180,240,0.50);
         }

         .cdtm-wrapper .nav li.selected a,
         .cdtm-wrapper .nav li.selected a:link {
            background-color: rgb(0,180,240);
            background-color: rgba(0,180,240,1);
            color: whitesmoke;
         }

   /* SEARCH FIELD */

   .cdtm-wrapper .nav .right .search-wrapper {
       border: 1px solid #c8c8c8;
       border-radius: 5px;
       padding: 5px;
       position: relative;
   }

         .cdtm-wrapper .nav .right .search-wrapper .searchfield {
             background-color: #fff;
             border: medium none;
             border-radius: 3px;
             color: #aeaeae;
             display: inline-block;
             font-size: 1.5em;
             font-weight: normal;
             margin: 0;
             transition: all 0.2s linear 0s;
             width: 88%;
         }

         .cdtm-wrapper .nav .right .search-wrapper .searchfield:focus {
            color: #858585;
         }

         .cdtm-wrapper .nav .right .search-wrapper .icon-search {
             color: #d5d8de;
             display: inline-block;
             font-size: 2em;
             line-height: 10px;
             position: absolute;
             right: 6px;
             text-indent: -3px;
             width: 26px;
         }

         .cdtm-wrapper .nav .right .search-wrapper .icon-search:hover {
            color: #415A6C;
            cursor: pointer;
         }