Conception (graphique) de la navigation entre les pages du formulaire (entre les différentes fiches relations + mini fiches relations)

This commit is contained in:
xdrm-brackets 2016-04-25 16:42:59 +02:00
parent 5e384227c0
commit 54b9c82052
6 changed files with 94 additions and 8 deletions

View File

@ -402,4 +402,38 @@
} }
/* (13) Gestion de la navigation fléchée */
& .arrow-container{
& span{
display: inline-block;
position: relative;
margin: 0;
padding: .5em .8em;
border: 1px solid darken(#d8e0e9, 10);
color: darken(#d8e0e9, 30);
cursor: pointer;
@include transition( .2s ease-in-out );
&:first-child{ border-radius: 5px 0 0 5px; }
&:last-child{ border-radius: 0 5px 5px 0; }
// Animation de hover
&:hover,
&.active:not(:first-child):not(:last-child){
border-color: $timeline-2;
background: $timeline-2;
color: #fff;
// font-weight: bold;
}
}
}
} }

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -83,9 +83,34 @@
<!-- GESTION DES FICHES RELATIONS --> <!-- GESTION DES FICHES RELATIONS -->
<h3 data-n='4' class='color4'>Remplir les fiches relations complètes des contacts les plus contactés</h3> <h3 data-n='4' class='color4'>Remplir les fiches relations complètes des contacts les plus contactés</h3>
<div class='arrow-container line'>
<span>&laquo;</span>
<span>1</span>
<span>2</span>
<span>3</span>
<span>4</span>
<span>5</span>
<span>6</span>
<span>7</span>
<span>8</span>
<span>9</span>
<span>10</span>
<span>11</span>
<span>12</span>
<span>13</span>
<span>14</span>
<span>15</span>
<span>16</span>
<span>17</span>
<span>18</span>
<span>19</span>
<span>20</span>
<span>&raquo;</span>
</div>
<article class='relation-panel'> <article class='relation-panel'>
<article class='fiche-relation'> <article class='fiche-relation'>
<span data-space></span> <span data-space></span>