From d4b69d455d052497ee0c1e84a28636a060fccb5e Mon Sep 17 00:00:00 2001 From: Anoop M Date: Mon, 15 Jan 2018 20:14:50 +0000 Subject: [PATCH] added content to web_dynamic 1 done --- web_dynamic/0-hbnb.html | 89 +++++++++++++++++++ web_dynamic/0-hbnb.py | 29 ++++++ web_dynamic/__init__.py | 1 + web_dynamic/static/images/icon.png | Bin 0 -> 2962 bytes web_dynamic/static/images/icon_bath.png | Bin 0 -> 704 bytes web_dynamic/static/images/icon_bed.png | Bin 0 -> 447 bytes web_dynamic/static/images/icon_group.png | Bin 0 -> 1051 bytes web_dynamic/static/images/logo.png | Bin 0 -> 9876 bytes web_dynamic/static/styles/3-footer.css | 11 +++ web_dynamic/static/styles/3-header.css | 15 ++++ web_dynamic/static/styles/4-common.css | 15 ++++ web_dynamic/static/styles/6-filters.css | 93 +++++++++++++++++++ web_dynamic/static/styles/8-places.css | 108 +++++++++++++++++++++++ 13 files changed, 361 insertions(+) create mode 100644 web_dynamic/0-hbnb.html create mode 100755 web_dynamic/0-hbnb.py create mode 100755 web_dynamic/__init__.py create mode 100644 web_dynamic/static/images/icon.png create mode 100644 web_dynamic/static/images/icon_bath.png create mode 100644 web_dynamic/static/images/icon_bed.png create mode 100644 web_dynamic/static/images/icon_group.png create mode 100644 web_dynamic/static/images/logo.png create mode 100644 web_dynamic/static/styles/3-footer.css create mode 100644 web_dynamic/static/styles/3-header.css create mode 100644 web_dynamic/static/styles/4-common.css create mode 100644 web_dynamic/static/styles/6-filters.css create mode 100644 web_dynamic/static/styles/8-places.css diff --git a/web_dynamic/0-hbnb.html b/web_dynamic/0-hbnb.html new file mode 100644 index 0000000..4de854f --- /dev/null +++ b/web_dynamic/0-hbnb.html @@ -0,0 +1,89 @@ + + + + + + + + + + + AirBnb Clone + + +
+ +
+
+
+
+

States

+

 

+
    + {% for state in states.values()|sort(attribute='name') %} +
  • +

    {{ state.name }}

    +
      + {% for city in state.cities|sort(attribute='name') %} +
    • {{ city.name }}
      • + {% endfor %} +
    +
    • + {% endfor %} +
+
+
+

Amenities

+

 

+
    + {% for amty in amenities.values() %} +
  • {{ amty.name }}
    • + {% endfor %} +
+
+ +
+
+

Places

+ {% for place in places.values()|sort(attribute='name') %} +
+

{{ place.name }}

+
+

${{ place.price_by_night }}

+
+
+
+
+

{{ place.max_guest }}

+
+
+
+

{{ place.number_rooms }}

+
+
+
+

{{ place.number_bathrooms }}

+
+
+
+

Owner: {{ place.user.first_name ~ ' ' ~ place.user.last_name }}

+
+
+ {% autoescape false %} +

{{ place.description }}

+ {% endautoescape %} +
+
+ {% endfor %} +
+
+ + + diff --git a/web_dynamic/0-hbnb.py b/web_dynamic/0-hbnb.py new file mode 100755 index 0000000..4eaf3e6 --- /dev/null +++ b/web_dynamic/0-hbnb.py @@ -0,0 +1,29 @@ +#!/usr/bin/python3 +"""Flask app to generate complete html page containing location/amenity +dropdown menus and rental listings""" +from flask import Flask, render_template +from models import storage +app = Flask('web_flask') +app.url_map.strict_slashes = False + + +@app.route('/hbnb') +def display_hbnb(): + """Generate page with popdown menu of states/cities""" + states = storage.all('State') + amenities = storage.all('Amenity') + places = storage.all('Place') + return render_template('0-hbnb.html', + states=states, + amenities=amenities, + places=places) + + +@app.teardown_appcontext +def teardown_db(*args, **kwargs): + """Close database or file storage""" + storage.close() + + +if __name__ == '__main__': + app.run(host='0.0.0.0', port=5000) diff --git a/web_dynamic/__init__.py b/web_dynamic/__init__.py new file mode 100755 index 0000000..a93a4bf --- /dev/null +++ b/web_dynamic/__init__.py @@ -0,0 +1 @@ +#!/usr/bin/python3 diff --git a/web_dynamic/static/images/icon.png b/web_dynamic/static/images/icon.png new file mode 100644 index 0000000000000000000000000000000000000000..93492bb8df2ec8408a935db7d4352e70e297d48d GIT binary patch literal 2962 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 UVsdFeFj^QqUHx3vIVCg!0N#=_Pyhe` literal 0 HcmV?d00001 diff --git a/web_dynamic/static/images/icon_bed.png b/web_dynamic/static/images/icon_bed.png new file mode 100644 index 0000000000000000000000000000000000000000..2a63284877067dcb61b769fd59e8ee373587b0be GIT binary patch literal 447 zcmeAS@N?(olHy`uVBq!ia0vp^Mj*_=3?wxlRx|^t$pJngu0XnMkb%!ndUAozGAIf1 z3ua(sX64}I;^CE*Q#3F%wXpN{i-=9nD6gz;XziFdWA5TjTelxSb?*G-JNG_+|M~mx zviF&$K)tIyT^vI^j=#O^&UeT_#Pwo+)q9mM_a;x+{r{?=!!(C77B>!oQ*-yt>6GnW zvb0u7U+vo+51u1=EDhnF`&QiX_{);$Z#jXF;fza^;C9#FjyJu$eswQfV=yaSXUXd8 zOV{`w(o3GyDaWjxm?#vV?{2*?Yr?E~e^`u+I&Q^G-!Q>}@0sHBZ48dCLMLt(OVPgg&ebxsLQ E03-gv2mk;8 literal 0 HcmV?d00001 diff --git a/web_dynamic/static/images/icon_group.png b/web_dynamic/static/images/icon_group.png new file mode 100644 index 0000000000000000000000000000000000000000..3e012ab4d5cdc2146782461b475b2a81ce0fea4d GIT binary patch literal 1051 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 z zi0}T0D~7O}@L0X`3Pv)RPH}_2ZUE=!qvloQ?k+KPX$s@PXzG|r@A0>dJd+*?&BN+y z&L=xzr$JO&Eu=D>KzjsM*d>odr7MmB{z(S~;&KYKii2K#hw3@RoY2rvH&$5>fEj^i z8|2^H%FM!pMEseLaW(}DW1ou6HW%F4>>=PnhM z&)Lu5_-JT|QQ+v7Q`}m{h-ECldHsfAX6!g8(_t-X-IkkcAUu<*3S7QL}O9GcV6!K@ZgeQ_F8K?G?+3lhvc*W zH2m)ClKEJg^+_$HRGW0rCj_ej$=~az7jIvL?}N+RGt|T)%l6#x}?n7h^wgxWk}s$!loc7caoRiwp7TgH(-Q`Ob33ybmILXlbWxz)h#UqAm5( zq>pZI8Sk07m9?)0AltyNV|hY88!+{r6$k@4Jm@0?l|CcM)G$szjGk|%jCyEW-ue<7 zX*LrdALvldTi1s|{?;8;Ol-FMqm+h*hAgKal=o`o(t$#$nVFCHDTbVRPky*{aHz|G z%A4&hF5AiOT%l4DxsLrj9~yLG{u^9qWok?WRD4z{ZtgoZf@Cn{)%u_YP<{^@HUrT0 zUv4J9{`^D-QW$M>JLbk>#mNFpC2Z-_R|R0&jI>4EQV3ioF73au^zb!pJ zHCmR*2heE5FR`#Ygeiv{mkJ<4uO4(@8r+>1qT5usfH%(BvBMm(^zv7?87n3PHDU~O zbOWg7R>aS=`GK9-T^u{WH>yoK$_mS}O@H)W$%$a{X3BnhxCN_jX^{eI7eLl4;*aJe zxKe?GGl#S&b+^@g)`t&OjBrLPFh*2G9ZteiaZ@f(gCS1YgaCqU@0)qFtN_F5)_|xr z{WB}|J>c0ke0+OL&<@aHvn7U*_w4HJ$4fN;1^|a9@@e^3ZS3Fg#AGBDC8|Ce1^*w{ C(Z%)v literal 0 HcmV?d00001 diff --git a/web_dynamic/static/styles/3-footer.css b/web_dynamic/static/styles/3-footer.css new file mode 100644 index 0000000..19fe711 --- /dev/null +++ b/web_dynamic/static/styles/3-footer.css @@ -0,0 +1,11 @@ +footer { + position: fixed; + bottom: 0; + width: 100%; + background-color: white; + height: 60px; + border-top: 1px solid #CCCCCC; + display: flex; + justify-content: center; + align-items: center; +} diff --git a/web_dynamic/static/styles/3-header.css b/web_dynamic/static/styles/3-header.css new file mode 100644 index 0000000..70dd644 --- /dev/null +++ b/web_dynamic/static/styles/3-header.css @@ -0,0 +1,15 @@ +header { + width: 100%; + background-color: white; + height: 70px; + border-bottom: 1px solid #CCCCCC; + display: flex; + align-items: center; +} + +.logo { + width: 142px; + height: 60px; + background: url("../images/logo.png") no-repeat center; + padding-left: 20px; +} diff --git a/web_dynamic/static/styles/4-common.css b/web_dynamic/static/styles/4-common.css new file mode 100644 index 0000000..1f2f05d --- /dev/null +++ b/web_dynamic/static/styles/4-common.css @@ -0,0 +1,15 @@ +body { + margin: 0; + padding: 0; + color: #484848; + font-size: 14px; + font-family: Circular,"Helvetica Neue",Helvetica,Arial,sans-serif; +} + +.container { + max-width: 1000px; + margin-top: 30px; + margin-bottom: 30px; + margin-left: auto; + margin-right: auto; +} diff --git a/web_dynamic/static/styles/6-filters.css b/web_dynamic/static/styles/6-filters.css new file mode 100644 index 0000000..413ad40 --- /dev/null +++ b/web_dynamic/static/styles/6-filters.css @@ -0,0 +1,93 @@ +.filters { + background-color: white; + height: 70px; + width: 100%; + border: 1px solid #DDDDDD; + border-radius: 4px; + display: flex; + align-items: center; +} + +section.filters > button{ + font-size: 18px; + color: white; + background-color: #FF5A5F; + height: 48px; + border: 0px; + border-radius: 4px; + width: 20%; + margin-left: auto; + margin-right: 30px; + opacity: 1; +} + +section.filters > button:hover { + opacity: 0.9; +} + +.locations, .amenities { + height: 100%; + width: 25%; + padding-left: 50px; +} + +.locations { + border-right: 1px solid #DDDDDD; +} +.locations > h3, .amenities > h3 { + font-weight: 600; + margin: 12px 0 5px 0; +} + +.locations > h4, .amenities > h4 { + font-weight: 400; + font-size: 14px; + margin: 0 0 5px 0; +} + +.popover { + display: none; + position: relative; + left: -51px; + background-color: #FAFAFA; + width: 100%; + max-height: 300px; + border: 1px solid #DDDDDD; + border-radius: 4px; + z-index: 1; + padding: 30px 50px 30px 0; + margin-top: 17px; + overflow: scroll; +} + +.popover, .popover ul { + list-style-type: none; +} +.locations:hover > .popover { + display: block; +} + +.amenities:hover > .popover { + display: block; +} + +.popover h2 { + margin-top: 0px; + margin-bottom: 5px; +} + +.locations > .popover > li { + margin-bottom: 30px; + margin-left: 30px; +} +.locations > .popover > li > ul { + padding-left: 20px; +} +.locations > .popover > li > ul > li { + margin-bottom: 10px; +} + +.amenities > .popover > li { + margin-left: 50px; + margin-bottom: 10px; +} diff --git a/web_dynamic/static/styles/8-places.css b/web_dynamic/static/styles/8-places.css new file mode 100644 index 0000000..ec2cdcb --- /dev/null +++ b/web_dynamic/static/styles/8-places.css @@ -0,0 +1,108 @@ +.places { + width: 100%; + border: 0; + display: flex; + flex-direction: row; + flex-wrap: wrap; + justify-content: center; +} + +.places > h1 { + font-size: 30px; + padding-left: 20px; + padding-top: 20px; + margin-bottom: 0px; + flex: 0 1 100%; +} +.places > article { + width: 390px; + max-height: fit-content; + padding: 20px 20px 20px 20px; + margin: 20px 20px 20px 20px; + border: 1px solid #FF5A5F; + border-radius: 4px; + display: flex; + flex-direction: column; + justify-content: flex-start; + position: relative; +} + +.places > article > h2 { + font-size: 30px; + margin: 0 20% 0 0; + align-self: center; +} + +.price_by_night { + color: #FF5A5F; + border: 4px solid #FF5A5F; + min-width: 60px; + height: 60px; + font-size: 30px; + border-radius: 50%; + display: flex; + justify-content: center; + align-items: center; + margin-left: auto; + position: absolute; + top: 10px; + right: 20px; +} +.price_by_night > p { + margin: 0 0 0 0; +} + +.information { + align-self: center; + height: 80px; + width: 100%; + border-top: 1px solid #DDDDDD; + border-bottom: 1px solid #DDDDDD; + margin-top: 30px; + display: flex; + justify-content: center; + align-items: center; +} + +.max_guest, .number_rooms, .number_bathrooms { + width: 100px; + text-align: center; +} + +.max_guest > p, .number_rooms > p, .number_bathrooms > p{ + margin-top: auto; + margin-bottom: auto; +} + +.guest_image { + margin-left: auto; + margin-right: auto; + height: 50px; + width: 50px; + background: url("../images/icon_group.png") no-repeat center; +} + +.bed_image { + margin-left: auto; + margin-right: auto; + height: 50px; + width: 50px; + background: url("../images/icon_bed.png") no-repeat center; +} + +.bath_image { + margin-left: auto; + margin-right: auto; + height: 50px; + width: 50px; + background: url("../images/icon_bath.png") no-repeat center; +} + +.user > p { + margin-top: 20px; + margin-bottom: 0px; +} +.description > p { + margin-top: 7px; + margin-bottom: 0px; +}