mirror of
https://github.com/Azure/cosmos-explorer.git
synced 2025-05-09 09:53:26 +01:00
Emulator Quickstart Tutorials (#2121)
* updated all outdated sample apps Co-authored-by: nishthaAhujaa <nishtha17354@iiittd.ac.in>
This commit is contained in:
Nishtha Ahuja
GitHub
parent
9f3236c29c
commit
8bcad6e0e0
@ -130,19 +130,19 @@ menuQuickStart {
|
||||
.content {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
transition: all .4s ease-in-out;
|
||||
-ms-transition: all .4s ease-in-out;
|
||||
-webkit-transition: all .4s ease-in-out;
|
||||
-moz-transition: all .4s ease-in-out;
|
||||
transition: all 0.4s ease-in-out;
|
||||
-ms-transition: all 0.4s ease-in-out;
|
||||
-webkit-transition: all 0.4s ease-in-out;
|
||||
-moz-transition: all 0.4s ease-in-out;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.mini {
|
||||
width: 0%;
|
||||
float: left;
|
||||
transition: all .4s ease-in-out;
|
||||
-webkit-transition: all .4s ease-in-out;
|
||||
-moz-transition: all .4s ease-in-out;
|
||||
transition: all 0.4s ease-in-out;
|
||||
-webkit-transition: all 0.4s ease-in-out;
|
||||
-moz-transition: all 0.4s ease-in-out;
|
||||
height: 100vh;
|
||||
background-color: white;
|
||||
}
|
||||
@ -235,29 +235,29 @@ menuQuickStart {
|
||||
}
|
||||
|
||||
.gridRowSelected {
|
||||
background-color: #DEF;
|
||||
background-color: #def;
|
||||
}
|
||||
|
||||
.gridRowSelected:hover {
|
||||
background-color: #DEF!important;
|
||||
background-color: #def !important;
|
||||
cursor: initial;
|
||||
}
|
||||
|
||||
.collectionNodeSelected {
|
||||
background-color: #DEF;
|
||||
background-color: #def;
|
||||
}
|
||||
|
||||
.collectionNodeSelected:hover {
|
||||
background-color: #DEF!important;
|
||||
background-color: #def !important;
|
||||
cursor: default !important;
|
||||
}
|
||||
|
||||
.databaseNodeSelected {
|
||||
background-color: #DEF;
|
||||
background-color: #def;
|
||||
}
|
||||
|
||||
.databaseNodeSelected:hover {
|
||||
background-color: #DEF!important;
|
||||
background-color: #def !important;
|
||||
cursor: default !important;
|
||||
}
|
||||
|
||||
@ -266,7 +266,7 @@ menuQuickStart {
|
||||
border-top: 1px solid #eee;
|
||||
margin-left: -17px;
|
||||
width: 100%;
|
||||
color: 1px solid #53575B;
|
||||
color: 1px solid #53575b;
|
||||
}
|
||||
|
||||
.partitioning-btn {
|
||||
@ -328,7 +328,7 @@ menuQuickStart {
|
||||
|
||||
.collid-white {
|
||||
width: 100%;
|
||||
border: solid 1px #DDD;
|
||||
border: solid 1px #ddd;
|
||||
}
|
||||
|
||||
.plusimg-but {
|
||||
@ -515,11 +515,11 @@ label {
|
||||
|
||||
.datalist-arrow:focus:after,
|
||||
.datalist-arrow:active:after {
|
||||
background: #1EBBEE;
|
||||
background: #1ebbee;
|
||||
}
|
||||
|
||||
input::-webkit-calendar-picker-indicator::after {
|
||||
content: '\276F';
|
||||
content: "\276F";
|
||||
right: 0;
|
||||
top: -8%;
|
||||
display: block;
|
||||
@ -533,7 +533,7 @@ input::-webkit-calendar-picker-indicator::after {
|
||||
}
|
||||
|
||||
.datalist-arrow:after:hover {
|
||||
content: '\276F';
|
||||
content: "\276F";
|
||||
position: absolute;
|
||||
right: 1px;
|
||||
top: 6%;
|
||||
@ -545,7 +545,7 @@ input::-webkit-calendar-picker-indicator::after {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
pointer-events: none;
|
||||
background-color: #1EBBEE;
|
||||
background-color: #1ebbee;
|
||||
}
|
||||
|
||||
.Introline3 {
|
||||
@ -567,7 +567,7 @@ input::-webkit-calendar-picker-indicator::after {
|
||||
}
|
||||
|
||||
.collectionCollapsed:hover {
|
||||
background: #EEEEEE;
|
||||
background: #eeeeee;
|
||||
}
|
||||
|
||||
.collectionCollapsed:active {
|
||||
@ -590,12 +590,12 @@ input::-webkit-calendar-picker-indicator::after {
|
||||
|
||||
.leftarrowCollapsed {
|
||||
padding: 2px 4px 4px 5px;
|
||||
border: solid 1px #FFF;
|
||||
border: solid 1px #fff;
|
||||
margin: 6px 4px 0px -11px;
|
||||
}
|
||||
|
||||
.leftarrowCollapsed:hover {
|
||||
background-color: #EEEEEE;
|
||||
background-color: #eeeeee;
|
||||
}
|
||||
|
||||
.leftarrowCollapsed:active {
|
||||
@ -655,11 +655,7 @@ input::-webkit-calendar-picker-indicator::after {
|
||||
color: #0058ad;
|
||||
}
|
||||
|
||||
.netApp {
|
||||
padding-bottom: 80px;
|
||||
}
|
||||
|
||||
.pythonApp {
|
||||
.sampleApp {
|
||||
padding-bottom: 45px;
|
||||
}
|
||||
|
||||
@ -691,7 +687,7 @@ input::-webkit-calendar-picker-indicator::after {
|
||||
.atags {
|
||||
color: @AccentMediumHigh;
|
||||
font-weight: 400;
|
||||
cursor: pointer
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.qsmenuicons {
|
||||
@ -754,13 +750,13 @@ a:link {
|
||||
}
|
||||
|
||||
.command:hover {
|
||||
background-color: #E6E6E6;
|
||||
background-color: #e6e6e6;
|
||||
cursor: pointer;
|
||||
padding-bottom: 12px;
|
||||
}
|
||||
|
||||
.command:active {
|
||||
background-color: #CCCCCC;
|
||||
background-color: #cccccc;
|
||||
border: solid 1px @AccentMediumHigh;
|
||||
}
|
||||
|
||||
@ -966,7 +962,7 @@ a:link {
|
||||
color: #393939;
|
||||
}
|
||||
|
||||
.tab [type=radio] {
|
||||
.tab [type="radio"] {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -979,40 +975,40 @@ a:link {
|
||||
padding: 15px 0px 20px 0;
|
||||
}
|
||||
|
||||
.tab [type=radio]:checked~label {
|
||||
.tab [type="radio"]:checked ~ label {
|
||||
border: 1px solid #0072c6;
|
||||
background-color: @AccentMediumHigh;
|
||||
color: white;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.tab [type=radio]:checked~label:hover {
|
||||
.tab [type="radio"]:checked ~ label:hover {
|
||||
border: 1px solid @AccentMediumHigh;
|
||||
background-color: @AccentMediumHigh;
|
||||
color: white;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.tab [type=radio]:checked~label:active {
|
||||
.tab [type="radio"]:checked ~ label:active {
|
||||
border: 1px solid #0072c6;
|
||||
background-color: #0072c6;
|
||||
color: white;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.tab [type=radio]:checked~label~.tabcontent {
|
||||
.tab [type="radio"]:checked ~ label ~ .tabcontent {
|
||||
z-index: 1;
|
||||
display: initial;
|
||||
}
|
||||
|
||||
.tab [type=radio]:not(:checked)~label:hover {
|
||||
.tab [type="radio"]:not(:checked) ~ label:hover {
|
||||
border: 1px solid #969696;
|
||||
background-color: #969696;
|
||||
color: white;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.tab [type=radio]:not(:checked)~label~.tabcontent {
|
||||
.tab [type="radio"]:not(:checked) ~ label ~ .tabcontent {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@ -1193,7 +1189,7 @@ a:link {
|
||||
.nav-tabs > li.active > a,
|
||||
.nav-tabs > li.active > a:focus,
|
||||
.nav-tabs > li.active > a:hover {
|
||||
border-bottom-color: #FFF;
|
||||
border-bottom-color: #fff;
|
||||
}
|
||||
|
||||
.tabList {
|
||||
@ -1262,7 +1258,7 @@ a:link {
|
||||
|
||||
.clickableLink {
|
||||
color: @AccentMediumHigh;
|
||||
font-family: 'Segoe UI';
|
||||
font-family: "Segoe UI";
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@ -64,41 +64,40 @@
|
||||
</li>
|
||||
<li>
|
||||
<a data-toggle="tab" href="#springboot">
|
||||
<img class="qsmenuicons" src="../images/springboot.svg" alt="Spring Boot" /> Springboot
|
||||
<img class="qsmenuicons" src="../images/springboot.svg" alt="Spring Boot" /> Spring Boot
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
<div class="tab-content tab-content-override">
|
||||
|
||||
<div class="tab-content">
|
||||
<div id="net" class="tab-pane fade in active">
|
||||
<div class="netApp">
|
||||
<div class="sampleApp">
|
||||
<div class="numbersize numbersizePadding">1</div>
|
||||
<div class="numberheading">
|
||||
Open and run a sample .NET app
|
||||
Create a new .NET app
|
||||
<p>
|
||||
We created a sample .NET app connected to your Azure Cosmos DB Emulator instance. Download, extract,
|
||||
build and run the app.
|
||||
Follow this
|
||||
<a href="https://learn.microsoft.com/azure/cosmos-db/nosql/quickstart-dotnet" target="_blank"
|
||||
>tutorial
|
||||
</a>
|
||||
to create a new .NET app connected to Azure Cosmos DB.
|
||||
</p>
|
||||
<a href="quickstart/DocumentDB-Quickstart-DotNet.zip"
|
||||
><button class="btncreatecoll">Download</button></a
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="learn-more"></div>
|
||||
</div>
|
||||
|
||||
<div id="java" class="tab-pane fade">
|
||||
<div class="step1">
|
||||
<div class="sampleApp">
|
||||
<div class="numbersize numbersizePadding">1</div>
|
||||
<div class="numberheading">
|
||||
Open and run a sample Java app
|
||||
Create a new Java app
|
||||
<p>
|
||||
We created a sample Java app connected to your Azure Cosmos DB Emulator instance. Download, extract,
|
||||
build and run the app.
|
||||
</p>
|
||||
<a href="quickstart/DocumentDB-Quickstart-Java.zip"><button class="btncreatecoll">Download</button></a>
|
||||
<p>
|
||||
Follow instructions in the readme.md to setup prerequisites needed to run Java web apps, if you
|
||||
haven’t already.
|
||||
Follow this
|
||||
<a href="https://learn.microsoft.com/azure/cosmos-db/nosql/quickstart-java" target="_blank"
|
||||
>tutorial
|
||||
</a>
|
||||
to create a new Java app connected to Azure Cosmos DB.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -106,20 +105,18 @@
|
||||
</div>
|
||||
|
||||
<div id="nodejs" class="tab-pane fade">
|
||||
<div class="step1">
|
||||
<div class="sampleApp">
|
||||
<div class="numbersize numbersizePadding">1</div>
|
||||
<div class="numberheading">
|
||||
Open and run a sample Node.js app
|
||||
Create a new Node.js app
|
||||
<p>
|
||||
We created a sample Node.js app connected to your Azure Cosmos DB Emulator instance. Download,
|
||||
extract, build and run the app.
|
||||
</p>
|
||||
<a href="quickstart/DocumentDB-Quickstart-NodeJs.zip"
|
||||
><button class="btncreatecoll">Download</button></a
|
||||
>
|
||||
<p>
|
||||
Run <strong>npm install</strong> and <strong>npm start</strong>, and navigate to
|
||||
<a href="http://localhost:3000" _targe="blank">http://localhost:3000</a>.
|
||||
Follow this
|
||||
<a
|
||||
href="https://learn.microsoft.com/azure/cosmos-db/nosql/quickstart-nodejs?pivots=programming-language-ts"
|
||||
target="_blank"
|
||||
>tutorial
|
||||
</a>
|
||||
to create a new Node.js app connected to Azure Cosmos DB.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
@ -127,7 +124,7 @@
|
||||
</div>
|
||||
|
||||
<div id="python" class="tab-pane fade">
|
||||
<div class="pythonApp">
|
||||
<div class="sampleApp">
|
||||
<div class="numbersize numbersizePadding">1</div>
|
||||
<div class="numberheading">
|
||||
Create a new Python app
|
||||
@ -141,9 +138,8 @@
|
||||
<div class="learn-more"></div>
|
||||
</div>
|
||||
|
||||
<!-- Go -->
|
||||
<div id="go" class="tab-pane fade">
|
||||
<div class="pythonApp">
|
||||
<div class="sampleApp">
|
||||
<div class="numbersize numbersizePadding">1</div>
|
||||
<div class="numberheading">
|
||||
Create a new Go app
|
||||
@ -158,7 +154,7 @@
|
||||
</div>
|
||||
|
||||
<div id="springboot" class="tab-pane fade">
|
||||
<div class="pythonApp">
|
||||
<div class="sampleApp">
|
||||
<div class="numbersize numbersizePadding">1</div>
|
||||
<div class="numberheading">
|
||||
Create a new Spring Boot app
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user