diff --git a/Image/Copy of Untitled.png b/Image/Copy of Untitled.png new file mode 100644 index 0000000..661b09d Binary files /dev/null and b/Image/Copy of Untitled.png differ diff --git a/Image/LOGO (1).png b/Image/LOGO (1).png new file mode 100644 index 0000000..43270bf Binary files /dev/null and b/Image/LOGO (1).png differ diff --git a/Image/Pastel Shapes Fun & Playful Linktree Background.png b/Image/Pastel Shapes Fun & Playful Linktree Background.png new file mode 100644 index 0000000..dee5ace Binary files /dev/null and b/Image/Pastel Shapes Fun & Playful Linktree Background.png differ diff --git a/Image/banner1.png b/Image/banner1.png new file mode 100644 index 0000000..08527dd Binary files /dev/null and b/Image/banner1.png differ diff --git a/Image/banner2.png b/Image/banner2.png new file mode 100644 index 0000000..09fe411 Binary files /dev/null and b/Image/banner2.png differ diff --git a/Image/bike.jpg b/Image/bike.jpg new file mode 100644 index 0000000..c9c315e Binary files /dev/null and b/Image/bike.jpg differ diff --git a/Image/carosal.png b/Image/carosal.png new file mode 100644 index 0000000..5fe0e87 Binary files /dev/null and b/Image/carosal.png differ diff --git a/Image/p1.jpeg b/Image/p1.jpeg new file mode 100644 index 0000000..eafbd59 Binary files /dev/null and b/Image/p1.jpeg differ diff --git a/Image/p2.jpg b/Image/p2.jpg new file mode 100644 index 0000000..3977a7a Binary files /dev/null and b/Image/p2.jpg differ diff --git a/Image/parking 2.png b/Image/parking 2.png new file mode 100644 index 0000000..a7d2aa8 Binary files /dev/null and b/Image/parking 2.png differ diff --git a/Image/parking3.jpg b/Image/parking3.jpg new file mode 100644 index 0000000..0cb709d Binary files /dev/null and b/Image/parking3.jpg differ diff --git a/Image/parking4.jpg b/Image/parking4.jpg new file mode 100644 index 0000000..18b2aaa Binary files /dev/null and b/Image/parking4.jpg differ diff --git a/Image/parking5.jpg b/Image/parking5.jpg new file mode 100644 index 0000000..8f52a31 Binary files /dev/null and b/Image/parking5.jpg differ diff --git a/Image/places.png b/Image/places.png new file mode 100644 index 0000000..227f279 Binary files /dev/null and b/Image/places.png differ diff --git a/Image/table.png b/Image/table.png new file mode 100644 index 0000000..c90fcc0 Binary files /dev/null and b/Image/table.png differ diff --git a/Image/work.png b/Image/work.png new file mode 100644 index 0000000..b6db54a Binary files /dev/null and b/Image/work.png differ diff --git a/bootstrap.min.js b/bootstrap.min.js new file mode 100644 index 0000000..96f57fd --- /dev/null +++ b/bootstrap.min.js @@ -0,0 +1,7 @@ +/*! + * Bootstrap v4.3.1 (https://getbootstrap.com/) + * Copyright 2011-2019 The Bootstrap Authors (https://github.com/twbs/bootstrap/graphs/contributors) + * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE) + */ +!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports,require("jquery"),require("popper.js")):"function"==typeof define&&define.amd?define(["exports","jquery","popper.js"],e):e((t=t||self).bootstrap={},t.jQuery,t.Popper)}(this,function(t,g,u){"use strict";function i(t,e){for(var n=0;nthis._items.length-1||t<0))if(this._isSliding)g(this._element).one(Q.SLID,function(){return e.to(t)});else{if(n===t)return this.pause(),void this.cycle();var i=ndocument.documentElement.clientHeight;!this._isBodyOverflowing&&t&&(this._element.style.paddingLeft=this._scrollbarWidth+"px"),this._isBodyOverflowing&&!t&&(this._element.style.paddingRight=this._scrollbarWidth+"px")},t._resetAdjustments=function(){this._element.style.paddingLeft="",this._element.style.paddingRight=""},t._checkScrollbar=function(){var t=document.body.getBoundingClientRect();this._isBodyOverflowing=t.left+t.right
',trigger:"hover focus",title:"",delay:0,html:!1,selector:!1,placement:"top",offset:0,container:!1,fallbackPlacement:"flip",boundary:"scrollParent",sanitize:!0,sanitizeFn:null,whiteList:Ee},je="show",He="out",Re={HIDE:"hide"+De,HIDDEN:"hidden"+De,SHOW:"show"+De,SHOWN:"shown"+De,INSERTED:"inserted"+De,CLICK:"click"+De,FOCUSIN:"focusin"+De,FOCUSOUT:"focusout"+De,MOUSEENTER:"mouseenter"+De,MOUSELEAVE:"mouseleave"+De},xe="fade",Fe="show",Ue=".tooltip-inner",We=".arrow",qe="hover",Me="focus",Ke="click",Qe="manual",Be=function(){function i(t,e){if("undefined"==typeof u)throw new TypeError("Bootstrap's tooltips require Popper.js (https://popper.js.org/)");this._isEnabled=!0,this._timeout=0,this._hoverState="",this._activeTrigger={},this._popper=null,this.element=t,this.config=this._getConfig(e),this.tip=null,this._setListeners()}var t=i.prototype;return t.enable=function(){this._isEnabled=!0},t.disable=function(){this._isEnabled=!1},t.toggleEnabled=function(){this._isEnabled=!this._isEnabled},t.toggle=function(t){if(this._isEnabled)if(t){var e=this.constructor.DATA_KEY,n=g(t.currentTarget).data(e);n||(n=new this.constructor(t.currentTarget,this._getDelegateConfig()),g(t.currentTarget).data(e,n)),n._activeTrigger.click=!n._activeTrigger.click,n._isWithActiveTrigger()?n._enter(null,n):n._leave(null,n)}else{if(g(this.getTipElement()).hasClass(Fe))return void this._leave(null,this);this._enter(null,this)}},t.dispose=function(){clearTimeout(this._timeout),g.removeData(this.element,this.constructor.DATA_KEY),g(this.element).off(this.constructor.EVENT_KEY),g(this.element).closest(".modal").off("hide.bs.modal"),this.tip&&g(this.tip).remove(),this._isEnabled=null,this._timeout=null,this._hoverState=null,(this._activeTrigger=null)!==this._popper&&this._popper.destroy(),this._popper=null,this.element=null,this.config=null,this.tip=null},t.show=function(){var e=this;if("none"===g(this.element).css("display"))throw new Error("Please use show on visible elements");var t=g.Event(this.constructor.Event.SHOW);if(this.isWithContent()&&this._isEnabled){g(this.element).trigger(t);var n=_.findShadowRoot(this.element),i=g.contains(null!==n?n:this.element.ownerDocument.documentElement,this.element);if(t.isDefaultPrevented()||!i)return;var o=this.getTipElement(),r=_.getUID(this.constructor.NAME);o.setAttribute("id",r),this.element.setAttribute("aria-describedby",r),this.setContent(),this.config.animation&&g(o).addClass(xe);var s="function"==typeof this.config.placement?this.config.placement.call(this,o,this.element):this.config.placement,a=this._getAttachment(s);this.addAttachmentClass(a);var l=this._getContainer();g(o).data(this.constructor.DATA_KEY,this),g.contains(this.element.ownerDocument.documentElement,this.tip)||g(o).appendTo(l),g(this.element).trigger(this.constructor.Event.INSERTED),this._popper=new u(this.element,o,{placement:a,modifiers:{offset:this._getOffset(),flip:{behavior:this.config.fallbackPlacement},arrow:{element:We},preventOverflow:{boundariesElement:this.config.boundary}},onCreate:function(t){t.originalPlacement!==t.placement&&e._handlePopperPlacementChange(t)},onUpdate:function(t){return e._handlePopperPlacementChange(t)}}),g(o).addClass(Fe),"ontouchstart"in document.documentElement&&g(document.body).children().on("mouseover",null,g.noop);var c=function(){e.config.animation&&e._fixTransition();var t=e._hoverState;e._hoverState=null,g(e.element).trigger(e.constructor.Event.SHOWN),t===He&&e._leave(null,e)};if(g(this.tip).hasClass(xe)){var h=_.getTransitionDurationFromElement(this.tip);g(this.tip).one(_.TRANSITION_END,c).emulateTransitionEnd(h)}else c()}},t.hide=function(t){var e=this,n=this.getTipElement(),i=g.Event(this.constructor.Event.HIDE),o=function(){e._hoverState!==je&&n.parentNode&&n.parentNode.removeChild(n),e._cleanTipClass(),e.element.removeAttribute("aria-describedby"),g(e.element).trigger(e.constructor.Event.HIDDEN),null!==e._popper&&e._popper.destroy(),t&&t()};if(g(this.element).trigger(i),!i.isDefaultPrevented()){if(g(n).removeClass(Fe),"ontouchstart"in document.documentElement&&g(document.body).children().off("mouseover",null,g.noop),this._activeTrigger[Ke]=!1,this._activeTrigger[Me]=!1,this._activeTrigger[qe]=!1,g(this.tip).hasClass(xe)){var r=_.getTransitionDurationFromElement(n);g(n).one(_.TRANSITION_END,o).emulateTransitionEnd(r)}else o();this._hoverState=""}},t.update=function(){null!==this._popper&&this._popper.scheduleUpdate()},t.isWithContent=function(){return Boolean(this.getTitle())},t.addAttachmentClass=function(t){g(this.getTipElement()).addClass(Ae+"-"+t)},t.getTipElement=function(){return this.tip=this.tip||g(this.config.template)[0],this.tip},t.setContent=function(){var t=this.getTipElement();this.setElementContent(g(t.querySelectorAll(Ue)),this.getTitle()),g(t).removeClass(xe+" "+Fe)},t.setElementContent=function(t,e){"object"!=typeof e||!e.nodeType&&!e.jquery?this.config.html?(this.config.sanitize&&(e=Se(e,this.config.whiteList,this.config.sanitizeFn)),t.html(e)):t.text(e):this.config.html?g(e).parent().is(t)||t.empty().append(e):t.text(g(e).text())},t.getTitle=function(){var t=this.element.getAttribute("data-original-title");return t||(t="function"==typeof this.config.title?this.config.title.call(this.element):this.config.title),t},t._getOffset=function(){var e=this,t={};return"function"==typeof this.config.offset?t.fn=function(t){return t.offsets=l({},t.offsets,e.config.offset(t.offsets,e.element)||{}),t}:t.offset=this.config.offset,t},t._getContainer=function(){return!1===this.config.container?document.body:_.isElement(this.config.container)?g(this.config.container):g(document).find(this.config.container)},t._getAttachment=function(t){return Pe[t.toUpperCase()]},t._setListeners=function(){var i=this;this.config.trigger.split(" ").forEach(function(t){if("click"===t)g(i.element).on(i.constructor.Event.CLICK,i.config.selector,function(t){return i.toggle(t)});else if(t!==Qe){var e=t===qe?i.constructor.Event.MOUSEENTER:i.constructor.Event.FOCUSIN,n=t===qe?i.constructor.Event.MOUSELEAVE:i.constructor.Event.FOCUSOUT;g(i.element).on(e,i.config.selector,function(t){return i._enter(t)}).on(n,i.config.selector,function(t){return i._leave(t)})}}),g(this.element).closest(".modal").on("hide.bs.modal",function(){i.element&&i.hide()}),this.config.selector?this.config=l({},this.config,{trigger:"manual",selector:""}):this._fixTitle()},t._fixTitle=function(){var t=typeof this.element.getAttribute("data-original-title");(this.element.getAttribute("title")||"string"!==t)&&(this.element.setAttribute("data-original-title",this.element.getAttribute("title")||""),this.element.setAttribute("title",""))},t._enter=function(t,e){var n=this.constructor.DATA_KEY;(e=e||g(t.currentTarget).data(n))||(e=new this.constructor(t.currentTarget,this._getDelegateConfig()),g(t.currentTarget).data(n,e)),t&&(e._activeTrigger["focusin"===t.type?Me:qe]=!0),g(e.getTipElement()).hasClass(Fe)||e._hoverState===je?e._hoverState=je:(clearTimeout(e._timeout),e._hoverState=je,e.config.delay&&e.config.delay.show?e._timeout=setTimeout(function(){e._hoverState===je&&e.show()},e.config.delay.show):e.show())},t._leave=function(t,e){var n=this.constructor.DATA_KEY;(e=e||g(t.currentTarget).data(n))||(e=new this.constructor(t.currentTarget,this._getDelegateConfig()),g(t.currentTarget).data(n,e)),t&&(e._activeTrigger["focusout"===t.type?Me:qe]=!1),e._isWithActiveTrigger()||(clearTimeout(e._timeout),e._hoverState=He,e.config.delay&&e.config.delay.hide?e._timeout=setTimeout(function(){e._hoverState===He&&e.hide()},e.config.delay.hide):e.hide())},t._isWithActiveTrigger=function(){for(var t in this._activeTrigger)if(this._activeTrigger[t])return!0;return!1},t._getConfig=function(t){var e=g(this.element).data();return Object.keys(e).forEach(function(t){-1!==Oe.indexOf(t)&&delete e[t]}),"number"==typeof(t=l({},this.constructor.Default,e,"object"==typeof t&&t?t:{})).delay&&(t.delay={show:t.delay,hide:t.delay}),"number"==typeof t.title&&(t.title=t.title.toString()),"number"==typeof t.content&&(t.content=t.content.toString()),_.typeCheckConfig(be,t,this.constructor.DefaultType),t.sanitize&&(t.template=Se(t.template,t.whiteList,t.sanitizeFn)),t},t._getDelegateConfig=function(){var t={};if(this.config)for(var e in this.config)this.constructor.Default[e]!==this.config[e]&&(t[e]=this.config[e]);return t},t._cleanTipClass=function(){var t=g(this.getTipElement()),e=t.attr("class").match(Ne);null!==e&&e.length&&t.removeClass(e.join(""))},t._handlePopperPlacementChange=function(t){var e=t.instance;this.tip=e.popper,this._cleanTipClass(),this.addAttachmentClass(this._getAttachment(t.placement))},t._fixTransition=function(){var t=this.getTipElement(),e=this.config.animation;null===t.getAttribute("x-placement")&&(g(t).removeClass(xe),this.config.animation=!1,this.hide(),this.show(),this.config.animation=e)},i._jQueryInterface=function(n){return this.each(function(){var t=g(this).data(Ie),e="object"==typeof n&&n;if((t||!/dispose|hide/.test(n))&&(t||(t=new i(this,e),g(this).data(Ie,t)),"string"==typeof n)){if("undefined"==typeof t[n])throw new TypeError('No method named "'+n+'"');t[n]()}})},s(i,null,[{key:"VERSION",get:function(){return"4.3.1"}},{key:"Default",get:function(){return Le}},{key:"NAME",get:function(){return be}},{key:"DATA_KEY",get:function(){return Ie}},{key:"Event",get:function(){return Re}},{key:"EVENT_KEY",get:function(){return De}},{key:"DefaultType",get:function(){return ke}}]),i}();g.fn[be]=Be._jQueryInterface,g.fn[be].Constructor=Be,g.fn[be].noConflict=function(){return g.fn[be]=we,Be._jQueryInterface};var Ve="popover",Ye="bs.popover",ze="."+Ye,Xe=g.fn[Ve],$e="bs-popover",Ge=new RegExp("(^|\\s)"+$e+"\\S+","g"),Je=l({},Be.Default,{placement:"right",trigger:"click",content:"",template:''}),Ze=l({},Be.DefaultType,{content:"(string|element|function)"}),tn="fade",en="show",nn=".popover-header",on=".popover-body",rn={HIDE:"hide"+ze,HIDDEN:"hidden"+ze,SHOW:"show"+ze,SHOWN:"shown"+ze,INSERTED:"inserted"+ze,CLICK:"click"+ze,FOCUSIN:"focusin"+ze,FOCUSOUT:"focusout"+ze,MOUSEENTER:"mouseenter"+ze,MOUSELEAVE:"mouseleave"+ze},sn=function(t){var e,n;function i(){return t.apply(this,arguments)||this}n=t,(e=i).prototype=Object.create(n.prototype),(e.prototype.constructor=e).__proto__=n;var o=i.prototype;return o.isWithContent=function(){return this.getTitle()||this._getContent()},o.addAttachmentClass=function(t){g(this.getTipElement()).addClass($e+"-"+t)},o.getTipElement=function(){return this.tip=this.tip||g(this.config.template)[0],this.tip},o.setContent=function(){var t=g(this.getTipElement());this.setElementContent(t.find(nn),this.getTitle());var e=this._getContent();"function"==typeof e&&(e=e.call(this.element)),this.setElementContent(t.find(on),e),t.removeClass(tn+" "+en)},o._getContent=function(){return this.element.getAttribute("data-content")||this.config.content},o._cleanTipClass=function(){var t=g(this.getTipElement()),e=t.attr("class").match(Ge);null!==e&&0=this._offsets[o]&&("undefined"==typeof this._offsets[o+1]||t UI.addEntryToTable(entry)); + } + static addEntryToTable(entry){ + const tableBody=document.querySelector('#tableBody'); + const row = document.createElement('tr'); + row.innerHTML = ` ${entry.firstName} + ${entry.lastName} + ${entry.mobileNumber} + ${entry.licensePlate} + ${entry.entryDate} + ${entry.exitDate} + + `; + tableBody.appendChild(row); + } + static clearInput(){ + //Selects all the inputs + const inputs = document.querySelectorAll('.form-control'); + //Clear the content of each input + inputs.forEach((input)=>input.value=""); + } + static deleteEntry(target){ + if(target.classList.contains('delete')){ + target.parentElement.parentElement.remove(); + } + } + static showAlert(message,className){ + const div = document.createElement('div'); + div.className=`alert alert-${className} w-50 mx-auto`; + div.appendChild(document.createTextNode(message)); + const formContainer = document.querySelector('.form-container'); + const form = document.querySelector('#entryForm'); + formContainer.insertBefore(div,form); + setTimeout(() => document.querySelector('.alert').remove(),3000); + } + static validateInputs(){ + const firstName = document.querySelector('#firstName').value; + const lastName = document.querySelector('#lastName').value; + const mobileNumber = document.querySelector('#mobileNumber').value; + const licensePlate = document.querySelector('#licensePlate').value; + const entryDate = document.querySelector('#entryDate').value; + const exitDate = document.querySelector('#exitDate').value; + var licensePlateRegex = /[A-Z]{2}-[0-9]{2}[ -]?[A-Z]{1}-[0-9]{4}/; + if(firstName === '' || lastName === '' || mobileNumber === '' || licensePlate === '' || entryDate === '' || exitDate === ''){ + UI.showAlert('All fields must me filled!','danger'); + return false; + } + if(exitDate < entryDate){ + UI.showAlert('Exit Date cannot be lower than Entry Date','danger'); + return false; + } + if(!licensePlateRegex.test(licensePlate)){ + UI.showAlert('License Plate must be like MH-12 K-1234','danger'); + return false; + } + return true; + } +} + +//Store Class: Handle Local Storage +class Store{ + static getEntries(){ + let entries; + if(localStorage.getItem('entries') === null){ + entries = []; + } + else{ + entries = JSON.parse(localStorage.getItem('entries')); + } + return entries; + } + static addEntries(entry){ + const entries = Store.getEntries(); + entries.push(entry); + localStorage.setItem('entries', JSON.stringify(entries)); + } + static removeEntries(licensePlate){ + const entries = Store.getEntries(); + entries.forEach((entry,index) => { + if(entry.licensePlate === licensePlate){ + entries.splice(index, 1); + } + }); + localStorage.setItem('entries', JSON.stringify(entries)); + } +} +//Event Display + document.addEventListener('DOMContentLoaded',UI.displayEntries); +//Event Add + document.querySelector('#entryForm').addEventListener('submit',(e)=>{ + // e.preventDefault(); + + //Declare Variables + const firstName = document.querySelector('#firstName').value; + const lastName = document.querySelector('#lastName').value; + const mobileNumber = document.querySelector('#mobileNumber').value; + const licensePlate = document.querySelector('#licensePlate').value; + const entryDate = document.querySelector('#entryDate').value; + const exitDate = document.querySelector('#exitDate').value; + if(!UI.validateInputs()){ + return; + } + //Instatiate Entry + const entry = new Entry(firstName, lastName, mobileNumber, licensePlate, entryDate, exitDate); + //Add the entry do de UI table + UI.addEntryToTable(entry); + Store.addEntries(entry); + //Delete content of input's + UI.clearInput(); + + UI.showAlert('Car successfully added to the parking lot','success'); + + }); +//Event Remove + document.querySelector('#tableBody').addEventListener('click',(e)=>{ + //Call to UI function that removes entry from the table + UI.deleteEntry(e.target); + //Get license plate to use as unique element of an entry + var licensePlate = e.target.parentElement.previousElementSibling.previousElementSibling.previousElementSibling.textContent; + //Call to Store function to remove entry from the local storage + Store.removeEntries(licensePlate); + var mobileNumber = e.target.parentElement.previousElementSibling.previousElementSibling.previousElementSibling.textContent; + Store.removeEntries(mobileNumber); + //Show alert that entry was removed + UI.showAlert('Car successfully removed from the parking lot list','success'); + }) + +//Event Search + document.querySelector('#searchInput').addEventListener('keyup', function searchTable(){ + //Get value of the input search + const searchValue = document.querySelector('#searchInput').value.toUpperCase(); + //Get all lines of table body + const tableLine = (document.querySelector('#tableBody')).querySelectorAll('tr'); + //for loop #1 (used to pass all the lines) + for(let i = 0; i < tableLine.length; i++){ + var count = 0; + //Get all collumns of each line + const lineValues = tableLine[i].querySelectorAll('td'); + //for loop #2 (used to pass all the collumns) + for(let j = 0; j < lineValues.length - 1; j++){ + //Check if any collumn of the line starts with the input search string + if((lineValues[j].innerHTML.toUpperCase()).startsWith(searchValue)){ + count++; + } + } + if(count > 0){ + //If any collumn contains the search value the display block + tableLine[i].style.display = ''; + }else{ + //Else display none + tableLine[i].style.display = 'none'; + } + } + }) \ No newline at end of file diff --git a/index.html b/index.html new file mode 100644 index 0000000..4033922 --- /dev/null +++ b/index.html @@ -0,0 +1,84 @@ + + + + + + + + + +

Park Yours Vehicles

+ +
+
    +
  • +
      +

    • Fire truck Parking Only

      • +

    • 24hrs
      • +
    • Mon Thru Fri

      • +
    +
    • +
  • +
      +

    • Ambulance Parking Only

      • +

    • 24hrs
      • +
    • Saturday to Sunday

      • +
    +
    • +
  • +
      +

    • Car Parking

      • +

    • 3am to 9pm
      • +
    • Mon Thru Fri

      • +
    +
    • +
  • +
      +

    • Bike Parking

      • +

    • 2am to 10pm
      • +
    • Mon Thru Fri

      • +
    +
    • + + +
  • +
      +

    • Bicycle Parking

      • +

    • 3pm to 6pm
      • +
    • Mon Thru Fri

      • +
    +
    • +
+
+ +

Click On Vehicles That You Want to Parking

+
+
+
    +
  • + + fire truck +
    • +
  • + ambulance +
    • +
  • + car +
    • + +
  • + car +
    • + + +
  • + bicycle +
    • +
+ + + +
+
+ + \ No newline at end of file diff --git a/index1.html b/index1.html new file mode 100644 index 0000000..5bf76a2 --- /dev/null +++ b/index1.html @@ -0,0 +1,310 @@ + + + + + + + + + + + + + + + + + + + Parking Lot + + + + + +
+

Add Vehicle to the Parking Lot

+
+
+ + +
+
+ + +
+
+ + +
+
+ + +
+
+
+ + +
+
+ + +
+
+ +
+
+
+
+
+
+ + + + +
+
+ + + Charges will be taken on using our parking services which will be included in the total bill of hotel. + + + For extra time...Extra charges will be taken. + + + For any complaint and query Contact Us + + +
+
+ + +
+
+ + + + + + + + + + + + + + + \ No newline at end of file diff --git a/parking (2).svg b/parking (2).svg new file mode 100644 index 0000000..23678bc --- /dev/null +++ b/parking (2).svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..f63b960 --- /dev/null +++ b/style.css @@ -0,0 +1,115 @@ +body { + background-color: #E2E8F3; + font-size: .8em; + font-family: "Roboto", Arial, Helvetica, sans-serif; + + } + + ul li { + list-style-type: none; + } + img { + cursor: pointer; + width: 200px; + } + + .container { + height: 200%; + display: flex; + justify-content: space-around; + align-items: center; + } + .parking-rules { + padding: 0; + } + .parking-rules > .parking-rule { + display: flex; + justify-content: center; + text-align: center; + background: #FDFEFE; + padding: 16px; + margin: 12px; + } + .parking-rule:nth-child(n) { + border: 2px solid #538cff; + } + .parking-rule:nth-child(2n) { + border: 2px solid #d51c00; + } + .parking-rule:nth-child(3n) { + border: 2px solid #ffd92e; + } + .parking-rule ul { + padding: 0; + } + .parking-rule li:first-child { + font-weight: 700; + text-transform: uppercase; + } + .drop-zone { + position: relative; + width: 300px; + height: 300px; + overflow: hidden; + background: #878787; + color: white; + box-shadow: 0 19px 38px rgba(0,0,0,0.30), 0 15px 12px rgba(0,0,0,0.22); + } + + .drop-zone { + display: flex; + align-items: center; + justify-content: center; + } + + @import url(""); + + h1{ + font-family: 'Roboto', sans-serif; + } + + #changingText { + color: #ffd166; + border-right: 1px solid black; + animation: cursoranim 1s linear infinite; + } + + @keyframes cursoranim { + 50% { + border-right: 1px solid rgba(0, 0, 0, 0); + } + } + + /*body { + margin: 0; + padding: 0; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; + background-color: #000; + }*/ + + p { + position: relative; + font-family: sans-serif; + text-transform:none; + font-size: 2em; + letter-spacing: 4px; + overflow: hidden; + background: linear-gradient(90deg, #000, #fff, #000); + background-repeat: no-repeat; + background-size: 80%; + animation: animate 3s linear infinite; + -webkit-background-clip: text; + -webkit-text-fill-color: rgba(255, 255, 255, 0); + } + + @keyframes animate { + 0% { + background-position: -500%; + } + 100% { + background-position: 500%; + } + } \ No newline at end of file diff --git a/style1.css b/style1.css new file mode 100644 index 0000000..376f558 --- /dev/null +++ b/style1.css @@ -0,0 +1,255 @@ +*{ + font-family: 'Roboto', sans-serif; + padding:0; + margin:0; + border:0 +} + +.main { + background: #9D0441; +} + +.form-container { + /*background-image: url("Image/Copy of Untitled.png");*/ + width: 100%; + height: 100%; + background-position: center; + background-size: cover; + margin: 0; + padding: 0%; +} + +.form-container h2{ + padding: 4% 0 3% 0; + font-weight: bold; + font-family: 'Lobster', cursive; +} + +.form-container label{ + font-weight: bold; +} + +.asteriskField{ + color: red; +} + +#btnOne{ + color:white; + +} +#btnOne:focus,#btnOne:hover{ + box-shadow: none; + outline:none; +} + + + +.tab-info{ + /*background-image: url("Image/table.png");*/ + width: 100%; +} + +.tab-info h2{ + font-weight: bold; + padding-top: 2%; + font-family: 'Lobster', cursive; +} + +.table-container { + padding-top: 6%; + width: 100%; + font-weight: bold; + padding-left: 2%; + padding-right: 2%; + background: transparent; + margin: 0; +} + +#tableHead{ + background-color:#9D0441; + color: white; +} + +#searchInput{ + height: calc(1.5em + .75rem + 2px); + padding: .375rem .75rem; + border-bottom: 1px solid #ced4da; +} +#searchInput:hover,#searchInput:focus{ + box-shadow: none; + outline:none; +} + +.work img{ + width: 100%; +} + + + +/* Footer css */ +.element-btn .element-fill-btn { + background-color: #ff6600; + border: 0; + color: #fff; + padding: 13px 5px; + font-size: 16px; + font-weight: 900; + font-style: italic; + text-transform: uppercase; + width: 252px; + margin: 0 auto; + border-radius: 25px; + transition: all 0.3s ease-in-out; + -webkit-transition: all 0.3s ease-in-out; + -moz-transition: all 0.3s ease-in-out; + -ms-transition: all 0.3s ease-in-out; + box-shadow: 0px 10px 50px -10px rgba(255, 10, 120, 1); + +} + + +.fill-btn { + background-color: #ff6600; + border: 0; + color: #fff; + padding: 13px 5px; + font-size: 16px; + font-weight: 900; + font-style: italic; + text-transform: uppercase; + width: 252px; + margin: 0 auto; + border-radius: 25px; + position: absolute; + bottom: -25px; + left: 50%; + transform: translate(-50%, 0); + -webkit-transform: translate(-50%, 0); + -moz-transform: translate(-50%, 0); + -ms-transform: translate(-50%, 0); + transition: all 0.3s ease-in-out; + -webkit-transition: all 0.3s ease-in-out; + -moz-transition: all 0.3s ease-in-out; + -ms-transition: all 0.3s ease-in-out; + +} +.fill-btn:hover, +.element-btn .element-fill-btn:hover { + background-color: #201f1f; + box-shadow: 0px 10px 50px -10px rgb(32, 31, 31); +} + + +.footer { + position: relative; + background-color: #201f1f; + padding:50px 0px; +} + +.footerBg { + position: absolute; + top: 0; + bottom: 0; + opacity: 0.13; + background: url('http://placehold.it/1920x677') no-repeat top center; + background-size: cover; + width: 100%; + height: 100%; +} +.form-Box input[type="text"], +.form-Box input[type="email"], +.form-Box input[type="passowrd"], +.form-Box textarea { + width: 100%; + height: 50px; + border: 1px solid #737373; + border-radius: 25px; + background-color: transparent; + padding: 5px 25px; + margin-bottom: 20px; + font-size: 14px; + color: #737373; + font-style: italic; + -webkit-transition: all 0.3s ease-in-out; + -moz-transition: all 0.3s ease-in-out; + transition: all 0.3s ease-in-out; + text-transform: uppercase; +} +.form-Box textarea { + height: 113px; + padding: 15px 25px; + resize: none; +} +.form-Box .b_effect:focus, +.subscribe form input:focus { + border-color: #ff6600; +} + +.form-Box .fill-btn { + position: static; + transform: translate(0%, 0); + -webkit-transform: translate(0%, 0); + -moz-transform: translate(0%, 0); + -ms-transform: translate(0%, 0); + width: 184px; +} + +.form-Box .fill-btn:hover, +.subscribe form .fill-btn:hover { + background-color: #ffe402; + color: #201f1f; + box-shadow: 0px 10px 50px -10px rgb(255, 228, 2); +} + +.fTitle { + font-weight: 900; + color: #ffffff; + text-transform: uppercase; + font-style: italic; + margin-bottom: 20px; +} + +.fTitle span { + color: #ff6600; +} + +.contact-address ul li, +.contact-address ul li a { + color: #737373; + font-size: 16px; + font-style: italic; + margin-bottom: 15px; + line-height: 32px; + transition: all 0.3s ease-in-out; + -webkit-transition: all 0.3s ease-in-out; + -moz-transition: all 0.3s ease-in-out; + -ms-transition: all 0.3s ease-in-out; +} + +.contact-address { + padding: 0 15%; +} + +.contact-address ul li i { + margin-right: 15px; + display: inline-block; + float: left; + line-height: 32px; +} + +.contact-address ul li span { + display: table; +} + +.contact-address ul li a:hover { + color: #ff6600; +} + + + + + + + + +