Skip to content

Commit 97c1dd8

Browse files
InesalvergneAmandaPerino
Inesalvergne
and
AmandaPerino
authored
Rails World 2025 LP (#450)
* wip creating rails world 2025 LP * rails world 2025 LP - finish design details * add gradient animation for the background * rails world 2025 - add links and update metatags * rails world 2025 - add sponsorship cta and footer * Update index.html Changing the button text until the CFP officially opens on March 11. --------- Co-authored-by: Amanda Perino <[email protected]>
1 parent 0bea33e commit 97c1dd8

File tree

14 files changed

+325
-0
lines changed

14 files changed

+325
-0
lines changed

‎_config.yml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ twitter: rails
44
feed_path: /feed.xml
55
world23_title: Rails World - 2023
66
world24_title: Rails World - 2024
7+
world25_title: Rails World 2025 - Amsterdam, NL
78

89
plugins:
910
- jekyll-feed

‎_includes/world/2025/head.html

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
{% if page.title %}
2+
{% assign title = site.world25_title | append: ' &mdash; ' | append: page.title %}
3+
{% else %}
4+
{% assign title = site.world25_title %}
5+
{% endif %}
6+
7+
{% if page.description %}
8+
{% assign description = page.description %}
9+
{% else %}
10+
{% assign description = site.description %}
11+
{% endif %}
12+
13+
{% if page.og_image %}
14+
{% assign image = page.og_image | absolute_url %}
15+
{% else %}
16+
{% assign image = '/assets/world/2025/rails-world-2025.png' | absolute_url %}
17+
{% endif %}
18+
19+
{% assign url = page.url | absolute_url %}
20+
21+
<head>
22+
<title>{{ title }}</title>
23+
<meta charset="utf-8" />
24+
<meta content="ie=edge" http-equiv="x-ua-compatible" />
25+
<meta name="handheldfriendly" content="true" />
26+
<meta name="viewport" content="width=device-width, initial-scale=1">
27+
<meta name="description" content="{{ description }}" />
28+
29+
<meta property="og:site_name" content="{{ site.world25_title }}" />
30+
<meta property="og:title" content="{{ title }}" />
31+
<meta property="og:description" content="{{ description }}" />
32+
<meta property="og:image" content="{{ image }}" />
33+
<meta property="og:url" content="{{ url }}" />
34+
<meta property="og:type" content="{% if page.collection == 'posts' %}article{% else %}website{% endif %}" />
35+
36+
<meta name="twitter:title" content="{{ title }}" />
37+
<meta name="twitter:description" content="{{ description }}" />
38+
<meta name="twitter:image" content="{{ image }}" />
39+
<meta name="twitter:card" content="summary_large_image" />
40+
<meta name="twitter:creator" content="@{{ site.twitter }}" />
41+
<meta name="twitter:image:alt" content="{{ site.world25_title }}" />
42+
43+
<script type="application/ld+json">
44+
{
45+
"@context": "https://schema.org",
46+
"@type": "WebPage",
47+
"mainEntityOfPage": {
48+
"@type": "WebPage",
49+
"@id": "{{ url }}"
50+
},
51+
"name": "{{ site.world25_title }}",
52+
"headline": "{{ title }}",
53+
"description": "{{ description }}",
54+
"url": "{{ url }}",
55+
"image": "{{ image }}"
56+
}
57+
</script>
58+
<script defer data-domain="rubyonrails.org" src="https://plausible.io/js/script.js"></script>
59+
60+
<script src="/assets/world/2023/scripts/back_to_top.js" defer></script>
61+
<script src="/assets/world/2023/scripts/carousel.js" defer></script>
62+
<script src="/assets/world/2023/scripts/modal_component.js" defer></script>
63+
64+
<script type="module">
65+
import hotwiredTurbo from 'https://cdn.skypack.dev/@hotwired/turbo';
66+
</script>
67+
68+
<script type="text/javascript">
69+
document.addEventListener("turbo:click", (event) => {
70+
if (event.srcElement.closest("modal-component")) {
71+
event.preventDefault()
72+
Turbo.visit(event.detail.url)
73+
}
74+
})
75+
</script>
76+
77+
<link rel="icon" href="/assets/images/favicon.ico" />
78+
<link rel="apple-touch-icon" type="image/png" href="/assets/images/apple-touch-icon.png" />
79+
<link rel="stylesheet" href="https://use.typekit.net/lar2lzk.css">
80+
<link rel="stylesheet" href="/assets/css/world-2025.css" />
81+
<link rel="canonical" href="{{ url }}" />
82+
<link rel="preconnect" href="https://fonts.googleapis.com">
83+
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
84+
85+
<link
86+
href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
87+
rel="stylesheet">
88+
<script src='https://js.tito.io/v2/with/inline' async></script>
89+
</head>

‎_layouts/world/2025/default.html

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
<!DOCTYPE html>
2+
3+
<html lang="en" style="scroll-behavior: smooth">
4+
{% include world/2025/head.html %}
5+
<body>
6+
<main id="main-content" tabindex="-1">
7+
{{ content }}
8+
</main>
9+
</body>
10+
</html>

‎_sass/world/2025/base/_body.scss

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
body {
2+
font-family: "acumin-variable", sans-serif;
3+
display: flex;
4+
flex-direction: column;
5+
justify-content: flex-start;
6+
align-items: center;
7+
min-height: 100vh;
8+
width: 100%;
9+
overflow-x: hidden;
10+
background: $purple-pink-gradient;
11+
background-size: 200% 200%;
12+
animation: gradient-dissolve 5s ease infinite;
13+
}

‎_sass/world/2025/base/_colors.scss

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
$dark-purple: #3B1D62;
2+
$pink-purple: #880C51;
3+
$purple-pink-gradient: linear-gradient(180deg, $dark-purple, $dark-purple, $pink-purple, $pink-purple);

‎_sass/world/2025/base/_typography.scss

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
$font-weight-200: 'wght' 200, 'wdth' 100;
2+
$font-weight-600: 'wght' 600, 'wdth' 100, 'slnt' -12;
3+
$font-weight-900: 'wght' 900, 'wdth' 100, 'slnt' -12;
4+
5+
$xxx-large: 52px;
6+
$xx-large: 29px;
7+
$x-large: 24px;
8+
$large: 20px;
9+
$medium: 16px;
10+
$small: 12px;
11+
12+
h1 {
13+
color: white;
14+
font-size: $xxx-large;
15+
font-variation-settings: $font-weight-900;
16+
letter-spacing: 1px;
17+
line-height: 65px;
18+
19+
@media only screen and (max-width: 600px) {
20+
line-height: 40px;
21+
font-size: $xx-large;
22+
}
23+
}
24+
25+
h2 {
26+
color: white;
27+
font-size: $xx-large;
28+
font-variation-settings: $font-weight-900;
29+
letter-spacing: 1px;
30+
31+
@media only screen and (max-width: 600px) {
32+
font-size: $medium;
33+
}
34+
}
35+
36+
p {
37+
color: white;
38+
font-size: $large;
39+
font-variation-settings: $font-weight-900;
40+
letter-spacing: 1px;
41+
42+
@media only screen and (max-width: 600px) {
43+
font-size: 18px;
44+
}
45+
}
46+
47+
.uppercase { text-transform: uppercase; }

‎_sass/world/2025/common/_button.scss

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
.button-primary {
2+
display: inline-block;
3+
background-color: white;
4+
border: 2px solid white;
5+
border-radius: 100px;
6+
color: $dark-purple;
7+
cursor: pointer;
8+
text-decoration: none;
9+
transition: background-color 0.5s ease-out, border 0.5s ease-out, color 0.5s ease-out;
10+
11+
&.large {
12+
width: 100%;
13+
padding: 1rem 0;
14+
font-size: $xx-large;
15+
font-variation-settings: $font-weight-900;
16+
margin-top: 30px;
17+
18+
@media only screen and (max-width: 600px) {
19+
margin-top: 25px;
20+
width: 90%;
21+
font-size: 25px;
22+
}
23+
}
24+
25+
&:hover {
26+
background-color: transparent;
27+
color: white;
28+
}
29+
}

‎_sass/world/2025/common/_gradient_animation.scss

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
@keyframes gradient-dissolve {
2+
0% {
3+
background-position: 0% 25%;
4+
}
5+
50% {
6+
background-position: 0% 75%;;
7+
}
8+
100% {
9+
background-position: 0% 25%;;
10+
}
11+
}

‎_sass/world/2025/modules/_landing_page.scss

Lines changed: 59 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,59 @@
1+
.landing-page {
2+
min-height: 100vh;
3+
box-sizing: border-box;
4+
text-align: center;
5+
display: flex;
6+
flex-direction: column;
7+
justify-content: space-between;
8+
}
9+
10+
#logo-world-2025 {
11+
margin: auto;
12+
width: 350px;
13+
14+
@media only screen and (max-width: 600px) {
15+
width: 300px
16+
}
17+
}
18+
19+
.landing-page .line {
20+
border: 1px solid white;
21+
width: 25%;
22+
margin: 30px auto;
23+
}
24+
25+
.landing-page .cta-with-icon {
26+
margin-top: 10px;
27+
margin-bottom: 20px;
28+
text-decoration: none;
29+
display: flex;
30+
align-items: center;
31+
justify-content: center;
32+
gap: 10px;
33+
34+
.icon {
35+
width: 20px;
36+
37+
@media only screen and (max-width: 600px) {
38+
width: 15px
39+
}
40+
}
41+
42+
p { font-variation-settings: $font-weight-600; }
43+
}
44+
45+
.landing-page .footer {
46+
flex-grow: 1;
47+
display: flex;
48+
align-items: flex-end;
49+
justify-content: center;
50+
margin-bottom: 20px;
51+
color: white;
52+
53+
p, a {
54+
color: white;
55+
font-size: $small;
56+
line-height: 18px;
57+
font-variation-settings: $font-weight-200;
58+
}
59+
}

‎assets/css/world-2025.scss

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
---
2+
---
3+
4+
@charset 'utf-8';
5+
6+
@import 'base/reset';
7+
@import 'base/variables';
8+
9+
@import 'world/2025/base/colors';
10+
@import 'world/2025/base/body';
11+
@import 'world/2025/base/typography';
12+
13+
@import 'world/2025/common/button';
14+
@import 'world/2025/common/gradient_animation';
15+
16+
@import 'world/2025/modules/landing_page';

0 commit comments

Comments
 (0)