Skip to content
This repository has been archived by the owner on Aug 18, 2020. It is now read-only.
Permalink

Comparing changes

Choose two branches to see what’s changed or to start a new pull request. If you need to, you can also or learn more about diff comparisons.

Open a pull request

Create a new pull request by comparing changes across two branches. If you need to, you can also . Learn more about diff comparisons here.
base repository: rickklaasboer/Onepage-Minecraft-Website
Failed to load repositories. Confirm that selected base ref is valid, then try again.
Loading
base: v1.0-beta3
Choose a base ref
...
head repository: rickklaasboer/Onepage-Minecraft-Website
Failed to load repositories. Confirm that selected head ref is valid, then try again.
Loading
compare: master
Choose a head ref
  • 3 commits
  • 5 files changed
  • 1 contributor

Commits on May 9, 2018

  1. Responsive Design

    TheSparkPlays committed May 9, 2018
    Copy the full SHA
    1634a07 View commit details

Commits on May 11, 2018

  1. Bug Fixes

    Fixed the issue were the page will auto-scroll to the bottom on certain computers/phones.
    TheSparkPlays committed May 11, 2018
    Copy the full SHA
    efdc3dc View commit details

Commits on May 12, 2018

  1. Regular Update

    Added a Back to Top button and fixed the issue were the page would randomly scroll to the bottom.
    TheSparkPlays committed May 12, 2018
    Copy the full SHA
    d0af77b View commit details
Binary file removed 37b1ab24-f698-4b37-8fd7-9244638e06a3.jpg
Binary file not shown.
143 changes: 105 additions & 38 deletions css/main.css
Original file line number Diff line number Diff line change
@@ -17,7 +17,7 @@ html,body {
}

hr {
width: 420px;
max-width: 420px;
color: #718093;
}

@@ -53,72 +53,107 @@ a:hover {
transition: all .2s ease-in;
}

/* Navbar */
#myBtn {
display: none;
position: fixed;
bottom: 20px;
right: 30px;
z-index: 99;
border: none;
outline: none;
background-color: #3498db;
color: white;
cursor: pointer;
padding: 15px;
padding-right: 19px;
padding-left: 19px;
font-size: 18px;
transition: all .2s ease-in;
}

#navbar {
position: sticky;
top: 0;
z-index:1;
#myBtn:hover {
background-color: #2980b9;
transition: all .2s ease-in;
}

ul {
list-style-type: none;
margin: 0;
padding: 0;
/* Navbar */

.topnav {
list-style-type: none;
overflow: hidden;
background-color: white;
box-shadow: 0px 6px 13px -7px rgba(0,0,0,0.20);
transition: all .2s ease-in;
font-weight: 700;
text-transform: uppercase;
transition: all .2s ease-in;
box-shadow: 0px 6px 13px -7px rgba(0,0,0,0.10);
}

ul .max-width {
max-width: 1280px;
margin: 0 auto;
box-shadow: none;
}

li {
.topnav a {
float: left;
}

li a {
display: block;
color: #34495e;
color: black;
text-align: center;
padding: 24px 26px;
font-size: 17px;
text-decoration: none;
font-size: 17px;
}

li a:hover {
.topnav a:hover {
color: #3498db;
transition: all .2s ease-in;
}

.active {
color: #3498db;
.topnav .icon {
display: none;
}

@media screen and (max-width: 800px) {
.topnav a:not(:first-child) {display: none;}
.topnav a.icon {
float: right;
display: block;
}
}

@media screen and (max-width: 800px) {
.topnav.responsive {position: relative;}
.topnav.responsive .icon {
position: absolute;
right: 0;
top: 0;
}
.topnav.responsive a {
float: none;
display: block;
text-align: left;
}
}

@media screen and (min-width: 800px) {
div .max-width {
max-width: 60%;
margin: 0 auto;
box-shadow: none;
}
}

/* End Navbar */

#head {
background-image: url("https://i.imgur.com/9GkIEjN.png");
margin: 0;
padding: 200px;
padding: 222px 0px 222px 0px;
text-align: center;
color: white;
}

#head h1 {
font-size: 50px;
font-size: 55px;
font-weight: 700;
text-transform: uppercase;
}

#head h3 {
font-size: 20px;
font-size: 22px;
text-transform: uppercase;
}

@@ -160,19 +195,19 @@ li a:hover {

#banner {
background-image: url("https://i.imgur.com/XL2PAd3.png");
padding: 75px;
padding: 75px 0px 75px 0px;
text-align: center;
}

#banner2 {
background-image: url("https://i.imgur.com/8P27W9N.png");
padding: 75px;
padding: 75px 0px 75px 0px;
text-align: center;
}

#banner3 {
background-image: url("https://i.imgur.com/MljFIMA.png");
padding: 75px;
padding: 75px 0px 75px 0px;
text-align: center;
}

@@ -248,6 +283,7 @@ li a:hover {
#staff .staffblock {
transform: none;
transition: all .2s ease-in;
margin-bottom: 5px;
}

#staff .staffblock:hover {
@@ -295,13 +331,22 @@ li a:hover {
#gamemodes .mode-inv {
margin: 15px;
text-align: right;
padding: 50px;
max-width: 1280px
}

#gamemodes .img {
margin: 15px;
padding: 50px;
max-width: 1280px
@media screen and (min-width: 800px) {
#gamemodes .img {
margin: 15px;
padding: 50px;
max-width: 1280px
}
}

@media screen and (max-width: 799px) {
#gamemodes .img {
padding: 50px 0px 50px 0px;
}
}

#gamemodes .fixed-width {
@@ -380,4 +425,26 @@ footer {
padding: 0;
text-align: center;
transition: all .2s ease-in;
}

@media screen and (min-width: 800px) {
.res-img {
width: 480px;
}
}

@media screen and (max-width: 799px) {
.res-img {
width: 100%; }
}

@media screen and (min-width: 800px) {
.res-img-sm {
height: 110px;
}
}

@media screen and (max-width: 799px) {
.res-img-sm {
width: 100%; }
}
Loading