@import './message'
@import './tabs'
.content-browser-container
	position absolute
	top 0
	bottom 0px
	left 72px
	right 0
	background white
	> .activateable
		display none
		&.active
			display block
	// .mCSB_draggerContainer
	// 	bottom 30px
	// .mCSB_container
	// 	padding-bottom 30px

// serviceTitle = 'Facebook'
// serviceName  = 'facebook'
// imgPath = 'img/services/facebook.png'
// lite_color  = #6386bb //the bright one
// dark_color  = #5978a8 // the dark one
// @import 'loginbutton'

// serviceTitle = 'Dropbox'
// serviceName  = 'dropbox'
// imgPath = 'img/services/dropbox.png'
// lite_color  = #4d95d0 //the bright one
// dark_color  = #4586bb // the dark one
// @import 'loginbutton'

// serviceTitle = 'Flickr'
// serviceName  = 'flickr'
// imgPath = 'img/services/flickr.png'
// lite_color  = #e52a82 //the bright one
// dark_color  = #ce2675 // the dark one
// @import 'loginbutton'

// serviceTitle = 'Instagram'
// serviceName  = 'instagram'
// imgPath = 'img/services/instagram.png'
// lite_color  = #517fa6 //the bright one
// dark_color  = #497295 // the dark one
// @import 'loginbutton'

provider(name,text,bgcolor,iconColor,image)
	if name != 'directinput' and !!text
		.browser.{name}
			.browser-login-button,
			.browser-logout-button
				background bgcolor
				&:after
					content text
				&:before
					if image
						background iconColor url(image)
					else
						background iconColor

			.browser-logout-button
				&:after
					content 'Disconnect'
	.browser-tab.{name}
		&:after
			border-radius 0
			line-height 30px
			text-align center
			if image
				background-image url(image)
		&.active
		&:active
			border 1px solid bgcolor
			&:after
				background-color iconColor
				background-position -34px 5px

provider('dropbox', 'Connect with Dropbox', #4d95d0, #4586bb, 'img/services/dropbox.png' )
provider('google-drive', 'Connect with Google Drive', #dd4b39, #c64333, 'img/services/drive.png' )
provider('facebook', 'Connect with Facebook', #6386bb, #5978a8, 'img/services/facebook.png' )
provider('instagram', 'Connect with Instagram', #517fa6, #497295, 'img/services/instagram.png')
provider('flickr', 'Connect with Flickr', #e52a82, #ce2675, 'img/services/flickr.png')
provider('directinput', 'Connect with Facebook', #3c3c3c, #3c3c3c, 'img/services/webadress.png')
provider('blogvio', 'Connect with Blogvio', #93278f, #93278f, 'img/services/blogvio.png')
provider('wix', 'Open Media Gallery', #2398ff, #1f89e5, 'img/services/wix.png')
provider('soundcloud', 'Connect with SoundCloud', #ff3a00, #e53400, '')
provider('uploads', null, #ec574d, #ec574d, 'img/services/uploads.png')

.browser.soundcloud
	.browser-login-button
		&:before
			content "\e600"
			font-size 31px
			background-image none
			font-family BlogvioEditor
			color white

.browser-tab.uploads:after
	background-position left center

.browser-tab.soundcloud
	&:after
		content "\e600"
		font-size 29px
		background-image none
		font-family BlogvioEditor
		color #e53400
	&.active:after
		color white

@import 'directinput'
