Theme update
#553
Integrado
elegaanz
integrou 21 cometimento(s) do ramo theme-update
no ramo master
há 5 anos
Revisores
Solicitar revisão
Sem revisores
Rótulos
Retirar rótulos
Related to the REST API
Code running on the server
Stuff related to Federation
Related to the front-end
Translations, and related code
More about project management or code than the project itself
The building, or installation process of Plume
Something isn't working
We need to talk
New feature or request
This is a new feature
Compatibility with different browsers, readers and OS
Related to an external package that Plume uses
UI/UX related issues and PRs
Good for newcomers
Extra attention is needed
Issues affecting only mobile UX
How elements're rendered out for the end user
Something else needs to be fixed first
This issue or pull request already exists
This PR is not complete yet
Issues concern a limited number of instances
This doesn't seem right
Need to be discussed by the community (on Loomio)
This PR is ready to be reviewed
Proposed ideas worth considering
This is issue has been created after a vote on Loomio
This will not be worked on
Aplicar rótulos
A: API
Related to the REST API
A: Backend
Code running on the server
A: Federation
Stuff related to Federation
A: Front-End
Related to the front-end
A: I18N
Translations, and related code
A: Meta
More about project management or code than the project itself
A: Security
Build
The building, or installation process of Plume
C: Bug
Something isn't working
C: Discussion
We need to talk
C: Enhancement
New feature or request
C: Feature
This is a new feature
Compatibility
Compatibility with different browsers, readers and OS
Dependency
Related to an external package that Plume uses
Design
UI/UX related issues and PRs
Documentation
Good first issue
Good for newcomers
Help welcome
Extra attention is needed
Mobile
Issues affecting only mobile UX
Rendering
How elements're rendered out for the end user
S: Blocked
Something else needs to be fixed first
S: Duplicate
This issue or pull request already exists
S: Incomplete
This PR is not complete yet
S: Instance specific
Issues concern a limited number of instances
S: Invalid
This doesn't seem right
S: Needs Voting/Discussion
Need to be discussed by the community (on Loomio)
S: Ready for review
This PR is ready to be reviewed
Suggestion
Proposed ideas worth considering
S: Voted on Loomio
This is issue has been created after a vote on Loomio
S: Wontfix
This will not be worked on
Sem rótulo
A: API
A: Backend
A: Federation
A: Front-End
A: I18N
A: Meta
A: Security
Build
C: Bug
C: Discussion
C: Enhancement
C: Feature
Compatibility
Dependency
Design
Documentation
Good first issue
Help welcome
Mobile
Rendering
S: Blocked
S: Duplicate
S: Incomplete
S: Instance specific
S: Invalid
S: Needs Voting/Discussion
S: Ready for review
Suggestion
S: Voted on Loomio
S: Wontfix
Etapa
Definir etapa
Limpar etapa
Sem itens
Sem etapa
Encarregados
Definir encarregados
Retirar todos os encarregados
Sem encarregados
2 Participantes
Notificações
Data de vencimento
A data de vencimento é inválida ou está fora do intervalo permitido. Por favor, use o formato 'aaaa-mm-dd'.
Sem data de vencimento definida.
Dependências
Não estão definidas dependências.
Referência: Plume/Plume#553
Criar uma nova questão referindo esta
Ainda não há conteúdo.
Eliminar o ramo 'theme-update'
Eliminar um ramo é algo permanente. NÃO PODERÁ ser revertido. Quer continuar?
Não
Sim
So far:
As I started it, this redesign is not perfectly following what was done on Figma (for instance lighter colors were not planned), but I'm open to discussion if you think Figma mockups should be better respected.
It is available at https://pr-553.joinplu.me/ if you want to see how it looks like. You can login with admin/admin123 to see all the pages.
Codecov Report
Perhaps
main article
's max-width should be a bit wider?40rem
is quite narrow. Optimal readability would suggest making it somewhere between 45-75 characters, which can be represented by thech
unit in CSS. So I would propose perhaps making the rulemax-width: 70ch
instead ofmax-width: 40rem
Also the
main header
andmain header > img
are way too tall, and should each have a max-height of no more thancalc(100vh - $heightOfBodyHeader)
-- this allows the header to not be bigger than the browser viewport.So… I tried to limit the height of the illustration, but it is impossible to do it without losing the ratio or a part of the image. I don't know what should be done: hide some a portion of the illustration if it is too big, or give the responsibility to author to provide images in reasonable dimensions?
Someone also proposed to have an option that could be enabled to limit the height of the header (by hiding some of the image) if you want to be sure to never have giant images. So that can be a solution too.
I think fitting is better than cropping. You can either accept the ratio loss inherent to cover-fit, or you can cap the max-width of the image/header (in addition to the max-height). That style of header image can be seen in Ghost, for example: https://demo.ghost.io/welcome/
This is a great change. I only propose changing the main purple color of links from the current hex code of
#7765E3
to something like#887ADE
,#8D80DE
, or perhaps#9784CB
, because on very light backgrounds, it's very hard to see, as shown bellow:@marek-lach Even with another shade of purple the contrast was quite poor, so I made it white, but with underlining when you pass your cursor over it to make you understand it is a link.
Under that we could also add the line:
display: -webkit-flex;
to ensure Safari likes it :-)According to this table Safari supports
display: flex
even without a specific prefix.Maybe under the
About this instance
link in the footer, there could also be aPrivacy policy
link. It would help to fill up the empty space there a little bit.As per what the `Privacy policy' page itself could contain, just basic stuff could be something like:
If you are browsing this site as a visitor, your IP address is collected by the server for moderation purposes.
As a registered user, you also have to provide your username (which does not have to be your real name), your functional email address and a password, in order to be able to log in, write articles and comment. The content you submit is stored until you delete it.
I added it. I just changed a bit your text, because we don't actually collect IP addresses, and I added a part about which cookies we are using.
Sure 👍
In that case the line As a registered user, you also have to provide your username, doesn't need the
also
in it.I think this should be a default privacy policy only, and should be editable easily by admins (probably in a future pr, this one is supposed to be about design). While we don't store much (no ip, no cookies when not logged in...), most reverse proxy configuration will log at least user ip.
this would require fixing merge conflict before validation
@ -45,0 +46,4 @@
println!("cargo:rerun-if-changed=static/css/_global.scss");
println!("cargo:rerun-if-changed=static/css/_header.scss");
println!("cargo:rerun-if-changed=static/css/_variables.scss");
println!("cargo:rerun-if-changed=static/css/main.scss");
Watching the whole directory (first rerun-if-changed, was there before) is pretty much useless as it is platform dependent, and on our main target (linux) apply basically on file creation/deletion inside, it could be removed
what should it be changed to?
this value might be a bit too close to actual white : pages that are mainly forms (creating article, editing profile, or even logging in) look odd in my opinion. I've tried with
F8F8F8
, and I think it looks better so to contrast withFFFFFF
inside input elementsI think I introduced a variable for that value, but maybe I didn't?
👍
(I just merged master into this to fix conflict)
Revisores
ad3a8b92d1
.Passo 1:
No seu repositório, crie um novo ramo e teste as modificações.Passo 2:
Integre as modificações e envie para o Forgejo.