Coding
 Es hagelt Nüsse

Codingbaum - Wähle Deine Aufgaben
#11


Es hagelt Nüsse

am


Gruppenzwang! HuhnHuhn

Ich versuche es mal mit der XXX und hoffe, ich muss nicht gleich in Runde 1 aufgeben. ^^'



Gwendolyn
Je ne regrette rien

Alter | Beruf | Blutstatus
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo.




Code:
<div class="mp-nuss3_container">
  
  <div class="mp-nuss3_boxlinks">
    <div class="mp-nuss3_kreis"></div>
    <div class="mp-nuss3_kreis-gif"></div>
    <div class="mp-nuss3_kreis"></div>
    <div class="mp-nuss3_kreis"></div>
  </div>
  
  <div class="mp-nuss3_boxrechts">
    <div class="mp-nuss3_boxrechts-oben">
      <div class="mp-nuss3_h1">Gwendolyn</div>
      <div class="mp-nuss3_h2">Je ne regrette rien</div>
    </div>
    
    <div class="mp-nuss3_boxrechts-unten"><div class="mp-nuss3_h3">Alter | Beruf | Blutstatus</div>
      Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo.</div>
  </div>
  
  </div>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Kristi&family=Roboto&display=swap" rel="stylesheet">

<style type="text/css">:root{--mp-nuss3_col1:#081e27;--mp-nuss3_col2:#6f3b40;--mp-nuss3_col3:#8f6665;--mp-nuss3_col4:#fff}.mp-nuss3_container{background:var(--mp-nuss3_col1);width:600px;height:390px;margin:auto;display:flex;flex-direction:row;justify-content:space-evenly}.mp-nuss3_boxlinks{width:195px;height:390px;display:flex;flex-direction:column;position:relative}.mp-nuss3_kreis{background-image:url('https://www.toptal.com/designers/subtlepatterns/uploads/wheat.png');background-position:center;background-size:130px;width:130px;height:130px;border-radius:50%}.mp-nuss3_kreis-gif{background-image:url('https://c.tenor.com/hbUk7cJ77KgAAAAC/what-do-you-want-what-do-you-mean.gif');background-position:-70px;background-size:auto 130px;background-repeat:no-repeat;opacity:.8;width:130px;height:130px;border-radius:50%;position:absolute;left:65px;top:65px;z-index:1}.mp-nuss3_boxrechts{width:385px;height:390px;display:flex;flex-direction:column}.mp-nuss3_boxrechts-oben{width:395px;display:flex;flex-direction:column;padding:30px 0 20px 0;gap:20px}.mp-nuss3_h1{font-family:'Kristi';font-size:60px;color:var(--mp-nuss3_col2);padding:20px 0 0 40px}.mp-nuss3_h2{font-family:'Kristi';font-size:32px;line-height:16px;color:var(--mp-nuss3_col3);padding:0 0 0 110px}.mp-nuss3_h3{font-family:'Roboto';color:var(--mp-nuss3_col4);font-variant:small-caps;font-size:13px;letter-spacing:2px;padding:0 0 5px 0}.mp-nuss3_boxrechts-unten{font-family:'Roboto';font-size:13px;line-height:160%;text-align:justify;color:var(--mp-nuss3_col4);padding:0 30px 30px 20px}</style>
24.06.2022, 22:14: Hugo hat diesen Beitrag moderiert

Rubine sind ausgeschüttet
19. Juli - 23:59
4
2
1
1
1
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#12


Es hagelt Nüsse

am


Meine zweite Nuss sei die ~~~~.
3
Ausdauer
6
Magie
2
Stärke
5
Charisma
  • Nekker
  • Gruppenmonster
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Velit pellentesque in quis vulputate vestibulum pellentesque. Scelerisque proin eget enim magna velit blandit. Adipiscing in non lorem tellus. Cursus sagittis
Nekker
Take heed, gents, there's nekkers under this here bridge. If you all cross at once, without slowing or stopping, there's nothing to fear. But if your cart throws an axle and you get stuck out there... Well, close your eyes and pray to Melitele. – Kurt Hammerbach, city guardsman in Vengerberg A lone nekker is harmless. Five are dangerous. Ten can kill even a veteran monster slayer. Particularly troublesome are the larger, stronger individuals known as warriors, as well as the rare breed of nekkers known as phoocas. Nekkers and phoocas live in the dark woods that grow in damp, mist-filled valleys, in colonies of one to several dozen individuals. They dig deep burrows for lairs and connect them with a network of narrow tunnels. Using these passageways they are able to move at great speed within and around their colonies.






Html


Code:
<div class="fcard_card">
  <div class="fcard_card_inner">
    <div class="fcard_card_front">
      <div class="fcard_img crop1 monster1"></div>
      <div class="fcard_numbers">
           <div class="fcard_number">
          <div>3</div>
          <div>Ausdauer</div>
        </div>
        <div class="fcard_number">
                
          <div>6</div>
          <div>Magie</div>
        </div>
           <div class="fcard_number">
          <div>2</div>
          <div>Stärke</div>
        </div>
                   <div class="fcard_number">
          <div>5</div>
          <div>Charisma</div>
        </div>
        
        
      </div>
      <div class="fcard_box"><ul>
        <li>Nekker</li> <li>Gruppenmonster</li>
        
      </ul></div>
      <div class="fcard_text">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Velit pellentesque in quis vulputate vestibulum pellentesque. Scelerisque proin eget enim magna velit blandit. Adipiscing in non lorem tellus. Cursus sagittis</div>
      <div class="fcard_img crop2 monster1"></div>
    </div>
    <div class="fcard_card_back">
      <div class="fcard_name">Nekker</div>
      <div class="fcard_knowledge">
                   Take heed, gents, there's nekkers under this here bridge. If you all cross at once, without slowing or stopping, there's nothing to fear. But if your cart throws an axle and you get stuck out there... Well, close your eyes and pray to Melitele.
    – Kurt Hammerbach, city guardsman in Vengerberg
    A lone nekker is harmless. Five are dangerous. Ten can kill even a veteran monster slayer. Particularly troublesome are the larger, stronger individuals known as warriors, as well as the rare breed of nekkers known as phoocas.
    Nekkers and phoocas live in the dark woods that grow in damp, mist-filled valleys, in colonies of one to several dozen individuals. They dig deep burrows for lairs and connect them with a network of narrow tunnels. Using these passageways they are able to move at great speed within and around their colonies.
      </div>
    </div>
  </div>
</div>

CSS


Code:
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');

body{
  background:url(https://i.imgur.com/EsvfvZV.png);
}

:root {
    --fcard_col1: #2e2e2e;
    --fcard_col11: #222222;
     --fcard_col2: #343434;
     --fcard_text: #efefef;
    --fcard_highlight: #638DB4;
    --fcard_text-f:'Roboto', sans-serif;
    --fcard_title:'Libre Baskerville', serif;
}

/******************************** backdesign ****************************/
.fcard_card_back{
border-top:15px var(--fcard_col2) solid;
  border-bottom:15px var(--fcard_highlight) solid;

}


.fcard_name {font-family: var(--fcard_title);
font-size: 25px;
font-weight: 400;
  margin: 0;
color:var(--fcard_highlight);
  padding:20px;
}

.fcard_knowledge {
  padding:20px;
  font-family:var(--fcard_text-f);
  font-size:15px;
  line-height:1.9;
  height: 480px;
  overflow:scroll;
  text-align:justify;
}

/******************************** frontdesign ***************************/
.fcard_numbers {
  display:flex;
  justify-content:space-between;
  width:90%;
  margin:auto;
}

.fcard_number {
  flex: 0 0 25%;
}


.fcard_number div:nth-child(odd) {
  font-family: Roboto;
font-weight: 800;
font-size: 35px;
text-align: justify;
text-transform: uppercase;
color: var(--fcard_highlight);
background: linear-gradient( -45deg, rgba(0, 0, 0, 0) 29.17%, var(--fcard_highlight) 29.17%, var(--fcard_highlight) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 79.17%, var(--fcard_highlight) 79.17%, var(--fcard_highlight) 100% );
background-size: 3px 3px;
background-clip: text;
-webkit-background-clip: text;
color: transparent;
-webkit-text-stroke-width: 1px;
-webkit-text-stroke-color: var(--fcard_text);
  text-align:center;
} /*Numberdesign by white rabbit*/

.fcard_number div:nth-child(even) {
text-align:center;
}

.fcard_box{
  background:var(--fcard_col2);
  width:90%;
  margin:auto;
}

.fcard_text {
  width:89%;
  margin:auto;
  text-align:justify;
  line-height:1.4;
  
}

/******************************* functionality **************************/

.fcard_card {
  background-color: transparent;
  width: 300px;
  height: 600px;
  perspective: 1000px;
  margin:auto;
    color:var(--fcard_text);
  font-family:var(--fcard_text-f);
}

.fcard_card_inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform 0.6s;
  transform-style: preserve-3d;
}

.fcard_card:hover .fcard_card_inner {
  transform: rotateY(180deg);
}

.fcard_card_front, .fcard_card_back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}

.fcard_card_front {
  background:var(--fcard_col1);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}

.fcard_card_back {
  transform: rotateY(180deg);
  background:var(--fcard_col11);
}

/********************************picture***************************/

.monster1 {background:url('https://abload.de/img/lijix.png');
}

.crop1 {
  flex-basis:150px;
  background-repeat:no-repeat;
  background-position:50% 30%;
}

.crop2 {
  flex-basis:50px;
  background-repeat:no-repeat;
  background-position:10%;
}

Colors and Numberdesign by @White_Rabbit for PiCoG
22.06.2022, 20:36: Hugo hat diesen Beitrag moderiert

Rubine sind verrabt
19. Juli - 23:59
5
1
1
1
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#13


Es hagelt Nüsse

am


Und ab jetzt kann ich mit den NÜssen jonglieren: die [ZENSIERT] bitte.

[Bild: https://i.imgur.com/E4GqgsE.png]
CodePen

Html


Code:
<div class="fehn_container">
  <div class="fehn_cat"></div>
  <div class="fehn_forums">
    <div class="fehn_forum">
      <div class="fehn_fdata">
        <div class="fehn_fname">Call for Help</div>
        <div class="fehn_fline"></div>
        <div class="fehn_fflex">
          <div class="fehn_fdescript">
            Lorem ipsum dolor <b>sit amet</b>, consectetur adipiscing elit. Integer viverra ornare arcu <b>eget risus, </b>rhoncus in arcu volutpat. Gravida suspendisse vestibulum venenatis elit, aliquet. Porttitor orci pellentesque tristique.
          </div>
          <div class="fehn_flp">
            <a href="">everything is better now ...</a><br>
            by <a href="">Vicco Jourmalahi</a>
          </div>
        </div>
      </div>
      <div class="fehn_ftp">
        <div class="fehn_fftp"><div>T:145</div></div>
        <div class="fehn_fftp"><div>P:945</div></div>
      </div>
    </div>
  </div>
</div>

css


Code:
:root {
--main: #3E5952; /*maincolor*/
--boxes:#D9D9D9; /*boxenhintergrund*/
  --text:#243430; /*maintextcolor*/
  --contrast:#F5F5F5; /*contrast to main*/
  --ub:'Gilda Display', serif;
  --font: 'Jomolhari', serif;
}

a {
  text-decoration:none;
  color:var(--main);
  opacity:0.95;
  transition:0.3s ease-in;
}

a:hover {
  color:var(--contrast);
}

.fehn_container {
  font-family:var(--font);
width: 1200px;
  margin:auto;
  line-height:160%;
}

.fehn_cat {
  background:var(--main);
  width:1200px;
  height:60px;
}

.fehn_forums {}

.fehn_forum {
  margin: 20px 0px;
  background:var(--boxes);
  border:5px solid var(--main);
  padding:20px;
}

.fehn_fname {
Color:var(--main);
  font-family:var(--ub);
  font-size:48px;
  margin-top:20px;
  margin-left:120px;
}

.fehn_fline {
  height: 5px;
display:flex;
  background:var(--main);
  margin: 10px 20px 30px 60px;
  
}

.fehn_fline:before{
  content:'';
  display:block;
    width:70px;
  height:70px;
background:var(--main);
  transform:rotate(45deg);
  margin-top:-32px;
  margin-left:-20px;
}

.fehn_forum {
  display:flex;
  
}
.fehn_fflex{
  display:flex;
  justify-content:space around;
}

.fehn_fdescript {
  position:relative;
  z-index:22;
  flex: 0 0 50%;
  margin-left:125px  
}

.fehn_ftp {
  flex: 0 0 15%;
}

.fehn_fftp {
  background:var(--main);
  width:75px;
  height:75px;
  transform:rotate(45deg);
  display:flex;
  justify-content:center;
  align-items:center;
  margin:20px;
}

.fehn_fftp div {
  color:var(--contrast);
  transform:rotate(-45deg);

}

.fehn_fftp:nth-child(2) {
  margin-left:60px;
  margin-top:-10px;
}
26.06.2022, 11:16: Hugo hat diesen Beitrag moderiert

Rubine wurden ausgeschüttet
19. Juli - 23:59
0
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#14


Es hagelt Nüsse

am




Code:
<style>#firefox-nuesse-signatur{box-sizing:border-box;width:500px;margin:auto}#firefox-nuesse-signatur .firefox-nuesse-signatur-linie{background:#b6bfdb;height:15px;width:500px}#firefox-nuesse-signatur .firefox-nuesse-signatur-sw{box-sizing:border-box;width:500px;height:250px}#firefox-nuesse-signatur .firefox-nuesse-signatur-sw img{filter:grayscale(100%);transition:1.5s}#firefox-nuesse-signatur .firefox-nuesse-signatur-sw IMG:hover{filter:none;transition:1.5s}#firefox-nuesse-signatur .firefox-nuesse-signatur-linie-unten{width:500px;height:30px;background:#3456aa}</style>
<div id="firefox-nuesse-signatur"><div class="firefox-nuesse-signatur-linie"></div><div class="firefox-nuesse-signatur-sw"><img src="https://abload.de/img/estellekopiesbkij5qjkk.png" class="firefox-nuesse-signatur-sw"></div><div class="firefox-nuesse-signatur-linie-unten"></div></div>
27.06.2022, 14:53: Hugo hat diesen Beitrag moderiert

Achtung: Kopf einziehen. Es hagelt Rubine.
19. Juli - 23:59
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#15


Es hagelt Nüsse

am


Ich hätte bitte gerne als nächstes die XX. :)


Code:
<style type="text/css">:root{--hintergrundfarbe:#c2c39b;--boxenfarbe:#a1bcd9;--umrandungsfarbe:#337295;--inhaltsfarbe:#ced4da;--boxenfont:Georgia,serif;--inhaltsfont:Trebuchet MS,Verdana,sans-serif;--inhaltsfontfarbe:#000;--ueberschriftenfarbe:#183647;--ueberschriftenfont:'Ms Madi';--zitatfarbe:#000}#aussen{background:var(--hintergrundfarbe);color:var(--inhaltsfontfarbe);display:flex;flex-direction:column;font-family:var(--boxenfont);justify-content:center;width:500px}.oben{align-items:center;background:var(--inhaltsfarbe);display:flex;flex-direction:column;justify-content:center;width:700px}.charaktername{font-size:1.5em;margin-top:20px;text-align:center}.charaktername a{color:var(--ueberschriftenfarbe);text-decoration:none}.charaktername a:hover{color:var(--zitatfarbe);text-decoration:underline}.charaktertitel{font-size:.8em;text-align:center;margin-bottom:20px}.spielerinfos{font-size:.8em;text-align:center;margin:5px}.abwesend{background:red;border:1px solid var(--umrandungsfarbe);margin:-40px 0 15px 0;padding:5px;transform:rotate(10deg)}.avatar{border:2px solid var(--umrandungsfarbe);height:220px;margin:5px;text-align:center;width:270px}.interaktion,.awards{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center}img.interaktion_bild{height:30px;margin:5px;width:30px}img.award{height:60px;margin-right:5px;width:60px}.links,rechts{align-items:center;display:flex;flex-direction:column;width:49%}.nebeneinander{display:flex;flex-direction:row;justify-content:space-between}.box{background:var(--boxenfarbe);border:1px solid var(--umrandungsfarbe);font-size:.88em;line-height:1em;margin:2px 5px 2px 5px;padding:5px;text-align:left;width:250px}p.kurzinfos{text-align:justify;margin:5px 0}.icon{border:2px solid var(--umrandungsfarbe);height:100px;margin:10px;text-align:Center;width:200px}.awards_ueberschrift{border-bottom:1px solid var(--umrandungsfarbe);font-color:var(--ueberschriftenfarbe);margin:10px;text-align:center}</style><div id="aussen">
  <div class="oben">
    <div class="charaktername"><a href="linkzumprofil">Miriam Mustermensch</a></div>
    <div class="spielerinfos">gespielt von xxx</div>
    <div class="avatar"><img src="https://abload.de/img/avatarm7k2n.jpg" /></div>
    <div class="abwesend">abwesend bis zum 23. Juli 2022</div>
    <div class="charaktertitel">Mensch und Eichhörnchen von Welt</div>
    <div class="nebeneinander">
      <div class="links">
        <div class="box"><strong>Beiträge: </strong>111</div>
              <div class="box"> <strong>Letzter Besuch: </strong>22. Juni 2022<br />
          <strong>Registriert seit: </strong>11. November 2011</div>
        <div class="box"><strong>Avatar: </strong>Eichhörnchen</div>
        <div class="box"><strong>weitere Charaktere: </strong><br />
        Paula Pusteblume, Lira Löffelstil
      </strong> </div>
          <div class="box">        <strong>Pronomen: </strong>sie/ihr<br /></div>
    <div class="icon"><img src="https://abload.de/img/iconplj1i.gif" /></div>
      <div class="interaktion">
      <div class="interaktion_element"><img class="interaktion_bild" title="PN schicken" src="https://abload.de/img/12393089uk0r.png" /></div>
      <div class="interaktion_element"><img class="interaktion_bild" src="https://abload.de/img/116572y4k84.png" title="Suche alle Beiträge von diesem User" /></div></div>
    </div>
      <div class="rechts">
      <div class="box">
        <strong>Alter:</strong> 42 Jahre<br />
        <strong>Herkunft:</strong> Nimmerland<br />
        <strong>Wohnort: </strong>Uruguay<br />
        <strong>Wesen:</strong> Wer-Eichhörnchen<br />
        <strong>Beruf: </strong>Nussknackerin<br />
        <strong>Lieblingsfarbe: </strong>Ocker<br />
        <strong>Fähigkeiten: </strong> Klettern
      </div>
              <div class="box"><strong>Kurzinfos:</strong><p class="kurzinfos">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea tak.</p></div>
       <div class="awards_ueberschrift">Awards</div>
    <div class="awards">
    <div class="award_element"><img class="award" title="Wenn das die Guten sind, möchte ich Darth Vader sein!" src="https://abload.de/img/noun_darthvaderm8kd0.png" /></div>
    <div class="award_element"><img class="award" title="Du siehst doch Gespenster!" src="https://abload.de/img/noun_geist3ckxx.png" /></div>
    <div class="award_element"><img class="award" title="Du bist ja ein echter Lebensretter!" src="https://abload.de/img/noun_lebensrettertckgm.png" /></div>
    <div class="award_element"><img class="award" title="Verneige dich vor dem Porzellangott!" src="https://abload.de/img/noun_porzellanmxjr3.png" /></div>
    <div class="award_element"><img class="award" title="Erwecke das Tier in dir! Du hast dich das erste Mal ingame gewandelt." src="https://abload.de/img/noun_wandlungphjcx.png" /></div>
  </div>
  </div></div>
    </div>
  </div>
</div>
22.06.2022, 20:51: Hugo hat diesen Beitrag moderiert

Die Rubine sind verteilt
19. Juli - 23:59
2
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#16


Es hagelt Nüsse

am


Noch eine Nuss bitte! happy Dieses Mal hätte ich gerne die XX.


Code:
<style type="text/css">.aussen{display:flex;flex-direction:column;align-items:center;justify-content:center}#pilzhut{width:140px;height:70px;background:#8b4513;-moz-border-radius:35px;-webkit-border-radius:35px;border-radius:140px 140px 70px 70px}#pilzstiel{height:0;width:35px;border-bottom:140px solid #cd853f;border-left:20px solid transparent;border-right:20px solid transparent}@keyframes tilt-n-move-shaking{0{transform:translate(0,0) rotate(0)}25%{transform:translate(5px,5px) rotate(5deg)}50%{transform:translate(0,0) rotate(0eg)}75%{transform:translate(-5px,5px) rotate(-5deg)}100%{transform:translate(0,0) rotate(0)}}</style><div class="aussen">
  <div id="pilzhut"></div>
<div id="pilzstiel" class="animation-element" style="animation: tilt-n-move-shaking 1s linear infinite;"></div>
</div>
22.06.2022, 23:29: Hugo hat diesen Beitrag moderiert

Rubine sind wie durch Zauberhand in deinem Säckchen aufgetaucht.
19. Juli - 23:59
2
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#17


Es hagelt Nüsse

am


Bitte einmal die Nuss Nr. XX. happy


Henrietta Huhn
Henne sucht neuen Stall
3 Jahre alt
ist stolz auf ihren Kamm
badet gerne im Staub
fand ihre letzte Bäuerin ziemlich doof
isst gerne Regenwürmer
sonnt sich gerne
Ich wollt' ich wär' ein Huhn,
ich hätt' nicht viel zu tun,
ich legte vormittags ein Ei
und sonntags auch mal zwei.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.

Vorlieben
  • Scharren
  • Picken
  • Gras
  • Sonne
  • Körner
Abneigungen
  • Brathähnchen
  • Füchse
  • Omelette
  • Katzen
  • Zugluft

Code:
<style type="text/css">@import url('https://fonts.googleapis.com/css2?family=Fredericka+the+Great&family=Playfair+Display&family=Poiret+One&display=swap');:root{--huhn_hintergrundfarbe:#453024;--huhn_boxenfarbe:#dca67e;--huhn_dreieckfarbe:#ce7839;--huhn_umrandungsfarbe:#211913;--huhn_inhaltsfarbe:#e1e1e1;--huhn_inhaltsfont:'Playfair Display';--huhn_shortfactsfarbe:#fff;--huhn_ueberschriftenfont:'Fredericka the Great',serif;--huhn_ueberschriften2font:'Poiret One'}#huhn_aussen{border:3px solid var(--huhn_umrandungsfarbe);background:var(--huhn_hintergrundfarbe);display:flex;flex-direction:column;font-family:var(--huhn_inhaltsfont);width:400px}.huhn_kopf{background-image:url("https://abload.de/img/headerozjha.jpg");border-bottom:3px solid var(--huhn_umrandungsfarbe);height:200px}.huhn_charaktername{font-family:var(--huhn_ueberschriftenfont);font-size:25px;margin-top:85px;text-align:center}.huhn_kopf_ueberschrift{font-family:var(--huhn_ueberschriften2font);font-size:15px;text-align:center}.huhn_avatar{shape-outside:circle();clip-path:circle();float:left;margin:0 0 0 10px;transform:scale(200px);height:150px;width:150px}.huhn_avatar_bild{height:auto;width:150px}.huhn_shortfacts{margin-top:15px}.huhn_shortfacts_element{align-items:center;color:var(--huhn_shortfactsfarbe);display:flex;flex-direction:row;font-size:12px;justify-items:center}.huhn_shortfacts_element_dreieck{width:0;height:0;border-left:20px solid var(--huhn_dreieckfarbe);border-top:10px solid transparent;border-bottom:10px solid transparent;margin:2px 5px 2px 10px}.huhn_zitat{clear:both;font-family:var(--huhn_ueberschriften2font);font-style:italic;padding-top:10px;text-align:center}.huhn_beschreibungstext{border:1px solid var(--huhn_umrandungsfarbe);background:var(--huhn_inhaltsfarbe);clear:both;margin:20px 10px 10px 10px}.huhn_beschreibung{line-height:1.2em;padding:0 5px 5px 5px;text-align:justify}.huhn_liste{align-items:center;display:flex;flex-direction:row;justify-content:center;margin:0 5px 0 5px}.huhn_liste_element{background:var(--huhn_boxenfarbe);border:1px solid var(--huhn_umrandungsfarbe);margin:0 5px 10px 5px;padding:10px;width:50%}.huhn_liste_ueberschrift{border-bottom:1px solid var(--huhn_umrandungsfarbe);font-family:var(--huhn_ueberschriftenfont);font-size:1.2em;text-align:Center}</style>
<div id="huhn_aussen">
  <div class="huhn_kopf"><div class="huhn_charaktername">Henrietta Huhn</div>
    <div class="huhn_kopf_ueberschrift">Henne sucht neuen Stall</div></div>
  <div class="huhn_huhn_koerper">
    <div class="huhn_shortfacts">
      <div class="huhn_avatar"><img class="huhn_avatar_bild" src="https://abload.de/img/huhnt9kkv.jpg" /></div>
      <div class="huhn_shortfacts_element">
        <div class="huhn_shortfacts_element_dreieck"></div>3 Jahre alt
      </div>
      <div class="huhn_shortfacts_element">
        <div class="huhn_shortfacts_element_dreieck"></div>ist stolz auf ihren Kamm
      </div>
      <div class="huhn_shortfacts_element">
        <div class="huhn_shortfacts_element_dreieck"></div>badet gerne im Staub
      </div>
      <div class="huhn_shortfacts_element">
        <div class="huhn_shortfacts_element_dreieck"></div>fand ihre letzte Bäuerin ziemlich doof
      </div>
      <div class="huhn_shortfacts_element">
        <div class="huhn_shortfacts_element_dreieck"></div>isst gerne Regenwürmer
      </div>
      <div class="huhn_shortfacts_element">
        <div class="huhn_shortfacts_element_dreieck"></div>sonnt sich gerne
      </div>
      </div>
        <div class="huhn_beschreibungstext"><div class="huhn_zitat">Ich wollt' ich wär' ein Huhn, <br />ich hätt' nicht viel zu tun, <br />ich legte vormittags ein Ei <br />und sonntags auch mal zwei.</div>
          <p class="huhn_beschreibung">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
        </div>
  </div>
  <div class="huhn_liste">
  <div class="huhn_liste_element"><div class="huhn_liste_ueberschrift">Vorlieben</div><ul><li>Scharren</li>
    <li>Picken</li>
    <li>Gras</li>
    <li>Sonne</li>
    <li>Körner</li>
    </ul>
  </div>
    <div class="huhn_liste_element"><div class="huhn_liste_ueberschrift">Abneigungen</div><ul><li>Brathähnchen</li>
    <li>Füchse</li>
    <li>Omelette</li>
    <li>Katzen</li>
    <li>Zugluft</li>
    </ul>
  </div>
  </div>
</div>
23.06.2022, 22:37: Hugo hat diesen Beitrag moderiert

Rubine wurden verteilt
19. Juli - 23:59
3
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#18


Es hagelt Nüsse

am


Einmal bitte die XX. Huhn

Ergebnis:




Ich bin eine Überschrift
Ich bin ein Untertitel

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.





Code:
<div><div class="dyssur_body">
  <div class="dyssur_box">
  
    <div class="dyssur_bild">
      <img src="https://abload.de/img/epickapuzemwk0q.png">
      <img src="https://abload.de/img/epic15xkey.png" class="dyssur_img2">
    </div>
    <div class="dyssur_text">
      <div class="dyssur_h1">Ich bin eine Überschrift</div>
      <div class="dyssur_h2">Ich bin ein Untertitel</div>
      <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p>
    </div>
  </div>

</div></div>

<style>@import url("https://fonts.googleapis.com/css2?family=IM+Fell+English+SC&display=swap");@import url("https://fonts.googleapis.com/css2?family=Andika+New+Basic&display=swap");:root{--dyssur_schick:"IM Fell English SC",serif;--dyssur_normal:"Andika New Basic",sans-serif;--dyssur_col1:#ddd;--dyssur_col2:#000}.dyssur_body{margin:auto;padding:30px;width:600px;background:var(--dyssur_col1);font-family:var(--dyssur_normal);display:flex;flex-direction:column;justify-content:center;border:solid;position:relative}.dyssur_h1{font-family:var(--dyssur_schick);font-size:30px;text-align:center;line-height:30px}.dyssur_h2{font-size:15px;text-transform:uppercase;text-align:center;line-height:45px}.dyssur_box{display:flex;flex-direction:row;justify-content:space-between}.dyssur_bild img{width:200px;border-radius:50%;border:dotted 5px var(--dyssur_col2);padding:10px;position:absolute;left:40px;top:90px}.dyssur_img2{display:none;z-index:99}.dyssur_bild:hover .dyssur_img2{display:inline}.dyssur_text{text-align:justify;padding:25px;width:300px}</style>
23.06.2022, 21:26: Hugo hat diesen Beitrag moderiert

Rubine wurden verrabt
19. Juli - 23:59
4
1
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#19


Es hagelt Nüsse

am


Naaaaaaa okay noch eine dann bitte die XX angel
19. Juli - 23:59
0
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.
#20


Es hagelt Nüsse

am


Ob wohl die Nuss Nr. XX schmeckt?


HTML:
Code:
<div class="dys_fa_container">

  <div class="dys_fa_header">
    <div class="dys_fa_eis">Das Eiszeit-RPG</div>
    <i class="fa-solid fa-icicles fa-2x"></i>
    <div class="dys_fa_box1">

      <div class="dys_fa_news"><i class="fa-solid fa-newspaper fa-3x"></i> </div>
      <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren.</p>

      <div class="dys_fa_wetter"> <i class="fa-solid fa-meteor fa-2x"></i> <i class="fa-solid fa-icicles fa-2x"></i> <i class="fa-solid fa-temperature-arrow-down fa-2x"></i></div>

    </div>

    <div class="dys_fa_box2">
      <div class="dys_fa_gesuche"><i class="fa-solid fa-magnifying-glass fa-3x"></i> </div>

      <div class="dys_fa_gesuchslink-1">[Gruppe] Ein Mammut kommt selten allein...</div>
      <div class="dys_fa_gesuchslink-2">[Pairing] Eine Höhle für zwei</div>
      <div class="dys_fa_gesuchslink-1">[Familie] Yabba Dabba Doo!</div>
      <div class="dys_fa_gesuchslink-2">[Feinde] Säbelzähne gewetzt...</div>
      <div class="dys_fa_gesuchslink-1">Gesuch Nr. 5</div>
      <div class="dys_fa_gesuchslink-2">Gesuch Nr. 6</div>
      <div class="dys_fa_gesuchslink-1">Gesuch Nr. 7</div>
      <div class="dys_fa_gesuchslink-2">Gesuch Nr. 8</div>
      <div class="dys_fa_gesuchslink-1">Gesuch Nr. 9</div>

    </div>

    <div class="dys_fa_box3">
      <div class="dys_fa_infos"><i class="fa-solid fa-circle-info fa-3x"></i> </div>
      <div class="dys_fa_icons">
        <i class="fa-solid fa-door-open fa-2x"></i>
        <i class="fa-solid fa-user-plus fa-2x"></i></br>

        <i class="fa-solid fa-people-group fa-2x"></i> <i class="fa-solid fa-location-arrow fa-2x"></i></br>
        <i class="fa-solid fa-list fa-2x"></i>
        <i class="fa-solid fa-book-open-reader fa-2x"></i></br>

        <i class="fa-brands fa-discord fa-2x"></i>
      </div>

    </div>

  </div>

</div>

CSS:

Code:
@import url("https://fonts.googleapis.com/css2?family=Bangers&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Questrial&display=swap");

:root {
  --dys_fa_normal: "Questrial", sans-serif;
  --dys_fa_fancy: "Bangers", cursive;
  --dys_fa_bgcol: #074e67;
  --dys_fa_col1: rgb(230, 237, 239, 0.5);
  --dys_fa_col2: rgb(230, 237, 239);
}

.dys_fa_container {
  margin: auto;
  width: 1100px;
  height: 550px;
  font-family: var(--dys_fa_normal);
  background: var(--dys_fa_bgcol);
  color: var(--dys_fa_col2);
}

.dys_fa_header {
  padding: 20px;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

.dys_fa_eis {
  font-family: var(--dys_fa_fancy);
  font-size: 25px;
}

.dys_fa_box1 {
  background: var(--dys_fa_col1);
  height: 200px;
  width: 280px;
  height: 500px;
  border-radius: 5%;
}

.dys_fa_box1 p {
  text-align: justify;
  padding: 20px;
  font-size: 18px;
}

.dys_fa_box2 {
  background: var(--dys_fa_col1);
  width: 280px;
  height: 500px;
  border-radius: 5%;
}

.dys_fa_box2 p {
  text-align: justify;
  padding: 20px;
}

.dys_fa_box3 {
  background: var(--dys_fa_col1);
  width: 280px;
  height: 500px;
  border-radius: 5%;
}

.dys_fa_box3 p {
  text-align: justify;
  padding: 20px;
}

.dys_fa_news {
  padding: 20px;
  text-align: center;
  font-size: 30px;
  font-family: var(--dys_fa_fancy);
}

.dys_fa_wetter {
  padding: 20px;
  text-align: center;
  font-size: 30px;
  font-family: var(--dys_fa_fancy);
}

.dys_fa_gesuche {
  padding: 20px;
  text-align: center;
  font-size: 35px;
  font-family: var(--dys_fa_fancy);
}

.dys_fa_infos {
  padding: 20px;
  text-align: center;
  font-size: 35px;
  font-family: var(--dys_fa_fancy);
}

.dys_fa_icons {
  padding: 20px;
  text-align: center;
}

.dys_fa_icons i {
  padding: 10px;
}

.dys_fa_gesuchslink-1 {
  background: var(--dys_fa_bgcol);
  padding: 10px;
  font-size: 13px;
}

.dys_fa_gesuchslink-2 {
  padding: 10px;
  font-size: 13px;
}
24.06.2022, 22:21: Hugo hat diesen Beitrag moderiert

Rubine sind in deinem Inventar aufgetaucht.
19. Juli - 23:59
3
1
Merken
Merken
Benutzerdefinierter Titel
Zur besseren Übersicht kannst du dem Post einen benutzerdefinierten Titel geben.
Ordner
Neue Ordner für deine Favoriten kannst du im UserCP erstellen.