Skip to content

Commit d15fc2e

Browse files
committed
20240621_002
1 parent 5a60f19 commit d15fc2e

File tree

2 files changed

+144
-107
lines changed

2 files changed

+144
-107
lines changed
Lines changed: 127 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,127 @@
1+
* {
2+
margin: 0;
3+
padding: 0;
4+
-webkit-box-sizing: border-box;
5+
-moz-box-sizing: border-box;
6+
box-sizing: border-box;
7+
}
8+
9+
body {
10+
background-size: cover;
11+
background-attachment: fixed;
12+
font-family: sans-serif;
13+
font-weight: normal;
14+
font-size: 100%;
15+
color: #a6d6ef;
16+
margin: 0;
17+
background-color: #0f4c75;
18+
}
19+
20+
.contenedor-form {
21+
background: rgba(16, 0, 63, 0.7);
22+
max-width: 500px;
23+
width: 100%;
24+
margin: 48px auto;
25+
border-radius: 5px;
26+
color: #fff;
27+
position: relative;
28+
/*padding: 40px;*/
29+
}
30+
31+
.contenedor-form .toggle {
32+
position: absolute;
33+
top: 7px;
34+
right: 7px;
35+
width: 100px;
36+
height: 30px;
37+
font-size: 12px;
38+
line-height: 25px;
39+
text-align: center;
40+
border-top: 2px solid #7fb7f3;
41+
border-bottom: 2px solid #7fb7f3;
42+
cursor: pointer;
43+
transition: all .5s ease;
44+
}
45+
46+
.contenedor-form .toggle:hover {
47+
border-top: 2px solid #0075d9;
48+
border-bottom: 2px solid #0075d9;
49+
}
50+
51+
.contenedor-form .toggle span {
52+
letter-spacing: 1px;
53+
}
54+
55+
.contenedor-form h2 {
56+
margin: 0 0 28px 0;
57+
font-size: 20px;
58+
font-weight: 400;
59+
line-height: 1;
60+
}
61+
.contenedor-form input[type="text"],
62+
.contenedor-form input[type="password"],
63+
.contenedor-form input[type="email"] {
64+
outline: none;
65+
display: block;
66+
width: 100%;
67+
padding: 10px 15px;
68+
margin: 0 0 20px 0;
69+
background: rgba(0,0,0,.5);
70+
color: #fff;
71+
border: none;
72+
border-radius: 2px;
73+
border-bottom: 4px solid #7fb7f3;
74+
box-sizing: border-box;
75+
font-family: sans-serif;
76+
font-size: 14px;
77+
font-weight:normal;
78+
transition: all .5s ease;
79+
}
80+
81+
.contenedor-form input[type="text"]:focus,
82+
.contenedor-form input[type="password"]:focus,
83+
.contenedor-form input[type="email"]:focus {
84+
border-bottom: 4px solid whitesmoke;
85+
}
86+
87+
.contenedor-form input[type="submit"] {
88+
background: #7fb7f3;
89+
color: rgba(16, 0, 63, 0.7);
90+
width: 100%;
91+
border: none;
92+
padding: 10px 0;
93+
font-size: 16px;
94+
font-weight: bolder;
95+
font-family: sans-serif;
96+
letter-spacing: 1px;
97+
cursor: pointer;
98+
transition: all .5s ease;
99+
}
100+
101+
.contenedor-form input[type="submit"]:hover {
102+
background: whitesmoke;
103+
}
104+
105+
.contenedor-form .reset-password {
106+
background: rgba(0, 117, 217, .7);
107+
width: 100%;
108+
padding: 15px 0;
109+
text-align: center;
110+
border-bottom-left-radius: 5px;
111+
border-bottom-right-radius: 5px;
112+
}
113+
114+
.contenedor-form .reset-password a {
115+
color: #fff;
116+
text-decoration: none;
117+
font-size: 16px;
118+
}
119+
120+
.contenedor-form .formulario {
121+
display: none;
122+
padding: 40px;
123+
}
124+
125+
.contenedor-form .formulario:nth-child(2) {
126+
display: block;
127+
}
Lines changed: 17 additions & 107 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,6 @@
11
* {
22
margin: 0;
33
padding: 0;
4-
-webkit-box-sizing: border-box;
5-
-moz-box-sizing: border-box;
64
box-sizing: border-box;
75
}
86

@@ -16,112 +14,24 @@ body {
1614
margin: 0;
1715
background-color: #0f4c75;
1816
}
19-
20-
.contenedor-form {
21-
background: rgba(16, 0, 63, 0.7);
22-
max-width: 500px;
23-
width: 100%;
24-
margin: 48px auto;
25-
border-radius: 5px;
26-
color: #fff;
27-
position: relative;
28-
/*padding: 40px;*/
29-
}
30-
31-
.contenedor-form .toggle {
32-
position: absolute;
33-
top: 7px;
34-
right: 7px;
35-
width: 100px;
36-
height: 30px;
37-
font-size: 12px;
38-
line-height: 25px;
39-
text-align: center;
40-
border-top: 2px solid #7fb7f3;
41-
border-bottom: 2px solid #7fb7f3;
42-
cursor: pointer;
43-
transition: all .5s ease;
44-
}
45-
46-
.contenedor-form .toggle:hover {
47-
border-top: 2px solid #0075d9;
48-
border-bottom: 2px solid #0075d9;
49-
}
50-
51-
.contenedor-form .toggle span {
52-
letter-spacing: 1px;
53-
}
54-
55-
.contenedor-form h2 {
56-
margin: 0 0 28px 0;
57-
font-size: 20px;
58-
font-weight: 400;
59-
line-height: 1;
60-
}
61-
.contenedor-form input[type="text"],
62-
.contenedor-form input[type="password"],
63-
.contenedor-form input[type="email"] {
64-
outline: none;
65-
display: block;
66-
width: 100%;
67-
padding: 10px 15px;
68-
margin: 0 0 20px 0;
69-
background: rgba(0,0,0,.5);
70-
color: #fff;
71-
border: none;
72-
border-radius: 2px;
73-
border-bottom: 4px solid #7fb7f3;
74-
box-sizing: border-box;
75-
font-family: sans-serif;
76-
font-size: 14px;
77-
font-weight:normal;
78-
transition: all .5s ease;
17+
#mensajeRegistro {
18+
text-transform: uppercase;
19+
font-family: 'Times New Roman';
20+
color: greenyellow;
7921
}
8022

81-
.contenedor-form input[type="text"]:focus,
82-
.contenedor-form input[type="password"]:focus,
83-
.contenedor-form input[type="email"]:focus {
84-
border-bottom: 4px solid whitesmoke;
85-
}
86-
87-
.contenedor-form input[type="submit"] {
88-
background: #7fb7f3;
89-
color: rgba(16, 0, 63, 0.7);
90-
width: 100%;
91-
border: none;
92-
padding: 10px 0;
93-
font-size: 16px;
94-
font-weight: bolder;
95-
font-family: sans-serif;
96-
letter-spacing: 1px;
97-
cursor: pointer;
98-
transition: all .5s ease;
99-
}
100-
101-
.contenedor-form input[type="submit"]:hover {
102-
background: whitesmoke;
103-
}
23+
.formuser {
24+
display: none;
25+
}
10426

105-
.contenedor-form .reset-password {
106-
background: rgba(0, 117, 217, .7);
107-
width: 100%;
108-
padding: 15px 0;
109-
text-align: center;
110-
border-bottom-left-radius: 5px;
111-
border-bottom-right-radius: 5px;
112-
}
113-
114-
.contenedor-form .reset-password a {
115-
color: #fff;
116-
text-decoration: none;
117-
font-size: 16px;
118-
}
27+
.btnLogin, .btnRegistro {
28+
border: 5px solid #eeeff1; /*anchura, estilo y color borde*/
29+
padding: 10px; /*espacio alrededor texto*/
30+
background-color: #2e518b; /*color botón*/
31+
color: #ffffff; /*color texto*/
32+
text-decoration: none; /*decoración texto*/
33+
text-transform: uppercase; /*capitalización texto*/
34+
font-family: 'Helvetica', sans-serif; /*tipografía texto*/
35+
border-radius: 50px; /*bordes redondos*/
36+
}
11937

120-
.contenedor-form .formulario {
121-
display: none;
122-
padding: 40px;
123-
}
124-
125-
.contenedor-form .formulario:nth-child(2) {
126-
display: block;
127-
}

0 commit comments

Comments
 (0)