Skip to content

M
Moments
Commit bf2e0e81 by abraham
Options

Merge branch 'abraham' into 'master'

Abraham See merge request !23
parents 033de085 c7e6cc67
Showing with 216 additions and 73 deletions
angular.json
...@@ -37,6 +37,7 @@ ...@@ -37,6 +37,7 @@
"scripts": [ "scripts": [
"node_modules/jquery/dist/jquery.js", "node_modules/jquery/dist/jquery.js",
"node_modules/jquery/dist/jquery.min.js", "node_modules/jquery/dist/jquery.min.js",
"node_modules/popper.js/dist/umd/popper.js",
"node_modules/bootstrap/dist/js/bootstrap.js", "node_modules/bootstrap/dist/js/bootstrap.js",
"node_modules/slick-carousel/slick/slick.min.js" "node_modules/slick-carousel/slick/slick.min.js"
], ],
......
package-lock.json
...@@ -7344,6 +7344,11 @@ ...@@ -7344,6 +7344,11 @@
"find-up": "^2.1.0" "find-up": "^2.1.0"
} }
}, },
"popper.js": {
"version": "1.15.0",
"resolved": "https://registry.npmjs.org/popper.js/-/popper.js-1.15.0.tgz",
"integrity": "sha512-w010cY1oCUmI+9KwwlWki+r5jxKfTFDVoadl7MSrIujHU5MJ5OR6HTDj6Xo8aoR/QsA56x8jKjA59qGH4ELtrA=="
},
"portfinder": { "portfinder": {
"version": "1.0.21", "version": "1.0.21",
"resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.21.tgz", "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.21.tgz",
......
package.json
...@@ -26,6 +26,7 @@ ...@@ -26,6 +26,7 @@
"jquery": "^3.4.1", "jquery": "^3.4.1",
"ng5-slider": "^1.2.4", "ng5-slider": "^1.2.4",
"ngx-slick-carousel": "^0.4.4", "ngx-slick-carousel": "^0.4.4",
"popper.js": "^1.15.0",
"rxjs": "~6.3.3", "rxjs": "~6.3.3",
"slick-carousel": "^1.8.1", "slick-carousel": "^1.8.1",
"tslib": "^1.9.0", "tslib": "^1.9.0",
......
src/app/body/planning/planning.component.html
...@@ -497,19 +497,35 @@ ...@@ -497,19 +497,35 @@
</div> </div>
<div id="favorite" class="tab-pane fade"> <div id="favorite" class="tab-pane fade">
<div class="container favourite_vendors"> <div class="container favourite_vendors">
<div class="fav_top">
<div class="fav_vendors"> <div class="fav_vendors">
<img src="../../../assets/img/18.png"> <img src="../../../assets/img/18.png">
<h3>FAVORITE VENDORS</h3> <h3>FAVORITE VENDORS</h3>
</div> </div>
<div class="filter_icon"> <div class="filter_icon">
<img src="../../../assets/img/53.png"> <img src="../../../assets/img/53.png" style="float: left;
<div class="dropdown"></div> padding-top: 10px;
padding-right: 20px;">
<div class="dropdown" style="float: left;">
<button type="button" class="dropdown-toggle" data-toggle="dropdown">
Hired & Favorite Vendors
</button>
<div class="clear"></div>
<div class="dropdown-menu">
<a class="dropdown-item" href="#">--None Selected--</a>
<a class="dropdown-item" href="#">A-List</a>
<a class="dropdown-item" href="#">B-List</a>
<a class="dropdown-item" href="#">C-List</a>
</div> </div>
<div class="clear"></div> <div class="clear"></div>
</div>
</div>
<div class="clear"></div>
</div>
<div class="vendor_left_side"> <div class="vendor_left_side">
<ul class="nav flex-column"> <ul class="nav flex-column">
<li> <li>
<a class="active" data-toggle="tab" href="#recent"> <a class="active" data-toggle="tab" href="#all">
<img src="../../../assets/img/56.png"> <img src="../../../assets/img/56.png">
<p>All</p> <p>All</p>
<div class="vendor_counter"> <div class="vendor_counter">
...@@ -519,7 +535,7 @@ ...@@ -519,7 +535,7 @@
</a> </a>
</li> </li>
<li> <li>
<a data-toggle="tab" href="#order"> <a data-toggle="tab" href="#venue">
<img src="../../../assets/img/57.png"> <img src="../../../assets/img/57.png">
<p>Venue</p> <p>Venue</p>
<div class="vendor_counter"> <div class="vendor_counter">
...@@ -529,7 +545,7 @@ ...@@ -529,7 +545,7 @@
</a> </a>
</li> </li>
<li> <li>
<a data-toggle="tab" href="#payment"> <a data-toggle="tab" href="#Wedding_Photographers">
<img src="../../../assets/img/1507722456_56cdf37898bb3bb1b3356fad8831dc1a--on-your-wedding-day-pre-wedding.jpg"> <img src="../../../assets/img/1507722456_56cdf37898bb3bb1b3356fad8831dc1a--on-your-wedding-day-pre-wedding.jpg">
<p>Wedding Photographers</p> <p>Wedding Photographers</p>
<div class="vendor_counter"> <div class="vendor_counter">
...@@ -539,7 +555,7 @@ ...@@ -539,7 +555,7 @@
</a> </a>
</li> </li>
<li> <li>
<a data-toggle="tab" href="#manage"> <a data-toggle="tab" href="#Wedding_Venues">
<img src="../../../assets/img/1507875334_wedding-icon-12670446.jpg"> <img src="../../../assets/img/1507875334_wedding-icon-12670446.jpg">
<p>Wedding Venues</p> <p>Wedding Venues</p>
<div class="vendor_counter"> <div class="vendor_counter">
...@@ -549,7 +565,7 @@ ...@@ -549,7 +565,7 @@
</a> </a>
</li> </li>
<li> <li>
<a data-toggle="tab" href="#communication"> <a data-toggle="tab" href="#Planning">
<img src="../../../assets/img/1517468986_wedding-planning_318-99774.jpg"> <img src="../../../assets/img/1517468986_wedding-planning_318-99774.jpg">
<p>Planning</p> <p>Planning</p>
<div class="vendor_counter"> <div class="vendor_counter">
...@@ -559,7 +575,7 @@ ...@@ -559,7 +575,7 @@
</a> </a>
</li> </li>
<li> <li>
<a data-toggle="tab" href="#communication"> <a data-toggle="tab" href="#Wedding_DJs">
<img src="../../../assets/img/1508740269_marriage-marry-009-256.png"> <img src="../../../assets/img/1508740269_marriage-marry-009-256.png">
<p>Wedding DJs</p> <p>Wedding DJs</p>
<div class="vendor_counter"> <div class="vendor_counter">
...@@ -569,7 +585,7 @@ ...@@ -569,7 +585,7 @@
</a> </a>
</li> </li>
<li> <li>
<a data-toggle="tab" href="#communication"> <a data-toggle="tab" href="#Wedding_Invitations">
<img src="../../../assets/img/1509359880_under-new-management-marriage-note-foldable-design-with-black-text-and-icon-decoration-classic-black-and-white-funny-wedding-thank-you-cards.jpg"> <img src="../../../assets/img/1509359880_under-new-management-marriage-note-foldable-design-with-black-text-and-icon-decoration-classic-black-and-white-funny-wedding-thank-you-cards.jpg">
<p>Wedding Invitations</p> <p>Wedding Invitations</p>
<div class="vendor_counter"> <div class="vendor_counter">
...@@ -579,7 +595,7 @@ ...@@ -579,7 +595,7 @@
</a> </a>
</li> </li>
<li> <li>
<a data-toggle="tab" href="#communication"> <a data-toggle="tab" href="#Wedding_Caterers">
<img src="../../../assets/img/1509359943_8819003-Illustration-of-a-cook-in-black-and-white-Stock-Vector-chef-cooking-hat.jpg"> <img src="../../../assets/img/1509359943_8819003-Illustration-of-a-cook-in-black-and-white-Stock-Vector-chef-cooking-hat.jpg">
<p>Wedding Caterers</p> <p>Wedding Caterers</p>
<div class="vendor_counter"> <div class="vendor_counter">
...@@ -589,7 +605,7 @@ ...@@ -589,7 +605,7 @@
</a> </a>
</li> </li>
<li> <li>
<a data-toggle="tab" href="#communication"> <a data-toggle="tab" href="#Wedding_Favors_Gifts">
<img src="../../../assets/img/1509360077_images.png"> <img src="../../../assets/img/1509360077_images.png">
<p>Wedding Favors & Gifts</p> <p>Wedding Favors & Gifts</p>
<div class="vendor_counter"> <div class="vendor_counter">
...@@ -599,7 +615,7 @@ ...@@ -599,7 +615,7 @@
</a> </a>
</li> </li>
<li> <li>
<a data-toggle="tab" href="#communication"> <a data-toggle="tab" href="#Wedding_Jewelry">
<img src="../../../assets/img/1509360090_wedding_17-512.png"> <img src="../../../assets/img/1509360090_wedding_17-512.png">
<p>Wedding Jewelry</p> <p>Wedding Jewelry</p>
<div class="vendor_counter"> <div class="vendor_counter">
...@@ -612,7 +628,7 @@ ...@@ -612,7 +628,7 @@
</div> </div>
<div class="vendor_right_side"> <div class="vendor_right_side">
<div class="tab-content"> <div class="tab-content">
<div class="tab-pane active" id="recent"> <div class="tab-pane active" id="all">
<div class="all_tab"> <div class="all_tab">
<img src="../../../assets/img/1511411361_800x800_1484776452685-exterior-1.jpg"> <img src="../../../assets/img/1511411361_800x800_1484776452685-exterior-1.jpg">
<div class="all_tab_contents"> <div class="all_tab_contents">
...@@ -639,13 +655,23 @@ ...@@ -639,13 +655,23 @@
<div class="clear"></div> <div class="clear"></div>
</div> </div>
</div> </div>
<div class="tab-pane fade" id="order"> <div class="tab-pane fade" id="venue">
</div>
<div class="tab-pane fade" id="Wedding_Photographers">
</div>
<div class="tab-pane fade" id="Wedding_Venues">
</div>
<div class="tab-pane fade" id="Planning ">
</div>
<div class="tab-pane fade" id="Wedding_DJs ">
</div> </div>
<div class="tab-pane fade" id="payment"> <div class="tab-pane fade" id="Wedding_Invitations ">
</div> </div>
<div class="tab-pane fade" id="manage"> <div class="tab-pane fade" id="Wedding_Caterers ">
</div> </div>
<div class="tab-pane fade" id="communication "> <div class="tab-pane fade" id="Wedding_Favors_Gifts ">
</div>
<div class="tab-pane fade" id="Wedding_Jewelry ">
</div> </div>
</div> </div>
</div> </div>
...@@ -675,22 +701,34 @@ ...@@ -675,22 +701,34 @@
</li> </li>
<li> <li>
<label>RSVP 1</label> <label>RSVP 1</label>
<select> <div class="dropdown">
<option value="--None Selected--">--None Selected--</option> <button type="button" class="dropdown-toggle" data-toggle="dropdown">
<option value="Not Invited">Not Invited</option> --None Selected--
<option value="No Response">No Response</option> </button>
<option value="Accepted">Accepted</option> <div class="clear"></div>
<option value="Declined">Declined</option> <div class="dropdown-menu">
</select> <a class="dropdown-item" href="#">--None Selected--</a>
<a class="dropdown-item" href="#">Not Invited</a>
<a class="dropdown-item" href="#">No Response</a>
<a class="dropdown-item" href="#">Accepted</a>
<a class="dropdown-item" href="#">Declined</a>
</div>
</div>
</li> </li>
<li> <li>
<label>Meal 1</label> <label>Meal 1</label>
<select> <div class="dropdown">
<option value="--None Selected--">--None Selected--</option> <button type="button" class="dropdown-toggle" data-toggle="dropdown">
<option value="A-List">A-List</option> --None Selected--
<option value="B-List">B-List</option> </button>
<option value="C-List">C-List</option> <div class="clear"></div>
</select> <div class="dropdown-menu">
<a class="dropdown-item" href="#">--None Selected--</a>
<a class="dropdown-item" href="#">A-List</a>
<a class="dropdown-item" href="#">B-List</a>
<a class="dropdown-item" href="#">C-List</a>
</div>
</div>
</li> </li>
</ul> </ul>
</div> </div>
...@@ -706,25 +744,37 @@ ...@@ -706,25 +744,37 @@
</li> </li>
<li> <li>
<label>RSVP</label> <label>RSVP</label>
<select> <div class="dropdown">
<option value="--None Selected--">--None Selected--</option> <button type="button" class="dropdown-toggle" data-toggle="dropdown">
<option value="Not Invited">Not Invited</option> --None Selected--
<option value="No Response">No Response</option> </button>
<option value="Accepted">Accepted</option> <div class="clear"></div>
<option value="Declined">Declined</option> <div class="dropdown-menu">
</select> <a class="dropdown-item" href="#">--None Selected--</a>
<a class="dropdown-item" href="#">Not Invited</a>
<a class="dropdown-item" href="#">No Response</a>
<a class="dropdown-item" href="#">Accepted</a>
<a class="dropdown-item" href="#">Declined</a>
</div>
</div>
</li> </li>
<li> <li>
<label>Meal</label> <label>Meal</label>
<select> <div class="dropdown">
<option value="--None Selected--">--None Selected--</option> <button type="button" class="dropdown-toggle" data-toggle="dropdown">
<option value="A-List">Beef</option> --None Selected--
<option value="B-List">Chicken</option> </button>
<option value="C-List">Fish</option> <div class="clear"></div>
</select> <div class="dropdown-menu">
<a class="dropdown-item" href="#">--None Selected--</a>
<a class="dropdown-item" href="#">A-List</a>
<a class="dropdown-item" href="#">B-List</a>
<a class="dropdown-item" href="#">C-List</a>
</div>
</div>
</li> </li>
</ul> </ul>
<button>Save</button> <button class="bottom_button">Save</button>
</div> </div>
</div> </div>
</div> </div>
...@@ -770,22 +820,34 @@ ...@@ -770,22 +820,34 @@
</li> </li>
<li> <li>
<label>RSVP 1</label> <label>RSVP 1</label>
<select> <div class="dropdown">
<option value="--None Selected--">--None Selected--</option> <button type="button" class="dropdown-toggle" data-toggle="dropdown">
<option value="Not Invited">Not Invited</option> --None Selected--
<option value="No Response">No Response</option> </button>
<option value="Accepted">Accepted</option> <div class="clear"></div>
<option value="Declined">Declined</option> <div class="dropdown-menu">
</select> <a class="dropdown-item" href="#">--None Selected--</a>
<a class="dropdown-item" href="#">Not Invited</a>
<a class="dropdown-item" href="#">No Response</a>
<a class="dropdown-item" href="#">Accepted</a>
<a class="dropdown-item" href="#">Declined</a>
</div>
</div>
</li> </li>
<li> <li>
<label>Meal 1</label> <label>Meal 1</label>
<select> <div class="dropdown">
<option value="--None Selected--">--None Selected--</option> <button type="button" class="dropdown-toggle" data-toggle="dropdown">
<option value="A-List">A-List</option> --None Selected--
<option value="B-List">B-List</option> </button>
<option value="C-List">C-List</option> <div class="clear"></div>
</select> <div class="dropdown-menu">
<a class="dropdown-item" href="#">--None Selected--</a>
<a class="dropdown-item" href="#">A-List</a>
<a class="dropdown-item" href="#">B-List</a>
<a class="dropdown-item" href="#">C-List</a>
</div>
</div>
</li> </li>
</ul> </ul>
</div> </div>
...@@ -801,25 +863,37 @@ ...@@ -801,25 +863,37 @@
</li> </li>
<li> <li>
<label>RSVP</label> <label>RSVP</label>
<select> <div class="dropdown">
<option value="--None Selected--">--None Selected--</option> <button type="button" class="dropdown-toggle" data-toggle="dropdown">
<option value="Not Invited">Not Invited</option> --None Selected--
<option value="No Response">No Response</option> </button>
<option value="Accepted">Accepted</option> <div class="clear"></div>
<option value="Declined">Declined</option> <div class="dropdown-menu">
</select> <a class="dropdown-item" href="#">--None Selected--</a>
<a class="dropdown-item" href="#">Not Invited</a>
<a class="dropdown-item" href="#">No Response</a>
<a class="dropdown-item" href="#">Accepted</a>
<a class="dropdown-item" href="#">Declined</a>
</div>
</div>
</li> </li>
<li> <li>
<label>Meal</label> <label>Meal</label>
<select> <div class="dropdown">
<option value="--None Selected--">--None Selected--</option> <button type="button" class="dropdown-toggle" data-toggle="dropdown">
<option value="A-List">Beef</option> --None Selected--
<option value="B-List">Chicken</option> </button>
<option value="C-List">Fish</option> <div class="clear"></div>
</select> <div class="dropdown-menu">
<a class="dropdown-item" href="#">--None Selected--</a>
<a class="dropdown-item" href="#">Beef</a>
<a class="dropdown-item" href="#">Chicken</a>
<a class="dropdown-item" href="#">Fish</a>
</div>
</div>
</li> </li>
</ul> </ul>
<button>Save</button> <button class="bottom_button">Save</button>
</div> </div>
</div> </div>
</div> </div>
......
src/app/body/planning/planning.component.scss
...@@ -713,6 +713,8 @@ ...@@ -713,6 +713,8 @@
} }
} }
.favourite_vendors{ .favourite_vendors{
.fav_top{
width: 82%;
.fav_vendors{ .fav_vendors{
display: inline-block; display: inline-block;
margin-bottom: 10px; margin-bottom: 10px;
...@@ -726,6 +728,34 @@ ...@@ -726,6 +728,34 @@
} }
.filter_icon{ .filter_icon{
float: right; float: right;
.dropdown{
button{
text-align: left;
width: 100%;
color: rgba(0, 0, 0, 0.87);
font-size: 16px;
padding-left: 20px;
padding-right: 20px;
height: 40px;
outline: none;
border: 1px solid #9e9e9e;
background: transparent;
&:after{
margin-top: 8px;
margin-left: 10px;
float: right;
}
}
.dropdown-menu{
width: 100%;
.dropdown-item{
color: #b638b6;
padding-top: 7px;
padding-bottom: 7px;
}
}
}
}
} }
.vendor_left_side{ .vendor_left_side{
background-color: #f6f5f5; background-color: #f6f5f5;
...@@ -903,12 +933,16 @@ ...@@ -903,12 +933,16 @@
list-style: none; list-style: none;
padding: 10px; padding: 10px;
input{ input{
outline: none;
width: 100%; width: 100%;
height: 40px; height: 40px;
border: 1px solid #9e9e9e; border: 1px solid #9e9e9e;
padding-left: 10px;
&::placeholder{ &::placeholder{
color: #a8a8a8; color: #a8a8a8;
padding-left: 10px; }
&:focus{
border: 2px solid #b638b6;
} }
} }
label{ label{
...@@ -916,6 +950,30 @@ ...@@ -916,6 +950,30 @@
color: #9e9e9e; color: #9e9e9e;
display: block; display: block;
} }
.dropdown{
button{
text-align: left;
width: 100%;
color: #6f6f6f;
font-size: 14px;
height: 40px;
outline: none;
border: 1px solid #9e9e9e;
background: transparent;
&:after{
margin-top: 8px;
float: right;
}
}
.dropdown-menu{
width: 100%;
.dropdown-item{
color: #b638b6;
padding-top: 7px;
padding-bottom: 7px;
}
}
}
select{ select{
outline: none; outline: none;
width: 100%; width: 100%;
...@@ -929,7 +987,7 @@ ...@@ -929,7 +987,7 @@
} }
} }
} }
button{ .bottom_button{
outline: none; outline: none;
color: #fff; color: #fff;
font-size: 18px; font-size: 18px;
...@@ -974,11 +1032,15 @@ ...@@ -974,11 +1032,15 @@
width: 100%; width: 100%;
height: 40px; height: 40px;
border: 1px solid #d7d7d7; border: 1px solid #d7d7d7;
outline: none;
&::placeholder{ &::placeholder{
color: #d7d7d7; color: #d7d7d7;
padding-left: 10px; padding-left: 10px;
font-size: 16px; font-size: 16px;
} }
&:focus{
border: 1px solid #b638b6;
}
} }
button{ button{
outline: none; outline: none;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment