Skip to content

Commit 39c3e84

Browse files
author
Vitaly Kryukov
authored
Update styles.css
1 parent 0aaf0ee commit 39c3e84

File tree

1 file changed

+165
-27
lines changed

1 file changed

+165
-27
lines changed

messenger-comparison/css/styles.css

Lines changed: 165 additions & 27 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,165 @@
1-
*{font-family:'Noto Sans', sans-serif;}
2-
body{text-align:center;}
3-
div.language{position:absolute;top:15px;left:15px;}
4-
section.main{display:inline-block;margin:30px;}
5-
#ms-edge-wrapper{border-radius:3px;-moz-box-shadow:0 0 0 1px #c8c8c8;-webkit-box-shadow:0 0 0 1px #c8c8c8;box-shadow:0 0 0 1px #c8c8c8;filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius=3, MakeShadow=true, ShadowOpacity=0.30);-ms-filter:"progid:DXImageTransform.Microsoft.Blur(PixelRadius=3,MakeShadow=true,ShadowOpacity=0.30)";zoom:1;}
6-
h1.headline{margin:0px 0px 38px 0px;}
7-
a:link, a:visited, a:hover, a:active{color:#000;text-decoration:none;border-bottom:.1em solid rgba(0, 0, 0, .7);border-bottom-color:rgba(0, 0, 0, 0.7);border-bottom-style:solid;border-bottom-width:0.1em;}
8-
table{position:relative;border-spacing:0;border-collapse:collapse;border-style:hidden;-webkit-border-radius:3px;border-radius:3px;-moz-box-shadow:0 0 0 1px #c8c8c8;-webkit-box-shadow:0 0 0 1px #c8c8c8;box-shadow:0 0 0 1px #c8c8c8;}
9-
th, td{border:1px solid #c8c8c8;text-align:center;vertical-align:middle;padding:10px 5px 10px 5px;font-size:14px;}
10-
th{height:35px;}
11-
th:first-child{-webkit-border-radius:3px 0 0 0;border-radius:3px 0 0 0;}
12-
th:last-child{-webkit-border-radius:0 3px 0 0;border-radius:0 3px 0 0;}
13-
td.bottom-left{-webkit-border-radius:0 0 0 3px;border-radius:0 0 0 3px;}
14-
tr:last-child td:last-child{-webkit-border-radius:0 0 3px 0;border-radius:0 0 3px 0;}
15-
.group-col{width:70px;}
16-
.aspect-col{width:200px;}
17-
.feature-col{width:200px;}
18-
.service-col{width:250px;}
19-
.telegram-icon{background-image:url('../icons/TelegramIcon.png');}
20-
.viber-icon{background-image:url('../icons/ViberIcon.png');}
21-
.whatsapp-icon{background-image:url('../icons/WhatsAppIcon.png');}
22-
.telegram-icon, .viber-icon, .whatsapp-icon{background-repeat:no-repeat;background-size:20px;background-position:0px 5px;padding:5px 25px 5px 25px;}
23-
.group-text{-webkit-transform:rotate(180deg);transform:rotate(180deg);writing-mode:tb-rl;writing-mode:vertical-rl;white-space:nowrap;vertical-align:middle;margin:17px;}
24-
.advantage{background-color:#d1ff82;border:1px solid #b1b1b1;}
25-
.mediocrity{background-color:#fff394;border:1px solid #b1b1b1;}
26-
.disadvantage{background-color:#ffbaba;border:1px solid #b1b1b1;}
27-
p.updated-date{margin:30px 10px 20px 10px;font-size:13px;font-style:italic;text-align:right;}
1+
* {
2+
font-family: 'Noto Sans', sans-serif;
3+
}
4+
5+
body {
6+
text-align: center;
7+
}
8+
9+
div.language {
10+
position: absolute;
11+
top: 15px;
12+
left: 15px;
13+
}
14+
15+
div.language * {
16+
display: inline;
17+
margin-left: 3px;
18+
margin-right: 3px;
19+
}
20+
21+
section.main {
22+
display: inline-block;
23+
margin: 30px;
24+
}
25+
26+
#ms-edge-wrapper {
27+
border-radius: 3px;
28+
-moz-box-shadow: 0 0 0 1px #c8c8c8;
29+
-webkit-box-shadow: 0 0 0 1px #c8c8c8;
30+
box-shadow: 0 0 0 1px #c8c8c8;
31+
filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=3, MakeShadow=true, ShadowOpacity=0.30);
32+
-ms-filter: "progid:DXImageTransform.Microsoft.Blur(PixelRadius=3,MakeShadow=true,ShadowOpacity=0.30)";
33+
zoom: 1;
34+
}
35+
36+
h1.headline {
37+
margin: 0px 0px 38px 0px;
38+
}
39+
40+
a:link, a:visited, a:hover, a:active {
41+
color: #000;
42+
text-decoration: none;
43+
border-bottom: .1em solid rgba(0, 0, 0, .7);
44+
border-bottom-color: rgba(0, 0, 0, 0.7);
45+
border-bottom-style: solid;
46+
border-bottom-width: 0.1em;
47+
}
48+
49+
/*Table Configuration*/
50+
51+
table {
52+
position: relative;
53+
54+
border-spacing: 0;
55+
border-collapse: collapse;
56+
border-style: hidden;
57+
-webkit-border-radius: 3px;
58+
border-radius: 3px;
59+
-moz-box-shadow: 0 0 0 1px #c8c8c8;
60+
-webkit-box-shadow: 0 0 0 1px #c8c8c8;
61+
box-shadow: 0 0 0 1px #c8c8c8;
62+
}
63+
64+
th, td {
65+
border: 1px solid #c8c8c8;
66+
text-align: center;
67+
vertical-align: middle;
68+
padding: 10px 5px 10px 5px;
69+
font-size: 14px;
70+
}
71+
72+
th {
73+
height: 35px;
74+
}
75+
76+
th:first-child {
77+
-webkit-border-radius: 3px 0 0 0;
78+
border-radius: 3px 0 0 0;
79+
}
80+
81+
th:last-child {
82+
-webkit-border-radius: 0 3px 0 0;
83+
border-radius: 0 3px 0 0;
84+
}
85+
86+
td.bottom-left {
87+
-webkit-border-radius: 0 0 0 3px;
88+
border-radius: 0 0 0 3px;
89+
}
90+
91+
tr:last-child td:last-child {
92+
-webkit-border-radius: 0 0 3px 0;
93+
border-radius: 0 0 3px 0;
94+
}
95+
96+
.group-col {
97+
width: 70px;
98+
}
99+
100+
.aspect-col {
101+
width: 200px;
102+
}
103+
104+
.feature-col {
105+
width: 200px;
106+
}
107+
108+
.service-col {
109+
width: 250px;
110+
}
111+
112+
/*Messenger Icons*/
113+
114+
.telegram-icon {
115+
background-image: url('../icons/TelegramIcon.png');
116+
}
117+
118+
.viber-icon {
119+
background-image: url('../icons/ViberIcon.png');
120+
}
121+
122+
.whatsapp-icon {
123+
background-image: url('../icons/WhatsAppIcon.png');
124+
}
125+
126+
.telegram-icon, .viber-icon, .whatsapp-icon {
127+
background-repeat: no-repeat;
128+
background-size: 20px;
129+
background-position: 0px 5px;
130+
padding: 5px 25px 5px 25px;
131+
}
132+
133+
/*Cells Classes*/
134+
135+
.group-text {
136+
-webkit-transform: rotate(180deg);
137+
transform: rotate(180deg);
138+
writing-mode: tb-rl;
139+
writing-mode: vertical-rl;
140+
white-space: nowrap;
141+
vertical-align: middle;
142+
margin: 17px;
143+
}
144+
145+
.advantage {
146+
background-color: #d1ff82;
147+
border: 1px solid #b1b1b1;
148+
}
149+
150+
.mediocrity {
151+
background-color: #fff394;
152+
border: 1px solid #b1b1b1;
153+
}
154+
155+
.disadvantage {
156+
background-color: #ffbaba;
157+
border: 1px solid #b1b1b1;
158+
}
159+
160+
p.updated-date {
161+
margin: 30px 10px 20px 10px;
162+
font-size: 13px;
163+
font-style: italic;
164+
text-align: right;
165+
}

0 commit comments

Comments
 (0)