janishutz-website/old-website
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

complete restructuring

Browse Source
This commit is contained in:
Janis Hutz
2023-07-13 15:05:24 +02:00
parent 686f3ce740
commit ad14c03206
492 changed files with 0 additions and 66301 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
css/altstyle.css Executable file
View File

@@ -0,0 +1,31 @@
html, body {
height: 100%;
width: 100%;
padding: 0;
margin: 0;
background-color: gray;
color: white;
}
.logo img {
width: 10%
}
div {
margin-right: 10%;
margin-left: 10%;
margin-top: 2%;
margin-bottom: 2%;
padding: 10%;
padding-top: 5%;
padding-bottom: 5%;
border-color: black;
border-style: double;
border-radius: 3%;
background-color:dimgray;
}
h1 {
font-size: 300%;
}

24
css/footerstyle.css Executable file
View File

@@ -0,0 +1,24 @@
.Footer-box {
background-color: #38444d;
width: 100%;
margin-bottom: -1%;
display: flex;
justify-content: center;
}
.footer-content-box {
width: 80%;
padding: 2%;
}
.footer-center-box {
display: flex;
justify-content: center;
}
.footer-logo {
width: 10%;
display: inline-block;
position: relative;
vertical-align: middle;
}

195
css/mainstyle.css Executable file
View File

@@ -0,0 +1,195 @@
/*
*
* janishutz.com - mainstyle.css
*
*
* Created 2023 by Janis Hutz
*/
/*
Set size of html and body to full width
*/
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
font-size: calc(14pt + 0.395vw);
}
body {
background-color: rgba(70, 72, 167, 0.5);
font-family: sans-serif;
}
/*
Style for quotes
*/
.bigquote {
width: 40%;
font-size: 300%;
}
.biggerquote {
font-size: 150%;
}
/*
Styling for the main content element
*/
.mainstyle {
margin-right: 5%;
margin-left: 5%;
margin-top: 2%;
margin-bottom: 2%;
padding: 5%;
padding-top: 3%;
padding-bottom: 3%;
border-color: black;
border-style: none;
border-radius: 50px;
background-color: rgba(195, 195, 229, 1);
}
/*
Styling for links and buttons
*/
.textlink {
font-size: 100%;
text-decoration: none;
color: black;
transition: 1s;
}
.textlink:hover {
color: darkblue;
font-size: 115%;
transition: 0.3s;
}
.linkbutton {
text-decoration: none;
display: inline-block;
padding: 20px;
color: white;
background-color:rgba(0, 40, 131, 1);
border-radius: 25px;
transition: 1s;
}
.linkbutton:hover {
background-color: darkblue;
border-radius: 5px;
transition: 0.3s;
}
.references {
color: gray;
}
/*
This styles the container for the home page
*/
.title-container {
background-image: url('/assets/codeSnippet.png');
background-repeat: no-repeat;
background-size: cover;
width: 100%;
height: 40vh;
border-radius: 20px;
color: white;
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
}
.title {
text-align: center;
font-size: 2.3rem;
}
.subtitle {
text-align: center;
font-size: 1.3rem;
}
.content {
font-size: 1rem;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
margin-top: 5%;
margin-bottom: 10%;
}
.content-title {
font-size: 3rem;
text-align: center;
}
.content-title-small {
font-size: 2rem;
text-align: center;
}
.pullquote-lines {
border-color: black;
margin-bottom: 2%;
margin-top: 2%;
width: 100%;
}
/*
Bottom container styling
*/
.bottom {
display: flex;
width: 100%;
justify-content: center;
align-items: center;
flex-direction: column;
}
.element {
text-align: center;
}
@media only screen and (min-width: 999px) {
/*
Align content side by side
*/
.sidebyside {
width: 100%;
display: flex;
flex-grow: 1;
gap: 5%;
}
.element {
width: 47%;
}
.itemsInline {
display: flex;
justify-content: center;
align-items: center;
width: 100%;
gap: 5%;
margin-top: 3%;
margin-bottom: 3%;
}
.mainstyle {
margin-right: 10%;
margin-left: 10%;
padding: 10%;
padding-top: 5%;
padding-bottom: 5%;
}
}

155
css/menustyle.css Executable file
View File

@@ -0,0 +1,155 @@
/*
*
* janishutz.com - menustyle.css
*
*
* Created 2023 by Janis Hutz
*/
::selection {
background-color: darkblue;
color: white;
}
.Menu {
font-size: 0.8rem;
margin-top: -1%;
padding: 2%;
padding-left: 0;
padding-right: 0;
width: 100%;
overflow: hidden;
background-color: rgba(56, 68, 77, 1);
}
.logo {
height: 10vh;
display: inline-block;
margin-left: 2%;
position: relative;
vertical-align: middle;
}
.menu-container {
display: none;
width: 80%;
}
.active {
color: rgba(184, 214, 240, 1);
}
.listtoggle {
text-decoration: none;
color: black;
font-size: 2.5rem;
margin-right: 7%;
cursor: pointer;
}
.toggle-wrapper {
display: inline-flex;
height: 100%;
width: 70%;
align-items: center;
justify-content: flex-end;
}
.menu-container, .dropdown-menu {
list-style: none;
margin: 0 5%;
padding: 0;
}
.menubutton {
text-decoration: none;
width: 96%;
display: block;
padding: 2%;
color: white;
transition: 0.6s;
}
.menubutton:hover {
background-color: darkblue;
transition: 0.2s;
}
.sub {
width: 96%;
}
.dropdown-menu {
width: 95%;
}
@media only screen and (min-width: 999px) {
.listtoggle, .toggle-wrapper {
display: none;
}
.menu-wrapper {
display: inline-block;
}
.menu-container {
display: inline-flex;
list-style-type: none;
width: 80%;
margin: 0;
justify-content: center;
}
.menubutton {
text-decoration: none;
display: inline-block;
padding: 20px;
width: inherit;
color: white;
border-radius: 0%;
background-color: rgba(0,0,0,0);
transition: 0.6s;
}
.sub {
width: 92%;
padding: 20px 4%;
}
.menubutton:hover {
border-radius: 0%;
background-color: darkblue;
transition: 0.3s;
}
.dropdown-menu {
margin: 0;
padding: 0;
width: fit-content;
background-color: lightseagreen;
display: none;
list-style-type: none;
position: absolute;
min-width: 200px;
transform-origin: top center;
flex-direction: column;
}
@keyframes growDown {
0% {
transform: scaleY(0);
}
100% {
transform: scaleY(1);
}
}
.dropdown:hover .dropdown-menu {
display: flex;
animation: growDown 0.3s ease-in-out;
}
.mainitems {
display: inline-block;
}
}