cloudcmd/css/style.css
2012-09-07 05:50:06 -04:00

341 lines
No EOL
7.4 KiB
CSS
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

/*
@import url(//fonts.googleapis.com/css?family=Droid+Sans+Mono);
*/
/* Foundation Icons General Enclosed */
/*
@font-face {
font-family: 'FoundationIconsGeneralEnclosed';
src: url('//dl.dropbox.com/u/78163899/mnemonia/fonts/foundation-icons-general-enclosed.woff') format('woff');
font-weight: normal;
font-style: normal;
}
*/
/* символьный шрифт от гитхаба*/
@font-face {
font-family: 'Fontello';
font-style: normal;
font-weight: normal;
src: url('/font/fontello.woff') format('woff');
}
@font-face {
font-family: 'Octicons Regular';
font-style: normal;
font-weight: normal;
src: local('Octicons Regular'), url('/font/Octicons.woff') format('woff');
}
@font-face {
font-family: 'Droid Sans Mono';
font-style: normal;
font-weight: normal;
src: local('Droid Sans Mono'), local('DroidSansMono'), url('http://themes.googleusercontent.com/static/fonts/droidsansmono/v4/ns-m2xQYezAtqh7ai59hJUYuTAAIFFn5GTWtryCmBQ4.woff') format('woff');
}
body{
font:16px "Droid Sans Mono";
}
.menu{
font: 16px 'Octicons Regular';
margin-bottom: 0;
}
.path_icon{
font-family:'FoundationIconsGeneralEnclosed';
font-size:30px;
color: #46A4C3;/*#55BF3F; green*/
text-shadow:black 0 2px 1px;
/* размер иконки и позиция на png-файле*/
width: 15px;
height: 15px;
display: inline-block;
position: relative;
top: 3px;
left: -4px;
}
.path_icon:hover{
/*
color:#45D827;
*/
cursor:pointer;
}
.path_icon:active{
text-shadow:black 0 0 1px;
position: relative;
top: 4px;
}
.icon{
font-family: 'Octicons Regular';
font-size:16px;
width:16px;
height:16px;
display:inline-block;
margin-left:0.5%;
}
.error::before{
bottom : 4px;
content:'\f026';
cursor:default;
color:rgb(222, 41, 41);
position: relative;
}
.loading{
background:url(/img/spinner.gif);
position:relative;
top:1px;
}
.error:hover{
color:rgba(222, 41, 41, 0.81);
}
.refresh-icon{
background:url(/img/panel_refresh.png) no-repeat;
}
.refresh-icon:active{
/*background-position-y: -15px;*/
background:url(/img/panel_refresh.png) 0 -15px no-repeat;
}
.clear-cache{
background:url(/img/console_clear.png) -4px -4px no-repeat;
margin-right: 6px;
margin-left: 7px;
}
.clear-cache:active{
/*
background-position-y: -25px;
*/
top:5px;
}
.settings:before{
content:'k';
}
.links{
color:red;
}
.mini-icon {
float: left;
height: 16px;
left: -5px;
margin-left: 6px;
position: relative;
top: 2px;
width: 16px;
/* отступ перед картинкой
* для нормального отображения
* рамки
*/
}
/* уменьшаем отступ
* между между иконкой и
* именем файла во время
* установления курсора
*/
.current-file > .mini-icon{
left: -6px;
}
/* freeupex */
.directory{
/*list-style-image*/
background-image:url('/img/dir.png');
background-repeat: no-repeat;
background-position: 0 0;
}
.text-file{
/*list-style-image*/
background-image:url('/img/txt.png');
background-repeat: no-repeat;
background-position: 0 0;
}
#fm{
height: 90%;
margin: 10px;
}
.fm_header{
font-weight: bold;
}
#path{
margin-left:1.5%;
}
#left{
float:left;
width:90%;
}
/* фон файла, на котором курсор*/
.current-file{
border: 1.5px solid rgba(49, 123, 249, .40);
}
.selected-file{
background-color: rgba(49, 123, 249, .40);
color:white;
}
#right{
float:right;
}
.panel{
border: 1.5px solid rgba(49, 123, 249, .40);
overflow-y: auto;
width:46%;
}
#keyspanel{
text-align: center;
}
/* информация о файлах и папках*/
.name{
float: left;
width: 37%;
}
.size{
float:left;
width:16%;
/* Ставим выравнивание,
* что бы размер был в
* одной ровной колонке
*/
text-align: right;
/* Ставим отступ, что бы
* size не налазил на uid
* (owner)
*/
margin-right: 27px;
}
.owner{
}
.mode{
float: right;
width: 25%;
}
/* changin ul to panel for high speed parsing*/
.panel, li{
/* making cursor just arrow,
* not text editing cursor
*/
cursor:default;
list-style-type:none;
}
button{
width:10%;
}
a{
text-decoration:none;
}
a:hover, a:active { cursor:pointer;outline: 0; color: #06e; }
a:focus { outline: thin dotted; }
/* Если размер окна очень маленький
* располагаем имя и атрибуты файла
* друг-под-другом
*/
/* responsive design */
@media only screen and (max-width: 600px){
#left{
width:90% !important;
}
.panel >li{
margin:10px;
}
/* если правая панель не помещаеться - прячем её */
#right{
display:none;
}
/* текущий файл под курсором */
.current-file{
background-color: rgba(49, 123, 249, .40);
color:white;
}
/* делаем иконки под курсом белыми*/
.current-file > .mini-icon{
color:white;
}
.current-file > .text-file::before{
color:white;
}
/* меняем иконки на шрифтовые*/
.mini-icon {
font: 60px 'Octicons Regular';
width: 40%;
height: 0;
margin-left: 0;
float: right;
position: relative;
top: -17px;
color: rgba(246, 224, 124, 0.56);
}
.directory::before{
content: '\f216';
}
.text-file::before{
color: rgba(26, 224, 124, 0.56);
content: '\f211';
}
.text-file{
background-image:none;
}
/* убираем заголовок*/
.fm_header{
display:none;
}
.mode,.size,.owner{
/* располагаем элементы
* один под другим
*/
display: table;
float: none;
width: 0;
text-align: left;
}
/* выводим заголовки рядом с полями */
.name::before{
content: 'name:';
font-weight: bold;
font-size: 13px;
}
.mode::before{
content: 'mode:';
font-weight: bold;
font-size: 13px;
}
.size::before{
content: 'size:';
font-weight: bold;
font-size: 13px;
}
.owner::before{
content: 'owner:';
font-weight: bold;
font-size: 13px;
}
.name{
float: none;
width:100%;
font-size: 18px;
}
}
@media only screen and (min-width: 601px) and (max-width: 785px){
#left{
width:90% !important;
}
#right{
display:none;
}
}
@media only screen and (min-width:786px) and (max-width: 1155px){
#left{
width:90% !important;
}
/* если правая панель не помещаеться - прячем её */
#right{
display:none;
}
}