From 2be12ca98f3920be355d44e712357de657aa72e2 Mon Sep 17 00:00:00 2001 From: GusCohen Date: Sun, 26 Apr 2020 21:26:55 -0300 Subject: [PATCH] Uploading Files --- .DS_Store | Bin 6148 -> 6148 bytes contact.html | 62 +++++++ css/.DS_Store | Bin 6148 -> 0 bytes css/index.css | 409 ++++++++++++++++++++++++++++++++++++++++- index.html | 20 +- less/contact-page.less | 43 +++++ less/global.less | 5 + less/home-page.less | 83 ++++++++- less/index.less | 8 + less/mixins.less | 8 +- less/navigation.less | 58 +++++- less/variables.less | 7 +- 12 files changed, 697 insertions(+), 6 deletions(-) create mode 100644 contact.html delete mode 100644 css/.DS_Store create mode 100644 less/contact-page.less diff --git a/.DS_Store b/.DS_Store index faa2d1e8033fd02b072cf79d3c910bfa4d4dc364..61f74776dcf05bf619048f8f7d84b9e797df2e26 100644 GIT binary patch literal 6148 zcmeHKu};G<5IvI&6(H0F1Y4GlKszI(P=zn(2t!2zrBX^NwcYat2qFH8je&u$;hlYi zm?n&X(4AyI_s-{cep2k3h|F-64T!o#)InnmH_?hS$g^gHc+{=4&(6 zp$e!1e^CMcc0)R%2~BC~eZR-2FZI~0NRn)|Oo`r}UmxvOs=Qf|wZ`VRwKJh_kA{F! zTF}B{qrDTXDUlji`gCu(sz}B3CF1c=#7Wzf(KVQ+*xel+(hWvAdpzde<;8b%8)|7? zx2D5Kb**!~dV6E8H$Z(ent0U(!P#e|p%%$$V3vr-6ZDxUbSlsyTcr6_QRJS}qo;$N zdO|}1)nW}LR57mzdSE`aUsnKkHd|-Qq4uhPDxeBf3h?<5p)tmSr9*pkptDZ^Us}hc2CrJU)yt8+oA^%Z~LUJDp7IP!@kF-METTwe z$Eus|fGv*?fnNZ=gf({_EoqXXE+RzHTxsUa+?PG)$}=7SAdP`v126$V$Hq{*jNKez zcGhNONouYj5|$(DdolHJ_S5Uncq@fsKr!&IF~Gjv5_BMg%o|RAzj2i1)#?wjRMIY7 zyrdh(a@ik_8zn)?bBi3$cB90n!v-BBe#ZS}a$Ub^hk`{zH`?a< zXjI#{SFc$0JDcN*HQL&$R;-Qs-SODa*KgGyzu0?y@b=yN4CEnT?QWlXoF^q_lwE5BJ|m9H+Q@|=q)hBQ&OFYU1$Xj0(3cmSSEW-7CsQBl9-z8{NFzP{(mw^%@hNQf&YpDqBWgn1D7Pv)|thzv)01)5*ridR|w=G*vaFV h57<$>hK&o_EH*&2B^ClvgQ9)}I1Q>(4E$9FegQd5_dx&v diff --git a/contact.html b/contact.html new file mode 100644 index 0000000000..ebe4ae5ff3 --- /dev/null +++ b/contact.html @@ -0,0 +1,62 @@ + + + + + + + Fun Bus Travel Agency - Solution + + + + + + + + + + + +
+ main image + +
+

contact the fun Bus!

+

Please submit the form below to contact us!

+
+ +
+ +
+ +
+
+

Contact Form

+ +
+
+ + + + + +
+
+ +
+ +
+

Copyright Fun Bus 2018

+
+ + + \ No newline at end of file diff --git a/css/.DS_Store b/css/.DS_Store deleted file mode 100644 index 5008ddfcf53c02e82d7eee2e57c38e5672ef89f6..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 6148 zcmeH~Jr2S!425mzP>H1@V-^m;4Wg<&0T*E43hX&L&p$$qDprKhvt+--jT7}7np#A3 zem<@ulZcFPQ@L2!n>{z**++&mCkOWA81W14cNZlEfg7;MkzE(HCqgga^y>{tEnwC%0;vJ&^%eQ zLs35+`xjp>T0 - + + +
+ main image + +
+

welcome to fun Bus!

+

Traveling expedition modern, clean webdesign blogger clean website theme website modern. Design pretty design, travelblogger adventure WordPress wanderlust theme blogger website expedition theme travelblogger. Adventure fun traveler pretty design website expedition.

+
+ +
diff --git a/less/contact-page.less b/less/contact-page.less new file mode 100644 index 0000000000..c4612c7d34 --- /dev/null +++ b/less/contact-page.less @@ -0,0 +1,43 @@ + +body.contact { + flex-flow: column nowrap; + + h2 { + padding: 20px 0; + + @media @mobile { + text-align: center; + } + } +} + + + +form { + display: flex; + flex-flow: column nowrap; + + @media @mobile { + padding: 20px; + } + + input, textarea { + padding: 10px 20px; + margin-bottom: 20px; + width: 50%; + border: 1px solid gray; + + @media @mobile { + width: 100%; + } + } + + input[type="submit"] { + .buttonstyle(#fff,@my-btn-color,10px); + + &:hover { + background-color: lighten(@my-btn-color,10); + cursor: pointer; + } + } +} \ No newline at end of file diff --git a/less/global.less b/less/global.less index abe21bf970..bbf8ba848b 100644 --- a/less/global.less +++ b/less/global.less @@ -43,4 +43,9 @@ img { max-width: 800px; width: 100%; margin: 0 auto; + + @media @mobile { + max-width: 500px; + + } } diff --git a/less/home-page.less b/less/home-page.less index 5528d8a7a5..c22d90e953 100644 --- a/less/home-page.less +++ b/less/home-page.less @@ -6,19 +6,39 @@ flex-wrap: wrap; justify-content: space-between; + @media @mobile { + padding: 20px; + flex-flow: column nowrap; + align-content: center; + + } + .text-content { width: 48%; padding-right: 1%; + + @media @mobile { + width: 100%; + } + } .img-content { width: 48%; padding-left: 1%; + @media @mobile { + width: 100%; + } + img { border-radius: 10px; + + @media @mobile { + min-width: 100%; + } } } } @@ -27,6 +47,10 @@ padding-bottom: 30px; border-bottom: 2px dashed @navigation-border; + @media @mobile { + flex-flow: column-reverse nowrap; + } + .text-content { padding-left: 1%; padding-right: 0; @@ -45,6 +69,11 @@ img { border-radius: 10px; } + + @media @mobile { + padding: 20px; + width: 100%; + } } .content-pick { @@ -56,6 +85,58 @@ .destination { width: 30%; margin-bottom: 30px; + + @media @mobile { + width: 100%; + padding: 0 70px; + } + + } + + @media @mobile { + flex-flow: column nowrap; + } + + } + + .btn { + padding: 15px 25px; + font-size: 1.6rem; + text-align: center; + margin-top: 10px; + .buttonstyle(#fff,@my-btn-color,10px); + + &:hover { + background-color: lighten(@my-btn-color,10); + cursor: pointer; } } -}// home \ No newline at end of file +}// home + +header { + border-top: 2px dashed @navigation-border; + display: flex; + flex-flow: column nowrap; + align-items: center; + + img { + margin-bottom: 20px; + max-width: 800px; + + @media @mobile { + max-width: 500px; + } + } + + .header-content { + width: 100%; + max-width: 800px; + padding: 20px 0; + border-bottom: 2px dashed @navigation-border; + + @media @mobile { + padding: 20px; + + } + } +} \ No newline at end of file diff --git a/less/index.less b/less/index.less index c113ca2c46..5cccdfa3b1 100644 --- a/less/index.less +++ b/less/index.less @@ -1 +1,9 @@ // Follow the order in the readme +@import "variables.less"; +@import "mixins.less"; +@import "reset.less"; +@import "global.less"; +@import "navigation.less"; +@import "footer.less"; +@import "home-page.less"; +@import "contact-page"; \ No newline at end of file diff --git a/less/mixins.less b/less/mixins.less index 2d5c603558..322bcda3c2 100644 --- a/less/mixins.less +++ b/less/mixins.less @@ -1 +1,7 @@ -// Mixins in here \ No newline at end of file +// Mixins in here + +.buttonstyle(@fontcolor,@buttoncolor,@borderadius) { + color: @fontcolor; + background: @buttoncolor; + border-radius: @borderadius; +} diff --git a/less/navigation.less b/less/navigation.less index f89120a0f1..20136c497c 100644 --- a/less/navigation.less +++ b/less/navigation.less @@ -1 +1,57 @@ -// Navigation Styles here \ No newline at end of file +// Navigation Styles here + +.nav { + max-width: 800px; + display: flex; + flex-flow: row nowrap; + justify-content: space-between; + margin: 0 auto; + padding: 40px 0; + + @media @mobile { + max-width: 500px; + flex-flow: column nowrap; + align-items: center; + padding: 20px 0 10px 0; + } + + nav { + margin-top: 20px; + + a { + margin: 0 10px; + font-size: 2rem; + text-transform: capitalize; + text-decoration: none; + color: #000; + + &:hover { + color: red; + } + + @media @mobile { + font-size: 1.5rem; + } + } + + .current { + color: red; + } + + @media @mobile { + margin-top: 10px; + } + + } + + .logo { + font-family: 'Indie Flower', cursive; + font-size: 5rem; + text-decoration: none; + color: #000; + + &:hover { + color: red; + } + } +} \ No newline at end of file diff --git a/less/variables.less b/less/variables.less index 916eb0b7e0..bef4e2ea3d 100644 --- a/less/variables.less +++ b/less/variables.less @@ -5,10 +5,15 @@ @main-bg: @white; @navigation-border: @silver; @footer-bg: @sandy-beach; +@my-btn-color: #018080; // Colors @white: #FFFFFF; @silver: #C0C0C0; @shark: #212529; @eastern-blue: #17A2B8; -@sandy-beach: #FFEBCD; \ No newline at end of file +@sandy-beach: #FFEBCD; + +//Mobile + +@mobile: ~"(max-width: 500px)"; \ No newline at end of file