Skip to content

Instantly share code, notes, and snippets.

@luismartinezs
Last active June 18, 2021 07:58
Show Gist options
  • Save luismartinezs/8f3d6c708ac5f2afc08f1ab2474279f5 to your computer and use it in GitHub Desktop.
Save luismartinezs/8f3d6c708ac5f2afc08f1ab2474279f5 to your computer and use it in GitHub Desktop.
Helper CSS classes #css
/* HELPER CLASSES */
.d-flex {
display: flex;
}
.d-col {
flex-direction: column;
}
.d-row {
flex-direction: row;
}
.wrap {
flex-wrap: wrap;
}
.d-block {
display: block;
}
.justify-center {
justify-content: center;
}
.justify-start {
justify-content: start;
}
.justify-end {
justify-content: end;
}
.justify-space-between {
justify-content: space-between;
}
.align-center {
align-items: center;
}
.align-start {
align-items: start;
}
.align-end {
align-items: end;
}
.align-baseline {
align-items: baseline;
}
.justify-self-start {
justify-self: flex-start;
}
.w100 {
width: 100%;
}
.h100 {
height: 100%;
}
.vw100 {
width: 100vw;
}
.vh100 {
height: 100vh;
}
.text-center {
text-align: center;
}
.mask {
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.2);
}
.btn {
cursor: pointer;
}
.desktop {
display: none;
}
.mobile {
display: default;
}
@media screen and (min-width: 960px) {
.desktop {
display: initial;
}
.mobile {
display: none;
}
}
.anchor-btn {
border: none;
border-radius: 0;
padding: 0;
cursor: pointer;
background-color: transparent;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment