onezmoji/index.css
2024-08-03 00:32:01 -04:00

119 lines
No EOL
1.9 KiB
CSS

svg.char {
max-width: 100px;
width: 100px;
height: initial;
margin: 10px;
border: solid rgb(85, 153, 255) 2px;
border-left-width: 10px;
border-radius: 10px;
z-index: 10;
}
section.main {
max-width: 90vw;
width: 800px;
margin-left: auto;
margin-right: auto;
background: rgb(255, 255, 255);
border: solid rgb(200, 200, 200) 2px;
border-radius: 10px;
}
body {
background-image: radial-gradient(rgb(222, 223, 228) 35%, rgb(255, 255, 255) 40%);
background-size: 25px 25px;
background-repeat: repeat;
}
:root {
font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
color: rgb(44, 41, 53);
}
h1,
h2,
h3,
h4,
h5,
h6 {
text-align: center;
margin: 10px;
margin-bottom: 0;
height: 40px;
line-height: 40px;
}
code {
background: rgb(118, 105, 156);
color: white;
padding: 3px;
}
p,
pre,
sup {
margin: 10px;
}
pre {
overflow: auto;
}
blockquote {
border: solid rgb(255, 196, 237) 2px;
border-left-width: 10px;
border-radius: 10px;
margin: 10px;
padding: 5px;
font-style: italic;
}
a {
color: rgb(96, 95, 182);
font-weight: bold;
text-decoration: none;
}
ul.grid {
padding: 0;
margin: 10px;
display: grid;
grid-template-columns: 1fr 1fr 1fr 1fr;
}
ul.grid>a,
ul.grid>span {
text-align: center;
height: 100%;
overflow: hidden;
margin-bottom: 25px;
}
img {
width: min(100px, 18vw);
height: min(100px, 18vw);
}
iframe {
border: none;
margin: auto;
display: block;
width: 300px;
height: 300px
}
svg.char.selected_true {
border-color: rgb(226, 152, 255);
}
input {
display: block;
margin: 10px;
}
.inputs {
display: flex;
justify-content: center;
align-items: center;
flex-wrap: wrap;
}