hujjat / shopify-sunrise Goto Github PK
View Code? Open in Web Editor NEWShopify Store 2.0 Starter theme with Tailwind CSS & Alpinejs
License: Other
Shopify Store 2.0 Starter theme with Tailwind CSS & Alpinejs
License: Other
Hi
cooll theme, but get alpine errors - https://prnt.sc/8jnEXYmaFxoR
how fast fix?
Hello buddy, I'm working on my theme and noticing quite a few linting warnings. One of which is that 'img_src' is deprecated. It still works, but the new way to do it is "section.settings.image | image_src: width: 'string', height: 'string'". Only one dimension is required.
There are quite a few instances, I understand if you're too busy to update. If you like, I can do a PR. Cheers
Is there no package.json?
๐ Hello again. I am proposing a means to allow the user to define custom breakpoints without having to rely on a custom tailwind config file. This way the end user can pop into the theme editor and change these values at will.
[ My contribution would only move the tailwind breakpoints outside of the tailwind config file (using default values), and the theme author can decide whether they want to provide this functionality ].
I have tested this by adding breakpoints to the settings_schema (e.g, 'breakpoint_lg'), and importing the json data into the tailwind config file from 'settings_data'. (optionally, you can simply add these breakpoints to 'settings_data' directly)
tailwind.config.js
const settings = require("./config/settings_data.json").current;
const breakpoints = {
xl: settings.breakpoint_lg + "px",
lg: settings.breakpoint_lg + "px",
md: settings.breakpoint_md + "px",
sm: settings.breakpoint_sm + "px",
xs: settings.breakpoint_xs + "px",
};
module.exports = {
content: [/* paths */],
theme: {
screens: {
xl: breakpoints.lg,
lg: breakpoints.lg,
md: breakpoints.md,
sm: breakpoints.sm,
xs: breakpoints.xs,
},
},
};
Of course, you can continue to use tailwind breakpoints, but I wouldn't. My solution is to not use tailwind breakpoints (e.g, md:p-0) wherever possible, and use the settings values directly instead via {% style %} tags. I took this approach because I was having zero luck getting css vars to work inside the config file.
This is purely optional, tailwind breakpoints will continue to work as intended. I think it's worth it to allow the user to change these values as needed. What do you think?
Cheers
Edit; I've noted that while you work on the theme settings schema, you'll want to use Shopify Theme Serve without the sync option (or whatever is equivalent)
main-cart-footer section is not exist!!!!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.