Click here to Skip to main content
15,881,812 members
Articles / Web Development / ASP.NET

MDI style web app using VisualJS.NET and Google Maps API

Rate me:
Please Sign up or sign in to vote.
4.50/5 (2 votes)
5 Oct 2012CPOL2 min read 18.9K   7  
RAD sample of MDI style web app using VisualJS.NET with Google Maps.

This article appears in the Third Party Products and Tools section. Articles in this section are for the members only and must not be used to promote or advertise products in any way, shape or form. Please report any spam or advertising.

/*
* VisualJS.NET Default Theme
*/
.VSJSForm
{
    background-repeat:repeat-x;display:block;
    font-family: helvetica, arial, sans-serif; font-size: 9pt; 
}    
.VSJSFormIn
{
    border-top : #a0a0a0 solid 1px;
    margin-top: -1px;
    background:#f0f0f0; 
    top:22px;
    left:4px;
} 
.VSJSFormActive
{ 
    background:url([$$VisualJSResourceTarget$$]?name=form_active&type=image) repeat-x scroll -1px -1px #c3d7ed;
    border-color: #c3d7ed;
    -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;
    box-shadow: 0 0 3px #aaa;
    -moz-box-shadow:   0 0 3px #aaa;
    -webkit-box-shadow: 0 0 3px #aaa; 
} 
.VSJSFormPassive
{ 
    background:url([$$VisualJSResourceTarget$$]?name=form_passive&type=image) repeat-x scroll -1px -1px #d3d3d3;
    border-color: #999;
    color:#777;
    opacity: 0.90; filter: alpha(opacity=90);
    -webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px; 
}  
.FormHidden
{
    background-image:none;
    margin-top:-10px;
}  
.FormTitleText
{
    position:absolute;left:25px;top:4px;
    font:normal bold 8pt helvetica, arial, sans-serif;  
    cursor:default;
    color:Black;
}  
.VSJS_FeedBox
{ 
	font-family:Segoe UI,Tahoma,Arial,Verdana,sans-serif;
	font-size:12pt; 
	color:#fff;  
	background-color:#9c3211; 
	-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;
	box-shadow: 0 0 2px #aaa;
     -moz-box-shadow:   0 0 2px #aaa;
  -webkit-box-shadow: 0 0 2px #aaa; 
}
.VSJS_FeedBoxHover
{
    background-color:#ac3211; 
}
.VSJS_FeedBoxTop{  
	font-size:120%; 
	z-index:1;
}
.VSJS_FeedBoxSub{
	background-color:#902e10;  
	z-index:3;
}	
.VSJS_FeedBoxSubHover
{
    background-color:#802e10; 
    z-index:3;
}
.VSJS_FeedBoxText{  
	font-size:70%; 
	display:block; 
	z-index:4;
}
.VSJS_FeedBoxImage
{
    z-index:2;
} 
.VSJS_FeedBoxImageHover
{
    filter:Alpha(opacity=10);
    opacity:0.1;
} 
.VSJS_Auto
{
	font-family: helvetica, arial, sans-serif; font-size: 9pt; 
	border: solid 1px #dedede;
	background-color:#fff;
	color:#333;
} 
.VSJS_AutoItem{
	display:block;width:100%;height:16px;
	border-bottom:dotted 1px #dedede;
	cursor:pointer;
	padding-bottom:2px;
	padding-left:2px;
} 
.VSJS_AutoItemHover{
	background-color:#ffff77;
}

.VSJS_AutoSel{
	background-color:#ffff77;
}

/*FORM TITLE BUTTONS BEGIN*/
.FormButtons
{
    background-image:url([$$VisualJSResourceTarget$$]?name=VSJS_Default_FormButton&type=image);
} 
.FormButtonNormalMin
{ 
    top:0px;
    right:69px;
    background-position: 264px  0px;
} 
.FormButtonNormalMax
{ 
    top:0px;
    right:36px;
    background-position: 231px  0px;
} 
.FormButtonNormalClose
{ 
    top:0px;
    right:3px;
    background-position: 198px  0px;
} 
.FormButtonHoverMin
{ 
    top:0px;
    right:69px;
    background-position: 165px  0px;
} 
.FormButtonHoverMax
{ 
    top:0px;
    right:36px;
    background-position: 132px  0px;
} 
.FormButtonHoverClose
{ 
    top:0px;
    right:3px;
    background-position: 99px  0px;
} 
.FormButtonActiveMin
{
    top:0px; 
    right:69px;
    background-position: 66px  0px;
} 
.FormButtonActiveMax
{ 
    top:0px;
    right:36px;    
    background-position: 33px  0px;
} 
/*FORM TITLE BUTTONS END*/ 
.ValidationError
{
    background: url([$$VisualJSResourceTarget$$]?name=VSJSMBERR&type=image);
}  
.VSJS_TextBox
{
    overflow:auto;
    font-family: helvetica, arial, sans-serif; font-size: 9pt;  
    border:1px solid #aaa;
    -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;
    box-shadow: 0 0 2px #aaa;
     -moz-box-shadow:   0 0 2px #aaa;
  -webkit-box-shadow: 0 0 2px #aaa;  
}  
.VSJS_MaskedTextBox
{ 
    overflow:auto;
    font-family: helvetica, arial, sans-serif; font-size: 9pt; 
    border:1px solid #aaa;
    -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;
    box-shadow: 0 0 2px #aaa;
     -moz-box-shadow:   0 0 2px #aaa;
  -webkit-box-shadow: 0 0 2px #aaa;  
}  
.VSJS_ComboBox
{
    border:1px solid #aaa;
    -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;
    box-shadow: 0 0 2px #aaa;
     -moz-box-shadow:   0 0 2px #aaa;
  -webkit-box-shadow: 0 0 2px #aaa;  
} 
.VSJS_ListBox
{
    border:1px solid #aaa;
    -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;
    box-shadow: 0 0 2px #aaa;
     -moz-box-shadow:   0 0 2px #aaa;
  -webkit-box-shadow: 0 0 2px #aaa;  
} 
.VSJS_ListView
{
    border:solid 1px #ddd;
    -webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px; 
}
.VSJS_ListViewTb
{   
    table-layout:fixed;
    margin:0px;
    border:none;
    padding:0px;
    font-family: helvetica, arial, sans-serif; font-size: 9pt; 
}
.VSJS_ListViewBg
{
background: -moz-linear-gradient(top, #ededed 0%, #cccccc 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(100%,#cccccc)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #ededed 0%,#cccccc 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #ededed 0%,#cccccc 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #ededed 0%,#cccccc 100%); /* IE10+ */
background: linear-gradient(top, #ededed 0%,#cccccc 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
}
.VSJS_ListViewItems
{ 
     font-family: helvetica, arial, sans-serif; font-size: 9pt;   
    cursor:pointer; 
    border:none; 
    margin:0px;
    padding:0;
    width:100%;
    #width:auto;
}
.VSJS_ListViewColumnTitleItem
{
    border-right:solid 1px #aaa;
}
.VSJS_ListViewColumnTitleItem span
{
    left:2px; 
}
.VSJS_ListViewColumnDataItem
{ 
    height:25px;
} 
.VSJS_ListViewColumnDataItem span
{
    left:0px;
    top:3px; 
    height:21px;
}
.VSJS_ListViewItemLastColumn
{
    width:auto;
}
.VSJS_ListViewHeader
{ 
    border-bottom:solid 1px #aaa; 
    font-weight:bold;
    height:30px;
}  
.VSJS_ListView_SortAZ
{
    background:url([$$VisualJSResourceTarget$$]?name=16_brdown&type=image) no-repeat -2px 0px;
    opacity: 0.60; filter: alpha(opacity=60);
}
.VSJS_ListView_SortZA
{
    background:url([$$VisualJSResourceTarget$$]?name=16_brup&type=image) no-repeat -2px 0px;
    opacity: 0.60; filter: alpha(opacity=60);
}
.VSJS_ListViewBusy
{
    background-image:url(Icons/Loading.gif);
}
/*ListView END*/
.VSJS_Resizer
{
    background-color:#ddd;
}
/*MessageBox BEGIN*/
.MessageBoxLabel
{}
.BackgroundBlur
{
    background-color:#333;
    opacity: 0.4;
    filter: alpha(opacity = 40);
    MozOpacity:0.4;
    KhtmlOpacity:0.4;
}
/*MessageBox END*/
/*Menu BEGIN*/
.MenuItem
{ 
    font-family: helvetica, arial, sans-serif; font-size: 9pt; 
    border: solid 1px #afafaf;
    cursor:pointer;
    color:#000000;
    background: #dedede; /* Old browsers */
}
.MenuItemDisabled
{
    background: #e6e6e6;
    font-family: helvetica, arial, sans-serif; font-size: 9pt; 
    border: solid 1px #bebebe;
    cursor:default;
    color:#bbbbbb;
}
.MenuItemText
{
    margin-left:4px;
    margin-top:2px;
}
.MenuItem:hover
{
     background:#ccc; 
     color:#222222; 
} 
.VSJS_Button
{
    font-family: helvetica, arial, sans-serif; font-size: 9pt;
    cursor:pointer;
}  
.VSJS_JButton
{
    font-family: helvetica, arial, sans-serif; font-size: 9pt;
    cursor:pointer;
    -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;
	box-shadow: 0 0 2px #aaa;
     -moz-box-shadow:   0 0 2px #aaa;
  -webkit-box-shadow: 0 0 2px #aaa; 
}        
.VSJS_TabPage
{
}
.VSJS_TabControl
{
    background-color:#eee;
     font-family: helvetica, arial, sans-serif; font-size: 9pt;
     -moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;
	border-radius: 2px; 
}
.VSJS_TabLeftArrow
{
    cursor:pointer;
    background:#eee url(Icons/16_roundarrowleft.png) 2px 2px no-repeat;
    border:none;
}
.VSJS_TabRightArrow
{
    cursor:pointer;
    background:#eee url(Icons/16_roundarrowright.png) 2px 2px no-repeat;
    border:none;
}
.VSJS_TabClose
{
    cursor:pointer;
    background:url(Icons/16_rounddelete.png) no-repeat;            
    border:none;
}
.VSJS_TabActiveTitle  
{
    font-family: helvetica, arial, sans-serif; font-size: 9pt;
    background: #ddd; font-weight: normal; color: #666; 
    opacity: 0.70; filter: alpha(opacity=70);
    cursor:default; 
    -moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;
	border-radius: 2px; 
}
.VSJS_TabPassiveTitle
{
    font-family: helvetica, arial, sans-serif; font-size: 9pt;
    color:#555;
    border:solid 1px #ccc;
    font-weight:bold;
    cursor:pointer; 
    -moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;
	border-radius: 2px; 
    background: -moz-linear-gradient(top, #ededed 0%, #cccccc 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(100%,#cccccc)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #ededed 0%,#cccccc 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #ededed 0%,#cccccc 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #ededed 0%,#cccccc 100%); /* IE10+ */
    background: linear-gradient(top, #ededed 0%,#cccccc 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#cccccc',GradientType=0 ); /* IE6-9 */
} 
.VSJS_CheckBox
{
    position:relative;
    left:0px;
    top:0px; 
}
.VSJS_CheckBoxLabel
{
    font-family: helvetica, arial, sans-serif; font-size: 9pt;
}
.VSJS_Radio
{ 
    
}
.VSJS_RadioLabel
{ 
    font-family: helvetica, arial, sans-serif; font-size: 9pt;
}
.VSJS_Label
{ 
    font-family: helvetica, arial, sans-serif; font-size: 9pt;
}
.VSJS_LinkLabel
{ 
    font-family: helvetica, arial, sans-serif; font-size: 9pt;
}
.VSJS_CaptchaBox
{
}  
.VSJS_CaptchaRoller
{
    background:#fff url(Icons/24_refresh.png) no-repeat; 
    opacity:0.80;
    filter:Alpha(opacity=80);
    right:1px;
    bottom:1px;
    width:24px;height:24px;
}   
.VSJS_CaptchaRoller_Busy
{
    background:URL(Icons/24_loadingthrobber.png) no-repeat;
    right:1px;
    bottom:1px;
    width:24px;height:24px;
}
.VSJS_Panel
{ 
    -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px; 
}
.VSJS_Panel_Background
{ 
    background-color:transparent;
    -webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;
} 
.VSJS_InputBase
{ 
   font-family: helvetica, arial, sans-serif; font-size: 9pt;
   color:#362B36;
}    
.VSJS_InputHelper
{
    background-color:#336699;
    border:1px dashed white;
} 
.VSJS_TagDefault
{ 
    color:#fff;
    font:normal normal 9pt helvetica, arial, sans-serif;
    background-color: #1c89c1; border:1px solid #1c89dd;
    -moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;
	border-radius: 2px;  
	box-shadow: 0 0 2px #bbb;
     -moz-box-shadow:   0 0 2px #bbb;
  -webkit-box-shadow: 0 0 2px #bbb; 
} 
.VSJS_ProgressBar
{
    -moz-border-radius: 2px;
	-webkit-border-radius: 2px;
	-khtml-border-radius: 2px;
	border-radius: 2px;  
	box-shadow: 0 0 2px #aaa;
     -moz-box-shadow:   0 0 2px #aaa;
  -webkit-box-shadow: 0 0 2px #aaa; 
}

By viewing downloads associated with this article you agree to the Terms of Service and the article's licence.

If a file you wish to view isn't highlighted, and is a text file (not binary), please let us know and we'll add colourisation support for it.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)


Written By
Software Developer
Poland Poland
This member has not yet provided a Biography. Assume it's interesting and varied, and probably something to do with programming.

Comments and Discussions