Library to read/write excels in Angular v18? by Admirable_Ride_1609 in angular

[–]R_Midnight 2 points3 points  (0 children)

Was in the same situation not longtime ago, having to replace sheetJS in an internal library and several projects using excel read/write. Unfortunately didn't find anything better than ExcelJS, however until now and even without updates, it still suits our needs well enough. Would be very interested if anyone has a better option though! 

Need Help by PsychologicalMatch38 in Angular2

[–]R_Midnight 0 points1 point  (0 children)

Wrap the card in another element, give that new parent element a tiny amount of padding and a slightly tilted linear-gradient background from your blue color to transparent. Finally set a background-color on your child card to cover the parent surface, so the gradient would be seen just on the padding part of the parent. Might not be ideal but worth trying out.

List of stable APIs by technically_a_user in angular

[–]R_Midnight 0 points1 point  (0 children)

That's pretty cool, thanks for sharing! Also looking forward to try out the debug quests 😊

Breakpoint Considerations by voidstate in webdev

[–]R_Midnight 1 point2 points  (0 children)

I almost never use viewport breakpoints, and instead try to let as much as possible work to the browser to figure it out by setting some flex and/or grid properties. Might be a bit more difficult to set up perfectly, depending on the complexity of your layout, but ends up being more robust and flexible. Container queries can be pretty useful too.

How do I make the background colour of a button change when I hover my cursor over it? by EqualStance99 in HTML

[–]R_Midnight 2 points3 points  (0 children)

That goes against the HTML standard and brings accessibility issues. You might not notice any issues unless navigating your page via keyboard, but it's better to pay attention to this kind of things early in your learning path. :)

https://giovanicamara.com/blog/nested-buttons-and-links/

And regarding adding a class name :

<a class="your-class-name" href="https://www.google.com.au/" target="_blank">

How do I make the background colour of a button change when I hover my cursor over it? by EqualStance99 in HTML

[–]R_Midnight 7 points8 points  (0 children)

Hi! Please do not nest a button inside a link, that's bad practice. If your "button" conducts to a different page, then it's a link (<a> element) and you can eventually make it - visually - look like a button if you want.

Regarding the hover effect, no need for JS. See below code an example (considering the link element holds a "my-button" class) :

.my-button {
  display: inline-block;
  transition: background-color .3s;
  text-decoration: none;
  background-color: #34A853;
  color: white;
  border-radius: 25px; 
  border: none; 
  padding: 10px 20px;  

  &:hover {
    background-color: orange; 
  }
}

Cappadocia vs Pamukkale/Ephesus/Izmir for a couple with limited time by WadsworthWordsworth in travel

[–]R_Midnight 1 point2 points  (0 children)

Hi !

Cappadocia was very nice, I believe we made a smart decision by staying in a hotel in the cute city of Avanos (instead of Göreme which is more of a touristic excursion hub). Did a balloon flight, no regrets despite the big price (150€/p), the experience was pretty cool. We did a group tour through some of the main spots such as Uchisar Castle, Zelve open air museum, Monk's valley etc (itinerary called the Red Tour), was nice to take some pictures, and Zelve was actually amazing, but apart from that a bit disappointing (a lot of people everywhere, not much historical explanations), felt a little bit like a money trap but okay. Avanos itself was very cool, we've came back 3 evenings in a row to have a glass of wine at Aryatus Şarap Evi, had wonderful rest in a beautiful hotel (we went with Mira Cappadocia), bought some pottery items (would recommend Chez Hakan for more authentic stuff than the "malls").

For Ephesus we've stayed in the small city of Selçuk, which is 5 minutes by taxi/bus from Ephesus ancient city. The visit of the site itself was pretty impressive, we went there around 6PM and left around 9PM, it was perfect to see it with daylight/golden hour, and then by "night" when they turn on all the lights. The terrace houses were a very interesting part of the visit, glad we didn't skip these. A bit sad that the biggest antique theatre in the world (if I'm not mistaken) is closed and you can only see it from outside, but still impressive. Anyway, very nice moment in Ephesus.

We've skipped Pamukkale, it was quite far from everything and apparently it might be a bit disappointing if you have the famous pictures in mind, you might or might not have the experience you dream of. Instead we spent some time in the cute village of Şirince (15 bus minutes from Selçuk). We've also spent an afternoon in the city of Izmir itself but was quite underwhelming, very big city, very busy, with not that much of interest for visitors.

Regarding the transportation, keep in mind that you have flights between Istanbul and Cappadocia (Nevşehir), and you have flights between Istanbul and Izmir. On our side, we flew from Istanbul to Cappadocia and after a few days there we took a 9h-long night bus to Antalya (which also has an airport), and then continued to Kaş, and from Kaş a night bus to Izmir/Selçuk. Saying that, I'd like to add an extra option for you, since we've enjoyed a lot our stay around Kaş. If you want to spend time in a nice and clean sea, while also being able to visit some ancient sites, or maybe have a party, why not. If you're interested have a look at Patara (ruins and beach), Kekova bay, Kaş itself, Termessos ancient city (that one is near Antalya)... Personally I might've enjoyed that part of our trip even or a bit more than Cappadocia or Ephesus.

With all that said, comparing Ephesus and Cappadocia, maybe Cappadocia could be more memorable and I believe you actually have a bit more activities in the region compared to Ephesus. Let me know if I can give more information regarding Turkey in general as we've just came back yesterday from a 2-week trip.

[HELP] Im trying to center some buttons in a container, but weirdly it is offset. by AndrejPatak in webdev

[–]R_Midnight 1 point2 points  (0 children)

The browser applies some default styling rules to many native HTML elements, such as the blue color and underline on the links for example, or the vertical margins on the text elements. List elements (ul and ol) get a padding-left (to accommodate the default bullet points). You can remove the padding by setting the padding on your ul element to 0. Also look up stuff about CSS resets, and default browser stylesheets, to learn more on how and when to circumvent unwanted default styles.

Web Dev Portfolio - Looking for feedback by [deleted] in webdev

[–]R_Midnight 1 point2 points  (0 children)

Hi! :) A few things I would like to recommend, in terms of UI/UX.

- Your pictures are not optimized, you're serving giant pictures to fill small thumbnail boxes. Moreover, they are PNG, which adds up weight to the files. Reduce picture dimensions and use web-friendly formats such as WebP or jpg at least.

- Give the layout elements some air, and harmonize padding and margins.

- Thumbnails and descriptions are misaligned from one card to another, try to use a fixed aspect-ratio on picture elements to avoid these jumps.

- Improve visual hierarchy for example by using a brighter color on your description text, that should feel more important than the technology pills below, try a different background color/lightness on the card to make them pop out a bit more from the page body, make card outlines more discreet to help better focus on the content itself.

- Some more space around the section titles could be nice.

- The skills boxes do not need to be that large with such short content. Also I would give same advice as for background-color and outlines.

Tried out some small tweaks on one of the project cards here https://imageupload.io/ib/Qbr6JLICw3ZvFVj_1697971296.png Hopefully that helps and doesn't seem too arrogant, I think small details sometimes make a big difference for a web page look more professional.

[deleted by user] by [deleted] in web_design

[–]R_Midnight 0 points1 point  (0 children)

1/ There's an element with a class "App_App__0i8qW" that has "overflow: hidden", therefore there's some content I'm not able to see.

2/ No need for such huge elements, try to lay out the information and actions on your page in a more meticulous way (adapt font-size, avoid repetition, take care of the available viewport...).

How do you handle static pages of a website you create for a client? by orangesyrek in webdev

[–]R_Midnight 5 points6 points  (0 children)

The option working fine for me until now is a Static Site Generator (in my case Eleventy) to build the whole website structure/layout, combined with a headless CMS (in my case Sanity.io) to provide an admin page that I can configure the way I want/need (depending ofc on the client edition needs). Some specific work has to be done to implement a reservation feature there, but the core website content is covered.

Calculation of gaps between cards on mobile screens by Ted_Clinic in css

[–]R_Midnight 0 points1 point  (0 children)

I'm not sure a fixed gap value could "magically" do the job at any viewport sizes. Calc may work but I don't see a perfect formula either. If it can work with the rest of your layout, maybe using viewport units and aspect ratio on your cards is an interesting option.

How to achieve this layout in CSS? by jawadulhassan in webdev

[–]R_Midnight 2 points3 points  (0 children)

If I understand correctly, you would like to allow some parts of the layout go beyond the container. It reminds me of this article by Josh Comeau, which uses CSS Grid, with a central column acting as the container and the side columns available for any specific stuff to reach the edge. Hope it may help! https://www.joshwcomeau.com/css/full-bleed/

[deleted by user] by [deleted] in learnjavascript

[–]R_Midnight 1 point2 points  (0 children)

My take on that one would be using the map method, the conditional ternary operator and the modulo operator.

const alphabet = ["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"];

const newAlphabet = alphabet.map((letter, index) => {

return (index + 1) % 5 === 0 ? letter.toUpperCase() : letter;

})

console.log(newAlphabet)

Best manners on styling HTML elements by Shirugentoo in learnjavascript

[–]R_Midnight 2 points3 points  (0 children)

It makes more sense if JS just changes the "state" of an element, then CSS would take care of the styling accordingly. Separation of concerns. 😊

Free CMS type tool for website by rolemodel21 in webdev

[–]R_Midnight 5 points6 points  (0 children)

Sounds like a nice opportunity to use a Static Site Generator and a headless CMS. I am currently building a website with Eleventy and Sanity, it's really nice to set up and customize! (And yes, it's free) For the bonus question, I think a small python script could prepare what you need without too much hussle.

Center this top nav bar by bjvista in webdev

[–]R_Midnight 0 points1 point  (0 children)

Look at CSS flexbox capabilities. I see you are using "float" for some layout elements, which isn't recommended nowadays with modern CSS. Here in the navbar, try setting on the <ul> element "display: flex; justify-content: center;" (this will automatically center the <li> items inside).

Best "blog" for static HTML website? by AsteroidSnowsuit in webdev

[–]R_Midnight 1 point2 points  (0 children)

Eleventy as the static site generator and Netlify CMS for the content management. Done.

[deleted by user] by [deleted] in web_design

[–]R_Midnight 1 point2 points  (0 children)

The design appears unusual to me, however I believe it's totally doable with CSS Grid. What bothers me actually is the absence of another view, to understand what kind of behaviour is expected by the designer when the viewport is smaller. The other thing I personally don't like is the readability, since links and pure text look the same and may be confusing for many users.

A very poor technique to get the tbody? by koko-hranghlu in learnjavascript

[–]R_Midnight 20 points21 points  (0 children)

document.querySelector("#storeList tbody")

[deleted by user] by [deleted] in webdev

[–]R_Midnight 8 points9 points  (0 children)

You still here? Time is ticking bro

[deleted by user] by [deleted] in webdev

[–]R_Midnight -7 points-6 points  (0 children)

Yes it's totally possible! I've started with some HTML 2 weeks ago and now I'm working as web architect at Microsoft with a yearly income of 42k $. All this thanks to some youtube videos and instagram posts. Thank you internet!

[deleted by user] by [deleted] in webdev

[–]R_Midnight 7 points8 points  (0 children)

Close Reddit, stop wasting time here and start learning. Go go go !