diff --git a/app/javascript/images/icon_bookmarks.png b/app/javascript/images/icon_bookmarks.png new file mode 100644 index 000000000..b0cff1344 Binary files /dev/null and b/app/javascript/images/icon_bookmarks.png differ diff --git a/app/javascript/images/icon_developers.png b/app/javascript/images/icon_developers.png new file mode 100644 index 000000000..c6d2e1829 Binary files /dev/null and b/app/javascript/images/icon_developers.png differ diff --git a/app/javascript/images/icon_mobile_apps.png b/app/javascript/images/icon_mobile_apps.png new file mode 100644 index 000000000..a7cbd78c1 Binary files /dev/null and b/app/javascript/images/icon_mobile_apps.png differ diff --git a/app/javascript/images/icon_profile_directory.png b/app/javascript/images/icon_profile_directory.png new file mode 100644 index 000000000..05a94213a Binary files /dev/null and b/app/javascript/images/icon_profile_directory.png differ diff --git a/app/javascript/images/icon_security.png b/app/javascript/images/icon_security.png new file mode 100644 index 000000000..ccdbfaf78 Binary files /dev/null and b/app/javascript/images/icon_security.png differ diff --git a/app/javascript/styles/win95.scss b/app/javascript/styles/win95.scss index 27bb065e8..5dbe1db74 100644 --- a/app/javascript/styles/win95.scss +++ b/app/javascript/styles/win95.scss @@ -480,14 +480,13 @@ body.admin { button { background: transparent; color: black; - padding: 4px 0; + padding: 8px 0; align-self: end; @include win95-tab(); &.active { color: black; top: 2px; - padding:8px 0; background-color: $win95-bg; &::before, &::after { @@ -1425,9 +1424,13 @@ body.admin { background-image: url("../images/icon_mutes.png"); &:hover { background-image: url("../images/icon_mutes.png"); } } -.column-link[href="/settings/preferences"] { - background-image: url("../images/icon_settings.png"); - &:hover { background-image: url("../images/icon_settings.png"); } +.column-link[href="/web/directory"] { + background-image: url("../images/icon_profile_directory.png"); + &:hover { background-image: url("../images/icon_profile_directory.png"); } +} +.column-link[href="/web/bookmarks"] { + background-image: url("../images/icon_bookmarks.png"); + &:hover { background-image: url("../images/icon_bookmarks.png"); } } .getting-started__footer ul li a[href="/web/keyboard-shortcuts"] { @@ -1454,6 +1457,18 @@ body.admin { background-image: url("../images/icon_logout.png"); &:hover { background-image: url("../images/icon_logout.png"); } } +.getting-started__footer ul li a[href="https://joinmastodon.org/apps"] { + background-image: url("../images/icon_mobile_apps.png"); + &:hover { background-image: url("../images/icon_mobile_apps.png"); } +} +.getting-started__footer ul li a[href="/settings/applications"] { + background-image: url("../images/icon_developers.png"); + &:hover { background-image: url("../images/icon_developers.png"); } +} +.getting-started__footer ul li a[href="/auth/edit"] { + background-image: url("../images/icon_settings.png"); + &:hover { background-image: url("../images/icon_settings.png"); } +} .column .static-content.getting-started { display:none; @@ -2470,6 +2485,9 @@ body { .card-grid { margin-left: 10px; } + .status { + padding: 15px 15px 55px 78px; + } } @media screen and (max-width: 1255px) { @@ -2536,3 +2554,34 @@ body { .layout-single-column .status__wrapper .status { padding-bottom: 50px; } + +::-webkit-scrollbar { + width: 14px; +} + +::-webkit-scrollbar-track { + background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAAAAABX3VL4AAAADklEQVQIW2P4f4DhwH8ACoADf0PlskQAAAAASUVORK5CYII='); + + &:hover { + background: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAIAAAACCAAAAABX3VL4AAAADklEQVQIW2P4f4DhwH8ACoADf0PlskQAAAAASUVORK5CYII='); + } +} + +::-webkit-scrollbar-thumb { + background: #bfbfbf; + border-color: #efefef #404040 #404040 #efefef; + border-style: solid; + border-width: 2px; + + &:hover { + background: #bfbfbf; + border-color: #efefef #404040 #404040 #efefef; + border-style: solid; + border-width: 2px; + } + + &:active { + background: #bfbfbf; + border-color: #404040 #efefef #efefef #404040; + } +}