Vamos a continuar con nuestro proyecto y puedes ver que el siguiente paso viene siendo el precio el
que viene de un color diferente por lo tanto vamos a abrir el HTML y aquí tenemos dos párrafos que si
le aplicamos un estilo de párrafo pues no va a funcionar que lo aplicarán los dos por lo tanto aquí
lo voy a diferenciar y voy a poner aquí una clase llamada Precio copiamos éste y lo pegamos aquí también
para que también afecte este de acá abajo y finalmente esté otro los tenemos tres clases nuevas llamadas
precio que podríamos copiar este contenido anunció simplemente poner precio para poderlo hacer o reutilizar
más posible.
Vamos a poner el mismo color verde y un fondo waited de 700 por default todos los párrafos tienen un
fondo Waid de 400 400 lo vamos a cambiar a 700 para hacerlo más grueso.
Esto es importante por ejemplo los párrafos párrafos su Fables form wait 700 de 400 mientras que los
jedis H1 por ejemplo Sofom Waid por default de 700.
Eso también es importante si guardamos cambios abrimos el proyecto y puede ser que aparecen los precios
se va cayendo bastante bien en realidad.
Siguiente paso es el que tenemos estos botones y este de acá también que hice ver todas.
Si de momento tienes dudas con el Padín aquí en la parte de los botones va a quedar claro y también
la parte de utilizar dos o más clases dar un poco de scroll.
Por ejemplo antes del género después de las utilidades voy a crear aquí botones que vamos a tener múltiples
botones en este diseño más botones y voy a abrir blindex ver blindex y aquí tenemos este hecho voy a
colocar un Class botón este va a tener todos los estilos genéricos para el botón pero también puedes
ver que en el diseño este botón tiene un color y este otro tiene otro color.
Por lo tanto este va a ser botón amarillo botón amarillo y voy a copiar toda esta clase de aquí y lo
Pevolca también acá.
Y este otro puedes ver que también es un botón pero es color verde por lo tanto aquí lo pongo una clase
que va a decir botón verde entonces sí tengo dos clases un botón que voy a utilizar aquí en ver todas
o utilizar todos los botones y después unas que diferencia a los botones y les cambia el color lo vamos
a abrir el stylus y lo voy a mover un poco hacia este lado.
Me voy a mover también para acá que sea más fácil de ver lo que vamos a ir escribiendo primero el botón
más genérico o sea el selector de botón.
Después tendremos el botón amarillo que se ve como media naranja pero bueno amarillo y finalmente el
botón verde primero voy a agregar el color aquí para el amarillo va a ser más un color es cero cero
ocho siete cero nueve con ese color amarillo y el otro va a tener un Mac en color que va a ser el color
verde que hemos utilizado 71 ve uno cero cero.
De momento quedan de esta forma después voy a estar aplicando los estilos en este aquí recuerda ambos
comparten lo que viene siendo botón y botón pero lo único que cambia es la otra clase que asigna un
color diferente a ponerla aquí por ejemplo un color gris para que el texto sea blanco puede ser que
afectamos recuerda también puedes ver aquí como hexadecimal.
De esta forma ahora sí vemos el diseño puedes ver que lo que vienen siendo las letras son un poco más
gruesas son mayúsculas y no tienen interlineado.
Por lo tanto vamos a abrir lo que viene siendo código son más gruesas con fondo waited 700 lo vas a
lograr un poco más gruesas no tienes la decoración abajo por lo tanto de correction no le quitamos.
No sólo es un poco más grandes con un Foncea es digamos 1.8 Reem sólo un poquito más grandes.
Ahora si vemos el diseño puedes ver que los botones así como con este espacio aquí ahí es donde entra
la parte del Padín.
Por lo tanto vamos a poner a quien Padín digamos un rummy arriba y tres Reem izquierda y derecha arriba
y abajo y tres izquierda y derecha surjan y puedes ver que se ve el padrino.
Ahí es donde creo yo queda un poco más claro que es el padre.
Puede ser que el pudines espacio hacia dentro del contenido si este fuera márgen no se vería de la misma
forma puede ser que agrega como cierta separación pero hacia afuera el padre hacia adentro y hace que
los elementos se van un poco más anchos un poco más grandes.