Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Support
Keyboard shortcuts
?
Submit feedback
Contribute to GitLab
Sign in / Register
Toggle navigation
C
converse.js
Project overview
Project overview
Details
Activity
Releases
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Issues
0
Issues
0
List
Boards
Labels
Milestones
Merge Requests
0
Merge Requests
0
Analytics
Analytics
Repository
Value Stream
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Create a new issue
Commits
Issue Boards
Open sidebar
nexedi
converse.js
Commits
768dcbda
Commit
768dcbda
authored
Dec 14, 2014
by
JC Brand
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Updated scss/css
parent
ff4af318
Changes
3
Hide whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
566 additions
and
1307 deletions
+566
-1307
css/converse.css
css/converse.css
+216
-905
mockup/index.html
mockup/index.html
+37
-35
sass/converse.scss
sass/converse.scss
+313
-367
No files found.
css/converse.css
View file @
768dcbda
...
@@ -27,54 +27,10 @@
...
@@ -27,54 +27,10 @@
content
:
"\e600"
;
}
content
:
"\e600"
;
}
#conversejs
{
#conversejs
{
/**
/* Neat 1.7.0
* SASS/SCSS/Compass Transcription of Skeleton Responsive Grid
* http://neat.bourbon.io
* @author Dennis Thompson <http://www.atomicpages.net>
* Copyright 2012-2014 thoughtbot, inc.
* @copyright Copyright (c) 2014 AtomicPages LLC
* MIT License */
* @license MIT
* @version 2.0.2
*/
/* RESET
* ------------------------------------------------ */
/* HTML5 display-role reset for older browsers */
/* BASIC STYLES
* ------------------------------------------------ */
/* TYPOGRAPHY
* ------------------------------------------------ */
/* Blockquotes */
/* LINKS
* ------------------------------------------------ */
/* LISTS
* ------------------------------------------------ */
/* IMAGES
* ------------------------------------------------ */
/* BUTTONS
* ------------------------------------------------ */
/* Fix for odd Mozilla border & padding issues */
/* FORMS
* ------------------------------------------------ */
/* MISC
* ------------------------------------------------ */
/* BASE GRID
* ------------------------------------------------ */
/* The Grid */
/* TABLET (PORTRAIT)
* ------------------------------------------------ */
/* MOBILE (PORTRAIT)
* ------------------------------------------------ */
/* MOBILE (LANDSCAPE)
* ------------------------------------------------ */
/* CLEARING
* ------------------------------------------------ */
/* Add custom styles here */
/* MEDIA QUERIES
* ------------------------------------------------ */
/* Large displays */
/* Smaller than standard 960 (devices and browsers) */
/* Tablet Portrait size to standard 960 (devices and browsers) */
/* All Mobile Sizes (devices and browser) */
/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
color
:
#6C4C44
;
color
:
#6C4C44
;
font-size
:
14px
;
font-size
:
14px
;
bottom
:
0
;
bottom
:
0
;
...
@@ -85,671 +41,23 @@
...
@@ -85,671 +41,23 @@
right
:
0
;
right
:
0
;
z-index
:
30
;
z-index
:
30
;
display
:
block
;
display
:
block
;
box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
-webkit-box-sizing
:
border-box
;
-webkit-box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
box-sizing
:
border-box
;
/* @group Tabs */
/* @group Tabs */
/* status dropdown styles */
}
/* status dropdown styles */
}
#conversejs
html
,
#conversejs
body
,
#conversejs
div
,
#conversejs
span
,
#conversejs
applet
,
#conversejs
object
,
#conversejs
iframe
,
#conversejs
h1
,
#conversejs
h2
,
#conversejs
h3
,
#conversejs
h4
,
#conversejs
h5
,
#conversejs
h6
,
#conversejs
p
,
#conversejs
blockquote
,
#conversejs
pre
,
#conversejs
a
,
#conversejs
abbr
,
#conversejs
acronym
,
#conversejs
address
,
#conversejs
big
,
#conversejs
cite
,
#conversejs
code
,
#conversejs
del
,
#conversejs
dfn
,
#conversejs
em
,
#conversejs
img
,
#conversejs
ins
,
#conversejs
kbd
,
#conversejs
q
,
#conversejs
s
,
#conversejs
samp
,
#conversejs
small
,
#conversejs
strike
,
#conversejs
strong
,
#conversejs
sub
,
#conversejs
sup
,
#conversejs
tt
,
#conversejs
var
,
#conversejs
b
,
#conversejs
u
,
#conversejs
i
,
#conversejs
center
,
#conversejs
dl
,
#conversejs
dt
,
#conversejs
dd
,
#conversejs
ol
,
#conversejs
ul
,
#conversejs
li
,
#conversejs
fieldset
,
#conversejs
form
,
#conversejs
label
,
#conversejs
legend
,
#conversejs
table
,
#conversejs
caption
,
#conversejs
tbody
,
#conversejs
tfoot
,
#conversejs
thead
,
#conversejs
tr
,
#conversejs
th
,
#conversejs
td
,
#conversejs
article
,
#conversejs
aside
,
#conversejs
canvas
,
#conversejs
details
,
#conversejs
embed
,
#conversejs
figure
,
#conversejs
figcaption
,
#conversejs
footer
,
#conversejs
header
,
#conversejs
hgroup
,
#conversejs
menu
,
#conversejs
nav
,
#conversejs
output
,
#conversejs
ruby
,
#conversejs
section
,
#conversejs
summary
,
#conversejs
time
,
#conversejs
mark
,
#conversejs
audio
,
#conversejs
video
{
margin
:
0
;
padding
:
0
;
border
:
0
;
font-size
:
100%
;
font
:
inherit
;
vertical-align
:
baseline
;
}
#conversejs
article
,
#conversejs
aside
,
#conversejs
details
,
#conversejs
figcaption
,
#conversejs
figure
,
#conversejs
footer
,
#conversejs
header
,
#conversejs
hgroup
,
#conversejs
menu
,
#conversejs
nav
,
#conversejs
section
{
display
:
block
;
}
#conversejs
body
{
line-height
:
1
;
}
#conversejs
ol
,
#conversejs
ul
{
list-style
:
none
;
}
#conversejs
blockquote
,
#conversejs
q
{
quotes
:
none
;
}
#conversejs
blockquote
:before
,
#conversejs
blockquote
:after
,
#conversejs
q
:before
,
#conversejs
q
:after
{
content
:
""
;
content
:
none
;
}
#conversejs
table
{
border-collapse
:
collapse
;
border-spacing
:
0
;
}
#conversejs
html
{
#conversejs
html
{
font-size
:
62.5%
;
overflow-y
:
scroll
;
-webkit-text-size-adjust
:
100%
;
-ms-text-size-adjust
:
100%
;
line-height
:
1.2
;
}
#conversejs
*,
#conversejs
*
:before
,
#conversejs
*
:after
{
-webkit-box-sizing
:
border-box
;
-webkit-box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
box-sizing
:
border-box
;
}
box-sizing
:
border-box
;
}
#conversejs
body
{
#conversejs
*,
#conversejs
*
:before
,
#conversejs
*
:after
{
background
:
#fff
;
-webkit-box-sizing
:
inherit
;
font-family
:
"HelveticaNeue"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
-moz-box-sizing
:
inherit
;
font-weight
:
normal
;
box-sizing
:
inherit
;
}
font-style
:
normal
;
font-size
:
14px
;
font-size
:
1.4rem
;
line-height
:
2.6rem
;
color
:
#444
;
-webkit-font-smoothing
:
antialiased
;
/* Fix for webkit rendering */
-webkit-text-size-adjust
:
100%
;
}
#conversejs
h1
,
#conversejs
h2
,
#conversejs
h3
,
#conversejs
h4
,
#conversejs
h5
,
#conversejs
h6
{
color
:
#181818
;
font-family
:
"Georgia"
,
"Times New Roman"
,
serif
;
font-weight
:
normal
;
}
#conversejs
h1
a
,
#conversejs
h2
a
,
#conversejs
h3
a
,
#conversejs
h4
a
,
#conversejs
h5
a
,
#conversejs
h6
a
{
font-weight
:
inherit
;
}
#conversejs
h1
{
font-size
:
53.6662px
;
font-size
:
5.36662rem
;
line-height
:
5.83324rem
;
margin-bottom
:
1.63324rem
;
}
#conversejs
h2
{
font-size
:
40.8324px
;
font-size
:
4.08324rem
;
line-height
:
4.6662rem
;
margin-bottom
:
1.1662rem
;
}
#conversejs
h3
{
font-size
:
32.662px
;
font-size
:
3.2662rem
;
line-height
:
3.9662rem
;
margin-bottom
:
0.9324rem
;
}
#conversejs
h4
{
font-size
:
24.5px
;
font-size
:
2.45rem
;
line-height
:
3.5rem
;
margin-bottom
:
0.4662rem
;
}
#conversejs
h5
{
font-size
:
19.8324px
;
font-size
:
1.98324rem
;
line-height
:
2.8rem
;
}
#conversejs
h6
{
font-size
:
16.3324px
;
font-size
:
1.63324rem
;
line-height
:
2.45rem
;
}
#conversejs
.subheader
{
color
:
#777
;
}
#conversejs
p
{
margin
:
0
0
2rem
0
;
}
#conversejs
p
img
{
margin
:
0
;
}
#conversejs
p
.lead
{
font-size
:
24.5px
;
font-size
:
2.45rem
;
line-height
:
3.15rem
;
color
:
#777
;
}
#conversejs
em
,
#conversejs
i
{
font-style
:
italic
;
}
#conversejs
strong
,
#conversejs
b
{
font-weight
:
bold
;
}
#conversejs
u
{
text-decoration
:
underline
;
}
#conversejs
small
{
font-size
:
80%
;
}
#conversejs
blockquote
,
#conversejs
blockquote
p
{
font-size
:
19.8324px
;
font-size
:
1.98324rem
;
line-height
:
2.8rem
;
color
:
#777
;
font-style
:
italic
;
}
#conversejs
blockquote
{
margin
:
0
0
2rem
;
padding
:
0.9rem
2rem
0
1.9rem
;
border-left
:
1px
solid
#ddd
;
}
#conversejs
blockquote
cite
{
display
:
block
;
font-size
:
14px
;
font-size
:
1.4rem
;
color
:
#555
;
}
#conversejs
blockquote
cite
:before
{
content
:
"\2014 \0020"
;
}
#conversejs
blockquote
cite
a
,
#conversejs
blockquote
cite
a
:visited
{
color
:
#555
;
}
#conversejs
hr
{
border-style
:
solid
;
border-color
:
#ddd
;
border-width
:
1px
0
0
;
clear
:
both
;
margin
:
1rem
0
3rem
;
height
:
0
;
}
#conversejs
a
,
#conversejs
a
:visited
{
color
:
#333
;
text-decoration
:
underline
;
outline
:
0
;
}
#conversejs
a
:hover
,
#conversejs
a
:focus
,
#conversejs
a
:active
{
color
:
#000
;
}
#conversejs
p
a
,
#conversejs
p
a
:visited
{
line-height
:
inherit
;
}
#conversejs
ul
,
#conversejs
ol
{
margin-bottom
:
2rem
;
}
#conversejs
ul
{
list-style
:
none
outside
;
}
#conversejs
ol
{
list-style
:
decimal
;
}
#conversejs
ol
,
#conversejs
ul
.square
,
#conversejs
ul
.circle
,
#conversejs
ul
.disc
{
margin-left
:
3rem
;
}
#conversejs
ul
.square
{
list-style
:
square
outside
;
}
#conversejs
ul
.circle
{
list-style
:
circle
outside
;
}
#conversejs
ul
.disc
{
list-style
:
disc
outside
;
}
#conversejs
ul
ul
,
#conversejs
ul
ol
,
#conversejs
ol
ol
,
#conversejs
ol
ul
{
margin-top
:
0.4rem
;
margin-right
:
0
;
margin-bottom
:
0.5rem
;
margin-left
:
3rem
;
font-size
:
90%
;
}
#conversejs
ul
ul
li
,
#conversejs
ul
ol
li
,
#conversejs
ol
ol
li
,
#conversejs
ol
ul
li
{
margin-bottom
:
0.6rem
;
}
#conversejs
li
{
line-height
:
1.8rem
;
margin-bottom
:
1.2rem
;
}
#conversejs
ul
.large
li
{
line-height
:
2.1rem
;
}
#conversejs
li
p
{
line-height
:
2.1rem
;
}
#conversejs
img
.scale-with-grid
{
max-width
:
100%
;
height
:
auto
;
}
#conversejs
.button
,
#conversejs
button
,
#conversejs
input
[
type
=
"submit"
],
#conversejs
input
[
type
=
"reset"
],
#conversejs
input
[
type
=
"button"
]
{
border
:
1px
solid
#aaa
;
border-top
:
1px
solid
#ccc
;
border-left
:
1px
solid
#ccc
;
-webkit-border-radius
:
3px
;
-moz-border-radius
:
3px
;
-ms-border-radius
:
3px
;
-o-border-radius
:
3px
;
border-radius
:
3px
;
color
:
#444
;
display
:
inline-block
;
font-weight
:
bold
;
font-family
:
"HelveticaNeue"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
font-size
:
13px
;
font-size
:
1.3rem
;
text-decoration
:
none
;
cursor
:
pointer
;
line-height
:
normal
;
padding
:
0.8rem
1rem
;
background
:
#eeeeee
-webkit-gradient
(
linear
,
50%
0%
,
50%
100%
,
color-stop
(
0%
,
rgba
(
255
,
255
,
255
,
0.2
)),
color-stop
(
100%
,
rgba
(
0
,
0
,
0
,
0.2
)));
background
:
#eeeeee
-webkit-linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.2
)
0%
,
rgba
(
0
,
0
,
0
,
0.2
)
100%
);
background
:
#eeeeee
-moz-linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.2
)
0%
,
rgba
(
0
,
0
,
0
,
0.2
)
100%
);
background
:
#eeeeee
-o-linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.2
)
0%
,
rgba
(
0
,
0
,
0
,
0.2
)
100%
);
background
:
#eeeeee
linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.2
)
0%
,
rgba
(
0
,
0
,
0
,
0.2
)
100%
);
text-shadow
:
0
1px
rgba
(
255
,
255
,
255
,
0.75
);
}
#conversejs
.button
:hover
,
#conversejs
button
:hover
,
#conversejs
input
[
type
=
"submit"
]
:hover
,
#conversejs
input
[
type
=
"reset"
]
:hover
,
#conversejs
input
[
type
=
"button"
]
:hover
{
color
:
#222
;
border
:
1px
solid
#888
;
border-top
:
1px
solid
#aaa
;
border-left
:
1px
solid
#aaa
;
background
:
#dddddd
-webkit-gradient
(
linear
,
50%
0%
,
50%
100%
,
color-stop
(
0%
,
rgba
(
255
,
255
,
255
,
0.3
)),
color-stop
(
100%
,
rgba
(
0
,
0
,
0
,
0.3
)));
background
:
#dddddd
-webkit-linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.3
)
0%
,
rgba
(
0
,
0
,
0
,
0.3
)
100%
);
background
:
#dddddd
-moz-linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.3
)
0%
,
rgba
(
0
,
0
,
0
,
0.3
)
100%
);
background
:
#dddddd
-o-linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.3
)
0%
,
rgba
(
0
,
0
,
0
,
0.3
)
100%
);
background
:
#dddddd
linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.3
)
0%
,
rgba
(
0
,
0
,
0
,
0.3
)
100%
);
}
#conversejs
.button
:active
,
#conversejs
button
:active
,
#conversejs
input
[
type
=
"submit"
]
:active
,
#conversejs
input
[
type
=
"reset"
]
:active
,
#conversejs
input
[
type
=
"button"
]
:active
{
border
:
1px
solid
#666
;
background
:
#cccccc
-webkit-gradient
(
linear
,
50%
0%
,
50%
100%
,
color-stop
(
0%
,
rgba
(
255
,
255
,
255
,
0.35
)),
color-stop
(
100%
,
rgba
(
10
,
10
,
10
,
0.4
)));
background
:
#cccccc
-webkit-linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.35
)
0%
,
rgba
(
10
,
10
,
10
,
0.4
)
100%
);
background
:
#cccccc
-moz-linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.35
)
0%
,
rgba
(
10
,
10
,
10
,
0.4
)
100%
);
background
:
#cccccc
-o-linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.35
)
0%
,
rgba
(
10
,
10
,
10
,
0.4
)
100%
);
background
:
#cccccc
linear-gradient
(
top
,
rgba
(
255
,
255
,
255
,
0.35
)
0%
,
rgba
(
10
,
10
,
10
,
0.4
)
100%
);
}
#conversejs
.button.full-width
,
#conversejs
button
.full-width
,
#conversejs
input
[
type
=
"submit"
]
.full-width
,
#conversejs
input
[
type
=
"reset"
]
.full-width
,
#conversejs
input
[
type
=
"button"
]
.full-width
{
width
:
100%
;
padding-left
:
0
!important
;
padding-right
:
0
!important
;
text-align
:
center
;
}
#conversejs
.button.smaller
,
#conversejs
button
.smaller
,
#conversejs
input
[
type
=
"submit"
]
.smaller
,
#conversejs
input
[
type
=
"reset"
]
.smaller
,
#conversejs
input
[
type
=
"button"
]
.smaller
{
font-size
:
12px
;
font-size
:
1.2rem
;
padding
:
0.4rem
0.5rem
;
}
#conversejs
.button.larger
,
#conversejs
button
.larger
,
#conversejs
input
[
type
=
"submit"
]
.larger
,
#conversejs
input
[
type
=
"reset"
]
.larger
,
#conversejs
input
[
type
=
"button"
]
.larger
{
font-size
:
16px
;
font-size
:
1.6rem
;
padding
:
1rem
1.8rem
;
}
#conversejs
button
::-moz-focus-inner
,
#conversejs
input
::-moz-focus-inner
{
border
:
0
;
padding
:
0
;
}
#conversejs
form
{
margin-bottom
:
2rem
;
}
#conversejs
fieldset
{
margin-bottom
:
2rem
;
}
#conversejs
input
[
type
=
"text"
],
#conversejs
input
[
type
=
"password"
],
#conversejs
input
[
type
=
"email"
],
#conversejs
input
[
type
=
"search"
],
#conversejs
input
[
type
=
"url"
],
#conversejs
input
[
type
=
"tel"
],
#conversejs
input
[
type
=
"date"
],
#conversejs
input
[
type
=
"datetime"
],
#conversejs
input
[
type
=
"datetime-local"
],
#conversejs
input
[
type
=
"month"
],
#conversejs
input
[
type
=
"week"
],
#conversejs
input
[
type
=
"time"
],
#conversejs
input
[
type
=
"number"
],
#conversejs
textarea
,
#conversejs
select
{
background
:
#fff
;
border
:
1px
solid
#ccc
;
padding
:
0.6rem
0.4rem
;
outline
:
none
;
-webkit-border-radius
:
2px
;
-moz-border-radius
:
2px
;
-ms-border-radius
:
2px
;
-o-border-radius
:
2px
;
border-radius
:
2px
;
font-family
:
"HelveticaNeue"
,
"Helvetica Neue"
,
Helvetica
,
Arial
,
sans-serif
;
font-size
:
15px
;
font-size
:
1.5rem
;
color
:
#777
;
margin
:
0
0
2rem
;
width
:
21rem
;
max-width
:
100%
;
display
:
block
;
}
#conversejs
input
[
type
=
"text"
]
:hover
,
#conversejs
input
[
type
=
"text"
]
:focus
,
#conversejs
input
[
type
=
"password"
]
:hover
,
#conversejs
input
[
type
=
"password"
]
:focus
,
#conversejs
input
[
type
=
"email"
]
:hover
,
#conversejs
input
[
type
=
"email"
]
:focus
,
#conversejs
input
[
type
=
"search"
]
:hover
,
#conversejs
input
[
type
=
"search"
]
:focus
,
#conversejs
input
[
type
=
"url"
]
:hover
,
#conversejs
input
[
type
=
"url"
]
:focus
,
#conversejs
input
[
type
=
"tel"
]
:hover
,
#conversejs
input
[
type
=
"tel"
]
:focus
,
#conversejs
input
[
type
=
"date"
]
:hover
,
#conversejs
input
[
type
=
"date"
]
:focus
,
#conversejs
input
[
type
=
"datetime"
]
:hover
,
#conversejs
input
[
type
=
"datetime"
]
:focus
,
#conversejs
input
[
type
=
"datetime-local"
]
:hover
,
#conversejs
input
[
type
=
"datetime-local"
]
:focus
,
#conversejs
input
[
type
=
"month"
]
:hover
,
#conversejs
input
[
type
=
"month"
]
:focus
,
#conversejs
input
[
type
=
"week"
]
:hover
,
#conversejs
input
[
type
=
"week"
]
:focus
,
#conversejs
input
[
type
=
"time"
]
:hover
,
#conversejs
input
[
type
=
"time"
]
:focus
,
#conversejs
input
[
type
=
"number"
]
:hover
,
#conversejs
input
[
type
=
"number"
]
:focus
,
#conversejs
textarea
:hover
,
#conversejs
textarea
:focus
,
#conversejs
select
:hover
,
#conversejs
select
:focus
{
border
:
1px
solid
#aaa
;
color
:
#444
;
-webkit-box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
0.2
);
-moz-box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
0.2
);
-ms-box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
0.2
);
-o-box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
0.2
);
box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
0.2
);
}
#conversejs
input
[
type
=
"text"
]
:active
,
#conversejs
input
[
type
=
"password"
]
:active
,
#conversejs
input
[
type
=
"email"
]
:active
,
#conversejs
input
[
type
=
"search"
]
:active
,
#conversejs
input
[
type
=
"url"
]
:active
,
#conversejs
input
[
type
=
"tel"
]
:active
,
#conversejs
input
[
type
=
"date"
]
:active
,
#conversejs
input
[
type
=
"datetime"
]
:active
,
#conversejs
input
[
type
=
"datetime-local"
]
:active
,
#conversejs
input
[
type
=
"month"
]
:active
,
#conversejs
input
[
type
=
"week"
]
:active
,
#conversejs
input
[
type
=
"time"
]
:active
,
#conversejs
input
[
type
=
"number"
]
:active
,
#conversejs
textarea
:active
,
#conversejs
select
:active
{
border
:
1px
solid
#909090
;
-webkit-box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
0.3
);
-moz-box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
0.3
);
-ms-box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
0.3
);
-o-box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
0.3
);
box-shadow
:
0
0
3px
rgba
(
0
,
0
,
0
,
0.3
);
}
#conversejs
select
{
padding
:
0
;
}
#conversejs
textarea
{
min-height
:
6rem
;
}
#conversejs
label
,
#conversejs
legend
{
display
:
block
;
font-weight
:
bold
;
font-size
:
15px
;
font-size
:
1.5rem
;
}
#conversejs
label
span
,
#conversejs
legend
span
{
font-weight
:
normal
;
font-size
:
15px
;
font-size
:
1.5rem
;
color
:
#444
;
}
#conversejs
select
{
width
:
22rem
;
}
#conversejs
input
[
type
=
"checkbox"
]
{
display
:
inline
;
}
#conversejs
.subtract-bottom
{
margin-bottom
:
-2rem
!important
;
}
#conversejs
.remove-bottom
{
margin-bottom
:
0
!important
;
}
#conversejs
.half-bottom
{
margin-bottom
:
1rem
!important
;
}
#conversejs
.add-bottom
{
margin-bottom
:
2rem
!important
;
}
#conversejs
.container
{
position
:
relative
;
width
:
960px
;
margin
:
0
auto
;
padding
:
0
;
}
#conversejs
.container
.column
,
#conversejs
.container
.columns
{
float
:
left
;
display
:
inline
;
position
:
relative
;
}
#conversejs
.container
.column.alpha
,
#conversejs
.container
.columns.alpha
{
margin-left
:
0
;
}
#conversejs
.container
.column.omega
,
#conversejs
.container
.columns.omega
{
margin-right
:
0
;
}
#conversejs
.row
{
margin-bottom
:
2rem
;
}
#conversejs
.container
.column
,
#conversejs
.container
.columns
{
margin-left
:
10px
;
margin-right
:
10px
;
}
#conversejs
.container
.one.column
,
#conversejs
.container
.one.columns
{
width
:
40px
;
}
#conversejs
.container
.two.columns
{
width
:
100px
;
}
#conversejs
.container
.three.columns
{
width
:
160px
;
}
#conversejs
.container
.four.columns
{
width
:
220px
;
}
#conversejs
.container
.five.columns
{
width
:
280px
;
}
#conversejs
.container
.six.columns
{
width
:
340px
;
}
#conversejs
.container
.seven.columns
{
width
:
400px
;
}
#conversejs
.container
.eight.columns
{
width
:
460px
;
}
#conversejs
.container
.nine.columns
{
width
:
520px
;
}
#conversejs
.container
.ten.columns
{
width
:
580px
;
}
#conversejs
.container
.eleven.columns
{
width
:
640px
;
}
#conversejs
.container
.twelve.columns
{
width
:
700px
;
}
#conversejs
.container
.thirteen.columns
{
width
:
760px
;
}
#conversejs
.container
.fourteen.columns
{
width
:
820px
;
}
#conversejs
.container
.fifteen.columns
{
width
:
880px
;
}
#conversejs
.container
.sixteen.columns
{
width
:
940px
;
}
#conversejs
.container
.one-third.column
{
width
:
300px
;
}
#conversejs
.container
.two-thirds.column
{
width
:
620px
;
}
#conversejs
.container
.full-width.columns
{
width
:
960px
;
margin-left
:
0
;
margin-right
:
0
;
}
#conversejs
.container
.offset-by-one
{
padding-left
:
60px
;
}
#conversejs
.container
.offset-by-two
{
padding-left
:
120px
;
}
#conversejs
.container
.offset-by-three
{
padding-left
:
180px
;
}
#conversejs
.container
.offset-by-four
{
padding-left
:
240px
;
}
#conversejs
.container
.offset-by-five
{
padding-left
:
300px
;
}
#conversejs
.container
.offset-by-six
{
padding-left
:
360px
;
}
#conversejs
.container
.offset-by-seven
{
padding-left
:
420px
;
}
#conversejs
.container
.offset-by-eight
{
padding-left
:
480px
;
}
#conversejs
.container
.offset-by-nine
{
padding-left
:
540px
;
}
#conversejs
.container
.offset-by-ten
{
padding-left
:
600px
;
}
#conversejs
.container
.offset-by-eleven
{
padding-left
:
660px
;
}
#conversejs
.container
.offset-by-twelve
{
padding-left
:
720px
;
}
#conversejs
.container
.offset-by-thirteen
{
padding-left
:
780px
;
}
#conversejs
.container
.offset-by-fourteen
{
padding-left
:
840px
;
}
#conversejs
.container
.offset-by-fifteen
{
padding-left
:
900px
;
}
@media
only
screen
and
(
min-width
:
768px
)
and
(
max-width
:
959px
)
{
#conversejs
{
/* The Grid */
}
#conversejs
.container
{
width
:
768px
;
}
#conversejs
.container
.column.alpha
,
#conversejs
.container
.columns.alpha
{
margin-left
:
0
;
margin-right
:
10px
;
}
#conversejs
.container
.column.omega
,
#conversejs
.container
.columns.omega
{
margin-right
:
0
;
margin-left
:
10px
;
}
#conversejs
.alpha.omega
{
margin-left
:
0
;
margin-right
:
0
;
}
#conversejs
.container
.column
,
#conversejs
.container
.columns
{
margin-left
:
10px
;
margin-right
:
10px
;
}
#conversejs
.container
.one.column
,
#conversejs
.container
.one.columns
{
width
:
28px
;
}
#conversejs
.container
.two.columns
{
width
:
76px
;
}
#conversejs
.container
.three.columns
{
width
:
124px
;
}
#conversejs
.container
.four.columns
{
width
:
172px
;
}
#conversejs
.container
.five.columns
{
width
:
220px
;
}
#conversejs
.container
.six.columns
{
width
:
268px
;
}
#conversejs
.container
.seven.columns
{
width
:
316px
;
}
#conversejs
.container
.eight.columns
{
width
:
364px
;
}
#conversejs
.container
.nine.columns
{
width
:
412px
;
}
#conversejs
.container
.ten.columns
{
width
:
460px
;
}
#conversejs
.container
.eleven.columns
{
width
:
508px
;
}
#conversejs
.container
.twelve.columns
{
width
:
556px
;
}
#conversejs
.container
.thirteen.columns
{
width
:
604px
;
}
#conversejs
.container
.fourteen.columns
{
width
:
652px
;
}
#conversejs
.container
.fifteen.columns
{
width
:
700px
;
}
#conversejs
.container
.sixteen.columns
{
width
:
748px
;
}
#conversejs
.container
.one-third.column
{
width
:
236px
;
}
#conversejs
.container
.two-thirds.column
{
width
:
492px
;
}
#conversejs
.container
.full-width.columns
{
width
:
768px
;
margin-left
:
0
;
margin-right
:
0
;
}
#conversejs
.container
.offset-by-one
{
padding-left
:
48px
;
}
#conversejs
.container
.offset-by-two
{
padding-left
:
96px
;
}
#conversejs
.container
.offset-by-three
{
padding-left
:
144px
;
}
#conversejs
.container
.offset-by-four
{
padding-left
:
192px
;
}
#conversejs
.container
.offset-by-five
{
padding-left
:
240px
;
}
#conversejs
.container
.offset-by-six
{
padding-left
:
288px
;
}
#conversejs
.container
.offset-by-seven
{
padding-left
:
336px
;
}
#conversejs
.container
.offset-by-eight
{
padding-left
:
384px
;
}
#conversejs
.container
.offset-by-nine
{
padding-left
:
432px
;
}
#conversejs
.container
.offset-by-ten
{
padding-left
:
480px
;
}
#conversejs
.container
.offset-by-eleven
{
padding-left
:
528px
;
}
#conversejs
.container
.offset-by-twelve
{
padding-left
:
576px
;
}
#conversejs
.container
.offset-by-thirteen
{
padding-left
:
624px
;
}
#conversejs
.container
.offset-by-fourteen
{
padding-left
:
672px
;
}
#conversejs
.container
.offset-by-fifteen
{
padding-left
:
720px
;
}
}
@media
only
screen
and
(
max-width
:
767px
)
{
#conversejs
.container
{
width
:
300px
;
}
#conversejs
.container
.column
,
#conversejs
.container
.columns
{
margin-left
:
0
;
margin-right
:
0
;
}
#conversejs
.container
.one.column
{
width
:
300px
;
}
#conversejs
.container
.one.columns
,
#conversejs
.container
.two.columns
,
#conversejs
.container
.three.columns
,
#conversejs
.container
.four.columns
,
#conversejs
.container
.five.columns
,
#conversejs
.container
.six.columns
,
#conversejs
.container
.seven.columns
,
#conversejs
.container
.eight.columns
,
#conversejs
.container
.nine.columns
,
#conversejs
.container
.ten.columns
,
#conversejs
.container
.eleven.columns
,
#conversejs
.container
.twelve.columns
,
#conversejs
.container
.thirteen.columns
,
#conversejs
.container
.fourteen.columns
,
#conversejs
.container
.fifteen.columns
,
#conversejs
.container
.sixteen.columns
{
width
:
296px
;
}
#conversejs
.container
.one-third.column
{
width
:
296px
;
}
#conversejs
.container
.two-thirds.column
{
width
:
296px
;
}
#conversejs
.container
.full-width.columns
{
width
:
300px
;
margin-left
:
0
;
margin-right
:
0
;
}
#conversejs
.container
.offset-by-one
,
#conversejs
.container
.offset-by-two
,
#conversejs
.container
.offset-by-three
,
#conversejs
.container
.offset-by-four
,
#conversejs
.container
.offset-by-five
,
#conversejs
.container
.offset-by-six
,
#conversejs
.container
.offset-by-seven
,
#conversejs
.container
.offset-by-eight
,
#conversejs
.container
.offset-by-nine
,
#conversejs
.container
.offset-by-ten
,
#conversejs
.container
.offset-by-eleven
,
#conversejs
.container
.offset-by-twelve
,
#conversejs
.container
.offset-by-thirteen
,
#conversejs
.container
.offset-by-fourteen
,
#conversejs
.container
.offset-by-fifteen
{
padding-left
:
0
;
}
}
@media
only
screen
and
(
min-width
:
480px
)
and
(
max-width
:
767px
)
{
#conversejs
.container
{
width
:
420px
;
}
#conversejs
.container
.column
,
#conversejs
.container
.columns
{
margin-left
:
0
;
margin-right
:
0
;
}
#conversejs
.container
.one.column
{
width
:
420px
;
}
#conversejs
.container
.one.columns
,
#conversejs
.container
.two.columns
,
#conversejs
.container
.three.columns
,
#conversejs
.container
.four.columns
,
#conversejs
.container
.five.columns
,
#conversejs
.container
.six.columns
,
#conversejs
.container
.seven.columns
,
#conversejs
.container
.eight.columns
,
#conversejs
.container
.nine.columns
,
#conversejs
.container
.ten.columns
,
#conversejs
.container
.eleven.columns
,
#conversejs
.container
.twelve.columns
,
#conversejs
.container
.thirteen.columns
,
#conversejs
.container
.fourteen.columns
,
#conversejs
.container
.fifteen.columns
,
#conversejs
.container
.sixteen.columns
{
width
:
416px
;
}
#conversejs
.container
.one-third.column
{
width
:
416px
;
}
#conversejs
.container
.two-thirds.column
{
width
:
416px
;
}
#conversejs
.container
.full-width.columns
{
width
:
420px
;
margin-left
:
0
;
margin-right
:
0
;
}
#conversejs
.container
.offset-by-one
,
#conversejs
.container
.offset-by-two
,
#conversejs
.container
.offset-by-three
,
#conversejs
.container
.offset-by-four
,
#conversejs
.container
.offset-by-five
,
#conversejs
.container
.offset-by-six
,
#conversejs
.container
.offset-by-seven
,
#conversejs
.container
.offset-by-eight
,
#conversejs
.container
.offset-by-nine
,
#conversejs
.container
.offset-by-ten
,
#conversejs
.container
.offset-by-eleven
,
#conversejs
.container
.offset-by-twelve
,
#conversejs
.container
.offset-by-thirteen
,
#conversejs
.container
.offset-by-fourteen
,
#conversejs
.container
.offset-by-fifteen
{
padding-left
:
0
;
}
}
#conversejs
.container
:after
{
content
:
"\0020"
;
display
:
block
;
height
:
0
;
clear
:
both
;
visibility
:
hidden
;
}
#conversejs
.clearfix
,
#conversejs
.row
{
zoom
:
1
;
}
#conversejs
.clearfix
:before
,
#conversejs
.clearfix
:after
,
#conversejs
.row
:before
,
#conversejs
.row
:after
{
content
:
"\0020"
;
display
:
block
;
overflow
:
hidden
;
visibility
:
hidden
;
width
:
0
;
height
:
0
;
}
#conversejs
.clearfix
:after
,
#conversejs
.row
:after
{
clear
:
both
;
}
#conversejs
.clear
{
clear
:
both
;
display
:
block
;
overflow
:
hidden
;
visibility
:
hidden
;
width
:
0
;
height
:
0
;
}
@media
only
screen
and
(
min-width
:
960px
)
and
(
max-width
:
1280px
)
{
#conversejs
{
/* add code here */
}
}
@media
only
screen
and
(
max-width
:
959px
)
{
#conversejs
{
/* add code here */
}
}
@media
only
screen
and
(
min-width
:
768px
)
and
(
max-width
:
959px
)
{
#conversejs
{
/* add code here */
}
}
@media
only
screen
and
(
max-width
:
767px
)
{
#conversejs
{
/* add code here */
}
}
@media
only
screen
and
(
min-width
:
480px
)
and
(
max-width
:
767px
)
{
#conversejs
{
/* add code here */
}
}
@media
only
screen
and
(
max-width
:
479px
)
{
#conversejs
{
/* add code here */
}
}
#conversejs
a
,
#conversejs
a
:visited
{
#conversejs
a
,
#conversejs
a
:visited
{
text-decoration
:
none
;
text-decoration
:
none
;
color
:
#436F64
;
color
:
#436F64
;
text-shadow
:
none
;
}
text-shadow
:
none
;
}
#conversejs
div
{
box-sizing
:
border-box
;
}
#conversejs
ul
li
{
#conversejs
ul
li
{
height
:
auto
;
}
height
:
auto
;
}
#conversejs
div
,
#conversejs
span
,
#conversejs
h1
,
#conversejs
h2
,
#conversejs
h3
,
#conversejs
h4
,
#conversejs
h5
,
#conversejs
h6
,
#conversejs
p
,
#conversejs
blockquote
,
#conversejs
div
,
#conversejs
span
,
#conversejs
h1
,
#conversejs
h2
,
#conversejs
h3
,
#conversejs
h4
,
#conversejs
h5
,
#conversejs
h6
,
#conversejs
p
,
#conversejs
blockquote
,
...
@@ -764,6 +72,7 @@
...
@@ -764,6 +72,7 @@
font
:
inherit
;
font
:
inherit
;
vertical-align
:
baseline
;
}
vertical-align
:
baseline
;
}
#conversejs
textarea
,
#conversejs
textarea
,
#conversejs
input
[
type
=
submit
],
#conversejs
input
[
type
=
button
],
#conversejs
input
[
type
=
text
],
#conversejs
input
[
type
=
password
],
#conversejs
input
[
type
=
text
],
#conversejs
input
[
type
=
password
],
#conversejs
button
{
#conversejs
button
{
font-size
:
14px
;
font-size
:
14px
;
...
@@ -777,26 +86,26 @@
...
@@ -777,26 +86,26 @@
height
:
10px
;
}
height
:
10px
;
}
#conversejs
ul
,
#conversejs
ol
,
#conversejs
dl
{
#conversejs
ul
,
#conversejs
ol
,
#conversejs
dl
{
font
:
inherit
;
font
:
inherit
;
margin
:
0
0
15px
0
;
}
margin
:
0
;
}
#conversejs
[
data-icon
]
:before
{
#conversejs
[
data-icon
]
:before
{
font-family
:
'Converse-js'
;
content
:
attr
(
data-icon
);
content
:
attr
(
data-icon
);
speak
:
none
;
font-family
:
'Converse-js'
;
font-weight
:
normal
;
font-variant
:
normal
;
font-variant
:
normal
;
text-transform
:
none
;
font-weight
:
normal
;
line-height
:
1
;
line-height
:
1
;
speak
:
none
;
text-transform
:
none
;
/* Better Font Rendering =========== */
/* Better Font Rendering =========== */
-webkit-font-smoothing
:
antialiased
;
-webkit-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
;
}
-moz-osx-font-smoothing
:
grayscale
;
}
#conversejs
[
class
^=
"icon-"
],
#conversejs
[
class
*=
" icon-"
]
{
#conversejs
[
class
^=
"icon-"
],
#conversejs
[
class
*=
" icon-"
]
{
font-family
:
'Converse-js'
;
font-family
:
'Converse-js'
;
speak
:
none
;
font-style
:
normal
;
font-style
:
normal
;
font-weight
:
normal
;
font-variant
:
normal
;
font-variant
:
normal
;
text-transform
:
none
;
font-weight
:
normal
;
line-height
:
1
;
line-height
:
1
;
speak
:
none
;
text-transform
:
none
;
/* Better Font Rendering =========== */
/* Better Font Rendering =========== */
-webkit-font-smoothing
:
antialiased
;
-webkit-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
;
}
-moz-osx-font-smoothing
:
grayscale
;
}
...
@@ -985,8 +294,7 @@
...
@@ -985,8 +294,7 @@
#conversejs
.no-text-select
{
#conversejs
.no-text-select
{
-webkit-touch-callout
:
none
;
-webkit-touch-callout
:
none
;
-webkit-user-select
:
none
;
-webkit-user-select
:
none
;
-khtml-user-select
:
none
;
-moz-user-select
:
none
;
-moz-user-select
:
-moz-none
;
-ms-user-select
:
none
;
-ms-user-select
:
none
;
user-select
:
none
;
}
user-select
:
none
;
}
#conversejs
.emoticon
{
#conversejs
.emoticon
{
...
@@ -1039,16 +347,15 @@
...
@@ -1039,16 +347,15 @@
margin
:
0
auto
;
}
margin
:
0
auto
;
}
#conversejs
#minimized-chats
,
#conversejs
#minimized-chats
,
#conversejs
.toggle-controlbox
{
#conversejs
.toggle-controlbox
{
float
:
right
;
font-size
:
90%
;
border-top-right-radius
:
2px
;
border-top-left-radius
:
2px
;
border-top-left-radius
:
2px
;
background-color
:
#F4F4F4
;
border-top-right-radius
:
2px
;
padding
:
4px
8px
;
margin-right
:
5px
;
color
:
#0a0a0a
;
color
:
#0a0a0a
;
float
:
right
;
font-size
:
90%
;
font-weight
:
bold
;
font-weight
:
bold
;
height
:
100%
;
}
height
:
100%
;
margin-right
:
5px
;
padding
:
4px
8px
;
}
#conversejs
#minimized-chats
{
#conversejs
#minimized-chats
{
width
:
130px
;
width
:
130px
;
padding
:
0
;
padding
:
0
;
...
@@ -1072,28 +379,29 @@
...
@@ -1072,28 +379,29 @@
padding
:
4px
0
0
4px
;
padding
:
4px
0
0
4px
;
display
:
block
;
display
:
block
;
width
:
100%
;
width
:
100%
;
height
:
100%
;
height
:
100%
;
}
color
:
#0f0f0f
;
}
#conversejs
#toggle-minimized-chats
.unread-message-count
{
#conversejs
#toggle-minimized-chats
.unread-message-count
{
right
:
5px
;
right
:
5px
;
bottom
:
5px
;
}
bottom
:
5px
;
}
#conversejs
.toggle-controlbox
,
#conversejs
.toggle-controlbox
,
#conversejs
.toggle-minimized-chats
{
#conversejs
a
.toggle-minimized-chats
{
float
:
right
;
float
:
right
;
font-size
:
85%
;
font-size
:
85%
;
border-top-right-radius
:
4px
;
border-top-right-radius
:
4px
;
border-top-left-radius
:
4px
;
border-top-left-radius
:
4px
;
background-color
:
#
5390c8
;
background-color
:
#
436F64
;
padding
:
4px
8px
;
padding
:
4px
8px
;
margin-right
:
5px
;
margin-right
:
5px
;
}
color
:
white
;
}
#conversejs
.toggle-controlbox
span
,
#conversejs
a
.toggle-minimized-chats
span
{
color
:
white
;
}
#conversejs
.chat-body
{
#conversejs
.chat-body
{
background-color
:
white
;
background-color
:
white
;
border-bottom-right-radius
:
4px
;
border-bottom-right-radius
:
4px
;
border-bottom-left-radius
:
4px
;
border-bottom-left-radius
:
4px
;
height
:
289px
;
height
:
289px
;
height
:
-webkit-calc
(
100%
-
4
0
px
);
height
:
-webkit-calc
(
100%
-
4
4
px
);
height
:
calc
(
100%
-
4
0
px
);
height
:
calc
(
100%
-
4
4
px
);
border-top
:
0
;
}
border-top
:
0
;
}
#conversejs
.chat-body
p
{
#conversejs
.chat-body
p
{
font-size
:
14px
;
font-size
:
14px
;
...
@@ -1122,20 +430,6 @@
...
@@ -1122,20 +430,6 @@
background
:
#27774A
;
background
:
#27774A
;
border-bottom-right-radius
:
4px
;
border-bottom-right-radius
:
4px
;
border-bottom-left-radius
:
4px
;
}
border-bottom-left-radius
:
4px
;
}
#conversejs
.participants
label
{
margin-top
:
5px
;
display
:
block
;
}
#conversejs
.participants
.participant-list
li
{
overflow
:
hidden
;
text-overflow
:
ellipsis
;
white-space
:
nowrap
;
display
:
block
;
font-size
:
12px
;
font-weight
:
bold
;
padding
:
0.5em
0
0
0.5em
;
cursor
:
default
;
}
#conversejs
.participants
.participant-list
li
.moderator
{
color
:
#8f2831
;
}
#conversejs
.chat-blink
{
#conversejs
.chat-blink
{
background-color
:
#176679
;
background-color
:
#176679
;
border-right
:
1px
solid
#176679
;
border-right
:
1px
solid
#176679
;
...
@@ -1159,7 +453,12 @@
...
@@ -1159,7 +453,12 @@
#conversejs
.chat-info
{
#conversejs
.chat-info
{
color
:
#6C4C44
;
}
color
:
#6C4C44
;
}
#conversejs
.chat-error
{
#conversejs
.chat-error
{
color
:
#8f2831
;
}
color
:
#681F2C
;
font-weight
:
bold
;
}
#conversejs
.chat-error
,
#conversejs
.chat-info
,
#conversejs
.chat-message
{
padding
:
2px
0
;
}
#conversejs
.chat-message-room
,
#conversejs
.chat-message-room
,
#conversejs
.chat-message-them
,
#conversejs
.chat-message-them
,
#conversejs
.chat-message-me
{
#conversejs
.chat-message-me
{
...
@@ -1173,12 +472,11 @@
...
@@ -1173,12 +472,11 @@
padding-right
:
3px
;
}
padding-right
:
3px
;
}
#conversejs
.chat-message-content
{
#conversejs
.chat-message-content
{
word-wrap
:
break-word
;
}
word-wrap
:
break-word
;
}
#conversejs
.chat-message-room
,
#conversejs
.chat-message-them
{
#conversejs
.chat-message-them
{
color
:
#
8f2831
;
}
color
:
#
4B7003
;
}
#conversejs
.chat-message-me
{
#conversejs
.chat-message-me
{
color
:
#436F64
;
}
color
:
#436F64
;
}
#conversejs
.chat-message-room
{
color
:
#4B7003
;
}
#conversejs
.chat-event
,
#conversejs
.chat-event
,
#conversejs
.chat-date
,
#conversejs
.chat-date
,
#conversejs
.chat-info
{
#conversejs
.chat-info
{
...
@@ -1217,9 +515,9 @@
...
@@ -1217,9 +515,9 @@
font-size
:
85%
;
}
font-size
:
85%
;
}
#conversejs
.reg-feedback
,
#conversejs
.reg-feedback
,
#conversejs
#converse-login
.conn-feedback
{
#conversejs
#converse-login
.conn-feedback
{
width
:
100%
;
display
:
block
;
text-align
:
center
;
text-align
:
center
;
display
:
block
;
}
width
:
100%
;
}
#conversejs
.chat-message-error
{
#conversejs
.chat-message-error
{
color
:
#76797C
;
color
:
#76797C
;
font-size
:
90%
;
font-size
:
90%
;
...
@@ -1242,20 +540,11 @@
...
@@ -1242,20 +540,11 @@
width
:
100%
;
width
:
100%
;
text-overflow
:
ellipsis
;
text-overflow
:
ellipsis
;
white-space
:
nowrap
;
}
white-space
:
nowrap
;
}
#conversejs
.chat-head
{
color
:
#ffffff
;
font-size
:
100%
;
border-top-right-radius
:
4px
;
border-top-left-radius
:
4px
;
padding
:
2px
2px
2px
4px
;
margin
:
0
;
}
#conversejs
.chat-head
.avatar
{
float
:
left
;
}
#conversejs
.chat-head-chatbox
,
#conversejs
.chat-head-chatbox
,
#conversejs
.chat-head-chatroom
{
#conversejs
.chat-head-chatroom
{
height
:
4
0
px
;
height
:
4
4
px
;
position
:
relative
;
position
:
relative
;
padding
:
3
px
;
}
padding
:
5
px
;
}
#conversejs
.chat-head-chatroom
{
#conversejs
.chat-head-chatroom
{
background-color
:
#0F592F
;
}
background-color
:
#0F592F
;
}
#conversejs
.chat-head-chatbox
{
#conversejs
.chat-head-chatbox
{
...
@@ -1277,10 +566,10 @@
...
@@ -1277,10 +566,10 @@
padding-left
:
2em
;
padding-left
:
2em
;
font-weight
:
bold
;
}
font-weight
:
bold
;
}
#conversejs
dl
.add-converse-contact
{
#conversejs
dl
.add-converse-contact
{
margin
:
0
0
0
0.5em
;
}
margin
:
0
0
.5em
0.5em
0.5em
;
}
#conversejs
.fancy-dropdown
{
#conversejs
.fancy-dropdown
{
border
:
1px
solid
#F1DCD6
;
border
:
1px
solid
#F1DCD6
;
height
:
2
2
px
;
height
:
2
5
px
;
text-align
:
left
;
}
text-align
:
left
;
}
#conversejs
.fancy-dropdown
.choose-xmpp-status
{
#conversejs
.fancy-dropdown
.choose-xmpp-status
{
width
:
155px
;
}
width
:
155px
;
}
...
@@ -1313,15 +602,6 @@
...
@@ -1313,15 +602,6 @@
padding
:
0
0
5px
5px
;
}
padding
:
0
0
5px
5px
;
}
#conversejs
form
.search-xmpp-contact
input
{
#conversejs
form
.search-xmpp-contact
input
{
width
:
8em
;
}
width
:
8em
;
}
#conversejs
.controlbox-head
{
margin
:
0
;
color
:
#FFF
;
border-top-right-radius
:
4px
;
border-top-left-radius
:
4px
;
height
:
40px
;
clear
:
right
;
background-color
:
#436F64
;
padding
:
3px
0
0
0
;
}
#conversejs
.unread-message-count
,
#conversejs
.unread-message-count
,
#conversejs
.chat-head-message-count
{
#conversejs
.chat-head-message-count
{
font-weight
:
bold
;
font-weight
:
bold
;
...
@@ -1341,16 +621,16 @@
...
@@ -1341,16 +621,16 @@
#conversejs
a
.configure-chatroom-button
,
#conversejs
a
.configure-chatroom-button
,
#conversejs
a
.toggle-chatbox-button
,
#conversejs
a
.toggle-chatbox-button
,
#conversejs
a
.close-chatbox-button
{
#conversejs
a
.close-chatbox-button
{
font-size
:
10px
;
padding
:
3px
3px
2px
3px
;
margin-right
:
3px
;
cursor
:
pointer
;
border-radius
:
6px
;
border-radius
:
6px
;
border
:
1px
solid
#888
;
border
:
1px
solid
#888
;
display
:
inline-block
;
color
:
white
;
color
:
white
;
text-decoration
:
none
;
cursor
:
pointer
;
float
:
right
;
}
display
:
inline-block
;
float
:
right
;
font-size
:
10px
;
margin
:
0
0
0
3px
;
padding
:
3px
3px
2px
3px
;
text-decoration
:
none
;
}
#conversejs
a
.configure-chatroom-button
:active
,
#conversejs
a
.configure-chatroom-button
:active
,
#conversejs
a
.toggle-chatbox-button
:active
,
#conversejs
a
.toggle-chatbox-button
:active
,
#conversejs
a
.close-chatbox-button
:active
{
#conversejs
a
.close-chatbox-button
:active
{
...
@@ -1399,31 +679,31 @@
...
@@ -1399,31 +679,31 @@
display
:
table
;
}
display
:
table
;
}
#conversejs
#converse-roster
.filter-type
{
#conversejs
#converse-roster
.filter-type
{
display
:
table-cell
;
display
:
table-cell
;
height
:
24px
;
font-size
:
14px
;
height
:
25px
;
margin
:
0
0
0.5em
-1px
;
padding
:
0
;
padding
:
0
;
margin
:
0
0
0.5em
-2px
;
width
:
84px
;
}
display
:
inline-block
;
width
:
85px
;
font-size
:
14px
;
}
#conversejs
#converse-roster
.roster-filter
{
#conversejs
#converse-roster
.roster-filter
{
display
:
table-cell
;
padding
:
2px
;
margin
:
0
0
0.5em
6px
;
width
:
104px
;
height
:
24px
;
background
:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABNSURBVHjaXI7BDcAwCAMvyQjMyQ6dAbZiKfqoUK34g2zJh1dENIC7M8pMAPYdzAVY3d0ajNz9aypS/b5R6o+ZPdqoKgCq6h80KH3xDgBqNR97p8oAGQAAAABJRU5ErkJggg==)
no-repeat
right
-20px
center
;
background
:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABNSURBVHjaXI7BDcAwCAMvyQjMyQ6dAbZiKfqoUK34g2zJh1dENIC7M8pMAPYdzAVY3d0ajNz9aypS/b5R6o+ZPdqoKgCq6h80KH3xDgBqNR97p8oAGQAAAABJRU5ErkJggg==)
no-repeat
right
-20px
center
;
border
:
1px
solid
#999
;
border
:
1px
solid
#999
;
display
:
inline-block
;
}
display
:
table-cell
;
font-size
:
14px
;
height
:
25px
;
margin
:
0
0
0.5em
6px
;
padding
:
0
;
padding
:
2px
;
width
:
104px
;
}
#conversejs
#converse-roster
.roster-filter.x
{
#conversejs
#converse-roster
.roster-filter.x
{
background-position
:
right
3px
center
;
}
background-position
:
right
3px
center
;
}
#conversejs
#converse-roster
.roster-filter.onX
{
#conversejs
#converse-roster
.roster-filter.onX
{
cursor
:
pointer
;
}
cursor
:
pointer
;
}
#conversejs
#converse-roster
.roster-contacts
{
#conversejs
#converse-roster
.roster-contacts
{
margin
:
0
;
margin
:
0
;
overflow-y
:
auto
;
overflow-x
:
hidden
;
max-height
:
195px
;
max-height
:
195px
;
max-height
:
calc
(
100%
-
26px
);
max-height
:
calc
(
100%
-
26px
);
overflow-x
:
hidden
;
overflow-y
:
auto
;
padding-bottom
:
15px
;
}
padding-bottom
:
15px
;
}
#conversejs
#converse-roster
.group-toggle
{
#conversejs
#converse-roster
.group-toggle
{
color
:
#6C4C44
;
color
:
#6C4C44
;
...
@@ -1460,17 +740,17 @@
...
@@ -1460,17 +740,17 @@
font-size
:
16px
;
font-size
:
16px
;
float
:
left
;
float
:
left
;
color
:
#436F64
;
}
color
:
#436F64
;
}
#conversejs
#converse-roster
span
.req-contact-name
{
#conversejs
#converse-roster
dd
a
.open-chat
{
width
:
65
%
;
}
width
:
80
%
;
}
#conversejs
#converse-roster
span
.pending-contact-name
,
#conversejs
#converse-roster
a
.open-chat
{
#conversejs
#converse-roster
span
.pending-contact-name
,
#conversejs
#converse-roster
span
.req-contact-name
{
width
:
80%
;
}
width
:
80%
;
}
#conversejs
dd
.available-chatroom
{
#conversejs
dd
.available-chatroom
{
display
:
inline-block
;
overflow-x
:
hidden
;
overflow-x
:
hidden
;
text-overflow
:
ellipsis
;
text-overflow
:
ellipsis
;
white-space
:
nowrap
;
white-space
:
nowrap
;
}
display
:
inline-block
;
}
#conversejs
dd
.available-chatroom
a
.open-room
{
#conversejs
dd
.available-chatroom
a
.open-room
{
width
:
148px
;
}
width
:
148px
;
}
#conversejs
#available-chatrooms
{
#conversejs
#available-chatrooms
{
text-align
:
left
;
}
text-align
:
left
;
}
#conversejs
#available-chatrooms
dt
,
#conversejs
#available-chatrooms
dt
,
...
@@ -1535,22 +815,20 @@
...
@@ -1535,22 +815,20 @@
#conversejs
.chatbox
.box-flyout
{
#conversejs
.chatbox
.box-flyout
{
width
:
200px
;
}
width
:
200px
;
}
#conversejs
.chatbox
.dropdown
a
{
#conversejs
.chatbox
.dropdown
a
{
height
:
22px
;
width
:
148px
;
width
:
148px
;
display
:
inline-block
;
display
:
inline-block
;
line-height
:
2
4
px
;
}
line-height
:
2
5
px
;
}
#conversejs
.chatbox
.dropdown
li
{
#conversejs
.chatbox
.dropdown
li
{
list-style
:
none
;
list-style
:
none
;
padding-left
:
0
;
}
padding-left
:
0
;
}
#conversejs
.chatbox
.dropdown
dd
ul
{
#conversejs
.chatbox
.dropdown
dd
ul
{
padding
:
5px
0
5px
0
;
padding
:
0
;
list-style
:
none
;
list-style
:
none
;
position
:
absolute
;
position
:
absolute
;
left
:
0
;
left
:
0
;
top
:
0
;
top
:
0
;
border
:
1px
solid
#F1DCD6
;
border
:
1px
solid
#F1DCD6
;
border-top
:
0
;
width
:
100%
;
width
:
99%
;
z-index
:
21
;
z-index
:
21
;
background-color
:
#F1E2DD
;
}
background-color
:
#F1E2DD
;
}
#conversejs
.chatbox
.dropdown
dd
ul
li
:hover
{
#conversejs
.chatbox
.dropdown
dd
ul
li
:hover
{
...
@@ -1570,6 +848,17 @@
...
@@ -1570,6 +848,17 @@
width
:
300px
;
}
width
:
300px
;
}
#conversejs
.chatroom
.participant-list
{
#conversejs
.chatroom
.participant-list
{
list-style
:
none
;
}
list-style
:
none
;
}
#conversejs
.chatroom
.participant-list
li
{
cursor
:
default
;
display
:
block
;
font-size
:
12px
;
font-weight
:
bold
;
overflow
:
hidden
;
padding
:
2px
5px
;
text-overflow
:
ellipsis
;
white-space
:
nowrap
;
}
#conversejs
.chatroom
.participant-list
li
.moderator
{
color
:
#8f2831
;
}
#conversejs
.chatroom
.chat-textarea
{
#conversejs
.chatroom
.chat-textarea
{
border-bottom-right-radius
:
0
;
}
border-bottom-right-radius
:
0
;
}
#conversejs
.chatroom
.chat-area
{
#conversejs
.chatroom
.chat-area
{
...
@@ -1577,12 +866,12 @@
...
@@ -1577,12 +866,12 @@
height
:
100%
;
height
:
100%
;
width
:
200px
;
}
width
:
200px
;
}
#conversejs
.chatroom
.invited-contact
{
#conversejs
.chatroom
.invited-contact
{
margin
:
0
;
margin
:
-1px
0
0
-1px
;
width
:
99
px
;
width
:
100
px
;
border
:
1px
solid
#999
;
}
border
:
1px
solid
#999
;
}
#conversejs
.chatroom
.invited-contact.tt-input
{
#conversejs
.chatroom
.invited-contact.tt-input
{
background
:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gkBCjE0uzKkOgAAAidJREFUKM+N0k+IEnEUB/D3cyscdagkWpHV0WGWREXm0AgOGkSJ07kh2UXYU5cOewm6Bp0KXG/tpSCv6hyEFQIhMEaE3yERYfwTOoqKGLQxDAbqYadLgu7J7/XxeY/3ez8EACDLsgljfMfj8ZxUKhXXYDAAnueBoqgyAMipVOovXAuSZdnUaDQeDofDs16vFyUIAjRNUwmCoG02G1AUdZ5IJN7GYrHfm3AvEAjcnUwmX0ajUdRqtV74fL6sruufKYoa6bp+fzabPUMI7ZfL5eImNHk8npNerxc1m80XHMe98fv9H3K5XDkSibxjWfb1arWaYoyPMMbCFqxUKi6CIODw8LDmdDq7oigaAACiKK5omv7KcdylpmlIkiTHFlRVFTRNUxVFqa/ROqIoGoqi5A3DgFartfU4Jp7ngSAI2uVyPZIk6dZmUZKk2w6H4xghBPF4HK7vWLbZbDCdTp+rqvpUkiS0RvV6/bTf7x8wDHMViURqm/AGAMgURZ232+1X1Wr102KxuEwmk3lZlo/7/f7BcrkkSZKs2e12tHXH/x/gHsY4jTE+0jQNGYYBCCFgGOaKJMkfjUaDZximGQ6HXzSbzZ+ZTMbY6oIxFgqFgqPT6YAgCMBxXM1ut6N0Op0fj8chi8XyjWXZ98Fg8DuCHZLNZh+USqWP8/n8idvt/hUKhV7u7QK9Xu8fmqanAJBQVXUfAGY7TQQAKBaLN8fjsdDtdh/run72Dzhf7XLe2UevAAAAAElFTkSuQmCC)
no-repeat
right
3px
center
;
}
background
:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gkBCjE0uzKkOgAAAidJREFUKM+N0k+IEnEUB/D3cyscdagkWpHV0WGWREXm0AgOGkSJ07kh2UXYU5cOewm6Bp0KXG/tpSCv6hyEFQIhMEaE3yERYfwTOoqKGLQxDAbqYadLgu7J7/XxeY/3ez8EACDLsgljfMfj8ZxUKhXXYDAAnueBoqgyAMipVOovXAuSZdnUaDQeDofDs16vFyUIAjRNUwmCoG02G1AUdZ5IJN7GYrHfm3AvEAjcnUwmX0ajUdRqtV74fL6sruufKYoa6bp+fzabPUMI7ZfL5eImNHk8npNerxc1m80XHMe98fv9H3K5XDkSibxjWfb1arWaYoyPMMbCFqxUKi6CIODw8LDmdDq7oigaAACiKK5omv7KcdylpmlIkiTHFlRVFTRNUxVFqa/ROqIoGoqi5A3DgFartfU4Jp7ngSAI2uVyPZIk6dZmUZKk2w6H4xghBPF4HK7vWLbZbDCdTp+rqvpUkiS0RvV6/bTf7x8wDHMViURqm/AGAMgURZ232+1X1Wr102KxuEwmk3lZlo/7/f7BcrkkSZKs2e12tHXH/x/gHsY4jTE+0jQNGYYBCCFgGOaKJMkfjUaDZximGQ6HXzSbzZ+ZTMbY6oIxFgqFgqPT6YAgCMBxXM1ut6N0Op0fj8chi8XyjWXZ98Fg8DuCHZLNZh+USqWP8/n8idvt/hUKhV7u7QK9Xu8fmqanAJBQVXUfAGY7TQQAKBaLN8fjsdDtdh/run72Dzhf7XLe2UevAAAAAElFTkSuQmCC)
no-repeat
right
3px
center
;
}
#conversejs
.chatroom
div
.participants
{
#conversejs
.chatroom
.participants
{
float
:
right
;
float
:
right
;
background-color
:
white
;
background-color
:
white
;
overflow-y
:
auto
;
overflow-y
:
auto
;
...
@@ -1591,24 +880,28 @@
...
@@ -1591,24 +880,28 @@
border-bottom-right-radius
:
4px
;
border-bottom-right-radius
:
4px
;
width
:
100px
;
width
:
100px
;
height
:
100%
;
}
height
:
100%
;
}
#conversejs
.chatroom
div
.participants
label
{
#conversejs
.chatroom
.participants
label
{
font-style
:
italic
;
}
font-size
:
12px
;
font-style
:
italic
;
margin
:
5px
;
display
:
block
;
}
#conversejs
.chatroom-form
,
#conversejs
.chatroom-form
,
#conversejs
.controlbox-pane
{
#conversejs
.controlbox-pane
{
text-align
:
center
;
background-color
:
white
;
background-color
:
white
;
border-bottom-left-radius
:
4px
;
border-bottom-left-radius
:
4px
;
border-bottom-right-radius
:
4px
;
border-bottom-right-radius
:
4px
;
border
:
0
;
border
:
0
;
font-size
:
14px
;
font-size
:
14px
;
height
:
289px
;
height
:
-webkit-calc
(
100%
-
40px
);
height
:
calc
(
100%
-
40px
);
overflow-y
:
auto
;
overflow-y
:
auto
;
position
:
absolute
;
position
:
absolute
;
width
:
100%
;
}
text-align
:
center
;
width
:
100%
;
height
:
289px
;
height
:
-webkit-calc
(
100%
-
44px
);
height
:
calc
(
100%
-
44px
);
}
#conversejs
.controlbox-pane
{
#conversejs
.controlbox-pane
{
padding
:
5px
0
;
}
padding
:
5px
0
;
overflow-y
:
hidden
;
}
#conversejs
.controlbox-pane
dd
{
#conversejs
.controlbox-pane
dd
{
margin-left
:
0
;
margin-left
:
0
;
margin-bottom
:
0
;
}
margin-bottom
:
0
;
}
...
@@ -1637,37 +930,31 @@
...
@@ -1637,37 +930,31 @@
#conversejs
#converse-register
input
,
#conversejs
#converse-register
input
,
#conversejs
#converse-login
input
{
#conversejs
#converse-login
input
{
width
:
100%
;
width
:
100%
;
height
:
30px
;
}
height
:
30px
;
margin
:
5px
0
10px
0
;
}
#conversejs
#converse-register
.input-group
{
#conversejs
#converse-register
.input-group
{
display
:
table
;
display
:
table
;
margin
:
auto
;
margin
:
auto
;
width
:
178px
;
}
width
:
178px
;
}
#conversejs
#converse-register
.input-group
span
,
#conversejs
#converse-register
.input-group
span
,
#conversejs
#converse-register
.input-group
input
[
name
=
username
]
{
#conversejs
#converse-register
.input-group
input
[
name
=
username
]
{
display
:
table-cell
;
}
display
:
table-cell
;
}
#conversejs
#converse-register
.input-group
input
[
name
=
username
]
{
#conversejs
#converse-register
.input-group
input
[
name
=
username
]
{
width
:
100%
;
}
width
:
100%
;
}
#conversejs
.cancel-submit
,
#conversejs
.save-submit
{
#conversejs
#converse-register
.cancel
,
#conversejs
.chatroom-form
.cancel-submit
,
#conversejs
#converse-register
.cancel-submit
{
color
:
#681F2C
;
}
#conversejs
.chatroom-form
.save-submit
,
#conversejs
#converse-register
.save-submit
{
color
:
#436F64
;
}
#conversejs
.chatroom-form
.save-submit
,
#conversejs
.chatroom-form
.cancel-submit
,
#conversejs
#converse-register
.cancel-submit
,
#conversejs
#converse-register
.save-submit
{
width
:
45%
;
width
:
45%
;
margin
:
5px
3px
5px
3px
;
}
margin
:
5px
3px
5px
3px
;
}
#conversejs
.cancel
,
#conversejs
.cancel-submit
{
color
:
#681F2C
;
}
#conversejs
.save-submit
{
color
:
#436F64
;
}
#conversejs
.chatroom-form
label
,
#conversejs
.chatroom-form
label
,
#conversejs
.controlbox-pane
label
,
#conversejs
.controlbox-pane
label
,
#conversejs
#converse-register
label
,
#conversejs
#converse-register
label
,
#conversejs
#converse-login
label
{
#conversejs
#converse-login
label
{
height
:
auto
;
font-size
:
14px
;
font-size
:
14px
;
margin
:
4px
;
font-weight
:
bold
;
font-weight
:
bold
;
}
height
:
auto
;
margin
:
4px
;
}
#conversejs
#converse-register
.login-submit
,
#conversejs
#converse-register
.login-submit
,
#conversejs
#converse-login
.login-submit
,
#conversejs
#converse-login
.login-submit
,
#conversejs
#converse-register
.submit
,
#conversejs
#converse-register
.submit
,
...
@@ -1675,91 +962,107 @@
...
@@ -1675,91 +962,107 @@
height
:
30px
;
height
:
30px
;
padding
:
0px
;
padding
:
0px
;
font-size
:
14px
;
}
font-size
:
14px
;
}
#conversejs
form
.set-xmpp-status
{
#conversejs
#converse-login
.submit
{
background
:
none
;
margin
:
1em
0
;
}
margin
:
none
;
padding
:
none
;
}
#conversejs
form
.add-chatroom
{
#conversejs
form
.add-chatroom
{
background
:
none
;
background
:
none
;
padding
:
8px
;
}
padding
:
8px
;
}
#conversejs
form
.add-chatroom
input
[
type
=
button
],
#conversejs
form
.add-chatroom
input
[
type
=
button
],
#conversejs
form
.add-chatroom
input
[
type
=
submit
],
#conversejs
form
.add-chatroom
input
[
type
=
submit
],
#conversejs
form
.add-chatroom
input
[
type
=
text
]
{
#conversejs
form
.add-chatroom
input
[
type
=
text
]
{
margin
:
3px
0
;
margin
:
0
;
width
:
100%
;
}
width
:
100%
;
padding
:
5px
;
}
#conversejs
form
.add-chatroom
input
[
type
=
submit
]
{
#conversejs
form
.add-chatroom
input
[
type
=
submit
]
{
margin
:
5px
0
;
color
:
#436F64
;
}
color
:
#436F64
;
}
#conversejs
select
#select-xmpp-status
{
#conversejs
select
#select-xmpp-status
{
float
:
right
;
float
:
right
;
margin-right
:
0.5em
;
}
margin-right
:
0.5em
;
}
#conversejs
.chat-head
#controlbox-tabs
{
#conversejs
.chat-head
{
text-align
:
center
;
border-top-left-radius
:
4px
;
display
:
inline
;
border-top-right-radius
:
4px
;
overflow
:
hidden
;
color
:
#ffffff
;
font-size
:
12px
;
font-size
:
100%
;
list-style-type
:
none
;
margin
:
0
;
/* single tab */
}
padding
:
6px
;
}
#conversejs
.chat-head
#controlbox-tabs
a
.current
,
#conversejs
.chat-head.controlbox-head
{
#conversejs
.chat-head
#controlbox-tabs
a
.current
:hover
{
background-color
:
#436F64
;
box-shadow
:
none
;
border-top-left-radius
:
4px
;
border-bottom
:
0
;
border-top-right-radius
:
4px
;
height
:
40px
;
color
:
white
;
cursor
:
default
;
height
:
44px
;
color
:
#6C4C44
;
}
margin
:
0
;
#conversejs
.chat-head
#controlbox-tabs
li
{
padding
:
6px
6px
6px
0
;
}
float
:
left
;
#conversejs
.chat-head
.avatar
{
list-style
:
none
;
float
:
left
;
}
padding-left
:
0
;
#conversejs
.chat-head
#controlbox-tabs
{
text-shadow
:
white
0
1px
0
;
text-align
:
center
;
width
:
38%
;
}
display
:
inline
;
#conversejs
.chat-head
#controlbox-tabs
li
a
{
overflow
:
hidden
;
background-color
:
white
;
font-size
:
12px
;
border-bottom
:
1px
solid
#CCC
;
list-style-type
:
none
;
border-top-left-radius
:
4px
;
/* single tab */
}
border-top-right-radius
:
4px
;
#conversejs
.chat-head
#controlbox-tabs
a
.current
,
box-shadow
:
inset
0
4px
12px
rgba
(
0
,
0
,
0
,
0.3
);
#conversejs
.chat-head
#controlbox-tabs
a
.current
:hover
{
color
:
#888
;
box-shadow
:
none
;
display
:
block
;
border-bottom
:
0
;
font-size
:
12px
;
height
:
44px
;
height
:
39px
;
cursor
:
default
;
line-height
:
39px
;
margin
:
0
;
text-align
:
center
;
text-decoration
:
none
;
}
#conversejs
.chat-head
#controlbox-tabs
li
a
:hover
{
color
:
#6C4C44
;
}
color
:
#6C4C44
;
}
#conversejs
.chat-head
#controlbox-tabs
li
{
float
:
left
;
list-style
:
none
;
padding-left
:
0
;
text-shadow
:
white
0
1px
0
;
width
:
38%
;
}
#conversejs
.chat-head
#controlbox-tabs
li
a
{
background-color
:
white
;
border-bottom
:
1px
solid
#CCC
;
border-top-left-radius
:
4px
;
border-top-right-radius
:
4px
;
box-shadow
:
inset
0
4px
12px
rgba
(
0
,
0
,
0
,
0.3
);
color
:
#888
;
display
:
block
;
font-size
:
12px
;
height
:
43px
;
line-height
:
43px
;
margin
:
0
;
text-align
:
center
;
text-decoration
:
none
;
}
#conversejs
.chat-head
#controlbox-tabs
li
a
:hover
{
color
:
#6C4C44
;
}
#conversejs
div
#chatrooms
{
#conversejs
div
#chatrooms
{
overflow-y
:
auto
;
}
overflow-y
:
auto
;
}
#conversejs
form
.sendXMPPMessage
{
#conversejs
form
.sendXMPPMessage
{
background
:
white
;
border
:
0
;
border-top
:
1px
solid
#BBB
;
padding
:
0
;
margin
:
0
;
position
:
relative
;
-webkit-border-radius
:
4px
;
-moz-border-radius
:
4px
;
border-radius
:
4px
;
-moz-background-clip
:
padding
;
-moz-background-clip
:
padding
;
-moz-border-radius
:
4px
;
-webkit-background-clip
:
padding-box
;
-webkit-background-clip
:
padding-box
;
-webkit-border-radius
:
4px
;
background-clip
:
padding-box
;
background-clip
:
padding-box
;
background
:
white
;
border-radius
:
4px
;
border-top-left-radius
:
0
;
border-top-left-radius
:
0
;
border-top-right-radius
:
0
;
border-top-right-radius
:
0
;
width
:
200px
;
border-top
:
1px
solid
#BBB
;
height
:
83px
;
}
#conversejs
.chat-textarea
{
box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
border
:
0
;
border
:
0
;
width
:
100%
;
margin
:
0
;
padding
:
3px
;
padding
:
0
;
border-bottom-left-radius
:
4px
;
position
:
relative
;
border-bottom-right-radius
:
4px
;
width
:
200px
;
resize
:
none
;
}
height
:
84px
;
}
#conversejs
form
.sendXMPPMessage
.chat-textarea
{
border-bottom-left-radius
:
4px
;
border-bottom-right-radius
:
4px
;
border
:
0
;
height
:
64px
;
padding
:
8px
;
resize
:
none
;
width
:
100%
;
}
#conversejs
.chat-toolbar
{
#conversejs
.chat-toolbar
{
font-size
:
14px
;
font-size
:
14px
;
margin
:
0
;
margin
:
0
;
padding
:
0
5px
0
0
;
padding
:
0
4px
;
height
:
20px
;
height
:
20px
;
display
:
block
;
}
display
:
block
;
}
#conversejs
.chat-toolbar
a
{
#conversejs
.chat-toolbar
a
{
...
@@ -1822,23 +1125,29 @@
...
@@ -1822,23 +1125,29 @@
#conversejs
.chat-toolbar-text
{
#conversejs
.chat-toolbar-text
{
font-size
:
12px
;
font-size
:
12px
;
padding-right
:
3px
;
}
padding-right
:
3px
;
}
#conversejs
form
#set-custom-xmpp-status
{
#conversejs
#set-custom-xmpp-status
{
float
:
left
;
float
:
left
;
padding
:
0
;
}
padding
:
0
;
}
#conversejs
#set-custom-xmpp-status
input
{
height
:
23px
;
}
#conversejs
#set-custom-xmpp-status
button
{
height
:
23px
;
width
:
40px
;
padding
:
1px
2px
1px
1px
;
}
#conversejs
.custom-xmpp-status
{
width
:
-webkit-calc
(
100%
-
40px
);
width
:
calc
(
100%
-
40px
);
}
#conversejs
.chat-textarea-chatbox-selected
{
#conversejs
.chat-textarea-chatbox-selected
{
border
:
1px
solid
#578308
;
border
:
1px
solid
#578308
;
margin
:
0
;
}
margin
:
0
;
}
#conversejs
.chat-textarea-chatroom-selected
{
#conversejs
.chat-textarea-chatroom-selected
{
border
:
2px
solid
#436F64
;
border
:
2px
solid
#436F64
;
margin
:
0
;
}
margin
:
0
;
}
#conversejs
#set-custom-xmpp-status
button
{
padding
:
1px
2px
1px
1px
;
}
#conversejs
#controlbox
{
#conversejs
#controlbox
{
display
:
none
;
}
display
:
none
;
}
#conversejs
#controlbox
div
.xmpp-status
{
#conversejs
#controlbox
div
.xmpp-status
{
display
:
inline
;
}
display
:
inline
;
}
#conversejs
.chatbox
.dropdown
{
#conversejs
.chatbox
.dropdown
{
margin
:
0.5em
;
background-color
:
#F1E2DD
;
}
background-color
:
#F1E2DD
;
}
#conversejs
.chatbox
.dropdown
dd
{
#conversejs
.chatbox
.dropdown
dd
{
position
:
relative
;
}
position
:
relative
;
}
...
@@ -1847,8 +1156,6 @@
...
@@ -1847,8 +1156,6 @@
#conversejs
.dropdown
ul
{
#conversejs
.dropdown
ul
{
margin
:
0
;
margin
:
0
;
padding
:
0
;
}
padding
:
0
;
}
#conversejs
.custom-xmpp-status
{
width
:
124px
;
}
#conversejs
.add-xmpp-contact
{
#conversejs
.add-xmpp-contact
{
background
:
none
;
background
:
none
;
padding
:
5px
;
}
padding
:
5px
;
}
...
@@ -1858,15 +1165,19 @@
...
@@ -1858,15 +1165,19 @@
width
:
100%
;
}
width
:
100%
;
}
#conversejs
.xmpp-status-menu
{
#conversejs
.xmpp-status-menu
{
text-align
:
left
;
}
text-align
:
left
;
}
#conversejs
.xmpp-status-menu
li
a
{
#conversejs
.xmpp-status-menu
li
{
width
:
100%
;
}
padding
:
2px
;
}
#conversejs
.xmpp-status-menu
li
a
span
{
#conversejs
.xmpp-status-menu
li
a
{
padding
:
0
5px
0
5px
;
}
width
:
100%
;
padding
:
0
8px
;
}
#conversejs
.xmpp-status-menu
li
a
.logout
,
#conversejs
.xmpp-status-menu
li
a
.logout
,
#conversejs
.xmpp-status-menu
li
a
.logout
span
{
#conversejs
.xmpp-status-menu
li
a
.logout
span
{
color
:
#681F2C
;
}
color
:
#681F2C
;
}
#conversejs
.set-xmpp-status
.dropdown
dd
ul
{
#conversejs
.set-xmpp-status
{
z-index
:
22
;
}
background
:
none
;
padding
:
0.5em
;
}
#conversejs
.set-xmpp-status
.dropdown
dd
ul
{
z-index
:
22
;
}
#conversejs
.minimized-chats-flyout
,
#conversejs
.minimized-chats-flyout
,
#conversejs
.box-flyout
{
#conversejs
.box-flyout
{
border-radius
:
4px
;
border-radius
:
4px
;
...
...
mockup/index.html
View file @
768dcbda
...
@@ -240,38 +240,38 @@
...
@@ -240,38 +240,38 @@
</dd>
</dd>
</dl>
</dl>
</div>
</div>
<div
id=
"chatrooms"
style=
"display: none;"
>
</div
>
<form
class=
"add-chatroom"
action=
""
method=
"post
"
>
<div
id=
"chatrooms"
class=
"controlbox-pane"
style=
"display: none;
"
>
<input
type=
"text"
name=
"chatroom"
class=
"new-chatroom-name"
placeholder=
"Room name
"
>
<form
class=
"add-chatroom"
action=
""
method=
"post
"
>
<input
type=
"text"
name=
"nick"
class=
"new-chatroom-nick"
placeholder=
"Nick
name"
>
<input
type=
"text"
name=
"chatroom"
class=
"new-chatroom-name"
placeholder=
"Room
name"
>
<input
type=
"text"
name=
"server"
class=
"new-chatroom-server"
placeholder=
"Server
"
>
<input
type=
"text"
name=
"nick"
class=
"new-chatroom-nick"
placeholder=
"Nickname
"
>
<input
type=
"submit"
name=
"join"
value=
"Join
"
>
<input
type=
"text"
name=
"server"
class=
"new-chatroom-server"
placeholder=
"Server
"
>
<input
type=
"button"
name=
"show"
id=
"show-rooms"
value=
"Show rooms"
style=
"display: inline-block;
"
>
<input
type=
"submit"
name=
"join"
value=
"Join
"
>
</form
>
<input
type=
"button"
name=
"show"
id=
"show-rooms"
value=
"Show rooms"
style=
"display: inline-block;"
>
<dl
id=
"available-chatrooms"
>
</form
>
<dt>
Rooms on conference.opkode.im
</dt
>
<dl
id=
"available-chatrooms"
>
<dd
class=
"available-chatroom"
>
<dt>
Rooms on conference.opkode.im
</dt
>
<a
class=
"open-room"
<dd
class=
"available-chatroom"
>
data-room-jid=
"converse.js@conference.opkode.im"
<a
class=
"open-room"
title=
"Click to open this room"
href=
"#"
>
Special chatroom with a long name (2)
</a>
data-room-jid=
"converse.js@conference.opkode.im"
<a
class=
"room-info icon-room-info"
title=
"Click to open this room"
href=
"#"
>
Special chatroom with a long name (2)
</a>
data-room-jid=
"converse.js@conference.opkode.im
"
<a
class=
"room-info icon-room-info
"
title=
"Show more information on this room"
href=
"#"
>
</a>
data-room-jid=
"converse.js@conference.opkode.im"
<div
class=
"room-info"
>
title=
"Show more information on this room"
href=
"#"
>
</a
>
<p
class=
"room-info"
><strong>
Description:
</strong></p
>
<div
class=
"room-info"
>
<p
class=
"room-info"
><strong>
Occupants:
</strong>
2
</p>
<p
class=
"room-info"
><strong>
Description:
</strong>
</p>
<p
class=
"room-info"
><strong>
Features:
</strong>
</p>
<p
class=
"room-info"
><strong>
Occupants:
</strong>
2
</p>
<ul
>
<p
class=
"room-info"
><strong>
Features:
</strong>
</p
>
<li
class=
"room-info"
>
Moderated
</li><li
class=
"room-info"
>
Open room
</li
>
<ul
>
<li
class=
"room-info"
>
Permanent room
</li><li
class=
"room-info"
>
Public
</li>
<li
class=
"room-info"
>
Moderated
</li><li
class=
"room-info"
>
Open room
</li>
<li
class=
"room-info"
>
Semi-anonymous
</li>
<li
class=
"room-info"
>
Permanent room
</li><li
class=
"room-info"
>
Public
</li>
<li
class=
"room-info"
>
Requires authentication
<span
class=
"icon-lock"
></span>
</li>
<li
class=
"room-info"
>
Semi-anonymous
</li>
<p></p
>
<li
class=
"room-info"
>
Requires authentication
<span
class=
"icon-lock"
></span></li
>
</ul
>
<p></p
>
</div
>
</ul
>
</dd
>
</div
>
</dl
>
</dd
>
</div
>
</dl
>
</div>
</div>
</div>
</div>
</div>
</div>
...
@@ -369,7 +369,6 @@
...
@@ -369,7 +369,6 @@
<div
class=
"chat-body"
>
<div
class=
"chat-body"
>
<div
class=
"chat-area"
>
<div
class=
"chat-area"
>
<div
class=
"chat-content"
>
<div
class=
"chat-content"
>
<time
class=
"chat-date"
datetime=
"2013-06-04T00:00:00.000Z"
>
Tue Jun 04 2013
</time>
<div
class=
"chat-message "
>
<div
class=
"chat-message "
>
<span
class=
"chat-message-room"
>
18:50 luke:
</span>
<span
class=
"chat-message-room"
>
18:50 luke:
</span>
<span
class=
"chat-message-content"
>
leia: hi :)
</span>
<span
class=
"chat-message-content"
>
leia: hi :)
</span>
...
@@ -379,6 +378,7 @@
...
@@ -379,6 +378,7 @@
<span
class=
"chat-message-content"
>
<span
class=
"chat-message-content"
>
I'll be gone for a while, will be back in about an hour
</span>
I'll be gone for a while, will be back in about an hour
</span>
</div>
</div>
<time
class=
"chat-date"
datetime=
"2013-06-04T00:00:00.000Z"
>
Tue Jun 04 2013
</time>
<div
class=
"chat-message "
>
<div
class=
"chat-message "
>
<span
class=
"chat-message-room"
>
19:40 Obi-wan Kenobi, Jedi Master:
</span>
<span
class=
"chat-message-room"
>
19:40 Obi-wan Kenobi, Jedi Master:
</span>
<span
class=
"chat-message-content"
>
<span
class=
"chat-message-content"
>
...
@@ -540,6 +540,9 @@ $(document).ready(function () {
...
@@ -540,6 +540,9 @@ $(document).ready(function () {
$
(
'
a[href=#users]
'
).
click
(
function
(
ev
)
{
$
(
'
a[href=#users]
'
).
click
(
function
(
ev
)
{
switchTab
(
ev
);
switchTab
(
ev
);
});
});
$
(
'
a[href=#register]
'
).
click
(
function
(
ev
)
{
switchTab
(
ev
);
});
$
(
"
a.choose-xmpp-status
"
).
click
(
function
(
ev
)
{
$
(
"
a.choose-xmpp-status
"
).
click
(
function
(
ev
)
{
ev
.
preventDefault
();
ev
.
preventDefault
();
...
@@ -550,8 +553,7 @@ $(document).ready(function () {
...
@@ -550,8 +553,7 @@ $(document).ready(function () {
ev
.
preventDefault
();
ev
.
preventDefault
();
var
form
=
''
+
var
form
=
''
+
'
<form id="set-custom-xmpp-status">
'
+
'
<form id="set-custom-xmpp-status">
'
+
'
<input type="text" class="custom-xmpp-status"I am online"
'
+
'
<input type="text" class="custom-xmpp-status" placeholder="Custom status"/>
'
+
'
placeholder="I am online"/>
'
+
'
<button type="submit">Save</button>
'
+
'
<button type="submit">Save</button>
'
+
'
</form>
'
;
'
</form>
'
;
...
...
sass/converse.scss
View file @
768dcbda
...
@@ -35,8 +35,9 @@
...
@@ -35,8 +35,9 @@
#conversejs
{
#conversejs
{
@import
"components/neat/app/assets/stylesheets/neat"
;
@import
"components/neat/app/assets/stylesheets/neat"
;
/
* XXX: These should be moved to a separate file */
/
/ XXX: These should be moved to a separate file
$link-color
:
#436F64
;
$link-color
:
#436F64
;
$inverse-link-color
:
white
;
$link-shadow-color
:
#FAFAFA
;
$link-shadow-color
:
#FAFAFA
;
$text-shadow-color
:
#FAFAFA
;
$text-shadow-color
:
#FAFAFA
;
$text-color
:
#6C4C44
;
$text-color
:
#6C4C44
;
...
@@ -49,8 +50,14 @@
...
@@ -49,8 +50,14 @@
$chat-head-color
:
#436F64
;
$chat-head-color
:
#436F64
;
$chatroom-head-color
:
#0F592F
;
$chatroom-head-color
:
#0F592F
;
$chat-head-text-color
:
white
;
$chat-head-text-color
:
white
;
$chat-head-height
:
40px
;
$chat-head-inverse-text-color
:
white
;
$chat-head-height
:
44px
;
$save-button-color
:
#436F64
;
$save-button-color
:
#436F64
;
$chat-textarea-height
:
64px
;
$toolbar-height
:
20px
;
$message-them-color
:
#4B7003
;
$roster-height
:
194px
;
$controlbox-dropdown-height
:
25px
;
$font-size
:
14px
;
$font-size
:
14px
;
$legend-font-size
:
16px
;
$legend-font-size
:
16px
;
...
@@ -94,7 +101,7 @@
...
@@ -94,7 +101,7 @@
}
}
textarea
,
textarea
,
input
[
type
=
submit
],
input
[
type
=
submit
],
input
[
type
=
button
],
input
[
type
=
text
],
input
[
type
=
password
],
input
[
type
=
text
],
input
[
type
=
password
],
button
{
button
{
font-size
:
$font-size
;
font-size
:
$font-size
;
...
@@ -116,35 +123,17 @@
...
@@ -116,35 +123,17 @@
ul
,
ol
,
dl
{
ul
,
ol
,
dl
{
font
:
inherit
;
font
:
inherit
;
margin
:
0
0
15px
0
;
margin
:
0
;
}
}
<<<<<<<
HEAD
=======
color
:
$text-color
;
font-size
:
$font-size
;
bottom
:
0
;
direction
:
ltr
;
height
:
25px
;
left
:
0
;
position
:
fixed
;
right
:
0
;
z-index
:
30
;
display
:
block
;
box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
-webkit-box-sizing
:
border-box
;
>>>>>>>
5c9a7c257b032996cce5c2059c56acf23b61843b
[
data-icon
]
:before
{
[
data-icon
]
:before
{
font-family
:
'Converse-js'
;
content
:
attr
(
data-icon
);
content
:
attr
(
data-icon
);
speak
:
none
;
font-family
:
'Converse-js'
;
font-weight
:
normal
;
font-variant
:
normal
;
font-variant
:
normal
;
text-transform
:
none
;
font-weight
:
normal
;
line-height
:
1
;
line-height
:
1
;
speak
:
none
;
text-transform
:
none
;
/* Better Font Rendering =========== */
/* Better Font Rendering =========== */
-webkit-font-smoothing
:
antialiased
;
-webkit-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
;
-moz-osx-font-smoothing
:
grayscale
;
...
@@ -152,109 +141,109 @@
...
@@ -152,109 +141,109 @@
[
class
^=
"icon-"
],
[
class
*=
" icon-"
]
{
[
class
^=
"icon-"
],
[
class
*=
" icon-"
]
{
font-family
:
'Converse-js'
;
font-family
:
'Converse-js'
;
speak
:
none
;
font-style
:
normal
;
font-style
:
normal
;
font-weight
:
normal
;
font-variant
:
normal
;
font-variant
:
normal
;
text-transform
:
none
;
font-weight
:
normal
;
line-height
:
1
;
line-height
:
1
;
speak
:
none
;
text-transform
:
none
;
/* Better Font Rendering =========== */
/* Better Font Rendering =========== */
-webkit-font-smoothing
:
antialiased
;
-webkit-font-smoothing
:
antialiased
;
-moz-osx-font-smoothing
:
grayscale
;
-moz-osx-font-smoothing
:
grayscale
;
}
}
.icon-address-book
:before
{
content
:
"\270f"
;
}
.icon-address-book
:before
{
content
:
"\270f"
;
}
.icon-angry
:before
{
content
:
"\e03f"
;
}
.icon-angry
:before
{
content
:
"\e03f"
;
}
.icon-attachment
:before
{
content
:
"\e032"
;
}
.icon-attachment
:before
{
content
:
"\e032"
;
}
.icon-away
:before
{
content
:
"\25fb"
;
}
.icon-away
:before
{
content
:
"\25fb"
;
}
.icon-blocked
:before
{
content
:
"\2718"
;
}
.icon-blocked
:before
{
content
:
"\2718"
;
}
.icon-bold
:before
{
content
:
"\e04d"
;
}
.icon-bold
:before
{
content
:
"\e04d"
;
}
.icon-bubbles-2
:before
{
content
:
"\e016"
;
}
.icon-bubbles-2
:before
{
content
:
"\e016"
;
}
.icon-bubbles-3
:before
{
content
:
"\e017"
;
}
.icon-bubbles-3
:before
{
content
:
"\e017"
;
}
.icon-bubbles
:before
{
content
:
"\e015"
;
}
.icon-bubbles
:before
{
content
:
"\e015"
;
}
.icon-camera-2
:before
{
content
:
"\2616"
;
}
.icon-camera-2
:before
{
content
:
"\2616"
;
}
.icon-camera
:before
{
content
:
"\e003"
;
}
.icon-camera
:before
{
content
:
"\e003"
;
}
.icon-cancel-circle
:before
{
content
:
"\e058"
;
}
.icon-cancel-circle
:before
{
content
:
"\e058"
;
}
.icon-checkbox-checked
:before
{
content
:
"\2611"
;
}
.icon-checkbox-checked
:before
{
content
:
"\2611"
;
}
.icon-checkbox-partial
:before
{
content
:
"\2b28"
;
}
.icon-checkbox-partial
:before
{
content
:
"\2b28"
;
}
.icon-checkbox-unchecked
:before
{
content
:
"\2b27"
;
}
.icon-checkbox-unchecked
:before
{
content
:
"\2b27"
;
}
.icon-checkmark
:before
{
content
:
"\2713"
;
}
.icon-checkmark
:before
{
content
:
"\2713"
;
}
.icon-close
:before
{
content
:
"\2715"
;
}
.icon-close
:before
{
content
:
"\2715"
;
}
.icon-closed
:before
{
content
:
"\25ba"
;
}
.icon-closed
:before
{
content
:
"\25ba"
;
}
.icon-cog
:before
{
content
:
"\e02f"
;
}
.icon-cog
:before
{
content
:
"\e02f"
;
}
.icon-cogs
:before
{
content
:
"\e022"
;
}
.icon-cogs
:before
{
content
:
"\e022"
;
}
.icon-confused
:before
{
content
:
"\2368"
;
}
.icon-confused
:before
{
content
:
"\2368"
;
}
.icon-cool
:before
{
content
:
"\e040"
;
}
.icon-cool
:before
{
content
:
"\e040"
;
}
.icon-dnd
:before
{
content
:
"\e004"
;
}
.icon-dnd
:before
{
content
:
"\e004"
;
}
.icon-envelop
:before
{
content
:
"\2709"
;
}
.icon-envelop
:before
{
content
:
"\2709"
;
}
.icon-evil
:before
{
content
:
"\261f"
;
}
.icon-evil
:before
{
content
:
"\261f"
;
}
.icon-eye-blocked
:before
{
content
:
"\e031"
;
}
.icon-eye-blocked
:before
{
content
:
"\e031"
;
}
.icon-eye
:before
{
content
:
"\e030"
;
}
.icon-eye
:before
{
content
:
"\e030"
;
}
.icon-globe
:before
{
content
:
"\e033"
;
}
.icon-globe
:before
{
content
:
"\e033"
;
}
.icon-grin
:before
{
content
:
"\e041"
;
}
.icon-grin
:before
{
content
:
"\e041"
;
}
.icon-happy
:before
{
content
:
"\263b"
;
}
.icon-happy
:before
{
content
:
"\263b"
;
}
.icon-headphones
:before
{
content
:
"\266c"
;
}
.icon-headphones
:before
{
content
:
"\266c"
;
}
.icon-heart
:before
{
content
:
"\2764"
;
}
.icon-heart
:before
{
content
:
"\2764"
;
}
.icon-hide-users
:before
{
content
:
"\e01c"
;
}
.icon-hide-users
:before
{
content
:
"\e01c"
;
}
.icon-home
:before
{
content
:
"\e000"
;
}
.icon-home
:before
{
content
:
"\e000"
;
}
.icon-image
:before
{
content
:
"\2b14"
;
}
.icon-image
:before
{
content
:
"\2b14"
;
}
.icon-info
:before
{
content
:
"\2360"
;
}
.icon-info
:before
{
content
:
"\2360"
;
}
.icon-italic
:before
{
content
:
"\e04f"
;
}
.icon-italic
:before
{
content
:
"\e04f"
;
}
.icon-key-2
:before
{
content
:
"\e029"
;
}
.icon-key-2
:before
{
content
:
"\e029"
;
}
.icon-key
:before
{
content
:
"\e028"
;
}
.icon-key
:before
{
content
:
"\e028"
;
}
.icon-lock-2
:before
{
content
:
"\e027"
;
}
.icon-lock-2
:before
{
content
:
"\e027"
;
}
.icon-lock
:before
{
content
:
"\e026"
;
}
.icon-lock
:before
{
content
:
"\e026"
;
}
.icon-logout
:before
{
content
:
"\e601"
;
}
.icon-logout
:before
{
content
:
"\e601"
;
}
.icon-minus
:before
{
content
:
"\e05a"
;
}
.icon-minus
:before
{
content
:
"\e05a"
;
}
.icon-music
:before
{
content
:
"\266b"
;
}
.icon-music
:before
{
content
:
"\266b"
;
}
.icon-new-tab
:before
{
content
:
"\e053"
;
}
.icon-new-tab
:before
{
content
:
"\e053"
;
}
.icon-newspaper
:before
{
content
:
"\e001"
;
}
.icon-newspaper
:before
{
content
:
"\e001"
;
}
.icon-notebook
:before
{
content
:
"\2710"
;
}
.icon-notebook
:before
{
content
:
"\2710"
;
}
.icon-notification
:before
{
content
:
"\e01f"
;
}
.icon-notification
:before
{
content
:
"\e01f"
;
}
.icon-online
:before
{
content
:
"\25fc"
;
}
.icon-online
:before
{
content
:
"\25fc"
;
}
.icon-opened
:before
{
content
:
"\25bc"
;
}
.icon-opened
:before
{
content
:
"\25bc"
;
}
.icon-pencil
:before
{
content
:
"\270e"
;
}
.icon-pencil
:before
{
content
:
"\270e"
;
}
.icon-phone-hang-up
:before
{
content
:
"\260e"
;
}
.icon-phone-hang-up
:before
{
content
:
"\260e"
;
}
.icon-phone
:before
{
content
:
"\260f"
;
}
.icon-phone
:before
{
content
:
"\260f"
;
}
.icon-play
:before
{
content
:
"\25d9"
;
}
.icon-play
:before
{
content
:
"\25d9"
;
}
.icon-plus
:before
{
content
:
"\271a"
;
}
.icon-plus
:before
{
content
:
"\271a"
;
}
.icon-pushpin
:before
{
content
:
"\e012"
;
}
.icon-pushpin
:before
{
content
:
"\e012"
;
}
.icon-quotes-left
:before
{
content
:
"\e01d"
;
}
.icon-quotes-left
:before
{
content
:
"\e01d"
;
}
.icon-radio-checked
:before
{
content
:
"\2b26"
;
}
.icon-radio-checked
:before
{
content
:
"\2b26"
;
}
.icon-radio-unchecked
:before
{
content
:
"\2b25"
;
}
.icon-radio-unchecked
:before
{
content
:
"\2b25"
;
}
.icon-remove
:before
{
content
:
"\e02d"
;
}
.icon-remove
:before
{
content
:
"\e02d"
;
}
.icon-room-info
:before
{
content
:
"\e059"
;
}
.icon-room-info
:before
{
content
:
"\e059"
;
}
.icon-sad
:before
{
content
:
"\2639"
;
}
.icon-sad
:before
{
content
:
"\2639"
;
}
.icon-search
:before
{
content
:
"\e021"
;
}
.icon-search
:before
{
content
:
"\e021"
;
}
.icon-shocked
:before
{
content
:
"\2364"
;
}
.icon-shocked
:before
{
content
:
"\2364"
;
}
.icon-show-users
:before
{
content
:
"\e01e"
;
}
.icon-show-users
:before
{
content
:
"\e01e"
;
}
.icon-smiley
:before
{
content
:
"\263a"
;
}
.icon-smiley
:before
{
content
:
"\263a"
;
}
.icon-spell-check
:before
{
content
:
"\e045"
;
}
.icon-spell-check
:before
{
content
:
"\e045"
;
}
.icon-spinner
:before
{
content
:
"\231b"
;
}
.icon-spinner
:before
{
content
:
"\231b"
;
}
.icon-strikethrough
:before
{
content
:
"\e050"
;
}
.icon-strikethrough
:before
{
content
:
"\e050"
;
}
.icon-thumbs-up
:before
{
content
:
"\261d"
;
}
.icon-thumbs-up
:before
{
content
:
"\261d"
;
}
.icon-tongue
:before
{
content
:
"\e038"
;
}
.icon-tongue
:before
{
content
:
"\e038"
;
}
.icon-underline
:before
{
content
:
"\e04e"
;
}
.icon-underline
:before
{
content
:
"\e04e"
;
}
.icon-unlocked
:before
{
content
:
"\e025"
;
}
.icon-unlocked
:before
{
content
:
"\e025"
;
}
.icon-user
:before
{
content
:
"\e01a"
;
}
.icon-user
:before
{
content
:
"\e01a"
;
}
.icon-users
:before
{
content
:
"\e01b"
;
}
.icon-users
:before
{
content
:
"\e01b"
;
}
.icon-volume-decrease
:before
{
content
:
"\e04b"
;
}
.icon-volume-decrease
:before
{
content
:
"\e04b"
;
}
.icon-volume-high
:before
{
content
:
"\e046"
;
}
.icon-volume-high
:before
{
content
:
"\e046"
;
}
.icon-volume-increase
:before
{
content
:
"\e04c"
;
}
.icon-volume-increase
:before
{
content
:
"\e04c"
;
}
.icon-volume-low
:before
{
content
:
"\e048"
;
}
.icon-volume-low
:before
{
content
:
"\e048"
;
}
.icon-volume-medium
:before
{
content
:
"\e047"
;
}
.icon-volume-medium
:before
{
content
:
"\e047"
;
}
.icon-volume-mute-2
:before
{
content
:
"\e04a"
;
}
.icon-volume-mute-2
:before
{
content
:
"\e04a"
;
}
.icon-volume-mute
:before
{
content
:
"\e049"
;
}
.icon-volume-mute
:before
{
content
:
"\e049"
;
}
.icon-warning
:before
{
content
:
"\26a0"
;
}
.icon-warning
:before
{
content
:
"\26a0"
;
}
.icon-wink
:before
{
content
:
"\e03a"
;
}
.icon-wink
:before
{
content
:
"\e03a"
;
}
.icon-wondering
:before
{
content
:
"\2369"
;
}
.icon-wondering
:before
{
content
:
"\2369"
;
}
.icon-wrench
:before
{
content
:
"\e024"
;
}
.icon-wrench
:before
{
content
:
"\e024"
;
}
.icon-xa
:before
,
.icon-xa
:before
,
.icon-unavailable
:before
,
.icon-unavailable
:before
,
.icon-offline
:before
{
content
:
"\e002"
;
}
.icon-offline
:before
{
content
:
"\e002"
;
}
.icon-youtube
:before
{
content
:
"\e055"
;
}
.icon-youtube
:before
{
content
:
"\e055"
;
}
.icon-zoom-in
:before
{
content
:
"\e02b"
;
}
.icon-zoom-in
:before
{
content
:
"\e02b"
;
}
.icon-zoom-out
:before
{
content
:
"\e02a"
;
}
.icon-zoom-out
:before
{
content
:
"\e02a"
;
}
.no-text-select
{
.no-text-select
{
-webkit-touch-callout
:
none
;
-webkit-touch-callout
:
none
;
...
@@ -309,16 +298,15 @@
...
@@ -309,16 +298,15 @@
#minimized-chats
,
#minimized-chats
,
.toggle-controlbox
{
.toggle-controlbox
{
float
:
right
;
font-size
:
90%
;
border-top-right-radius
:
2px
;
border-top-left-radius
:
2px
;
border-top-left-radius
:
2px
;
background-color
:
#F4F4F4
;
border-top-right-radius
:
2px
;
padding
:
4px
8px
;
margin-right
:
5px
;
color
:
#0a0a0a
;
color
:
#0a0a0a
;
float
:
right
;
font-size
:
90%
;
font-weight
:
bold
;
font-weight
:
bold
;
height
:
100%
;
height
:
100%
;
margin-right
:
5px
;
padding
:
4px
8px
;
}
}
#minimized-chats
{
#minimized-chats
{
...
@@ -351,8 +339,6 @@
...
@@ -351,8 +339,6 @@
display
:
block
;
display
:
block
;
width
:
100%
;
width
:
100%
;
height
:
100%
;
height
:
100%
;
color
:
#0f0f0f
;
.unread-message-count
{
.unread-message-count
{
right
:
5px
;
right
:
5px
;
bottom
:
5px
;
bottom
:
5px
;
...
@@ -360,15 +346,17 @@
...
@@ -360,15 +346,17 @@
}
}
.toggle-controlbox
,
.toggle-controlbox
,
.toggle-minimized-chats
{
a
.toggle-minimized-chats
{
float
:
right
;
float
:
right
;
font-size
:
85%
;
font-size
:
85%
;
border-top-right-radius
:
4px
;
border-top-right-radius
:
4px
;
border-top-left-radius
:
4px
;
border-top-left-radius
:
4px
;
background-color
:
#5390c8
;
background-color
:
$link-color
;
padding
:
4px
8px
;
padding
:
4px
8px
;
margin-right
:
5px
;
margin-right
:
5px
;
color
:
white
;
span
{
color
:
$inverse-link-color
;
}
}
}
.chat-body
{
.chat-body
{
...
@@ -418,28 +406,6 @@
...
@@ -418,28 +406,6 @@
border-bottom-left-radius
:
4px
;
border-bottom-left-radius
:
4px
;
}
}
.participants
{
label
{
margin-top
:
5px
;
display
:
block
;
}
.participant-list
{
li
{
overflow
:
hidden
;
text-overflow
:
ellipsis
;
white-space
:
nowrap
;
display
:
block
;
font-size
:
12px
;
font-weight
:
bold
;
padding
:
0
.5em
0
0
0
.5em
;
cursor
:
default
;
}
li
.moderator
{
color
:
#8f2831
;
}
}
}
.chat-blink
{
.chat-blink
{
background-color
:
#176679
;
background-color
:
#176679
;
border-right
:
1px
solid
#176679
;
border-right
:
1px
solid
#176679
;
...
@@ -463,7 +429,7 @@
...
@@ -463,7 +429,7 @@
box-sizing
:
border-box
;
box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
height
:
206px
;
height
:
206px
;
height
:
calc
(
100%
-
84px
);
height
:
calc
(
100%
-
#{
$toolbar-height
+
$chat-textarea-height
}
);
}
}
.chat-info
{
.chat-info
{
...
@@ -471,7 +437,14 @@
...
@@ -471,7 +437,14 @@
}
}
.chat-error
{
.chat-error
{
color
:
#8f2831
;
color
:
$warning-color
;
font-weight
:
bold
;
}
.chat-error
,
.chat-info
,
.chat-message
{
padding
:
2px
0
;
}
}
.chat-message-room
,
.chat-message-room
,
...
@@ -491,18 +464,15 @@
...
@@ -491,18 +464,15 @@
word-wrap
:
break-word
;
word-wrap
:
break-word
;
}
}
.chat-message-room
,
.chat-message-them
{
.chat-message-them
{
color
:
#8f2831
;
color
:
$message-them-color
;
}
}
.chat-message-me
{
.chat-message-me
{
color
:
$link-color
;
color
:
$link-color
;
}
}
.chat-message-room
{
color
:
#4B7003
;
}
.chat-event
,
.chat-event
,
.chat-date
,
.chat-date
,
.chat-info
{
.chat-info
{
...
@@ -568,9 +538,9 @@
...
@@ -568,9 +538,9 @@
.reg-feedback
,
.reg-feedback
,
#converse-login
.conn-feedback
{
#converse-login
.conn-feedback
{
width
:
100%
;
text-align
:
center
;
display
:
block
;
display
:
block
;
text-align
:
center
;
width
:
100%
;
}
}
.chat-message-error
{
.chat-message-error
{
...
@@ -603,22 +573,11 @@
...
@@ -603,22 +573,11 @@
white-space
:
nowrap
;
white-space
:
nowrap
;
}
}
.chat-head
{
color
:
#ffffff
;
font-size
:
100%
;
border-top-right-radius
:
4px
;
border-top-left-radius
:
4px
;
padding
:
2px
2px
2px
4px
;
margin
:
0
;
.avatar
{
float
:
left
;
}
}
.chat-head-chatbox
,
.chat-head-chatbox
,
.chat-head-chatroom
{
.chat-head-chatroom
{
height
:
$chat-head-height
;
height
:
$chat-head-height
;
position
:
relative
;
position
:
relative
;
padding
:
3
px
;
padding
:
5
px
;
}
}
.chat-head-chatroom
{
.chat-head-chatroom
{
background-color
:
$chatroom-head-color
;
background-color
:
$chatroom-head-color
;
...
@@ -650,14 +609,13 @@
...
@@ -650,14 +609,13 @@
}
}
dl
.add-converse-contact
{
dl
.add-converse-contact
{
margin
:
0
0
0
0
.5em
;
margin
:
0
0
.5em
0
.5em
0
.5em
;
}
}
.fancy-dropdown
{
.fancy-dropdown
{
border
:
1px
solid
$light-background-border-color
;
border
:
1px
solid
$light-background-border-color
;
height
:
22px
;
height
:
$controlbox-dropdown-height
;
text-align
:
left
;
text-align
:
left
;
.choose-xmpp-status
{
.choose-xmpp-status
{
width
:
155px
;
width
:
155px
;
span
{
span
{
...
@@ -703,17 +661,6 @@
...
@@ -703,17 +661,6 @@
}
}
}
}
.controlbox-head
{
margin
:
0
;
color
:
#FFF
;
border-top-right-radius
:
4px
;
border-top-left-radius
:
4px
;
height
:
$chat-head-height
;
clear
:
right
;
background-color
:
$link-color
;
padding
:
3px
0
0
0
;
}
.unread-message-count
,
.unread-message-count
,
.chat-head-message-count
{
.chat-head-message-count
{
font-weight
:
bold
;
font-weight
:
bold
;
...
@@ -735,16 +682,16 @@
...
@@ -735,16 +682,16 @@
a
.configure-chatroom-button
,
a
.configure-chatroom-button
,
a
.toggle-chatbox-button
,
a
.toggle-chatbox-button
,
a
.close-chatbox-button
{
a
.close-chatbox-button
{
font-size
:
10px
;
padding
:
3px
3px
2px
3px
;
margin-right
:
3px
;
cursor
:
pointer
;
border-radius
:
6px
;
border-radius
:
6px
;
border
:
1px
solid
#888
;
border
:
1px
solid
#888
;
display
:
inline-block
;
color
:
white
;
color
:
white
;
text-decoration
:
none
;
cursor
:
pointer
;
display
:
inline-block
;
float
:
right
;
float
:
right
;
font-size
:
10px
;
margin
:
0
0
0
3px
;
padding
:
3px
3px
2px
3px
;
text-decoration
:
none
;
}
}
a
.configure-chatroom-button
:active
,
a
.configure-chatroom-button
:active
,
...
@@ -800,7 +747,7 @@
...
@@ -800,7 +747,7 @@
width
:
100%
;
width
:
100%
;
position
:
relative
;
position
:
relative
;
margin
:
0
.5em
0
0
0
;
margin
:
0
.5em
0
0
0
;
height
:
194px
;
height
:
$roster-height
;
height
:
calc
(
100%
-
68px
);
height
:
calc
(
100%
-
68px
);
overflow
:
hidden
;
overflow
:
hidden
;
...
@@ -809,37 +756,22 @@
...
@@ -809,37 +756,22 @@
}
}
.filter-type
{
.filter-type
{
display
:
table-cell
;
display
:
table-cell
;
height
:
24px
;
font-size
:
$font-size
;
<<<<<<<
HEAD
height
:
$controlbox-dropdown-height
;
margin
:
0
0
0
.5em
-
2
px
;
margin
:
0
0
0
.5em
-
1
px
;
padding
:
0
;
padding
:
0
;
width
:
8
5
px
;
width
:
8
4
px
;
}
}
.roster-filter
{
.roster-filter
{
background
:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABNSURBVHjaXI7BDcAwCAMvyQjMyQ6dAbZiKfqoUK34g2zJh1dENIC7M8pMAPYdzAVY3d0ajNz9aypS/b5R6o+ZPdqoKgCq6h80KH3xDgBqNR97p8oAGQAAAABJRU5ErkJggg== )
no-repeat
right
-20px
center
;
background
:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABNSURBVHjaXI7BDcAwCAMvyQjMyQ6dAbZiKfqoUK34g2zJh1dENIC7M8pMAPYdzAVY3d0ajNz9aypS/b5R6o+ZPdqoKgCq6h80KH3xDgBqNR97p8oAGQAAAABJRU5ErkJggg== )
no-repeat
right
-20px
center
;
border
:
1px
solid
#999
;
border
:
1px
solid
#999
;
display
:
table-cell
;
display
:
table-cell
;
height
:
24px
;
font-size
:
$font-size
;
height
:
$controlbox-dropdown-height
;
margin
:
0
0
0
.5em
6px
;
margin
:
0
0
0
.5em
6px
;
padding
:
2px
;
width
:
104px
;
=======
padding
:
0
;
padding
:
0
;
margin
:
0
0
0
.5em
-2px
;
display
:
inline-block
;
width
:
85px
;
font-size
:
$font-size
;
}
.roster-filter
{
display
:
table-cell
;
padding
:
2px
;
padding
:
2px
;
margin
:
0
0
0
.5em
6px
;
width
:
104px
;
width
:
104px
;
height
:
24px
;
background
:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAHolAACAgwAA+f8AAIDpAAB1MAAA6mAAADqYAAAXb5JfxUYAAABNSURBVHjaXI7BDcAwCAMvyQjMyQ6dAbZiKfqoUK34g2zJh1dENIC7M8pMAPYdzAVY3d0ajNz9aypS/b5R6o+ZPdqoKgCq6h80KH3xDgBqNR97p8oAGQAAAABJRU5ErkJggg== )
no-repeat
right
-20px
center
;
border
:
1px
solid
#999
;
display
:
inline-block
;
>>>>>>>
5c9a7c257b032996cce5c2059c56acf23b61843b
}
}
/* (jQ addClass:) if input has value: */
/* (jQ addClass:) if input has value: */
.roster-filter.x
{
.roster-filter.x
{
...
@@ -851,10 +783,10 @@
...
@@ -851,10 +783,10 @@
}
}
.roster-contacts
{
.roster-contacts
{
margin
:
0
;
margin
:
0
;
overflow-y
:
auto
;
overflow-x
:
hidden
;
max-height
:
195px
;
max-height
:
195px
;
max-height
:
calc
(
100%
-
26px
);
max-height
:
calc
(
100%
-
26px
);
overflow-x
:
hidden
;
overflow-y
:
auto
;
padding-bottom
:
15px
;
padding-bottom
:
15px
;
}
}
.group-toggle
{
.group-toggle
{
...
@@ -879,34 +811,41 @@
...
@@ -879,34 +811,41 @@
padding
:
0
5px
0
0
;
padding
:
0
5px
0
0
;
margin-left
:
3px
;
margin-left
:
3px
;
}
}
a
.decline-xmpp-request
{
a
{
margin-left
:
5px
;
&
.decline-xmpp-request
{
}
margin-left
:
5px
;
a
.remove-xmpp-contact
{
}
float
:
right
;
&
.remove-xmpp-contact
{
width
:
22px
;
float
:
right
;
margin
:
0
;
width
:
22px
;
display
:
none
;
margin
:
0
;
color
:
$text-color
;
display
:
none
;
color
:
$text-color
;
}
}
}
}
}
dd
:hover
a
.remove-xmpp-contact
{
dd
:hover
a
.remove-xmpp-contact
{
display
:
inline-block
;
display
:
inline-block
;
}
}
dd
.odd
{
dd
{
background-color
:
#DCEAC5
;
&
.odd
{
/* Make this difference */
background-color
:
#DCEAC5
;
}
/* Make this difference */
dd
.current-xmpp-contact
span
{
}
font-size
:
16px
;
&
.current-xmpp-contact
span
{
float
:
left
;
font-size
:
16px
;
color
:
$link-color
;
float
:
left
;
}
color
:
$link-color
;
span
.req-contact-name
{
}
width
:
65%
;
a
.open-chat
{
width
:
80%
;
}
}
}
span
.pending-contact-name
,
a
.open-chat
{
span
{
width
:
80%
;
&
.pending-contact-name
,
&
.req-contact-name
{
width
:
80%
;
}
}
}
}
}
...
@@ -955,19 +894,20 @@
...
@@ -955,19 +894,20 @@
white-space
:
normal
;
white-space
:
normal
;
}
}
a
.room-info
{
a
{
width
:
22px
;
&
.room-info
{
height
:
22px
;
width
:
22px
;
float
:
right
;
height
:
22px
;
display
:
none
;
float
:
right
;
clear
:
right
;
display
:
none
;
}
clear
:
right
;
}
a
.open-room
{
&
.open-room
{
float
:
left
;
float
:
left
;
white-space
:
nowrap
;
white-space
:
nowrap
;
text-overflow
:
ellipsis
;
text-overflow
:
ellipsis
;
overflow-x
:
hidden
;
overflow-x
:
hidden
;
}
}
}
dd
.available-chatroom
:hover
a
.room-info
{
dd
.available-chatroom
:hover
a
.room-info
{
...
@@ -1004,25 +944,15 @@
...
@@ -1004,25 +944,15 @@
}
}
.chatbox
{
.chatbox
{
<<<<<<<
HEAD
width
:
$chat-width
;
width
:
$chat-width
;
.box-flyout
{
.box-flyout
{
width
:
$chat-width
;
width
:
$chat-width
;
=======
width
:
200px
;
.box-flyout
{
width
:
200px
;
>>>>>>>
5c9a7c257b032996cce5c2059c56acf23b61843b
}
}
.dropdown
{
.dropdown
{
a
{
a
{
height
:
22px
;
width
:
148px
;
width
:
148px
;
display
:
inline-block
;
display
:
inline-block
;
line-height
:
24px
;
line-height
:
$controlbox-dropdown-height
;
}
}
li
{
li
{
list-style
:
none
;
list-style
:
none
;
...
@@ -1030,14 +960,13 @@
...
@@ -1030,14 +960,13 @@
}
}
dd
{
dd
{
ul
{
ul
{
padding
:
5px
0
5px
0
;
padding
:
0
;
list-style
:
none
;
list-style
:
none
;
position
:
absolute
;
position
:
absolute
;
left
:
0
;
left
:
0
;
top
:
0
;
top
:
0
;
border
:
1px
solid
$light-background-border-color
;
border
:
1px
solid
$light-background-border-color
;
border-top
:
0
;
width
:
100%
;
width
:
99%
;
z-index
:
21
;
z-index
:
21
;
background-color
:
$light-background-color
;
background-color
:
$light-background-color
;
li
:hover
{
li
:hover
{
...
@@ -1058,18 +987,28 @@
...
@@ -1058,18 +987,28 @@
.chatroom
{
.chatroom
{
width
:
300px
;
width
:
300px
;
<<<<<<<
HEAD
=======
label
{
label
{
margin-left
:
2px
;
margin-left
:
2px
;
font-size
:
12px
;
font-size
:
12px
;
}
}
>>>>>>>
5c9a7c257b032996cce5c2059c56acf23b61843b
.box-flyout
{
.box-flyout
{
width
:
300px
;
width
:
300px
;
}
}
.participant-list
{
.participant-list
{
list-style
:
none
;
list-style
:
none
;
li
{
cursor
:
default
;
display
:
block
;
font-size
:
12px
;
font-weight
:
bold
;
overflow
:
hidden
;
padding
:
2px
5px
;
text-overflow
:
ellipsis
;
white-space
:
nowrap
;
&
.moderator
{
color
:
#8f2831
;
}
}
}
}
.chat-textarea
{
.chat-textarea
{
border-bottom-right-radius
:
0
;
border-bottom-right-radius
:
0
;
...
@@ -1077,21 +1016,17 @@
...
@@ -1077,21 +1016,17 @@
.chat-area
{
.chat-area
{
float
:
left
;
float
:
left
;
height
:
100%
;
height
:
100%
;
<<<<<<<
HEAD
width
:
$chat-width
;
width
:
$chat-width
;
=======
width
:
200px
;
>>>>>>>
5c9a7c257b032996cce5c2059c56acf23b61843b
}
}
.invited-contact
{
.invited-contact
{
margin
:
0
;
margin
:
-1px
0
0
-1px
;
width
:
99
px
;
width
:
100
px
;
border
:
1px
solid
#999
;
border
:
1px
solid
#999
;
}
}
.invited-contact.tt-input
{
.invited-contact.tt-input
{
background
:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gkBCjE0uzKkOgAAAidJREFUKM+N0k+IEnEUB/D3cyscdagkWpHV0WGWREXm0AgOGkSJ07kh2UXYU5cOewm6Bp0KXG/tpSCv6hyEFQIhMEaE3yERYfwTOoqKGLQxDAbqYadLgu7J7/XxeY/3ez8EACDLsgljfMfj8ZxUKhXXYDAAnueBoqgyAMipVOovXAuSZdnUaDQeDofDs16vFyUIAjRNUwmCoG02G1AUdZ5IJN7GYrHfm3AvEAjcnUwmX0ajUdRqtV74fL6sruufKYoa6bp+fzabPUMI7ZfL5eImNHk8npNerxc1m80XHMe98fv9H3K5XDkSibxjWfb1arWaYoyPMMbCFqxUKi6CIODw8LDmdDq7oigaAACiKK5omv7KcdylpmlIkiTHFlRVFTRNUxVFqa/ROqIoGoqi5A3DgFartfU4Jp7ngSAI2uVyPZIk6dZmUZKk2w6H4xghBPF4HK7vWLbZbDCdTp+rqvpUkiS0RvV6/bTf7x8wDHMViURqm/AGAMgURZ232+1X1Wr102KxuEwmk3lZlo/7/f7BcrkkSZKs2e12tHXH/x/gHsY4jTE+0jQNGYYBCCFgGOaKJMkfjUaDZximGQ6HXzSbzZ+ZTMbY6oIxFgqFgqPT6YAgCMBxXM1ut6N0Op0fj8chi8XyjWXZ98Fg8DuCHZLNZh+USqWP8/n8idvt/hUKhV7u7QK9Xu8fmqanAJBQVXUfAGY7TQQAKBaLN8fjsdDtdh/run72Dzhf7XLe2UevAAAAAElFTkSuQmCC )
no-repeat
right
3px
center
;
background
:
url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3gkBCjE0uzKkOgAAAidJREFUKM+N0k+IEnEUB/D3cyscdagkWpHV0WGWREXm0AgOGkSJ07kh2UXYU5cOewm6Bp0KXG/tpSCv6hyEFQIhMEaE3yERYfwTOoqKGLQxDAbqYadLgu7J7/XxeY/3ez8EACDLsgljfMfj8ZxUKhXXYDAAnueBoqgyAMipVOovXAuSZdnUaDQeDofDs16vFyUIAjRNUwmCoG02G1AUdZ5IJN7GYrHfm3AvEAjcnUwmX0ajUdRqtV74fL6sruufKYoa6bp+fzabPUMI7ZfL5eImNHk8npNerxc1m80XHMe98fv9H3K5XDkSibxjWfb1arWaYoyPMMbCFqxUKi6CIODw8LDmdDq7oigaAACiKK5omv7KcdylpmlIkiTHFlRVFTRNUxVFqa/ROqIoGoqi5A3DgFartfU4Jp7ngSAI2uVyPZIk6dZmUZKk2w6H4xghBPF4HK7vWLbZbDCdTp+rqvpUkiS0RvV6/bTf7x8wDHMViURqm/AGAMgURZ232+1X1Wr102KxuEwmk3lZlo/7/f7BcrkkSZKs2e12tHXH/x/gHsY4jTE+0jQNGYYBCCFgGOaKJMkfjUaDZximGQ6HXzSbzZ+ZTMbY6oIxFgqFgqPT6YAgCMBxXM1ut6N0Op0fj8chi8XyjWXZ98Fg8DuCHZLNZh+USqWP8/n8idvt/hUKhV7u7QK9Xu8fmqanAJBQVXUfAGY7TQQAKBaLN8fjsdDtdh/run72Dzhf7XLe2UevAAAAAElFTkSuQmCC )
no-repeat
right
3px
center
;
}
}
div
.participants
{
.participants
{
float
:
right
;
float
:
right
;
background-color
:
white
;
background-color
:
white
;
overflow-y
:
auto
;
overflow-y
:
auto
;
...
@@ -1101,28 +1036,32 @@
...
@@ -1101,28 +1036,32 @@
width
:
100px
;
width
:
100px
;
height
:
100%
;
height
:
100%
;
label
{
label
{
font-size
:
12px
;
font-style
:
italic
;
font-style
:
italic
;
margin
:
5px
;
display
:
block
;
}
}
}
}
}
}
.chatroom-form
,
.chatroom-form
,
.controlbox-pane
{
.controlbox-pane
{
text-align
:
center
;
background-color
:
white
;
background-color
:
white
;
border-bottom-left-radius
:
4px
;
border-bottom-left-radius
:
4px
;
border-bottom-right-radius
:
4px
;
border-bottom-right-radius
:
4px
;
border
:
0
;
border
:
0
;
font-size
:
$font-size
;
font-size
:
$font-size
;
height
:
289px
;
@include
calc
(
height
,
'100% -
#{
$chat-head-height
}
'
);
overflow-y
:
auto
;
overflow-y
:
auto
;
position
:
absolute
;
position
:
absolute
;
text-align
:
center
;
width
:
100%
;
width
:
100%
;
height
:
289px
;
@include
calc
(
height
,
'100% -
#{
$chat-head-height
}
'
);
}
}
.controlbox-pane
{
.controlbox-pane
{
padding
:
5px
0
;
padding
:
5px
0
;
overflow-y
:
hidden
;
dd
{
dd
{
margin-left
:
0
;
margin-left
:
0
;
margin-bottom
:
0
;
margin-bottom
:
0
;
...
@@ -1132,16 +1071,16 @@
...
@@ -1132,16 +1071,16 @@
}
}
}
}
#converse-register
{
#converse-register
.title
{
.title
{
font-weight
:
bold
;
font-weight
:
bold
;
}
}
.info
{
#converse-register
.info
{
font-style
:
italic
;
font-style
:
italic
;
color
:
green
;
color
:
green
;
font-size
:
85%
;
font-size
:
85%
;
margin
:
5px
0
;
margin
:
5px
0
;
}
}
}
.form-help
,
.form-help
,
...
@@ -1169,54 +1108,42 @@
...
@@ -1169,54 +1108,42 @@
#converse-login
input
{
#converse-login
input
{
width
:
100%
;
width
:
100%
;
height
:
30px
;
height
:
30px
;
margin
:
5px
0
;
margin
:
5px
0
10px
0
;
}
}
#converse-register
{
#converse-register
{
.input-group
{
.input-group
{
display
:
table
;
display
:
table
;
margin
:
auto
;
margin
:
auto
;
width
:
178px
;
width
:
178px
;
}
span
,
input
[
name
=
username
]
{
.input-group
span
,
display
:
table-cell
;
.input-group
input
[
name
=
username
]
{
}
display
:
table-cell
;
input
[
name
=
username
]
{
}
width
:
100%
;
.input-group
input
[
name
=
username
]
{
}
width
:
100%
;
}
}
}
}
#converse-register
.cancel
,
.cancel-submit
,
.save-submit
{
.chatroom-form
.cancel-submit
,
width
:
45%
;
#converse-register
.cancel-submit
{
margin
:
5px
3px
5px
3px
;
}
.cancel
,
.cancel-submit
{
color
:
$warning-color
;
color
:
$warning-color
;
}
}
.save-submit
{
.chatroom-form
.save-submit
,
#converse-register
.save-submit
{
color
:
$save-button-color
;
color
:
$save-button-color
;
}
}
.chatroom-form
.save-submit
,
.chatroom-form
.cancel-submit
,
#converse-register
.cancel-submit
,
#converse-register
.save-submit
{
width
:
45%
;
margin
:
5px
3px
5px
3px
;
}
.chatroom-form
label
,
.chatroom-form
label
,
.controlbox-pane
label
,
.controlbox-pane
label
,
#converse-register
label
,
#converse-register
label
,
#converse-login
label
{
#converse-login
label
{
height
:
auto
;
<<<<<<<
HEAD
=======
font-size
:
$font-size
;
font-size
:
$font-size
;
margin
:
4px
;
>>>>>>>
5c9a7c257b032996cce5c2059c56acf23b61843b
font-weight
:
bold
;
font-weight
:
bold
;
height
:
auto
;
margin
:
4px
;
}
}
#converse-register
.login-submit
,
#converse-register
.login-submit
,
...
@@ -1228,10 +1155,8 @@
...
@@ -1228,10 +1155,8 @@
font-size
:
$font-size
;
font-size
:
$font-size
;
}
}
form
.set-xmpp-status
{
#converse-login
.submit
{
background
:
none
;
margin
:
1em
0
;
margin
:
none
;
padding
:
none
;
}
}
form
.add-chatroom
{
form
.add-chatroom
{
...
@@ -1241,10 +1166,12 @@
...
@@ -1241,10 +1166,12 @@
input
[
type
=
button
],
input
[
type
=
button
],
input
[
type
=
submit
],
input
[
type
=
submit
],
input
[
type
=
text
]
{
input
[
type
=
text
]
{
margin
:
3px
0
;
margin
:
0
;
width
:
100%
;
width
:
100%
;
padding
:
5px
;
}
}
input
[
type
=
submit
]
{
input
[
type
=
submit
]
{
margin
:
5px
0
;
color
:
$save-button-color
;
color
:
$save-button-color
;
}
}
}
}
...
@@ -1256,6 +1183,24 @@
...
@@ -1256,6 +1183,24 @@
/* @group Tabs */
/* @group Tabs */
.chat-head
{
.chat-head
{
border-top-left-radius
:
4px
;
border-top-right-radius
:
4px
;
color
:
#ffffff
;
font-size
:
100%
;
margin
:
0
;
padding
:
6px
;
&
.controlbox-head
{
background-color
:
$link-color
;
border-top-left-radius
:
4px
;
border-top-right-radius
:
4px
;
color
:
$chat-head-inverse-text-color
;
height
:
$chat-head-height
;
margin
:
0
;
padding
:
6px
6px
6px
0
;
}
.avatar
{
float
:
left
;
}
#controlbox-tabs
{
#controlbox-tabs
{
text-align
:
center
;
text-align
:
center
;
display
:
inline
;
display
:
inline
;
...
@@ -1299,8 +1244,6 @@
...
@@ -1299,8 +1244,6 @@
color
:
$text-color
;
color
:
$text-color
;
}
}
}
}
}
}
}
}
...
@@ -1309,40 +1252,37 @@
...
@@ -1309,40 +1252,37 @@
}
}
form
.sendXMPPMessage
{
form
.sendXMPPMessage
{
background
:
white
;
border
:
0
;
border-top
:
1px
solid
#BBB
;
padding
:
0
;
margin
:
0
;
position
:
relative
;
-webkit-border-radius
:
4px
;
-moz-border-radius
:
4px
;
border-radius
:
4px
;
-moz-background-clip
:
padding
;
-moz-background-clip
:
padding
;
-moz-border-radius
:
4px
;
-webkit-background-clip
:
padding-box
;
-webkit-background-clip
:
padding-box
;
-webkit-border-radius
:
4px
;
background-clip
:
padding-box
;
background-clip
:
padding-box
;
background
:
white
;
border-radius
:
4px
;
border-top-left-radius
:
0
;
border-top-left-radius
:
0
;
border-top-right-radius
:
0
;
border-top-right-radius
:
0
;
width
:
$chat-width
;
border-top
:
1px
solid
#BBB
;
height
:
83px
;
}
.chat-textarea
{
box-sizing
:
border-box
;
-moz-box-sizing
:
border-box
;
border
:
0
;
border
:
0
;
width
:
100%
;
margin
:
0
;
padding
:
3px
;
padding
:
0
;
border-bottom-left-radius
:
4px
;
position
:
relative
;
border-bottom-right-radius
:
4px
;
width
:
$chat-width
;
resize
:
none
;
height
:
#{
$chat-textarea-height
+
$toolbar-height
}
;
.chat-textarea
{
@include
border-bottom-radius
(
4px
);
border
:
0
;
height
:
$chat-textarea-height
;
padding
:
8px
;
resize
:
none
;
width
:
100%
;
}
}
}
.chat-toolbar
{
.chat-toolbar
{
font-size
:
$font-size
;
font-size
:
$font-size
;
margin
:
0
;
margin
:
0
;
padding
:
0
5px
0
0
;
padding
:
0
4px
;
height
:
20px
;
height
:
$toolbar-height
;
display
:
block
;
display
:
block
;
a
{
a
{
...
@@ -1438,9 +1378,20 @@
...
@@ -1438,9 +1378,20 @@
padding-right
:
3px
;
padding-right
:
3px
;
}
}
form
#set-custom-xmpp-status
{
#set-custom-xmpp-status
{
float
:
left
;
float
:
left
;
padding
:
0
;
padding
:
0
;
input
{
height
:
$controlbox-dropdown-height
-
2px
;
}
button
{
height
:
$controlbox-dropdown-height
-
2px
;
width
:
40px
;
padding
:
1px
2px
1px
1px
;
}
}
.custom-xmpp-status
{
@include
calc
(
width
,
'100% - 40px'
);
}
}
.chat-textarea-chatbox-selected
{
.chat-textarea-chatbox-selected
{
...
@@ -1453,10 +1404,6 @@
...
@@ -1453,10 +1404,6 @@
margin
:
0
;
margin
:
0
;
}
}
#set-custom-xmpp-status
button
{
padding
:
1px
2px
1px
1px
;
}
#controlbox
{
#controlbox
{
display
:
none
;
display
:
none
;
div
.xmpp-status
{
div
.xmpp-status
{
...
@@ -1467,7 +1414,6 @@
...
@@ -1467,7 +1414,6 @@
/* status dropdown styles */
/* status dropdown styles */
.chatbox
{
.chatbox
{
.dropdown
{
.dropdown
{
margin
:
0
.5em
;
background-color
:
$light-background-color
;
background-color
:
$light-background-color
;
dd
{
dd
{
position
:
relative
;
position
:
relative
;
...
@@ -1482,10 +1428,6 @@
...
@@ -1482,10 +1428,6 @@
padding
:
0
;
padding
:
0
;
}
}
.custom-xmpp-status
{
width
:
124px
;
}
.add-xmpp-contact
{
.add-xmpp-contact
{
background
:
none
;
background
:
none
;
padding
:
5px
;
padding
:
5px
;
...
@@ -1499,10 +1441,11 @@
...
@@ -1499,10 +1441,11 @@
.xmpp-status-menu
{
.xmpp-status-menu
{
text-align
:
left
;
text-align
:
left
;
li
a
{
li
{
width
:
100%
;
padding
:
2px
;
span
{
a
{
padding
:
0
5px
0
5px
;
width
:
100%
;
padding
:
0
8px
;
}
}
}
}
}
}
...
@@ -1511,8 +1454,12 @@
...
@@ -1511,8 +1454,12 @@
color
:
$warning-color
;
color
:
$warning-color
;
}
}
.set-xmpp-status
.dropdown
dd
ul
{
.set-xmpp-status
{
z-index
:
22
;
background
:
none
;
padding
:
0
.5em
;
.dropdown
dd
ul
{
z-index
:
22
;
}
}
}
.minimized-chats-flyout
,
.minimized-chats-flyout
,
...
@@ -1533,7 +1480,6 @@
...
@@ -1533,7 +1480,6 @@
position
:
absolute
;
position
:
absolute
;
height
:
auto
;
height
:
auto
;
width
:
130px
;
width
:
130px
;
.chat-head-chatroom
,
.chat-head-chatroom
,
.chat-head
{
.chat-head
{
border-radius
:
4px
;
border-radius
:
4px
;
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment