diff --git a/_data/social_platforms.yml b/_data/social_platforms.yml new file mode 100644 index 0000000..cfc9f10 --- /dev/null +++ b/_data/social_platforms.yml @@ -0,0 +1,6 @@ +- name: Facebook + icon: facebook + url: https://www.facebook.com/Rubyconfth-294423114523650 +- name: Twitter + icon: twitter + url: https://twitter.com/rubyconfth diff --git a/_includes/footer.html b/_includes/footer.html index e526681..783531d 100755 --- a/_includes/footer.html +++ b/_includes/footer.html @@ -1,11 +1,3 @@ diff --git a/_includes/head.html b/_includes/head.html index 0af6f37..12152a8 100755 --- a/_includes/head.html +++ b/_includes/head.html @@ -25,7 +25,7 @@ - + diff --git a/_includes/header.html b/_includes/header.html index 89aeab7..eedf1ca 100755 --- a/_includes/header.html +++ b/_includes/header.html @@ -1,23 +1,18 @@
- {% include logo.html %} +
+ Bangkok.rb +
- +
diff --git a/_includes/icon-sprite.svg b/_includes/icon-sprite.svg index 7df8322..802b70d 100755 --- a/_includes/icon-sprite.svg +++ b/_includes/icon-sprite.svg @@ -1 +1 @@ -icon-jekyll \ No newline at end of file +icon-facebookicon-jekyllicon-twitter \ No newline at end of file diff --git a/_includes/icon.svg b/_includes/icon.svg index 2a3d5d2..509fc0f 100755 --- a/_includes/icon.svg +++ b/_includes/icon.svg @@ -1,3 +1,3 @@ - + \ No newline at end of file diff --git a/_includes/logo.html b/_includes/logo.html deleted file mode 100755 index 0243816..0000000 --- a/_includes/logo.html +++ /dev/null @@ -1,6 +0,0 @@ - \ No newline at end of file diff --git a/_layouts/default.html b/_layouts/default.html index 63d2378..8f958fc 100755 --- a/_layouts/default.html +++ b/_layouts/default.html @@ -20,8 +20,5 @@ {% include footer.html %} - - - - \ No newline at end of file + diff --git a/_sass/_variables.scss b/_sass/_variables.scss index 5a6db90..8adb0f5 100755 --- a/_sass/_variables.scss +++ b/_sass/_variables.scss @@ -1,13 +1,57 @@ // Base +$color-brand: ( + primary: #f83548 +); + $color-gray: ( - primary: #ededed, - dark: #b3b3b3, - darkest: #8f8f8f + primary: #2c2d30, + dark: #211f21, + light: #c0c0c0, + lightest: #f0f0f ); // Typography -$base-font-size: 1rem; -$base-font-family: 'Open Sans', -apple-system, 'Segoe UI', sans-serif; + +$font-sizes: ( + default: 1rem, + sm: 0.875rem, + lg: 1.125rem, + xl: 1.375rem +); + +$base-font-size: map-get($font-sizes, 'default'); +$base-font-family: 'Work Sans', -apple-system, 'Segoe UI', sans-serif; $base-line-height: 1.7; -$base-font-color: map-get($color-gray, 'darkest'); +$base-font-color: map-get($color-gray, 'primary'); + +// Z-index + +$zIndex: ( + default: 1, + behind: -1, + high: 5, + higher: 100, + highest: 1000, + sky: 10000 +); + +// Animations + +$base-animation-duration: 300ms; +$base-animation-timing: linear; + +///////////////////////////// +// Bootstrap Customization // +///////////////////////////// + +$primary: map-get($color-brand, 'primary'); +$secondary: map-get($color-gray, 'light'); + +$body-color: $base-font-color; + +// Buttons + +$btn-border-radius: 0; +$btn-border-radius-lg: 0; +$btn-border-radius-sm: 0; \ No newline at end of file diff --git a/_sass/base/_fonts.scss b/_sass/base/_fonts.scss new file mode 100644 index 0000000..b97a728 --- /dev/null +++ b/_sass/base/_fonts.scss @@ -0,0 +1 @@ +@import url('https://fonts.googleapis.com/css?family=Work+Sans:400,700'); diff --git a/_sass/base/_root.scss b/_sass/base/_root.scss new file mode 100644 index 0000000..a96321b --- /dev/null +++ b/_sass/base/_root.scss @@ -0,0 +1,18 @@ +:root { + // Custom variable values only support SassScript inside `#{}`. + @each $color, $value in $color-gray { + --color-gray-#{$color}: #{$value}; + } + + @each $color, $value in $color-brand { + --color-brand-#{$color}: #{$value}; + } + + @each $bp, $value in $grid-breakpoints { + --breakpoint-#{$bp}: #{$value}; + } + + // Use `inspect` for lists so that quoted items keep the quotes. + // See https://github.com/sass/sass/issues/2383#issuecomment-336349172 + --font-family-sans-serif: #{inspect($base-font-family)}; +} \ No newline at end of file diff --git a/_sass/components/_app-footer.scss b/_sass/components/_app-footer.scss new file mode 100644 index 0000000..8814223 --- /dev/null +++ b/_sass/components/_app-footer.scss @@ -0,0 +1,6 @@ +.app-footer { + display: flex; + align-items: center; + + line-height: 1.2; +} diff --git a/_sass/components/_app-header.scss b/_sass/components/_app-header.scss new file mode 100644 index 0000000..e5c67f8 --- /dev/null +++ b/_sass/components/_app-header.scss @@ -0,0 +1,23 @@ +.app-header { + display: flex; + justify-content: space-between; + + &__organizer { + line-height: 2rem; + font-size: rem(23px); + font-weight: bold; + text-transform: uppercase; + } + + &__link { + @include transition(color $base-animation-duration); + + color: $base-font-color; + + &:hover, + &:active { + color: map-get($color-gray, 'light'); + text-decoration: none; + } + } +} diff --git a/_sass/components/_list-social-platform.scss b/_sass/components/_list-social-platform.scss new file mode 100644 index 0000000..c5492ca --- /dev/null +++ b/_sass/components/_list-social-platform.scss @@ -0,0 +1,8 @@ +.list-social-plaftorm { + display: flex; + margin: 0; + + &__item + &__item { + margin-left: $spacer; + } +} diff --git a/_sass/components/_list.scss b/_sass/components/_list.scss new file mode 100644 index 0000000..f1a6178 --- /dev/null +++ b/_sass/components/_list.scss @@ -0,0 +1,13 @@ +.list { + margin-left: rem(-25px); + + &__item { + margin-bottom: 1rem; + } +} + +.list--unstyled { + @include list-unstyled(); + + margin-bottom: 0; +} diff --git a/_sass/functions/_sizing.scss b/_sass/functions/_sizing.scss new file mode 100644 index 0000000..5150398 --- /dev/null +++ b/_sass/functions/_sizing.scss @@ -0,0 +1,29 @@ +@function em($values, $base-font-size: 16px) { + $list: (); + + @each $value in $values { + @if ($value == 0 or $value == auto) { + $list: append($list, $value); + } @else { + $em-value: ($value / $base-font-size)+em; + $list: append($list, $em-value); + } + } + + @return $list; +} + +@function rem($values, $base-font-size: 16px) { + $list: (); + + @each $value in $values { + @if ($value == 0 or $value == auto) { + $list: append($list, $value); + } @else { + $rem-value: ($value / $base-font-size)+rem; + $list: append($list, $rem-value); + } + } + + @return $list; +} diff --git a/_sass/layouts/default.scss b/_sass/layouts/default.scss index 4e91461..d87b2c9 100755 --- a/_sass/layouts/default.scss +++ b/_sass/layouts/default.scss @@ -1,11 +1,33 @@ .layout-default body { display: grid; - grid-template-rows: 8.5rem 1fr 5rem; + grid-template-rows: rem(92px) 1fr rem(40px); min-height: 100vh; - padding: 0 5vw; + + background: { + image: image-url('shared/bangkok-strip.svg'); + repeat: no-repeat; + size: 250% auto; + position: center bottom; + } + + @include media-breakpoint-up('sm') { + background-size: 100% auto; + } +} + +.layout-default .app-header, +.layout-default .app-content, +.layout-default .app-footer { + @include make-container(); + + @include media-breakpoint-up('lg') { + padding-right: $grid-gutter-width; + padding-left: $grid-gutter-width; + } } .layout-default .app-header { - width: 100%; + padding-top: rem(30px); + padding-bottom: rem(30px); } diff --git a/_sass/mixins/.keep b/_sass/mixins/.keep deleted file mode 100755 index e69de29..0000000 diff --git a/_sass/screens/.keep b/_sass/screens/.keep deleted file mode 100755 index e69de29..0000000 diff --git a/_sass/screens/_home.scss b/_sass/screens/_home.scss new file mode 100644 index 0000000..3ec9187 --- /dev/null +++ b/_sass/screens/_home.scss @@ -0,0 +1,150 @@ +body.home .app-content { + padding-top: rem(30px); + + @include media-breakpoint-up('sm') { + display: flex; + align-items: center; + + padding: 0; + } +} + +body.home .announcement { + @include make-container-max-widths(); + + margin: 0 auto; + + // Main text shown below the lead text + > p { + margin-bottom: 0; + + @include media-breakpoint-up('sm') { + font-size: map-get($font-sizes, 'xl'); + } + + @include media-breakpoint-up('lg') { + width: 62%; + } + } + + // Mailing list subscription + &__btn { + margin-top: rem(30px); + + @include media-breakpoint-up('lg') { + margin-top: rem(40px); + padding: rem(30px) rem(52px); + } + } +} + +body.home .announcement__logistic { + font-size: map-get($font-sizes, 'sm'); + text-transform: uppercase; + + @include media-breakpoint-up('sm') { + display: flex; + font-size: map-get($font-sizes, 'lg'); + } + + p { + margin: 0; + } + + .announcement__venue { + position: relative; + + @include media-breakpoint-up('sm') { + margin-left: rem(40px); + } + } + + .announcement__venue:before { + @include media-breakpoint-up('sm') { + content: 'ยท'; + position: absolute; + left: -24px; + top: 0; + + line-height: rem(32px); + font-size: rem(40px); + } + } +} + +body.home .announcement__lead { + position: relative; + padding: rem(26px) 0; + + &:after { + content: ''; + + position: absolute; + top: rem(76px); + left: rem(164px); + z-index: map-get($zIndex, 'behind'); + + width: rem(70px); + height: rem(70px); + + background: { + image: image-url('shared/ruby.svg'); + repeat: no-repeat; + size: contain; + }; + + @include media-breakpoint-up('sm') { + top: rem(116px); + left: rem(310px); + + width: rem(125px); + height: rem(125px); + } + + @include media-breakpoint-up('lg') { + // Full size image + width: rem(408px); + height: rem(333px); + + top: rem(135px); + right: 0; + left: initial; + transform: rotate(15deg); + } + } + + .announcement__title { + height: rem(47px); + + background: { + image: image-url('shared/rubyconfth.svg'); + repeat: no-repeat; + size: contain; + } + + @include media-breakpoint-up('sm') { + height: rem(87px); + } + } + + .announcement__year { + margin: rem(10px) 0 0; + height: rem(46px); + + background: { + image: image-url('shared/2019.svg'); + repeat: no-repeat; + size: contain; + } + + @include media-breakpoint-up('sm') { + height: rem(88px); + } + + @include media-breakpoint-up('lg') { + margin-top: rem(30px); + + height: rem(105px); + } + } +} diff --git a/assets/images/icon-sprite.svg b/assets/images/icon-sprite.svg index 7df8322..802b70d 100644 --- a/assets/images/icon-sprite.svg +++ b/assets/images/icon-sprite.svg @@ -1 +1 @@ -icon-jekyll \ No newline at end of file +icon-facebookicon-jekyllicon-twitter \ No newline at end of file diff --git a/assets/images/shared/2019.svg b/assets/images/shared/2019.svg new file mode 100644 index 0000000..f387a2d --- /dev/null +++ b/assets/images/shared/2019.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + \ No newline at end of file diff --git a/assets/images/shared/bangkok-strip.svg b/assets/images/shared/bangkok-strip.svg new file mode 100644 index 0000000..5382981 --- /dev/null +++ b/assets/images/shared/bangkok-strip.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + \ No newline at end of file diff --git a/assets/images/shared/icons/icon-facebook.svg b/assets/images/shared/icons/icon-facebook.svg new file mode 100644 index 0000000..e62703b --- /dev/null +++ b/assets/images/shared/icons/icon-facebook.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/assets/images/shared/icons/icon-jekyll.svg b/assets/images/shared/icons/icon-jekyll.svg old mode 100755 new mode 100644 diff --git a/assets/images/shared/icons/icon-twitter.svg b/assets/images/shared/icons/icon-twitter.svg new file mode 100644 index 0000000..1a282b0 --- /dev/null +++ b/assets/images/shared/icons/icon-twitter.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/assets/images/shared/ruby.svg b/assets/images/shared/ruby.svg new file mode 100644 index 0000000..9227348 --- /dev/null +++ b/assets/images/shared/ruby.svg @@ -0,0 +1,23 @@ + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/assets/images/shared/rubyconfth.svg b/assets/images/shared/rubyconfth.svg new file mode 100644 index 0000000..0a5919d --- /dev/null +++ b/assets/images/shared/rubyconfth.svg @@ -0,0 +1,4 @@ + + + + \ No newline at end of file diff --git a/assets/stylesheets/application.scss b/assets/stylesheets/application.scss index 231e6c2..c269fdd 100755 --- a/assets/stylesheets/application.scss +++ b/assets/stylesheets/application.scss @@ -3,19 +3,27 @@ # only Main files contain this front matter, not partials. --- +@import 'variables'; + // Vendor -@import '../vendor/stylesheets/normalize'; + +@import '../vendor/stylesheets/bootstrap/bootstrap'; // Application -@import 'variables'; @import 'functions/asset-url'; @import 'functions/image-url'; +@import 'functions/sizing'; -//@import 'mixins/mixin-name'; - +@import 'base/root'; @import 'base/typography'; @import 'layouts/default'; +@import 'components/app-footer'; +@import 'components/app-header'; @import 'components/icon'; +@import 'components/list'; +@import 'components/list-social-platform'; + +@import 'screens/home'; diff --git a/index.md b/index.md index 355adef..de4aab5 100755 --- a/index.md +++ b/index.md @@ -4,4 +4,31 @@ title: Home permalink: / --- -Yay! Join us for the first ever conference in Thailand! \ No newline at end of file +
+
+ +
+
+September 6-7, 2019 +
+
+Venue: Some place magical in Bangkok +
+
+ +
+

+RubyConfTH +

+

+2019 +

+
+ +
+ +We know you want to be part of the very first Ruby conference in Thailand. We are still mining the raw gems. + +Keep Me Updated + +
\ No newline at end of file diff --git a/public/images/favicon/android-icon-144x144.png b/public/images/favicon/android-icon-144x144.png index 156dc6c..8748be9 100755 Binary files a/public/images/favicon/android-icon-144x144.png and b/public/images/favicon/android-icon-144x144.png differ diff --git a/public/images/favicon/android-icon-192x192.png b/public/images/favicon/android-icon-192x192.png index 7643c60..1b2d976 100755 Binary files a/public/images/favicon/android-icon-192x192.png and b/public/images/favicon/android-icon-192x192.png differ diff --git a/public/images/favicon/android-icon-36x36.png b/public/images/favicon/android-icon-36x36.png index dae0686..f1de795 100755 Binary files a/public/images/favicon/android-icon-36x36.png and b/public/images/favicon/android-icon-36x36.png differ diff --git a/public/images/favicon/android-icon-48x48.png b/public/images/favicon/android-icon-48x48.png index 0f78d88..d0a035b 100755 Binary files a/public/images/favicon/android-icon-48x48.png and b/public/images/favicon/android-icon-48x48.png differ diff --git a/public/images/favicon/android-icon-72x72.png b/public/images/favicon/android-icon-72x72.png index 362031f..4e3e262 100755 Binary files a/public/images/favicon/android-icon-72x72.png and b/public/images/favicon/android-icon-72x72.png differ diff --git a/public/images/favicon/android-icon-96x96.png b/public/images/favicon/android-icon-96x96.png index 37de03a..c86045b 100755 Binary files a/public/images/favicon/android-icon-96x96.png and b/public/images/favicon/android-icon-96x96.png differ diff --git a/public/images/favicon/apple-icon-144x144.png b/public/images/favicon/apple-icon-144x144.png index d5d6314..8748be9 100755 Binary files a/public/images/favicon/apple-icon-144x144.png and b/public/images/favicon/apple-icon-144x144.png differ diff --git a/public/images/favicon/apple-icon-152x152.png b/public/images/favicon/apple-icon-152x152.png index 2e4d9cc..8b0ef2b 100755 Binary files a/public/images/favicon/apple-icon-152x152.png and b/public/images/favicon/apple-icon-152x152.png differ diff --git a/public/images/favicon/favicon-16x16.png b/public/images/favicon/favicon-16x16.png index 5952a48..7800997 100755 Binary files a/public/images/favicon/favicon-16x16.png and b/public/images/favicon/favicon-16x16.png differ diff --git a/public/images/favicon/favicon-32x32.png b/public/images/favicon/favicon-32x32.png index 0b7d9ce..12d74c1 100755 Binary files a/public/images/favicon/favicon-32x32.png and b/public/images/favicon/favicon-32x32.png differ diff --git a/public/images/favicon/favicon.ico b/public/images/favicon/favicon.ico old mode 100755 new mode 100644 index de26da6..f3be78b Binary files a/public/images/favicon/favicon.ico and b/public/images/favicon/favicon.ico differ diff --git a/public/images/favicon/mstile-144x144.png b/public/images/favicon/mstile-144x144.png index d5d6314..8748be9 100755 Binary files a/public/images/favicon/mstile-144x144.png and b/public/images/favicon/mstile-144x144.png differ diff --git a/public/images/favicon/mstile-150x150.png b/public/images/favicon/mstile-150x150.png index 13a4407..8b0ef2b 100755 Binary files a/public/images/favicon/mstile-150x150.png and b/public/images/favicon/mstile-150x150.png differ diff --git a/public/images/favicon/mstile-310x150.png b/public/images/favicon/mstile-310x150.png index 04011cb..e364736 100755 Binary files a/public/images/favicon/mstile-310x150.png and b/public/images/favicon/mstile-310x150.png differ diff --git a/public/images/favicon/mstile-310x310.png b/public/images/favicon/mstile-310x310.png index fe1650d..2f97fdc 100755 Binary files a/public/images/favicon/mstile-310x310.png and b/public/images/favicon/mstile-310x310.png differ diff --git a/public/images/social/og-icon.jpg b/public/images/social/og-icon.jpg old mode 100755 new mode 100644 index eaca27f..d9de581 Binary files a/public/images/social/og-icon.jpg and b/public/images/social/og-icon.jpg differ diff --git a/public/images/social/twitter-icon.png b/public/images/social/twitter-icon.png old mode 100755 new mode 100644 index 3f98b4c..f9752c4 Binary files a/public/images/social/twitter-icon.png and b/public/images/social/twitter-icon.png differ diff --git a/public/manifest.json b/public/manifest.json index 0b961b5..dcceecf 100755 --- a/public/manifest.json +++ b/public/manifest.json @@ -1,6 +1,6 @@ { - "name": "Jekyll Template", - "short_name": "Jekyll", + "name": "Ruby Conference Thailand 2019", + "short_name": "RubyConfTH", "icons": [ { "src": "/public/images/favicon/android-icon-36x36.png", @@ -41,5 +41,5 @@ ], "display": "standalone", "background_color": "#fff", - "theme_color": "#ea1017" + "theme_color": "#f83548" } \ No newline at end of file diff --git a/vendor/stylesheets/bootstrap/_alert.scss b/vendor/stylesheets/bootstrap/_alert.scss new file mode 100755 index 0000000..da2a98a --- /dev/null +++ b/vendor/stylesheets/bootstrap/_alert.scss @@ -0,0 +1,51 @@ +// +// Base styles +// + +.alert { + position: relative; + padding: $alert-padding-y $alert-padding-x; + margin-bottom: $alert-margin-bottom; + border: $alert-border-width solid transparent; + @include border-radius($alert-border-radius); +} + +// Headings for larger alerts +.alert-heading { + // Specified to prevent conflicts of changing $headings-color + color: inherit; +} + +// Provide class for links that match alerts +.alert-link { + font-weight: $alert-link-font-weight; +} + + +// Dismissible alerts +// +// Expand the right padding and account for the close button's positioning. + +.alert-dismissible { + padding-right: $close-font-size + $alert-padding-x * 2; + + // Adjust close link position + .close { + position: absolute; + top: 0; + right: 0; + padding: $alert-padding-y $alert-padding-x; + color: inherit; + } +} + + +// Alternate styles +// +// Generate contextual modifier classes for colorizing the alert. + +@each $color, $value in $theme-colors { + .alert-#{$color} { + @include alert-variant(theme-color-level($color, $alert-bg-level), theme-color-level($color, $alert-border-level), theme-color-level($color, $alert-color-level)); + } +} diff --git a/vendor/stylesheets/bootstrap/_badge.scss b/vendor/stylesheets/bootstrap/_badge.scss new file mode 100755 index 0000000..bdbe4b9 --- /dev/null +++ b/vendor/stylesheets/bootstrap/_badge.scss @@ -0,0 +1,53 @@ +// Base class +// +// Requires one of the contextual, color modifier classes for `color` and +// `background-color`. + +.badge { + display: inline-block; + padding: $badge-padding-y $badge-padding-x; + font-size: $badge-font-size; + font-weight: $badge-font-weight; + line-height: 1; + text-align: center; + white-space: nowrap; + vertical-align: baseline; + @include border-radius($badge-border-radius); + + @at-root a#{&} { + @include hover-focus { + text-decoration: none; + } + } + + // Empty badges collapse automatically + &:empty { + display: none; + } +} + +// Quick fix for badges in buttons +.btn .badge { + position: relative; + top: -1px; +} + +// Pill badges +// +// Make them extra rounded with a modifier to replace v3's badges. + +.badge-pill { + padding-right: $badge-pill-padding-x; + padding-left: $badge-pill-padding-x; + @include border-radius($badge-pill-border-radius); +} + +// Colors +// +// Contextual variations (linked badges get darker on :hover). + +@each $color, $value in $theme-colors { + .badge-#{$color} { + @include badge-variant($value); + } +} diff --git a/vendor/stylesheets/bootstrap/_breadcrumb.scss b/vendor/stylesheets/bootstrap/_breadcrumb.scss new file mode 100755 index 0000000..be30950 --- /dev/null +++ b/vendor/stylesheets/bootstrap/_breadcrumb.scss @@ -0,0 +1,41 @@ +.breadcrumb { + display: flex; + flex-wrap: wrap; + padding: $breadcrumb-padding-y $breadcrumb-padding-x; + margin-bottom: $breadcrumb-margin-bottom; + list-style: none; + background-color: $breadcrumb-bg; + @include border-radius($breadcrumb-border-radius); +} + +.breadcrumb-item { + // The separator between breadcrumbs (by default, a forward-slash: "/") + + .breadcrumb-item { + padding-left: $breadcrumb-item-padding; + + &::before { + display: inline-block; // Suppress underlining of the separator in modern browsers + padding-right: $breadcrumb-item-padding; + color: $breadcrumb-divider-color; + content: $breadcrumb-divider; + } + } + + // IE9-11 hack to properly handle hyperlink underlines for breadcrumbs built + // without `