NEWS
Yahoo Wetter Widget
-
Hallo,
gibt es eine Möglichkeit, das oben genannte Widget transparent erscheinen zu lassen?
Danke und Grüße
-
Hallo,
ja das geht. Du kannst die CSS-Anweisungen aus dem Widget in VIS übersteuern.
Die CSS-Datei des Widgets ist diese:
http://IP-VIS:8082/vis/widgets/timeandw … /yahoo.css
! ````
@charset "UTF-8";
/**- Stylesheet: example.css
- (c) 2011-2012 Zazar Ltd
- Description: Stylesheet for examples
**/
.weatherFeed {
font-family: Arial, Helvetica, sans-serif;
font-size: 90%;
overflow: hidden;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}
.weatherFeed a { color: #888; }
.weatherFeed a:hover {
color: #000;
text-decoration: none;
}
.weatherItem {
padding: 0.8em;
text-align: right;
}
.weatherCity { text-transform: uppercase; }
.weatherTemp {
font-size: 2.8em;
font-weight: bold;
}
.weatherDesc, .weatherCity, .weatherForecastDay { font-weight: bold; }
.weatherDesc { margin-bottom: 0.4em; }
.weatherRange, .weatherWind, .weatherLink, .weatherForecastItem { font-size: 0.8em; }
.weatherLink, .weatherForecastItem {
margin-top: 0.5em;
text-align: left;
}
.weatherForecastItem {
padding: 0.5em 0.5em 0.5em 60px;
background-color: #000;
background-position: left center;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.weatherForecastDay { font-size: 1.1em; }! .odd { background-color: #e8e8fc; }
.even { background-color: #d4d4e8; }
! .day {
border: 4px solid #555;
background: #222 url(../img/bg.jpg) repeat-x;
color: #fff
}
.day a { color: #555; }
! .night {
border: 4px solid #555;
background: #222 url(../img/bg.jpg) repeat-x;
}
.night a:hover { color: #fff; }Du packst aber diesen Code in den CSS Reiter (Projekt) im VIS Editor:
/* Übersteuerung Weather Widgets */
.weatherItem, .weatherFeed {
background-color: transparent !important;
}.weatherForecastItem {
background-color: red !important; /* default is #000 */
}Die vorletzte Zeile habe ich auch geändert. Dort kann man die einzelnen Vorhersage Felder farblich anpassen. Standard ist schwarz, also __black__ oder __#000__. Habs mal für die Übersicht in rot gestaltet. ![261_bildschirmfoto_2017-02-19_um_15.27.24.jpg](/assets/uploads/files/261_bildschirmfoto_2017-02-19_um_15.27.24.jpg) Viel Spass! Gruß Pix EDIT: Muss ich ändern, Moment! EDIT (19.2.2017 / 15:28 Uhr): Jetzt geht es! :lol:
-
Hey, vielen Dank, das funktioniert schon mal (fast) super!
Hab jetzt nur noch im unteren Teil vom Widget ein weißes Feld was ich nicht
weg bekomme :? !
!
Weißt Du Rat :)?
Grüße und Danke
-
Hallo Taf37,
hast du das weiß wegbekommen?
Wie kann ich zudem den Rahmen ausblenden bzw schwarz färben?
Danke!
-
Das weisse Feld ist weg, wenn ich das eingebe:
3723_unbenannt4.png -
So sieht es dann ganz transparent aus (die Ränder stören mich nicht)
Gibt man bei CSS Ränder noch bei Color auch transparent ein verschwindet der blaue Rahmen.
3723_unbenannt5.png