elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.


 


Tema destacado: ¿Eres nuevo? ¿Tienes dudas acerca del funcionamiento de la comunidad? Lee las Reglas Generales


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Necesito ayuda para agregar un estilo css a un componente sin usar javascript
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Necesito ayuda para agregar un estilo css a un componente sin usar javascript  (Leído 532 veces)
Razzari

Desconectado Desconectado

Mensajes: 76


El que espera desespera


Ver Perfil
Necesito ayuda para agregar un estilo css a un componente sin usar javascript
« en: 13 Marzo 2017, 14:44 »

Hola tengo el siguiente input :



su html es el siguiente:



al dar submit y el campo estar vacio veran que la linea de abajo se pone roja :



el css que tengo para pintar esa linea de rojo es la siguiente:



ahora mi duda es si de alguna milagrosa manera sin usar javascript podria que al agregar el css a la linea ponerle al signo de admiracio
Código:
color: red;
y sacar esas clases poner el signo de admiracion
Código:
color: transparent;

Desde ya gracias y saludos


« Última modificación: 13 Marzo 2017, 16:14 por Razzari » En línea

"Los ordenadores son inutiles, solo pueden darte respuestas" Pablo Picasso
ThinkByYourself

Desconectado Desconectado

Mensajes: 191


Ver Perfil
Re: Necesito ayuda para agregar un estilo css a un componente sin usar javascript
« Respuesta #1 en: 13 Marzo 2017, 15:21 »

¿Sin javascript? No entiendo mucho qué quieres hacer, a lo mejor con reglas CSS puedes hacerlo, pero nu he entendiu. Pero sin js............. E-difisi


« Última modificación: 13 Marzo 2017, 15:23 por NoBullshit » En línea

No te voy a engañar.
Todos hemos sido programados para normalizar la psicopatía de las élites económicas y políticas, y para realimentar su patrón de ciega codicia.
Razzari

Desconectado Desconectado

Mensajes: 76


El que espera desespera


Ver Perfil
Re: Necesito ayuda para agregar un estilo css a un componente sin usar javascript
« Respuesta #2 en: 13 Marzo 2017, 15:24 »

si, estoy viendo varias pseudo clases de css por ejemplo ":not"
al no estar completos los campos requerido en mi etiqueta form se agrega una clase llamada "ng-invalid"
en css quiero preguntar lo siguiente

Código:
form :not (.ng-invalid) .miIcono {
color: red;}

pero no me esta funcionando  :(
En línea

"Los ordenadores son inutiles, solo pueden darte respuestas" Pablo Picasso
ThinkByYourself

Desconectado Desconectado

Mensajes: 191


Ver Perfil
Re: Necesito ayuda para agregar un estilo css a un componente sin usar javascript
« Respuesta #3 en: 13 Marzo 2017, 15:29 »

Ah vale.

En tal caso, ten en cuenta que el orden de las reglas que apliques es importante.

Si pones:

form.formulario.ng-invalid {color:blue}

Y luego:

form.formulario {color:red}

El color será rojo, y azul al ser invalido. El orden podría influir.

Bueno, no es un muy buen ejemplo, pero el orden es importante, vaya


Para el caso:

Primero que la regla ataque al form normal y luego al invalidado, para que el invaludado sobreescriba a la otra, y no sea al revés. No sé si irá por ahí.

O sea:

Código
  1. form .miIcono {color:black}
  2. form.ng-invalid .miIcono {color: red;}
  3.  

Creo, vaya

« Última modificación: 13 Marzo 2017, 15:37 por NoBullshit » En línea

No te voy a engañar.
Todos hemos sido programados para normalizar la psicopatía de las élites económicas y políticas, y para realimentar su patrón de ciega codicia.
Razzari

Desconectado Desconectado

Mensajes: 76


El que espera desespera


Ver Perfil
Re: Necesito ayuda para agregar un estilo css a un componente sin usar javascript
« Respuesta #4 en: 13 Marzo 2017, 15:52 »

eso mismo estaba trantanto,, y no funcionaba me fije en al consola de desarrollador y cunado se inicia de entrada el form tiene la clase ng-invalid  :-( :-(
En línea

"Los ordenadores son inutiles, solo pueden darte respuestas" Pablo Picasso
Razzari

Desconectado Desconectado

Mensajes: 76


El que espera desespera


Ver Perfil
Re: Necesito ayuda para agregar un estilo css a un componente sin usar javascript
« Respuesta #5 en: 13 Marzo 2017, 16:13 »

pude solucionarlo,, viendo el comportamiento de las clases a medida que trabajaba con el elemento vi que estas dos clases solo estaban juntas cuando el campo estaba en estado "required" : .ng-submitted.ng-invalid

asi que solo tuve que poner lo siguiente en css:

Código:
.ion-information-circled{
    color:transparent;     /*Color por defecto*/
}
form.ng-submitted.ng-invalid .ion-information-circled{
    color : red;            /*Color en caso de required*/
}

Muchas gracias por el interés y la ayuda NoBullshit !   ;-)
« Última modificación: 13 Marzo 2017, 16:23 por Razzari » En línea

"Los ordenadores son inutiles, solo pueden darte respuestas" Pablo Picasso
ThinkByYourself

Desconectado Desconectado

Mensajes: 191


Ver Perfil
Re: Necesito ayuda para agregar un estilo css a un componente sin usar javascript
« Respuesta #6 en: 14 Marzo 2017, 23:33 »

Guay! No hay de qué
En línea

No te voy a engañar.
Todos hemos sido programados para normalizar la psicopatía de las élites económicas y políticas, y para realimentar su patrón de ciega codicia.
Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines