From 46ac7fdce143b37514236f0afc193b691795e10b Mon Sep 17 00:00:00 2001 From: Miraty Date: Mon, 23 Mar 2020 15:57:13 +0100 Subject: [PATCH] Fix help button when SVG is disabled This is the case in Tor Browser with maximum security level, in this case show alternative text instead --- help.svg.php | 5 +++-- index.php | 8 ++++---- style.less | 5 +++-- style.min.css | 2 +- 4 files changed, 11 insertions(+), 9 deletions(-) diff --git a/help.svg.php b/help.svg.php index b57a54f..992a115 100755 --- a/help.svg.php +++ b/help.svg.php @@ -1,9 +1,10 @@ + - " stroke-width="2" cx="12" cy="12" r="10"> - "> + + diff --git a/index.php b/index.php index c2dbf30..6a535b9 100755 --- a/index.php +++ b/index.php @@ -149,7 +149,7 @@ if (badQuery()) {
- + " alt="Aide"> Vous pouvez encoder ce que vous voulez sous forme de texte.
Les logiciels qui décodent ces codes QR pourraient proposer de les ouvrir avec un logiciel dédié, en fonction de leur schéma d'URI.

@@ -178,7 +178,7 @@ if (badQuery()) {
- + " alt="Aide"> La redondance est le "doublement" des informations dans le code QR afin de corriger les erreurs lors du décodage. Un taux plus élevé produira un code QR plus grand, mais aura plus de chance d'être décodé correctement.
@@ -193,7 +193,7 @@ if (badQuery()) {
- + " alt="Aide"> Nombre de pixels des bandes blanches autour du code QR.
@@ -212,7 +212,7 @@ if (badQuery()) {
- + " alt="Aide"> Par combien les dimensions de l'image seront-elles multipliées ?
diff --git a/style.less b/style.less index 800c7b5..3460464 100755 --- a/style.less +++ b/style.less @@ -273,7 +273,7 @@ input[type=color] { /* Infobulle */ -svg { +#helpImg { width: 20px; height: 20px; margin-bottom: -3px; @@ -283,8 +283,9 @@ svg { .boutonAide { height: 0px; width: 0px; - color: @text; + color: @secondaryText; cursor: help; + font-size: 0.8em; } .conteneurAide .contenuAide { diff --git a/style.min.css b/style.min.css index 868bda1..e16ffdd 100755 --- a/style.min.css +++ b/style.min.css @@ -1 +1 @@ -*{font-family:"Ubuntu", sans-serif;scrollbar-color:white #2a2a2a;scrollbar-width:auto;}a{color:white;text-decoration:underline;}a:hover{text-decoration:none;}#firstWrapper{display:flex;flex-direction:row;}#menusDeroulants{text-align:center;margin-left:20px;}#qrCode{max-width:480px;}.centrer{text-align:center;}.bouton{padding:3px 10px 3px 10px;text-decoration:none;}form{display:block;margin-bottom:30px;}.center{display:flex;flex-direction:column;justify-content:center;margin-left:auto;margin-right:auto;width:814px;}body{margin:18px;background-color:#2a2a2a;color:white;font-weight:normal;font-size:20px;}body h1{color:white;text-decoration:none;}label{font-size:20px;}header{text-align:center;padding:0px;margin:0px;height:64px;}#logo{width:64px;height:64px;}#titres{margin-left:20px;}h1,h2,h3,h4,h5,h6{margin:0px;font-weight:normal;}h1{font-size:33px;}h2{font-size:22px;}#lienTitres{text-align:left;justify-content:center;text-decoration:none;display:flex;flex-direction:row;}#showOnlyQR{margin-top:30px;}#titre{text-align:center;justify-content:center;}.param{padding:10px;padding-left:0px;margin-left:0px;padding-right:0px;margin-right:0px;}.conteneurInputColor{display:flex;flex-direction:row;justify-content:center;}::selection{color:#2a2a2a;background-color:white;}label[for=txt]{padding-left:22px;}#colors{display:flex;flex-direction:row;justify-content:space-between;text-align:center;}#colors .param{text-align:center;display:flex;justify-content:center;flex-direction:column;width:100%;}.metaText{color:#868686;text-align:left;transition:color 0.12s cubic-bezier(0.42,0.0,1.0,1.0);position:fixed;width:400px;}.metaText a:link{transition:color 0.12s cubic-bezier(0.42,0.0,1.0,1.0);color:#868686;text-decoration:underline;}.metaText:hover,.metaText:hover a:link{color:white;}footer{font-size:14px;bottom:20px;left:20px;}#info{font-size:16px;bottom:20px;right:20px;margin:0px;}#info h3{font-size:20px;font-weight:normal;padding-bottom:10px;}#redondancy,#margin,#txt,#size,input[type=color],input[type=submit],.bouton{border:2px #5f5f5f solid;border-radius:10px;font-size:20px;padding-left:10px;font-weight:normal;color:white;transition:border 0.1s linear;background-color:#31363b;margin-top:8px;}#redondancy:hover,#margin:hover,#txt:hover,#size:hover,input[type=color]:hover,input[type=submit]:hover,.bouton:hover{border:2px #808080 solid;}#redondancy:focus,#margin:focus,#txt:focus,#size:focus,input[type=color]:focus,input[type=submit]:focus,.bouton:focus{border:2px white solid;outline:none;}#redondancy,#size,#margin{background-color:#31363b;width:250px;height:40px;}#txt{background-color:#232629;color:white;padding:10px;margin:10px;width:500px;scrollbar-color:white #232629;scrollbar-width:auto;}input[type=submit]{font-size:28px;padding:10px;padding-left:14px;padding-right:14px;}#txt::placeholder{color:#868686;opacity:1;font-family:"Ubuntu", sans-serif;font-weight:normal;font-size:1em;}input[type=color]{height:60px;width:84px;padding:5px;border:2px #5f5f5f solid;}svg{width:20px;height:20px;margin-bottom:-3px;margin-left:5px;}.boutonAide{height:0px;width:0px;color:white;cursor:help;}.conteneurAide .contenuAide{position:absolute;transform:scale(0) rotate(-12deg);color:white;background:#151616;padding:15px;border-radius:10px;box-shadow:0 0 10px rgba(0,0,0,0.5);margin-top:23px;margin-left:-35px;transition:all .25s;opacity:0;max-width:500px;font-size:20px;text-align:left;}@media (max-width: 500px){.conteneurAide .contenuAide{position:fixed;margin:5px;left:0px;top:0px;}}.conteneurAide:hover .contenuAide,.conteneurAide:focus-within .contenuAide{transform:scale(1) rotate(0);opacity:1;}@media (max-width: 1400px){.metaText{width:250px;}}@media (max-width: 1050px){#metaTexts{display:flex;flex-direction:row;}.metaText{width:100%;position:static;font-size:20px;}#info{color:white;margin-bottom:20px;padding-top:30px;font-size:20px;}#info a:link{color:white;}}@media (max-width: 850px){#metaTexts{flex-direction:column;width:480px;justify-content:center;margin-left:auto;margin-right:auto;}.center{width:auto;}#firstWrapper{flex-direction:column;}body{margin:10px;}#txt{width:92%;}}@media (max-width: 500px){#metaTexts{width:auto;}#colors{flex-direction:column;}h1{font-size:28px;padding-top:6px;}#txt{width:85%;}#qrCode{max-width:94%;}}@media (max-width: 415px){h1{padding:0px;}} \ No newline at end of file +*{font-family:"Ubuntu", sans-serif;scrollbar-color:white #2a2a2a;scrollbar-width:auto;}a{color:white;text-decoration:underline;}a:hover{text-decoration:none;}#firstWrapper{display:flex;flex-direction:row;}#menusDeroulants{text-align:center;margin-left:20px;}#qrCode{max-width:480px;}.centrer{text-align:center;}.bouton{padding:3px 10px 3px 10px;text-decoration:none;}form{display:block;margin-bottom:30px;}.center{display:flex;flex-direction:column;justify-content:center;margin-left:auto;margin-right:auto;width:814px;}body{margin:18px;background-color:#2a2a2a;color:white;font-weight:normal;font-size:20px;}body h1{color:white;text-decoration:none;}label{font-size:20px;}header{text-align:center;padding:0px;margin:0px;height:64px;}#logo{width:64px;height:64px;}#titres{margin-left:20px;}h1,h2,h3,h4,h5,h6{margin:0px;font-weight:normal;}h1{font-size:33px;}h2{font-size:22px;}#lienTitres{text-align:left;justify-content:center;text-decoration:none;display:flex;flex-direction:row;}#showOnlyQR{margin-top:30px;}#titre{text-align:center;justify-content:center;}.param{padding:10px;padding-left:0px;margin-left:0px;padding-right:0px;margin-right:0px;}.conteneurInputColor{display:flex;flex-direction:row;justify-content:center;}::selection{color:#2a2a2a;background-color:white;}label[for=txt]{padding-left:22px;}#colors{display:flex;flex-direction:row;justify-content:space-between;text-align:center;}#colors .param{text-align:center;display:flex;justify-content:center;flex-direction:column;width:100%;}.metaText{color:#868686;text-align:left;transition:color 0.12s cubic-bezier(0.42,0.0,1.0,1.0);position:fixed;width:400px;}.metaText a:link{transition:color 0.12s cubic-bezier(0.42,0.0,1.0,1.0);color:#868686;text-decoration:underline;}.metaText:hover,.metaText:hover a:link{color:white;}footer{font-size:14px;bottom:20px;left:20px;}#info{font-size:16px;bottom:20px;right:20px;margin:0px;}#info h3{font-size:20px;font-weight:normal;padding-bottom:10px;}#redondancy,#margin,#txt,#size,input[type=color],input[type=submit],.bouton{border:2px #5f5f5f solid;border-radius:10px;font-size:20px;padding-left:10px;font-weight:normal;color:white;transition:border 0.1s linear;background-color:#31363b;margin-top:8px;}#redondancy:hover,#margin:hover,#txt:hover,#size:hover,input[type=color]:hover,input[type=submit]:hover,.bouton:hover{border:2px #808080 solid;}#redondancy:focus,#margin:focus,#txt:focus,#size:focus,input[type=color]:focus,input[type=submit]:focus,.bouton:focus{border:2px white solid;outline:none;}#redondancy,#size,#margin{background-color:#31363b;width:250px;height:40px;}#txt{background-color:#232629;color:white;padding:10px;margin:10px;width:500px;scrollbar-color:white #232629;scrollbar-width:auto;}input[type=submit]{font-size:28px;padding:10px;padding-left:14px;padding-right:14px;}#txt::placeholder{color:#868686;opacity:1;font-family:"Ubuntu", sans-serif;font-weight:normal;font-size:1em;}input[type=color]{height:60px;width:84px;padding:5px;border:2px #5f5f5f solid;}#helpImg{width:20px;height:20px;margin-bottom:-3px;margin-left:5px;}.boutonAide{height:0px;width:0px;color:white;cursor:help;font-size:0.8em;}.conteneurAide .contenuAide{position:absolute;transform:scale(0) rotate(-12deg);color:white;background:#151616;padding:15px;border-radius:10px;box-shadow:0 0 10px rgba(0,0,0,0.5);margin-top:23px;margin-left:-35px;transition:all .25s;opacity:0;max-width:500px;font-size:20px;text-align:left;}@media (max-width: 500px){.conteneurAide .contenuAide{position:fixed;margin:5px;left:0px;top:0px;}}.conteneurAide:hover .contenuAide,.conteneurAide:focus-within .contenuAide{transform:scale(1) rotate(0);opacity:1;}@media (max-width: 1400px){.metaText{width:250px;}}@media (max-width: 1050px){#metaTexts{display:flex;flex-direction:row;}.metaText{width:100%;position:static;font-size:20px;}#info{color:white;margin-bottom:20px;padding-top:30px;font-size:20px;}#info a:link{color:white;}}@media (max-width: 850px){#metaTexts{flex-direction:column;width:480px;justify-content:center;margin-left:auto;margin-right:auto;}.center{width:auto;}#firstWrapper{flex-direction:column;}body{margin:10px;}#txt{width:92%;}}@media (max-width: 500px){#metaTexts{width:auto;}#colors{flex-direction:column;}h1{font-size:28px;padding-top:6px;}#txt{width:85%;}#qrCode{max-width:94%;}}@media (max-width: 415px){h1{padding:0px;}} \ No newline at end of file