Rubykaigi2026 design

app/assets/stylesheets/application.postcss.css

@@ -45,4 +45,6 @@
 @import "./modules/teammates.css";
 @import "./modules/staff-website-page.css";
 
+@import "./override/index.css";
+
 @import "tailwindcss/utilities";

app/assets/stylesheets/override/2026.css

@@ -0,0 +1,9 @@
+/* For RubyKaigi 2026 */
+:root {
+  --body-bg: #F9EFEC;
+  --text-color: #000;
+}
+
+h1, h2, h3 {
+  font-family: var(--font-family-outfit);
+}

app/assets/stylesheets/override/bootstrap.css

@@ -0,0 +1,56 @@
+/* Override navbar styles for RubyKaigi fork */
+.navbar-default {
+  background-color: var(--gray-lightest);
+  border: none;
+  box-shadow: 0 2px 1px var(--gray-light);
+}
+
+.navbar-default .navbar-brand,
+.navbar-default .navbar-nav .nav-link {
+  color: var(--text-color);
+}
+
+.navbar-default .navbar-brand:hover,
+.navbar-default .navbar-brand:focus,
+.navbar-default .navbar-brand:active,
+.navbar-default .navbar-nav .nav-link:hover,
+.navbar-default .navbar-nav .nav-link:focus,
+.navbar-default .navbar-nav .nav-link:active {
+  color: var(--gray-light);
+}
+
+.navbar-default .navbar-brand {
+  font-family: var(--font-family-sans-serif);
+  font-weight: bold;
+  padding-left: 0;
+}
+
+@media (min-width: 992px) {
+  .navbar-default .navbar-nav .nav-item.active .nav-link,
+  .navbar-default .navbar-nav .nav-item .nav-link.active {
+    background-color: var(--gray-dark) !important;
+    color: white;
+    border-radius: 4px;
+    padding-top: 5px;
+    padding-bottom: 5px;
+    margin-top: 7px;
+  }
+}
+
+@media (max-width: 991px) {
+  .navbar-default .navbar-nav .nav-item.active .nav-link,
+  .navbar-default .navbar-nav .nav-item .nav-link.active {
+    background-color: transparent;
+    color: var(--text-color);
+  }
+}
+
+.navbar-default .navbar-toggler{
+  border-color: var(--gray);
+  background-color: var(--gray);
+  color: var(--text-color);
+}
+
+.navbar-toggler:focus {
+  box-shadow: 0 0 0 2px;
+}

app/assets/stylesheets/override/index.css

@@ -0,0 +1,5 @@
+@import "./variables.css";
+@import "./layout.css";
+@import "./bootstrap.css";
+
+@import "./2026.css"

app/assets/stylesheets/override/layout.css

@@ -0,0 +1,4 @@
+body {
+  background-color: var(--body-bg);
+  color: var(--text-color);
+}

app/assets/stylesheets/override/variables.css

@@ -0,0 +1,8 @@
+/* Override variables for RubyKaigi fork */
+:root {
+  --body-bg: white;
+  --gray-lightest: hsl(from var(--black) h s calc(l + 97));
+
+  --font-family-sans-serif: 'Montserrat', sans-serif;
+  --font-family-outfit: 'Outfit', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+}

app/views/devise/sessions/new.html.haml

@@ -6,7 +6,7 @@
   = simple_form_for(resource, as: resource_name, url: session_path(resource_name)) do |f|
 
     .form-inputs
-      .col-sm-5.col-centered
+      .col-sm-10.col-md-7.col-lg-6.col-centered
         .card
           .card-body
             = f.error_notification
@@ -20,7 +20,7 @@
             .form-group= render "devise/shared/links"
 
 - unless Rails.env.production?
-  .col-sm-5.col-centered.mt-3
+  .col-sm-10.col-md-7.col-lg-6.col-centered.mt-3
     .card
       .card-body
         .form-group

app/views/layouts/_navbar.html.haml

@@ -1,7 +1,7 @@
 .navbar.navbar-expand-lg.navbar-default.fixed-top
   .container-fluid
     - if current_event
-      = link_to "#{current_event.name} CFP", event_path(current_event), class: 'navbar-brand'
+      = link_to "RubyKaigi 2026", event_path(current_event), class: 'navbar-brand'
     - else
       = link_to "CFP App", events_path, class: 'navbar-brand'
     %button.navbar-toggler{ type: "button", data: { bs_toggle: "collapse", bs_target: ".navbar-collapse" }, aria: { controls: "navbarNav", expanded: "false", label: "Toggle navigation" } }

app/views/layouts/application.html.haml

@@ -6,7 +6,12 @@
 
     = stylesheet_link_tag 'application', media: 'all'
     = stylesheet_link_tag '//maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css', media: 'all'
+
+    %link{rel:'preconnect', href:'//fonts.googleapis.com'}
+    %link{rel:'preconnect', href:'//fonts.gstatic.com', crossorigin: ''}
     = stylesheet_link_tag "//fonts.googleapis.com/css?family=Open+Sans:400italic,600italic,400,600"
+    = stylesheet_link_tag '//fonts.googleapis.com/css2?family=Montserrat:wght@400;700&display=swap'
+    = stylesheet_link_tag '//fonts.googleapis.com/css2?family=Outfit:wght@100..900&display=swap'
 
     = javascript_include_tag 'application', 'data-turbo-track': 'reload', type: 'module'