Removed studio
164
studio/button-editor/css/colorpicker.css
vendored
@ -1,164 +0,0 @@
|
||||
.colorpicker * {
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
.colorpicker {
|
||||
width: 356px;
|
||||
height: 176px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
background: url(../images/colorpicker_background.png);
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
display: none;
|
||||
}
|
||||
.colorpicker_color {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
left: 14px;
|
||||
top: 13px;
|
||||
position: absolute;
|
||||
background: #f00;
|
||||
overflow: hidden;
|
||||
cursor: crosshair;
|
||||
}
|
||||
.colorpicker_color div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: url(../images/colorpicker_overlay.png);
|
||||
}
|
||||
.colorpicker_color div div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 11px;
|
||||
height: 11px;
|
||||
overflow: hidden;
|
||||
background: url(../images/colorpicker_select.gif);
|
||||
margin: -5px 0 0 -5px;
|
||||
}
|
||||
.colorpicker_hue {
|
||||
position: absolute;
|
||||
top: 13px;
|
||||
left: 171px;
|
||||
width: 35px;
|
||||
height: 150px;
|
||||
cursor: n-resize;
|
||||
}
|
||||
.colorpicker_hue div {
|
||||
position: absolute;
|
||||
width: 35px;
|
||||
height: 9px;
|
||||
overflow: hidden;
|
||||
background: url(../images/colorpicker_indic.gif) left top;
|
||||
margin: -4px 0 0 0;
|
||||
left: 0px;
|
||||
}
|
||||
.colorpicker_new_color {
|
||||
position: absolute;
|
||||
width: 60px;
|
||||
height: 30px;
|
||||
left: 213px;
|
||||
top: 13px;
|
||||
background: #f00;
|
||||
}
|
||||
.colorpicker_current_color {
|
||||
position: absolute;
|
||||
width: 60px;
|
||||
height: 30px;
|
||||
left: 283px;
|
||||
top: 13px;
|
||||
background: #f00;
|
||||
}
|
||||
.colorpicker input {
|
||||
background-color: transparent;
|
||||
border: 1px solid transparent;
|
||||
position: absolute;
|
||||
font-size: 10px;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
color: #898989;
|
||||
top: 4px;
|
||||
right: 11px;
|
||||
text-align: right;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 11px;
|
||||
}
|
||||
.colorpicker_hex {
|
||||
position: absolute;
|
||||
width: 72px;
|
||||
height: 22px;
|
||||
background: url(../images/colorpicker_hex.png) top;
|
||||
left: 212px;
|
||||
top: 142px;
|
||||
}
|
||||
.colorpicker_hex input {
|
||||
right: 6px;
|
||||
}
|
||||
.colorpicker_field {
|
||||
height: 22px;
|
||||
width: 62px;
|
||||
background-position: top;
|
||||
position: absolute;
|
||||
}
|
||||
.colorpicker_field span {
|
||||
position: absolute;
|
||||
width: 12px;
|
||||
height: 22px;
|
||||
overflow: hidden;
|
||||
top: 0;
|
||||
right: 0;
|
||||
cursor: n-resize;
|
||||
}
|
||||
.colorpicker_rgb_r {
|
||||
background-image: url(../images/colorpicker_rgb_r.png);
|
||||
top: 52px;
|
||||
left: 212px;
|
||||
}
|
||||
.colorpicker_rgb_g {
|
||||
background-image: url(../images/colorpicker_rgb_g.png);
|
||||
top: 82px;
|
||||
left: 212px;
|
||||
}
|
||||
.colorpicker_rgb_b {
|
||||
background-image: url(../images/colorpicker_rgb_b.png);
|
||||
top: 112px;
|
||||
left: 212px;
|
||||
}
|
||||
.colorpicker_hsb_h {
|
||||
background-image: url(../images/colorpicker_hsb_h.png);
|
||||
top: 52px;
|
||||
left: 282px;
|
||||
}
|
||||
.colorpicker_hsb_s {
|
||||
background-image: url(../images/colorpicker_hsb_s.png);
|
||||
top: 82px;
|
||||
left: 282px;
|
||||
}
|
||||
.colorpicker_hsb_b {
|
||||
background-image: url(../images/colorpicker_hsb_b.png);
|
||||
top: 112px;
|
||||
left: 282px;
|
||||
}
|
||||
.colorpicker_submit {
|
||||
position: absolute;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
background: url(../images/colorpicker_submit.png) top;
|
||||
left: 322px;
|
||||
top: 142px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.colorpicker_focus {
|
||||
background-position: center;
|
||||
}
|
||||
.colorpicker_hex.colorpicker_focus {
|
||||
background-position: bottom;
|
||||
}
|
||||
.colorpicker_submit.colorpicker_focus {
|
||||
background-position: bottom;
|
||||
}
|
||||
.colorpicker_slider {
|
||||
background-position: bottom;
|
||||
}
|
723
studio/button-editor/css/global.css
vendored
@ -1,723 +0,0 @@
|
||||
|
||||
|
||||
html, body, div, span, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
|
||||
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||
article, aside, canvas, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section, summary,
|
||||
time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
blockquote, q { quotes: none; }
|
||||
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after { content: ""; content: none; }
|
||||
|
||||
ins { background-color: #ff9; color: #000; text-decoration: none; }
|
||||
|
||||
mark { background-color: #ff9; color: #000; font-style: italic; font-weight: bold; }
|
||||
|
||||
del { text-decoration: line-through; }
|
||||
|
||||
abbr[title], dfn[title] { border-bottom: 1px dotted; cursor: help; }
|
||||
|
||||
table { border-collapse: collapse; border-spacing: 0; }
|
||||
|
||||
hr { display: block; height: 1px; border: 0; border-top: 1px solid #ccc; margin: 1em 0; padding: 0; }
|
||||
|
||||
input, select { vertical-align: middle; }
|
||||
|
||||
body
|
||||
{
|
||||
font:14px/1.41 sans-serif;
|
||||
font-family: 'Proxima-Nova-1', Proxima Nova, Myriad Pro, Arial, sans-serif;
|
||||
*font-size:small;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
color: #666;
|
||||
background:black;
|
||||
overflow-x: hidden;
|
||||
/*padding-top: 70px;*/
|
||||
}
|
||||
|
||||
select, input, textarea, button { font:99% sans-serif; }
|
||||
|
||||
pre, code, kbd, samp { font-family: monospace, sans-serif; }
|
||||
|
||||
html { overflow-y: scroll; }
|
||||
|
||||
a:hover, a:active, button { outline: none; }
|
||||
|
||||
ul, ol { margin-left: 2em; }
|
||||
ol { list-style-type: decimal; }
|
||||
|
||||
nav ul, nav li { margin: 0; list-style:none; list-style-image: none; }
|
||||
|
||||
small { font-size: 85%; }
|
||||
strong, th { font-weight: bold; }
|
||||
|
||||
td { vertical-align: top; }
|
||||
|
||||
sub, sup { font-size: 75%; line-height: 0; position: relative; }
|
||||
sup { top: -0.5em; }
|
||||
sub { bottom: -0.25em; }
|
||||
|
||||
pre
|
||||
{
|
||||
white-space: pre; white-space: pre-wrap; word-wrap: break-word;
|
||||
padding: 15px;
|
||||
}
|
||||
|
||||
textarea { overflow: auto; }
|
||||
|
||||
.ie6 legend, .ie7 legend { margin-left: -7px; }
|
||||
|
||||
input[type="radio"] { vertical-align: text-bottom; }
|
||||
input[type="checkbox"] { vertical-align: bottom; }
|
||||
.ie7 input[type="checkbox"] { vertical-align: baseline; }
|
||||
.ie6 input { vertical-align: text-bottom; }
|
||||
|
||||
label, input[type="button"], input[type="submit"], input[type="image"], button { cursor: pointer; }
|
||||
|
||||
button, input, select, textarea { margin: 0; }
|
||||
|
||||
input:valid, textarea:valid {}
|
||||
input:invalid, textarea:invalid {
|
||||
border-radius: 1px; -moz-box-shadow: 0px 0px 5px red;
|
||||
-webkit-box-shadow: 0px 0px 5px red; box-shadow: 0px 0px 5px red;
|
||||
}
|
||||
.no-boxshadow input:invalid, .no-boxshadow textarea:invalid { background-color: #f0dddd; }
|
||||
|
||||
::-moz-selection{ background: #e62f6f; color:#fff; text-shadow: none; }
|
||||
::selection { background:#e62f6f; color:#fff; text-shadow: none; }
|
||||
|
||||
a:link { -webkit-tap-highlight-color: #2376c6; }
|
||||
|
||||
button { width: auto; overflow: visible; font-family: "Proxima-Nova-1", Arial, sans-serif; }
|
||||
|
||||
.ie7 img { -ms-interpolation-mode: bicubic; }
|
||||
|
||||
|
||||
h1, h2, h3, h4, h5, h6
|
||||
{
|
||||
color: #353639;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
a, a:active, a:visited
|
||||
{
|
||||
color: #2376c6;
|
||||
|
||||
-webkit-transition: color 0.3s ease;
|
||||
-moz-transition: color 0.3s ease;
|
||||
-o-transition: color 0.3s ease;
|
||||
transition: color 0.3s ease;
|
||||
}
|
||||
|
||||
a:hover
|
||||
{
|
||||
color: #0367c7;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
/* 960 gs */
|
||||
body{min-width:960px}
|
||||
.grid_4{display:inline;float:left;margin-left:50px;margin-right:10px}
|
||||
|
||||
|
||||
.container_12{margin-left:auto;margin-right:auto;width:960px}
|
||||
.grid_1,.grid_2,.grid_3,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12{
|
||||
display:inline;float:left;margin-left:10px;margin-right:10px}
|
||||
.push_1,.pull_1,.push_2,.pull_2,.push_3,.pull_3,.push_4,.pull_4,.push_5,.pull_5,.push_6,.pull_6,.push_7,.pull_7,.push_8,.pull_8,.push_9,.pull_9,.push_10,.pull_10,.push_11,.pull_11{
|
||||
position:relative}
|
||||
.alpha{margin-left:0}
|
||||
.omega{margin-right:0}
|
||||
.container_12 .grid_1{width:60px}
|
||||
.container_12 .grid_2{width:140px}
|
||||
.container_12 .grid_3{width:220px}
|
||||
.container_12 .grid_4{width:400px}
|
||||
.container_12 .grid_5{width:380px}
|
||||
.container_12 .grid_6{width:460px}
|
||||
.container_12 .grid_7{width:540px}
|
||||
.container_12 .grid_8{width:620px}
|
||||
.container_12 .grid_9{width:700px}
|
||||
.container_12 .grid_10{width:780px}
|
||||
.container_12 .grid_11{width:860px}
|
||||
.container_12 .grid_12{width:940px}
|
||||
.container_12 .prefix_1{padding-left:80px}
|
||||
.container_12 .prefix_2{padding-left:160px}
|
||||
.container_12 .prefix_3{padding-left:240px}
|
||||
.container_12 .prefix_4{padding-left:320px}
|
||||
.container_12 .prefix_5{padding-left:400px}
|
||||
.container_12 .prefix_6{padding-left:480px}
|
||||
.container_12 .prefix_7{padding-left:560px}
|
||||
.container_12 .prefix_8{padding-left:640px}
|
||||
.container_12 .prefix_9{padding-left:720px}
|
||||
.container_12 .prefix_10{padding-left:800px}
|
||||
.container_12 .prefix_11{padding-left:880px}
|
||||
.container_12 .suffix_1{padding-right:80px}
|
||||
.container_12 .suffix_2{padding-right:160px}
|
||||
.container_12 .suffix_3{padding-right:240px}
|
||||
.container_12 .suffix_4{padding-right:320px}
|
||||
.container_12 .suffix_5{padding-right:400px}
|
||||
.container_12 .suffix_6{padding-right:480px}
|
||||
.container_12 .suffix_7{padding-right:560px}
|
||||
.container_12 .suffix_8{padding-right:640px}
|
||||
.container_12 .suffix_9{padding-right:720px}
|
||||
.container_12 .suffix_10{padding-right:800px}
|
||||
.container_12 .suffix_11{padding-right:880px}
|
||||
.container_12 .push_1{left:80px}
|
||||
.container_12 .push_2{left:160px}
|
||||
.container_12 .push_3{left:240px}.container_12 .push_4{left:320px}.container_12 .push_5{left:400px}.container_12 .push_6{left:480px}.container_12 .push_7{left:560px}.container_12 .push_8{left:640px}.container_12 .push_9{left:720px}.container_12 .push_10{left:800px}.container_12 .push_11{left:880px}.container_12 .pull_1{left:-80px}.container_12 .pull_2{left:-160px}.container_12 .pull_3{left:-240px}.container_12 .pull_4{left:-320px}.container_12 .pull_5{left:-400px}.container_12 .pull_6{left:-480px}.container_12 .pull_7{left:-560px}.container_12 .pull_8{left:-640px}.container_12 .pull_9{left:-720px}.container_12 .pull_10{left:-800px}.container_12 .pull_11{left:-880px}
|
||||
.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0}
|
||||
.clearfix:before,.clearfix:after{content:'\0020';display:block;overflow:hidden;visibility:hidden;width:0;height:0}
|
||||
.clearfix:after{clear:both}.clearfix{zoom:1}
|
||||
|
||||
|
||||
|
||||
/**
|
||||
* Primary styles
|
||||
*/
|
||||
|
||||
|
||||
|
||||
#main_nav
|
||||
{
|
||||
float: right;
|
||||
margin-top: 0px;
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
margin-right: 5px;
|
||||
width: 250px;
|
||||
|
||||
}
|
||||
|
||||
#main_nav li
|
||||
{
|
||||
float: left;
|
||||
}
|
||||
|
||||
#main_nav ul li a.icons, #main_nav ul li a.iconsho
|
||||
{
|
||||
width: 48px;
|
||||
height: 70px;
|
||||
display: block;
|
||||
padding: 0;
|
||||
|
||||
}
|
||||
|
||||
#main_nav ul li a.iconsho
|
||||
{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
opacity: 0;
|
||||
|
||||
-webkit-transition: opacity 0.8s ease;
|
||||
-moz-transition: opacity 0.8s ease;
|
||||
-o-transition: opacity 0.8s ease;
|
||||
transition: opacity 0.8s ease;
|
||||
}
|
||||
|
||||
#main_nav ul li:hover a.iconsho{ opacity: 1; }
|
||||
#main_nav ul li:hover a.iconsho.selected{ opacity: 0.3; }
|
||||
|
||||
#main_nav ul li a.icons.home{ background-position: -15px -119px; }
|
||||
#main_nav ul li a.icons.portfolio{ background-position: -65px -119px; }
|
||||
#main_nav ul li a.icons.resources{ background-position: -115px -119px; }
|
||||
#main_nav ul li a.icons.photoblog{ background-position: -165px -119px; }
|
||||
#main_nav ul li a.icons.about{ background-position: -215px -119px; }
|
||||
|
||||
#main_nav ul li a.icons.home.selected{ background-position: -15px -219px; }
|
||||
#main_nav ul li a.icons.portfolio.selected{ background-position: -65px -219px; }
|
||||
#main_nav ul li a.icons.resources.selected{ background-position: -115px -219px; }
|
||||
#main_nav ul li a.icons.photoblog.selected{ background-position: -165px -219px; }
|
||||
#main_nav ul li a.icons.about.selected{ background-position: -215px -219px; }
|
||||
|
||||
#main_nav ul li a.iconsho.home{ background-position: -15px -169px; }
|
||||
#main_nav ul li a.iconsho.portfolio{ background-position: -65px -169px; }
|
||||
#main_nav ul li a.iconsho.resources{ background-position: -115px -169px; }
|
||||
#main_nav ul li a.iconsho.photoblog{ background-position: -165px -169px; }
|
||||
#main_nav ul li a.iconsho.about{ background-position: -215px -169px; }
|
||||
|
||||
#main_nav ul li a.tooltips
|
||||
{
|
||||
position: absolute;
|
||||
font-size: 10px;
|
||||
color: #fff;
|
||||
background: rgba( 30,30,30,0.93 );
|
||||
padding: 3px 8px;
|
||||
text-align: center;
|
||||
border-radius: 4px;
|
||||
margin-top: -14px;
|
||||
opacity: 0;
|
||||
text-decoration: none;
|
||||
|
||||
-webkit-transition: all 0.3s ease-in;
|
||||
-moz-transition: all 0.3s ease-in;
|
||||
-ms-transition: all 0.3s ease-in;
|
||||
-o-transition: all 0.3s ease-in;
|
||||
transition: all 0.3s ease-in;
|
||||
|
||||
-webkit-transform: translate3d( 0, -10px, 0);
|
||||
}
|
||||
|
||||
#main_nav ul li a.tooltips:before
|
||||
{
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 8px;
|
||||
height: 3px;
|
||||
background: url('../images/header_assets_new.png') no-repeat -535px -79px;
|
||||
left: 50%;
|
||||
margin-left: -3px;
|
||||
top: -3px;
|
||||
}
|
||||
|
||||
#main_nav ul li a.tooltips.home{margin-left:4px; }
|
||||
#main_nav ul li a.tooltips.portfolio{margin-left: -5px; }
|
||||
#main_nav ul li a.tooltips.resources{margin-left: -7px; }
|
||||
#main_nav ul li a.tooltips.photoblog{margin-left: 3px; }
|
||||
#main_nav ul li a.tooltips.about{margin-left: 7px; }
|
||||
|
||||
#main_nav ul li:hover a.tooltips
|
||||
{
|
||||
opacity: 1;
|
||||
-webkit-transform: translate3d( 0, 0px, 0);
|
||||
}
|
||||
|
||||
|
||||
.footer_wrapp
|
||||
{
|
||||
background: #28292e;
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
footer
|
||||
{
|
||||
padding-top: 50px;
|
||||
padding-bottom: 20px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
footer a, #details a
|
||||
{
|
||||
color: #3296fd;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
footer a:hover, #details a:hover
|
||||
{
|
||||
color: #8da4f9;
|
||||
}
|
||||
|
||||
footer h1
|
||||
{
|
||||
color: #fff;
|
||||
font-size: 16px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
|
||||
footer aside .me
|
||||
{
|
||||
width: 91px;
|
||||
height: 86px;
|
||||
float: left;
|
||||
background: url( ../images/me.png );
|
||||
background-position: -3px -10px;
|
||||
margin: 7px 20px 0px 0px;
|
||||
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
-ms-border-radius: 3px;
|
||||
|
||||
-webkit-box-shadow: 0px 1px 3px rgba( 0,0,0,0.68 );
|
||||
-moz-box-shadow: 0px 1px 3px rgba( 0,0,0,0.68 );
|
||||
-o-box-shadow: 0px 1px 3px rgba( 0,0,0,0.68 );
|
||||
-ms-box-shadow: 0px 1px 3px rgba( 0,0,0,0.68 );
|
||||
box-shadow: 0px 1px 3px rgba( 0,0,0,0.68 );
|
||||
|
||||
-webkit-transition: background-position 0.3s ease;
|
||||
-ms-transition: background-position 0.3s ease;
|
||||
-o-transition: background-position 0.3s ease;
|
||||
-moz-transition: background-position 0.3s ease;
|
||||
transition: background-position 0.3s ease;
|
||||
}
|
||||
|
||||
footer aside .me:after
|
||||
{
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 91px;
|
||||
height: 86px;
|
||||
z-index: 100;
|
||||
|
||||
-webkit-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
-ms-border-radius: 3px;
|
||||
|
||||
-webkit-box-shadow: inset 0px 1px 0px rgba( 255,255,255,0.15 );
|
||||
-moz-box-shadow: inset 0px 1px 0px rgba( 255,255,255,0.15 );
|
||||
-o-box-shadow: inset 0px 1px 0px rgba( 255,255,255,0.15 );
|
||||
-ms-box-shadow: inset 0px 1px 0px rgba( 255,255,255,0.15 );
|
||||
box-shadow: inset 0px 1px 0px rgba( 255,255,255,0.15 );
|
||||
}
|
||||
|
||||
footer aside.grid_8:hover .me
|
||||
{
|
||||
background-position: -3px -50px;
|
||||
}
|
||||
|
||||
|
||||
footer aside p
|
||||
{
|
||||
font-size: 18px;
|
||||
font-weight: 300;
|
||||
line-height: 1.7;
|
||||
padding-top: 5px;
|
||||
padding-bottom: 36px;
|
||||
}
|
||||
|
||||
#dribbbleshots
|
||||
{
|
||||
margin-right: -16px;
|
||||
}
|
||||
|
||||
#dribbbleshots img
|
||||
{
|
||||
-webkit-border-radius: 3px;
|
||||
-ms-border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
#dribbbleshots span
|
||||
{
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
max-width: 200px;
|
||||
|
||||
-webkit-box-shadow: 0px 1px 3px rgba( 0,0,0,0.5 );
|
||||
-ms-box-shadow: 0px 1px 3px rgba( 0,0,0,0.5 );
|
||||
-o-box-shadow: 0px 1px 3px rgba( 0,0,0,0.5 );
|
||||
-moz-box-shadow: 0px 1px 3px rgba( 0,0,0,0.5 );
|
||||
box-shadow: 0px 1px 3px rgba( 0,0,0,0.5 );
|
||||
|
||||
-webkit-border-radius: 3px;
|
||||
-ms-border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
|
||||
|
||||
line-height: 0;
|
||||
margin-right: 12px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
#dribbbleshots span:after {
|
||||
content:"";
|
||||
position:absolute;
|
||||
bottom:0px;
|
||||
top: 0px;
|
||||
left:0px;
|
||||
right: 0px;
|
||||
|
||||
-webkit-border-radius: 3px;
|
||||
-ms-border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
|
||||
-webkit-box-shadow: inset 0px 1px 0px rgba( 255,255,255,0.1 );
|
||||
-moz-box-shadow: inset 0px 1px 0px rgba( 255,255,255,0.1 );
|
||||
-o-box-shadow: inset 0px 1px 0px rgba( 255,255,255,0.1 );
|
||||
-ms-box-shadow: inset 0px 1px 0px rgba( 255,255,255,0.1 );
|
||||
box-shadow: inset 0px 1px 0px rgba( 255,255,255,0.1 );
|
||||
}
|
||||
|
||||
|
||||
#dribbbleshots a:hover span:after
|
||||
{
|
||||
background: rgba( 255,255,255,0.1);
|
||||
}
|
||||
|
||||
footer .social ul
|
||||
{
|
||||
list-style: none;
|
||||
|
||||
background: rgba( 0,0,0,0.14 );
|
||||
|
||||
border-radius: 5px;
|
||||
border: 1px solid #1a1a1e;
|
||||
|
||||
-webkit-box-shadow: 0 1px 0 rgba( 255,255,255,0.04), inset 0 2px 2px rgba( 0,0,0,0.19 );
|
||||
-moz-box-shadow: 0 1px 0 rgba( 255,255,255,0.04), inset 0 2px 2px rgba( 0,0,0,0.19 );
|
||||
-ms-box-shadow: 0 1px 0 rgba( 255,255,255,0.04), inset 0 2px 2px rgba( 0,0,0,0.19 );
|
||||
-o-box-shadow: 0 1px 0 rgba( 255,255,255,0.04), inset 0 2px 2px rgba( 0,0,0,0.19 );
|
||||
box-shadow: 0 1px 0 rgba( 255,255,255,0.04), inset 0 2px 2px rgba( 0,0,0,0.19 );
|
||||
}
|
||||
|
||||
footer .social ul li
|
||||
{
|
||||
padding: 3px 0px 4px 60px;
|
||||
font-size: 15px;
|
||||
line-height: 3;
|
||||
|
||||
background: #323339;
|
||||
background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.27) 100%);
|
||||
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.27)));
|
||||
background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.27) 100%);
|
||||
background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.27) 100%);
|
||||
background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.27) 1040%);
|
||||
background: linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.27) 100%);
|
||||
|
||||
-webkit-box-shadow: 0 -1px 0 rgba( 0,0,0,0.24), inset 0 1px 0 rgba( 255,255,255,0.03 );
|
||||
-o-box-shadow: 0 -1px 0 rgba( 0,0,0,0.24), inset 0 1px 0 rgba( 255,255,255,0.03 );
|
||||
-moz-box-shadow: 0 -1px 0 rgba( 0,0,0,0.24), inset 0 1px 0 rgba( 255,255,255,0.03 );
|
||||
-ms-box-shadow: 0 -1px 0 rgba( 0,0,0,0.24), inset 0 1px 0 rgba( 255,255,255,0.03 );
|
||||
box-shadow: 0 -1px 0 rgba( 0,0,0,0.24), inset 0 1px 0 rgba( 255,255,255,0.03 );
|
||||
}
|
||||
|
||||
footer .social ul li:first-child
|
||||
{
|
||||
-webkit-box-shadow:none
|
||||
}
|
||||
|
||||
footer .social ul li:hover
|
||||
{
|
||||
background: #17171b;
|
||||
-webkit-box-shadow: 0 -1px 0 rgba( 0,0,0,0.24), inset 0 1px 0 rgba( 255,255,255,0.01 );
|
||||
-moz-box-shadow: 0 -1px 0 rgba( 0,0,0,0.24), inset 0 1px 0 rgba( 255,255,255,0.01 );
|
||||
-o-box-shadow: 0 -1px 0 rgba( 0,0,0,0.24), inset 0 1px 0 rgba( 255,255,255,0.01 );
|
||||
-ms-box-shadow: 0 -1px 0 rgba( 0,0,0,0.24), inset 0 1px 0 rgba( 255,255,255,0.01 );
|
||||
box-shadow: 0 -1px 0 rgba( 0,0,0,0.24), inset 0 1px 0 rgba( 255,255,255,0.01 );
|
||||
}
|
||||
|
||||
footer .social li a
|
||||
{
|
||||
color: #8e92a0;
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
footer .social li a:hover
|
||||
{
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
footer .social ul li a span
|
||||
{
|
||||
width: 46px;
|
||||
height: 46px;
|
||||
background: url( ../images/header_assets.png );
|
||||
display: block;
|
||||
position: absolute;
|
||||
margin-left: -56px;
|
||||
|
||||
}
|
||||
|
||||
footer .social .twitter span{background-position: -115px -197px;}
|
||||
footer .social .twitter:hover span{background-position: -115px -237px;}
|
||||
footer .social .dribbble span{background-position: -63px -197px;}
|
||||
footer .social .dribbble:hover span{background-position: -63px -237px;}
|
||||
footer .social .da span{background-position: -254px -199px;}
|
||||
footer .social .da:hover span{background-position: -254px -239px;}
|
||||
footer .social .flickr span{background-position: -304px -200px;}
|
||||
footer .social .flickr:hover span{background-position: -304px -240px;}
|
||||
footer .social .vimeo span{background-position: -204px -196px;}
|
||||
footer .social .vimeo:hover span{background-position: -204px -236px;}
|
||||
footer .social .linkedIn span{background-position: -352px -199px;}
|
||||
footer .social .linkedIn:hover span{background-position: -352px -239px;}
|
||||
footer .social .facebook span{background-position: -161px -198px;}
|
||||
footer .social .facebook:hover span{background-position: -161px -238px;}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
#details
|
||||
{
|
||||
background: #1c1d21;
|
||||
margin-top: 0px;
|
||||
padding: 25px 0 10px 0;
|
||||
|
||||
border-top: 1px solid rgba( 255,255,255,0.05 );
|
||||
box-shadow: inset 0px 1px 0px rgba( 0,0,0,0.25 );
|
||||
-webkit-box-shadow: inset 0px 1px 0px rgba( 0,0,0,0.25 );
|
||||
-moz-box-shadow: inset 0px 1px 0px rgba( 0,0,0,0.25 );
|
||||
-o-box-shadow: inset 0px 1px 0px rgba( 0,0,0,0.25 );
|
||||
-ms-box-shadow: inset 0px 1px 0px rgba( 0,0,0,0.25 );
|
||||
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
#details nav
|
||||
{
|
||||
}
|
||||
|
||||
#details nav li
|
||||
{
|
||||
float: left;
|
||||
}
|
||||
|
||||
#details nav li a
|
||||
{
|
||||
padding-right: 7px;
|
||||
padding-left: 7px;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
background-position: 0 4px;
|
||||
}
|
||||
|
||||
#details nav li a.home
|
||||
{
|
||||
background: no-repeat;
|
||||
padding-left: 0;
|
||||
}
|
||||
|
||||
|
||||
#sub_details
|
||||
{
|
||||
margin-bottom: 10px;
|
||||
margin-top: 12px;
|
||||
}
|
||||
|
||||
#sub_details a
|
||||
{
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
#sub_details p
|
||||
{
|
||||
font-size: 11px;
|
||||
color: #767780;
|
||||
padding-top: 10px;
|
||||
}
|
||||
|
||||
#sub_details p.grid_3
|
||||
{
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#details .backtop
|
||||
{
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
#details .backtop a
|
||||
{
|
||||
padding: 5px 20px;
|
||||
|
||||
color: #fff;
|
||||
|
||||
text-shadow: 0 -1px -1px rgba( 0,0,0,0.5 );
|
||||
|
||||
background: #3a5bd8;
|
||||
|
||||
border-radius: 5px;
|
||||
-o-border-radius: 5px;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
-ms-border-radius: 5px;
|
||||
padding-bottom: 5px;
|
||||
|
||||
-webkit-box-shadow: 0px 0px 0px 1px rgba( 0,0,0, 0.5), 0px 2px 0px rgba( 255,255,255,0.052 ), inset 0px 1px 0px rgba( 255,255,255,0.26), inset 0px -9px 9px rgba( 40,63,198,1 );
|
||||
-moz-box-shadow: 0px 0px 0px 1px rgba( 0,0,0, 0.5), 0px 2px 0px rgba( 255,255,255,0.052 ), inset 0px 1px 0px rgba( 255,255,255,0.26), inset 0px -9px 9px rgba( 40,63,198,1 );
|
||||
-o-box-shadow: 0px 0px 0px 1px rgba( 0,0,0, 0.5), 0px 2px 0px rgba( 255,255,255,0.052 ), inset 0px 1px 0px rgba( 255,255,255,0.26), inset 0px -9px 9px rgba( 40,63,198,1 );
|
||||
-ms-box-shadow: 0px 0px 0px 1px rgba( 0,0,0, 0.5), 0px 2px 0px rgba( 255,255,255,0.052 ), inset 0px 1px 0px rgba( 255,255,255,0.26), inset 0px -9px 9px rgba( 40,63,198,1 );
|
||||
box-shadow: 0px 0px 0px 1px rgba( 0,0,0, 0.5), 0px 2px 0px rgba( 255,255,255,0.052 ), inset 0px 1px 0px rgba( 255,255,255,0.26), inset 0px -9px 9px rgba( 40,63,198,1 );
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* Non-semantic helper classes: please define your styles before this section.
|
||||
*/
|
||||
|
||||
/* For image replacement */
|
||||
.ir { display: block; text-indent: -999em; overflow: hidden; background-repeat: no-repeat; text-align: left; direction: ltr; }
|
||||
|
||||
/* Hide for both screenreaders and browsers:
|
||||
*/
|
||||
.hidden { display: none; visibility: hidden; }
|
||||
|
||||
/* Hide only visually, but have it available for screenreaders: by Jon Neal.
|
||||
*/
|
||||
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }
|
||||
/* Extends the .visuallyhidden class to allow the element to be focusable*/
|
||||
.visuallyhidden.focusable:active,
|
||||
.visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }
|
||||
|
||||
/* Hide visually and from screenreaders, but maintain layout */
|
||||
.invisible { visibility: hidden; }
|
||||
|
||||
/* The Magnificent Clearfix: Updated to prevent margin-collapsing on child elements.
|
||||
*/
|
||||
.clearfix:before, .clearfix:after { content: "\0020"; display: block; height: 0; overflow: hidden; }
|
||||
.clearfix:after { clear: both; }
|
||||
|
||||
.clearfix { zoom: 1; }
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@media all and (orientation:portrait) {
|
||||
|
||||
|
||||
}
|
||||
|
||||
@media all and (orientation:landscape) {
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
@media screen and (max-device-width: 480px) {
|
||||
|
||||
}
|
||||
|
||||
@media screen and (min-width: 825px) and (max-width: 1100px) {
|
||||
|
||||
|
||||
|
||||
|
||||
@media print {
|
||||
* { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important;
|
||||
-ms-filter: none !important; }
|
||||
a, a:visited { color: #444 !important; text-decoration: underline; }
|
||||
a[href]:after { content: " (" attr(href) ")"; }
|
||||
abbr[title]:after { content: " (" attr(title) ")"; }
|
||||
.ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }
|
||||
pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
|
||||
thead { display: table-header-group; }
|
||||
tr, img { page-break-inside: avoid; }
|
||||
@page { margin: 0.5cm; }
|
||||
p, h2, h3 { orphans: 3; widows: 3; }
|
||||
h2, h3{ page-break-after: avoid; }
|
||||
}
|
||||
}
|
169
studio/button-editor/css/header.css
vendored
@ -1,169 +0,0 @@
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
font-weight: inherit;
|
||||
font-style: inherit;
|
||||
font-size: 100%;
|
||||
vertical-align: baseline;
|
||||
|
||||
}
|
||||
|
||||
|
||||
#main-footer {
|
||||
|
||||
clear:both;
|
||||
width:100%;
|
||||
float:left;
|
||||
background: black;
|
||||
|
||||
}
|
||||
|
||||
#footer-wrap {
|
||||
|
||||
|
||||
position:relative;
|
||||
margin:0 auto;
|
||||
width:900px;
|
||||
color: white;
|
||||
font-family: Arial,Verdana,sans-serif;
|
||||
background: black;
|
||||
|
||||
padding:30px;
|
||||
padding-left:40px;
|
||||
padding-top:30px;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.foot-tab {
|
||||
float:left;
|
||||
margin-right: 100px;
|
||||
|
||||
}
|
||||
.foot-tab header{
|
||||
|
||||
margin-botom:10px;
|
||||
font-size:1.1em;
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
.foot-tab div {
|
||||
margin-top:20px;
|
||||
color:#818181;
|
||||
font-size: 0.8em;
|
||||
font-family: Tahoma;
|
||||
font-weight: normal;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.bold {
|
||||
font-size: 0.9em;
|
||||
color:white;
|
||||
font-family: Helvetica;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.footer-email {
|
||||
background: #818181;
|
||||
color:#ffffff;
|
||||
border: none;
|
||||
outline:none;
|
||||
height:25px;
|
||||
width: 130px;
|
||||
margin-left:-3px;
|
||||
|
||||
}
|
||||
|
||||
::-webkit-input-placeholder {
|
||||
color: #b1b1b1;
|
||||
}
|
||||
|
||||
:-moz-placeholder {
|
||||
color: #b1b1b1;
|
||||
}
|
||||
|
||||
.foot-submit {
|
||||
height: 26px;
|
||||
width: 26px;
|
||||
color:black;
|
||||
background: white;
|
||||
font-family: "Lucida Grande";
|
||||
border: none;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
.headertile{
|
||||
width:200px;
|
||||
float:left;
|
||||
height:50px;
|
||||
/*margin-left:5px;*/
|
||||
top:0;
|
||||
background:black;
|
||||
/*outline: 1px #ffffff solid;*/
|
||||
|
||||
}
|
||||
|
||||
.header{
|
||||
margin-top:1px;
|
||||
margin-bottom:1px;
|
||||
background:black;
|
||||
height:50px;
|
||||
box-shadow:50px 50px 50px 20px black;
|
||||
}
|
||||
|
||||
.headertile:hover{
|
||||
|
||||
background:#7FBA00;
|
||||
opacity:0.9;
|
||||
}
|
||||
#heading{
|
||||
margin-left:150px;
|
||||
|
||||
}
|
||||
|
||||
.heading
|
||||
{
|
||||
color:white;
|
||||
text-align:center;
|
||||
margin:10px 10px 0px 0px;
|
||||
font:Times New Roman, serif;
|
||||
font-weight:400;
|
||||
font-size:20px;
|
||||
|
||||
}
|
||||
|
||||
#heading:hover{
|
||||
color:white;
|
||||
|
||||
}
|
||||
|
||||
#userinfo{
|
||||
float:right;
|
||||
text-align:right;
|
||||
color:white;
|
||||
margin-right:140px;
|
||||
margin-top:10px;
|
||||
font-size:20px;
|
||||
}
|
||||
|
||||
#userimage{
|
||||
margin-left:20px;
|
||||
}
|
||||
|
218
studio/button-editor/css/layout.css
vendored
@ -1,218 +0,0 @@
|
||||
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
|
||||
margin:0;
|
||||
padding:0;
|
||||
}
|
||||
table {
|
||||
border-collapse:collapse;
|
||||
border-spacing:0;
|
||||
}
|
||||
fieldset,img {
|
||||
border:0;
|
||||
}
|
||||
address,caption,cite,code,dfn,em,strong,th,var {
|
||||
font-style:normal;
|
||||
font-weight:normal;
|
||||
}
|
||||
ol,ul {
|
||||
list-style:none;
|
||||
}
|
||||
caption,th {
|
||||
text-align:left;
|
||||
}
|
||||
h1,h2,h3,h4,h5,h6 {
|
||||
font-size:100%;
|
||||
font-weight:normal;
|
||||
}
|
||||
q:before,q:after {
|
||||
content:'';
|
||||
}
|
||||
abbr,acronym { border:0;
|
||||
}
|
||||
html, body {
|
||||
background-color: #fff;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 12px;
|
||||
line-height: 18px;
|
||||
color: #52697E;
|
||||
}
|
||||
body {
|
||||
text-align: center;
|
||||
overflow: auto;
|
||||
}
|
||||
.wrapper {
|
||||
width: 700px;
|
||||
margin: 0 auto;
|
||||
text-align: left;
|
||||
}
|
||||
h1 {
|
||||
font-size: 21px;
|
||||
height: 47px;
|
||||
line-height: 47px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.navigationTabs {
|
||||
height: 23px;
|
||||
line-height: 23px;
|
||||
border-bottom: 1px solid #ccc;
|
||||
}
|
||||
.navigationTabs li {
|
||||
float: left;
|
||||
height: 23px;
|
||||
line-height: 23px;
|
||||
padding-right: 3px;
|
||||
}
|
||||
.navigationTabs li a{
|
||||
float: left;
|
||||
dispaly: block;
|
||||
height: 23px;
|
||||
line-height: 23px;
|
||||
padding: 0 10px;
|
||||
overflow: hidden;
|
||||
color: #52697E;
|
||||
background-color: #eee;
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
}
|
||||
.navigationTabs li a:hover {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
.navigationTabs li a.active {
|
||||
background-color: #fff;
|
||||
border: 1px solid #ccc;
|
||||
border-bottom: 0px solid;
|
||||
}
|
||||
.tabsContent {
|
||||
border: 1px solid #ccc;
|
||||
border-top: 0px solid;
|
||||
width: 698px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.tab {
|
||||
padding: 16px;
|
||||
display: none;
|
||||
}
|
||||
.tab h2 {
|
||||
font-weight: bold;
|
||||
font-size: 16px;
|
||||
}
|
||||
.tab h3 {
|
||||
font-weight: bold;
|
||||
font-size: 14px;
|
||||
margin-top: 20px;
|
||||
}
|
||||
.tab p {
|
||||
margin-top: 16px;
|
||||
clear: both;
|
||||
}
|
||||
.tab ul {
|
||||
margin-top: 16px;
|
||||
list-style: disc;
|
||||
}
|
||||
.tab li {
|
||||
margin: 10px 0 0 35px;
|
||||
}
|
||||
.tab a {
|
||||
color: #8FB0CF;
|
||||
}
|
||||
.tab strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
.tab pre {
|
||||
font-size: 11px;
|
||||
margin-top: 20px;
|
||||
width: 668px;
|
||||
overflow: auto;
|
||||
clear: both;
|
||||
}
|
||||
.tab table {
|
||||
width: 100%;
|
||||
}
|
||||
.tab table td {
|
||||
padding: 6px 10px 6px 0;
|
||||
vertical-align: top;
|
||||
}
|
||||
.tab dt {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
#colorSelector {
|
||||
position: relative;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
background: url(../images/select.png);
|
||||
}
|
||||
#colorSelector div {
|
||||
position: absolute;
|
||||
top: 3px;
|
||||
left: 3px;
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background: url(../images/select.png) center;
|
||||
}
|
||||
#colorSelector2 {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
background: url(../images/select2.png);
|
||||
}
|
||||
#colorSelector2 div {
|
||||
position: absolute;
|
||||
top: 4px;
|
||||
left: 4px;
|
||||
width: 28px;
|
||||
height: 28px;
|
||||
background: url(../images/select2.png) center;
|
||||
}
|
||||
#colorpickerHolder2 {
|
||||
top: 32px;
|
||||
left: 0;
|
||||
width: 356px;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
}
|
||||
#colorpickerHolder2 .colorpicker {
|
||||
background-image: url(../images/custom_background.png);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
#colorpickerHolder2 .colorpicker_hue div {
|
||||
background-image: url(../images/custom_indic.gif);
|
||||
}
|
||||
#colorpickerHolder2 .colorpicker_hex {
|
||||
background-image: url(../images/custom_hex.png);
|
||||
}
|
||||
#colorpickerHolder2 .colorpicker_rgb_r {
|
||||
background-image: url(../images/custom_rgb_r.png);
|
||||
}
|
||||
#colorpickerHolder2 .colorpicker_rgb_g {
|
||||
background-image: url(../images/custom_rgb_g.png);
|
||||
}
|
||||
#colorpickerHolder2 .colorpicker_rgb_b {
|
||||
background-image: url(../images/custom_rgb_b.png);
|
||||
}
|
||||
#colorpickerHolder2 .colorpicker_hsb_s {
|
||||
background-image: url(../images/custom_hsb_s.png);
|
||||
display: none;
|
||||
}
|
||||
#colorpickerHolder2 .colorpicker_hsb_h {
|
||||
background-image: url(../images/custom_hsb_h.png);
|
||||
display: none;
|
||||
}
|
||||
#colorpickerHolder2 .colorpicker_hsb_b {
|
||||
background-image: url(../images/custom_hsb_b.png);
|
||||
display: none;
|
||||
}
|
||||
#colorpickerHolder2 .colorpicker_submit {
|
||||
background-image: url(../images/custom_submit.png);
|
||||
}
|
||||
#colorpickerHolder2 .colorpicker input {
|
||||
color: #778398;
|
||||
}
|
||||
#customWidget {
|
||||
position: relative;
|
||||
height: 36px;
|
||||
}
|
396
studio/button-editor/css/modern.css
vendored
@ -1,396 +0,0 @@
|
||||
|
||||
html,
|
||||
button,
|
||||
input,
|
||||
select,
|
||||
textarea {
|
||||
font-family: sans-serif;
|
||||
}
|
||||
|
||||
.page {
|
||||
|
||||
width: 984px !important;
|
||||
margin: auto;
|
||||
background:black;
|
||||
margin-left:20px;/*distance of tiles fronleft*/
|
||||
}
|
||||
|
||||
|
||||
.place-left {
|
||||
float: left !important;
|
||||
margin-right: 10px;
|
||||
}
|
||||
.place-right {
|
||||
float: right !important;
|
||||
margin-left: 0px;
|
||||
}
|
||||
.scroll-y,
|
||||
.scroll-vertical {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.scroll-x,
|
||||
.scroll-horizontal {
|
||||
overflow-x: scroll;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.page .page-header .page-header-content {
|
||||
font-family: "Open Sans", sans-serif, sans;
|
||||
font-size: 18pt;
|
||||
display: block;
|
||||
margin: 0;
|
||||
}
|
||||
.page .page-header {
|
||||
font-family: "Open Sans", sans-serif, sans;
|
||||
font-size: 10pt;
|
||||
display: block;
|
||||
margin: 0;
|
||||
}
|
||||
.page .page-region {
|
||||
display: block;
|
||||
}
|
||||
.page .page-region .page-region-content {
|
||||
padding-top: 60px;
|
||||
padding-left: 20px;
|
||||
padding-right: 20px;
|
||||
padding-bottom: 20px;
|
||||
display: block;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.page.secondary .page-region .page-region-content {
|
||||
padding-left: 0px;
|
||||
}
|
||||
.page.snapped {
|
||||
width: 33.33%;
|
||||
height: 100%;
|
||||
float: left;
|
||||
border-right: 1px #ccc solid;
|
||||
}/*
|
||||
|
||||
/*
|
||||
* Tiles.less
|
||||
*/
|
||||
.tile-group {
|
||||
margin: 0;
|
||||
margin-right: 80px;
|
||||
float: left;
|
||||
width: auto;
|
||||
height: auto;
|
||||
min-height: 1px;
|
||||
width: 802px;
|
||||
}
|
||||
.tile {
|
||||
display: block;
|
||||
float: left;
|
||||
background-color: #525252;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
cursor: pointer;
|
||||
box-shadow: inset 0px 0px 1px #FFFFCC;
|
||||
text-decoration: none;
|
||||
color: #ffffff;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
font-weight: 400;
|
||||
margin: 0 10px 10px 0;
|
||||
}
|
||||
.tile * {
|
||||
color: #ffffff;
|
||||
}
|
||||
.tile .tile-content {
|
||||
width: 150px;
|
||||
height: 110px;
|
||||
padding: 0;
|
||||
vertical-align: top;
|
||||
padding: 10px 15px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
color: #000000;
|
||||
font-weight: 400;
|
||||
font-size: 9pt;
|
||||
letter-spacing: 0.02em;
|
||||
color: #ffffff;
|
||||
line-height: 16px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.tile .tile-content:hover {
|
||||
color: rgba(0, 0, 0, 0.8);
|
||||
}
|
||||
.tile .tile-content:active {
|
||||
color: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
.tile .tile-content:hover {
|
||||
color: #ffffff;
|
||||
}
|
||||
.tile .tile-content h1,
|
||||
.tile .tile-content h2,
|
||||
.tile .tile-content h3,
|
||||
.tile .tile-content h4,
|
||||
.tile .tile-content h5,
|
||||
.tile .tile-content h6,
|
||||
.tile .tile-content p {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
line-height: 24px;
|
||||
}
|
||||
.tile .tile-content h1:hover,
|
||||
.tile .tile-content h2:hover,
|
||||
.tile .tile-content h3:hover,
|
||||
.tile .tile-content h4:hover,
|
||||
.tile .tile-content h5:hover,
|
||||
.tile .tile-content h6:hover,
|
||||
.tile .tile-content p:hover {
|
||||
color: #ffffff;
|
||||
}
|
||||
.tile .tile-content p {
|
||||
color: #000000;
|
||||
font-weight: 400;
|
||||
font-size: 9pt;
|
||||
letter-spacing: 0.02em;
|
||||
color: #ffffff;
|
||||
line-height: 16px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.tile .tile-content p:active {
|
||||
color: rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.tile .tile-content.icon {
|
||||
display: table-cell !important;
|
||||
vertical-align: middle !important;
|
||||
text-align: center;
|
||||
}
|
||||
.tile .tile-content.icon img {
|
||||
width: 64px;
|
||||
height: 64px;
|
||||
}
|
||||
.tile .tile-content.image {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
.tile .tile-content.image img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
min-height: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
.tile .tile-content.images-set {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
height: 100%;
|
||||
max-height: 150px;
|
||||
}
|
||||
.tile .tile-content.images-set img {
|
||||
width: 25%;
|
||||
min-height: 50%;
|
||||
float: left;
|
||||
border: 1px #1e1e1e solid;
|
||||
}
|
||||
.tile .tile-content.images-set img:first-child {
|
||||
float: left;
|
||||
width: 50%;
|
||||
min-height: 100%;
|
||||
}
|
||||
.tile.double {
|
||||
width: 310px;
|
||||
}
|
||||
.tile.double .tile-content {
|
||||
width: 310px;
|
||||
}
|
||||
.tile.triple {
|
||||
width: 470px;
|
||||
}
|
||||
.tile.triple .tile-content {
|
||||
width: 470px;
|
||||
}
|
||||
.tile.quadro {
|
||||
width: 630px;
|
||||
}
|
||||
.tile.quadro .tile-content {
|
||||
width: 630px;
|
||||
}
|
||||
.tile.double-vertical {
|
||||
height: 310px;
|
||||
}
|
||||
.tile.double-vertical .tile-content {
|
||||
height: 270px;
|
||||
}
|
||||
.tile.triple-vertical {
|
||||
height: 470px;
|
||||
}
|
||||
.tile.triple-vertical .tile-content {
|
||||
height: 430px;
|
||||
}
|
||||
.tile.quadro-vertical {
|
||||
height: 630px;
|
||||
}
|
||||
.tile.quadro-vertical .tile-content {
|
||||
height: 590px;
|
||||
}
|
||||
/*tile colors*/
|
||||
#tile1{
|
||||
background:#ffc40d;
|
||||
}
|
||||
|
||||
#tile2{
|
||||
background:#00a300;
|
||||
}
|
||||
|
||||
#tile3{
|
||||
/*background:#da532c;*/
|
||||
background:#f98b00;
|
||||
}
|
||||
#tile4{
|
||||
background:#02AEDC;
|
||||
}
|
||||
#tile5{
|
||||
background:#603cba;
|
||||
}
|
||||
#tile6{
|
||||
background:#525252;
|
||||
}
|
||||
#tile7{
|
||||
background:#b91d47;
|
||||
}
|
||||
#lin{
|
||||
margin-top:30px;
|
||||
}
|
||||
#limage{
|
||||
width:200px;
|
||||
height:200px;
|
||||
}
|
||||
|
||||
#loginbox{
|
||||
width:350px;
|
||||
height:310px;
|
||||
background:#525252;
|
||||
|
||||
/*opacity:0.2;*/
|
||||
float:right;
|
||||
/*margin-left:20px;*/
|
||||
margin-top:-340px;
|
||||
margin-right:30px;
|
||||
font-size:20px;
|
||||
color:#488bf5;
|
||||
text-align:center;
|
||||
|
||||
opacity:0.9;
|
||||
}
|
||||
|
||||
|
||||
#download{
|
||||
width:60px;
|
||||
height:60px;
|
||||
float:right;
|
||||
position:relative;
|
||||
margin-right:10px;
|
||||
margin-bottom:10px;
|
||||
|
||||
}
|
||||
#down{
|
||||
margin-bottom:40px;
|
||||
margin-right:60px;
|
||||
text-align:left;
|
||||
font-size:16px;
|
||||
}
|
||||
/*responsible after hover*/
|
||||
.tile:hover {
|
||||
outline: 1px #ffffff solid;
|
||||
|
||||
}
|
||||
/*tile icon controls*/
|
||||
#designicon{
|
||||
position:relative;
|
||||
margin-top:25px;
|
||||
width:150px;
|
||||
height:170px;
|
||||
vertical-align: middle ;
|
||||
left:0px;
|
||||
}
|
||||
|
||||
#codeicon{
|
||||
width:120px;
|
||||
height:120px;
|
||||
padding-top:18px;
|
||||
margin-top:-30px;
|
||||
}
|
||||
|
||||
|
||||
#showcaseicon{
|
||||
margin-top:-20px;
|
||||
width:120px;
|
||||
height:120px;
|
||||
}
|
||||
|
||||
#doubletileicon{
|
||||
width:100px;
|
||||
height:100px;
|
||||
margin-top:-5px;
|
||||
margin-left:100px;
|
||||
}
|
||||
|
||||
#signupicon
|
||||
{
|
||||
|
||||
margin-left:15px;
|
||||
margin-top:5px;
|
||||
width:120px;
|
||||
height:120px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
/*tile heading controls*/
|
||||
#creat{
|
||||
text-align:center;
|
||||
padding-top:20px;
|
||||
padding-left:4px;
|
||||
font-size:22px;
|
||||
color:white;
|
||||
margin-right:1px;
|
||||
}
|
||||
|
||||
#codep{
|
||||
position:relative;
|
||||
font-size:22px;
|
||||
margin-top:-15px;
|
||||
margin-left:5px;
|
||||
text-align:center;
|
||||
}
|
||||
|
||||
#doubletiletitle
|
||||
{
|
||||
font-size:22px;
|
||||
margin-left:20px;
|
||||
margin-top:-70px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
#dhome{
|
||||
margin-left:10px;
|
||||
|
||||
}
|
||||
|
||||
#ricon{
|
||||
position:relative;
|
||||
left:200px;
|
||||
top:100px;
|
||||
|
||||
}
|
||||
|
||||
#dicon{
|
||||
position:relative;
|
||||
left:200px;
|
||||
top:00px;
|
||||
|
||||
}
|
607
studio/button-editor/css/style.css
vendored
@ -1,607 +0,0 @@
|
||||
|
||||
|
||||
|
||||
html
|
||||
{
|
||||
overflow-x: hidden;
|
||||
}
|
||||
|
||||
.home_nav .grid_12
|
||||
{
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
z-index: 50;
|
||||
margin-top: -57px;
|
||||
|
||||
-webkit-transition: opacity 0.2s ease;
|
||||
-moz-transition: opacity 0.2s ease;
|
||||
-o-transition: opacity 0.2s ease;
|
||||
transition: opacity 0.2s ease;
|
||||
}
|
||||
|
||||
.home_nav button
|
||||
{
|
||||
border: none;
|
||||
|
||||
-webkit-transition: background-position 0.2s ease;
|
||||
-moz-transition: background-position 0.2s ease;
|
||||
-o-transition: background-position 0.2s ease;
|
||||
transition: background-position 0.2s ease;
|
||||
}
|
||||
|
||||
.home_nav .sides
|
||||
{
|
||||
width: 11px;
|
||||
height: 17px;
|
||||
background: url('navarrow.png');/*side arrows of navigation*/
|
||||
background-position: -17px 0;
|
||||
margin-right: 10px;
|
||||
margin-top:20px;
|
||||
}
|
||||
|
||||
.home_nav .right
|
||||
{
|
||||
margin-right: 0px;
|
||||
margin-left: 10px;
|
||||
background-position: -28px 0;
|
||||
}
|
||||
|
||||
.home_nav .left:hover{ background-position: -17px -17px; }
|
||||
.home_nav .right:hover{ background-position: -28px -17px; }
|
||||
|
||||
.home_nav .direct
|
||||
{
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
background: url('nav.png'); /*the center navigation buttons*/
|
||||
background-position: 0 0px;
|
||||
|
||||
}
|
||||
|
||||
.home_nav .direct:hover, .home_nav .selected{ background-position: 0px -16px; }
|
||||
|
||||
|
||||
|
||||
|
||||
#home_slider
|
||||
{
|
||||
margin-left: 0;
|
||||
height: 616px;
|
||||
position: relative;
|
||||
-webkit-transition: margin 1s ease;
|
||||
-moz-transition: margin 1s ease;
|
||||
-o-transition: margin 1s ease;
|
||||
transition: margin 1s ease;
|
||||
width: 50000px;
|
||||
background: #fafafa;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.webmadeclean, .imake, .welcome, .menuslide, .myphotoblog
|
||||
{
|
||||
height: 616px;
|
||||
width: 2000px;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
z-index: 1;
|
||||
background: #ececee
|
||||
}
|
||||
|
||||
#home_loader
|
||||
{
|
||||
background: #66a6be;
|
||||
position: absolute;
|
||||
height: 616px;
|
||||
width: 100%;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
#home_loader img
|
||||
{
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
margin-left: -8px;
|
||||
margin-top: -8px;
|
||||
}
|
||||
|
||||
|
||||
.welcome
|
||||
{
|
||||
background-image: url('sliderfront.jpg');
|
||||
}
|
||||
|
||||
.welcome h1
|
||||
{ color:white; /*the color of melange*/
|
||||
font-size: 187px;
|
||||
text-transform: uppercase;
|
||||
line-height: 218px;
|
||||
padding-top: 24px;
|
||||
font-weight: 900;
|
||||
font-family: "Proxima-Nova-1", Arial, sans-serif;
|
||||
}
|
||||
|
||||
.white
|
||||
{
|
||||
color: #fff;
|
||||
text-shadow: 1px 1px 1px rgba( 0,0,0,0.3 );
|
||||
}
|
||||
|
||||
.welcome p
|
||||
{
|
||||
font-size: 28px;
|
||||
color: #fff;
|
||||
padding-top: 3px;
|
||||
text-transform: uppercase;
|
||||
font-weight: 300;
|
||||
text-shadow: 1px 1px 0px rgba( 0,0,0,0.22 );
|
||||
}
|
||||
|
||||
.welcome .image
|
||||
{
|
||||
text-align: center;
|
||||
line-height: 0;
|
||||
font-size: 0;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.welcome div.grid_4
|
||||
{
|
||||
margin-top: 19px;
|
||||
display: block;
|
||||
width: 500px;
|
||||
height: 13px;
|
||||
|
||||
}
|
||||
|
||||
.welcome div.grid_4:after
|
||||
{
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 500px;
|
||||
margin-top: 15px;
|
||||
height: 1px;
|
||||
|
||||
}
|
||||
|
||||
.welcome p
|
||||
{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.welcome .start
|
||||
{
|
||||
font-size: 111px;
|
||||
margin-top: -35px;
|
||||
|
||||
-webkit-transition: opacity 0.5s ease;
|
||||
-moz-transition: opacity 0.5s ease;
|
||||
-o-transition: opacity 0.5s ease;
|
||||
transition: opacity 0.5s ease;
|
||||
}
|
||||
|
||||
.welcome .keyboard_help
|
||||
{
|
||||
position: absolute;
|
||||
font-size: 41px;
|
||||
margin-top: -35px;
|
||||
|
||||
-webkit-transition: opacity 0.5s ease;
|
||||
-moz-transition: opacity 0.5s ease;
|
||||
-o-transition: opacity 0.5s ease;
|
||||
transition: opacity 0.5s ease;
|
||||
|
||||
opacity: 0;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE8 */
|
||||
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); /* IE < 8 */
|
||||
}
|
||||
|
||||
.welcome .start_tour:hover .keyboard_help
|
||||
{
|
||||
opacity: 1;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; /* IE8 */
|
||||
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100); /* IE < 8 */
|
||||
}
|
||||
|
||||
.welcome .start_tour:hover .start
|
||||
{
|
||||
opacity: 0;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE8 */
|
||||
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); /* IE < 8 */
|
||||
}
|
||||
|
||||
|
||||
.webmadeclean h1, .imake h1, .myphotoblog h1
|
||||
{
|
||||
font-size: 50px;/*controlling the heading of eadh slider page*/
|
||||
|
||||
margin-top: 60px;
|
||||
padding-bottom: 20px;
|
||||
margin-bottom: 15px;
|
||||
font-family:Arial Narrow;
|
||||
/*padding-left: 55px;*/
|
||||
}
|
||||
|
||||
.webmadeclean h1:before, .imake h1:before, .myphotoblog h1:before
|
||||
{
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 45px;
|
||||
height: 36px;
|
||||
|
||||
background-position: -20px 0;
|
||||
margin-left: -60px;
|
||||
margin-top: -5px;
|
||||
}
|
||||
|
||||
.imake h1:before{ background-position: -64px 4px; }
|
||||
.myphotoblog h1:before{ background-position: -110px 0px; }
|
||||
|
||||
.webmadeclean p, .imake p, .myphotoblog p
|
||||
{
|
||||
font-size: 18px;
|
||||
line-height: 29px;
|
||||
}
|
||||
|
||||
.webmadeclean img.approved
|
||||
{
|
||||
position: absolute;
|
||||
margin-left: 230px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.webmadeclean a, .imake a, .myphotoblog a
|
||||
{
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
background: #c2c3c8;
|
||||
background-position: right center;
|
||||
font-size: 13px;
|
||||
|
||||
padding: 6px 50px 5px 10px;
|
||||
line-height: 60px;
|
||||
|
||||
-webkit-transition: background 0.3s ease;
|
||||
-moz-transition: background 0.3s ease;
|
||||
-o-transition: background 0.3s ease;
|
||||
transition: background 0.3s ease;
|
||||
}
|
||||
|
||||
.webmadeclean a:hover, .imake a:hover, .myphotoblog a:hover
|
||||
{
|
||||
background: #4a4b4f no-repeat;
|
||||
background-position: right;
|
||||
}
|
||||
|
||||
.webmadeclean aside
|
||||
{
|
||||
text-align: right;
|
||||
padding-top: 30px;
|
||||
}
|
||||
|
||||
.imake aside
|
||||
{
|
||||
text-align: left;
|
||||
margin-top: 60px;
|
||||
}
|
||||
|
||||
.imake .approved
|
||||
{
|
||||
margin-left: 200px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.myphotoblog aside figure
|
||||
{
|
||||
line-height: 0;
|
||||
width: 680px;
|
||||
height: 443px;
|
||||
background: #fff;
|
||||
padding: 10px;
|
||||
|
||||
-webkit-box-shadow: 0px 1px 3px rgba( 0,0,0,0.23 );
|
||||
-moz-box-shadow: 0px 1px 3px rgba( 0,0,0,0.23 );
|
||||
-o-box-shadow: 0px 1px 3px rgba( 0,0,0,0.23 );
|
||||
box-shadow: 0px 1px 3px rgba( 0,0,0,0.23 );
|
||||
|
||||
margin-top: 55px;
|
||||
}
|
||||
|
||||
.myphotoblog .coverpic
|
||||
{
|
||||
position: absolute;
|
||||
margin-top: -443px;
|
||||
display: block;
|
||||
|
||||
opacity: 0;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE8 */
|
||||
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); /* IE < 8 */
|
||||
|
||||
-webkit-transition: opacity 0.5s ease;
|
||||
-moz-transition: opacity 0.5s ease;
|
||||
-o-transition: opacity 0.5s ease;
|
||||
transition: opacity 0.5s ease;
|
||||
}
|
||||
|
||||
.myphotoblog figure:hover .coverpic
|
||||
{
|
||||
opacity: 1;
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)"; /* IE8 */
|
||||
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0); /* IE < 8 */
|
||||
}
|
||||
|
||||
.menuslide
|
||||
{
|
||||
padding-top: 12px;
|
||||
height: 604px;
|
||||
}
|
||||
|
||||
.menuslide a
|
||||
{
|
||||
color: #353639;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
font-size: 18px;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin-top: 20px;
|
||||
padding-bottom: 20px;
|
||||
background: #f9f9fb;
|
||||
background: rgba( 255,255,255,0.5 );
|
||||
|
||||
border-radius: 3px;
|
||||
-moz-border-radius: 3px;
|
||||
-o-border-radius: 3px;
|
||||
|
||||
-webkit-box-shadow: 0px 0px 1px rgba( 0,0,0,0.2 );
|
||||
-moz-box-shadow: 0px 0px 1px rgba( 0,0,0,0.2 );
|
||||
-o-box-shadow: 0px 0px 1px rgba( 0,0,0,0.2 );
|
||||
box-shadow: 0px 0px 1px rgba( 0,0,0,0.2 );
|
||||
|
||||
-webkit-transition: background 0.3s ease;
|
||||
-moz-transition: background 0.3s ease;
|
||||
-o-transition: background 0.3s ease;
|
||||
transition: background 0.3s ease;
|
||||
}
|
||||
|
||||
#welcometab{
|
||||
margin-left:270px;
|
||||
}
|
||||
.menuslide a.grid_3
|
||||
{ align:center;
|
||||
width: 218px;
|
||||
font-size: 18px;
|
||||
line-height: 50px;
|
||||
padding-bottom: 15px;
|
||||
}
|
||||
|
||||
.menuslide a span.icon
|
||||
{
|
||||
|
||||
display: block;
|
||||
width: 54px;
|
||||
height: 54px;
|
||||
margin-left: 124px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.menuslide a.grid_3 span.icon
|
||||
{
|
||||
margin-left: 80px;
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.menuslide a span
|
||||
{
|
||||
display: block;
|
||||
text-transform: none;
|
||||
font-size: 15px;
|
||||
font-weight: normal;
|
||||
font-family: "Proxima-Nova-1", Arial, sans-serif;
|
||||
color: #777777;
|
||||
}
|
||||
|
||||
.menuslide a:hover
|
||||
{
|
||||
background: rgba( 255,255,255,0.9 );
|
||||
color: #b6d76e;
|
||||
}
|
||||
|
||||
.menuslide a span.portfolio{ background-position: 0 0; }
|
||||
.menuslide a:hover span.portfolio{ background-position: 0 -54px; }
|
||||
.menuslide a span.resources{ background-position: -54px 0; }
|
||||
.menuslide a:hover span.resources{ background-position: -54px -54px; }
|
||||
.menuslide a span.photoblog{ background-position: -108px 0; }
|
||||
.menuslide a:hover span.photoblog{ background-position: -108px -54px; }
|
||||
.menuslide a span.experiments{ background-position: -162px 0; }
|
||||
.menuslide a:hover span.experiments{ background-position: -162px -54px; }
|
||||
.menuslide a span.about{ background-position: -216px 0; }
|
||||
.menuslide a:hover span.about{ background-position: -216px -54px; }
|
||||
.menuslide a span.contact{ background-position: -269px 0; }
|
||||
.menuslide a:hover span.contact{ background-position: -269px -54px; }
|
||||
.menuslide a span.deviantart{ background-position: -323px 0; }
|
||||
.menuslide a:hover span.deviantart{ background-position: -323px -54px; }
|
||||
.menuslide a span.twitter{ background-position: -377px 0; width: 55px; }
|
||||
.menuslide a:hover span.twitter{ background-position: -377px -54px; }
|
||||
.menuslide a span.flickr{ background-position: -432px 0; }
|
||||
.menuslide a:hover span.flickr{ background-position: -432px -54px; }
|
||||
.menuslide a span.facebook{ background-position: -486px 0; }
|
||||
.menuslide a:hover span.facebook{ background-position: -486px -54px; }
|
||||
|
||||
/*logo management*/
|
||||
#wikiicon{
|
||||
background:url('wikiicon.png');
|
||||
}
|
||||
|
||||
#giticon{
|
||||
background:url('github.png');
|
||||
}
|
||||
#abouticon{
|
||||
background:url('aboutus.jpg');
|
||||
}
|
||||
#fbicon{
|
||||
background:url('fb.jpg');
|
||||
}
|
||||
#blogicon{
|
||||
background:url('blogicon.png');
|
||||
}
|
||||
#resourceicon{
|
||||
background:url('rssb.png');
|
||||
}
|
||||
|
||||
|
||||
#twittericon{
|
||||
background:url('twitter.png');
|
||||
}
|
||||
|
||||
#contacticon{
|
||||
background:url('contacticon.jpg');
|
||||
}
|
||||
#poster{
|
||||
margin-right:30px;
|
||||
width:700px;
|
||||
margin-top:-120px;
|
||||
}
|
||||
.menuslide a span.grid4logo
|
||||
{
|
||||
|
||||
display: block;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin-left: 85px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
.menuslide a span.grid3logo
|
||||
{
|
||||
|
||||
display: block;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
margin-left: 170px;
|
||||
margin-top: 15px;
|
||||
}
|
||||
|
||||
.button-demo,
|
||||
button-demo {
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
height: 48px;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
font-size: 18px;
|
||||
max-width: 300px;
|
||||
width: 80%;
|
||||
font-weight: 700;
|
||||
line-height: 48px;
|
||||
letter-spacing: 0.1px;
|
||||
white-space: wrap;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
button-demo:hover,
|
||||
.button-demo:focus {
|
||||
color: #333;
|
||||
border-color: #888;
|
||||
outline: 0; }
|
||||
.button-demo.button-primary {
|
||||
color: #FFF;
|
||||
filter: brightness(90%) }
|
||||
.button-demo.button-primary:hover,
|
||||
.button-demo.button-primary:focus {
|
||||
color: #FFF;
|
||||
filter: brightness(90%) }
|
||||
.icon {
|
||||
padding: 0px 8px 3.5px 0px;
|
||||
vertical-align: middle;
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.wicon {
|
||||
padding: 0px 6px 0px 0px;
|
||||
vertical-align: middle;
|
||||
width: 26px;
|
||||
height: 20px;
|
||||
}
|
||||
.button.button-custom {
|
||||
color: #FFFFFF;
|
||||
background-color: #FFFFFF;
|
||||
background-image: linear-gradient(-135deg,#0f0c29,#302b63,#24243e) }
|
||||
.button.button-custom:hover,
|
||||
.button.button-custom:focus {
|
||||
filter: brightness(90%) }
|
||||
|
||||
.button.button-custom_website {
|
||||
color: #ffffff;
|
||||
background-color: #000000;
|
||||
display: inline-block;
|
||||
text-decoration: none;
|
||||
height: 48px;
|
||||
text-align: center;
|
||||
vertical-align: middle;
|
||||
font-size: 18px;
|
||||
width: 300px;
|
||||
font-weight: 700;
|
||||
line-height: 48px;
|
||||
letter-spacing: 0.1px;
|
||||
white-space: wrap;
|
||||
border-radius: 8px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
details {
|
||||
width: 64.7%;
|
||||
background: #282828;
|
||||
color: #ffffff;
|
||||
cursor: pointer;
|
||||
padding: 12px;
|
||||
margin-bottom: 0;
|
||||
box-sizing: border-box;
|
||||
border-radius: 4px;
|
||||
transition: border-radius 100ms cubic-bezier(0.66, 0.01, 0.35, 0.99);
|
||||
overflow: hidden;
|
||||
position:relative;
|
||||
left:1%;
|
||||
}
|
||||
|
||||
summary {
|
||||
padding: 1rem;
|
||||
display: block;
|
||||
background: #333;
|
||||
padding-left: 1rem;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
summary:before {
|
||||
content: '';
|
||||
border-width: .4rem;
|
||||
border-style: solid;
|
||||
border-color: transparent transparent transparent #fff;
|
||||
position: absolute;
|
||||
top: 1.3rem;
|
||||
left: 1rem;
|
||||
transform: rotate(0);
|
||||
transform-origin: .2rem 50%;
|
||||
transition: .25s transform ease;
|
||||
}
|
||||
|
||||
details[open] > summary:before {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
details summary::-webkit-details-marker {
|
||||
display:none;
|
||||
}
|
||||
|
||||
details > ul {
|
||||
padding-bottom: 1rem;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.body-container {
|
||||
position: absolute;
|
||||
height: 80%;
|
||||
width: 80%;
|
||||
top: 10%;
|
||||
left: 10%;
|
||||
}
|
Before Width: | Height: | Size: 43 B |
Before Width: | Height: | Size: 803 B |
Before Width: | Height: | Size: 1.9 KiB |
Before Width: | Height: | Size: 532 B |
Before Width: | Height: | Size: 970 B |
Before Width: | Height: | Size: 1001 B |
Before Width: | Height: | Size: 1.0 KiB |
Before Width: | Height: | Size: 86 B |
Before Width: | Height: | Size: 8.8 KiB |
Before Width: | Height: | Size: 970 B |
Before Width: | Height: | Size: 1.0 KiB |
Before Width: | Height: | Size: 1007 B |
Before Width: | Height: | Size: 72 B |
Before Width: | Height: | Size: 984 B |
Before Width: | Height: | Size: 1.9 KiB |
Before Width: | Height: | Size: 562 B |
Before Width: | Height: | Size: 1.0 KiB |
Before Width: | Height: | Size: 957 B |
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 86 B |
Before Width: | Height: | Size: 968 B |
Before Width: | Height: | Size: 1023 B |
Before Width: | Height: | Size: 974 B |
Before Width: | Height: | Size: 997 B |
Before Width: | Height: | Size: 492 B |
Before Width: | Height: | Size: 518 B |
Before Width: | Height: | Size: 315 B |
529
studio/button-editor/js/colorpicker.js
vendored
@ -1,529 +0,0 @@
|
||||
(function($) {
|
||||
var ColorPicker = function() {
|
||||
var ids = {},
|
||||
inAction,
|
||||
charMin = 65,
|
||||
visible,
|
||||
tpl = '<div class="colorpicker"><div class="colorpicker_color"><div><div></div></div></div><div class="colorpicker_hue"><div></div></div><div class="colorpicker_new_color"></div><div class="colorpicker_current_color"></div><div class="colorpicker_hex"><input type="text" maxlength="6" size="6" /></div><div class="colorpicker_rgb_r colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_rgb_g colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_rgb_b colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_h colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_s colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_hsb_b colorpicker_field"><input type="text" maxlength="3" size="3" /><span></span></div><div class="colorpicker_submit"></div></div>',
|
||||
defaults = {
|
||||
eventName: 'click',
|
||||
onShow: function() {},
|
||||
onBeforeShow: function() {},
|
||||
onHide: function() {},
|
||||
onChange: function() {},
|
||||
onSubmit: function() {},
|
||||
color: 'ff0000',
|
||||
livePreview: true,
|
||||
flat: false
|
||||
},
|
||||
fillRGBFields = function(hsb, cal) {
|
||||
var rgb = HSBToRGB(hsb);
|
||||
$(cal).data('colorpicker').fields.eq(1).val(rgb.r).end().eq(2).val(rgb.g).end().eq(3).val(rgb.b).end();
|
||||
},
|
||||
fillHSBFields = function(hsb, cal) {
|
||||
$(cal).data('colorpicker').fields.eq(4).val(hsb.h).end().eq(5).val(hsb.s).end().eq(6).val(hsb.b).end();
|
||||
},
|
||||
fillHexFields = function(hsb, cal) {
|
||||
$(cal).data('colorpicker').fields.eq(0).val(HSBToHex(hsb)).end();
|
||||
},
|
||||
setSelector = function(hsb, cal) {
|
||||
$(cal).data('colorpicker').selector.css('backgroundColor', '#' + HSBToHex({
|
||||
h: hsb.h,
|
||||
s: 100,
|
||||
b: 100
|
||||
}));
|
||||
$(cal).data('colorpicker').selectorIndic.css({
|
||||
left: parseInt(150 * hsb.s / 100, 10),
|
||||
top: parseInt(150 * (100 - hsb.b) / 100, 10)
|
||||
});
|
||||
},
|
||||
setHue = function(hsb, cal) {
|
||||
$(cal).data('colorpicker').hue.css('top', parseInt(150 - 150 * hsb.h / 360, 10));
|
||||
},
|
||||
setCurrentColor = function(hsb, cal) {
|
||||
$(cal).data('colorpicker').currentColor.css('backgroundColor', '#' + HSBToHex(hsb));
|
||||
},
|
||||
setNewColor = function(hsb, cal) {
|
||||
$(cal).data('colorpicker').newColor.css('backgroundColor', '#' + HSBToHex(hsb));
|
||||
},
|
||||
keyDown = function(ev) {
|
||||
var pressedKey = ev.charCode || ev.keyCode || -1;
|
||||
if ((pressedKey > charMin && pressedKey <= 90) || pressedKey == 32) {
|
||||
return false;
|
||||
}
|
||||
var cal = $(this).parent().parent();
|
||||
if (cal.data('colorpicker').livePreview === true) {
|
||||
change.apply(this);
|
||||
}
|
||||
},
|
||||
change = function(ev) {
|
||||
var cal = $(this).parent().parent(),
|
||||
col;
|
||||
if (this.parentNode.className.indexOf('_hex') > 0) {
|
||||
cal.data('colorpicker').color = col = HexToHSB(fixHex(this.value));
|
||||
} else if (this.parentNode.className.indexOf('_hsb') > 0) {
|
||||
cal.data('colorpicker').color = col = fixHSB({
|
||||
h: parseInt(cal.data('colorpicker').fields.eq(4).val(), 10),
|
||||
s: parseInt(cal.data('colorpicker').fields.eq(5).val(), 10),
|
||||
b: parseInt(cal.data('colorpicker').fields.eq(6).val(), 10)
|
||||
});
|
||||
} else {
|
||||
cal.data('colorpicker').color = col = RGBToHSB(fixRGB({
|
||||
r: parseInt(cal.data('colorpicker').fields.eq(1).val(), 10),
|
||||
g: parseInt(cal.data('colorpicker').fields.eq(2).val(), 10),
|
||||
b: parseInt(cal.data('colorpicker').fields.eq(3).val(), 10)
|
||||
}));
|
||||
}
|
||||
if (ev) {
|
||||
fillRGBFields(col, cal.get(0));
|
||||
fillHexFields(col, cal.get(0));
|
||||
fillHSBFields(col, cal.get(0));
|
||||
}
|
||||
setSelector(col, cal.get(0));
|
||||
setHue(col, cal.get(0));
|
||||
setNewColor(col, cal.get(0));
|
||||
cal.data('colorpicker').onChange.apply(cal, [col, HSBToHex(col), HSBToRGB(col)]);
|
||||
},
|
||||
blur = function(ev) {
|
||||
var cal = $(this).parent().parent();
|
||||
cal.data('colorpicker').fields.parent().removeClass('colorpicker_focus');
|
||||
},
|
||||
focus = function() {
|
||||
charMin = this.parentNode.className.indexOf('_hex') > 0 ? 70: 65;
|
||||
$(this).parent().parent().data('colorpicker').fields.parent().removeClass('colorpicker_focus');
|
||||
$(this).parent().addClass('colorpicker_focus');
|
||||
},
|
||||
downIncrement = function(ev) {
|
||||
var field = $(this).parent().find('input').focus();
|
||||
var current = {
|
||||
el: $(this).parent().addClass('colorpicker_slider'),
|
||||
max: this.parentNode.className.indexOf('_hsb_h') > 0 ? 360: (this.parentNode.className.indexOf('_hsb') > 0 ? 100: 255),
|
||||
y: ev.pageY,
|
||||
field: field,
|
||||
val: parseInt(field.val(), 10),
|
||||
preview: $(this).parent().parent().data('colorpicker').livePreview
|
||||
};
|
||||
$(document).bind('mouseup', current, upIncrement);
|
||||
$(document).bind('mousemove', current, moveIncrement);
|
||||
},
|
||||
moveIncrement = function(ev) {
|
||||
ev.data.field.val(Math.max(0, Math.min(ev.data.max, parseInt(ev.data.val + ev.pageY - ev.data.y, 10))));
|
||||
if (ev.data.preview) {
|
||||
change.apply(ev.data.field.get(0), [true]);
|
||||
}
|
||||
return false;
|
||||
},
|
||||
upIncrement = function(ev) {
|
||||
change.apply(ev.data.field.get(0), [true]);
|
||||
ev.data.el.removeClass('colorpicker_slider').find('input').focus();
|
||||
$(document).unbind('mouseup', upIncrement);
|
||||
$(document).unbind('mousemove', moveIncrement);
|
||||
return false;
|
||||
},
|
||||
downHue = function(ev) {
|
||||
// prevent android from highlighting the hue selector on click
|
||||
ev.preventDefault();
|
||||
|
||||
var moveEvent = ev;
|
||||
if (typeof(event) !== "undefined" && event.touches) {
|
||||
moveEvent = event.touches[0];
|
||||
}
|
||||
|
||||
var current = {
|
||||
cal: $(this).parent(),
|
||||
y: $(this).offset().top
|
||||
};
|
||||
current.preview = current.cal.data('colorpicker').livePreview;
|
||||
$(document).bind('mouseup touchend', current, upHue);
|
||||
$(document).bind('mousemove touchmove', current, moveHue);
|
||||
|
||||
changeHue(moveEvent, current, current.preview);
|
||||
return false;
|
||||
},
|
||||
changeHue = function(ev, data, preview) {
|
||||
change.apply(data.cal.data('colorpicker').fields.eq(4).val(parseInt(360 * (150 - Math.max(0, Math.min(150, ev.pageY - data.y))) / 150, 10)).get(0), [preview]);
|
||||
},
|
||||
moveHue = function(ev) {
|
||||
var moveEvent = ev;
|
||||
|
||||
// mobile touch event!
|
||||
if (typeof(event) !== "undefined" && event.touches) {
|
||||
moveEvent = event.touches[0];
|
||||
}
|
||||
changeHue(moveEvent, ev.data, ev.data.preview);
|
||||
return false;
|
||||
},
|
||||
upHue = function(ev) {
|
||||
fillRGBFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
|
||||
fillHexFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
|
||||
$(document).unbind('mouseup touchend', upHue);
|
||||
$(document).unbind('mousemove touchmove', moveHue);
|
||||
return false;
|
||||
},
|
||||
downSelector = function(ev) {
|
||||
// prevent android from highlighting the selector on click
|
||||
ev.preventDefault();
|
||||
var current = {
|
||||
cal: $(this).parent(),
|
||||
pos: $(this).offset()
|
||||
};
|
||||
current.preview = current.cal.data('colorpicker').livePreview;
|
||||
$(document).bind('mouseup touchend', current, upSelector);
|
||||
$(document).bind('mousemove touchmove', current, moveSelector);
|
||||
|
||||
$(".colorpicker_color", current.cal).one('click', current, moveSelector);
|
||||
ev.data = current;
|
||||
moveSelector(ev);
|
||||
},
|
||||
moveSelector = function(ev) {
|
||||
var moveEvent = ev;
|
||||
|
||||
// mobile touch event!
|
||||
if (typeof(event) !== "undefined" && event.touches) {
|
||||
moveEvent = event.touches[0];
|
||||
}
|
||||
|
||||
change.apply(ev.data.cal.data('colorpicker').fields.eq(6).val(parseInt(100 * (150 - Math.max(0, Math.min(150, (moveEvent.pageY - ev.data.pos.top)))) / 150, 10)).end().eq(5).val(parseInt(100 * (Math.max(0, Math.min(150, (moveEvent.pageX - ev.data.pos.left)))) / 150, 10)).get(0), [ev.data.preview]);
|
||||
return false;
|
||||
},
|
||||
upSelector = function(ev) {
|
||||
fillRGBFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
|
||||
fillHexFields(ev.data.cal.data('colorpicker').color, ev.data.cal.get(0));
|
||||
$(document).unbind('mouseup touchend', upSelector);
|
||||
$(document).unbind('mousemove touchmove', moveSelector);
|
||||
return false;
|
||||
},
|
||||
enterSubmit = function(ev) {
|
||||
$(this).addClass('colorpicker_focus');
|
||||
},
|
||||
leaveSubmit = function(ev) {
|
||||
$(this).removeClass('colorpicker_focus');
|
||||
},
|
||||
clickSubmit = function(ev) {
|
||||
var cal = $(this).parent();
|
||||
var col = cal.data('colorpicker').color;
|
||||
cal.data('colorpicker').origColor = col;
|
||||
setCurrentColor(col, cal.get(0));
|
||||
cal.data('colorpicker').onSubmit(col, HSBToHex(col), HSBToRGB(col), cal.data('colorpicker').el);
|
||||
},
|
||||
toggle = function(ev) {
|
||||
var $body = $('body'),
|
||||
current = $body.data('colorpickerId'),
|
||||
me = $(this).data('colorpickerId');
|
||||
if ( current && current === me ) {
|
||||
$(document).trigger('mousedown');
|
||||
$body.data('colorpickerId', null );
|
||||
} else {
|
||||
show.call(this, ev);
|
||||
$body.data('colorpickerId', me );
|
||||
}
|
||||
},
|
||||
show = function(ev) {
|
||||
var cal = $('#' + $(this).data('colorpickerId'));
|
||||
cal.data('colorpicker').onBeforeShow.apply(this, [cal.get(0)]);
|
||||
var pos = $(this).offset();
|
||||
var viewPort = getViewport();
|
||||
var top = pos.top + this.offsetHeight;
|
||||
var left = pos.left;
|
||||
if (top + 176 > viewPort.t + viewPort.h) {
|
||||
top -= this.offsetHeight + 176;
|
||||
}
|
||||
if (left + 356 > viewPort.l + viewPort.w) {
|
||||
left = Math.max(0, left - 356);
|
||||
}
|
||||
cal.css({
|
||||
left: left + 'px',
|
||||
top: top + 'px'
|
||||
});
|
||||
if (cal.data('colorpicker').onShow.apply(this, [cal.get(0)]) != false) {
|
||||
cal.show();
|
||||
}
|
||||
$(document).bind('mousedown', {
|
||||
cal: cal
|
||||
}, hide);
|
||||
return false;
|
||||
},
|
||||
hide = function(ev) {
|
||||
if (!isChildOf(ev.data.cal.get(0), ev.target, ev.data.cal.get(0))) {
|
||||
if (ev.data.cal.data('colorpicker').onHide.apply(this, [ev.data.cal.get(0)]) != false) {
|
||||
ev.data.cal.hide();
|
||||
}
|
||||
if (!isChildOf($(ev.data.cal[0]).data("colorpicker")["el"], ev.target)) {
|
||||
$('body').data('colorpickerId', null);
|
||||
}
|
||||
$(document).unbind('mousedown', hide);
|
||||
}
|
||||
},
|
||||
isChildOf = function(parentEl, el, container) {
|
||||
if (parentEl == el) {
|
||||
return true;
|
||||
}
|
||||
if (parentEl.contains) {
|
||||
return parentEl.contains(el);
|
||||
}
|
||||
if (parentEl.compareDocumentPosition) {
|
||||
return !! (parentEl.compareDocumentPosition(el) & 16);
|
||||
}
|
||||
var prEl = el.parentNode;
|
||||
while (prEl && prEl != container) {
|
||||
if (prEl == parentEl)
|
||||
return true;
|
||||
prEl = prEl.parentNode;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
getViewport = function() {
|
||||
var m = document.compatMode == 'CSS1Compat';
|
||||
return {
|
||||
l: window.pageXOffset || (m ? document.documentElement.scrollLeft: document.body.scrollLeft),
|
||||
t: window.pageYOffset || (m ? document.documentElement.scrollTop: document.body.scrollTop),
|
||||
w: window.innerWidth || (m ? document.documentElement.clientWidth: document.body.clientWidth),
|
||||
h: window.innerHeight || (m ? document.documentElement.clientHeight: document.body.clientHeight)
|
||||
};
|
||||
},
|
||||
fixHSB = function(hsb) {
|
||||
return {
|
||||
h: Math.round( Math.min(360, Math.max(0, hsb.h)) ),
|
||||
s: Math.round( Math.min(100, Math.max(0, hsb.s)) ),
|
||||
b: Math.round( Math.min(100, Math.max(0, hsb.b)) )
|
||||
};
|
||||
},
|
||||
fixRGB = function(rgb) {
|
||||
return {
|
||||
r: Math.min(255, Math.max(0, rgb.r)),
|
||||
g: Math.min(255, Math.max(0, rgb.g)),
|
||||
b: Math.min(255, Math.max(0, rgb.b))
|
||||
};
|
||||
},
|
||||
fixHex = function(hex) {
|
||||
var len = 6 - hex.length;
|
||||
if (len > 0) {
|
||||
var o = [];
|
||||
for (var i = 0; i < len; i++) {
|
||||
o.push('0');
|
||||
}
|
||||
o.push(hex);
|
||||
hex = o.join('');
|
||||
}
|
||||
return hex;
|
||||
},
|
||||
HexToRGB = function(hex) {
|
||||
var hex = parseInt(((hex.indexOf('#') > -1) ? hex.substring(1) : hex), 16);
|
||||
return {
|
||||
r: hex >> 16,
|
||||
g: (hex & 0x00FF00) >> 8,
|
||||
b: (hex & 0x0000FF)
|
||||
};
|
||||
},
|
||||
HexToHSB = function(hex) {
|
||||
return RGBToHSB(HexToRGB(hex));
|
||||
},
|
||||
RGBToHSB = function(rgb) {
|
||||
var hsb = {
|
||||
h: 0,
|
||||
s: 0,
|
||||
b: 0
|
||||
};
|
||||
var min = Math.min(rgb.r, rgb.g, rgb.b);
|
||||
var max = Math.max(rgb.r, rgb.g, rgb.b);
|
||||
var delta = max - min;
|
||||
hsb.b = max;
|
||||
if (max != 0) {
|
||||
}
|
||||
hsb.s = max != 0 ? 255 * delta / max: 0;
|
||||
if (hsb.s != 0) {
|
||||
if (rgb.r == max) {
|
||||
hsb.h = (rgb.g - rgb.b) / delta;
|
||||
} else if (rgb.g == max) {
|
||||
hsb.h = 2 + (rgb.b - rgb.r) / delta;
|
||||
} else {
|
||||
hsb.h = 4 + (rgb.r - rgb.g) / delta;
|
||||
}
|
||||
} else {
|
||||
hsb.h = -1;
|
||||
}
|
||||
hsb.h *= 60;
|
||||
if (hsb.h < 0) {
|
||||
hsb.h += 360;
|
||||
}
|
||||
hsb.s *= 100 / 255;
|
||||
hsb.b *= 100 / 255;
|
||||
|
||||
hsb.h = Math.round ( hsb.h );
|
||||
hsb.s = Math.round ( hsb.s );
|
||||
hsb.b = Math.round ( hsb.b );
|
||||
return hsb;
|
||||
},
|
||||
HSBToRGB = function(hsb) {
|
||||
var rgb = {};
|
||||
var h = Math.round(hsb.h);
|
||||
var s = Math.round(hsb.s * 255 / 100);
|
||||
var v = Math.round(hsb.b * 255 / 100);
|
||||
if (s == 0) {
|
||||
rgb.r = rgb.g = rgb.b = v;
|
||||
} else {
|
||||
var t1 = v;
|
||||
var t2 = (255 - s) * v / 255;
|
||||
var t3 = (t1 - t2) * (h % 60) / 60;
|
||||
if (h == 360)
|
||||
h = 0;
|
||||
if (h < 60) {
|
||||
rgb.r = t1;
|
||||
rgb.b = t2;
|
||||
rgb.g = t2 + t3
|
||||
} else if (h < 120) {
|
||||
rgb.g = t1;
|
||||
rgb.b = t2;
|
||||
rgb.r = t1 - t3
|
||||
} else if (h < 180) {
|
||||
rgb.g = t1;
|
||||
rgb.r = t2;
|
||||
rgb.b = t2 + t3
|
||||
} else if (h < 240) {
|
||||
rgb.b = t1;
|
||||
rgb.r = t2;
|
||||
rgb.g = t1 - t3
|
||||
} else if (h < 300) {
|
||||
rgb.b = t1;
|
||||
rgb.g = t2;
|
||||
rgb.r = t2 + t3
|
||||
} else if (h < 360) {
|
||||
rgb.r = t1;
|
||||
rgb.g = t2;
|
||||
rgb.b = t1 - t3
|
||||
} else {
|
||||
rgb.r = 0;
|
||||
rgb.g = 0;
|
||||
rgb.b = 0
|
||||
}
|
||||
}
|
||||
return {
|
||||
r: Math.round(rgb.r),
|
||||
g: Math.round(rgb.g),
|
||||
b: Math.round(rgb.b)
|
||||
};
|
||||
},
|
||||
RGBToHex = function(rgb) {
|
||||
var hex = [rgb.r.toString(16), rgb.g.toString(16), rgb.b.toString(16)];
|
||||
$.each(hex, function(nr, val) {
|
||||
if (val.length == 1) {
|
||||
hex[nr] = '0' + val;
|
||||
}
|
||||
});
|
||||
return hex.join('');
|
||||
},
|
||||
HSBToHex = function(hsb) {
|
||||
return RGBToHex(HSBToRGB(hsb));
|
||||
},
|
||||
restoreOriginal = function() {
|
||||
var cal = $(this).parent();
|
||||
var col = cal.data('colorpicker').origColor;
|
||||
cal.data('colorpicker').color = col;
|
||||
fillRGBFields(col, cal.get(0));
|
||||
fillHexFields(col, cal.get(0));
|
||||
fillHSBFields(col, cal.get(0));
|
||||
setSelector(col, cal.get(0));
|
||||
setHue(col, cal.get(0));
|
||||
setNewColor(col, cal.get(0));
|
||||
};
|
||||
return {
|
||||
init: function(opt) {
|
||||
opt = $.extend({}, defaults, opt || {});
|
||||
if (typeof opt.color == 'string') {
|
||||
opt.color = HexToHSB(opt.color);
|
||||
} else if (opt.color.r != undefined && opt.color.g != undefined && opt.color.b != undefined) {
|
||||
opt.color = RGBToHSB(opt.color);
|
||||
} else if (opt.color.h != undefined && opt.color.s != undefined && opt.color.b != undefined) {
|
||||
opt.color = fixHSB(opt.color);
|
||||
} else {
|
||||
return this;
|
||||
}
|
||||
return this.each(function() {
|
||||
if (!$(this).data('colorpickerId')) {
|
||||
var options = $.extend({}, opt);
|
||||
options.origColor = opt.color;
|
||||
var id = 'colorpicker_' + ($(this).attr('id') || parseInt(Math.random() * 1000));
|
||||
$(this).data('colorpickerId', id);
|
||||
var cal = $(tpl).attr('id', id);
|
||||
if (options.flat) {
|
||||
cal.appendTo(this).show();
|
||||
} else {
|
||||
cal.appendTo(document.body);
|
||||
}
|
||||
options.fields = cal.find('input').bind('keyup', keyDown).bind('change', change).bind('blur', blur).bind('focus', focus);
|
||||
cal.find('span').bind('mousedown touchstart', downIncrement).end().find('>div.colorpicker_current_color').bind('click', restoreOriginal);
|
||||
options.selector = cal.find('div.colorpicker_color').bind('touchstart mousedown', downSelector);
|
||||
options.selectorIndic = options.selector.find('div div');
|
||||
options.el = this;
|
||||
options.hue = cal.find('div.colorpicker_hue div');
|
||||
cal.find('div.colorpicker_hue').bind('mousedown touchstart', downHue);
|
||||
options.newColor = cal.find('div.colorpicker_new_color');
|
||||
options.currentColor = cal.find('div.colorpicker_current_color');
|
||||
cal.data('colorpicker', options);
|
||||
cal.find('div.colorpicker_submit').bind('mouseenter touchstart', enterSubmit).bind('mouseleave touchend', leaveSubmit).bind('click', clickSubmit);
|
||||
fillRGBFields(options.color, cal.get(0));
|
||||
fillHSBFields(options.color, cal.get(0));
|
||||
fillHexFields(options.color, cal.get(0));
|
||||
setHue(options.color, cal.get(0));
|
||||
setSelector(options.color, cal.get(0));
|
||||
setCurrentColor(options.color, cal.get(0));
|
||||
setNewColor(options.color, cal.get(0));
|
||||
if (options.flat) {
|
||||
cal.css({
|
||||
position: 'relative',
|
||||
display: 'block'
|
||||
});
|
||||
} else {
|
||||
$(this).bind(options.eventName, toggle);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
showPicker: function() {
|
||||
return this.each(function() {
|
||||
if ($(this).data('colorpickerId')) {
|
||||
show.apply(this);
|
||||
}
|
||||
});
|
||||
},
|
||||
hidePicker: function() {
|
||||
return this.each(function() {
|
||||
if ($(this).data('colorpickerId')) {
|
||||
$('#' + $(this).data('colorpickerId')).hide();
|
||||
}
|
||||
});
|
||||
},
|
||||
setColor: function(col) {
|
||||
if (typeof col == 'string') {
|
||||
col = HexToHSB(col);
|
||||
} else if (col.r != undefined && col.g != undefined && col.b != undefined) {
|
||||
col = RGBToHSB(col);
|
||||
} else if (col.h != undefined && col.s != undefined && col.b != undefined) {
|
||||
col = fixHSB(col);
|
||||
} else {
|
||||
return this;
|
||||
}
|
||||
return this.each(function() {
|
||||
if ($(this).data('colorpickerId')) {
|
||||
var cal = $('#' + $(this).data('colorpickerId'));
|
||||
cal.data('colorpicker').color = col;
|
||||
cal.data('colorpicker').origColor = col;
|
||||
fillRGBFields(col, cal.get(0));
|
||||
fillHSBFields(col, cal.get(0));
|
||||
fillHexFields(col, cal.get(0));
|
||||
setHue(col, cal.get(0));
|
||||
setSelector(col, cal.get(0));
|
||||
setCurrentColor(col, cal.get(0));
|
||||
setNewColor(col, cal.get(0));
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
} ();
|
||||
$.fn.extend({
|
||||
ColorPicker: ColorPicker.init,
|
||||
ColorPickerHide: ColorPicker.hidePicker,
|
||||
ColorPickerShow: ColorPicker.showPicker,
|
||||
ColorPickerSetColor: ColorPicker.setColor
|
||||
});
|
||||
})(jQuery)
|
212
studio/button-editor/js/css-engine.js
vendored
@ -1,212 +0,0 @@
|
||||
function CssEngine() {
|
||||
|
||||
|
||||
this. cssText = '';
|
||||
this.domNode = null;
|
||||
this.multiOccurence = '';
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
CssEngine.prototype.upperCaseOccurence = function (str) {
|
||||
|
||||
|
||||
var i=0;
|
||||
var character ='';
|
||||
while (i <= str.length){
|
||||
character = str.charAt(i);
|
||||
if (!isNaN(character * 1)){
|
||||
|
||||
}else{
|
||||
if (character == character.toUpperCase()) {
|
||||
return i;
|
||||
}
|
||||
|
||||
}
|
||||
i++;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
CssEngine.prototype.multipleUpperCaseOccurence = function (str) {
|
||||
|
||||
this.multiOccurence = '';
|
||||
|
||||
var i=0;
|
||||
var count = 0;
|
||||
var character ='';
|
||||
while (i <= str.length){
|
||||
character = str.charAt(i);
|
||||
if (!isNaN(character * 1)){
|
||||
|
||||
}else{
|
||||
if (character == character.toUpperCase()) {
|
||||
count++;
|
||||
if(this.multiOccurence == '')
|
||||
this.multiOccurence = i;
|
||||
else
|
||||
this.multiOccurence = this.multiOccurence+','+i;
|
||||
//alert(this.multiOccurence);
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
i++;
|
||||
}
|
||||
//alert(str+"---"+this.multiOccurence);
|
||||
return count;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
CssEngine.prototype.loadNode = function(node) {
|
||||
|
||||
this.domNode = node;
|
||||
|
||||
}
|
||||
|
||||
CssEngine.prototype.getCssText = function() {
|
||||
|
||||
|
||||
|
||||
return this.cssText;
|
||||
}
|
||||
|
||||
CssEngine.prototype.refreshCssText = function() {
|
||||
|
||||
this.cssText = '';
|
||||
|
||||
|
||||
}
|
||||
|
||||
CssEngine.prototype.isNumber = function(n)
|
||||
{
|
||||
return !isNaN(parseFloat(n)) && isFinite(n);
|
||||
}
|
||||
|
||||
|
||||
|
||||
CssEngine.prototype.prepareCss = function(element) {
|
||||
|
||||
|
||||
|
||||
this.loadNode(element);
|
||||
|
||||
var style = this.domNode.style;
|
||||
var styleName = '';
|
||||
var suffix ='';
|
||||
var nodeId = '#'+this.domNode.id;
|
||||
|
||||
this.cssText = this.cssText+'\n'+nodeId+'\n{';
|
||||
|
||||
var pos = -1; // position of first uppercase property
|
||||
|
||||
/* iterating over style objects of its own node */
|
||||
|
||||
for (var property in style)
|
||||
{
|
||||
//pos = -1;
|
||||
|
||||
|
||||
|
||||
|
||||
if (style.hasOwnProperty(property))
|
||||
{
|
||||
|
||||
if(!style[property])
|
||||
continue;
|
||||
|
||||
if(this.isNumber(property.substr(0)))
|
||||
continue;
|
||||
|
||||
if(property === "cssText")
|
||||
continue;
|
||||
|
||||
pos = this.upperCaseOccurence(property);
|
||||
var m = this.multipleUpperCaseOccurence(property);
|
||||
//alert(this.multiOccurence);
|
||||
//alert(m);
|
||||
if(m>1)
|
||||
{
|
||||
var cn = this.multiOccurence.split(',');
|
||||
var i=0;
|
||||
while(i<=cn.length)
|
||||
{
|
||||
|
||||
if(i==0)
|
||||
styleName = property.substr(0, cn[0]);
|
||||
|
||||
else if(i==cn.length)
|
||||
{
|
||||
|
||||
suffix = property.substr(cn[i-1],cn[i-1]- cn.length);
|
||||
//alert(cn.length - cn[i-1]);
|
||||
|
||||
suffix = suffix.charAt(0).toLowerCase() + suffix.substr(1);
|
||||
|
||||
//alert(property+"-"+suffix);
|
||||
styleName = styleName+'-'+suffix;
|
||||
|
||||
}
|
||||
|
||||
else
|
||||
{
|
||||
suffix = property.substr(cn[i-1],cn[i]-cn[i-1]);
|
||||
//alert(suffix);
|
||||
|
||||
suffix = suffix.charAt(0).toLowerCase() + suffix.substr(1);
|
||||
|
||||
//alert(property+"-"+suffix);
|
||||
styleName = styleName+'-'+suffix;
|
||||
}
|
||||
|
||||
|
||||
i++;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
else if(m==1)
|
||||
{
|
||||
|
||||
styleName = property.substr(0, pos);
|
||||
suffix = property.substr(pos,property.length);
|
||||
//alert(suffix.charAt(0).toLowerCase());
|
||||
suffix = suffix.charAt(0).toLowerCase() + suffix.substr(1);
|
||||
|
||||
//alert(property+"-"+suffix);
|
||||
styleName = styleName+'-'+suffix;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
else
|
||||
{
|
||||
styleName = property;
|
||||
|
||||
}
|
||||
|
||||
// console.log(property+"p");
|
||||
this.cssText = this.cssText+'\n\t'+styleName+':'+style[property]+';';
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
this.cssText = this.cssText+'\n}';
|
||||
|
||||
|
||||
}
|
||||
|
83
studio/button-editor/js/css.js
vendored
@ -1,83 +0,0 @@
|
||||
Rainbow.extend('css', [
|
||||
{
|
||||
'name': 'comment',
|
||||
'pattern': /\/\*[\s\S]*?\*\//gm
|
||||
},
|
||||
{
|
||||
'name': 'constant.hex-color',
|
||||
'pattern': /#([a-f0-9]{3}|[a-f0-9]{6})(?=;|\s)/gi
|
||||
},
|
||||
{
|
||||
'matches': {
|
||||
1: 'constant.numeric',
|
||||
2: 'keyword.unit'
|
||||
},
|
||||
'pattern': /(\d+)(px|em|cm|s|%)?/g
|
||||
},
|
||||
{
|
||||
'name': 'string',
|
||||
'pattern': /('|")(.*?)\1/g
|
||||
},
|
||||
{
|
||||
'name': 'support.css-property',
|
||||
'matches': {
|
||||
1: 'support.vendor-prefix'
|
||||
},
|
||||
'pattern': /(-o-|-moz-|-webkit-|-ms-)?[\w-]+(?=\s?:)(?!.*\{)/g
|
||||
},
|
||||
{
|
||||
'matches': {
|
||||
1: [
|
||||
{
|
||||
'name': 'entity.name.sass',
|
||||
'pattern': /&/g
|
||||
},
|
||||
{
|
||||
'name': 'direct-descendant',
|
||||
'pattern': />/g
|
||||
},
|
||||
{
|
||||
'name': 'entity.name.class',
|
||||
'pattern': /\.[\w\-_]+/g
|
||||
},
|
||||
{
|
||||
'name': 'entity.name.id',
|
||||
'pattern': /\#[\w\-_]+/g
|
||||
},
|
||||
{
|
||||
'name': 'entity.name.pseudo',
|
||||
'pattern': /:[\w\-_]+/g
|
||||
},
|
||||
{
|
||||
'name': 'entity.name.tag',
|
||||
'pattern': /\w+/g
|
||||
}
|
||||
]
|
||||
},
|
||||
'pattern': /([\w\ ,:\.\#\&\;\-_]+)(?=.*\{)/g
|
||||
},
|
||||
{
|
||||
'matches': {
|
||||
2: 'support.vendor-prefix',
|
||||
3: 'support.css-value'
|
||||
},
|
||||
'pattern': /(:|,)\s?(-o-|-moz-|-webkit-|-ms-)?([a-zA-Z-]*)(?=\b)(?!.*\{)/g
|
||||
},
|
||||
{
|
||||
'matches': {
|
||||
1: 'support.tag.style',
|
||||
2: [
|
||||
{
|
||||
'name': 'string',
|
||||
'pattern': /('|")(.*?)(\1)/g
|
||||
},
|
||||
{
|
||||
'name': 'entity.tag.style',
|
||||
'pattern': /(\w+)/g
|
||||
}
|
||||
],
|
||||
3: 'support.tag.style'
|
||||
},
|
||||
'pattern': /(<\/?)(style.*?)(>)/g
|
||||
}
|
||||
], true);
|
28
studio/button-editor/js/eye.js
vendored
@ -1,28 +0,0 @@
|
||||
(function($){
|
||||
var EYE = window.EYE = function() {
|
||||
var _registered = {
|
||||
init: []
|
||||
};
|
||||
return {
|
||||
init: function() {
|
||||
$.each(_registered.init, function(nr, fn){
|
||||
fn.call();
|
||||
});
|
||||
},
|
||||
extend: function(prop) {
|
||||
for (var i in prop) {
|
||||
if (prop[i] != undefined) {
|
||||
this[i] = prop[i];
|
||||
}
|
||||
}
|
||||
},
|
||||
register: function(fn, type) {
|
||||
if (!_registered[type]) {
|
||||
_registered[type] = [];
|
||||
}
|
||||
_registered[type].push(fn);
|
||||
}
|
||||
};
|
||||
}();
|
||||
$(EYE.init);
|
||||
})(jQuery);
|
9404
studio/button-editor/js/jquery-1.7.js
vendored
330
studio/button-editor/js/jquery.gradientPicker.js
vendored
@ -1,330 +0,0 @@
|
||||
/**
|
||||
@author Matt Crinklaw-Vogt (tantaman)
|
||||
*/
|
||||
(function( $ ) {
|
||||
if (!$.event.special.destroyed) {
|
||||
$.event.special.destroyed = {
|
||||
remove: function(o) {
|
||||
if (o.handler) {
|
||||
o.handler();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function ctrlPtComparator(l,r) {
|
||||
return l.position - r.position;
|
||||
}
|
||||
|
||||
function bind(fn, ctx) {
|
||||
if (typeof fn.bind === "function") {
|
||||
return fn.bind(ctx);
|
||||
} else {
|
||||
return function() {
|
||||
fn.apply(ctx, arguments);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var browserPrefix = "";
|
||||
if ($.browser.mozilla) {
|
||||
browserPrefix = "-moz-";
|
||||
} else if ($.browser.webkit) {
|
||||
browserPrefix = "-webkit-";
|
||||
} else if ($.browser.opera) {
|
||||
browserPrefix = "-o-";
|
||||
} else if ($.browser.msie) {
|
||||
browserPrefix = "-ms-";
|
||||
}
|
||||
|
||||
function GradientSelection($el, opts) {
|
||||
this.$el = $el;
|
||||
this.$el.css("position", "relative");
|
||||
this.opts = opts;
|
||||
|
||||
var $preview = $("<canvas class='gradientPicker-preview'></canvas>");
|
||||
this.$el.append($preview);
|
||||
var canvas = $preview[0];
|
||||
canvas.width = canvas.clientWidth;
|
||||
canvas.height = canvas.clientHeight;
|
||||
this.g2d = canvas.getContext("2d");
|
||||
|
||||
var $ctrlPtContainer = $("<div class='gradientPicker-ctrlPts'></div>");
|
||||
this.$el.append($ctrlPtContainer)
|
||||
this.$ctrlPtContainer = $ctrlPtContainer;
|
||||
|
||||
this.updatePreview = bind(this.updatePreview, this);
|
||||
this.controlPoints = [];
|
||||
this.ctrlPtConfig = new ControlPtConfig(this.$el, opts);
|
||||
for (var i = 0; i < opts.controlPoints.length; ++i) {
|
||||
var ctrlPt = this.createCtrlPt(opts.controlPoints[i]);
|
||||
this.controlPoints.push(ctrlPt);
|
||||
}
|
||||
|
||||
this.docClicked = bind(this.docClicked, this);
|
||||
this.destroyed = bind(this.destroyed, this);
|
||||
$(document).bind("click", this.docClicked);
|
||||
this.$el.bind("destroyed", this.destroyed);
|
||||
this.previewClicked = bind(this.previewClicked, this);
|
||||
$preview.click(this.previewClicked);
|
||||
|
||||
this.updatePreview();
|
||||
}
|
||||
|
||||
GradientSelection.prototype = {
|
||||
docClicked: function() {
|
||||
this.ctrlPtConfig.hide();
|
||||
},
|
||||
|
||||
createCtrlPt: function(ctrlPtSetup) {
|
||||
return new ControlPoint(this.$ctrlPtContainer, ctrlPtSetup, this.opts.orientation, this, this.ctrlPtConfig)
|
||||
},
|
||||
|
||||
destroyed: function() {
|
||||
$(document).unbind("click", this.docClicked);
|
||||
},
|
||||
|
||||
updateOptions: function(opts) {
|
||||
$.extend(this.opts, opts);
|
||||
this.updatePreview();
|
||||
},
|
||||
|
||||
updatePreview: function() {
|
||||
var result = [];
|
||||
this.controlPoints.sort(ctrlPtComparator);
|
||||
if (this.opts.orientation == "horizontal") {
|
||||
var grad = this.g2d.createLinearGradient(0, 0, this.g2d.canvas.width, 0);
|
||||
for (var i = 0; i < this.controlPoints.length; ++i) {
|
||||
var pt = this.controlPoints[i];
|
||||
grad.addColorStop(pt.position, pt.color);
|
||||
result.push({
|
||||
position: pt.position,
|
||||
color: pt.color
|
||||
});
|
||||
}
|
||||
} else {
|
||||
|
||||
}
|
||||
|
||||
this.g2d.fillStyle = grad;
|
||||
this.g2d.fillRect(0, 0, this.g2d.canvas.width, this.g2d.canvas.height);
|
||||
|
||||
if (this.opts.generateStyles)
|
||||
var styles = this._generatePreviewStyles();
|
||||
|
||||
this.opts.change(result, styles);
|
||||
},
|
||||
|
||||
removeControlPoint: function(ctrlPt) {
|
||||
var cpidx = this.controlPoints.indexOf(ctrlPt);
|
||||
|
||||
if (cpidx != -1) {
|
||||
this.controlPoints.splice(cpidx, 1);
|
||||
ctrlPt.$el.remove();
|
||||
}
|
||||
},
|
||||
|
||||
previewClicked: function(e) {
|
||||
var offset = $(e.target).offset();
|
||||
var x = e.pageX - offset.left;
|
||||
var y = e.pageY - offset.top;
|
||||
|
||||
var imgData = this.g2d.getImageData(x,y,1,1);
|
||||
var colorStr = "rgb(" + imgData.data[0] + "," + imgData.data[1] + "," + imgData.data[2] + ")";
|
||||
|
||||
var cp = this.createCtrlPt({
|
||||
position: x / this.g2d.canvas.width,
|
||||
color: colorStr
|
||||
});
|
||||
|
||||
this.controlPoints.push(cp);
|
||||
this.controlPoints.sort(ctrlPtComparator);
|
||||
},
|
||||
|
||||
_generatePreviewStyles: function() {
|
||||
//linear-gradient(top, rgb(217,230,163) 86%, rgb(227,249,159) 9%)
|
||||
var str = this.opts.type + "-gradient(" + ((this.opts.type == "linear") ? (this.opts.fillDirection + ", ") : "");
|
||||
var first = true;
|
||||
for (var i = 0; i < this.controlPoints.length; ++i) {
|
||||
var pt = this.controlPoints[i];
|
||||
if (!first) {
|
||||
str += ", ";
|
||||
} else {
|
||||
first = false;
|
||||
}
|
||||
str += pt.color + " " + ((pt.position*100)|0) + "%";
|
||||
}
|
||||
|
||||
str = str + ")"
|
||||
var styles = [str, browserPrefix + str];
|
||||
return styles;
|
||||
}
|
||||
};
|
||||
|
||||
function ControlPoint($parentEl, initialState, orientation, listener, ctrlPtConfig) {
|
||||
this.$el = $("<div class='gradientPicker-ctrlPt'></div>");
|
||||
$parentEl.append(this.$el);
|
||||
this.$parentEl = $parentEl;
|
||||
this.configView = ctrlPtConfig;
|
||||
|
||||
if (typeof initialState === "string") {
|
||||
initialState = initialState.split(" ");
|
||||
this.position = parseFloat(initialState[1])/100;
|
||||
this.color = initialState[0];
|
||||
} else {
|
||||
this.position = initialState.position;
|
||||
this.color = initialState.color;
|
||||
}
|
||||
|
||||
this.listener = listener;
|
||||
this.outerWidth = this.$el.outerWidth();
|
||||
|
||||
this.$el.css("background-color", this.color);
|
||||
if (orientation == "horizontal") {
|
||||
var pxLeft = ($parentEl.width() - this.$el.outerWidth()) * (this.position);
|
||||
this.$el.css("left", pxLeft);
|
||||
} else {
|
||||
var pxTop = ($parentEl.height() - this.$el.outerHeight()) * (this.position);
|
||||
this.$el.css("top", pxTop);
|
||||
}
|
||||
|
||||
this.drag = bind(this.drag, this);
|
||||
this.stop = bind(this.stop, this);
|
||||
this.clicked = bind(this.clicked, this);
|
||||
this.colorChanged = bind(this.colorChanged, this);
|
||||
this.$el.draggable({
|
||||
axis: (orientation == "horizontal") ? "x" : "y",
|
||||
drag: this.drag,
|
||||
stop: this.stop,
|
||||
containment: $parentEl
|
||||
});
|
||||
this.$el.click(this.clicked);
|
||||
}
|
||||
|
||||
ControlPoint.prototype = {
|
||||
drag: function(e, ui) {
|
||||
// convert position to a %
|
||||
var left = ui.position.left;
|
||||
this.position = (left / (this.$parentEl.width() - this.outerWidth));
|
||||
this.listener.updatePreview();
|
||||
},
|
||||
|
||||
stop: function(e, ui) {
|
||||
this.listener.updatePreview();
|
||||
this.configView.show(this.$el.position(), this.color, this);
|
||||
},
|
||||
|
||||
clicked: function(e) {
|
||||
this.configView.show(this.$el.position(), this.color, this);
|
||||
e.stopPropagation();
|
||||
return false;
|
||||
},
|
||||
|
||||
colorChanged: function(c) {
|
||||
this.color = c;
|
||||
this.$el.css("background-color", this.color);
|
||||
this.listener.updatePreview();
|
||||
},
|
||||
|
||||
removeClicked: function() {
|
||||
this.listener.removeControlPoint(this);
|
||||
this.listener.updatePreview();
|
||||
}
|
||||
};
|
||||
|
||||
function ControlPtConfig($parent, opts) {
|
||||
//color-chooser
|
||||
this.$el = $('<div class="gradientPicker-ptConfig" style="visibility: hidden"></div>');
|
||||
$parent.append(this.$el);
|
||||
var $cpicker = $('<div class="color-chooser"></div>');
|
||||
this.$el.append($cpicker);
|
||||
var $rmEl = $("<div class='gradientPicker-close'></div>");
|
||||
this.$el.append($rmEl);
|
||||
|
||||
this.colorChanged = bind(this.colorChanged, this);
|
||||
this.removeClicked = bind(this.removeClicked, this);
|
||||
$cpicker.ColorPicker({
|
||||
onChange: this.colorChanged
|
||||
});
|
||||
this.$cpicker = $cpicker;
|
||||
this.opts = opts;
|
||||
this.visible = false;
|
||||
|
||||
$rmEl.click(this.removeClicked);
|
||||
}
|
||||
|
||||
ControlPtConfig.prototype = {
|
||||
show: function(position, color, listener) {
|
||||
this.visible = true;
|
||||
this.listener = listener;
|
||||
this.$el.css("visibility", "visible");
|
||||
this.$cpicker.ColorPickerSetColor(color);
|
||||
this.$cpicker.css("background-color", color);
|
||||
if (this.opts.orientation === "horizontal") {
|
||||
this.$el.css("left", position.left);
|
||||
} else {
|
||||
this.$el.css("top", position.top);
|
||||
}
|
||||
//else {
|
||||
// this.visible = false;
|
||||
//this.$el.css("visibility", "hidden");
|
||||
//}
|
||||
},
|
||||
|
||||
hide: function() {
|
||||
if (this.visible) {
|
||||
this.$el.css("visibility", "hidden");
|
||||
this.visible = false;
|
||||
}
|
||||
},
|
||||
|
||||
colorChanged: function(hsb, hex, rgb) {
|
||||
hex = "#" + hex;
|
||||
this.listener.colorChanged(hex);
|
||||
this.$cpicker.css("background-color", hex)
|
||||
},
|
||||
|
||||
removeClicked: function() {
|
||||
this.listener.removeClicked();
|
||||
this.hide();
|
||||
}
|
||||
};
|
||||
|
||||
var methods = {
|
||||
init: function(opts) {
|
||||
opts = $.extend({
|
||||
controlPoints: ["#FFF 0%", "#000 100%"],
|
||||
orientation: "horizontal",
|
||||
type: "linear",
|
||||
fillDirection: "left",
|
||||
generateStyles: true,
|
||||
change: function() {}
|
||||
}, opts);
|
||||
|
||||
this.each(function() {
|
||||
var $this = $(this);
|
||||
var gradSel = new GradientSelection($this, opts);
|
||||
$this.data("gradientPicker-sel", gradSel);
|
||||
});
|
||||
},
|
||||
|
||||
update: function(opts) {
|
||||
this.each(function() {
|
||||
var $this = $(this);
|
||||
var gradSel = $this.data("gradientPicker-sel");
|
||||
if (gradSel != null) {
|
||||
gradSel.updateOptions(opts);
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
$.fn.gradientPicker = function(method, opts) {
|
||||
if (typeof method === "string" && method !== "init") {
|
||||
methods[method].call(this, opts);
|
||||
} else {
|
||||
opts = method;
|
||||
methods.init.call(this, opts);
|
||||
}
|
||||
};
|
||||
})( jQuery );
|
4365
studio/button-editor/js/jquery.js
vendored
17
studio/button-editor/js/jqueryUI-custom.js
vendored
67
studio/button-editor/js/layout.js
vendored
@ -1,67 +0,0 @@
|
||||
(function($){
|
||||
var initLayout = function() {
|
||||
var hash = window.location.hash.replace('#', '');
|
||||
var currentTab = $('ul.navigationTabs a')
|
||||
.bind('click', showTab)
|
||||
.filter('a[rel=' + hash + ']');
|
||||
if (currentTab.size() == 0) {
|
||||
currentTab = $('ul.navigationTabs a:first');
|
||||
}
|
||||
showTab.apply(currentTab.get(0));
|
||||
$('#colorpickerHolder').ColorPicker({flat: true});
|
||||
$('#colorpickerHolder2').ColorPicker({
|
||||
flat: true,
|
||||
color: '#00ff00',
|
||||
onSubmit: function(hsb, hex, rgb) {
|
||||
$('#colorSelector2 div').css('backgroundColor', '#' + hex);
|
||||
}
|
||||
});
|
||||
$('#colorpickerHolder2>div').css('position', 'absolute');
|
||||
var widt = false;
|
||||
$('#colorSelector2').bind('click', function() {
|
||||
$('#colorpickerHolder2').stop().animate({height: widt ? 0 : 173}, 500);
|
||||
widt = !widt;
|
||||
});
|
||||
$('#colorpickerField1, #colorpickerField2, #colorpickerField3').ColorPicker({
|
||||
onSubmit: function(hsb, hex, rgb, el) {
|
||||
$(el).val(hex);
|
||||
$(el).ColorPickerHide();
|
||||
},
|
||||
onBeforeShow: function () {
|
||||
$(this).ColorPickerSetColor(this.value);
|
||||
}
|
||||
})
|
||||
.bind('keyup', function(){
|
||||
$(this).ColorPickerSetColor(this.value);
|
||||
});
|
||||
$('#colorSelector').ColorPicker({
|
||||
color: '#0000ff',
|
||||
onShow: function (colpkr) {
|
||||
$(colpkr).fadeIn(500);
|
||||
return false;
|
||||
},
|
||||
onHide: function (colpkr) {
|
||||
$(colpkr).fadeOut(500);
|
||||
return false;
|
||||
},
|
||||
onChange: function (hsb, hex, rgb) {
|
||||
$('#colorSelector div').css('backgroundColor', '#' + hex);
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
var showTab = function(e) {
|
||||
var tabIndex = $('ul.navigationTabs a')
|
||||
.removeClass('active')
|
||||
.index(this);
|
||||
$(this)
|
||||
.addClass('active')
|
||||
.blur();
|
||||
$('div.tab')
|
||||
.hide()
|
||||
.eq(tabIndex)
|
||||
.show();
|
||||
};
|
||||
|
||||
EYE.register(initLayout, 'init');
|
||||
})(jQuery)
|
768
studio/button-editor/js/rainbow.js
vendored
@ -1,768 +0,0 @@
|
||||
window['Rainbow'] = (function() {
|
||||
|
||||
/**
|
||||
* array of replacements to process at the end
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
var replacements = {},
|
||||
|
||||
/**
|
||||
* an array of start and end positions of blocks to be replaced
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
replacement_positions = {},
|
||||
|
||||
/**
|
||||
* an array of the language patterns specified for each language
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
language_patterns = {},
|
||||
|
||||
/**
|
||||
* an array of languages and whether they should bypass the default patterns
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
bypass_defaults = {},
|
||||
|
||||
/**
|
||||
* processing level
|
||||
*
|
||||
* replacements are stored at this level so if there is a sub block of code
|
||||
* (for example php inside of html) it runs at a different level
|
||||
*
|
||||
* @type {number}
|
||||
*/
|
||||
CURRENT_LEVEL = 0,
|
||||
|
||||
/**
|
||||
* constant used to refer to the default language
|
||||
*
|
||||
* @type {number}
|
||||
*/
|
||||
DEFAULT_LANGUAGE = 0,
|
||||
|
||||
/**
|
||||
* used as counters so we can selectively call setTimeout
|
||||
* after processing a certain number of matches/replacements
|
||||
*
|
||||
* @type {number}
|
||||
*/
|
||||
match_counter = 0,
|
||||
|
||||
/**
|
||||
* @type {number}
|
||||
*/
|
||||
replacement_counter = 0,
|
||||
|
||||
/**
|
||||
* @type {null|string}
|
||||
*/
|
||||
global_class,
|
||||
|
||||
/**
|
||||
* @type {null|Function}
|
||||
*/
|
||||
onHighlight;
|
||||
|
||||
/**
|
||||
* cross browser get attribute for an element
|
||||
*
|
||||
* @see http://stackoverflow.com/questions/3755227/cross-browser-javascript-getattribute-method
|
||||
*
|
||||
* @param {Node} el
|
||||
* @param {string} attr attribute you are trying to get
|
||||
* @returns {string|number}
|
||||
*/
|
||||
function _attr(el, attr, attrs, i) {
|
||||
var result = (el.getAttribute && el.getAttribute(attr)) || 0;
|
||||
|
||||
if (!result) {
|
||||
attrs = el.attributes;
|
||||
|
||||
for (i = 0; i < attrs.length; ++i) {
|
||||
if (attrs[i].nodeName === attr) {
|
||||
return attrs[i].nodeValue;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return result;
|
||||
}
|
||||
|
||||
/**
|
||||
* adds a class to a given code block
|
||||
*
|
||||
* @param {Element} el
|
||||
* @param {string} class_name class name to add
|
||||
* @returns void
|
||||
*/
|
||||
function _addClass(el, class_name) {
|
||||
el.className += el.className ? ' ' + class_name : class_name;
|
||||
}
|
||||
|
||||
/**
|
||||
* checks if a block has a given class
|
||||
*
|
||||
* @param {Element} el
|
||||
* @param {string} class_name class name to check for
|
||||
* @returns {boolean}
|
||||
*/
|
||||
function _hasClass(el, class_name) {
|
||||
return (' ' + el.className + ' ').indexOf(' ' + class_name + ' ') > -1;
|
||||
}
|
||||
|
||||
/**
|
||||
* gets the language for this block of code
|
||||
*
|
||||
* @param {Element} block
|
||||
* @returns {string|null}
|
||||
*/
|
||||
function _getLanguageForBlock(block) {
|
||||
|
||||
// if this doesn't have a language but the parent does then use that
|
||||
// this means if for example you have: <pre data-language="php">
|
||||
// with a bunch of <code> blocks inside then you do not have
|
||||
// to specify the language for each block
|
||||
var language = _attr(block, 'data-language') || _attr(block.parentNode, 'data-language');
|
||||
|
||||
// this adds support for specifying language via a css class
|
||||
// you can use the Google Code Prettify style: <pre class="lang-php">
|
||||
// or the HTML5 style: <pre><code class="language-php">
|
||||
if (!language) {
|
||||
var pattern = /\blang(?:uage)?-(\w+)/,
|
||||
match = block.className.match(pattern) || block.parentNode.className.match(pattern);
|
||||
|
||||
if (match) {
|
||||
language = match[1];
|
||||
}
|
||||
}
|
||||
|
||||
return language;
|
||||
}
|
||||
|
||||
/**
|
||||
* makes sure html entities are always used for tags
|
||||
*
|
||||
* @param {string} code
|
||||
* @returns {string}
|
||||
*/
|
||||
function _htmlEntities(code) {
|
||||
return code.replace(/</g, '<').replace(/>/g, '>').replace(/&(?![\w\#]+;)/g, '&');
|
||||
}
|
||||
|
||||
/**
|
||||
* determines if a new match intersects with an existing one
|
||||
*
|
||||
* @param {number} start1 start position of existing match
|
||||
* @param {number} end1 end position of existing match
|
||||
* @param {number} start2 start position of new match
|
||||
* @param {number} end2 end position of new match
|
||||
* @returns {boolean}
|
||||
*/
|
||||
function _intersects(start1, end1, start2, end2) {
|
||||
if (start2 >= start1 && start2 < end1) {
|
||||
return true;
|
||||
}
|
||||
|
||||
return end2 > start1 && end2 < end1;
|
||||
}
|
||||
|
||||
/**
|
||||
* determines if two different matches have complete overlap with each other
|
||||
*
|
||||
* @param {number} start1 start position of existing match
|
||||
* @param {number} end1 end position of existing match
|
||||
* @param {number} start2 start position of new match
|
||||
* @param {number} end2 end position of new match
|
||||
* @returns {boolean}
|
||||
*/
|
||||
function _hasCompleteOverlap(start1, end1, start2, end2) {
|
||||
|
||||
// if the starting and end positions are exactly the same
|
||||
// then the first one should stay and this one should be ignored
|
||||
if (start2 == start1 && end2 == end1) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return start2 <= start1 && end2 >= end1;
|
||||
}
|
||||
|
||||
/**
|
||||
* determines if the match passed in falls inside of an existing match
|
||||
* this prevents a regex pattern from matching inside of a bigger pattern
|
||||
*
|
||||
* @param {number} start - start position of new match
|
||||
* @param {number} end - end position of new match
|
||||
* @returns {boolean}
|
||||
*/
|
||||
function _matchIsInsideOtherMatch(start, end) {
|
||||
for (var key in replacement_positions[CURRENT_LEVEL]) {
|
||||
key = parseInt(key, 10);
|
||||
|
||||
// if this block completely overlaps with another block
|
||||
// then we should remove the other block and return false
|
||||
if (_hasCompleteOverlap(key, replacement_positions[CURRENT_LEVEL][key], start, end)) {
|
||||
delete replacement_positions[CURRENT_LEVEL][key];
|
||||
delete replacements[CURRENT_LEVEL][key];
|
||||
}
|
||||
|
||||
if (_intersects(key, replacement_positions[CURRENT_LEVEL][key], start, end)) {
|
||||
return true;
|
||||
}
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
|
||||
/**
|
||||
* takes a string of code and wraps it in a span tag based on the name
|
||||
*
|
||||
* @param {string} name name of the pattern (ie keyword.regex)
|
||||
* @param {string} code block of code to wrap
|
||||
* @returns {string}
|
||||
*/
|
||||
function _wrapCodeInSpan(name, code) {
|
||||
return '<span class="' + name.replace(/\./g, ' ') + (global_class ? ' ' + global_class : '') + '">' + code + '</span>';
|
||||
}
|
||||
|
||||
/**
|
||||
* finds out the position of group match for a regular expression
|
||||
*
|
||||
* @see http://stackoverflow.com/questions/1985594/how-to-find-index-of-groups-in-match
|
||||
*
|
||||
* @param {Object} match
|
||||
* @param {number} group_number
|
||||
* @returns {number}
|
||||
*/
|
||||
function _indexOfGroup(match, group_number) {
|
||||
var index = 0,
|
||||
i;
|
||||
|
||||
for (i = 1; i < group_number; ++i) {
|
||||
if (match[i]) {
|
||||
index += match[i].length;
|
||||
}
|
||||
}
|
||||
|
||||
return index;
|
||||
}
|
||||
|
||||
/**
|
||||
* matches a regex pattern against a block of code
|
||||
* finds all matches that should be processed and stores the positions
|
||||
* of where they should be replaced within the string
|
||||
*
|
||||
* this is where pretty much all the work is done but it should not
|
||||
* be called directly
|
||||
*
|
||||
* @param {RegExp} pattern
|
||||
* @param {string} code
|
||||
* @returns void
|
||||
*/
|
||||
function _processPattern(regex, pattern, code, callback)
|
||||
{
|
||||
var match = regex.exec(code);
|
||||
|
||||
if (!match) {
|
||||
return callback();
|
||||
}
|
||||
|
||||
++match_counter;
|
||||
|
||||
// treat match 0 the same way as name
|
||||
if (!pattern['name'] && typeof pattern['matches'][0] == 'string') {
|
||||
pattern['name'] = pattern['matches'][0];
|
||||
delete pattern['matches'][0];
|
||||
}
|
||||
|
||||
var replacement = match[0],
|
||||
start_pos = match.index,
|
||||
end_pos = match[0].length + start_pos,
|
||||
|
||||
/**
|
||||
* callback to process the next match of this pattern
|
||||
*/
|
||||
processNext = function() {
|
||||
var nextCall = function() {
|
||||
_processPattern(regex, pattern, code, callback);
|
||||
};
|
||||
|
||||
// every 100 items we process let's call set timeout
|
||||
// to let the ui breathe a little
|
||||
return match_counter % 100 > 0 ? nextCall() : setTimeout(nextCall, 0);
|
||||
};
|
||||
|
||||
// if this is not a child match and it falls inside of another
|
||||
// match that already happened we should skip it and continue processing
|
||||
if (_matchIsInsideOtherMatch(start_pos, end_pos)) {
|
||||
return processNext();
|
||||
}
|
||||
|
||||
/**
|
||||
* callback for when a match was successfully processed
|
||||
*
|
||||
* @param {string} replacement
|
||||
* @returns void
|
||||
*/
|
||||
var onMatchSuccess = function(replacement) {
|
||||
// if this match has a name then wrap it in a span tag
|
||||
if (pattern['name']) {
|
||||
replacement = _wrapCodeInSpan(pattern['name'], replacement);
|
||||
}
|
||||
|
||||
// console.log('LEVEL', CURRENT_LEVEL, 'replace', match[0], 'with', replacement, 'at position', start_pos, 'to', end_pos);
|
||||
|
||||
// store what needs to be replaced with what at this position
|
||||
if (!replacements[CURRENT_LEVEL]) {
|
||||
replacements[CURRENT_LEVEL] = {};
|
||||
replacement_positions[CURRENT_LEVEL] = {};
|
||||
}
|
||||
|
||||
replacements[CURRENT_LEVEL][start_pos] = {
|
||||
'replace': match[0],
|
||||
'with': replacement
|
||||
};
|
||||
|
||||
// store the range of this match so we can use it for comparisons
|
||||
// with other matches later
|
||||
replacement_positions[CURRENT_LEVEL][start_pos] = end_pos;
|
||||
|
||||
// process the next match
|
||||
processNext();
|
||||
},
|
||||
|
||||
// if this pattern has sub matches for different groups in the regex
|
||||
// then we should process them one at a time by rerunning them through
|
||||
// this function to generate the new replacement
|
||||
//
|
||||
// we run through them backwards because the match position of earlier
|
||||
// matches will not change depending on what gets replaced in later
|
||||
// matches
|
||||
group_keys = keys(pattern['matches']),
|
||||
|
||||
/**
|
||||
* callback for processing a sub group
|
||||
*
|
||||
* @param {number} i
|
||||
* @param {Array} group_keys
|
||||
* @param {Function} callback
|
||||
*/
|
||||
processGroup = function(i, group_keys, callback) {
|
||||
if (i >= group_keys.length) {
|
||||
return callback(replacement);
|
||||
}
|
||||
|
||||
var processNextGroup = function() {
|
||||
processGroup(++i, group_keys, callback);
|
||||
},
|
||||
block = match[group_keys[i]];
|
||||
|
||||
// if there is no match here then move on
|
||||
if (!block) {
|
||||
return processNextGroup();
|
||||
}
|
||||
|
||||
var group = pattern['matches'][group_keys[i]],
|
||||
language = group['language'],
|
||||
|
||||
/**
|
||||
* process group is what group we should use to actually process
|
||||
* this match group
|
||||
*
|
||||
* for example if the subgroup pattern looks like this
|
||||
* 2: {
|
||||
* 'name': 'keyword',
|
||||
* 'pattern': /true/g
|
||||
* }
|
||||
*
|
||||
* then we use that as is, but if it looks like this
|
||||
*
|
||||
* 2: {
|
||||
* 'name': 'keyword',
|
||||
* 'matches': {
|
||||
* 'name': 'special',
|
||||
* 'pattern': /whatever/g
|
||||
* }
|
||||
* }
|
||||
*
|
||||
* we treat the 'matches' part as the pattern and keep
|
||||
* the name around to wrap it with later
|
||||
*/
|
||||
process_group = group['name'] && group['matches'] ? group['matches'] : group,
|
||||
|
||||
/**
|
||||
* takes the code block matched at this group, replaces it
|
||||
* with the highlighted block, and optionally wraps it with
|
||||
* a span with a name
|
||||
*
|
||||
* @param {string} block
|
||||
* @param {string} replace_block
|
||||
* @param {string|null} match_name
|
||||
*/
|
||||
_replaceAndContinue = function(block, replace_block, match_name) {
|
||||
replacement = _replaceAtPosition(_indexOfGroup(match, group_keys[i]), block, match_name ? _wrapCodeInSpan(match_name, replace_block) : replace_block, replacement);
|
||||
processNextGroup();
|
||||
};
|
||||
|
||||
// if this is a sublanguage go and process the block using that language
|
||||
if (language) {
|
||||
return _highlightBlockForLanguage(block, language, function(code) {
|
||||
_replaceAndContinue(block, code);
|
||||
});
|
||||
}
|
||||
|
||||
// if this is a string then this match is directly mapped to selector
|
||||
// so all we have to do is wrap it in a span and continue
|
||||
if (typeof group === 'string') {
|
||||
return _replaceAndContinue(block, block, group);
|
||||
}
|
||||
|
||||
// the process group can be a single pattern or an array of patterns
|
||||
// _processCodeWithPatterns always expects an array so we convert it here
|
||||
_processCodeWithPatterns(block, process_group.length ? process_group : [process_group], function(code) {
|
||||
_replaceAndContinue(block, code, group['matches'] ? group['name'] : 0);
|
||||
});
|
||||
};
|
||||
|
||||
processGroup(0, group_keys, onMatchSuccess);
|
||||
}
|
||||
|
||||
/**
|
||||
* should a language bypass the default patterns?
|
||||
*
|
||||
* if you call Rainbow.extend() and pass true as the third argument
|
||||
* it will bypass the defaults
|
||||
*/
|
||||
function _bypassDefaultPatterns(language)
|
||||
{
|
||||
return bypass_defaults[language];
|
||||
}
|
||||
|
||||
/**
|
||||
* returns a list of regex patterns for this language
|
||||
*
|
||||
* @param {string} language
|
||||
* @returns {Array}
|
||||
*/
|
||||
function _getPatternsForLanguage(language) {
|
||||
var patterns = language_patterns[language] || [],
|
||||
default_patterns = language_patterns[DEFAULT_LANGUAGE] || [];
|
||||
|
||||
return _bypassDefaultPatterns(language) ? patterns : patterns.concat(default_patterns);
|
||||
}
|
||||
|
||||
/**
|
||||
* substring replace call to replace part of a string at a certain position
|
||||
*
|
||||
* @param {number} position the position where the replacement should happen
|
||||
* @param {string} replace the text we want to replace
|
||||
* @param {string} replace_with the text we want to replace it with
|
||||
* @param {string} code the code we are doing the replacing in
|
||||
* @returns {string}
|
||||
*/
|
||||
function _replaceAtPosition(position, replace, replace_with, code) {
|
||||
var sub_string = code.substr(position);
|
||||
return code.substr(0, position) + sub_string.replace(replace, replace_with);
|
||||
}
|
||||
|
||||
/**
|
||||
* sorts an object by index descending
|
||||
*
|
||||
* @param {Object} object
|
||||
* @return {Array}
|
||||
*/
|
||||
function keys(object) {
|
||||
var locations = [],
|
||||
replacement,
|
||||
pos;
|
||||
|
||||
for(var location in object) {
|
||||
if (object.hasOwnProperty(location)) {
|
||||
locations.push(location);
|
||||
}
|
||||
}
|
||||
|
||||
// numeric descending
|
||||
return locations.sort(function(a, b) {
|
||||
return b - a;
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* processes a block of code using specified patterns
|
||||
*
|
||||
* @param {string} code
|
||||
* @param {Array} patterns
|
||||
* @returns void
|
||||
*/
|
||||
function _processCodeWithPatterns(code, patterns, callback)
|
||||
{
|
||||
// we have to increase the level here so that the
|
||||
// replacements will not conflict with each other when
|
||||
// processing sub blocks of code
|
||||
++CURRENT_LEVEL;
|
||||
|
||||
// patterns are processed one at a time through this function
|
||||
function _workOnPatterns(patterns, i)
|
||||
{
|
||||
// still have patterns to process, keep going
|
||||
if (i < patterns.length) {
|
||||
return _processPattern(patterns[i]['pattern'], patterns[i], code, function() {
|
||||
_workOnPatterns(patterns, ++i);
|
||||
});
|
||||
}
|
||||
|
||||
// we are done processing the patterns
|
||||
// process the replacements and update the DOM
|
||||
_processReplacements(code, function(code) {
|
||||
|
||||
// when we are done processing replacements
|
||||
// we are done at this level so we can go back down
|
||||
delete replacements[CURRENT_LEVEL];
|
||||
delete replacement_positions[CURRENT_LEVEL];
|
||||
--CURRENT_LEVEL;
|
||||
callback(code);
|
||||
});
|
||||
}
|
||||
|
||||
_workOnPatterns(patterns, 0);
|
||||
}
|
||||
|
||||
/**
|
||||
* process replacements in the string of code to actually update the markup
|
||||
*
|
||||
* @param {string} code the code to process replacements in
|
||||
* @param {Function} onComplete what to do when we are done processing
|
||||
* @returns void
|
||||
*/
|
||||
function _processReplacements(code, onComplete) {
|
||||
|
||||
/**
|
||||
* processes a single replacement
|
||||
*
|
||||
* @param {string} code
|
||||
* @param {Array} positions
|
||||
* @param {number} i
|
||||
* @param {Function} onComplete
|
||||
* @returns void
|
||||
*/
|
||||
function _processReplacement(code, positions, i, onComplete) {
|
||||
if (i < positions.length) {
|
||||
++replacement_counter;
|
||||
var pos = positions[i],
|
||||
replacement = replacements[CURRENT_LEVEL][pos];
|
||||
code = _replaceAtPosition(pos, replacement['replace'], replacement['with'], code);
|
||||
|
||||
// process next function
|
||||
var next = function() {
|
||||
_processReplacement(code, positions, ++i, onComplete);
|
||||
};
|
||||
|
||||
// use a timeout every 250 to not freeze up the UI
|
||||
return replacement_counter % 250 > 0 ? next() : setTimeout(next, 0);
|
||||
}
|
||||
|
||||
onComplete(code);
|
||||
}
|
||||
|
||||
var string_positions = keys(replacements[CURRENT_LEVEL]);
|
||||
_processReplacement(code, string_positions, 0, onComplete);
|
||||
}
|
||||
|
||||
/**
|
||||
* takes a string of code and highlights it according to the language specified
|
||||
*
|
||||
* @param {string} code
|
||||
* @param {string} language
|
||||
* @param {Function} onComplete
|
||||
* @returns void
|
||||
*/
|
||||
function _highlightBlockForLanguage(code, language, onComplete) {
|
||||
var patterns = _getPatternsForLanguage(language);
|
||||
_processCodeWithPatterns(_htmlEntities(code), patterns, onComplete);
|
||||
}
|
||||
|
||||
/**
|
||||
* highlight an individual code block
|
||||
*
|
||||
* @param {Array} code_blocks
|
||||
* @param {number} i
|
||||
* @returns void
|
||||
*/
|
||||
function _highlightCodeBlock(code_blocks, i, onComplete) {
|
||||
|
||||
|
||||
if (i < code_blocks.length) {
|
||||
var block = code_blocks[i],
|
||||
language = _getLanguageForBlock(block);
|
||||
|
||||
if (!_hasClass(block, 'rainbow') && language) {
|
||||
language = language.toLowerCase();
|
||||
|
||||
_addClass(block, 'rainbow');
|
||||
|
||||
return _highlightBlockForLanguage(block.innerHTML, language, function(code) {
|
||||
block.innerHTML = code;
|
||||
|
||||
// reset the replacement arrays
|
||||
replacements = {};
|
||||
replacement_positions = {};
|
||||
|
||||
// if you have a listener attached tell it that this block is now highlighted
|
||||
if (onHighlight) {
|
||||
onHighlight(block, language);
|
||||
}
|
||||
|
||||
// process the next block
|
||||
setTimeout(function() {
|
||||
_highlightCodeBlock(code_blocks, ++i, onComplete);
|
||||
}, 0);
|
||||
});
|
||||
}
|
||||
return _highlightCodeBlock(code_blocks, ++i, onComplete);
|
||||
}
|
||||
|
||||
if (onComplete) {
|
||||
onComplete();
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* start highlighting all the code blocks
|
||||
*
|
||||
* @returns void
|
||||
*/
|
||||
function _highlight(node, onComplete) {
|
||||
|
||||
// the first argument can be an Event or a DOM Element
|
||||
// I was originally checking instanceof Event but that makes it break
|
||||
// when using mootools
|
||||
//
|
||||
// @see https://github.com/ccampbell/rainbow/issues/32
|
||||
//
|
||||
node = node && typeof node.getElementsByTagName == 'function' ? node : document;
|
||||
|
||||
var pre_blocks = node.getElementsByTagName('pre'),
|
||||
code_blocks = node.getElementsByTagName('code'),
|
||||
i,
|
||||
final_blocks = [];
|
||||
|
||||
// alert(vl);
|
||||
|
||||
// @see http://stackoverflow.com/questions/2735067/how-to-convert-a-dom-node-list-to-an-array-in-javascript
|
||||
// we are going to process all <code> blocks
|
||||
for (i = 0; i < code_blocks.length; ++i) {
|
||||
final_blocks.push(code_blocks[i]);
|
||||
}
|
||||
|
||||
// loop through the pre blocks to see which ones we should add
|
||||
for (i = 0; i < pre_blocks.length; ++i) {
|
||||
|
||||
// if the pre block has no code blocks then process it directly
|
||||
if (!pre_blocks[i].getElementsByTagName('code').length) {
|
||||
final_blocks.push(pre_blocks[i]);
|
||||
}
|
||||
}
|
||||
|
||||
_highlightCodeBlock(final_blocks, 0, onComplete);
|
||||
}
|
||||
|
||||
/**
|
||||
* public methods
|
||||
*/
|
||||
return {
|
||||
|
||||
/**
|
||||
* extends the language pattern matches
|
||||
*
|
||||
* @param {*} language name of language
|
||||
* @param {*} patterns array of patterns to add on
|
||||
* @param {boolean|null} bypass if true this will bypass the default language patterns
|
||||
*/
|
||||
extend: function(language, patterns, bypass) {
|
||||
|
||||
// if there is only one argument then we assume that we want to
|
||||
// extend the default language rules
|
||||
if (arguments.length == 1) {
|
||||
patterns = language;
|
||||
language = DEFAULT_LANGUAGE;
|
||||
}
|
||||
|
||||
bypass_defaults[language] = bypass;
|
||||
language_patterns[language] = patterns.concat(language_patterns[language] || []);
|
||||
},
|
||||
|
||||
/**
|
||||
* call back to let you do stuff in your app after a piece of code has been highlighted
|
||||
*
|
||||
* @param {Function} callback
|
||||
*/
|
||||
onHighlight: function(callback) {
|
||||
onHighlight = callback;
|
||||
},
|
||||
|
||||
/**
|
||||
* method to set a global class that will be applied to all spans
|
||||
*
|
||||
* @param {string} class_name
|
||||
*/
|
||||
addClass: function(class_name) {
|
||||
global_class = class_name;
|
||||
},
|
||||
|
||||
/**
|
||||
* starts the magic rainbow
|
||||
*
|
||||
* @returns void
|
||||
*/
|
||||
color: function() {
|
||||
|
||||
// if you want to straight up highlight a string you can pass the string of code,
|
||||
// the language, and a callback function
|
||||
if (typeof arguments[0] == 'string') {
|
||||
|
||||
return _highlightBlockForLanguage(arguments[0], arguments[1], arguments[2]);
|
||||
|
||||
}
|
||||
|
||||
// if you pass a callback function then we rerun the color function
|
||||
// on all the code and call the callback function on complete
|
||||
if (typeof arguments[0] == 'function') {
|
||||
return _highlight(0, arguments[0]);
|
||||
}
|
||||
//alert("lol");
|
||||
// otherwise we use whatever node you passed in with an optional
|
||||
// callback function as the second parameter
|
||||
//alert(arguments[0]);
|
||||
_highlight(arguments[0], arguments[1]);
|
||||
},
|
||||
|
||||
beautify : function() {
|
||||
|
||||
_highlight(arguments[0], arguments[1]);
|
||||
|
||||
|
||||
|
||||
}
|
||||
};
|
||||
}) ();
|
||||
|
||||
/**
|
||||
* adds event listener to start highlighting
|
||||
*/
|
||||
(function() {
|
||||
if (window.addEventListener) {
|
||||
return window.addEventListener('load', Rainbow.color, false);
|
||||
}
|
||||
window.attachEvent('onload', Rainbow.color);
|
||||
}) ();
|
||||
|
||||
// When using Google closure compiler in advanced mode some methods
|
||||
// get renamed. This keeps a public reference to these methods so they can
|
||||
// still be referenced from outside this library.
|
||||
Rainbow["onHighlight"] = Rainbow.onHighlight;
|
||||
Rainbow["addClass"] = Rainbow.addClass;
|
246
studio/button-editor/js/utils.js
vendored
@ -1,246 +0,0 @@
|
||||
(function($) {
|
||||
EYE.extend({
|
||||
getPosition : function(e, forceIt)
|
||||
{
|
||||
var x = 0;
|
||||
var y = 0;
|
||||
var es = e.style;
|
||||
var restoreStyles = false;
|
||||
if (forceIt && jQuery.curCSS(e,'display') == 'none') {
|
||||
var oldVisibility = es.visibility;
|
||||
var oldPosition = es.position;
|
||||
restoreStyles = true;
|
||||
es.visibility = 'hidden';
|
||||
es.display = 'block';
|
||||
es.position = 'absolute';
|
||||
}
|
||||
var el = e;
|
||||
if (el.getBoundingClientRect) { // IE
|
||||
var box = el.getBoundingClientRect();
|
||||
x = box.left + Math.max(document.documentElement.scrollLeft, document.body.scrollLeft) - 2;
|
||||
y = box.top + Math.max(document.documentElement.scrollTop, document.body.scrollTop) - 2;
|
||||
} else {
|
||||
x = el.offsetLeft;
|
||||
y = el.offsetTop;
|
||||
el = el.offsetParent;
|
||||
if (e != el) {
|
||||
while (el) {
|
||||
x += el.offsetLeft;
|
||||
y += el.offsetTop;
|
||||
el = el.offsetParent;
|
||||
}
|
||||
}
|
||||
if (jQuery.browser.safari && jQuery.curCSS(e, 'position') == 'absolute' ) {
|
||||
x -= document.body.offsetLeft;
|
||||
y -= document.body.offsetTop;
|
||||
}
|
||||
el = e.parentNode;
|
||||
while (el && el.tagName.toUpperCase() != 'BODY' && el.tagName.toUpperCase() != 'HTML')
|
||||
{
|
||||
if (jQuery.curCSS(el, 'display') != 'inline') {
|
||||
x -= el.scrollLeft;
|
||||
y -= el.scrollTop;
|
||||
}
|
||||
el = el.parentNode;
|
||||
}
|
||||
}
|
||||
if (restoreStyles == true) {
|
||||
es.display = 'none';
|
||||
es.position = oldPosition;
|
||||
es.visibility = oldVisibility;
|
||||
}
|
||||
return {x:x, y:y};
|
||||
},
|
||||
getSize : function(e)
|
||||
{
|
||||
var w = parseInt(jQuery.curCSS(e,'width'), 10);
|
||||
var h = parseInt(jQuery.curCSS(e,'height'), 10);
|
||||
var wb = 0;
|
||||
var hb = 0;
|
||||
if (jQuery.curCSS(e, 'display') != 'none') {
|
||||
wb = e.offsetWidth;
|
||||
hb = e.offsetHeight;
|
||||
} else {
|
||||
var es = e.style;
|
||||
var oldVisibility = es.visibility;
|
||||
var oldPosition = es.position;
|
||||
es.visibility = 'hidden';
|
||||
es.display = 'block';
|
||||
es.position = 'absolute';
|
||||
wb = e.offsetWidth;
|
||||
hb = e.offsetHeight;
|
||||
es.display = 'none';
|
||||
es.position = oldPosition;
|
||||
es.visibility = oldVisibility;
|
||||
}
|
||||
return {w:w, h:h, wb:wb, hb:hb};
|
||||
},
|
||||
getClient : function(e)
|
||||
{
|
||||
var h, w;
|
||||
if (e) {
|
||||
w = e.clientWidth;
|
||||
h = e.clientHeight;
|
||||
} else {
|
||||
var de = document.documentElement;
|
||||
w = window.innerWidth || self.innerWidth || (de&&de.clientWidth) || document.body.clientWidth;
|
||||
h = window.innerHeight || self.innerHeight || (de&&de.clientHeight) || document.body.clientHeight;
|
||||
}
|
||||
return {w:w,h:h};
|
||||
},
|
||||
getScroll : function (e)
|
||||
{
|
||||
var t=0, l=0, w=0, h=0, iw=0, ih=0;
|
||||
if (e && e.nodeName.toLowerCase() != 'body') {
|
||||
t = e.scrollTop;
|
||||
l = e.scrollLeft;
|
||||
w = e.scrollWidth;
|
||||
h = e.scrollHeight;
|
||||
} else {
|
||||
if (document.documentElement) {
|
||||
t = document.documentElement.scrollTop;
|
||||
l = document.documentElement.scrollLeft;
|
||||
w = document.documentElement.scrollWidth;
|
||||
h = document.documentElement.scrollHeight;
|
||||
} else if (document.body) {
|
||||
t = document.body.scrollTop;
|
||||
l = document.body.scrollLeft;
|
||||
w = document.body.scrollWidth;
|
||||
h = document.body.scrollHeight;
|
||||
}
|
||||
if (typeof pageYOffset != 'undefined') {
|
||||
t = pageYOffset;
|
||||
l = pageXOffset;
|
||||
}
|
||||
iw = self.innerWidth||document.documentElement.clientWidth||document.body.clientWidth||0;
|
||||
ih = self.innerHeight||document.documentElement.clientHeight||document.body.clientHeight||0;
|
||||
}
|
||||
return { t: t, l: l, w: w, h: h, iw: iw, ih: ih };
|
||||
},
|
||||
getMargins : function(e, toInteger)
|
||||
{
|
||||
var t = jQuery.curCSS(e,'marginTop') || '';
|
||||
var r = jQuery.curCSS(e,'marginRight') || '';
|
||||
var b = jQuery.curCSS(e,'marginBottom') || '';
|
||||
var l = jQuery.curCSS(e,'marginLeft') || '';
|
||||
if (toInteger)
|
||||
return {
|
||||
t: parseInt(t, 10)||0,
|
||||
r: parseInt(r, 10)||0,
|
||||
b: parseInt(b, 10)||0,
|
||||
l: parseInt(l, 10)
|
||||
};
|
||||
else
|
||||
return {t: t, r: r, b: b, l: l};
|
||||
},
|
||||
getPadding : function(e, toInteger)
|
||||
{
|
||||
var t = jQuery.curCSS(e,'paddingTop') || '';
|
||||
var r = jQuery.curCSS(e,'paddingRight') || '';
|
||||
var b = jQuery.curCSS(e,'paddingBottom') || '';
|
||||
var l = jQuery.curCSS(e,'paddingLeft') || '';
|
||||
if (toInteger)
|
||||
return {
|
||||
t: parseInt(t, 10)||0,
|
||||
r: parseInt(r, 10)||0,
|
||||
b: parseInt(b, 10)||0,
|
||||
l: parseInt(l, 10)
|
||||
};
|
||||
else
|
||||
return {t: t, r: r, b: b, l: l};
|
||||
},
|
||||
getBorder : function(e, toInteger)
|
||||
{
|
||||
var t = jQuery.curCSS(e,'borderTopWidth') || '';
|
||||
var r = jQuery.curCSS(e,'borderRightWidth') || '';
|
||||
var b = jQuery.curCSS(e,'borderBottomWidth') || '';
|
||||
var l = jQuery.curCSS(e,'borderLeftWidth') || '';
|
||||
if (toInteger)
|
||||
return {
|
||||
t: parseInt(t, 10)||0,
|
||||
r: parseInt(r, 10)||0,
|
||||
b: parseInt(b, 10)||0,
|
||||
l: parseInt(l, 10)||0
|
||||
};
|
||||
else
|
||||
return {t: t, r: r, b: b, l: l};
|
||||
},
|
||||
traverseDOM : function(nodeEl, func)
|
||||
{
|
||||
func(nodeEl);
|
||||
nodeEl = nodeEl.firstChild;
|
||||
while(nodeEl){
|
||||
EYE.traverseDOM(nodeEl, func);
|
||||
nodeEl = nodeEl.nextSibling;
|
||||
}
|
||||
},
|
||||
getInnerWidth : function(el, scroll) {
|
||||
var offsetW = el.offsetWidth;
|
||||
return scroll ? Math.max(el.scrollWidth,offsetW) - offsetW + el.clientWidth:el.clientWidth;
|
||||
},
|
||||
getInnerHeight : function(el, scroll) {
|
||||
var offsetH = el.offsetHeight;
|
||||
return scroll ? Math.max(el.scrollHeight,offsetH) - offsetH + el.clientHeight:el.clientHeight;
|
||||
},
|
||||
getExtraWidth : function(el) {
|
||||
if($.boxModel)
|
||||
return (parseInt($.curCSS(el, 'paddingLeft'))||0)
|
||||
+ (parseInt($.curCSS(el, 'paddingRight'))||0)
|
||||
+ (parseInt($.curCSS(el, 'borderLeftWidth'))||0)
|
||||
+ (parseInt($.curCSS(el, 'borderRightWidth'))||0);
|
||||
return 0;
|
||||
},
|
||||
getExtraHeight : function(el) {
|
||||
if($.boxModel)
|
||||
return (parseInt($.curCSS(el, 'paddingTop'))||0)
|
||||
+ (parseInt($.curCSS(el, 'paddingBottom'))||0)
|
||||
+ (parseInt($.curCSS(el, 'borderTopWidth'))||0)
|
||||
+ (parseInt($.curCSS(el, 'borderBottomWidth'))||0);
|
||||
return 0;
|
||||
},
|
||||
isChildOf: function(parentEl, el, container) {
|
||||
if (parentEl == el) {
|
||||
return true;
|
||||
}
|
||||
if (!el || !el.nodeType || el.nodeType != 1) {
|
||||
return false;
|
||||
}
|
||||
if (parentEl.contains && !$.browser.safari) {
|
||||
return parentEl.contains(el);
|
||||
}
|
||||
if ( parentEl.compareDocumentPosition ) {
|
||||
return !!(parentEl.compareDocumentPosition(el) & 16);
|
||||
}
|
||||
var prEl = el.parentNode;
|
||||
while(prEl && prEl != container) {
|
||||
if (prEl == parentEl)
|
||||
return true;
|
||||
prEl = prEl.parentNode;
|
||||
}
|
||||
return false;
|
||||
},
|
||||
centerEl : function(el, axis)
|
||||
{
|
||||
var clientScroll = EYE.getScroll();
|
||||
var size = EYE.getSize(el);
|
||||
if (!axis || axis == 'vertically')
|
||||
$(el).css(
|
||||
{
|
||||
top: clientScroll.t + ((Math.min(clientScroll.h,clientScroll.ih) - size.hb)/2) + 'px'
|
||||
}
|
||||
);
|
||||
if (!axis || axis == 'horizontally')
|
||||
$(el).css(
|
||||
{
|
||||
left: clientScroll.l + ((Math.min(clientScroll.w,clientScroll.iw) - size.wb)/2) + 'px'
|
||||
}
|
||||
);
|
||||
}
|
||||
});
|
||||
if (!$.easing.easeout) {
|
||||
$.easing.easeout = function(p, n, firstNum, delta, duration) {
|
||||
return -delta * ((n=n/duration-1)*n*n*n - 1) + firstNum;
|
||||
};
|
||||
}
|
||||
|
||||
})(jQuery);
|
207
studio/button-editor/styles/button-gen.css
vendored
@ -1,207 +0,0 @@
|
||||
#panel-right {
|
||||
|
||||
padding:20px;
|
||||
border: thin solid #bfbfbf;
|
||||
margin-right: 0;
|
||||
margin-top: 5px;
|
||||
background-color: #2c2d3a;
|
||||
margin-top:-10px;
|
||||
max-width: 1010px;
|
||||
left:1%;
|
||||
|
||||
}
|
||||
|
||||
#panel-left {
|
||||
|
||||
float:left;
|
||||
padding:20px;
|
||||
border: thin solid #bfbfbf;
|
||||
margin-left: 0;
|
||||
margin-top: 5px;
|
||||
background-color: rgba(243,243,243,0.7);
|
||||
overflow: scroll;
|
||||
margin-top:-10px;
|
||||
|
||||
}
|
||||
|
||||
|
||||
#preview {
|
||||
|
||||
max-width: 1010px;
|
||||
height: 300px;
|
||||
margin-top:50px;
|
||||
background: url('../styles/images/grid2.png');
|
||||
padding: 20px;
|
||||
border: thin solid #d7d7d7;
|
||||
left:1%;
|
||||
|
||||
|
||||
}
|
||||
|
||||
#sample {
|
||||
|
||||
|
||||
|
||||
position: relative;
|
||||
top:110px;
|
||||
padding:10px;
|
||||
font-size:12px;
|
||||
border-style:none;
|
||||
font-family:tahoma;
|
||||
border-color:black;
|
||||
|
||||
}
|
||||
|
||||
.tool {
|
||||
font-family:impact;
|
||||
|
||||
}
|
||||
|
||||
.tool heading {
|
||||
|
||||
color:#20a0dc;
|
||||
letter-spacing: 3px;
|
||||
}
|
||||
|
||||
.tool heading span {
|
||||
|
||||
color:rgb(255, 255, 255);
|
||||
font-style: italic;
|
||||
font-weight: 100;
|
||||
font-family: courier;
|
||||
font-size: 0.9em;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
input[type="range"] {
|
||||
-webkit-appearance: none;
|
||||
background-color: black;
|
||||
height: 2px;
|
||||
width: 200px;
|
||||
}
|
||||
|
||||
input[type="range"]::-webkit-slider-thumb {
|
||||
-webkit-appearance: none;
|
||||
position: relative;
|
||||
top: -1px;
|
||||
z-index: 1;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
|
||||
-webkit-border-radius: 40px;
|
||||
-moz-border-radius: 40px;
|
||||
border-radius: 40px;
|
||||
/*background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ebf1f6), color-stop(50%,#abd3ee), color-stop(51%,#89c3eb), color-stop(100%,#d5ebfb));*/
|
||||
background-color:#f79b23;
|
||||
|
||||
}
|
||||
|
||||
.awesome{
|
||||
|
||||
display: inline-block;
|
||||
padding: 5px 10px 6px;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
-moz-box-shadow: 0 1px 3px #999;
|
||||
-webkit-box-shadow: 0 1px 3px #999;
|
||||
text-shadow: 0 -1px 1px #222;
|
||||
border-bottom: 1px solid #222;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
background-color: #a9014b;
|
||||
}
|
||||
|
||||
.bawesome{
|
||||
|
||||
display: inline-block;
|
||||
padding: 5px 10px 6px;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
|
||||
|
||||
text-shadow: 0 -1px 1px #222;
|
||||
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
background-color: #2bbff4;
|
||||
|
||||
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
|
||||
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
|
||||
border-bottom: 1px solid rgba(0,0,0,0.25);
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.grad_ex {
|
||||
width: 200px;
|
||||
height: 20px;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
|
||||
.modal-profile h2 {
|
||||
text-align: center;
|
||||
font-family:tahoma;
|
||||
margin-top:-20px;
|
||||
font-weight: 100;
|
||||
color: #73b651;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.modal-profile {
|
||||
display:none;
|
||||
height: 320px;
|
||||
width: 460px;
|
||||
padding:25px;
|
||||
border:1px solid #fff;
|
||||
box-shadow: 0px 2px 7px #292929;
|
||||
-moz-box-shadow: 0px 2px 7px #292929;
|
||||
-webkit-box-shadow: 0px 2px 7px #292929;
|
||||
border-radius:10px;
|
||||
-moz-border-radius:10px;
|
||||
-webkit-border-radius:10px;
|
||||
background: #f2f2f2;
|
||||
z-index:1111;
|
||||
/* margin-left:auto;
|
||||
margin-right: auto;*/
|
||||
|
||||
position: absolute;
|
||||
top:90px;
|
||||
left: 380px;
|
||||
|
||||
}
|
||||
a.modal-close-profile {
|
||||
position:absolute;
|
||||
top:-15px;
|
||||
right:-15px;
|
||||
}
|
||||
a.modal-social {
|
||||
margin:0 10px 0 0;
|
||||
}
|
||||
|
||||
.modal-lightsout {
|
||||
display:none;
|
||||
position:absolute;
|
||||
top:0;
|
||||
left:0;
|
||||
width:100%;
|
||||
height: 100%;
|
||||
z-index:1000;
|
||||
background:rgba(0,0,0,0.95);
|
||||
}
|
||||
|
||||
|
163
studio/button-editor/styles/colorpicker.css
vendored
@ -1,163 +0,0 @@
|
||||
.colorpicker {
|
||||
width: 356px;
|
||||
height: 176px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
background: url(../images/colorpicker_background.png);
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
display: none;
|
||||
margin-top:-70px;
|
||||
margin-left:-90px;
|
||||
}
|
||||
.colorpicker_color {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
left: 14px;
|
||||
top: 13px;
|
||||
position: absolute;
|
||||
background: #f00;
|
||||
overflow: hidden;
|
||||
cursor: crosshair;
|
||||
}
|
||||
.colorpicker_color div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: url(../images/colorpicker_overlay.png);
|
||||
}
|
||||
.colorpicker_color div div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 11px;
|
||||
height: 11px;
|
||||
overflow: hidden;
|
||||
background: url(../images/colorpicker_select.gif);
|
||||
margin: -5px 0 0 -5px;
|
||||
}
|
||||
.colorpicker_hue {
|
||||
position: absolute;
|
||||
top: 13px;
|
||||
left: 171px;
|
||||
width: 35px;
|
||||
height: 150px;
|
||||
cursor: n-resize;
|
||||
}
|
||||
.colorpicker_hue div {
|
||||
position: absolute;
|
||||
width: 35px;
|
||||
height: 9px;
|
||||
overflow: hidden;
|
||||
background: url(../images/colorpicker_indic.gif) left top;
|
||||
margin: -4px 0 0 0;
|
||||
left: 0px;
|
||||
}
|
||||
.colorpicker_new_color {
|
||||
position: absolute;
|
||||
width: 60px;
|
||||
height: 30px;
|
||||
left: 213px;
|
||||
top: 13px;
|
||||
background: #f00;
|
||||
}
|
||||
.colorpicker_current_color {
|
||||
position: absolute;
|
||||
width: 60px;
|
||||
height: 30px;
|
||||
left: 283px;
|
||||
top: 13px;
|
||||
background: #f00;
|
||||
}
|
||||
.colorpicker input {
|
||||
background-color: transparent;
|
||||
border: 1px solid transparent;
|
||||
position: absolute;
|
||||
font-size: 10px;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
color: #898989;
|
||||
top: 4px;
|
||||
right: 11px;
|
||||
text-align: right;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 11px;
|
||||
}
|
||||
.colorpicker_hex {
|
||||
position: absolute;
|
||||
width: 72px;
|
||||
height: 22px;
|
||||
background: url(../images/colorpicker_hex.png) top;
|
||||
left: 212px;
|
||||
top: 142px;
|
||||
}
|
||||
.colorpicker_hex input {
|
||||
right: 6px;
|
||||
}
|
||||
.colorpicker_field {
|
||||
height: 22px;
|
||||
width: 62px;
|
||||
background-position: top;
|
||||
position: absolute;
|
||||
}
|
||||
.colorpicker_field span {
|
||||
position: absolute;
|
||||
width: 12px;
|
||||
height: 22px;
|
||||
overflow: hidden;
|
||||
top: 0;
|
||||
right: 0;
|
||||
cursor: n-resize;
|
||||
}
|
||||
.colorpicker_rgb_r {
|
||||
background-image: url(../images/colorpicker_rgb_r.png);
|
||||
top: 52px;
|
||||
left: 212px;
|
||||
}
|
||||
.colorpicker_rgb_g {
|
||||
background-image: url(../images/colorpicker_rgb_g.png);
|
||||
top: 82px;
|
||||
left: 212px;
|
||||
}
|
||||
.colorpicker_rgb_b {
|
||||
background-image: url(../images/colorpicker_rgb_b.png);
|
||||
top: 112px;
|
||||
left: 212px;
|
||||
}
|
||||
.colorpicker_hsb_h {
|
||||
background-image: url(../images/colorpicker_hsb_h.png);
|
||||
top: 52px;
|
||||
left: 282px;
|
||||
}
|
||||
.colorpicker_hsb_s {
|
||||
background-image: url(../images/colorpicker_hsb_s.png);
|
||||
top: 82px;
|
||||
left: 282px;
|
||||
}
|
||||
.colorpicker_hsb_b {
|
||||
background-image: url(../images/colorpicker_hsb_b.png);
|
||||
top: 112px;
|
||||
left: 282px;
|
||||
}
|
||||
.colorpicker_submit {
|
||||
position: absolute;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
background: url(../images/colorpicker_submit.png) top;
|
||||
left: 322px;
|
||||
top: 142px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.colorpicker_focus {
|
||||
background-position: center;
|
||||
}
|
||||
.colorpicker_hex.colorpicker_focus {
|
||||
background-position: bottom;
|
||||
}
|
||||
.colorpicker_submit.colorpicker_focus {
|
||||
background-position: bottom;
|
||||
}
|
||||
.colorpicker_slider {
|
||||
background-position: bottom;
|
||||
}
|
185
studio/button-editor/styles/colorpicker_1.css
vendored
@ -1,185 +0,0 @@
|
||||
.colorpicker {
|
||||
width: 356px;
|
||||
height: 176px;
|
||||
overflow: hidden;
|
||||
position: absolute;
|
||||
background: url(../images/colorpicker_background.png);
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
display: none;
|
||||
z-index:500;
|
||||
}
|
||||
|
||||
.color-chooser {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-top: 5px;
|
||||
background: url("../images/select.png") center;
|
||||
}
|
||||
|
||||
.color-chooser > div {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
background: url("../images/select.png") center;
|
||||
}
|
||||
|
||||
.colorpicker_color {
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
left: 14px;
|
||||
top: 13px;
|
||||
position: absolute;
|
||||
background: #f00;
|
||||
overflow: hidden;
|
||||
cursor: crosshair;
|
||||
}
|
||||
.colorpicker_color div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 150px;
|
||||
height: 150px;
|
||||
background: url(../images/colorpicker_overlay.png);
|
||||
}
|
||||
.colorpicker_color div div {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 11px;
|
||||
height: 11px;
|
||||
overflow: hidden;
|
||||
background: url(../images/colorpicker_select.gif);
|
||||
margin: -5px 0 0 -5px;
|
||||
}
|
||||
.colorpicker_hue {
|
||||
position: absolute;
|
||||
top: 13px;
|
||||
left: 171px;
|
||||
width: 35px;
|
||||
height: 150px;
|
||||
cursor: n-resize;
|
||||
}
|
||||
.colorpicker_hue div {
|
||||
position: absolute;
|
||||
width: 35px;
|
||||
height: 9px;
|
||||
overflow: hidden;
|
||||
background: url(../images/colorpicker_indic.gif) left top;
|
||||
margin: -4px 0 0 0;
|
||||
left: 0px;
|
||||
}
|
||||
.colorpicker_new_color {
|
||||
position: absolute;
|
||||
width: 60px;
|
||||
height: 30px;
|
||||
left: 213px;
|
||||
top: 13px;
|
||||
background: #f00;
|
||||
}
|
||||
.colorpicker_current_color {
|
||||
position: absolute;
|
||||
width: 60px;
|
||||
height: 30px;
|
||||
left: 283px;
|
||||
top: 13px;
|
||||
background: #f00;
|
||||
}
|
||||
.colorpicker input {
|
||||
background-color: transparent;
|
||||
border: 1px solid transparent;
|
||||
position: absolute;
|
||||
font-size: 10px;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
color: #898989;
|
||||
top: 4px;
|
||||
right: 11px;
|
||||
text-align: right;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
height: 11px;
|
||||
}
|
||||
.colorpicker_hex {
|
||||
position: absolute;
|
||||
width: 72px;
|
||||
height: 22px;
|
||||
background: url(../images/colorpicker_hex.png) top;
|
||||
left: 212px;
|
||||
top: 142px;
|
||||
}
|
||||
.colorpicker_hex input {
|
||||
right: 6px;
|
||||
}
|
||||
.colorpicker_field {
|
||||
height: 22px;
|
||||
width: 62px;
|
||||
background-position: top;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.colorpicker_field > input {
|
||||
width: 42px;
|
||||
}
|
||||
|
||||
.colorpicker_hex > input {
|
||||
width: 42px;
|
||||
}
|
||||
|
||||
.colorpicker_field span {
|
||||
position: absolute;
|
||||
width: 12px;
|
||||
height: 22px;
|
||||
overflow: hidden;
|
||||
top: 0;
|
||||
right: 0;
|
||||
cursor: n-resize;
|
||||
}
|
||||
.colorpicker_rgb_r {
|
||||
background-image: url(../images/colorpicker_rgb_r.png);
|
||||
top: 52px;
|
||||
left: 212px;
|
||||
}
|
||||
.colorpicker_rgb_g {
|
||||
background-image: url(../images/colorpicker_rgb_g.png);
|
||||
top: 82px;
|
||||
left: 212px;
|
||||
}
|
||||
.colorpicker_rgb_b {
|
||||
background-image: url(../images/colorpicker_rgb_b.png);
|
||||
top: 112px;
|
||||
left: 212px;
|
||||
}
|
||||
.colorpicker_hsb_h {
|
||||
background-image: url(../images/colorpicker_hsb_h.png);
|
||||
top: 52px;
|
||||
left: 282px;
|
||||
}
|
||||
.colorpicker_hsb_s {
|
||||
background-image: url(../images/colorpicker_hsb_s.png);
|
||||
top: 82px;
|
||||
left: 282px;
|
||||
}
|
||||
.colorpicker_hsb_b {
|
||||
background-image: url(../images/colorpicker_hsb_b.png);
|
||||
top: 112px;
|
||||
left: 282px;
|
||||
}
|
||||
.colorpicker_submit {
|
||||
position: absolute;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
background: url(../images/colorpicker_submit.png) top;
|
||||
left: 322px;
|
||||
top: 142px;
|
||||
overflow: hidden;
|
||||
}
|
||||
.colorpicker_focus {
|
||||
background-position: center;
|
||||
}
|
||||
.colorpicker_hex.colorpicker_focus {
|
||||
background-position: bottom;
|
||||
}
|
||||
.colorpicker_submit.colorpicker_focus {
|
||||
background-position: bottom;
|
||||
}
|
||||
.colorpicker_slider {
|
||||
background-position: bottom;
|
||||
}
|
Before Width: | Height: | Size: 6.0 KiB |
Before Width: | Height: | Size: 1.8 KiB |
Before Width: | Height: | Size: 35 KiB |
Before Width: | Height: | Size: 72 KiB |
Before Width: | Height: | Size: 601 KiB |
Before Width: | Height: | Size: 24 KiB |
Before Width: | Height: | Size: 260 B |
Before Width: | Height: | Size: 251 B |
Before Width: | Height: | Size: 178 B |
Before Width: | Height: | Size: 104 B |
Before Width: | Height: | Size: 125 B |
Before Width: | Height: | Size: 105 B |
Before Width: | Height: | Size: 2.1 KiB |
Before Width: | Height: | Size: 90 B |
Before Width: | Height: | Size: 129 B |
Before Width: | Height: | Size: 4.3 KiB |
Before Width: | Height: | Size: 4.3 KiB |
Before Width: | Height: | Size: 4.3 KiB |
Before Width: | Height: | Size: 4.3 KiB |
Before Width: | Height: | Size: 4.3 KiB |
563
studio/button-editor/styles/jquery-ui.css
vendored
@ -1,563 +0,0 @@
|
||||
/*!
|
||||
* jQuery UI CSS Framework 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*f
|
||||
* http://docs.jquery.com/UI/Theming/API
|
||||
*/
|
||||
|
||||
/* Layout helpers
|
||||
----------------------------------*/
|
||||
.ui-helper-hidden { display: none; }
|
||||
.ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); }
|
||||
.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
|
||||
.ui-helper-clearfix:before, .ui-helper-clearfix:after { content: ""; display: table; }
|
||||
.ui-helper-clearfix:after { clear: both; }
|
||||
.ui-helper-clearfix { zoom: 1; }
|
||||
.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }
|
||||
|
||||
|
||||
/* Interaction Cues
|
||||
----------------------------------*/
|
||||
.ui-state-disabled { cursor: default !important; }
|
||||
|
||||
|
||||
/* Icons
|
||||
----------------------------------*/
|
||||
|
||||
/* states and images */
|
||||
.ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }
|
||||
|
||||
|
||||
/* Misc visuals
|
||||
----------------------------------*/
|
||||
|
||||
/* Overlays */
|
||||
.ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
|
||||
|
||||
|
||||
/*!
|
||||
* jQuery UI CSS Framework 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Theming/API
|
||||
*
|
||||
* To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Trebuchet%20MS,%20Tahoma,%20Verdana,%20Arial,%20sans-serif&fwDefault=bold&fsDefault=1.1em&cornerRadius=4px&bgColorHeader=f6a828&bgTextureHeader=12_gloss_wave.png&bgImgOpacityHeader=35&borderColorHeader=e78f08&fcHeader=ffffff&iconColorHeader=ffffff&bgColorContent=eeeeee&bgTextureContent=03_highlight_soft.png&bgImgOpacityContent=100&borderColorContent=dddddd&fcContent=333333&iconColorContent=222222&bgColorDefault=f6f6f6&bgTextureDefault=02_glass.png&bgImgOpacityDefault=100&borderColorDefault=cccccc&fcDefault=1c94c4&iconColorDefault=ef8c08&bgColorHover=fdf5ce&bgTextureHover=02_glass.png&bgImgOpacityHover=100&borderColorHover=fbcb09&fcHover=c77405&iconColorHover=ef8c08&bgColorActive=ffffff&bgTextureActive=02_glass.png&bgImgOpacityActive=65&borderColorActive=fbd850&fcActive=eb8f00&iconColorActive=ef8c08&bgColorHighlight=ffe45c&bgTextureHighlight=03_highlight_soft.png&bgImgOpacityHighlight=75&borderColorHighlight=fed22f&fcHighlight=363636&iconColorHighlight=228ef1&bgColorError=b81900&bgTextureError=08_diagonals_thick.png&bgImgOpacityError=18&borderColorError=cd0a0a&fcError=ffffff&iconColorError=ffd27a&bgColorOverlay=666666&bgTextureOverlay=08_diagonals_thick.png&bgImgOpacityOverlay=20&opacityOverlay=50&bgColorShadow=000000&bgTextureShadow=01_flat.png&bgImgOpacityShadow=10&opacityShadow=20&thicknessShadow=5px&offsetTopShadow=-5px&offsetLeftShadow=-5px&cornerRadiusShadow=5px
|
||||
*/
|
||||
|
||||
|
||||
/* Component containers
|
||||
----------------------------------*/
|
||||
.ui-widget { font-family: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; font-size: 1.1em; }
|
||||
.ui-widget .ui-widget { font-size: 1em; }
|
||||
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Trebuchet MS, Tahoma, Verdana, Arial, sans-serif; font-size: 1em; }
|
||||
.ui-widget-content { border: 1px solid #dddddd;}
|
||||
.ui-widget-content a { color: #333333; }
|
||||
.ui-widget-header { border: 1px solid #e78f08; background: #f6a828 url(images/ui-bg_gloss-wave_35_f6a828_500x100.png) 50% 50% repeat-x; color: #ffffff; font-weight: bold; }
|
||||
.ui-widget-header a { color: #ffffff; }
|
||||
|
||||
/* Interaction states
|
||||
----------------------------------*/
|
||||
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #cccccc; background: #f6f6f6 url(images/ui-bg_glass_100_f6f6f6_1x400.png) 50% 50% repeat-x; font-weight: bold; color: #1c94c4; }
|
||||
.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #1c94c4; text-decoration: none; }
|
||||
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #fbcb09; background: #fdf5ce url(images/ui-bg_glass_100_fdf5ce_1x400.png) 50% 50% repeat-x; font-weight: bold; color: #c77405; }
|
||||
.ui-state-hover a, .ui-state-hover a:hover { color: #c77405; text-decoration: none; }
|
||||
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #fbd850; background: #ffffff url(images/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x; font-weight: bold; color: #eb8f00; }
|
||||
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #eb8f00; text-decoration: none; }
|
||||
.ui-widget :active { outline: none; }
|
||||
|
||||
/* Interaction Cues
|
||||
----------------------------------*/
|
||||
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {border: 1px solid #fed22f; background: #ffe45c url(images/ui-bg_highlight-soft_75_ffe45c_1x100.png) 50% top repeat-x; color: #363636; }
|
||||
.ui-state-highlight a, .ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a { color: #363636; }
|
||||
.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #cd0a0a; background: #b81900 url(images/ui-bg_diagonals-thick_18_b81900_40x40.png) 50% 50% repeat; color: #ffffff; }
|
||||
.ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #ffffff; }
|
||||
.ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #ffffff; }
|
||||
.ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; }
|
||||
.ui-priority-secondary, .ui-widget-content .ui-priority-secondary, .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; }
|
||||
.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; }
|
||||
|
||||
/* Icons
|
||||
----------------------------------*/
|
||||
|
||||
/* states and images */
|
||||
.ui-icon { width: 16px; height: 16px; background-image: url(images/ui-icons_222222_256x240.png); }
|
||||
.ui-widget-content .ui-icon {background-image: url(images/ui-icons_222222_256x240.png); }
|
||||
.ui-widget-header .ui-icon {background-image: url(images/ui-icons_ffffff_256x240.png); }
|
||||
.ui-state-default .ui-icon { background-image: url(images/ui-icons_ef8c08_256x240.png); }
|
||||
.ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(images/ui-icons_ef8c08_256x240.png); }
|
||||
.ui-state-active .ui-icon {background-image: url(images/ui-icons_ef8c08_256x240.png); }
|
||||
.ui-state-highlight .ui-icon {background-image: url(images/ui-icons_228ef1_256x240.png); }
|
||||
.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(images/ui-icons_ffd27a_256x240.png); }
|
||||
|
||||
/* positioning */
|
||||
.ui-icon-carat-1-n { background-position: 0 0; }
|
||||
.ui-icon-carat-1-ne { background-position: -16px 0; }
|
||||
.ui-icon-carat-1-e { background-position: -32px 0; }
|
||||
.ui-icon-carat-1-se { background-position: -48px 0; }
|
||||
.ui-icon-carat-1-s { background-position: -64px 0; }
|
||||
.ui-icon-carat-1-sw { background-position: -80px 0; }
|
||||
.ui-icon-carat-1-w { background-position: -96px 0; }
|
||||
.ui-icon-carat-1-nw { background-position: -112px 0; }
|
||||
.ui-icon-carat-2-n-s { background-position: -128px 0; }
|
||||
.ui-icon-carat-2-e-w { background-position: -144px 0; }
|
||||
.ui-icon-triangle-1-n { background-position: 0 -16px; }
|
||||
.ui-icon-triangle-1-ne { background-position: -16px -16px; }
|
||||
.ui-icon-triangle-1-e { background-position: -32px -16px; }
|
||||
.ui-icon-triangle-1-se { background-position: -48px -16px; }
|
||||
.ui-icon-triangle-1-s { background-position: -64px -16px; }
|
||||
.ui-icon-triangle-1-sw { background-position: -80px -16px; }
|
||||
.ui-icon-triangle-1-w { background-position: -96px -16px; }
|
||||
.ui-icon-triangle-1-nw { background-position: -112px -16px; }
|
||||
.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
|
||||
.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
|
||||
.ui-icon-arrow-1-n { background-position: 0 -32px; }
|
||||
.ui-icon-arrow-1-ne { background-position: -16px -32px; }
|
||||
.ui-icon-arrow-1-e { background-position: -32px -32px; }
|
||||
.ui-icon-arrow-1-se { background-position: -48px -32px; }
|
||||
.ui-icon-arrow-1-s { background-position: -64px -32px; }
|
||||
.ui-icon-arrow-1-sw { background-position: -80px -32px; }
|
||||
.ui-icon-arrow-1-w { background-position: -96px -32px; }
|
||||
.ui-icon-arrow-1-nw { background-position: -112px -32px; }
|
||||
.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
|
||||
.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
|
||||
.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
|
||||
.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
|
||||
.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
|
||||
.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
|
||||
.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
|
||||
.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
|
||||
.ui-icon-arrowthick-1-n { background-position: 0 -48px; }
|
||||
.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
|
||||
.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
|
||||
.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
|
||||
.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
|
||||
.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
|
||||
.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
|
||||
.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
|
||||
.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
|
||||
.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
|
||||
.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
|
||||
.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
|
||||
.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
|
||||
.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
|
||||
.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
|
||||
.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
|
||||
.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
|
||||
.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
|
||||
.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
|
||||
.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
|
||||
.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
|
||||
.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
|
||||
.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
|
||||
.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
|
||||
.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
|
||||
.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
|
||||
.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
|
||||
.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
|
||||
.ui-icon-arrow-4 { background-position: 0 -80px; }
|
||||
.ui-icon-arrow-4-diag { background-position: -16px -80px; }
|
||||
.ui-icon-extlink { background-position: -32px -80px; }
|
||||
.ui-icon-newwin { background-position: -48px -80px; }
|
||||
.ui-icon-refresh { background-position: -64px -80px; }
|
||||
.ui-icon-shuffle { background-position: -80px -80px; }
|
||||
.ui-icon-transfer-e-w { background-position: -96px -80px; }
|
||||
.ui-icon-transferthick-e-w { background-position: -112px -80px; }
|
||||
.ui-icon-folder-collapsed { background-position: 0 -96px; }
|
||||
.ui-icon-folder-open { background-position: -16px -96px; }
|
||||
.ui-icon-document { background-position: -32px -96px; }
|
||||
.ui-icon-document-b { background-position: -48px -96px; }
|
||||
.ui-icon-note { background-position: -64px -96px; }
|
||||
.ui-icon-mail-closed { background-position: -80px -96px; }
|
||||
.ui-icon-mail-open { background-position: -96px -96px; }
|
||||
.ui-icon-suitcase { background-position: -112px -96px; }
|
||||
.ui-icon-comment { background-position: -128px -96px; }
|
||||
.ui-icon-person { background-position: -144px -96px; }
|
||||
.ui-icon-print { background-position: -160px -96px; }
|
||||
.ui-icon-trash { background-position: -176px -96px; }
|
||||
.ui-icon-locked { background-position: -192px -96px; }
|
||||
.ui-icon-unlocked { background-position: -208px -96px; }
|
||||
.ui-icon-bookmark { background-position: -224px -96px; }
|
||||
.ui-icon-tag { background-position: -240px -96px; }
|
||||
.ui-icon-home { background-position: 0 -112px; }
|
||||
.ui-icon-flag { background-position: -16px -112px; }
|
||||
.ui-icon-calendar { background-position: -32px -112px; }
|
||||
.ui-icon-cart { background-position: -48px -112px; }
|
||||
.ui-icon-pencil { background-position: -64px -112px; }
|
||||
.ui-icon-clock { background-position: -80px -112px; }
|
||||
.ui-icon-disk { background-position: -96px -112px; }
|
||||
.ui-icon-calculator { background-position: -112px -112px; }
|
||||
.ui-icon-zoomin { background-position: -128px -112px; }
|
||||
.ui-icon-zoomout { background-position: -144px -112px; }
|
||||
.ui-icon-search { background-position: -160px -112px; }
|
||||
.ui-icon-wrench { background-position: -176px -112px; }
|
||||
.ui-icon-gear { background-position: -192px -112px; }
|
||||
.ui-icon-heart { background-position: -208px -112px; }
|
||||
.ui-icon-star { background-position: -224px -112px; }
|
||||
.ui-icon-link { background-position: -240px -112px; }
|
||||
.ui-icon-cancel { background-position: 0 -128px; }
|
||||
.ui-icon-plus { background-position: -16px -128px; }
|
||||
.ui-icon-plusthick { background-position: -32px -128px; }
|
||||
.ui-icon-minus { background-position: -48px -128px; }
|
||||
.ui-icon-minusthick { background-position: -64px -128px; }
|
||||
.ui-icon-close { background-position: -80px -128px; }
|
||||
.ui-icon-closethick { background-position: -96px -128px; }
|
||||
.ui-icon-key { background-position: -112px -128px; }
|
||||
.ui-icon-lightbulb { background-position: -128px -128px; }
|
||||
.ui-icon-scissors { background-position: -144px -128px; }
|
||||
.ui-icon-clipboard { background-position: -160px -128px; }
|
||||
.ui-icon-copy { background-position: -176px -128px; }
|
||||
.ui-icon-contact { background-position: -192px -128px; }
|
||||
.ui-icon-image { background-position: -208px -128px; }
|
||||
.ui-icon-video { background-position: -224px -128px; }
|
||||
.ui-icon-script { background-position: -240px -128px; }
|
||||
.ui-icon-alert { background-position: 0 -144px; }
|
||||
.ui-icon-info { background-position: -16px -144px; }
|
||||
.ui-icon-notice { background-position: -32px -144px; }
|
||||
.ui-icon-help { background-position: -48px -144px; }
|
||||
.ui-icon-check { background-position: -64px -144px; }
|
||||
.ui-icon-bullet { background-position: -80px -144px; }
|
||||
.ui-icon-radio-off { background-position: -96px -144px; }
|
||||
.ui-icon-radio-on { background-position: -112px -144px; }
|
||||
.ui-icon-pin-w { background-position: -128px -144px; }
|
||||
.ui-icon-pin-s { background-position: -144px -144px; }
|
||||
.ui-icon-play { background-position: 0 -160px; }
|
||||
.ui-icon-pause { background-position: -16px -160px; }
|
||||
.ui-icon-seek-next { background-position: -32px -160px; }
|
||||
.ui-icon-seek-prev { background-position: -48px -160px; }
|
||||
.ui-icon-seek-end { background-position: -64px -160px; }
|
||||
.ui-icon-seek-start { background-position: -80px -160px; }
|
||||
/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
|
||||
.ui-icon-seek-first { background-position: -80px -160px; }
|
||||
.ui-icon-stop { background-position: -96px -160px; }
|
||||
.ui-icon-eject { background-position: -112px -160px; }
|
||||
.ui-icon-volume-off { background-position: -128px -160px; }
|
||||
.ui-icon-volume-on { background-position: -144px -160px; }
|
||||
.ui-icon-power { background-position: 0 -176px; }
|
||||
.ui-icon-signal-diag { background-position: -16px -176px; }
|
||||
.ui-icon-signal { background-position: -32px -176px; }
|
||||
.ui-icon-battery-0 { background-position: -48px -176px; }
|
||||
.ui-icon-battery-1 { background-position: -64px -176px; }
|
||||
.ui-icon-battery-2 { background-position: -80px -176px; }
|
||||
.ui-icon-battery-3 { background-position: -96px -176px; }
|
||||
.ui-icon-circle-plus { background-position: 0 -192px; }
|
||||
.ui-icon-circle-minus { background-position: -16px -192px; }
|
||||
.ui-icon-circle-close { background-position: -32px -192px; }
|
||||
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
|
||||
.ui-icon-circle-triangle-s { background-position: -64px -192px; }
|
||||
.ui-icon-circle-triangle-w { background-position: -80px -192px; }
|
||||
.ui-icon-circle-triangle-n { background-position: -96px -192px; }
|
||||
.ui-icon-circle-arrow-e { background-position: -112px -192px; }
|
||||
.ui-icon-circle-arrow-s { background-position: -128px -192px; }
|
||||
.ui-icon-circle-arrow-w { background-position: -144px -192px; }
|
||||
.ui-icon-circle-arrow-n { background-position: -160px -192px; }
|
||||
.ui-icon-circle-zoomin { background-position: -176px -192px; }
|
||||
.ui-icon-circle-zoomout { background-position: -192px -192px; }
|
||||
.ui-icon-circle-check { background-position: -208px -192px; }
|
||||
.ui-icon-circlesmall-plus { background-position: 0 -208px; }
|
||||
.ui-icon-circlesmall-minus { background-position: -16px -208px; }
|
||||
.ui-icon-circlesmall-close { background-position: -32px -208px; }
|
||||
.ui-icon-squaresmall-plus { background-position: -48px -208px; }
|
||||
.ui-icon-squaresmall-minus { background-position: -64px -208px; }
|
||||
.ui-icon-squaresmall-close { background-position: -80px -208px; }
|
||||
.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
|
||||
.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
|
||||
.ui-icon-grip-solid-vertical { background-position: -32px -224px; }
|
||||
.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
|
||||
.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
|
||||
.ui-icon-grip-diagonal-se { background-position: -80px -224px; }
|
||||
|
||||
|
||||
/* Misc visuals
|
||||
----------------------------------*/
|
||||
|
||||
/* Corner radius */
|
||||
.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -khtml-border-top-left-radius: 4px; border-top-left-radius: 4px; }
|
||||
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; -khtml-border-top-right-radius: 4px; border-top-right-radius: 4px; }
|
||||
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; -khtml-border-bottom-left-radius: 4px; border-bottom-left-radius: 4px; }
|
||||
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br { -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; -khtml-border-bottom-right-radius: 4px; border-bottom-right-radius: 4px; }
|
||||
|
||||
/* Overlays */
|
||||
.ui-widget-overlay { background: #666666 url(images/ui-bg_diagonals-thick_20_666666_40x40.png) 50% 50% repeat; opacity: .50;filter:Alpha(Opacity=50); }
|
||||
.ui-widget-shadow { margin: -5px 0 0 -5px; padding: 5px; background: #000000 url(images/ui-bg_flat_10_000000_40x100.png) 50% 50% repeat-x; opacity: .20;filter:Alpha(Opacity=20); -moz-border-radius: 5px; -khtml-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; }/*!
|
||||
* jQuery UI Resizable 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Resizable#theming
|
||||
*/
|
||||
.ui-resizable { position: relative;}
|
||||
.ui-resizable-handle { position: absolute;font-size: 0.1px; display: block; }
|
||||
.ui-resizable-disabled .ui-resizable-handle, .ui-resizable-autohide .ui-resizable-handle { display: none; }
|
||||
.ui-resizable-n { cursor: n-resize; height: 7px; width: 100%; top: -5px; left: 0; }
|
||||
.ui-resizable-s { cursor: s-resize; height: 7px; width: 100%; bottom: -5px; left: 0; }
|
||||
.ui-resizable-e { cursor: e-resize; width: 7px; right: -5px; top: 0; height: 100%; }f
|
||||
.ui-resizable-w { cursor: w-resize; width: 7px; left: -5px; top: 0; height: 100%; }
|
||||
.ui-resizable-se { cursor: se-resize; width: 12px; height: 12px; right: 1px; bottom: 1px; }
|
||||
.ui-resizable-sw { cursor: sw-resize; width: 9px; height: 9px; left: -5px; bottom: -5px; }
|
||||
.ui-resizable-nw { cursor: nw-resize; width: 9px; height: 9px; left: -5px; top: -5px; }
|
||||
.ui-resizable-ne { cursor: ne-resize; width: 9px; height: 9px; right: -5px; top: -5px;}/*!
|
||||
* jQuery UI Selectable 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Selectable#theming
|
||||
*/
|
||||
.ui-selectable-helper { position: absolute; z-index: 100; border:1px dotted black; }
|
||||
/*!
|
||||
* jQuery UI Accordion 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Accordion#theming
|
||||
*/
|
||||
/* IE/Win - Fix animation bug - #4615 */
|
||||
.ui-accordion { width: 100%; }
|
||||
.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; }
|
||||
.ui-accordion .ui-accordion-li-fix { display: inline; }
|
||||
.ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; }
|
||||
.ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em .7em; }
|
||||
.ui-accordion-icons .ui-accordion-header a { padding-left: 2.2em; }
|
||||
.ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: .5em; top: 50%; margin-top: -8px; }
|
||||
.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; }
|
||||
.ui-accordion .ui-accordion-content-active { display: block; }
|
||||
/*!
|
||||
* jQuery UI Autocomplete 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Autocomplete#theming
|
||||
*/
|
||||
.ui-autocomplete { position: absolute; cursor: default; }
|
||||
|
||||
/* workarounds */
|
||||
* html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */
|
||||
|
||||
/*
|
||||
* jQuery UI Menu 1.8.23
|
||||
*
|
||||
* Copyright 2010, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Menu#theming
|
||||
*/
|
||||
.ui-menu {
|
||||
list-style:none;
|
||||
padding: 2px;
|
||||
margin: 0;
|
||||
display:block;
|
||||
float: left;
|
||||
}
|
||||
.ui-menu .ui-menu {
|
||||
margin-top: -3px;
|
||||
}
|
||||
.ui-menu .ui-menu-item {
|
||||
margin:0;
|
||||
padding: 0;
|
||||
zoom: 1;
|
||||
float: left;
|
||||
clear: left;
|
||||
width: 100%;
|
||||
}
|
||||
.ui-menu .ui-menu-item a {
|
||||
text-decoration:none;
|
||||
display:block;
|
||||
padding:.2em .4em;
|
||||
line-height:1.5;
|
||||
zoom:1;
|
||||
}
|
||||
.ui-menu .ui-menu-item a.ui-state-hover,
|
||||
.ui-menu .ui-menu-item a.ui-state-active {
|
||||
font-weight: normal;
|
||||
margin: -1px;
|
||||
}
|
||||
/*!
|
||||
* jQuery UI Button 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Button#theming
|
||||
*/
|
||||
.ui-button { display: inline-block; position: relative; padding: 0; margin-right: .1em; text-decoration: none !important; cursor: pointer; text-align: center; zoom: 1; overflow: visible; } /* the overflow property removes extra width in IE */
|
||||
.ui-button-icon-only { width: 2.2em; } /* to make room for the icon, a width needs to be set here */
|
||||
button.ui-button-icon-only { width: 2.4em; } /* button elements seem to need a little more width */
|
||||
.ui-button-icons-only { width: 3.4em; }
|
||||
button.ui-button-icons-only { width: 3.7em; }
|
||||
|
||||
/*button text element */
|
||||
.ui-button .ui-button-text { display: block; line-height: 1.4; }
|
||||
.ui-button-text-only .ui-button-text { padding: .4em 1em; }
|
||||
.ui-button-icon-only .ui-button-text, .ui-button-icons-only .ui-button-text { padding: .4em; text-indent: -9999999px; }
|
||||
.ui-button-text-icon-primary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 1em .4em 2.1em; }
|
||||
.ui-button-text-icon-secondary .ui-button-text, .ui-button-text-icons .ui-button-text { padding: .4em 2.1em .4em 1em; }
|
||||
.ui-button-text-icons .ui-button-text { padding-left: 2.1em; padding-right: 2.1em; }
|
||||
/* no icon support for input elements, provide padding by default */
|
||||
input.ui-button { padding: .4em 1em; }
|
||||
|
||||
/*button icon element(s) */
|
||||
.ui-button-icon-only .ui-icon, .ui-button-text-icon-primary .ui-icon, .ui-button-text-icon-secondary .ui-icon, .ui-button-text-icons .ui-icon, .ui-button-icons-only .ui-icon { position: absolute; top: 50%; margin-top: -8px; }
|
||||
.ui-button-icon-only .ui-icon { left: 50%; margin-left: -8px; }
|
||||
.ui-button-text-icon-primary .ui-button-icon-primary, .ui-button-text-icons .ui-button-icon-primary, .ui-button-icons-only .ui-button-icon-primary { left: .5em; }
|
||||
.ui-button-text-icon-secondary .ui-button-icon-secondary, .ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; }
|
||||
.ui-button-text-icons .ui-button-icon-secondary, .ui-button-icons-only .ui-button-icon-secondary { right: .5em; }
|
||||
|
||||
/*button sets*/
|
||||
.ui-buttonset { margin-right: 7px; }
|
||||
.ui-buttonset .ui-button { margin-left: 0; margin-right: -.3em; }
|
||||
|
||||
/* workarounds */
|
||||
button.ui-button::-moz-focus-inner { border: 0; padding: 0; } /* reset extra padding in Firefox */
|
||||
/*!
|
||||
* jQuery UI Dialog 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Dialog#theming
|
||||
*/
|
||||
.ui-dialog { position: absolute; padding: .2em; width: 300px; overflow: hidden; }
|
||||
.ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative; }
|
||||
.ui-dialog .ui-dialog-title { float: left; margin: .1em 16px .1em 0; }
|
||||
.ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; }
|
||||
.ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; }
|
||||
.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; }
|
||||
.ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1; }
|
||||
.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; }
|
||||
.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; }
|
||||
.ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; }
|
||||
.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; }
|
||||
.ui-draggable .ui-dialog-titlebar { cursor: move; }
|
||||
/*!
|
||||
* jQuery UI Slider 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Slider#theming
|
||||
*/
|
||||
.ui-slider { position: relative; text-align: left; }
|
||||
.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 1.2em; cursor: default; }
|
||||
.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; }
|
||||
|
||||
.ui-slider-horizontal { height: .8em; }
|
||||
.ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; }
|
||||
.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }
|
||||
.ui-slider-horizontal .ui-slider-range-min { left: 0; }
|
||||
.ui-slider-horizontal .ui-slider-range-max { right: 0; }
|
||||
|
||||
.ui-slider-vertical { width: .8em; height: 100px; }
|
||||
.ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; }
|
||||
.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; }
|
||||
.ui-slider-vertical .ui-slider-range-min { bottom: 0; }
|
||||
.ui-slider-vertical .ui-slider-range-max { top: 0; }/*!
|
||||
* jQuery UI Tabs 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Tabs#theming
|
||||
*/
|
||||
.ui-tabs { position: relative; padding: .2em; zoom: 1; } /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
|
||||
.ui-tabs .ui-tabs-nav { margin: 0; padding: .2em .2em 0; }
|
||||
.ui-tabs .ui-tabs-nav li { list-style: none; float: left; position: relative; top: 1px; margin: 0 .2em 1px 0; border-bottom: 0 !important; padding: 0; white-space: nowrap; }
|
||||
.ui-tabs .ui-tabs-nav li a { float: left; padding: .5em 1em; text-decoration: none; }
|
||||
.ui-tabs .ui-tabs-nav li.ui-tabs-selected { margin-bottom: 0; padding-bottom: 1px; }
|
||||
.ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a { cursor: text; }
|
||||
.ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
|
||||
.ui-tabs .ui-tabs-panel { display: block; border-width: 0; padding: 1em 1.4em; background: none; }
|
||||
.ui-tabs .ui-tabs-hide { display: none !important; }
|
||||
/*!
|
||||
* jQuery UI Datepicker 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Datepicker#theming
|
||||
*/
|
||||
.ui-datepicker { width: 17em; padding: .2em .2em 0; display: none; }
|
||||
.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; }
|
||||
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 2px; width: 1.8em; height: 1.8em; }
|
||||
.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { top: 1px; }
|
||||
.ui-datepicker .ui-datepicker-prev { left:2px; }
|
||||
.ui-datepicker .ui-datepicker-next { right:2px; }
|
||||
.ui-datepicker .ui-datepicker-prev-hover { left:1px; }
|
||||
.ui-datepicker .ui-datepicker-next-hover { right:1px; }
|
||||
.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span { display: block; position: absolute; left: 50%; margin-left: -8px; top: 50%; margin-top: -8px; }
|
||||
.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }
|
||||
.ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; }
|
||||
.ui-datepicker select.ui-datepicker-month-year {width: 100%;}
|
||||
.ui-datepicker select.ui-datepicker-month,
|
||||
.ui-datepicker select.ui-datepicker-year { width: 49%;}
|
||||
.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; }
|
||||
.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0; }
|
||||
.ui-datepicker td { border: 0; padding: 1px; }
|
||||
.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }
|
||||
.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }
|
||||
.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }
|
||||
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }
|
||||
|
||||
/* with multiple calendars */
|
||||
.ui-datepicker.ui-datepicker-multi { width:auto; }
|
||||
.ui-datepicker-multi .ui-datepicker-group { float:left; }
|
||||
.ui-datepicker-multi .ui-datepicker-group table { width:95%; margin:0 auto .4em; }
|
||||
.ui-datepicker-multi-2 .ui-datepicker-group { width:50%; }
|
||||
.ui-datepicker-multi-3 .ui-datepicker-group { width:33.3%; }
|
||||
.ui-datepicker-multi-4 .ui-datepicker-group { width:25%; }
|
||||
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header { border-left-width:0; }
|
||||
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header { border-left-width:0; }
|
||||
.ui-datepicker-multi .ui-datepicker-buttonpane { clear:left; }
|
||||
.ui-datepicker-row-break { clear:both; width:100%; font-size:0em; }
|
||||
|
||||
/* RTL support */
|
||||
.ui-datepicker-rtl { direction: rtl; }
|
||||
.ui-datepicker-rtl .ui-datepicker-prev { right: 2px; left: auto; }
|
||||
.ui-datepicker-rtl .ui-datepicker-next { left: 2px; right: auto; }
|
||||
.ui-datepicker-rtl .ui-datepicker-prev:hover { right: 1px; left: auto; }
|
||||
.ui-datepicker-rtl .ui-datepicker-next:hover { left: 1px; right: auto; }
|
||||
.ui-datepicker-rtl .ui-datepicker-buttonpane { clear:right; }
|
||||
.ui-datepicker-rtl .ui-datepicker-buttonpane button { float: left; }
|
||||
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current { float:right; }
|
||||
.ui-datepicker-rtl .ui-datepicker-group { float:right; }
|
||||
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
|
||||
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header { border-right-width:0; border-left-width:1px; }
|
||||
|
||||
/* IE6 IFRAME FIX (taken from datepicker 1.5.3 */
|
||||
.ui-datepicker-cover {
|
||||
position: absolute; /*must have*/
|
||||
z-index: -1; /*must have*/
|
||||
filter: mask(); /*must have*/
|
||||
top: -4px; /*must have*/
|
||||
left: -4px; /*must have*/
|
||||
width: 200px; /*must have*/
|
||||
height: 200px; /*must have*/
|
||||
}/*!
|
||||
* jQuery UI Progressbar 1.8.23
|
||||
*
|
||||
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
|
||||
* Dual licensed under the MIT or GPL Version 2 licenses.
|
||||
* http://jquery.org/license
|
||||
*
|
||||
* http://docs.jquery.com/UI/Progressbar#theming
|
||||
*/
|
||||
.ui-progressbar { height:2em; text-align: left; overflow: hidden; }
|
||||
.ui-progressbar .ui-progressbar-value {margin: -1px; height:100%; }
|
@ -1,56 +0,0 @@
|
||||
.gradientPicker-preview {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: 1px solid rgba(0,0,0,0.2);
|
||||
/*box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;*/
|
||||
}
|
||||
|
||||
.gradientPicker-ctrlPt {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
border: 2px solid gray;
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.gradientPicker-ctrlPts {
|
||||
position: relative;
|
||||
height: 10px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.gradientPicker-ptConfig {
|
||||
position: absolute;
|
||||
width: 35px;
|
||||
height: 40px;
|
||||
z-index: 1;
|
||||
margin-top: 2px;
|
||||
|
||||
background-color: white;
|
||||
border-radius: 5px;
|
||||
border: 1px solid rgba(0,0,0,0.2);
|
||||
padding: 0 3px;
|
||||
-webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
|
||||
-moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
|
||||
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
|
||||
}
|
||||
|
||||
.gradientPicker-close {
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
right: -4px;
|
||||
/*font-size: 18px;
|
||||
font-weight: bold;
|
||||
color: black;
|
||||
line-height: 20px;
|
||||
text-shadow: 0 1px 0 white;
|
||||
opacity: 0.2;
|
||||
filter: alpha(opacity=20);*/
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.gradientPicker-ptConfig .color-chooser {
|
||||
float: left;
|
||||
}
|
478
studio/button-editor/styles/main-style.css
vendored
@ -1,478 +0,0 @@
|
||||
|
||||
/*CSS RESET*/
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, font, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
outline: 0;
|
||||
font-weight: inherit;
|
||||
font-style: inherit;
|
||||
font-size: 100%;
|
||||
vertical-align: baseline;
|
||||
|
||||
}
|
||||
|
||||
/***********************/
|
||||
|
||||
body {
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
.wrap {
|
||||
position:relative;
|
||||
margin:0 auto;
|
||||
width:900px;
|
||||
color: white;
|
||||
opacity: 1;
|
||||
font-family: Arial,Verdana,sans-serif;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
#main-header{
|
||||
width:100%;
|
||||
float:left;
|
||||
padding:15px 0;
|
||||
padding-left:0px;
|
||||
padding-top:30px;
|
||||
/*background:rgba(7,164,249,0.84);*/
|
||||
background: rgba(21,15,15,0.83);
|
||||
padding-left: 20px;
|
||||
padding-bottom: 15px;
|
||||
box-shadow: 2px 6px 8px 6px black;
|
||||
/*border: 1px solid rgba(255, 255, 255, 0.1);*/
|
||||
margin-bottom: 30px;
|
||||
height:40px;
|
||||
margin-top:0px;
|
||||
border-bottom:thin solid #0c84ec;
|
||||
|
||||
}
|
||||
|
||||
#left{
|
||||
|
||||
float:left;
|
||||
margin-top:0px;
|
||||
margin-left:-75px;
|
||||
}
|
||||
|
||||
#info {
|
||||
right:0px;
|
||||
position: absolute;
|
||||
margin-top: -15px;
|
||||
|
||||
}
|
||||
|
||||
#info section {
|
||||
|
||||
float:left;
|
||||
}
|
||||
#cogs {
|
||||
|
||||
margin-left:50px;
|
||||
margin-top:-5px;
|
||||
}
|
||||
|
||||
#download {
|
||||
|
||||
margin-left:10px;
|
||||
margin-top:-5px;
|
||||
}
|
||||
|
||||
|
||||
#user {
|
||||
float: left;
|
||||
margin-right:10px;
|
||||
}
|
||||
#mybutton {
|
||||
|
||||
margin-top:-5px;
|
||||
float:left;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
body {
|
||||
|
||||
|
||||
background: url('../images/texture.jpg');
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
[draggable] {
|
||||
-moz-user-select: none;
|
||||
-khtml-user-select: none;
|
||||
-webkit-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
#toolbar {
|
||||
|
||||
|
||||
float:left;
|
||||
width: 140px;
|
||||
margin-left: 8px;
|
||||
margin-right:-10px;
|
||||
|
||||
}
|
||||
|
||||
#surface {
|
||||
|
||||
margin-left:5px;
|
||||
|
||||
border: 0px solid black;
|
||||
|
||||
width:863px;
|
||||
height: 710px;
|
||||
display: inline-block;
|
||||
|
||||
/*float: left;*/
|
||||
box-shadow: 13px 10px 12px black;
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
border: 1px solid rgba(255, 255, 255, 0.1); border-bottom: 0;
|
||||
-webkit-background-origin: border-box;
|
||||
-moz-background-origin: border;
|
||||
background-origin: border-box;
|
||||
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(255, 255, 255, .15)), to(rgba(0, 0, 0, .25))), -webkit-gradient(linear, left top, right bottom, color-stop(0, rgba(255, 255, 255, 0)), color-stop(0.5, rgba(255, 255, 255, .15)), color-stop(0.501, rgba(255, 255, 255, 0)), color-stop(1, rgba(255, 255, 255, 0)));
|
||||
background: -moz-linear-gradient(top, rgba(255, 255, 255, .15), rgba(0, 0, 0, .25)), -moz-linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
|
||||
background: linear-gradient(top, rgba(255, 255, 255, .15), rgba(0, 0, 0, .25)), linear-gradient(left top, rgba(255, 255, 255, 0), rgba(255, 255, 255, .15) 50%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0));
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
#trash {
|
||||
|
||||
|
||||
top:525px;
|
||||
margin-left:10px;
|
||||
position: absolute;
|
||||
|
||||
}
|
||||
|
||||
#trash img {
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
|
||||
#tool-bar {
|
||||
|
||||
padding:10px;
|
||||
margin-left: 10px;
|
||||
|
||||
}
|
||||
#toolbar-icon img{
|
||||
|
||||
width:100px;
|
||||
height: 100px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
#vertical-list {
|
||||
display: none;
|
||||
|
||||
}
|
||||
|
||||
.button-set {
|
||||
|
||||
padding-top:5px;
|
||||
padding-bottom: 5px;
|
||||
clear: both;
|
||||
height: 58px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.button, .button:before, .button:after {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
border-radius: 35px;
|
||||
}
|
||||
|
||||
.button {
|
||||
font-family: 'pictos';
|
||||
font-size: 16px;
|
||||
line-height: 20px;
|
||||
padding-right:5px;
|
||||
color: rgba(0,0,0,0.5);
|
||||
text-shadow: rgba(0,0,0,0.1) 0px -2px 1px, rgb(255,255,255) 0px 1px 2px;
|
||||
|
||||
width: 43px;
|
||||
height: 43px;
|
||||
padding: 10px;
|
||||
text-indent: -2px;
|
||||
margin: 10px auto;
|
||||
|
||||
position: static;
|
||||
z-index: 50;
|
||||
cursor: pointer;
|
||||
margin-top: 10px;
|
||||
|
||||
background-color: transparent;
|
||||
border: rgba(0,0,0,0.3) 1px solid;
|
||||
border-top-color: rgba(0,0,0,0.1);
|
||||
border-left-color: rgba(0,0,0,0.2);
|
||||
border-right-color: rgba(0,0,0,0.2);
|
||||
border-bottom-color: rgba(0,0,0,0.3);
|
||||
box-shadow: inset rgba(255,255,255,0.3) -5px -30px 10px,
|
||||
inset rgba(255,255,255,0.3) 0px 30px 10px,
|
||||
inset rgba(255,255,255,1) 0px 2px 1px,
|
||||
rgba(0,0,0,0.4) 0px 10px 15px;
|
||||
-webkit-transition: -webkit-box-shadow 0s ease-in-out;
|
||||
-khtml-transition: -khtml-box-shadow 0s ease-in-out;
|
||||
-moz-transition: -moz-box-shadow 0s ease-in-out;
|
||||
-o-transition: -o-box-shadow 0s ease-in-out;
|
||||
transition: box-shadow 0s ease-in-out;
|
||||
|
||||
background-image: -webkit-radial-gradient( 50% 0%, 8% 50%, hsla(0,0%,100%,.2) 0%, hsla(0,0%,100%,0) 100%),
|
||||
-webkit-radial-gradient( 50% 100%, 12% 50%, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 100%),
|
||||
-webkit-radial-gradient( 0% 50%, 50% 7%, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 100%),
|
||||
-webkit-radial-gradient( 100% 50%, 50% 5%, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 100%),
|
||||
|
||||
-webkit-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%, 0%,0) 0%, hsla(0,0%, 0%,0) 3%, hsla(0,0%, 0%,.1) 3.5%),
|
||||
-webkit-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 6%, hsla(0,0%,100%,.1) 7.5%),
|
||||
-webkit-repeating-radial-gradient( 50% 50%, 100% 100%, hsla(0,0%,100%,0) 0%, hsla(0,0%,100%,0) 1.2%, hsla(0,0%,100%,0) 2.2%);
|
||||
|
||||
|
||||
margin-left:5px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.button:before, .button:after {
|
||||
content: "";
|
||||
display: block;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.button:before {
|
||||
z-index: -50;
|
||||
width: 43px;
|
||||
height: 47px;
|
||||
|
||||
margin-top: -15px;
|
||||
margin-left: -11px;
|
||||
|
||||
background: #666666;
|
||||
background: -moz-linear-gradient(left, #666666 0%, #bbbbbb 50%, #666666 100%);
|
||||
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#666666), color-stop(50%,#bbbbbb), color-stop(100%,#666666));
|
||||
background: -webkit-linear-gradient(left, #666666 0%,#bbbbbb 50%,#666666 100%);
|
||||
background: -o-linear-gradient(left, #666666 0%,#bbbbbb 50%,#666666 100%);
|
||||
background: -ms-linear-gradient(left, #666666 0%,#bbbbbb 50%,#666666 100%);
|
||||
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#666666',GradientType=1 );
|
||||
background: linear-gradient(left, #666666 0%,#bbbbbb 50%,#666666 100%);
|
||||
|
||||
box-shadow: #000 0px 0px 2px;
|
||||
}
|
||||
.button:after {
|
||||
z-index: -100;
|
||||
width: 53px;
|
||||
height: 53px;
|
||||
margin-top: -34px;
|
||||
margin-left: -16px;
|
||||
background: rgba(0,0,0,0.1);
|
||||
|
||||
box-shadow: inset rgba(255,255,255,0.1) 0px -5px 5px,
|
||||
rgba(0,0,0,0.1) 0px 3px 3px,
|
||||
rgba(255,255,255,0.05) 0px -3px 3px;
|
||||
}
|
||||
.button:hover {
|
||||
color: rgba(183,15,15,0.97);
|
||||
text-shadow: #c16262 0px 0px 4px;
|
||||
box-shadow: inset rgba(255,255,255,0.4) 0px -30px 15px,
|
||||
inset rgba(255,255,255,0.2) -25px 25px 10px,
|
||||
inset rgba(255,255,255,1) 0px 2px 1px,
|
||||
rgba(0,0,0,0.4) 0px 10px 15px;
|
||||
|
||||
}
|
||||
.button:active {
|
||||
margin-top: 6px;
|
||||
color: #fff;
|
||||
box-shadow: inset rgba(255,255,255,0.4) 0px -30px 15px,
|
||||
inset rgba(255,255,255,0.2) -25px 25px 10px,
|
||||
inset rgba(255,255,255,1) 0px 2px 1px,
|
||||
rgba(0,0,0,0.4) 0px 2px 3px;
|
||||
}
|
||||
.button:active:before {
|
||||
height: 43px;
|
||||
margin-top: -13px;
|
||||
}
|
||||
.button:active:after {
|
||||
margin-top: -39px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#mybutton {
|
||||
|
||||
|
||||
display: inline-block;
|
||||
padding: 5px 10px 6px;
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
font-weight: bold;
|
||||
line-height: 1;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
|
||||
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
|
||||
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
|
||||
text-shadow: 0 -1px 1px rgba(0,0,0,0.25);
|
||||
|
||||
background-color: #ff5c00;
|
||||
border-color: black;
|
||||
|
||||
|
||||
}
|
||||
|
||||
#page-footer {
|
||||
|
||||
display: block;
|
||||
clear:both;
|
||||
margin-top: 100px;
|
||||
border-top:2px solid rgba(167,167,167,0.71);
|
||||
color: rgba(194,191,191,0.78);
|
||||
font-family: Helvetica;
|
||||
padding:20px;
|
||||
width:70%;
|
||||
margin-left:auto;
|
||||
margin-right: auto;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
#page-footer section {
|
||||
text-align: center;
|
||||
text-shadow: 5px 4px 10px black;
|
||||
|
||||
}
|
||||
#page-footer ul {
|
||||
margin-left:30%;
|
||||
}
|
||||
#page-footer li {
|
||||
margin-right: 8px;
|
||||
margin-left:auto;
|
||||
display: inline;
|
||||
}
|
||||
|
||||
|
||||
|
||||
#dim {
|
||||
|
||||
position:absolute;
|
||||
top:0;
|
||||
left:0;
|
||||
width:100%;
|
||||
height: 100%;
|
||||
z-index:9999;
|
||||
background:url('../images/pattern.gif');
|
||||
}
|
||||
|
||||
.circle {
|
||||
background-color: rgba(0,0,0,0);
|
||||
border:5px solid rgba(0,183,229,0.9);
|
||||
opacity:.9;
|
||||
border-right:5px solid rgba(0,0,0,0);
|
||||
border-left:5px solid rgba(0,0,0,0);
|
||||
border-radius:50px;
|
||||
box-shadow: 0 0 35px #2187e7;
|
||||
width:50px;
|
||||
height:50px;
|
||||
margin:0 auto;
|
||||
|
||||
-moz-animation:spinPulse 1s infinite ease-in-out;
|
||||
-webkit-animation:spinPulse 1s infinite linear;
|
||||
z-index:10000;
|
||||
}
|
||||
.circle1 {
|
||||
background-color: rgba(0,0,0,0);
|
||||
border:5px solid rgba(0,183,229,0.9);
|
||||
opacity:.9;
|
||||
border-left:5px solid rgba(0,0,0,0);
|
||||
border-right:5px solid rgba(0,0,0,0);
|
||||
border-radius:50px;
|
||||
box-shadow: 0 0 15px #2187e7;
|
||||
width:30px;
|
||||
height:30px;
|
||||
margin:0 auto;
|
||||
position:relative;
|
||||
top:-50px;
|
||||
|
||||
-moz-animation:spinoffPulse 1s infinite linear;
|
||||
-webkit-animation:spinoffPulse 1s infinite linear;
|
||||
z-index:10000;
|
||||
}
|
||||
@-moz-keyframes spinPulse {
|
||||
0% { -moz-transform:rotate(160deg); opacity:0; box-shadow:0 0 1px #2187e7;}
|
||||
50% { -moz-transform:rotate(145deg); opacity:1; }
|
||||
100% { -moz-transform:rotate(-320deg); opacity:0; }
|
||||
}
|
||||
@-moz-keyframes spinoffPulse {
|
||||
0% { -moz-transform:rotate(0deg); }
|
||||
100% { -moz-transform:rotate(360deg); }
|
||||
}
|
||||
@-webkit-keyframes spinPulse {
|
||||
0% { -webkit-transform:rotate(160deg); opacity:0; box-shadow:0 0 1px #2187e7; }
|
||||
50% { -webkit-transform:rotate(145deg); opacity:1;}
|
||||
100% { -webkit-transform:rotate(-320deg); opacity:0; }
|
||||
}
|
||||
@-webkit-keyframes spinoffPulse {
|
||||
0% { -webkit-transform:rotate(0deg); }
|
||||
100% { -webkit-transform:rotate(360deg); }
|
||||
}
|
||||
|
||||
|
||||
#v-align {
|
||||
|
||||
|
||||
top:50%;
|
||||
left:50%;
|
||||
position:absolute;
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
54
studio/button-editor/themes/blackboard.css
vendored
@ -1,54 +0,0 @@
|
||||
pre {
|
||||
background: #0B1022;
|
||||
word-wrap: break-word;
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
padding: 10px;
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
pre, code {
|
||||
font-family: 'Monaco', courier, monospace;
|
||||
}
|
||||
|
||||
pre .comment {
|
||||
color: #727272;
|
||||
}
|
||||
|
||||
pre .constant {
|
||||
color: #D8FA3C;
|
||||
}
|
||||
|
||||
pre .storage {
|
||||
color: #FBDE2D;
|
||||
}
|
||||
|
||||
pre .string, pre .comment.docstring {
|
||||
color: #61CE3C;
|
||||
}
|
||||
|
||||
pre .string.regexp, pre .support.tag.script, pre .support.tag.style {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
pre .keyword, pre .selector {
|
||||
color: #FBDE2D;
|
||||
}
|
||||
|
||||
pre .inherited-class {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
pre .entity {
|
||||
color: #FF6400;
|
||||
}
|
||||
|
||||
pre .support, *[data-language="c"] .function.call {
|
||||
color: #8DA6CE;
|
||||
}
|
||||
|
||||
pre .variable.global, pre .variable.class, pre .variable.instance {
|
||||
color: #FF6400;
|
||||
}
|
8
studio/css/bootstrap.min-dark.css
vendored
8
studio/css/bootstrap.min.css
vendored
8331
studio/css/style-dashboard-dark.css
vendored
8330
studio/css/style-dashboard.css
vendored
18
studio/external-dependencies/ace.js
vendored
1704
studio/external-dependencies/bootstrap-icons.css
vendored
7
studio/external-dependencies/ckeditor.js
vendored
7946
studio/external-dependencies/fontawesome.css
vendored
5932
studio/external-dependencies/fontawesome.js
vendored
9
studio/external-dependencies/mode-ruby.js
vendored
116
studio/external-dependencies/theme-tomorrow_night.js
vendored
@ -1,116 +0,0 @@
|
||||
define("ace/theme/tomorrow_night",["require","exports","module","ace/lib/dom"], function(require, exports, module) {
|
||||
|
||||
exports.isDark = true;
|
||||
exports.cssClass = "ace-tomorrow-night";
|
||||
exports.cssText = ".ace-tomorrow-night .ace_gutter {\
|
||||
background: #25282c;\
|
||||
color: #C5C8C6\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_print-margin {\
|
||||
width: 1px;\
|
||||
background: #25282c\
|
||||
}\
|
||||
.ace-tomorrow-night {\
|
||||
background-color: #1D1F21;\
|
||||
color: #C5C8C6\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_cursor {\
|
||||
color: #AEAFAD\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_marker-layer .ace_selection {\
|
||||
background: #373B41\
|
||||
}\
|
||||
.ace-tomorrow-night.ace_multiselect .ace_selection.ace_start {\
|
||||
box-shadow: 0 0 3px 0px #1D1F21;\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_marker-layer .ace_step {\
|
||||
background: rgb(102, 82, 0)\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_marker-layer .ace_bracket {\
|
||||
margin: -1px 0 0 -1px;\
|
||||
border: 1px solid #4B4E55\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_marker-layer .ace_active-line {\
|
||||
background: #282A2E\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_gutter-active-line {\
|
||||
background-color: #282A2E\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_marker-layer .ace_selected-word {\
|
||||
border: 1px solid #373B41\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_invisible {\
|
||||
color: #4B4E55\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_keyword,\
|
||||
.ace-tomorrow-night .ace_meta,\
|
||||
.ace-tomorrow-night .ace_storage,\
|
||||
.ace-tomorrow-night .ace_storage.ace_type,\
|
||||
.ace-tomorrow-night .ace_support.ace_type {\
|
||||
color: #B294BB\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_keyword.ace_operator {\
|
||||
color: #8ABEB7\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_constant.ace_character,\
|
||||
.ace-tomorrow-night .ace_constant.ace_language,\
|
||||
.ace-tomorrow-night .ace_constant.ace_numeric,\
|
||||
.ace-tomorrow-night .ace_keyword.ace_other.ace_unit,\
|
||||
.ace-tomorrow-night .ace_support.ace_constant,\
|
||||
.ace-tomorrow-night .ace_variable.ace_parameter {\
|
||||
color: #DE935F\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_constant.ace_other {\
|
||||
color: #CED1CF\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_invalid {\
|
||||
color: #CED2CF;\
|
||||
background-color: #DF5F5F\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_invalid.ace_deprecated {\
|
||||
color: #CED2CF;\
|
||||
background-color: #B798BF\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_fold {\
|
||||
background-color: #81A2BE;\
|
||||
border-color: #C5C8C6\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_entity.ace_name.ace_function,\
|
||||
.ace-tomorrow-night .ace_support.ace_function,\
|
||||
.ace-tomorrow-night .ace_variable {\
|
||||
color: #81A2BE\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_support.ace_class,\
|
||||
.ace-tomorrow-night .ace_support.ace_type {\
|
||||
color: #F0C674\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_heading,\
|
||||
.ace-tomorrow-night .ace_markup.ace_heading,\
|
||||
.ace-tomorrow-night .ace_string {\
|
||||
color: #B5BD68\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_entity.ace_name.ace_tag,\
|
||||
.ace-tomorrow-night .ace_entity.ace_other.ace_attribute-name,\
|
||||
.ace-tomorrow-night .ace_meta.ace_tag,\
|
||||
.ace-tomorrow-night .ace_string.ace_regexp,\
|
||||
.ace-tomorrow-night .ace_variable {\
|
||||
color: #CC6666\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_comment {\
|
||||
color: #969896\
|
||||
}\
|
||||
.ace-tomorrow-night .ace_indent-guide {\
|
||||
background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAEklEQVQImWNgYGBgYHB3d/8PAAOIAdULw8qMAAAAAElFTkSuQmCC) right repeat-y\
|
||||
}";
|
||||
|
||||
var dom = require("../lib/dom");
|
||||
dom.importCssString(exports.cssText, exports.cssClass);
|
||||
});
|
||||
(function() {
|
||||
window.require(["ace/theme/tomorrow_night"], function(m) {
|
||||
if (typeof module == "object" && typeof exports == "object" && module) {
|
||||
module.exports = m;
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
9
studio/external-dependencies/theme-xcode.js
vendored
@ -1,9 +0,0 @@
|
||||
define("ace/theme/xcode",["require","exports","module","ace/lib/dom"],function(e,t,n){t.isDark=!1,t.cssClass="ace-xcode",t.cssText=".ace-xcode .ace_gutter {background: #e8e8e8;color: #333}.ace-xcode .ace_print-margin {width: 1px;background: #e8e8e8}.ace-xcode {background-color: #FFFFFF;color: #000000}.ace-xcode .ace_cursor {color: #000000}.ace-xcode .ace_marker-layer .ace_selection {background: #B5D5FF}.ace-xcode.ace_multiselect .ace_selection.ace_start {box-shadow: 0 0 3px 0px #FFFFFF;}.ace-xcode .ace_marker-layer .ace_step {background: rgb(198, 219, 174)}.ace-xcode .ace_marker-layer .ace_bracket {margin: -1px 0 0 -1px;border: 1px solid #BFBFBF}.ace-xcode .ace_marker-layer .ace_active-line {background: rgba(0, 0, 0, 0.071)}.ace-xcode .ace_gutter-active-line {background-color: rgba(0, 0, 0, 0.071)}.ace-xcode .ace_marker-layer .ace_selected-word {border: 1px solid #B5D5FF}.ace-xcode .ace_constant.ace_language,.ace-xcode .ace_keyword,.ace-xcode .ace_meta,.ace-xcode .ace_variable.ace_language {color: #C800A4}.ace-xcode .ace_invisible {color: #BFBFBF}.ace-xcode .ace_constant.ace_character,.ace-xcode .ace_constant.ace_other {color: #275A5E}.ace-xcode .ace_constant.ace_numeric {color: #3A00DC}.ace-xcode .ace_entity.ace_other.ace_attribute-name,.ace-xcode .ace_support.ace_constant,.ace-xcode .ace_support.ace_function {color: #450084}.ace-xcode .ace_fold {background-color: #C800A4;border-color: #000000}.ace-xcode .ace_entity.ace_name.ace_tag,.ace-xcode .ace_support.ace_class,.ace-xcode .ace_support.ace_type {color: #790EAD}.ace-xcode .ace_storage {color: #C900A4}.ace-xcode .ace_string {color: #DF0002}.ace-xcode .ace_comment {color: #008E00}.ace-xcode .ace_indent-guide {background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAE0lEQVQImWP4////f4bLly//BwAmVgd1/w11/gAAAABJRU5ErkJggg==) right repeat-y}";var r=e("../lib/dom");r.importCssString(t.cssText,t.cssClass)});
|
||||
(function() {
|
||||
window.require(["ace/theme/xcode"], function(m) {
|
||||
if (typeof module == "object" && typeof exports == "object" && module) {
|
||||
module.exports = m;
|
||||
}
|
||||
});
|
||||
})();
|
||||
|
10947
studio/external-dependencies/vue.js
vendored
2
studio/favicon/icons/.gitignore
vendored
@ -1,2 +0,0 @@
|
||||
*
|
||||
!.gitignore
|