diff --git a/internal/web/index.go b/internal/web/index.go index 94b68690c..02ce30138 100644 --- a/internal/web/index.go +++ b/internal/web/index.go @@ -60,7 +60,14 @@ func (m *Module) indexHandler(c *gin.Context) { Instance: instance, OGMeta: apiutil.OGBase(instance), Stylesheets: []string{cssAbout, cssIndex}, - Extra: map[string]any{"showStrap": true, "showLoginButton": true}, + Extra: map[string]any{ + // Render "home to x + // users [etc]" strap. + "showStrap": true, + // Show "log in" button + // in top-right corner. + "showLoginButton": true, + }, } apiutil.TemplateWebPage(c, page) diff --git a/internal/web/login.go b/internal/web/login-info.go similarity index 94% rename from internal/web/login.go rename to internal/web/login-info.go index 6154d009a..bd52f72ef 100644 --- a/internal/web/login.go +++ b/internal/web/login-info.go @@ -50,13 +50,10 @@ func (m *Module) loginGETHandler(c *gin.Context) { } page := apiutil.WebPage{ - Template: "login.tmpl", + Template: "login_info.tmpl", Instance: instance, OGMeta: apiutil.OGBase(instance), - Stylesheets: []string{cssLogin}, - Extra: map[string]any{ - "showStrap": false, - }, + Stylesheets: []string{cssAbout, cssLoginInfo}, } apiutil.TemplateWebPage(c, page) diff --git a/internal/web/web.go b/internal/web/web.go index ecc07a8e1..ddf7d53ea 100644 --- a/internal/web/web.go +++ b/internal/web/web.go @@ -59,15 +59,15 @@ eTagHeader = "ETag" // https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/ETag lastModifiedHeader = "Last-Modified" // https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Last-Modified - cssFA = assetsPathPrefix + "/Fork-Awesome/css/fork-awesome.min.css" - cssAbout = distPathPrefix + "/about.css" - cssIndex = distPathPrefix + "/index.css" - cssLogin = distPathPrefix + "/login.css" - cssStatus = distPathPrefix + "/status.css" - cssThread = distPathPrefix + "/thread.css" - cssProfile = distPathPrefix + "/profile.css" - cssSettings = distPathPrefix + "/settings-style.css" - cssTag = distPathPrefix + "/tag.css" + cssFA = assetsPathPrefix + "/Fork-Awesome/css/fork-awesome.min.css" + cssAbout = distPathPrefix + "/about.css" + cssIndex = distPathPrefix + "/index.css" + cssLoginInfo = distPathPrefix + "/login-info.css" + cssStatus = distPathPrefix + "/status.css" + cssThread = distPathPrefix + "/thread.css" + cssProfile = distPathPrefix + "/profile.css" + cssSettings = distPathPrefix + "/settings-style.css" + cssTag = distPathPrefix + "/tag.css" jsFrontend = distPathPrefix + "/frontend.js" // Progressive enhancement frontend JS. jsSettings = distPathPrefix + "/settings.js" // Settings panel React application. diff --git a/web/assets/ellipsis.svg b/web/assets/ellipsis.svg new file mode 100644 index 000000000..e1b114020 --- /dev/null +++ b/web/assets/ellipsis.svg @@ -0,0 +1,5 @@ + + + + + diff --git a/web/source/css/index.css b/web/source/css/index.css index 382cd68c6..9f8e662d4 100644 --- a/web/source/css/index.css +++ b/web/source/css/index.css @@ -75,53 +75,3 @@ max-width: 100%; } } - -.apps { - align-self: start; - - .applist { - margin: 0; - padding: 0; - - display: grid; - grid-template-columns: 1fr 1fr; - grid-gap: 0.5rem; - align-content: start; - - .applist-entry { - display: grid; - grid-template-columns: 25% 1fr; - grid-template-areas: "logo text"; - gap: 1.5rem; - padding: 0.5rem; - - .applist-logo { - grid-area: logo; - align-self: center; - justify-self: center; - width: 100%; - object-fit: contain; - flex: 1 1 auto; - } - - .applist-logo.redraw { - fill: $fg; - stroke: $fg; - } - - .applist-text { - grid-area: text; - - a { - font-weight: bold; - } - } - } - } -} - -@media screen and (max-width: 600px) { - .apps .applist { - grid-template-columns: 1fr; - } -} diff --git a/web/source/css/login.css b/web/source/css/login-info.css similarity index 52% rename from web/source/css/login.css rename to web/source/css/login-info.css index f2adc4890..6605b46be 100644 --- a/web/source/css/login.css +++ b/web/source/css/login-info.css @@ -17,36 +17,11 @@ along with this program. If not, see . */ -.about-section.settings { - display: flex; - flex-direction: row; - gap: 1rem; - align-items: center; - justify-content: center; - - padding-top: 1rem !important; - padding-bottom: 1rem !important; - - p.settings-text { - margin-top: auto; - margin-bottom: auto; - flex: auto; - } - - .settings-button { - flex: auto; - } - -} - /* Reuse about styling, but rework it to separate sections a bit more. */ .about { - display: flex; - flex-direction: column; - gap: 2rem; padding: 0; background: initial; @@ -65,55 +40,75 @@ margin-top: 0px; } } -} -.apps { - align-self: start; + & > .about-section.settings { + display: flex; + flex-direction: row; + gap: 1rem; + align-items: center; + justify-content: center; + + padding-top: 1rem; + padding-bottom: 1rem; + + p.settings-text { + margin-top: auto; + margin-bottom: auto; + flex: auto; + } + + .settings-button { + flex: auto; + } + } - .applist { - margin: 0; - padding: 0; - - display: grid; - grid-template-columns: 1fr 1fr; - grid-gap: 0.5rem; - align-content: start; - - .applist-entry { + & > .about-section.apps { + align-self: start; + + .applist { + margin: 0; + padding: 0; + display: grid; - grid-template-columns: 25% 1fr; - grid-template-areas: "logo text"; - gap: 1.5rem; - padding: 0.5rem; - - .applist-logo { - grid-area: logo; - align-self: center; - justify-self: center; - width: 100%; - object-fit: contain; - flex: 1 1 auto; - } - - .applist-logo.redraw { - fill: $fg; - stroke: $fg; - } - - .applist-text { - grid-area: text; - - a { - font-weight: bold; + grid-template-columns: 1fr 1fr; + grid-gap: 0.5rem; + align-content: start; + + .applist-entry { + display: grid; + grid-template-columns: 25% 1fr; + grid-template-areas: "logo text"; + gap: 1.5rem; + padding: 0.5rem; + + .applist-logo { + grid-area: logo; + align-self: center; + justify-self: center; + width: 100%; + object-fit: contain; + flex: 1 1 auto; } + + .applist-logo.redraw { + fill: $fg; + stroke: $fg; + } + + .applist-text { + grid-area: text; + + a { + font-weight: bold; + } + } + } + } + + @media screen and (max-width: 600px) { + .applist { + grid-template-columns: 1fr; } } } } - -@media screen and (max-width: 600px) { - .apps .applist { - grid-template-columns: 1fr; - } -} - diff --git a/web/template/index.tmpl b/web/template/index.tmpl index 358bc081e..0adba1741 100644 --- a/web/template/index.tmpl +++ b/web/template/index.tmpl @@ -36,6 +36,5 @@ {{- include "index_what_is_this.tmpl" . | indent 1 }} {{- include "index_register.tmpl" . | indent 1 }} - {{- include "index_apps.tmpl" . | indent 1 }} {{- end }} \ No newline at end of file diff --git a/web/template/index_apps.tmpl b/web/template/index_apps.tmpl deleted file mode 100644 index 480a12f0b..000000000 --- a/web/template/index_apps.tmpl +++ /dev/null @@ -1,118 +0,0 @@ -{{- /* -// GoToSocial -// Copyright (C) GoToSocial Authors admin@gotosocial.org -// SPDX-License-Identifier: AGPL-3.0-or-later -// -// This program is free software: you can redistribute it and/or modify -// it under the terms of the GNU Affero General Public License as published by -// the Free Software Foundation, either version 3 of the License, or -// (at your option) any later version. -// -// This program is distributed in the hope that it will be useful, -// but WITHOUT ANY WARRANTY; without even the implied warranty of -// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the -// GNU Affero General Public License for more details. -// -// You should have received a copy of the GNU Affero General Public License -// along with this program. If not, see . -*/ -}} - -{{- with . }} -
-

Client applications

-
-

- Have an account on this instance and want to log in? - GoToSocial does not provide its own webclient, but implements the Mastodon client API. - You can use a variety of clients to log in to your account here: -

-
    -
  • -
    -

    Pinafore is a web client designed for speed and simplicity.

    - - Use Pinafore - -
    - -
    • -
  • -
    -

    Tusky is a lightweight mobile client for Android.

    - - Get Tusky - -
    - -
    • -
  • -
    -

    Feditext (beta) is a beautiful client for iOS, iPadOS and macOS.

    - - Get Feditext - -
    - -
    • -
  • -
    -

    Or try one of the Mastodon clients listed on the official Mastodon page.

    - - Get Mastodon apps - -
    - -
    • -
-
-
-{{- end }} diff --git a/web/template/login.tmpl b/web/template/login.tmpl deleted file mode 100644 index 31d626191..000000000 --- a/web/template/login.tmpl +++ /dev/null @@ -1,28 +0,0 @@ -{{- /* -// GoToSocial -// Copyright (C) GoToSocial Authors admin@gotosocial.org -// SPDX-License-Identifier: AGPL-3.0-or-later -// -// This program is free software: you can redistribute it and/or modify -// it under the terms of the GNU Affero General Public License as published by -// the Free Software Foundation, either version 3 of the License, or -// (at your option) any later version. -// -// This program is distributed in the hope that it will be useful, -// but WITHOUT ANY WARRANTY; without even the implied warranty of -// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the -// GNU Affero General Public License for more details. -// -// You should have received a copy of the GNU Affero General Public License -// along with this program. If not, see . -*/ -}} - -
-
-

- Looking to configure your profile and other settings? -

- Settings -
- {{- include "index_apps.tmpl" . | indent 1 }} -
diff --git a/web/template/login_info.tmpl b/web/template/login_info.tmpl new file mode 100644 index 000000000..a9dd7f4a0 --- /dev/null +++ b/web/template/login_info.tmpl @@ -0,0 +1,155 @@ +{{- /* +// GoToSocial +// Copyright (C) GoToSocial Authors admin@gotosocial.org +// SPDX-License-Identifier: AGPL-3.0-or-later +// +// This program is free software: you can redistribute it and/or modify +// it under the terms of the GNU Affero General Public License as published by +// the Free Software Foundation, either version 3 of the License, or +// (at your option) any later version. +// +// This program is distributed in the hope that it will be useful, +// but WITHOUT ANY WARRANTY; without even the implied warranty of +// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the +// GNU Affero General Public License for more details. +// +// You should have received a copy of the GNU Affero General Public License +// along with this program. If not, see . +*/ -}} + +
+
+

+ Looking to configure your profile and other settings? +

+ + Settings + +
+
+

Client applications

+
+

+ Want to log in and start posting? + Unlike other ActivityPub softwares, GoToSocial does not provide its own + webclient. Instead it implements the Mastodon client API, so you can use + a variety of third-party clients to log in to your account here: +

+
    +
  • +
    +

    Pinafore is a web client designed for speed and simplicity.

    + + Use Pinafore + +
    + +
    • +
  • +
    +

    Tusky is a lightweight mobile client for Android.

    + + Get Tusky + +
    + +
    • +
  • +
    +

    Feditext (beta) is a beautiful client for iOS, iPadOS and macOS.

    + + Get Feditext + +
    + +
    • +
  • +
    +

    + Masto-FE (🦥 flavour) is an (experimental!) client based on + the Mastodon Glitch web frontend, with some small changes specific to GoToSocial. +

    + + Try Masto-FE (🦥 flavour) + +
    + +
    • +
  • +
    +

    Or try one of the Mastodon clients listed on the official Mastodon page.

    + + Browse Mastodon apps + +
    + +
    • +
+
+
+