mirror of
https://github.com/carloscuesta/gitmoji.git
synced 2025-12-08 20:14:12 +00:00
🚧🎨 Update json data, styles and templates
Add a new property 'name' inside of gitmojis.json, update the schema to set name as required. Update styles and templates with the new card design
This commit is contained in:
Carlos Cuesta
parent
cea7d5c95c
commit
420ded9a7b
@ -3,97 +3,116 @@
|
||||
{
|
||||
"emoji": "⬆️",
|
||||
"code": ":arrow_up:",
|
||||
"description": "Upgrading dependencies."
|
||||
"description": "Upgrading dependencies.",
|
||||
"name": "arrow-up"
|
||||
},
|
||||
{
|
||||
"emoji": "⬇️",
|
||||
"code": ":arrow_down:",
|
||||
"description": "Downgrading dependencies."
|
||||
"description": "Downgrading dependencies.",
|
||||
"name": "arrow-down"
|
||||
},
|
||||
{
|
||||
"emoji": "🎨",
|
||||
"code": ":art:",
|
||||
"description": "Improving structure / format of the code."
|
||||
"description": "Improving structure / format of the code.",
|
||||
"name": "art"
|
||||
},
|
||||
{
|
||||
"emoji": "🔥",
|
||||
"code": ":fire:",
|
||||
"description": "Removing code or files."
|
||||
"description": "Removing code or files.",
|
||||
"name": "fire"
|
||||
},
|
||||
{
|
||||
"emoji": "💚",
|
||||
"code": ":green_heart:",
|
||||
"description": "Fixing CI Build."
|
||||
"description": "Fixing CI Build.",
|
||||
"name": "green-heart"
|
||||
},
|
||||
{
|
||||
"emoji": "🔒",
|
||||
"code": ":lock:",
|
||||
"description": "Fixing security issues."
|
||||
"description": "Fixing security issues.",
|
||||
"name": "lock"
|
||||
},
|
||||
{
|
||||
"emoji": "✨",
|
||||
"code": ":sparkles:",
|
||||
"description": "Introducing new features."
|
||||
"description": "Introducing new features.",
|
||||
"name": "sparkles"
|
||||
},
|
||||
{
|
||||
"emoji": "🐛",
|
||||
"code": ":bug:",
|
||||
"description": "Fixing a bug."
|
||||
"description": "Fixing a bug.",
|
||||
"name": "bug"
|
||||
},
|
||||
{
|
||||
"emoji": "🚧",
|
||||
"code": ":construction:",
|
||||
"description": "Work in progress."
|
||||
"description": "Work in progress.",
|
||||
"name": "construction"
|
||||
},
|
||||
{
|
||||
"emoji": "📝",
|
||||
"code": ":memo:",
|
||||
"description": "Writing docs."
|
||||
"description": "Writing docs.",
|
||||
"name": "memo"
|
||||
},
|
||||
{
|
||||
"emoji": "✅",
|
||||
"code": ":white_check_mark:",
|
||||
"description": "Adding tests."
|
||||
"description": "Adding tests.",
|
||||
"name": "white-check-mark"
|
||||
},
|
||||
{
|
||||
"emoji": "🍎",
|
||||
"code": ":apple:",
|
||||
"description": "Fixing something on macOS."
|
||||
"description": "Fixing something on macOS.",
|
||||
"name": "apple"
|
||||
},
|
||||
{
|
||||
"emoji": "🐧",
|
||||
"code": ":penguin:",
|
||||
"description": "Fixing something on Linux."
|
||||
"description": "Fixing something on Linux.",
|
||||
"name": "penguin"
|
||||
},
|
||||
{
|
||||
"emoji": "🏁",
|
||||
"code": ":checkered_flag:",
|
||||
"description": "Fixing something on Windows."
|
||||
"description": "Fixing something on Windows.",
|
||||
"name": "checkered-flag"
|
||||
},
|
||||
{
|
||||
"emoji": "🔖",
|
||||
"code": ":bookmark:",
|
||||
"description": "Releasing / Version tags."
|
||||
"description": "Releasing / Version tags.",
|
||||
"name": "bookmark"
|
||||
},
|
||||
{
|
||||
"emoji": "🚨",
|
||||
"code": ":rotating_light:",
|
||||
"description": "Removing linter warnings."
|
||||
"description": "Removing linter warnings.",
|
||||
"name": "rotating-light"
|
||||
},
|
||||
{
|
||||
"emoji": "🚀",
|
||||
"code": ":rocket:",
|
||||
"description": "Deploying stuff."
|
||||
"description": "Deploying stuff.",
|
||||
"name": "rocket"
|
||||
},
|
||||
{
|
||||
"emoji": "⚡️",
|
||||
"code": ":zap:",
|
||||
"description": "Improving performance."
|
||||
"description": "Improving performance.",
|
||||
"name": "zap"
|
||||
},
|
||||
{
|
||||
"emoji": "🔧",
|
||||
"code": ":wrench:",
|
||||
"description": "Changing configuration files."
|
||||
"description": "Changing configuration files.",
|
||||
"name": "wrench"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
@ -28,10 +28,10 @@
|
||||
"id":"http://jsonschema.net/gitmojis/0/emoji",
|
||||
"required": true
|
||||
},
|
||||
"image":{
|
||||
"name":{
|
||||
"type":"string",
|
||||
"id":"http://jsonschema.net/gitmojis/0/image",
|
||||
"required": false
|
||||
"id":"http://jsonschema.net/gitmojis/0/name",
|
||||
"required": true
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1 +1 @@
|
||||
.col-xs-10,.col-xs-12,.col-xs-2,.row{box-sizing:border-box}.container{margin-right:auto;margin-left:auto}.row{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:0;-webkit-flex:0 1 auto;-ms-flex:0 1 auto;flex:0 1 auto;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-right:-.5rem;margin-left:-.5rem}.col-xs-12{-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:1.25rem;padding-left:1.25rem;-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-xs-10{-webkit-flex-basis:83.333%;-ms-flex-preferred-size:83.333%;flex-basis:83.333%;max-width:83.333%}.col-xs-2{-webkit-flex-basis:16.667%;-ms-flex-preferred-size:16.667%;flex-basis:16.667%;max-width:16.667%}.center-xs{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;text-align:center}.middle-xs{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.around-xs{-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}@media only screen and (min-width:48em){.container{width:49rem}.col-sm-6{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:1.25rem;padding-left:1.25rem;-webkit-flex-basis:50%;-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}}@media only screen and (min-width:64em){.container{width:65rem}.col-md-4,.col-md-5,.col-md-8{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:1.25rem;padding-left:1.25rem}.col-md-4{-webkit-flex-basis:33.333%;-ms-flex-preferred-size:33.333%;flex-basis:33.333%;max-width:33.333%}.col-md-5{-webkit-flex-basis:41.667%;-ms-flex-preferred-size:41.667%;flex-basis:41.667%;max-width:41.667%}.col-md-8{-webkit-flex-basis:66.667%;-ms-flex-preferred-size:66.667%;flex-basis:66.667%;max-width:66.667%}}
|
||||
.col-xs-10,.col-xs-12,.col-xs-2,.col-xs-4,.col-xs-8,.row{box-sizing:border-box}.container{margin-right:auto;margin-left:auto}.row{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-flex:0;-webkit-flex:0 1 auto;-ms-flex:0 1 auto;flex:0 1 auto;-webkit-box-orient:horizontal;-webkit-box-direction:normal;-webkit-flex-direction:row;-ms-flex-direction:row;flex-direction:row;-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-right:-.5rem;margin-left:-.5rem}.col-xs-12{-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:1.25rem;padding-left:1.25rem;-webkit-flex-basis:100%;-ms-flex-preferred-size:100%;flex-basis:100%;max-width:100%}.col-xs-10{-webkit-flex-basis:83.333%;-ms-flex-preferred-size:83.333%;flex-basis:83.333%;max-width:83.333%}.col-xs-2{-webkit-flex-basis:16.667%;-ms-flex-preferred-size:16.667%;flex-basis:16.667%;max-width:16.667%}.center-xs{-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;text-align:center}.middle-xs{-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center}.around-xs{-webkit-justify-content:space-around;-ms-flex-pack:distribute;justify-content:space-around}@media only screen and (min-width:48em){.container{width:49rem}.col-sm-6{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:1.25rem;padding-left:1.25rem;-webkit-flex-basis:50%;-ms-flex-preferred-size:50%;flex-basis:50%;max-width:50%}}@media only screen and (min-width:64em){.container{width:65rem}.col-md-5,.col-md-8,.col-md-3{box-sizing:border-box;-webkit-box-flex:0;-webkit-flex:0 0 auto;-ms-flex:0 0 auto;flex:0 0 auto;padding-right:1.25rem;padding-left:1.25rem}.col-md-3 {-ms-flex-preferred-size: 25%;flex-basis: 25%;max-width: 25%;}}
|
||||
|
||||
@ -4,3 +4,23 @@ $white: #FFF;
|
||||
$menu: #ff5a79;
|
||||
$black: #000;
|
||||
$pink: #ff5a79;
|
||||
|
||||
// Emoji colors
|
||||
|
||||
$fire: #ff9d44;
|
||||
$memo: #fff6d9;
|
||||
$lock: #ffce49;
|
||||
$greenHeart: #77e856;
|
||||
$apple: #f94e43;
|
||||
$rotatingLight: #61696d;
|
||||
$bug: #8cd842;
|
||||
$sparkles: ;
|
||||
$construction: ;
|
||||
$whiteCheckMark: ;
|
||||
$penguin: #fa9a3f;
|
||||
$checkeredFlag:;
|
||||
$bookmark:;
|
||||
$rocket: #00a9f0;
|
||||
$zap:;
|
||||
$wrench:;
|
||||
$art:;
|
||||
|
||||
@ -28,13 +28,9 @@ a {
|
||||
}
|
||||
|
||||
code {
|
||||
padding: 1px 3px;
|
||||
font-size: .85em;
|
||||
white-space: pre-wrap;
|
||||
border: 1px solid #E3EDF3;
|
||||
border-radius: 2px;
|
||||
font-family: Consolas, Inconsolata, monospace, sans-serif;
|
||||
background: #F7FAFB;
|
||||
font-family: Avenir;
|
||||
font-weight: 700;
|
||||
font-size: 1.25em;
|
||||
}
|
||||
|
||||
section {
|
||||
@ -46,6 +42,10 @@ section {
|
||||
padding: 5em 2em;
|
||||
}
|
||||
|
||||
.emoji-container {
|
||||
background-color: #f5f5f5;
|
||||
}
|
||||
|
||||
.gitmoji-logo {
|
||||
width: 100%;
|
||||
height: 90px;
|
||||
@ -87,7 +87,7 @@ section {
|
||||
}
|
||||
|
||||
.wrap {
|
||||
max-width: 1200px;
|
||||
max-width: 1100px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
@ -99,7 +99,7 @@ main.wrap {
|
||||
display: flex;
|
||||
|
||||
.gitmoji {
|
||||
font-size: 3em;
|
||||
font-size: 5em;
|
||||
}
|
||||
|
||||
&-card {
|
||||
@ -107,8 +107,10 @@ main.wrap {
|
||||
margin: 1em 0;
|
||||
flex: 1;
|
||||
transition: all .25s ease-out;
|
||||
border-radius: 2px;
|
||||
box-shadow: 0 5px 10px 0 rgba(168, 182, 191, .6);
|
||||
border-radius: 4px;
|
||||
box-shadow: 0 1px 2px 0 rgba(168, 182, 191, .6);
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
|
||||
&:hover {
|
||||
box-shadow: 0 10px 20px 0 rgba(168, 182, 191, .6)
|
||||
@ -116,16 +118,18 @@ main.wrap {
|
||||
}
|
||||
|
||||
&-info {
|
||||
padding: 2em .5em;
|
||||
padding: 1.5em;
|
||||
}
|
||||
|
||||
&-header {
|
||||
align-self: flex-start;
|
||||
padding-top: 2em;
|
||||
padding-bottom: .85em;
|
||||
}
|
||||
|
||||
&-data {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.icon {
|
||||
margin: 0 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -163,9 +167,6 @@ main.wrap {
|
||||
}
|
||||
|
||||
@media(max-width: 768px) {
|
||||
body {
|
||||
font-size: 18px;
|
||||
}
|
||||
footer nav, footer h3 {
|
||||
justify-content: center!important;
|
||||
text-align: center!important;
|
||||
@ -173,6 +174,12 @@ main.wrap {
|
||||
}
|
||||
|
||||
|
||||
@each $gitmoji, $color in (fire: $fire, lock: $lock, green-heart: $greenHeart, apple: $apple, rotating-light: $rotatingLight, bug: $bug, penguin: $penguin, rocket: $rocket) {
|
||||
.#{$gitmoji} {
|
||||
background-color: $color;
|
||||
}
|
||||
}
|
||||
|
||||
#joy, #loved, #haha, #sunglasses, #sexy, #tongue {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
@ -21,7 +21,7 @@ html
|
||||
link(href="css/style.css", rel="stylesheet", type="text/css")
|
||||
//-style
|
||||
include ../../dist/css/style.css
|
||||
body
|
||||
body.emoji-container
|
||||
include _includes/_icons.pug
|
||||
include _includes/_nav.pug
|
||||
header.header
|
||||
@ -29,13 +29,12 @@ html
|
||||
main.wrap
|
||||
.row.around-xs
|
||||
each gitmoji in emojis.gitmojis
|
||||
article.col-xs-12.col-sm-6.col-md-4.emoji
|
||||
.emoji-card.row.middle-xs
|
||||
.emoji-icon.col-md-4.center-xs
|
||||
span.gitmoji=gitmoji.emoji
|
||||
.emoji-info.col-md-8
|
||||
header.emoji-data
|
||||
code=gitmoji.code
|
||||
article.emoji.col-xs-12.col-sm-6.col-md-3
|
||||
.emoji-card
|
||||
header(class=gitmoji.name+' emoji-header')
|
||||
span.emoji-icon.gitmoji=gitmoji.emoji
|
||||
.emoji-info
|
||||
code=gitmoji.code
|
||||
p=gitmoji.description
|
||||
include _includes/_footer.pug
|
||||
script.
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user