1
00:00:00,330 --> 00:00:05,070
Enviamos la plantilla resultado, ya tenemos agregado el link, es decir, la hoja, hojas, estilo.

2
00:00:05,340 --> 00:00:11,700
Ahora tenemos que dar estilo, decorar nuestro we lely con el resultado, tanto el usuario como roles,

3
00:00:11,800 --> 00:00:13,140
bueno, los roles del usuario también.

4
00:00:13,230 --> 00:00:17,850
Lo primero en VOSTRA existe y podemos dar estilo a nuestras listas.

5
00:00:17,940 --> 00:00:24,420
Por ejemplo, utilizando la clase List Group List Group se utiliza en él.

6
00:00:24,480 --> 00:00:27,690
Uele entonces el list de lista grupo.

7
00:00:29,690 --> 00:00:38,230
Copiamos, pegamos también acá en los roles y también vamos a tener una clase por Calí que parecía,

8
00:00:38,630 --> 00:00:42,350
pero voy a pegar acá en vez del disco loop a secas.

9
00:00:42,440 --> 00:00:45,080
El list group item, guión, item.

10
00:00:45,980 --> 00:00:48,740
Entonces por cada uno un list group ítem.

11
00:01:01,100 --> 00:01:01,770
Guardamos.

12
00:01:02,180 --> 00:01:02,840
Vamos a probar.

13
00:01:03,110 --> 00:01:04,700
Bueno, ya tengo levantado el Wacken.

14
00:01:04,790 --> 00:01:06,330
La aplicación de Sprint.

15
00:01:06,470 --> 00:01:08,780
Así que voy a completar el ejemplo.

16
00:01:08,810 --> 00:01:09,500
Hombre!

17
00:01:12,060 --> 00:01:13,410
Se digan que a mucho me ordenó.

18
00:01:18,830 --> 00:01:20,900
Enviar a 12.

19
00:01:25,850 --> 00:01:27,200
DILIGEN quedó mejor.

20
00:01:27,290 --> 00:01:36,290
Quedó como una lista, pero también le podemos dar formato también un tif div con class container.

21
00:01:38,240 --> 00:01:44,360
Recuerden que el cierre al final por acá antes del body vamos a ordenar.

22
00:01:47,540 --> 00:01:49,100
Y lo dejamos así guardamos.

23
00:01:49,910 --> 00:01:52,940
Recuerden que actualizamos, redirige a formulario y está perfecto.

24
00:01:53,030 --> 00:01:54,170
Entonces volvemos a enviar.

25
00:01:59,460 --> 00:02:01,620
Una fecha han pasado 12.

26
00:02:03,240 --> 00:02:08,110
Empieso que mejor se dejan como una lista, pero podríamos dar un título.

27
00:02:08,230 --> 00:02:15,820
Es decir, agregar otro li o list group item con el título y que quede marcado un color tanto para roles

28
00:02:15,820 --> 00:02:19,300
como para el resultado o los datos del usuario.

29
00:02:19,480 --> 00:02:22,510
Entonces, por ejemplo, vamos a copiar un li.

30
00:02:23,260 --> 00:02:28,300
El primero lo pegamos acá en vez de esto.

31
00:02:28,660 --> 00:02:33,880
El texto lo he kitar y voy a cortar el título y lo voy a pegar acá.

32
00:02:34,930 --> 00:02:36,820
Y este h3 lo quitamos.

33
00:02:37,150 --> 00:02:39,930
Este título se quita y lo dejamos como activ.

34
00:02:40,960 --> 00:02:42,010
Como activo.

35
00:02:42,820 --> 00:02:44,560
Voy a copiar también esto acá.

36
00:02:45,910 --> 00:02:55,960
Lo pegamos en roles abajo dentro del uele y voy a cambiar este th texto, lo cambiamos por esto.

37
00:02:56,770 --> 00:02:58,720
Eso sería una alternativa o bien.

38
00:02:59,780 --> 00:03:07,400
Quito esto de acá, comilla simple y lo pegamos y lo dejamos como un string comilla simple, roles con

39
00:03:07,400 --> 00:03:10,160
ese texto y este div lo quitamos.

40
00:03:10,940 --> 00:03:11,690
Guardamos.

41
00:03:13,830 --> 00:03:14,760
Volvemos a enviar.

42
00:03:26,660 --> 00:03:27,260
Mucho mejor.

43
00:03:27,620 --> 00:03:34,760
También podríamos dar un margen vertical, es decir, separar el div group de arriba del top y roles

44
00:03:34,760 --> 00:03:36,350
también porque está muy pegado.

45
00:03:36,710 --> 00:03:37,340
Bien simple.

46
00:03:37,430 --> 00:03:46,310
Acá en el Whele List Group te damos un margen M de margen y vertical del eje y del eje vertical.

47
00:03:46,490 --> 00:03:49,640
Por ejemplo, de tres voy a copiar esto mismo.

48
00:03:50,060 --> 00:03:51,230
M 3.

49
00:03:51,920 --> 00:03:52,640
Lo pegamos acá.

50
00:03:54,170 --> 00:03:54,860
Guardamos.

51
00:04:05,730 --> 00:04:07,410
Vamos a agregar los tres roles.

52
00:04:09,730 --> 00:04:15,880
Enviar diligen que o separado o separado, incluso le podríamos dar más espacio, preguntó Está bien.

53
00:04:17,500 --> 00:04:18,130
Está perfecto.

54
00:04:18,250 --> 00:04:19,000
Ahí lo tenemos.

55
00:04:19,090 --> 00:04:21,910
Quizás podríamos agregar un botón para volver al formulario.

56
00:04:22,000 --> 00:04:23,580
Acá una que se pierda datos.

57
00:04:23,680 --> 00:04:27,280
Volver, volver al formulario o al DITADO a donde queramos.

58
00:04:27,610 --> 00:04:33,550
Entonces, debajo del div container, al mismo nivel del huele.

59
00:04:34,240 --> 00:04:40,390
Vamos a tener un a un href pero con lif th 2 punto href.

60
00:04:41,560 --> 00:04:46,330
Recuerden siempre las rutas de Spring a los controladores van con él.

61
00:04:46,330 --> 00:04:52,120
Arroja las llaves es el larch y la ruta form de formulario.

62
00:04:54,120 --> 00:05:05,830
Volver y le damos un estilo de vostra, una clase btn, btn, primary o sucesso, incluso sauces o sus

63
00:05:05,970 --> 00:05:09,540
btn, btn, sucesi de color verde guardamos.

64
00:05:09,690 --> 00:05:12,870
También le podríamos dar un margen, por ejemplo, también de 3.

65
00:05:13,890 --> 00:05:15,810
Lo voy a cortar y lo pegamos acá.

66
00:05:16,650 --> 00:05:22,110
Entonces va a tener este botón una separación con el container de arriba y también con el grupo.

67
00:05:23,040 --> 00:05:27,900
Y acá lo corté, acá lo voy a pegar también y acá lo dejamos en dos.

68
00:05:30,280 --> 00:05:32,200
Un margen de dos guardamos.

69
00:05:33,400 --> 00:05:37,030
Actualizamos y volvemos a enviar, por ejemplo, ya mujer.

70
00:05:40,660 --> 00:05:41,560
Administrador.

71
00:05:54,170 --> 00:05:54,710
Enviar.

72
00:05:56,030 --> 00:05:56,680
Ahí está el botón.

73
00:05:56,920 --> 00:06:05,200
También si queremos un botón más grande podemos colocar btn, btn, succés y por acá btn guión larch

74
00:06:05,380 --> 00:06:07,660
elegia de grande o latch.

75
00:06:07,900 --> 00:06:08,620
Guardamos.

76
00:06:09,780 --> 00:06:10,410
Bolver.

77
00:06:21,670 --> 00:06:23,170
Un poco más grande y está molesto.

78
00:06:23,260 --> 00:06:28,480
Acá tenemos el Disk Group para el resultad formulario para los datos del usuario, nombre y apellido,

79
00:06:28,570 --> 00:06:36,130
el Yussef, el password en Por cada uno y acá otro list group para los roles y el botón Volver.

80
00:06:36,850 --> 00:06:37,240
Bien.

81
00:06:37,390 --> 00:06:37,990
Nada más.

82
00:06:38,080 --> 00:06:39,610
Nos vemos en la siguiente clase.
