Forum - Ich weiß jetzt nicht mehr weiter - Bar Graf im Profil

Hallo und einen schönen Montagmorgen,

Meine Frage ist jetzt, was mache ich bei dem Profilfeld bearbeiten falsch?

Ich habe dort im Profilfeld Test angegeben. Und den Code eingefügt.

Sieht so aus:

1
2
3
4
5
6
7
8
9
10
11
 

<div class="bar-graph">       <div data-pourcent="0">0%</div>     </div>
<div class="bar-graph">       <div data-pourcent="10">10%</div>     </div>
<div class="bar-graph">       <div data-pourcent="20">20%</div>     </div>
<div class="bar-graph">       <div data-pourcent="30">30%</div>     </div>
<div class="bar-graph">       <div data-pourcent="40">40%</div>     </div>
<div class="bar-graph">       <div data-pourcent="50">50%</div>     </div>
<div class="bar-graph">       <div data-pourcent="60">60%</div>     </div>
<div class="bar-graph">       <div data-pourcent="70">70%</div>     </div>
<div class="bar-graph">       <div data-pourcent="80">80%</div>     </div>
<div class="bar-graph">       <div data-pourcent="90">90%</div>     </div>
<div class="bar-graph">       <div data-pourcent="100">100%</div>     </div>
 

Schließen

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
 

.bar-graph {
  font-size: 0.8em;
  border: 1px solid;
  border-radius: 1rem;
  max-width: 15rem;
  background: rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 0.05rem 0.2rem rgba(0, 0, 0, 0.25);
}
.bar-graph > div {
  box-sizing: border-box;
  color: black;
  text-shadow: 0.05rem 0.05rem 0 rgba(255, 255, 255, 0.25), -0.05rem -0.05rem 0 rgba(0, 0, 0, 0.1);
  padding: 0.1rem 0.5rem;
  border-radius: 1rem;
  text-align: right;
  background-color: #b50b92;
  background-image: linear-gradient(90deg, #d7d19f 0%, #b50b92 100%);
  background-size: 15rem 100%;
  box-shadow: inset 0 0.15rem 0.1rem rgba(255, 255, 255, 0.3), inset 0 -0.1rem 0.2rem rgba(0, 0, 0, 0.3);
}
.bar-graph > div[data-pourcent="0"] {
  width: 0%;
}
.bar-graph > div[data-pourcent="10"] {
  width: 10%;
}
.bar-graph > div[data-pourcent="20"] {
  width: 20%;
}
.bar-graph > div[data-pourcent="30"] {
  width: 30%;
}
.bar-graph > div[data-pourcent="40"] {
  width: 40%;
}
.bar-graph > div[data-pourcent="50"] {
  width: 50%;
}
.bar-graph > div[data-pourcent="60"] {
  width: 60%;
}
.bar-graph > div[data-pourcent="70"] {
  width: 70%;
}
.bar-graph > div[data-pourcent="80"] {
  width: 80%;
}
.bar-graph > div[data-pourcent="90"] {
  width: 90%;
}
.bar-graph > div[data-pourcent="100"] {
  width: 100%;
}
 

Schließen

Das Problem ist, dass du und andere Mitglieder HTML aus Sicherheitsgründen nicht direkt im Profil einfügen können.

Du kannst es zum Beispiel bei "20" (Prozent) als Text belassen und in dem Profilfeld das HTML dynamisch per JavaScript ersetzen.

Danke Creator werde es versuchen,

habe im Moment so viele Ideen, ich mache diese und schreibe sie und danach geht nichts.

Habe auch schon ein Kalenderblock geschrieben, mit Metallringen und mit Datum. Habe auch die Classes geändert, aber geht nicht in Xobor Forum. (*Grummel Hmmmpf*)

Na ja, raffe das meiste eh nicht hier mit den Classes, man ändert die und trotzdem verändert sich das Xobor Forum. ul und li habe ich geändert, das p greift hier nicht, wird hier zu oft verwendet so wie der code aaa. Weiß zwar nicht was der a code hier bewirkt, jedenfalls kann ich den hier nicht verwenden.

Woanders schon also bei CodePen.

Eine einfache Lösung ist, dass ich die Balkendiagramme als

@media (prefers-color-scheme: )
 

speichere.

Ist mehr Arbeit, aber ich kann sie als Bilder einfügen. Werde es die Tage neu schreiben.

Danke Creator für deine Hilfe und neue Inspiration für

@media (prefers-color-scheme: )
 

.

Nette Grüße

Daishi

Schade, dass ich den Like-Button nicht mehr anklicken kann...
Mein Like unter Wolfgang´s letzten Beitrag wird nicht angezeigt.

Danke schön Wolfgang, funktioniert top.

Ich hätte jetzt alles umgeschrieben für das Bilderformat Media

Zitat von 844er im Beitrag #5

---

Schade, dass ich den Like-Button nicht mehr anklicken kann...
Mein Like unter Wolfgangs letzten Beitrag wird nicht angezeigt.

---

Ich kann auch nicht mehr liken

Ich weiß, ich hoffe, ich nerve hier nicht, ich raffe das nicht, wo ich hier die Eingabe hier einsetzen soll.

Bei Euch sieht es so einfach aus, ihr schaut Euch das an und sagt das muss so und so, ich stehe in der Luft, ich bin damit totaler Anfänger.

Ich wollte, dass die Spender auch im Profilfeld sind, ich weiß ich und meine Ideen.

Als Beispiel:
muss ich das so machen? [spender={{name}}="{eingabe}"={{avatar}}="{eingabe}"={{link}}="{eingabe}"={{spende}}="{eingabe}"={{text}}]

Oder ist das Falsch, raffe es wirklich nicht mit der Eingabe. Bei Euch sieht es echt ganz einfach aus.

nette grüße

Daishi