diff --git a/docs/css/main.css b/docs/css/main.css index 7ac962b4624..7870e6a3968 100755 --- a/docs/css/main.css +++ b/docs/css/main.css @@ -357,6 +357,7 @@ h2, h3 { .featuring-links { list-style: none; margin: 0; + margin-bottom: -1em; padding: 0; } @@ -402,6 +403,36 @@ h2, h3 { width: 2em; } +.btn-docs img { + background-color: #fff; + border: 1px solid transparent; + -webkit-border-radius: 80px; + -moz-border-radius: 80px; + border-radius: 80px; + padding: 4px; + width: 40px; + /* Transitions */ + -webkit-transition: all 0.5s ease; + -moz-transition: all 0.5s ease; + -ms-transition: all 0.5s ease; + -o-transition: all 0.5s ease; + transition: all 0.5s ease; +} + +.btn-docs:hover img { + border: 1px solid #ccc; + transform: rotate(135deg); + -webkit-box-shadow: 4px 4px 4px rgba(0, 0, 0, .3); + -moz-box-shadow: 4px 4px 4px rgba(0, 0, 0, .3); + box-shadow: 4px 4px 4px rgba(0, 0, 0, .3); +} + +.btn-docs:active img { + -webkit-box-shadow: 4px 4px 4px rgba(0, 0, 0, .5); + -moz-box-shadow: 4px 4px 4px rgba(0, 0, 0, .5); + box-shadow: 4px 4px 4px rgba(0, 0, 0, .5); +} + .ext-link { display: block; padding: 1em; @@ -416,6 +447,10 @@ h2, h3 { transition: all 0.3s ease; } +.featuring-links li:last-child .ext-link { + border-bottom: none; +} + .ext-link:hover { background: #f6f6f6; } @@ -880,7 +915,7 @@ h2, h3 { Modify as content requires. ========================================================================== */ -@media only screen and (min-width: 35em) { +@media only screen and (min-width: 37em) { /* Main @@ -894,6 +929,10 @@ h2, h3 { Featuring */ + .featuring-links li:first-child { + display: block; + } + .featuring-links { text-align: center; } @@ -902,10 +941,6 @@ h2, h3 { display: inline-block; } - .featuring-links li:first-child { - display: block; - } - .featuring-links .btn { display: inline-block; padding: 1em 2.4em; diff --git a/docs/home.html b/docs/home.html index 8c17653abac..93a1ef5d592 100755 --- a/docs/home.html +++ b/docs/home.html @@ -24,9 +24,9 @@

One-line npm install