Skip to content

Instantly share code, notes, and snippets.

@Olanetsoft
Created April 9, 2022 22:39
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Olanetsoft/c3a7da55bd7721c72c2718726e1008ad to your computer and use it in GitHub Desktop.
Save Olanetsoft/c3a7da55bd7721c72c2718726e1008ad to your computer and use it in GitHub Desktop.
.App {
font-family: sans-serif;
text-align: center;
}
@import url("https://fonts.googleapis.com/css?family=Acme|Lobster");
/* This allow me to have the full width of the page without the initial padding/margin*/
body,
html {
margin: 0;
padding: 0;
height: 100%;
width: 100%;
font-family: Acme;
min-width: 700px;
}
.splitdiv {
height: 100%;
width: 50%;
}
/* This part contains all of the left side of the screen */
/* ----------------------------------------- */
#leftdiv {
float: left;
background-color: #fafafa;
height: 932px;
}
#leftdivcard {
margin: 0 auto;
width: 80%;
background-color: white;
margin-top: 35vh;
transform: translateY(-50%);
box-shadow: 10px 10px 1px 0px rgba(78, 205, 196, 0.2);
border-radius: 10px;
}
#leftbutton {
background-color: #512cf3;
border-radius: 5px;
color: #fafafa;
}
.cropper {
width: 660px;
height: 400px;
}
/* ----------------------------------------- */
/* This part contains all of the left side of the screen */
/* ----------------------------------------- */
#rightdiv {
float: right;
background-color: #eff0f0;
height: 960px;
}
#itemdivcard {
margin: 0 auto;
margin-top: 5px;
}
#imgPreview {
width: "100%";
height: "300px";
}
/* ----------------------------------------- */
/* Basic styling */
/* ----------------------------------------- */
h1 {
font-family: Lobster;
color: #512cf3;
text-align: center;
font-size: 35px;
}
h2 {
font-family: Lobster;
color: #512cf3;
text-align: center;
font-size: 40px;
}
/* ----------------------------------------- */
select {
margin: 20px;
width: 150px;
padding: 5px 35px 5px 5px;
font-size: 16px;
border: 1px solid #ccc;
height: 34px;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
}
/* CAUTION: Internet Explorer hackery ahead */
select::-ms-expand {
display: none; /* Remove default arrow in Internet Explorer 10 and 11 */
}
/* Target Internet Explorer 9 to undo the custom arrow */
@media screen and (min-width: 0\0) {
select {
background: none\9;
padding: 5px\9;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment