opdavies/oliverdavies.uk-old-sculpin
Archived
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Back to sass

Browse source
This commit is contained in:
Oliver Davies 2018-12-07 22:45:27 +00:00
parent 4a140df2a6
commit 19d4f8bc1b
36 changed files with 176 additions and 276 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
assets/css/app.css
View file

@ -1,10 +0,0 @@
@import 'font-awesome/css/font-awesome';
@import 'highlightjs/styles/github-gist';
@import 'tailwind-preflight';
@import 'custom-preflight';
@import 'tailwind-components';
@import 'custom-components';
@import 'tailwind-utilities';

36
assets/css/base/base.css
View file

@ -1,36 +0,0 @@
a {
color: inherit;
text-decoration: none;
&:focus,
&:hover {
text-decoration: underline;
}
}
main a {
text-decoration: underline;
&:focus,
&:hover {
text-decoration: none;
}
}
h1, h2, h3 {
@apply mb-2;
}
.content h2,
.content h3 {
@apply mt-6;
}
p,
ul,
ol,
blockquote,
table,
pre {
@apply mb-6;
}

17
assets/css/base/images.css
View file

@ -1,17 +0,0 @@
img {
&.with-border {
@apply border border-solid border-grey-light;
}
&.with-padding {
@apply p-1;
}
&.avatar {
@apply border p-1 rounded-full;
}
}
svg {
fill: currentColor;
}

27
assets/css/base/vue.css
View file

@ -1,27 +0,0 @@
[v-cloak] {
.v-cloak-block {
@apply block;
}
.v-cloak-inline {
@apply inline;
}
.v-cloak-inline-block {
@apply inline-block;
}
.v-cloak-hidden {
@apply hidden;
}
.v-cloak-invisible {
@apply invisible;
}
}
.v-cloak-block,
.v-cloak-inline,
.v-cloak-inline-b {
@apply hidden;
}

3
assets/css/components/blockquote.css
View file

@ -1,3 +0,0 @@
blockquote {
@apply border-l-4 border-blue pl-4 px-6 py-2;
}

8
assets/css/components/button.css
View file

@ -1,8 +0,0 @@
.button {
@apply bg-blue inline-block rounded text-white px-4 py-2;
&:active,
&:hover {
@apply bg-blue-dark;
}
}

3
assets/css/components/link.css
View file

@ -1,3 +0,0 @@
.link {
@apply text-blue;
}

11
assets/css/components/listing.css
View file

@ -1,11 +0,0 @@
.listing {
@apply pl-0;
}
.listing-item {
@apply overflow-hidden pb-8;
&:not(:last-child) {
@apply border-b border-grey-light mb-8;
}
}

30
assets/css/components/markdown.css
View file

@ -1,30 +0,0 @@
.markdown {
h2 {
@apply mt-8 mb-3 text-black;
}
h2, h3 {
@apply text-black;
}
p,
li {
a {
@apply link;
}
code {
@apply bg-grey-lighter inline-block font-mono text-sm px-1 py-px;
}
}
p:last-child {
@apply mb-0;
}
pre code,
.hljs {
@apply bg-grey-lighter block border-grey-dark border-l-4 font-mono;
@apply leading-loose overflow-x-scroll p-6 rounded text-sm;
}
}

11
assets/css/components/note.css
View file

@ -1,11 +0,0 @@
.note {
@apply bg-blue-lighter border-blue border-l-4 mb-4 p-4 rounded;
> *:last-child {
@apply mb-0;
}
p a {
@apply text-black;
}
}

22
assets/css/components/slides.css
View file

@ -1,22 +0,0 @@
.slides {
background: url("../images/loading.gif") center no-repeat;
min-height: 275px;
@screen md {
& {
min-height: 375px;
}
}
@screen lg {
& {
min-height: 450px;
}
}
@screen xl {
& {
min-height: 560px;
}
}
}

27
assets/css/components/table.css
View file

@ -1,27 +0,0 @@
.table-collapse {
@apply border-collapse;
}
.table-responsive {
@apply mb-4 border w-full overflow-x-auto overflow-y-hidden;
table {
@apply mb-0 border-0 whitespace-no-wrap;
}
}
.table {
@apply w-full table-collapse;
& tr:nth-child(odd) {
@apply bg-grey-lighter;
}
& tr th {
@apply text-left p-3 bg-white;
}
& td {
@apply p-3 border-t;
}
}

6
assets/css/components/talk/video.css
View file

@ -1,6 +0,0 @@
.talk-video {
iframe,
embed {
@apply absolute h-full pin-l pin-t w-full;
}
}

3
assets/css/components/widget.css
View file

@ -1,3 +0,0 @@
.widget {
@apply mb-6 block;
}

10
assets/css/custom-components.css
View file

@ -1,10 +0,0 @@
@import 'components/blockquote';
@import 'components/button';
@import 'components/link';
@import 'components/listing';
@import 'components/markdown';
@import 'components/note';
@import 'components/slides';
@import 'components/table';
@import 'components/talk/video';
@import 'components/widget';

3
assets/css/custom-preflight.css
View file

@ -1,3 +0,0 @@
@import 'base/base';
@import 'base/images';
@import 'base/vue';

1
assets/css/tailwind-components.css
View file

@ -1 +0,0 @@
@tailwind components;

1
assets/css/tailwind-preflight.css
View file

@ -1 +0,0 @@
@tailwind preflight;

1
assets/css/tailwind-utilities.css
View file

@ -1 +0,0 @@
@tailwind utilities;

23
assets/sass/app.sass Normal file
View file

@ -0,0 +1,23 @@
@import '~font-awesome/css/font-awesome'
@import '~highlightjs/styles/github-gist'
@tailwind preflight
@import 'base/base'
@import 'base/images'
@import 'base/vue'
@tailwind components
@import 'components/blockquote'
@import 'components/button'
@import 'components/link'
@import 'components/listing'
@import 'components/markdown'
@import 'components/note'
@import 'components/slides'
@import 'components/table'
@import 'components/talk/video'
@import 'components/widget'
@tailwind utilities

29
assets/sass/base/base.sass Normal file
View file

@ -0,0 +1,29 @@
a
color: inherit
text-decoration: none
&:focus,
&:hover
text-decoration: underline
main a
text-decoration: underline
&:focus,
&:hover
text-decoration: none
h1, h2, h3
@apply mb-2
.content h2,
.content h3
@apply mt-6
p,
ul,
ol,
blockquote,
table,
pre
@apply mb-6

12
assets/sass/base/images.sass Normal file
View file

@ -0,0 +1,12 @@
img
&.with-border
@apply border border-solid border-grey-light
&.with-padding
@apply p-1
&.avatar
@apply border p-1 rounded-full
svg
fill: currentColor

19
assets/sass/base/vue.sass Normal file
View file

@ -0,0 +1,19 @@
[v-cloak]
.v-cloak-block
@apply block
.v-cloak-inline
@apply inline
.v-cloak-inline-block
@apply inline-block
.v-cloak-hidden
@apply hidden
.v-cloak-invisible
@apply invisible
.v-cloak-block,
.v-cloak-inline,
@apply hidden

2
assets/sass/components/blockquote.sass Normal file
View file

@ -0,0 +1,2 @@
blockquote
@apply border-l-4 border-blue pl-4 px-6 py-2

6
assets/sass/components/button.sass Normal file
View file

@ -0,0 +1,6 @@
.button
@apply bg-blue inline-block rounded text-white px-4 py-2
&:active,
&:hover
@apply bg-blue-dark

2
assets/sass/components/link.sass Normal file
View file

@ -0,0 +1,2 @@
.link
@apply text-blue

8
assets/sass/components/listing.sass Normal file
View file

@ -0,0 +1,8 @@
.listing
@apply pl-0
.listing-item
@apply overflow-hidden pb-8
&:not(:last-child)
@apply border-b border-grey-light mb-8

22
assets/sass/components/markdown.sass Normal file
View file

@ -0,0 +1,22 @@
.markdown
h2
@apply mt-8 mb-3 text-black
h2, h3
@apply text-black
p,
li
a
@apply link
code
@apply bg-grey-lighter inline-block font-mono text-sm px-1 py-px
p:last-child
@apply mb-0
pre code,
.hljs
@apply bg-grey-lighter block border-grey-dark border-l-4 font-mono
@apply leading-loose overflow-x-scroll p-6 rounded text-sm

8
assets/sass/components/note.sass Normal file
View file

@ -0,0 +1,8 @@
.note
@apply bg-blue-lighter border-blue border-l-4 mb-4 p-4 rounded
> *:last-child
@apply mb-0
p a
@apply text-black

15
assets/sass/components/slides.sass Normal file
View file

@ -0,0 +1,15 @@
.slides
background: url("../images/loading.gif") center no-repeat
min-height: 275px
@screen md
&
min-height: 375px
@screen lg
&
min-height: 450px
@screen xl
&
min-height: 560px

20
assets/sass/components/table.sass Normal file
View file

@ -0,0 +1,20 @@
.table-collapse
@apply border-collapse
.table-responsive
@apply mb-4 border w-full overflow-x-auto overflow-y-hidden
table
@apply mb-0 border-0 whitespace-no-wrap
.table
@apply w-full table-collapse
& tr:nth-child(odd)
@apply bg-grey-lighter
& tr th
@apply text-left p-3 bg-white
& td
@apply p-3 border-t

4
assets/sass/components/talk/video.sass Normal file
View file

@ -0,0 +1,4 @@
.talk-video
iframe,
embed
@apply absolute h-full pin-l pin-t w-full

2
assets/sass/components/widget.sass Normal file
View file

@ -0,0 +1,2 @@
.widget
@apply mb-6 block

4
package.json
View file

@ -16,9 +16,5 @@
"tailwindcss": "^0.6",
"tailwindcss-visuallyhidden": "^1.0.1",
"vue": "^2.5.17"
},
"dependencies": {
"postcss-import": "^12.0.1",
"postcss-nested": "^4.1.0"
}
}

10
webpack.mix.js
View file

@ -4,9 +4,8 @@ require('laravel-mix-purgecss');
require('laravel-mix-tailwind');
mix.disableNotifications()
.postCss('assets/css/app.css', 'source/css')
.sass('assets/sass/app.sass', 'source/css')
.js([
// 'node_modules/highlightjs/highlight.pack.js',
'node_modules/jquery/src/jquery.js',
'assets/js/app.js',
], 'source/js/all.js')
@ -19,11 +18,4 @@ mix.disableNotifications()
],
whitelistPatterns: [/language/, /hljs/],
whitelistPatternsChildren: [/^markdown$/]
})
.options({
postCss: [
require('postcss-import')(),
require('postcss-nested')(),
],
processCssUrls: false,
});

36
yarn.lock
View file

@ -4337,7 +4337,7 @@ performance-now@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/performance-now/-/performance-now-2.1.0.tgz#6309f4e0e5fa913ec1c69307ae364b4b377c9e7b"
pify@^2.0.0, pify@^2.3.0:
pify@^2.0.0:
version "2.3.0"
resolved "https://registry.yarnpkg.com/pify/-/pify-2.3.0.tgz#ed141a6ac043a849ea588498e7dca8b15330e90c"
@ -4442,15 +4442,6 @@ postcss-functions@^3.0.0:
postcss "^6.0.9"
postcss-value-parser "^3.3.0"
postcss-import@^12.0.1:
version "12.0.1"
resolved "https://registry.yarnpkg.com/postcss-import/-/postcss-import-12.0.1.tgz#cf8c7ab0b5ccab5649024536e565f841928b7153"
dependencies:
postcss "^7.0.1"
postcss-value-parser "^3.2.3"
read-cache "^1.0.0"
resolve "^1.1.7"
postcss-js@^1.0.1:
version "1.0.1"
resolved "https://registry.yarnpkg.com/postcss-js/-/postcss-js-1.0.1.tgz#ffaf29226e399ea74b5dce02cab1729d7addbc7b"
@ -4592,13 +4583,6 @@ postcss-nested@^3.0.0:
postcss "^6.0.14"
postcss-selector-parser "^3.1.1"
postcss-nested@^4.1.0:
version "4.1.0"
resolved "https://registry.yarnpkg.com/postcss-nested/-/postcss-nested-4.1.0.tgz#271da8a047f2ee378139410ae2400b1c67d0bf30"
dependencies:
postcss "^7.0.2"
postcss-selector-parser "^3.1.1"
postcss-normalize-charset@^1.1.0:
version "1.1.1"
resolved "https://registry.yarnpkg.com/postcss-normalize-charset/-/postcss-normalize-charset-1.1.1.tgz#ef9ee71212d7fe759c78ed162f61ed62b5cb93f1"
@ -4727,14 +4711,6 @@ postcss@^7.0.0:
source-map "^0.6.1"
supports-color "^5.4.0"
postcss@^7.0.1, postcss@^7.0.2:
version "7.0.5"
resolved "https://registry.yarnpkg.com/postcss/-/postcss-7.0.5.tgz#70e6443e36a6d520b0fd4e7593fcca3635ee9f55"
dependencies:
chalk "^2.4.1"
source-map "^0.6.1"
supports-color "^5.5.0"
prepend-http@^1.0.0:
version "1.0.4"
resolved "https://registry.yarnpkg.com/prepend-http/-/prepend-http-1.0.4.tgz#d4f4562b0ce3696e41ac52d0e002e57a635dc6dc"
@ -4910,12 +4886,6 @@ rc@^1.2.7:
minimist "^1.2.0"
strip-json-comments "~2.0.1"
read-cache@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/read-cache/-/read-cache-1.0.0.tgz#e664ef31161166c9751cdbe8dbcf86b5fb58f774"
dependencies:
pify "^2.3.0"
read-file-stdin@^0.2.0:
version "0.2.1"
resolved "https://registry.yarnpkg.com/read-file-stdin/-/read-file-stdin-0.2.1.tgz#25eccff3a153b6809afacb23ee15387db9e0ee61"
@ -5182,7 +5152,7 @@ resolve-url@^0.2.1:
version "0.2.1"
resolved "https://registry.yarnpkg.com/resolve-url/-/resolve-url-0.2.1.tgz#2c637fe77c893afd2a663fe21aa9080068e2052a"
resolve@^1.1.7, resolve@^1.4.0:
resolve@^1.4.0:
version "1.8.1"
resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.8.1.tgz#82f1ec19a423ac1fbd080b0bab06ba36e84a7a26"
dependencies:
@ -5731,7 +5701,7 @@ supports-color@^4.2.1:
dependencies:
has-flag "^2.0.0"
supports-color@^5.1.0, supports-color@^5.3.0, supports-color@^5.4.0, supports-color@^5.5.0:
supports-color@^5.1.0, supports-color@^5.3.0, supports-color@^5.4.0:
version "5.5.0"
resolved "https://registry.yarnpkg.com/supports-color/-/supports-color-5.5.0.tgz#e2e69a44ac8772f78a1ec0b35b689df6530efc8f"
dependencies: