Die Farben des Countdown-Widgets umkehren

Folgen

Dieser Code tauscht die Farben des Countdown-Widget-Hintergrunds und des Zahlen-Hintergrunds. Außerdem werden die Zahlenangaben nach unten verschoben und die Hintergrundkästen der Zahlen werden rund. Der Name des Countdown-Widgets wird ebenfalls geändert.

Hinweise/Tipps:

  • Achten Sie darauf, dass Sie den fett gedruckten Text des Codes so ändern, dass er dem Branding Ihrer App entspricht.
  • Diese Seite ist sehr nützlich beim Finden von Hex-Codes: http://www.colorpicker.com/

Code:

/*Invert Countdown */
.widget-countdown-number {
   background: #fff;
   border-radius: 100%;
}

.widget-countdown {
   background-color: #669366;
}

.widget-countdown-block span {
   margin-bottom: 5px;
   line-height: .4em;
   display: block;
   color: white;
   font-weight: bolder;
}

.widget-countdown-block {
   padding-top: 45px;
}

.widget-countdown-title {
   color: white;
}

.widget-countdown-number {
   position: relative;
   top: -60px;
   height: 44px;
   color: #61596a;
}

.widget-countdown-title > span {
   display: none;
}

.widget-countdown-block > span {
   margin-top: 10px;
}

/* Change name of countdown widget */
.widget-countdown-title::after {
   content: ' Name of countdown Widget';
}
0 von 0 fanden dies hilfreich

Kommentare

0 Kommentare

Zu diesem Beitrag können keine Kommentare hinterlassen werden.