diff --git a/less/icons.less b/less/icons.less
index 2be5064..f90cfea 100644
--- a/less/icons.less
+++ b/less/icons.less
@@ -1,38 +1,28 @@
@font-face {
- font-family: 'Material Icons';
+ font-family: 'Material Symbols Outlined';
font-style: normal;
font-weight: 400;
- src: url(MaterialIcons-Regular.eot); /* For IE6-8 */
- src: local('Material Icons'),
- local('MaterialIcons-Regular'),
- url(/fonts/MaterialIcons-Regular.woff2) format('woff2'),
- url(/fonts/MaterialIcons-Regular.woff) format('woff'),
- url(/fonts/MaterialIcons-Regular.ttf) format('truetype');
+ src: url(/fonts/MaterialSymbolsOutlined.woff2) format('woff2');
}
-.material-icons {
- font-family: 'Material Icons';
+.material-symbols-outlined {
+ font-family: 'Material Symbols Outlined';
font-weight: normal;
font-style: normal;
- font-size: 24px; /* Preferred icon size */
- display: inline-block;
- width: 1em;
- height: 1em;
+ font-size: 24px;
line-height: 1;
- text-transform: none;
letter-spacing: normal;
- word-wrap: normal;
+ text-transform: none;
+ display: inline-block;
white-space: nowrap;
+ word-wrap: normal;
direction: ltr;
+ overflow: hidden;
/* Support for all WebKit browsers. */
-webkit-font-smoothing: antialiased;
- /* Support for Safari and Chrome. */
- text-rendering: optimizeLegibility;
-
- /* Support for Firefox. */
- -moz-osx-font-smoothing: grayscale;
/* Support for IE. */
+ -webkit-font-feature-settings: 'liga';
font-feature-settings: 'liga';
}
diff --git a/less/lib/material.less b/less/lib/material.less
index 2442d39..6d878ef 100644
--- a/less/lib/material.less
+++ b/less/lib/material.less
@@ -1,19 +1,19 @@
/* Rules for sizing the icon. */
-.material-icons {
+.material-symbols-outlined {
&.md-18 { font-size: 18px; }
&.md-24 { font-size: 24px; }
&.md-36 { font-size: 36px; }
&.md-48 { font-size: 48px; }
/* Rules for using icons as black on a light background. */
&.md-dark {
- color: rgba(0, 0, 0, 0.54);
+ color: rgba(0, 0, 0, 0.54);
&.md-inactive { color: rgba(0, 0, 0, 0.26); }
}
/* Rules for using icons as white on a dark background. */
&.md-light {
color: rgba(255, 255, 255, 1);
&.md-inactive { color: rgba(255, 255, 255, 0.3); }
}
}
diff --git a/less/pad.less b/less/pad.less
index 486e2ea..e0b887a 100644
--- a/less/pad.less
+++ b/less/pad.less
@@ -1,526 +1,527 @@
.dropdown-nav {
font-family: @sansFont;
line-height: 2em;
span {
margin: 0;
}
- .material-icons {
+ .material-symbols-outlined {
+ font-size: 18px;
vertical-align: sub;
}
>ul>li {
line-height: 1.8;
bottom: -0.35em;
}
ul {
display: inline;
list-style:none;
position:relative;
margin:0;
padding:0;
ul {
display:none;
position:absolute;
top:100%;
left:0;
background:#fff;
padding:0;
max-height: 30em;
overflow-y: auto;
overflow-x: hidden;
border: 1px solid @lightNavBorder;
.rounded(.25em);
li {
line-height: 1.8;
display: block;
min-width: 9em;
max-width: 16em;
}
}
a {
display: block;
color:#333;
text-decoration:none;
padding: 0 0.5em;
margin: 0;
overflow: hidden;
white-space: -moz-nowrap; /* Mozilla, since 1999 */
white-space: -nowrap; /* Opera 4-6 */
white-space: -o-nowrap; /* Opera 7 */
white-space: nowrap;
&:hover {
text-decoration: none;
}
}
li {
display: inline-block;
position: relative;
margin: 0;
padding: 0;
&:hover {
background: @lightNavHoverBG;
}
&:hover > ul, &.open > ul {
display: block;
}
&.selected {
a, a:hover {
color: #888;
}
}
&.current-user, &.menu-heading {
font-weight: bold;
padding: 0 .5em;
color: #000;
&:hover {
background-color: transparent !important;
}
}
&.menu-heading {
color: #666;
font-weight: normal;
font-size: 0.8em;
padding: 0.2em 0.8em;
cursor: default;
text-align: left;
}
hr {
margin: 0.5em 0.75em;
}
}
}
}
nav#manage {
.dropdown-nav;
ul ul li {
min-width: 11em;
img.ic-18dp {
margin-top: -2px;
}
}
}
img.ic-18dp {
width: 18px;
height: 18px;
vertical-align: middle;
}
img.ic-24dp {
width: 24px;
height: 24px;
vertical-align: middle;
}
body#pad, body#pad-sub {
margin: 0;
padding: 0;
font-size: 100%;
font-family: Lora, serif;
header {
height: 1.6em;
}
#tools {
margin: 0 0 1em;
padding: 1em 2em;
-moz-transition-property: opacity;
-webkit-transition-property: opacity;
-o-transition-property: opacity;
transition-property: opacity;
.transition-duration(0.4s);
&:hover {
.opacity(1);
.hidden {
.opacity(1);
}
}
.hidden {
&#wc {
position: relative;
top: -0.15em;
font-size: 0.9em;
margin-left: 0.75em;
}
}
h1 {
display: inline-block;
font-family: Lora, serif;
margin: 0;
font-size: 1.5em;
a {
color: white;
}
}
nav {
.dropdown-nav;
}
#clip {
display: inline-block;
margin-top: -0.35em;
}
#belt {
float: right;
a {
padding: 1em 1.2em;
vertical-align: middle;
.opacity(.75);
.transition-duration(0.2s);
-moz-transition-property: opacity;
-webkit-transition-property: opacity;
-o-transition-property: opacity;
transition-property: opacity;
&:hover {
.opacity(1);
}
&.disabled, &.disabled:hover {
.opacity(.3);
}
img.ic-24dp {
vertical-align: bottom;
}
- .material-icons {
+ .material-symbols-outlined {
vertical-align: middle;
max-width: 24px;
overflow: hidden;
display: inline-block;
}
- .material-icons, img.ic-24dp {
+ .material-symbols-outlined, img.ic-24dp {
&+ span {
margin-left: .4em;
height: 24px;
vertical-align: bottom;
}
}
}
.tool:last-child a {
padding-right: 0;
}
}
.tool {
display: inline-block;
margin: 0;
&#status {
&.doing {
font-style: italic;
}
}
button {
font-family: @sansFont;
background-color: transparent;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
border: 0;
}
}
}
}
body#pad-sub {
.content-container {
p {
a:hover {
text-decoration: underline;
}
&.status {
text-align: center;
font-size: 1.1em;
&:first-child {
margin-top: 1.5em;
}
}
}
}
}
body#pad {
textarea,
textarea:focus {
border: 0;
outline: 0;
}
textarea, #title {
position: fixed !important;
top: 3em;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: auto;
height: calc(~"100% - 3em - 1px");
padding: 1em 2em 2em;
font-size: 1.2em;
letter-spacing: 0.6px;
box-sizing: border-box;
resize: none;
&.classy {
font-family: Lora, serif;
letter-spacing: 0.7px;
}
&.mono, &.code {
padding-left: 1em;
padding-right: 1em;
white-space: -moz-pre; /* Mozilla, since 1999 */
white-space: -pre; /* Opera 4-6 */
white-space: -o-pre; /* Opera 7 */
white-space: pre;
word-wrap: normal;
}
&.norm, &.sans, &.wrap {
line-height: 1.4;
}
}
#tools {
position: fixed;
top: 0;
left: 0;
right: 0;
margin: 0;
.opacity(.2);
.mode-wp {
font-family: serif;
}
.mode-typewriter {
font-family: "Courier New", monospace;
font-size: 1em;
}
}
}
.modal {
display: none;
position: absolute;
z-index: 11;
top: 3em;
left: 50%;
width: 30em;
margin-left: -15em;
padding: 1.5em 2em;
.rounded(.25em);
background: @lightNavBG;
border: 1px solid @lightNavBorder;
h2 {
margin-top: 0;
}
input[type=text], input[type=email], input[type=password] {
background: transparent;
border: 0;
border-bottom: 1px solid #ccc;
-moz-transition-property: opacity;
-webkit-transition-property: opacity;
-o-transition-property: opacity;
transition-property: opacity;
.transition-duration(0.2s);
.opacity(1);
&:disabled {
.opacity(.4);
}
}
.body {
line-height: 1.5;
input[type=text].confirm {
width: 100%;
box-sizing: border-box;
}
}
.short {
text-align: center;
}
.form-hint {
font-size: 0.78em;
color: #888;
}
}
#overlay {
display: none;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: rgba(0, 0, 0, 0.4);
z-index: 10;
}
body#pad .alert {
position: fixed;
bottom: 0.25em;
left: 2em;
right: 2em;
font-size: 1.1em;
&#edited-elsewhere {
&.hidden {
display: none;
}
a {
font-weight: bold;
}
}
}
@media all and (max-height: 500px) {
body#pad {
textarea {
top: 2.25em;
padding-top: 0.25em;
}
&.classic {
#editor {
top: 5.25em;
}
#title {
top: 3.5rem;
}
}
#tools {
padding-top: 0.5em;
padding-bottom: 0.5em;
}
}
}
@media all and (min-width: 360px) {
body#pad #tools .if-room.room-1, body#pad-sub #tools .tool.if-room.room-1, .if-room.room-1 {
display: inline-block;
}
}
@media all and (min-width: 425px) {
body#pad #tools .if-room.room-2, body#pad-sub #tools .tool.if-room.room-2, .if-room.room-2 {
display: inline-block;
}
}
@media all and (min-width: 510px) {
body#pad #tools .if-room.room-3, body#pad-sub #tools .tool.if-room.room-3, .if-room.room-3 {
display: inline-block;
}
}
@media all and (max-width: 650px) {
body#pad #tools .tool.if-room, body#pad-sub #tools .tool.if-room, .if-room {
display: none;
}
}
@media all and (max-width: 600px) {
.modal {
margin-left: 0;
width: auto;
left: 0;
right: 0;
}
#user-nav .tabs {
display: block;
text-align: center;
margin: 0.5em 0 -2em;
a:first-child {
margin-left: 0;
}
}
#target-name {
max-width: 98px;
display: inline-block;
}
}
@media all and (min-width: 50em) {
body#pad, body#pad.classic {
textarea, #title {
padding-left: 10%;
padding-right: 10%;
}
.alert {
left: 10%;
right: 10%;
}
}
}
@media all and (min-width: 60em) {
body#pad, body#pad.classic {
textarea, #title {
padding-left: 15%;
padding-right: 15%;
}
.alert {
left: 15%;
right: 15%;
}
}
}
@media all and (min-width: 70em) {
body#pad, body#pad.classic {
textarea, #title {
padding-left: 20%;
padding-right: 20%;
}
.alert {
left: 20%;
right: 20%;
}
}
}
@media all and (min-width: 85em) {
body#pad, body#pad.classic {
textarea, #title {
padding-left: 25%;
padding-right: 25%;
}
.alert {
left: 25%;
right: 25%;
}
}
}
@media all and (min-width: 105em) {
body#pad, body#pad.classic {
textarea, #title {
padding-left: 30%;
padding-right: 30%;
}
.alert {
left: 30%;
right: 30%;
}
}
}
@media (pointer: coarse) {
body#pad, body#pad-sub {
#tools {
.opacity(.8);
.hidden {
.opacity(.8);
}
}
}
}
diff --git a/static/fonts/MaterialIcons-Regular.eot b/static/fonts/MaterialIcons-Regular.eot
deleted file mode 100644
index 70508eb..0000000
Binary files a/static/fonts/MaterialIcons-Regular.eot and /dev/null differ
diff --git a/static/fonts/MaterialIcons-Regular.svg b/static/fonts/MaterialIcons-Regular.svg
deleted file mode 100644
index a449327..0000000
--- a/static/fonts/MaterialIcons-Regular.svg
+++ /dev/null
@@ -1,2373 +0,0 @@
-
-
-
-
diff --git a/static/fonts/MaterialIcons-Regular.ttf b/static/fonts/MaterialIcons-Regular.ttf
deleted file mode 100644
index 7015564..0000000
Binary files a/static/fonts/MaterialIcons-Regular.ttf and /dev/null differ
diff --git a/static/fonts/MaterialIcons-Regular.woff b/static/fonts/MaterialIcons-Regular.woff
deleted file mode 100644
index a0bfd17..0000000
Binary files a/static/fonts/MaterialIcons-Regular.woff and /dev/null differ
diff --git a/static/fonts/MaterialIcons-Regular.woff2 b/static/fonts/MaterialIcons-Regular.woff2
deleted file mode 100644
index 20f1f67..0000000
Binary files a/static/fonts/MaterialIcons-Regular.woff2 and /dev/null differ
diff --git a/static/fonts/MaterialSymbolsOutlined.woff2 b/static/fonts/MaterialSymbolsOutlined.woff2
new file mode 100644
index 0000000..54193ee
Binary files /dev/null and b/static/fonts/MaterialSymbolsOutlined.woff2 differ
diff --git a/templates/classic.tmpl b/templates/classic.tmpl
index 0c411b4..a5fc243 100644
--- a/templates/classic.tmpl
+++ b/templates/classic.tmpl
@@ -1,408 +1,408 @@
{{define "pad"}}
{{if .Editing}}Editing {{if .Post.Title}}{{.Post.Title}}{{else}}{{.Post.Id}}{{end}}{{else}}New Post{{end}} — {{.SiteName}}
{{if .CustomCSS}}{{end}}
{{end}}
diff --git a/templates/pad.tmpl b/templates/pad.tmpl
index 2580dce..ff08e99 100644
--- a/templates/pad.tmpl
+++ b/templates/pad.tmpl
@@ -1,421 +1,421 @@
{{define "pad"}}
{{if .Editing}}Editing {{if .Post.Title}}{{.Post.Title}}{{else}}{{.Post.Id}}{{end}}{{else}}New Post{{end}} — {{.SiteName}}
{{if .CustomCSS}}{{end}}
{{end}}
