Commit 6ca076ad848c12935cd4450563652ca7ef443428

Authored by Swarn Singh
1 parent 6ae8d3cdd3
Exists in master and in 1 other branch paytm

responsive design issue fixed

Showing 3 changed files with 124 additions and 76 deletions   Show diff stats
... ... @@ -14,12 +14,11 @@
14 14 line-height: 70px;
15 15 }
16 16 .card{
17   - margin: 40px 82px 27px 14px;
18 17 flex-direction: column;
19 18 background-color: rgb(255,255,255);
20 19 border-radius: 0;
21 20 width: 676px;
22   - box-shadow: 0px 1px 3px 1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 2px 1px -1px rgba(0, 0, 0, 0.12);
  21 + box-shadow: 0px 1px 3px 1px rgba(0, 0, 0, 0.2), 0px 1px 1px 0px rgba(0, 0, 0, 0.14), 0px 2px 1px -1px rgba(0, 0, 0, 0.12);
23 22 }
24 23 .card input{
25 24 display: none;
... ... @@ -358,7 +357,7 @@ stroke-dashoffset:0
358 357 .stages-card {
359 358 width: auto;
360 359 float: left;
361   - margin: -30px 8px 7px 22px;
  360 + /*margin: -30px 8px 7px 22px;*/
362 361 }
363 362  
364 363 /*form -css*/
... ... @@ -442,13 +441,11 @@ stroke-dashoffset:0
442 441  
443 442 /*To make the Stages in the center*/
444 443 .card-align {
445   - margin: 56px -267px 11px -37px;
  444 + /*margin: 56px -267px 11px -37px;*/
446 445 }
447 446  
448 447 /*To make the sectors in the center */
449   -.sector-align {
450   - margin: -2px -88px 62px 10px;
451   -}
  448 +
452 449  
453 450 /*************sidebar content margin***********/
454 451 .sidebar-align {
... ... @@ -490,10 +487,7 @@ stroke-dashoffset:0
490 487 background-color: #ffffff;
491 488 }
492 489  
493   -.q-card-align {
494   - margin: 57px -12px 19px 13px;
495   - height: 304px;
496   -}
  490 +
497 491  
498 492 .question-card {
499 493 width: auto;
... ... @@ -789,8 +783,8 @@ stroke-dashoffset:0
789 783 }*/
790 784  
791 785 /*quiz*/
792   -.group {
793   - margin: -2px -28px 15px 1px;
  786 +.q-card-align div{
  787 + margin-bottom: 15px;
794 788 }
795 789  
796 790 .drop-down {
... ... @@ -815,7 +809,7 @@ stroke-dashoffset:0
815 809 margin:192px 11px 8px;
816 810 }
817 811 .last-content-card{
818   - margin: 0px -85px -4px -51px;
  812 + /*margin: 0px -85px -4px -51px;*/
819 813 }
820 814  
821 815 @media (max-width: 600px) {
... ... @@ -966,4 +960,45 @@ input.hidden {
966 960  
967 961 .container1{
968 962 width: 100%
  963 + }
  964 +
  965 + .no-margin{
  966 + margin: 0 0 0 !important;
  967 + }
  968 + .no-padding{
  969 + padding: 0 0 0 0 !important;
  970 + }
  971 + .select-stage{
  972 + margin: 10px 0;
  973 + }
  974 + .cards-content{
  975 + margin-top: 40px;
  976 + }
  977 + .cards-content p{
  978 + font-size: 13px;
  979 + }
  980 +.q-card-align{
  981 + margin-top: 15px;
  982 +}
  983 +.width-auto{
  984 + width: auto !important;
  985 +}
  986 +.margin-right-label{
  987 + margin-right: 20px;
  988 +}
  989 +.margin-right-label label{
  990 + margin-left: 5px;
  991 +}
  992 + @media (max-width: 768px){
  993 + .cards-content{
  994 + margin-top: 15px;
  995 + margin-bottom: 30px;
  996 + }
  997 + .no-padding-mobile{
  998 + padding-left: 0 !important;
  999 + padding-right: 0 !important;
  1000 + }
  1001 + .sector-align .card-small{
  1002 + height: 74px;
  1003 + }
969 1004 }
970 1005 \ No newline at end of file
... ...
... ... @@ -4,12 +4,16 @@
4 4 <html ng-app="scotchApp">
5 5  
6 6 <head>
  7 + <meta charset="utf-8">
  8 + <meta http-equiv="X-UA-Compatible" content="IE=edge">
  9 + <meta name="viewport" content="width=device-width, initial-scale=1">
7 10 <title>Startup</title>
8 11 <!-- SCROLLS -->
9 12 <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css"/>
10 13 <link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.0/css/font-awesome.css"/>
11 14  
12 15 <!-- SPELLS -->
  16 + <script type="text/javascript" src="js/jquery-3.2.1.js"></script>
13 17 <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular.min.js"></script>
14 18 <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.25/angular-route.js"></script>
15 19 <link rel="stylesheet" type="text/css" href="css/bootstrap.css">
... ... @@ -22,7 +26,7 @@
22 26 <script src="js/angular-svg-round-progressbar.js"></script>
23 27 <script src="js/angular.js"></script>
24 28 <script src="js/bootstrap.js"></script>
25   - <script type="text/javascript" src="js/jquery-3.2.1.js"></script>
  29 +
26 30 </head>
27 31  
28 32 <!-- define angular controller -->
... ...
... ... @@ -8,13 +8,14 @@
8 8 <img src="images/white.png" class="logo">
9 9 </div> <!-- CLOSE HEADER -->
10 10 <form name="applicantForm" id="signupForm">
11   - <p style="margin:1% 18% -1%">Please select one stage.</p>
12   - <div class="col-xs-12 col-md-8 col-md-offset-2">
  11 + <div class="col-xs-12 col-md-10 col-md-offset-1">
  12 +
  13 + <p class="select-stage">Please select one stage.</p>
13 14 <div class="stage-shadow">
14 15 <div class="stages card-align">
15   - <div class="col-xs-12 col-md-4" style="margin: -2px -51px 2px 1px;">
  16 + <div class="col-xs-12 col-md-4 no-padding">
16 17 <div class="card stages-card">
17   - <input type="radio" ng-model="data.stage" class="stageRadio" value="Idea" name="Idea" id="ideation" ng-required="Idea" ng-checked="true" ng-click="stage(data.stage); stagekeyPress()">
  18 + <input type="radio" ng-model="data.stage" class="stageRadio" value="Idea" name="Idea" id="ideation" ng-required="Idea" ng-checked="true" checked="true" ng-click="stage(data.stage); stagekeyPress()">
18 19 <label style="cursor:pointer" class="thumbnail radius-border stage-thumbnail" for="ideation">
19 20 <img class="stage-img stage-idea" src="images/idea-stage.png" alt="Lights">
20 21 <div class="card-content f-family">
... ... @@ -22,15 +23,18 @@
22 23 </div>
23 24 </label>
24 25 </div>
25   - <p class="content-idea">
26   - &#x26AC; Have an idea and need execution help?<br>
27   - &#x26AC; Get feedback from mentors<br>
28   - &#x26AC; Validate your idea.
29   - </p>
  26 + <div class="clearfix"></div>
  27 + <div class="cards-content">
  28 + <p>
  29 + &#x26AC; Have an idea and need execution help?<br>
  30 + &#x26AC; Get feedback from mentors<br>
  31 + &#x26AC; Validate your idea.
  32 + </p>
  33 + </div>
30 34 </div>
31   - <div class="col-xs-12 col-md-4">
  35 + <div class="col-xs-12 col-md-4 no-padding-mobile">
32 36 <div class="card stages-card">
33   - <input type="radio" ng-model="data.stage" class="stageRadio" value="Product" name="Product" id="Proof" ng-required="Product" ng-click="stage(data.stage); stagekeyPress()">
  37 + <input type="radio" ng-model="data.stage" class="stageRadio" value="Product" name="Idea" id="Proof" ng-required="Product" ng-click="stage(data.stage); stagekeyPress()">
34 38 <label style="cursor:pointer" class="thumbnail radius-border stage-thumbnail" for="Proof">
35 39 <img class="stage-img stage-product" src="images/production-stage.png" alt="Lights">
36 40 <div class="card-content f-family">
... ... @@ -38,15 +42,18 @@
38 42 </div>
39 43 </label>
40 44 </div>
41   - <p class="content-product">
42   - &#x26AC; Have a prototype and want to take it to next level?<br>
43   - &#x26AC; Advice on fundraising<br>
44   - &#x26AC; Advice on go-to-market strategy
45   - </p>
  45 + <div class="clearfix"></div>
  46 + <div class="cards-content">
  47 + <p>
  48 + &#x26AC; Have a prototype and want to take it to next level?<br>
  49 + &#x26AC; Advice on fundraising<br>
  50 + &#x26AC; Advice on go-to-market strategy
  51 + </p>
  52 + </div>
46 53 </div>
47   - <div class="col-xs-12 col-md-4 last-content-card">
  54 + <div class="col-xs-12 col-md-4 no-padding">
48 55 <div class="card stages-card">
49   - <input type="radio" ng-model="data.stage" class="stageRadio" value="Growth" name="Growth" id="Beta" ng-required="Growth" ng-click="stage(data.stage); stagekeyPress()">
  56 + <input type="radio" ng-model="data.stage" class="stageRadio" value="Growth" name="Idea" id="Beta" ng-required="Growth" ng-click="stage(data.stage); stagekeyPress()">
50 57 <label style="cursor:pointer" class="thumbnail radius-border stage-thumbnail" for="Beta">
51 58 <img class="stage-img stage-growth" src="images/growth-stage.png" alt="Lights">
52 59 <div class="card-content f-family">
... ... @@ -54,11 +61,14 @@
54 61 </div>
55 62 </label>
56 63 </div>
57   - <p class="content-growth">
58   - &#x26AC; Have traction and looking to scale up?<br>
59   - &#x26AC; Connect with Series A investors<br>
60   - &#x26AC; Connect and hire top startups
61   - </p>
  64 + <div class="clearfix"></div>
  65 + <div class="cards-content">
  66 + <p>
  67 + &#x26AC; Have traction and looking to scale up?<br>
  68 + &#x26AC; Connect with Series A investors<br>
  69 + &#x26AC; Connect and hire top startups
  70 + </p>
  71 + </div>
62 72 </div>
63 73 <div class="clearfix"></div>
64 74 </div>
... ... @@ -89,7 +99,6 @@
89 99 <!-- <label class="error-message f-family control-label" id="alreadyExist" ng-if="check">Email already exist.</label> -->
90 100 </div>
91 101 <div class="col-xs-12 col-md-6 input-wrapper">
92   - <div class="clearfix" style="margin:12px 0px 0px 0px"></div>
93 102 <div class="icon-circle-e">
94 103 <i class="material-icons" style="line-height: 30px;">phone</i>
95 104 </div>
... ... @@ -98,7 +107,6 @@
98 107 <label ng-if="numberCheck">Contact Number already exist.</label>
99 108 </div>
100 109 <div class="col-xs-12 col-md-6 input-wrapper f-family">
101   - <div class="clearfix" style="margin:12px 0px 0px 0px"></div>
102 110 <div class="icon-circle-f">
103 111 <i class="material-icons" style="line-height: 30px;">location_city</i>
104 112 </div>
... ... @@ -117,7 +125,7 @@
117 125 </select>
118 126 </div>
119 127 <div class="clearfix"></div>
120   - <div style="margin-left: 679px;" class="text-center">
  128 + <div class="col-xs-12 text-right">
121 129 <button type="button" class="btn btn-secondary" data-container="body" data-toggle="popover" data-placement="bottom" ng-click="next()">
122 130 Next
123 131 </button>
... ... @@ -134,63 +142,63 @@
134 142 <i class="material-icons" style="line-height: 31px;">open_with</i>
135 143 </div>
136 144 <div class="sector-question">
137   - <div class="col-xs-8 font f-family">
  145 + <div class="col-xs-12 font f-family">
138 146 To which sector would you relate your company?
139 147 </div>
140 148 <div class="clearfix"></div>
141 149 </div>
142 150 <div class="clearfix" style="height:15px;"></div>
143 151 <div class="sector-align">
144   - <div class="col-xs-8 col-md-3">
  152 + <div class="col-xs-6 col-md-3">
145 153 <label class="card-small">
146 154 <input type="radio" required value="retail" ng-model="data.sector" class="option-input radio" ng-change="sector(data.sector); sectorkeyPress()" name="sectors">
147 155 <img src="images/retail.png">
148 156 <label class="f-family">Retail</label>
149 157 </label>
150 158 </div>
151   - <div class="col-xs-8 col-md-3">
  159 + <div class="col-xs-6 col-md-3">
152 160 <label class="card-small">
153 161 <input type="radio" required value="travel" ng-model="data.sector" class="option-input radio" ng-change="sector(data.sector); sectorkeyPress()" name="sectors">
154 162 <img src="images/transport.png">
155 163 <label class="f-family">Travel</label>
156 164 </label>
157 165 </div>
158   - <div class="col-xs-8 col-md-3">
  166 + <div class="col-xs-6 col-md-3">
159 167 <label class="card-small">
160 168 <input type="radio" required value="b2b commerce" ng-model="data.sector" class="option-input radio" ng-change="sector(data.sector); sectorkeyPress()" name="sectors">
161 169 <img src="images/paymens.png">
162 170 <label class="f-family">B2B commerce</label>
163 171 </label>
164 172 </div>
165   - <div class="col-xs-8 col-md-3">
  173 + <div class="col-xs-6 col-md-3">
166 174 <label class="card-small">
167 175 <input type="radio" required value="agritech" ng-model="data.sector" class="option-input radio" ng-change="sector(data.sector); sectorkeyPress()" name="sectors">
168 176 <img src="images/food.png">
169 177 <label class="f-family">Agritech</label>
170 178 </label>
171 179 </div>
172   - <div class="col-xs-8 col-md-3">
  180 + <div class="col-xs-6 col-md-3">
173 181 <label class="card-small">
174 182 <input type="radio" required value="fintech" ng-model="data.sector" class="option-input radio" ng-change="sector(data.sector); sectorkeyPress()" name="sectors">
175 183 <img src="images/online_media.png">
176 184 <label class="f-family">Fintech</label>
177 185 </label>
178 186 </div>
179   - <div class="col-xs-8 col-md-3">
  187 + <div class="col-xs-6 col-md-3">
180 188 <label class="card-small">
181 189 <input type="radio" required value="hyperlocal services" ng-model="data.sector" class="option-input radio" ng-change="sector(data.sector); sectorkeyPress()" name="sectors">
182 190 <img src="images/hardware.png">
183 191 <label class="f-family">Hyperlocal services</label>
184 192 </label>
185 193 </div>
186   - <div class="col-xs-8 col-md-3">
  194 + <div class="col-xs-6 col-md-3">
187 195 <label class="card-small">
188 196 <input type="radio" required value="education" ng-model="data.sector" class="option-input radio" ng-change="sector(data.sector); sectorkeyPress()" name="sectors">
189 197 <img src="images/education.png">
190 198 <label class="f-family">Education</label>
191 199 </label>
192 200 </div>
193   - <div class="col-xs-8 col-md-3">
  201 + <div class="col-xs-6 col-md-3">
194 202 <label class="card-small">
195 203 <input type="radio" required value="rural" ng-model="data.sector" class="option-input radio" ng-change="sector(data.sector); sectorkeyPress()" name="sectors">
196 204 <img src="images/RURAL_ICON.png">
... ... @@ -200,7 +208,7 @@
200 208 </div>
201 209 <div class="clearfix"></div>
202 210 </div> <!-- CLOSE sectors-card -->
203   - <div class="col-xs-12 col-md-12 f-family line-adjust">
  211 + <div class="col-xs-11 col-md-12 f-family line-adjust">
204 212 <strong>What technology are you using in the product?</strong>
205 213 <p class="line-space" >Please explain in detail the technologies that you are using or plan to use in the product?</p>
206 214 </div>
... ... @@ -210,7 +218,7 @@
210 218 </div>
211 219 <input type="text" class="text-input" ng-model="data.technology" placeholder="Technology" ng-change="entertechnology(data.technology); technologykeyPress(data.technology)" required>
212 220 </div>
213   - <div class="col-xs-12 col-md-12 f-family line-adjust">
  221 + <div class="col-xs-11 col-md-12 f-family line-adjust">
214 222 <strong>Tell us about the problem that your company is trying to address. </strong>
215 223 <p class="line-space" ></p>
216 224 </div>
... ... @@ -353,18 +361,19 @@
353 361 <option>Any other</option>
354 362 </select>
355 363 </div>
  364 + <div class="clearfix"></div>
356 365 </div>
357 366 <div class="clearfix"></div>
358 367 </div> <!--CLOSE question-shadow -->
359 368 <div class="clearfix"></div>
360 369 <!-- **************************CLOSE QUIZ FORM********************** -->
361   - <div class="hideform">
362   - <div class="col-xs-12 col-md-12 f-family line-adjust" ng-if="prototyp">
  370 + <div class="hideform" ng-if="prototyp">
  371 + <div class="col-xs-12 col-md-12 f-family line-adjust">
363 372 <strong>Do you have a prototype ready?</strong>
364 373 <p class="line-space" >If yes, please share the link to demo/website/application</p>
365 374 </div>
366   - <div class="col-xs-12 col-md-12 input-wrapper">
367   - <div class="icon-circle-k" ng-if="prototyp">
  375 + <div class="col-xs-12 col-md-12 input-wrapper" ng-if="prototyp">
  376 + <div class="icon-circle-k">
368 377 <i class="material-icons" style="line-height: 30px;">device_hub</i>
369 378 </div>
370 379 <textarea name="prototyp" ng-required="prototyp" class="text-input textarea" ng-model="data.prototype" ng-if="prototyp" placeholder="Prototype" ng-change="abc(); prototypekeyPress(data.prototype)"></textarea>
... ... @@ -373,8 +382,8 @@
373 382 <strong>What is your go-to-market strategy?</strong>
374 383 <p class="line-space" ></p>
375 384 </div>
376   - <div class="col-xs-12 col-md-12 input-wrapper">
377   - <div class="icon-circle-l" ng-if="market">
  385 + <div class="col-xs-12 col-md-12 input-wrapper" ng-if="market">
  386 + <div class="icon-circle-l">
378 387 <i class="material-icons" style="line-height: 30px;">multiline_chart</i>
379 388 </div>
380 389 <textarea name="market" ng-required="market" class="text-input textarea" ng-model="data.market" ng-if="market" placeholder="Go to market strategy" ng-change="abc(); marketkeyPress(data.market)"></textarea>
... ... @@ -383,8 +392,8 @@
383 392 <strong>Who are your existing competitors and potential risk factors?</strong>
384 393 <p class="line-space" ></p>
385 394 </div>
386   - <div class="col-xs-12 col-md-12 input-wrapper">
387   - <div class="icon-circle-m" ng-if="risks">
  395 + <div class="col-xs-12 col-md-12 input-wrapper" ng-if="risks">
  396 + <div class="icon-circle-m">
388 397 <i class="material-icons" style="line-height: 30px;">smoking_rooms</i>
389 398 </div>
390 399 <textarea name="risks" ng-required="risks" class="text-input textarea" ng-model="data.risks" ng-if="risks" placeholder="Competition and risks" ng-change="abc(); riskkeyPress(data.risks)"></textarea>
... ... @@ -403,8 +412,8 @@
403 412 <strong>Upload the pitch-deck/presentation mentioning the details of the startup.</strong>
404 413 <p class="line-space" ></p>
405 414 </div>
406   - <div class="col-xs-12 col-md-12 input-wrapper">
407   - <div class="icon-circle-z" ng-if="pitch">
  415 + <div class="col-xs-12 col-md-12 input-wrapper" ng-if="pitch">
  416 + <div class="icon-circle-z">
408 417 <i class="material-icons" style="line-height: 30px;">offline_pin</i>
409 418 </div>
410 419 <input type="text" ng-required="pitch" class="text-input" ng-model="data.pitch" ng-if="pitch" placeholder="Upload pitch deck" ng-change="abc(); pitchkeyPress(data.pitch)">
... ... @@ -413,14 +422,13 @@
413 422 <strong>Upload the financial projections/funding requirements of your company?</strong>
414 423 <p class="line-space" ></p>
415 424 </div>
416   - <div class="col-xs-12 col-md-12 input-wrapper">
417   - <div class="icon-circle-q" ng-if="financials">
  425 + <div class="col-xs-12 col-md-12 input-wrapper" ng-if="financials">
  426 + <div class="icon-circle-q">
418 427 <i class="material-icons" style="line-height: 30px;">timeline</i>
419 428 </div>
420 429 <input type="text" name="financials" ng-required="financials" class="text-input" ng-model="data.financials" ng-if="financials" placeholder="Upload financials" ng-change="abc(); financialskeyPress(data.financials)">
421 430 </div>
422 431 <div class="clearfix"></div>
423   - <div class="clearfix" ng-if="prototyp"></div>
424 432 </div>
425 433 <!-- <div class="clearfix"></div> -->
426 434 <!-- THIS CODE FOR WHO ARE YOU FORM -->
... ... @@ -442,32 +450,33 @@
442 450 </div>
443 451 <div class="stages identity-align">
444 452 <div class="col-xs-12">
445   - <label class="card-small">
446   - <input type="radio" required value="student" ng-model="data.identity" class="option-input-a radio-a" ng-change="student(data.identity); studentkeyPress()" name="file" ng-click="show='a'">
  453 + <label class="card-small margin-right-label">
  454 + <input type="radio" required value="student" ng-model="data.identity" class="option-input-a radio-a pull-left" id="studentRadio" ng-change="student(data.identity); studentkeyPress()" name="file" ng-click="show='a'">
447 455 <!-- <img src="images/RURAL_ICON.png"> -->
448   - <label class="f-family">Student</label>
  456 + <label class="f-family pull-left width-auto" for="studentRadio">Student</label>
449 457 </label>
450   - <label class="card-small">
451   - <input type="radio" required value="others" ng-model="data.identity" class="option-input-a radio-a" ng-change="student(data.identity); studentkeyPress()" name="file" ng-click="show='b'">
  458 + <label class="card-small margin-right-label">
  459 + <input type="radio" required value="others" ng-model="data.identity" class="option-input-a radio-a pull-left" id="othersRadio" ng-change="student(data.identity); studentkeyPress()" name="file" ng-click="show='b'">
452 460 <!-- <img src="images/education.png"> -->
453   - <label class="f-family">Others</label>
  461 + <label class="f-family pull-left width-auto" for="othersRadio">Others</label>
454 462 </label>
455 463 </div>
456   - <!-- <div class="col-xs-6">
  464 + <!--
  465 + <div class="col-xs-6" ng-show="show=='a'">
457 466 <label class="card-small">
458 467  
459   - <input type="file" file-model="data.pic" required id="picture" name="pic" accept="image/*" ng-show="show=='a'">
  468 + <input type="file" file-model="data.pic" required id="picture" name="pic" accept="image/*">
460 469 </label>
461 470 </div> -->
462 471 </div><!-- CLOSE stages identity-align -->
463 472 <div class="clearfix"></div>
464 473 </div><!-- CLOSE identity-shadow -->
465   - <div class="col-xs-12 col-md-10 input-wrapper">
  474 + <div class="col-xs-12 input-wrapper">
466 475 <div class="icon-circle-h">
467 476 <i class="material-icons" style="line-height: 30px;">phone_android</i>
468 477 </div>
469   - <input class="text-input" ng-model="data.referalToken" placeholder="Enter Coupon code">
470   - <button type="button" ng-click="tokenCall(data.referalToken)">Apply</button>
  478 + <input class="text-input" ng-model="data.referalToken" placeholder="Enter Coupon code">
  479 + <button type="button" ng-click="tokenCall(data.referalToken)" class="pull-right">Apply</button>
471 480 </div>
472 481  
473 482 <div class="clearfix"></div>
... ...