Skip to content
Permalink
Browse files

major changes before beta release to ui

  • Loading branch information
johnnycoyle committed Jun 7, 2017
1 parent 26997d7 commit e3dfc6560d3a4e9b75e0134a8cd8a5663b067592
@@ -1,7 +1,7 @@
@keyframes enter {
0% {
opacity:0;
transform:translateX(200%);
transform:translateX(100%);
}
100%{
transform:translateX(0%);
@@ -4,7 +4,8 @@
html, body {
margin: 0;
padding: 0;
background: #ededed;
/*background:#9ea2a8;*/
background:#2f373e;
font-family: 'Lato', 'sans-serif';
font-weight: thin;
overflow-x:hidden;
@@ -40,25 +41,29 @@ html, body {
display:block;
width:100%;
height:30px;
background: rgba(245,245,245, 1);
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.26);
color:#707070;
/*background: rgba(245,245,245, 1);*/
background:linear-gradient(90deg, #24282d, #1c1c1c);
color:#bcc1c2;
font-size:11px;
top:25%;
box-shadow: 0px 5px 5px 0 rgba(15,15,15,.56);
animation:bannerContainerEnterAnimation 2.5s ease-out;
text-align:center;
z-index:10000;
}

#bannerTitle {
letter-spacing:6px;
position:relative;
margin-left:2%;
top:5px;
font-size:13px;
}

#bannerByLine {
letter-spacing:2px;
padding:0;
position:relative;
top:5px;
color:#919191;
margin-left:2%;
font-size:11px;
@@ -70,33 +75,6 @@ html, body {
width:100%;
}

#toggleMessage{
position:absolute;
text-align:center;
left: 0;
right:0;
top:40px;
margin-right:auto;
margin-left:auto;
font-size:45px;
font-weight:bolder;
font-family: 'Karla', sans-serif;
height:fit-content;
color:rgba(66,66,66,.7);
background: rgba(213,213,213, .3);
box-shadow: 0px 2px 10px 0px rgba(145, 145, 145, 0.66);
padding:5px;
z-index:20;
letter-spacing:30px;
transition: letter-spacing .2s ease-in-out;
background: rgba(139, 237, 255, .25);
}

#toggleMessage:hover{
background: rgba(139, 237, 255, .46);
letter-spacing:32px;
}

@keyframes idleListeningAnimation {
0% {
opacity:1;
@@ -203,8 +181,11 @@ html, body {
#divider{
position:absolute;
width:100%;
height:400px;
background:linear-gradient(#ededed, #e1e1e1);
height:417px;
/*background:#9ea2a8;*/
background:#2f373e;
/*box-shadow: 0 5px 15px 1px rgba(15,15,15,.4);*/
box-shadow: 0px 5px 10px 0px rgba(15,15,15,.76);
animation:slideDown 1s ease-out;
}

@@ -9,13 +9,6 @@ export const colors = {
}

export const graphColors = [
'#ff7f5d', //Orange
'#47e2ff', //Blue
'#8aff7a', //Green
'#36B4CC', //MuteBlue
'#FF5DA3', //Pink
'#FFF176', //Yellow
'#B22F68', //Maroon
'#8276FF', //PurpleBlue
'#CC7036', //Brown
];
'#ffdc00','#E8780C', '#FF0000', '#9768d1', '#0D53FF', '#abc8e2','#45bf55', '#fffefc', 'brown'
];

@@ -24,7 +24,7 @@ $reactBlue: #00d8ff;
margin-left:auto;
width:100%;
height:100%;
margin-top:10px;
margin-top:-15px;
}

#mainContainer.componentOnScreen{
@@ -0,0 +1,11 @@
.unselected{
/*box-shadow: 0 2px 5px 0 rgba(23, 23, 23, 0.46);
background:rgba(155,155,155,.1);
background:red;*/
color:red;
}

.selected{
width:1000px;
background:green;
}
@@ -1,58 +1,71 @@
.tab{
position: relative;
display:block;
height: 20px;
top:20px;
width:fit-content;
font-size: 11px;
border-radius: 4px;
height: fit-content;
top:10px;
width:230px;
margin-left:10px;
font-size: 12px;
font-family:'karla';
color: #dbfaf5;
box-shadow: 0 3px 10px 0 rgba(0, 0, 0, 0.36);
background: rgba(48,53,57, .6);
overflow: auto;
transition: top 1s ease-in-out;
transition: margin 1s ease-in-out;
margin-top:10px;
margin-top:3px;
box-shadow: 5px 5px 10px 0 rgba(15,15,15,.76);
text-overflow: ellipsis;
white-space:nowrap;
}

.tabContainer{
position:relative;
display:block;
height:23px;
padding-top:3px;
padding-bottom:3px;
height:fit-content;
text-align: left;
transition: height 1s ease-in-out;
backface-visibility: hidden;
}

.colorCircle {
height:14px;
width:14px;
position:absolute;
border-radius:12px;
float:left;
margin-top:3px;
margin-top:15px;
margin-left:10px;
margin-right:10px;
}

.tab span {
display:inline-block;
padding-top:2%;
width:fit-content;
display:block;
position:relative;
margin-top:5px;
text-overflow:ellipsis;
overflow:hidden;
left:35px;
width:245px;
border-top: 1px inset rgba(15,15,15,.26);
border-left: 1px inset rgba(15,15,15,.26);
}

.deleteButton{
float:right;
color: rgba(30,30,30,.5);
padding-left:5px;
padding-right:5px;
margin-left:5px;
height: 100%;
background: rgba(115,115,115,.3);
font-size: 15px;
position:absolute;
background:transparent;
left:-5px;
height:100%;
width:40px;
color:white;
padding-top:5px;
text-align:right;
font-size: 15px;
top:20px;
z-index:1;
transition: all .3s ease-in-out;
}

.deleteButton:hover{
color:white;
color:red;
cursor:pointer;
}

0 comments on commit e3dfc65

Please sign in to comment.
You can’t perform that action at this time.