1
0
Fork 0

Refine logo

This commit is contained in:
Gregory Eremin 2015-03-10 21:52:01 +07:00
parent e9913127a1
commit 8671c8e2bf
3 changed files with 58 additions and 31 deletions

View File

@ -4,6 +4,7 @@
<meta charset="utf8">
<title>Empact</title>
<link rel="stylesheet" href="/bower_components/normalize.css/normalize.css">
<link rel="stylesheet" href="/styles/logo.css">
<link rel="stylesheet" href="/styles/app.css">
<link rel="stylesheet" href="/styles/charts.css">
</head>

View File

@ -2,37 +2,6 @@
box-sizing: border-box;
}
.logo {
display: inline-block;
line-height: 32px;
letter-spacing: 5px;
padding: 0 5px;
color: #fff;
text-shadow: 0 1px 1px rgba(0, 0, 0, .5);
font-weight: 600;
}
.logo.e {
float: left;
width: 30px;
padding-left: 10px;
background-color: #f5d059;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.logo.mp {
float: left;
margin-left: -5px;
background-color: #f39d41;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.logo.act {
background-color: #ef7126;
margin-left: -5px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
section {
float: left;
}

57
app/styles/logo.css Normal file
View File

@ -0,0 +1,57 @@
.logo-button {
display: inline-block;
width: auto;
box-shadow: 1px 1px 1px 0px rgba(0, 0, 0, .6);
border-radius: 5px;
}
/* Single letter */
.logo {
display: inline-block;
float: left;
font-family: Courier, monospace;
font-size: 22px;
padding: 4px 5px 6px;
color: #fff;
text-shadow: 0 -1px 0 rgba(0, 0, 0, .5);
font-weight: 600;
}
/* Colors */
.logo.e {
background-color: #faca50;
}
.logo.m, .logo.p {
background-color: #f39d41;
}
.logo.a, .logo.c, .logo.t {
background-color: #ef7126;
}
/* Letters */
.logo.e {
width: 32px;
padding-left: 10px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.logo.m {
width: 21px;
margin-left: -5px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
}
.logo.p {
width: 22px;
}
.logo.a {
width: 21px;
}
.logo.c {
width: 20px;
}
.logo.t {
width: 29px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}