question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Implement the first theme, let's start with "Minimal"

See original GitHub issue

First of all, here’s the screeshot answering the question “why?”:

image

So I guess, it’s time to start implementing sweet themes for SweetAlert2 😃

From https://www.reddit.com/r/webdev/comments/7xput6/sweetalert2_a_beautiful_responsive_highly/dubc28n/

This is cool, but to my eye, most of these boxes look a little big for general purposes. I think, generally, if I’m being alerted about… whatever, , I have no need for a ton of negative space of fun animations or big text, I just want a small box that grabs my attention (mostly via the contrast), tells me what I need to know, and gets my conversation.

Of course, browser based alerts suck, and your shit is more customizable with a better button and without invoking the horror most people feel when they’re trying to kill an ad that just won’t die… So yeah, it looks like your alerts are the shit, I’m just giving my two cents, maybe a smaller box by default would get the job did well.


I need your opinions about files structure and themes organization. This is how I see it, feel free to suggest other solutions:

  1. Themes will be nothing more than additional SASS files, I think it makes sense to keep all themes in this repository, let’s say in src/themes folder

  2. The structure of SASS files will be something like:

@import '../variables';
// overriding SASS variables
@import '../sweetalert2';
  1. Compiled themes (CSS) will be located in dist/themes folder.

I will implement the first “Minimal” theme without animations and shit to make old-school fellas happy 😃

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Reactions:8
  • Comments:8 (6 by maintainers)

github_iconTop GitHub Comments

2reactions
toveruxcommented, Feb 16, 2018

Yeah! Excellent idea. Also answers https://github.com/sweetalert2/sweetalert2/issues/547 (7 👍)

It would be good if the themes are also provided on the dist/ version as standalone CSS files, not just SCSS files.

1reaction
zenflowcommented, Feb 16, 2018

Also consider that any theme is inherently very opinionated. It would be nice to keep as much of that out of the core as possible. Opinions/tastes in separate modules on the other hand are totally fine since they can be swapped out for another more customized one (a fork or a fresh repository), and used just as easily (i.e. none are “special”). Ok I think those are my best arguments.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Your First Theme - WordPress Developer Resources
First, create a new folder on your computer, and name it my-first-theme. This is where all of your theme's files will go. Top...
Read more >
Theming and Theme Switching with React and styled ...
First, we will create a custom React hook. This will manage the selected theme, knowing if a theme is loaded correctly or has...
Read more >
How to Create a WordPress Child Theme: A Step-by-Step Guide
A WordPress child theme gives you a safe way to customize your WordPress theme's code. If you want to make direct edits to...
Read more >
How to Create Your First Shopify Theme Section
In this article, we'll cover how to get started with creating different types of theme sections, and the rules for using them, ...
Read more >
How To Create And Customize A WordPress Child Theme
A much better idea is to use a child theme. This allows you to make any number of changes to a website without...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found