Ignore:
Timestamp:
01/21/25 03:08:24 (4 days ago)
Author:
stefan toskovski <stefantoska84@…>
Branches:
main
Parents:
0c6b92a
Message:

F4 Finalna Verzija

Location:
imaps-frontend/src/pages/IMaps/components
Files:
8 edited

Legend:

Unmodified
Added
Removed

  • imaps-frontend/src/pages/IMaps/components/Button.css

    r0c6b92a r79a0317  
    2020
    2121.btn--outline {
    22   background-color: transparent;
     22  background-color: #ffffffc2;
    2323
    24   color: #fff;
     24  color: #252627;
    2525  padding: 8px 20px;
     26  border: 1px solid #252627 ;
    2627  /* border: 1px solid var(--primary); */
    2728  transition: all 0.3s ease-out;
    … …  
    3738  font-size: 24px;
    3839}
     40.btn--outline:hover{
     41  transition: all 0.3s ease-out;
     42  background: #000000;
     43  color:#ffffffc2;
     44}
    3945
    4046.btn--large:hover,
    … …  
    4349  background: #ffffffc2;
    4450  color: #000000;
    45   transition: 250ms;
    4651}

  • imaps-frontend/src/pages/IMaps/components/Cards.jsx

    r0c6b92a r79a0317  
    1919              text="Create intricate floor plans for your building with precision and ease."
    2020              label="Create"
    21               path="/services"
     21              path="#"
    2222            />
    2323            <CardItem
    … …  
    2525              text="Explore and navigate through complex building layouts seamlessly."
    2626              label="Explore"
    27               path="/services"
     27              path="#"
    2828            />
    2929          </ul>
    … …  
    3333              text="Add custom icons, labels, and markers to personalize your indoor maps."
    3434              label="Customize"
    35               path="/services"
     35              path="#"
    3636            />
    3737            <CardItem
    … …  
    3939              text="Ensure accessibility by mapping out routes and facilities for all users."
    4040              label="Accessibility"
    41               path="/products"
     41              path="#"
    4242            />
    4343            <CardItem
    … …  
    4545              text="Share your maps with others and collaborate in real-time for efficient space planning."
    4646              label="Collaboration"
    47               path="/sign-up"
     47              path="#"
    4848            />
    4949          </ul>

  • imaps-frontend/src/pages/IMaps/components/Footer.css

    r0c6b92a r79a0317  
    4747.footer-links {
    4848  width: 100%;
    49   max-width: 1000px;
    5049  display: flex;
    51   justify-content: center;
     50  justify-content: space-evenly;
     51}
     52.footer-link-wrapper a {
     53  margin-top: 1em;
     54}
     55.footer-link-wrapper h2 {
     56  width: 100%;
    5257}
    5358
    54 .footer-link-wrapper {
    55   display: flex;
    56 }
    5759
    5860.footer-link-items {
    5961  display: flex;
    6062  flex-direction: column;
    61   align-items: flex-start;
     63  align-items: center;
    6264  margin: 16px;
    6365  text-align: left;
    … …  
    100102
    101103.social-media {
    102   max-width: 1000px;
    103   width: 100%;
    104104}
    105105
    106106.social-media-wrap {
    107107  display: flex;
    108   justify-content: space-between;
     108  flex-direction: column;
    109109  align-items: center;
    110   width: 90%;
    111   max-width: 1000px;
    112   margin: 40px auto 0 auto;
    113110}
    114111
    … …  
    123120  color: #fff;
    124121  justify-self: start;
    125   margin-left: 20px;
    126122  cursor: pointer;
    127123  text-decoration: none;
    … …  
    131127  margin-bottom: 16px;
    132128}
     129.social-media-wrap img {
     130  width: 25%;
     131}
    133132
    134133.website-rights {
    135134  color: #fff;
    136   margin-bottom: 16px;
     135  align-content: flex-end;
     136  width: 50%;
     137  margin-top: 2em;
    137138}
    138139

  • imaps-frontend/src/pages/IMaps/components/Footer.jsx

    r0c6b92a r79a0317  
    22import "./Footer.css";
    33import { Button } from "./Button";
    4 import logo from "../../../assets/logo_icon.png";
     4import logo from "../../../assets/novo_logo_nobg_cropped.png";
     5import {Link} from "react-router-dom";
    56
    67function Footer() {
    78  return (
    89    <div className="footer-container">
    9       {/* <div className="footer-links">
     10      <div className="footer-links">
    1011        <div className="footer-link-wrapper">
    1112          <div className="footer-link-items">
    … …  
    1314            <a href="#">Contact</a>
    1415            <a href="#">Support</a>
    15             <a href="#">Destinations</a>
    16             <a href="#">Sponsorships</a>
    1716          </div>
    1817        </div>
    19         <div className="footer-link-wrapper">
    20           <div className="footer-link-items">
    21             <h2>Social Media</h2>
    22             <a href="#">Instagram</a>
    23             <a href="#">Facebook</a>
    24             <a href="#">Youtube</a>
    25             <a href="#">Twitter</a>
     18          <div className="social-media-wrap">
     19
     20            <div className="footer-logo">
     21              <img src={logo} alt={"logo"}/>
     22            </div>
     23            <small className="website-rights">iMaps © {2024}</small>
     24          </div>
     25        <div>
     26          <div className="footer-link-wrapper">
     27            <div className="footer-link-items">
     28              <h2>Legal & Privacy</h2>
     29              <Link to={"/privacy-policy"}>Privacy Policy</Link>
     30              <Link to={"/terms-of-service"}>Terms Of Service</Link>
     31
     32            </div>
    2633          </div>
    2734        </div>
    28       </div> */}
    29       <section className="social-media">
    30         <div className="social-media-wrap">
    31           <div className="footer-logo">
    32             <a href="#" className="social-logo">
    33               iMaps
    34             </a>
    35           </div>
    36           <small className="website-rights">iMaps © {2024}</small>
    37           <div className="social-icons">
    38             <a className="social-icon-link facebook" href="#" aria-label="Facebook">
    39               <i className="fab fa-facebook-f" />
    40             </a>
    41             <a className="social-icon-link instagram" href="#" aria-label="Instagram">
    42               <i className="fab fa-instagram" />
    43             </a>
    44             <a className="social-icon-link youtube" href="#" aria-label="Youtube">
    45               <i className="fab fa-youtube" />
    46             </a>
    47             <a className="social-icon-link twitter" href="#" aria-label="Twitter">
    48               <i className="fab fa-twitter" />
    49             </a>
    50             <a className="social-icon-link linkedin" href="#" aria-label="LinkedIn">
    51               <i className="fab fa-linkedin" />
    52             </a>
    53           </div>
    54         </div>
    55       </section>
     35
     36      </div>
     37
    5638    </div>
    5739  );

  • imaps-frontend/src/pages/IMaps/components/Navbar.css

    r0c6b92a r79a0317  
    11.modern-navbar {
    2   /*background-color: #ffffff;*/
    3   /*background: linear-gradient(*/
    4   /*        90deg,*/
    5   /*        #fafafa 0%,*/
    6   /*        #c07e7e 25%,*/
    7   /*        #af2525 50%,*/
    8   /*        #443a3a 75%,*/
    9   /*        #8d1010 100%*/
    10   /*);*/
    11   /*background: linear-gradient(to right, #ffffff, #c12c2c);*/
    12   /*background: linear-gradient(90deg, #3b3131, #ffffff);*/
    13   background: linear-gradient(90deg, #9b1818, #efefef);
     2  background: linear-gradient(90deg, #ffffff, #fffefe);
    143  color: #ffffff;
    154  /*color: #333333;*/
    … …  
    2413  border-radius: 8px;
    2514  margin: 5px;
     15  height: 70px;
     16  overflow: hidden;
    2617}
    2718

  • imaps-frontend/src/pages/IMaps/components/Navbar.jsx

    r0c6b92a r79a0317  
    1010function Navbar() {
    1111  const [click, setClick] = useState(false);
    12   const [button, setButton] = useState(true);
    13 
    14   const handleClick = () => setClick(!click);
    15   const closeMobileMenu = () => setClick(false);
    1612
    1713  const { isAuthenticated } = useAppContext();
    … …  
    2319                <div className="navbar-left">
    2420                    <Logo position="relative"/>
    25                     <h1 className="navbar-title">iMaps</h1>
    2621                </div>
    2722

  • imaps-frontend/src/pages/IMaps/components/pages/Home.jsx

    r0c6b92a r79a0317  
    1414        <h2 className="description">Create and explore detailed indoor maps.</h2>
    1515        <div className="hero-btns">
    16           <Link to="/myMaps">
    17             <Button className="btns" buttonSize="btn--large">
    18               Create Maps
     16          <Link to="/Maps">
     17            <Button buttonSize="btn--large" >
     18              Browse Maps <i className="far fa-play-circle" />
    1919            </Button>
    2020          </Link>
    21           <Link to="/Maps">
    22             <Button className="btns" buttonSize="btn--large">
    23               Browse Maps <i className="far fa-play-circle" />
     21          <Link to="/myMaps">
     22            <Button buttonSize="btn--large" buttonStyle="btn--outline">
     23              Create Maps
    2424            </Button>
    2525          </Link>

  • imaps-frontend/src/pages/IMaps/components/pages/Home.scss

    r0c6b92a r79a0317  
    5050  width: 100vw;
    5151  /* img size is 50x50 */
    52   background: url($bg-url) repeat 0 0;
     52  /* Set a base background color */
     53  background: #87898d url($bg-url) repeat 0 0;
     54
     55  /* Apply hue rotation to the image */
    5356
    5457  -webkit-animation: bg-scrolling-reverse .92s infinite; /* Safari 4+ */
    … …  
    98101
    99102  font-size: 6em;
    100 
    101 
    102103
    103104
Note: See TracChangeset for help on using the changeset viewer.