Gallery
BASE DE CONNAISSANCE
Share
Explore
Gallery
BASE DE CONNAISSANCE

🎲 CODE ETOILE COULEUR

.sg-star-box label.sg-star-1
{
background-image: url(//widgixeu-library.s3.amazonaws.com/library/90008354/Stars_edf_enr_commerce.png);
}
.sg-star-box label.sg-star-1
{
background-image: url(//widgixeu-library.s3.amazonaws.com/library/90008354/Stars_edf_enr_commerce.png);
}

Taille de l’étoile

/*Agrandir ETOILE*/
.sg-star-box label.sg-star-0, .sg-star-box label.sg-star-0 {display: none;}

.sg-type-multimenu .sg-question-options, .sg-type-rank-table .sg-question-options, .sg-type-table .sg-question-options
{float: left;}

.sg-star-box {
padding: 7px;
overflow: visible;
display: flex;
gap: 17px;
}

.sg-6stars {
width: 200px;
}

.sg-star-box label {
transform: scale(1.5);
}
.sg-type-table .sg-table {
width: 100%;
}

.sg-type-multimenu .sg-question-options, .sg-type-rank-table .sg-question-options, .sg-type-table .sg-question-options {
width: 100%;
}
/*Fin Agrandir ETOILE*/

Intégration d’une nouvelle Police de caractère

*{outline: none!important;}/*Enlevé les Outline du questionnaire*/
/* Mise en place de police spécifique */
@font-face {
font-family: 'Styrene A';
src: url('fonts/styrene-a-regular.woff2') format('woff2'), /* Modern Browsers */
url('fonts/styrene-a-regular.woff') format('woff'); /* Older Browsers */
font-size: 16px;
color: #34617D;
letter-spacing: 0px;
line-height: 24px;
}
/* Fin Mise en place de police spécifique */
.sg-survey .sg-button
{
font-family: Arial!important;/* Police des bouttons*/
}

Intégration d’une nouvelle Police de caractère

Description : “row-110” représentent des indexations de la question étoile, ce qui signifie qu'il faudra ajouter une nouvelle classe pour chaque question.
/*Centrage étoile*/
th#row-110.sg-first-cell{display: none;}
th#col-10221.sg-single-cell.col-10221{display: none;}
.sg-type-table .sg-first-cell.sg-mock-th{border-bottom: 0px solid #ECF0F1;}
/*.sg-6stars{float:right;} Etoile à droite*/
.sg-6stars{margin:auto;}/* Etoile au centre*/
/*.sg-6stars{float:right;} Etoile à gauche*/
.sg-star-box label.sg-star-0, .sg-star-box label.sg-star-0:hover{display:none;}/*Masquage du "x" à gauche des étoiles*/
/*Fin Centrage étoile*/
Voici le résultat :
⁠
Capture2.PNG
⁠
⁠

Design Question NPS

Voici les code pour changer la couleur des légendes et radios sur une question NPS.
/*Les chiffres*/
th.sg-cell.sg-cell-1.sg-cell-data.sg-first-cell{color:#E8363D;font-weight:bold;}
th.sg-cell.sg-cell-2.sg-cell-data{color:#E8363D;font-weight:bold;}
th.sg-cell.sg-cell-3.sg-cell-data{color:#E8363D;font-weight:bold;}
th.sg-cell.sg-cell-4.sg-cell-data{color:#E8363D;font-weight:bold;}
th.sg-cell.sg-cell-5.sg-cell-data{color:#E8363D;font-weight:bold;}
th.sg-cell.sg-cell-6.sg-cell-data{color:#E8363D;font-weight:bold;}
th.sg-cell.sg-cell-7.sg-cell-data{color:#E8363D;font-weight:bold;}
th.sg-cell.sg-cell-8.sg-cell-data{color:#F7C60A;font-weight:bold;}
th.sg-cell.sg-cell-9.sg-cell-data{color:#F7C60A;font-weight:bold;}
th.sg-cell.sg-cell-10.sg-cell-data{color:#37B466;font-weight:bold;}
th.sg-cell.sg-cell-11.sg-cell-data{color:#37B466;font-weight:bold;}
/*les radios*/
td.sg-cell.sg-cell-1.sg-cell-data.sg-first-cell{color:#E8363D;font-weight:bold;}
td.sg-cell.sg-cell-2.sg-cell-data{color:#E8363D;font-weight:bold;}
td.sg-cell.sg-cell-3.sg-cell-data{color:#E8363D;font-weight:bold;}
td.sg-cell.sg-cell-4.sg-cell-data{color:#E8363D;font-weight:bold;}
td.sg-cell.sg-cell-5.sg-cell-data{color:#E8363D;font-weight:bold;}
td.sg-cell.sg-cell-6.sg-cell-data{color:#E8363D;font-weight:bold;}
td.sg-cell.sg-cell-7.sg-cell-data{color:#E8363D;font-weight:bold;}
td.sg-cell.sg-cell-8.sg-cell-data{color:#F7C60A;font-weight:bold;}
td.sg-cell.sg-cell-9.sg-cell-data{color:#F7C60A;font-weight:bold;}
td.sg-cell.sg-cell-10.sg-cell-data{color:#37B466;font-weight:bold;}
td.sg-cell.sg-cell-11.sg-cell-data{color:#37B466;font-weight:bold;}
🎲 CODE ETOILE COULEUR
Taille de l’étoile
Intégration d’une nouvelle Police de caractère
Intégration d’une nouvelle Police de caractère
Design Question NPS
Gallery
Share
 
Want to print your doc?
This is not the way.
Try clicking the ⋯ next to your doc name or using a keyboard shortcut (
CtrlP
) instead.