~MARSMAN~ Posts - Answer Overflow

~MARSMAN~

•Created by ~MARSMAN~ on 4/3/2023 in #ui-ux

Health App homepage

Hi 👋 I need feedback on this homepage that I've been working on, I feel like my color distribution can still be improved. Rest of the app's look depends a lot on this homepage. Any feedback is appreciated 🙏 Info about the app for context: The app has two main features, pain and symptoms assessments, along with patient self-management features like medicines and appointments. Here's the link to the prototype: https://xd.adobe.com/view/83398ac3-bb11-4d62-a8ab-ff653e76fa22-d66a/?fullscreen&hints=off

6 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 3/8/2023 in #ui-ux

Fancy Bakery Website

Hello 👋 I've been working on a "Fancy Bakery website" for my Google UX design program. I have finished the prototype and I'd like feedback on it. Specifically, the experience as a whole ( visual and functional, from finding a product to checking it out) what do you think of it? Anything you feel that it needs to be changed, improved or removed in this experience? Any feedback is appreciated 🙏 Note: the cart button is supposed to be at the bottom right of the screen, but the phone browser bar might force the button to disappear from the viewport, zoom out and you will find it.

9 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 2/4/2023 in #os-and-tools

updating files on VPS

Hello 👋 So for the first time I'm going to use VPS hosting from hostinger, well i used VPS but not as it's everywhere with root access and everything i do is from the terminal. The one i use is from PythonAnywhere and it comes with a control panel for many things i do with the server, except packages downloading which is from the terminal. So my question is, how can I update my files on a VPS server that doesn't have a control panel anytime I want? Or if you have any videos, blog posts, anything that can help me I'll appreciate it.

63 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 1/18/2023 in #front-end

Cannot read properties of undefined.

Hello 👋 So I'm trying to create a class for an alert card. And now whenever i try to use the class methods it throws an error saying Cannot read properties of undefined ( reading 'classList') What am I missing here?

9 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 1/11/2023 in #front-end

Scroll horizontally through a slider

Hello 👋 So I have this Slider Container and I want it to be scrollable when the keyboard user tab into it? I'm not sure what i can do to achieve this without over-enginer it. Now if you want to scroll through it you have to click on the container first and then you can use your arrow keys to scroll, as you can see in the CodePen below

9 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 12/12/2022 in #ui-ux

Feedback for a nonprofit website

Hello 🤗 I'd like feedback on the design of this website I've been working on for a nonprofit. And specially since it's my first professional website and not a side project, all feedback is appreciated! Please visit the prototype on figma here's the link:

41 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 11/17/2022 in #front-end

Responsiveness method

Hello 👋 Now when it comes to making website responsive I fellow two design modes, Portrait mode or landscape mode. I use JavaScript to decide which mode to apply based on the screen orientation. I don't use Media queries but only if i wanna add some extra styles for screens that are too big or too small. My question is, what are the cons of this method? I wanna know if this way is good to go or if it has some serious cons 😬 Example of how I set the style mode:

.container {
    display: flex;
}

body.portrait-mode .container {
    flex-direction: column;
}

.container {
    display: flex;
}

body.portrait-mode .container {
    flex-direction: column;
}

35 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 11/14/2022 in #front-end

Dashboard or Guidebook

Hello 👋 So i have this scenario, I'm building a website for a nonprofit, they have active events all over the year so they need to regularly update the website content. I'm not sure which way of updating the content should I provide them since I'm not familiar with Dashboards and the expected launch date is the beginning of the upcoming year. I thought of giving them a separate file with blocks of HTML elements with Thier classes so the client can just put the text they wish or the photos they wish inside the HTML Tags, I'll give them instructions on how to do it. Same thing for the REST APIs. I follow CUBE CSS methodology and i only use Vanilla CSS/JS/HTML, No frameworks or libraries except jQuery. And I use Flask and python for backend. So the question is, what should I do? guide or spend time on learning Dashboards? Are they easy to learn?

8 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 10/26/2022 in #front-end

use Tab key to focus on elements in specific sections

I have my website landing page-scrolling works as if it's a slider/carousel. now, all types of users can navigate through it, except for keyboard users who can't use the "Tab" key when they wanna focus on the buttons and links inside the page because I disabled it. Because it messes up the page transitions and content lol. anyway, I've tried to work around it and activate the tab only on certain slides of the page, I used the code as follows:

document.onkeydown = function(e) {
                if (e.key === 'Tab') {
                    if (about.isActive == true){
                        $("#about-btn").focus()
                        e.preventDefault();
                    }
                    else {
                        e.preventDefault();
                    }
                }
            };

document.onkeydown = function(e) {
                if (e.key === 'Tab') {
                    if (about.isActive == true){
                        $("#about-btn").focus()
                        e.preventDefault();
                    }
                    else {
                        e.preventDefault();
                    }
                }
            };

Where the "about" is a class containing the about section and isActive variable. This only works on one focusable element per section, in sections like services, it will only focus on the first element and that's it. I tried to use loops and it didn't work as expected. instead, it looped all the a and buttons on the page and messed it up. So my question is, How can I loop the focusable elements in a section ( only when this section is in view) without messing up my page animation and content?

4 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 10/17/2022 in #back-end

Flask before_request

What am I missing here? I'm trying to redirect the user when they use 'www' to the correct domain but it seems that I'm missing something because it's not working, it gives me error 😦

@app.before_request
def redirect_to_domain():
    FROM_DOMAIN = "www.marsman.pythonanywhere.com"
    TO_DOMAIN = "marsman.pythonanywhere.com"
    urlparts = urlparse(request.url)
    if urlparts.netloc == FROM_DOMAIN:
        urlparts_list = list(urlparts)
        urlparts_list[1] = TO_DOMAIN
        return redirect(urlunparse(urlparts_list), code=301)

@app.before_request
def redirect_to_domain():
    FROM_DOMAIN = "www.marsman.pythonanywhere.com"
    TO_DOMAIN = "marsman.pythonanywhere.com"
    urlparts = urlparse(request.url)
    if urlparts.netloc == FROM_DOMAIN:
        urlparts_list = list(urlparts)
        urlparts_list[1] = TO_DOMAIN
        return redirect(urlunparse(urlparts_list), code=301)

5 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 10/9/2022 in #ui-ux

feedback on homepage

Hello 👋 I'm finishing up my website to start working as freelance, and I'd like some feedback on my homepage.

16 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 10/6/2022 in #front-end

backgroun-clip text; issue on safari

14 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 10/2/2022 in #front-end

Suitable HTML tag for elements Titles

Hello 👋 Since i can't use the <h> tags except once for each. I was wondering what is a semantic tag to use for titles of some elements? for example: A card with it's title, a paragraph and a link.

<div>
    <span> Title </span>
    <p> paragraph </p>
    <a> Learn more </a>
</div>

<div>
    <span> Title </span>
    <p> paragraph </p>
    <a> Learn more </a>
</div>

15 replies

KPCKevin Powell - Community

•Created by ~MARSMAN~ on 9/27/2022 in #front-end

cross browser compatibility

Hello, what "free" tools you guys use for testing a website ( looks and performance ) across multiple browsers? Spécially Safari because other browsers i can access them already. I've tried this lambdaTest but it's too limiting, so I'm wondering if there are any free tools available 😬

6 replies

Gaming

Programming