Fixed regression of the 'Edit website' button on the welcome page. Major design tweaks to login and header bar
This commit is contained in:
Andy Dixon
+33
-59
@@ -13,7 +13,7 @@ body {
|
||||
.pageContainer .controls {
|
||||
flex: 0 1 auto;
|
||||
height: 60px;
|
||||
background-color: #666666;
|
||||
background-color: #1a1d20;
|
||||
border-bottom: 1px solid #1a1a1a;
|
||||
-webkit-box-shadow: 0 10px 13px -7px #000000, -1px -1px 15px 5px rgba(0, 0, 0, 0);
|
||||
box-shadow: 0 10px 13px -7px #000000, -1px -1px 15px 5px rgba(0, 0, 0, 0);
|
||||
@@ -26,7 +26,7 @@ body {
|
||||
|
||||
.controls .logo {
|
||||
background-image: url("/cms/img/logo.png");
|
||||
width: 128px;
|
||||
width: 60px;
|
||||
height: 60px;
|
||||
display: block;
|
||||
position: absolute;
|
||||
@@ -39,12 +39,40 @@ body {
|
||||
right: 110px;
|
||||
}
|
||||
|
||||
|
||||
/* CSS */
|
||||
.headerButton {
|
||||
/*display: flex;*/
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 6px 14px;
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Roboto', sans-serif;
|
||||
border-radius: 6px;
|
||||
border: none;
|
||||
|
||||
background: #6E6D70;
|
||||
box-shadow: 0px 0.5px 1px rgba(0, 0, 0, 0.1), inset 0px 0.5px 0.5px rgba(255, 255, 255, 0.5), 0px 0px 0px 0.5px rgba(0, 0, 0, 0.12);
|
||||
color: #DFDEDF;
|
||||
user-select: none;
|
||||
-webkit-user-select: none;
|
||||
touch-action: manipulation;
|
||||
}
|
||||
|
||||
.headerButton:focus {
|
||||
box-shadow: inset 0px 0.8px 0px -0.25px rgba(255, 255, 255, 0.2), 0px 0.5px 1px rgba(0, 0, 0, 0.1), 0px 0px 0px 3.5px rgba(58, 108, 217, 0.5);
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.headerButton.dangerButton {
|
||||
background-color: #6E4D50;
|
||||
}
|
||||
|
||||
.controls #urlbox {
|
||||
margin: 15px 150px;
|
||||
margin: 15px 70px;
|
||||
text-align: center;
|
||||
font-size: 1.5em;
|
||||
color: black;
|
||||
position: absolute;
|
||||
color: #dee2e6;
|
||||
}
|
||||
|
||||
.controls #urlbox div {
|
||||
@@ -56,6 +84,7 @@ body {
|
||||
position: absolute;
|
||||
top: 20px;
|
||||
right: 10px;
|
||||
color: #dee2e6;
|
||||
}
|
||||
|
||||
.controls .buttonContainer ul {
|
||||
@@ -69,61 +98,6 @@ body {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.blueButton {
|
||||
box-shadow: inset 0 0 15px 3px #23395e;
|
||||
background: #2e466e linear-gradient(to bottom, #2e466e 5%, #415989 100%);
|
||||
border-radius: 17px;
|
||||
border: 1px solid #1f2f47;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
color: #ffffff !important;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 15px;
|
||||
padding: 6px 13px;
|
||||
text-decoration: none !important;
|
||||
text-shadow: 0 1px 0 #263666;
|
||||
}
|
||||
|
||||
.blueButton:hover {
|
||||
background: #415989 linear-gradient(to bottom, #415989 5%, #2e466e 100%);
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.blueButton:active {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.greenButton {
|
||||
box-shadow: inset 0 0 15px 3px #3e7327;
|
||||
background: #77b55a linear-gradient(to bottom, #77b55a 5%, #72b352 100%);
|
||||
border-radius: 17px;
|
||||
border: 1px solid #4b8f29;
|
||||
display: inline-block;
|
||||
cursor: pointer;
|
||||
color: #ffffff;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
font-size: 15px;
|
||||
padding: 6px 13px;
|
||||
text-decoration: none;
|
||||
text-shadow: 0 1px 0 #5b8a3c;
|
||||
}
|
||||
|
||||
.greenButton:hover {
|
||||
background: #72b352 linear-gradient(to bottom, #72b352 5%, #77b55a 100%);
|
||||
color: #ffffff;
|
||||
text-decoration: none;
|
||||
|
||||
}
|
||||
|
||||
.greenButton:active {
|
||||
position: relative;
|
||||
top: 1px;
|
||||
text-decoration: none;
|
||||
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
New Page Modal
|
||||
*/
|
||||
|
||||
@@ -0,0 +1,73 @@
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
background-color: #111519;
|
||||
}
|
||||
|
||||
.login-container {
|
||||
width: 350px;
|
||||
margin: 100px auto;
|
||||
padding: 40px;
|
||||
background-color: #212529;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgb(0, 0, 0);
|
||||
}
|
||||
|
||||
.login-container h2 {
|
||||
text-align: center;
|
||||
margin-bottom: 30px;
|
||||
color: #dee2e6;
|
||||
}
|
||||
|
||||
.login-container label {
|
||||
display: block;
|
||||
margin-bottom: 8px;
|
||||
color: #dee2e6;
|
||||
}
|
||||
|
||||
.login-container input[type="text"],
|
||||
.login-container input[type="password"] {
|
||||
width: 100%;
|
||||
padding: 12px;
|
||||
margin-bottom: 20px;
|
||||
border: 1px solid #1a1a1a;
|
||||
border-radius: 4px;
|
||||
box-sizing: border-box;
|
||||
background: #2b3035;
|
||||
color: #dee2e6;
|
||||
}
|
||||
|
||||
.login-container button {
|
||||
width: 100%;
|
||||
padding: 12px;
|
||||
background-color: #0066cc;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
color: #ffffff;
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.login-container button:hover {
|
||||
background-color: #005bb5;
|
||||
}
|
||||
|
||||
.error-message {
|
||||
color: #ff4d4d;
|
||||
margin-bottom: 20px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.logo {
|
||||
display: block;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.shamelessPlug {
|
||||
margin: 12px 0 -30px 0;
|
||||
padding: 0;
|
||||
display: block;
|
||||
text-align: center;
|
||||
color: #111519;
|
||||
font-size: 0.8em;
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user