Skip to content

Commit

Permalink
Adding custom URL’s and misc updates
Browse files Browse the repository at this point in the history 
* Updated JQuery version
* Fixed error messages
* Updated site URL to include no slash
* Updated footer links
* Cleaned up JS and LESS
  • Loading branch information
@Flynntes
Flynntes committed Jul 22, 2019
1 parent b3bf07a commit 44ce681
Show file tree
Hide file tree
Showing 10 changed files with 1,279 additions and 42 deletions.
864 changes: 863 additions & 1 deletion sleeky-frontend/assets/css/base.css
View file

Large diffs are not rendered by default.

62 changes: 61 additions & 1 deletion sleeky-frontend/assets/css/desktop.css
View file
Original file line number Diff line number Diff line change
@@ -1 +1,61 @@
@media (min-width:1200px){body{font-size:15px;line-height:140%}h1,h2,h3,h4,h5,h6{line-height:140%}.container{width:1140px;margin:0 auto}header{float:left;width:1111.5px;margin-left:14.25px;margin-right:14.25px;padding-left:0;padding-right:0}article{float:left;width:731.5px;margin-left:14.25px;margin-right:14.25px;padding-left:0;padding-right:0}aside{float:left;width:351.5px;margin-left:14.25px;margin-right:14.25px;padding-left:0;padding-right:0}footer{float:left;width:1111.5px;margin-left:14.25px;margin-right:14.25px;padding-left:0;padding-right:0}.main-content{float:left;width:731.5px;margin-left:204.25px;margin-right:14.25px;padding-left:0;padding-right:0}input[type=submit]{width:20%}}
@media (min-width: 1200px) {
body {
font-size: 15px;
line-height: 140%;
}
h1,
h2,
h3,
h4,
h5,
h6 {
line-height: 140%;
}
.container {
width: 1140px;
margin: 0 auto;
}
header {
float: left;
width: 1111.5px;
margin-left: 14.25px;
margin-right: 14.25px;
padding-left: 0px;
padding-right: 0px;
}
article {
float: left;
width: 731.5px;
margin-left: 14.25px;
margin-right: 14.25px;
padding-left: 0px;
padding-right: 0px;
}
aside {
float: left;
width: 351.5px;
margin-left: 14.25px;
margin-right: 14.25px;
padding-left: 0px;
padding-right: 0px;
}
footer {
float: left;
width: 1111.5px;
margin-left: 14.25px;
margin-right: 14.25px;
padding-left: 0px;
padding-right: 0px;
}
.main-content {
float: left;
width: 731.5px;
margin-left: 204.25px;
margin-right: 14.25px;
padding-left: 0px;
padding-right: 0px;
}
input[type="submit"] {
width: 20%;
}
}
119 changes: 118 additions & 1 deletion sleeky-frontend/assets/css/mobile.css
View file
Original file line number Diff line number Diff line change
@@ -1 +1,118 @@
@media (max-width:700px){body{font-size:16px;line-height:140%}h1,h2,h3,h4,h5,h6{line-height:140%}.container{width:100%;margin:0 auto}header{float:left;width:90%;margin-left:5%;margin-right:5%;padding-left:0;padding-right:0}article{float:left;width:90%;margin-left:5%;margin-right:5%;padding-left:0;padding-right:0}aside{float:left;width:90%;margin-left:5%;margin-right:5%;padding-left:0;padding-right:0}footer{float:left;width:90%;margin-left:5%;margin-right:5%;padding-left:0;padding-right:0}.main-content{float:left;width:90%;margin-left:5%;margin-right:5%;padding-left:0;padding-right:0}.logo{min-width:100%;padding-bottom:1em}.head{text-align:center}input[type=text]{width:100%;padding-right:0}input[type=submit]{width:100%;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;margin-left:0}.footer{font-size:14px}}
@media (max-width: 700px) {
body {
font-size: 16px;
line-height: 140%;
}
h1,
h2,
h3,
h4,
h5,
h6 {
line-height: 140%;
}
.container {
width: 100%;
margin: 0 auto;
}
header {
float: left;
width: 90%;
margin-left: 5%;
margin-right: 5%;
padding-left: 0%;
padding-right: 0%;
}
article {
float: left;
width: 90%;
margin-left: 5%;
margin-right: 5%;
padding-left: 0%;
padding-right: 0%;
}
aside {
float: left;
width: 90%;
margin-left: 5%;
margin-right: 5%;
padding-left: 0%;
padding-right: 0%;
}
footer {
float: left;
width: 90%;
margin-left: 5%;
margin-right: 5%;
padding-left: 0%;
padding-right: 0%;
}
.main-content {
float: left;
width: 90%;
margin-left: 5%;
margin-right: 5%;
padding-left: 0%;
padding-right: 0%;
}
.logo {
min-width: 100%;
padding-bottom: 1em;
}
.head {
text-align: center;
width: 75%;
padding: 0.5em;
}
.head p {
font-size: 0.9em;
margin-bottom: 0;
}
form {
text-align: center;
}
input.url,
input.short-url {
width: 100%;
padding-right: 0;
font-size: 0.9em;
}
input[type="submit"] {
font-size: 0.9em;
}
input[type="submit"] {
width: 100%;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
margin-left: 0;
}
.customise-container {
font-size: 0.9em;
}
.customise-container input {
font-weight: 500;
}
.footer {
font-size: 14px;
width: 100%;
}
.footer .footer-links {
display: block;
}
.footer span {
padding: 0 0.5em;
}
}
@media (max-width: 340px) {
.main-content {
margin-top: 30%;
margin-bottom: 30%;
}
input.url {
font-size: 0.8em;
}
input[type="submit"] {
font-size: 0.8em;
}
}
79 changes: 78 additions & 1 deletion sleeky-frontend/assets/css/tablet.css
View file
Original file line number Diff line number Diff line change
@@ -1 +1,78 @@
@media (min-width:701px) and (max-width:959px){body{font-size:14px;line-height:140%}h1,h2,h3,h4,h5,h6{line-height:140%}.container{width:100%;margin:0 auto}header{float:left;width:97.91666666666667%;margin-left:1.041666666666667%;margin-right:1.041666666666667%;padding-left:0;padding-right:0}article{float:left;width:64.58333333333334%;margin-left:1.041666666666667%;margin-right:1.041666666666667%;padding-left:0;padding-right:0}aside{float:left;width:31.25%;margin-left:1.041666666666667%;margin-right:1.041666666666667%;padding-left:0;padding-right:0}footer{float:left;width:97.91666666666667%;margin-left:1.041666666666667%;margin-right:1.041666666666667%;padding-left:0;padding-right:0}.main-content{float:left;width:64.58333333333334%;margin-left:17.708333333333336%;margin-right:1.041666666666667%;padding-left:0;padding-right:0}.logo{min-width:100%;float:none}input[type=text]{width:100%;padding-right:0}input[type=submit]{width:40%;-webkit-border-radius:6px;-moz-border-radius:6px;border-radius:6px;margin-left:0}}
@media (min-width: 701px) and (max-width: 959px) {
body {
font-size: 14px;
line-height: 140%;
}
h1,
h2,
h3,
h4,
h5,
h6 {
line-height: 140%;
}
.container {
width: 100%;
margin: 0 auto;
}
header {
float: left;
width: 97.91666666666667%;
margin-left: 1.041666666666667%;
margin-right: 1.041666666666667%;
padding-left: 0%;
padding-right: 0%;
}
article {
float: left;
width: 64.58333333333334%;
margin-left: 1.041666666666667%;
margin-right: 1.041666666666667%;
padding-left: 0%;
padding-right: 0%;
}
aside {
float: left;
width: 31.25%;
margin-left: 1.041666666666667%;
margin-right: 1.041666666666667%;
padding-left: 0%;
padding-right: 0%;
}
footer {
float: left;
width: 97.91666666666667%;
margin-left: 1.041666666666667%;
margin-right: 1.041666666666667%;
padding-left: 0%;
padding-right: 0%;
}
.main-content {
float: left;
width: 64.58333333333334%;
margin-left: 17.708333333333336%;
margin-right: 1.041666666666667%;
padding-left: 0%;
padding-right: 0%;
}
.logo {
min-width: 100%;
float: none;
}
input.url,
input.short-url {
width: 100%;
padding-right: 0;
}
input[type="submit"] {
width: 40%;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
margin-left: 0;
}
.customise-button {
margin-top: 7px;
display: inline-block;
}
}
72 changes: 65 additions & 7 deletions sleeky-frontend/assets/less/base.less
View file
Original file line number Diff line number Diff line change
Expand Up @@ -39,6 +39,10 @@ body {
background-color: @primaryColor; /* Fallback if no value is set in PHP */
}

h5 {
font-size: 1em;
}

.verticle-center {
min-height: 100%; /* Fallback for browsers do NOT support vh unit */
min-height: 100vh; /* These two lines are counted as one :-) */
Expand Down Expand Up @@ -91,7 +95,8 @@ body {
padding-bottom: 1em;
}

input[type="text"] {
input.url,
input.short-url {
background-color: @baseColor;
padding-right: 50px;
display: inline;
Expand All @@ -104,7 +109,7 @@ input[type="text"] {
font-family: 'Montserrat', sans-serif;
font-weight: 700;
color: #000;
text-transform: uppercase;

&:hover,:active, &:focus {
border: 1px solid @baseColor;
}
Expand All @@ -120,6 +125,54 @@ input:-moz-placeholder { .transition(color 0.2s ease-in-out); } /* FF 4-18 */
input::-moz-placeholder { .transition(color 0.2s ease-in-out); } /* FF 19+ */
input:-ms-input-placeholder { .transition(color 0.2s ease-in-out); } /* IE 10+ */

.customise-button {
font-size: 0.8em;
color: #757575;
text-transform: uppercase;
font-weight: 600;
font-family: 'Montserrat', sans-serif;
padding: 5px;
border-radius: 6px;
cursor: pointer;
transition: 0.2s all;

img {
width: 18px;
margin-top: 1px;
}

&:hover {
background: #ebebeb;
}
}

.customise-container {
margin-top: 20px;
padding-left: 5px;

span {
display: inline-block;
padding-top: 1px;
font-family: Montserrat,sans-serif;
}

input {
background-color: @baseColor;
display: inline;
vertical-align: top;
width: 50%;
border-radius: 6px;
height: 2em;
font-family: 'Montserrat', sans-serif;
font-weight: 700;
font-size: 0.8em;
color: #000;
&:hover,:active, &:focus {
border: 1px solid @baseColor;
}
}
}

input[type="submit"],
.short-url-button {
background-color: @primaryColor; /* Fallback if no value is set in PHP */
Expand Down Expand Up @@ -159,10 +212,16 @@ input[type="submit"],
font-weight: 700;
font-size: 1em;
text-align: center;
z-index: 99999;
z-index: 99999;

& span {
padding-right: 1.5em;
}

.footer-links {
display: inline;
}

a {
color: white;
.transition(color 0.1s ease-in-out);
Expand Down Expand Up @@ -217,9 +276,8 @@ input[type="submit"],
.error {
color: #F44336;
text-align: center;
}

.close {
color: white;
padding: 0.3em;
h5 {
overflow-wrap: break-word;
}
}
Loading

0 comments on commit 44ce681

Please sign in to comment.