Skip to content

Commit 1d7a5b0

Browse files
britzlbritzl
committed
Cleaned up grid styles
1 parent bceb967 commit 1d7a5b0

24 files changed

+110
-85
lines changed

‎_includes/assetgrid.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ <h4>{{ include.title }}</h4>
2121
search.addEventListener('propertychange', inputHandler); // for IE8
2222
</script>
2323

24-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap: 2rem; padding: 0px;">
24+
<div class="grid-250">
2525
{%- for id in assetids -%}
2626
{% include asset.html id=id %}
2727
{%- endfor -%}

‎_includes/community_donors.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<div class="row">
88
<div class="columns twelve center">
99
<h5>Top Community Donors</h5>
10-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); grid-gap: 2rem; padding: 0px;">
10+
<div class="grid-150">
1111
{%- for donor in logodonors -%}
1212
{%- include donor.html donor=donor -%}
1313
{%- endfor -%}

‎_includes/corporate_partners.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,7 @@
1111
<div class="row">
1212
<div class="columns twelve center">
1313
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Platinum Partners</h5>
14-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); grid-gap: 2rem; padding: 0px;">
14+
<div class="grid-150">
1515
{%- for partner in platinum -%}
1616
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 55px" alt="{{ partner.name }} logo"></a>
1717
{%- endfor -%}
@@ -27,7 +27,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Platinum Partners</
2727
<div class="row">
2828
<div class="columns twelve center">
2929
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Gold Partners</h5>
30-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); grid-gap: 1.5rem; padding: 0px;">
30+
<div class="grid-100">
3131
{%- for partner in gold -%}
3232
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 44px" alt="{{ partner.name }} logo"></a>
3333
{%- endfor -%}
@@ -43,7 +43,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Gold Partners</h5>
4343
<div class="row">
4444
<div class="columns twelve center">
4545
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Silver Partners</h5>
46-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); grid-gap: 1rem; padding: 0px;">
46+
<div class="grid-100">
4747
{%- for partner in silver -%}
4848
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 44px" alt="{{ partner.name }} logo"></a>
4949
{%- endfor -%}
@@ -59,7 +59,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Silver Partners</h5
5959
<div class="row">
6060
<div class="columns twelve center">
6161
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Bronze Partners</h5>
62-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(60px, 1fr)); grid-gap: 0.5rem; padding: 0px;">
62+
<div class="grid-100">
6363
{%- for partner in bronze -%}
6464
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 33px" alt="{{ partner.name }} logo"></a>
6565
{%- endfor -%}
@@ -75,7 +75,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Bronze Partners</h5
7575
<div class="row">
7676
<div class="columns twelve center">
7777
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Special Partners</h5>
78-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(60px, 1fr)); grid-gap: 0.5rem; padding: 0px;">
78+
<div class="grid-100">
7979
{%- for partner in special -%}
8080
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 44px" alt="{{ partner.name }} logo"></a>
8181
{%- endfor -%}
@@ -91,7 +91,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Special Partners</h5>
9191
<div class="row">
9292
<div class="columns twelve center">
9393
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Friends of Defold</h5>
94-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(60px, 1fr)); grid-gap: 0.5rem; padding: 0px;">
94+
<div class="grid-100">
9595
{%- for partner in friends -%}
9696
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 33px" alt="{{ partner.name }} logo"></a>
9797
{%- endfor -%}

‎_includes/donors_and_partners.html

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
<div class="row">
1818
<div class="columns twelve center">
1919
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Platinum Partners</h5>
20-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); grid-gap: 2rem; padding: 0px;">
20+
<div class="grid-150">
2121
{%- for partner in platinum -%}
2222
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 55px" alt="{{ partner.name }} logo"></a>
2323
{%- endfor -%}
@@ -33,7 +33,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Platinum Partners</
3333
<div class="row">
3434
<div class="columns twelve center">
3535
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Gold Partners</h5>
36-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); grid-gap: 1.5rem; padding: 0px;">
36+
<div class="grid-100">
3737
{%- for partner in gold -%}
3838
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 44px" alt="{{ partner.name }} logo"></a>
3939
{%- endfor -%}
@@ -49,7 +49,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Gold Partners</h5>
4949
<div class="row">
5050
<div class="columns twelve center">
5151
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Silver Partners</h5>
52-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); grid-gap: 1rem; padding: 0px;">
52+
<div class="grid-100">
5353
{%- for partner in silver -%}
5454
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 44px" alt="{{ partner.name }} logo"></a>
5555
{%- endfor -%}
@@ -65,7 +65,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Silver Partners</h5
6565
<div class="row">
6666
<div class="columns twelve center">
6767
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Bronze Partners</h5>
68-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(60px, 1fr)); grid-gap: 0.5rem; padding: 0px;">
68+
<div class="grid-100">
6969
{%- for partner in bronze -%}
7070
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 33px" alt="{{ partner.name }} logo"></a>
7171
{%- endfor -%}
@@ -81,7 +81,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Corporate Bronze Partners</h5
8181
<div class="row">
8282
<div class="columns twelve center">
8383
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Special Partners</h5>
84-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(60px, 1fr)); grid-gap: 0.5rem; padding: 0px;">
84+
<div class="grid-100">
8585
{%- for partner in special -%}
8686
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 44px" alt="{{ partner.name }} logo"></a>
8787
{%- endfor -%}
@@ -97,7 +97,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Special Partners</h5>
9797
<div class="row">
9898
<div class="columns twelve center">
9999
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Friends of Defold</h5>
100-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(60px, 1fr)); grid-gap: 0.5rem; padding: 0px;">
100+
<div class="grid-100">
101101
{%- for partner in friends -%}
102102
<a href="{{ partner.link }}" target="_blank"><img src="{{ partner.logo }}" style="max-height: 33px" alt="{{ partner.name }} logo"></a>
103103
{%- endfor -%}
@@ -113,7 +113,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Friends of Defold</h5>
113113
<div class="row">
114114
<div class="columns twelve center">
115115
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Top Community Donors</h5>
116-
<div class="lightest-text" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); grid-gap: 2rem; padding: 0px;">
116+
<div class="lightest-text grid-100">
117117
{%- for donor in logodonors -%}
118118
{%- include donor.html donor=donor -%}
119119
{%- endfor -%}
@@ -134,7 +134,7 @@ <h5 style="margin-bottom: 1rem; margin-top: 2rem;">Top Community Donors</h5>
134134
<div class="row">
135135
<div class="columns twelve center">
136136
<h5 style="margin-bottom: 1rem; margin-top: 2rem;">Memberships</h5>
137-
<div class="lightest-text" style="display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); grid-gap: 2rem; padding: 0px;">
137+
<div class="lightest-text grid-100">
138138
{%- for membership in memberships -%}
139139
<a href="{{ membership.link }}" target="_blank"><img src="{{ membership.logo }}" style="max-height: 55px" alt="{{ membership.name }} logo"></a>
140140
{%- endfor -%}

‎_includes/games_half.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<div class="section">
66
<div class="container">
77
<div class="row">
8-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(400px, 1fr)); grid-gap: 2rem; padding: 0px;">
8+
<div class="grid-400">
99
{%- for game in half -%}
1010
{%- include game_half.html game=game -%}
1111
{%- endfor -%}

‎_includes/games_third.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@
55
<div class="section">
66
<div class="container">
77
<div class="row">
8-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(275px, 1fr)); grid-gap: 2rem; padding: 0px;">
8+
<div class="grid-250">
99
{%- for game in third -%}
1010
{%- include game_third.html game=game -%}
1111
{%- endfor -%}

‎_includes/learn_section.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@ <h1>Learn Defold</h1>
77
</div>
88
<div class="row">
99
<div class="columns twelve">
10-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap: 2rem; padding: 0px;">
10+
<div class="grid-250">
1111
{% include card.html title="Tutorials" body="Our tutorials section is the perfect starting point if you are new to Defold game development." link="/tutorials/getting-started" icon="/images/icons/icons-learn-export_ic-learn-tutorials.svg" %}
1212

1313
{% include card.html title="Manuals" body="In-depth manuals provide understanding on how the Defold engine and its APIs work." link="/manuals/introduction" icon="/images/icons/icons-learn-export_ic-learn-manuals.svg" %}
@@ -20,7 +20,7 @@ <h1>Learn Defold</h1>
2020
<div class="columns two"><br/></div>
2121
<div class="columns eight">
2222
<br/>
23-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap: 2rem; padding: 0px;">
23+
<div class="grid-250">
2424
{% include card.html title="Examples" body="A selection of small and discrete code samples, examples and snippets to learn from." link="/examples" icon="/images/icons/icons-learn-export_ic-learn-lego.svg" %}
2525

2626
{% include card.html title="Forum" body="Stuck? Not for long! Talk to the Defold team and our fantastic developer community." link="https://forum.defold.com" icon="/images/icons/icons-learn-export_ic-learn-forum.svg" %}

‎_includes/opensource_faq.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<div class="columns twelve">
55
<h4>Frequently Asked Questions</h4>
66
<p>Do you have a question that isn't answered here? Please <a href="/contact/#open-source">ask us</a> and we will do our best to answer!</p>
7-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); grid-gap: 2rem; padding: 0px;">
7+
<div class="grid-350">
88
{%- for question in site.data.opensourcefaq -%}
99
{% include card.html title=question.q body=question.a %}
1010
{%- endfor -%}

‎_includes/yandexgamesjam_faq.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
<div class="row">
44
<div class="columns twelve">
55
<h4>Frequently Asked Questions</h4>
6-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(350px, 1fr)); grid-gap: 2rem; padding: 0px;">
6+
<div class="grid-350">
77
{%- for question in site.data.yandexgamesjamfaq -%}
88
{% include card.html title=question.q body=question.a %}
99
{%- endfor -%}

‎_layouts/learn.html

Lines changed: 24 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ <h3>Tutorials</h3>
2525
<p>Our tutorials section is the perfect place to start from if you are new to Defold game development.</p>
2626
</div>
2727
</div>
28-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap: 2rem; padding: 0px;">
28+
<div class="grid-250">
2929
{%- for tutorial in site.data.learnindex.navigation.tutorials limit:3 -%}
3030
{%- assign image=tutorial.image | default: "/images/icons/icons-learn-export_ic-learn-tutorials.svg" -%}
3131
{% include learn_card.html title=tutorial.name description=tutorial.description link=tutorial.path min-height="250px" image=image %}
@@ -51,13 +51,11 @@ <h3>Manuals</h3>
5151
</div>
5252
</div>
5353
<div class="row">
54-
<div class="column one-third">
54+
<div class="grid-250">
5555
{% include card.html title="Installing Defold" body="Installation of the Defold editor is quite straightforward. Download the version built for your operating system, extract it and copy the software to a suitable location.<br/><br/>Click to learn more!" link="/manuals/introduction/" min-height="250px" icon="/images/icons/ic-64-rocket.svg" %}
56-
</div>
57-
<div class="column one-third">
56+
5857
{% include card.html title="Creating a project" body="You can easily create a new project from within the Defold editor. You also have the option to open an existing project already located on your computer.<br/><br/>Click to learn more!" link="/manuals/project-setup/" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-documents.svg" %}
59-
</div>
60-
<div class="column one-third">
58+
6159
{% include card.html title="Building Blocks" body="At the core of Defold's design are a few concepts that are very important to get a good grip on. This manual explains what the building blocks of Defold consist of.<br/><br/>Click to learn more!" link="/manuals/building-blocks/" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-lego.svg" %}
6260
</div>
6361
</div>
@@ -80,7 +78,7 @@ <h3>Videos</h3>
8078
<p>The Defold video tutorials are a great starting point if you are a visual learner.</p>
8179
</div>
8280
</div>
83-
<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); grid-gap: 2rem; padding: 0px;">
81+
<div class="grid-250">
8482
{%- for video in site.data.learnindex.navigation.videos limit:3 -%}
8583
{% include youtube_card.html title=video.name description=video.description embed=video.embed link=video.path author=video.author min-height="250px" image="/images/icons/yt_icon_rgb.svg" %}
8684
{%- endfor -%}
@@ -104,37 +102,21 @@ <h3>Examples, API reference and FAQ</h3>
104102
<p>Learn from code samples, our extensive collection of manuals or browse the API reference.</p>
105103
</div>
106104
</div>
107-
<div class="row">
108-
<div class="column one-third">
109-
{% include card.html title="Examples" body="A selection of code samples and examples to learn from." link="/examples" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-toolbox.svg" %}
110-
</div>
111-
<div class="column one-third">
112-
{% include card.html title="API Reference" body="Reference documentation to all Defold Lua and C++ extension APIs." link="/ref/stable/go" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-apiref.svg" %}
113-
</div>
114-
<div class="column one-third">
115-
{% include card.html title="FAQ" body="The FAQ contains the answers and solutions to common questions and problems." link="/faq/faq" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-faq.svg" %}
116-
</div>
117-
</div>
118-
<div class="row">
119-
<div class="column one-third">
120-
{% include card.html title="Examples by Britzl" body="A large selection of Defold examples and games." link="http://britzl.github.io/publicexamples/" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-toolbox.svg" %}
121-
</div>
122-
<div class="column one-third">
123-
{% include card.html title="Games by Ben James" body="More than 20 complete Defold games with source code." link="https://github.com/benjames-171/defold-games" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-toolbox.svg" %}
124-
</div>
125-
<div class="column one-third">
126-
{% include card.html title="Examples by Jcash" body="A couple of Defold example projects." link="https://github.com/JCash/defoldexamples" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-toolbox.svg" %}
127-
</div>
128-
</div>
129-
<div class="row">
130-
<div class="column one-third">
131-
{% include card.html title="Examples by JhonnyG" body="Misc rendering related Defold example projects." link="https://github.com/Jhonnyg/my-public-defold-examples" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-toolbox.svg" %}
132-
</div>
105+
<div class="grid-250">
106+
{% include card.html title="Examples" body="A selection of code samples and examples to learn from." link="/examples" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-toolbox.svg" %}
107+
108+
{% include card.html title="API Reference" body="Reference documentation to all Defold Lua and C++ extension APIs." link="/ref/stable/go" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-apiref.svg" %}
109+
110+
{% include card.html title="FAQ" body="The FAQ contains the answers and solutions to common questions and problems." link="/faq/faq" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-faq.svg" %}
133111
</div>
134-
<div class="row">
135-
<div class="columns full">
136-
&nbsp;
137-
</div>
112+
<div class="grid-250">
113+
{% include card.html title="Examples by Britzl" body="A large selection of Defold examples and games." link="http://britzl.github.io/publicexamples/" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-toolbox.svg" %}
114+
115+
{% include card.html title="Games by Ben James" body="More than 20 complete Defold games with source code." link="https://github.com/benjames-171/defold-games" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-toolbox.svg" %}
116+
117+
{% include card.html title="Examples by Jcash" body="A couple of Defold example projects." link="https://github.com/JCash/defoldexamples" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-toolbox.svg" %}
118+
119+
{% include card.html title="Examples by JhonnyG" body="Misc rendering related Defold example projects." link="https://github.com/Jhonnyg/my-public-defold-examples" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-toolbox.svg" %}
138120
</div>
139121
</div>
140122

@@ -145,14 +127,11 @@ <h3>Community</h3>
145127
<p>Learn from others, share your own knowledge, showcase your games and interact with the development team.</p>
146128
</div>
147129
</div>
148-
<div class="row">
149-
<div class="column one-third">
150-
{% include card.html title="Forum" body="Stuck? Talk to the Defold team and our great Defold developer community." link="//forum.defold.com" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-forum.svg" %}
151-
</div>
152-
<div class="column one-third">
153-
{% include card.html title="Discord" body="Want to chat with other Defold users? Join our Discord server to start chatting!." link="/discord" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-discord.svg" %}
154-
</div>
155-
<div class="column one-third">
130+
<div class="grid-250">
131+
{% include card.html title="Forum" body="Stuck? Talk to the Defold team and our great Defold developer community." link="//forum.defold.com" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-forum.svg" %}
132+
133+
{% include card.html title="Discord" body="Want to chat with other Defold users? Join our Discord server to start chatting!." link="/discord" min-height="250px" icon="/images/icons/icons-learn-export_ic-learn-discord.svg" %}
134+
<div>
156135
&nbsp;
157136
</div>
158137
</div>

0 commit comments

Comments
 (0)