Skip to content
Snippets Groups Projects
Verified Commit fae1001e authored by Diego Salazar's avatar Diego Salazar
Browse files

Adjusted CSS and index page for translation

parent 88efc5e8
No related branches found
No related tags found
2 merge requests!583Tweak headline paragraph as per discussion at #570,!527Add languages
...@@ -1580,54 +1580,75 @@ img.monero-logo { ...@@ -1580,54 +1580,75 @@ img.monero-logo {
transition: all ease-out .1s; transition: all ease-out .1s;
} }
.topnav .topnav-list .language-change { .topnav .topnav-list .language-change, .topnav .topnav-list .top-link {
font-size: 0.9rem;
}
.topnav .topnav-list .top-link {
padding: 0.8rem 1rem;
}
.topnav .topnav-list .top-link.language-change {
position: relative; position: relative;
display: inline-block;
padding: 0;
margin-right: 3.5rem;
}
.topnav .topnav-list .language-change label {
height: 100%;
/*width: 100%;*/
padding: 0.8rem 1rem;
display: block; display: block;
} }
.topnav .topnav-list .language-change, .topnav .topnav-list .top-link { .topnav .topnav-list .language-change label:hover {
padding-top: 0.8rem; color: #ff7519;
padding-bottom: 0.8rem; cursor: pointer;
padding-right: 4.5rem; }
font-size: 0.9rem;
}
.topnav .topnav-list .language-change:hover { .topnav .topnav-list .language-change input:checked + label {
background-color: #fcfcfc; background-color: #fcfcfc;
-moz-box-shadow: 0 3px 5px rgba(50,50,93,.1);
-webkit-box-shadow: 0 3px 5px rgba(50,50,93,.1);
box-shadow: 0 3px 5px rgba(50,50,93,.1);
} }
.topnav .topnav-list .language-change:hover>.dropdown-content { .topnav .topnav-list .language-change input:checked ~ .dropdown-content {
opacity: 1; display: block;
visibility: visible;
} }
.topnav .topnav-list .language-change label div.arrow-down { .topnav .topnav-list .language-change label div.arrow-down {
display: inline-block; display: inline-block;
margin-bottom: 0.25rem; margin-bottom: 0.25rem;
margin-left: 0.1rem; margin-left: 0.2rem;
border-top: 3px solid #7a7a7a; border-top: 3px solid #7a7a7a;
}
.topnav .topnav-list .language-change label:hover div.arrow-down {
border-top: 3px solid #ff7519;
} }
.topnav .topnav-list .language-change .dropdown-content { .topnav .topnav-list .language-change .dropdown-content {
display: none;
position: absolute; position: absolute;
left: 0; left: 0;
top: 99.5%; top: 2.8rem;
text-align: left; text-align: left;
background: #fcfcfc; background: #fcfcfc;
width: 100%; width: 100%;
-webkit-box-sizing: border-box; -webkit-box-sizing: border-box;
-moz-box-sizing: border-box; -moz-box-sizing: border-box;
box-sizing: border-box; box-sizing: border-box;
opacity: 0;
visibility: hidden;
z-index: 1; z-index: 1;
-webkit-transition: all .3s ease; -webkit-transition: all .3s ease;
-moz-transition: all .3s ease; -moz-transition: all .3s ease;
-ms-transition: all .3s ease; -ms-transition: all .3s ease;
-o-transition: all .3s ease; -o-transition: all .3s ease;
transition: all .3s ease; transition: all .3s ease;
-moz-box-shadow: 0 3px 5px rgba(50,50,93,.1);
-webkit-box-shadow: 0 3px 5px rgba(50,50,93,.1);
box-shadow: 0 3px 5px rgba(50,50,93,.1);
} }
.topnav .topnav-list .language-change .dropdown-content a { .topnav .topnav-list .language-change .dropdown-content a {
...@@ -1636,6 +1657,7 @@ img.monero-logo { ...@@ -1636,6 +1657,7 @@ img.monero-logo {
.topnav .topnav-list .language-change .dropdown-content a:hover, .topnav .topnav-list .language-change .dropdown-content a:focus { .topnav .topnav-list .language-change .dropdown-content a:hover, .topnav .topnav-list .language-change .dropdown-content a:focus {
text-decoration: none; text-decoration: none;
/*background-color: #f9f9fa;*/
} }
.topnav .topnav-list .language-change .dropdown-content a.active { .topnav .topnav-list .language-change .dropdown-content a.active {
...@@ -1744,13 +1766,12 @@ img.monero-logo { ...@@ -1744,13 +1766,12 @@ img.monero-logo {
font-family: 'Hind', sans-serif; font-family: 'Hind', sans-serif;
font-weight: 500; font-weight: 500;
font-size: 0.99rem; font-size: 0.99rem;
padding: 0.8rem 3.4rem 0.8rem 3.5rem; padding: 0.8rem 3rem 0.8rem 3.5rem;
-webkit-transition: all ease-out .2s; -webkit-transition: all ease-out .2s;
-moz-transition: all ease-out .2s; -moz-transition: all ease-out .2s;
-o-transition: all ease-out .2s; -o-transition: all ease-out .2s;
transition: all ease-out .2s; transition: all ease-out .2s;
line-height: 1.3; line-height: 1.3;
white-space: nowrap;
} }
.nav-item>.dropdown-content>a:hover { .nav-item>.dropdown-content>a:hover {
...@@ -1767,9 +1788,13 @@ img.monero-logo { ...@@ -1767,9 +1788,13 @@ img.monero-logo {
} }
@media only screen and (max-width: 75rem) { @media only screen and (max-width: 75rem) {
.topnav .topnav-list .top-link.language-change {
margin-right: 3.1rem;
font-size: 0.85rem;
}
.topnav .topnav-list .top-link { .topnav .topnav-list .top-link {
padding-right: 4.1rem;
font-size: 0.85rem; font-size: 0.85rem;
} }
...@@ -1777,6 +1802,14 @@ img.monero-logo { ...@@ -1777,6 +1802,14 @@ img.monero-logo {
padding-left: 3.1rem; padding-left: 3.1rem;
} }
.topnav .topnav-list .top-link {
padding: 0.8rem 0.5rem;
}
.topnav .topnav-list .language-change .dropdown-content {
top: 1.9rem;
}
.nav-items>.nav-item>label, .nav-item>.dropdown-content>a { .nav-items>.nav-item>label, .nav-item>.dropdown-content>a {
padding-left: 2.7rem; padding-left: 2.7rem;
} }
...@@ -1786,8 +1819,8 @@ img.monero-logo { ...@@ -1786,8 +1819,8 @@ img.monero-logo {
} }
.nav-item>.dropdown-content>a { .nav-item>.dropdown-content>a {
font-size: 1rem; font-size: 0.9rem;
padding-right: 2.7rem; padding-right: 2.2rem;
} }
.nav-items>.nav-item:first-of-type>label, .white-nav .nav-item:first-of-type .dropdown-content a { .nav-items>.nav-item:first-of-type>label, .white-nav .nav-item:first-of-type .dropdown-content a {
...@@ -1821,11 +1854,15 @@ img.monero-logo { ...@@ -1821,11 +1854,15 @@ img.monero-logo {
@media only screen and (max-width: 62rem) { @media only screen and (max-width: 62rem) {
/*.mob.bot-nav.white-nav .col-xs-6 a {
display: inline-block;
}*/
img.monero-logo { img.monero-logo {
position: inherit; position: inherit;
width: 10rem; width: 10rem;
padding: 0.39rem 0 0 0; padding: 0.39rem 0 0.39rem 0;
} }
.white-nav { .white-nav {
...@@ -2096,6 +2133,14 @@ label[for="mobile-burger"] { ...@@ -2096,6 +2133,14 @@ label[for="mobile-burger"] {
#drop1:checked ~ .dropdown-content, #drop2:checked ~ .dropdown-content, #drop3:checked ~ .dropdown-content, #drop4:checked ~ .dropdown-content { #drop1:checked ~ .dropdown-content, #drop2:checked ~ .dropdown-content, #drop3:checked ~ .dropdown-content, #drop4:checked ~ .dropdown-content {
background-color: #fcfcfc; background-color: #fcfcfc;
} }
.mob-language-change, .mob-language-change label {
cursor: pointer;
}
.mob-language-change img.icon-language{
width: 1.5rem;
}
#moblangdrop:checked ~ .dropdown-content { #moblangdrop:checked ~ .dropdown-content {
display: block; display: block;
...@@ -2103,24 +2148,42 @@ label[for="mobile-burger"] { ...@@ -2103,24 +2148,42 @@ label[for="mobile-burger"] {
opacity: 1; opacity: 1;
visibility: visible; visibility: visible;
box-shadow: none; box-shadow: none;
top: 6%; top: 2.92rem;
left: 0; left: 0;
right: 0; right: 0;
text-align: center; text-align: center;
width: inherit; width: inherit;
margin-top: 0.6rem; margin-top: 0.6rem;
background-color: #fcfcfc; background-color: #fff;
} }
label[for="moblangdrop"] { label[for="moblangdrop"] {
display: block; display: block;
padding: 1.5rem 1rem; margin-right: 0.5rem;
padding: 0.5rem;
} }
#moblangdrop:checked ~ label { label[for="moblangdrop"], label[for="moblangdrop"]:checked, #moblangdrop, #moblangdrop:checked {
background-color: #fcfcfc; -webkit-tap-highlight-color: rgba(0,0,0,0);
} -webkit-tap-highlight-color: transparent;
}
.burger-check:checked + label { #moblangdrop:checked ~ label {
background-color: transparent;
}
#moblangdrop ~ label .arrow-down {
display: inline-block;
margin-left: 0.2rem;
margin-bottom: 0.6rem;
border-top: 3px solid #393939;
}
#moblangdrop:checked ~ label .arrow-down {
border-bottom: 3px solid #393939;
border-top: 0;
}
.burger-check:checked + label {
position: fixed; position: fixed;
} }
...@@ -2138,24 +2201,25 @@ label[for="moblangdrop"] { ...@@ -2138,24 +2201,25 @@ label[for="moblangdrop"] {
.white-nav .mob-language-change label { .white-nav .mob-language-change label {
color: #393939; color: #393939;
} }
p.mob-lang-change {
padding: 0.8rem;
color: #d7d7d7;
border-bottom: 1px solid #d7d7d7;
border-top: 1px solid #d7d7d7;
cursor: default;
}
a.mob-lang-change { a.mob-lang-change {
padding: 1.5rem 1.5rem; padding: 0.8rem;
color: #393939; color: #393939;
border-bottom: 1px solid #e8ebef; border-bottom: 1px solid #e8ebef;
} line-height: 1.7;
}
a.mob-lang-change:hover, a.mob-lang-change.active, a.mob-lang-change:focus {
color: #ff7519;
text-decoration: none;
}
.white-nav .mob-language-change label .arrow-down { a.mob-lang-change:hover, a.mob-lang-change.active, a.mob-lang-change:focus {
display: inline-block; color: #ff7519;
margin-left: 0.2rem; text-decoration: none;
margin-bottom: 0.2rem;
border-top: 3px solid #393939;
} }
} }
...@@ -2261,7 +2325,7 @@ img.monero-logo { ...@@ -2261,7 +2325,7 @@ img.monero-logo {
} }
p.main-resources { p.main-resources {
height: 11rem; height: 12rem;
} }
p.main-downloads { p.main-downloads {
......
--- ---
layout: base layout: base
title: Home title: Home
permalink: index permalink: index.html
--- ---
{% tf index.md %} {% tf index.md %}
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment