1
00:00:00,480 --> 00:00:03,380
Vamos a continuar trabajando con este diseño.

2
00:00:03,450 --> 00:00:05,820
Aquí podemos ver que el logo estaba un poco más grande.

3
00:00:05,820 --> 00:00:08,130
Vamos a darle unos cuantos estilos.

4
00:00:08,130 --> 00:00:15,990
Primero recuerda estos móbil fieles le ponemos de logo ponemos un Wit de un 80 por ciento guardo cambios

5
00:00:16,350 --> 00:00:28,350
recargo y cuando estos temas pequeño el logo va a tomar di logo y MG recargo y esto va a tomar el 80

6
00:00:28,350 --> 00:00:29,580
por ciento del diseño.

7
00:00:30,770 --> 00:00:33,640
Lo malo es que puedes ver que cuando esté más grande sigue tomando el 80.

8
00:00:33,640 --> 00:00:39,120
Vamos a ponerlo en media QWERTY media only lo podemos copiar para no escribirlo todo

9
00:00:43,380 --> 00:00:51,480
y lo vamos a poner a 768 copió este selector pego y en este caso quiero que mida 33 por ciento esto

10
00:00:51,490 --> 00:01:02,690
va aplicar tanto para el MG como para para el Dip y logo que no podemos dejar de bloqueo 80.

11
00:01:02,710 --> 00:01:03,800
Vamos a eliminar esto

12
00:01:07,610 --> 00:01:16,180
y que sea el 33 y ponerle Dip y logo y mg 100 por ciento para que tome el 100 por ciento del padrón.

13
00:01:16,190 --> 00:01:20,370
Entonces creo que esa forma nos ahorraríamos un poco más de código.

14
00:01:20,630 --> 00:01:27,050
Puedes ver que cuando estemos en un tamaño grande o 338 pixeles será el 33 por ciento más o menos se

15
00:01:27,050 --> 00:01:30,880
ve bien y si lo hacemos más pequeño.

16
00:01:30,890 --> 00:01:38,390
Llegado a este punto tomará el 80 por ciento y tal vez diga que va a haber aquí porque este espacio

17
00:01:39,160 --> 00:01:43,370
ahí vamos a poner el menudo móvil que hemos creado.

18
00:01:43,370 --> 00:01:45,650
Sin embargo primero necesitamos.

19
00:01:46,280 --> 00:01:53,810
Primero necesitamos quitar a este menú principal y normalmente ese tipo de menús se ocultan y se muestran

20
00:01:54,770 --> 00:02:10,940
con CSS y +40 aquí hacemos aquí navegación principal y vamos a poner el tip navegación principal y como

21
00:02:10,950 --> 00:02:21,400
es móvil Fires le ponemos display Naum para después mostrarlo cuando estemos en este tamaño de fuente

22
00:02:27,160 --> 00:02:32,180
aquí tenemos 33 así que le podemos poner un widget.

23
00:02:32,590 --> 00:02:45,510
Veamos vamos a poner un UIT-T de 30 60 y 6.6 por ciento para que tome el restante.

24
00:02:45,520 --> 00:02:54,830
Bueno pues bueno 67 por ciento y aquí vamos a poner también un float Ebright para ponerle un float Leff.

25
00:02:56,590 --> 00:03:00,650
Así el menú será la izquierda y la navegación del lado derecho.

26
00:03:00,700 --> 00:03:08,200
Si guardo cambios el recargo vamos a ver qué falla y se ve de una forma mal es porque ya le hemos puesto

27
00:03:08,200 --> 00:03:16,780
los floods con un click Fix recargo y vemos que mejora otra vez nuestro diseño que tenemos flat Rivas

28
00:03:16,810 --> 00:03:23,200
por el arquitecto Halim right para que nos ponga todo este contenido del lado derecho y nos haría falta

29
00:03:23,200 --> 00:03:34,930
un display Block porque X debe y debe ser una menos que aparece así un poco mejor y cuando estamos en

30
00:03:34,930 --> 00:03:42,960
pequeño ese menú no debe de estar es nada aquí entonces el menú principal no está y cuando lo hacemos

31
00:03:42,960 --> 00:03:50,040
más grande aquí debe de aparecer nos hace falta un display Block para que aparezca el menú

32
00:03:53,450 --> 00:03:57,550
y si hay algo más pequeño desaparece el logo más grande aparece.

33
00:03:59,030 --> 00:04:08,120
Vamos a finalizar este menú y vamos a ponerle lo que vienen siendo los valores para que se vea como

34
00:04:08,120 --> 00:04:14,560
éste que tenemos aquí y vamos a hacerlo aquí en esta parte de afuera a pesar de que va a estar en display

35
00:04:14,730 --> 00:04:24,290
non creo que va a ser más fácil principal a porque a pesar de que no se va a ver el menú esto sí se

36
00:04:24,290 --> 00:04:33,480
van a ver de alguna u otra forma vamos a poner aquí font family y estaremos utilizando la fuente de

37
00:04:33,540 --> 00:04:37,560
Oswalt y vamos a buscarla.

38
00:04:37,580 --> 00:04:42,450
Oswalt que tenemos el H2O es un poco de escorar hacia abajo.

39
00:04:42,460 --> 00:04:45,610
Volvemos y lo pegamos y

40
00:04:49,910 --> 00:04:53,040
también nos ponemos el color blanco.

41
00:04:53,440 --> 00:05:00,430
Guardo cambio y recargo sabiendo de esta forma falta ser el el texto un poco más grande en mayúsculas

42
00:05:00,440 --> 00:05:03,200
sin la decoración etcétera.

43
00:05:03,260 --> 00:05:05,880
Vamos a continuarás con el iPhone 6 de un

44
00:05:08,390 --> 00:05:09,470
recargamos

45
00:05:11,990 --> 00:05:13,670
y tal vez 1.6

46
00:05:16,570 --> 00:05:18,150
creo que queda muy grande.

47
00:05:20,120 --> 00:05:22,680
1.3 creo que se va a ver bien.

48
00:05:23,220 --> 00:05:24,830
Ok se ve bien.

49
00:05:24,950 --> 00:05:32,020
Text Transform o Keys text correction para remover la linea inferior.

50
00:05:32,160 --> 00:05:40,420
De esta forma nos hace falta tener un poco de separación en cada uno de ellos.

51
00:05:42,010 --> 00:05:44,870
Eso lo vamos a hacer en el mini Aquaris copió esto y lo pego aquí.

52
00:05:46,030 --> 00:05:52,280
Y lo vas a poner márgen right de 10 píxeles tener un poco de separación.

53
00:05:52,280 --> 00:06:00,770
Sin embargo también puedes notar que que este no está muy alineado no los enlaces deberían estar más

54
00:06:00,770 --> 00:06:13,180
alineados al centro del logo vamos a ponerle también un link de 40 píxeles a cargo y eso va a darnos

55
00:06:13,180 --> 00:06:15,550
un poco más de centrados un poco más

56
00:06:18,440 --> 00:06:23,100
y no tanto.

57
00:06:23,640 --> 00:06:25,430
Esto lo podría también ayudar a centrar.

58
00:06:25,430 --> 00:06:35,360
Otra opción es ponerle un Padín Padín de 10 píxeles y 20 píxeles guardar cambios y recargar.

59
00:06:35,370 --> 00:06:38,700
Eso nos va a hacer como que el botón también sea un poco más grande y un poco de

60
00:06:41,450 --> 00:06:42,170
espacio.

61
00:06:44,380 --> 00:06:45,940
Esto va a ser un un poco más grande.

62
00:06:45,960 --> 00:06:53,070
No hace falta poner un display in Block para que tome efectos igual aquí creo que hace falta ya muy

63
00:06:53,070 --> 00:06:54,540
grande.

64
00:06:54,540 --> 00:06:56,420
Creo que hoy en día se ve bien.

65
00:06:57,970 --> 00:07:07,220
Si se va viendo bien un poco separado tal vez por esto Pardines mucho 10 20 que nos hace falta también

66
00:07:07,240 --> 00:07:16,780
como la parte de que cuando hagamos Joubert no se vea un poco distinto podemos hacerlo aquí en global

67
00:07:18,610 --> 00:07:26,050
copiamos esto y lo pegamos aquí Jover y vamos a ponerle el mismo color naranja de fondo.

68
00:07:26,770 --> 00:07:29,660
Vamos a seleccionar este color.

69
00:07:29,870 --> 00:07:35,600
F 49 18 ponemos un Bagram color de F.

70
00:07:35,620 --> 00:07:44,050
49 18 y recargamos y se va a ver esta forma el marrón se ve así como muy muy sencillo no podemos poner

71
00:07:44,050 --> 00:07:51,890
la quiene en la linea 226 una transición y esto es la sintaxis de la transición.

72
00:07:52,120 --> 00:07:54,760
Luego le pones qué quieres que haga transición de momento para poner al.

73
00:07:54,760 --> 00:08:01,330
Para no evitarnos problemas y luego le pones la duración punto 3 segundos y luego el efecto ya hay varios

74
00:08:01,580 --> 00:08:12,110
para elegir que es el más sencillo recargo y vemos que hace ese efecto como de como de Fait vino degradado.

75
00:08:13,100 --> 00:08:15,640
Si la quieres incrementarlo puedes poner un poco más

76
00:08:18,330 --> 00:08:20,100
y creo que se veía un poco mejor.

77
00:08:20,180 --> 00:08:25,470
Aunque hay algo que nos hace falta el último podemos ver que es un poco distinto así que podemos copiar

78
00:08:25,470 --> 00:08:37,440
éste y pegarlo aquí y ponerle Last Child y queremos que la sal tenga un Border de 2 píxeles Solid y

79
00:08:37,440 --> 00:08:44,100
el mismo color naranja que tenemos en los anteriores vamos a guardar cambios de recargar y saber de

80
00:08:44,100 --> 00:08:55,320
esta forma y este también debe tener el color del mismo naranja que estamos utilizando pues Verloc se

81
00:08:55,320 --> 00:08:56,670
ve un poco mejor.

82
00:09:01,890 --> 00:09:08,890
Cuando llegamos a ver vemos que se pierde así que tendríamos que poner las Chinguel de nuevo las Chaile

83
00:09:08,910 --> 00:09:18,580
Jover y vemos que tenemos aquí el saludo selector dos veces no hay problema color blanco recargamos

84
00:09:19,970 --> 00:09:23,230
y vemos que ahora sí se ve correcto el menú.

85
00:09:23,740 --> 00:09:25,690
Si esto es algo pequeño vemos que desaparece.

86
00:09:25,690 --> 00:09:32,830
No hemos trabajado con esta parte de los españoles vamos a hacerlo en el siguiente vídeo para estar

87
00:09:32,830 --> 00:09:34,920
cerca de finalizar este menú móvil.