2013-01-09 19:03:58 +01:00

184 lines
2.5 KiB
SCSS

// Place all the styles related to the notes controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/
.note{
//@include box-shadow(0 0 5px rgba(0,0,0,0.5) inset);
@include border-radius(5px);
@include box-shadow(0px 0px 5px rgba(0,0,0,0.5) inset);
position:relative;
margin-bottom:1em;
min-height:120px;
.left{
@include box-shadow(0px 0px 5px rgba(0,0,0,0.5));
@include border-radius(3px 0px 0px 3px);
position:absolute;
top:0px;
left:0px;
bottom:0px;
width:100px;
background:rgba(0,0,0,0.8);
text-align:center;
padding:10px;
color:rgba(255,255,255,0.9);
*{
text-align:center;
}
.avatar{
width:70px;
height:70px;
@include border-radius(50%);
margin:auto;
}
}
.right{
min-height:150px;
margin-left:120px;
padding:10px;
line-height:1.1em;
img{
max-width:100%;
max-height:99%;
}
p,ul{
max-width:600px;
margin-left:100px;
p,ul{
margin-left:0px;
max-width:inherit;
}
}
.large{
max-width:100%;
margin-left:0px;
}
.links{
float:right;
}
}
.bottom{
background:rgb(255, 255, 204);
position:relative;
margin-left:120px;
@include border-radius(0px 0px 3px 0px);
@include box-shadow(0px 0px 2px rgba(0,0,0,0.3),-1px -1px 5px rgba(0,0,0,0.2) inset);
padding:10px;
min-height:1em;
.note_file{
margin:8px 0px;
}
.note_file_queue{
position:absolute;
top:1em;
right:0em;
.file_upload_progress{
width:100px;
}
}
.note_file_form{
float:right;
input[type=file]{
display:none;
}
label{
color: #17b;
cursor:pointer;
&:hover, &:active {
color: #39e;
background-color: none;
outline: none; }
&:link, &:visited, &:hover {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all 0.3s ease; }
&:active {
color: #b41;
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
transition: none; }
}
}
}
}
#file_prev{
position:absolute;
top:10px;
bottom:10px;
background:rgba(0,0,0,0.9);
width:98%;
right:-50%;
@include border-radius(5px);
@include transition(all 1s ease);
&:hover{
right:1%;
}
iframe{
position:absolute;
width:96%;
height:95%;
top:20px;
left:0px;
right:0px;
bottom:0px;
margin:auto;
}
}