Ce Forum passera en lecture seule en janvier 2020
Image
Merci de vous rendre sur https://community.jeedom.com maintenant pour vos prochains postes ;)

[Présentation] F$B33

JEEDOM et vous! Venez vous présenter et préseter votre installation domotique JEEDOM
guims78
Actif
Messages : 509
Inscription : 30 sept. 2017, 13:00

Re: [Présentation] F$B33

Message par guims78 » 31 janv. 2018, 07:32

Theduck38 a écrit :
28 janv. 2018, 21:08
Allez, je poste mon écran d'accueil, en cours de réalisation... rien de nouveau dans ce fil, mais j'en suis très content.
J'ai récupéré des morceaux à droite et à gauche, les contributeurs se reconnaîtront. Merci à tous !!!

Design.jpg
Très bien ton Design.
Pourrais-tu donner le paramètre CSS que tu as passé dans ton virtuel "Ambiance" ?
J'imagine que tu utilises le format tableau.
Je galère un peu pour trouver les bons paramètres pour bien aligner les infos dans mon tableau.

Avatar de l’utilisateur
Theduck38
Helper
Messages : 2714
Inscription : 22 févr. 2015, 17:32
Localisation : Près de Grenoble
Contact :

Re: [Présentation] F$B33

Message par Theduck38 » 31 janv. 2018, 11:20

Voilà ma config (très simple en fait) :
- Style générale des cases : padding: 1px 3px 1px 3px;
- En-tête de colonnes : rien
- Lignes avec valeurs : float: left;line-height:30px; (pour la première case avec le libellé texte) // rien // rien
- Sauts de lignes : height: 10px; // height: 10px; // height: 10px;

Si ce n'est pas assez clair, dis-moi... je ferai une copie d'écran.

Toute ma problématique est venue du texte des lignes qui s'affichait un peu plus haut que les valeurs sur la même ligne... j'ai mis un coup d'inspecteur et bloqué la hauteur à 30px pour forcer le centrage. Il y a peut-être plus élégant, mais je ne maîtrise pas assez le css.

Chaque commande ayant une valeur temp/hum/etc.. est affichée avec le widget "line(core)".
-- TD38 --
Helper Officiel Jeedom
Zimeteo sur Jeedom : http://www.meteo.lecoin.info
Jeedom Stable sur serveur custom
Le risque électrique - Afficheur leds RGB - Tablette Murale - Thermostat connecté

seb49
Timide
Messages : 38
Inscription : 09 janv. 2018, 12:12

Re: [Présentation] F$B33

Message par seb49 » 31 janv. 2018, 12:52

J'ai du caca dans les yeux ou quoi, je n'ai pas vu l'image de fond dans le zip ?
Raspberry Pi 3
Z-WAVE.ME - MINI CONTRÔLEUR USB Z-WAVE PLUS
5x Fibaro FGR-222 "Roller Shutter 2"
3x Xiaomi Yeelight RGB
1x Gateway Xiaomi
1x Broadlink RM mini3
1x RFLink "maison" / capteurs ouverture dans la boite aux lettres :-)

Bosquetia
Actif
Messages : 6783
Inscription : 10 mai 2016, 07:54

Re: [Présentation] F$B33

Message par Bosquetia » 31 janv. 2018, 13:05

Hello theduck,

Moi je serai intéressé de voir comment tu as fait ce résumé batterie avec les petites led ;-)

Avatar de l’utilisateur
Theduck38
Helper
Messages : 2714
Inscription : 22 févr. 2015, 17:32
Localisation : Près de Grenoble
Contact :

Re: [Présentation] F$B33

Message par Theduck38 » 31 janv. 2018, 14:11

Hé hé hé... ce n'est pas de moi :
viewtopic.php?f=50&t=14863&p=512956&hilit=led#p512956
Faut remercier Djal94 + l'auteur du plugin (damanujan) !

Après, c'est juste un tableau de 13 lignes par 2 colonnes. J'ai intercalé des lignes vides pour séparer.
-- TD38 --
Helper Officiel Jeedom
Zimeteo sur Jeedom : http://www.meteo.lecoin.info
Jeedom Stable sur serveur custom
Le risque électrique - Afficheur leds RGB - Tablette Murale - Thermostat connecté

Avatar de l’utilisateur
Theduck38
Helper
Messages : 2714
Inscription : 22 févr. 2015, 17:32
Localisation : Près de Grenoble
Contact :

Re: [Présentation] F$B33

Message par Theduck38 » 31 janv. 2018, 14:14

seb49 a écrit :
31 janv. 2018, 12:52
J'ai du caca dans les yeux ou quoi, je n'ai pas vu l'image de fond dans le zip ?
Non, elle est donné ailleurs dans le fil... la revoilà :
wall2.jpg
wall2.jpg (529.79 Kio) Consulté 828 fois

Attention à la taille par rapport au design !
-- TD38 --
Helper Officiel Jeedom
Zimeteo sur Jeedom : http://www.meteo.lecoin.info
Jeedom Stable sur serveur custom
Le risque électrique - Afficheur leds RGB - Tablette Murale - Thermostat connecté

Avatar de l’utilisateur
Theduck38
Helper
Messages : 2714
Inscription : 22 févr. 2015, 17:32
Localisation : Près de Grenoble
Contact :

Re: [Présentation] F$B33

Message par Theduck38 » 31 janv. 2018, 14:17

La suite... les températures.
Temperatures.jpg
Temperatures.jpg (221.2 Kio) Consulté 824 fois
-- TD38 --
Helper Officiel Jeedom
Zimeteo sur Jeedom : http://www.meteo.lecoin.info
Jeedom Stable sur serveur custom
Le risque électrique - Afficheur leds RGB - Tablette Murale - Thermostat connecté

Bosquetia
Actif
Messages : 6783
Inscription : 10 mai 2016, 07:54

Re: [Présentation] F$B33

Message par Bosquetia » 31 janv. 2018, 14:33

Merci Theduck38 pour le lien...

Sympa ton fork de design ;-)
Je commence à m'y pencher mais je rame un peu :mrgreen:

seb49
Timide
Messages : 38
Inscription : 09 janv. 2018, 12:12

Re: [Présentation] F$B33

Message par seb49 » 31 janv. 2018, 15:27

Merci bcp
Raspberry Pi 3
Z-WAVE.ME - MINI CONTRÔLEUR USB Z-WAVE PLUS
5x Fibaro FGR-222 "Roller Shutter 2"
3x Xiaomi Yeelight RGB
1x Gateway Xiaomi
1x Broadlink RM mini3
1x RFLink "maison" / capteurs ouverture dans la boite aux lettres :-)

ouquoi
Timide
Messages : 469
Inscription : 29 janv. 2016, 09:50

Re: [Présentation] F$B33

Message par ouquoi » 31 janv. 2018, 17:15

Theduck38 a écrit :La suite... les températures.
Temperatures.jpg
Top merci pour le partage ça donne des idées et des bonnes idées

Envoyé avec tapatalk

RPI3 - AEON LABS Z-Wave (GEN5) - Oeil fibaro - Synology Nas - Webcam ip - Minix Neo z64 - Broadlink RM PRO - Xiaomi Home - Yeelight - Nut mini

Life is sharing , Sharing is life !

Djal94
Actif
Messages : 1228
Inscription : 09 août 2016, 09:21

Re: [Présentation] F$B33

Message par Djal94 » 31 janv. 2018, 19:51

Salut tout le monde,

Voici l'évolution du mien :
Jeedom.jpeg
Jeedom.jpeg (739.1 Kio) Consulté 760 fois
Bonne soirée :D
Jeedom 3.2.11 sur NUC Intel (Debian 8)
Zwave - BLEA - Wifi
Trucs et Astuces

Bosquetia
Actif
Messages : 6783
Inscription : 10 mai 2016, 07:54

Re: [Présentation] F$B33

Message par Bosquetia » 31 janv. 2018, 20:26

Y a pas à dire, y a des mecs doués pour le design et trouver de bonnes idées !

Les rubans rouge, bleu sur les fenêtres de zones c'est une bonne idée, ainsi que la petite icone en plus du titre...
C'est sûr chacun organise et adapte à ses besoins, mais je suis admiratif de vos créations...

Moi cela reste super basic, fonctionnel mais moche :mrgreen: et pour la tablette murale de Madame je vais devoir m'y mettre mais j'ai pas votre talent... scénario, réseau, OS, sécurité OK mais dessin, graphisme et autres je suis aux abonnées absents.

Bravo en tout cas !

Djal94
Actif
Messages : 1228
Inscription : 09 août 2016, 09:21

Re: [Présentation] F$B33

Message par Djal94 » 31 janv. 2018, 20:37

Merci Bosquetia,

Mais la plupart des éléments sont des reprises de ce que d'autres ont fait, et j'ai un peu touché le code derrière (notamment les fenetres).
Et la vérité c'est que je suis pas un créatif pour ma part...
Jeedom 3.2.11 sur NUC Intel (Debian 8)
Zwave - BLEA - Wifi
Trucs et Astuces

Bosquetia
Actif
Messages : 6783
Inscription : 10 mai 2016, 07:54

Re: [Présentation] F$B33

Message par Bosquetia » 31 janv. 2018, 20:50

Ben c'est réussi pour un non créatif :mrgreen:
Et puis les reprises il faut quand même les assembler avec harmonie, pas évident pour moi...

guims78
Actif
Messages : 509
Inscription : 30 sept. 2017, 13:00

Re: [Présentation] F$B33

Message par guims78 » 31 janv. 2018, 20:56

Theduck38 a écrit :
31 janv. 2018, 11:20
Voilà ma config (très simple en fait) :
- Style générale des cases : padding: 1px 3px 1px 3px;
- En-tête de colonnes : rien
- Lignes avec valeurs : float: left;line-height:30px; (pour la première case avec le libellé texte) // rien // rien
- Sauts de lignes : height: 10px; // height: 10px; // height: 10px;

Si ce n'est pas assez clair, dis-moi... je ferai une copie d'écran.

Toute ma problématique est venue du texte des lignes qui s'affichait un peu plus haut que les valeurs sur la même ligne... j'ai mis un coup d'inspecteur et bloqué la hauteur à 30px pour forcer le centrage. Il y a peut-être plus élégant, mais je ne maîtrise pas assez le css.

Chaque commande ayant une valeur temp/hum/etc.. est affichée avec le widget "line(core)".
J'étais un peu dans le même cas.
Merci pour les infos. ;-)

Avatar de l’utilisateur
Theduck38
Helper
Messages : 2714
Inscription : 22 févr. 2015, 17:32
Localisation : Près de Grenoble
Contact :

Re: [Présentation] F$B33

Message par Theduck38 » 03 févr. 2018, 00:55

Allez, la suite... la page multiroom ; probablement pas finie car j'ai implémenté peu de fonctions.
J'ai honteusement copié les sélecteurs de @Thyer ; c'est vrai que la méthode est top !

J'ai aussi passé la soirée à découvrir comment on écrivait un Widget... même si j'ai pas tout compris, j'ai tout de même réussi à faire ceux qu'on voit en bas pour faire du On/Off ou une commande simple (et paramétrable par couleur, taille et type d'icône, avec des valeurs par défaut).
Multiroom.JPG
Multiroom.JPG (205.17 Kio) Consulté 659 fois
Mais j'ai encore un problème avec les équipements SqueezePlayer qui ont la sale habitude de revenir à la couleur d'origine de leur tuile... même si on customise la couleur dans l'affichage avancé !!!
-- TD38 --
Helper Officiel Jeedom
Zimeteo sur Jeedom : http://www.meteo.lecoin.info
Jeedom Stable sur serveur custom
Le risque électrique - Afficheur leds RGB - Tablette Murale - Thermostat connecté

Thyer
Timide
Messages : 163
Inscription : 30 mai 2017, 09:51
Localisation : Lorraine

Re: [Présentation] F$B33

Message par Thyer » 03 févr. 2018, 12:01

Salut,
Le fameux bleu qui reviens toujours :D
J'ai un peux grugé le truc, j'ai fait une tuile avec un dégrader Bleu / transparent et je remonte le Widget tout en haut comme sur le screen en dessous
SB.PNG
SB.PNG (122.4 Kio) Consulté 636 fois
Code degrader

Code : Tout sélectionner

background: -moz-linear-gradient(top, rgba(52,73,94,1) 63%, rgba(72,103,131,1) 73%, rgba(125,185,232,0) 100%);
background: -webkit-linear-gradient(top, rgba(52,73,94,1) 63%,rgba(72,103,131,1) 73%,rgba(125,185,232,0) 100%);
background: linear-gradient(to bottom, rgba(52,73,94,1) 63%,rgba(72,103,131,1) 73%,rgba(125,185,232,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#34495e', endColorstr='#007db9e8',GradientType=0 );
Dernière édition par Thyer le 03 févr. 2018, 12:48, édité 1 fois.

Avatar de l’utilisateur
Theduck38
Helper
Messages : 2714
Inscription : 22 févr. 2015, 17:32
Localisation : Près de Grenoble
Contact :

Re: [Présentation] F$B33

Message par Theduck38 » 03 févr. 2018, 12:28

Heu, je ne maîtrise pas assez pour avoir compris où mettre ton code... la tuile d'origine de l'équipement Squeezeplayer n'a pas de personnalisation avancée... du coup tu le mets où ?

J'ai partagé les boutons montrés en bas de mon design 'Multiroom' : widget PowerOnOff dans la catégorie 'Audio/vidéo" :
PowerOnOff.png
PowerOnOff.png (25.02 Kio) Consulté 632 fois
-- TD38 --
Helper Officiel Jeedom
Zimeteo sur Jeedom : http://www.meteo.lecoin.info
Jeedom Stable sur serveur custom
Le risque électrique - Afficheur leds RGB - Tablette Murale - Thermostat connecté

Thyer
Timide
Messages : 163
Inscription : 30 mai 2017, 09:51
Localisation : Lorraine

Re: [Présentation] F$B33

Message par Thyer » 03 févr. 2018, 12:46

Oui ben justement comme elle a pas de personnalisation, je la réduit au maximum en hauteur et sur la partie tuile du dessous (text/HTML) j'ajoute mon dégrade.

J'avais déjà posté le code des mes cadres HTML sur ce post avec un dégradé de couleur en font.

Code : Tout sélectionner

<!-- PRINCIPALE -->
	<div style="
    position : relative;
    box-shadow: 0px 0px 1px 1px rgba(0,0,0,0.5);
    min-height: 100%;
    background: -moz-linear-gradient(top, rgba(52,73,94,1) 63%, rgba(72,103,131,1) 73%, rgba(125,185,232,0) 100%);
    background: -webkit-linear-gradient(top, rgba(52,73,94,1) 63%,rgba(72,103,131,1) 73%,rgba(125,185,232,0) 100%);
    background: linear-gradient(to bottom, rgba(52,73,94,1) 63%,rgba(72,103,131,1) 73%,rgba(125,185,232,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#34495e', endColorstr='#007db9e8',GradientType=0 );
    border-radius: 10px 0px 10px 0px;
    ">
        
    <div style="
    position : relative;
    min-height: 100%;
    margin: 0 auto;
    padding-bottom: 0;
    width: 100%;
    ">
    
	<div style="
	height:30px;
	width:30px;
	position:absolute;
	margin-top:6px;
	margin-left:5px;
	max-width:100%;
	height:auto;
    ">
	<img src="THYER/design/ipad/V2/images/HP_MINI.png" height=30px width=30px></div>
       
    <div style="
    padding-top: 10px;
    padding-right:20px;
    font-size:16px;
    height:40px;
    font-family:Arial;
    font-weight:normal;
    text-align:right;
    color: #FFF;
	background: rgb(69,72,77);
	background: -moz-linear-gradient(top, rgba(69,72,77,1) 0%, rgba(0,0,0,1) 100%);
	background: -webkit-linear-gradient(top, rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%);
	background: linear-gradient(to bottom, rgba(69,72,77,1) 0%,rgba(0,0,0,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#45484d', endColorstr='#000000',GradientType=0 );
    border-radius: 10px 0px 0px 0px;
    border-bottom: 1px solid #111111;">			
   NOM DE LA TUILE
    </div>

    
    </div>
</div>

Avatar de l’utilisateur
Theduck38
Helper
Messages : 2714
Inscription : 22 févr. 2015, 17:32
Localisation : Près de Grenoble
Contact :

Re: [Présentation] F$B33

Message par Theduck38 » 03 févr. 2018, 13:17

OK, j'avais pas compris en fait... c'est une tuile en dessous de celle appartenant à l'équipement. !

Merci !
-- TD38 --
Helper Officiel Jeedom
Zimeteo sur Jeedom : http://www.meteo.lecoin.info
Jeedom Stable sur serveur custom
Le risque électrique - Afficheur leds RGB - Tablette Murale - Thermostat connecté

Répondre

Revenir vers « Présentation et Vitrine d'installations »

Qui est en ligne ?

Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 7 invités