doesnm/JabberCard
1
0
Fork 0
Code Issues 15 Pull requests Projects Releases Packages Wiki Activity Actions

CSS : Improve the design of the graphics container;

Browse source 
CSS    : Improve the design of actions bar;
Python : Add multiple actions (URI Query Types).
This commit is contained in:
Schimon Jehudah, Adv. 2024-10-09 23:07:16 +03:00
parent 9668ade606
commit 43f285e008
7 changed files with 99 additions and 37 deletions
Download patch file Download diff file Expand all files Collapse all files

81
css/stylesheet.css
View file

@ -84,7 +84,7 @@ input:not(
}
label,
#action,
#action > a,
#exception,
#xmpp-uri,
#preview {
@ -101,7 +101,14 @@ label,
/* padding-bottom: 1em; */
}
#action,
#action > a {
display: inline-block;
font-size: 1.2em;
min-width: 90px;
padding: 0.5em;
width: 15%;
}
#download,
#input {
border-radius: 26px;
@ -109,17 +116,21 @@ label,
padding: 0.5em;
}
#action {
margin-bottom: 1em;
}
#action,
#input {
background: #13b5ea; /* #002b5c */
}
#action:hover,
#action > a:hover,
#input:hover {
background: #1b3967;
}
#action,
#action > a,
#download,
#download-narrow,
#input {
@ -181,12 +192,16 @@ h1 {
}
*/
#graphics,
#photo {
border-radius: 50px;
}
#graphics {
background: #f2f2f2;
border: 1px solid #c0c0c0;
border-radius: 50px;
margin: auto;
max-width: 80%;
max-width: 560px; /* 80% */
padding: 15px;
width: 40em;
}
@ -217,6 +232,11 @@ h3, h4, h5 {
padding-right: 2em;
}
#container-of-profile {
/* margin: auto; */
padding-bottom: 0.5em;
}
#profile {
background: #f5f5f5;
border-radius: 30px;
@ -346,11 +366,6 @@ h3, h4, h5 {
filter: drop-shadow(2px 4px 6px grey); /* TODO Reverse color */
}
#message {
background: #fbfbfe;
}
#message,
#note {
color: #2b2a33;
}
@ -386,7 +401,7 @@ h3, h4, h5 {
}
*/
@media (max-width: 870px) {
@media (max-width: 885px) {
h1 {
margin-bottom: 1em;
@ -405,11 +420,16 @@ h3, h4, h5 {
#photo,
#qrcode {
display: block;
border-radius: 50px;
/* border-radius: 50px; */
margin: auto;
margin-bottom: 2.5em;
}
#qrcode {
outline: solid;
outline-color: #333;
}
}
@media (max-width: 725px) {
@ -437,6 +457,10 @@ h3, h4, h5 {
display: unset;
}
#container-of-profile {
padding-bottom: unset;
}
#profile {
border-radius: unset;
filter: unset;
@ -448,6 +472,24 @@ h3, h4, h5 {
width: unset;
}
#action {
background: unset;
}
#action > a {
background: #13b5ea; /* #002b5c */
}
#action > a:first-child {
border-bottom-left-radius: 2em;
border-top-left-radius: 2em;
}
#action > a:last-child {
border-bottom-right-radius: 2em;
border-top-right-radius: 2em;
}
#note {
display: block;
font-weight: unset;
@ -477,3 +519,16 @@ h3, h4, h5 {
}
}
@media (max-width: 572px) {
#action > a:nth-child(2) {
border-bottom-right-radius: 2em;
border-top-right-radius: 2em;
}
#action > a:nth-child(3) {
display: none;
}
}