jamiewilson / corpus Goto Github PK
View Code? Open in Web Editor NEWYet another CSS toolkit. Basically the stuff I use for most projects.
Home Page: http://jamiewilson.io/corpus
Yet another CSS toolkit. Basically the stuff I use for most projects.
Home Page: http://jamiewilson.io/corpus
Hey Jamie -- I've needed a class that creates a responsive grid without column/row specifications. Consider adding the following class to closure. I've provided some sample breakpoints:
.griddle {
margin:0px;
width:100%;
padding:0px;
list-style-type:none;
> li {
float:left;
width:100%;
padding:0px;
margin:0px 0px 1rem 0px;
}
@media all and (min-width: 800px) and (max-width: 1279px) {
li {
width:50%;
&:nth-of-type(2n+1) {padding-right:1%; }
&:nth-of-type(2n+2) {padding-left:1%; }
}
}
@media all and (min-width: 1280px) and (max-width: 1599px) {
li {
width:33.33%;
&:nth-of-type(3n+1) {padding-right:1%; }
&:nth-of-type(3n+2) {padding:0 .5%; }
&:nth-of-type(3n+3) {padding-left:1%; }
}
}
@media all and (min-width: 1600px) {
li {
width:25%;
&:nth-of-type(4n+1) {padding-right:.75%; }
&:nth-of-type(4n+2) {padding:0 .75%; }
&:nth-of-type(4n+3) {padding:0 .75%; }
&:nth-of-type(4n+4) {padding-left:.75%; }
}
}
}
Suggest adding the following margin types (maybe padding too) for whitespace symmetry:
mt-min {margin-top: $margin/2}
mr-min {margin-right: $margin/2}
mb-min {margin-bottom: $margin/2}
ml-min {margin-left: $margin/2}
Sorry to publicly add this as an issue - I could not figure out how else to contact you.
On the website under "Sizing":
"Because flex items defualt"
defualt should be default.
As a convenience, these would be helpful:
//horizontal padding
.ph0 { padding-left: 0; padding-right:0}
.ph1 { padding-left: $padding; padding-right:$padding}
.ph2 { padding-left: $padding * 2; padding-right:$padding * 2}
etc...
//vertical padding
.pv0 { padding-top: 0; padding-bottom:0}
.pv1 { padding-top: $padding; padding-bottom:$padding}
.pv2 { padding-top: $padding * 2; padding-bottom: $padding * 2}
etc...
The site looks great in Chrome, but in Firefox and IE11, things look very jumbled. ๐
If you can't seem to reproduce the problem, let me know and I can post some screenshots.
Hey,
corpus seems to be very nice. Thanks for uploading it to Github :)
I think people could use it more easily if you would create folders like src/lib and build/dist.
So for example src for all the .scss files and a dist folder for a compiled and bundled .css file and a bundled .scss file.
Regards,
Moritz
Hello
Nice framework - what I was wondering though is whether you're planning to add some mixins so it could be used in a more semantic way to use existing classes.
Suggest that you either commit to using variables.scss, or remove it. Other files have their own and it may conflict.
You have a few dependencies (e.g. body definition), that are impacted by the order in which sass files are compiled. Suggest that you offer an aggregate sass file that imports your general sass files to avoid these issues.
https://validator.w3.org/nu/?doc=http%3A%2F%2Fcorpuscss.com%2F
there's a stray closing span tag on line 148. it's making the site break in Firefox.
This is exactly what I am trying to do for my projects but better and well organized.
What do you think about adding classes for sizing text such as ".small-text, lg-text, etc". I was thinking that now we only have h1-h6 that is preferable used with heading but not ordinary texts. There are cases we want to use texts with 75% smaller size or 125% larger either for hints or attracting attention.
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.