You are here

userloginbar.css in UserLoginBar 8

Same filename and directory in other branches
  1. 5 userloginbar.css
  2. 7 userloginbar.css
/*
by default, the default form adds some surrounding space, this cancels it
*/
.content div.form-item,
.content div.content {
  margin: 0; padding: 0;
}

/*
this adds some space in top and bottom, so anything inside can look vertically
centered
*/
#user-login-form {
  width:700px;
  position: absolute;
  /*top: 0;*/
  float: left;
  right: 0
}

/*
by default, fields labels tries to reserve a whole line for itself, this
cancels that and and sends it to the left.
it also adds some space on the right and left of the label to look easy on
the eye.
*/
#user-login-form label {
  float: left;
  margin: 5px 5px 0 10px;
}

/*
inputs too, they try to reserve a whole line for itself, this
cancels that and sends it to the left
*/
#user-login-form input {
  float: left;
}

/*
I don't like the required * (asterisks), so I hide them.
*/
#user-login-form span.form-required {
  display: none;
}
/*.region-header .block .content {
    display: -moz-box;
    display: -webkit-box;
    margin: 0;
    padding: 0;
}*/
/*
Add some space at top.
*/
#user-login-form div.item-list ul{
  margin-top: -5px;
}

/*
Make right align welcome back message
*/
#user-login-form div.item-list ul.welcome-box{
  margin-top: 0;
  float: right;
}

/*
the form submit button,
*/
#user-login-form input.form-submit {
  margin-top: -7px;
  margin-left: 10px;
  border:1px solid #999;
}

/*
remember, stylign above was for the whole list, now for each item,
we all know each item in the list by default exists on a separate line, also
has that bullet on the left. we cancel all that. and makes all items sit beside
each other
*/
#user-login-form div.item-list ul li {
 /* list-style:none;*/
  display:inline;
  
 list-style-position: initial;

}

/*
this is the "Hi user, welcome back message".
by default <p> tries to exist on a separate line, we cancel that.
also by default <p> has some surrounding space, we cancel that too, and give it
only space on the left.
*/
#user-login-form p.user-info {
  float: left;
  margin: 0;
  padding: 0;
  text-align: right;
  width: 83%;
}
#page-wrapper .region-header
{
border: none;
}

#block-userloginbarblock  .item-list ul li {
    display: inline;
   
}
#block-userloginbarblock .user-info
{
float: left;
}
#block-userloginbarblock .user-login-form .item-list
{
float: left;
}
#block-userloginbarblock .item-list
{
float: right;
}
#block-userloginbarblock  .content
{
	width: 100%;
}

File

userloginbar.css
View source
  1. /*
  2. by default, the default form adds some surrounding space, this cancels it
  3. */
  4. .content div.form-item,
  5. .content div.content {
  6. margin: 0; padding: 0;
  7. }
  8. /*
  9. this adds some space in top and bottom, so anything inside can look vertically
  10. centered
  11. */
  12. #user-login-form {
  13. width:700px;
  14. position: absolute;
  15. /*top: 0;*/
  16. float: left;
  17. right: 0
  18. }
  19. /*
  20. by default, fields labels tries to reserve a whole line for itself, this
  21. cancels that and and sends it to the left.
  22. it also adds some space on the right and left of the label to look easy on
  23. the eye.
  24. */
  25. #user-login-form label {
  26. float: left;
  27. margin: 5px 5px 0 10px;
  28. }
  29. /*
  30. inputs too, they try to reserve a whole line for itself, this
  31. cancels that and sends it to the left
  32. */
  33. #user-login-form input {
  34. float: left;
  35. }
  36. /*
  37. I don't like the required * (asterisks), so I hide them.
  38. */
  39. #user-login-form span.form-required {
  40. display: none;
  41. }
  42. /*.region-header .block .content {
  43. display: -moz-box;
  44. display: -webkit-box;
  45. margin: 0;
  46. padding: 0;
  47. }*/
  48. /*
  49. Add some space at top.
  50. */
  51. #user-login-form div.item-list ul{
  52. margin-top: -5px;
  53. }
  54. /*
  55. Make right align welcome back message
  56. */
  57. #user-login-form div.item-list ul.welcome-box{
  58. margin-top: 0;
  59. float: right;
  60. }
  61. /*
  62. the form submit button,
  63. */
  64. #user-login-form input.form-submit {
  65. margin-top: -7px;
  66. margin-left: 10px;
  67. border:1px solid #999;
  68. }
  69. /*
  70. remember, stylign above was for the whole list, now for each item,
  71. we all know each item in the list by default exists on a separate line, also
  72. has that bullet on the left. we cancel all that. and makes all items sit beside
  73. each other
  74. */
  75. #user-login-form div.item-list ul li {
  76. /* list-style:none;*/
  77. display:inline;
  78. list-style-position: initial;
  79. }
  80. /*
  81. this is the "Hi user, welcome back message".
  82. by default

    tries to exist on a separate line, we cancel that.

  83. also by default

    has some surrounding space, we cancel that too, and give it

  84. only space on the left.
  85. */
  86. #user-login-form p.user-info {
  87. float: left;
  88. margin: 0;
  89. padding: 0;
  90. text-align: right;
  91. width: 83%;
  92. }
  93. #page-wrapper .region-header
  94. {
  95. border: none;
  96. }
  97. #block-userloginbarblock .item-list ul li {
  98. display: inline;
  99. }
  100. #block-userloginbarblock .user-info
  101. {
  102. float: left;
  103. }
  104. #block-userloginbarblock .user-login-form .item-list
  105. {
  106. float: left;
  107. }
  108. #block-userloginbarblock .item-list
  109. {
  110. float: right;
  111. }
  112. #block-userloginbarblock .content
  113. {
  114. width: 100%;
  115. }