Major website overhaul
This commit is contained in:
Marwolf
144
etc/ghost/themes/casper/assets/scss/components/_aside.scss
Executable file
144
etc/ghost/themes/casper/assets/scss/components/_aside.scss
Executable file
@@ -0,0 +1,144 @@
|
||||
.cover {
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
|
||||
display: block;
|
||||
width: $aside-width-collapsed;
|
||||
height: 100%;
|
||||
overflow-y: auto;
|
||||
|
||||
border-right: 1px solid $gray;
|
||||
box-shadow: 10.5px -10px 1px -9px $gray-light;
|
||||
|
||||
&.animated {
|
||||
transition: width $aside-animation-time $aside-animation;
|
||||
}
|
||||
&.expanded {
|
||||
width: 100%;
|
||||
|
||||
.navigation.left {
|
||||
margin-top: .85rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
}
|
||||
&.container {
|
||||
text-align: center;
|
||||
|
||||
color: $gray-lightest;
|
||||
|
||||
@extend %font-shadow;
|
||||
@extend %center-absolute;
|
||||
@extend %background-filter;
|
||||
}
|
||||
}
|
||||
|
||||
#profile-resume {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.profile {
|
||||
max-width: 38.75rem;
|
||||
> p {
|
||||
margin: 10px 2rem;
|
||||
|
||||
font-size: .9rem;
|
||||
}
|
||||
> a {
|
||||
> h1 {
|
||||
margin: 10px auto;
|
||||
|
||||
font-family: $sans-font;
|
||||
font-size: $unit * 1.6;
|
||||
font-weight: bold;
|
||||
|
||||
letter-spacing: .05rem;
|
||||
|
||||
color: $gray-lightest;
|
||||
}
|
||||
> h3 {
|
||||
margin: 0;
|
||||
|
||||
color: $gray-lightest;
|
||||
}
|
||||
> img {
|
||||
width: 7rem;
|
||||
|
||||
border: 2px solid rgba($primary-color, .1);
|
||||
box-shadow: 0 0 1px 1px rgba(000, 000, 000, .3);
|
||||
}
|
||||
}
|
||||
}
|
||||
.navigation {
|
||||
&.left {
|
||||
display: inline-block;
|
||||
.links {
|
||||
margin: 0;
|
||||
|
||||
list-style: none;
|
||||
|
||||
> li {
|
||||
display: block;
|
||||
margin: 0 1px 0 0;
|
||||
|
||||
line-height: 1em;
|
||||
|
||||
&.expanded {
|
||||
display: inline-block;
|
||||
margin: 0 5px;
|
||||
|
||||
border-radius: 20px;
|
||||
|
||||
@extend %btn-cover-with-border;
|
||||
|
||||
> a {
|
||||
padding: .625rem 1.25rem;
|
||||
}
|
||||
}
|
||||
|
||||
> a {
|
||||
display: block;
|
||||
float: none;
|
||||
padding: .5rem 1.25rem;
|
||||
|
||||
opacity: .8;
|
||||
color: $gray-lightest;
|
||||
|
||||
@extend %btn-cover;
|
||||
|
||||
&:hover {
|
||||
color: $hover-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
&.right {
|
||||
display: block;
|
||||
margin: .5rem;
|
||||
.social {
|
||||
margin: 0;
|
||||
&.item {
|
||||
display: inline-block;
|
||||
margin: 0 4px 0 0;
|
||||
|
||||
line-height: 1em;
|
||||
a {
|
||||
padding: 6px 8px 6px 9px;
|
||||
|
||||
@extend %btn-cover;
|
||||
.label {
|
||||
display: none;
|
||||
}
|
||||
.icon {
|
||||
display: block;
|
||||
|
||||
font-size: 1.7em;
|
||||
}
|
||||
&:hover {
|
||||
color: $hover-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
24
etc/ghost/themes/casper/assets/scss/components/_loading.scss
Executable file
24
etc/ghost/themes/casper/assets/scss/components/_loading.scss
Executable file
@@ -0,0 +1,24 @@
|
||||
// more in http://github.hubspot.com/pace/docs/welcome/
|
||||
|
||||
.pace {
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
user-select: none;
|
||||
pointer-events: none;
|
||||
|
||||
-webkit-pointer-events: none;
|
||||
}
|
||||
.pace-inactive {
|
||||
display: none;
|
||||
}
|
||||
.pace .pace-progress {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
right: 100%;
|
||||
z-index: 2000;
|
||||
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
|
||||
background: $primary-color;
|
||||
}
|
||||
225
etc/ghost/themes/casper/assets/scss/components/_media-queries.scss
Executable file
225
etc/ghost/themes/casper/assets/scss/components/_media-queries.scss
Executable file
@@ -0,0 +1,225 @@
|
||||
// ------------------------------
|
||||
// MEDIA QUERIES
|
||||
// ------------------------------
|
||||
|
||||
@media only screen and (min-width:1824px) {
|
||||
main {
|
||||
padding: 2.5rem 11rem;
|
||||
}
|
||||
|
||||
.content {
|
||||
margin: 0 7rem;
|
||||
}
|
||||
}
|
||||
|
||||
// ------------------------------
|
||||
// < 1024px (Tablet)
|
||||
// ------------------------------
|
||||
|
||||
@media all and (max-width:1024px) {
|
||||
/* disabling element, too much information*/
|
||||
|
||||
.pace,
|
||||
span.post.tags,
|
||||
.post.reading-time,
|
||||
.post.related {
|
||||
display: none;
|
||||
}
|
||||
|
||||
#search-container {
|
||||
display: none !important;
|
||||
}/* Enable element special for little devices */
|
||||
|
||||
#profile-resume {
|
||||
display: inherit;
|
||||
}/* off canvas */
|
||||
|
||||
#menu-button {
|
||||
position: fixed;
|
||||
top: .5rem;
|
||||
left: 13.5rem;
|
||||
z-index: 2;
|
||||
display: block;
|
||||
transition: all $aside-animation-time;
|
||||
|
||||
&.expanded {
|
||||
left: .85rem;
|
||||
}
|
||||
|
||||
> a {
|
||||
> i {
|
||||
color: $hover-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cover {
|
||||
width: 16rem;
|
||||
transition: width $aside-animation-time $aside-animation,
|
||||
transform $aside-animation-time $aside-animation,
|
||||
border-right $aside-animation-time * 1.8 $aside-animation,
|
||||
box-shadow $aside-animation-time * 1.8 $aside-animation;
|
||||
transform: translate3d(-16rem, 0, 0);
|
||||
border-right: 0;
|
||||
box-shadow: none;
|
||||
|
||||
&.expanded {
|
||||
width: 16rem;
|
||||
transform: translate3d(0, 0, 0);
|
||||
border-right: 1px solid $gray;
|
||||
box-shadow: 11px -10px 1px -9px $gray-light;
|
||||
}
|
||||
|
||||
&.animated {
|
||||
transition: all $aside-animation-time;
|
||||
}
|
||||
}
|
||||
|
||||
.profile {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-width: 100%;
|
||||
|
||||
&.contact {
|
||||
> nav {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
|
||||
> a {
|
||||
> img {
|
||||
width: 8rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
> h1 {
|
||||
margin: 0
|
||||
}
|
||||
}
|
||||
|
||||
> p {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.divider {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
.navigation {
|
||||
&.left {
|
||||
margin-top: 1.2rem;
|
||||
margin-bottom: 1rem;
|
||||
.links {
|
||||
> li {
|
||||
margin: 0;
|
||||
|
||||
> a {
|
||||
padding: .85rem 1.25rem;
|
||||
font-size: 1rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#avatar-link {
|
||||
display: inline-block;
|
||||
margin-top: 4rem;
|
||||
}
|
||||
|
||||
.navigation {
|
||||
width: 100%;
|
||||
|
||||
&.right {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
&.left {
|
||||
.links.item {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
main {
|
||||
left: 0;
|
||||
transition: all $aside-animation-time;
|
||||
transform: translate3d(0, 0, 0);
|
||||
|
||||
&.expanded {
|
||||
transform: translate3d(14rem, 0, 0);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// ------------------------------
|
||||
// < 480px (Mobile)
|
||||
// ------------------------------
|
||||
|
||||
@media all and (max-width:480px) {
|
||||
.post .tags,
|
||||
.post .meta > time,
|
||||
.pagination > span {
|
||||
display: none;
|
||||
}
|
||||
|
||||
main {
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.btn {
|
||||
display: block;
|
||||
margin-bottom: .4em;
|
||||
}
|
||||
|
||||
.mayday {
|
||||
width: auto;
|
||||
|
||||
> h2 {
|
||||
font-size: 20px;
|
||||
line-height: 25px;
|
||||
}
|
||||
}
|
||||
|
||||
.astronaut {
|
||||
background-size: 55%;
|
||||
}
|
||||
|
||||
.astro-wrap {
|
||||
margin: -5% auto;
|
||||
}
|
||||
|
||||
.astro-wrap,
|
||||
.astronaut {
|
||||
height: 10rem;
|
||||
}
|
||||
|
||||
#panic-button {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.posts.newer,
|
||||
.posts.older {
|
||||
margin: 1rem 0;
|
||||
}
|
||||
|
||||
#posts-list {
|
||||
margin: 3rem 0;
|
||||
text-align: center;
|
||||
> li {
|
||||
margin-bottom: 2rem;
|
||||
|
||||
> time {
|
||||
display: block;
|
||||
float: none;
|
||||
letter-spacing: 1px;
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#post-title {
|
||||
margin: 2.5rem 0;
|
||||
}
|
||||
}
|
||||
43
etc/ghost/themes/casper/assets/scss/components/_page-error.scss
Executable file
43
etc/ghost/themes/casper/assets/scss/components/_page-error.scss
Executable file
@@ -0,0 +1,43 @@
|
||||
body[data-page="error"] {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
font-size: 1rem;
|
||||
font-weight: normal;
|
||||
line-height: 25px;
|
||||
text-align: center;
|
||||
|
||||
@extend %background-filter;
|
||||
> article {
|
||||
@extend %center-absolute;
|
||||
}
|
||||
}
|
||||
|
||||
.mayday {
|
||||
width: 500px;
|
||||
margin: 150px auto 20px;
|
||||
|
||||
> h2 {
|
||||
font-size: 24px;
|
||||
line-height: 35px;
|
||||
color: $gray-lightest;
|
||||
text-shadow: 0 1px 1px rgba(0, 0, 0, .4);
|
||||
}
|
||||
}
|
||||
|
||||
.astro-wrap {
|
||||
position: relative;
|
||||
width: $astronaut-size;
|
||||
height: $astronaut-size * 1.6;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.astronaut {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: $astronaut-size;
|
||||
height: $astronaut-size * 1.6;
|
||||
transform: translate(0, 50px);
|
||||
animation: move 10s infinite;
|
||||
background: url('/assets/img/pikachu.jpg') center / cover no-repeat;
|
||||
}
|
||||
19
etc/ghost/themes/casper/assets/scss/components/_pagination.scss
Executable file
19
etc/ghost/themes/casper/assets/scss/components/_pagination.scss
Executable file
@@ -0,0 +1,19 @@
|
||||
.pagination {
|
||||
margin: 0 0 2.5rem;
|
||||
}
|
||||
|
||||
.posts {
|
||||
|
||||
&.index {
|
||||
font-size: .8rem;
|
||||
color: $gray-dark;
|
||||
}
|
||||
|
||||
&.newer {
|
||||
margin-right: 1rem;
|
||||
}
|
||||
|
||||
&.older {
|
||||
margin-left: 1rem;
|
||||
}
|
||||
}
|
||||
138
etc/ghost/themes/casper/assets/scss/components/_post.scss
Executable file
138
etc/ghost/themes/casper/assets/scss/components/_post.scss
Executable file
@@ -0,0 +1,138 @@
|
||||
#posts-list {
|
||||
padding: 0;
|
||||
margin: 5rem 0;
|
||||
list-style-type: none;
|
||||
|
||||
> li {
|
||||
margin-left: 1rem;
|
||||
margin-bottom: 1.25rem;
|
||||
|
||||
> time {
|
||||
float: right;
|
||||
text-transform: uppercase;
|
||||
color: #777;
|
||||
font-size: 10px;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
> a {
|
||||
@extend %dotted-link;
|
||||
}
|
||||
|
||||
> span > a {
|
||||
bottom: 2px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#post-content {
|
||||
|
||||
a:not(.title-link) {
|
||||
@extend %dotted-link;
|
||||
}
|
||||
|
||||
a.title-link {
|
||||
color: $primary-color;
|
||||
}
|
||||
|
||||
.deep-link a:before {
|
||||
display: inline-block;
|
||||
content: "#";
|
||||
margin-left: -30px;
|
||||
width: 30px;
|
||||
color: $white;
|
||||
transition: all 0.2s;
|
||||
font-family: $quote-font;
|
||||
}
|
||||
|
||||
.deep-link a:hover::before {
|
||||
color: rgba($primary-color, .8);
|
||||
}
|
||||
}
|
||||
|
||||
.post {
|
||||
> p {
|
||||
> img {
|
||||
border-radius: $border-radius;
|
||||
display: block;
|
||||
margin: 1.5rem auto;
|
||||
max-width: 100%;
|
||||
text-align: center;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
pre {
|
||||
width: 95%;
|
||||
}
|
||||
|
||||
> header {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
&.meta {
|
||||
margin: .7em 0;
|
||||
font-size: .85rem;
|
||||
color: $gray;
|
||||
}
|
||||
|
||||
&.tags {
|
||||
> a {
|
||||
&:first-child {
|
||||
margin-left: .2rem;
|
||||
}
|
||||
|
||||
&:last-child {
|
||||
margin-right: .2rem;
|
||||
}
|
||||
padding: .15rem .25rem;
|
||||
font-size: .55rem;
|
||||
transition: all $aside-animation-time;
|
||||
text-transform: uppercase;
|
||||
color: $gray-lightest;
|
||||
border-radius: .25rem;
|
||||
background-color: rgba($primary-color, .45);
|
||||
|
||||
&:hover {
|
||||
background-color: rgba($primary-color, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.author {
|
||||
img {
|
||||
display: inline-block;
|
||||
height: 22px;
|
||||
margin: 0 .5rem;
|
||||
vertical-align: middle;
|
||||
border: 0;
|
||||
box-shadow: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.comments {
|
||||
padding: 2rem 0 0;
|
||||
}
|
||||
|
||||
&.related {
|
||||
line-height: 1;
|
||||
display: flex;
|
||||
padding: 4rem 0 2rem;
|
||||
justify-content: space-between;
|
||||
}
|
||||
}
|
||||
|
||||
#post-image {
|
||||
max-width: 100%;
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
#post-title {
|
||||
font-size: $font-title;
|
||||
margin: 3rem 0 2.5rem;
|
||||
transition: all $aside-animation-time;
|
||||
|
||||
&:hover {
|
||||
color: $hover-color;
|
||||
}
|
||||
}
|
||||
63
etc/ghost/themes/casper/assets/scss/components/_search.scss
Executable file
63
etc/ghost/themes/casper/assets/scss/components/_search.scss
Executable file
@@ -0,0 +1,63 @@
|
||||
#search-form {
|
||||
padding: .25rem 0;
|
||||
}
|
||||
|
||||
#search-field {
|
||||
width: 12.5rem;
|
||||
height: 1rem;
|
||||
padding: 4% 5px 4% 18px;
|
||||
transition: border .3s ease-in;
|
||||
border-radius: 1.68rem;
|
||||
|
||||
&:focus,
|
||||
&:hover {
|
||||
border: 1.5px solid lighten($hover-color, 5%);
|
||||
}
|
||||
}
|
||||
|
||||
#search-results {
|
||||
text-align: center;
|
||||
|
||||
&.active {
|
||||
margin-top: 3rem;
|
||||
margin-bottom: 9rem;
|
||||
}
|
||||
|
||||
> p {
|
||||
margin-bottom: 3rem;
|
||||
font-size: 1.2rem;
|
||||
}
|
||||
}
|
||||
|
||||
.result {
|
||||
display: block;
|
||||
padding: 1rem;
|
||||
margin-bottom: 1.3rem;
|
||||
text-decoration: none;
|
||||
word-wrap: break-word;
|
||||
border: 1px solid $primary-color;
|
||||
border-radius: 5px;
|
||||
|
||||
> h2,
|
||||
> h4 {
|
||||
color: $gray-darker;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
transition: .5s;
|
||||
|
||||
> h2,
|
||||
> h4 {
|
||||
transition: .5s;
|
||||
color: $hover-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.icon-search {
|
||||
position: absolute;
|
||||
top: 31.5rem;
|
||||
left: 16.5rem;
|
||||
color: $gray;
|
||||
text-shadow: 1px 1px 0 $gray;
|
||||
}
|
||||
60
etc/ghost/themes/casper/assets/scss/modules/_buttons.scss
Executable file
60
etc/ghost/themes/casper/assets/scss/modules/_buttons.scss
Executable file
@@ -0,0 +1,60 @@
|
||||
img,
|
||||
.btn {
|
||||
&.square {
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
&.rounded {
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.btn {
|
||||
border: 1px solid $primary-color;
|
||||
border-radius: 20px;
|
||||
color: $primary-color;
|
||||
font-size: .9em;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-weight: bold;
|
||||
letter-spacing: 1px;
|
||||
padding: 10px 20px;
|
||||
text-shadow: none;
|
||||
|
||||
&:hover {
|
||||
border-color: darken($primary-color, 15%);
|
||||
color: darken($primary-color, 15%);
|
||||
}
|
||||
|
||||
&.small {
|
||||
font-size: .7em;
|
||||
padding: 8px 12px;
|
||||
}
|
||||
|
||||
&.large {
|
||||
font-size: 1.1em;
|
||||
padding: 10px 24px;
|
||||
}
|
||||
|
||||
&.secondary {
|
||||
border-color: $secondary-color;
|
||||
color: $secondary-color;
|
||||
|
||||
&:hover {
|
||||
border-color: darken($secondary-color, 15%);
|
||||
color: darken($secondary-color, 15%);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
#menu-button {
|
||||
display: none;
|
||||
|
||||
> a {
|
||||
> i {
|
||||
color: $gray-lightest;
|
||||
font-size: 36px;
|
||||
position: relative;
|
||||
top: 3px;
|
||||
}
|
||||
}
|
||||
}
|
||||
197
etc/ghost/themes/casper/assets/scss/modules/_effects.scss
Executable file
197
etc/ghost/themes/casper/assets/scss/modules/_effects.scss
Executable file
@@ -0,0 +1,197 @@
|
||||
/* Grow Rotate */
|
||||
.hvr-grow-rotate {
|
||||
display: inline-block;
|
||||
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
-webkit-transition-duration: .3s;
|
||||
transition-duration: .3s;
|
||||
-webkit-transition-property: transform;
|
||||
transition-property: transform;
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
vertical-align: middle;
|
||||
|
||||
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
|
||||
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
.hvr-grow-rotate:hover,
|
||||
.hvr-grow-rotate:focus,
|
||||
.hvr-grow-rotate:active {
|
||||
-webkit-transform: scale(1.1) rotate(4deg);
|
||||
transform: scale(1.1) rotate(4deg);
|
||||
}
|
||||
|
||||
/* Buzz Out */
|
||||
@-webkit-keyframes hvr-buzz-out {
|
||||
10% {
|
||||
-webkit-transform: translateX(3px) rotate(2deg);
|
||||
transform: translateX(3px) rotate(2deg);
|
||||
}
|
||||
20% {
|
||||
-webkit-transform: translateX(-3px) rotate(-2deg);
|
||||
transform: translateX(-3px) rotate(-2deg);
|
||||
}
|
||||
30% {
|
||||
-webkit-transform: translateX(3px) rotate(2deg);
|
||||
transform: translateX(3px) rotate(2deg);
|
||||
}
|
||||
40% {
|
||||
-webkit-transform: translateX(-3px) rotate(-2deg);
|
||||
transform: translateX(-3px) rotate(-2deg);
|
||||
}
|
||||
50% {
|
||||
-webkit-transform: translateX(2px) rotate(1deg);
|
||||
transform: translateX(2px) rotate(1deg);
|
||||
}
|
||||
60% {
|
||||
-webkit-transform: translateX(-2px) rotate(-1deg);
|
||||
transform: translateX(-2px) rotate(-1deg);
|
||||
}
|
||||
70% {
|
||||
-webkit-transform: translateX(2px) rotate(1deg);
|
||||
transform: translateX(2px) rotate(1deg);
|
||||
}
|
||||
80% {
|
||||
-webkit-transform: translateX(-2px) rotate(-1deg);
|
||||
transform: translateX(-2px) rotate(-1deg);
|
||||
}
|
||||
90% {
|
||||
-webkit-transform: translateX(1px) rotate(0);
|
||||
transform: translateX(1px) rotate(0);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: translateX(-1px) rotate(0);
|
||||
transform: translateX(-1px) rotate(0);
|
||||
}
|
||||
}
|
||||
@keyframes hvr-buzz-out {
|
||||
10% {
|
||||
-webkit-transform: translateX(3px) rotate(2deg);
|
||||
transform: translateX(3px) rotate(2deg);
|
||||
}
|
||||
20% {
|
||||
-webkit-transform: translateX(-3px) rotate(-2deg);
|
||||
transform: translateX(-3px) rotate(-2deg);
|
||||
}
|
||||
30% {
|
||||
-webkit-transform: translateX(3px) rotate(2deg);
|
||||
transform: translateX(3px) rotate(2deg);
|
||||
}
|
||||
40% {
|
||||
-webkit-transform: translateX(-3px) rotate(-2deg);
|
||||
transform: translateX(-3px) rotate(-2deg);
|
||||
}
|
||||
50% {
|
||||
-webkit-transform: translateX(2px) rotate(1deg);
|
||||
transform: translateX(2px) rotate(1deg);
|
||||
}
|
||||
60% {
|
||||
-webkit-transform: translateX(-2px) rotate(-1deg);
|
||||
transform: translateX(-2px) rotate(-1deg);
|
||||
}
|
||||
70% {
|
||||
-webkit-transform: translateX(2px) rotate(1deg);
|
||||
transform: translateX(2px) rotate(1deg);
|
||||
}
|
||||
80% {
|
||||
-webkit-transform: translateX(-2px) rotate(-1deg);
|
||||
transform: translateX(-2px) rotate(-1deg);
|
||||
}
|
||||
90% {
|
||||
-webkit-transform: translateX(1px) rotate(0);
|
||||
transform: translateX(1px) rotate(0);
|
||||
}
|
||||
100% {
|
||||
-webkit-transform: translateX(-1px) rotate(0);
|
||||
transform: translateX(-1px) rotate(0);
|
||||
}
|
||||
}
|
||||
.hvr-buzz-out {
|
||||
display: inline-block;
|
||||
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
|
||||
-webkit-transform: translateZ(0);
|
||||
transform: translateZ(0);
|
||||
vertical-align: middle;
|
||||
|
||||
box-shadow: 0 0 1px rgba(0, 0, 0, 0);
|
||||
|
||||
-webkit-backface-visibility: hidden;
|
||||
backface-visibility: hidden;
|
||||
}
|
||||
.hvr-buzz-out:hover,
|
||||
.hvr-buzz-out:focus,
|
||||
.hvr-buzz-out:active {
|
||||
-webkit-animation-name: hvr-buzz-out;
|
||||
animation-name: hvr-buzz-out;
|
||||
-webkit-animation-duration: .75s;
|
||||
animation-duration: .75s;
|
||||
-webkit-animation-timing-function: linear;
|
||||
animation-timing-function: linear;
|
||||
-webkit-animation-iteration-count: 1;
|
||||
animation-iteration-count: 1;
|
||||
}
|
||||
@keyframes move {
|
||||
0% {
|
||||
transform: translate(0, 50px);
|
||||
}
|
||||
50% {
|
||||
transform: translate(20px, 100px);
|
||||
}
|
||||
100% {
|
||||
transform: translate(0, 50px);
|
||||
}
|
||||
}
|
||||
@keyframes blink {
|
||||
0% {
|
||||
top: 50px;
|
||||
left: 0;
|
||||
}
|
||||
50% {
|
||||
top: 100px;
|
||||
left: 20px;
|
||||
}
|
||||
100% {
|
||||
top: 50px;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
@keyframes flicker {
|
||||
0% {
|
||||
opacity: .9;
|
||||
}
|
||||
30% {
|
||||
opacity: .97;
|
||||
}
|
||||
40% {
|
||||
opacity: 1;
|
||||
}
|
||||
80% {
|
||||
opacity: .9;
|
||||
}
|
||||
88% {
|
||||
opacity: .98;
|
||||
}
|
||||
90% {
|
||||
opacity: .94;
|
||||
}
|
||||
93% {
|
||||
opacity: .9;
|
||||
}
|
||||
95% {
|
||||
opacity: .99;
|
||||
}
|
||||
96% {
|
||||
opacity: .93;
|
||||
}
|
||||
98% {
|
||||
opacity: 1;
|
||||
}
|
||||
99% {
|
||||
opacity: .93;
|
||||
}
|
||||
}
|
||||
894
etc/ghost/themes/casper/assets/scss/modules/_fonts.scss
Executable file
894
etc/ghost/themes/casper/assets/scss/modules/_fonts.scss
Executable file
@@ -0,0 +1,894 @@
|
||||
/*
|
||||
* Foundation Icons v 3.0
|
||||
* Made by ZURB 2013 http://zurb.com/playground/foundation-icon-fonts-3
|
||||
* MIT License
|
||||
*/
|
||||
@font-face {
|
||||
font-family: "foundation-icons";
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
src: url("../fonts/foundation-icons/foundation-icons.eot");
|
||||
src: url("../fonts/foundation-icons/foundation-icons.eot?#iefix") format("embedded-opentype"), url("../fonts/foundation-icons/foundation-icons.woff") format("woff"), url("../fonts/foundation-icons/foundation-icons.ttf") format("truetype"), url("../fonts/foundation-icons/foundation-icons.svg#fontcustom") format("svg");
|
||||
}
|
||||
.icon:before,
|
||||
.icon-reverse:after {
|
||||
display: inline-block;
|
||||
|
||||
font-family: "foundation-icons";
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
line-height: 1;
|
||||
|
||||
text-decoration: inherit;
|
||||
text-transform: none;
|
||||
}
|
||||
.icon-search {
|
||||
position: static !important;
|
||||
}
|
||||
.icon-search:before {
|
||||
position: absolute;
|
||||
right: 95px;
|
||||
margin-top: 32px;
|
||||
content: "\f16c";
|
||||
}
|
||||
.icon-address-book:before {
|
||||
content: "\f100";
|
||||
}
|
||||
.icon-alert:before {
|
||||
content: "\f101";
|
||||
}
|
||||
.icon-align-center:before {
|
||||
content: "\f102";
|
||||
}
|
||||
.icon-align-justify:before {
|
||||
content: "\f103";
|
||||
}
|
||||
.icon-align-left:before {
|
||||
content: "\f104";
|
||||
}
|
||||
.icon-align-right:before {
|
||||
content: "\f105";
|
||||
}
|
||||
.icon-anchor:before {
|
||||
content: "\f106";
|
||||
}
|
||||
.icon-annotate:before {
|
||||
content: "\f107";
|
||||
}
|
||||
.icon-archive:before {
|
||||
content: "\f108";
|
||||
}
|
||||
.icon-arrow-down:before {
|
||||
content: "\f109";
|
||||
}
|
||||
.icon-arrow-left:before {
|
||||
content: "\f10a";
|
||||
}
|
||||
.icon-arrow-right:before {
|
||||
content: "\f10b";
|
||||
}
|
||||
.icon-arrow-up:before {
|
||||
content: "\f10c";
|
||||
}
|
||||
.icon-arrows-compress:before {
|
||||
content: "\f10d";
|
||||
}
|
||||
.icon-arrows-expand:before {
|
||||
content: "\f10e";
|
||||
}
|
||||
.icon-arrows-in:before {
|
||||
content: "\f10f";
|
||||
}
|
||||
.icon-arrows-out:before {
|
||||
content: "\f110";
|
||||
}
|
||||
.icon-asl:before {
|
||||
content: "\f111";
|
||||
}
|
||||
.icon-asterisk:before {
|
||||
content: "\f112";
|
||||
}
|
||||
.icon-at-sign:before {
|
||||
content: "\f113";
|
||||
}
|
||||
.icon-background-color:before {
|
||||
content: "\f114";
|
||||
}
|
||||
.icon-battery-empty:before {
|
||||
content: "\f115";
|
||||
}
|
||||
.icon-battery-full:before {
|
||||
content: "\f116";
|
||||
}
|
||||
.icon-battery-half:before {
|
||||
content: "\f117";
|
||||
}
|
||||
.icon-bitcoin-circle:before {
|
||||
content: "\f118";
|
||||
}
|
||||
.icon-bitcoin:before {
|
||||
content: "\f119";
|
||||
}
|
||||
.icon-blind:before {
|
||||
content: "\f11a";
|
||||
}
|
||||
.icon-bluetooth:before {
|
||||
content: "\f11b";
|
||||
}
|
||||
.icon-bold:before {
|
||||
content: "\f11c";
|
||||
}
|
||||
.icon-book-bookmark:before {
|
||||
content: "\f11d";
|
||||
}
|
||||
.icon-book:before {
|
||||
content: "\f11e";
|
||||
}
|
||||
.icon-bookmark:before {
|
||||
content: "\f11f";
|
||||
}
|
||||
.icon-braille:before {
|
||||
content: "\f120";
|
||||
}
|
||||
.icon-burst-new:before {
|
||||
content: "\f121";
|
||||
}
|
||||
.icon-burst-sale:before {
|
||||
content: "\f122";
|
||||
}
|
||||
.icon-burst:before {
|
||||
content: "\f123";
|
||||
}
|
||||
.icon-calendar:before {
|
||||
content: "\f124";
|
||||
}
|
||||
.icon-camera:before {
|
||||
content: "\f125";
|
||||
}
|
||||
.icon-check:before {
|
||||
content: "\f126";
|
||||
}
|
||||
.icon-checkbox:before {
|
||||
content: "\f127";
|
||||
}
|
||||
.icon-clipboard-notes:before {
|
||||
content: "\f128";
|
||||
}
|
||||
.icon-clipboard-pencil:before {
|
||||
content: "\f129";
|
||||
}
|
||||
.icon-clipboard:before {
|
||||
content: "\f12a";
|
||||
}
|
||||
.icon-clock:before {
|
||||
content: "\f12b";
|
||||
}
|
||||
.icon-closed-caption:before {
|
||||
content: "\f12c";
|
||||
}
|
||||
.icon-cloud:before {
|
||||
content: "\f12d";
|
||||
}
|
||||
.icon-comment-minus:before {
|
||||
content: "\f12e";
|
||||
}
|
||||
.icon-comment-quotes:before {
|
||||
content: "\f12f";
|
||||
}
|
||||
.icon-comment-video:before {
|
||||
content: "\f130";
|
||||
}
|
||||
.icon-comment:before {
|
||||
content: "\f131";
|
||||
}
|
||||
.icon-comments:before {
|
||||
content: "\f132";
|
||||
}
|
||||
.icon-compass:before {
|
||||
content: "\f133";
|
||||
}
|
||||
.icon-contrast:before {
|
||||
content: "\f134";
|
||||
}
|
||||
.icon-credit-card:before {
|
||||
content: "\f135";
|
||||
}
|
||||
.icon-crop:before {
|
||||
content: "\f136";
|
||||
}
|
||||
.icon-crown:before {
|
||||
content: "\f137";
|
||||
}
|
||||
.icon-css3:before {
|
||||
content: "\f138";
|
||||
}
|
||||
.icon-database:before {
|
||||
content: "\f139";
|
||||
}
|
||||
.icon-die-five:before {
|
||||
content: "\f13a";
|
||||
}
|
||||
.icon-die-four:before {
|
||||
content: "\f13b";
|
||||
}
|
||||
.icon-die-one:before {
|
||||
content: "\f13c";
|
||||
}
|
||||
.icon-die-six:before {
|
||||
content: "\f13d";
|
||||
}
|
||||
.icon-die-three:before {
|
||||
content: "\f13e";
|
||||
}
|
||||
.icon-die-two:before {
|
||||
content: "\f13f";
|
||||
}
|
||||
.icon-dislike:before {
|
||||
content: "\f140";
|
||||
}
|
||||
.icon-dollar-bill:before {
|
||||
content: "\f141";
|
||||
}
|
||||
.icon-dollar:before {
|
||||
content: "\f142";
|
||||
}
|
||||
.icon-download:before {
|
||||
content: "\f143";
|
||||
}
|
||||
.icon-eject:before {
|
||||
content: "\f144";
|
||||
}
|
||||
.icon-elevator:before {
|
||||
content: "\f145";
|
||||
}
|
||||
.icon-euro:before {
|
||||
content: "\f146";
|
||||
}
|
||||
.icon-eye:before {
|
||||
content: "\f147";
|
||||
}
|
||||
.icon-fast-forward:before {
|
||||
content: "\f148";
|
||||
}
|
||||
.icon-female-symbol:before {
|
||||
content: "\f149";
|
||||
}
|
||||
.icon-female:before {
|
||||
content: "\f14a";
|
||||
}
|
||||
.icon-filter:before {
|
||||
content: "\f14b";
|
||||
}
|
||||
.icon-first-aid:before {
|
||||
content: "\f14c";
|
||||
}
|
||||
.icon-flag:before {
|
||||
content: "\f14d";
|
||||
}
|
||||
.icon-folder-add:before {
|
||||
content: "\f14e";
|
||||
}
|
||||
.icon-folder-lock:before {
|
||||
content: "\f14f";
|
||||
}
|
||||
.icon-folder:before {
|
||||
content: "\f150";
|
||||
}
|
||||
.icon-foot:before {
|
||||
content: "\f151";
|
||||
}
|
||||
.icon-foundation:before {
|
||||
content: "\f152";
|
||||
}
|
||||
.icon-graph-bar:before {
|
||||
content: "\f153";
|
||||
}
|
||||
.icon-graph-horizontal:before {
|
||||
content: "\f154";
|
||||
}
|
||||
.icon-graph-pie:before {
|
||||
content: "\f155";
|
||||
}
|
||||
.icon-graph-trend:before {
|
||||
content: "\f156";
|
||||
}
|
||||
.icon-guide-dog:before {
|
||||
content: "\f157";
|
||||
}
|
||||
.icon-hearing-aid:before {
|
||||
content: "\f158";
|
||||
}
|
||||
.icon-heart:before {
|
||||
content: "\f159";
|
||||
}
|
||||
.icon-home:before {
|
||||
content: "\f15a";
|
||||
}
|
||||
.icon-html5:before {
|
||||
content: "\f15b";
|
||||
}
|
||||
.icon-indent-less:before {
|
||||
content: "\f15c";
|
||||
}
|
||||
.icon-indent-more:before {
|
||||
content: "\f15d";
|
||||
}
|
||||
.icon-info:before {
|
||||
content: "\f15e";
|
||||
}
|
||||
.icon-italic:before {
|
||||
content: "\f15f";
|
||||
}
|
||||
.icon-key:before {
|
||||
content: "\f160";
|
||||
}
|
||||
.icon-laptop:before {
|
||||
content: "\f161";
|
||||
}
|
||||
.icon-layout:before {
|
||||
content: "\f162";
|
||||
}
|
||||
.icon-lightbulb:before {
|
||||
content: "\f163";
|
||||
}
|
||||
.icon-like:before {
|
||||
content: "\f164";
|
||||
}
|
||||
.icon-link:before {
|
||||
content: "\f165";
|
||||
}
|
||||
.icon-list-bullet:before {
|
||||
content: "\f166";
|
||||
}
|
||||
.icon-list-number:before {
|
||||
content: "\f167";
|
||||
}
|
||||
.icon-list-thumbnails:before {
|
||||
content: "\f168";
|
||||
}
|
||||
.icon-list:before {
|
||||
content: "\f169";
|
||||
}
|
||||
.icon-lock:before {
|
||||
content: "\f16a";
|
||||
}
|
||||
.icon-loop:before {
|
||||
content: "\f16b";
|
||||
}
|
||||
.icon-magnifying-glass:before {
|
||||
content: "\f16c";
|
||||
}
|
||||
.icon-mail:before {
|
||||
content: "\f16d";
|
||||
}
|
||||
.icon-male-female:before {
|
||||
content: "\f16e";
|
||||
}
|
||||
.icon-male-symbol:before {
|
||||
content: "\f16f";
|
||||
}
|
||||
.icon-male:before {
|
||||
content: "\f170";
|
||||
}
|
||||
.icon-map:before {
|
||||
content: "\f171";
|
||||
}
|
||||
.icon-marker:before {
|
||||
content: "\f172";
|
||||
}
|
||||
.icon-megaphone:before {
|
||||
content: "\f173";
|
||||
}
|
||||
.icon-microphone:before {
|
||||
content: "\f174";
|
||||
}
|
||||
.icon-minus-circle:before {
|
||||
content: "\f175";
|
||||
}
|
||||
.icon-minus:before {
|
||||
content: "\f176";
|
||||
}
|
||||
.icon-mobile-signal:before {
|
||||
content: "\f177";
|
||||
}
|
||||
.icon-mobile:before {
|
||||
content: "\f178";
|
||||
}
|
||||
.icon-monitor:before {
|
||||
content: "\f179";
|
||||
}
|
||||
.icon-mountains:before {
|
||||
content: "\f17a";
|
||||
}
|
||||
.icon-music:before {
|
||||
content: "\f17b";
|
||||
}
|
||||
.icon-next:before {
|
||||
content: "\f17c";
|
||||
}
|
||||
.icon-no-dogs:before {
|
||||
content: "\f17d";
|
||||
}
|
||||
.icon-no-smoking:before {
|
||||
content: "\f17e";
|
||||
}
|
||||
.icon-page-add:before {
|
||||
content: "\f17f";
|
||||
}
|
||||
.icon-page-copy:before {
|
||||
content: "\f180";
|
||||
}
|
||||
.icon-page-csv:before {
|
||||
content: "\f181";
|
||||
}
|
||||
.icon-page-delete:before {
|
||||
content: "\f182";
|
||||
}
|
||||
.icon-page-doc:before {
|
||||
content: "\f183";
|
||||
}
|
||||
.icon-page-edit:before {
|
||||
content: "\f184";
|
||||
}
|
||||
.icon-page-export-csv:before {
|
||||
content: "\f185";
|
||||
}
|
||||
.icon-page-export-doc:before {
|
||||
content: "\f186";
|
||||
}
|
||||
.icon-page-export-pdf:before {
|
||||
content: "\f187";
|
||||
}
|
||||
.icon-page-export:before {
|
||||
content: "\f188";
|
||||
}
|
||||
.icon-page-filled:before {
|
||||
content: "\f189";
|
||||
}
|
||||
.icon-page-multiple:before {
|
||||
content: "\f18a";
|
||||
}
|
||||
.icon-page-pdf:before {
|
||||
content: "\f18b";
|
||||
}
|
||||
.icon-page-remove:before {
|
||||
content: "\f18c";
|
||||
}
|
||||
.icon-page-search:before {
|
||||
content: "\f18d";
|
||||
}
|
||||
.icon-page:before {
|
||||
content: "\f18e";
|
||||
}
|
||||
.icon-paint-bucket:before {
|
||||
content: "\f18f";
|
||||
}
|
||||
.icon-paperclip:before {
|
||||
content: "\f190";
|
||||
}
|
||||
.icon-pause:before {
|
||||
content: "\f191";
|
||||
}
|
||||
.icon-paw:before {
|
||||
content: "\f192";
|
||||
}
|
||||
.icon-paypal:before {
|
||||
content: "\f193";
|
||||
}
|
||||
.icon-pencil:before {
|
||||
content: "\f194";
|
||||
}
|
||||
.icon-photo:before {
|
||||
content: "\f195";
|
||||
}
|
||||
.icon-play-circle:before {
|
||||
content: "\f196";
|
||||
}
|
||||
.icon-play-video:before {
|
||||
content: "\f197";
|
||||
}
|
||||
.icon-play:before {
|
||||
content: "\f198";
|
||||
}
|
||||
.icon-plus:before {
|
||||
content: "\f199";
|
||||
}
|
||||
.icon-pound:before {
|
||||
content: "\f19a";
|
||||
}
|
||||
.icon-power:before {
|
||||
content: "\f19b";
|
||||
}
|
||||
.icon-previous:before {
|
||||
content: "\f19c";
|
||||
}
|
||||
.icon-price-tag:before {
|
||||
content: "\f19d";
|
||||
}
|
||||
.icon-pricetag-multiple:before {
|
||||
content: "\f19e";
|
||||
}
|
||||
.icon-print:before {
|
||||
content: "\f19f";
|
||||
}
|
||||
.icon-prohibited:before {
|
||||
content: "\f1a0";
|
||||
}
|
||||
.icon-projection-screen:before {
|
||||
content: "\f1a1";
|
||||
}
|
||||
.icon-puzzle:before {
|
||||
content: "\f1a2";
|
||||
}
|
||||
.icon-quote:before {
|
||||
content: "\f1a3";
|
||||
}
|
||||
.icon-record:before {
|
||||
content: "\f1a4";
|
||||
}
|
||||
.icon-refresh:before {
|
||||
content: "\f1a5";
|
||||
}
|
||||
.icon-results-demographics:before {
|
||||
content: "\f1a6";
|
||||
}
|
||||
.icon-results:before {
|
||||
content: "\f1a7";
|
||||
}
|
||||
.icon-rewind-ten:before {
|
||||
content: "\f1a8";
|
||||
}
|
||||
.icon-rewind:before {
|
||||
content: "\f1a9";
|
||||
}
|
||||
.icon-rss:before {
|
||||
content: "\f1aa";
|
||||
}
|
||||
.icon-safety-cone:before {
|
||||
content: "\f1ab";
|
||||
}
|
||||
.icon-save:before {
|
||||
content: "\f1ac";
|
||||
}
|
||||
.icon-share:before {
|
||||
content: "\f1ad";
|
||||
}
|
||||
.icon-sheriff-badge:before {
|
||||
content: "\f1ae";
|
||||
}
|
||||
.icon-shield:before {
|
||||
content: "\f1af";
|
||||
}
|
||||
.icon-shopping-bag:before {
|
||||
content: "\f1b0";
|
||||
}
|
||||
.icon-shopping-cart:before {
|
||||
content: "\f1b1";
|
||||
}
|
||||
.icon-shuffle:before {
|
||||
content: "\f1b2";
|
||||
}
|
||||
.icon-skull:before {
|
||||
content: "\f1b3";
|
||||
}
|
||||
.icon-social-500px:before {
|
||||
content: "\f1b4";
|
||||
}
|
||||
.icon-social-adobe:before {
|
||||
content: "\f1b5";
|
||||
}
|
||||
.icon-social-amazon:before {
|
||||
content: "\f1b6";
|
||||
}
|
||||
.icon-social-android:before {
|
||||
content: "\f1b7";
|
||||
}
|
||||
.icon-social-apple:before {
|
||||
content: "\f1b8";
|
||||
}
|
||||
.icon-social-behance:before {
|
||||
content: "\f1b9";
|
||||
}
|
||||
.icon-social-bing:before {
|
||||
content: "\f1ba";
|
||||
}
|
||||
.icon-social-blogger:before {
|
||||
content: "\f1bb";
|
||||
}
|
||||
.icon-social-delicious:before {
|
||||
content: "\f1bc";
|
||||
}
|
||||
.icon-social-designer-news:before {
|
||||
content: "\f1bd";
|
||||
}
|
||||
.icon-social-deviant-art:before {
|
||||
content: "\f1be";
|
||||
}
|
||||
.icon-social-digg:before {
|
||||
content: "\f1bf";
|
||||
}
|
||||
.icon-social-dribbble:before {
|
||||
content: "\f1c0";
|
||||
}
|
||||
.icon-social-drive:before {
|
||||
content: "\f1c1";
|
||||
}
|
||||
.icon-social-dropbox:before {
|
||||
content: "\f1c2";
|
||||
}
|
||||
.icon-social-evernote:before {
|
||||
content: "\f1c3";
|
||||
}
|
||||
.icon-social-facebook:before {
|
||||
content: "\f1c4";
|
||||
}
|
||||
.icon-social-flickr:before {
|
||||
content: "\f1c5";
|
||||
}
|
||||
.icon-social-forrst:before {
|
||||
content: "\f1c6";
|
||||
}
|
||||
.icon-social-foursquare:before {
|
||||
content: "\f1c7";
|
||||
}
|
||||
.icon-social-game-center:before {
|
||||
content: "\f1c8";
|
||||
}
|
||||
.icon-social-github:before {
|
||||
content: "\f1c9";
|
||||
}
|
||||
.icon-social-google-plus:before {
|
||||
content: "\f1ca";
|
||||
}
|
||||
.icon-social-hacker-news:before {
|
||||
content: "\f1cb";
|
||||
}
|
||||
.icon-social-hi5:before {
|
||||
content: "\f1cc";
|
||||
}
|
||||
.icon-social-instagram:before {
|
||||
content: "\f1cd";
|
||||
}
|
||||
.icon-social-joomla:before {
|
||||
content: "\f1ce";
|
||||
}
|
||||
.icon-social-lastfm:before {
|
||||
content: "\f1cf";
|
||||
}
|
||||
.icon-social-linkedin:before {
|
||||
content: "\f1d0";
|
||||
}
|
||||
.icon-social-medium:before {
|
||||
content: "\f1d1";
|
||||
}
|
||||
.icon-social-myspace:before {
|
||||
content: "\f1d2";
|
||||
}
|
||||
.icon-social-orkut:before {
|
||||
content: "\f1d3";
|
||||
}
|
||||
.icon-social-path:before {
|
||||
content: "\f1d4";
|
||||
}
|
||||
.icon-social-picasa:before {
|
||||
content: "\f1d5";
|
||||
}
|
||||
.icon-social-pinterest:before {
|
||||
content: "\f1d6";
|
||||
}
|
||||
.icon-social-rdio:before {
|
||||
content: "\f1d7";
|
||||
}
|
||||
.icon-social-reddit:before {
|
||||
content: "\f1d8";
|
||||
}
|
||||
.icon-social-skillshare:before {
|
||||
content: "\f1d9";
|
||||
}
|
||||
.icon-social-skype:before {
|
||||
content: "\f1da";
|
||||
}
|
||||
.icon-social-smashing-mag:before {
|
||||
content: "\f1db";
|
||||
}
|
||||
.icon-social-snapchat:before {
|
||||
content: "\f1dc";
|
||||
}
|
||||
.icon-social-spotify:before {
|
||||
content: "\f1dd";
|
||||
}
|
||||
.icon-social-squidoo:before {
|
||||
content: "\f1de";
|
||||
}
|
||||
.icon-social-stack-overflow:before {
|
||||
content: "\f1df";
|
||||
}
|
||||
.icon-social-steam:before {
|
||||
content: "\f1e0";
|
||||
}
|
||||
.icon-social-stumbleupon:before {
|
||||
content: "\f1e1";
|
||||
}
|
||||
.icon-social-treehouse:before {
|
||||
content: "\f1e2";
|
||||
}
|
||||
.icon-social-tumblr:before {
|
||||
content: "\f1e3";
|
||||
}
|
||||
.icon-social-twitter:before {
|
||||
content: "\f1e4";
|
||||
}
|
||||
.icon-social-twitter-post:after {
|
||||
display: inline-block;
|
||||
height: 36px;
|
||||
margin-left: 9px;
|
||||
|
||||
font-size: 26px;
|
||||
|
||||
content: "\f1e4";
|
||||
vertical-align: middle;
|
||||
}
|
||||
.icon-social-vimeo:before {
|
||||
content: "\f1e5";
|
||||
}
|
||||
.icon-social-windows:before {
|
||||
content: "\f1e6";
|
||||
}
|
||||
.icon-social-xbox:before {
|
||||
content: "\f1e7";
|
||||
}
|
||||
.icon-social-yahoo:before {
|
||||
content: "\f1e8";
|
||||
}
|
||||
.icon-social-yelp:before {
|
||||
content: "\f1e9";
|
||||
}
|
||||
.icon-social-youtube:before {
|
||||
content: "\f1ea";
|
||||
}
|
||||
.icon-social-zerply:before {
|
||||
content: "\f1eb";
|
||||
}
|
||||
.icon-social-zurb:before {
|
||||
content: "\f1ec";
|
||||
}
|
||||
.icon-sound:before {
|
||||
content: "\f1ed";
|
||||
}
|
||||
.icon-star:before {
|
||||
content: "\f1ee";
|
||||
}
|
||||
.icon-stop:before {
|
||||
content: "\f1ef";
|
||||
}
|
||||
.icon-strikethrough:before {
|
||||
content: "\f1f0";
|
||||
}
|
||||
.icon-subscript:before {
|
||||
content: "\f1f1";
|
||||
}
|
||||
.icon-superscript:before {
|
||||
content: "\f1f2";
|
||||
}
|
||||
.icon-tablet-landscape:before {
|
||||
content: "\f1f3";
|
||||
}
|
||||
.icon-tablet-portrait:before {
|
||||
content: "\f1f4";
|
||||
}
|
||||
.icon-target-two:before {
|
||||
content: "\f1f5";
|
||||
}
|
||||
.icon-target:before {
|
||||
content: "\f1f6";
|
||||
}
|
||||
.icon-telephone-accessible:before {
|
||||
content: "\f1f7";
|
||||
}
|
||||
.icon-telephone:before {
|
||||
content: "\f1f8";
|
||||
}
|
||||
.icon-text-color:before {
|
||||
content: "\f1f9";
|
||||
}
|
||||
.icon-thumbnails:before {
|
||||
content: "\f1fa";
|
||||
}
|
||||
.icon-ticket:before {
|
||||
content: "\f1fb";
|
||||
}
|
||||
.icon-torso-business:before {
|
||||
content: "\f1fc";
|
||||
}
|
||||
.icon-torso-female:before {
|
||||
content: "\f1fd";
|
||||
}
|
||||
.icon-torso:before {
|
||||
content: "\f1fe";
|
||||
}
|
||||
.icon-torsos-all-female:before {
|
||||
content: "\f1ff";
|
||||
}
|
||||
.icon-torsos-all:before {
|
||||
content: "\f200";
|
||||
}
|
||||
.icon-torsos-female-male:before {
|
||||
content: "\f201";
|
||||
}
|
||||
.icon-torsos-male-female:before {
|
||||
content: "\f202";
|
||||
}
|
||||
.icon-torsos:before {
|
||||
content: "\f203";
|
||||
}
|
||||
.icon-trash:before {
|
||||
content: "\f204";
|
||||
}
|
||||
.icon-trees:before {
|
||||
content: "\f205";
|
||||
}
|
||||
.icon-trophy:before {
|
||||
content: "\f206";
|
||||
}
|
||||
.icon-underline:before {
|
||||
content: "\f207";
|
||||
}
|
||||
.icon-universal-access:before {
|
||||
content: "\f208";
|
||||
}
|
||||
.icon-unlink:before {
|
||||
content: "\f209";
|
||||
}
|
||||
.icon-unlock:before {
|
||||
content: "\f20a";
|
||||
}
|
||||
.icon-upload-cloud:before {
|
||||
content: "\f20b";
|
||||
}
|
||||
.icon-upload:before {
|
||||
content: "\f20c";
|
||||
}
|
||||
.icon-usb:before {
|
||||
content: "\f20d";
|
||||
}
|
||||
.icon-video:before {
|
||||
content: "\f20e";
|
||||
}
|
||||
.icon-volume-none:before {
|
||||
content: "\f20f";
|
||||
}
|
||||
.icon-volume-strike:before {
|
||||
content: "\f210";
|
||||
}
|
||||
.icon-volume:before {
|
||||
content: "\f211";
|
||||
}
|
||||
.icon-web:before {
|
||||
content: "\f212";
|
||||
}
|
||||
.icon-wheelchair:before {
|
||||
content: "\f213";
|
||||
}
|
||||
.icon-widget:before {
|
||||
content: "\f214";
|
||||
}
|
||||
.icon-wrench:before {
|
||||
content: "\f215";
|
||||
}
|
||||
.icon-x-circle:before {
|
||||
content: "\f216";
|
||||
}
|
||||
.icon-x:before {
|
||||
content: "\f217";
|
||||
}
|
||||
.icon-yen:before {
|
||||
content: "\f218";
|
||||
}
|
||||
.icon-zoom-in:before {
|
||||
content: "\f219";
|
||||
}
|
||||
.icon-zoom-out:before {
|
||||
content: "\f21a";
|
||||
}
|
||||
33
etc/ghost/themes/casper/assets/scss/modules/_forms.scss
Executable file
33
etc/ghost/themes/casper/assets/scss/modules/_forms.scss
Executable file
@@ -0,0 +1,33 @@
|
||||
*:focus {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
input[type="text"],
|
||||
input[type="password"],
|
||||
input[type="datetime"],
|
||||
input[type="datetime-local"],
|
||||
input[type="date"],
|
||||
input[type="month"],
|
||||
input[type="time"],
|
||||
input[type="week"],
|
||||
input[type="number"],
|
||||
input[type="email"],
|
||||
input[type="url"],
|
||||
input[type="search"],
|
||||
input[type="tel"] {
|
||||
background: $gray-lightest;
|
||||
border: 1px solid $gray-light;
|
||||
border-radius: $border-radius;
|
||||
color: $gray-darker;
|
||||
font-size: .9em;
|
||||
padding: 1em;
|
||||
width: 240px;
|
||||
|
||||
@include placeholder {
|
||||
color: $gray;
|
||||
}
|
||||
|
||||
&:focus {
|
||||
border-color: $secondary-color;
|
||||
}
|
||||
}
|
||||
240
etc/ghost/themes/casper/assets/scss/modules/_global.scss
Executable file
240
etc/ghost/themes/casper/assets/scss/modules/_global.scss
Executable file
@@ -0,0 +1,240 @@
|
||||
// ------------------------------
|
||||
// BASICS
|
||||
// ------------------------------
|
||||
|
||||
html {
|
||||
font-size: $unit * 1.125;
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
|
||||
&.expanded {
|
||||
overflow-y: hidden;
|
||||
}
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
body {
|
||||
color: $gray-darker;
|
||||
font-family: $sans-font;
|
||||
}
|
||||
|
||||
mark {
|
||||
background: $mark-color;
|
||||
padding: .05em .2em;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
::selection {
|
||||
background: lighten($secondary-color, 26%);
|
||||
}
|
||||
|
||||
hr {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
// ------------------------------
|
||||
// TYPOGRAPHY
|
||||
// ------------------------------
|
||||
|
||||
a {
|
||||
color: $link-color;
|
||||
position: relative;
|
||||
text-decoration: none;
|
||||
transition: all $aside-animation-time;
|
||||
|
||||
&:hover {
|
||||
color: $hover-color;
|
||||
}
|
||||
}
|
||||
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
color: $gray-darkest;
|
||||
font-family: $serif-font;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-weight: lighter;
|
||||
}
|
||||
|
||||
h1 {
|
||||
font-size: $font-h1;
|
||||
line-height: $line-height * 1.75;
|
||||
margin: $margin-h1 0;
|
||||
}
|
||||
|
||||
h2 {
|
||||
font-size: $font-h2;
|
||||
margin: $margin-h2 0;
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: $font-h3;
|
||||
margin: $margin-h3 0;
|
||||
}
|
||||
|
||||
h4 {
|
||||
font-size: $font-h4;
|
||||
margin: $margin-h4 0;
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-size: $font-h5;
|
||||
margin: $margin-h5 0;
|
||||
}
|
||||
|
||||
h6 {
|
||||
font-size: $font-h6;
|
||||
margin: $margin-h6 0;
|
||||
}
|
||||
|
||||
p {
|
||||
line-height: $line-height;
|
||||
margin-bottom: 1.3rem;
|
||||
}
|
||||
|
||||
strong {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
em {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
blockquote {
|
||||
border-left: $gray-darkest .25rem solid;
|
||||
margin: 2rem 0;
|
||||
padding: 0 0 0 1.5rem;
|
||||
|
||||
> p {
|
||||
font-family: $quote-font;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-style: italic;
|
||||
letter-spacing: .01rem;
|
||||
word-wrap: break-word;
|
||||
}
|
||||
}
|
||||
|
||||
// ------------------------------
|
||||
// BASIC STYLING
|
||||
// ------------------------------
|
||||
|
||||
ol,
|
||||
ul {
|
||||
margin: 0 0 1.3rem 2.5rem;
|
||||
|
||||
li {
|
||||
line-height: $line-height * 1.2;
|
||||
margin: 0 0 .2rem;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul {
|
||||
margin: .1rem 0 .2rem 2rem;
|
||||
}
|
||||
}
|
||||
|
||||
ol {
|
||||
list-style-type: decimal;
|
||||
}
|
||||
|
||||
ul {
|
||||
list-style-type: disc;
|
||||
}
|
||||
|
||||
.block-heading {
|
||||
@include column(12);
|
||||
bottom: -15px;
|
||||
font-size: .8rem;
|
||||
font-weight: bold;
|
||||
letter-spacing: 1px;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.label {
|
||||
padding: 8px 18px 9px;
|
||||
}
|
||||
|
||||
// ------------------------------
|
||||
// MAIN LAYOUT
|
||||
// ------------------------------
|
||||
|
||||
main {
|
||||
bottom: 0;
|
||||
left: 22.5rem;
|
||||
padding: 2rem 3rem;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
|
||||
> .content {
|
||||
margin: 0 3.7rem;
|
||||
padding: 2rem 0;
|
||||
|
||||
> h1 {
|
||||
margin-bottom: 2.7rem;
|
||||
}
|
||||
|
||||
> footer {
|
||||
border-top: 2px solid $gray-light;
|
||||
color: lighten($gray-dark, 10%);
|
||||
display: block;
|
||||
font-size: .7em;
|
||||
padding: 2em 0 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.divider {
|
||||
border-top: 1px solid $divider-color;
|
||||
margin: 10px auto;
|
||||
|
||||
&.long {
|
||||
width: 30%;
|
||||
}
|
||||
|
||||
&.short {
|
||||
width: 15%;
|
||||
}
|
||||
|
||||
&.post {
|
||||
border-top: 1px solid $gray-light;
|
||||
margin: 1.7rem 0;
|
||||
width: 30%;
|
||||
}
|
||||
}
|
||||
|
||||
.container {
|
||||
margin: 0 auto;
|
||||
position: relative;
|
||||
width: $total-width - $gutter-width;
|
||||
}
|
||||
|
||||
.copyright {
|
||||
display: block;
|
||||
margin-bottom: .7em;
|
||||
|
||||
a {
|
||||
color: lighten($gray-dark, 5%);
|
||||
text-decoration: underline;
|
||||
|
||||
&:hover {
|
||||
color: $hover-color;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.emoji {
|
||||
height: 1em !important;
|
||||
margin: 0 .05em 0 .1em !important;
|
||||
vertical-align: -.1em !important;
|
||||
width: 1em !important;
|
||||
}
|
||||
65
etc/ghost/themes/casper/assets/scss/modules/_grid.scss
Executable file
65
etc/ghost/themes/casper/assets/scss/modules/_grid.scss
Executable file
@@ -0,0 +1,65 @@
|
||||
/////////////////
|
||||
// Semantic.gs // for SCSS: http://sass-lang.com/
|
||||
/////////////////
|
||||
|
||||
// Defaults which you can freely override
|
||||
$column-width: 60px;
|
||||
$gutter-width: 20px;
|
||||
$columns: 12;
|
||||
|
||||
// Utility function — you should never need to modify this
|
||||
@function gridsystem-width($columns: $columns) {
|
||||
@return ($column-width * $columns) + ($gutter-width * $columns);
|
||||
}
|
||||
// Set $total-width to 100% for a fluid layout
|
||||
$total-width: gridsystem-width($columns);
|
||||
// Uncomment these two lines and the star-hack width/margin lines below to enable sub-pixel fix for IE6 & 7. See http: //tylertate.com/blog/2012/01/05/subpixel-rounding.html
|
||||
// $min-width:999999;
|
||||
// $correction: 0.5 / $min-width * 100;
|
||||
|
||||
// The micro clearfix http://nicolasgallagher.com/micro-clearfix-hack/
|
||||
@mixin clearfix() {
|
||||
*zoom: 1;
|
||||
|
||||
&:before,
|
||||
&:after {
|
||||
display: table;
|
||||
|
||||
content: "";
|
||||
}
|
||||
&:after {
|
||||
clear: both;
|
||||
}
|
||||
}
|
||||
//////////
|
||||
// GRID //
|
||||
//////////
|
||||
|
||||
body {
|
||||
width: 100%;
|
||||
|
||||
@include clearfix();
|
||||
}
|
||||
@mixin row($columns: $columns) {
|
||||
display: block;
|
||||
width: $total-width*(($gutter-width + gridsystem-width($columns))/gridsystem-width($columns));
|
||||
margin: 0 $total-width*((($gutter-width*.5)/gridsystem-width($columns))*-1);
|
||||
// *width: $total-width*(($gutter-width + gridsystem-width($columns))/gridsystem-width($columns))-$correction;
|
||||
// *margin: 0 $total-width*((($gutter-width*.5)/gridsystem-width($columns))*-1)-$correction;
|
||||
|
||||
@include clearfix();
|
||||
}
|
||||
@mixin column($x, $columns: $columns) {
|
||||
display: inline;
|
||||
float: left;
|
||||
width: $total-width*(((($gutter-width+$column-width)*$x)-$gutter-width) / gridsystem-width($columns));
|
||||
margin: 0 $total-width*(($gutter-width*.5)/gridsystem-width($columns));
|
||||
// *width: $total-width*(((($gutter-width+$column-width)*$x)-$gutter-width) / gridsystem-width($columns))-$correction;
|
||||
// *margin: 0 $total-width*(($gutter-width*.5)/gridsystem-width($columns))-$correction;
|
||||
}
|
||||
@mixin push($offset: 1) {
|
||||
margin-left: $total-width*((($gutter-width+$column-width)*$offset) / gridsystem-width($columns)) + $total-width*(($gutter-width*.5)/gridsystem-width($columns));
|
||||
}
|
||||
@mixin pull($offset: 1) {
|
||||
margin-right: $total-width*((($gutter-width+$column-width)*$offset) / gridsystem-width($columns)) + $total-width*(($gutter-width*.5)/gridsystem-width($columns));
|
||||
}
|
||||
131
etc/ghost/themes/casper/assets/scss/modules/_prism.scss
Normal file
131
etc/ghost/themes/casper/assets/scss/modules/_prism.scss
Normal file
@@ -0,0 +1,131 @@
|
||||
/* http://prismjs.com/download.html?themes=prism-okaidia&languages=markup+css+clike+javascript+bash+c+coffeescript+css-extras+git+markdown+scss+sql&plugins=show-language */
|
||||
|
||||
code,
|
||||
pre {
|
||||
font-family: $code-font;
|
||||
font-size: 90%;
|
||||
line-height: 1.5;
|
||||
text-align: left;
|
||||
white-space: pre;
|
||||
word-spacing: normal;
|
||||
word-wrap: normal;
|
||||
word-break: normal;
|
||||
tab-size: 2;
|
||||
hyphens: none;
|
||||
color: black;
|
||||
text-shadow: 0 1px white;
|
||||
direction: ltr;
|
||||
}
|
||||
|
||||
pre::selection,
|
||||
code::selection {
|
||||
background: #b3d4fc;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
@media print {
|
||||
code,
|
||||
pre {
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
/* Code blocks */
|
||||
pre {
|
||||
padding: 1em;
|
||||
margin: 2.5rem 0;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
:not(pre) > code,
|
||||
pre {
|
||||
border: 1px solid rgba(0, 0, 0, .15);
|
||||
background: #fbfaf8;
|
||||
}
|
||||
|
||||
/* Inline code */
|
||||
:not(pre) > code {
|
||||
// slack style
|
||||
padding: 1px 3px;
|
||||
font-family: $code-font;
|
||||
font-size: 72%;
|
||||
line-height: 72%;
|
||||
white-space: normal;
|
||||
color: #c25;
|
||||
border: 1px solid #e1e1e8;
|
||||
border-radius: .3em;
|
||||
background-color: #f7f7f9;
|
||||
text-shadow: 0 1px #fff;
|
||||
}
|
||||
|
||||
.token.comment,
|
||||
.token.prolog,
|
||||
.token.doctype,
|
||||
.token.cdata {
|
||||
color: #969896;
|
||||
}
|
||||
|
||||
.token.punctuation {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.namespace {
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
.token.property,
|
||||
.token.tag,
|
||||
.token.boolean,
|
||||
.token.number,
|
||||
.token.constant,
|
||||
.token.symbol,
|
||||
.token.deleted {
|
||||
color: #0086b3;
|
||||
}
|
||||
|
||||
.token.selector,
|
||||
.token.attr-name,
|
||||
.token.string,
|
||||
.token.char,
|
||||
.token.builtin,
|
||||
.token.inserted {
|
||||
color: #183691;
|
||||
}
|
||||
|
||||
.token.operator,
|
||||
.token.entity,
|
||||
.token.url,
|
||||
.language-css .token.string,
|
||||
.style .token.string {
|
||||
color: #a71d5d;
|
||||
}
|
||||
|
||||
.token.atrule,
|
||||
.token.attr-value,
|
||||
.token.keyword {
|
||||
color: #a71d5d;
|
||||
}
|
||||
|
||||
.token.function {
|
||||
color: #0086b3;
|
||||
}
|
||||
|
||||
.token.regex,
|
||||
.token.important,
|
||||
.token.variable {
|
||||
color: #e90;
|
||||
}
|
||||
|
||||
.token.important,
|
||||
.token.bold {
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.token.italic {
|
||||
font-style: italic;
|
||||
}
|
||||
|
||||
.token.entity {
|
||||
cursor: help;
|
||||
}
|
||||
139
etc/ghost/themes/casper/assets/scss/modules/_reset.scss
Executable file
139
etc/ghost/themes/casper/assets/scss/modules/_reset.scss
Executable file
@@ -0,0 +1,139 @@
|
||||
/* http://meyerweb.com/eric/tools/css/reset/
|
||||
v2.0 | 20110126
|
||||
License:none (public domain) */
|
||||
|
||||
html,
|
||||
body,
|
||||
div,
|
||||
span,
|
||||
applet,
|
||||
object,
|
||||
iframe,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
blockquote,
|
||||
pre,
|
||||
a,
|
||||
abbr,
|
||||
acronym,
|
||||
address,
|
||||
big,
|
||||
cite,
|
||||
code,
|
||||
del,
|
||||
dfn,
|
||||
em,
|
||||
img,
|
||||
ins,
|
||||
kbd,
|
||||
q,
|
||||
s,
|
||||
samp,
|
||||
small,
|
||||
strike,
|
||||
strong,
|
||||
sub,
|
||||
sup,
|
||||
tt,
|
||||
var,
|
||||
b,
|
||||
u,
|
||||
i,
|
||||
center,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
ol,
|
||||
ul,
|
||||
li,
|
||||
fieldset,
|
||||
form,
|
||||
label,
|
||||
legend,
|
||||
table,
|
||||
caption,
|
||||
tbody,
|
||||
tfoot,
|
||||
thead,
|
||||
tr,
|
||||
th,
|
||||
td,
|
||||
article,
|
||||
aside,
|
||||
canvas,
|
||||
details,
|
||||
embed,
|
||||
figure,
|
||||
figcaption,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
output,
|
||||
ruby,
|
||||
section,
|
||||
summary,
|
||||
time,
|
||||
mark,
|
||||
audio,
|
||||
video {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
|
||||
font: inherit;
|
||||
font-size: 100%;
|
||||
|
||||
vertical-align: baseline;
|
||||
|
||||
border: 0;
|
||||
}
|
||||
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
body {
|
||||
line-height: $line-height;
|
||||
}
|
||||
ol,
|
||||
ul {
|
||||
list-style: none;
|
||||
}
|
||||
blockquote,
|
||||
q {
|
||||
quotes: none;
|
||||
}
|
||||
blockquote {
|
||||
&:before,
|
||||
&:after {
|
||||
content: "";
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
q {
|
||||
&:before,
|
||||
&:after {
|
||||
content: "";
|
||||
content: none;
|
||||
}
|
||||
}
|
||||
table {
|
||||
border-spacing: 0;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
73
etc/ghost/themes/casper/assets/scss/modules/_utils.scss
Executable file
73
etc/ghost/themes/casper/assets/scss/modules/_utils.scss
Executable file
@@ -0,0 +1,73 @@
|
||||
%dotted-link {
|
||||
border-bottom: 1px dashed $primary-color;
|
||||
line-height: 25px;
|
||||
transition: all .5s;
|
||||
padding: .1rem .25rem;
|
||||
|
||||
&:hover {
|
||||
color: $white;
|
||||
border-color: $hover-color;
|
||||
background: $primary-color;
|
||||
}
|
||||
|
||||
&:hover,
|
||||
&:active {
|
||||
outline: 0;
|
||||
}
|
||||
}
|
||||
|
||||
%background-filter {
|
||||
background: linear-gradient(150deg, $cover-secondary 30%, $cover-primary 70%) 0 0 / cover fixed;
|
||||
}
|
||||
|
||||
%center-absolute {
|
||||
display: flex;
|
||||
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
%font-shadow {
|
||||
text-shadow: 0 1px 1px rgba(000, 000, 000, .4);
|
||||
}
|
||||
|
||||
%btn-cover {
|
||||
position: relative;
|
||||
|
||||
display: block;
|
||||
|
||||
font-size: .9em;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
font-weight: bold;
|
||||
|
||||
letter-spacing: 1px;
|
||||
|
||||
opacity: .8;
|
||||
color: $gray-lightest;
|
||||
border-radius: 20px;
|
||||
text-shadow: none;
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
%btn-cover-with-border {
|
||||
@extend %btn-cover;
|
||||
border: 1px solid $gray-lightest;
|
||||
}
|
||||
|
||||
@mixin placeholder {
|
||||
::-webkit-input-placeholder {
|
||||
@content;
|
||||
}
|
||||
:-moz-placeholder {
|
||||
@content;
|
||||
}
|
||||
::-moz-placeholder {
|
||||
@content;
|
||||
}
|
||||
:-ms-input-placeholder {
|
||||
@content;
|
||||
}
|
||||
}
|
||||
66
etc/ghost/themes/casper/assets/scss/modules/_variables.scss
Executable file
66
etc/ghost/themes/casper/assets/scss/modules/_variables.scss
Executable file
@@ -0,0 +1,66 @@
|
||||
/* COLORS */
|
||||
|
||||
$gray-darkest : #333;
|
||||
$gray-darker : #666;
|
||||
$gray-dark : #999;
|
||||
$gray : #ccc;
|
||||
$gray-light : #ddd;
|
||||
$gray-lighter : #eee;
|
||||
$gray-lightest : #f8f8f8;
|
||||
|
||||
$black : #000000;
|
||||
$white : #FFFFFF;
|
||||
$cyan : #006064;
|
||||
$red : #e74c3c;
|
||||
$purple : #493252;
|
||||
$slate : #3d4260;
|
||||
$yellow : #FFC107;
|
||||
|
||||
$primary-color : lighten($red, 5%);
|
||||
$secondary-color : $yellow;
|
||||
|
||||
$cover-secondary : rgba(#5f2c82, .1);
|
||||
$cover-primary : rgba(#49a09d, .2);
|
||||
|
||||
$link-color : $gray-darkest;
|
||||
$hover-color : $primary-color;
|
||||
$mark-color : #feda9e;
|
||||
|
||||
$divider-color : rgba(255, 255, 255, .14);
|
||||
|
||||
/* FONT */
|
||||
|
||||
$unit : 1rem;
|
||||
|
||||
$sans-font : 'Raleway', sans-serif;
|
||||
$serif-font : 'Roboto Slab', serif;
|
||||
$code-font : Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
||||
$quote-font : "freight-text-pro", Georgia, Cambria, "Times New Roman", Times, serif;
|
||||
$line-height : 1.75rem;
|
||||
|
||||
$margin-title : $unit * 2.2;
|
||||
$margin-h1 : $margin-title * .9;
|
||||
$margin-h2 : $margin-title * .9;
|
||||
$margin-h3 : $margin-title * .9;
|
||||
$margin-h4 : $margin-title * .9;
|
||||
$margin-h5 : $margin-title * .9;
|
||||
$margin-h6 : $margin-title * .9;
|
||||
|
||||
$font-title : $unit * 2.2;
|
||||
$font-h1 : $font-title * .8;
|
||||
$font-h2 : $font-h1 * .8;
|
||||
$font-h3 : $font-h2 * .8;
|
||||
$font-h4 : $font-h3 * .8;
|
||||
$font-h5 : $font-h4 * .8;
|
||||
$font-h6 : $font-h5 * .8;
|
||||
|
||||
/* ASIDE */
|
||||
|
||||
$aside-animation-time : 350ms;
|
||||
$aside-animation : cubic-bezier(.645,.045,.355,1);
|
||||
$aside-width-collapsed : $unit * 22.5;
|
||||
|
||||
/* OTHER */
|
||||
|
||||
$border-radius : 3px;
|
||||
$astronaut-size : 20vh;
|
||||
31
etc/ghost/themes/casper/assets/scss/uno-zen.scss
Executable file
31
etc/ghost/themes/casper/assets/scss/uno-zen.scss
Executable file
@@ -0,0 +1,31 @@
|
||||
// ------------------------------
|
||||
// PRE
|
||||
// ------------------------------
|
||||
|
||||
@import 'modules/variables.scss';
|
||||
@import 'modules/utils.scss';
|
||||
|
||||
// ------------------------------
|
||||
// MODULES
|
||||
// ------------------------------
|
||||
|
||||
@import 'modules/reset.scss';
|
||||
@import 'modules/grid.scss';
|
||||
@import 'modules/global.scss';
|
||||
@import 'modules/fonts.scss';
|
||||
@import 'modules/buttons.scss';
|
||||
@import 'modules/forms.scss';
|
||||
@import 'modules/effects.scss';
|
||||
@import 'modules/prism.scss';
|
||||
|
||||
// ------------------------------
|
||||
// COMPONENTS
|
||||
// ------------------------------
|
||||
//
|
||||
@import 'components/aside.scss';
|
||||
@import 'components/page-error.scss';
|
||||
@import 'components/pagination.scss';
|
||||
@import 'components/post.scss';
|
||||
@import 'components/search.scss';
|
||||
@import 'components/loading.scss';
|
||||
@import 'components/media-queries.scss';
|
||||
Reference in New Issue
Block a user