Mobile optimization
This commit is contained in:
parent
86f0b19e00
commit
aa5bcf27b1
|
@ -5,6 +5,7 @@
|
|||
<title>For Good, not Evil — An ELOS License Builder</title>
|
||||
<script src="elm.min.js"></script>
|
||||
<link rel="stylesheet" href="styles.css"/>
|
||||
<meta name="viewport" content="width=736">
|
||||
<meta property="og:description" content="The world of today is not the world our free software licenses were written for. The licenses we created to protect freedom are being taken advantage of by institutions like ICE and surveillance states to take away the freedom of others. It's time to reclaim our software in the name of freedom." />
|
||||
<style>
|
||||
@font-face {
|
||||
|
|
|
@ -31,7 +31,7 @@ header {
|
|||
font-size: 3.2rem;
|
||||
|
||||
padding: 0px 49px;
|
||||
width: 600px;
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
|
||||
p {
|
||||
|
@ -129,15 +129,21 @@ header {
|
|||
#license-chooser {
|
||||
max-width: 800px;
|
||||
margin: 0 auto;
|
||||
padding: 0 50px;
|
||||
|
||||
#selected-license {
|
||||
border: 60px solid;
|
||||
border-image: url("/assets/cool-border.svg") 60;
|
||||
padding: 30px;
|
||||
border-radius: 20px;
|
||||
white-space: pre-wrap;
|
||||
|
||||
@media (min-width: 1000px) {
|
||||
padding: 30px;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin-top: 0;
|
||||
line-height: 120%;
|
||||
}
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
|
@ -180,11 +186,18 @@ header {
|
|||
|
||||
#modules {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
gap: 50px;
|
||||
max-width: 1070px;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 50px;
|
||||
padding: 0 50px;
|
||||
|
||||
@media (min-width: 968px) {
|
||||
grid-template-columns: 1fr 1fr;
|
||||
}
|
||||
@media (max-width: 968px) {
|
||||
padding: 0 100px;
|
||||
}
|
||||
|
||||
.module-button > div {
|
||||
box-sizing: border-box;
|
||||
|
@ -231,7 +244,7 @@ header {
|
|||
grid-template-columns: 1fr 0fr 1fr;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
max-width: 900px;
|
||||
max-width: min(900px, 90vw);
|
||||
gap: 50px;
|
||||
font-family: Resistance;
|
||||
color: #e1c0ed;
|
||||
|
|
Loading…
Reference in a new issue