/**
* depends on bootstrap
*
* html { box-sizing: border-box; }
* body { background: #fff; }
* p { margin-top:0; margin-bottom:1rem; }
*
**/
/**
* CONTENTS
*
* Font Icons
* icon-xx ...............Font Awesome 3.2.1 by Dave Gandy
* sf2-icon-xx ...........seafile-font2
*
* Reset
* tags ..................reset styles of tags
*
* Helper
* common class ..........common class
*
* UI Widgets(ui widgets)
* path
* btn-group
* paginator
* caret
* tabnav
* jquery tabs
* left-right-tabs
* side-tabnav
* (...)
* messages
* narrow-panel
* new-narrow-panel
* text-panel
* tab-tabs
* tab-popup
* op-confirm ()
* simplemodal
* ui-autocomplete ()
* article
* obv-btn
* sf-popover
* user-item
* sf-dropdown
* discussions/comments
* custom select2
* custom magnificPopup
*
* Container
* Container ......... common container styles
*
* Separate pages
*
*/
/*
* z-index:
* sf-popover: 20
*
*/
/****** icon-xx ********/
/* Font Awesome 3.2.1 by Dave Gandy - http://fortawesome.github.com/Font-Awesome */
@font-face {
font-family: 'FontAwesome';
src: url('font/fontawesome-webfont.eot?v=3.0.1');
src: url('font/fontawesome-webfont.eot?#iefix&v=3.0.1') format('embedded-opentype'),
url('font/fontawesome-webfont.woff?v=3.0.1') format('woff'),
url('font/fontawesome-webfont.ttf?v=3.0.1') format('truetype');
font-weight: normal;
font-style: normal;
}
[class^="icon-"],
[class*=" icon-"] {
font-family: FontAwesome;
font-weight: normal;
font-style: normal;
text-decoration: inherit;
-webkit-font-smoothing: antialiased;
vertical-align: baseline;
speak: none;
}
.icon-cloud-download:before { content: "\f0ed"; }
.icon-download:before { content: "\f01a"; }
.icon-trash:before { content: "\f014"; }
.icon-refresh:before { content: "\f021"; }
.icon-plus:before { content: "\f067"; }
.icon-minus:before { content: "\f068"; }
.icon-pencil:before { content: "\f040"; }
.icon-remove:before { content: "\f00d"; }
.icon-star:before { content: "\f005"; }
.icon-star-empty:before { content: "\f006"; }
.icon-upload:before { content: "\f01b"; }
.icon-upload-alt:before { content: "\f093"; }
.icon-ban-circle:before { content: "\f05e"; }
.icon-plus-sign-alt:before { content: "\f0fe"; }
.icon-double-angle-left:before { content: "\f100"; }
.icon-double-angle-right:before { content: "\f101"; }
.icon-double-angle-up:before { content: "\f102"; }
.icon-double-angle-down:before { content: "\f103"; }
.icon-zoom-in:before { content: "\f00e"; }
.icon-zoom-out:before { content: "\f010"; }
.icon-caret-down:before { content: "\f0d7"; }
.icon-caret-up:before { content: "\f0d8"; }
.icon-caret-left:before { content: "\f0d9"; }
.icon-caret-right:before { content: "\f0da"; }
.icon-search:before { content: "\f002"; }
.icon-move:before { content: "\f047"; }
.icon-copy:before { content: "\f0c5"; }
.icon-lightbulb:before { content: "\f0eb"; }
.icon-chevron-left:before { content: "\f053"; }
.icon-chevron-right:before { content: "\f054"; }
.icon-question-sign:before { content: "\f059"; }
.icon-building:before { content: "\f0f7"; }
.icon-phone:before { content: "\f095"; }
.icon-magic:before { content: "\f0d0"; }
.icon-eye:before { content: "\f06e"; }
.icon-eye-slash:before { content: "\f070"; }
.icon-plus-square:before { content: "\f0fe"; }
.icon-envelope:before { content: "\f0e0"; }
.icon-ellipsis-vertical:before { content: "\f142"; }
.icon-building:before { content: "\f0f7"; }
.fa-1x {
font-size: 1.3em;
}
/****** sf2-icon-xx ********/
@font-face {
font-family: 'seafile-font2';
src:url('sf_font2/seafile-font2.eot');
src:url('sf_font2/seafile-font2.eot?#iefix') format('embedded-opentype'),
url('sf_font2/seafile-font2.woff') format('woff'),
url('sf_font2/seafile-font2.ttf') format('truetype'),
url('sf_font2/seafile-font2.svg#seafile-font2') format('svg');
font-weight: normal;
font-style: normal;
}
[class^="sf2-icon-"],
[class*=" sf2-icon-"] {
font-family: 'seafile-font2';
speak: none;
font-weight: normal;
font-variant: normal;
text-transform: none;
-webkit-font-smoothing: antialiased;
}
.sf2-icon-histogram:before { content:"\e000"; }
.sf2-icon-wrench:before { content:"\e001"; }
.sf2-icon-clock:before { content:"\e002"; }
.sf2-icon-bell:before { content:"\e003"; }
.sf2-icon-contacts:before { content:"\e004"; }
.sf2-icon-recycle:before { content:"\e005"; }
.sf2-icon-delete:before { content:"\e006"; }
.sf2-icon-monitor:before { content:"\e007"; }
.sf2-icon-download:before { content:"\e008"; }
.sf2-icon-file:before { content:"\e009"; }
.sf2-icon-folder:before { content:"\e00a"; }
.sf2-icon-msgs:before { content:"\e00b"; }
.sf2-icon-group:before { content:"\e00c"; }
.sf2-icon-library:before { content:"\e00d"; }
.sf2-icon-link:before { content:"\e00e"; }
.sf2-icon-user:before { content:"\e00f"; }
.sf2-icon-organization:before { content:"\e010"; }
.sf2-icon-share:before { content:"\e011"; }
.sf2-icon-star:before { content:"\e012"; }
.sf2-icon-history:before { content:"\e014"; }
.sf2-icon-cog1:before { content:"\e015"; }
.sf2-icon-trash:before { content:"\e016"; }
.sf2-icon-security:before { content:"\e017"; }
.sf2-icon-edit:before { content:"\e018"; }
.sf2-icon-draft:before { content:"\e018"; }
.sf2-icon-edit2:before { content:"\e018"; } /* for some reason */
.sf2-icon-eye:before { content:"\e019"; }
.sf2-icon-caret-down:before { content:"\e01a"; }
.sf2-icon-cog2:before { content:"\e01b"; }
.sf2-icon-minus:before { content:"\e01c"; }
.sf2-icon-x1:before { content:"\e01d"; }
.sf2-icon-tick:before { content:"\e01e"; }
.sf2-icon-x2:before { content:"\e01f"; }
.sf2-icon-user2:before { content:"\e020"; }
.sf2-icon-msgs2:before { content:"\e021"; }
/*.sf2-icon-group-settings:before { content:"\e022"; }*/
.sf2-icon-comment:before { content:"\e023"; }
.sf2-icon-wiki:before { content:"\e013"; }
.sf2-icon-wiki2:before { content:"\e024"; }
.sf2-icon-grid-view:before { content:"\e025"; }
.sf2-icon-list-view:before { content:"\e026"; }
.sf2-icon-wiki-view:before { content:"\e013"; }
.sf2-icon-plus:before { content: "\e027"; }
.sf2-icon-copy:before { content: "\e028"; }
.sf2-icon-move:before { content: "\e029"; }
.sf2-icon-reply:before { content: "\e02a"; }
.sf2-icon-invite:before { content: "\e02b"; }
.sf2-icon-lock:before { content: "\e02c"; }
.sf2-icon-unlock:before { content: "\e02d"; }
.sf2-icon-admin-log:before { content: "\e02e"; }
.sf2-icon-info:before { content: "\e02f"; }
.sf2-icon-logout:before { content: "\e030"; }
.sf2-icon-menu:before { content: "\e031"; }
.sf2-icon-more:before { content: "\e032"; }
.sf2-icon-plus2:before { content: "\e033"; }
.sf2-icon-upload:before { content: "\e034"; }
.sf2-icon-x3:before { content: "\e035"; }
.sf2-icon-two-columns:before { content:"\e036"; }
/******* tags **********/
html, body {
height:100%;
overflow:hidden;
}
body,
ul,ol,li,dl,dt,dd,
pre,blockquote,
form,input,textarea,select,button,img {
padding:0;
margin:0;
}
body, input, textarea, button, select {
font-size: 13px;
line-height: 1.5;
color: #333;
word-wrap:break-word;
}
input, button, select { line-height:19px;/*for ff*/ }
h1, h2, h3, h4, h5, h6 {
line-height:1.5; /* overwrite bootstrap */
}
h1 { font-size:1.9em; }
h2 { font-size:1.5em; color:#222; font-weight:bold; }
h3 { font-size:16px; color:#322; font-weight:normal; }
h4 { font-size:1.1em; color:#222; font-weight:normal; }
h5, h6 { font-size:1em; }
ul { list-style:none; }
dl { margin:1.5em 0; }
dt { color:#666; margin:24px 0 2px; font-weight:normal; }
dd { margin-bottom:.8em; color:#222; }
a {
color:#eb8205;
text-decoration:none;
font-weight:bold;
}
a.normal {font-weight: normal;}
a:focus, a:hover {
color: #eb8205;
}
img { border:none; }
textarea {
overflow: auto; /* rm default vertical scrollbar in ie */
resize: vertical; /* for drag */
outline:0;
}
textarea, input { border: 1px solid #ccc; }
input {
margin:3px 0;
}
input, button { display:inline-block;/*for ie*/ }
input[type=text],
input[type=password] {
box-sizing:content-box;
height:22px;
}
select, button {
box-sizing:border-box;
}
button,
input[type=submit],
input[type=button],
input.submit,
.sf-btn-link,
.fileinput-button,
select {
padding:5px 6px;
/*
background:-webkit-linear-gradient(top, #fafafb, #eeeeee);
background:-moz-linear-gradient(top, #fafafb, #eeeeee);
background:linear-gradient(top, #fafafb, #eeeeee);
*/
border: 1px solid #c5c5c5;
border-radius: 2px;
}
.sf-btn-link {
display:inline-block;
color:#333;
line-height:19px;
text-decoration:none;
font-weight:normal;
}
.big-btn-link {
font-size:14px;
line-height:1.5;
padding:6px 20px;
border-radius:3px;
}
.sf-btn-link:hover {
color:#333;
text-decoration:none;
}
input[type=radio] {
border:0;/*for ie*/
}
input:focus,
button:focus,
select:focus,
textarea:focus {
border-color: #66afe9;
outline: none;
}
input[type="checkbox"]:focus,
input[type="radio"]:focus {
outline:#66afe9 auto 1px;
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {/*for input type="number" in chrome: to hide up/download arrow*/
-webkit-appearance: none;
margin: 0;
}
input::-moz-focus-inner,
button::-moz-focus-inner {/*Remove button padding in FF*/
border: 0;
padding: 0;
}
input[type=submit],
input.submit,
button.submit {
margin-top:8px;
}
input[type=submit]:hover,
input[type=reset]:hover,
input[type=button]:hover,
button:hover,
.sf-btn-link:hover,
.fileinput-button:hover {
cursor:pointer;
background:#fff;
}
input[type="file"] {
border:none;
height:24px;
line-height:24px;
}
label {
display: inline-block;
margin:4px 0px;
}
iframe { display:block; width:100%; }
pre, code {
font-family: Consolas,"Liberation Mono",Courier,monospace;
}
pre {
white-space:pre-wrap;
word-wrap: break-word;
}
table {
width:100%;
margin:8px 0 40px;
}
caption {
font-size:1.1em;
font-weight:bold;
margin-bottom:.6em;
}
th {
text-align:left;
font-weight:normal;
color:#9c9c9c;
}
th, td {
padding:5px 3px;
border-bottom:1px solid #eee;
}
td {
color: #333;
font-size:14px;
word-break:break-all; /* mainly for lib/folder/file name */
}
table img { vertical-align:middle; }
/* custom scrollbar */
::-webkit-scrollbar {
height: 9px;
width: 9px;
}
::-webkit-scrollbar-button {
display: block;
height: 4px;
}
::-webkit-scrollbar-track-piece {
background: #e9e9eb;
}
::-webkit-scrollbar-track-piece:vertical:start {
border-radius:5px 5px 0 0;
}
::-webkit-scrollbar-track-piece:vertical:end {
border-radius:0 0 5px 5px;
}
::-webkit-scrollbar-track-piece:horizontal:start {
border-radius:5px 0 0 5px;
}
::-webkit-scrollbar-track-piece:horizontal:end {
border-radius:0 5px 5px 0;
}
::-webkit-scrollbar-thumb:vertical,
::-webkit-scrollbar-thumb:horizontal {
background: #ccc;
border-radius: 5px;
display: block;
}
/********** common class ***********/
.fleft { float:left; }
.fright { float:right; }
.clear { clear:both; }
.d-flex { display:flex; }
.fd-col { flex-direction:column; }
.flex-auto { flex:auto; }
.flex-1 { flex:1; }
.show { display:block; }
.inline-block { display: inline-block; }
.hide { display:none; }
.error { color:red; }
.errorlist { color:red; }
.error-tip { text-align:center; margin-top:5em; }
.ovhd { overflow:hidden; }
.ov-auto { overflow:auto; }
.ov-vb { overflow:visible; }
.bold { font-weight:bold; }
.no-bold { font-weight:normal; }
.w100 { width: 100%; }
.h100 { height: 100%; }
.vh { visibility:hidden; }
.vam { vertical-align:middle; }
.hl { background-color: #f8f8f8; } /* highlight */
.tip { color:#808080; font-size:12px; }
.tick-green { color:green; }
.label { color:#333; font-size:12px; font-style:normal; }
.italic { font-style:italic; }
.alc { text-align: center;}
.cspt { cursor:pointer; }
.pos-rel { position:relative; }
/** for input, textarea in form **/
.input, .textarea {
width:260px;
padding:2px 3px;
border-radius:2px;
margin-bottom:5px;
}
.textarea { height:70px; }
/* loading implemented with css */
@-moz-keyframes loading {
0% {
-moz-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@-webkit-keyframes loading {
0% {
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
@keyframes loading {
0% {
-moz-transform: rotate(0deg);
-ms-transform: rotate(0deg);
-webkit-transform: rotate(0deg);
transform: rotate(0deg);
}
100% {
-moz-transform: rotate(360deg);
-ms-transform: rotate(360deg);
-webkit-transform: rotate(360deg);
transform: rotate(360deg);
}
}
.loading-icon {
display:inline-block;
width:26px;
height:26px;
border:2px solid #eee;
border-left-color:#aaa;
border-radius:50%;
-moz-animation:loading 0.9s infinite linear;
-webkit-animation:loading 0.9s infinite linear;
animation:loading 0.9s infinite linear;
}
.loading-tip {
display:block;
margin:1em auto;
}
.op,
.more {
font-weight:normal;
font-size:12px;
}
.op { font-size:13px; padding-right:2px; }
.op-target { color:#ee8204; word-wrap:break-word; }
.op-icon {
font-size:20px;
line-height:1;
color:#888;
cursor:pointer;
margin-right:3px;
vertical-align:middle;
}
.op-icon.sf2-x,
.op-icon.sf2-x:hover {
color:#f89a68;
}
.op-icon.sf2-x:hover,
.op-icon.sf2-x:focus {
text-decoration: underline;
}
.sf2-icon-edit {
font-size:16px;
opacity:0.7;
}
.sf2-icon-edit:hover {
opacity:1;
}
a.op-icon:focus {
outline:none;
text-decoration:none;
}
.op-icon:hover {/** for **/
color:#888;
text-decoration:none;
}
.full-width-btn {
width:100%;
padding:.5em 0;
background:#efefef;
border:0;
color:#777;
}
.full-width-btn:hover {
color:#000;
background:#dfdfdf;
}
.no-deco,
.no-deco:hover,
.no-deco:focus {
text-decoration:none;
}
.input-disabled {/* for type="password/text" etc*/
background:#ebebe4;
}
.btn-disabled { /*for ,