iceholidays-frontend 0.2.0 → 0.4.0

data/app/assets/stylesheets/iceholidays/frontend/application.scss

@@ -1,850 +0,0 @@
-/*
- * This is a manifest file that'll be compiled into application.css, which will include all the files
- * listed below.
- *
- * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
- * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
- *
- * You're free to add application-wide styles to this file and they'll appear at the bottom of the
- * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
- * files in this directory. Styles in this file should be added after the last require_* statement.
- * It is generally better to create a new file per style scope.
- *
- *= require_tree .
- *= require_self
- */
-
- @import url("//fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,200;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,200;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");
-
- $font-default: Poppins, san-serif;
-
- .ant-tabs >.ant-tabs-nav{
-  margin: 0;
- }
-
- .ant-tabs-nav {
-  width: 100% !important;
-}
-
-.ant-tabs-card.ant-tabs-top >.ant-tabs-nav {
-  .ant-tabs-tab {
-  display: block; // centers text inside tabs
-  flex: 1;
-  text-align: center;
-  justify-content: center;
-  background: #FAFAFA;
-  border-color: #EBEBEB;
-  border-bottom-color: #DCB062;
-
-  &+.ant-tabs-tab{
-    margin:0;
-  }
-
-    .ant-tabs-tab-btn {
-      text-transform: uppercase;
-      font-family: $font-default;
-      font-size: 20px;
-      font-weight: 400;
-      line-height: 30px;
-      letter-spacing: 0.05em;
-      text-align: center;
-      text-underline-position: from-font;
-      text-decoration-skip-ink: none;
-      color: #DCB062;
-    }
-
-    &.ant-tabs-tab-active{
-      background: linear-gradient(360deg, #F9E298 -1.58%, #DCB062 92.51%);
-      z-index: 1;
-      border-bottom-color: #DCB062;
-      .ant-tabs-tab-btn {
-        color: white !important;
-      }
-    }
-  }
-}
-
-.ant-tabs-nav > div:nth-of-type(1) {
-display: unset !important;
-width: 100% !important;
-}
-  
-
-[class~='ant-carousel'] {
-  [class~='slick-dots'] {
-    bottom: 30px;
-
-    li {
-      width: 15px !important;
-
-      button{
-        width: 13px;
-        height: 13px;
-        border-radius: 100%;
-        background-color: transparent;
-        border: 1px solid #FFFFFF;
-        opacity: 1;
-      }
-
-      &.slick-active {
-        button {
-          width: 13px;
-          height: 13px;
-          border-radius: 100%;
-          background-color: white;
-        }
-      }
-    }
-  }
- 
-}
-
-body{
-  margin: 0;
-  background: #F2F2F2;
-}
-
-#header{
-  position: relative;
-  background: linear-gradient(241.37deg, #D1AC6E -108.33%, #D1AC6E -14.72%, #F9E298 -2.73%, #B68B31 108.18%);
-  width: 100%;
-  height: 50px;
-  display: flex;
-  align-items: center;
-  justify-content: space-around;
-}
-
-#header>div{
-  display: flex;
-  align-items: center;
-  justify-content: space-around;
-}
-
-.nav-menu{
-  /* position: absolute; */
-  display: grid;
-  grid-template-columns: auto auto auto auto;
-}
-
-.nav-menu a{
-  color: white;
-  text-transform: uppercase;
-  font-family: $font-default;
-  font-size: 16px;
-  font-weight: 500;
-  line-height: 24px;
-  letter-spacing: 0.05em;
-  text-align: left;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-
-}
-
-#left-menu{
-  top: 13px;
-  left: 183px;
-  gap: 35px;
-  opacity: 0px;
-}
-
-.logo{
-  width: 304px;
-  height: 66px;
-  left: 568px;
-  gap: 0px;
-  opacity: 0px;
-  z-index: 2;
-}
-
-#right-menu{
-  top: 13px;
-  left: 877px;
-  gap: 35px;
-  opacity: 0px;
-}
-
-#get-brochure{
-  position: absolute;
-  width: 152px;
-  /* height: 35px; */
-  top: 4px;
-  left: 1247px;
-  padding: 7px 8px 7px 8px;
-  gap: 7px;
-  border-radius: 20px;
-  border: 1px 0px 0px 0px;
-  opacity: 0px;
-  background: linear-gradient(287.63deg, #D1AC6E -19.9%, #D1AC6E 10.87%, #F9E298 26.63%, #B68B31 93.91%);
-  border: 1px solid;
-  border-image-source: linear-gradient(0deg, rgba(255, 255, 255, 0.5) 0%, rgba(42, 42, 42, 0.5) 100%);
-  box-shadow: 0px 3px 10px 0px #AA853E80;
-  box-shadow: 0px 4px 4px 0px #F9F6F31A inset;
-  text-align: center;
-  text-transform: uppercase;
-}
-
-#get-brochure span{
-  font-family: $font-default;
-  font-size: 14px;
-  font-weight: 500;
-  line-height: 21px;
-  letter-spacing: 0.05em;
-  text-align: left;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-}
-
-#search-bar{
-  width: 738px;
-  height: 84px;
-  top: 50px;
-  left: 349px;
-  gap: 0px;
-  opacity: 0px;
-  position: absolute;
-  display: flex;
-  justify-content: center;
-  z-index: 1;
-}
-
-#search-bar-widget{
-  width: 427px;
-  height: 60px;
-  padding: 10px 0px 15px 0px;
-  gap: 7px;
-  opacity: 0px;
-  background: #F7F4EB;
-
-  .ant-space{
-    justify-content: center;
-    width: 100%;
-  }
-
-  .ant-form-item{
-    margin: 0;
-
-    .ant-form-item-label{
-      padding-bottom: 3px;
-      
-      label{
-        font-family: Poppins;
-        font-size: 12px;
-        font-weight: 400;
-        line-height: 16.5px;
-        letter-spacing: 0.05em;
-        text-align: left;
-        text-underline-position: from-font;
-        text-decoration-skip-ink: none;
-      }
-    }
-  }
-
-  .search-button{
-    background: #AA853E;
-    border-radius: 20px;
-
-    span{
-      font-family: Poppins;
-      font-size: 12px;
-      font-weight: 600;
-      line-height: 18px;
-      text-align: center;
-      text-underline-position: from-font;
-      text-decoration-skip-ink: none;
-
-    }
-  }
-
-  .ant-picker .ant-picker-input span.ant-picker-suffix {
-    margin-left: 1px;
-    margin-right: 10px;
-    order: -1;
-    color: #AA853E;
-  }
-}
-
-
-.flip{
-  -webkit-transform: scaleX(-1);
-  transform: scaleX(-1);
-}
-
-#cover{
-  width: 1440px;
-  height: 760px;
-  gap: 0px;
-  border-radius: 0px 0px 50px 50px;
-  opacity: 0px;
-  /* position: relative; */
-
-}
-
-#tagline{
-  width: 989.63px;
-  height: 108.42px;
-  top: 304px;
-  left: 223.69px;
-  gap: 0px;
-  opacity: 0px;
-  position: absolute;
-  text-align: center;
-}
-
-#tagline span{
-  font-family: $font-default;
-  font-size: 45px;
-  font-weight: 600;
-  line-height: 69px;
-  letter-spacing: 0.01em;
-  text-align: center;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-  color: #FFFFFF;
-  text-transform: uppercase;
-
-}
-
-#popular-destinations{
-  margin: auto;
-  width: 80%;
-}
-
-#popular-destinations h1{
-  font-family: $font-default;
-  font-size: 45px;
-  font-weight: 200;
-  line-height: 67.5px;
-  text-align: center;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-  text-transform: uppercase;
-  color: #545047;
-}
-
-
-.top-cities h2{
-  font-family: $font-default;
-  font-size: 30px;
-  font-weight: 600;
-  line-height: 45px;
-  letter-spacing: 0.05em;
-  text-align: left;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-
-}
-
-#city-group{
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  grid-template-rows: repeat(2, 1fr);
-  gap: 20px;
-}
-
-.top-cities .city-cover{
-  border-radius: 20px;
-}
-
-.city-cover{
-  width: 540px;
-}
-.city-cover img{
-  width: 100%;
-  height: 230.5px;
-  gap: 0px;
-  opacity: 0px;
-  border-top-left-radius: 20px;
-  border-top-right-radius: 20px;
-  display: block;
-  object-fit: cover;
-  object-position: top center;
-
-}
-
-.top-cities .city-details{
-  /* width: Fill (540px)px;
-  height: Hug (54px)px; */
-  padding: 12px 20px 12px 20px;
-  gap: 0px;
-  border: 1px 0px 0px 0px;
-  justify-content: space-between;
-  align-items: center;
-  opacity: 0px;
-  background: #DCB062;
-  display: flex;;
-  border-bottom-left-radius: 20px;
-  border-bottom-right-radius: 20px;
-}
-
-.city-details .city-name{
-  font-family: $font-default;
-font-size: 20px;
-font-weight: 400;
-line-height: 30px;
-letter-spacing: 0.05em;
-text-align: left;
-text-underline-position: from-font;
-text-decoration-skip-ink: none;
-text-transform: uppercase;
-color: #FFFFFF;
-}
-
-.city-details .tour-count{
-  font-family: $font-default;
-font-size: 14px;
-font-weight: 400;
-line-height: 21px;
-letter-spacing: 0.05em;
-text-align: right;
-text-underline-position: from-font;
-text-decoration-skip-ink: none;
-color: #FFFFFF;
-cursor: pointer;
-
-}
-
-.city-details .tour-count:hover{
-  text-decoration: underline;
-}
-
-.country-info {
-  position: relative;
-
-  .country-image{
-    width: 100%;
-    height: 392px;
-    object-fit: cover;
-    object-position: center;
-    border-width: 5px 0px 5px 0px;
-    border-style: solid;
-    border-color: #DCB062;
-    border-radius: 20px;
-  }
-
-  .country-name{
-    width: 160px;
-    height: 71px;
-    top: 58px;
-    left: 45px;
-    gap: 0px;
-    opacity: 0px;
-    position: absolute;
-  }
-
-  .bottom-logo{
-    position: absolute;
-    bottom: -40px;
-    border-color: #F2F2F2;
-    left: 0;
-    width: 100%;
-  }
-}
-#testimonial{
-  background: #F7F4EB;
-  margin-top: 100px;
-
-}
-
-#testimonial #testimonial-header{
-  height: 138px;
-  gap: 0px;
-  opacity: 0px;
-  text-align: center;
-  position: relative;
-}
-
-#testimonial #testimonial-header>span{
-  font-family: $font-default;
-  font-size: 45px;
-  font-weight: 200;
-  line-height: 67.5px;
-  letter-spacing: 0.06em;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-  color: #5B4713;
-  text-transform: uppercase;
-
-  position: absolute;
-  bottom: 20px;
-  left: 50%;
-  transform: translate(-50%, 20px);
-}
-
-#testimonials{
-  // display: grid;
-  // gap: 20px;
-  // grid-template-columns: auto auto auto;
-  max-width: 1099px;
-  margin: auto;
-  padding: 50px 170px 70px 170px;
-  // gap: 20px;
-}
-.testimonial{
-  width: 317.33px !important;
-height: 383px;
-padding: 10px 18px 20px 18px;
-gap: 15px;
-border-radius: 20px;
-opacity: 0px;
-background: #FFFFFF;
-box-shadow: 0px 5px 20px 0px #E1B65B33;
-text-align: center;
-display: grid !important;
-}
-
-.stars-icon{
-  width: 92px;
-  height: 32px;
-  gap: 0px;
-  opacity: 0px;
-  margin: auto;
-
-}
-
-.itinerary-summary{
-  width: 100%;
-  height: 56px;
-  padding: 10px;
-  gap: 10px;
-  border-radius: 10px;
-  opacity: 0px;
-  background: linear-gradient(270deg, #F9E298 0%, #FFFDF5 117.76%);
-  box-shadow: 0px 7px 16.7px 0px #E1B65B80;
-  box-sizing: border-box;
-  display: flex;
-  align-items: center;
-  
-  
-}
-.itinerary-summary img{
-  width: 28.46px;
-height: 26.5px;
-
-}
-.itinerary-summary span{
-  font-family: $font-default;
-font-size: 12px;
-font-weight: 500;
-line-height: 18px;
-text-align: left;
-text-underline-position: from-font;
-text-decoration-skip-ink: none;
-color: #AA853E;
-
-
-}
-
-.comment span{
-  font-family: $font-default;
-  font-size: 14px;
-  font-style: italic;
-  font-weight: 200;
-  line-height: 21px;
-  text-align: center;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-  
-}
-
-.customer-name span{
-  font-family: $font-default;
-font-size: 20px;
-font-weight: 400;
-line-height: 30px;
-letter-spacing: 0.05em;
-text-align: left;
-text-underline-position: from-font;
-text-decoration-skip-ink: none;
-
-}
-.more-cities h2{
-  font-family: $font-default;
-  font-size: 30px;
-  font-weight: 600;
-  line-height: 45px;
-  letter-spacing: 0.05em;
-  text-align: left;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-
-}
-
-.other-destinations{
-  display: inline-flex;
-  gap: 10px;
-
-  a{
-    font-family: $font-default;
-    font-size: 18px;
-    font-weight: 400;
-    line-height: 27px;
-    letter-spacing: 0.05em;
-    text-align: left;
-    text-underline-position: from-font;
-    text-decoration-skip-ink: none;
-    background: linear-gradient(360deg, #DCB062 5.04%, #F9E298 99.13%);
-    color: #836848;
-
-    width: auto;
-    padding:  5px 15px;
-    gap: 4px;
-    border-radius: 20px;
-    opacity: 0px;
-
-  }
-}
-
-.other-tours{
-  display: inline-flex;
-  gap: 10px;
-  margin-top: 30px;
-
-  .tour-story{
-    width: 220px;
-    height: 352px;
-    padding: 15px 0px 0px 0px;
-    gap: 0px;
-    border-radius: 20px;
-    opacity: 0px;
-    object-fit: cover;
-    position: relative;
-    background-size: cover;
-    position: relative;
-    background-position: top;
-    background-color: linear-gradient(
-      rgba(0, 0, 0, 0.5),
-      rgba(0, 0, 0, 0.5)
-    );
-
-    .tour-detail{
-      position: absolute;
-      display: flex;
-      justify-content: space-between;
-      align-items: flex-end;
-      bottom: 10px;
-      width: 80%;
-      left: 20px;
-    }
-
-    .city-name{
-      font-family: $font-default;
-      font-size: 20px;
-      font-weight: 400;
-      line-height: 30px;
-      letter-spacing: 0.05em;
-      text-align: left;
-      text-underline-position: from-font;
-      text-decoration-skip-ink: none;
-      color: #F9E298;
-    }
-
-    .tour-count{
-      width: 40px;
-      font-family: $font-default;
-      font-size: 12px;
-      font-weight: 400;
-      line-height: 21px;
-      letter-spacing: 0.05em;
-      text-align: right;
-      text-underline-position: from-font;
-      text-decoration-skip-ink: none;
-      color: #FFFFFF;
-    }
-
-  }
-}
-#about-signature-tours{
-  width: 1440px;
-  height: 597px;
-  gap: 0px;
-  opacity: 0px;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-#about-signature-tours > div{
-  max-width: 970px;
-}
-
-#about-signature-tours h1{
-  font-family: $font-default;
-  font-size: 45px;
-  font-weight: 200;
-  line-height: 67.5px;
-  letter-spacing: 0.06em;
-  text-align: center;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-  color: #545047;
-  margin-top: 55px;
-
-}
-
-#about-st-feature{
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-#feature> img{
-  width: 419px;
-  height: 183.24px;
-  gap: 0px;
-  border-radius: 20px;
-  opacity: 0px;
-  border: 3px solid #FFFFFF;
-
-  object-fit: cover;
-  object-position: 50% 33%;
-  display: block;
-  box-sizing: border-box;
-}
-
-#st-brand{
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-
-#st-brand span{
-  font-family: $font-default;
-  font-size: 20px;
-  font-weight: 400;
-  line-height: 30px;
-  letter-spacing: 0.05em;
-  text-align: left;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-  
-}
-#st-brand #st-logo{
-  width: 47px;
-  height: 43.76px;
-  gap: 0px;
-  opacity: 0px; 
-}
-
-#about-signature-tours #feature{
-  width: 419px;
-  height: 246px;
-  gap: 0px;
-  border-radius: 20px;
-  opacity: 0px;
-  background: #FFFFFF;
-  box-shadow: 0px 5px 20px 0px #00000026;
-}
-
-#about-signature-tours p{
-  font-family: $font-default;
-  font-size: 18px;
-  font-weight: 200;
-  line-height: 27px;
-  letter-spacing: 0.05em;
-  text-align: left;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-  color: #545047;
-  margin: 20px 0;
-  display: block;
-
-}
-
-#st-brand{
-  padding: 5px 23px 0px 12px;
-}
-
-#footer{
-  width: 1440px;
-  height: 321px;
-  gap: 0px;
-  opacity: 0px;
-  background: linear-gradient(270deg, #AA853E 0%, #F9E298 33.5%, #FFF3A6 50%, #F9E298 65.5%, #E1B65B 100%),
-  linear-gradient(4.08deg, rgba(170, 133, 62, 0.5) -2.54%, rgba(249, 225, 151, 0.5) 7.02%);
-  position: relative;
-}
-
-#footer .link-group-title{
-  font-family: $font-default;
-  font-size: 15px;
-  font-weight: 400;
-  line-height: 22.5px;
-  letter-spacing: 0.05em;
-  text-align: left;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-  color: #5B4713;
-  height: 37px;
-  grid-row-start: 2 span;
-}
-
-#footer-links{
-  margin: auto;
-  height: 196px;
-  width: 70%;
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 38px 0;
-}
-
-#footer-links > div{
-  height: 100%;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-between;
-}
-
-#footer-links div:has(> a+a){
-  display: grid;
-  grid-template-columns: repeat(2, 1fr);
-  grid-template-rows: repeat(4, 1fr);
-  column-gap: 34px;
-}
-
-#footer-links a{
-  font-family: $font-default;
-font-size: 18px;
-font-weight: 500;
-line-height: 36px;
-letter-spacing: 0.05em;
-text-align: left;
-text-underline-position: from-font;
-text-decoration-skip-ink: none;
-color: #AA853E;
-text-transform: uppercase;
-
-
-}
-
-#footer hr{
-  width: 1120px;
-height: 0px;
-top: 258.34px;
-left: 160px;
-gap: 0px;
-border: 1px 0px 0px 0px;
-opacity: 0px;
-border: 1px solid #DFB16380;
-position: absolute;
-}
-
-#copyright{
-height: 17px;
-top: 282.28px;
-left: 592px;
-gap: 0px;
-opacity: 0px;
-position: absolute;
-}
-#copyright span{
-  font-family: $font-default;
-  font-size: 14px;
-  font-weight: 400;
-  line-height: 16.93px;
-  letter-spacing: 0.05em;
-  text-align: left;
-  text-underline-position: from-font;
-  text-decoration-skip-ink: none;
-  color: #AA853E;
-
-
-}