Skip to content

Commit 2c7296d

Browse files
gitketgitket
committed
forgot to add css files
1 parent fe32ba2 commit 2c7296d

File tree

2 files changed

+286
-0
lines changed

2 files changed

+286
-0
lines changed

‎output/css/style.css‎

Lines changed: 123 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,123 @@
1+
@import url("https://fonts.googleapis.com/css?family=Open+Sans:400,600,700");
2+
@import url("https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css");
3+
*, *:before, *:after {
4+
margin: 0;
5+
padding: 0;
6+
box-sizing: border-box;
7+
}
8+
9+
html, body {
10+
height: 100vh;
11+
}
12+
13+
body {
14+
font: 14px/1 'Open Sans', sans-serif;
15+
color: #ffffff;
16+
background: #555 !important;
17+
}
18+
19+
h1 {
20+
padding: 50px 0;
21+
font-weight: 400;
22+
text-align: center;
23+
}
24+
25+
p {
26+
margin: 0 0 20px;
27+
line-height: 1.5;
28+
}
29+
30+
main {
31+
min-width: 320px;
32+
max-width: 1400px;
33+
padding: 50px;
34+
margin: 0 auto;
35+
background: #555;
36+
}
37+
38+
section {
39+
display: none;
40+
padding: 20px 0 0;
41+
border-top: 1px solid #ddd;
42+
color: #ffffff;
43+
background: #555;
44+
}
45+
46+
input {
47+
display: none;
48+
}
49+
50+
label {
51+
display: inline-block;
52+
margin: 0 0 -1px;
53+
padding: 15px 25px;
54+
font-weight: 600;
55+
text-align: center;
56+
color: #ffffff;
57+
border: 1px solid transparent;
58+
}
59+
60+
label:before {
61+
font-family: fontawesome;
62+
font-weight: normal;
63+
margin-right: 10px;
64+
}
65+
66+
label[for*='1']:before {
67+
content: '\f0d0';
68+
}
69+
70+
label[for*='2']:before {
71+
content: '\f1fe';
72+
}
73+
74+
label[for*='3']:before {
75+
content: '\f1fe';
76+
}
77+
78+
label[for*='4']:before {
79+
content: '\f1fe';
80+
}
81+
82+
label:hover {
83+
color: #888;
84+
cursor: pointer;
85+
}
86+
87+
input:checked + label {
88+
color: #ffffff;
89+
border: 1px solid #ddd;
90+
border-top: 2px solid #fff;
91+
border-bottom: 1px solid #fff;
92+
}
93+
94+
#tab1:checked ~ #content1,
95+
#tab2:checked ~ #content2,
96+
#tab3:checked ~ #content3,
97+
#tab4:checked ~ #content4 {
98+
display: block;
99+
}
100+
101+
@media screen and (max-width: 650px) {
102+
label {
103+
font-size: 0;
104+
}
105+
106+
label:before {
107+
margin: 0;
108+
font-size: 18px;
109+
}
110+
}
111+
@media screen and (max-width: 400px) {
112+
label {
113+
padding: 15px;
114+
}
115+
}
116+
117+
input[type="text"], textarea {
118+
border: 1px solid #ccc;
119+
-moz-border-radius: 10px;
120+
-webkit-border-radius: 10px;
121+
border-radius: 10px;
122+
resize: none;
123+
}

‎output/css/styles.css‎

Lines changed: 163 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,163 @@
1+
#cssmenu,
2+
#cssmenu ul,
3+
#cssmenu li,
4+
#cssmenu a {
5+
border: none;
6+
line-height: 1;
7+
margin: 0;
8+
padding: 0;
9+
}
10+
#cssmenu {
11+
height: 37px;
12+
display: block;
13+
border: 1px solid;
14+
border-radius: 5px;
15+
width: auto;
16+
border-color: #080808;
17+
margin: 0;
18+
padding: 0;
19+
}
20+
#cssmenu > ul {
21+
list-style: inside none;
22+
margin: 0;
23+
padding: 0;
24+
}
25+
#cssmenu > ul > li {
26+
list-style: inside none;
27+
float: left;
28+
display: inline-block;
29+
position: relative;
30+
margin: 0;
31+
padding: 0;
32+
}
33+
#cssmenu.align-center > ul {
34+
text-align: center;
35+
}
36+
#cssmenu.align-center > ul > li {
37+
float: none;
38+
margin-left: -3px;
39+
}
40+
#cssmenu.align-center ul ul {
41+
text-align: left;
42+
}
43+
#cssmenu.align-center > ul > li:first-child > a {
44+
border-radius: 0;
45+
}
46+
#cssmenu > ul > li > a {
47+
outline: none;
48+
display: block;
49+
position: relative;
50+
text-align: center;
51+
text-decoration: none;
52+
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);
53+
font-weight: 700;
54+
font-size: 13px;
55+
font-family: Arial, Helvetica, sans-serif;
56+
border-right: 1px solid #080808;
57+
color: #ffffff;
58+
padding: 12px 20px;
59+
}
60+
#cssmenu > ul > li:first-child > a {
61+
border-radius: 5px 0 0 5px;
62+
}
63+
#cssmenu > ul > li > a:after {
64+
content: "";
65+
position: absolute;
66+
border-right: 1px solid;
67+
top: -1px;
68+
bottom: -1px;
69+
right: -2px;
70+
z-index: 99;
71+
border-color: #3c3c3c;
72+
}
73+
#cssmenu ul li.has-sub:hover > a:after {
74+
top: 0;
75+
bottom: 0;
76+
}
77+
#cssmenu > ul > li.has-sub > a:before {
78+
content: "";
79+
position: absolute;
80+
top: 18px;
81+
right: 6px;
82+
border: 5px solid transparent;
83+
border-top: 5px solid #ffffff;
84+
}
85+
#cssmenu > ul > li.has-sub:hover > a:before {
86+
top: 19px;
87+
}
88+
#cssmenu > ul > li.has-sub:hover > a {
89+
padding-bottom: 14px;
90+
z-index: 999;
91+
border-color: #3f3f3f;
92+
}
93+
#cssmenu ul li.has-sub:hover > ul,
94+
#cssmenu ul li.has-sub:hover > div {
95+
display: block;
96+
}
97+
#cssmenu > ul > li.has-sub > a:hover,
98+
#cssmenu > ul > li.has-sub:hover > a {
99+
background: #3f3f3f;
100+
border-color: #3f3f3f;
101+
}
102+
#cssmenu ul li > ul,
103+
#cssmenu ul li > div {
104+
display: none;
105+
width: auto;
106+
position: absolute;
107+
top: 38px;
108+
background: #3f3f3f;
109+
border-radius: 0 0 5px 5px;
110+
z-index: 999;
111+
padding: 10px 0;
112+
}
113+
#cssmenu ul li > ul {
114+
width: 200px;
115+
}
116+
#cssmenu ul ul ul {
117+
position: absolute;
118+
}
119+
#cssmenu ul ul li:hover > ul {
120+
left: 100%;
121+
top: -10px;
122+
border-radius: 5px;
123+
}
124+
#cssmenu ul li > ul li {
125+
display: block;
126+
list-style: inside none;
127+
position: relative;
128+
margin: 0;
129+
padding: 0;
130+
}
131+
#cssmenu ul li > ul li a {
132+
outline: none;
133+
display: block;
134+
position: relative;
135+
font: 10pt Arial, Helvetica, sans-serif;
136+
color: #ffffff;
137+
text-decoration: none;
138+
text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.5);
139+
margin: 0;
140+
padding: 8px 20px;
141+
}
142+
#cssmenu,
143+
#cssmenu ul ul > li:hover > a,
144+
#cssmenu ul ul li a:hover {
145+
background: #3c3c3c;
146+
background: -moz-linear-gradient(top, #3c3c3c 0%, #222222 100%);
147+
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3c3c3c), color-stop(100%, #222222));
148+
background: -webkit-linear-gradient(top, #3c3c3c 0%, #222222 100%);
149+
background: -o-linear-gradient(top, #3c3c3c 0%, #222222 100%);
150+
background: -ms-linear-gradient(top, #3c3c3c 0%, #222222 100%);
151+
background: linear-gradient(top, #3c3c3c 0%, #222222 100%);
152+
}
153+
#cssmenu > ul > li > a:hover {
154+
background: #080808;
155+
color: #ffffff;
156+
}
157+
#cssmenu ul ul a:hover {
158+
color: #ffffff;
159+
}
160+
#cssmenu > ul > li.has-sub > a:hover:before {
161+
border-top: 5px solid #ffffff;
162+
}
163+

0 commit comments

Comments
 (0)