personal-website/resources/base.css

204 lines
3.7 KiB
CSS

@font-face{
font-family: "Ubuntu-LI";
src:url("./GnuUnifontFull-Pm9P.ttf")
}
*{
font-family:"Ubuntu-LI";
}
body{
margin: 0px;
/* font: normal 14px Summer Pixel 22, "res/SummerPixel22Regular.ttf"; */
}
/* @font-face {
font-family: "EspySansRegular";
src: url("res/EspySansRegular.ttf");
font-weight: normal;
font-style: normal;
} */
#WindowsLayer {
width: 100%;
height: 100%;
position: absolute;
}
.Application{
position: absolute;
/* background-color: antiquewhite; */
stroke: #000000;
stroke-width: 1px;
stroke-linecap: butt;
stroke-dasharray: 0;
}
.Frame{
width: 100%;
min-height: 200px;
height: auto;
background-color: #CCCCCC;
border: 1px solid #000000;
box-shadow: 1px 1px 0px #000,inset -1px -1px 0px rgba(0, 0, 0, 0.27), inset 1px 1px 0px #FFFFFF;
display: flex;
flex-direction: column;
align-items: flex-start;
padding: 4px;
gap:4px;
}
.WindowFrameTopBar{
/* background-color: aqua; */
width: 100%;
height: 13px;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
gap: 5px;
padding: 0px;
}
.WindowFrameTitle{
white-space: nowrap
}
.WindowDragArea{
/* background-color: antiquewhite; */
width: 100%;
height: 100%;
/* background: repeating-linear-gradient(
to bottom,
rgb(255, 255, 255) 0px,
rgb(255, 255, 255) 1px,
#ffffff00 2px,
#ffffff00 3px
); */
/* box-shadow: 1px 1px ; */
}
.ContentFrame{
box-sizing: border-box;
/* Auto layout */
display: flex;
flex-direction: column;
align-items: center;
padding: 12px;
gap:10px;
width: 100%;
height: 100%;
background: #DDDDDD;
border: 1px solid #000000;
box-shadow: 0.5px 0.5px 0px 0.5px #FFFFFF, -0.5px -0.5px 0px 0.5px rgba(0, 0, 0, 0.25), inset 1px 1px 0px #FFFFFF;
/* Inside auto layout */
flex: none;
order: 0;
align-self: stretch;
flex-grow: 1;
}
.Personal-properties-bio{
width: 100%;
height: auto;
/* Auto layout */
display: flex;
flex-direction: row;
align-items: center;
padding: 0px;
gap:15px;
}
.Personal-properties-textbio{
/* width: 100%;
height: auto; */
/* Auto layout */
display: flex;
flex-direction: column;
align-items: left;
padding: 0px;
gap:1px;
}
.Personal-properties-prop{
width: 100%;
height: auto;
border: 1px solid #888888;
box-shadow: 1px 1px 0px #FFFFFF, inset 1px 1px 0px #FFFFFF;
/* Auto layout */
display: flex;
flex-direction: column;
align-items: center;
padding: 0px;
gap:1px;
}
.Personal-properties-prop-header{
/* width: 50px; */
position:relative;
display: inline-block;
max-width: 100%;
background-color: #DDDDDD;
left: 12px;
top: -10px;
margin-left: 2px;
/* Auto layout */
display: flex;
flex-direction: column;
align-items: center;
padding: 12px;
gap:10px;
/* padding: 10px; */
/* border: 1px solid #888888; */
/* box-shadow: 1px 1px 0px #FFFFFF, inset 2px 2px 0px #FFFFFF; */
}
.Personal-properties-prop-content{
width: 100%;
/* top: 0px; */
/* Auto layout */
display: flex;
flex-direction: column;
justify-content: center;
padding: 0px;
gap: 3px;
}
.Personal-properties-prop-row{
margin-left: 12px;
margin-right: 12px;
/* Auto layout */
display: flex;
flex-direction: row;
justify-content: center;
padding: 0px;
gap: 1px;
}
.Personal-properties-prop-key{
text-align: end;
width: 45%;
white-space: nowrap
/* font-weight: bold; */
}
.Personal-properties-prop-prop{
width: 55%;
}